style: sync shell theme with problem rectification

docs/ui-architecture.md

 # UI 架构
 
+## 2026-09-28 Shell 配色
+
+- AppShell 使用中性灰白内容画布与低饱和深藏蓝 Sidebar。页面画布由 `theme.css` 的 `--background: oklch(97.4% 0.002 255)` 提供；桌面和移动侧栏共用 `--xinyuan-sidebar-*` Token，红色 Logo 直接显示，不加底色。
+- 内容画布顶部使用 `--xinyuan-canvas-top` 与 `--background` 的轻微渐变，至 18rem 淡出；滚动区透出 AppShell 背景，页面 Card 与 HeroUI 组件继续使用原有 Surface Token。
+- 当前导航使用较亮的同色系选中底色；普通导航悬停不会覆盖当前项的选中底色。此调整仅涉及 Shell 视觉层，不改变路由、页面状态或业务数据协议。
+
 视觉基准：`/Users/liuchenlong/Desktop/job/audit_project_manager` 当前实现。所有页面文字沿用
 该应用的层级：Navbar 20px/600、页面分区 18px/700、模块标题 16px/600、正文 14px/400、
 次要说明 13px/400、表头和状态 Chip 12px/500。
@@ -8,7 +14,7 @@
 
 1. `.umirc.ts` + `public/fonts/inter.css`：常驻 Inter 400/500/600 拉丁字符字体入口，不参与 `umi.css` 热替换。
 2. `src/tailwind.css`：Tailwind、HeroUI、HeroUI Pro CSS 入口；使用 `source(none)` 和显式源码目录，排除 Umi 生成目录。
-3. `src/design-system/theme.css`：不可修改的权威 HeroUI 主题。
+3. `src/design-system/theme.css`：权威 HeroUI 主题与 Shell 配色 Token。
 4. `src/design-system/tokens.css`：Skill 批准的鑫元扩展 Token。
 5. `src/design-system/shell.css`：基准 Shell、列表、分页、KPI 和响应式几何。
 6. 页面 JSX：仅业务组合和布局，不包含私有组件外观。
@@ -20,7 +26,7 @@
 
 ## 组件边界
 
-- `Layout.jsx`：通过 `AppShell` 组合 HeroUI Pro Sidebar/Navbar、应用切换和真实退出；内容区固定浅色，Sidebar 固定深色，移动端使用 HeroUI Pro Sheet。页面层级面包屑由 Layout 根据路由注入 Navbar，父级可返回、当前级为深色，页面正文不再重复显示面包屑。
+- `Layout.jsx`：通过 `AppShell` 组合 HeroUI Pro Sidebar/Navbar、应用切换和真实退出；内容区固定浅色、顶部带轻微渐变，Sidebar 使用低饱和深藏蓝，移动端使用 HeroUI Pro Sheet。页面层级面包屑由 Layout 根据路由注入 Navbar，父级可返回、当前级为深色，页面正文不再重复显示面包屑。
 - `Layout.jsx`：从通知 service 读取真实未读数，监听跨页面状态事件并每 60 秒刷新；Navbar 只负责铃铛展示和路由跳转。
 - `notifications/notificationService.js`：复用 `DataService` 的平台通知请求，负责 300ms 搜索参数、未读状态、已读事件、动态 action 和 base-aware 链接解析。
 - `notifications/NotificationListPage.jsx`：HeroUI 原生消息/待办列表、搜索、状态 Tabs、Pagination、EmptyState 与 Toast，不持有模型监控业务状态。

docs/xinyuan-design-system.md

 # 模型分析鑫元设计系统
 
+## 2026-09-28 Shell 配色调整
+
+AppShell 采用低饱和深藏蓝侧栏与中性灰白内容画布。`theme.css` 的 `--background` 和 `--xinyuan-sidebar-*` 是这组配色的来源：侧栏背景为 `oklch(32% 0.037 255)`，页面画布为 `oklch(97.4% 0.002 255)`，选中项为 `oklch(46% 0.055 255)`；侧栏红色 Logo 直接显示，不加 Logo 底色。内容画布顶部使用 4% 侧栏蓝色混合形成的轻微渐变，并在 18rem 处过渡回画布底色。桌面与移动侧栏共用这些 Token，导航结构、交互及数据状态不变。
+
 本项目的唯一视觉与交互基准为已确认的“审计项目管理”应用：
 `/Users/liuchenlong/Desktop/job/audit_project_manager`。业务行为以 `record-api.md`、
 `subjectsDefinition.md` 和 `model-monitor.business-flow.md` 为准。
