fix(auth): reduce mobile sign-in friction (PWA + auto-redirect)

Three independent changes that together stop the mobile re-auth churn:

- app/layout.tsx: add appleWebApp metadata so iOS "Add to Home Screen"
  launches Pulse in true standalone mode (own cookie jar, persists
  across Safari memory pressure)
- components/auth/sign-in-form.tsx: when /auth/sign-in mounts and
  ?callbackUrl starts with /mobile, auto-call authClient.signIn.social
  for Microsoft. With an active M365 browser session this redirect is
  silent — the user lands on /mobile/* with no tap.
- app/auth/sign-in/page.tsx: wrap SignInForm in <Suspense> (required
  by Next.js 16 because SignInForm now uses useSearchParams)

Pairs with operator-side env bump SESSION_TIMEOUT_SECONDS=2592000
(30 days, .env files are gitignored — applied on the running container
via docker compose up -d --force-recreate app).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

app/auth/sign-in/page.tsx

@@ -1,3 +1,4 @@
+import { Suspense } from "react";
 import { SignInForm } from "@/components/auth/sign-in-form";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 
@@ -16,7 +17,9 @@ export default function SignInPage() {
         </CardDescription>
       </CardHeader>
       <CardContent>
+        <Suspense fallback={null}>
           <SignInForm />
+        </Suspense>
       </CardContent>
     </Card>
   );

app/layout.tsx

@@ -37,6 +37,11 @@ export const metadata: Metadata = {
     shortcut: "/favicon.png",
     apple: "/wulff-logo.png",
   },
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: "default",
+    title: "Pulse",
+  },
 };
 
 export const viewport: Viewport = {

components/auth/sign-in-form.tsx

@@ -1,16 +1,44 @@
 "use client";
 
+import { useEffect, useRef, useState } from "react";
+import { useSearchParams } from "next/navigation";
+import { Loader2 } from "lucide-react";
+import { authClient } from "@/lib/auth-client";
 import { MagicLinkForm } from "./magic-link-form";
 import { MicrosoftButton } from "./microsoft-button";
 import { Separator } from "@/components/ui/separator";
 
 export function SignInForm() {
+  const searchParams = useSearchParams();
+  const callbackUrl = searchParams.get("callbackUrl") || "/";
+  const isMobileFlow = callbackUrl.startsWith("/mobile");
+  const [autoRedirecting, setAutoRedirecting] = useState(isMobileFlow);
+  const triggered = useRef(false);
+
+  useEffect(() => {
+    if (!isMobileFlow || triggered.current) return;
+    triggered.current = true;
+    authClient.signIn
+      .social({ provider: "microsoft", callbackURL: callbackUrl })
+      .then((result) => {
+        if (result?.error) setAutoRedirecting(false);
+      })
+      .catch(() => setAutoRedirecting(false));
+  }, [isMobileFlow, callbackUrl]);
+
+  if (autoRedirecting) {
+    return (
+      <div className="flex flex-col items-center gap-3 py-8">
+        <Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
+        <p className="text-sm text-muted-foreground">Signing you in with Microsoft 365…</p>
+      </div>
+    );
+  }
+
   return (
     <div className="space-y-6">
-      {/* Microsoft OAuth */}
-      <MicrosoftButton />
+      <MicrosoftButton callbackURL={callbackUrl} />
 
-      {/* Divider */}
       <div className="relative">
         <div className="absolute inset-0 flex items-center">
           <Separator className="w-full" />
@@ -22,7 +50,6 @@ export function SignInForm() {
         </div>
       </div>
 
-      {/* Magic Link */}
       <MagicLinkForm />
     </div>
   );