City-Lifeline-Cockpit/.scratch/lanhu-cockpit-asset-replacement/issues/03-visual-system-token-mapping.md

正式视觉系统与现有 token 映射

Type: grilling Status: resolved Labels: wayfinder:grilling Blocked by: 01, 02

Question

蓝湖正式视觉如何映射到现有驾驶舱 token 和组件 CSS？需要逐项裁定品牌、字体、字号、间距、面板层次、边框、底色、语义色、状态色、渐变、辉光、网格和扫描线：哪些替换现有 token，哪些保留为组件局部表现，哪些因缺少设计依据继续使用系统回退。

裁定必须保持现有一级模式、二级面板、地图与业务交互契约不变，并给出设计稿与现有结构冲突时的处理边界。

进度

• 已认领（Status: claimed），阻塞票 01/02 均 resolved。
• 事实侧已自查：styles/tokens.css 现有 token 结构（--u 设计像素、底色/面板、主色、语义色 lv1–lv4+neutral、文字、字体、字号四档、间距三档、栏宽、层级、阴影）；装饰性渐变/辉光为组件内散落 rgba 的例外声明；面板四角为 CockpitPanel.vue 内联 SVG data-URL；地图网格/扫描线/暗角与外壳氛围为代码生成装饰。
• 蓝湖侧色值/字号/字体明细仍待逐项人工盘点，本票只裁定映射规则，不预设蓝湖具体取值。
• 第一轮已确认：Q1=B（保留现有 token 名称，可新增语义 token）；Q2=D（可复现效果进入 token/CSS，复杂纹理才进资源）；Q3=B（面板优先 CSS/SVG，无法无损复现才切图）；Q4=A（票 03 锁字体槽位，票 06 锁授权/回退）；Q5=C（按需新增语义字号/间距 token，不建裸像素海量档位）；Q6=B（--u 以蓝湖主画板宽度为基准）；Q7=A（事件与点位继续共用语义调色板）；Q8=A（本次只交付一套深色主题）。
• 第二轮已确认：Q9=B（同一 token 冲突时以主画板/首页画板为准，其他为局部例外）；Q10=B（局部例外使用带语义的局部 token，记录适用组件/状态）；Q11=C（1280px 优先文字可读、按钮可操作和不重叠，左右栏保持宽度自动换行，面板内纵向滚动并支持卷轴式展开/折叠，装饰可缩放/隐藏/降级）；Q12=基于默认态推导缺失状态，但推导状态必须标记为非蓝湖确认；Q13=B（可读性不足时提高对比度/线宽/不透明度并记录偏差）；Q14=C（静态 token 检查、四模式结构回归、主画板与 /cockpit 对照、1280px 检查）。
• 第三轮已确认：Q15=B（局部 token 使用视觉语义+适用状态命名，必须记录消费点）；Q16=B（缺失状态按统一规则推导并标记为非蓝湖确认）；Q17=B（左右栏宽度/标题/收放控制稳定，内容区独立纵向滚动，展开折叠只改变可视高度）；Q18=C（主画板为默认值，仅可解释的组件/状态/模式差异建立局部 token，未解释冲突回设计确认）。
• Q19 已确认：B（## Answer 记录决策，同时产出独立视觉 token 规格 Markdown）。

Answer

已形成独立规格：正式视觉系统与现有 token 映射规格。最终裁定如下：

1. 保留现有 token 名称和消费关系，可按需新增语义 token；不重建全套命名，不散落裸色值/裸像素。
2. 可由 CSS/SVG/渐变/几何无损复现的视觉效果继续代码化；复杂位图纹理、噪声和无法无损复现的光效才进入运行时资源。
3. 面板外框和切角优先使用可伸缩的 CSS/SVG；无法无损复现时才切图。
4. 票 03 锁定 --font、--num 等字体语义槽位，字体授权、Web 字体文件、加载失败和回退由票 06 裁定。
5. 字号和间距保留语义 token，按实际消费新增必要档位，不建立大量裸像素档位。
6. --u 以蓝湖主画板宽度为设计基准；主画板为 1920px 时保持现有基准。
7. 事件等级与点位状态继续共用 --lv1–--lv4 语义调色板；如设计稿要求拆色，另立决策，不在本票隐式修改既有语义。
8. 本次只交付一套深色主题。
9. 全局冲突以主画板/首页画板为默认值；只有能明确绑定到组件、状态或模式的差异才建立局部 token。局部 token 使用“视觉语义 + 状态”命名并记录消费点，未解释的冲突回设计确认。
10. 1280px 下优先文字可读、按钮可操作和面板不重叠；左右栏保持宽度自动换行，面板内容区独立纵向滚动，支持卷轴式展开/折叠，装饰可缩放/隐藏/降级。
11. 蓝湖缺少状态稿时，按统一规则从默认态推导 hover/active/selected/disabled/loading/error，但必须标记为非蓝湖确认；各组件不得自行发明不同规则。
12. 低对比/细线影响运行时可读性时，允许提高对比度、线宽或不透明度，并记录偏差。
13. 验收必须同时包含 token/引用静态检查、四模式结构回归、蓝湖主画板与真实 /cockpit 对照、1280px 检查和局部例外/推导状态清单。

真实状态与下一步

• 状态：已完成并关闭。
• 交付物：specs/03-visual-token-mapping.md。
• 下一步：推进运行时资产 manifest 与版本策略、监测点与监测设备位置符号映射和字体授权与缺失资源降级。