@@ -7,7 +11,7 @@
 ## 基础约束
 
 - 页面和共享组件直接使用 `@heroui/react`、`@heroui-pro/react` 及官方子路径。
-- 权威 `theme.css` 原样加载，SHA-256 为 `a0bf6f243aaf2c94cc8b577145d33d765f8ecab863b3a3b4a358bad4d1a05901`；`tokens.css` 仅提供 Skill 批准的扩展 Token。
+- `theme.css` 是本项目权威主题与 Shell 配色来源；`tokens.css` 仅提供批准的扩展 Token。
 - Inter 400/500/600 拉丁子集由 `.umirc.ts` 生成的常驻 `public/fonts/inter.css` link 加载；不得在 `tailwind.css` 中导入字体 CSS，避免 Umi HMR 替换 `umi.css` 时造成英文、数字和符号字体回退抖动。
 - 统一文字层级：正文 14px/400，次要说明 13px/400，模块标题 16px/600，页面分区标题
   18px/700，Navbar 标题 20px/600，表头和状态 Chip 12px/500；对应 Token 为

src/components/DashboardSidebar.jsx

-import xyLogoWhite from '@/assets/xy-logo-white.png';
+import xyLogoRed from '@/assets/xy-logo-red.png';
 import { APP_DISPLAY_NAME } from '@/constants/app';
 import { Sheet } from '@heroui-pro/react';
 import { Sidebar, useSidebar } from '@heroui-pro/react/sidebar';
@@ -47,7 +47,7 @@ function SidebarContents({ menuGroups, onLogout, onOpenApplicationSwitcher, path
   };
 
   return <>
-    <Sidebar.Header><div className="app-sidebar-brand rc-sidebar-brand"><div className="app-sidebar-brand-mark rc-sidebar-brand-mark"><img alt="鑫元" className="rc-sidebar-logo" src={xyLogoWhite} /></div><div className="app-sidebar-brand-main rc-sidebar-brand-main" data-sidebar="label"><span className="app-sidebar-title rc-sidebar-title">{APP_DISPLAY_NAME}</span></div><div className="app-sidebar-app-switcher rc-sidebar-app-switcher" data-sidebar="label"><Button isIconOnly aria-label="切换应用" className="app-sidebar-app-trigger rc-sidebar-app-trigger" size="sm" variant="ghost" onPress={onOpenApplicationSwitcher}><AppGrid size={16} /></Button></div></div></Sidebar.Header>
+    <Sidebar.Header><div className="app-sidebar-brand rc-sidebar-brand"><div className="app-sidebar-brand-mark rc-sidebar-brand-mark"><img alt="鑫元" className="rc-sidebar-logo" src={xyLogoRed} /></div><div className="app-sidebar-brand-main rc-sidebar-brand-main" data-sidebar="label"><span className="app-sidebar-title rc-sidebar-title">{APP_DISPLAY_NAME}</span></div><div className="app-sidebar-app-switcher rc-sidebar-app-switcher" data-sidebar="label"><Button isIconOnly aria-label="切换应用" className="app-sidebar-app-trigger rc-sidebar-app-trigger" size="sm" variant="ghost" onPress={onOpenApplicationSwitcher}><AppGrid size={16} /></Button></div></div></Sidebar.Header>
     <Sidebar.Content>{menuGroups.map((group) => group.showLabel === false ? <Sidebar.Group key={group.title}>{renderMenu(group)}</Sidebar.Group> : renderGroup(group))}</Sidebar.Content>
     <Sidebar.Footer><SidebarUserMenu userInfo={userInfo} onLogout={onLogout} /></Sidebar.Footer>
   </>;

src/design-system/shell.css

@@ -408,7 +408,7 @@
 
 .app-shell-content-scroll {
   min-width: 0;
-  background: var(--rc-bg-canvas);
+  background: transparent;
   overscroll-behavior: contain;
 }
 
@@ -1165,7 +1165,11 @@
   overflow: hidden;
   border: 0;
   border-radius: 0;
-  background: var(--rc-bg-canvas);
+  background: linear-gradient(
+    180deg,
+    var(--xinyuan-canvas-top) 0,
+    var(--rc-bg-canvas) 18rem
+  );
 }
 
 .dark .rc-app-main.sidebar__main,
@@ -1602,7 +1606,7 @@
   }
 }
 
-/* Fixed split-shell theme: dark navigation, permanently light content canvas. */
+/* Muted navy navigation beside the permanently light content canvas. */
 .template-dashboard-shell .app-sidebar-glass,
 .rc-mobile-sidebar.app-sidebar-glass {
   color: var(--rc-sidebar-foreground);
@@ -1634,13 +1638,17 @@
   color: var(--rc-sidebar-item-selected-foreground) !important;
 }
 
