From e601b253bc0d6a3fc762c7495d235b68f3910eb6 Mon Sep 17 00:00:00 2001
From: weichen <weichen@home.local>
Date: Wed, 30 Sep 2026 09:59:40 +0000
Subject: [PATCH] Add UI redesign and auth design proposal with HTML demos

Why: current UI scatters creation entries (project + at sidebar top-left,
new session at bottom-left), has no user/tenant surfaces, and the project
tree forces per-project navigation; the system targets multi-user
multi-tenant operation.

Evidence:
- Studied zai-org/ZCode desktop layout (WorkspaceShellLayout, WorkspaceSidebar,
  DESIGN.md) and mapped transferable patterns (single New-Task entry,
  organize-by views, sidebar account footer) with repo file citations.
- Three layout proposals (task-centric / activity rail / project portal) with
  comparison table and recommendation A; auth stage-2 design (orgs,
  memberships, server sessions) with SSE cookie upgrade removing ?key=.
- Five static demos (index + A/B/C + auth) verified headless: DOM layout
  assertions (column widths, view switching, screen switching), clipping and
  contrast QA clean, zero console errors, light/dark themes render.

Impact: documents only; no code change. Demos double as the R4 design-token
target palette. Implementation proceeds only after direction is approved.

Refs: docs/proposals/2026-09-30-ui-inbox-command-workspace.md (D25-D33),
docs/proposals/2026-09-30-dual-tier-storage-and-multitenancy.md (D17-D24)
---
 .../2026-09-30-ui-redesign-and-auth.md        | 202 ++++++
 .../demo-a-task-centric.html                  | 631 ++++++++++++++++++
 .../ui-redesign-demos/demo-auth.html          | 335 ++++++++++
 .../demo-b-activity-rail.html                 | 240 +++++++
 .../demo-c-project-portal.html                | 243 +++++++
 docs/proposals/ui-redesign-demos/index.html   | 133 ++++
 6 files changed, 1784 insertions(+)
 create mode 100644 docs/proposals/2026-09-30-ui-redesign-and-auth.md
 create mode 100644 docs/proposals/ui-redesign-demos/demo-a-task-centric.html
 create mode 100644 docs/proposals/ui-redesign-demos/demo-auth.html
 create mode 100644 docs/proposals/ui-redesign-demos/demo-b-activity-rail.html
 create mode 100644 docs/proposals/ui-redesign-demos/demo-c-project-portal.html
 create mode 100644 docs/proposals/ui-redesign-demos/index.html

