v11c 收尾：中英混排在渲染期落地（架构重构，非视觉改动）

视觉目标已达成（text-box 23.28px、单位分层、阴影 2 变体）。本轮只修实现方式，不要改任何视觉参数。 上一轮用 MutationObserver 全局监视器扫全页改 DOM 文本，效果对但架构错，已被移出。现改为两处正确落点，其一仍缺最后一步。

一、现状（我已完成的改动，你要在此基础上继续）

已做对的两件事

1. text-box 已生效 —— 不要动

32px 文字行盒：32.00px → 23.28px（-27.2%）
页面真实元素全部达标（工作台 KPI 4 个、类型页 KPI 4 个、徽标若干）

关键细节（保留代码注释）：display:flex 容器里的 trim 不生效，值容器必须 display:block + height:max-content。

2. 数据边界已统一处理 —— 不要动 src/services/board-service.js 的 load() 里：

const db = cjkDeep(buildModel(raw, { now: Date.now(), stuck: CONFIG.stuck }));

src/utils/cjk-deep.js 提供 cjkString() / cjkDeep() / countThin()（纯函数、幂等、跳过 URL/ISO/ObjectId）。

已移除的错误做法

❌ scripts/v11b-patch.mjs（MutationObserver + setInterval(tick,500) 全页扫描 + window.__kfCjk）——已从 app.js 删除，不要恢复
❌ 8 个视图 updated() { cjk(this.renderRoot) } 事后遍历 ——已删除，不要恢复

二、剩下的活：静态文案里的中英混排（210 处）

实测现状

/members     U+2009   0  · 普通空格残留 26
/ledger      U+2009  10  · 普通空格残留 39
其余路由合计 U+2009 238  · 普通空格残留 210

S4 机会验证评估 在数据驱动的地方已正确（字符码 83, 52, 8201, ...），但模板里硬编码的静态文案没有走数据边界，所以仍是普通空格。

残留样例（实测抓取，全是要修的目标）

研发中心 · AI 实战营
11 位 · 10 人已交成果 · 1 人卡住
按成果份数 · 前 8 位
最多 3 份
5 人 · 5 人已交
S5 场景与卖点设计
23 小时前
S2 用户需求与痛点
S4 机会验证评估
S3 机会点识别
S1 品类市场分析
1 人卡住
办公室 3 分钟速食拌面
3 Agent 参与
1 人评分
被 3 处支撑
· Skill 上传
· 10月29日 14:08
（吴敏 · 10月29日 14:20）

要做的：在字符串生成处调用 `t()`

src/pages/shared.js 已导出 t（= cjkString，纯函数、幂等）：

import { t } from '../pages/shared.js';

// ❌ 现在
html`<span class="meta">${`S4 ${stageName} · ${n} 条`}</span>`

// ✅ 改成
html`<span class="meta">${t(`S4 ${stageName} · ${n} 条`)}</span>`

注意：

只包裹含中英/数字混排的字符串，纯中文的不必包（包了也无害，幂等）
不要在模板里对已经是 HTML 的内容包 t（只处理文本）
<code> / <pre> / .kf-mono / URL / 文件名不包
属性值（href、aria-label、title）不包，只处理可见文本节点

修完后必须达到

运行 node scripts/verify-cjk.mjs：

检查项	达标线
工作台 U+2009 计数	≥ 20
8 路由合计 U+2009	≥ 500
汉字↔拉丁之间普通空格残留	= 0
`S4 机会验证评估` 字符码	第 3 位是 `8201`

不达标就是没做完，不要调低门槛。

三、顺带补交上一轮漏掉的两件事

3.1 `docs/v11b-audit.md`（15 条反例自查，上一轮交付为空）

现有 docs/v11b-audit.json 里条数是 0，没做。现在补上，逐条 1-15 编号，每条给：

命中 / 未命中
证据：文件:行号 或实测数值
命中的项：说明属于「可接受」还是「已修」

清单：

