Add login screen for API token authentication

AuthGate component wraps the app layout:
- On load, checks if saved token is valid by calling a protected endpoint
- If auth not required (dev mode), passes through immediately
- If auth required and no valid token, shows a clean login screen
- Token input with password field, stored in localStorage on success
- Shows guidance: "Find your token in secrets.yaml under api.bearerToken"
- Handles connection errors gracefully (shows app anyway)

web/src/router/CentralLayout.tsx

@@ -1,6 +1,7 @@
 import { useState } from 'react';
 import { Outlet } from 'react-router';
 import { AppSidebar } from '../components/AppSidebar';
+import { AuthGate } from '../components/AuthGate';
 import { SidebarProvider, SidebarInset, SidebarTrigger } from '../components/ui/sidebar';
 import { HelpProvider, useHelp } from '../contexts/HelpContext';
 import { HelpPanel } from '../components/HelpPanel';
@@ -46,16 +47,18 @@ export function CentralLayout() {
   );
 
   return (
-    <HelpProvider>
-      <SidebarProvider
-        open={sidebarOpen}
-        onOpenChange={(open) => {
-          setSidebarOpen(open);
-          localStorage.setItem('sidebar_state', String(open));
-        }}
-      >
-        <CentralLayoutContent />
-      </SidebarProvider>
-    </HelpProvider>
+    <AuthGate>
+      <HelpProvider>
+        <SidebarProvider
+          open={sidebarOpen}
+          onOpenChange={(open) => {
+            setSidebarOpen(open);
+            localStorage.setItem('sidebar_state', String(open));
+          }}
+        >
+          <CentralLayoutContent />
+        </SidebarProvider>
+      </HelpProvider>
+    </AuthGate>
   );
 }