diff --git a/docs/proposals/2026-09-30-ui-redesign-and-auth.md b/docs/proposals/2026-09-30-ui-redesign-and-auth.md
new file mode 100644
index 0000000..aacee49
--- /dev/null
+++ b/docs/proposals/2026-09-30-ui-redesign-and-auth.md
@@ -0,0 +1,202 @@
+# 界面重构与多用户认证 —— 设计提案（2026-09-30）
+
+状态：**proposed**（本文为方案对比稿，待用户裁定方向后另立实施提案）；owner：weichen；主任务：Dev 仓 `feature/ui-redesign-proposals`。
+前置：[界面交互底座](2026-09-30-ui-inbox-command-workspace.md)（D25–D33）、[双档存储、多租户与规模化](2026-09-30-dual-tier-storage-and-multitenancy.md)（D17–D24）。
+配套 demo：`ui-redesign-demos/`（index.html 为入口，本地浏览器直接打开）。
+
+---
+
+## 1. 背景与问题
+
+用户对现有界面的判定（2026-09-30）：**界面与交互设计不够好**。具体事实（对照 v0.1.0 截图与 `modules/frontend/src/components/ProjectNav.tsx`）：
+
+1. **创建入口分裂且错位**：新建项目在左上角 `nav-header` 的 ✚，新会话在左下角 `nav-footer` 的「＋ 新会话」。两个高频动作一个在最上一个在最下，且都是小图标/文字按钮，无主次。
+2. **项目树导航繁琐**：`ProjectNav` 只渲染 `currentProjectId` 的会话（`open && p.id === currentProjectId`），切项目才能看会话；项目折叠态与会话列表耦合，浏览成本高。
+3. **无用户与租户界面**：系统定位是多用户、多租户（D17 已落 `users`/`api_keys` 表），但界面只有一个密钥输入登录门（`App.tsx LoginGate`），没有账户、身份、成员、租户切换的任何表面。
+4. 视觉密度与专业度不足：emoji 图标（✚ ☰ ⚙ 📦 🤖）、无统一设计令牌，观感偏离"办公工作台"。
+
+## 2. ZCode 桌面端研究结论
+
+研究对象：`github.com/zai-org/ZCode`（Apache-2.0，Electron 桌面 + Web + CLI/TUI 三形态）。证据为仓库源码与 `DESIGN.md`（以下文件路径均在该仓）。
+
+### 2.1 布局范式（`packages/ui/src/app-shell/WorkspaceShellLayout.tsx`）
+
+- 四区：**左侧栏（任务列表）+ 中栏会话 + 底部终端 + 右侧 Side Pane**（浏览器/子代理会话/工作流运行/工件，Tab 化）。
+- 尺寸用 CSS 变量驱动（`--workspace-sidebar-width` 等），拖拽中只写变量不进 React state；宽度持久化 localStorage。
+- 自动收起策略：窗口变窄（去抖 300ms）时若会话列 < 480px 收 Side Pane、< 360px 收侧栏；**只在窗口 resize 时触发**，避免把用户手动打开的面板又关回去。
+- 侧栏隐藏时由 `DesktopTopOverlay` 浮出 New Task，保证创建入口永不丢失。
+
+### 2.2 侧栏组织（`packages/ui/src/WorkspaceSidebar.tsx` 等）
+
+- **顶部动作区**：第一颗按钮就是 **New Task**（带快捷键），随后是 Command Center 搜索（⌘K）、Automations、插件商店。创建入口在视觉与逻辑的**第一位**，不在角落。
+- **任务列表四种组织模式**：`grouped`（自定义分组）/ `workspace`（按项目）/ `timeline`（按时间线）/ `archived`，pill 切换 + 过滤菜单（排序、归档）。项目是任务的**组织维度**，不是必须展开导航的树。
+- **置顶区全局置顶**（`WorkspacePinnedTasksSection`：归档态也保持置顶区可见）。
+- 任务行支持拖拽排序、分组展开态持久化、右键菜单（`TaskListItemContextMenu`）。
+- **Footer = 账户区**：主题/语言、设置、用量与套餐徽章、**登录/登出与用户信息**（`WorkspaceSidebarFooter`）。
+- 收起后变 52px 图标轨道（`WorkspaceSidebarCollapsedRail`）。
+
+### 2.3 会话头与中栏（`WorkspaceHeaderSections/`）
+
+- 中栏会话头：上下文路径（项目/目录）+ 最近活动时间 + 动作区；**无全局顶栏**（与我方 D26 一致）。
+
+### 2.4 设计系统（`DESIGN.md`）
+
+- 定位："calm, dense, operational rather than decorative"；桌面优先。
+- 硬规则：统一 `text-ui-*` 字号阶（默认 14px）；语义色只用于真实语义态；**所有等待确认类交互（提问/权限/计划批准）统一绿色确认**；圆角按嵌套层级递减（外 12 → 内 10/8/6）；4px 间距基；高度克制（先靠背景对比与描边，不堆阴影）。
+- 键盘优先：可聚焦、可见焦点、快捷键全程可触达（新建任务、⌘K、侧栏拖拽支持方向键步进 16px）。
+
+### 2.5 认证表面
+
+- `login/LoginApiKeyForm.tsx`：API 密钥表单；`onboarding/`：首跑引导；OAuth 相关在 `root/` 与 `packages/web/src/auth/`。
+
+### 2.6 对本系统的可迁移结论
+
+| ZCode 实践 | 迁移判据 |
+|---|---|
+| New Task 置顶 + 快捷键 + 隐藏侧栏时浮出 | 直接采纳：解决"创建入口分裂"这一首要痛点 |
+| 项目/时间线/分组/归档是列表的**视图模式** | 直接采纳：项目从"树"降为"组织维度"，浏览免切项目 |
+| 侧栏 Footer 承载账户/租户/用量 | 直接采纳：多租户身份常驻但低噪声 |
+| 底部终端 + Side Pane Tab | 远期：我们的代理/工件已有 ⌘1–9 弹层（D25/R4），不重复建面 |
+| CSS 变量驱动分隔条、自动收起策略 | 实现层采纳（现有 divider 逻辑升级） |
+| 绿色统一确认 | 与 InlineConfirmCard 语义合并考虑 |
+
+## 3. 设计原则（继承 + 新增）
+
+继承界面五原则（D25–D33 提案 §1.2：中栏做空、消息是事件流卡片是状态对象、弹层是加速器、待办不沉没、确认留痕）与 D26（无全局顶栏）。新增：
+
+- **P6 单一主创建入口**：创建动作只有一个主按钮（新建任务=会话），其余创建（项目等）收进它的次级菜单或组织区的显式 +。位置固定在侧栏顶部第一位，快捷键 ⌘N。
+- **P7 身份常驻**：用户（头像/名/租户/角色）常驻侧栏 Footer；一切跨租户资源不可见性由服务端保证（D18 不变）。
+- **P8 组织即视图**：项目/时间线/归档是任务列表的切换视图，不改变数据模型（`conversations.project_id` 不变），切换是本端偏好。
+
+## 4. 三个方案
+
+demo：`ui-redesign-demos/demo-a-task-centric.html` / `demo-b-activity-rail.html` / `demo-c-project-portal.html`（含明暗主题切换；方案 A 含完整交互演示）。
+
+### 方案 A：任务中心（ZCode 同构）——**推荐**
+
+```
+┌────────────────────┬──────────────────────────────┬─────────────────┐
+│ Agent-System       │ [项目徽章] 会话标题      ⋯    │ 收件箱        2 │
+│ [＋ 新建任务 ⌘N ▾] │ 状态 · 模型 · 更新于 3 分钟前 │ [待办][全部]    │
+│ [🔍 搜索 ⌘K]       ├──────────────────────────────┤ ⚠ 发布前确认    │
+│ 组织 [项目|时间线] ⋯│                              │ ▷ 记忆库索引 68% │
+│ 📌 置顶            │      消息流 + 内联确认卡      │ ✓ 周报已生成    │
+│ ▾ 研发体系文档 (4) │                              │ − 已确认(折叠)  │
+│   • 任务…          ├──────────────────────────────┤─────────────────│
+│ ▸ 真实模型测试 (2) │ [附件] 输入框…        [发送] │ 代理 2 · 工件 5 │
+│ 👤 weichen · 个人  │                              │                 │
+│  租户        ⚙ 🌓  │                              │                 │
+└────────────────────┴──────────────────────────────┴─────────────────┘
+```
+
+- **新建任务**（主按钮，split menu）：默认在"当前项目上下文"建会话；▾ 展开新建项目/新建任务于指定项目/导入。解决入口分裂：一个位置、有主次、带快捷键。
+- **组织切换**：按项目（分组可折叠，组头 hover 出「在此项目新建」）/ 按时间线（今天/昨天/本周）。置顶区恒在顶部；过滤菜单含归档视图与排序。
+- 任务行：状态点（运行中/待我确认/空闲/已完成）+ 相对时间 + 所属项目徽章（时间线模式）。
+- **Footer 账户区**：用户 chip（点头像弹账户菜单：信息/切换租户/API 密钥/退出）+ 设置 + 主题。
+- 中栏头沿用 D26：项目徽章 + 会话标题 + 状态；右栏纯收件箱（D25 不变），底部快捷链接进 ⌘1–9 弹层。
+- **优点**：创建/浏览/身份三大痛点一次解决；与 ZCode（以及 Linear/ChatGPT 侧栏）这类已验证范式同构；纯前端改造，不动数据模型。
+- **代价**：需重写 `ProjectNav`（约一个组件的量）+ 新增账户菜单；左栏语义从"项目树"变为"任务列表"，用户有一周适应期。
+
+### 方案 B：活动栏 + 上下文列表（VS Code 式）
+
+```
+┌──┬─────────────────┬──────────────────────┬─────────────┐
+│▣ │ 研发体系文档 ▾   │  会话（同 A 中栏）    │ 收件箱      │
+│＋│ [＋ 新会话]      │                      │             │
+│🔍│ ── 会话列表      │                      │             │
+│📭│  • …            │                      │             │
+│🤖│                 │                      │             │
+│📦│                 │                      │             │
+│⚙ │                 │                      │             │
+│👤│                 │                      │             │
+└──┴─────────────────┴──────────────────────┴─────────────┘
+```
+
+- 最左 48px 图标轨切换领域（任务/收件箱/代理/工件/设置/账户），第二栏随活动渲染列表。
+- **优点**：导航可无限扩展（插件域友好）；账户/设置有恒定图标位。
+- **代价**：**创建仍是二级动作**（先选项目再新建），痛点 1 只部分解决；多一列常驻（1280px 屏占 6%）；与 D25"代理/工件走弹层"重复建面。判定：适合域数量 ≥ 6 时再启用。
+
+### 方案 C：项目门户（Notion/Linear 式）
+
+```
+┌──────────────┬────────────────────────────────┐
+│ [＋ 新项目]   │ 研发体系文档      12 会话 · 3 运行│
+│ ▸ 文档智能体  │ ┌─────┐┌─────┐┐─────┐          │
+│ ▸ 记忆库建设  │ │会话卡││会话卡││ ＋ 新│          │
+│ ▸ 模型测试    │ └─────┘└─────┘└─────┘          │
+│ 👤 weichen   │ 点会话卡 → 进入对话视图          │
+└──────────────┴────────────────────────────────┘
+```
+
+- 项目是页面：首页是会话卡片网格 + 统计 + 项目内新建（入口在上下文中，最贴任务）。
+- **优点**：项目级总览最好；新建会话离上下文最近。
+- **代价**：对话-first 被破坏（打开高频会话多一跳）；卡片网格信息密度低；与"中栏做空"张力最大。判定：适合项目数少（<10）且以交付物为中心的用法。
+
+### 对比与推荐
+
+| 维度 | A 任务中心 | B 活动栏 | C 项目门户 |
+|---|---|---|---|
+| 解决创建入口分裂 | **完全** | 部分 | 部分（上下文内） |
+| 跨项目浏览 | **优（视图切换）** | 中 | 中 |
+| 身份/租户常驻 | **Footer 账户区** | 图标位 | Footer |
+| 与既有决策兼容（D25/D26/D31） | **完全** | 需调 D25 | 张力大 |
+| 改造量 | 中（左栏+账户菜单） | 大 | 大（含视图路由） |
+| 扩展性（未来插件域） | 中 | **优** | 中 |
+
+**推荐 A**，并以 A 的 Footer 账户区 + 账户菜单吸收 B 的"账户恒定入口"优点。B 的活动栏留作域数量增长后的演进项（远期不否决）。
+
+## 5. 多用户与多租户设计（认证阶段 2）
+
+demo：`ui-redesign-demos/demo-auth.html`（登录/注册/账户与租户三屏）。
+
+### 5.1 身份模型演进（延续 D17 编号段，新决策从 D34 起，本文只提案）
+
+- **阶段 1（现状，保留）**：API key（`ask_`）即身份，user 即租户 owner，嵌入式档默认关闭认证。
+- **阶段 2（本设计）**：
+  - `users` 增 `email`、`password_hash`（argon2id）、`status`；`organizations`（租户）与 `memberships`（user × org × role: owner/admin/member）分离——**user 不再天然等于租户**，一个用户可属多租户。
+  - 登录：邮箱 + 密码 → 服务端会话（`sessions` 表，HttpOnly+SameSite=Lax cookie，滑动过期）；**API key 保留**为程序化访问凭证，挂到 user，权限同其成员角色。
+  - 阶段 1 过换路径：每个既有 owner user 自动建同名个人租户并设 owner；API key 归属不变。
+- **SSE 认证升级**：会话 cookie 使 EventSource 同源自动携带，**移除 `?key=` URL 传钥**（消除 D17 §3 记录的日志泄露权衡）；API key 客户端仍可用 header。
+
+### 5.2 界面表面
+
+| 表面 | 内容 |
+|---|---|
+| 登录页 | 品牌 + 双 tab（访问密钥 / 邮箱密码）+ 注册入口；错误内联；宽屏右侧产品信息面板 |
+| 注册页 | 姓名/邮箱/密码/组织名（即建租户，成为 owner） |
+| 账户菜单（侧栏 Footer） | 头像、显示名、邮箱；当前租户 + 角色徽章；**切换租户**（多租户成员）；API 密钥管理；偏好（主题/语言）；退出 |
+| 成员管理（设置内） | 成员表（邮箱/角色/状态）、邀请（邮件链接或邀请码）、角色变更；仅 owner/admin 可见 |
+| 项目可见性（远期） | 项目级成员范围（默认租户内全员）；跨租户访问仍一律 NotFound（D18） |
+
+### 5.3 服务端边界（不变项）
+
+- 权威在执行端（baseline 硬边界 4）：角色检查在服务端每路由执行，UI 只做可见性降级。
+- 密码哈希 argon2id、会话 cookie HttpOnly；不引入第三方 OAuth（远期）。
+- 限流沿用 D24 租户固定窗口；登录路由加 IP 级失败退避。
+
+## 6. 落地路线（裁定方向后另立实施提案，此处仅示意切分）
+
+| 期 | 内容 | 验收要点 |
+|---|---|---|
+| R1 | 左栏重构（方案 A 任务列表 + 新建任务 + 组织视图 + 置顶/归档）+ 设计令牌接入（modules/ui tokens.css） | 创建入口唯一性走查；对话完备性剧本不回退 |
+| R2 | 登录页 + 阶段 2 认证（orgs/memberships/sessions）+ 侧栏 Footer 账户区 + 迁移 | auth_e2e 扩容；`?key=` 移除后 SSE 全链路 |
+| R3 | 成员管理与邀请、租户切换、API 密钥管理页 | 角色负例（member 越权 NotFound） |
+| R4 | 视觉系统全面收敛（字号阶/语义色/圆角嵌套/绿色统一确认） | 明暗主题截图对比 + 密度走查 |
+
+## 7. Demo 清单
+
+| 文件 | 内容 | 交互 |
+|---|---|---|
+| `index.html` | 方案总览与链接、对比表 | — |
+| `demo-a-task-centric.html` | 方案 A 全应用 | 组织切换、新建菜单、账户菜单、收起轨道、主题、收件箱筛选 |
+| `demo-b-activity-rail.html` | 方案 B | 活动切换、二级列表 |
+| `demo-c-project-portal.html` | 方案 C | 项目切换、进入会话 |
+| `demo-auth.html` | 登录/注册/账户与租户 | 双 tab 登录、注册表单校验、账户菜单、成员管理 |
+
+demo 为静态设计稿（无后端），数据为演示数据；视觉规格（色板/字号/圆角）即 R4 设计令牌的目标值来源。
+
+## 8. 边界与不做
+
+- 本提案不含实施；实施前须用户裁定方案（默认 A）与认证阶段 2 范围。
+- 不做计费/套餐（Footer 用量区留位即可）、不做 SSO/OAuth、不做项目级 ACL（远期，见 5.2）。
+- 中栏与右栏结构不在本次重构范围（D25/D26 已定且未被推翻）；底部终端面板不做（我们非终端工作台）。
diff --git a/docs/proposals/ui-redesign-demos/demo-a-task-centric.html b/docs/proposals/ui-redesign-demos/demo-a-task-centric.html
new file mode 100644
index 0000000..8f7665b
--- /dev/null
+++ b/docs/proposals/ui-redesign-demos/demo-a-task-centric.html
@@ -0,0 +1,631 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>方案 A · 任务中心 — Agent-System 设计稿</title>
+<style>
+/* ============ 设计令牌（R4 目标值来源） ============ */
+:root{
+  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
+  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  --r-xl:12px; --r-lg:10px; --r-md:8px; --r-sm:6px;
+  --ease:.13s ease;
+}
+[data-theme="dark"]{
+  --bg:#121316; --bg-panel:#191a1e; --bg-surface:#1f2026; --bg-raised:#24252c;
+  --bg-hover:#26272f; --bg-selected:#2c2d36; --bg-input:#1c1d22;
+  --border:#282a31; --border-strong:#373943; --border-faint:#202127;
+  --text:#e8e9ec; --text-subtle:#a4a6ae; --text-faint:#71747e; --text-on-accent:#fff;
+  --accent:#5b8def; --accent-dim:rgba(91,141,239,.13); --accent-soft:rgba(91,141,239,.22);
+  --green:#41b26e; --green-dim:rgba(65,178,110,.13); --green-border:rgba(65,178,110,.32);
+  --amber:#d99b3f; --amber-dim:rgba(217,155,63,.13);
+  --red:#e0566b; --red-dim:rgba(224,86,107,.12);
+  --shadow-pop:0 12px 32px rgba(0,0,0,.45), 0 2px 8px rgba(0,0,0,.3);
+  --shadow-card:0 1px 2px rgba(0,0,0,.25);
+  --scroll-thumb:#33353d;
+}
+[data-theme="light"]{
+  --bg:#f6f7f8; --bg-panel:#ffffff; --bg-surface:#ffffff; --bg-raised:#ffffff;
+  --bg-hover:#f0f1f4; --bg-selected:#e8eaf0; --bg-input:#ffffff;
+  --border:#e5e6ea; --border-strong:#d4d6dd; --border-faint:#ececf0;
+  --text:#1d1e23; --text-subtle:#5c5f68; --text-faint:#989ba4; --text-on-accent:#fff;
+  --accent:#3a76e0; --accent-dim:rgba(58,118,224,.09); --accent-soft:rgba(58,118,224,.16);
+  --green:#269a59; --green-dim:rgba(38,154,89,.09); --green-border:rgba(38,154,89,.35);
+  --amber:#a8731d; --amber-dim:rgba(168,115,29,.1);
+  --red:#c84559; --red-dim:rgba(200,69,89,.08);
+  --shadow-pop:0 12px 32px rgba(20,22,28,.14), 0 2px 8px rgba(20,22,28,.08);
+  --shadow-card:0 1px 2px rgba(20,22,28,.05);
+  --scroll-thumb:#d6d8de;
+}
+*{margin:0;padding:0;box-sizing:border-box}
+html,body{height:100%}
+body{font-family:var(--font);font-size:14px;line-height:1.55;color:var(--text);background:var(--bg);overflow:hidden}
+button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}
+button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
+::-webkit-scrollbar{width:10px;height:10px}
+::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:6px;border:3px solid transparent;background-clip:content-box}
+::-webkit-scrollbar-track{background:transparent}
+svg.ic{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
+svg.ic-s{width:14px;height:14px}
+
+/* ============ 应用骨架 ============ */
+.app{display:flex;height:100vh}
+.side{width:var(--side-w,272px);flex:none;transition:width var(--ease)}
+.divider{width:1px;flex:none;background:var(--border-faint);cursor:col-resize;position:relative;z-index:5}
+.divider:hover{background:var(--border-strong)}
+.main{flex:1;min-width:0}
+.inbox{flex:none;width:324px}
+
+/* ============ 左栏 ============ */
+.side{background:var(--bg-panel);display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--border-faint);overflow:hidden}
+.brand{display:flex;align-items:center;gap:8px;padding:12px 12px 8px}
+.brand-mark{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#8f6ce8);display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
+.brand-name{font-weight:600;font-size:13.5px;letter-spacing:.1px}
+.brand .sp{flex:1}
+.iconbtn{width:26px;height:26px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.iconbtn:hover{background:var(--bg-hover);color:var(--text-subtle)}
+
+.primary-actions{padding:4px 10px 8px;display:flex;flex-direction:column;gap:6px}
+.newtask{display:flex;align-items:center;height:36px;border-radius:var(--r-md);background:var(--accent-dim);border:1px solid var(--accent-soft);color:var(--accent);font-weight:600;padding:0 4px 0 10px;gap:8px;transition:background var(--ease)}
+.newtask:hover{background:var(--accent-soft)}
+.newtask .lab{flex:1;text-align:left}
+.kbd{font-size:11px;font-family:var(--mono);background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--text-faint);line-height:1.5}
+.newtask .caret{width:24px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);color:var(--accent)}
+.newtask .caret:hover{background:var(--accent-soft)}
+.searchbtn{display:flex;align-items:center;height:32px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--bg-input);padding:0 8px 0 10px;gap:8px;color:var(--text-faint);font-size:13px}
+.searchbtn:hover{border-color:var(--border-strong);color:var(--text-subtle)}
+.searchbtn .sp{flex:1;text-align:left}
+
+.org-row{display:flex;align-items:center;gap:6px;padding:2px 10px 8px}
+.pills{display:flex;background:var(--bg-input);border:1px solid var(--border);border-radius:8px;padding:2px;gap:2px;flex:1}
+.pill{flex:1;height:24px;border-radius:6px;font-size:12.5px;color:var(--text-faint);display:flex;align-items:center;justify-content:center;gap:5px;transition:all var(--ease)}
+.pill:hover{color:var(--text-subtle)}
+.pill.on{background:var(--bg-raised);color:var(--text);box-shadow:var(--shadow-card);font-weight:500}
+
+.task-scroll{flex:1;overflow-y:auto;padding:0 8px 8px;min-height:0}
+.sec-label{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--text-faint);padding:10px 8px 4px;letter-spacing:.3px}
+.sec-label .ln{flex:1;height:1px;background:var(--border-faint)}
+.group{margin-bottom:2px}
+.group-head{display:flex;align-items:center;gap:6px;height:30px;padding:0 8px;border-radius:var(--r-sm);color:var(--text-subtle);font-weight:500;font-size:13px;cursor:pointer;user-select:none}
+.group-head:hover{background:var(--bg-hover)}
+.group-head .chev{transition:transform var(--ease);color:var(--text-faint)}
+.group.closed .chev{transform:rotate(-90deg)}
+.group-head .cnt{font-size:11.5px;color:var(--text-faint);font-weight:400}
+.group-head .sp{flex:1}
+.group-add{opacity:0;width:22px;height:22px;border-radius:5px;display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.group-head:hover .group-add{opacity:1}
+.group-add:hover{background:var(--bg-selected);color:var(--text)}
+.group.closed .tasks{display:none}
+.tasks{padding-left:6px}
+.task{display:flex;align-items:center;gap:8px;height:30px;padding:0 8px;margin:1px 0;border-radius:var(--r-sm);color:var(--text-subtle);cursor:pointer;position:relative}
+.task:hover{background:var(--bg-hover)}
+.task.on{background:var(--bg-selected);color:var(--text)}
+.task .t{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
+.task .tm{font-size:11px;color:var(--text-faint);font-variant-numeric:tabular-nums}
+.dot{width:7px;height:7px;border-radius:50%;flex:none}
+.dot.run{background:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
+.dot.wait{background:var(--amber);box-shadow:0 0 0 3px var(--amber-dim)}
+.dot.idle{background:var(--border-strong)}
+.dot.done{background:var(--green)}
+.task .pbadge{font-size:10.5px;color:var(--text-faint);background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:0 5px;line-height:1.6;white-space:nowrap}
+
+.side-footer{border-top:1px solid var(--border-faint);padding:8px 10px;display:flex;align-items:center;gap:6px}
+.userchip{display:flex;align-items:center;gap:9px;flex:1;min-width:0;height:38px;padding:0 7px;border-radius:var(--r-md);cursor:pointer;text-align:left}
+.userchip:hover{background:var(--bg-hover)}
+.avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
+.uc-name{font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.uc-sub{font-size:11px;color:var(--text-faint);display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.uc-sub .role{color:var(--text-faint)}
+
+/* 收起轨道 */
+.rail-col{width:52px;flex:none;background:var(--bg-panel);border-right:1px solid var(--border-faint);display:none;flex-direction:column;align-items:center;padding:10px 0;gap:4px}
+.app.rail .side{display:none}
+.app.rail .rail-col{display:flex}
+.rail-col .rb{width:34px;height:34px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;color:var(--text-faint);position:relative}
+.rail-col .rb:hover{background:var(--bg-hover);color:var(--text)}
+.rail-col .rb .bdg{position:absolute;top:3px;right:3px;min-width:14px;height:14px;border-radius:7px;background:var(--amber);color:#fff;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 3px}
+.rail-col .sp{flex:1}
+
+/* ============ 中栏 ============ */
+.main{display:flex;flex-direction:column;min-width:0;background:var(--bg)}
+.conv-head{padding:12px 20px 10px;border-bottom:1px solid var(--border-faint)}
+.ch-row{display:flex;align-items:center;gap:8px}
+.proj-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:6px;background:var(--accent-dim);border:1px solid var(--accent-soft);color:var(--accent);font-size:12px;font-weight:500;cursor:pointer}
+.ch-sep{color:var(--text-faint);font-size:12px}
+.ch-title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.ch-row .sp{flex:1}
+.btn{height:28px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-surface);display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-subtle);transition:all var(--ease)}
+.btn:hover{border-color:var(--border-strong);color:var(--text);background:var(--bg-raised)}
+.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--text-on-accent);font-weight:600}
+.btn.primary:hover{filter:brightness(1.08)}
+.btn.green{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
+.btn.green:hover{filter:brightness(1.08)}
+.btn.sm{height:24px;padding:0 9px;font-size:12px}
+.ch-sub{margin-top:5px;font-size:12px;color:var(--text-faint);display:flex;align-items:center;gap:10px}
+.ch-sub .st{display:inline-flex;align-items:center;gap:5px;color:var(--text-subtle)}
+.ch-sub .st .dot{width:6px;height:6px}
+
+.msgs{flex:1;overflow-y:auto;padding:20px 24px 12px;min-height:0}
+.msg{margin-bottom:20px;max-width:820px}
+.m-user{display:flex;justify-content:flex-end}
+.m-user .bubble{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:10px 14px;max-width:74%;box-shadow:var(--shadow-card)}
+.m-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px}
+.m-mark{width:20px;height:20px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#8f6ce8);color:#fff;display:flex;align-items:center;justify-content:center}
+.m-name{font-size:12.5px;font-weight:600}
+.m-model{font-size:10.5px;color:var(--text-faint);border:1px solid var(--border);border-radius:4px;padding:0 5px;line-height:1.6}
+.m-time{font-size:11px;color:var(--text-faint)}
+.m-body{font-size:14px;color:var(--text);line-height:1.7}
+.m-body p+p{margin-top:8px}
+.m-body code{font-family:var(--mono);font-size:12.5px;background:var(--bg-input);border:1px solid var(--border-faint);border-radius:4px;padding:1px 5px}
+.toolblock{border:1px solid var(--border);border-radius:var(--r-md);margin:10px 0;background:var(--bg-panel);overflow:hidden}
+.tb-head{display:flex;align-items:center;gap:8px;height:32px;padding:0 10px;font-size:12.5px;color:var(--text-subtle);cursor:pointer}
+.tb-head:hover{background:var(--bg-hover)}
+.tb-head .wrench{color:var(--text-faint)}
+.tb-head .res{margin-left:auto;font-size:11.5px;color:var(--text-faint)}
+.tb-body{display:none;border-top:1px solid var(--border-faint);padding:10px 12px;font-family:var(--mono);font-size:12px;color:var(--text-subtle);line-height:1.7}
+.toolblock.open .tb-body{display:block}
+
+.confirm-card{border:1px solid var(--green-border);background:var(--green-dim);border-radius:var(--r-lg);padding:12px 14px;margin:12px 0;max-width:640px}
+.cc-head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:13.5px}
+.cc-head .ic{color:var(--green)}
+.cc-body{font-size:13px;color:var(--text-subtle);margin:6px 0 10px;line-height:1.6}
+.cc-actions{display:flex;gap:8px;align-items:center}
+.cc-src{margin-left:auto;font-size:11px;color:var(--text-faint)}
+
+.artifact-card{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:var(--r-md);padding:10px 12px;margin:10px 0;max-width:520px;background:var(--bg-panel);cursor:pointer}
+.artifact-card:hover{border-color:var(--border-strong);background:var(--bg-hover)}
+.aft-ic{width:32px;height:32px;border-radius:var(--r-sm);background:var(--accent-dim);color:var(--accent);display:flex;align-items:center;justify-content:center}
+.aft-name{font-size:13px;font-weight:600}
+.aft-meta{font-size:11.5px;color:var(--text-faint)}
+
+.composer-wrap{padding:8px 24px 16px}
+.composer{border:1px solid var(--border);border-radius:var(--r-xl);background:var(--bg-input);box-shadow:var(--shadow-card);transition:border-color var(--ease)}
+.composer:focus-within{border-color:var(--accent)}
+.composer textarea{width:100%;border:none;background:transparent;resize:none;font:inherit;color:var(--text);padding:11px 14px 4px;min-height:24px;outline:none}
+.composer textarea::placeholder{color:var(--text-faint)}
+.cmp-row{display:flex;align-items:center;gap:6px;padding:6px 8px 8px}
+.cmp-ic{width:28px;height:28px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.cmp-ic:hover{background:var(--bg-hover);color:var(--text-subtle)}
+.slash-hint{font-size:11.5px;color:var(--text-faint);border:1px dashed var(--border-strong);border-radius:4px;padding:1px 7px;cursor:pointer}
+.slash-hint:hover{color:var(--text-subtle)}
+.model-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:6px;border:1px solid var(--border);font-size:11.5px;color:var(--text-subtle);cursor:pointer}
+.model-chip:hover{border-color:var(--border-strong)}
+.cmp-row .sp{flex:1}
+.send{width:30px;height:30px;border-radius:var(--r-sm);background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center}
+.send:hover{filter:brightness(1.1)}
+
+/* ============ 右栏：收件箱 ============ */
+.inbox{background:var(--bg-panel);border-left:1px solid var(--border-faint);display:flex;flex-direction:column;min-width:0}
+.ib-head{padding:12px 14px 8px}
+.ib-title{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600}
+.ib-badge{min-width:18px;height:18px;border-radius:9px;background:var(--amber);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px}
+.ib-pills{display:flex;gap:6px;margin-top:8px}
+.ib-pill{height:24px;padding:0 10px;border-radius:12px;font-size:12px;color:var(--text-faint);border:1px solid var(--border);display:flex;align-items:center;gap:5px}
+.ib-pill:hover{color:var(--text-subtle)}
+.ib-pill.on{background:var(--bg-selected);border-color:var(--border-strong);color:var(--text);font-weight:500}
+.ib-scroll{flex:1;overflow-y:auto;padding:2px 10px 10px;min-height:0}
+.ib-card{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg-surface);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow-card)}
+.ib-card .ttl{display:flex;align-items:flex-start;gap:8px;font-size:13px;font-weight:600;line-height:1.45}
+.ib-card .ttl .ic{margin-top:2px}
+.ib-card .mta{font-size:11.5px;color:var(--text-faint);margin-top:3px}
+.ib-card .acts{display:flex;gap:6px;margin-top:8px}
+.ib-card.dim{opacity:.62}
+.ib-card.dim:hover{opacity:1}
+.pbar{height:4px;border-radius:2px;background:var(--bg-hover);margin-top:8px;overflow:hidden}
+.pbar i{display:block;height:100%;border-radius:2px;background:var(--accent);width:68%}
+.prog-num{font-size:11px;color:var(--text-subtle);font-variant-numeric:tabular-nums;margin-top:4px;display:flex;justify-content:space-between}
+.ib-foot{border-top:1px solid var(--border-faint);padding:8px 12px;display:flex;gap:6px}
+.ib-link{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:28px;border-radius:var(--r-sm);border:1px solid var(--border);font-size:12px;color:var(--text-subtle)}
+.ib-link:hover{background:var(--bg-hover);color:var(--text)}
+.ib-link .n{font-size:10.5px;background:var(--bg-selected);border-radius:8px;padding:0 6px;line-height:1.7}
+
+/* ============ 弹层 ============ */
+.pop{position:fixed;z-index:50;min-width:230px;background:var(--bg-raised);border:1px solid var(--border-strong);border-radius:var(--r-lg);box-shadow:var(--shadow-pop);padding:5px;display:none}
+.pop.show{display:block}
+.pi{display:flex;align-items:center;gap:9px;height:32px;padding:0 9px;border-radius:var(--r-sm);font-size:13px;color:var(--text-subtle);cursor:pointer;width:100%;text-align:left}
+.pi:hover{background:var(--bg-hover);color:var(--text)}
+.pi .kbd{margin-left:auto}
+.pi.danger{color:var(--red)}
+.pi.danger:hover{background:var(--red-dim)}
+.pdiv{height:1px;background:var(--border-faint);margin:5px 4px}
+.pop .ph{padding:8px 9px 6px;font-size:11px;color:var(--text-faint);letter-spacing:.3px}
+.acc-head{display:flex;gap:10px;padding:8px 9px;align-items:center}
+.acc-head .avatar{width:32px;height:32px;font-size:13px}
+.acc-name{font-size:13.5px;font-weight:600}
+.acc-mail{font-size:11.5px;color:var(--text-faint)}
+.org-rowline{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:var(--r-sm);cursor:pointer}
+.org-rowline:hover{background:var(--bg-hover)}
+.org-rowline .oi{width:24px;height:24px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex:none}
+.org-rowline .on{flex:1;min-width:0}
+.org-rowline .on .n{font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.org-rowline .on .r{font-size:11px;color:var(--text-faint)}
+.role-chip{font-size:10px;border-radius:4px;padding:1px 6px;font-weight:600;letter-spacing:.3px}
+.role-chip.owner{background:var(--accent-dim);color:var(--accent)}
+.role-chip.admin{background:var(--green-dim);color:var(--green)}
+.role-chip.member{background:var(--bg-hover);color:var(--text-faint)}
+
+/* 演示角标 */
+.demo-tag{position:fixed;left:14px;bottom:12px;z-index:60;font-size:11px;color:var(--text-faint);background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;box-shadow:var(--shadow-card);display:flex;gap:8px;align-items:center;pointer-events:none}
+.demo-tag b{color:var(--text-subtle);font-weight:600}
+@media (max-width:1100px){.side{width:232px}.inbox{width:280px}}
+</style>
+</head>
+<body>
+<div class="app" id="app">
+
+  <!-- ═══════════ 左栏：任务列表 ═══════════ -->
+  <aside class="side">
+    <div class="brand">
+      <div class="brand-mark"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><path d="M12 9V5.3M14.6 10.5l3.3-1.9M14.6 13.5l3.3 1.9M12 15v3.7M9.4 13.5l-3.3 1.9M9.4 10.5 6.1 8.6" stroke="#fff" stroke-width="1.3"/></svg></div>
+      <span class="brand-name">Agent-System</span>
+      <span class="sp"></span>
+      <button class="iconbtn" title="收起侧栏（⌘B）" onclick="toggleRail()"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="2.5"/><path d="M9.5 4v16"/></svg></button>
+    </div>
+
+    <div class="primary-actions">
+      <button class="newtask" id="nt-btn" onclick="pop(event,'nt-pop')">
+        <svg class="ic" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>
+        <span class="lab">新建任务</span>
+        <span class="kbd">⌘N</span>
+        <span class="caret" onclick="pop(event,'nt-pop');event.stopPropagation()" title="更多创建选项"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="m6 9 6 6 6-6"/></svg></span>
+      </button>
+      <button class="searchbtn">
+        <svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg>
+        <span class="sp">搜索任务、命令与工件</span>
+        <span class="kbd">⌘K</span>
+      </button>
+    </div>
+
+    <div class="org-row">
+      <div class="pills" id="org-pills">
+        <button class="pill on" data-org="proj" onclick="setOrg('proj')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z"/></svg>按项目</button>
+        <button class="pill" data-org="time" onclick="setOrg('time')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.5"/><path d="M12 7.5V12l3 2"/></svg>时间线</button>
+      </div>
+      <button class="iconbtn" style="width:28px;height:28px;border:1px solid var(--border)" title="排序与过滤" onclick="pop(event,'fl-pop')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M4 6h16M7 12h10M10 18h4"/></svg></button>
+    </div>
+
+    <div class="task-scroll">
+      <!-- 置顶区（全局置顶，归档态也保持可见） -->
+      <div class="sec-label" id="pin-label"><svg class="ic ic-s" viewBox="0 0 24 24" style="width:12px;height:12px"><path d="M9 4h6l-1 7 3 3H7l3-3Z"/><path d="M12 14v6"/></svg>置顶<span class="ln"></span></div>
+      <div class="tasks" id="pin-tasks">
+        <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">两树一网模型 v3 设计</span><span class="tm">09:41</span></div>
+      </div>
+
+      <!-- 按项目视图 -->
+      <div id="org-proj">
+        <div class="sec-label">项目<span class="ln"></span></div>
+        <div class="group">
+          <div class="group-head" onclick="tglGrp(this,event)">
+            <svg class="ic ic-s chev" viewBox="0 0 24 24"><path d="m9 6 6 6-6 6"/></svg>
+            <span>研发体系文档</span><span class="cnt">4</span><span class="sp"></span>
+            <button class="group-add" title="在此项目新建任务" onclick="event.stopPropagation()"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg></button>
+          </div>
+          <div class="tasks">
+            <div class="task on" onclick="pick(this)"><span class="dot run"></span><span class="t">本周周报起草与素材汇总</span><span class="tm">3 分钟</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot wait"></span><span class="t">接口设计文档评审</span><span class="tm">1 小时</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">文档规范修订意见收集</span><span class="tm">昨天</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot done"></span><span class="t">8 月文档资产盘点</span><span class="tm">周二</span></div>
+          </div>
+        </div>
+        <div class="group">
+          <div class="group-head" onclick="tglGrp(this,event)">
+            <svg class="ic ic-s chev" viewBox="0 0 24 24"><path d="m9 6 6 6-6 6"/></svg>
+            <span>记忆库建设</span><span class="cnt">3</span><span class="sp"></span>
+            <button class="group-add" title="在此项目新建任务" onclick="event.stopPropagation()"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg></button>
+          </div>
+          <div class="tasks">
+            <div class="task" onclick="pick(this)"><span class="dot run"></span><span class="t">记忆库索引重建</span><span class="tm">4 分钟</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">知识条目去重策略</span><span class="tm">周一</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">外部语料导入试点</span><span class="tm">9/26</span></div>
+          </div>
+        </div>
+        <div class="group closed">
+          <div class="group-head" onclick="tglGrp(this,event)">
+            <svg class="ic ic-s chev" viewBox="0 0 24 24"><path d="m9 6 6 6-6 6"/></svg>
+            <span>真实模型测试</span><span class="cnt">2</span><span class="sp"></span>
+            <button class="group-add" title="在此项目新建任务" onclick="event.stopPropagation()"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg></button>
+          </div>
+          <div class="tasks">
+            <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">GLM-4.6 长文抽取对比</span><span class="tm">9/25</span></div>
+            <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">多代理协作压测</span><span class="tm">9/24</span></div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 时间线视图 -->
+      <div id="org-time" style="display:none">
+        <div class="sec-label">今天<span class="ln"></span></div>
+        <div class="tasks">
+          <div class="task" onclick="pick(this)"><span class="dot run"></span><span class="t">本周周报起草与素材汇总</span><span class="pbadge">研发体系文档</span></div>
+          <div class="task" onclick="pick(this)"><span class="dot run"></span><span class="t">记忆库索引重建</span><span class="pbadge">记忆库建设</span></div>
+          <div class="task" onclick="pick(this)"><span class="dot wait"></span><span class="t">接口设计文档评审</span><span class="pbadge">研发体系文档</span></div>
+        </div>
+        <div class="sec-label">昨天<span class="ln"></span></div>
+        <div class="tasks">
+          <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">文档规范修订意见收集</span><span class="pbadge">研发体系文档</span></div>
+          <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">两树一网模型 v3 设计</span><span class="pbadge">置顶</span></div>
+        </div>
+        <div class="sec-label">本周更早<span class="ln"></span></div>
+        <div class="tasks">
+          <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">知识条目去重策略</span><span class="pbadge">记忆库建设</span></div>
+          <div class="task" onclick="pick(this)"><span class="dot done"></span><span class="t">8 月文档资产盘点</span><span class="pbadge">研发体系文档</span></div>
+          <div class="task" onclick="pick(this)"><span class="dot idle"></span><span class="t">GLM-4.6 长文抽取对比</span><span class="pbadge">真实模型测试</span></div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 账户区：身份常驻（P7） -->
+    <div class="side-footer">
+      <button class="userchip" onclick="pop(event,'acc-pop')">
+        <span class="avatar">W</span>
+        <span style="min-width:0;flex:1">
+          <div class="uc-name">weichen</div>
+          <div class="uc-sub">研发体系团队 · <span class="role-chip owner" style="font-size:9.5px">OWNER</span></div>
+        </span>
+        <svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--text-faint)"><path d="m8 9-4 3 4 3M16 9l4 3-4 3M13 5l-2 14"/></svg>
+      </button>
+      <button class="iconbtn" title="设置" onclick="toast('设置（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12c0 .4 0 .8.1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.06-.4.1-.8.1-1.2Z"/></svg></button>
+      <button class="iconbtn" title="切换主题" onclick="setTheme()"><svg class="ic ic-s" viewBox="0 0 24 24" id="theme-ic"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8Z"/></svg></button>
+    </div>
+  </aside>
+
+  <!-- 收起轨道 -->
+  <div class="rail-col">
+    <button class="rb" title="展开侧栏（⌘B）" onclick="toggleRail()"><svg class="ic" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="2.5"/><path d="M15 4v16"/></svg></button>
+    <button class="rb" title="新建任务 ⌘N"><svg class="ic" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg></button>
+    <button class="rb" title="搜索 ⌘K"><svg class="ic" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg></button>
+    <span class="sp"></span>
+    <button class="rb" title="收件箱"><svg class="ic" viewBox="0 0 24 24"><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.4 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.4-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.8 1.1Z"/></svg><span class="bdg">2</span></button>
+    <button class="rb" title="weichen" onclick="toggleRail()"><span class="avatar" style="width:24px;height:24px;font-size:11px">W</span></button>
+  </div>
+
+  <div class="divider" title="拖动调整宽度"></div>
+
+  <!-- ═══════════ 中栏：会话 ═══════════ -->
+  <main class="main">
+    <div class="conv-head">
+      <div class="ch-row">
+        <button class="proj-chip" title="切换项目"><svg class="ic ic-s" viewBox="0 0 24 24" style="width:13px;height:13px"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z"/></svg>研发体系文档</button>
+        <span class="ch-sep">/</span>
+        <span class="ch-title" title="点击重命名">本周周报起草与素材汇总</span>
+        <span class="sp"></span>
+        <button class="btn" onclick="toast('分享链接已复制（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 3v12M8 7l4-4 4 4"/><path d="M5 13v6a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"/></svg>分享</button>
+        <button class="iconbtn" style="border:1px solid var(--border)" onclick="pop(event,'more-pop')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="5" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="19" cy="12" r="1.4" fill="currentColor" stroke="none"/></svg></button>
+      </div>
+      <div class="ch-sub">
+        <span class="st"><span class="dot run"></span>2 个代理运行中</span>
+        <span>更新于 3 分钟前</span>
+        <span>·</span>
+        <span>消息 18 条</span>
+      </div>
+    </div>
+
+    <div class="msgs">
+      <div class="msg m-user">
+        <div class="bubble">把记忆库建设项目的本周素材汇总一下，并起草周报——重点写「两树一网」模型 v3 的进展和接口设计文档的评审安排。</div>
+      </div>
+
+      <div class="msg">
+        <div class="m-meta">
+          <span class="m-mark"><svg class="ic ic-s" viewBox="0 0 24 24" style="width:12px;height:12px"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="4" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="18.5" cy="8.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="18.5" cy="15.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="5.5" cy="15.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="5.5" cy="8.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/></svg></span>
+          <span class="m-name">助手</span><span class="m-model">GLM-4.6</span><span class="m-time">10:21</span>
+        </div>
+        <div class="m-body">
+          <p>已检索记忆库「记忆库建设」项目本周新增的 23 条素材。要点如下：</p>
+          <p>· <b>两树一网 v3</b>：文档树与追溯网的合并方案已完成初稿，等你之前留的「阶段门禁」意见合并（见下方确认卡）；<br>· <b>接口设计文档</b>：评审材料齐备，建议安排在周四 14:00，涉及 3 个模块的契约变更；<br>· <b>风险</b>：外部语料导入试点在 9/26 触发了 2 条知识条目冲突，已按去重策略合并。</p>
+        </div>
+        <div class="toolblock" onclick="this.classList.toggle('open')">
+          <div class="tb-head">
+            <svg class="ic ic-s wrench" viewBox="0 0 24 24"><path d="M14.7 6.3a4.5 4.5 0 0 0-6 5.6L3 17.6V21h3.4l5.7-5.7a4.5 4.5 0 0 0 5.6-6L14.5 12l-2.5-2.5Z"/></svg>
+            检索知识库 · <code style="font-size:11.5px">rag.search("记忆库建设 本周")</code>
+            <span class="res">23 段命中 · 0.8s</span>
+            <svg class="ic ic-s" viewBox="0 0 24 24" style="margin-left:6px;color:var(--text-faint)"><path d="m6 9 6 6 6-6"/></svg>
+          </div>
+          <div class="tb-body">query="记忆库建设 本周" → 向量 18 + 全文 RRF 融合 → rerank top-23<br>片段 #4【两树一网 v3 合并方案初稿 · 09-30】置信 0.91<br>片段 #9【接口契约变更清单 · 09-29】置信 0.87<br>…</div>
+        </div>
+        <div class="confirm-card">
+          <div class="cc-head"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="m8.5 12.2 2.4 2.4 4.6-5"/></svg>等待确认：生成《本周周报》草稿</div>
+          <div class="cc-body">按「进展 / 评审安排 / 风险」三节起草，约 1200 字，图表以表格呈现。确认后写入工件并回写本会话时间线。</div>
+          <div class="cc-actions">
+            <button class="btn green sm" onclick="toast('已确认 · 回写时间线（设计稿示意）')">确认生成</button>
+            <button class="btn sm" onclick="toast('已转入对话调整（设计稿示意）')">调整大纲</button>
+            <span class="cc-src">来源：消息 #6 · 10:22</span>
+          </div>
+        </div>
+      </div>
+
+      <div class="msg m-user">
+        <div class="bubble">可以，按这个大纲生成。评审时间改成周五上午。</div>
+      </div>
+
+      <div class="msg">
+        <div class="m-meta">
+          <span class="m-mark"><svg class="ic ic-s" viewBox="0 0 24 24" style="width:12px;height:12px"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="4" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="18.5" cy="8.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="18.5" cy="15.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="5.5" cy="15.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/><circle cx="5.5" cy="8.5" r="1.5" fill="#fff" stroke="none" opacity=".85"/></svg></span>
+          <span class="m-name">助手</span><span class="m-model">GLM-4.6</span><span class="m-time">10:24</span>
+        </div>
+        <div class="m-body"><p>周报草稿已生成，评审时间已调整为周五 10:00。工件存于项目工件区，可直接导出 PDF。</p></div>
+        <div class="artifact-card" onclick="toast('打开工件预览（设计稿示意）')">
+          <span class="aft-ic"><svg class="ic" viewBox="0 0 24 24"><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8Z"/><path d="M14 3v5h5"/><path d="M9 13h6M9 17h4"/></svg></span>
+          <span style="flex:1;min-width:0">
+            <div class="aft-name">周报_第39周_研发体系文档.docx</div>
+            <div class="aft-meta">文档 · 1,214 字 · 刚刚生成</div>
+          </span>
+          <svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--text-faint)"><path d="M9 18l6-6-6-6"/></svg>
+        </div>
+      </div>
+    </div>
+
+    <div class="composer-wrap">
+      <div class="composer">
+        <textarea rows="1" placeholder="给助手发消息；/ 唤起命令，@ 引用工件…"></textarea>
+        <div class="cmp-row">
+          <button class="cmp-ic" title="上传附件"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="m21.4 11.1-8.8 8.8a5.5 5.5 0 0 1-7.8-7.8l8.5-8.5a3.7 3.7 0 0 1 5.2 5.2l-8.5 8.5a1.8 1.8 0 0 1-2.6-2.6l7.8-7.7"/></svg></button>
+          <button class="slash-hint">/ 命令</button>
+          <span class="sp"></span>
+          <button class="model-chip"><svg class="ic ic-s" viewBox="0 0 24 24" style="width:12px;height:12px"><rect x="5" y="5" width="14" height="14" rx="3"/><path d="M9 2v3M15 2v3M9 19v3M15 19v3M2 9h3M2 15h3M19 9h3M19 15h3"/></svg>GLM-4.6</button>
+          <button class="send" title="发送（⏎）"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 19V5M5 12l7-7 7 7"/></svg></button>
+        </div>
+      </div>
+    </div>
+  </main>
+
+  <div class="divider" title="拖动调整宽度"></div>
+
+  <!-- ═══════════ 右栏：收件箱（D25 纯收件箱） ═══════════ -->
+  <aside class="inbox">
+    <div class="ib-head">
+      <div class="ib-title">
+        <svg class="ic" viewBox="0 0 24 24"><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.4 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.4-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.8 1.1Z"/></svg>
+        收件箱<span class="ib-badge" id="ib-badge">2</span>
+      </div>
+      <div class="ib-pills">
+        <button class="ib-pill on" data-f="todo" onclick="setIb('todo')">待办 2</button>
+        <button class="ib-pill" data-f="all" onclick="setIb('all')">全部 4</button>
+      </div>
+    </div>
+    <div class="ib-scroll" id="ib-scroll">
+      <div class="ib-card" data-k="todo">
+        <div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--amber)"><path d="M12 3 2.5 20h19Z"/><path d="M12 10v4M12 17.5v.1"/></svg><span>发布前确认：《接口设计文档》3 处契约变更</span></div>
+        <div class="mta">接口设计文档评审 · 10 分钟前</div>
+        <div class="acts"><button class="btn sm primary" onclick="toast('打开确认卡（设计稿示意）')">查看</button><button class="btn sm" onclick="toast('已确认（设计稿示意）')">确认</button></div>
+      </div>
+      <div class="ib-card" data-k="todo">
+        <div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--accent)"><path d="M12 3v4M12 17v4M3 12h4M17 12h4" opacity=".4"/><circle cx="12" cy="12" r="3.5"/></svg><span>记忆库索引重建进行中</span></div>
+        <div class="mta">代理 #a3 · 已运行 4 分钟 · 本会话</div>
+        <div class="pbar"><i></i></div>
+        <div class="prog-num"><span>3,412 / 5,020 段</span><span>68%</span></div>
+      </div>
+      <div class="ib-card" data-k="done">
+        <div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--green)"><circle cx="12" cy="12" r="9"/><path d="m8.5 12.2 2.4 2.4 4.6-5"/></svg><span>周报（第 39 周）已生成</span></div>
+        <div class="mta">10:24 · 本会话</div>
+        <div class="acts"><button class="btn sm" onclick="toast('打开工件（设计稿示意）')">打开工件</button></div>
+      </div>
+      <div class="ib-card dim" data-k="done">
+        <div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--text-faint)"><path d="M20 6 9 17l-5-5"/></svg><span>插件 knowledge-graph 升级 2.3.1</span></div>
+        <div class="mta">已确认 · 09:12 · 由 youchen 执行</div>
+      </div>
+    </div>
+    <div class="ib-foot">
+      <button class="ib-link" onclick="toast('代理面板 ⌘2（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="7" rx="2"/><rect x="4" y="13" width="16" height="7" rx="2"/><path d="M8 7.5h.1M8 16.5h.1"/></svg>代理<span class="n">2</span></button>
+      <button class="ib-link" onclick="toast('工件面板 ⌘1（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M21 8 12 3 3 8v8l9 5 9-5Z"/><path d="m3 8 9 5 9-5M12 13v8"/></svg>工件<span class="n">5</span></button>
+      <button class="ib-link" onclick="toast('插件面板（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M9 3v4M15 3v4M9 17v4M15 17v4M3 9h4M3 15h4M17 9h4M17 15h4"/><rect x="7" y="7" width="10" height="10" rx="2"/></svg>插件</button>
+    </div>
+  </aside>
+</div>
+
+<!-- ═══════════ 弹层 ═══════════ -->
+<div class="pop" id="nt-pop" style="width:280px">
+  <button class="pi" onclick="toast('在当前项目新建任务（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>新建任务 · 当前项目<span class="kbd">⌘N</span></button>
+  <div class="pdiv"></div>
+  <button class="pi" onclick="toast('新建项目（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z"/></svg>新建项目…</button>
+  <button class="pi" onclick="toast('选择目标项目（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/><path d="M4 4h4M4 20h4" opacity=".5"/></svg>新建任务于指定项目…</button>
+  <button class="pi" onclick="toast('导入（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 3v12M8 7l4-4 4 4"/><path d="M5 13v6a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"/></svg>导入对话或数据</button>
+</div>
+
+<div class="pop" id="fl-pop">
+  <div class="ph">排序</div>
+  <button class="pi"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--accent)"><path d="m5 13 4 4L19 7"/></svg>最近更新</button>
+  <button class="pi" style="padding-left:32px">创建时间</button>
+  <div class="pdiv"></div>
+  <div class="ph">显示</div>
+  <button class="pi"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3.5"/><path d="m8.5 12.2 2.3 2.3 4.7-5" style="display:none"/></svg>只看我发起的任务</button>
+  <button class="pi" onclick="toast('归档视图（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="5" rx="1.5"/><path d="M5 9v9a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9M10 13h4"/></svg>查看归档</button>
+</div>
+
+<div class="pop" id="more-pop">
+  <button class="pi" onclick="toast('重命名（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>重命名</button>
+  <button class="pi" onclick="toast('置顶（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M9 4h6l-1 7 3 3H7l3-3Z"/><path d="M12 14v6"/></svg>置顶</button>
+  <button class="pi" onclick="toast('导出（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 15V3M8 11l4 4 4-4"/><path d="M5 15v4a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-4"/></svg>导出会话</button>
+  <div class="pdiv"></div>
+  <button class="pi danger" onclick="toast('归档（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="5" rx="1.5"/><path d="M5 9v9a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9M10 13h4"/></svg>归档会话</button>
+</div>
+
+<div class="pop" id="acc-pop" style="width:270px">
+  <div class="acc-head">
+    <span class="avatar">W</span>
+    <span style="min-width:0"><div class="acc-name">weichen</div><div class="acc-mail">weichen@rd-team.cn</div></span>
+  </div>
+  <div class="pdiv"></div>
+  <div class="ph">当前租户</div>
+  <div class="org-rowline">
+    <span class="oi" style="background:linear-gradient(135deg,#5b8def,#8f6ce8)">研</span>
+    <span class="on"><div class="n">研发体系团队</div><div class="r">6 名成员 · 标准档</div></span>
+    <span class="role-chip owner">OWNER</span>
+  </div>
+  <div class="ph">切换租户</div>
+  <div class="org-rowline" onclick="toast('已切换到个人租户（设计稿示意）')">
+    <span class="oi" style="background:#4a5568">W</span>
+    <span class="on"><div class="n">个人租户</div><div class="r">仅自己</div></span>
+    <span class="role-chip owner">OWNER</span>
+  </div>
+  <div class="org-rowline" onclick="toast('已切换到测试租户（设计稿示意）')">
+    <span class="oi" style="background:#2f855a">测</span>
+    <span class="on"><div class="n">测试联调租户</div><div class="r">3 名成员</div></span>
+    <span class="role-chip member">MEMBER</span>
+  </div>
+  <div class="pdiv"></div>
+  <button class="pi" onclick="toast('成员管理（设计稿示意，见 demo-auth）')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="9" cy="8" r="3.5"/><path d="M2.5 20a6.5 6.5 0 0 1 13 0"/><path d="M16 4.6a3.5 3.5 0 0 1 0 6.8M17.5 14.4a6.5 6.5 0 0 1 4 5.6"/></svg>成员与角色</button>
+  <button class="pi" onclick="toast('API 密钥管理（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="8" cy="14" r="4.5"/><path d="m11 11 8.5-8.5M15 7l3 3M18 4l3 3" transform=""/></svg>API 密钥</button>
+  <button class="pi" onclick="toast('偏好设置（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12c0 .4 0 .8.1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.06-.4.1-.8.1-1.2Z"/></svg>偏好设置</button>
+  <div class="pdiv"></div>
+  <button class="pi danger" onclick="toast('已退出登录（设计稿示意）')"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M9 21H6a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3"/><path d="m16 17 5-5-5-5M21 12H9"/></svg>退出登录</button>
+</div>
+
+<div class="demo-tag"><b>方案 A · 任务中心</b>设计稿 · 无后端 · ⌘B 收起侧栏</div>
+
+<script>
+function $(s){return document.querySelector(s)}
+function $$(s){return document.querySelectorAll(s)}
+let openPop=null;
+function pop(e,id){
+  e.stopPropagation();
+  const el=$('#'+id);
+  if(openPop===el){el.classList.remove('show');openPop=null;return}
+  $$('.pop').forEach(p=>p.classList.remove('show'));
+  const r=e.currentTarget.getBoundingClientRect();
+  el.classList.add('show');
+  const w=el.offsetWidth,h=el.offsetHeight;
+  let x=r.left, y=r.bottom+6;
+  if(id==='acc-pop'||id==='more-pop') x=Math.min(r.right-w,innerWidth-w-10);
+  if(id==='fl-pop') x=Math.min(r.right-w,innerWidth-w-10);
+  if(y+h>innerHeight-8) y=r.top-h-6;
+  el.style.left=Math.max(8,x)+'px'; el.style.top=y+'px';
+  openPop=el;
+}
+document.addEventListener('click',()=>{if(openPop){openPop.classList.remove('show');openPop=null}});
+$$('.pop').forEach(p=>p.addEventListener('click',e=>e.stopPropagation()));
+
+function setOrg(k){
+  $$('#org-pills .pill').forEach(p=>p.classList.toggle('on',p.dataset.org===k));
+  $('#org-proj').style.display=k==='proj'?'':'none';
+  $('#org-time').style.display=k==='time'?'':'none';
+}
+function tglGrp(head,e){if(e.target.closest('.group-add'))return;head.parentElement.classList.toggle('closed')}
+function pick(el){$$('.task').forEach(t=>t.classList.remove('on'));el.classList.add('on')}
+function setIb(k){
+  $$('.ib-pill').forEach(p=>p.classList.toggle('on',p.dataset.f===k));
+  $$('.ib-card').forEach(c=>c.style.display=(k==='all'||c.dataset.k==='todo')?'':'none');
+  $('#ib-badge').style.display=k==='todo'?'':'none';
+}
+function toggleRail(){$('#app').classList.toggle('rail')}
+function setTheme(){
+  const h=document.documentElement;
+  h.dataset.theme=h.dataset.theme==='dark'?'light':'dark';
+}
+function toast(msg){
+  let t=$('#__toast');
+  if(!t){t=document.createElement('div');t.id='__toast';
+    t.style.cssText='position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;background:var(--bg-raised);border:1px solid var(--border-strong);color:var(--text);border-radius:8px;padding:8px 16px;font-size:12.5px;box-shadow:var(--shadow-pop);transition:opacity .2s';
+    document.body.appendChild(t)}
+  t.textContent=msg;t.style.opacity=1;
+  clearTimeout(t._h);t._h=setTimeout(()=>t.style.opacity=0,1400);
+}
+document.addEventListener('keydown',e=>{
+  if((e.metaKey||e.ctrlKey)&&e.key.toLowerCase()==='b'){e.preventDefault();toggleRail()}
+  if((e.metaKey||e.ctrlKey)&&e.key.toLowerCase()==='n'){e.preventDefault();toast('新建任务（设计稿示意）')}
+  if((e.metaKey||e.ctrlKey)&&e.key.toLowerCase()==='k'){e.preventDefault();toast('搜索面板（设计稿示意）')}
+});
+</script>
+</body>
+</html>
diff --git a/docs/proposals/ui-redesign-demos/demo-auth.html b/docs/proposals/ui-redesign-demos/demo-auth.html
new file mode 100644
index 0000000..272e0ec
--- /dev/null
+++ b/docs/proposals/ui-redesign-demos/demo-auth.html
@@ -0,0 +1,335 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>认证与租户 — Agent-System 设计稿</title>
+<style>
+:root{--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--r-xl:14px;--r-lg:10px;--r-md:8px;--r-sm:6px;--ease:.13s ease}
+[data-theme="dark"]{--bg:#121316;--bg-panel:#191a1e;--bg-surface:#1f2026;--bg-hover:#26272f;--bg-selected:#2c2d36;--bg-input:#1c1d22;--border:#282a31;--border-strong:#373943;--border-faint:#202127;--text:#e8e9ec;--text-subtle:#a4a6ae;--text-faint:#71747e;--accent:#5b8def;--accent-dim:rgba(91,141,239,.13);--accent-soft:rgba(91,141,239,.22);--green:#41b26e;--green-dim:rgba(65,178,110,.13);--amber:#d99b3f;--amber-dim:rgba(217,155,63,.13);--red:#e0566b;--shadow-pop:0 16px 40px rgba(0,0,0,.5);--shadow-card:0 1px 2px rgba(0,0,0,.25)}
+[data-theme="light"]{--bg:#f6f7f8;--bg-panel:#fff;--bg-surface:#fff;--bg-hover:#f0f1f4;--bg-selected:#e8eaf0;--bg-input:#fff;--border:#e5e6ea;--border-strong:#d4d6dd;--border-faint:#ececf0;--text:#1d1e23;--text-subtle:#5c5f68;--text-faint:#989ba4;--accent:#3a76e0;--accent-dim:rgba(58,118,224,.09);--accent-soft:rgba(58,118,224,.16);--green:#269a59;--green-dim:rgba(38,154,89,.09);--amber:#a8731d;--amber-dim:rgba(168,115,29,.1);--red:#c84559;--shadow-pop:0 16px 40px rgba(20,22,28,.16);--shadow-card:0 1px 2px rgba(20,22,28,.05)}
+*{margin:0;padding:0;box-sizing:border-box}
+html,body{height:100%}
+body{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg);overflow:hidden}
+button,input{font-family:inherit;font-size:inherit;color:inherit}
+button{background:none;border:none;cursor:pointer}
+button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
+svg.ic{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
+svg.ic-s{width:14px;height:14px}
+
+/* 顶栏：屏幕切换（演示控件）+ 主题 */
+.top{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:40;display:flex;gap:4px;background:var(--bg-panel);border:1px solid var(--border);border-radius:10px;padding:4px;box-shadow:var(--shadow-card)}
+.tp{height:28px;padding:0 14px;border-radius:7px;font-size:12.5px;color:var(--text-faint)}
+.tp:hover{color:var(--text-subtle)}
+.tp.on{background:var(--bg-selected);color:var(--text);font-weight:500}
+.tbtn{position:fixed;top:16px;right:16px;z-index:40;width:32px;height:32px;border-radius:8px;background:var(--bg-panel);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.tbtn:hover{color:var(--text-subtle)}
+
+.screen{display:none;height:100vh}
+.screen.on{display:flex}
+
+/* ── 登录/注册：分屏 ── */
+.auth{display:flex;height:100vh}
+.form-side{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;min-width:0}
+.form-card{width:400px;max-width:100%}
+.brand{display:flex;align-items:center;gap:10px;margin-bottom:28px}
+.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent),#8f6ce8);display:flex;align-items:center;justify-content:center;color:#fff}
+.brand-name{font-size:17px;font-weight:700}
+.brand-sub{font-size:11.5px;color:var(--text-faint);margin-top:1px}
+h1.f{font-size:21px;font-weight:700;letter-spacing:-.2px;margin-bottom:4px}
+.f-sub{font-size:13px;color:var(--text-subtle);margin-bottom:22px}
+.tabs{display:flex;gap:4px;background:var(--bg-input);border:1px solid var(--border);border-radius:9px;padding:3px;margin-bottom:18px}
+.tab{flex:1;height:30px;border-radius:7px;font-size:13px;color:var(--text-faint)}
+.tab:hover{color:var(--text-subtle)}
+.tab.on{background:var(--bg-surface);color:var(--text);font-weight:500;box-shadow:var(--shadow-card)}
+.fgrp{margin-bottom:14px}
+.fgrp label{display:block;font-size:12.5px;font-weight:500;color:var(--text-subtle);margin-bottom:6px}
+.inp{width:100%;height:38px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--bg-input);padding:0 12px;transition:border-color var(--ease)}
+.inp::placeholder{color:var(--text-faint)}
+.inp:focus{border-color:var(--accent);outline:none}
+.inp.mono{font-family:var(--mono);font-size:13px}
+.frow{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
+.link{font-size:12px;color:var(--accent);cursor:pointer}
+.link:hover{text-decoration:underline}
+.btn-p{width:100%;height:40px;border-radius:var(--r-md);background:var(--accent);color:#fff;font-weight:600;font-size:14px;margin-top:6px}
+.btn-p:hover{filter:brightness(1.08)}
+.hint{margin-top:10px;font-size:12px;color:var(--text-faint);line-height:1.6;background:var(--bg-panel);border:1px solid var(--border-faint);border-radius:var(--r-md);padding:9px 11px}
+.hint code{font-family:var(--mono);font-size:11px;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:1px 5px}
+.ferr{display:none;margin-top:10px;font-size:12.5px;color:var(--red);background:var(--red-dim,rgba(224,86,107,.1));border:1px solid rgba(224,86,107,.3);border-radius:var(--r-md);padding:8px 11px}
+.fbot{margin-top:20px;text-align:center;font-size:13px;color:var(--text-faint)}
+.strength{display:flex;gap:4px;margin-top:7px}
+.strength i{flex:1;height:3px;border-radius:2px;background:var(--bg-hover)}
+.strength.s2 i:nth-child(-n+2){background:var(--amber)}
+.strength.s3 i{background:var(--green)}
+.note{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--text-faint);margin:-4px 0 14px;line-height:1.55}
+.note .ic{margin-top:1px;color:var(--text-faint);width:13px;height:13px}
+.chk{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--text-subtle);margin:4px 0 14px;line-height:1.5}
+.cbx{width:15px;height:15px;border-radius:4px;border:1px solid var(--border-strong);flex:none;margin-top:1px;position:relative;cursor:pointer}
+.cbx.on::after{content:"";position:absolute;inset:2.5px;border-radius:2px;background:var(--accent)}
+/* 右侧品牌面板 */
+.hero{flex:none;width:44%;max-width:640px;background:linear-gradient(160deg,#1b2340 0%,#252a48 55%,#2c2560 100%);display:flex;flex-direction:column;justify-content:center;padding:64px;color:#dfe3f0;position:relative;overflow:hidden}
+[data-theme="light"] .hero{background:linear-gradient(160deg,#eef2fb,#e8ecf9 60%,#efe9f8)}
+.hero::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(closest-side,rgba(91,141,239,.25),transparent);top:-120px;right:-140px}
+.hero::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(closest-side,rgba(143,108,232,.22),transparent);bottom:-140px;left:-120px}
+.hero h2{font-size:24px;font-weight:700;letter-spacing:-.2px;line-height:1.35;margin-bottom:10px;position:relative}
+.hero p{font-size:14px;opacity:.75;line-height:1.7;position:relative}
+.hero ul{margin-top:26px;list-style:none;display:flex;flex-direction:column;gap:12px;position:relative}
+.hero li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;opacity:.9}
+.hero li svg{margin-top:2px;color:#8fb2ff;flex:none}
+[data-theme="light"] .hero li svg{color:#3a76e0}
+.hero .foot{position:absolute;bottom:28px;left:64px;right:64px;display:flex;justify-content:space-between;font-size:11.5px;opacity:.5}
+@media (max-width:960px){.hero{display:none}}
+
+/* ── 账户与租户屏 ── */
+.acc-wrap{flex:1;display:flex;align-items:center;justify-content:center;gap:28px;padding:60px 24px 24px;flex-wrap:wrap;align-content:center}
+.panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-card)}
+/* 账户菜单（侧栏 Footer 弹出形态） */
+.acc-demo{width:290px;padding:6px}
+.demo-cap{font-size:11px;color:var(--text-faint);letter-spacing:.4px;margin-bottom:8px;display:flex;gap:6px;align-items:center}
+.demo-cap::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--amber)}
+.acc-head{display:flex;gap:11px;padding:9px 10px;align-items:center}
+.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
+.avatar.sm{width:26px;height:26px;font-size:11px}
+.avatar.xs{width:22px;height:22px;font-size:10px}
+.acc-name{font-size:14px;font-weight:600}
+.acc-mail{font-size:12px;color:var(--text-faint)}
+.pdiv{height:1px;background:var(--border-faint);margin:5px 6px}
+.ph{padding:8px 10px 4px;font-size:11px;color:var(--text-faint);letter-spacing:.3px}
+.org-rowline{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:var(--r-sm);cursor:pointer}
+.org-rowline:hover{background:var(--bg-hover)}
+.oi{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:700;color:#fff;flex:none}
+.org-rowline .on2{flex:1;min-width:0}
+.org-rowline .on2 .n{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.org-rowline .on2 .r{font-size:11px;color:var(--text-faint)}
+.role-chip{font-size:9.5px;border-radius:4px;padding:1.5px 6px;font-weight:700;letter-spacing:.4px;flex:none}
+.role-chip.owner{background:var(--accent-dim);color:var(--accent)}
+.role-chip.admin{background:var(--green-dim);color:var(--green)}
+.role-chip.member{background:var(--bg-hover);color:var(--text-faint)}
+.pi{display:flex;align-items:center;gap:9px;height:32px;padding:0 10px;border-radius:var(--r-sm);font-size:13px;color:var(--text-subtle);cursor:pointer;width:100%;text-align:left}
+.pi:hover{background:var(--bg-hover);color:var(--text)}
+.pi.danger{color:var(--red)}
+.pi.danger:hover{background:rgba(224,86,107,.1)}
+.pi .kbd{margin-left:auto}
+.kbd{font-size:11px;font-family:var(--mono);background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--text-faint)}
+/* 成员管理 */
+.mem{width:520px;max-width:100%;padding:0}
+.mem-head{padding:18px 20px 4px;display:flex;align-items:flex-start;gap:10px}
+.mem-head h3{font-size:16px;font-weight:700}
+.mem-head p{font-size:12.5px;color:var(--text-faint);margin-top:3px}
+.mem-head .sp{flex:1}
+.inv{display:flex;gap:8px;padding:12px 20px 4px}
+.inv .inp{flex:1;height:34px}
+.sel{height:34px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--bg-input);padding:0 26px 0 10px;font-size:13px;color:var(--text-subtle);appearance:none;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="%23888" stroke-width="2"><path d="m6 9 6 6 6-6"/></svg>');background-repeat:no-repeat;background-position:right 9px center;cursor:pointer}
+.btn{height:34px;padding:0 16px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--bg-surface);font-size:13px;color:var(--text-subtle);display:inline-flex;align-items:center;gap:6px}
+.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
+.btn.primary:hover{filter:brightness(1.08)}
+.mem-list{padding:10px 12px 14px}
+.mem-row{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:var(--r-md)}
+.mem-row:hover{background:var(--bg-hover)}
+.mem-row .who{min-width:0;flex:1}
+.mem-row .who .n{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:7px}
+.mem-row .who .m{font-size:11.5px;color:var(--text-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.st-chip{font-size:10px;border-radius:4px;padding:1px 6px;font-weight:600}
+.st-chip.active{background:var(--green-dim);color:var(--green)}
+.st-chip.pending{background:var(--amber-dim);color:var(--amber)}
+.mem-row .act{opacity:0;width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.mem-row:hover .act{opacity:1}
+.mem-row .act:hover{background:var(--bg-selected);color:var(--red)}
+.mem-foot{padding:0 20px 16px;font-size:11.5px;color:var(--text-faint);line-height:1.6}
+.demo-tag{position:fixed;left:14px;bottom:12px;z-index:60;font-size:11px;color:var(--text-faint);background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;box-shadow:var(--shadow-card);pointer-events:none}
+.demo-tag b{color:var(--text-subtle);font-weight:600}
+</style>
+</head>
+<body>
+<div class="top">
+  <button class="tp on" data-s="login" onclick="setScreen(this)">登录</button>
+  <button class="tp" data-s="signup" onclick="setScreen(this)">注册</button>
+  <button class="tp" data-s="account" onclick="setScreen(this)">账户与租户</button>
+</div>
+<button class="tbtn" title="切换主题" onclick="const h=document.documentElement;h.dataset.theme=h.dataset.theme==='dark'?'light':'dark'"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8Z"/></svg></button>
+
+<!-- ═══ 登录 ═══ -->
+<div class="screen on" data-s="login">
+  <div class="auth">
+    <div class="form-side">
+      <div class="form-card">
+        <div class="brand">
+          <div class="brand-mark"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/></svg></div>
+          <div><div class="brand-name">Agent-System</div><div class="brand-sub">研发记忆与文档智能体工作台</div></div>
+        </div>
+        <h1 class="f">登录</h1>
+        <div class="f-sub">进入你的组织工作区</div>
+        <div class="tabs">
+          <button class="tab on" data-t="key" onclick="setTab(this)">访问密钥</button>
+          <button class="tab" data-t="pwd" onclick="setTab(this)">邮箱密码</button>
+        </div>
+
+        <div data-t="key">
+          <div class="fgrp">
+            <label>API 访问密钥</label>
+            <input class="inp mono" placeholder="ask_••••••••••••••••••••••" value="ask_7f3a9c2e1b8d4a6f">
+          </div>
+          <div class="ferr" id="key-err" style="display:block">密钥无效或已撤销——请核对后重试，或联系组织管理员重新签发。</div>
+          <button class="btn-p">进入工作台</button>
+          <div class="hint">密钥由服务端管理员创建：<code>agent-system apikey create --owner &lt;name&gt;</code>。密钥等同账户凭证，请勿写入代码库。嵌入部署（未开启认证）时无需登录。</div>
+        </div>
+
+        <div data-t="pwd" style="display:none">
+          <div class="fgrp">
+            <div class="frow"><label>邮箱</label></div>
+            <input class="inp" type="email" placeholder="you@company.com" value="weichen@rd-team.cn">
+          </div>
+          <div class="fgrp">
+            <div class="frow"><label>密码</label><span class="link">忘记密码？</span></div>
+            <input class="inp" type="password" placeholder="••••••••" value="xxxxxxxx">
+          </div>
+          <button class="btn-p">登录</button>
+          <div class="hint">登录建立服务端会话（HttpOnly Cookie）；系统自动选择你上次的组织工作区。程序化访问仍可使用 API 密钥。</div>
+        </div>
+
+        <div class="fbot">还没有组织账户？<span class="link" onclick="setScreen(document.querySelector('[data-s=signup].tp'))">创建组织</span></div>
+      </div>
+    </div>
+    <div class="hero">
+      <h2>把研发记忆<br>变成组织的第二大脑</h2>
+      <p>文档、决策与知识的沉淀、检索与生成——一个面向团队的多租户智能体工作台。</p>
+      <ul>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>项目化的多会话工作区，任务卡片收件箱驱动待办</li>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>组织内成员协作，角色与密钥分级授权</li>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>知识库检索（全文 + 向量）与文档生成流水线</li>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>自托管优先：单二进制部署，数据不出域</li>
+      </ul>
+      <div class="foot"><span>自托管 · 多租户</span><span>Apache-2.0 内核</span></div>
+    </div>
+  </div>
+</div>
+
+<!-- ═══ 注册 ═══ -->
+<div class="screen" data-s="signup">
+  <div class="auth">
+    <div class="form-side">
+      <div class="form-card">
+        <div class="brand">
+          <div class="brand-mark"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/></svg></div>
+          <div><div class="brand-name">Agent-System</div><div class="brand-sub">创建组织（租户）</div></div>
+        </div>
+        <h1 class="f">注册</h1>
+        <div class="f-sub">创建组织后你即为其 OWNER，可邀请成员加入</div>
+        <div class="fgrp"><label>显示名</label><input class="inp" value="weichen"></div>
+        <div class="fgrp"><label>邮箱</label><input class="inp" type="email" placeholder="you@company.com" value="weichen@rd-team.cn"></div>
+        <div class="fgrp"><label>密码</label><input class="inp" type="password" value="••••••••••">
+          <div class="strength s3"><i></i><i></i><i></i><i></i></div>
+        </div>
+        <div class="note"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 8v.1M12 11v5"/></svg>组织名即租户：资源按组织隔离，跨组织一律不可见。个人使用可填「个人租户」。</div>
+        <div class="fgrp"><label>组织名称</label><input class="inp" value="研发体系团队"></div>
+        <label class="chk"><span class="cbx on" onclick="this.classList.toggle('on')"></span><span>我已阅读并同意 <span class="link">服务条款</span> 与 <span class="link">数据处理说明</span>（组织数据仅存储于本部署实例）</span></label>
+        <button class="btn-p">创建组织并进入</button>
+        <div class="fbot">已有账户？<span class="link" onclick="setScreen(document.querySelector('[data-s=login].tp'))">直接登录</span></div>
+      </div>
+    </div>
+    <div class="hero">
+      <h2>为你的团队<br>建立专属智能体工作台</h2>
+      <p>注册即创建一个隔离的租户工作区：项目、会话、知识库与工件都属于组织，成员按角色协作。</p>
+      <ul>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>OWNER / ADMIN / MEMBER 三级角色</li>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>按需签发 API 密钥，随时撤销</li>
+        <li><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></svg>一个账户可加入多个组织，随时切换</li>
+      </ul>
+      <div class="foot"><span>自托管 · 多租户</span><span>Apache-2.0 内核</span></div>
+    </div>
+  </div>
+</div>
+
+<!-- ═══ 账户与租户（应用内表面） ═══ -->
+<div class="screen" data-s="account">
+  <div class="acc-wrap">
+    <div>
+      <div class="demo-cap">侧栏 Footer · 账户菜单（方案 A 形态）</div>
+      <div class="panel acc-demo">
+        <div class="acc-head">
+          <span class="avatar">W</span>
+          <span><div class="acc-name">weichen</div><div class="acc-mail">weichen@rd-team.cn</div></span>
+        </div>
+        <div class="pdiv"></div>
+        <div class="ph">当前租户</div>
+        <div class="org-rowline">
+          <span class="oi" style="background:linear-gradient(135deg,#5b8def,#8f6ce8)">研</span>
+          <span class="on2"><div class="n">研发体系团队</div><div class="r">6 名成员 · 标准档</div></span>
+          <span class="role-chip owner">OWNER</span>
+        </div>
+        <div class="ph">切换租户</div>
+        <div class="org-rowline"><span class="oi" style="background:#4a5568">W</span><span class="on2"><div class="n">个人租户</div><div class="r">仅自己</div></span><span class="role-chip owner">OWNER</span></div>
+        <div class="org-rowline"><span class="oi" style="background:#2f855a">测</span><span class="on2"><div class="n">测试联调租户</div><div class="r">3 名成员</div></span><span class="role-chip member">MEMBER</span></div>
+        <div class="pdiv"></div>
+        <button class="pi"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="9" cy="8" r="3.5"/><path d="M2.5 20a6.5 6.5 0 0 1 13 0"/><path d="M16 4.6a3.5 3.5 0 0 1 0 6.8M17.5 14.4a6.5 6.5 0 0 1 4 5.6"/></svg>成员与角色</button>
+        <button class="pi"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="8" cy="14" r="4.5"/><path d="m11 11 8.5-8.5M15 7l3 3"/></svg>API 密钥<span class="kbd">3 枚活跃</span></button>
+        <button class="pi"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12c0 .4 0 .8.1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.06-.4.1-.8.1-1.2Z"/></svg>偏好设置</button>
+        <div class="pdiv"></div>
+        <button class="pi danger"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M9 21H6a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3"/><path d="m16 17 5-5-5-5M21 12H9"/></svg>退出登录</button>
+      </div>
+    </div>
+    <div>
+      <div class="demo-cap">设置 · 成员与角色（OWNER/ADMIN 可见）</div>
+      <div class="panel mem">
+        <div class="mem-head">
+          <div><h3>成员管理 · 研发体系团队</h3><p>角色变更即时生效；被移除成员的 API 密钥同时失效。</p></div>
+          <span class="sp"></span>
+          <button class="btn"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 3v12M8 7l4-4 4 4"/><path d="M5 13v6a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"/></svg>导出审计</button>
+        </div>
+        <div class="inv">
+          <input class="inp" placeholder="同事的邮箱地址">
+          <select class="sel"><option>MEMBER</option><option>ADMIN</option></select>
+          <button class="btn primary">邀请</button>
+        </div>
+        <div class="mem-list">
+          <div class="mem-row">
+            <span class="avatar sm">W</span>
+            <span class="who"><div class="n">weichen <span class="role-chip owner">OWNER</span></div><div class="m">weichen@rd-team.cn</div></span>
+            <span class="st-chip active">活跃</span>
+            <span style="width:60px;text-align:right;font-size:11.5px;color:var(--text-faint)">刚刚</span>
+            <button class="act" title="移除"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14"/></svg></button>
+          </div>
+          <div class="mem-row">
+            <span class="avatar sm" style="background:#2f855a">Y</span>
+            <span class="who"><div class="n">youchen <span class="role-chip admin">ADMIN</span></div><div class="m">youchen@rd-team.cn</div></span>
+            <span class="st-chip active">活跃</span>
+            <span style="width:60px;text-align:right;font-size:11.5px;color:var(--text-faint)">2 小时前</span>
+            <button class="act" title="移除"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14"/></svg></button>
+          </div>
+          <div class="mem-row">
+            <span class="avatar sm" style="background:#b7791f">L</span>
+            <span class="who"><div class="n">lin.zhou <span class="role-chip member">MEMBER</span></div><div class="m">lin.zhou@rd-team.cn</div></span>
+            <span class="st-chip active">活跃</span>
+            <span style="width:60px;text-align:right;font-size:11.5px;color:var(--text-faint)">昨天</span>
+            <button class="act" title="移除"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14"/></svg></button>
+          </div>
+          <div class="mem-row" style="opacity:.75">
+            <span class="avatar sm" style="background:#718096">H</span>
+            <span class="who"><div class="n">han.mei <span class="role-chip member">MEMBER</span></div><div class="m">han.mei@partner.cn</div></span>
+            <span class="st-chip pending">待接受</span>
+            <span style="width:60px;text-align:right;font-size:11.5px;color:var(--text-faint)">3 天前</span>
+            <button class="act" title="撤销邀请"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 8v8M8 12h8"/><circle cx="12" cy="12" r="9"/></svg></button>
+          </div>
+        </div>
+        <div class="mem-foot">OWNER：管理与计费、角色、密钥、删除组织 · ADMIN：成员与项目、插件 · MEMBER：项目内协作（按项目可见范围）。越权访问一律返回 NotFound，不泄露资源存在性。</div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="demo-tag"><b>认证与租户</b>设计稿 · 无后端 · 顶部切换场景</div>
+<script>
+function setScreen(btn){
+  document.querySelectorAll('.tp').forEach(b=>b.classList.toggle('on',b===btn));
+  document.querySelectorAll('.screen').forEach(s=>s.classList.toggle('on',s.dataset.s===btn.dataset.s));
+}
+function setTab(btn){
+  document.querySelectorAll('.tab').forEach(b=>b.classList.toggle('on',b===btn));
+  document.querySelectorAll('.form-card [data-t]').forEach(d=>{
+    if(d.closest('.tabs'))return;
+    d.style.display=d.dataset.t===btn.dataset.t?'':'none';
+  });
+}
+</script>
+</body>
+</html>
diff --git a/docs/proposals/ui-redesign-demos/demo-b-activity-rail.html b/docs/proposals/ui-redesign-demos/demo-b-activity-rail.html
new file mode 100644
index 0000000..9343548
--- /dev/null
+++ b/docs/proposals/ui-redesign-demos/demo-b-activity-rail.html
@@ -0,0 +1,240 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>方案 B · 活动栏 — Agent-System 设计稿</title>
+<style>
+:root{--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--r-xl:12px;--r-lg:10px;--r-md:8px;--r-sm:6px;--ease:.13s ease}
+[data-theme="dark"]{--bg:#121316;--bg-panel:#191a1e;--bg-rail:#141519;--bg-surface:#1f2026;--bg-hover:#26272f;--bg-selected:#2c2d36;--bg-input:#1c1d22;--border:#282a31;--border-strong:#373943;--border-faint:#202127;--text:#e8e9ec;--text-subtle:#a4a6ae;--text-faint:#71747e;--accent:#5b8def;--accent-dim:rgba(91,141,239,.13);--accent-soft:rgba(91,141,239,.22);--green:#41b26e;--green-dim:rgba(65,178,110,.13);--green-border:rgba(65,178,110,.32);--amber:#d99b3f;--amber-dim:rgba(217,155,63,.13);--red:#e0566b;--shadow-pop:0 12px 32px rgba(0,0,0,.45);--shadow-card:0 1px 2px rgba(0,0,0,.25)}
+[data-theme="light"]{--bg:#f6f7f8;--bg-panel:#fff;--bg-rail:#f0f1f4;--bg-surface:#fff;--bg-hover:#f0f1f4;--bg-selected:#e8eaf0;--bg-input:#fff;--border:#e5e6ea;--border-strong:#d4d6dd;--border-faint:#ececf0;--text:#1d1e23;--text-subtle:#5c5f68;--text-faint:#989ba4;--accent:#3a76e0;--accent-dim:rgba(58,118,224,.09);--accent-soft:rgba(58,118,224,.16);--green:#269a59;--green-dim:rgba(38,154,89,.09);--green-border:rgba(38,154,89,.35);--amber:#a8731d;--amber-dim:rgba(168,115,29,.1);--red:#c84559;--shadow-pop:0 12px 32px rgba(20,22,28,.14);--shadow-card:0 1px 2px rgba(20,22,28,.05)}
+*{margin:0;padding:0;box-sizing:border-box}
+html,body{height:100%}
+body{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg);overflow:hidden}
+button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}
+button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
+::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--bg-selected);border-radius:6px;border:3px solid transparent;background-clip:content-box}
+svg.ic{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
+svg.ic-s{width:14px;height:14px}
+
+.app{display:flex;height:100vh}
+/* ── 活动栏 ── */
+.rail{width:52px;flex:none;background:var(--bg-rail);border-right:1px solid var(--border-faint);display:flex;flex-direction:column;align-items:center;padding:12px 0 10px;gap:4px}
+.brandmark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),#8f6ce8);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:12px;flex:none}
+.ri{width:38px;height:38px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;color:var(--text-faint);position:relative;cursor:pointer;transition:all var(--ease)}
+.ri:hover{background:var(--bg-hover);color:var(--text-subtle)}
+.ri.on{background:var(--accent-dim);color:var(--accent)}
+.ri.on::before{content:"";position:absolute;left:-7px;top:8px;bottom:8px;width:2.5px;border-radius:2px;background:var(--accent)}
+.ri .bdg{position:absolute;top:4px;right:4px;min-width:15px;height:15px;border-radius:8px;background:var(--amber);color:#fff;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0:3px;padding:0 3px}
+.ri .lbl{position:absolute;left:46px;background:var(--bg-surface);border:1px solid var(--border-strong);color:var(--text);font-size:11.5px;padding:3px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--ease);z-index:30;box-shadow:var(--shadow-pop)}
+.ri:hover .lbl{opacity:1}
+.rail .sp{flex:1}
+.avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
+
+/* ── 二级列表 ── */
+.ctx{width:250px;flex:none;background:var(--bg-panel);border-right:1px solid var(--border-faint);display:flex;flex-direction:column;min-width:0}
+.ctx-head{padding:12px 12px 8px}
+.ctx-proj{display:flex;align-items:center;gap:8px;height:32px;padding:0 9px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--bg-input);cursor:pointer;font-weight:600;font-size:13px}
+.ctx-proj:hover{border-color:var(--border-strong)}
+.ctx-proj .oi{width:20px;height:20px;border-radius:5px;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:10.5px;font-weight:700;display:flex;align-items:center;justify-content:center}
+.ctx-proj .cnt{margin-left:auto;font-size:11px;color:var(--text-faint);font-weight:400}
+.ctx-new{display:flex;align-items:center;gap:8px;height:32px;margin-top:8px;border-radius:var(--r-md);background:var(--accent-dim);border:1px solid var(--accent-soft);color:var(--accent);font-weight:600;padding:0 10px;font-size:13px}
+.ctx-new:hover{background:var(--accent-soft)}
+.kbd{font-size:11px;font-family:var(--mono);background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--text-faint)}
+.ctx-scroll{flex:1;overflow-y:auto;padding:0 8px 8px;min-height:0}
+.sec{font-size:11.5px;color:var(--text-faint);padding:10px 8px 4px;letter-spacing:.3px}
+.task{display:flex;align-items:center;gap:8px;height:30px;padding:0 8px;margin:1px 0;border-radius:var(--r-sm);color:var(--text-subtle);cursor:pointer}
+.task:hover{background:var(--bg-hover)}
+.task.on{background:var(--bg-selected);color:var(--text)}
+.task .t{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
+.task .tm{font-size:11px;color:var(--text-faint)}
+.dot{width:7px;height:7px;border-radius:50%;flex:none}
+.dot.run{background:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
+.dot.wait{background:var(--amber);box-shadow:0 0 0 3px var(--amber-dim)}
+.dot.idle{background:var(--border-strong)}
+.dot.done{background:var(--green)}
+.ctx-foot{border-top:1px solid var(--border-faint);padding:8px 10px;display:flex;gap:6px}
+.sbtn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:28px;border-radius:var(--r-sm);border:1px solid var(--border);font-size:12px;color:var(--text-subtle)}
+.sbtn:hover{background:var(--bg-hover);color:var(--text)}
+
+/* ── 中栏/右栏（与方案 A 同构，从简） ── */
+.main{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--bg)}
+.conv-head{padding:12px 20px 10px;border-bottom:1px solid var(--border-faint)}
+.ch-row{display:flex;align-items:center;gap:8px}
+.ch-title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.ch-row .sp{flex:1}
+.btn{height:28px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-surface);display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-subtle)}
+.btn:hover{border-color:var(--border-strong);color:var(--text)}
+.btn.sm{height:24px;padding:0 9px;font-size:12px}
+.btn.green{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
+.ch-sub{margin-top:5px;font-size:12px;color:var(--text-faint);display:flex;gap:10px;align-items:center}
+.msgs{flex:1;overflow-y:auto;padding:20px 24px;min-height:0}
+.msg{margin-bottom:18px;max-width:820px}
+.m-user{display:flex;justify-content:flex-end}
+.m-user .bubble{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:10px 14px;max-width:74%}
+.m-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px}
+.m-mark{width:20px;height:20px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#8f6ce8);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
+.m-name{font-size:12.5px;font-weight:600}
+.m-model{font-size:10.5px;color:var(--text-faint);border:1px solid var(--border);border-radius:4px;padding:0 5px;line-height:1.6}
+.m-time{font-size:11px;color:var(--text-faint)}
+.m-body{font-size:14px;line-height:1.7}
+.toolblock{border:1px solid var(--border);border-radius:var(--r-md);margin:10px 0;background:var(--bg-panel)}
+.tb-head{display:flex;align-items:center;gap:8px;height:32px;padding:0 10px;font-size:12.5px;color:var(--text-subtle)}
+.tb-head .res{margin-left:auto;font-size:11.5px;color:var(--text-faint)}
+.confirm-card{border:1px solid var(--green-border);background:var(--green-dim);border-radius:var(--r-lg);padding:12px 14px;margin:12px 0;max-width:640px}
+.cc-head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:13.5px}
+.cc-head .ic{color:var(--green)}
+.cc-body{font-size:13px;color:var(--text-subtle);margin:6px 0 10px}
+.cc-actions{display:flex;gap:8px;align-items:center}
+.cc-src{margin-left:auto;font-size:11px;color:var(--text-faint)}
+.composer-wrap{padding:8px 24px 16px}
+.composer{border:1px solid var(--border);border-radius:var(--r-xl);background:var(--bg-input);box-shadow:var(--shadow-card)}
+.composer:focus-within{border-color:var(--accent)}
+.composer textarea{width:100%;border:none;background:transparent;resize:none;font:inherit;color:var(--text);padding:11px 14px 4px;outline:none}
+.composer textarea::placeholder{color:var(--text-faint)}
+.cmp-row{display:flex;align-items:center;gap:6px;padding:6px 8px 8px}
+.cmp-row .sp{flex:1}
+.send{width:30px;height:30px;border-radius:var(--r-sm);background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center}
+.model-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:6px;border:1px solid var(--border);font-size:11.5px;color:var(--text-subtle)}
+.inbox{flex:none;width:320px;background:var(--bg-panel);border-left:1px solid var(--border-faint);display:flex;flex-direction:column}
+.ib-head{padding:12px 14px 8px}
+.ib-title{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600}
+.ib-badge{min-width:18px;height:18px;border-radius:9px;background:var(--amber);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px}
+.ib-scroll{flex:1;overflow-y:auto;padding:2px 10px 10px;min-height:0}
+.ib-card{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg-surface);padding:10px 12px;margin-bottom:8px}
+.ib-card .ttl{display:flex;gap:8px;font-size:13px;font-weight:600;line-height:1.45}
+.ib-card .mta{font-size:11.5px;color:var(--text-faint);margin-top:3px}
+.pbar{height:4px;border-radius:2px;background:var(--bg-hover);margin-top:8px;overflow:hidden}
+.pbar i{display:block;height:100%;background:var(--accent);width:68%}
+.demo-tag{position:fixed;left:14px;bottom:12px;z-index:60;font-size:11px;color:var(--text-faint);background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;box-shadow:var(--shadow-card);pointer-events:none}
+.demo-tag b{color:var(--text-subtle);font-weight:600}
+
+/* 活动视图容器（演示切换） */
+.ctx-views .v{display:none}.ctx-views .v.on{display:block}
+</style>
+</head>
+<body>
+<div class="app">
+  <!-- 活动栏 -->
+  <nav class="rail">
+    <div class="brandmark"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/></svg></div>
+    <button class="ri on" data-v="tasks" onclick="setView(this)"><svg class="ic" viewBox="0 0 24 24"><path d="M8 6h13M8 12h13M8 18h13"/><path d="m3 6 1 1 2-2M3 12l1 1 2-2M3 18l1 1 2-2"/></svg><span class="lbl">任务（项目与会话）</span></button>
+    <button class="ri" data-v="inbox" onclick="setView(this)"><svg class="ic" viewBox="0 0 24 24"><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.4 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.4-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.8 1.1Z"/></svg><span class="bdg">2</span><span class="lbl">收件箱</span></button>
+    <button class="ri" data-v="agents" onclick="setView(this)"><svg class="ic" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="7" rx="2"/><rect x="4" y="13" width="16" height="7" rx="2"/><path d="M8 7.5h.1M8 16.5h.1"/></svg><span class="lbl">代理运行</span></button>
+    <button class="ri" data-v="arts" onclick="setView(this)"><svg class="ic" viewBox="0 0 24 24"><path d="M21 8 12 3 3 8v8l9 5 9-5Z"/><path d="m3 8 9 5 9-5M12 13v8"/></svg><span class="lbl">工件</span></button>
+    <button class="ri" onclick="toast('插件面板（设计稿示意）')"><svg class="ic" viewBox="0 0 24 24"><path d="M9 3v4M15 3v4M9 17v4M15 17v4M3 9h4M3 15h4M17 9h4M17 15h4"/><rect x="7" y="7" width="10" height="10" rx="2"/></svg><span class="lbl">插件</span></button>
+    <span class="sp"></span>
+    <button class="ri" onclick="toast('设置（设计稿示意）')"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12c0 .4 0 .8.1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.06-.4.1-.8.1-1.2Z"/></svg><span class="lbl">设置</span></button>
+    <button class="ri" onclick="toast('账户菜单（见 demo-auth）')"><span class="avatar">W</span><span class="lbl">weichen · 研发体系团队</span></button>
+  </nav>
+
+  <!-- 二级上下文列表 -->
+  <div class="ctx">
+    <div class="ctx-views">
+      <div class="v on" data-v="tasks">
+        <div class="ctx-head">
+          <button class="ctx-proj"><span class="oi">研</span>研发体系文档<span class="cnt">4 会话</span><svg class="ic ic-s" viewBox="0 0 24 24" style="margin-left:auto"><path d="m6 9 6 6 6-6"/></svg></button>
+          <button class="ctx-new"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>新会话<span class="kbd" style="margin-left:auto">⌘N</span></button>
+        </div>
+        <div class="ctx-scroll">
+          <div class="sec">进行中</div>
+          <div class="task on"><span class="dot run"></span><span class="t">本周周报起草与素材汇总</span><span class="tm">3 分</span></div>
+          <div class="task"><span class="dot wait"></span><span class="t">接口设计文档评审</span><span class="tm">1 时</span></div>
+          <div class="sec">空闲</div>
+          <div class="task"><span class="dot idle"></span><span class="t">文档规范修订意见收集</span><span class="tm">昨</span></div>
+          <div class="task"><span class="dot done"></span><span class="t">8 月文档资产盘点</span><span class="tm">周二</span></div>
+        </div>
+      </div>
+      <div class="v" data-v="inbox">
+        <div class="ctx-head"><button class="ctx-proj"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.4 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.4-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.8 1.1Z"/></svg>收件箱 · 待办 2</button></div>
+        <div class="ctx-scroll">
+          <div class="task"><span class="dot wait"></span><span class="t">发布前确认：接口契约变更</span><span class="tm">10 分</span></div>
+          <div class="task"><span class="dot run"></span><span class="t">记忆库索引重建</span><span class="tm">4 分</span></div>
+        </div>
+      </div>
+      <div class="v" data-v="agents">
+        <div class="ctx-head"><button class="ctx-proj"><svg class="ic ic-s" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="7" rx="2"/><rect x="4" y="13" width="16" height="7" rx="2"/><path d="M8 7.5h.1M8 16.5h.1"/></svg>代理运行 · 2</button></div>
+        <div class="ctx-scroll">
+          <div class="task"><span class="dot run"></span><span class="t">#a3 索引重建 worker</span><span class="tm">68%</span></div>
+          <div class="task"><span class="dot run"></span><span class="t">#a4 语料去重</span><span class="tm">31%</span></div>
+        </div>
+      </div>
+      <div class="v" data-v="arts">
+        <div class="ctx-head"><button class="ctx-proj"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M21 8 12 3 3 8v8l9 5 9-5Z"/><path d="m3 8 9 5 9-5"/></svg>工件 · 5</button></div>
+        <div class="ctx-scroll">
+          <div class="task"><span class="dot done"></span><span class="t">周报_第39周.docx</span></div>
+          <div class="task"><span class="dot done"></span><span class="t">接口契约变更清单.md</span></div>
+          <div class="task"><span class="dot done"></span><span class="t">知识条目冲突报告.pdf</span></div>
+        </div>
+      </div>
+    </div>
+    <div class="ctx-foot">
+      <button class="sbtn"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg>搜索<span class="kbd">⌘K</span></button>
+      <button class="sbtn" style="flex:none;width:34px" title="切换主题" onclick="const h=document.documentElement;h.dataset.theme=h.dataset.theme==='dark'?'light':'dark'"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8Z"/></svg></button>
+    </div>
+  </div>
+
+  <!-- 中栏 -->
+  <main class="main">
+    <div class="conv-head">
+      <div class="ch-row">
+        <span class="ch-title">本周周报起草与素材汇总</span>
+        <span class="sp"></span>
+        <button class="btn"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 3v12M8 7l4-4 4 4"/><path d="M5 13v6a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"/></svg>分享</button>
+        <button class="btn">⋯</button>
+      </div>
+      <div class="ch-sub"><span>研发体系文档</span><span>·</span><span>2 个代理运行中</span><span>·</span><span>更新于 3 分钟前</span></div>
+    </div>
+    <div class="msgs">
+      <div class="msg m-user"><div class="bubble">把记忆库建设项目的本周素材汇总一下，并起草周报——重点写「两树一网」模型 v3 的进展。</div></div>
+      <div class="msg">
+        <div class="m-meta"><span class="m-mark">A</span><span class="m-name">助手</span><span class="m-model">GLM-4.6</span><span class="m-time">10:21</span></div>
+        <div class="m-body">已检索记忆库本周新增的 23 条素材：「两树一网」v3 初稿完成待合并意见；接口契约变更涉及 3 个模块；外部语料导入触发 2 条条目冲突已合并。</div>
+        <div class="toolblock"><div class="tb-head"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M14.7 6.3a4.5 4.5 0 0 0-6 5.6L3 17.6V21h3.4l5.7-5.7a4.5 4.5 0 0 0 5.6-6L14.5 12l-2.5-2.5Z"/></svg>检索知识库 · rag.search("记忆库建设 本周")<span class="res">23 段命中 · 0.8s</span></div></div>
+        <div class="confirm-card">
+          <div class="cc-head"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="m8.5 12.2 2.4 2.4 4.6-5"/></svg>等待确认：生成《本周周报》草稿</div>
+          <div class="cc-body">按「进展 / 评审安排 / 风险」三节起草，约 1200 字。确认后写入工件并回写时间线。</div>
+          <div class="cc-actions"><button class="btn sm green">确认生成</button><button class="btn sm">调整大纲</button><span class="cc-src">来源：消息 #6</span></div>
+        </div>
+      </div>
+    </div>
+    <div class="composer-wrap">
+      <div class="composer">
+        <textarea rows="1" placeholder="给助手发消息；/ 唤起命令…"></textarea>
+        <div class="cmp-row">
+          <svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--text-faint);margin:0 8px"><path d="m21.4 11.1-8.8 8.8a5.5 5.5 0 0 1-7.8-7.8l8.5-8.5a3.7 3.7 0 0 1 5.2 5.2l-8.5 8.5a1.8 1.8 0 0 1-2.6-2.6l7.8-7.7"/></svg>
+          <span class="sp"></span>
+          <span class="model-chip">GLM-4.6</span>
+          <button class="send"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 19V5M5 12l7-7 7 7"/></svg></button>
+        </div>
+      </div>
+    </div>
+  </main>
+
+  <!-- 右栏收件箱（保留，亦可经活动栏全屏化） -->
+  <aside class="inbox">
+    <div class="ib-head">
+      <div class="ib-title"><svg class="ic" viewBox="0 0 24 24"><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.4 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.4-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.8 1.1Z"/></svg>收件箱<span class="ib-badge">2</span></div>
+    </div>
+    <div class="ib-scroll">
+      <div class="ib-card"><div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--amber)"><path d="M12 3 2.5 20h19Z"/><path d="M12 10v4M12 17.5v.1"/></svg><span>发布前确认：《接口设计文档》3 处契约变更</span></div><div class="mta">10 分钟前</div></div>
+      <div class="ib-card"><div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--accent)"><circle cx="12" cy="12" r="3.5"/><path d="M12 3v4M12 17v4M3 12h4M17 12h4" opacity=".4"/></svg><span>记忆库索引重建进行中</span></div><div class="mta">代理 #a3 · 4 分钟</div><div class="pbar"><i></i></div></div>
+      <div class="ib-card"><div class="ttl"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--green)"><circle cx="12" cy="12" r="9"/><path d="m8.5 12.2 2.4 2.4 4.6-5"/></svg><span>周报（第 39 周）已生成</span></div><div class="mta">10:24</div></div>
+    </div>
+  </aside>
+</div>
+<div class="demo-tag"><b>方案 B · 活动栏</b>设计稿 · 无后端 · 悬停图标看提示</div>
+<script>
+function setView(btn){
+  document.querySelectorAll('.ri').forEach(b=>b.classList.toggle('on',b===btn));
+  const v=btn.dataset.v;
+  document.querySelectorAll('.ctx-views .v').forEach(x=>x.classList.toggle('on',x.dataset.v===v));
+}
+function toast(msg){
+  let t=document.getElementById('__t');
+  if(!t){t=document.createElement('div');t.id='__t';t.style.cssText='position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:8px;padding:8px 16px;font-size:12.5px;box-shadow:var(--shadow-pop);transition:opacity .2s';document.body.appendChild(t)}
+  t.textContent=msg;t.style.opacity=1;clearTimeout(t._h);t._h=setTimeout(()=>t.style.opacity=0,1400);
+}
+</script>
+</body>
+</html>
diff --git a/docs/proposals/ui-redesign-demos/demo-c-project-portal.html b/docs/proposals/ui-redesign-demos/demo-c-project-portal.html
new file mode 100644
index 0000000..2c02249
--- /dev/null
+++ b/docs/proposals/ui-redesign-demos/demo-c-project-portal.html
@@ -0,0 +1,243 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>方案 C · 项目门户 — Agent-System 设计稿</title>
+<style>
+:root{--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--r-xl:12px;--r-lg:10px;--r-md:8px;--r-sm:6px;--ease:.13s ease}
+[data-theme="dark"]{--bg:#121316;--bg-panel:#191a1e;--bg-surface:#1f2026;--bg-hover:#26272f;--bg-selected:#2c2d36;--bg-input:#1c1d22;--border:#282a31;--border-strong:#373943;--border-faint:#202127;--text:#e8e9ec;--text-subtle:#a4a6ae;--text-faint:#71747e;--accent:#5b8def;--accent-dim:rgba(91,141,239,.13);--accent-soft:rgba(91,141,239,.22);--green:#41b26e;--green-dim:rgba(65,178,110,.13);--green-border:rgba(65,178,110,.32);--amber:#d99b3f;--amber-dim:rgba(217,155,63,.13);--shadow-pop:0 12px 32px rgba(0,0,0,.45);--shadow-card:0 1px 2px rgba(0,0,0,.25)}
+[data-theme="light"]{--bg:#f6f7f8;--bg-panel:#fff;--bg-surface:#fff;--bg-hover:#f0f1f4;--bg-selected:#e8eaf0;--bg-input:#fff;--border:#e5e6ea;--border-strong:#d4d6dd;--border-faint:#ececf0;--text:#1d1e23;--text-subtle:#5c5f68;--text-faint:#989ba4;--accent:#3a76e0;--accent-dim:rgba(58,118,224,.09);--accent-soft:rgba(58,118,224,.16);--green:#269a59;--green-dim:rgba(38,154,89,.09);--green-border:rgba(38,154,89,.35);--amber:#a8731d;--amber-dim:rgba(168,115,29,.1);--shadow-pop:0 12px 32px rgba(20,22,28,.14);--shadow-card:0 1px 2px rgba(20,22,28,.05)}
+*{margin:0;padding:0;box-sizing:border-box}
+html,body{height:100%}
+body{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg);overflow:hidden}
+button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}
+button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
+::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--bg-selected);border-radius:6px;border:3px solid transparent;background-clip:content-box}
+svg.ic{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
+svg.ic-s{width:14px;height:14px}
+
+.app{display:flex;height:100vh}
+/* ── 左栏：项目列表 ── */
+.side{width:264px;flex:none;background:var(--bg-panel);border-right:1px solid var(--border-faint);display:flex;flex-direction:column}
+.brand{display:flex;align-items:center;gap:8px;padding:14px 14px 10px}
+.brand-mark{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#8f6ce8);display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
+.brand-name{font-weight:600;font-size:13.5px}
+.newproj{display:flex;align-items:center;gap:8px;height:34px;margin:2px 12px 8px;padding:0 10px;border-radius:var(--r-md);border:1px dashed var(--border-strong);color:var(--text-subtle);font-size:13px}
+.newproj:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}
+.side-scroll{flex:1;overflow-y:auto;padding:0 8px;min-height:0}
+.sec{font-size:11.5px;color:var(--text-faint);padding:10px 8px 4px;letter-spacing:.3px}
+.proj{display:flex;align-items:center;gap:9px;height:34px;padding:0 8px;margin:1px 0;border-radius:var(--r-sm);color:var(--text-subtle);cursor:pointer}
+.proj:hover{background:var(--bg-hover)}
+.proj.on{background:var(--bg-selected);color:var(--text)}
+.proj .oi{width:22px;height:22px;border-radius:6px;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
+.proj .n{flex:1;font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.proj .c{font-size:11px;color:var(--text-faint)}
+.side-foot{border-top:1px solid var(--border-faint);padding:10px 12px;display:flex;align-items:center;gap:8px}
+.avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
+.sf-n{font-size:13px;font-weight:600}
+.sf-s{font-size:11px;color:var(--text-faint)}
+.side-foot .sp{flex:1}
+.iconbtn{width:26px;height:26px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--text-faint)}
+.iconbtn:hover{background:var(--bg-hover);color:var(--text-subtle)}
+
+/* ── 主区 ── */
+.main{flex:1;min-width:0;display:flex;flex-direction:column}
+.view{display:none;flex:1;min-height:0;flex-direction:column}
+.view.on{display:flex}
+/* 门户视图 */
+.pt-head{padding:26px 32px 0}
+.pt-crumb{font-size:12px;color:var(--text-faint);display:flex;gap:6px;align-items:center;margin-bottom:8px}
+.pt-title{display:flex;align-items:center;gap:12px}
+.pt-title h1{font-size:22px;font-weight:700;letter-spacing:-.2px}
+.pt-oi{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#5b8def,#8f6ce8);color:#fff;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center}
+.pt-desc{margin-top:6px;color:var(--text-subtle);font-size:13.5px}
+.pt-stats{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
+.stat{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:13px;border:1px solid var(--border);font-size:12px;color:var(--text-subtle);background:var(--bg-panel)}
+.stat b{color:var(--text);font-weight:600}
+.stat .dot{width:6px;height:6px}
+.dot{width:7px;height:7px;border-radius:50%;flex:none}
+.dot.run{background:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
+.dot.wait{background:var(--amber);box-shadow:0 0 0 3px var(--amber-dim)}
+.dot.idle{background:var(--border-strong)}
+.dot.done{background:var(--green)}
+.pt-actions{margin-left:auto;display:flex;gap:8px}
+.btn{height:30px;padding:0 13px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-surface);display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-subtle)}
+.btn:hover{border-color:var(--border-strong);color:var(--text)}
+.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
+.btn.primary:hover{filter:brightness(1.08)}
+.pt-body{flex:1;overflow-y:auto;padding:20px 32px 28px;min-height:0}
+.sec2{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;margin:6px 0 12px}
+.sec2 .ln{flex:1;height:1px;background:var(--border-faint)}
+.sec2 .more{font-size:12px;color:var(--text-faint);font-weight:400;cursor:pointer}
+.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:12px}
+.card{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg-panel);padding:13px 14px;cursor:pointer;transition:border-color var(--ease),transform var(--ease);box-shadow:var(--shadow-card)}
+.card:hover{border-color:var(--border-strong);transform:translateY(-1px)}
+.card .row1{display:flex;align-items:center;gap:8px}
+.card .ttl{flex:1;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.card .sn{margin-top:6px;font-size:12px;color:var(--text-faint);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
+.card .meta{margin-top:9px;display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-faint)}
+.card .meta .sp{flex:1}
+.card .who{width:16px;height:16px;border-radius:50%;font-size:9px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center}
+.card.new{border-style:dashed;background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--text-faint);min-height:118px;box-shadow:none}
+.card.new:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}
+/* 对话视图 */
+.cv-head{padding:12px 24px 10px;border-bottom:1px solid var(--border-faint);display:flex;align-items:center;gap:10px}
+.cv-back{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:var(--r-sm);border:1px solid var(--border);color:var(--text-subtle);font-size:12.5px}
+.cv-back:hover{background:var(--bg-hover);color:var(--text)}
+.cv-title{font-size:15px;font-weight:600}
+.cv-sub{margin-top:4px;font-size:12px;color:var(--text-faint)}
+.msgs{flex:1;overflow-y:auto;padding:20px 24px;min-height:0}
+.msg{margin-bottom:18px;max-width:820px}
+.m-user{display:flex;justify-content:flex-end}
+.m-user .bubble{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:10px 14px;max-width:74%}
+.m-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px}
+.m-mark{width:20px;height:20px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#8f6ce8);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
+.m-name{font-size:12.5px;font-weight:600}
+.m-model{font-size:10.5px;color:var(--text-faint);border:1px solid var(--border);border-radius:4px;padding:0 5px}
+.m-time{font-size:11px;color:var(--text-faint)}
+.m-body{font-size:14px;line-height:1.7}
+.confirm-card{border:1px solid var(--green-border);background:var(--green-dim);border-radius:var(--r-lg);padding:12px 14px;margin:12px 0;max-width:640px}
+.cc-head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:13.5px}
+.cc-head .ic{color:var(--green)}
+.cc-body{font-size:13px;color:var(--text-subtle);margin:6px 0 10px}
+.cc-actions{display:flex;gap:8px;align-items:center}
+.btn.sm{height:24px;padding:0 9px;font-size:12px}
+.btn.green{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
+.cc-src{margin-left:auto;font-size:11px;color:var(--text-faint)}
+.composer-wrap{padding:8px 24px 16px}
+.composer{border:1px solid var(--border);border-radius:var(--r-xl);background:var(--bg-input);box-shadow:var(--shadow-card)}
+.composer:focus-within{border-color:var(--accent)}
+.composer textarea{width:100%;border:none;background:transparent;resize:none;font:inherit;color:var(--text);padding:11px 14px 4px;outline:none}
+.composer textarea::placeholder{color:var(--text-faint)}
+.cmp-row{display:flex;align-items:center;gap:6px;padding:6px 8px 8px}
+.cmp-row .sp{flex:1}
+.send{width:30px;height:30px;border-radius:var(--r-sm);background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center}
+.model-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:6px;border:1px solid var(--border);font-size:11.5px;color:var(--text-subtle)}
+.demo-tag{position:fixed;left:14px;bottom:12px;z-index:60;font-size:11px;color:var(--text-faint);background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;box-shadow:var(--shadow-card);pointer-events:none}
+.demo-tag b{color:var(--text-subtle);font-weight:600}
+</style>
+</head>
+<body>
+<div class="app">
+  <aside class="side">
+    <div class="brand">
+      <div class="brand-mark"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/></svg></div>
+      <span class="brand-name">Agent-System</span>
+    </div>
+    <button class="newproj"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>新建项目</button>
+    <div class="side-scroll">
+      <div class="sec">进行中 · 3</div>
+      <div class="proj on"><span class="oi" style="background:linear-gradient(135deg,#5b8def,#8f6ce8)">研</span><span class="n">研发体系文档</span><span class="c">4</span></div>
+      <div class="proj"><span class="oi" style="background:#2f855a">记</span><span class="n">记忆库建设</span><span class="c">3</span></div>
+      <div class="proj"><span class="oi" style="background:#b7791f">测</span><span class="n">真实模型测试</span><span class="c">2</span></div>
+      <div class="sec">已归档 · 1</div>
+      <div class="proj" style="opacity:.6"><span class="oi" style="background:#4a5568">旧</span><span class="n">旧文档迁移</span><span class="c">7</span></div>
+    </div>
+    <div class="side-foot">
+      <span class="avatar">W</span>
+      <span><div class="sf-n">weichen</div><div class="sf-s">研发体系团队 · OWNER</div></span>
+      <span class="sp"></span>
+      <button class="iconbtn" title="主题" onclick="const h=document.documentElement;h.dataset.theme=h.dataset.theme==='dark'?'light':'dark'"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8Z"/></svg></button>
+      <button class="iconbtn" title="设置"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19 12a7 7 0 0 0-.1-1.2l2-1.6-2-3.4-2.4 1a7 7 0 0 0-2-1.2L14 3h-4l-.5 2.6a7 7 0 0 0-2 1.2l-2.4-1-2 3.4 2 1.6A7 7 0 0 0 5 12c0 .4 0 .8.1 1.2l-2 1.6 2 3.4 2.4-1a7 7 0 0 0 2 1.2L10 21h4l.5-2.6a7 7 0 0 0 2-1.2l2.4 1 2-3.4-2-1.6c.06-.4.1-.8.1-1.2Z"/></svg></button>
+    </div>
+  </aside>
+
+  <main class="main">
+    <!-- 门户视图 -->
+    <div class="view on" id="v-portal">
+      <div class="pt-head">
+        <div class="pt-crumb">项目 / 研发体系文档</div>
+        <div class="pt-title">
+          <span class="pt-oi">研</span>
+          <h1>研发体系文档</h1>
+          <span class="pt-actions">
+            <button class="btn"><svg class="ic ic-s" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg>搜索项目内容</button>
+            <button class="btn">⋯</button>
+            <button class="btn primary" onclick="openConv()"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>新建会话</button>
+          </span>
+        </div>
+        <div class="pt-desc">研发记忆与体系文档的沉淀、检索与生成。目标系统「两树一网」的载体项目。</div>
+        <div class="pt-stats">
+          <span class="stat"><b>4</b> 会话</span>
+          <span class="stat"><span class="dot run"></span><b>2</b> 运行中</span>
+          <span class="stat"><span class="dot wait"></span><b>1</b> 待确认</span>
+          <span class="stat"><b>5</b> 工件</span>
+          <span class="stat">成员 <b>6</b></span>
+        </div>
+      </div>
+      <div class="pt-body">
+        <div class="sec2">进行中的会话<span class="ln"></span><span class="more" onclick="toast('查看全部（设计稿示意）')">全部 ›</span></div>
+        <div class="grid">
+          <div class="card" onclick="openConv()">
+            <div class="row1"><span class="dot run"></span><span class="ttl">本周周报起草与素材汇总</span></div>
+            <div class="sn">检索本周 23 条素材，起草周报；已进入生成确认环节…</div>
+            <div class="meta"><span>3 分钟前</span><span>·</span><span>18 条消息</span><span class="sp"></span><span class="who" style="background:#5b8def">W</span></div>
+          </div>
+          <div class="card" onclick="openConv()">
+            <div class="row1"><span class="dot wait"></span><span class="ttl">接口设计文档评审</span></div>
+            <div class="sn">3 处契约变更待确认；评审材料已备齐，建议周四 14:00…</div>
+            <div class="meta"><span>1 小时前</span><span>·</span><span>9 条消息</span><span class="sp"></span><span class="who" style="background:#2f855a">Y</span></div>
+          </div>
+          <div class="card" onclick="openConv()">
+            <div class="row1"><span class="dot idle"></span><span class="ttl">文档规范修订意见收集</span></div>
+            <div class="sn">汇总各模块对文档规范 v2.4 的修订意见，输出对照表…</div>
+            <div class="meta"><span>昨天</span><span>·</span><span>12 条消息</span><span class="sp"></span><span class="who" style="background:#5b8def">W</span></div>
+          </div>
+          <button class="card new" onclick="toast('新建会话（设计稿示意）')"><svg class="ic" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>新建会话</button>
+        </div>
+        <div class="sec2" style="margin-top:22px">最近工件<span class="ln"></span><span class="more" onclick="toast('工件面板（设计稿示意）')">全部 ›</span></div>
+        <div class="grid">
+          <div class="card" onclick="toast('打开工件（设计稿示意）')">
+            <div class="row1"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--accent)"><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8Z"/><path d="M14 3v5h5"/></svg><span class="ttl">周报_第39周.docx</span></div>
+            <div class="sn">10:24 生成 · 1,214 字 · 本周周报起草与素材汇总</div>
+            <div class="meta"><span>刚刚</span><span class="sp"></span><span>文档</span></div>
+          </div>
+          <div class="card" onclick="toast('打开工件（设计稿示意）')">
+            <div class="row1"><svg class="ic ic-s" viewBox="0 0 24 24" style="color:var(--green)"><path d="M4 4h16v16H4z"/><path d="M4 10h16M10 4v16"/></svg><span class="ttl">接口契约变更清单.md</span></div>
+            <div class="sn">09-29 · 3 模块 12 项变更 · 接口设计文档评审</div>
+            <div class="meta"><span>昨天</span><span class="sp"></span><span>文档</span></div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 对话视图 -->
+    <div class="view" id="v-conv">
+      <div class="cv-head">
+        <button class="cv-back" onclick="closeConv()"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M19 12H5M11 18l-6-6 6-6"/></svg>返回项目</button>
+        <span class="cv-title">本周周报起草与素材汇总</span>
+        <span style="flex:1"></span>
+        <button class="btn">分享</button>
+        <button class="btn">⋯</button>
+      </div>
+      <div class="cv-sub" style="padding:0 24px 8px;font-size:12px;color:var(--text-faint)">研发体系文档 · 2 个代理运行中 · 更新于 3 分钟前</div>
+      <div class="msgs">
+        <div class="msg m-user"><div class="bubble">把记忆库建设项目的本周素材汇总一下，并起草周报——重点写「两树一网」模型 v3 的进展。</div></div>
+        <div class="msg">
+          <div class="m-meta"><span class="m-mark">A</span><span class="m-name">助手</span><span class="m-model">GLM-4.6</span><span class="m-time">10:21</span></div>
+          <div class="m-body">已检索记忆库本周新增的 23 条素材：「两树一网」v3 初稿完成待合并意见；接口契约变更涉及 3 个模块；外部语料导入触发 2 条条目冲突已合并。</div>
+          <div class="confirm-card">
+            <div class="cc-head"><svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="m8.5 12.2 2.4 2.4 4.6-5"/></svg>等待确认：生成《本周周报》草稿</div>
+            <div class="cc-body">按「进展 / 评审安排 / 风险」三节起草，约 1200 字。确认后写入工件并回写时间线。</div>
+            <div class="cc-actions"><button class="btn sm green">确认生成</button><button class="btn sm">调整大纲</button><span class="cc-src">来源：消息 #6</span></div>
+          </div>
+        </div>
+      </div>
+      <div class="composer-wrap">
+        <div class="composer">
+          <textarea rows="1" placeholder="给助手发消息；/ 唤起命令…"></textarea>
+          <div class="cmp-row"><span class="sp"></span><span class="model-chip">GLM-4.6</span><button class="send"><svg class="ic ic-s" viewBox="0 0 24 24"><path d="M12 19V5M5 12l7-7 7 7"/></svg></button></div>
+        </div>
+      </div>
+    </div>
+  </main>
+</div>
+<div class="demo-tag"><b>方案 C · 项目门户</b>设计稿 · 无后端 · 点击会话卡进入对话</div>
+<script>
+function openConv(){document.getElementById('v-portal').classList.remove('on');document.getElementById('v-conv').classList.add('on')}
+function closeConv(){document.getElementById('v-conv').classList.remove('on');document.getElementById('v-portal').classList.add('on')}
+function toast(msg){let t=document.getElementById('__t');if(!t){t=document.createElement('div');t.id='__t';t.style.cssText='position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:8px;padding:8px 16px;font-size:12.5px;box-shadow:var(--shadow-pop);transition:opacity .2s';document.body.appendChild(t)}t.textContent=msg;t.style.opacity=1;clearTimeout(t._h);t._h=setTimeout(()=>t.style.opacity=0,1400)}
+</script>
+</body>
+</html>
diff --git a/docs/proposals/ui-redesign-demos/index.html b/docs/proposals/ui-redesign-demos/index.html
new file mode 100644
index 0000000..b7eb00b
--- /dev/null
+++ b/docs/proposals/ui-redesign-demos/index.html
@@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>界面重构方案总览 — Agent-System 设计稿</title>
+<style>
+:root{--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--r-xl:14px;--r-lg:10px;--r-md:8px;--ease:.13s ease}
+[data-theme="dark"]{--bg:#121316;--bg-panel:#191a1e;--bg-surface:#1f2026;--bg-hover:#26272f;--bg-input:#1c1d22;--border:#282a31;--border-strong:#373943;--border-faint:#202127;--text:#e8e9ec;--text-subtle:#a4a6ae;--text-faint:#71747e;--accent:#5b8def;--accent-dim:rgba(91,141,239,.13);--accent-soft:rgba(91,141,239,.22);--green:#41b26e;--green-dim:rgba(65,178,110,.13);--amber:#d99b3f;--shadow-card:0 1px 2px rgba(0,0,0,.25)}
+[data-theme="light"]{--bg:#f6f7f8;--bg-panel:#fff;--bg-surface:#fff;--bg-hover:#f0f1f4;--bg-input:#fff;--border:#e5e6ea;--border-strong:#d4d6dd;--border-faint:#ececf0;--text:#1d1e23;--text-subtle:#5c5f68;--text-faint:#989ba4;--accent:#3a76e0;--accent-dim:rgba(58,118,224,.09);--accent-soft:rgba(58,118,224,.16);--green:#269a59;--green-dim:rgba(38,154,89,.09);--amber:#a8731d;--shadow-card:0 1px 2px rgba(20,22,28,.05)}
+*{margin:0;padding:0;box-sizing:border-box}
+body{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg);min-height:100vh;padding:40px 48px 60px}
+a{color:var(--accent);text-decoration:none}
+a:hover{text-decoration:underline}
+.wrap{max-width:1060px;margin:0 auto}
+.top{display:flex;align-items:flex-start;gap:16px;margin-bottom:34px}
+.mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--accent),#8f6ce8);display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
+h1{font-size:24px;font-weight:700;letter-spacing:-.3px}
+.sub{margin-top:6px;color:var(--text-subtle);font-size:13.5px;line-height:1.6}
+.sub code{font-family:var(--mono);font-size:12px;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:1px 5px}
+.sp{flex:1}
+.tbtn{width:34px;height:34px;border-radius:9px;background:var(--bg-panel);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-faint);cursor:pointer}
+.tbtn:hover{color:var(--text-subtle)}
+svg.ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
+
+.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
+.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r-xl);padding:18px;display:flex;flex-direction:column;box-shadow:var(--shadow-card);position:relative;transition:border-color var(--ease)}
+.card:hover{border-color:var(--border-strong)}
+.card.rec{border-color:var(--accent-soft)}
+.badge{position:absolute;top:-9px;left:16px;font-size:10.5px;font-weight:700;letter-spacing:.5px;color:var(--accent);background:var(--accent-dim);border:1px solid var(--accent-soft);border-radius:6px;padding:2px 8px}
+.card h3{font-size:16px;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:4px}
+.card h3 .en{font-size:11px;color:var(--text-faint);font-weight:500;letter-spacing:.4px}
+.card p{font-size:12.5px;color:var(--text-subtle);line-height:1.65;margin:6px 0 12px}
+.wire{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;margin-bottom:4px;background:var(--bg)}
+.wire .w{display:flex;height:120px}
+.wire .c{border-right:1px solid var(--border-faint);display:flex;flex-direction:column;gap:3px;padding:7px}
+.wire .c:last-child{border-right:none}
+.wire .b{border-radius:3px;background:var(--bg-hover);height:7px}
+.wire .b.a{background:var(--accent);height:14px;border-radius:4px}
+.wire .b.g{background:var(--bg-input);border:1px solid var(--border)}
+.wire .b.k{width:60%}
+.wire .b.m{background:var(--green-dim);border:1px solid rgba(65,178,110,.4)}
+.wire .b.y{background:var(--amber);opacity:.8;height:9px;width:34%}
+.open{margin-top:auto;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border-radius:var(--r-md);background:var(--accent);color:#fff;font-weight:600;font-size:13px;cursor:pointer;border:none;width:fit-content}
+.open:hover{filter:brightness(1.08)}
+.ghost{background:var(--bg-surface);border:1px solid var(--border);color:var(--text-subtle)}
+.ghost:hover{filter:none;border-color:var(--border-strong);color:var(--text)}
+h2{font-size:17px;font-weight:700;margin:36px 0 12px;letter-spacing:-.2px}
+table{width:100%;border-collapse:collapse;font-size:13px}
+th,td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--border-faint)}
+th{color:var(--text-faint);font-weight:500;font-size:12px}
+td.win{color:var(--text);font-weight:600;background:var(--green-dim)}
+tr.rec-row td:first-child{font-weight:700}
+tr.rec-row td.win{box-shadow:inset 2.5px 0 0 var(--green)}
+.note{margin-top:26px;font-size:12.5px;color:var(--text-faint);line-height:1.7;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r-lg);padding:13px 16px}
+.note b{color:var(--text-subtle)}
+</style>
+</head>
+<body>
+<div class="wrap">
+  <div class="top">
+    <div class="mark"><svg class="ic" viewBox="0 0 24 24" style="width:22px;height:22px"><circle cx="12" cy="12" r="3.2" fill="#fff" stroke="none"/><circle cx="12" cy="3.6" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="19.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="12" cy="20.4" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="16" r="1.7" fill="#fff" stroke="none" opacity=".85"/><circle cx="4.5" cy="8" r="1.7" fill="#fff" stroke="none" opacity=".85"/></svg></div>
+    <div>
+      <h1>界面重构与多用户认证 · 方案总览</h1>
+      <div class="sub">2026-09-30 · 设计提案配套 demo（静态、无后端，明暗主题可切换）· 完整提案见 Documents 仓 <code>docs/proposals/2026-09-30-ui-redesign-and-auth.md</code></div>
+    </div>
+    <span class="sp"></span>
+    <button class="tbtn" title="切换主题" onclick="const h=document.documentElement;h.dataset.theme=h.dataset.theme==='dark'?'light':'dark'"><svg class="ic" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8Z"/></svg></button>
+  </div>
+
+  <div class="grid">
+    <div class="card rec">
+      <span class="badge">推荐</span>
+      <h3>方案 A · 任务中心<span class="en">TASK-CENTRIC</span></h3>
+      <div class="wire"><div class="w">
+        <div class="c" style="flex:0 0 34%"><span class="b a" style="width:80%"></span><span class="b g k"></span><span class="b"></span><span class="b"></span><span class="b k"></span><span class="b"></span><span class="b k"></span></div>
+        <div class="c" style="flex:1"><span class="b m k"></span><span class="b"></span><span class="b k"></span><span class="b y"></span><span class="b m"></span></div>
+        <div class="c" style="flex:0 0 22%"><span class="b y"></span><span class="b m"></span><span class="b"></span><span class="b k"></span><span class="b m k"></span></div>
+      </div></div>
+      <p>创建入口唯一置顶（新建任务 ⌘N + 次级菜单）；项目/时间线是列表的<b>视图模式</b>而非树；置顶区 + 归档；侧栏 Footer 承载账户与租户身份。与 ZCode 桌面端范式同构，兼容既有 D25/D26/D31 决策。</p>
+      <button class="open" onclick="location.href='demo-a-task-centric.html'">打开方案 A demo</button>
+    </div>
+    <div class="card">
+      <h3>方案 B · 活动栏<span class="en">ACTIVITY RAIL</span></h3>
+      <div class="wire"><div class="w">
+        <div class="c" style="flex:0 0 9%;align-items:center"><span class="b a" style="width:70%"></span><span class="b" style="width:70%"></span><span class="b" style="width:70%"></span><span class="b" style="width:70%"></span><span class="b" style="width:70%"></span></div>
+        <div class="c" style="flex:0 0 26%"><span class="b g"></span><span class="b a k"></span><span class="b"></span><span class="b k"></span><span class="b"></span></div>
+        <div class="c" style="flex:1"><span class="b m k"></span><span class="b"></span><span class="b k"></span><span class="b y"></span><span class="b m"></span></div>
+        <div class="c" style="flex:0 0 20%"><span class="b y"></span><span class="b m"></span><span class="b k"></span></div>
+      </div></div>
+      <p>最左图标轨切换领域（任务/收件箱/代理/工件/设置/账户），第二栏随活动渲染列表。导航可无限扩展（插件域友好），但创建是二级动作、多占一列——适合域数量 ≥ 6 后启用。</p>
+      <button class="open ghost" onclick="location.href='demo-b-activity-rail.html'">打开方案 B demo</button>
+    </div>
+    <div class="card">
+      <h3>方案 C · 项目门户<span class="en">PROJECT PORTAL</span></h3>
+      <div class="wire"><div class="w">
+        <div class="c" style="flex:0 0 26%"><span class="b a k"></span><span class="b"></span><span class="b k"></span><span class="b"></span><span class="b k"></span></div>
+        <div class="c" style="flex:1;justify-content:center"><span class="b k"></span><span style="display:flex;gap:4px"><span class="b" style="flex:1;height:26px"></span><span class="b" style="flex:1;height:26px"></span><span class="b a" style="flex:1;height:26px"></span></span><span style="display:flex;gap:4px"><span class="b" style="flex:1;height:26px"></span><span class="b" style="flex:1;height:26px"></span></span></div>
+      </div></div>
+      <p>项目是页面：门户首页为会话卡片网格 + 统计 + 项目内新建，点卡片进入对话。项目总览最好，但高频会话多一跳、对话-first 被破坏——适合以交付物为中心的少量项目。</p>
+      <button class="open ghost" onclick="location.href='demo-c-project-portal.html'">打开方案 C demo</button>
+    </div>
+    <div class="card">
+      <h3>认证与租户<span class="en">AUTH & TENANCY</span></h3>
+      <div class="wire"><div class="w">
+        <div class="c" style="flex:1;justify-content:center"><span class="b a" style="width:36%"></span><span class="b g k"></span><span class="b g"></span><span class="b k"></span><span class="b" style="width:26%"></span></div>
+        <div class="c" style="flex:0 0 44%;background:linear-gradient(160deg,#1b2340,#2c2560)"><span class="b" style="width:60%;background:rgba(255,255,255,.25)"></span><span class="b" style="width:80%;background:rgba(255,255,255,.14)"></span><span class="b" style="width:50%;background:rgba(255,255,255,.14)"></span></div>
+      </div></div>
+      <p>登录（访问密钥 / 邮箱密码双 tab）、注册即建租户（OWNER）、应用内账户菜单（多租户切换、API 密钥）、成员与角色管理。配套认证阶段 2 的 orgs / memberships / 服务端会话设计。</p>
+      <button class="open" onclick="location.href='demo-auth.html'">打开认证 demo</button>
+    </div>
+  </div>
+
+  <h2>方案对比</h2>
+  <table>
+    <thead><tr><th>维度</th><th>A 任务中心（推荐）</th><th>B 活动栏</th><th>C 项目门户</th></tr></thead>
+    <tbody>
+      <tr class="rec-row"><td>解决创建入口分裂</td><td class="win">完全</td><td>部分</td><td>部分（上下文内）</td></tr>
+      <tr><td>跨项目浏览</td><td class="win">优（视图切换）</td><td>中</td><td>中</td></tr>
+      <tr><td>身份/租户常驻</td><td class="win">Footer 账户区</td><td>图标位</td><td>Footer</td></tr>
+      <tr><td>与既有决策兼容（D25/D26/D31）</td><td class="win">完全</td><td>需调 D25</td><td>张力大</td></tr>
+      <tr><td>改造量</td><td class="win">中</td><td>大</td><td>大（含视图路由）</td></tr>
+      <tr><td>扩展性（未来插件域）</td><td>中</td><td class="win">优</td><td>中</td></tr>
+    </tbody>
+  </table>
+
+  <div class="note">
+    <b>说明</b>：demo 为静态设计稿（无后端，交互为演示性），视觉规格（色板 / 字号阶 / 圆角嵌套 / 状态色语义）即 R4 设计令牌的目标值来源。方案 A 支持 ⌘B 收起侧栏、按项目 / 时间线组织切换、新建菜单、账户菜单、明暗主题切换。<br>
+    <b>决策待定</b>：方向裁定（默认 A）→ 另立实施提案（R1 左栏重构 → R2 认证阶段 2 → R3 成员与租户 → R4 视觉收敛）。
+  </div>
+</div>
+</body>
+</html>