feat(web): W3-1 login, session shell, home dashboard, settings, engine panel and audit pages

- /login: setup/login/TOTP states driven by server error codes, fixed-height error slot
- console layout: GET /auth/session gate, redirect to /login, account popover (change password, logout)
- home: six dashboard sections with SSE-driven refresh, automation switch and read-only reconcile toggle
- settings tabs: downloaders, media servers, library roots, path mappings, site credentials,
  API keys (one-time plaintext), Pi upstream, cache/organize/retention/budget, automation
- engine: runs list (status/name filters, cursor paging, stats tiles), run detail (step timeline,
  json payloads, signals, cancel)
- audit: filterable list with detail sheet
- vite: allow repo root in server.fs so deno-installed deps under node_modules/.deno load in dev

Co-Authored-By: Claude Opus 5.5 <[email protected]>

apps/web/app/routes/console/layout.tsx

@@ -1,12 +1,16 @@
-import { ChevronLeft, ChevronRight, Clapperboard, Menu } from "lucide-react";
+import type { SessionInfo } from "@umt/contracts";
+import { ChevronLeft, ChevronRight, Clapperboard, LoaderCircle, Menu } from "lucide-react";
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { Link, NavLink, Outlet, useLocation } from "react-router";
-import { ApiKeyDialog } from "~/components/console/api-key-dialog.tsx";
+import { useSession } from "~/api/auth.ts";
+import { AccountMenu } from "~/components/console/account-menu.tsx";
+import { ErrorState } from "~/components/console/empty-state.tsx";
 import { CONSOLE_BASE, findNavItem, NAV_GROUPS, NAV_ITEMS, type NavGroup } from "~/components/console/nav.ts";
 import PrismLeak from "~/components/prism-leak.tsx";
 import { ThemeToggle } from "~/components/theme-toggle.tsx";
 import { Button } from "~/components/ui/button.tsx";
 import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from "~/components/ui/sheet.tsx";
+import { redirectToLogin } from "~/lib/api.ts";
 import { cn } from "~/lib/utils.ts";
 
 const PORTAL_NAME = "媒体自动化";
@@ -128,7 +132,33 @@ function Brand({ collapsed = false }: { collapsed?: boolean }) {
   );
 }
 
+/** 会话探测:未登录跳登录页;探测中/失败给全屏占位 */
 export default function ConsoleLayout() {
+  const session = useSession();
+  const unauthenticated = session.data && !session.data.authenticated;
+
+  useEffect(() => {
+    if (unauthenticated) redirectToLogin();
+  }, [unauthenticated]);
+
+  if (session.isError) {
+    return (
+      <div className="grid min-h-screen place-items-center bg-background px-4">
+        <ErrorState title="无法获取登录状态" error={session.error} onRetry={() => session.refetch()} />
+      </div>
+    );
+  }
+  if (!session.data || unauthenticated) {
+    return (
+      <div className="grid min-h-screen place-items-center bg-background" role="status" aria-label="正在确认登录状态">
+        <LoaderCircle className="h-5 w-5 animate-spin text-muted-foreground" />
+      </div>
+    );
+  }
+  return <ConsoleShell session={session.data} />;
+}
+
+function ConsoleShell({ session }: { session: SessionInfo }) {
   const location = useLocation();
   const [collapsed, setCollapsed] = useState(false);
   const [sheetOpen, setSheetOpen] = useState(false);
@@ -192,8 +222,8 @@ export default function ConsoleLayout() {
             <span className="truncate text-sm font-semibold text-foreground">{activeLabel}</span>
           </div>
           <div className="ml-auto flex items-center gap-2">
-            <ApiKeyDialog />
             <ThemeToggle />
+            <AccountMenu session={session} />
           </div>
         </header>