DESIGN.md · git:20261029.8253041 · 2026-10-29 · sha256 f75b94d569c95b2e
DESIGN.md git:20261029.8253041B
Immutable. This exact content never changes and is served at /api/v1/blob/f75b94d569c95b2e.
---
name: OMK Studio
description: Studio 当前实现的设计基线;品牌紫与专注阅读贯通外壳、观测列表、知识工作台和有明确证据边界的评测报告。
colors:
primary: "#7753ff"
primary-hover: "#6745eb"
action-ink: "#5a3cdb"
selection-fill: "#f2eeff"
text: "#192236"
text-secondary: "#657085"
text-muted: "#5f6b7f"
navigation-hover-text: "#293348"
canvas: "#f7f8fb"
surface: "#ffffff"
border: "#e2e6ee"
navigation-selected: "#ffffff"
sidebar-surface: "#f1f0f8"
sidebar-hover: "#e7e6f0"
sidebar-press: "#dedde9"
surface-hover: "#f4f6fa"
surface-press: "#eaeef6"
tone-success-ink: "#14795a"
tone-warning-ink: "#a1560b"
tone-error-ink: "#b42318"
tone-neutral-ink: "#5f6b7f"
typography:
body:
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif'
page-title:
fontSize: "20px"
lineHeight: "28px"
reader-body:
fontSize: "16px"
lineHeight: "1.85"
knowledge-reader-title:
fontSize: "20px"
fontWeight: 500
lineHeight: "1.5"
knowledge-support:
fontSize: "13px"
knowledge-markdown-heading:
fontSize: "18px"
fontWeight: 500
knowledge-metadata:
fontSize: "12px"
lineHeight: "1.6"
page-description:
fontSize: "12px"
lineHeight: "20px"
session-title:
fontSize: "14px"
fontWeight: 500
rounded:
control: "6px"
container: "8px"
spacing:
hairline: "2px"
micro: "4px"
compact: "8px"
small: "12px"
regular: "16px"
content-inline: "20px"
section: "24px"
major: "32px"
components:
sidebar:
backgroundColor: "{colors.sidebar-surface}"
width: "224px"
sidebar-collapsed:
width: "60px"
sidebar-medium:
width: "200px"
sidebar-mobile-open:
width: "260px"
navigation-item:
textColor: "{colors.text-muted}"
rounded: "{rounded.control}"
padding: "8px 12px"
navigation-item-hover:
textColor: "{colors.navigation-hover-text}"
backgroundColor: "{colors.sidebar-hover}"
navigation-item-pressed:
backgroundColor: "{colors.sidebar-press}"
navigation-item-selected:
textColor: "{colors.action-ink}"
backgroundColor: "{colors.navigation-selected}"
observe-list-row:
backgroundColor: "{colors.surface}"
textColor: "{colors.navigation-hover-text}"
padding: "8px 16px"
observe-reader:
backgroundColor: "{colors.surface}"
textColor: "{colors.text}"
rounded: "{rounded.container}"
padding: "{spacing.section}"
measure-report:
backgroundColor: "{colors.surface}"
textColor: "{colors.text}"
rounded: "{rounded.container}"
measure-section-select:
backgroundColor: "{colors.surface}"
textColor: "{colors.text}"
rounded: "{rounded.control}"
padding: "{spacing.compact}"
knowledge-directory-row:
textColor: "{colors.text}"
rounded: "{rounded.control}"
padding: "{spacing.small}"
width: "100%"
knowledge-directory-row-selected:
backgroundColor: "{colors.selection-fill}"
knowledge-reader:
backgroundColor: "{colors.surface}"
textColor: "{colors.text}"
table-container:
backgroundColor: "{colors.surface}"
rounded: "{rounded.container}"
---
# OMK Studio 设计基线
## Overview
**Creative North Star: "让知识与证据清楚可读、可核对"**
Studio 是知识工作的全屏操作界面,服务于真实工作观测、知识维护与受控测量。内容、来源和结论之间的关系优先于装饰;界面不能以视觉上的“成功”替代领域中尚未成立的判断。产品定位以 [PRODUCT.md](./PRODUCT.md) 为准。
本文件只覆盖 Studio,不定义官网、文档站或第三方插件的视觉。正文以中文维护;英文节名用于兼容 DESIGN.md 的工具格式。执行边界与验收要求以根 [AGENTS.md](./AGENTS.md) 和 [Studio 领域规则](./src/studio/AGENTS.md) 为准,本文件不扩大它们的授权。
**Key Characteristics:**
- 品牌紫标识行动与当前位置,墨色层级承载阅读与导航。
- 全屏外壳保留单一全局侧栏,长内容在内部滚动。
- 观测与核心知识页面采用限宽专注阅读;报告固定摘要与限制,证据按需切换。
- 来源、精确修订、维护选择与效果验证分别表达。
### 基线的使用方式
- **已确认约束与方向**:品牌、导航归属、全屏布局、表格可达性和证据语义,后续设计必须遵守。frontmatter 的品牌紫、文字、表面、选中底与状态 ink 已进入运行时;侧栏新增紫灰表面及悬停/按下档与一级导航白底行动紫按本轮实际实现登记。
- **当前可复用基础**:frontmatter 提取自现有主题与 CSS,作为本版相应角色的默认值;品牌与既有状态色由 `test/architecture/studio-color-tokens.test.ts` 与主题、样式钉成同源。新增侧栏 token 与宽度已登记,不能据此推定每个 token 都有独立门禁。
- **待收敛项**:以“待收敛”标注的差异仅用于识别现状,不作为新页面的默认模板。重设计提案先单独讨论、给出可评审的构图,验证后再更新本文件。
提取依据是 [StudioTheme](./src/studio/web/components/layout/theme.tsx)、[studio.css](./src/studio/web/app/studio.css) 与 [StudioShell](./src/studio/web/components/layout/shell.tsx)。本版以源码为基线,并记录对应真实页面的有限验收;不声称完成所有页面的计算样式、对比度或响应式验收。
早期设计规范与分批改造由 [Issue #1060](https://github.com/lizhiyao/oh-my-knowledge/issues/1060) 跟踪。该阶段的静态稿采用合成数据,不能代替真实组件、交互和可访问性验收;当前实现和证据边界以下文各轮说明为准。
Issue #1060 期间的代表页原型、组件状态矩阵与对比度/布局取证脚本已随该 Issue 关闭退场,仓库内不再保留:已确认的规范取值全部接入运行时并回写到本文件(仍是提案的少数几项记在「仍然没有收敛的」与 Shapes 一节),验收证据从第七批起改在真实 Studio 页面上量(见「已应用的配色」各批记录),逐批结论与取舍同时记在 [Issue #1060](https://github.com/lizhiyao/oh-my-knowledge/issues/1060) 的收口评论里。本文件是当前实现基线与未收敛项的唯一正文;下一轮视觉改进需要可评审构图时重新建稿,并对着真实页面取证。
### 核心知识页面实现与证据边界
知识库、独立对象详情、候选核对和载体详情已按用户批准的“专注阅读”原型迁入生产组件;本文件以下相应规则描述当前实现,不再沿用旧候选三栏或对象列表默认入口。源码依据为 `src/studio/web/components/knowledge/` 中的 `reader.tsx`、`library.tsx`、`library-detail.tsx`、`candidates.tsx`、`artifact-library.tsx`、`carrier-document.tsx`,以及 `src/studio/web/app/studio.css` 的核心知识工作台区块。品牌、外壳和其他页面规则继续沿用。
本轮执行清单、UI 审查与 SDK 独立数据副本的持久化验收记录保存在 [Issue #1170](https://github.com/lizhiyao/oh-my-knowledge/issues/1170)。这些证据覆盖阅读与维护入口、精确知识引用和历史保留,不证明 SDK 动态效果或知识收益已获验证;读屏实测、跨操作系统字形与知识效果验证仍未覆盖。原始引擎未提供初次方向 seed 参考,后续检查不能补证其历史状态。
### 外壳、观测与报告的当前实现与证据边界
用户批准延续品牌紫与专注阅读后,外壳、观测列表与评测报告已落入生产组件。当前复用规则来自 `shell.tsx`、`observe/workspace.tsx`、`observe/reader.tsx`、`measure/measure.tsx` 与 `studio.css`,具体 token、尺寸和组件行为以下文为准。观测阅读不再用左右气泡区分发送者;一级导航改用紫灰侧栏中的白底行动紫,记录选择仍沿用浅紫底与墨色。既有知识工作台、四泳道语义与表格不换行契约继续保留。
该轮真实页面验收覆盖 1440×900、1280×500 与 390×844,修复后共 31 次画面采集、101 项检查、0 项失败;覆盖元信息搜索、项目范围、阅读末尾和重试、侧栏收起与窄屏键盘焦点循环/Escape、报告限制保持可见及四个内容面板可达。另在可见 Chrome 的 390px 响应宽度下核对原生“报告内容”菜单:四选项完整显示,鼠标打开后 Down/Return 提交分析结果,随后 Space/Down/Return 进入逐用例证据和原始定义;展开原始策略后可见 PROGRESS、progress/v1@1.0.0、declared、原因码与摘要。macOS CDP 无法提交原生弹出菜单的输入是该自动化路径限制,不是该轮控件键盘验收的失败。Observe 使用 SDK 冻结记录的独立副本;报告使用重新生成的函数契约测试夹具,四泳道另有明确标识的布局夹具。它们证明展示与交互路径,不证明 SDK 动态效果或知识收益。屏幕阅读器、跨操作系统字形、侧栏外 portal 与所有浮层的焦点行为仍未实测;该轮不把已知 plain-text 503 服务契约改写为完整的应用错误页验收。
### 首次使用与恢复的实现与证据边界
来源与采集、全局设置和候选读取恢复延续既有品牌紫、系统字体与专注阅读结构,不新增视觉世界或 token。当前规则来自 `agents/agents.tsx`、`layout/settings.tsx`、`knowledge/candidates.tsx`、`knowledge/inbox.tsx` 与 `studio.css`:首次入口区分直接阅读和终端报告,设置区分有效配置与填写值,读取失败提供明确恢复操作。
本轮在用户授权的 Playwright 驱动后台无头 Google Chrome、隔离临时配置中完成 1440×900、1280×500、390×844 三档生产页面验收。汇总 `qa-evidence.json` 位于 `/private/tmp/omk-studio-first-use-20261013/`,按检查名称取最后一次结果,225 项通过、无未解决项;五份输入日志保留原始脚本错误和未走完记录,不把中途测试工具问题当产品失败,也不删除它们。来源三档截图在该根的 `review/confirmation/`,设置三档截图在 `review/settings-final/`;上一轮来源截图和此前黑屏/未更新窗口不作为本轮通过证据。
实际覆盖来源固定页头、命令展开与复制入口、刷新和显式工作区、报告缺失/不可读/旧口径、中英文入口、设置有效值及模型范围;真实无效保存保留输入、409 冲突保留输入并阻止覆盖、明确重读最新值、坏设置文件读取失败后恢复、慢读取禁用旧字段,以及成功保存后的持久化读回。候选非限定与来源限定读取失败、关闭提示后的重试、重读到真实空态和内外数量同步均通过;设置抽屉的 Tab/Shift+Tab 循环包含原生 summary,Escape 可关闭。回归涵盖观测、知识、载体、报告和四泳道,测量确认根节点无双向溢出、表格不换行及四泳道可达;不据此宣称全站逐文字对比度或所有计算样式已验。
重新生成的安装包另有 `clean-room-final/results.json`:中英共 12 个页面及包内资源返回成功,设置 API 的无效输入、持久化读回、过期 revision、读取失败与恢复通过。这组 HTTP/资源证据不代替上述 GUI 检查。所有本地证据是临时验收材料,持久交付记录由对应 Issue/PR 承载。
无头 Chrome 的 DOM portal 与键盘路径不等同于可见桌面的原生系统浮层验收;屏幕阅读器和其他操作系统仍未测。外部模型的四次 SDK 对照审查调用未执行,自动审批拒绝后仍待具体出站授权;既有 SDK 副本测试不代替模型调用与报告闭环,不宣称 SDK 效果或知识收益。最终 finish 审查结论为 `ship`,无 UI finding,唯一文档待验表述已修正;该结论只覆盖本轮 Studio UI,不证明 SDK 收益或整个 PR 已完成交付。
## Colors
### 品牌与基础表面
| Token | 角色与适用范围 |
|---|---|
| `primary` | 品牌紫填充值:主按钮、通用键盘焦点轮廓、分区导航当前项下边框 |
| `action-ink` | 正文链接与品牌色小字专用;不与 `primary` 合并,理由见「已应用的配色」 |
| `primary-hover` | 正文、弹层中普通链接的悬停色;不替代具备专属状态的组件规则 |
| `text` | 主文字、分区导航和记录选中文字 |
| `text-secondary` | 辅助说明、分区导航文字与品牌文字 |
| `canvas`/`surface` | 应用背景与白色阅读、列表和报告表面 |
| `sidebar-surface` | 紫灰外壳侧栏;与白阅读面分层 |
| `sidebar-hover`/`sidebar-press` | 一级导航非当前项、收起入口与设置入口的侧栏交互档 |
| `border` | 结构分隔线与内容容器边界 |
| `navigation-hover-text` | 非当前一级导航与列表行的悬停/按下文字 |
| `surface-hover`/`surface-press` | 可点表面的鼠标位置档与按下档,比选中底更中性;按下比悬停深一档 |
| `navigation-selected` | 当前一级导航的白色背景块,文字使用 `action-ink` |
品牌名称为 **OMK Studio**。品牌链接的 hover、focus、active 状态保持文字颜色稳定,键盘焦点通过轮廓提示。
项目文档与 Issue 中,配色统一称为“Studio 品牌紫”,通过色值和用途描述,不以外部参考品牌命名。
一级导航非当前项、分区导航与侧栏记录使用墨色层级;一级导航当前项在紫灰侧栏上用白底与行动紫,正文链接使用品牌色层级。当前导航不参与非当前项的悬停加深。一级导航用背景块标识当前位置,不能复制分区导航的下边框样式。
**The 表面分层 Rule.** 白色阅读面的记录选择与紫灰外壳的一级导航分别使用自己的状态角色;不要把导航悬停档、记录悬停档和选中档合成同一值。
### 已应用的配色
以下取值已进入运行时:`src/studio/web/app/studio.css` 的 `:root` 定义语义 token,`StudioTheme` 的主色与之同源,三者由 `test/architecture/studio-color-tokens.test.ts` 锁住。
| 角色 | 取值 | token | 使用边界 |
|---|---|---|---|
| 主操作填充 | `#7753FF` | `--studio-action` | Studio 品牌紫;主按钮纯色,不将导航正文一并染紫;焦点环、分区导航下边框同用此值 |
| 正文链接与品牌色文字 | `#5A3CDB` | `--studio-action-ink` | 链接与品牌色小字专用 |
| 记录选中背景 | `#F2EEFF` | `--studio-selection-fill` | 侧栏记录与知识目录当前项,配墨色文字与既有指示条;不用于一级导航 |
| 侧栏表面 | `#F1F0F8` | `--studio-sidebar-surface` | 品牌、一级导航、工作区与设置的共用外壳背景 |
| 侧栏悬停/按下 | `#E7E6F0`/`#DEDDE9` | `--studio-sidebar-hover`/`--studio-sidebar-press` | 一级导航非当前项、收起与设置入口;侧栏记录继续沿用阅读表面的中性悬停/按下档 |
| 一级导航当前项 | 白色表面+行动紫文字 | `.studio-sidebar nav a[aria-current]` | 白底、`--studio-action-ink`、字重 600,无旧页头下边框 |
| 阅读表面悬停背景 | `#F4F6FA` | `--studio-surface-hover` | 分区链接、侧栏项目与记录、观测列表行等反馈;比记录选中底更浅 |
| 阅读表面按下背景 | `#EAEEF6` | `--studio-surface-press` | 与阅读悬停档同一批表面;当前记录不参与,避免选中感在按下瞬间消失 |
| 主文字与记录选择 | `#192236` | 现有 `colorText` | 延续墨色层级;一级导航当前项使用行动紫 |
| 状态 ink | `#14795A` `#A1560B` `#B42318` `#5F6B7F` | `--tone-*-ink` | 成功/警告/错误/中性文字;浅底 fill 沿用既有变量关系 |
| 次要文字 | `#657085` | `--studio-ink-secondary` | 14px 及以上的辅助文字;同时写入 `StudioTheme.colorTextSecondary`,Ant Design 组件与本仓库样式共用一个值 |
| 弱文字 | `#5F6B7F` | `--studio-ink-muted` | 12px 及以下小字、落在着色表面上的文字;对应 `colorTextTertiary` |
| 状态浅底 | `#E6F4EE` `#FDF1E3` `#FBEAE8` | `colorSuccessBg` 等 | 必须显式给出:antd 会从基色派生浅底,基色换深后派生出的灰绿/土黄反而不达标 |
| 悬停深色 | `#6745EB` | `--studio-action-hover` → `colorLinkHover`、`Button.colorPrimaryHover` | 正文与弹层链接的悬停文字(实测 5.45:1 落在应用底色、5.55:1 落在卡片底),以及主按钮悬停底色(白字实测 5.79:1)。必须在主题层给出:样式里那条低优先级默认值压不过 antd 注入的 `a:hover`,不覆写时悬停取派生浅紫 `#AA90F5`,实测只有 2.42:1 |
| 页签选中文字 | `#5A3CDB`(墨条仍用 `#7753FF`) | `components.Tabs.itemSelectedColor` | antd 默认把 `colorPrimary` 当选中文字色,压在应用底色上实测 4.43:1,不达小字 4.5:1 |
品牌紫之所以拆成填充与文字两个值,是量出来的:`#7753FF` 对纯白 4.70:1 达标,对应用底色 `#F7F8FB` 只有 4.43:1、对选中底 `#F2EEFF` 只有 4.13:1,都低于小字要求的 4.5:1,而 AA 的大字豁免要 24px,正文与元信息够不到。文字改用 `#5A3CDB` 后,在上述三种表面上分别为 6.77、6.37、5.94:1。状态 ink 同理:基线的 `#1F9D63`、`#D97706`、`#8893A5` 在白底只有 3.46、3.19、3.10,作为 12px 状态文字全部不达标。
主紫与白色按 sRGB 相对亮度计算的对比度约为 4.70:1;该数值只说明此配色组合,不代表生成图片或全部组件已经通过无障碍验收。浅紫不作为普通字号白字按钮的底色。
### 历史配色收口与仍未收敛项
以下批次保留 #1060 当时的取舍与量测口径,不以历史描述覆盖本轮已替换的一级导航、无气泡对话正文或 60px 折叠轨道;当前规则以 frontmatter、「已应用的配色」和「当前布局参数」为准。
字体、间距、页面密度与多栏结构已在 #1060 第三~九批接入运行时(见下方各批记录),本节剩下的提案只到图标字形与加载画法这一层;不从生成图片反推精确 token。
**已收口**:一级导航当前项、观测会话列表、候选列表与评测侧栏四处的选中底色此前分别是浅紫、浅蓝与灰蓝,现统一到 `--studio-selection-fill`,选中指示条统一到 2px 品牌紫;「运行中」行的蓝色指示条是另一个角色(表达活动性,不是选中),收成 `--studio-running-indicator` 但保持原值。
**第二批已收口**:上一批留下的未达项已经修完,且修在正确的层。真实页面(`http://127.0.0.1:7799`,1440×900,逐文字节点量计算样式)现在量不出未达项——观测列表 235 个节点、对话详情 196 个、评测 24 个、知识 27 个、Agent 22 个,均为 0 组未达(这组数字的目录口径见下文更正,本批已换成全隔离重测)。做法是把 `colorLink`、`colorTextSecondary`/`Tertiary` 与 `colorSuccess`/`Warning`/`Error` 在 `StudioTheme` 层与 token 对齐,并把 12 处硬编码 `#8893a5` 与人类气泡的发送者标签收进 `--studio-ink-muted`,不是逐个组件加 CSS 覆写。
这里有一个反直觉的坑值得记下:把基色换深后,Ant Design 会**从基色派生** Tag/Alert 的浅底,结果落在灰绿 `#adb8b2`、土黄 `#e0d9ca` 上,12px 文字实测只有 2.63 与 3.88:1,比换色前更差。所以 `colorSuccessBg` 等浅底与边框必须一起显式给出,这条已锁进门禁。
一个必须记下的接线细节:`components` 要与 `token` **平级**放在 `theme` 下。放进 `token` 对象里会被当成一个无效 token 名,不报错也不生效——第一次尝试就是这么静默失败的,是复量才抓出来。
**第五批已收口(悬停档与圆角)**:「鼠标在这」和「你在这」不再共用一个底色。侧栏折叠按钮、分区导航链接、项目摘要、工具入口四处悬停原本直接写死旧的选中底 `#EEF0F6`,观测会话行又另用第三个值 `#F0F1F8`;现在统一走 `--studio-navigation-hover-fill`(`#F4F6FA`,第六批改名为 `--studio-surface-hover`,比选中底 `#F2EEFF` 更浅、不带紫味)。`#EEF0F6` 只保留给人类消息气泡(`--studio-message-human-fill`),它本就是另一个角色;运行中行的 `#E2EDFF` 表达活动性,不参与归并。圆角则把已有两档钉成 `--studio-radius-control`(6px)与 `--studio-radius-container`(8px),21 处硬编码像素全部替换,样式里不再出现未走 token 的圆角值(`50%` 的圆形品牌标记除外)。
这一批真正的收获是**把量测补到了悬停态**。前四批扫的都是静置的计算样式,而悬停文字色一直不由我们的规则决定:样式里 `.studio-content :where(a:hover)` 是域规则刻意留的低优先级默认值(`:where()` 让自带悬停设计的组件能压过它),但 antd 注入的 `:where(.css-hash) a:hover` 特异性更高,于是悬停文字取它从 `colorLink` 派生的浅紫 `#AA90F5`——压在刚统一出来的悬停底上实测 **2.42:1**;主按钮同理,白字 14px 落在派生的 `#9D7DFF` 上只有 **3.08:1**,静置时是 4.70:1。两个值都不达小字 4.5:1,而前四批的扫描一次也抓不到,因为鼠标从没被真正放上去过。修在主题层:`colorLinkHover` 与 `Button.colorPrimaryHover` 给出同一个深色 `#6745EB`(链接悬停实测 5.45:1 落在应用底色、5.55:1 落在卡片底,主按钮白字 5.79:1),不改那条默认值的优先级,也不动 Input/Select 的悬停边框(1px 描边按非文本 3:1 判,派生值本来就够)。会话行另加一条自己的悬停文字色,把列表行留在墨色层级,不让它继承链接的品牌紫。
**第六批已收口(按下档与选中态不参与悬停档)**:把上一批量到的「按下与悬停同色」补上了第三档。`--studio-surface-press:#EAEEF6` 接到一级导航非当前项、工具入口、侧栏项目摘要、侧栏工作区行与观测会话行,只加深底色、文字层级不变;真实页面逐表面量到 静置透明 → 悬停 `#F4F6FA` → 按下 `#EAEEF6`。同时把这一档改名成 `--studio-surface-hover`——它早就同时用于导航与列表行,名字里的 navigation 不准确。改名时量出一个真回归:侧栏工作区行在被选中时(浅紫底 `#F2EEFF`)悬停会换成更浅的中性底,选中感在鼠标经过的一瞬间消失,违反「当前项不参与非当前项的悬停加深」。一级导航本来用 `:not([aria-current])` 做对了,现在同一口径推广到 `:not(.selected)`,量到选中行三档都保持 `#F2EEFF`。候选列表行本来没有任何悬停反馈(域规则要求可点表面必须有视觉变化),一并补上两档;该表面在隔离工作区里没有数据,到现在也只有门禁这一条证据,不能算在线量过。
**第七批已收口(真产物在线验收与三处修复)**:第一次拿真跑出来的 `omk eval` 产物做在线复核(离线 echo 执行器+`--no-judge`,零 API 调用,五个数据目录全部隔离),量出三处 SSR 层看不到的缺口,全部修完。侧栏运行标识在选中浅紫底上取 `--studio-ink-secondary` 实测 **4.38:1**,差 0.12 就够小字的 4.5:1;换成 `--studio-ink-muted` 后 4.74:1,用的是「12px 及以下小字、落在着色表面上」这条既有角色,不是新配色。等宽片段被列宽裁掉时没有完整内容出口——antd 的自动 `title` 只覆盖纯字符串单元格,包了组件的单元格就不给;出口改由 `Code` 自己给,一处覆盖所有用到它的列,量到「截断且无出口」从 1 处降到 0。
表头吸顶这条前后试了三次,值得单独记下:在样式里给 `th` 写 `position:sticky`,计算值是对的、真实页面上却不吸。逐层清 `overflow` 才量清原因——卡片的 `overflow:hidden`(为圆角裁切)与 antd 的 `.ant-table-content{overflow-x:auto}`(为横向滚动)都会把自身变成滚动容器,把 sticky 的锚点从滚动面板截到卡片内部;而 `overflow-y:clip` 与 `auto` 配对时按规范退成 `hidden`,同样截锚点。最终走 antd 的 `sticky` 属性:它把表头拆成独立的 `.ant-table-sticky-holder` 一层,天然出得了横向滚动容器,卡片的裁切则换成 `overflow:clip`——保留圆角裁切又不建立滚动容器。在线判据不是计算值而是「把表头顶到面板上沿之上时它是否停在那里」,并配一组对照(临时把吸顶层改回 `position:static`):报告页 8 张表里 5 张量到吸住(吸住时 `0`,同一位置改 static 后 `-60`/`-1004`),横向滚动仍在表体这一层(417/268px 可滚且滚得动),页面级横向溢出 0;圆角与卡片外观未变。剩下 3 张在另一页签的折叠区里,切页签后点标题没能展开(手风琴一次只开一个),只有同组件同属性的结构证据,不算在线量过。
**第八批已收口(间距归档与省略出口)**:把现网 80 条一次性间距按「就近归档、同距向上」收进阶梯,阶梯之外只留两个具名档位——`--studio-space-1`(2px 发丝档)与 `--studio-collapsed-rail-offset`(折叠栏避让量,是布局偏移不是间距)。门禁随之收紧成「`padding`/`margin`/`gap` 里不许出现任何字面 px」。代价用同一会话内的 A/B 量:把归档前的 76 条字面量注回页面再量一遍,1273 个可比元素里 253 个尺寸真的变了(侧栏导航行 36→38px、侧栏头部 50→54px、折叠按钮 30→34px),其余只是被顶下去;三条硬判据(页面级横向溢出、被裁单元格、可点表面容得下标签)前后逐项一致,都是 0。第一版曾用「两次运行分别截图对量」,被运行时注入的 `<style>` 节点把下标整体错位,报出 94/358 个假变化,已改成同会话注回旧值才敢报数。
同一批里修掉一个被全局 `nowrap` 掩盖的可达性缺口:6 个身份列被硬切成 `custom-executor-eef2…` 这样,既没有省略号也没有完整内容出口。这里有一条实测教训值得留着——先给 `.ant-table-cell` 全局加 `overflow:hidden;text-overflow:ellipsis`,结果被裁单元格不再贡献固有宽度,整张表从「比容器宽、可横向滚」塌成容器宽,长标识反而只能逐个悬停;配 `tableLayout:fixed` 也救不回来,列会被拉伸填满、同样没有横向滚动。改回按列给 antd 的 `ellipsis`(省略号与自动 title 一起给)后,隐含的 fixed 布局让当前这份产物的 4 张表都不再需要横向滚动(所有列同屏可见),被裁的 6 个单元格全部带省略号与完整内容出口(`noEllipsis`/`noExit` 都是 0);表头与表体拆层后逐列对齐量过,8 张表 0 列错位。列宽之和真超过容器时仍会横向滚(横向滚动那一层没被改坏)。
**仍然没有收敛的**:
- 真实数据下仍存在 **11px** 文字(侧栏项目计数、评测侧栏副标),比规范假设的最小 12px 低一档;换到 `--studio-ink-muted` 后对比度达标,但字号本身是否该抬,属排版规范决定。
- 配色、字号、圆角、边界色、间距阶梯与响应式断点(1280/1024/860)都已接入运行时,由 `test/architecture/studio-type-scale.test.ts` 与 `studio-color-tokens.test.ts` 钉住。**仍未收敛的是图标字形与加载画法**:现网自绘的两枚图标(侧栏收起/展开、设置与帮助)已按本文件网格对齐到 16px/描边 1.5px/round 端点,其余图标来自 Ant Design 内置,是否整体换成自绘线性字形属实现决策;四处加载指示(按钮 spinner、标签前 spinner、输入内嵌条、行级骨架)仍是四种语言,是否统一成一套同样属规范决定。
- 交互态的量测进度:悬停档与按下档都已在真实页面上用派发鼠标事件量过(70 个控件按判据零未达;注入旧浅紫会报出 11 个未达,证明扫描不是空跑)。键盘焦点也已用 Tab 逐元素量过并**修完**:此前 `summary` 与侧栏按钮吃到本仓库的 2px 品牌紫环(4.7:1),而品牌链接与四个一级导航项吃 antd `genFocusOutline` 的派生浅紫 `#DECDFF`,对表面只有 1.27~1.45:1,不达焦点指示器要求的 3:1。现在全应用统一 2px 实色 `#7753FF`,最低一档 4.13:1(那条是压在选中底上的导航项),低于 3:1 的 0 处。修法刻意走样式特异性而不是主题:焦点环颜色是 antd 别名 `colorPrimaryBorder`,它被 slider/date-picker/notification 等 47 处共用,改它等于顺手改一批无关控件的观感。
- 覆盖面限制要说清:报告详情与评测列表在隔离工作区里没有数据可渲染,改用「真实组件 SSR + antd 运行时派生样式 + 真实 `studio.css`」在 1440×900 上量:报告详情 161 个节点、列表 43 个节点,各 0 组未达。**这一层量出了在线量不到的真问题**——页签选中文字用主色压在应用底色上只有 4.43:1。第七批改用真实 `omk eval` 产物在运行中的页面上量,报告详情页已不再依赖这一层兜底。
- 上一批那句「在线量的是有数据的隔离工作区」要说得更准:当时只把 `--observations-dir` 指到合成数据,`agents`/`reports` 等目录仍走默认(项目级与本机等),所以那组节点数(235/196/24/27/22)混了本机真实数据。本批把五个目录全部隔离后重测,节点数为观测 225、评测 23、知识 28、Agent 22,合计 298 个文字节点、0 组未达;结论方向未变,但**换成全隔离口径后数字才叫可复现**。
- #1060 未量到的旧候选三栏已由本轮共享阅读结构替换,不能再作为现行布局或验收缺口。仍未逐例量到的部分包括需要真实评测产物才会出现的空态/错误态组合,以及数据丰富页面上的全部悬停控件;报告详情页已有真实产物可看(第七批),但样本只有 2 个用例,长表与分页要更大样本才验得到。输入框的焦点仍走 Ant Design 的边框+浅紫外阴影(`outline: 3px none`),按非文本 3:1 判达标,但它是同一页上的第三种焦点画法——要不要连它一起收成 2px 实色环,属观感决定,留给你。
- 报告页的**结果摘要投影没有做,前置比原先写的更硬**:`EvaluationReportSchema.summaries` 是无类型 `JsonValue`,内容由调用方决定,本仓库没有生产者。把外部可写的 JSON 直接投给展示层,等于渲染一个没有契约的形状——既定不出「哪些键该显示」,也写不出有意义的缺值分支。两条出路需要定一个:① 先给 `summaries` 定一份带版本的类型化 schema(公开契约变更,要迁移与 BREAKING 标注),再投影;② 与「结论限制/逐用例证据」同样处理,不做这一层,等真有生产者与形状再说。(原 #1060 实现任务 8)
- **比较条件只投了一半**:角色措辞已按 owner 决定收成 `对照组/实验组`(英文 `Control/Treatment`),与 CLI、CLI 参考文档和词汇表逐字一致,已进 view-model 并在报告页只读呈现,`test/studio/application/core-run-catalog.test.ts` 钉住它逐字等于 `plan.definition.comparisons` 且两方都是同一页已投影的被测版本。**可比性评估本身未接**——它不在运行产物集里,接它要先解决产物集包含什么,不属于视觉批次。(原 #1060 实现任务 9 的剩余部分)
- **键盘与读屏的边界要说清**:焦点顺序、焦点环颜色与三档表面状态有真实页面量测;本轮补齐了窄屏侧栏焦点循环、Escape 收回、关闭后隐藏侧栏 inert 与恢复焦点的验收。侧栏外 portal 与其他浮层仍未全面实测,**屏幕阅读器语义未实测**。中文长句的全量换行、系统字体差异与 Windows/Linux 字形覆盖同样未验证。
这些是 #1060 十批收口后仍然开着的部分;该 Issue 已关闭,未闭合项此后由本节跟踪。
### 状态与证据
现有 CSS 已集中定义 `--tone-success-*`、`--tone-warning-*`、`--tone-error-*`、`--tone-neutral-*`。
运行完成、证据完整、已作出判定分别表达;候选的保留不等于内容已验证。来源缺失、不可读和不确定性必须明确呈现。状态的具体含义来自领域投影,展示层不重算或改写。
**已实现:** 候选目录与侧栏工作区记录沿用 `--studio-selection-fill`;一级导航在本轮改为白底与行动紫。小字号状态文字有真实表面(含悬停与按下档)的历史对比度证据。仍然开着的是:状态浅底与色带在数据密集页上的组合没有逐例量过,以及「运行中」的蓝色指示条与浅紫选中底同时出现时是否需要更强的视觉差——这两项属配色评审范围,不由本文件替评审者定值。
## Typography
复用现有系统字体栈,保持中文优先。等宽字体用于代码、技术身份和原始记录,不把整段知识正文改为等宽排版。数字比较区使用等宽数字对齐,长标识仍需完整查看入口。
frontmatter 中的字号按**实际角色**命名。页级标题原本记作 `measure-page-title`(只有评测页有它),现在四个区共用同一档,故改名 `page-title`;`page-description` 是页级说明,`session-title` 是对话列表标题。它们不是统一全站的 display/headline 阶梯;缺乏明确来源的字重或字号不补默认值。
**已接入运行时(#1060 第四批)**:页级标题统一到 20px/28px。此前它散成 8 条规则、四种字号(22/20/18/17)加两处窄屏降档(18→16、20→17),Agent 页还是 18px/26px——同一个应用里「页标题」有四种视觉重量。同时对话阅读正文从 14px/1.8 升到 15px/27px,知识首页补出此前缺失的 h1(文案沿用分区导航已有的「知识载体/Knowledge artifacts」,不新造词)。这条尺度由 `test/architecture/studio-type-scale.test.ts` 锁住:任何一条命中 h1 的规则出现非 20px/28px 的字号或行高都会变红。
核心知识页面的局部尺度已从生产样式抽取:页标题继续使用 `page-title`(20px/28px),阅读面标题使用 `knowledge-reader-title`(20px、字重 500、行高 1.5);正文使用 `reader-body`(16px/1.85),最大行长为 70ch。条件、例外、未知信息、展开辅助内容与载体代码/表格使用局部 `knowledge-support`(13px),其中条件列表行高为 1.7;时间、修订、维护状态与阅读页签使用 `knowledge-metadata`(12px/1.6)。载体 Markdown 一级标题仍为 20px/28px,二级标题使用 `knowledge-markdown-heading`(18px、字重 500),三级标题沿用阅读区 16px 层级;冻结来源正文保持系统字体 14px/1.85。13px 与 18px 是知识页面的局部角色,不扩写为全站字号阶梯。
**The 阅读优先 Rule.** 核心知识正文、辅助条件与元信息分层;不为身份、历史或维护操作降低正文可读性,不把局部辅助字号推广到其他页面。
观测阅读正文同样采用 `reader-body`(16px/1.85)与最大 70ch 的居中列;用户与助手都左对齐,由发送者标签和段落分隔区分,不使用右侧气泡。Observe 列表标题使用 `session-title`(14px、字重 500),项目/Agent/最近请求在第二行组合;工具报错次数只表达曾出现报错,不判断最终工作失败。报告摘要说明与限制为 12px/1.7,判定标题桌面 20px/28px,窄屏局部降为 18px/1.5。Observe、Measure 和既有知识搜索占位文本都使用 `text-muted`,不沿用 Ant Design 的浅灰默认值。
**仍然待收敛**:时间轴与部分计数存在 11px 这类更小字号(历史对比度已达标,但没有全站统一角色);字重仍随组件,未收敛成规范。断点与多栏结构见「当前布局参数」,本轮不统一全部页面的局部字号。
## Layout
### 已确认的空间边界
- 应用占满视口,页面根节点和外壳不承担横向、纵向滚动。导航、页面操作及关键摘要固定可达。
- 左侧栏是品牌、一级导航、工作区列表和设置入口的唯一载体;工作区内容通过外壳槽位加入,不另建一套全局导航。
- 先使用紧凑布局、分页、标签页与按需详情;确有长内容时才在表格、正文、时间轴、证据面板或抽屉内滚动,并约束高度、最小尺寸与滚动传播。
- 不能用 `overflow: hidden` 隐藏无法访问的内容。表格表头和单元格不自动换行;状态、数量和操作列保留空间,长文本用省略加完整提示/详情,或内部横向滚动。
- 普通双行列表优先采用约 56px 行高。独立挂载的报告不强制使用应用外壳;仅挂载 `/measure` 的预览宿主保留无导航的紧凑页头。
### 当前布局参数
这些是现有实现的上下文,不代表新的统一断点体系。
| 范围 | 当前实现 |
|---|---|
| 应用高度 | `100dvh`;弹性内容区域设置最小尺寸约束 |
| 侧栏 | 常规宽度 224px;窗口不超过 1024px 时为 200px;桌面收起后保留 60px 轨道,品牌、一级导航和设置图标仍可达 |
| 窄窗口侧栏 | 窗口不超过 860px 时切为覆盖抽屉,打开后宽 260px,由移动页头按钮控制;Tab 在打开侧栏内循环,Escape 与遮罩收回,关闭后焦点回到触发它的按钮;隐藏侧栏及被覆盖主区通过 inert 限制访问 |
| 内容内边距 | 常规为 24px、纵向 gap 16px;窗口高度不超过 700px 时为 12px 20px、gap 12px;窗口不超过 860px 时为 12px、gap 12px,覆盖高度档 |
| 无导航预览页头/移动页头 | 高度 52px |
| 对话阅读列 | 页头全宽,白色内部阅读区中正文最大 70ch;用户与助手都左对齐,正文 16px/1.85,发送者标签和细分隔保留归属;表格与代码内部滚动,时间与执行信息在轮次尾部;完整环境上下文默认折叠,原文可展开 |
| 观测列表 | 8px 16px 行内边距,最小行高 56px;标题与组合元信息两行,时间/活动状态在右侧;搜索、范围与计数固定,列表内部滚动 |
| 报告 | 白色弹性容器内固定运行/证据/结论状态、判定、摘要和范围/来源限制;四个内容面板各自内部滚动。限制桌面两列,不超过 1024px 改单列;不超过 860px 用原生“报告内容” select 切换同一组面板 |
| 来源与采集 | 页头与返回对话入口固定,接入说明、命令和报告在同一个内部滚动区;接入说明桌面两列,不超过 860px 改单列,说明最大 70ch;窗口高度不超过 700px 时压缩说明内边距 |
| 全局设置 | 复用 Ant Design 抽屉,保存操作位于抽屉页头;正文依次呈现有效配置、知识保存与提炼、语言及按需展开的配置边界;有效配置使用中性浅底,目录长路径可换行,不超过 860px 时名称与值改为上下排列 |
| 核心知识工作台 | 知识库、对象详情、候选核对和载体详情共用 240px 目录加弹性阅读面;正文最大 70ch,目录与正文分别内部滚动,阅读页尾固定可达 |
| 核心知识工作台局部响应式 | 以知识容器宽度为准:不超过 1024px,目录缩为 210px;不超过 860px,目录/正文通过显式入口切换,互不堆叠;窗口高度不超过 700px 时压缩页头与间距,长理由仍有内部滚动出口 |
第八批起,`padding`/`margin`/`gap` 里不再允许出现字面 px:现网 80 条一次性值按「就近归档、同距向上」收进阶梯,由 `test/architecture/studio-type-scale.test.ts` 钉住。阶梯之外保留 `--studio-space-1`(2px 发丝档,图标与文字基线之间;抬到 4px 会把紧凑堆叠撑开)。本轮移除旧的折叠栏内容避让量,由 `--studio-sidebar-width` 和 `--studio-sidebar-collapsed-width` 表达真实栏宽,它们是布局尺寸而非间距阶梯。`clamp()`/`max()` 里由视口派生的边界不受这条约束。
核心知识页面的页头、分区导航、目录筛选与页尾不随长正文滚走。对象筛选展开面宽 260px,最大宽度受当前知识容器约束,最高取 320px 与 60dvh 较小值,内容内部滚动;Escape 与“完成”收起并返回触发控件。窄窗口通过“知识目录/对象目录/载体目录”和“返回正文”切换可见区域,隐藏目录后焦点回到可见控件。来源不可读、无结果与读取失败保留明确提示和恢复入口,不靠旧正文掩盖空态。
**专注阅读结构:** 核心知识工作台共用目录、阅读头、按需视图和固定页尾;窄窗切换目录与正文,较矮窗口压缩头部,长内容始终在内部可达。
**#1060 第九批历史记录**:既有外壳和其他页面仍使用 1280/1024/860 宽度档,`max-height:700` 保留纵向紧凑语义。该批候选三栏→两栏→单栏是已替换实现的历史,不再约束当前核心知识阅读工作台;本轮局部容器查询不改外壳的窗口断点。
## Elevation & Depth
现有主界面主要通过背景、细边界与间距区分区域。桌面侧栏与普通表格容器自身没有专属阴影,不把所有内容都提升成悬浮卡片;Ant Design 控件和浮层仍遵循所用组件主题。
现有外壳自定义阴影用于窄窗口覆盖侧栏(`4px 0 24px rgba(25,34,54,.18)`),遮罩使用 `rgb(25 34 54 / 32%)`。收起侧栏成为原位轨道,旧浮动展开入口及其阴影已移除。知识目录的 inset 选中指示条仍表达选择,不表示容器浮起。
当前覆盖侧栏使用 `transform .2s ease` 过渡,`prefers-reduced-motion: reduce` 下关闭该过渡。源码没有统一的 150ms 颜色/背景过渡,不把简报中的预期时长登记为实现事实;新增动效需按实际作用范围验证。
## Shapes
控件基准圆角来自主题,导航项沿用 `rounded.control`;表格、证据等容器常见圆角为 `rounded.container`。结构边界通常为细线,而不是粗描边。
这两档自 #1060 第五批起接入运行时:样式里只有 `--studio-radius-control:6px` 与 `--studio-radius-container:8px` 两个来源,21 处硬编码像素已替换,圆形品牌标记保留 `50%`。这一条不新增形状,只是把已有的两档钉成变量——`test/architecture/studio-type-scale.test.ts` 会让随手写第三个圆角值的行为变红。边界(border)颜色与粗细仍未收敛,仍是有意的现状。原型评审时提过的第三档 `--studio-radius-overlay:10px`(覆盖层/抽屉)**没有产品来源**:现网抽屉圆角由 Ant Design 主题给出,因此这一档仍是提案,不接入。
品牌标记当前为 32px 圆形,属于品牌元素。时间轴圆点和紧凑节点表达各自的图形角色,不作为普通按钮或卡片的形状规范。
## Components
### 外壳、品牌与导航
复用 `StudioShell`。一级导航包含观测、评测和知识;观测默认进入对话,不设常驻二级导航;对话列表提供低强调的“来源与采集”入口,承载本机 Agent 识别与日志采集报告,无记录时突出“如何接入对话”。对话阅读页在阅读行动区提供“返回对话列表”和“来源与采集”,不额外建立导航栏。工作区列表与底部设置属于同一侧栏。用 `aria-current` 表达当前位置,并保留可见状态。导航项的默认、悬停、按下与当前状态对应 frontmatter 中的 `navigation-item` 角色:非当前项是小字墨,悬停加侧栏悬停面、文字为悬停墨;按下加侧栏按下面;当前项是白底行动紫、字重 600。收起后保留同一组 SVG 图标导航与设置,图标入口保留 aria-label 和 title,不能通过另一套导航复制当前状态。
品牌文字在交互时保持稳定;其它可点表面应具有颜色或背景反馈。不能只增加不可见的语义属性,却让可点击项与静态文字完全一样。
### 按钮、输入框与弹层
现有基础控件来自 Ant Design,统一经过 `StudioTheme`。本版只记录实际主题覆盖的主色、文字色、背景、字体与圆角,不凭经验补写 Ant Design 的尺寸、派生悬停色、禁用态或阴影。
自定义链接与按钮的通用键盘焦点为品牌色轮廓(2px,外偏移 3px);侧栏部分自定义控件使用内偏移(-2px)。已有组件专属焦点样式按其作用范围保留,不能用一条全局覆盖规则替代所有控件状态。
### 来源接入、设置与失败恢复
已识别页面的数据源不可读(503)、记录不存在(404)与报告对比缺参(400)沿用应用外壳,在原地址呈现不同的故障说明。主体使用 20px 标题、14px 说明与既有文字/行动 token;503 明确说明无法据此判断没有记录。重新读取完整重载当前地址,保留显式工作区;返回列表只指向宿主已挂载的分区,400 引导重新选择报告。稳定原因码收在原生可展开诊断信息中,不展示原始异常或数据源路径。内容受视口约束,极矮窗口只在故障内容区内部滚动。 重复斜杠/原始反斜杠属于协议拒绝边界,保持纯文本 404 而不进入 Next;尾斜杠缺失身份仍在原地址显示恢复页。
来源与采集先呈现两个不同入口:Codex 对话从本机日志直接索引,阅读无需先执行采集;识别与采集报告由用户在终端执行命令后生成。命令放在可展开、可复制的说明中,“刷新报告”只重新读取报告,不扫描日志或调用模型。识别和采集报告各自区分缺失、不可读取与旧口径,保留对应恢复命令,不用报告缺失推断没有可读对话。返回对话、查看本机对话和候选入口都保留当前显式工作区。
来源命令说明和设置配置边界的展开入口默认使用行动紫文字,悬停切换为品牌紫;键盘 `focus-visible` 使用 2px 品牌色轮廓、外偏移 3px。该状态规则已接入源码,验收范围遵循前述证据边界。
全局设置先呈现当前有效的知识目录、提炼调用方式/模型与语言,再展示可编辑填写值。有效值来自当前配置投影,填写值来自已保存设置或内置默认值;启动环境覆盖优先于保存值,并明确提示环境变更需要重启。提炼默认模型只影响知识提炼,不代替评测执行模型或评委;切换调用方式清空该模型。阅读对话无需先配置模型,读取和保存设置也不调用模型。保存默认目录不移动已有数据,带显式 workspace 的页面继续使用选定目录。
设置读取开始时立即移除上一份有效配置投影,读取中或失败时禁用填写和保存,失败提示“重新读取”。普通保存失败保留填写值,修正后可再次保存;版本冲突保留填写值但禁用保存,必须读取最新设置,并提前说明重读将替换当前填写内容。有效配置标题与分组标题为局部 16px,表单正文为 14px、帮助说明为 12px/1.7,继续使用既有墨色与弱文字角色,不提升为全站字号规则。
设置抽屉的键盘边界循环包含原生 summary 等可见、可用控件:末项按 Tab 回到首项,首项按 Shift+Tab 回到末项。该补充只修正设置抽屉边界,不替代其他浮层各自的焦点契约。
候选起始页分别表达正在读取、读取失败、没有历史与已完成但返回 0 条候选。读取失败明确说明不能据此判断没有候选,并提供“重新读取候选”;错误不能伪装成普通空态或用旧记录掩盖。带来源限定的候选页也先区分读取中、读取失败可重读与读取成功后的零候选;只有成功读取且当前范围确实为空时,才提示回到对话选择记录提炼,重读按钮在处理中禁用。
对话/项目知识待办的数量摘要在尚未读取时显示正在读取,失败时说明数量不可读,不提前声称 0 条;内部候选重读成功后同步外层总数、待核对数量并清除失败状态,避免正文已恢复而摘要仍显示失败。
### 列表与表格
表格容器复用 `table-container` 的表面与圆角,用 `border` 分隔。不要把空白表格、列宽或每页条数当作品牌视觉;它们取决于数据和任务。
普通双行列表区分标题与辅助信息。Observe 列表在单一白色容器中组合项目、Agent 与最近请求,不把每条记录做成独立卡片;搜索仅匹配对话标题、路径和项目名,空结果直接说明该边界,并提供清空搜索。搜索不检索消息正文,打开记录后才读取内容;无最近请求时使用“打开后读取对话内容”,不能伪装已读取。省略显示必须有完整内容提示或详情路径,操作列不得自动换行。横向滚动发生在表格内部,不传播为整个应用的横向溢出。
### 对话、候选与证据
一级“知识”进入“知识库”,分区导航区分知识库、提炼内容、实体、知识载体和 Skill 健康度。已有内容可按标题和维护决定查找。操作保存位置通过站内 URL 贯穿观测、知识与评测;不自动改变长期默认目录,也不移动已有数据。
核对页优先呈现内容、适用条件、未知信息与原始依据;陈述分类、时间和修订历史按需展开,历史入口明确当前查看的版本。处理理由和修订/保留/舍弃操作固定可达。已保留候选与本批核对完成页直接提供“生成知识载体”。用户选择 skill 或 prompt、核对所选知识,生成可编辑内容并明确保存;更新时可回看原内容,保存为新版本。知识载体分区默认展示已保存载体,体检与观测收在次级标签页。保存后直接进入载体详情,呈现实际载体路径、精确知识来源与版本历史;保留及保存都不宣称效果已获验证。
知识库默认浏览全库,包括尚未关联对象的知识;对象是可选多选筛选,匹配任一对象取并集,按 canonical knowledgeId 去重,不复制共享知识。标题/标签搜索、维护状态和知识类型与对象筛选组合;当前知识退出结果后切到首个有效结果,结果归零时目录与阅读面同时显示空态及清除筛选入口。选取已保留知识进入既有载体预览,不额外调用模型。
知识库内可在目录和图谱之间切换,沿用同一阅读面与筛选。图谱区分知识、窗口实体和来源节点,段落映射、明确派生关系、身份候选和修订沿袭分别呈现;节点和边均有键盘等价选择。失败与过期知识仍可阅读,覆盖不全不隐藏已知关联。选择边后可展开精确原文,直接进入既有实体或映射纠正;保存后读回新投影。URL 保留筛选、图谱选择、修订及精确依据定位,窄屏在图谱与正文间切换,画布和依据各自内部滚动。源码与组件回归不代替真实浏览器、布局或真人任务验收。
独立对象详情在知识库分区内呈现对象目录,阅读面提供“相关知识/来源关联/组织历史”。对象简介明确标为用户维护;来源确认保留原文、限定、身份层次、关联理由和精确修订入口。组织历史不覆盖知识内容或维护决定,回看组织历史时关联知识仍是当前修订,不冒充过去的完整知识快照。页头可返回全部知识,固定页尾可按该对象筛选知识;历史组织修订不提供当前组织编辑操作。
知识库与候选核对复用同一精确知识修订的“正文/依据/修订历史”阅读结构,入口只改变可用行动。条件、例外与未知信息直接可读,陈述分类、时间和精确身份按需展开。候选维护先选择“保留/舍弃”,再填写或修改快捷理由并明确确认;选择或快捷理由本身不提交决定,无理由时不能确认。修订保存为新知识修订,旧维护决定不自动带入;处理理由与操作固定在页尾。
载体详情默认渲染 Markdown 正文,按需切到“知识引用/变化核对/原文/评测记录”;原文保留 frontmatter、实际路径和保存字节。Markdown 不执行原始 HTML,图片以文字链接出口呈现,表格内部横向滚动。精确知识引用保持 knowledgeId 与 revisionId;知识新增修订或维护状态变化显示复核提醒,不自动更新载体。用户核对后将当前已保留知识保存为新版本,旧内容、精确引用和历史版本完整保留;历史版本只读,不能据其直接生成新版本,仍可查看该精确版本的评测入口。引用一致与已保存旁持续说明“效果尚未验证”。
知识库、实体和载体页持续显示当前知识目录。显式目录的读取不依赖模型或默认设置;默认目录设置读取失败时原位重读。实体、组织来源、载体候选及已有选择分别提供读取重试,读取失败不作为空态;组织来源重读保留已经填写的名称与维护理由。组织编辑会话固定打开时的保存基线,后台目录/详情重读不替换草稿或悄悄更新 generation;并发变化仍由保存时的冲突检查拒绝。
实体分析与知识应用按工作区和精确修订隔离请求,切换上下文或卸载后不接收旧响应。知识应用冲突保留角色和理由,阻止再次提交过期草稿,需重读知识后再明确应用。窄屏实体抽屉将标题和操作分行,理由与主要行动保持可达;错误反馈在内部滚动中保持可见。
载体保存遇到明确的知识工作区写入占用时,显示草稿未保存并允许解除占用后重试;不支持的存储格式提示核对目录,继续保留草稿。通用服务器错误、5xx 或不可读回执不证明没有写入,组织与载体都先核对已保存版本。等待保存或核对时,编辑内容保持只读、可选择和复制,不使用低对比度禁用文字替代可读内容。冲突载体必须返回选择并重新生成预览,不能再次提交过期预览。
知识正文、原始记录、派生解释与结果应保持可区分的身份。阅读排版可以改进,但不能覆盖原始证据,也不能因为视觉简化而删除来源、时间、修订或关联身份的访问路径。
载体详情提供“验证这个版本”,在同一确认窗口核对两个版本、用例、实际评分模型与调用范围,确认后发起受控评测;记录与报告可回到精确待测版本。运行状态与效果结论分开呈现。报告优先显示原始策略判定的明确释义、原因、用例范围与已知证据限制;“已作出判定”不表示改进成立,未检出差异不表示等效。策略身份、摘要和原始原因码保留在可展开的证据面板,自定义策略按原文呈现。候选审核要区分维护选择与验证效果;在确认向模型发送内容前保留来源范围预览。错误与证据不完整是可见状态,不包装成普通空白。
### 评测报告
`RunDetail` 用固定摘要和内部滚动证据区呈现领域投影:顶部依次为三个状态轴、判定释义及原始 verdict、摘要、持续可见的范围与来源限制。原因码按需展开,展开列表最高 16dvh 并内部滚动;不把原因折叠连带藏起限制。存在载体来源时保留返回精确待测版本的入口。
范围与版本、分析结果、逐用例证据、原始定义四个面板共用同一受控 section 状态,全部 forceRender,保留原始策略、精确身份和 lineage。桌面使用页签,不超过 860px 用带标签的原生 select,保证第四个面板与原文可达;它控制同一组面板,不建立第二份报告内容。摘要、限制与内容选择固定,长表和证据在选定面板内滚动,表格仍不自动换行。
**The 结论与限制同屏 Rule.** 报告判定和适用范围、来源限制持续同屏,切换证据面板不移走限制;原始判定、身份和证据不能因摘要简化而消失。
**待收敛:** 核心知识页面的共享阅读结构已落地;本轮外壳、观测列表与阅读、评测报告共用相同页面间距和阅读表面,但尚未统一全部页面的标题、主要操作与空状态组件。#1060 已把对话阅读、评测列表与候选核对这三类页面的配色、字号、间距和断点接入运行时并逐节点量过对比度,但组件层的统一(同一角色在各页是否同一结构)仍未收口;本版不宣称全站组件规范已落地。
## Do's and Don'ts
### Do:
- **Do** 复用已有外壳、主题和相应角色的基础值;修改规范时同时说明适用范围与源码依据。
- **Do** 保持用户可见文案中文优先,技术标识保留原语法;LLM judge 统一称为“评委”。
- **Do** 保留来源和不确定性,分别表达运行、证据、结论和维护状态。
- **Do** 改造页面时核对正常桌面与较矮窗口,以及 Observe、Measure、Knowledge、报告和异常页面的布局边界;四条泳道完整可见,表格操作可达。
- **Do** 将参考案例和待验证设计参数留在提案中,经真实页面量测验证后再提升为正式规范。
### Don't:
- **Don't** 把当前散落的所有硬编码色值、字号和页面特例都提升为全站规范。
- **Don't** 用来源缺失替代“无问题”,用运行完成或候选保留替代效果已验证。
- **Don't** 在外壳之外新增一级导航,靠整页滚动或裁切处理布局不足。
- **Don't** 把官网大标题、装饰和宽留白直接套到密集的审核与证据界面。
- **Don't** 将本版源码提取误报为像素级复刻、完整无障碍通过或所有页面已统一;把工具面板预览当成真实 Studio 验收。