# Site Atlas — Design Handoff

状态：**DESIGN_GO**（Open Design native，hermes agent，gpt-5.5）→ **metadata repaired**
日期：2026-06-17

## 1. 交付文件清单

| 文件 | 路径 | 说明 | 来源 |
|------|------|------|------|
| 首页 HTML | `index.html` | 站点列表页，9 项目卡片 + 状态总览 + 跨站热队列 | Open Design 生成 |
| 详情页 HTML | `site-detail.html` | 单站作战驾驶舱，9 个 data-od-id 区块 | Open Design 生成 |
| 原型合同 | `PROTOTYPE.md` | IA、页面矩阵、动作层级、移动端规则 | **reconstructed_from_delivered_html** |
| 设计系统 | `DESIGN.md` | Token 合同、组件规范、合规规则 | **reconstructed_from_delivered_html** |
| 验收判决 | `DESIGN_VERDICT.json` | 自检查结果 | 更新以匹配实际文件 |

## 2. Open Design 项目信息

- Project ID: `site-atlas-cockpit-v1`
- Run ID: `00f32960-3e63-49e4-93b9-25cae6f75e04`
- Agent: `hermes` (Open Design native Hermes ACP)
- Model: `openai-codex:gpt-5.5`
- Design System: `warm-editorial`（被 DESIGN.md 覆盖为 dark cockpit）
- Skill: `frontend-design`

## 3. 设计方向

Dark operations cockpit — 深空海军蓝 + 青蓝 accent，mission control 信息密度。
关键词：command center、evidence-first、status-driven、read-only。

## 4. 设计 Token（CSS 变量）

| Token | Value | 用途 |
|-------|-------|------|
| --bg | #050816 | 页面背景 |
| --surface-1 | #0d1728 | 面板底色 |
| --accent | #38d9ff | 主强调色 |
| --danger | #ff5f73 | 阻塞状态 |
| --success | #52e6a7 | 已稳定 |
| --warning | #f6b44b | 待确认 |
| --fg | #e6edf7 | 正文 |
| --muted | #8da1ba | 次要文字 |
| --font-body | system-ui stack | 正文（无外部字体） |
| --font-mono | SF Mono stack | 代码/ID/数值 |

完整 token 列表见 `DESIGN.md`。

## 5. 页面结构

### 首页 (index.html)
1. `home-hero` — 标题 + 快照时间
2. `home-overview` — 5 个 KPI 卡片
3. `site-grid` — 9 个项目卡片（3 列 → 2 列 → 1 列响应式）
4. `global-queue` — 跨站热队列 + 扫描规则

### 详情页 (site-detail.html)
1. `detail-hero` — 站点标题 + 当前状态摘要
2. `command-summary` — 作战摘要（状态 orb + 下一步 + 4 KPI）+ 责任链
3. `phase-rail` — 8 阶段横向滚动 rail
4. `delivery-chain` — 关键交付链（8 卡片横向滚动）
5. `recent-and-blockers` — 最近变化 + 当前阻塞（双栏）
6. `lifecycle-map` — 详细生命周期（8 阶段卡片，每阶段 3 任务 + 过滤按钮）
7. `artifact-library` — 产物表（24 行，50/page 分页）
8. `source-editor` — 源码只读编辑器（目录树 + 代码预览）
9. `timeline-history` — 最近完成 + 时间线历史

## 6. 合规检查（全部通过）

- ✅ 0 外部 URL
- ✅ 0 raw hex 在 :root 外
- ✅ 0 禁用词（Unlimited/endorsed/sponsored/official/partnership/affiliated/authorized/certified）
- ✅ 390/430 无 body 横向溢出
- ✅ 所有顶级 section 有 data-od-id
- ✅ 中文标签完整（作战摘要、阶段进度、关键交付链、最近变化、当前阻塞、详细生命周期地图、产物表、项目源码只读编辑器、时间线）

## 7. 移动端规则

- 960px 以下：header 变两行，KPI 2 列，卡片 2 列
- 620px 以下：卡片 1 列，表格变卡片行，源码编辑器堆叠，phase/delivery chain 容器内横向滚动
- 所有点击目标 >= 44px

## 8. 交互说明

- 生命周期过滤按钮：本地过滤当前阶段任务，无锚点跳转
- 源码树：点击切换预览，无编辑功能
- 产物表分页：仅更新当前页计数，无远程调用
- 所有按钮为只读检查动作：预览、下载、复制路径

## 9. 开发注意事项

- 所有 CSS 使用 `var(--token)`，禁止在 `:root` 外写 raw hex
- 禁止引入外部字体/图片/脚本
- 产物表数据为占位，需接真实 artifact API
- 源码预览内容为静态 snapshot，非实时文件系统
- 中文标签必须保留，英文仅用于技术名称和路径

## 10. 修复记录

| 时间 | 修复项 | 说明 |
|------|--------|------|
| 2026-06-17 | PROTOTYPE.md | 缺失，从 HTML 结构逆向重建 |
| 2026-06-17 | DESIGN.md | 缺失，从 CSS 变量和组件模式逆向重建 |
| 2026-06-17 | HANDOFF.md | 更新 provenance 标注 |
| 2026-06-17 | DESIGN_VERDICT.json | 更新 artifactFiles 和 provenance |

## 11. 阻塞项

无。设计包已完整，可进入前端实现。

> **注意**：PROTOTYPE.md 和 DESIGN.md 为重建文件，非 Open Design 原始生成产物。若未来需要调整设计合同，应以 HTML 视觉真源为准，或重新运行 Open Design 生成新合同。