From 4f4facae54d76883f02f6be14645e4f2a264d92c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=BF=90=E7=BB=B4=E5=B7=A5=E7=A8=8B=E5=B8=88?=
 <devops-agent@multica.local>
Date: Sun, 12 Jul 2026 20:40:17 +0800
Subject: [PATCH 1/2] =?UTF-8?q?[WS-90]=20frontend:=20Workflow=20Desk=20red?=
 =?UTF-8?q?esign=20=E2=80=94=20tokens,=20rail,=20model-only=20selector,=20?=
 =?UTF-8?q?graph=20stages?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Implements the Workflow Desk redesign per ui-designer/ui-spec.md and
ui-designer/design/implementation-plan.md (frontend-only; no backend or
OpenAPI contract changes).

- Tokens + typography: remap globals.css :root + tailwind.config.js to the
  Workflow Desk palette (ink #0a0d12, surface #171f2b, line #304154, mint
  #9bffbe action, sky-blue #8acbff flow) and add Instrument Serif / DM Mono /
  Noto Sans SC fonts. Mint/blue accent buttons now use dark ink text for
  correct contrast across all routes.
- Shell: rebuild AppNavbar as a fixed desktop research rail (248px) + slim top
  status bar + mobile drawer; reserve rail space via desktop body padding.
  Admin-only gating preserved (AppNavbar.test.tsx passes).
- Privacy boundary (WS-13/story-001): new ModelSelector exposes model display
  names only — never provider, endpoint, key state, or system-default
  provenance. AnalysisConfigForm step 5 now drives selection through it and
  drops the provider dropdown, provenance bars and inline API-key input;
  provider/backend_url/key are still resolved silently for the payload.
  ModelSelector.test.tsx proves model-name-only exposure + no-model recovery.
- Graph fidelity: new lib/workflow-stages.ts encodes the real GraphSetup
  5-band / 12-node model; AnalysisProgress rebuilt to 5 bands (Analyst Team →
  Bull/Bear debate → Research Manager → Trader → Risky/Safe/Neutral → Risk
  Judge) with Risk Judge split into its own terminal band. workflow-stages
  .test.ts asserts graph fidelity.
- State primitives: add EmptyState + ErrorState (PageLoading already existed).

Verification (web/frontend): npm run typecheck ✓, npm run test:run 42/42 ✓,
npm run build ✓ (18 routes prerendered). npm run lint: no new errors
(3 pre-existing errors in untouched files; next.config ignores eslint during
build).

Co-Authored-By: Claude <noreply@anthropic.com>
Co-authored-by: multica-agent <github@multica.ai>
---
 .../src/app/admin/llm-config/page.tsx         |   4 +-
 web/frontend/src/app/admin/users/page.tsx     |   2 +-
 web/frontend/src/app/analysis/page.tsx        |   2 +-
 web/frontend/src/app/globals.css              |  49 +-
 web/frontend/src/app/history/detail/page.tsx  |   2 +-
 web/frontend/src/app/layout.tsx               |  14 +-
 .../src/app/profile/ai-settings/page.tsx      |   2 +-
 web/frontend/src/app/profile/page.tsx         |   4 +-
 web/frontend/src/app/scheduled-tasks/page.tsx |   2 +-
 .../components/admin/ResponsiveUserCard.tsx   |   2 +-
 .../components/admin/llm-config/ModelForm.tsx |   2 +-
 .../admin/llm-config/ProviderForm.tsx         |   2 +-
 .../SystemDefaultForm.tsx                     |   4 +-
 .../analysis/AnalysisConfigForm.tsx           | 261 ++-----
 .../components/analysis/AnalysisHistory.tsx   |   2 +-
 .../components/analysis/AnalysisProgress.tsx  |  45 +-
 .../components/analysis/AnalysisResults.tsx   |   2 +-
 .../analysis/ModelSelector.test.tsx           | 108 +++
 .../src/components/analysis/ModelSelector.tsx | 133 ++++
 .../src/components/auth/LoginForm.tsx         |   8 +-
 .../src/components/common/AppNavbar.tsx       | 703 +++++++++---------
 .../src/components/conversation/Composer.tsx  |   2 +-
 .../components/conversation/LoginNudge.tsx    |   2 +-
 .../components/conversation/MessageBubble.tsx |   4 +-
 .../conversation/SessionSidebar.tsx           |   2 +-
 .../src/components/profile/AISettingsCard.tsx |   2 +-
 .../src/components/profile/LocalKeyField.tsx  |   4 +-
 .../components/profile/ProviderFormDrawer.tsx |   2 +-
 web/frontend/src/components/ui/EmptyState.tsx |  33 +
 web/frontend/src/components/ui/ErrorState.tsx |  45 ++
 web/frontend/src/lib/workflow-stages.test.ts  |  66 ++
 web/frontend/src/lib/workflow-stages.ts       | 143 ++++
 web/frontend/tailwind.config.js               |  82 +-
 33 files changed, 1080 insertions(+), 660 deletions(-)
 create mode 100644 web/frontend/src/components/analysis/ModelSelector.test.tsx
 create mode 100644 web/frontend/src/components/analysis/ModelSelector.tsx
 create mode 100644 web/frontend/src/components/ui/EmptyState.tsx
 create mode 100644 web/frontend/src/components/ui/ErrorState.tsx
 create mode 100644 web/frontend/src/lib/workflow-stages.test.ts
 create mode 100644 web/frontend/src/lib/workflow-stages.ts

diff --git a/web/frontend/src/app/admin/llm-config/page.tsx b/web/frontend/src/app/admin/llm-config/page.tsx
index 6d42a22..694402c 100644
--- a/web/frontend/src/app/admin/llm-config/page.tsx
+++ b/web/frontend/src/app/admin/llm-config/page.tsx
@@ -228,7 +228,7 @@ export default function LLMConfigPage() {
                   setEditingProvider(null);
                   setShowProviderForm(true);
                 }}
-                className="px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors"
+                className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors"
               >
                 <i className="fas fa-plus mr-2" />
                 添加供应商
@@ -261,7 +261,7 @@ export default function LLMConfigPage() {
                   setEditingModel(null);
                   setShowModelForm(true);
                 }}
-                className="px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors"
+                className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors"
               >
                 <i className="fas fa-plus mr-2" />
                 添加模型
