Add Authentik sign-in, fix tab scroll insets, and polish multi-account auth.

Mobile app detects SSO per server, supports OAuth sign-in, and preserves saved
sessions when adding accounts. Tab screens get proper chrome layout and tab-bar
clearance with scrollable page headers.

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

app/(app)/_layout.tsx

@@ -31,7 +31,7 @@ export default function AppLayout() {
         disableTransparentOnScrollEdge
         backgroundColor={Platform.OS === "android" ? colors.background : undefined}
       >
-        <NativeTabs.Trigger name="index" disableAutomaticContentInsets contentStyle={tabContentStyle}>
+        <NativeTabs.Trigger name="index" contentStyle={tabContentStyle} disableAutomaticContentInsets>
           <NativeTabs.Trigger.Icon
             sf={{ default: "square.grid.2x2", selected: "square.grid.2x2.fill" }}
             md="grid_view"
@@ -39,7 +39,7 @@ export default function AppLayout() {
           <NativeTabs.Trigger.Label>Dashboard</NativeTabs.Trigger.Label>
         </NativeTabs.Trigger>
 
-        <NativeTabs.Trigger name="timer" disableAutomaticContentInsets contentStyle={tabContentStyle}>
+        <NativeTabs.Trigger name="timer" contentStyle={tabContentStyle} disableAutomaticContentInsets>
           <NativeTabs.Trigger.Icon
             sf={{ default: "timer", selected: "timer" }}
             md="timer"
@@ -47,7 +47,7 @@ export default function AppLayout() {
           <NativeTabs.Trigger.Label>Timer</NativeTabs.Trigger.Label>
         </NativeTabs.Trigger>
 
-        <NativeTabs.Trigger name="entities" disableAutomaticContentInsets contentStyle={tabContentStyle}>
+        <NativeTabs.Trigger name="entities" contentStyle={tabContentStyle} disableAutomaticContentInsets>
           <NativeTabs.Trigger.Icon
             sf={{ default: "square.stack.3d.up", selected: "square.stack.3d.up.fill" }}
             md="corporate_fare"
@@ -55,7 +55,7 @@ export default function AppLayout() {
           <NativeTabs.Trigger.Label>Entities</NativeTabs.Trigger.Label>
         </NativeTabs.Trigger>
 
-        <NativeTabs.Trigger name="invoices" disableAutomaticContentInsets contentStyle={tabContentStyle}>
+        <NativeTabs.Trigger name="invoices" contentStyle={tabContentStyle} disableAutomaticContentInsets>
           <NativeTabs.Trigger.Icon
             sf={{ default: "doc.text", selected: "doc.text.fill" }}
             md="description"
@@ -63,7 +63,7 @@ export default function AppLayout() {
           <NativeTabs.Trigger.Label>Invoices</NativeTabs.Trigger.Label>
         </NativeTabs.Trigger>
 
-        <NativeTabs.Trigger name="settings" disableAutomaticContentInsets contentStyle={tabContentStyle}>
+        <NativeTabs.Trigger name="settings" contentStyle={tabContentStyle} disableAutomaticContentInsets>
           <NativeTabs.Trigger.Icon
             sf={{ default: "gearshape", selected: "gearshape.fill" }}
             md="settings"

app/(app)/settings.tsx

@@ -18,6 +18,7 @@ import { useAccounts } from "@/contexts/AccountsContext";
 import { useAppLock } from "@/contexts/AppLockContext";
 import { useAuthClient, useSession } from "@/contexts/AuthContext";
 import { type ColorMode, useAppTheme } from "@/contexts/ThemeContext";
+import { startAdditionalAccountSignIn } from "@/lib/add-account";
 import { api } from "@/lib/trpc";
 
 const THEME_OPTIONS: { value: ColorMode; label: string }[] = [
@@ -251,11 +252,7 @@ export default function SettingsScreen() {
             <Button
               title="Add another account"
               variant="secondary"
-              onPress={async () => {
-                await authClient.signOut();
-                await clearActiveAccount();
-                router.replace("/(auth)/sign-in");
-              }}
+              onPress={() => void startAdditionalAccountSignIn(clearActiveAccount)}
             />
             {accounts.length > 1 ? (
               <Text style={[styles.meta, { color: colors.mutedForeground }]}>
@@ -336,6 +333,19 @@ export default function SettingsScreen() {
             </View>
           </Card>
 
+          <Card title="App">
+            <View style={styles.appRow}>
+              <Text style={[styles.meta, { color: colors.mutedForeground }]}>Version</Text>
+              <Text style={[styles.appValue, { color: colors.foreground }]}>{appVersion}</Text>
+            </View>
+            <View style={styles.appRow}>
+              <Text style={[styles.meta, { color: colors.mutedForeground }]}>Platform</Text>
+              <Text style={[styles.appValue, { color: colors.foreground }]}>
+                {Constants.platform?.ios ? "iOS" : "Other"}
+              </Text>
+            </View>
+          </Card>
+
           <Pressable
             accessibilityRole="button"
             accessibilityState={{ expanded: showAdvanced }}
@@ -359,19 +369,6 @@ export default function SettingsScreen() {
             </Card>
           ) : null}
 
-          <Card title="App">
-            <View style={styles.appRow}>
-              <Text style={[styles.meta, { color: colors.mutedForeground }]}>Version</Text>
-              <Text style={[styles.appValue, { color: colors.foreground }]}>{appVersion}</Text>
-            </View>
-            <View style={styles.appRow}>
-              <Text style={[styles.meta, { color: colors.mutedForeground }]}>Platform</Text>
-              <Text style={[styles.appValue, { color: colors.foreground }]}>
-                {Constants.platform?.ios ? "iOS" : "Other"}
-              </Text>
-            </View>
-          </Card>
-
           <View style={styles.actions}>
             <Button title="Sign Out" variant="danger" onPress={confirmSignOut} />
           </View>