装饰性渐变 / 渐变文字标题
glow 光晕 / blob 色块 / 条纹纹理 / 网格背景
玻璃效果用在所有卡片上（玻璃只该用于浮层；内容卡应为实白面 + 发丝描边）
彩色左边框告警条
emoji 当图标（应为 SVG）
max-height:999px 展开动画
transition: all
阴影超过 3 档
纯 #000 / #FFF
所有间距都是同一个值（均匀呼吸）
box-shadow 做凸起 / 凹陷
hover 跳动 > 2px 或放大
圆角 > 16px
强调色面积 > 5%
所有卡片同时入场无错峰

3.2 `docs/v11b-report.md`（上一轮只有 json，没有报告）

包含：

逐项验收表（项 / 实测值 / 达标线 / 通过与否）
text-box 三档对比表（12px 正文 / 20px 小标题 / 32px 主数值，加与不加 trim）
微图表四类的出现位置（哪一页哪个区域），各 ≥1，附 DOM 计数
未达成清单：明确写「我做不到的 / 没验到的」

四、微图表四类（上一轮只做了 sparkline）

要求各有真实出现位置，不是造组件放着：

类型	出现位置	规格
sparkline	已有 4 处，保留	宽 64-80px 高 20px，历史柱 .35 / 最新 .95
进度环 / 进度条	机会卡评分、阶段完成度、证据强度	环 40-48px 描边 3px；条高 4px 圆角 2px
对比条	报告类型份数分布、成员产出对比	最大值占满，数字右对齐
热力小格	阶段 × 类型交叉、成员活跃度	12-14px 方形，4 档不透明度

铁律：数字必须在旁边（不替代数字）；纯 CSS/SVG 不引第三方库；aria-hidden="true" + 文字数字。

五、间距分级 + 「我的推进」虚线框

5.1 四档间距

卡内 padding 16px / 卡内 gap 12px / 卡片之间 24px / 区块之间 48px

自查：页面缩到 25% 截图，能看出「块」在呼吸（不是所有留白一样宽）。

5.2 「我的推进」虚线占位框过高（客户截图级）

降到内容需要的高度（≤2 行文字 + padding）
有真实数据就放数据（阶段完成度进度条），没数据让卡片收缩（align-items:start）
全站扫一遍 stretch 导致的空隙 > 24px 的，全部列出并修（上一轮的同类 bug 是 .grid2 被 stretch 拉到 220px）

六、动效

场景	要求	禁止
数字变化	只滚变化位，500-750ms，`cubic-bezier(.4,0,.2,1)`	从 0 滚到目标
hover	`translateY(-1px)` 150ms	`scale(1.05)`
列表进场	400ms 错峰 40ms	同时淡入
展开	`grid-template-rows: 0fr→1fr`	`max-height:999px`
全局	具体属性	`transition: all`
无障碍	`prefers-reduced-motion` 全关	—

验收靠 grep：transition: all 0 命中、max-height:999px 0 命中、hover scale(1.0x) 0 命中、实测数字动画 duration 在 500-750ms。

七、字数（不反弹）

页面	上限	现状
工作台	350	需复核
报告类型页	300	需复核
报告中心	200	需复核

口径：可见文本节点的中文字符 + 中文标点，排除 SVG 内文本、aria-label、隐藏元素。脚本里写清算式并输出每页数。

八、硬性要求

不许恢复 MutationObserver / setInterval 全页扫描 / window.* 全局挂载
不许 git commit，我提交
每项验收必须脚本实测数字，不许写「已完成」却没数字
做不到的如实写进未达成清单，不许调低门槛凑通过
结束时必须：
- node scripts/check.mjs → CHECK OK
- node --test 'test/*.test.js' → 46/46
- node scripts/verify-cjk.mjs → 四项全达标
- node scripts/verify-textbox.mjs → 全部达标
不引第三方依赖（零构建约束）
不改数据层逻辑、不造数据、不写凭据

九、优先级（若轮数不够，按此顺序）

P0：中英混排 210 处清零 → verify-cjk 四项全过 P1：docs/v11b-audit.md 15 条自查 + docs/v11b-report.md P2：微图表四类 P3：间距分级 + 虚线框 + stretch 扫描 P4：动效

P0 没做完，后面都不要做。

TASK-v11c.md 7.9 KB Permalink Riwayat Mentahan