Fix Live Activity lock screen rendering and polish multi-account auth.

Flatten widget layouts and use system colors so banner and expanded regions render on vibrant lock screens; migrate auth sessions per account to prevent double sign-in; scope app lock PIN to accounts; default clock description to "Clock In"; add architecture docs and deferred form validation on auth screens.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/(auth)/forgot-password.tsx

@@ -11,6 +11,7 @@ import {
 } from "react-native";
 import { FullScreen } from "@/components/Screen";
 import { AuthBackground } from "@/components/AppBackground";
+import { AuthServerPicker } from "@/components/AuthServerPicker";
 import { HeadingText, Logo } from "@/components/Logo";
 import { Button } from "@/components/ui/Button";
 import { Card } from "@/components/ui/Card";
@@ -18,6 +19,7 @@ import { Input } from "@/components/ui/Input";
 import { fonts, spacing } from "@/constants/theme";
 import { useAppTheme } from "@/contexts/ThemeContext";
 import { requestPasswordReset } from "@/lib/auth-api";
+import { isValidEmail, useFieldVisibility } from "@/lib/form-validation";
 
 export default function ForgotPasswordScreen() {
   const { colors } = useAppTheme();
@@ -25,8 +27,19 @@ export default function ForgotPasswordScreen() {
   const [message, setMessage] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
+  const [serverReady, setServerReady] = useState(true);
+  const { touch, visible, markSubmitted } = useFieldVisibility();
+
+  const emailValidationError = !email.trim()
+    ? "Email is required"
+    : isValidEmail(email)
+      ? undefined
+      : "Enter a valid email";
+  const canSubmit = isValidEmail(email) && serverReady;
 
   async function handleSubmit() {
+    markSubmitted();
+    if (!canSubmit) return;
     setError(null);
     setMessage(null);
     setLoading(true);
@@ -53,6 +66,8 @@ export default function ForgotPasswordScreen() {
               <Text style={[styles.back, { color: colors.mutedForeground }]}>← Back</Text>
             </Pressable>
 
+            <AuthServerPicker onReadyChange={setServerReady} />
+
             <Card style={styles.card}>
               <View style={styles.header}>
                 <Logo size="md" />
@@ -70,7 +85,10 @@ export default function ForgotPasswordScreen() {
                   keyboardType="email-address"
                   value={email}
                   onChangeText={setEmail}
+                  onBlur={() => touch("email")}
                   placeholder="you@example.com"
+                  required
+                  error={visible("email") ? emailValidationError : undefined}
                 />
 
                 {error ? (
@@ -80,7 +98,12 @@ export default function ForgotPasswordScreen() {
                   <Text style={[styles.success, { color: colors.foreground }]}>{message}</Text>
                 ) : null}
 
-                <Button title="Send reset link" loading={loading} onPress={handleSubmit} />
+                <Button
+                  title="Send reset link"
+                  loading={loading}
+                  disabled={!canSubmit}
+                  onPress={handleSubmit}
+                />
                 <Button
                   title="Have a reset token?"
                   variant="ghost"