-.template-dashboard-shell .sidebar__menu-item:hover .sidebar__menu-item-content,
 .template-dashboard-shell
-  .sidebar__menu-item[data-hovered='true']
+  .sidebar__menu-item:not([data-current='true']):hover
+  .sidebar__menu-item-content,
+.template-dashboard-shell
+  .sidebar__menu-item:not([data-current='true'])[data-hovered='true']
   .sidebar__menu-item-content,
-.rc-mobile-sidebar .sidebar__menu-item:hover .sidebar__menu-item-content,
 .rc-mobile-sidebar
-  .sidebar__menu-item[data-hovered='true']
+  .sidebar__menu-item:not([data-current='true']):hover
+  .sidebar__menu-item-content,
+.rc-mobile-sidebar
+  .sidebar__menu-item:not([data-current='true'])[data-hovered='true']
   .sidebar__menu-item-content,
 .app-sidebar-user-trigger.dropdown__trigger:hover,
 .app-sidebar-user-trigger.dropdown__trigger[data-hovered='true'] {

src/design-system/theme.css

@@ -11,7 +11,7 @@
 [data-theme="light"],
 [data-theme="default"] {
   /* Theme Colors (Light Mode) */
-  /* Xinyuan Fund brand red. HeroUI's accent is the primary action color. */
+  /* Xinyuan fixed light canvas with a muted navy Sidebar. */
   --accent: #DA241A;
   --accent-hover: #C91F17;
   --accent-pressed: #B51B14;
@@ -31,7 +31,8 @@
   --primary-800: #941711;
   --primary-900: #73120D;
   --primary-950: #4A0C08;
-  --background: oklch(97.02% 0.0000 29.20);
+  --background: oklch(97.4% 0.002 255);
+  --xinyuan-canvas-top: color-mix(in oklab, var(--xinyuan-sidebar-background) 4%, var(--background));
   --border: oklch(90.00% 0.0000 29.20);
   --danger: #B51B14;
   --danger-hover: #941711;
@@ -71,18 +72,16 @@
   --font-sans: var(--font-inter);
 
   /*
-   * Xinyuan fixed split-shell contract.
-   * The application canvas always uses this light theme. The Sidebar is the
-   * only persistent dark plane and must consume these semantic tokens.
+   * Navigation colors are kept separate from HeroUI surfaces.
    */
-  --xinyuan-sidebar-background: oklch(16% 0.020 255);
-  --xinyuan-sidebar-border: oklch(26% 0.022 255);
-  --xinyuan-sidebar-foreground: oklch(97% 0.004 255);
-  --xinyuan-sidebar-muted: oklch(76% 0.018 255);
-  --xinyuan-sidebar-item-hover: oklch(22% 0.026 255);
-  --xinyuan-sidebar-item-selected: oklch(28% 0.016 255);
+  --xinyuan-sidebar-background: oklch(32% 0.037 255);
+  --xinyuan-sidebar-border: oklch(41% 0.036 255);
+  --xinyuan-sidebar-foreground: oklch(97% 0.005 255);
+  --xinyuan-sidebar-muted: oklch(82% 0.018 255);
+  --xinyuan-sidebar-item-hover: oklch(39% 0.042 255);
+  --xinyuan-sidebar-item-selected: oklch(46% 0.055 255);
   --xinyuan-sidebar-item-selected-foreground: oklch(99% 0.002 255);
-  --xinyuan-sidebar-focus: oklch(78% 0.105 29.20);
+  --xinyuan-sidebar-focus: oklch(85% 0.070 255);
 
   /*
    * ECharts is the required chart renderer for Xinyuan applications.
@@ -123,6 +122,7 @@
 [data-theme="dark"] {
   color-scheme: dark;
   /* Theme Colors (Dark Mode) */
+  /* Keep brand and focus stable across HeroUI theme contexts. */
   --accent: #DA241A;
   --accent-hover: #C91F17;
   --accent-pressed: #B51B14;

src/design-system/tokens.css

@@ -27,7 +27,7 @@
   --rc-text-muted: var(--muted);
   --rc-text-empty: color-mix(in oklab, var(--muted) 72%, var(--background));
 
-  /* Fixed dark Sidebar aliases. The content canvas remains light. */
+  /* Muted navy Sidebar aliases. The content canvas remains light. */
   --rc-sidebar-background: var(--xinyuan-sidebar-background);
   --rc-sidebar-border: var(--xinyuan-sidebar-border);
   --rc-sidebar-foreground: var(--xinyuan-sidebar-foreground);