feat(app): improve payment and paywall UX

src/app/auth/components/auth-back-button.module.css

@@ -1,29 +0,0 @@
-.backButton {
-  position: absolute;
-  top: var(--spacing-xl);
-  left: var(--spacing-xl);
-  z-index: 2;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: var(--auth-back-button-size);
-  height: var(--auth-back-button-size);
-  padding: 0 2px 0 0;
-  color: var(--color-auth-text-primary);
-  cursor: pointer;
-  background: var(--color-auth-surface);
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  transition:
-    background 0.15s ease,
-    transform 0.05s ease;
-}
-
-.backButton:hover {
-  background: rgba(0, 0, 0, 0.04);
-}
-
-.backButton:active {
-  transform: scale(0.96);
-}

src/app/auth/components/auth-back-button.tsx

@@ -1,22 +0,0 @@
-"use client";
-
-import { ChevronLeft } from "lucide-react";
-
-import styles from "./auth-back-button.module.css";
-
-export interface AuthBackButtonProps {
-  onClick: () => void;
-}
-
-export function AuthBackButton({ onClick }: AuthBackButtonProps) {
-  return (
-    <button
-      type="button"
-      className={styles.backButton}
-      onClick={onClick}
-      aria-label="Back"
-    >
-      <ChevronLeft size={20} strokeWidth={2.5} aria-hidden="true" />
-    </button>
-  );
-}

src/app/auth/components/auth-panel.tsx

@@ -4,9 +4,9 @@
  */
 import { useRouter } from "next/navigation";
 
+import { BackButton } from "@/app/_components";
 import { useAuthDispatch, useAuthState } from "@/stores/auth/auth-context";
 
-import { AuthBackButton } from "./auth-back-button";
 import { AuthEmailPanel } from "./auth-email-panel";
 import { AuthFacebookPanel } from "./auth-facebook-panel";
 import styles from "./auth-panel.module.css";
@@ -31,7 +31,7 @@ export function AuthPanel() {
 
   return (
     <div className={styles.panelShell}>
-      <AuthBackButton onClick={handleBack} />
+      <BackButton onClick={handleBack} />
 
       {state.authPanelMode === "facebook" ? (
         <AuthFacebookPanel onSwitchToEmail={switchToEmail} />

src/app/auth/components/index.ts

@@ -3,7 +3,6 @@
  */
 
 export * from "./auth-background";
-export * from "./auth-back-button";
 export * from "./auth-divider";
 export * from "./auth-email-panel";
 export * from "./auth-error-message";