feat(ui): migrate Flutter UI library to Next.js 16 (App Router)

Migrate all 87 Dart files from /Users/chase/Documents/cozsweet/lib/ui/
to TypeScript React components, replacing Flutter-native features with
Web equivalents and reimplementing the BLoC pattern with React
Context + useReducer.

Highlights
- 1:1 BLoC -> Context+useReducer+side-effects mapping for auth, chat,
  user, and sidebar features (4 providers wired in root-providers.tsx)
- 500px MobileShell primitive eliminates per-screen layout boilerplate
- Headless Dialog primitive (createPortal + ESC + scroll lock) powers
  quota / pwa-install / username / pronouns / subscription / other-options
  dialogs
- New integrations/: facebook-sdk, google-identity, pwa-install,
  media-recorder (Web Speech API + MediaRecorder), browser-detect,
  chat-websocket (singleton), message-queue (throttled send)
- CSS Modules + existing design tokens (no new styling system);
  extended with breakpoints.css and dimensions.css
- Custom hooks: useBreakpoint (useSyncExternalStore),
  useFullVisibility (IntersectionObserver), usePwaInstall,
  usePullToRefresh
- Vitest + jsdom; 15 unit tests (chat-reducer, auth-validators)
- React 19.2.4, Next.js 16.2.7, Zod 4, lottie-react, classnames

Workarounds
- next.config.ts: experimental.staticGenerationRetryCount = 0 to
  bypass Next.js 16.2.7 /_global-error workStore prerender bug
- src/app/global-error.tsx: required Client Component
- src/types/globals.d.ts: centralized window.google / FB /
  SpeechRecognition declarations

Routes (/, /splash, /auth, /chat, /chat/deviceid/[deviceId],
/sidebar) all build and lint clean.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/app/auth/page.tsx

@@ -1,84 +1,7 @@
 "use client";
 
-/**
- * Auth 页（路由骨架版）
- *
- * 对齐 Flutter `lib/ui/auth/auth_screen.dart` 的语义：
- *   - 已登录用户：自动跳 `/chat`
- *   - 未登录：渲染返回 splash + disabled 登录表单占位
- */
-
-import { useEffect } from "react";
-import Link from "next/link";
-import { useRouter } from "next/navigation";
-
-import { useAuthGate } from "@/lib/auth/use-auth-gate";
-import { ROUTES } from "@/lib/routes";
+import { AuthScreen } from "@/components/auth/auth-screen";
 
 export default function AuthPage() {
-  const router = useRouter();
-  const { isAuthed } = useAuthGate();
-
-  useEffect(() => {
-    if (isAuthed) {
-      router.replace(ROUTES.chat);
-    }
-  }, [isAuthed, router]);
-
-  if (!isAuthed) {
-    return (
-      <main
-        className="flex flex-1 flex-col items-center justify-center gap-xl p-lg"
-        style={{
-          minHeight: "100dvh",
-          background: "var(--color-page-background)",
-          color: "var(--color-text-foreground)",
-        }}
-      >
-        <h1 className="text-3xl font-semibold">Auth</h1>
-        <p
-          className="max-w-md text-center text-sm"
-          style={{ color: "var(--color-text-secondary)" }}
-        >
-          Auth placeholder · login form coming soon.
-        </p>
-
-        <div className="flex flex-col gap-md">
-          <button
-            type="button"
-            disabled
-            className="rounded-md px-xl py-sm text-sm opacity-60"
-            style={{
-              background: "var(--color-accent)",
-              color: "var(--color-text-primary)",
-              cursor: "not-allowed",
-            }}
-          >
-            Login form coming soon
-            {/* TODO: 接入 emailLogin / googleLogin / appleLogin / facebookLogin 后启用 */}
-          </button>
-          <Link
-            href={ROUTES.splash}
-            className="rounded-md border px-xl py-sm text-center text-sm"
-            style={{ borderColor: "var(--color-border)" }}
-          >
-            Back to Splash
-          </Link>
-        </div>
-      </main>
-    );
-  }
-
-  return (
-    <div
-      className="flex flex-1 items-center justify-center"
-      style={{ minHeight: "100dvh" }}
-    >
-      <div
-        aria-label="Redirecting"
-        className="size-10 animate-spin rounded-full border-4 border-t-transparent"
-        style={{ borderColor: "var(--color-accent)" }}
-      />
-    </div>
-  );
+  return <AuthScreen />;
 }