diff --git a/web/frontend/src/app/admin/users/page.tsx b/web/frontend/src/app/admin/users/page.tsx
index 788a8d1..1ce3af7 100644
--- a/web/frontend/src/app/admin/users/page.tsx
+++ b/web/frontend/src/app/admin/users/page.tsx
@@ -377,7 +377,7 @@ export default function UserManagementPage() {
               <p className="text-text-secondary mb-4">加载失败</p>
               <button
                 onClick={() => refetch()}
-                className="px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary"
+                className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary"
               >
                 重试
               </button>
diff --git a/web/frontend/src/app/analysis/page.tsx b/web/frontend/src/app/analysis/page.tsx
index 36a08c3..71bd70e 100644
--- a/web/frontend/src/app/analysis/page.tsx
+++ b/web/frontend/src/app/analysis/page.tsx
@@ -148,7 +148,7 @@ function AnalysisDetailContent() {
       {showBackToTop && (
         <button
           onClick={scrollToTop}
-          className="fixed bottom-8 right-8 bg-gradient-to-r from-accent-primary to-accent-secondary text-white w-12 h-12 rounded-full shadow-glow-cyan hover:scale-110 transition-all duration-300 flex items-center justify-center z-50"
+          className="fixed bottom-8 right-8 bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary w-12 h-12 rounded-full shadow-glow-cyan hover:scale-110 transition-all duration-300 flex items-center justify-center z-50"
           aria-label="返回顶部"
         >
           <i className="fas fa-arrow-up text-xl" />
diff --git a/web/frontend/src/app/globals.css b/web/frontend/src/app/globals.css
index 92edf0e..78f5e9e 100644
--- a/web/frontend/src/app/globals.css
+++ b/web/frontend/src/app/globals.css
@@ -8,29 +8,36 @@
   }
   
   :root {
-    /* Dark Fintech Theme CSS Variables */
-    --bg-primary: #0a0e1a;
-    --bg-secondary: #141824;
-    --bg-tertiary: #1a1f2e;
-    --bg-elevated: #1f2937;
-    --border-default: #2d3748;
-    --accent-primary: #00d4ff;
-    --accent-secondary: #0066ff;
-    --text-primary: #ffffff;
-    --text-secondary: #a0aec0;
-    --text-tertiary: #718096;
+    /* Workflow Desk CSS Variables — kept in sync with tailwind.config.js */
+    --bg-primary: #0a0d12;     /* ink */
+    --bg-secondary: #171f2b;   /* surface */
+    --bg-tertiary: #202b39;    /* raised */
+    --bg-elevated: #27333f;    /* elevated */
+    --bg-input: #0d131b;       /* recessed inputs */
+    --bg-rail: #111720;        /* research rail */
+    --border-default: #304154; /* structural line */
+    --accent-primary: #9bffbe; /* mint */
+    --accent-secondary: #8acbff;/* sky blue */
+    --text-primary: #f1f5f7;
+    --text-secondary: #9aa9b8;
+    --text-tertiary: #68798a;
   }
-  
+
   body {
     margin: 0;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-      'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-      sans-serif;
+    font-family: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     background-color: var(--bg-primary);
     color: var(--text-primary);
   }
+
+  /* Workflow Desk focus ring for keyboard users */
+  :focus-visible {
+    outline: 3px solid var(--accent-primary);
+    outline-offset: 2px;
+    border-radius: 4px;
+  }
 }
 
 @layer components {
@@ -67,7 +74,7 @@
   }
 
   .btn-primary {
-    @apply bg-gradient-to-r from-accent-primary to-accent-secondary text-white hover:shadow-glow-cyan hover:scale-105 active:scale-95;
+    @apply bg-accent-primary text-dark-primary font-bold hover:brightness-95 hover:shadow-glow-cyan active:scale-95;
   }
 
   .btn-secondary {
@@ -84,7 +91,7 @@
 
   /* Forms */
   .form-control {
-    @apply flex h-10 w-full rounded-lg border border-dark-border bg-dark-tertiary text-white placeholder-text-tertiary px-4 py-3 text-sm focus:border-accent-primary focus:ring-2 focus:ring-accent-primary/20 transition-all duration-200;
+    @apply flex h-10 w-full rounded-lg border border-dark-border bg-[#0d131b] text-white placeholder-text-tertiary px-4 py-3 text-sm focus:border-accent-primary focus:ring-2 focus:ring-accent-primary/20 transition-all duration-200;
   }
 
   .form-label {
@@ -215,6 +222,14 @@
     padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
     touch-action: manipulation;
   }
+  /* Reserve space for the fixed desktop research rail (248px = 15.5rem).
+     The rail and top bar are position:fixed, so they are not shifted by this;
+     only in-flow page content moves right of the rail on lg+ screens. */
+  @media (min-width: 1024px) {
+    body {
+      padding-left: calc(env(safe-area-inset-left) + 15.5rem);
+    }
+  }
   /* 媒体默认自适应容器宽度 */
   img, video, canvas, svg {
     max-width: 100%;
diff --git a/web/frontend/src/app/history/detail/page.tsx b/web/frontend/src/app/history/detail/page.tsx
index a5fae29..0efb23c 100644
--- a/web/frontend/src/app/history/detail/page.tsx
+++ b/web/frontend/src/app/history/detail/page.tsx
@@ -123,7 +123,7 @@ function HistoryDetailContent() {
       {showBackToTop && (
         <button
           onClick={scrollToTop}
-          className="fixed bottom-8 right-8 bg-gradient-to-r from-accent-primary to-accent-secondary text-white w-12 h-12 rounded-full shadow-glow-cyan hover:scale-110 transition-all duration-300 flex items-center justify-center z-50"
+          className="fixed bottom-8 right-8 bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary w-12 h-12 rounded-full shadow-glow-cyan hover:scale-110 transition-all duration-300 flex items-center justify-center z-50"
           aria-label="返回顶部"
         >
           <i className="fas fa-arrow-up text-xl" />
diff --git a/web/frontend/src/app/layout.tsx b/web/frontend/src/app/layout.tsx
index f5bef25..408f64a 100644
--- a/web/frontend/src/app/layout.tsx
+++ b/web/frontend/src/app/layout.tsx
@@ -3,8 +3,8 @@ import './globals.css';
 import { Providers } from './providers';
 
 export const metadata: Metadata = {
-  title: 'TradingAgentsWeb - 多智能体大语言模型金融交易框架',
-  description: '基于多智能体LLM的金融交易分析系统',
+  title: 'TradingAgents · Workflow Desk',
+  description: '基于 TradingAgents 多智能体研究图的现代化分析工作台',
 };
 
 export default function RootLayout({
@@ -16,18 +16,24 @@ export default function RootLayout({
     <html lang="zh-CN">
       <head>
         <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover" />
-        <meta name="theme-color" content="#0a0e1a" />
+        <meta name="theme-color" content="#0a0d12" />
         <meta name="apple-mobile-web-app-capable" content="yes" />
         <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
         <meta name="apple-mobile-web-app-title" content="TradingAgents" />
         <link rel="manifest" href="/manifest.json" />
         <link rel="apple-touch-icon" href="/icon-192.png" />
+        <link rel="preconnect" href="https://fonts.googleapis.com" />
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
+        <link
+          rel="stylesheet"
+          href="https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&family=Noto+Sans+SC:wght@400;500;600;700&display=swap"
+        />
         <link
           rel="stylesheet"
           href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
         />
       </head>
-      <body className="antialiased">
+      <body className="antialiased font-sans">
         <Providers>
           {children}
         </Providers>
diff --git a/web/frontend/src/app/profile/ai-settings/page.tsx b/web/frontend/src/app/profile/ai-settings/page.tsx
index c9f0107..1de3e6d 100644
--- a/web/frontend/src/app/profile/ai-settings/page.tsx
+++ b/web/frontend/src/app/profile/ai-settings/page.tsx
@@ -115,7 +115,7 @@ export default function AISettingsPage() {
             <h2 className="text-responsive-h3 text-text-primary">Provider 列表 ({providers.length})</h2>
             <button
               onClick={handleNew}
-              className="px-4 py-2.5 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors"
+              className="px-4 py-2.5 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors"
             >
               <i className="fas fa-plus mr-2" />
               新增 provider
diff --git a/web/frontend/src/app/profile/page.tsx b/web/frontend/src/app/profile/page.tsx
index b47971c..629d1bc 100644
--- a/web/frontend/src/app/profile/page.tsx
+++ b/web/frontend/src/app/profile/page.tsx
@@ -162,7 +162,7 @@ export default function ProfilePage() {
               </div>
               <button
                 onClick={() => setShowPasswordModal(true)}
-                className="px-6 py-3 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary transition-colors whitespace-nowrap ml-6"
+                className="px-6 py-3 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary transition-colors whitespace-nowrap ml-6"
               >
                 <i className="fas fa-key mr-2" />
                 {user.has_set_password ? '修改密码' : '设置密码'}
@@ -293,7 +293,7 @@ export default function ProfilePage() {
                   type="button"
                   onClick={handleSetPassword}
                   disabled={isSettingPassword || !password || !confirmPassword || (user.has_set_password && !oldPassword)}
-                  className="flex-1 px-4 py-3 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+                  className="flex-1 px-4 py-3 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
                 >
                   {isSettingPassword ? (
                     <>
diff --git a/web/frontend/src/app/scheduled-tasks/page.tsx b/web/frontend/src/app/scheduled-tasks/page.tsx
index b5ad1c2..2bb3b3c 100644
--- a/web/frontend/src/app/scheduled-tasks/page.tsx
+++ b/web/frontend/src/app/scheduled-tasks/page.tsx
@@ -436,7 +436,7 @@ export default function ScheduledTasksPage() {
                             onClick={() => setPage(p)}
                             className={`px-3 py-2 text-sm font-medium rounded-md transition-colors ${
                               p === page
-                                ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
+                                ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary'
                                 : 'text-text-primary bg-dark-tertiary border border-dark-border hover:bg-dark-primary'
                             }`}
                           >
diff --git a/web/frontend/src/components/admin/ResponsiveUserCard.tsx b/web/frontend/src/components/admin/ResponsiveUserCard.tsx
index 1140e38..c4a09ec 100644
--- a/web/frontend/src/components/admin/ResponsiveUserCard.tsx
+++ b/web/frontend/src/components/admin/ResponsiveUserCard.tsx
@@ -31,7 +31,7 @@ export function ResponsiveUserCard({
           <div className={`w-10 h-10 rounded-full flex items-center justify-center font-bold text-sm flex-shrink-0 ${
             user.role === 'admin' 
               ? 'bg-gradient-to-br from-warning-500 to-warning-600 text-white' 
-              : 'bg-gradient-to-br from-accent-primary to-accent-secondary text-white'
+              : 'bg-gradient-to-br from-accent-primary to-accent-secondary text-dark-primary'
           }`}>
             {user.username.substring(0, 2).toUpperCase()}
           </div>
diff --git a/web/frontend/src/components/admin/llm-config/ModelForm.tsx b/web/frontend/src/components/admin/llm-config/ModelForm.tsx
index 8a6c5a3..132d1eb 100644
--- a/web/frontend/src/components/admin/llm-config/ModelForm.tsx
+++ b/web/frontend/src/components/admin/llm-config/ModelForm.tsx
@@ -271,7 +271,7 @@ export function ModelForm({ model, providers, onClose, onSuccess }: ModelFormPro
             <button
               type="submit"
               disabled={isSubmitting || activeProviders.length === 0}
-              className="flex-1 px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors disabled:opacity-50"
+              className="flex-1 px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors disabled:opacity-50"
             >
               {isSubmitting ? (
                 <>
diff --git a/web/frontend/src/components/admin/llm-config/ProviderForm.tsx b/web/frontend/src/components/admin/llm-config/ProviderForm.tsx
index d7bff02..d1788f2 100644
--- a/web/frontend/src/components/admin/llm-config/ProviderForm.tsx
+++ b/web/frontend/src/components/admin/llm-config/ProviderForm.tsx
@@ -346,7 +346,7 @@ export function ProviderForm({ provider, onClose, onSuccess }: ProviderFormProps
             <button
               type="submit"
               disabled={isSubmitting}
-              className="flex-1 px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors disabled:opacity-50"
+              className="flex-1 px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors disabled:opacity-50"
             >
               {isSubmitting ? (
                 <>
diff --git a/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx b/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
index 258cfb1..4696035 100644
--- a/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
+++ b/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
@@ -17,7 +17,7 @@ function ProviderSummaryCard({ provider }: { provider: SystemDefaultProviderSumm
     >
       <div className="flex items-start justify-between mb-4">
         <div className="flex items-center space-x-3">
-          <div className="flex items-center justify-center w-12 h-12 rounded-full bg-gradient-to-br from-accent-primary to-accent-secondary text-white text-xl">
+          <div className="flex items-center justify-center w-12 h-12 rounded-full bg-gradient-to-br from-accent-primary to-accent-secondary text-dark-primary text-xl">
             <i className="fas fa-star" aria-hidden="true" />
           </div>
           <div>
@@ -210,7 +210,7 @@ export function SystemDefaultForm() {
             type="button"
             disabled={!canSave}
             onClick={() => setConfirmOpen(true)}
-            className="px-4 py-2 bg-gradient-to-r from-accent-primary to-accent-secondary text-white rounded-lg hover:shadow-glow-cyan transition-all disabled:opacity-40 disabled:cursor-not-allowed"
+            className="px-4 py-2 bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary rounded-lg hover:shadow-glow-cyan transition-all disabled:opacity-40 disabled:cursor-not-allowed"
           >
             <i className="fas fa-save mr-2" aria-hidden="true" />
             保存为系统默认
diff --git a/web/frontend/src/components/analysis/AnalysisConfigForm.tsx b/web/frontend/src/components/analysis/AnalysisConfigForm.tsx
index ad9fd20..cbff2d6 100644
--- a/web/frontend/src/components/analysis/AnalysisConfigForm.tsx
+++ b/web/frontend/src/components/analysis/AnalysisConfigForm.tsx
@@ -8,6 +8,7 @@ import { useUserConfig } from '@/hooks/useUserConfig';
 import { useAuth } from '@/lib/auth';
 import { useLocalLLMKeys } from '@/hooks/useLocalLLMKeys';
 import { useUserLLMSettings } from '@/hooks/useUserLLMSettings';
+import { ModelSelector, ModelOption } from './ModelSelector';
 
 interface AnalysisConfigFormProps {
   config: any;
@@ -84,6 +85,8 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
   const [saveApiKeyToBrowser, setSaveApiKeyToBrowser] = useState(false);
   const [tickerError, setTickerError] = useState<string>('');
   const [showPrivacyDialog, setShowPrivacyDialog] = useState(false);
+  // Model-only selection: the user only ever sees model display names.
+  const [selectedModelLabel, setSelectedModelLabel] = useState('');
 
   // 执行交易状态
   const [enableTradingExecutor, setEnableTradingExecutor] = useState(false);
@@ -146,6 +149,35 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
     config?.llm_providers?.find((p: any) => p.value === formData.llm_provider)?.url ||
     '';
 
+  // ---- Model-only selection (Workflow Desk privacy boundary) ----
+  // The launch form shows model display names only. Provider / backend_url / api_key
+  // are resolved silently (effectiveBackendUrl + localKeyForProvider above) when the
+  // payload is built; they are never rendered here.
+  const resolveModelLabel = (provider: string, shallow: string, deep: string): string => {
+    const labelOf = (type: 'shallow' | 'deep', value: string) => {
+      if (!value) return '';
+      const arr = config?.models?.[String(provider || '').toLowerCase()]?.[type];
+      const found = Array.isArray(arr) ? arr.find((m: any) => m?.value === value) : undefined;
+      return found?.label || value;
+    };
+    const sh = labelOf('shallow', shallow);
+    const dp = labelOf('deep', deep);
+    if (sh && dp && sh !== dp) return `${sh} / ${dp}`;
+    return dp || sh || '';
+  };
+
+  const handleModelSelect = (selection: ModelOption | null) => {
+    setSelectedModelLabel(selection?.label || '');
+    setApiKeyValidated(false);
+    setFormData((prev) => ({
+      ...prev,
+      llm_provider: selection?.provider || '',
+      shallow_thinker: selection?.shallow || '',
+      deep_thinker: selection?.deep || '',
+      api_key: '', // never carry a UI-entered key in the launch surface
+    }));
+  };
+
   // 从服务器加载配置（只加载一次）
   const [configLoaded, setConfigLoaded] = useState(false);
   
@@ -194,6 +226,7 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
       }
       
       console.log('✅ 配置加载完成');
+      setSelectedModelLabel(resolveModelLabel(initialProvider, initialShallow, initialDeep));
       setConfigLoaded(true);
       onShowToast('已加载上次配置', 'info');
     } else if (!configLoading && !llmSettingsLoading && !userConfig && !configLoaded) {
@@ -470,9 +503,9 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
       return;
     }
 
-    // 检查API密钥验证
+    // 模型密钥由“我的模型”中的浏览器本地 KEY 静默提供；发起分析页不暴露 KEY 输入或来源。
     if (requiresUserApiKey && !apiKeyProvided) {
-      onShowToast('当前浏览器未保存该个人 provider 的 KEY，请补充 KEY、保存到当前浏览器，或切换到系统默认 provider', 'error');
+      onShowToast('该模型尚未在“我的模型”填写可用密钥，请先前往“我的模型”完成配置。', 'error');
       return;
     }
 
@@ -769,218 +802,28 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
           </div>
         </div>
 
-        {/* 步骤5: LLM服务商 */}
+        {/* 步骤5: 模型（Workflow Desk — 只展示模型名，Provider/Endpoint/密钥状态不在此暴露） */}
         <div className="space-y-4">
           <div className="flex items-center space-x-3">
-            <div className="flex-shrink-0 w-8 h-8 bg-blue-600 text-white rounded-full flex items-center justify-center text-sm font-bold">
+            <div className="flex-shrink-0 w-8 h-8 bg-accent-primary text-dark-primary rounded-full flex items-center justify-center text-sm font-bold">
               5
             </div>
-            <h4 className="text-lg font-medium text-text-primary">LLM服务商</h4>
+            <h4 className="text-lg font-medium text-text-primary">模型</h4>
           </div>
-          <div className="ml-11 space-y-4">
-            <div>
-              <label htmlFor="llm_provider" className="block text-sm font-medium text-text-secondary mb-2">
-                选择要使用的服务商
-              </label>
-              <select
-                id="llm_provider"
-                name="llm_provider"
-                value={formData.llm_provider}
-                onChange={handleInputChange}
-                className="w-full px-3 py-2 bg-dark-tertiary border border-dark-border text-white rounded-md focus:outline-none focus:ring-2 focus:ring-accent-primary focus:border-accent-primary transition-all"
-                required
+          <div className="ml-11 space-y-3">
+            <ModelSelector
+              config={config}
+              value={selectedModelLabel}
+              onChange={handleModelSelect}
+            />
+            {formData.llm_provider && requiresUserApiKey && !localKeyForProvider && (
+              <div
+                role="status"
+                aria-live="polite"
+                className="rounded-lg border border-warning-500/40 bg-warning-500/10 px-4 py-3 text-sm text-warning-500"
               >
-                <option value="">请选择LLM服务商...</option>
-                {llmProviders.map((provider: LLMProvider) => (
-                  <option key={provider.value} value={provider.value}>
-                    {provider.label} - {provider.description}
-                  </option>
-                ))}
-              </select>
-            </div>
-
-            {formData.llm_provider && (
-              <div role="status" aria-live="polite" className="rounded-md border border-dark-border bg-dark-tertiary px-3 py-2 text-sm">
-                {selectedUserProvider ? (
-                  localKeyForProvider ? (
-                    <span className="text-success-500">
-                      <i className="fas fa-key mr-1" />
-                      来源：个人配置（本浏览器 KEY）· {effectiveProviderLabel}
-                    </span>
-                  ) : (
-                    <span className="text-warning-500">
-                      <i className="fas fa-exclamation-triangle mr-1" />
-                      来源：个人配置 · {effectiveProviderLabel}，当前浏览器未保存 KEY
-                    </span>
-                  )
-                ) : isUsingSystemDefault ? (
-                  <span className="text-accent-primary">
-                    <i className="fas fa-building mr-1" />
-                    来源：系统默认 Provider · {effectiveProviderLabel}
-                  </span>
-                ) : formData.api_key.trim() ? (
-                  <span className="text-text-secondary">
-                    <i className="fas fa-user-edit mr-1" />
-                    来源：本次一次性输入
-                  </span>
-                ) : (
-                  <span className="text-warning-500">
-                    <i className="fas fa-exclamation-triangle mr-1" />
-                    未找到个人配置或系统默认来源；请填写本次 KEY
-                  </span>
-                )}
-              </div>
-            )}
-
-            {/* API密钥输入 */}
-            {requiresUserApiKey && (
-              <div>
-                <label htmlFor="api_key" className="block text-sm font-medium text-text-secondary mb-2">
-                  <i className="fas fa-key mr-1" />
-                  API密钥
-                </label>
-                <div className="flex space-x-2">
-                  <div className="relative flex-1">
-                    <input
-                      type={showApiKey ? 'text' : 'password'}
-                      id="api_key"
-                      name="api_key"
-                      value={formData.api_key}
-                      onChange={handleInputChange}
-                      className="w-full px-3 py-2 bg-dark-tertiary border border-dark-border text-white rounded-md focus:outline-none focus:ring-2 focus:ring-accent-primary focus:border-accent-primary transition-all"
-                      placeholder={getApiKeyPlaceholder(formData.llm_provider)}
-                      required={requiresUserApiKey}
-                    />
-                    <button
-                      type="button"
-                      className="absolute inset-y-0 right-0 pr-3 flex items-center"
-                      onClick={() => setShowApiKey(!showApiKey)}
-                    >
-                      <i className={`fas ${showApiKey ? 'fa-eye-slash' : 'fa-eye'} text-text-tertiary hover:text-accent-primary transition-colors`} />
-                    </button>
-                  </div>
-                  <button
-                    type="button"
-                    onClick={validateApiKey}
-                    disabled={validatingKey || !formData.api_key}
-                    className={`px-4 py-2 rounded-md border font-medium transition-colors ${apiKeyValidated
-                      ? 'bg-success-500/20 border-success-500 text-success-500'
-                      : 'bg-dark-tertiary border-dark-border text-text-secondary hover:bg-dark-secondary'
-                      } disabled:opacity-50 disabled:cursor-not-allowed`}
-                  >
-                    {validatingKey ? (
-                      <>
-                        <i className="fas fa-spinner fa-spin mr-1" />
-                        验证中
-                      </>
-                    ) : apiKeyValidated ? (
-                      <>
-                        <i className="fas fa-check mr-1" />
-                        已验证
-                      </>
-                    ) : (
-                      <>
-                        <i className="fas fa-check mr-1" />
-                        验证
-                      </>
-                    )}
-                  </button>
-                </div>
-                <div
-                  role="status"
-                  aria-live="polite"
-                  className="text-sm mb-2"
-                >
-                  {localKeyForProvider ? (
-                    <span className="text-success-500">
-                      <i className="fas fa-key mr-1" />
-                      来源：个人配置（本浏览器已存 KEY）· {formData.llm_provider}
-                    </span>
-                  ) : formData.api_key.trim() ? (
-                    <span className="text-text-secondary">
-                      <i className="fas fa-user-edit mr-1" />
-                      来源：本次一次性输入（不保存到浏览器）
-                    </span>
-                  ) : (
-                    <span className="text-warning-500">
-                      <i className="fas fa-exclamation-triangle mr-1" />
-                      当前浏览器未保存该个人 provider 的 KEY；请补充 KEY 或切换到系统默认 provider
-                    </span>
-                  )}
-                </div>
-
-                {formData.api_key.trim() && (
-                  <label className="mt-2 flex items-start gap-2 text-sm text-text-secondary">
-                    <input
-                      type="checkbox"
-                      checked={saveApiKeyToBrowser}
-                      onChange={(e) => setSaveApiKeyToBrowser(e.target.checked)}
-                      className="mt-1 h-4 w-4 text-accent-primary focus:ring-accent-primary border-dark-border rounded cursor-pointer bg-dark-secondary"
-                    />
-                    <span>保存到当前浏览器，后续自动随该 provider 请求下发</span>
-                  </label>
-                )}
-
-                <p className="text-sm text-text-tertiary mt-1">
-                  <i className="fas fa-info-circle mr-1" />
-                  访问个人 provider 需要您的 API 密钥；不勾选保存时仅本次使用，不会持久化到后端
-                </p>
-              </div>
-            )}
-
-            {/* 思维智能体选择 */}
-            {(!requiresUserApiKey || apiKeyValidated || !!localKeyForProvider || !!formData.api_key.trim() || formData.llm_provider === 'ollama') && (
-              <div className="border-t pt-4">
-                <div className="flex items-center space-x-2 mb-4">
-                  <i className="fas fa-lightbulb text-green-600" />
-                  <span className="font-medium text-green-700">为您的分析选择思维智能体</span>
-                </div>
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                  <div>
-                    <label htmlFor="shallow_thinker" className="block text-sm font-medium text-text-secondary mb-2">
-                      <i className="fas fa-bolt mr-1" />
-                      快速思维LLM引擎
-                    </label>
-                    <select
-                      id="shallow_thinker"
-                      name="shallow_thinker"
-                      value={formData.shallow_thinker}
-                      onChange={handleInputChange}
-                      className="w-full px-3 py-2 bg-dark-tertiary border border-dark-border text-white rounded-md focus:outline-none focus:ring-2 focus:ring-accent-primary focus:border-accent-primary transition-all"
-                      required
-                    >
-                      <option value="">选择模型...</option>
-                      {getModelsForProvider(formData.llm_provider, 'shallow').map((model: Model) => (
-                        <option key={model.value} value={model.value}>
-                          {model.label}
-                        </option>
-                      ))}
-                    </select>
-                    <p className="text-sm text-text-tertiary mt-1">用于快速初始分析和快速决策</p>
-                  </div>
-                  <div>
-                    <label htmlFor="deep_thinker" className="block text-sm font-medium text-text-secondary mb-2">
-                      <i className="fas fa-brain mr-1" />
-                      深度思维LLM引擎
-                    </label>
-                    <select
-                      id="deep_thinker"
-                      name="deep_thinker"
-                      value={formData.deep_thinker}
-                      onChange={handleInputChange}
-                      className="w-full px-3 py-2 bg-dark-tertiary border border-dark-border text-white rounded-md focus:outline-none focus:ring-2 focus:ring-accent-primary focus:border-accent-primary transition-all"
-                      required
-                    >
-                      <option value="">选择模型...</option>
-                      {getModelsForProvider(formData.llm_provider, 'deep').map((model: Model) => (
-                        <option key={model.value} value={model.value}>
-                          {model.label}
-                        </option>
-                      ))}
-                    </select>
-                    <p className="text-sm text-text-tertiary mt-1">用于全面分析和复杂推理</p>
-                  </div>
-                </div>
+                <i className="fas fa-triangle-exclamation mr-2" aria-hidden="true" />
+                该模型尚未在“我的模型”填写可用密钥，请前往“我的模型”完成配置后再发起分析。
               </div>
             )}
           </div>
@@ -1240,7 +1083,7 @@ export function AnalysisConfigForm({ config, onAnalysisStart, onShowToast }: Ana
               </button>
               <button
                 onClick={confirmStartAnalysis}
-                className="w-full md:flex-1 px-4 py-3 md:py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary transition-colors font-medium min-h-touch"
+                className="w-full md:flex-1 px-4 py-3 md:py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary transition-colors font-medium min-h-touch"
               >
                 确认并开始分析
               </button>
diff --git a/web/frontend/src/components/analysis/AnalysisHistory.tsx b/web/frontend/src/components/analysis/AnalysisHistory.tsx
index cd7d05e..99e1325 100644
--- a/web/frontend/src/components/analysis/AnalysisHistory.tsx
+++ b/web/frontend/src/components/analysis/AnalysisHistory.tsx
@@ -476,7 +476,7 @@ export function AnalysisHistory({ onBackToConfig, onViewResults, onViewProgress,
                       key={p}
                       onClick={() => setPage(p)}
                       className={`px-3 py-2 text-sm font-medium rounded-md transition-colors ${p === page
-                        ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
+                        ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary shadow-glow-cyan'
                         : 'text-text-secondary bg-dark-tertiary border border-dark-border hover:bg-dark-secondary'
                         }`}
                     >
diff --git a/web/frontend/src/components/analysis/AnalysisProgress.tsx b/web/frontend/src/components/analysis/AnalysisProgress.tsx
index bf601a3..a3a9bfe 100644
--- a/web/frontend/src/components/analysis/AnalysisProgress.tsx
+++ b/web/frontend/src/components/analysis/AnalysisProgress.tsx
@@ -91,7 +91,7 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
     {
       id: 1,
       name: '分析师团队',
-      description: '收集和分析市场数据',
+      description: 'Market → Social → News → Fundamentals 依次研究',
       icon: 'fa-users',
       status: 'running',
       agents: [
@@ -103,20 +103,20 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
     },
     {
       id: 2,
-      name: '研究团队',
-      description: '深度研究和辩论',
-      icon: 'fa-search',
+      name: '研究辩论',
+      description: 'Bull ↔ Bear 多空研究辩论，研究经理裁决',
+      icon: 'fa-comments',
       status: 'pending',
       agents: [
         { name: '多头研究员', status: 'pending', logs: [] },
         { name: '空头研究员', status: 'pending', logs: [] },
-        { name: '投资评审', status: 'pending', logs: [] }
+        { name: '研究经理', status: 'pending', logs: [] }
       ]
     },
     {
       id: 3,
-      name: '交易团队',
-      description: '制定交易策略',
+      name: '交易计划',
+      description: '交易员生成交易建议（不执行订单）',
       icon: 'fa-chart-line',
       status: 'pending',
       agents: [
@@ -125,15 +125,24 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
     },
     {
       id: 4,
-      name: '风险管理',
-      description: '评估和管理风险',
-      icon: 'fa-shield-alt',
+      name: '风险审议',
+      description: 'Risky → Safe → Neutral 三方风险审议',
+      icon: 'fa-shield-halved',
       status: 'pending',
       agents: [
         { name: '激进风险分析师', status: 'pending', logs: [] },
         { name: '保守风险分析师', status: 'pending', logs: [] },
-        { name: '中性风险分析师', status: 'pending', logs: [] },
-        { name: '风险管理评审及投资组合分析', status: 'pending', logs: [] }
+        { name: '中性风险分析师', status: 'pending', logs: [] }
+      ]
+    },
+    {
+      id: 5,
+      name: '最终裁决',
+      description: '风险裁决（Risk Judge）输出最终交易建议',
+      icon: 'fa-gavel',
+      status: 'pending',
+      agents: [
+        { name: '风险裁决', status: 'pending', logs: [] }
       ]
     }
   ]);
@@ -383,13 +392,13 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                     'researcher': 1,
                     'bull': 1,
                     'bear': 1,
-                    'invest_judge': 1,
+                    'invest_judge': 1,    // Research Manager 结束研究辩论 band
                     'trader': 2,
                     'risky': 3,
                     'neutral': 3,
                     'safe': 3,
-                    'risk_manager': 3,
-                    'trading_executor': 4,  // 执行交易员在风险管理之后（阶段索引4，对应id=5）
+                    'risk_manager': 4,    // Risk Judge 是独立的最终裁决 band（终末节点）
+                    'trading_executor': 4, // 已废弃；保留兜底
                   };
 
                   // 阶段名称到索引的映射（兼容旧格式）
@@ -429,7 +438,7 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                         setCurrentPhaseIndex(phaseIdx);
                       }
 
-                      // 智能体名称映射（英文 -> 中文）
+                      // 智能体名称映射（英文 -> 中文，与 GraphSetup 节点对齐）
                       const agentNameMap: { [key: string]: string } = {
                         'system': '系统',
                         'market': '市场分析师',
@@ -440,11 +449,11 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                         'bull': '多头研究员',
                         'bear': '空头研究员',
                         'trader': '交易员',
-                        'invest_judge': '投资评审',
+                        'invest_judge': '研究经理',
                         'risky': '激进风险分析师',
                         'neutral': '中性风险分析师',
                         'safe': '保守风险分析师',
-                        'risk_manager': '风险管理评审及投资组合分析',
+                        'risk_manager': '风险裁决',
                         'trading_executor': '执行交易员'
                       };
 
diff --git a/web/frontend/src/components/analysis/AnalysisResults.tsx b/web/frontend/src/components/analysis/AnalysisResults.tsx
index eb08c7c..f0705a1 100644
--- a/web/frontend/src/components/analysis/AnalysisResults.tsx
+++ b/web/frontend/src/components/analysis/AnalysisResults.tsx
@@ -2212,7 +2212,7 @@ export function AnalysisResults({ analysisId, onBackToConfig, onBackToHistory, o
                     await handleExport('markdown');
                     setShowExportPreview(false);
                   }}
-                  className="px-8 py-3 bg-gradient-to-r from-accent-primary to-accent-secondary text-white rounded-lg hover:shadow-glow-cyan transition-all flex items-center font-medium shadow-lg hover:scale-105"
+                  className="px-8 py-3 bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary rounded-lg hover:shadow-glow-cyan transition-all flex items-center font-medium shadow-lg hover:scale-105"
                 >
                   <i className="fas fa-file-code mr-2" />
                   导出为 Markdown
diff --git a/web/frontend/src/components/analysis/ModelSelector.test.tsx b/web/frontend/src/components/analysis/ModelSelector.test.tsx
new file mode 100644
index 0000000..1d657bb
--- /dev/null
+++ b/web/frontend/src/components/analysis/ModelSelector.test.tsx
@@ -0,0 +1,108 @@
+import React from 'react';
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+import { ModelSelector, NO_MODEL_MESSAGE } from '@/components/analysis/ModelSelector';
+import { renderWithQuery } from '@/test/renderWithQuery';
+
+vi.mock('@/hooks/useUserLLMSettings', () => ({
+  useUserLLMSettings: vi.fn(),
+}));
+
+import { useUserLLMSettings } from '@/hooks/useUserLLMSettings';
+
+const mockSettings = (data: any) => {
+  vi.mocked(useUserLLMSettings).mockReturnValue({ data, isLoading: false } as any);
+};
+
+// Personal providers as returned by the (key-less) settings endpoint.
+const personalProviders = [
+  {
+    id: '1',
+    provider_name: 'openai',
+    display_name: 'My OpenAI',
+    base_url: 'https://api.openai.com',
+    shallow_model: 'gpt-4o-mini',
+    deep_model: 'gpt-4o',
+    is_enabled: true,
+    is_default: true,
+  },
+];
+
+// Config deliberately carries sensitive fields that ModelSelector must NEVER surface.
+const sensitiveConfig = {
+  models: {
+    openai: {
+      shallow: [{ value: 'gpt-4o-mini', label: 'GPT-4o Mini' }],
+      deep: [{ value: 'gpt-4o', label: 'GPT-4o' }],
+    },
+  },
+  system_default: {
+    provider_name: 'openai',
+    display_name: 'OpenAI',
+    base_url: 'https://api.openai.com',
+    api_key_masked: 'sk-...1234',
+    has_api_key: true,
+  },
+  llm_providers: [{ value: 'openai', label: 'OpenAI', url: 'https://api.openai.com' }],
+};
+
+describe('ModelSelector — model-only privacy boundary', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders model display names only', () => {
+    mockSettings({ providers: personalProviders });
+    renderWithQuery(<ModelSelector config={sensitiveConfig} onChange={vi.fn()} />);
+
+    // Display labels ARE shown.
+    expect(screen.getByText('GPT-4o Mini / GPT-4o')).toBeInTheDocument();
+  });
+
+  it('never surfaces provider name, endpoint, masked/raw key or system-default provenance', () => {
+    mockSettings({ providers: personalProviders });
+    const { container } = renderWithQuery(
+      <ModelSelector config={sensitiveConfig} onChange={vi.fn()} />,
+    );
+
+    // Forbidden disclosures:
+    expect(screen.queryByText(/系统默认/)).toBeNull();
+    expect(screen.queryByText(/api\.openai\.com/)).toBeNull(); // base URL / endpoint
+    expect(screen.queryByText(/sk-\.\.\.1234/)).toBeNull(); // masked key
+    expect(screen.queryByText('OpenAI')).toBeNull(); // provider display name
+    expect(screen.queryByText('openai')).toBeNull(); // raw provider key as visible text
+    // No masked/raw key string anywhere in the rendered DOM.
+    expect(container.textContent).not.toMatch(/sk-\.\.\.1234/);
+    expect(container.textContent).not.toMatch(/api\.openai\.com/);
+  });
+
+  it('resolves provider + model values silently on selection', async () => {
+    const user = userEvent.setup();
+    const onChange = vi.fn();
+    mockSettings({ providers: personalProviders });
+    renderWithQuery(<ModelSelector config={sensitiveConfig} onChange={onChange} />);
+
+    await user.selectOptions(screen.getByRole('combobox'), 'GPT-4o Mini / GPT-4o');
+
+    expect(onChange).toHaveBeenCalledWith(
+      expect.objectContaining({
+        provider: 'openai',
+        shallow: 'gpt-4o-mini',
+        deep: 'gpt-4o',
+        label: 'GPT-4o Mini / GPT-4o',
+      }),
+    );
+  });
+
+  it('shows the actionable recovery message when no usable model exists', () => {
+    mockSettings({ providers: [] });
+    renderWithQuery(<ModelSelector config={sensitiveConfig} onChange={vi.fn()} />);
+
+    expect(screen.getByText(NO_MODEL_MESSAGE)).toBeInTheDocument();
+    // Recovery message must not leak whether a system/default provider exists.
+    expect(screen.queryByText(/系统默认/)).toBeNull();
+    expect(screen.queryByRole('combobox')).toBeNull();
+  });
+});
diff --git a/web/frontend/src/components/analysis/ModelSelector.tsx b/web/frontend/src/components/analysis/ModelSelector.tsx
new file mode 100644
index 0000000..2ae114b
--- /dev/null
+++ b/web/frontend/src/components/analysis/ModelSelector.tsx
@@ -0,0 +1,133 @@
+'use client';
+
+import React, { useMemo } from 'react';
+import { useUserLLMSettings } from '@/hooks/useUserLLMSettings';
+
+/**
+ * Workflow Desk — model-only selector for the analysis launch surface.
+ *
+ * Privacy contract (WS-13 / story-001, ui-spec.md "Analysis-start experience"):
+ *   Visible:   model display names only.
+ *   Forbidden: provider name, base URL, API key state, local-storage status,
+ *              system-default status, backend credential source.
+ *
+ * This component deliberately reads ONLY:
+ *   - the user's personal LLM settings (display_name + shallow/deep model values), and
+ *   - the non-sensitive `config.models[*][shallow|deep]` labels (display labels only).
+ * It never reads `config.system_default`, `config.llm_providers[].url`,
+ * `AdminLLMProvider.api_key`, `hasLocalKey(...)` or any masked/raw key.
+ *
+ * Provider / backend_url / api_key are resolved silently by the parent when it
+ * builds the launch payload; they are not surfaced in this UI.
+ */
+
+export interface ModelOption {
+  /** Internal provider key — never displayed. */
+  provider: string;
+  /** Shallow-thinker model value — never displayed. */
+  shallow: string;
+  /** Deep-thinker model value — never displayed. */
+  deep: string;
+  /** The only thing the user sees. */
+  label: string;
+}
+
+export interface ModelSelectorProps {
+  /** Optional non-sensitive config (model display labels only). */
+  config?: any;
+  /** Currently selected model label. */
+  value?: string;
+  /** Called with the resolved model descriptor (display name + internal values). */
+  onChange: (selection: ModelOption | null) => void;
+  disabled?: boolean;
+  id?: string;
+}
+
+export const NO_MODEL_MESSAGE =
+  '当前没有可用模型。请在“我的模型”添加个人模型，或联系管理员。';
+
+/** Look up a friendly display label for a model value, falling back to the raw value. */
+function labelFor(config: any, provider: string, type: 'shallow' | 'deep', value: string): string {
+  if (!value) return '';
+  const arr = config?.models?.[String(provider || '').toLowerCase()]?.[type];
+  const found = Array.isArray(arr) ? arr.find((m: any) => m?.value === value) : undefined;
+  return found?.label || value;
+}
+
+export function ModelSelector({ config, value, onChange, disabled, id = 'analysis_model' }: ModelSelectorProps) {
+  // Personal models only — the privacy-clean source. The hook response contains
+  // no api_key (keys live browser-local and are managed in 我的模型).
+  const { data: llmSettings } = useUserLLMSettings();
+
+  const options = useMemo<ModelOption[]>(() => {
+    const list: ModelOption[] = [];
+    const seen = new Set<string>();
+    const push = (opt: ModelOption) => {
+      if (!opt.label) return;
+      const key = `${opt.provider}|${opt.shallow}|${opt.deep}`;
+      if (seen.has(key)) return;
+      seen.add(key);
+      list.push(opt);
+    };
+
+    const personal = (llmSettings?.providers || []).filter((p: any) => p?.is_enabled);
+    for (const p of personal) {
+      const provider = p.provider_name;
+      const shallow = p.shallow_model || '';
+      const deep = p.deep_model || shallow;
+      const shallowLabel = labelFor(config, provider, 'shallow', shallow);
+      const deepLabel = labelFor(config, provider, 'deep', deep);
+      const label =
+        shallowLabel && deepLabel && shallowLabel !== deepLabel
+          ? `${shallowLabel} / ${deepLabel}`
+          : deepLabel || shallowLabel;
+      push({ provider, shallow, deep, label });
+    }
+    return list;
+  }, [llmSettings, config]);
+
+  const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    const label = e.target.value;
+    const next = options.find((o) => o.label === label) || null;
+    onChange(next);
+  };
+
+  if (options.length === 0) {
+    return (
+      <div
+        role="status"
+        aria-live="polite"
+        className="rounded-lg border border-warning-500/40 bg-warning-500/10 px-4 py-3 text-sm text-warning-500"
+      >
+        <i className="fas fa-circle-info mr-2" aria-hidden="true" />
+        {NO_MODEL_MESSAGE}
+      </div>
+    );
+  }
+
+  return (
+    <div className="space-y-1.5">
+      <label htmlFor={id} className="block text-sm font-medium text-text-secondary">
+        模型
+      </label>
+      <select
+        id={id}
+        name="analysis_model"
+        value={value || ''}
+        onChange={handleChange}
+        disabled={disabled}
+        className="w-full min-h-[43px] px-3 py-2 bg-[#0d131b] border border-dark-border text-white rounded-lg focus:outline-none focus:ring-2 focus:ring-accent-primary/30 focus:border-accent-primary transition-all disabled:opacity-50"
+      >
+        <option value="">选择模型...</option>
+        {options.map((opt) => (
+          <option key={`${opt.provider}:${opt.shallow}:${opt.deep}`} value={opt.label}>
+            {opt.label}
+          </option>
+        ))}
+      </select>
+      <p className="text-xs text-text-tertiary">
+        只显示可用模型。个人模型在“我的模型”中管理；此处不展示 Provider、Endpoint 或密钥配置。
+      </p>
+    </div>
+  );
+}
diff --git a/web/frontend/src/components/auth/LoginForm.tsx b/web/frontend/src/components/auth/LoginForm.tsx
index a907f4e..507bfc2 100644
--- a/web/frontend/src/components/auth/LoginForm.tsx
+++ b/web/frontend/src/components/auth/LoginForm.tsx
@@ -149,7 +149,7 @@ export function LoginForm({ onShowToast }: LoginFormProps) {
           onClick={() => setLoginMode('password')}
           className={`flex-1 py-2 px-2 sm:px-4 rounded-md text-xs sm:text-sm font-medium transition-all ${
             loginMode === 'password'
-              ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
+              ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary shadow-glow-cyan'
               : 'text-text-secondary hover:text-text-primary'
           }`}
         >
@@ -162,7 +162,7 @@ export function LoginForm({ onShowToast }: LoginFormProps) {
           onClick={() => setLoginMode('email')}
           className={`flex-1 py-2 px-2 sm:px-4 rounded-md text-xs sm:text-sm font-medium transition-all ${
             loginMode === 'email'
-              ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
+              ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary shadow-glow-cyan'
               : 'text-text-secondary hover:text-text-primary'
           }`}
         >
@@ -246,7 +246,7 @@ export function LoginForm({ onShowToast }: LoginFormProps) {
           <button
             type="submit"
             disabled={isLoading}
-            className="w-full bg-gradient-to-r from-accent-primary to-accent-secondary text-white py-3 px-4 rounded-lg hover:shadow-glow-cyan hover:scale-105 active:scale-95 focus:outline-none focus:ring-2 focus:ring-accent-primary focus:ring-offset-2 focus:ring-offset-dark-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-all"
+            className="w-full bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary py-3 px-4 rounded-lg hover:shadow-glow-cyan hover:scale-105 active:scale-95 focus:outline-none focus:ring-2 focus:ring-accent-primary focus:ring-offset-2 focus:ring-offset-dark-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-all"
           >
             {isLoading ? (
               <>
@@ -347,7 +347,7 @@ export function LoginForm({ onShowToast }: LoginFormProps) {
           <button
             type="submit"
             disabled={isLoading}
-            className="w-full bg-gradient-to-r from-accent-primary to-accent-secondary text-white py-3 px-4 rounded-lg hover:shadow-glow-cyan hover:scale-105 active:scale-95 focus:outline-none focus:ring-2 focus:ring-accent-primary focus:ring-offset-2 focus:ring-offset-dark-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-all"
+            className="w-full bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary py-3 px-4 rounded-lg hover:shadow-glow-cyan hover:scale-105 active:scale-95 focus:outline-none focus:ring-2 focus:ring-accent-primary focus:ring-offset-2 focus:ring-offset-dark-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-all"
           >
             {isLoading ? (
               <>
diff --git a/web/frontend/src/components/common/AppNavbar.tsx b/web/frontend/src/components/common/AppNavbar.tsx
index fb59fe8..ec5c549 100644
--- a/web/frontend/src/components/common/AppNavbar.tsx
+++ b/web/frontend/src/components/common/AppNavbar.tsx
@@ -18,29 +18,118 @@ interface AppNavbarProps {
   showUserManagement?: boolean;
 }
 
-export function AppNavbar({ user, onLogout, showNewAnalysis = true, showUserManagement = true }: AppNavbarProps) {
+interface NavItem {
+  label: string;
+  path: string;
+  icon: string;
+}
+
+// Workflow Desk information architecture — maps the rail onto the existing routes.
+const RESEARCH_NAV: NavItem[] = [
+  { label: '发起分析', path: '/', icon: 'fas fa-circle-plus' },
+  { label: '分析历史', path: '/history', icon: 'fas fa-clock-rotate-left' },
+  { label: '定期任务', path: '/scheduled-tasks', icon: 'fas fa-calendar-day' },
+];
+
+const ACCOUNT_NAV: NavItem[] = [
+  { label: '个人中心', path: '/profile', icon: 'fas fa-user' },
+  { label: '我的模型', path: '/profile/ai-settings', icon: 'fas fa-sliders' },
+];
+
+const ADMIN_NAV: NavItem[] = [
+  { label: '用户', path: '/admin/users', icon: 'fas fa-users' },
+  { label: '系统模型', path: '/admin/llm-config', icon: 'fas fa-brain' },
+  { label: '系统默认 Provider', path: '/admin/system-default-provider', icon: 'fas fa-star' },
+];
+
+const ROUTE_LABEL: Record<string, string> = {
+  '/': '发起分析',
+  '/history': '分析历史',
+  '/history/detail': '分析报告',
+  '/history/progress': '实时工作流',
+  '/analysis': '分析报告',
+  '/scheduled-tasks': '定期任务',
+  '/profile': '个人中心',
+  '/profile/ai-settings': '我的模型',
+  '/admin/users': '用户',
+  '/admin/llm-config': '系统模型',
+  '/admin/system-default-provider': '系统默认 Provider',
+};
+
+function BrandMark() {
+  return (
+    <span
+      aria-hidden="true"
+      className="relative inline-block w-7 h-7 rounded-lg border border-accent-primary shrink-0"
+    >
+      <span className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-px h-4 bg-accent-primary" />
+      <span className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 h-px w-4 bg-accent-primary" />
+    </span>
+  );
+}
+
+function RailButton({
+  item,
+  active,
+  onClick,
+}: {
+  item: NavItem;
+  active: boolean;
+  onClick: () => void;
+}) {
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      aria-current={active ? 'page' : undefined}
+      className={`min-h-[39px] rounded-lg px-3 flex items-center gap-2.5 text-sm transition-colors ${
+        active
+          ? 'bg-accent-primary text-dark-primary font-bold'
+          : 'text-text-secondary hover:bg-dark-secondary hover:text-text-primary'
+      }`}
+    >
+      <i className={`${item.icon} w-4 text-center`} aria-hidden="true" />
+      <span>{item.label}</span>
+    </button>
+  );
+}
+
+export function AppNavbar({
+  user,
+  onLogout,
+  showNewAnalysis = true,
+  showUserManagement = true,
+}: AppNavbarProps) {
   const router = useRouter();
   const pathname = usePathname();
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
   const [showUserMenu, setShowUserMenu] = useState(false);
 
   const isActive = (path: string) => {
+    if (path === '/') return pathname === '/';
     return pathname === path || pathname?.startsWith(path + '/');
   };
 
+  const currentLabel = (() => {
+    if (!pathname) return '发起分析';
+    if (ROUTE_LABEL[pathname]) return ROUTE_LABEL[pathname];
+    const match = Object.keys(ROUTE_LABEL)
+      .filter((p) => p !== '/' && pathname.startsWith(p))
+      .sort((a, b) => b.length - a.length)[0];
+    return match ? ROUTE_LABEL[match] : 'Workflow Desk';
+  })();
+
   // Close mobile menu when route changes
   useEffect(() => {
     setIsMobileMenuOpen(false);
+    setShowUserMenu(false);
   }, [pathname]);
 
   // Close dropdown menus when clicking outside
   useEffect(() => {
-    const handleClickOutside = (event: MouseEvent) => {
-      if (showUserMenu) {
-        setShowUserMenu(false);
-      }
+    const handleClickOutside = () => {
+      if (showUserMenu) setShowUserMenu(false);
     };
-
     document.addEventListener('click', handleClickOutside);
     return () => document.removeEventListener('click', handleClickOutside);
   }, [showUserMenu]);
@@ -52,7 +141,6 @@ export function AppNavbar({ user, onLogout, showNewAnalysis = true, showUserMana
     } else {
       document.body.style.overflow = '';
     }
-    
     return () => {
       document.body.style.overflow = '';
     };
@@ -61,18 +149,19 @@ export function AppNavbar({ user, onLogout, showNewAnalysis = true, showUserMana
   // Close menu on ESC key
   useEffect(() => {
     const handleEscape = (e: KeyboardEvent) => {
-      if (e.key === 'Escape' && isMobileMenuOpen) {
-        setIsMobileMenuOpen(false);
+      if (e.key === 'Escape') {
+        if (showUserMenu) setShowUserMenu(false);
+        if (isMobileMenuOpen) setIsMobileMenuOpen(false);
       }
     };
-
     document.addEventListener('keydown', handleEscape);
     return () => document.removeEventListener('keydown', handleEscape);
-  }, [isMobileMenuOpen]);
+  }, [isMobileMenuOpen, showUserMenu]);
 
   const handleNavigation = (path: string) => {
     router.push(path);
     setIsMobileMenuOpen(false);
+    setShowUserMenu(false);
   };
 
   const handleLogout = () => {
@@ -82,221 +171,209 @@ export function AppNavbar({ user, onLogout, showNewAnalysis = true, showUserMana
     router.push('/');
   };
 
+  const researchNav = showNewAnalysis ? RESEARCH_NAV : RESEARCH_NAV.filter((n) => n.path !== '/');
+  const adminNav = ADMIN_NAV;
+
   return (
     <>
-      <nav className="fixed top-0 w-full z-50 bg-dark-primary/80 backdrop-blur-lg border-b border-dark-border shadow-lg">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-          <div className="flex justify-between h-14 md:h-16">
-            {/* Left side - Logo */}
-            <div className="flex items-center">
-              {/* Logo */}
-              <div className="flex-shrink-0 cursor-pointer group" onClick={() => handleNavigation('/')}>
-                <h1 className="text-text-primary text-base md:text-xl font-bold flex items-center space-x-2">
-                  <i className="fas fa-chart-line text-accent-primary group-hover:text-accent-secondary transition-colors" />
-                  <span className="group-hover:text-accent-primary transition-colors">TradingAgentsWeb</span>
-                </h1>
+      {/* ============ Desktop research rail (lg+) ============ */}
+      <aside
+        aria-label="主导航"
+        className="hidden lg:flex fixed inset-y-0 left-0 w-rail flex-col bg-[#111720] border-r border-dark-border px-3 py-4 z-40"
+      >
+        <button
+          type="button"
+          onClick={() => handleNavigation('/')}
+          className="flex items-center gap-2.5 px-2 pb-5 border-b border-dark-border"
+        >
+          <BrandMark />
+          <span className="text-left leading-tight">
+            <span className="block font-mono text-sm font-medium tracking-tight text-text-primary">
+              TRADINGAGENTS
+            </span>
+            <span className="block font-mono text-[10px] text-text-tertiary">WORKFLOW DESK</span>
+          </span>
+        </button>
+
+        <nav className="pt-4 flex-1 overflow-y-auto scrollbar-hide">
+          <div className="px-2 pb-1 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+            研究工作台
+          </div>
+          <div className="grid gap-1">
+            {researchNav.map((item) => (
+              <RailButton
+                key={item.path}
+                item={item}
+                active={isActive(item.path)}
+                onClick={() => handleNavigation(item.path)}
+              />
+            ))}
+          </div>
+
+          {user && (
+            <>
+              <div className="px-2 pt-5 pb-1 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+                账户与管理
               </div>
-            </div>
+              <div className="grid gap-1">
+                {ACCOUNT_NAV.map((item) => (
+                  <RailButton
+                    key={item.path}
+                    item={item}
+                    active={isActive(item.path)}
+                    onClick={() => handleNavigation(item.path)}
+                  />
+                ))}
+                {showUserManagement && user.role === 'admin' && (
+                  <>
+                    <div className="px-2 pt-4 pb-1 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+                      管理员
+                    </div>
+                    {adminNav.map((item) => (
+                      <RailButton
+                        key={item.path}
+                        item={item}
+                        active={isActive(item.path)}
+                        onClick={() => handleNavigation(item.path)}
+                      />
+                    ))}
+                  </>
+                )}
+              </div>
+            </>
+          )}
+        </nav>
 
-            {/* Right side - Hamburger menu (mobile) and Desktop navigation */}
-            <div className="flex items-center">
-              {/* Hamburger menu button - visible on mobile only */}
-              <button
-                onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
-                className="md:hidden p-2 rounded-lg text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary transition-colors min-w-touch min-h-touch flex items-center justify-center"
-                aria-label="打开导航菜单"
-                aria-expanded={isMobileMenuOpen}
-                aria-controls="mobile-menu"
-              >
-                <i className={`fas ${isMobileMenuOpen ? 'fa-times' : 'fa-bars'} text-xl`} aria-hidden="true" />
-              </button>
+        <div className="mt-auto border-t border-dark-border pt-3 px-2 font-mono text-[10px] leading-relaxed text-text-tertiary">
+          US · HK · CN
+          <br />
+          市场与数据源自动识别
+        </div>
+      </aside>
 
-              {/* Desktop navigation - hidden on mobile */}
-              <div className="hidden md:flex items-center space-x-2">
-              {/* Show user-specific navigation only when logged in */}
-              {user && (
-                <>
-                  {showNewAnalysis && (
-                    <button
-                      onClick={() => handleNavigation('/')}
-                      className={`px-3 py-2 rounded-lg text-sm font-medium transition-all ${
-                        isActive('/')
-                          ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                          : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                      }`}
-                    >
-                      <i className="fas fa-plus-circle mr-1" />
-                      新建对话
-                    </button>
+      {/* ============ Top status bar (always visible) ============ */}
+      <header className="fixed top-0 left-0 lg:left-rail right-0 h-16 z-30 bg-dark-primary/90 backdrop-blur-lg border-b border-dark-border">
+        <div className="h-full flex items-center justify-between gap-3 px-4 sm:px-6">
+          <div className="flex items-center gap-3 min-w-0">
+            {/* Mobile brand */}
+            <button
+              type="button"
+              onClick={() => handleNavigation('/')}
+              className="lg:hidden flex items-center gap-2"
+            >
+              <BrandMark />
+              <span className="font-mono text-xs font-medium tracking-tight text-text-primary">
+                TRADINGAGENTS
+              </span>
+            </button>
+            <span className="hidden lg:block font-mono text-[11px] text-text-tertiary">
+              WORKFLOW DESK / <span className="text-text-primary">{currentLabel}</span>
+            </span>
+          </div>
+
+          <div className="flex items-center gap-4">
+            <span className="hidden sm:flex items-center gap-2 font-mono text-[10px] text-text-secondary">
+              <span className="relative inline-block w-[7px] h-[7px] rounded-full bg-accent-primary shadow-[0_0_0_4px_rgba(155,255,190,0.12)]" />
+              服务已连接
+            </span>
+
+            {user ? (
+              <div className="relative">
+                <button
+                  type="button"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setShowUserMenu(!showUserMenu);
+                  }}
+                  className="flex items-center gap-2 rounded-lg px-2 py-1.5 text-sm text-text-secondary hover:text-text-primary hover:bg-dark-secondary transition-colors"
+                  aria-haspopup="menu"
+                  aria-expanded={showUserMenu}
+                >
+                  <span className="w-8 h-8 rounded-full bg-gradient-to-br from-accent-primary to-accent-secondary text-dark-primary flex items-center justify-center font-bold text-xs">
+                    {user.username.charAt(0).toUpperCase()}
+                  </span>
+                  <span className="hidden sm:block max-w-[8rem] truncate">{user.username}</span>
+                  {user.role === 'admin' && (
+                    <span className="hidden sm:inline px-1.5 py-0.5 rounded bg-accent-primary/15 text-accent-primary text-[10px] font-bold">
+                      管理员
+                    </span>
                   )}
-                  <button
-                    onClick={() => handleNavigation('/history')}
-                    className={`px-3 py-2 rounded-lg text-sm font-medium transition-all ${
-                      isActive('/history')
-                        ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                        : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                    }`}
-                  >
-                    <i className="fas fa-history mr-1" />
-                    分析历史
-                  </button>
-                  <button
-                    onClick={() => handleNavigation('/scheduled-tasks')}
-                    className={`px-3 py-2 rounded-lg text-sm font-medium transition-all ${
-                      isActive('/scheduled-tasks')
-                        ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                        : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                    }`}
-                  >
-                    <i className="fas fa-clock mr-1" />
-                    定期报告
-                  </button>
+                  <i
+                    className={`fas fa-chevron-down text-[10px] transition-transform ${showUserMenu ? 'rotate-180' : ''}`}
+                    aria-hidden="true"
+                  />
+                </button>
 
-                  {/* User dropdown menu */}
-                  <div className="relative">
+                {showUserMenu && (
+                  <div
+                    role="menu"
+                    className="absolute top-full right-0 mt-1 w-44 bg-dark-secondary border border-dark-border rounded-lg shadow-elevated-dark py-2 z-50"
+                  >
                     <button
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        setShowUserMenu(!showUserMenu);
-                      }}
-                      className={`px-3 py-2 rounded-lg text-sm font-medium transition-all flex items-center ${
-                        isActive('/profile') || isActive('/admin')
-                          ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                          : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                      }`}
+                      type="button"
+                      role="menuitem"
+                      onClick={handleLogout}
+                      className="w-full text-left px-4 py-2 text-sm text-danger-500 hover:bg-danger-500/10 transition-colors flex items-center"
                     >
-                      <i className={`fas ${user?.role === 'admin' ? 'fa-crown' : 'fa-user-circle'} mr-2`} />
-                      {user?.username}
-                      {user?.role === 'admin' && (
-                        <span className="mx-2 px-2 py-0.5 bg-gradient-to-r from-accent-primary to-accent-secondary text-white text-xs font-bold rounded">
-                          管理员
-                        </span>
-                      )}
-                      <i className={`fas fa-chevron-down ml-2 text-xs transition-transform ${showUserMenu ? 'rotate-180' : ''}`} />
+                      <i className="fas fa-power-off w-4 mr-3" aria-hidden="true" />
+                      退出登录
                     </button>
-
-                    {showUserMenu && (
-                      <div className="absolute top-full right-0 mt-1 w-48 bg-dark-secondary border border-dark-border rounded-lg shadow-lg py-2 z-50">
-                        <button
-                          onClick={() => {
-                            handleNavigation('/profile');
-                            setShowUserMenu(false);
-                          }}
-                          className="w-full text-left px-4 py-2 text-sm text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary transition-all flex items-center"
-                        >
-                          <i className="fas fa-user-circle w-4 mr-3" />
-                          个人中心
-                        </button>
-
-                        {/* Admin menu items */}
-                        {showUserManagement && user?.role === 'admin' && (
-                          <>
-                            <div className="border-t border-dark-border my-1"></div>
-                            <button
-                              onClick={() => {
-                                handleNavigation('/admin/users');
-                                setShowUserMenu(false);
-                              }}
-                              className={`w-full text-left px-4 py-2 text-sm transition-all flex items-center ${
-                                isActive('/admin/users')
-                                  ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                  : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                              }`}
-                            >
-                              <i className="fas fa-users w-4 mr-3" />
-                              用户列表
-                            </button>
-                            <button
-                              onClick={() => {
-                                handleNavigation('/admin/llm-config');
-                                setShowUserMenu(false);
-                              }}
-                              className={`w-full text-left px-4 py-2 text-sm transition-all flex items-center ${
-                                isActive('/admin/llm-config')
-                                  ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                  : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                              }`}
-                            >
-                              <i className="fas fa-brain w-4 mr-3" />
-                              LLM管理
-                            </button>
-                            <button
-                              onClick={() => {
-                                handleNavigation('/admin/system-default-provider');
-                                setShowUserMenu(false);
-                              }}
-                              className={`w-full text-left px-4 py-2 text-sm transition-all flex items-center ${
-                                isActive('/admin/system-default-provider')
-                                  ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                  : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                              }`}
-                            >
-                              <i className="fas fa-star w-4 mr-3" />
-                              系统默认 Provider
-                            </button>
-                          </>
-                        )}
-
-                        <div className="border-t border-dark-border my-1"></div>
-                        <button
-                          onClick={() => {
-                            handleLogout();
-                            setShowUserMenu(false);
-                          }}
-                          className="w-full text-left px-4 py-2 text-sm text-danger-500 hover:bg-danger-500/10 transition-all flex items-center"
-                        >
-                          <i className="fas fa-power-off w-4 mr-3" />
-                          退出登录
-                        </button>
-                      </div>
-                    )}
                   </div>
-                </>
-              )}
-
-              {/* Show login/register for non-logged in users */}
-              {!user && (
-                <>
-                  <button
-                    onClick={() => handleNavigation('/login')}
-                    className="px-3 py-2 rounded-lg text-sm font-medium text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary transition-all"
-                  >
-                    登录
-                  </button>
-                  <button
-                    onClick={() => handleNavigation('/register')}
-                    className="px-3 py-2 rounded-lg text-sm font-medium bg-gradient-to-r from-accent-primary to-accent-secondary text-white hover:shadow-glow-cyan transition-all"
-                  >
-                    注册
-                  </button>
-                </>
-              )}
+                )}
               </div>
-            </div>
+            ) : (
+              <div className="flex items-center gap-2">
+                <button
+                  type="button"
+                  onClick={() => handleNavigation('/login')}
+                  className="px-3 py-1.5 rounded-lg text-sm text-text-secondary hover:text-accent-primary transition-colors"
+                >
+                  登录
+                </button>
+                <button
+                  type="button"
+                  onClick={() => handleNavigation('/register')}
+                  className="px-3 py-1.5 rounded-lg text-sm bg-accent-primary text-dark-primary font-bold hover:brightness-95 transition-all"
+                >
+                  注册
+                </button>
+              </div>
+            )}
+
+            {/* Hamburger — mobile only */}
+            <button
+              type="button"
+              onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
+              className="lg:hidden p-2 rounded-lg text-text-secondary hover:text-accent-primary hover:bg-dark-secondary transition-colors min-w-touch min-h-touch flex items-center justify-center"
+              aria-label="打开导航菜单"
+              aria-expanded={isMobileMenuOpen}
+              aria-controls="mobile-menu"
+            >
+              <i className={`fas ${isMobileMenuOpen ? 'fa-times' : 'fa-bars'} text-xl`} aria-hidden="true" />
+            </button>
           </div>
         </div>
-      </nav>
+      </header>
 
-      {/* Mobile Menu Overlay */}
+      {/* ============ Mobile drawer (full nav) ============ */}
       {isMobileMenuOpen && (
-        <div className="fixed inset-0 z-40 md:hidden">
-          {/* Backdrop */}
-          <div 
+        <div className="fixed inset-0 z-40 lg:hidden">
+          <div
             className="absolute inset-0 bg-black/70 backdrop-blur-sm"
             onClick={() => setIsMobileMenuOpen(false)}
             aria-hidden="true"
           />
-          
-          {/* Menu Panel */}
-          <div 
+          <div
             id="mobile-menu"
-            className="absolute right-0 top-0 bottom-0 w-80 max-w-[85vw] bg-dark-secondary shadow-xl transform transition-transform duration-300 ease-in-out"
-            style={{ transform: isMobileMenuOpen ? 'translateX(0)' : 'translateX(100%)' }}
+            className="absolute right-0 top-0 bottom-0 w-80 max-w-[85vw] bg-dark-secondary shadow-elevated-dark overflow-y-auto"
           >
-            {/* Menu Header */}
-            <div className="h-14 flex items-center justify-between px-4 border-b border-dark-border">
-              <h2 className="text-lg font-bold text-text-primary">菜单</h2>
+            <div className="h-16 flex items-center justify-between px-4 border-b border-dark-border">
+              <div className="flex items-center gap-2">
+                <BrandMark />
+                <span className="font-mono text-sm font-medium text-text-primary">TRADINGAGENTS</span>
+              </div>
               <button
+                type="button"
                 onClick={() => setIsMobileMenuOpen(false)}
                 className="p-2 rounded-lg text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary transition-colors"
                 aria-label="关闭菜单"
@@ -305,162 +382,86 @@ export function AppNavbar({ user, onLogout, showNewAnalysis = true, showUserMana
               </button>
             </div>
 
-            {/* Navigation Items */}
-            <nav className="flex-1 overflow-y-auto py-4" aria-label="主导航">
-              <div className="space-y-1 px-3">
-                {/* Show user-specific navigation only when logged in */}
-                {user && (
-                  <>
-                    {showNewAnalysis && (
-                      <button
-                        onClick={() => handleNavigation('/')}
-                        className={`w-full flex items-center px-4 py-3 rounded-lg text-base font-medium transition-all min-h-touch ${
-                          isActive('/')
-                            ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                            : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                        }`}
-                      >
-                        <i className="fas fa-plus-circle w-6 text-lg" />
-                        <span className="ml-3">新建对话</span>
-                      </button>
-                    )}
-
-                    <button
-                      onClick={() => handleNavigation('/history')}
-                      className={`w-full flex items-center px-4 py-3 rounded-lg text-base font-medium transition-all min-h-touch ${
-                        isActive('/history')
-                          ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                          : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                      }`}
-                    >
-                      <i className="fas fa-history w-6 text-lg" />
-                      <span className="ml-3">分析历史</span>
-                    </button>
-
-                    <button
-                      onClick={() => handleNavigation('/scheduled-tasks')}
-                      className={`w-full flex items-center px-4 py-3 rounded-lg text-base font-medium transition-all min-h-touch ${
-                        isActive('/scheduled-tasks')
-                          ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white shadow-glow-cyan'
-                          : 'text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary'
-                      }`}
-                    >
-                      <i className="fas fa-clock w-6 text-lg" />
-                      <span className="ml-3">定期报告</span>
-                    </button>
+            <nav className="p-3" aria-label="主导航">
+              <div className="px-2 py-2 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+                研究工作台
+              </div>
+              <div className="grid gap-1">
+                {researchNav.map((item) => (
+                  <RailButton
+                    key={item.path}
+                    item={item}
+                    active={isActive(item.path)}
+                    onClick={() => handleNavigation(item.path)}
+                  />
+                ))}
+              </div>
 
-                {/* Mobile User Menu */}
-                {user && (
-                  <div className="border border-dark-border rounded-lg overflow-hidden bg-dark-tertiary">
-                    {/* User section header */}
-                    <div className="flex items-center justify-between p-4 border-b border-dark-border">
-                      <div className="flex items-center">
-                        <div className="w-10 h-10 rounded-full bg-gradient-to-br from-accent-primary to-accent-secondary flex items-center justify-center text-white font-bold mr-3">
-                          {user.username.charAt(0).toUpperCase()}
-                        </div>
-                        <div>
-                          <p className="text-sm font-semibold text-text-primary">{user.username}</p>
-                          {user.role === 'admin' && (
-                            <span className="px-2 py-1 bg-gradient-to-r from-accent-primary to-accent-secondary text-white text-xs font-bold rounded">
-                              管理员
-                            </span>
-                          )}
+              {user && (
+                <>
+                  <div className="px-2 pt-4 py-2 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+                    账户与管理
+                  </div>
+                  <div className="grid gap-1">
+                    {ACCOUNT_NAV.map((item) => (
+                      <RailButton
+                        key={item.path}
+                        item={item}
+                        active={isActive(item.path)}
+                        onClick={() => handleNavigation(item.path)}
+                      />
+                    ))}
+                    {showUserManagement && user.role === 'admin' && (
+                      <>
+                        <div className="px-2 pt-3 py-2 text-[10px] font-mono tracking-wider uppercase text-text-tertiary">
+                          管理员
                         </div>
-                      </div>
-                    </div>
-                    
-                    {/* User menu items */}
-                    <div className="py-2">
-                      <button
-                        onClick={() => handleNavigation('/profile')}
-                        className={`w-full flex items-center px-4 py-3 text-base font-medium transition-all ${
-                          isActive('/profile')
-                            ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                            : 'text-text-secondary hover:text-accent-primary hover:bg-dark-secondary'
-                        }`}
-                      >
-                        <i className="fas fa-user-circle w-6 text-lg mr-3" />
-                        个人中心
-                      </button>
-                      
-                      {/* Admin menu items */}
-                      {showUserManagement && user.role === 'admin' && (
-                        <>
-                          <div className="border-t border-dark-border my-2"></div>
-                          <button
-                            onClick={() => handleNavigation('/admin/users')}
-                            className={`w-full flex items-center px-4 py-3 text-base font-medium transition-all ${
-                              isActive('/admin/users')
-                                ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                : 'text-text-secondary hover:text-accent-primary hover:bg-dark-secondary'
-                            }`}
-                          >
-                            <i className="fas fa-users w-6 text-lg mr-3" />
-                            用户列表
-                          </button>
-                          <button
-                            onClick={() => handleNavigation('/admin/llm-config')}
-                            className={`w-full flex items-center px-4 py-3 text-base font-medium transition-all ${
-                              isActive('/admin/llm-config')
-                                ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                : 'text-text-secondary hover:text-accent-primary hover:bg-dark-secondary'
-                            }`}
-                          >
-                            <i className="fas fa-brain w-6 text-lg mr-3" />
-                            LLM管理
-                          </button>
-                          <button
-                            onClick={() => handleNavigation('/admin/system-default-provider')}
-                            className={`w-full flex items-center px-4 py-3 text-base font-medium transition-all ${
-                              isActive('/admin/system-default-provider')
-                                ? 'bg-gradient-to-r from-accent-primary to-accent-secondary text-white'
-                                : 'text-text-secondary hover:text-accent-primary hover:bg-dark-secondary'
-                            }`}
-                          >
-                            <i className="fas fa-star w-6 text-lg mr-3" />
-                            系统默认 Provider
-                          </button>
-                        </>
-                      )}
-                      
-                      <div className="border-t border-dark-border my-2"></div>
-                      <button
-                        onClick={handleLogout}
-                        className="w-full flex items-center px-4 py-3 text-base font-medium text-danger-500 hover:bg-danger-500/10 transition-all"
-                      >
-                        <i className="fas fa-power-off w-6 text-lg mr-3" />
-                        退出登录
-                      </button>
-                    </div>
+                        {adminNav.map((item) => (
+                          <RailButton
+                            key={item.path}
+                            item={item}
+                            active={isActive(item.path)}
+                            onClick={() => handleNavigation(item.path)}
+                          />
+                        ))}
+                      </>
+                    )}
                   </div>
-                )}
-                  </>
-                )}
 
-                {/* Show login/register for non-logged in users */}
-                {!user && (
-                  <>
-                    <div className="border-t border-dark-border my-2"></div>
+                  <div className="mt-4 border-t border-dark-border pt-3">
                     <button
-                      onClick={() => handleNavigation('/login')}
-                      className="w-full flex items-center px-4 py-3 rounded-lg text-base font-medium transition-all min-h-touch text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary"
+                      type="button"
+                      onClick={handleLogout}
+                      className="w-full flex items-center px-3 py-3 rounded-lg text-sm text-danger-500 hover:bg-danger-500/10 transition-colors min-h-touch"
                     >
-                      <i className="fas fa-sign-in-alt w-6 text-lg" />
-                      <span className="ml-3">登录</span>
+                      <i className="fas fa-power-off w-4 mr-2.5" aria-hidden="true" />
+                      退出登录
                     </button>
-                    <button
-                      onClick={() => handleNavigation('/register')}
-                      className="w-full flex items-center px-4 py-3 rounded-lg text-base font-medium transition-all min-h-touch bg-gradient-to-r from-accent-primary to-accent-secondary text-white hover:shadow-glow-cyan"
-                    >
-                      <i className="fas fa-user-plus w-6 text-lg" />
-                      <span className="ml-3">注册</span>
-                    </button>
-                  </>
-                )}
-              </div>
-            </nav>
+                  </div>
+                </>
+              )}
 
-            {/* User Section at Bottom - removed to avoid duplication with mobile menu */}
+              {!user && (
+                <div className="grid gap-1 mt-2">
+                  <button
+                    type="button"
+                    onClick={() => handleNavigation('/login')}
+                    className="w-full flex items-center px-3 py-3 rounded-lg text-sm text-text-secondary hover:text-accent-primary hover:bg-dark-tertiary transition-colors min-h-touch"
+                  >
+                    <i className="fas fa-right-to-bracket w-4 mr-2.5" aria-hidden="true" />
+                    登录
+                  </button>
+                  <button
+                    type="button"
+                    onClick={() => handleNavigation('/register')}
+                    className="w-full flex items-center px-3 py-3 rounded-lg text-sm bg-accent-primary text-dark-primary font-bold hover:brightness-95 transition-colors min-h-touch"
+                  >
+                    <i className="fas fa-user-plus w-4 mr-2.5" aria-hidden="true" />
+                    注册
+                  </button>
+                </div>
+              )}
+            </nav>
           </div>
         </div>
       )}
diff --git a/web/frontend/src/components/conversation/Composer.tsx b/web/frontend/src/components/conversation/Composer.tsx
index f075b44..2a3ec0f 100644
--- a/web/frontend/src/components/conversation/Composer.tsx
+++ b/web/frontend/src/components/conversation/Composer.tsx
@@ -63,7 +63,7 @@ export function Composer({ onSend, onStop, isStreaming, disabled, placeholder }:
           <button
             onClick={submit}
             disabled={disabled || !value.trim()}
-            className="flex-shrink-0 w-11 h-11 rounded-xl bg-gradient-to-r from-accent-primary to-accent-secondary text-white flex items-center justify-center hover:shadow-glow-cyan transition-all disabled:opacity-40 disabled:cursor-not-allowed"
+            className="flex-shrink-0 w-11 h-11 rounded-xl bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary flex items-center justify-center hover:shadow-glow-cyan transition-all disabled:opacity-40 disabled:cursor-not-allowed"
             aria-label="发送"
           >
             <i className="fas fa-paper-plane" aria-hidden="true" />
diff --git a/web/frontend/src/components/conversation/LoginNudge.tsx b/web/frontend/src/components/conversation/LoginNudge.tsx
index 0c3d8d7..7506640 100644
--- a/web/frontend/src/components/conversation/LoginNudge.tsx
+++ b/web/frontend/src/components/conversation/LoginNudge.tsx
@@ -13,7 +13,7 @@ export function LoginNudge() {
       </div>
       <button
         onClick={() => router.push('/login')}
-        className="px-4 py-2 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-white text-sm font-medium hover:shadow-glow-cyan transition-all"
+        className="px-4 py-2 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary text-sm font-medium hover:shadow-glow-cyan transition-all"
       >
         登录 / 注册
       </button>
diff --git a/web/frontend/src/components/conversation/MessageBubble.tsx b/web/frontend/src/components/conversation/MessageBubble.tsx
index de8617c..612746d 100644
--- a/web/frontend/src/components/conversation/MessageBubble.tsx
+++ b/web/frontend/src/components/conversation/MessageBubble.tsx
@@ -30,7 +30,7 @@ export function MessageBubble({ message, reports }: MessageBubbleProps) {
         {/* Avatar */}
         <div
           className={`w-8 h-8 rounded-full flex items-center justify-center flex-shrink-0 ${
-            isUser ? 'bg-gradient-to-br from-accent-primary to-accent-secondary text-white' : 'bg-dark-tertiary text-accent-primary'
+            isUser ? 'bg-gradient-to-br from-accent-primary to-accent-secondary text-dark-primary' : 'bg-dark-tertiary text-accent-primary'
           }`}
           aria-hidden="true"
         >
@@ -42,7 +42,7 @@ export function MessageBubble({ message, reports }: MessageBubbleProps) {
           <div
             className={`rounded-2xl px-4 py-3 ${
               isUser
-                ? 'bg-gradient-to-br from-accent-primary to-accent-secondary text-white rounded-tr-sm'
+                ? 'bg-gradient-to-br from-accent-primary to-accent-secondary text-dark-primary rounded-tr-sm'
                 : 'bg-dark-secondary text-text-primary rounded-tl-sm border border-dark-border'
             }`}
           >
diff --git a/web/frontend/src/components/conversation/SessionSidebar.tsx b/web/frontend/src/components/conversation/SessionSidebar.tsx
index 91ae4bb..6ff19e9 100644
--- a/web/frontend/src/components/conversation/SessionSidebar.tsx
+++ b/web/frontend/src/components/conversation/SessionSidebar.tsx
@@ -34,7 +34,7 @@ export function SessionSidebar({ onClose }: { onClose?: () => void }) {
             createSession();
             onClose?.();
           }}
-          className="w-full flex items-center justify-center gap-2 px-3 py-2 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-white text-sm font-medium hover:shadow-glow-cyan transition-all"
+          className="w-full flex items-center justify-center gap-2 px-3 py-2 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary text-sm font-medium hover:shadow-glow-cyan transition-all"
         >
           <i className="fas fa-plus" aria-hidden="true" />
           新建对话
diff --git a/web/frontend/src/components/profile/AISettingsCard.tsx b/web/frontend/src/components/profile/AISettingsCard.tsx
index 1d330da..af911d1 100644
--- a/web/frontend/src/components/profile/AISettingsCard.tsx
+++ b/web/frontend/src/components/profile/AISettingsCard.tsx
@@ -53,7 +53,7 @@ export function AISettingsCard() {
         </div>
         <button
           onClick={() => router.push('/profile/ai-settings')}
-          className="px-6 py-3 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary transition-colors whitespace-nowrap ml-6"
+          className="px-6 py-3 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary focus:outline-none focus:ring-2 focus:ring-accent-primary transition-colors whitespace-nowrap ml-6"
         >
           <i className="fas fa-cog mr-2" />
           管理
diff --git a/web/frontend/src/components/profile/LocalKeyField.tsx b/web/frontend/src/components/profile/LocalKeyField.tsx
index b0b3267..6e9b404 100644
--- a/web/frontend/src/components/profile/LocalKeyField.tsx
+++ b/web/frontend/src/components/profile/LocalKeyField.tsx
@@ -205,7 +205,7 @@ export function LocalKeyField({ providerKey, providerLabel, baseUrl, providerId,
               type="button"
               onClick={handleSave}
               disabled={!apiKey.trim() || (!saveToBrowser && !onTest)}
-              className="px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+              className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
             >
               {saveToBrowser ? '保存 KEY' : '仅本次使用'}
             </button>
@@ -233,7 +233,7 @@ export function LocalKeyField({ providerKey, providerLabel, baseUrl, providerId,
               type="button"
               onClick={handleReplace}
               disabled={!apiKey.trim()}
-              className="px-4 py-2 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary disabled:opacity-50 transition-colors"
+              className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary disabled:opacity-50 transition-colors"
             >
               确认替换
             </button>
diff --git a/web/frontend/src/components/profile/ProviderFormDrawer.tsx b/web/frontend/src/components/profile/ProviderFormDrawer.tsx
index 2698509..6676fe4 100644
--- a/web/frontend/src/components/profile/ProviderFormDrawer.tsx
+++ b/web/frontend/src/components/profile/ProviderFormDrawer.tsx
@@ -227,7 +227,7 @@ export function ProviderFormDrawer({ provider, onClose, onSuccess }: ProviderFor
             <button
               onClick={handleSubmit}
               disabled={saving}
-              className="px-5 py-2.5 bg-accent-primary text-white rounded-lg hover:bg-accent-secondary disabled:opacity-50 transition-colors"
+              className="px-5 py-2.5 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary disabled:opacity-50 transition-colors"
             >
               {saving ? <i className="fas fa-spinner fa-spin mr-1" /> : null}
               {isEdit ? '保存修改' : '创建'}
diff --git a/web/frontend/src/components/ui/EmptyState.tsx b/web/frontend/src/components/ui/EmptyState.tsx
new file mode 100644
index 0000000..f10f190
--- /dev/null
+++ b/web/frontend/src/components/ui/EmptyState.tsx
@@ -0,0 +1,33 @@
+'use client';
+
+import React from 'react';
+
+/**
+ * Workflow Desk empty-state primitive.
+ * Use for filtered/empty lists, no-data results, etc. Pair with an actionable CTA.
+ */
+export interface EmptyStateProps {
+  /** Short glyph (Font Awesome class) or short text symbol. */
+  icon?: string;
+  title: string;
+  description?: string;
+  /** Optional call-to-action node (button / link). */
+  action?: React.ReactNode;
+}
+
+export function EmptyState({ icon = 'fa-circle-plus', title, description, action }: EmptyStateProps) {
+  return (
+    <div className="grid place-items-center text-center min-h-[230px] p-6 rounded-xl border border-dashed border-dark-border bg-dark-secondary/40">
+      <div>
+        <div className="mx-auto mb-3 w-12 h-12 rounded-full border border-dashed border-dark-border grid place-items-center text-text-tertiary">
+          <i className={`fas ${icon}`} aria-hidden="true" />
+        </div>
+        <h2 className="text-lg font-medium text-text-primary">{title}</h2>
+        {description && (
+          <p className="mt-1 max-w-md mx-auto text-sm text-text-secondary leading-relaxed">{description}</p>
+        )}
+        {action && <div className="mt-4">{action}</div>}
+      </div>
+    </div>
+  );
+}
diff --git a/web/frontend/src/components/ui/ErrorState.tsx b/web/frontend/src/components/ui/ErrorState.tsx
new file mode 100644
index 0000000..4264d81
--- /dev/null
+++ b/web/frontend/src/components/ui/ErrorState.tsx
@@ -0,0 +1,45 @@
+'use client';
+
+import React from 'react';
+
+/**
+ * Workflow Desk recoverable-error primitive.
+ * Use for failed fetches / data-source errors. Always offer a retry path.
+ */
+export interface ErrorStateProps {
+  title?: string;
+  description?: string;
+  /** Called when the user clicks "重试". Omit to hide the retry button. */
+  onRetry?: () => void;
+}
+
+export function ErrorState({
+  title = '加载失败',
+  description = '数据源暂时不可用，请稍后重试。',
+  onRetry,
+}: ErrorStateProps) {
+  return (
+    <div
+      role="alert"
+      className="grid place-items-center text-center min-h-[200px] p-6 rounded-xl border border-danger-500/40 bg-danger-500/10"
+    >
+      <div>
+        <div className="mx-auto mb-3 w-12 h-12 rounded-full border border-danger-500/40 grid place-items-center text-danger-500">
+          <i className="fas fa-triangle-exclamation" aria-hidden="true" />
+        </div>
+        <h2 className="text-lg font-medium text-danger-500">{title}</h2>
+        <p className="mt-1 max-w-md mx-auto text-sm text-text-secondary leading-relaxed">{description}</p>
+        {onRetry && (
+          <button
+            type="button"
+            onClick={onRetry}
+            className="mt-4 inline-flex items-center gap-2 rounded-lg bg-accent-primary text-dark-primary font-bold px-4 py-2 text-sm hover:brightness-95 transition-all min-h-touch"
+          >
+            <i className="fas fa-rotate-right" aria-hidden="true" />
+            重试
+          </button>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/web/frontend/src/lib/workflow-stages.test.ts b/web/frontend/src/lib/workflow-stages.test.ts
new file mode 100644
index 0000000..d72aa3f
--- /dev/null
+++ b/web/frontend/src/lib/workflow-stages.test.ts
@@ -0,0 +1,66 @@
+import { describe, it, expect } from 'vitest';
+import {
+  WORKFLOW_BANDS,
+  WORKFLOW_NODES,
+  AGENT_TO_BAND_INDEX,
+  AGENT_LABEL,
+} from './workflow-stages';
+
+describe('workflow-stages — GraphSetup fidelity', () => {
+  it('has exactly five bands in graph order', () => {
+    expect(WORKFLOW_BANDS).toHaveLength(5);
+    expect(WORKFLOW_BANDS.map((b) => b.id)).toEqual([1, 2, 3, 4, 5]);
+    expect(WORKFLOW_BANDS.map((b) => b.name)).toEqual([
+      '研究 / 数据采集',
+      '研究辩论',
+      '交易计划',
+      '风险审议',
+      '最终裁决',
+    ]);
+  });
+
+  it('exposes exactly the twelve real graph nodes (no auxiliary tools_*/Msg Clear)', () => {
+    expect(WORKFLOW_NODES).toHaveLength(12);
+    const nodes = WORKFLOW_NODES.map((n) => n.node);
+    // Real nodes from setup.py
+    expect(nodes).toEqual([
+      'Market Analyst',
+      'Social Analyst',
+      'News Analyst',
+      'Fundamentals Analyst',
+      'Bull Researcher',
+      'Bear Researcher',
+      'Research Manager',
+      'Trader',
+      'Risky Analyst',
+      'Safe Analyst',
+      'Neutral Analyst',
+      'Risk Judge',
+    ]);
+  });
+
+  it('keeps Risk Judge in a separate final band from the risk debate', () => {
+    const riskBand = WORKFLOW_BANDS[3]!;
+    const finalBand = WORKFLOW_BANDS[4]!;
+    // Band 4 = the fixed Risky → Safe → Neutral rotation.
+    expect(riskBand.agents).toEqual(['risky', 'safe', 'neutral']);
+    // Band 5 = Risk Judge only (terminal node).
+    expect(finalBand.agents).toEqual(['risk_manager']);
+    expect(finalBand.nodes[0]!.node).toBe('Risk Judge');
+  });
+
+  it('routes every backend agent code to the correct band index', () => {
+    expect(AGENT_TO_BAND_INDEX.market).toBe(0);
+    expect(AGENT_TO_BAND_INDEX.bull).toBe(1);
+    expect(AGENT_TO_BAND_INDEX.invest_judge).toBe(1); // Research Manager ends the debate band
+    expect(AGENT_TO_BAND_INDEX.trader).toBe(2);
+    expect(AGENT_TO_BAND_INDEX.risky).toBe(3);
+    expect(AGENT_TO_BAND_INDEX.risk_manager).toBe(4); // Risk Judge is its own final band
+  });
+
+  it('gives Research Manager and Risk Judge distinct, unambiguous labels', () => {
+    expect(AGENT_LABEL.invest_judge).toBe('研究经理');
+    expect(AGENT_LABEL.risk_manager).toBe('风险裁决');
+    expect(AGENT_LABEL.invest_judge).not.toBe(AGENT_LABEL.risk_manager);
+  });
+});
diff --git a/web/frontend/src/lib/workflow-stages.ts b/web/frontend/src/lib/workflow-stages.ts
new file mode 100644
index 0000000..7119fce
--- /dev/null
+++ b/web/frontend/src/lib/workflow-stages.ts
@@ -0,0 +1,143 @@
+/**
+ * Canonical TradingAgents workflow stage model.
+ *
+ * Translated directly from `tradingagents/graph/setup.py` (`setup_graph`) and
+ * `tradingagents/graph/conditional_logic.py` — NOT a hand-maintained fake pipeline.
+ *
+ * Five bands, twelve real nodes (auxiliary `tools_*` / `Msg Clear *` nodes are
+ * intentionally hidden from the UI):
+ *
+ *   1. Research           — Market → Social → News → Fundamentals (each loops its tools)
+ *   2. Research debate    — Bull ↔ Bear (alternating, max_debate_rounds each) → Research Manager
+ *   3. Trading plan       — Trader (recommendation only; no order execution)
+ *   4. Risk review        — Risky → Safe → Neutral (fixed rotation, max_risk_discuss_rounds each)
+ *   5. Final              — Risk Judge (terminal node; emits final_trade_decision + investment_plan)
+ *
+ * `agent` codes align with the backend `node_to_agent_map`
+ * (`web/backend/analysis_task.py`) carried by the analysis WebSocket `log` events.
+ */
+
+export type AgentStatusCode =
+  | 'system'
+  | 'market'
+  | 'social'
+  | 'news'
+  | 'fundamentals'
+  | 'bull'
+  | 'bear'
+  | 'invest_judge'
+  | 'trader'
+  | 'risky'
+  | 'safe'
+  | 'neutral'
+  | 'risk_manager';
+
+export interface WorkflowNode {
+  /** Backend `data.agent` code carried on WS log events. */
+  agent: AgentStatusCode;
+  /** Graph node title (matches `workflow.add_node` name in setup.py). */
+  node: string;
+  /** Chinese display name. */
+  label: string;
+  /** One-line role description shown in the UI. */
+  summary: string;
+}
+
+export interface WorkflowBand {
+  id: number;
+  /** Short uppercase id for the stage rail, e.g. "01 / RESEARCH". */
+  code: string;
+  name: string;
+  description: string;
+  /** Agent codes that belong to this band (used to route live events). */
+  agents: AgentStatusCode[];
+  nodes: WorkflowNode[];
+}
+
+export const WORKFLOW_BANDS: WorkflowBand[] = [
+  {
+    id: 1,
+    code: '01 / RESEARCH',
+    name: '研究 / 数据采集',
+    description: '依次执行各分析师；工具调用完成后传递到下一个节点。',
+    agents: ['system', 'market', 'social', 'news', 'fundamentals'],
+    nodes: [
+      { agent: 'market', node: 'Market Analyst', label: '市场分析师', summary: '价格、成交量与技术指标。' },
+      { agent: 'social', node: 'Social Analyst', label: '社交分析师', summary: '社交讨论与情绪信号。' },
+      { agent: 'news', node: 'News Analyst', label: '新闻分析师', summary: '新闻、内幕情绪与全球事件。' },
+      { agent: 'fundamentals', node: 'Fundamentals Analyst', label: '基本面分析师', summary: '财务、现金流与估值。' },
+    ],
+  },
+  {
+    id: 2,
+    code: '02 / DEBATE',
+    name: '研究辩论',
+    description: 'Bull Researcher 与 Bear Researcher 交替论证（max_debate_rounds），Research Manager 负责裁决。',
+    agents: ['bull', 'bear', 'invest_judge'],
+    nodes: [
+      { agent: 'bull', node: 'Bull Researcher', label: '多头研究员', summary: '看多论点与证据。' },
+      { agent: 'bear', node: 'Bear Researcher', label: '空头研究员', summary: '看空论点与证据。' },
+      { agent: 'invest_judge', node: 'Research Manager', label: '研究经理', summary: '汇总多空分歧并产出投资计划。' },
+    ],
+  },
+  {
+    id: 3,
+    code: '03 / PLAN',
+    name: '交易计划',
+    description: 'Trader 使用研究裁决与行情工具生成建议；这里只生成计划，不执行订单。',
+    agents: ['trader'],
+    nodes: [
+      { agent: 'trader', node: 'Trader', label: '交易员', summary: '生成交易建议计划。' },
+    ],
+  },
+  {
+    id: 4,
+    code: '04 / RISK',
+    name: '风险审议',
+    description: 'Risky → Safe → Neutral 按固定轮转讨论仓位与风险（max_risk_discuss_rounds）。',
+    agents: ['risky', 'safe', 'neutral'],
+    nodes: [
+      { agent: 'risky', node: 'Risky Analyst', label: '激进风险分析师', summary: '激进视角的风险意见。' },
+      { agent: 'safe', node: 'Safe Analyst', label: '保守风险分析师', summary: '保守视角的风险意见。' },
+      { agent: 'neutral', node: 'Neutral Analyst', label: '中性风险分析师', summary: '中性视角的风险意见。' },
+    ],
+  },
+  {
+    id: 5,
+    code: '05 / FINAL',
+    name: '最终裁决',
+    description: 'Risk Judge 汇总三方意见，输出最终交易建议与风险边界（终末节点）。',
+    agents: ['risk_manager'],
+    nodes: [
+      { agent: 'risk_manager', node: 'Risk Judge', label: '风险裁决', summary: '产出最终交易决策与投资计划。' },
+    ],
+  },
+];
+
+/**
+ * Maps a backend agent code to its band index (0-based) in WORKFLOW_BANDS.
+ * Mirrors the routing in `setup.py` so live events land in the correct band.
+ */
+export const AGENT_TO_BAND_INDEX: Record<string, number> = WORKFLOW_BANDS.reduce(
+  (acc, band, index) => {
+    band.agents.forEach((agent) => {
+      acc[agent] = index;
+    });
+    return acc;
+  },
+  {} as Record<string, number>,
+);
+
+/** Chinese display name for a backend agent code. */
+export const AGENT_LABEL: Record<string, string> = WORKFLOW_BANDS.reduce(
+  (acc, band) => {
+    band.nodes.forEach((node) => {
+      acc[node.agent] = node.label;
+    });
+    return acc;
+  },
+  {} as Record<string, string>,
+);
+
+/** Flat ordered list of the twelve real graph nodes (auxiliary nodes excluded). */
+export const WORKFLOW_NODES: WorkflowNode[] = WORKFLOW_BANDS.flatMap((band) => band.nodes);
diff --git a/web/frontend/tailwind.config.js b/web/frontend/tailwind.config.js
index 3662fd2..1c7a140 100644
--- a/web/frontend/tailwind.config.js
+++ b/web/frontend/tailwind.config.js
@@ -7,30 +7,33 @@ module.exports = {
   ],
   theme: {
     extend: {
-      // Dark Fintech Theme Colors
+      // Workflow Desk — a precise research instrument.
+      // Deep blue-black surfaces, mint for the decisive action / current stage,
+      // sky blue for structural flow, amber/red for warning/error.
       colors: {
-        // Dark backgrounds (not pure black for reduced eye strain)
+        // Dark surfaces (mapped 1:1 onto the prior semantic tokens so the whole
+        // app re-skins without per-file edits).
         dark: {
-          primary: '#0a0e1a',    // Main background
-          secondary: '#141824',  // Card backgrounds
-          tertiary: '#1a1f2e',   // Input backgrounds
-          elevated: '#1f2937',   // Elevated surfaces
-          border: '#2d3748',     // Default borders
+          primary: '#0a0d12',   // ink — application background  (was #0a0e1a)
+          secondary: '#171f2b', // surface — panels / cards        (was #141824)
+          tertiary: '#202b39',  // raised — hover / secondary btns (was #1a1f2e)
+          elevated: '#27333f',  // elevated surfaces               (was #1f2937)
+          border: '#304154',    // structural line                 (was #2d3748)
         },
-        // Fintech accent colors (blue/cyan)
+        // Workflow Desk accents
         accent: {
-          primary: '#00d4ff',    // Primary cyan
-          secondary: '#0066ff',  // Secondary blue
-          tertiary: '#00a8e8',   // Tertiary blue
-          hover: '#00d4ff',      // Hover state
-          focus: '#0066ff',      // Focus state
+          primary: '#9bffbe',   // mint — primary action / current stage / success
+          secondary: '#8acbff', // sky blue — flow / node identity
+          tertiary: '#5fb6e8',  // tertiary blue
+          hover: '#9bffbe',     // hover state (mint)
+          focus: '#8acbff',     // focus state (blue)
         },
-        // Text colors for dark theme
+        // Text colors for the dark theme
         text: {
-          primary: '#ffffff',    // Primary text
-          secondary: '#a0aec0',  // Secondary text
-          tertiary: '#718096',   // Tertiary text
-          muted: '#4a5568',      // Muted text
+          primary: '#f1f5f7',   // primary text
+          secondary: '#9aa9b8', // secondary text
+          tertiary: '#68798a',  // tertiary text
+          muted: '#4a5568',     // muted text
         },
         // Keep existing color schemes for compatibility
         primary: {
@@ -63,7 +66,7 @@ module.exports = {
           200: '#bbf7d0',
           300: '#86efac',
           400: '#4ade80',
-          500: '#00ff88',      // Updated for dark theme
+          500: '#3ddc97',      // Workflow Desk mint-family success
           600: '#16a34a',
           700: '#15803d',
           800: '#166534',
@@ -75,7 +78,7 @@ module.exports = {
           200: '#fecaca',
           300: '#fca5a5',
           400: '#f87171',
-          500: '#ff3366',      // Updated for dark theme
+          500: '#ff6b81',      // Workflow Desk red-family danger
           600: '#dc2626',
           700: '#b91c1c',
           800: '#991b1b',
@@ -87,7 +90,7 @@ module.exports = {
           200: '#fde68a',
           300: '#fcd34d',
           400: '#fbbf24',
-          500: '#ffaa00',      // Updated for dark theme
+          500: '#ffc66c',      // Workflow Desk amber
           600: '#d97706',
           700: '#b45309',
           800: '#92400e',
@@ -99,13 +102,19 @@ module.exports = {
           200: '#bae6fd',
           300: '#7dd3fc',
           400: '#38bdf8',
-          500: '#00d4ff',      // Updated for dark theme
+          500: '#8acbff',      // Workflow Desk blue
           600: '#0284c7',
           700: '#0369a1',
           800: '#075985',
           900: '#0c4a6e',
         },
       },
+      // Workflow Desk typography
+      fontFamily: {
+        sans: ['"Noto Sans SC"', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif'],
+        serif: ['"Instrument Serif"', 'ui-serif', 'Georgia', '"Times New Roman"', 'serif'],
+        mono: ['"DM Mono"', 'ui-monospace', 'SFMono-Regular', 'Menlo', 'Consolas', 'monospace'],
+      },
       // Bootstrap-compatible spacing
       spacing: {
         '0.5': '0.125rem', // 2px
@@ -130,6 +139,7 @@ module.exports = {
         'safe-left': 'env(safe-area-inset-left)',
         'safe-right': 'env(safe-area-inset-right)',
         'touch': '2.75rem', // 44px - minimum touch target
+        'rail': '15.5rem',  // 248px - desktop research rail width
       },
       // Bootstrap-compatible font sizes
       fontSize: {
@@ -156,34 +166,38 @@ module.exports = {
         '3xl': '1.5rem',
         'full': '9999px',
       },
-      // Custom box shadows for dark theme
+      // Workflow Desk shadows
       boxShadow: {
-        'glow-cyan': '0 0 20px rgba(0, 212, 255, 0.3), 0 0 40px rgba(0, 212, 255, 0.1)',
-        'glow-cyan-lg': '0 0 30px rgba(0, 212, 255, 0.5), 0 0 60px rgba(0, 212, 255, 0.2)',
+        // Name kept as glow-cyan so existing utilities keep working; value is now mint-tinted.
+        'glow-cyan': '0 0 20px rgba(155, 255, 190, 0.28), 0 0 40px rgba(155, 255, 190, 0.10)',
+        'glow-cyan-lg': '0 0 30px rgba(155, 255, 190, 0.45), 0 0 60px rgba(155, 255, 190, 0.18)',
+        'glow-blue': '0 0 20px rgba(138, 203, 255, 0.25), 0 0 40px rgba(138, 203, 255, 0.08)',
         'card-dark': '0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2)',
         'elevated-dark': '0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.2)',
+        'panel': '0 20px 55px rgba(0, 0, 0, 0.22)',
       },
       // Custom background images for gradients
       backgroundImage: {
-        'gradient-hero': 'linear-gradient(135deg, #0a0e1a 0%, #1a1f2e 50%, #0f1419 100%)',
-        'gradient-card': 'linear-gradient(145deg, #141824 0%, #1a1f2e 100%)',
-        'gradient-button': 'linear-gradient(90deg, #00d4ff 0%, #0066ff 100%)',
+        'gradient-hero': 'linear-gradient(135deg, #0a0d12 0%, #111720 50%, #0a0d12 100%)',
+        'gradient-card': 'linear-gradient(145deg, #111720 0%, #171f2b 100%)',
+        'gradient-button': 'linear-gradient(90deg, #9bffbe 0%, #8acbff 100%)',
         'gradient-radial': 'radial-gradient(circle at center, var(--tw-gradient-stops))',
       },
       // Custom animations
       animation: {
         'glow-pulse': 'glow-pulse 2s ease-in-out infinite',
         'shimmer': 'shimmer 2s infinite',
-        'float': 'float 3s ease-in-out infinite',
+        'float': 'float 3s ease-in-out',
         'spin-reverse': 'spin-reverse 1s linear infinite',
+        'workflow-in': 'workflow-in 0.22s ease-out',
       },
       keyframes: {
         'glow-pulse': {
           '0%, 100%': {
-            boxShadow: '0 0 20px rgba(0, 212, 255, 0.3), 0 0 40px rgba(0, 212, 255, 0.1)',
+            boxShadow: '0 0 20px rgba(155, 255, 190, 0.28), 0 0 40px rgba(155, 255, 190, 0.10)',
           },
           '50%': {
-            boxShadow: '0 0 30px rgba(0, 212, 255, 0.5), 0 0 60px rgba(0, 212, 255, 0.2)',
+            boxShadow: '0 0 30px rgba(155, 255, 190, 0.45), 0 0 60px rgba(155, 255, 190, 0.18)',
           },
         },
         'shimmer': {
@@ -210,6 +224,10 @@ module.exports = {
             transform: 'rotate(0deg)',
           },
         },
+        'workflow-in': {
+          '0%': { opacity: '0', transform: 'translateY(7px)' },
+          '100%': { opacity: '1', transform: 'none' },
+        },
       },
       // Custom backdrop blur
       backdropBlur: {
@@ -230,4 +248,4 @@ module.exports = {
     },
   },
   plugins: [],
-}
\ No newline at end of file
+}

From 2976f1f76d5365b023b49c56cc0a4d6163ae6f66 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=BF=90=E7=BB=B4=E5=B7=A5=E7=A8=8B=E5=B8=88?=
 <devops-agent@multica.local>
Date: Mon, 13 Jul 2026 09:38:32 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix(WS-90):=20=E4=BF=AE=E5=A4=8D=E6=A8=A1?=
 =?UTF-8?q?=E5=9E=8B=E9=80=89=E6=8B=A9=E4=B8=8E=E6=B5=81=E7=A8=8B=E7=8A=B6?=
 =?UTF-8?q?=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: multica-agent <github@multica.ai>
---
 .../src/app/admin/llm-config/page.tsx         | 37 +++++----
 .../admin/system-default-provider/page.tsx    | 10 +--
 web/frontend/src/app/admin/users/page.tsx     | 34 ++------
 web/frontend/src/app/analysis/page.tsx        | 29 ++-----
 web/frontend/src/app/auth/page.tsx            | 12 +--
 web/frontend/src/app/error.tsx                | 12 +++
 web/frontend/src/app/history/detail/page.tsx  | 29 ++-----
 web/frontend/src/app/history/page.tsx         | 10 +--
 .../src/app/history/progress/page.tsx         | 29 ++-----
 web/frontend/src/app/loading.tsx              |  6 ++
 web/frontend/src/app/not-found.tsx            | 31 +++----
 web/frontend/src/app/page.tsx                 |  7 +-
 .../src/app/profile/ai-settings/page.tsx      | 23 ++++--
 web/frontend/src/app/profile/page.tsx         | 10 +--
 web/frontend/src/app/scheduled-tasks/page.tsx | 46 +++--------
 .../SystemDefaultForm.tsx                     | 19 ++++-
 .../components/analysis/AnalysisHistory.tsx   | 47 ++++++-----
 .../analysis/AnalysisProgress.test.tsx        | 82 +++++++++++++++++++
 .../components/analysis/AnalysisProgress.tsx  | 29 +++++--
 .../components/analysis/AnalysisResults.tsx   | 25 +++---
 .../analysis/ModelSelector.test.tsx           | 40 +++++++++
 .../src/components/analysis/ModelSelector.tsx | 24 +++++-
 web/frontend/src/lib/types.ts                 |  2 +
 23 files changed, 326 insertions(+), 267 deletions(-)
 create mode 100644 web/frontend/src/app/error.tsx
 create mode 100644 web/frontend/src/app/loading.tsx
 create mode 100644 web/frontend/src/components/analysis/AnalysisProgress.test.tsx

diff --git a/web/frontend/src/app/admin/llm-config/page.tsx b/web/frontend/src/app/admin/llm-config/page.tsx
index 694402c..66cf7f3 100644
--- a/web/frontend/src/app/admin/llm-config/page.tsx
+++ b/web/frontend/src/app/admin/llm-config/page.tsx
@@ -10,6 +10,8 @@ import { AppNavbar } from '@/components/common/AppNavbar';
 import { Footer } from '@/components/common/Footer';
 import { ProviderList } from '@/components/admin/llm-config/ProviderList';
 import { ModelList } from '@/components/admin/llm-config/ModelList';
+import { PageLoading } from '@/components/ui/PageLoading';
+import { ErrorState } from '@/components/ui/ErrorState';
 import { ProviderForm } from '@/components/admin/llm-config/ProviderForm';
 import { ModelForm } from '@/components/admin/llm-config/ModelForm';
 import { ConfirmDialog } from '@/components/admin/llm-config/ConfirmDialog';
@@ -47,7 +49,7 @@ export default function LLMConfigPage() {
   }, [user, authLoading, router]);
 
   // 获取供应商列表
-  const { data: providers, isLoading: providersLoading, refetch: refetchProviders } = useQuery({
+  const { data: providers, isLoading: providersLoading, isError: providersError, error: providersLoadError, refetch: refetchProviders } = useQuery({
     queryKey: ['admin', 'llm-providers'],
     queryFn: async () => {
       const token = localStorage.getItem('access_token');
@@ -61,7 +63,7 @@ export default function LLMConfigPage() {
   });
 
   // 获取模型列表
-  const { data: models, isLoading: modelsLoading, refetch: refetchModels } = useQuery({
+  const { data: models, isLoading: modelsLoading, isError: modelsError, error: modelsLoadError, refetch: refetchModels } = useQuery({
     queryKey: ['admin', 'llm-models'],
     queryFn: async () => {
       const token = localStorage.getItem('access_token');
@@ -164,14 +166,7 @@ export default function LLMConfigPage() {
   };
 
   if (authLoading || !user || user.role !== 'admin') {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在验证管理员权限..." />;
   }
 
   return (
@@ -236,10 +231,13 @@ export default function LLMConfigPage() {
             </div>
 
             {providersLoading ? (
-              <div className="text-center py-12">
-                <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-                <p className="text-text-secondary">加载中...</p>
-              </div>
+              <PageLoading message="正在加载供应商目录..." />
+            ) : providersError ? (
+              <ErrorState
+                title="供应商目录加载失败"
+                description={providersLoadError instanceof Error ? providersLoadError.message : '无法读取供应商目录。'}
+                onRetry={() => refetchProviders()}
+              />
             ) : (
               <ProviderList
                 providers={providers || []}
@@ -269,10 +267,13 @@ export default function LLMConfigPage() {
             </div>
 
             {modelsLoading ? (
-              <div className="text-center py-12">
-                <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-                <p className="text-text-secondary">加载中...</p>
-              </div>
+              <PageLoading message="正在加载模型目录..." />
+            ) : modelsError ? (
+              <ErrorState
+                title="模型目录加载失败"
+                description={modelsLoadError instanceof Error ? modelsLoadError.message : '无法读取模型目录。'}
+                onRetry={() => refetchModels()}
+              />
             ) : (
               <ModelList
                 models={models || []}
diff --git a/web/frontend/src/app/admin/system-default-provider/page.tsx b/web/frontend/src/app/admin/system-default-provider/page.tsx
index 4e53ad3..02ba3cd 100644
--- a/web/frontend/src/app/admin/system-default-provider/page.tsx
+++ b/web/frontend/src/app/admin/system-default-provider/page.tsx
@@ -7,6 +7,7 @@ import { useAuth } from '@/lib/auth';
 import { AppNavbar } from '@/components/common/AppNavbar';
 import { Footer } from '@/components/common/Footer';
 import { SystemDefaultForm } from '@/components/admin/system-default-provider/SystemDefaultForm';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function SystemDefaultProviderPage() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -20,14 +21,7 @@ export default function SystemDefaultProviderPage() {
   }, [user, authLoading, router]);
 
   if (authLoading || !user || user.role !== 'admin') {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" aria-hidden="true" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在验证管理员权限..." />;
   }
 
   return (
diff --git a/web/frontend/src/app/admin/users/page.tsx b/web/frontend/src/app/admin/users/page.tsx
index 1ce3af7..5624676 100644
--- a/web/frontend/src/app/admin/users/page.tsx
+++ b/web/frontend/src/app/admin/users/page.tsx
@@ -11,6 +11,9 @@ import { AppNavbar } from '@/components/common/AppNavbar';
 import { Footer } from '@/components/common/Footer';
 import { ResponsiveUserCard } from '@/components/admin/ResponsiveUserCard';
 import { useIsMobile } from '@/hooks/useMediaQuery';
+import { EmptyState } from '@/components/ui/EmptyState';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 interface User {
   id: number;
@@ -278,14 +281,7 @@ export default function UserManagementPage() {
   };
 
   if (authLoading || !user || user.role !== 'admin') {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在验证管理员权限..." />;
   }
 
   return (
@@ -367,21 +363,9 @@ export default function UserManagementPage() {
           </div>
 
           {isLoading ? (
-            <div className="p-12 text-center">
-              <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-              <p className="text-text-secondary">加载中...</p>
-            </div>
+            <PageLoading message="正在加载用户列表..." />
           ) : isError ? (
-            <div className="p-12 text-center">
-              <i className="fas fa-exclamation-triangle text-4xl text-danger-500 mb-4" />
-              <p className="text-text-secondary mb-4">加载失败</p>
-              <button
-                onClick={() => refetch()}
-                className="px-4 py-2 bg-accent-primary text-dark-primary rounded-lg hover:bg-accent-secondary"
-              >
-                重试
-              </button>
-            </div>
+            <ErrorState title="用户列表加载失败" onRetry={() => refetch()} />
           ) : data && data.users.length > 0 ? (
             <>
               {isMobile ? (
@@ -514,11 +498,7 @@ export default function UserManagementPage() {
               )}
             </>
           ) : (
-            <div className="p-12 text-center">
-              <div className="text-text-muted text-6xl mb-4">👥</div>
-              <h3 className="text-lg font-medium text-text-primary mb-2">暂无用户</h3>
-              <p className="text-text-secondary">系统中还没有注册用户</p>
-            </div>
+            <EmptyState icon="fa-users" title="暂无用户" description="系统中还没有注册用户。" />
           )}
         </div>
       </div>
diff --git a/web/frontend/src/app/analysis/page.tsx b/web/frontend/src/app/analysis/page.tsx
index 71bd70e..2ad6107 100644
--- a/web/frontend/src/app/analysis/page.tsx
+++ b/web/frontend/src/app/analysis/page.tsx
@@ -7,6 +7,8 @@ import { AnalysisResults } from '@/components/analysis/AnalysisResults';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { Footer } from '@/components/common/Footer';
 import { AppNavbar } from '@/components/common/AppNavbar';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 function AnalysisDetailContent() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -70,25 +72,11 @@ function AnalysisDetailContent() {
   }, []);
 
   if (!analysisId) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-exclamation-triangle text-4xl text-danger-500 mb-4" />
-          <p className="text-text-secondary">缺少分析 ID</p>
-        </div>
-      </div>
-    );
+    return <ErrorState title="缺少分析 ID" description="请从分析历史或排行榜重新打开报告。" onRetry={handleBackToHome} />;
   }
 
   if (!fromLeaderboard && (authLoading || !user)) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在加载分析报告..." />;
   }
 
   const scrollToTop = () => {
@@ -167,14 +155,7 @@ function AnalysisDetailContent() {
 
 export default function AnalysisDetailPage() {
   return (
-    <Suspense fallback={
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    }>
+    <Suspense fallback={<PageLoading message="正在加载分析报告..." />}>
       <AnalysisDetailContent />
     </Suspense>
   );
diff --git a/web/frontend/src/app/auth/page.tsx b/web/frontend/src/app/auth/page.tsx
index 529f37b..e5a8678 100644
--- a/web/frontend/src/app/auth/page.tsx
+++ b/web/frontend/src/app/auth/page.tsx
@@ -2,6 +2,7 @@
 
 import { useEffect } from 'react';
 import { useRouter } from 'next/navigation';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function AuthPage() {
   const router = useRouter();
@@ -10,12 +11,5 @@ export default function AuthPage() {
     router.replace('/login');
   }, [router]);
 
-  return (
-    <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-      <div className="text-center">
-        <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-        <p className="text-text-secondary">重定向中...</p>
-      </div>
-    </div>
-  );
-}
\ No newline at end of file
+  return <PageLoading message="正在跳转到登录页..." />;
+}
diff --git a/web/frontend/src/app/error.tsx b/web/frontend/src/app/error.tsx
new file mode 100644
index 0000000..b563ec2
--- /dev/null
+++ b/web/frontend/src/app/error.tsx
@@ -0,0 +1,12 @@
+'use client';
+
+import { ErrorState } from '@/components/ui/ErrorState';
+
+/** Route-level recovery boundary shared by every existing App Router page. */
+export default function GlobalError({ reset }: { error: Error & { digest?: string }; reset: () => void }) {
+  return (
+    <main className="min-h-screen bg-dark-primary px-4 py-12 flex items-center justify-center">
+      <ErrorState title="页面暂时不可用" description="加载页面时发生了问题，请重试。" onRetry={reset} />
+    </main>
+  );
+}
diff --git a/web/frontend/src/app/history/detail/page.tsx b/web/frontend/src/app/history/detail/page.tsx
index 0efb23c..9da97f5 100644
--- a/web/frontend/src/app/history/detail/page.tsx
+++ b/web/frontend/src/app/history/detail/page.tsx
@@ -7,6 +7,8 @@ import { AnalysisResults } from '@/components/analysis/AnalysisResults';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { Footer } from '@/components/common/Footer';
 import { AppNavbar } from '@/components/common/AppNavbar';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 function HistoryDetailContent() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -54,25 +56,11 @@ function HistoryDetailContent() {
   }, []);
 
   if (!analysisId) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-exclamation-triangle text-4xl text-danger-500 mb-4" />
-          <p className="text-text-secondary">缺少分析 ID</p>
-        </div>
-      </div>
-    );
+    return <ErrorState title="缺少分析 ID" description="请从分析历史重新打开报告。" onRetry={handleBackToHistory} />;
   }
 
   if (authLoading || !user) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在加载分析详情..." />;
   }
 
   const scrollToTop = () => {
@@ -142,14 +130,7 @@ function HistoryDetailContent() {
 
 export default function HistoryDetailPage() {
   return (
-    <Suspense fallback={
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    }>
+    <Suspense fallback={<PageLoading message="正在加载分析详情..." />}>
       <HistoryDetailContent />
     </Suspense>
   );
diff --git a/web/frontend/src/app/history/page.tsx b/web/frontend/src/app/history/page.tsx
index 34b7771..08a6fa7 100644
--- a/web/frontend/src/app/history/page.tsx
+++ b/web/frontend/src/app/history/page.tsx
@@ -7,6 +7,7 @@ import { AnalysisHistory } from '@/components/analysis/AnalysisHistory';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { Footer } from '@/components/common/Footer';
 import { AppNavbar } from '@/components/common/AppNavbar';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function HistoryPage() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -29,14 +30,7 @@ export default function HistoryPage() {
 
   // 如果正在认证检查，显示加载状态
   if (authLoading || !user) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在加载分析历史..." />;
   }
 
   return (
diff --git a/web/frontend/src/app/history/progress/page.tsx b/web/frontend/src/app/history/progress/page.tsx
index aa6ceea..0afb68d 100644
--- a/web/frontend/src/app/history/progress/page.tsx
+++ b/web/frontend/src/app/history/progress/page.tsx
@@ -7,6 +7,8 @@ import { AnalysisProgress } from '@/components/analysis/AnalysisProgress';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { Footer } from '@/components/common/Footer';
 import { AppNavbar } from '@/components/common/AppNavbar';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 function HistoryProgressContent() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -43,25 +45,11 @@ function HistoryProgressContent() {
   }, [user, authLoading, router]);
 
   if (!analysisId) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-exclamation-triangle text-4xl text-danger-500 mb-4" />
-          <p className="text-text-secondary">缺少分析 ID</p>
-        </div>
-      </div>
-    );
+    return <ErrorState title="缺少分析 ID" description="请从分析历史重新打开进度。" onRetry={handleBackToHistory} />;
   }
 
   if (authLoading || !user) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在连接分析进度..." />;
   }
 
   return (
@@ -116,14 +104,7 @@ function HistoryProgressContent() {
 
 export default function HistoryProgressPage() {
   return (
-    <Suspense fallback={
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    }>
+    <Suspense fallback={<PageLoading message="正在连接分析进度..." />}>
       <HistoryProgressContent />
     </Suspense>
   );
diff --git a/web/frontend/src/app/loading.tsx b/web/frontend/src/app/loading.tsx
new file mode 100644
index 0000000..24cb1f0
--- /dev/null
+++ b/web/frontend/src/app/loading.tsx
@@ -0,0 +1,6 @@
+import { PageLoading } from '@/components/ui/PageLoading';
+
+/** Route-level loading fallback shared by every existing App Router page. */
+export default function Loading() {
+  return <PageLoading message="正在打开工作台..." />;
+}
diff --git a/web/frontend/src/app/not-found.tsx b/web/frontend/src/app/not-found.tsx
index bc7e0f6..669a15c 100644
--- a/web/frontend/src/app/not-found.tsx
+++ b/web/frontend/src/app/not-found.tsx
@@ -2,6 +2,7 @@
 
 import { useEffect } from 'react';
 import { useRouter } from 'next/navigation';
+import { EmptyState } from '@/components/ui/EmptyState';
 
 /**
  * 全局 404 页面（WS-4 M5-S3 旧路由收口）。
@@ -21,24 +22,18 @@ export default function NotFound() {
 
   return (
     <div className="min-h-screen flex items-center justify-center bg-dark-primary px-4">
-      <div className="max-w-md w-full text-center">
-        <div className="mb-6">
-          <i className="fas fa-comments text-6xl text-accent-primary" />
-        </div>
-        <h1 className="text-3xl font-bold text-text-primary mb-2">页面已迁移</h1>
-        <p className="text-text-secondary mb-1">
-          您访问的页面已下线或已合并至对话式分析工作台。
-        </p>
-        <p className="text-text-tertiary text-sm mb-8">
-          即将在几秒后自动跳转到对话工作台…
-        </p>
-        <a
-          href="/"
-          className="inline-flex items-center justify-center px-6 py-3 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary font-semibold hover:shadow-glow-cyan transition-all"
-        >
-          <i className="fas fa-arrow-right mr-2" />
-          前往对话工作台
-        </a>
+      <div className="max-w-md w-full">
+        <EmptyState
+          icon="fa-comments"
+          title="页面已迁移"
+          description="您访问的页面已下线或已合并至对话式分析工作台，即将在几秒后自动跳转。"
+          action={
+            <a href="/" className="inline-flex items-center justify-center px-6 py-3 rounded-lg bg-gradient-to-r from-accent-primary to-accent-secondary text-dark-primary font-semibold hover:shadow-glow-cyan transition-all">
+              <i className="fas fa-arrow-right mr-2" />
+              前往对话工作台
+            </a>
+          }
+        />
       </div>
     </div>
   );
diff --git a/web/frontend/src/app/page.tsx b/web/frontend/src/app/page.tsx
index ce00aaa..e1405a8 100644
--- a/web/frontend/src/app/page.tsx
+++ b/web/frontend/src/app/page.tsx
@@ -5,16 +5,13 @@ import { useAuth } from '@/lib/auth';
 import { ConversationProvider } from '@/lib/conversation-context';
 import { AppNavbar } from '@/components/common/AppNavbar';
 import { ConversationWorkbench } from '@/components/conversation/ConversationWorkbench';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function HomePage() {
   const { user, logout, isLoading } = useAuth();
 
   if (isLoading) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <i className="fas fa-spinner fa-spin text-2xl text-accent-primary" aria-hidden="true" />
-      </div>
-    );
+    return <PageLoading message="正在恢复工作台..." />;
   }
 
   return (
diff --git a/web/frontend/src/app/profile/ai-settings/page.tsx b/web/frontend/src/app/profile/ai-settings/page.tsx
index 1de3e6d..a12a22b 100644
--- a/web/frontend/src/app/profile/ai-settings/page.tsx
+++ b/web/frontend/src/app/profile/ai-settings/page.tsx
@@ -12,6 +12,8 @@ import { ConfirmDialog } from '@/components/admin/llm-config/ConfirmDialog';
 import ProviderList from '@/components/profile/ProviderList';
 import ProviderFormDrawer from '@/components/profile/ProviderFormDrawer';
 import { UserLLMProviderSetting } from '@/lib/types';
+import { PageLoading } from '@/components/ui/PageLoading';
+import { ErrorState } from '@/components/ui/ErrorState';
 
 function providerKeyOf(p: { provider_name?: string; id?: string | number }): string {
   return String(p.provider_name || p.id || '').trim();
@@ -21,7 +23,7 @@ export default function AISettingsPage() {
   const { user, logout, isLoading: authLoading } = useAuth();
   const router = useRouter();
   const { toast, showToast, hideToast } = useToast();
-  const { data, isLoading, setDefault, deleteProvider } = useUserLLMSettings();
+  const { data, isLoading, isError, error, refetch, setDefault, deleteProvider } = useUserLLMSettings();
   const { clearLocalKey } = useLocalLLMKeys();
 
   const [showForm, setShowForm] = useState(false);
@@ -66,13 +68,20 @@ export default function AISettingsPage() {
   };
 
   if (authLoading || !user) {
+    return <PageLoading message="正在加载 AI 设置..." />;
+  }
+
+  if (isLoading) {
+    return <PageLoading message="正在加载个人模型..." />;
+  }
+
+  if (isError) {
     return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
+      <ErrorState
+        title="个人模型加载失败"
+        description={error instanceof Error ? error.message : '无法加载个人模型。'}
+        onRetry={() => refetch()}
+      />
     );
   }
 
diff --git a/web/frontend/src/app/profile/page.tsx b/web/frontend/src/app/profile/page.tsx
index 629d1bc..29e79a0 100644
--- a/web/frontend/src/app/profile/page.tsx
+++ b/web/frontend/src/app/profile/page.tsx
@@ -7,6 +7,7 @@ import { AppNavbar } from '@/components/common/AppNavbar';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { Footer } from '@/components/common/Footer';
 import { AISettingsCard } from '@/components/profile/AISettingsCard';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function ProfilePage() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -68,14 +69,7 @@ export default function ProfilePage() {
   };
 
   if (authLoading) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在加载个人中心..." />;
   }
 
   if (!user) {
diff --git a/web/frontend/src/app/scheduled-tasks/page.tsx b/web/frontend/src/app/scheduled-tasks/page.tsx
index 2bb3b3c..c8dbc3e 100644
--- a/web/frontend/src/app/scheduled-tasks/page.tsx
+++ b/web/frontend/src/app/scheduled-tasks/page.tsx
@@ -11,6 +11,9 @@ import { Footer } from '@/components/common/Footer';
 import { useToast, Toast } from '@/components/ui/Toast';
 import { ResponsiveTaskCard } from '@/components/scheduled-tasks/ResponsiveTaskCard';
 import { useIsMobile } from '@/hooks/useMediaQuery';
+import { EmptyState } from '@/components/ui/EmptyState';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 export default function ScheduledTasksPage() {
   const { user, logout, isLoading: authLoading } = useAuth();
@@ -107,26 +110,14 @@ export default function ScheduledTasksPage() {
 
   // 如果正在认证检查，显示加载状态
   if (authLoading || !user) {
-    return (
-      <div className="min-h-screen bg-dark-primary flex items-center justify-center">
-        <div className="text-center">
-          <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-          <p className="text-text-secondary">加载中...</p>
-        </div>
-      </div>
-    );
+    return <PageLoading message="正在验证账户..." />;
   }
 
   if (isLoading) {
     return (
       <div className="min-h-screen bg-dark-primary flex flex-col">
         <AppNavbar user={user} onLogout={logout} />
-        <div className="flex-1 flex items-center justify-center">
-          <div className="text-center">
-            <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" />
-            <p className="text-text-secondary">加载定期报告...</p>
-          </div>
-        </div>
+        <div className="flex-1 flex items-center justify-center"><PageLoading message="正在加载定期报告..." /></div>
         <Footer />
       </div>
     );
@@ -136,12 +127,7 @@ export default function ScheduledTasksPage() {
     return (
       <div className="min-h-screen bg-dark-primary flex flex-col">
         <AppNavbar user={user} onLogout={logout} />
-        <div className="flex-1 flex items-center justify-center">
-          <div className="text-center">
-            <i className="fas fa-exclamation-triangle text-4xl text-danger-500 mb-4" />
-            <p className="text-text-secondary">加载失败：{error.message}</p>
-          </div>
-        </div>
+        <div className="flex-1 flex items-center justify-center"><ErrorState title="定期报告加载失败" description={error.message} onRetry={() => window.location.reload()} /></div>
         <Footer />
       </div>
     );
@@ -243,20 +229,12 @@ export default function ScheduledTasksPage() {
         {/* Task List */}
         <div className="bg-dark-secondary rounded-lg shadow-lg border border-dark-border overflow-hidden">
           {!data?.items || data.items.length === 0 ? (
-            <div className="text-center py-12 px-4">
-              <i className="fas fa-calendar-times text-4xl md:text-6xl text-text-tertiary mb-4" />
-              <h3 className="text-responsive-h4 text-text-primary mb-2">暂无定期报告</h3>
-              <p className="text-responsive-body text-text-secondary mb-6">
-                您还没有创建任何定期报告
-              </p>
-              <a
-                href="/"
-                className="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-gradient-to-r from-accent-primary to-accent-secondary hover:shadow-glow-cyan hover:scale-105 transition-all"
-              >
-                <i className="fas fa-plus mr-2" />
-                创建定期报告
-              </a>
-            </div>
+            <EmptyState
+              icon="fa-calendar-times"
+              title="暂无定期报告"
+              description="您还没有创建任何定期报告。"
+              action={<a href="/" className="inline-flex items-center px-4 py-2 rounded-md text-sm font-medium bg-accent-primary text-dark-primary hover:bg-accent-secondary"><i className="fas fa-plus mr-2" />创建定期报告</a>}
+            />
           ) : isMobile ? (
             // Mobile: Card layout
             <div className="p-4 space-y-3">
diff --git a/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx b/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
index 4696035..2dcaf16 100644
--- a/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
+++ b/web/frontend/src/components/admin/system-default-provider/SystemDefaultForm.tsx
@@ -7,6 +7,8 @@ import { Toast, useToast } from '@/components/ui/Toast';
 import { ConfirmDialog } from '@/components/admin/llm-config/ConfirmDialog';
 import { useSystemDefaultProvider } from '@/hooks/useSystemDefaultProvider';
 import type { AdminLLMProvider, SystemDefaultProviderSummary } from '@/lib/types';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 function ProviderSummaryCard({ provider }: { provider: SystemDefaultProviderSummary }) {
   return (
@@ -154,6 +156,7 @@ export function SystemDefaultForm() {
   }, [systemDefault, providers, selectedId]);
 
   const isLoading = systemDefaultQuery.isLoading || providersQuery.isLoading;
+  const loadError = systemDefaultQuery.error || providersQuery.error;
 
   const selectedProvider = useMemo(
     () => providers.find((p) => p.id === selectedId) ?? null,
@@ -179,11 +182,19 @@ export function SystemDefaultForm() {
   };
 
   if (isLoading) {
+    return <PageLoading message="正在加载系统默认模型..." />;
+  }
+
+  if (loadError) {
     return (
-      <div className="text-center py-12" aria-busy="true">
-        <i className="fas fa-spinner fa-spin text-4xl text-accent-primary mb-4" aria-hidden="true" />
-        <p className="text-text-secondary">加载中...</p>
-      </div>
+      <ErrorState
+        title="系统默认模型加载失败"
+        description={loadError instanceof Error ? loadError.message : '无法读取系统默认模型。'}
+        onRetry={() => {
+          systemDefaultQuery.refetch();
+          providersQuery.refetch();
+        }}
+      />
     );
   }
 
diff --git a/web/frontend/src/components/analysis/AnalysisHistory.tsx b/web/frontend/src/components/analysis/AnalysisHistory.tsx
index 99e1325..b4033cd 100644
--- a/web/frontend/src/components/analysis/AnalysisHistory.tsx
+++ b/web/frontend/src/components/analysis/AnalysisHistory.tsx
@@ -8,6 +8,9 @@ import { useDeleteAnalysis } from '@/hooks/useDeleteAnalysis';
 import { queryKeys } from '@/lib/react-query';
 import { ResponsiveAnalysisCard } from './ResponsiveAnalysisCard';
 import { useIsMobile } from '@/hooks/useMediaQuery';
+import { EmptyState } from '@/components/ui/EmptyState';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 
 interface AnalysisHistoryProps {
@@ -194,19 +197,16 @@ export function AnalysisHistory({ onBackToConfig, onViewResults, onViewProgress,
   };
 
   if (isLoading) {
+    return <PageLoading message="正在加载分析历史..." />;
+  }
+
+  if (isError) {
     return (
-      <div className="bg-dark-secondary rounded-lg shadow-lg border border-dark-border p-12">
-        <div className="text-center">
-          <div className="relative inline-block mb-4">
-            {/* 外圈旋转 */}
-            <div className="w-20 h-20 border-4 border-accent-primary/20 border-t-accent-primary rounded-full animate-spin"></div>
-            {/* 内圈反向旋转 */}
-            <div className="absolute top-2 left-2 w-16 h-16 border-4 border-accent-secondary/20 border-b-accent-secondary rounded-full animate-spin-reverse"></div>
-          </div>
-          <p className="text-text-primary font-medium text-lg">正在加载分析历史...</p>
-          <p className="text-sm text-text-tertiary mt-2">正在获取您的分析记录</p>
-        </div>
-      </div>
+      <ErrorState
+        title="分析历史加载失败"
+        description={error instanceof Error ? error.message : '无法获取您的分析记录。'}
+        onRetry={() => window.location.reload()}
+      />
     );
   }
 
@@ -229,17 +229,16 @@ export function AnalysisHistory({ onBackToConfig, onViewResults, onViewProgress,
 
       <div className="p-4 md:p-6">
         {analyses.length === 0 ? (
-          <div className="text-center py-12">
-            <div className="text-text-muted text-6xl mb-4">📊</div>
-            <h3 className="text-lg font-medium text-text-primary mb-2">暂无分析记录</h3>
-            <p className="text-text-secondary mb-4">您还没有创建任何股票分析</p>
-            <button
-              onClick={onBackToConfig}
-              className="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700"
-            >
-              创建新分析
-            </button>
-          </div>
+          <EmptyState
+            icon="fa-chart-line"
+            title="暂无分析记录"
+            description="您还没有创建任何股票分析。"
+            action={
+              <button onClick={onBackToConfig} className="px-4 py-2 bg-accent-primary text-dark-primary rounded-md hover:bg-accent-secondary">
+                创建新分析
+              </button>
+            }
+          />
         ) : isMobile ? (
           // Mobile: Card layout
           <div className="space-y-3">
@@ -588,4 +587,4 @@ export function AnalysisHistory({ onBackToConfig, onViewResults, onViewProgress,
       )}
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/web/frontend/src/components/analysis/AnalysisProgress.test.tsx b/web/frontend/src/components/analysis/AnalysisProgress.test.tsx
new file mode 100644
index 0000000..ad60fd2
--- /dev/null
+++ b/web/frontend/src/components/analysis/AnalysisProgress.test.tsx
@@ -0,0 +1,82 @@
+import React from 'react';
+import { act, render, screen, waitFor } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import { AnalysisProgress } from '@/components/analysis/AnalysisProgress';
+
+class MockWebSocket {
+  static instances: MockWebSocket[] = [];
+  static readonly CONNECTING = 0;
+  static readonly OPEN = 1;
+
+  readonly readyState = MockWebSocket.OPEN;
+  onopen: (() => void) | null = null;
+  onmessage: ((event: MessageEvent) => void) | null = null;
+  onerror: ((event: Event) => void) | null = null;
+  onclose: ((event: CloseEvent) => void) | null = null;
+
+  constructor(_url: string, _protocols?: string | string[]) {
+    MockWebSocket.instances.push(this);
+  }
+
+  close() {
+    this.onclose?.({ code: 1000, reason: '' } as CloseEvent);
+  }
+}
+
+describe('AnalysisProgress — terminal Risk Judge band', () => {
+  afterEach(() => {
+    MockWebSocket.instances = [];
+    vi.unstubAllGlobals();
+  });
+
+  it('keeps the independent Risk Judge final band when executor is disabled by a config event', async () => {
+    vi.stubGlobal('WebSocket', MockWebSocket);
+    vi.stubGlobal(
+      'fetch',
+      vi.fn().mockResolvedValue({
+        ok: true,
+        json: async () => ({ selected_analysts: ['market'], enable_trading_executor: false }),
+      }),
+    );
+
+    render(
+      <AnalysisProgress
+        analysisId="analysis-1"
+        onComplete={vi.fn()}
+        onBackToConfig={vi.fn()}
+        onShowToast={vi.fn()}
+      />,
+    );
+
+    await waitFor(() => expect(MockWebSocket.instances).toHaveLength(1));
+
+    act(() => {
+      MockWebSocket.instances[0]!.onmessage?.({
+        data: JSON.stringify({
+          type: 'config',
+          data: { selected_analysts: ['market'], enable_trading_executor: false },
+        }),
+      } as MessageEvent);
+    });
+
+    act(() => {
+      MockWebSocket.instances[0]!.onmessage?.({
+        data: JSON.stringify({
+          type: 'log',
+          data: {
+            agent: 'risk_manager',
+            phase: '完成阶段',
+            step: '开始',
+            message: 'Risk Judge 正在汇总风险意见',
+          },
+        }),
+      } as MessageEvent);
+    });
+
+    expect(screen.getByText('最终裁决')).toBeInTheDocument();
+    expect(screen.getByText('风险裁决（Risk Judge）输出最终交易建议')).toBeInTheDocument();
+    expect(screen.getByText('风险裁决')).toBeInTheDocument();
+    expect(screen.queryByText('交易执行')).toBeNull();
+  });
+});
diff --git a/web/frontend/src/components/analysis/AnalysisProgress.tsx b/web/frontend/src/components/analysis/AnalysisProgress.tsx
index a3a9bfe..e3cb532 100644
--- a/web/frontend/src/components/analysis/AnalysisProgress.tsx
+++ b/web/frontend/src/components/analysis/AnalysisProgress.tsx
@@ -45,6 +45,11 @@ interface WebSocketMessage {
   };
 }
 
+// These IDs are stable UI identities. The terminal Risk Judge band is always
+// present; the legacy optional executor may only occupy its own later ID.
+const RISK_JUDGE_PHASE_ID = 5;
+const TRADING_EXECUTOR_PHASE_ID = 6;
+
 export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onShowToast }: AnalysisProgressProps) {
   const [progress, setProgress] = useState(0);
   const [currentPhaseIndex, setCurrentPhaseIndex] = useState(0);
@@ -136,7 +141,7 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
       ]
     },
     {
-      id: 5,
+      id: RISK_JUDGE_PHASE_ID,
       name: '最终裁决',
       description: '风险裁决（Risk Judge）输出最终交易建议',
       icon: 'fa-gavel',
@@ -200,13 +205,13 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
           if (status.enable_trading_executor) {
             setEnableTradingExecutor(true);
             setPhases(prevPhases => {
-              const hasTradingExecutorPhase = prevPhases.some(p => p.id === 5);
+              const hasTradingExecutorPhase = prevPhases.some(p => p.id === TRADING_EXECUTOR_PHASE_ID);
               if (!hasTradingExecutorPhase) {
                 console.log('✅ Adding trading executor phase from status');
                 return [
                   ...prevPhases,
                   {
-                    id: 5,
+                    id: TRADING_EXECUTOR_PHASE_ID,
                     name: '交易执行',
                     description: '执行交易操作',
                     icon: 'fa-robot',
@@ -344,11 +349,11 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
 
                   // 如果启用了执行交易，添加第5个阶段（交易执行）
                   if (enable_trading_executor) {
-                    const hasTradingExecutorPhase = newPhases.some(p => p.id === 5);
+                    const hasTradingExecutorPhase = newPhases.some(p => p.id === TRADING_EXECUTOR_PHASE_ID);
                     if (!hasTradingExecutorPhase) {
                       console.log('✅ 添加交易执行阶段');
                       newPhases.push({
-                        id: 5,
+                        id: TRADING_EXECUTOR_PHASE_ID,
                         name: '交易执行',
                         description: '执行交易操作',
                         icon: 'fa-robot',
@@ -360,7 +365,8 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                     }
                   } else {
                     // 如果未启用，移除交易执行阶段
-                    newPhases = newPhases.filter(p => p.id !== 5);
+                    // Never remove the independent terminal Risk Judge band.
+                    newPhases = newPhases.filter(p => p.id !== TRADING_EXECUTOR_PHASE_ID);
                   }
 
                   return newPhases;
@@ -382,6 +388,9 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                   const newPhases = [...prevPhases];
 
                   // 查找对应的阶段
+                  const executorPhaseIndex = newPhases.findIndex(
+                    (phase) => phase.id === TRADING_EXECUTOR_PHASE_ID,
+                  );
                   // 智能体到阶段的映射
                   const agentToPhaseMap: { [key: string]: number } = {
                     'system': 0,  // system 也显示在第一阶段
@@ -398,7 +407,9 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                     'neutral': 3,
                     'safe': 3,
                     'risk_manager': 4,    // Risk Judge 是独立的最终裁决 band（终末节点）
-                    'trading_executor': 4, // 已废弃；保留兜底
+                    // Ignore stale executor logs when the optional band is absent;
+                    // they must never be folded into the Risk Judge band.
+                    'trading_executor': executorPhaseIndex,
                   };
 
                   // 阶段名称到索引的映射（兼容旧格式）
@@ -418,7 +429,7 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
                     '风险评估': 3,
                     '风险管理': 3,
                     '完成阶段': 4,
-                    'Trading Executor': 4  // 执行交易员在风险管理之后
+                    'Trading Executor': executorPhaseIndex,
                   };
 
                   // 优先使用智能体映射，其次使用阶段映射
@@ -835,4 +846,4 @@ export function AnalysisProgress({ analysisId, onComplete, onBackToConfig, onSho
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/web/frontend/src/components/analysis/AnalysisResults.tsx b/web/frontend/src/components/analysis/AnalysisResults.tsx
index f0705a1..a1eb563 100644
--- a/web/frontend/src/components/analysis/AnalysisResults.tsx
+++ b/web/frontend/src/components/analysis/AnalysisResults.tsx
@@ -7,6 +7,8 @@ import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import remarkBreaks from 'remark-breaks';
 import { logger } from '@/utils/logger';
+import { ErrorState } from '@/components/ui/ErrorState';
+import { PageLoading } from '@/components/ui/PageLoading';
 
 interface AnalysisResultsProps {
   analysisId: string;
@@ -925,19 +927,16 @@ export function AnalysisResults({ analysisId, onBackToConfig, onBackToHistory, o
   };
 
   if (loading) {
+    return <PageLoading message="正在加载分析结果..." />;
+  }
+
+  if (isError || !results) {
     return (
-      <div className="bg-dark-secondary rounded-lg shadow-lg border border-dark-border p-12">
-        <div className="text-center">
-          <div className="relative inline-block mb-4">
-            {/* 外圈旋转 */}
-            <div className="w-20 h-20 border-4 border-blue-200 border-t-blue-600 rounded-full animate-spin"></div>
-            {/* 内圈反向旋转 */}
-            <div className="absolute top-2 left-2 w-16 h-16 border-4 border-purple-200 border-b-purple-600 rounded-full animate-spin-reverse"></div>
-          </div>
-          <p className="text-text-primary font-medium text-lg">正在加载分析结果...</p>
-          <p className="text-sm text-text-tertiary mt-2">正在获取详细报告，请稍候</p>
-        </div>
-      </div>
+      <ErrorState
+        title="分析结果加载失败"
+        description={error instanceof Error ? error.message : '未能取得这份分析报告。'}
+        onRetry={() => window.location.reload()}
+      />
     );
   }
 
@@ -2228,4 +2227,4 @@ export function AnalysisResults({ analysisId, onBackToConfig, onBackToHistory, o
       )}
     </>
   );
-}
\ No newline at end of file
+}
diff --git a/web/frontend/src/components/analysis/ModelSelector.test.tsx b/web/frontend/src/components/analysis/ModelSelector.test.tsx
index 1d657bb..54ccdf1 100644
--- a/web/frontend/src/components/analysis/ModelSelector.test.tsx
+++ b/web/frontend/src/components/analysis/ModelSelector.test.tsx
@@ -48,6 +48,25 @@ const sensitiveConfig = {
   llm_providers: [{ value: 'openai', label: 'OpenAI', url: 'https://api.openai.com' }],
 };
 
+const systemDefaultOnlyConfig = {
+  models: {
+    oneinfinity: {
+      shallow: [{ value: 'gpt-5-mini', label: 'GPT-5 Mini' }],
+      deep: [{ value: 'gpt-5.5', label: 'GPT-5.5' }],
+    },
+  },
+  // Deliberately includes values that must remain absent from the DOM.
+  system_default: {
+    provider_name: 'oneinfinity',
+    display_name: 'OneInfinity',
+    shallow_model: 'gpt-5-mini',
+    deep_model: 'gpt-5.5',
+    base_url: 'https://internal.example/v1',
+    api_key_masked: 'sk-...system',
+    has_api_key: true,
+  },
+};
+
 describe('ModelSelector — model-only privacy boundary', () => {
   beforeEach(() => {
     vi.clearAllMocks();
@@ -96,6 +115,27 @@ describe('ModelSelector — model-only privacy boundary', () => {
     );
   });
 
+  it('offers the system-default model when no personal provider is configured without exposing its source', async () => {
+    const user = userEvent.setup();
+    const onChange = vi.fn();
+    mockSettings({ providers: [] });
+    const { container } = renderWithQuery(
+      <ModelSelector config={systemDefaultOnlyConfig} onChange={onChange} />,
+    );
+
+    expect(screen.getByText('GPT-5 Mini / GPT-5.5')).toBeInTheDocument();
+    expect(container.textContent).not.toMatch(/OneInfinity|oneinfinity|internal\.example|sk-\.\.\.system|系统默认/);
+
+    await user.selectOptions(screen.getByRole('combobox'), 'GPT-5 Mini / GPT-5.5');
+
+    expect(onChange).toHaveBeenCalledWith({
+      provider: 'oneinfinity',
+      shallow: 'gpt-5-mini',
+      deep: 'gpt-5.5',
+      label: 'GPT-5 Mini / GPT-5.5',
+    });
+  });
+
   it('shows the actionable recovery message when no usable model exists', () => {
     mockSettings({ providers: [] });
     renderWithQuery(<ModelSelector config={sensitiveConfig} onChange={vi.fn()} />);
diff --git a/web/frontend/src/components/analysis/ModelSelector.tsx b/web/frontend/src/components/analysis/ModelSelector.tsx
index 2ae114b..b32ba60 100644
--- a/web/frontend/src/components/analysis/ModelSelector.tsx
+++ b/web/frontend/src/components/analysis/ModelSelector.tsx
@@ -12,10 +12,11 @@ import { useUserLLMSettings } from '@/hooks/useUserLLMSettings';
  *              system-default status, backend credential source.
  *
  * This component deliberately reads ONLY:
- *   - the user's personal LLM settings (display_name + shallow/deep model values), and
+ *   - the user's personal LLM settings (display_name + shallow/deep model values),
+ *   - the system-default provider's non-sensitive model values, and
  *   - the non-sensitive `config.models[*][shallow|deep]` labels (display labels only).
- * It never reads `config.system_default`, `config.llm_providers[].url`,
- * `AdminLLMProvider.api_key`, `hasLocalKey(...)` or any masked/raw key.
+ * It never reads a provider display name, `base_url`, `api_key_masked`,
+ * `AdminLLMProvider.api_key`, `hasLocalKey(...)` or any raw key.
  *
  * Provider / backend_url / api_key are resolved silently by the parent when it
  * builds the launch payload; they are not surfaced in this UI.
@@ -83,6 +84,23 @@ export function ModelSelector({ config, value, onChange, disabled, id = 'analysi
           : deepLabel || shallowLabel;
       push({ provider, shallow, deep, label });
     }
+
+    // A user without a personal provider must still be able to launch with the
+    // backend-managed default. Only its model pair is used here; its provenance
+    // and credentials stay outside the rendered UI.
+    const systemDefault = config?.system_default;
+    if (systemDefault?.provider_name) {
+      const provider = systemDefault.provider_name;
+      const shallow = systemDefault.shallow_model || '';
+      const deep = systemDefault.deep_model || shallow;
+      const shallowLabel = labelFor(config, provider, 'shallow', shallow);
+      const deepLabel = labelFor(config, provider, 'deep', deep);
+      const label =
+        shallowLabel && deepLabel && shallowLabel !== deepLabel
+          ? `${shallowLabel} / ${deepLabel}`
+          : deepLabel || shallowLabel;
+      push({ provider, shallow, deep, label });
+    }
     return list;
   }, [llmSettings, config]);
 
diff --git a/web/frontend/src/lib/types.ts b/web/frontend/src/lib/types.ts
index 0f1cc83..90c0bdd 100644
--- a/web/frontend/src/lib/types.ts
+++ b/web/frontend/src/lib/types.ts
@@ -82,6 +82,8 @@ export interface SystemDefaultProviderSummary {
   has_api_key: boolean;          // 系统 KEY，后端持有
   api_key_masked: string | null; // 脱敏尾号，如 "sk-***abcd"
   is_active: boolean;
+  shallow_model?: string | null;
+  deep_model?: string | null;
 }
 
 export interface AppConfigWithSystemDefault extends AppConfig {