# Design System ## Theme 深色运行画布,保留旧 Demo 的 n8n 式点阵背景与橙红当前态。颜色只服务于选中和“已采用/暂存/未采用”等关键业务状态。 ## Palette - Background `#101114` - Canvas `#15171b` - Surface `#202228` - Raised surface `#292c33` - Accent `#ff6d5a` - Success `#63c883` - Warning `#f4c152` - Failure `#ff806e` ## Typography Inter/system-ui 单字体产品界面;数据、ID 与技术引用使用 ui-monospace。层级依靠字重与间距,不使用装饰性大标题。 ## Signature 横向的“先发散、再收敛”是界面的视觉签名:主 Agent 目标与规划在左侧,多个实现 Agent 泳道向中间展开;每条泳道内部展示取数、数据决策和候选产出。所有候选先汇入多方案评审 Agent,再由主 Agent 按真实批次收敛,随后进入主脚本整体评审与本轮产出。 ## Layout 画布内悬浮运行工具条 + 顶部轮次导航 + 中央 React Flow 横向画布 + 右侧覆盖式 Inspector。面向非技术人员的业务 Inspector 保持单列阅读;独立的“数据来源”Inspector 不挤压画布,桌面端以“业务详情中的一项|这一项的数据依据|对应的原始字段或原文”逐项并行展示,窄屏则在每个比较项内按三段纵向排列。小屏画布本身仍切换为按轮次排列的 accordion。 初始视口以文字可读为先,不把十轮流程强行压缩到一屏。历史轮默认折叠为摘要,当前轮原位展开;展开时保持视口锚点。候选分支纵向并行,高度随真实内容计算。 ## Agent Decision Cards - Direction、Tradeoff、Evaluation、Creative 共用统一卡片外壳:Agent 身份、决策类型、决定权、一个主结论和最多三个补充摘要。 - Direction 说明最终方向;Tradeoff 说明取舍结果;Evaluation 明确标成建议;Creative 以“产生候选创作表”展示有真实运行记录的创作处理和候选产物,不重复前置“实现任务”的完整创作任务。 - Implementation Plan 不复用普通 Direction 的长文本布局:Inspector 逐路展示动作、类型、作用范围、实施方法、路线侧重和规划理由,完整形成依据默认折叠。 - 主卡不重复显示“系统记录”、默认完整性徽标、数据库来源或“为什么 · 0”。 - 来源仅在“运行记录关联、记录缺失、旧版本记录”会影响理解时显示。 - 决策卡的摘要预算是一个主结论、默认两个摘要、最多三个摘要;完整内容进入 Inspector,不硬编码句数。 - 执行节点只回答“做了什么、得到什么”;结果节点回答“是否达标、形成什么、下一步”。 - 候选卡默认只显示任务、候选产出和状态徽标;取数、依据与自评通过展开和 Inspector 查看。 - 多方案评审显示“建议”,主 Agent 多路决策显示“最终决定”,不能用颜色或文案将二者混为一体。 - 主脚本影响并入本轮产出,不设置独立 Base 节点。 ## Inspector - 业务 Inspector 与“数据来源”Inspector 是两个独立入口;业务 Inspector 继续只服务业务阅读,数据来源 Inspector 专门服务调试对照。 - 数据来源 Inspector 的第一列直接复用业务 Inspector 的投影、顺序和完整内容。每个可见叶子项占一整行,三列共享稳定的 `moduleId`、`rowId` 和 `bindingId`,不再让用户跨模块寻找来源。 - `这一项的数据依据` 展示来源类型、转换方式与采用证据。“内容来自哪里”和“Agent 是否采用”必须分开;没有引用不等于明确未采用。 - `对应的原始字段或原文` 默认直接展示精确字段值或带上下文的原文片段,并显示数据表与记录 ID、Event ID 与名称、状态、耗时和完整性。JSON Pointer 与字符范围进入“定位详情”,完整 Event、数据库记录和 JSON 进入二级折叠。 - 无法安全定位的内容必须显示带原因的 `unresolved`,禁止静默空绑定,也不用文本相似度补链。 - 业务模块可整体折叠;超过 800 字的内容默认显示 240 字预览,数据在数据来源 Inspector 打开时一次读取,大段 DOM 仅在展开时挂载。 - Prompt 抽屉把“本次真实任务”和“当前版本规则”分开,并持续说明当前规则不是历史运行快照。 ## Interaction Mac 双指自由平移,捏合缩放,普通滚轮不缩放;不显示 MiniMap。所有主要按钮和触控目标至少 44px。节点支持 Tab、Enter、Space;数据来源 Inspector 中点击或聚焦来源编号会同步突出当前比较行,Escape 先清除突出状态,再关闭 Inspector,关闭后恢复原卡片按钮焦点。