feat(app): improve payment and paywall UX

src/app/_components/back-button.tsx

@@ -0,0 +1,28 @@
+"use client";
+
+import { ChevronLeft } from "lucide-react";
+
+import styles from "./back-button.module.css";
+
+export interface BackButtonProps {
+  onClick: () => void;
+  className?: string;
+  ariaLabel?: string;
+}
+
+export function BackButton({
+  onClick,
+  className,
+  ariaLabel = "Back",
+}: BackButtonProps) {
+  return (
+    <button
+      type="button"
+      className={[styles.backButton, className].filter(Boolean).join(" ")}
+      onClick={onClick}
+      aria-label={ariaLabel}
+    >
+      <ChevronLeft size={20} strokeWidth={2.5} aria-hidden="true" />
+    </button>
+  );
+}