设计原则
- 本地优先、终端原生，而不是泛化作品集模板。
- 深色 workbench 氛围，用 amber、cyan、green 表达操作状态。
- 重复使用 panel、route box、mini terminal、evidence list 和机器可读 artifact map。
- 排版要有意图：展示标题使用 Space Grotesk，操作文本使用 IBM Plex Mono。
- 不要把 dashboard.muds.top 私有看板内容当作装饰证明。公共表面只描述边界、架构和脱敏项目上下文。
动效姿态
- 在用户未开启 reduced motion 时，为 hero、card、panel 和 table 使用轻微 rise-in 动效。
- 卡片和路由行只做小幅 hover translation。
- 不使用干扰阅读或遮挡评审内容的滚动劫持动画。
Tokens
实际 CSS 变量和它们在界面中的角色。
#08090b
--bg
主页面背景
#0d1013
--bg-2
次级背景层次
rgba(17, 20, 25, 0.84)
--panel
玻璃感工作台面板
#f4f0e8
--text
主文本
#97a0a8
--muted
次级文字和元数据
#dca64c
--amber
温暖的路由/动作信号
#78c7d5
--cyan
公共路由和系统强调色
#8ed16f
--green
健康状态和 prompt 信号
#e86d63
--red
警告和私有边界对比
排版系统
DisplaySpace Grotesk · Hero 标题、section 标题、项目标题
Operational monoIBM Plex Mono · 导航、路由标签、终端片段、系统正文
组件族
站点导航site-header · 统一的 sticky 导航、品牌标识和当前页面状态。
详情面板detail-panel · 用于证据、文档、profile kit、workflow 和设计页的信息块。
迷你终端mini-window · 终端感的证明和路由状态读数。
路由状态灯route-light · 标识当前公共表面的状态胶囊。
笔记行note-row note-row-link · 紧凑展示 artifact、route 或机器可读链接。
证据列表evidence-list · 展示公共证据点和显式排除项。
视觉证明不是私有数据
视觉系统可以表达本地优先工作、路由边界和脱敏项目上下文，但不能包含私有看板 payload、工作簿数据、凭证、浏览器 session、任务看板状态、GPT Pro 私有提示词、持仓或运营日志。