chore(v15): 视觉重构任务书 + 参考图 dr6/dr1

用户拍板：综合 dr6（Bento+浅底深卡+单一强调）与 dr1（留白+单色克制）重构工作台。
前五轮 v10-v14 均为精度微调、指标全绿但用户判「没什么提升」→ 本轮换视觉语言。

TASK-v15-bento.md

@@ -0,0 +1,131 @@
+# v15：按 dr6 + dr1 重构工作台视觉
+
+> 用户看过参考图后拍板：**综合 dr6（Bento + 浅底深卡 + 单一强调色）与 dr1（大量留白 + 森林绿式克制）**。
+> 目标只有一句话：**让工作台看起来像 2026 年的产品，而不是一个后台管理页。**
+>
+> 这一轮**要动排版骨架**，不是调间距。前五轮（v10–v14）都在调精度、指标全绿但用户说「没什么提升、还是不好看」——
+> 说明精度不是问题，**视觉语言是问题**。禁止再做「把 6px 改成 8px」这类动作。
+
+---
+
+## 零、先读这两张参考图（必须真的看）
+
+```
+/opt/data/work/kangshifu/refs/dr6.png   ← 主参考：Bento 布局 + 奶油底 + 单一明黄强调 + 浅底嵌深卡
+/opt/data/work/kangshifu/refs/dr1.png   ← 次参考：森林绿单色 + 大量留白 + 四数据卡并排
+```
+
+用 `vision_analyze` 逐张看清楚再动手。要偷的是**结构**，不是配色：
+
+**从 dr6 偷（最重要的三条）**
+1. **Bento 布局**：卡片不是整齐九宫格，而是**大小不等的块拼在一起**（大块 2 列、小块 1 列、横条通栏）。视线有节奏，不是一片等大方块。
+2. **浅底里嵌一块深色卡**：整页浅色，只有一块是深色（dr6 是右侧任务卡），用来**锚定注意力**。这一条直接解决我们工作台右上那块粉红卡"用颜色喊叫"的毛病。
+3. **单一强调色，只在关键处出现**：dr6 全页只有一种黄，只用在进度条/关键数字/一个按钮上。其余全是灰阶。
+
+**从 dr1 偷**
+1. **敢留白**：卡片内部呼吸感足，不是把信息塞满。
+2. **数据卡并排且短**：四个数字卡，每个只有「标签 + 大数字 + 一行趋势」，没有多余装饰。
+3. **状态用色点/标签，不用整块色底**。
+
+**禁止照抄的**
+- dr6 的奶油黄整体色调 → 我们是企业工具，底色保持中性灰白，强调色沿用现有 `--kf-accent: #5B5BD6`（紫），不要改成黄。
+- dr1 的森林绿 → 同上，不换主色。
+- dr2（暗色玻璃那版）**完全不参考**：Vercel 硬否决清单里 glass effects 就是禁项。
+
+---
+
+## 一、工作台重排（`src/pages/view-workbench.js`，285 行）
+
+### 现状骨架（我读过，是事实）
+
+```
+第 174 行  head('我的推进', ...)
+第 175 行  <div class="grid2">               ← 两栏等宽 50/50
+第 178 行    右栏「1 人卡住」粉红卡
+第 188 行  机会卡池区块（一个 hd + 四张汇总卡 .latest）
+第 197 行  foot-links 更多入口
+```
+
+### 目标骨架（Bento，12 栅格）
+
+```
+┌──────────────────────────┬──────────────┐
+│ A 我的推进（大卡，8 列）    │ B 现场（4 列）│   ← A 浅色；B 深色（就是"那一块深卡"）
+│   身份 + 阶段进度条         │  1 人卡住 61h │
+│   高 1.4 倍                │  或「大家都在动」│
+├────────┬────────┬────────┴──────────────┤
+│ C 卡池  │ D 最高分 │ E 决策数               │   ← 三张短数据卡，一行
+│ 9 个    │ 81.3    │ 5 项                  │      每张只有：标签 + 大数字 + 一行说明
+├────────┴────────┴───────────────────────┤
+│ F 最近动过（通栏，最多 3 条）              │
+└─────────────────────────────────────────┘
+```
+
+**具体要求**
+
+1. **A 卡占 8 列、B 卡占 4 列**，两卡同高（`align-items: stretch`），A 内部信息按 flex 纵向分布填满 —— 现在是左卡"还没选我是"占大半卡高、右侧被粉红卡压着，整页重心歪的。
+2. **B 卡必须是深色**（`--kf-ink` 系底 + 反白字）。深色卡是这一轮的核心手法：
+   - 有卡住的人 → 深底 + 橙色小圆点 + 反白数字
+   - 没有卡住 → 仍深底，但内容换成正向文案 + 一个绿色小点
+   - **禁止**再用粉红/红色整块底色（这是用户点名"颜色太重、空得吓人"的那块）
+3. **C/D/E 三张短卡**横排一行，等高，每张内容只有三行：小标签（12px 灰）→ 大数字（32px）→ 一行说明（12px 灰）。**去掉现在四张汇总卡右侧那些小柱图**（`kf-spark`），它们是纯装饰、还挤。
+4. **F 通栏**放最近动态，最多 3 条，右对齐时间。
+5. 整页**纵向间距 24px**，区块之间 **32px**（现在是到处 16–48 混着）。
+6. 卡片内边距从 16 → **20px**（dr1 的呼吸感来源），但**卡内 gap 保持 12px**，不要一起放大。
+
+### 硬约束
+
+- 交互位置不动：`href`、`data-link`、`data-stage`、`data-allstages`、`kf-spark` 若被移除必须连同渲染逻辑一起清干净，不能留死代码。
+- 空状态（未选身份 / 本月无成果 / 无卡住的人）**都必须实测走一遍**，不许只测有数据的样子。
+- 移动端 393px 必须同步适配：A/B 卡竖向堆叠，C/D/E 三卡变一行或两行，不许横向溢出。
+
+---
+
+## 二、把 `kf-glass-card` 的「玻璃」彻底降级
+
+现在叫 glass-card，但用户看的是"色块乱"。规则：
+
+- **取消所有 backdrop-filter 与半透明面板**（Vercel 硬否决 glass effects，且会议室投影会糊）。浮层/抽屉可以保留，普通卡片一律实底。
+- 卡片默认：实底 `#fff` + **1px 极浅描边** `rgba(0,0,0,0.06)` + **无阴影或极浅单层阴影**。
+- 只有**浮层、抽屉、下拉**允许有阴影和模糊。
+- 圆角沿用现有三档 `8 / 12 / 20`，**不要再引入新值**。
+
+---
+
+## 三、字号收敛（v12 遗留，顺带解决）
+
+现在 7 档：`11×634 / 12×326 / 13×99 / 14×37 / 16×166 / 20×51 / 32×9`。要求 **≤5 档**：
+
+```
+11px → 12px   （634 处，最小字号，移动端也读得清）
+13px → 12px 或 14px（99 处，看上下文挑，禁止机械替换）
+保留：12 / 14 / 16 / 20 / 32
+```
+
+数字用 `32px` 大号，卡标题 `16px`，正文 `14px`，辅助 `12px`。**不许为了凑档位把 32px 降下来**。
+
+---
+
+## 四、必须先写测量脚本
+
+写 `scripts/verify-v15.mjs`，**只打印不改**，逐项输出数字：
+
+1. Bento 栅格：A 卡宽 / B 卡宽 / 二者高度差（要求差 ≤2px）
+2. B 卡背景色（要求深色，亮度 < 0.35）与文字对比度（≥7:1）
+3. C/D/E 三卡高度差（≤2px）
+4. 整页区块间距分布（打印所有相邻区块 gap 值）
+5. 卡片内边距实测（要求 20px）
+6. 字号档位统计（要求 ≤5 档，且无 11px）
+7. `kf-spark` 残留计数（要求 0）
+8. 移动端 393px：`scrollWidth === clientWidth`（无横向溢出）、A/B 是否已堆叠
+9. v12 回归：跑 `verify-visual-v12.mjs`，**已达标项不得退步**
+
+先跑一遍把**改动前**的数字打出来，再改。改完再跑一遍，两遍数字都留在 `docs/v15-before-after.md` 里。
+
+---
+
+## 五、纪律
+
+- 每完成一个区块（A/B → C/D/E → F → 移动端 → 字号）就 `git commit` 一次，别攒。
+- 任一项做不到就在报告里写「没做到 + 为什么」，**不许把没做的说成做了，也不许为凑指标硬改**（v12 就是我把「0px 只允许分隔线」写错，你照着凑会毁页面）。
+- 改完自检：**这一页现在跟 dr6/dr1 摆在一起，像不像一个时代的？** 不像就继续改。这是唯一标准。