feat: add Paper Routes and package five design systems

Add the paper direction with thin tracks, outlined hexagons and line arrows, without exterior color markers or piece numbers. Add a unified catalog for five designs and their 25 themes, with direct review links. Organize each design into an authored design.md, generated tokens.json and preview. Add Agent routing, shared integration guidance, a machine-readable manifest and an executable rendering example. Preserve legacy preview and document links. Validation: 16 focused design, theme and package tests passed; npm run design and static build passed. Confirmed all eight authored documents survive generation unchanged. Browser checks covered mobile, tablet and desktop layouts, theme links and migrated previews. Native engine integration and visual verification remain pending.
2026-09-13 13:24:34 +08:00
parent e32a1616be
commit 10cf93a324
52 changed files with 3365 additions and 149 deletions
@@ -0,0 +1,11 @@
+# 使用与维护设计方案
+
+这是主游戏五套并列设计的入口。先读 [README.md](README.md)，再读 [shared.md](shared.md) 和本次指定方案的 `directions/<id>/design.md`。可通过 [manifest.json](manifest.json) 发现全部 ID、规范、配色和预览路径；不必依赖先前会话。
+
+- 设计 ID 固定为 `calm`、`vivid`、`toy`、`animals`、`paper`；方案编号为 01–05。每套都有相同的五个主题 ID。不得把设计、主题、关卡版本混成同一个参数。
+- 使用方案时复用 `src/art-directions.js` 的 `artDirection` / `directionTheme` 和 `src/renderer.js` 的 `drawScene`。样式接入、颜色映射和跨引擎限制见 shared.md。
+- 修改指定方案时，先核对该方案的 design.md。遵循用户已确认的共用规则：通知在步数下方、居中棋盘、大尺寸扁平道具、金色发光星星。`paper` 不画外围色标或棋子编号。
+- `README.md`、`shared.md`、本文件及各套 `design.md` 是人工维护的文档源。`manifest.json`、各套 `tokens.json`、预览 HTML 由脚本生成；修改源 JS/CSS 和设计规则后重新构建，不手改生成结果。
+- 每套仍是可单独使用、可同时保留的设计方向。除非任务明确选择默认方案，不因新增方案而替换 `calm` 默认值或其他审核选择。
+- UI 任务以用户本次授权为边界。仅使用设计不需要改关卡、玩法、碰撞数学、存档或原生工程。不要为文档整理顺便改这些模块。
+- 按 shared.md 的验证流程检查受影响内容。没有原生实机证据时，不报告 Cocos 已完成视觉接入或验收。
@@ -0,0 +1,80 @@
+# HEX TRAILS · 设计系统入口
+
+这是给设计审核者和 Agent 共用的主游戏设计入口。当前有 5 套并列方案，每套 5 个主题，共 25 种组合。默认方案是 01「柔和原色」，最新候选是 05「轻线纸境」；可同时保留多套。
+
+人看 [设计总览](index.html) 与 [可操作审核页](../design-showcase.html)。Agent 从本文、[共用接入约定](shared.md) 和本次指定方案的 design.md 开始；可直接读 [manifest.json](manifest.json) 发现全部文件。根目录 [AGENTS.md](../AGENTS.md) 与本目录 [AGENTS.md](AGENTS.md) 提供路由和维护要求。
+
+## 按任务找到入口
+
+| 你要做什么 | 先读 | 然后做什么 |
+| --- | --- | --- |
+| 使用指定设计实现页面 | shared.md → 该套 design.md → tokens.json | 复用 directionTheme 和 drawScene，并接入对应 CSS |
+| 调整某套造型或配色 | 该套 design.md → 文档列出的 JS/CSS 源 | 修改对应分支，同步文档，再生成配色与预览 |
+| 比较与选择设计 | index.html | 同主题比较，再到审核页多选、记录意见 |
+| 用其他引擎实现 | shared.md 跨引擎范围 → 该套 design.md | 复用绘制命令和几何，按浏览器参考验收 |
+| 自动发现方案与颜色 | manifest.json → designs[].tokens | 路径从仓库根解析，schemaVersion 当前为 1 |
+
+## 五套独立规范
+
+| 编号 | ID | 方案 | Agent 规范 | 数据 | 预览 |
+| --- | --- | --- | --- | --- | --- |
+| 01 | calm | 柔和原色：哑光原版 | [design.md](directions/calm/design.md) | [tokens.json](directions/calm/tokens.json) | [查看](directions/calm/index.html) |
+| 02 | vivid | 高彩游乐场：高饱和贴纸 | [design.md](directions/vivid/design.md) | [tokens.json](directions/vivid/tokens.json) | [查看](directions/vivid/index.html) |
+| 03 | toy | 积木轨道屋：塑胶积木 | [design.md](directions/toy/design.md) | [tokens.json](directions/toy/tokens.json) | [查看](directions/toy/index.html) |
+| 04 | animals | 动物弯弯镇：动物角色 | [design.md](directions/animals/design.md) | [tokens.json](directions/animals/tokens.json) | [查看](directions/animals/index.html) |
+| 05 | paper | 轻线纸境：细线纸面 | [design.md](directions/paper/design.md) | [tokens.json](directions/paper/tokens.json) | [查看](directions/paper/index.html) |
+
+设计 ID、主题 ID 和关卡版本各自独立。每套都支持 `lagoon`（轻松）、`apricot`（进阶）、`lavender`（烧脑）、`rose`（挑战）、`midnight`（每周挑战）；显示名可以不同，ID 不变。各主题名称、色值与有序色板从 tokens.json 读取。
+
+## 文件架构与来源
+
+```text
+design/
+├── AGENTS.md                 # Agent 工作入口，人工维护
+├── README.md                 # 本索引，人工维护
+├── shared.md                 # 共用规则、接入、验证与限制，人工维护
+├── manifest.json             # 全部方案与文件路径，生成
+├── index.html                # 人看的总览，生成
+├── examples/
+│   └── render-design.mjs     # 可执行的无 DOM 接入示例
+├── directions/
+│   ├── calm/                 # 其余 vivid / toy / animals / paper 结构相同
+│   │   ├── design.md         # 本套设计规范，人工维护，构建不覆盖
+│   │   ├── tokens.json       # 12 色库、5 主题与 4/7/9/12 色板，生成
+│   │   └── index.html        # 人看的完整设计稿，生成
+│   ├── calm.html             # 兼容旧 URL，跳转到 calm/index.html
+│   └── calm.md               # 兼容旧文档入口，指向 calm/design.md
+├── art-directions.css        # 五套控件的样式源
+├── game-tools.css            # 共用扁平道具与布局源
+└── tokens.json               # 基础语义色导出，不是五套方案全集
+```
+
+设计颜色定义仍在 [src/art-directions.js](../src/art-directions.js) / [src/design-tokens.js](../src/design-tokens.js)，几何仍在 [src/renderer.js](../src/renderer.js) / [src/token-art.js](../src/token-art.js)。没有将运行时代码复制到每套目录。各 design.md 解释意图、精确画法、控件差异、不可丢失的特征和验收点；tokens.json 给 Agent 提供当前数值快照。
+
+所有生成 JSON 中 `pathBase` 为 `repository-root`；文件路径从仓库根目录解析。它与 Markdown 内按当前文档位置解析的相对链接不同。manifest 的版本号描述数据格式，不代表第几套设计。新增字段可保持同一版本；改变字段含义或移除字段时升级版本并更新消费者。
+
+## 快速验证一次接入
+
+在仓库根目录执行，Node.js 20+，无需安装依赖：
+
+```sh
+node design/examples/render-design.mjs paper lagoon 7
+```
+
+它调用共享主题与渲染器，输出设计 ID、主题 ID、色数、棋盘格数、色板和绘制命令数。可更换为 `animals midnight 12`。未知 ID 或不支持的色数会报错，避免 Agent 拼错 ID 后默默使用默认设计。此例验证无 DOM 几何接入，不代替 PNG、CSS 或实机视觉验收。浏览器 Canvas 示例在 shared.md 中。
+
+## 修改、生成与校验
+
+```sh
+npm run design
+node --test tests/design-packages.test.js tests/art-directions.test.js tests/themes.test.js
+node scripts/build.mjs
+```
+
+- 规范源：本目录 AGENTS.md、README.md、shared.md、各套 design.md，直接编辑且不会被生成脚本覆盖。
+- 实现源：JS/CSS、已接受的图集；在本次指定的方案范围内修改。
+- 生成物：manifest、各套 tokens.json、index.html 及旧入口；不要只改生成物，下一次构建会重建。
+- 新增方案：在 ART_DIRECTIONS 注册稳定 ID，新增 `directions/<id>/design.md`，更新本索引与相关验证，再运行构建。缺少规范时构建会失败。
+- 校验覆盖文件可发现性、链接、配色导出与运行时一致性，以及可执行示例。视觉与原生范围按 shared.md 验收。
+
+旧的 `design/directions/<id>.html` 和 `<id>.md` 入口继续可用；新的代码和文档请引用独立目录。根目录 Design.md / Design.html 保留基础组件与历史设计说明，不作为五套独立方案的唯一规范。实验室中的其他玩法原型各有自己的文档，不在这五套主游戏设计的 manifest 中。
@@ -1,5 +1,5 @@
 .direction-review{padding:52px 0 24px}.review-heading{display:flex;align-items:end;justify-content:space-between;gap:30px}.review-heading h1{font-size:clamp(30px,4vw,48px);letter-spacing:-1.5px;margin:14px 0}.review-heading p{max-width:730px;color:#56687A}.review-heading>a{font-size:12px;white-space:nowrap;padding-bottom:22px}
-.direction-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:28px 0 18px}.direction-card{border:1px solid #273b5020;border-radius:18px;overflow:hidden;background:white}.direction-switch{display:block;background:none;padding:0;width:100%;text-align:left;color:#273B50}.direction-switch canvas{display:block;width:100%;height:auto}.direction-switch[aria-pressed=true]{box-shadow:inset 0 -3px #6652B8}.direction-card:has([aria-pressed=true]){outline:2px solid #6652B8;outline-offset:3px}.direction-card-title{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:14px 12px;font-weight:650;font-size:13px}.direction-card-title small{font-weight:400;font-size:10px;color:#56687A}.keep-design{display:flex;align-items:center;gap:8px;border-top:1px solid #273b5010;padding:12px;font-size:12px;cursor:pointer}.keep-design input{width:17px;height:17px;accent-color:#6652B8}.review-summary-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}.review-summary-bar p{font-size:12px}.review-summary-bar button,.sheet-link{background:#273B50;color:white;border-radius:10px;padding:12px 16px;font-size:12px;display:inline-block}.direction-detail{margin-top:24px;border-top:1px solid #273b5020;border-bottom:1px solid #273b5020;padding:30px 0;display:grid;grid-template-columns:1.25fr 1fr;gap:60px}.direction-detail h2{font-size:28px;margin:10px 0}.direction-detail p,.direction-detail li{font-size:13px;line-height:1.9}.direction-detail ul{padding-left:18px;color:#56687A;margin-bottom:22px}.review-note{font-size:13px;display:flex;flex-direction:column;gap:12px;padding-top:4px}.review-note textarea{resize:vertical;width:100%;min-height:110px;border:1px solid #273b5030;border-radius:12px;padding:14px;background:white;font:inherit;color:#273B50}.review-note small{font-size:11px;color:#56687A}.intro{padding-top:30px}.intro h1{font-size:34px}.direction-review~.intro .intro-note{max-width:520px}
+.direction-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin:28px 0 18px}.direction-card{border:1px solid #273b5020;border-radius:18px;overflow:hidden;background:white}.direction-switch{display:block;background:none;padding:0;width:100%;text-align:left;color:#273B50}.direction-switch canvas{display:block;width:100%;height:auto}.direction-switch[aria-pressed=true]{box-shadow:inset 0 -3px #6652B8}.direction-card:has([aria-pressed=true]){outline:2px solid #6652B8;outline-offset:3px}.direction-card-title{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:14px 12px;font-weight:650;font-size:13px}.direction-card-title small{font-weight:400;font-size:10px;color:#56687A}.keep-design{display:flex;align-items:center;gap:8px;border-top:1px solid #273b5010;padding:12px;font-size:12px;cursor:pointer}.keep-design input{width:17px;height:17px;accent-color:#6652B8}.review-summary-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}.review-summary-bar p{font-size:12px}.review-summary-bar button,.sheet-link{background:#273B50;color:white;border-radius:10px;padding:12px 16px;font-size:12px;display:inline-block}.direction-detail{margin-top:24px;border-top:1px solid #273b5020;border-bottom:1px solid #273b5020;padding:30px 0;display:grid;grid-template-columns:1.25fr 1fr;gap:60px}.direction-detail h2{font-size:28px;margin:10px 0}.direction-detail p,.direction-detail li{font-size:13px;line-height:1.9}.direction-detail ul{padding-left:18px;color:#56687A;margin-bottom:22px}.review-note{font-size:13px;display:flex;flex-direction:column;gap:12px;padding-top:4px}.review-note textarea{resize:vertical;width:100%;min-height:110px;border:1px solid #273b5030;border-radius:12px;padding:14px;background:white;font:inherit;color:#273B50}.review-note small{font-size:11px;color:#56687A}.intro{padding-top:30px}.intro h1{font-size:34px}.direction-review~.intro .intro-note{max-width:520px}
 body[data-design=vivid] .phone{border:3px solid #30264C;box-shadow:8px 8px #30264C;border-radius:18px}body[data-design=vivid] .icon-button{background:#4A24E8;border:2px solid #30264C;border-radius:8px;box-shadow:3px 3px #30264C}body[data-design=vivid] .phone-top strong{font-weight:900;letter-spacing:-.6px}body[data-design=vivid] .game-notice{border:2px solid #30264C;border-radius:8px;box-shadow:3px 3px #30264C}
 body[data-design=toy] .phone{border:8px solid #F9EDCF;border-radius:42px;box-shadow:0 12px 0 #B5A68D,0 20px 30px #273b501f,inset 0 3px 3px #FFFFFF90}body[data-design=toy] .icon-button{background:#4279B7;border-radius:15px;box-shadow:0 4px #244F80,inset 0 2px #82ACD2}body[data-design=toy] .game-notice{background:#FFF9EB;border:2px solid #D8CBB0;box-shadow:0 3px #C4B598}
 body[data-design=animals] .phone{border:3px solid #718763;border-radius:40px 40px 28px 28px;box-shadow:0 6px 0 #71876330}body[data-design=animals] .icon-button{background:#54795C;border-radius:16px 16px 12px 12px;box-shadow:0 3px #36523C}body[data-design=animals] .game-notice{background:#FFFCED;border:1px solid #71876380;border-radius:18px}.phone canvas{min-width:0}
@@ -12,3 +12,19 @@ body[data-design=toy]:not(.editing) .game-shell .game-icon{filter:drop-shadow(0
 body[data-design=animals]:not(.editing) .game-shell .game-icon{filter:sepia(.25) hue-rotate(320deg)}
 .quick-review{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:center;gap:22px;padding:10px 22px;background:#F7F6F2F5;border-bottom:1px solid #273b501c;backdrop-filter:blur(12px);font-size:12px}.quick-review label{display:flex;align-items:center;gap:9px}.quick-review select{font:inherit;color:#273B50;background:white;border:1px solid #273b5033;border-radius:8px;min-height:36px;padding:5px 10px}.quick-review a{font-size:11px}.direction-picker,.phone{scroll-margin-top:80px}
@media(max-width:500px){.quick-review{gap:10px;padding:8px 10px}.quick-review label{gap:5px}.quick-review select{max-width:130px;font-size:11px}.quick-review a{font-size:10px}.review-heading h1{font-size:28px}}
+
+/* Paper Routes carries the light, flat drawing language of the variants lab. */
+body[data-design=paper] .phone{border:1px solid #CBD7DD;border-radius:28px;box-shadow:none}
+body[data-design=paper] .icon-button{background:#607B90;border:1px solid #FFFFFFB8;border-radius:12px;box-shadow:none}
+body[data-design=paper] .game-notice{background:#FAFBF7;color:#506674;border:1px solid #D3DFE3;box-shadow:none}
+body[data-design=paper] .rotations button>span,body[data-design=paper]:not(.editing) .rotate-button>.ui-icon{filter:brightness(0) saturate(100%) invert(43%) sepia(12%) saturate(987%) hue-rotate(161deg) brightness(94%) contrast(88%)}
+body[data-design=paper][data-theme=midnight] .rotations button>span,body[data-design=paper][data-theme=midnight]:not(.editing) .rotate-button>.ui-icon{filter:none}
+body[data-design=paper] .game-tool{--item-color:#477FC0;--item-border:1px solid #FFFFFFCC;--item-radius:50%}
+body[data-design=paper] .game-tool[data-tool=restart]{--item-color:#D66C4D}
+body[data-design=paper] .game-tool[data-tool=hint]{--item-color:#B58943;--item-icon-filter:none}
+.sheet-reference{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;margin:0 0 48px;padding:28px;background:#EAF0F3;border-radius:24px}
+.sheet-reference canvas{display:block;width:100%;height:auto}.sheet-reference h2{font-size:28px;margin:14px 0}.sheet-reference p{font-size:13px;color:#506674}.sheet-reference a{font-size:12px;text-decoration:underline;text-underline-offset:4px}
+.reference-spec{display:grid;grid-template-columns:1fr auto;gap:12px;font-size:12px;padding:18px 0;border-top:1px solid #CBD7DD;border-bottom:1px solid #CBD7DD}.reference-spec dt,.reference-spec dd{margin:0}.reference-spec dd{font-family:ui-monospace,monospace;color:#506674}
+@media(max-width:650px){.sheet-reference{grid-template-columns:1fr;gap:20px;padding:18px}.sheet-reference h2{font-size:24px}}
+.sheet-nav{gap:16px;align-items:center;flex-wrap:wrap}.sheet-family-nav{display:flex;flex-wrap:wrap;gap:8px;padding-top:20px}.sheet-family-nav a{font-size:11px;min-height:40px;padding:11px 13px;border:1px solid #CBD7DD;border-radius:10px}.sheet-family-nav a[aria-current=page]{background:#294D60;color:#FFFFFF;border-color:#294D60}
+.sheet-agent-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px;font-size:11px;color:#506674}.sheet-agent-links a{text-decoration:underline;text-underline-offset:4px}
@@ -0,0 +1,12 @@
+:root{font-family:'PingFang SC','Microsoft YaHei',sans-serif;color:#273B50;background:#F7F8F5;font-synthesis:none}
+*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #6652B8;outline-offset:5px}p{font-size:14px;line-height:1.85;color:#56687A}h1,h2,h3{letter-spacing:-.6px}h2{font-size:28px;margin:12px 0}main,.catalog-nav,footer{max-width:1320px;margin:auto;padding-left:40px;padding-right:40px}
+.catalog-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:24px;padding-bottom:24px;border-bottom:1px solid #D7DEDF;font-size:13px}.brand{font-size:19px;font-weight:750}.brand span{font-size:11px;font-weight:500;margin-left:14px}.eyebrow{font-size:10px;letter-spacing:2px;color:#56687A;font-weight:650}
+.catalog-intro{display:grid;grid-template-columns:1fr 310px;align-items:center;gap:70px;padding:62px 0 50px}.catalog-intro h1{font-size:clamp(38px,5vw,62px);line-height:1.18;margin:18px 0}.catalog-intro p{margin-bottom:0}.latest-design{display:flex;flex-direction:column;gap:14px;border-left:2px solid #A9BDC7;padding:8px 0 8px 26px}.latest-design>span{font-size:12px;color:#56687A}.latest-design strong{font-size:25px}.latest-design small{font-size:13px;line-height:1.85;color:#56687A}.latest-design b{font-size:12px;font-weight:600}
+.compare-heading{display:flex;justify-content:space-between;align-items:center;gap:22px;border-top:1px solid #D7DEDF;padding-top:32px}.compare-heading p{margin-bottom:0}.compare-heading>a{white-space:nowrap;font-size:12px}.catalog-theme-picker{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0 12px}.catalog-theme-picker button{border:1px solid #BCC9CE;border-radius:24px;min-height:44px;padding:10px 20px;color:#273B50;background:transparent;font-size:13px}.catalog-theme-picker button[aria-pressed=true]{color:#FFF;background:#294D60;border-color:#294D60}.comparison-status{font-size:11px;margin:0 0 20px}
+.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.catalog-card{border:1px solid #D7DEDF;background:#FFF;border-radius:20px;overflow:hidden;scroll-margin-top:24px}.card-preview{position:relative;padding:20px 16px 16px}.design-number{font-size:11px;letter-spacing:1px}.card-preview canvas{display:block;width:100%;height:auto;margin-top:4px}.preview-theme{display:block;text-align:center;font-size:12px}.card-body{padding:24px;display:flex;flex-direction:column}.card-body h3{font-size:22px;margin:10px 0 0;display:flex;align-items:center;gap:10px}.card-body h3 small{font-size:10px;letter-spacing:0;font-weight:500;background:#EAF0F3;border-radius:6px;padding:4px 7px}.card-body p{font-size:13px;min-height:72px;margin:12px 0 20px}.card-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;font-size:12px}.card-actions a:first-child{background:#294D60;color:white;padding:12px 14px;border-radius:10px}.card-actions a:last-child{padding:10px 0}
+.theme-map{padding-top:64px;scroll-margin-top:24px}.theme-matrix{border-top:1px solid #D7DEDF;margin-top:26px}.theme-family{display:grid;grid-template-columns:170px 1fr;align-items:center;border-bottom:1px solid #D7DEDF;padding:20px 0;gap:20px}.theme-family h3{font-size:14px;margin:0}.theme-family h3 span{font-size:11px;color:#56687A;margin-right:8px}.theme-family>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.theme-entry{display:flex;gap:10px;align-items:center;min-width:0;padding:4px 0}.theme-entry i{width:28px;height:38px;border:1px solid #273B5020;border-radius:7px;flex-shrink:0}.theme-entry small,.theme-entry strong{display:block}.theme-entry small{font-size:10px;color:#56687A;margin-bottom:5px}.theme-entry strong{font-size:12px;font-weight:500;line-height:1.5}.theme-entry b{display:none;font-size:12px;font-weight:400}
+.catalog-notes{display:grid;grid-template-columns:250px 1fr;gap:24px;padding:54px 0}.catalog-notes ul{margin:0;padding-left:18px;font-size:13px;line-height:2.2;color:#56687A}.catalog-notes>a{grid-column:2;font-size:12px;text-decoration:underline;text-underline-offset:5px}footer{display:flex;justify-content:space-between;gap:20px;padding-top:24px;padding-bottom:30px;border-top:1px solid #D7DEDF;font-size:11px;color:#56687A}
+@media(max-width:1050px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-intro{gap:36px}.theme-family{grid-template-columns:1fr;gap:16px}}
+@media(max-width:650px){main,.catalog-nav,footer{padding-left:22px;padding-right:22px}.brand{font-size:17px}.brand span{display:none}.catalog-nav{font-size:12px}.catalog-intro{grid-template-columns:1fr;gap:28px;padding:38px 0}.catalog-intro h1{font-size:40px}.latest-design{padding-left:18px}.latest-design small{display:none}.latest-design{gap:10px}.compare-heading{display:block}.compare-heading>a{display:inline-block;margin-top:16px}h2{font-size:24px}.catalog-theme-picker{gap:6px}.catalog-theme-picker button{padding:9px 13px;font-size:12px}.catalog-grid{grid-template-columns:1fr;gap:22px}.card-body p{min-height:0}.theme-map{padding-top:44px}.theme-family>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.theme-entry b{display:block;margin-left:auto}.theme-entry{padding-right:6px}.catalog-notes{grid-template-columns:1fr;gap:16px;padding:40px 0}.catalog-notes>a{grid-column:auto}footer{flex-direction:column;gap:12px}}
+@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
+.catalog-nav nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:18px;font-size:12px}@media(max-width:650px){.catalog-nav nav{gap:10px;font-size:10px}}
@@ -1,27 +1,5 @@
-# 动物弯弯镇
+# 04 · 动物弯弯镇

-猫咪、小熊、兔子与青蛙沿轨道出游。用表情与耳朵增加性格，方向箭头独立保留。
+本文件为旧入口。完整、人工维护的 Agent 规范已迁移到 [animals/design.md](animals/design.md)。

-## 设计规则
-
- 圆脸、短耳与小表情，外形保持在六角范围内
- 箭头留在脸部下方，不靠动物朝向猜方向
- 草地、木棕与奶油毛色，搭配森林小径
-
-## 五种主题
-
-| 难度 | 名称 | 环境色 |
-| --- | --- | --- |
-| 轻松 | 青草野餐 | #A9CD69 |
-| 进阶 | 橡果秋游 | #E7B947 |
-| 烧脑 | 溪边捉迷藏 | #72BEB2 |
-| 挑战 | 红土探险 | #C67B47 |
-| 每周挑战 | 萤火森林 | #183F36 |
-
-## 游戏道具与布局
-
- 撤销、重来、提示使用独立彩色底座，64–68px，图标 32px，标签 13px。顶部导航保持紧凑。道具使用纯色平面，不使用阴影、立体底边或渐变高光。
- 右上角预留次数或“▶ AD”角标。设计稿展示“撤销 3 次”和“广告获取提示”，仅为样式，不启用真实库存或广告逻辑。
- 棋盘在通知区与独立旋转区之间垂直居中。旋转区和道具区占据真实布局行，不覆盖棋盘。
-
-此方案使用独立的棋子造型、轨道材质和控件样式，共用现有弯曲轨道玩法。审核页支持同时保留多套方案。
+[设计稿](animals/index.html) · [配色数据](animals/tokens.json) · [Agent 接入说明](../README.md)
@@ -0,0 +1,52 @@
+# 04 · 动物弯弯镇
+
+设计 ID：`animals` · 渲染风格：`animals` · 英文名：PAW PARADE。卡通动物候选方案，可与其他方案同时保留。
+
+[Agent 接入约定](../../shared.md) · [配色数据](tokens.json) · [完整设计稿](index.html) · [试玩与审核](../../../design-showcase.html?design=animals)
+
+## 设计目标
+
+猫、熊、兔与青蛙沿轨道出游。颜色来自毛色、草地、木棕和奶油色，保留自然感。表情用来增加性格；玩家通过独立箭头判断方向，不靠动物脸朝向猜规则。
+
+## 棋盘与棋子怎么画
+
+复用 [renderer.js](../../../src/renderer.js) 的非 paper 棋盘和 [token-art.js](../../../src/token-art.js) 的 animals 分支。r = 格半径 s × 0.985。
+
+| 部件 | 当前实现 |
+| --- | --- |
+| 分格／轨道 | 分格 max(1, s × 0.024)，外缘 max(4, s × 0.16)，中心线 max(2.5, s × 0.10) |
+| 六角底托 | 半径 r × 0.94，奶油白 #FFFCED，浅绿边 #526F5744、线宽 r × 0.035 |
+| 动物种类 | 经主题映射后的色库索引 % 4：0 猫、1 熊、2 兔、3 蛙 |
+| 脸部 | 圆脸半径 r × 0.51，中心上移 r × 0.04；耳朵用三角、圆或采样椭圆 |
+| 表情 | 深色 #263A3A 眼睛与嘴，#EF958B 腮红；不增加数字或文字 |
+| 方向底 | 下方 y + r × 0.43 的白圆，半径 r × 0.36 |
+| 方向箭头 | #263A3A 实心箭头，尺度 r × 0.44，位于白圆内 |
+
+动物轮廓和脸保持正立，方向箭头独立旋转。tokens.json 中 pigments.arrow 是共享颜色 token；**animals 分支的实际箭头固定为 #263A3A，底色是白圆**，不要用颜料色库的 arrow 覆盖脸下方向区。
+
+角色种类是表现映射，不是游戏功能或阵营。初始棋子索引决定主题色，再决定种类；移除棋子后不可重排剩余动物。全部造型为多边形、线与圆，不需要另生成动物 PNG。
+
+## 五种主题
+
+| 主题 ID | 阶段 | 名称 | 独立用色方向 |
+| --- | --- | --- | --- |
+| lagoon | 轻松 | 青草野餐 | 草地绿、奶油底与动物毛色 |
+| apricot | 进阶 | 橡果秋游 | 秋叶黄、橡果棕与麦芽金 |
+| lavender | 烧脑 | 溪边捉迷藏 | 溪水青、苔绿与暖棕 |
+| rose | 挑战 | 红土探险 | 红土环境与沙色小径 |
+| midnight | 每周挑战 | 萤火森林 | 深森林绿与萤火浅黄 |
+
+完整配色和每主题 4/7/9/12 色有序 palette 见 tokens.json，源为 [art-directions.js](../../../src/art-directions.js)。不要把原版粉紫糖果配色直接套在动物脸上。
+
+## 控件与边界
+
+顶部控件与通知延续绿、奶油色与圆润边界。底部道具为苔绿／木棕／黄的纯色底座，圆角比例 44% 44% 36% 36%，3px 奶油边；有轻微点线装饰，无投影或立体厚度。角标与通关星星规则见 shared.md。
+
+## 验收与接入
+
+使用 `artDirection('animals')` 和 `directionTheme(direction, themeId, colorCount)`。
+
+- 在最小棋子尺寸检查耳朵、脸、白圆与箭头，不因表情抢走方向信息。
+- 检查六个方向、转弯移动、撤销后的动物种类与配色稳定。
+- 夜间主题中浅色角色与绿板面分离，方向仍靠箭头表达。
+- 原生适配需核对 circle 与 polygon 的图层顺序；现有 Cocos 示例未完成此套角色的实机验收。
@@ -0,0 +1,469 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "designId": "animals",
+  "artStyle": "animals",
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "accent": "#396D51",
+  "documentBackground": "#FFFCF1",
+  "sharedSemanticColors": {
+    "background": "#A8BECF",
+    "board": "#F2EEE5",
+    "boardGrid": "#89867D",
+    "track": "#435F78",
+    "trackHalo": "#F2EEE5",
+    "surface": "#F7F6F2",
+    "textPrimary": "#273B50",
+    "textSecondary": "#314A5F",
+    "primary": "#6652B8",
+    "onPrimary": "#FFFFFF",
+    "secondary": "#E4EAF0",
+    "utility": "#52697E",
+    "onUtility": "#FFFFFF",
+    "selection": "#DFD9F3",
+    "onSelection": "#3F327A",
+    "disabled": "#CBD4DD",
+    "onDisabled": "#526579",
+    "input": "#FFFFFF",
+    "reward": "#B9760C",
+    "warning": "#A44825",
+    "warningSurface": "#F9E3D2",
+    "scrim": "#273B507A",
+    "focus": "#3F327A",
+    "tileBlue": "#2392FD",
+    "tilePink": "#FC3E80",
+    "tileYellow": "#FDBC28",
+    "tilePurple": "#874FFD",
+    "arrowLight": "#FFFFFF",
+    "arrowDark": "#273B50"
+  },
+  "assets": {
+    "tileAtlas": null,
+    "uiIconAtlas": "assets/ui-icons-generated.png"
+  },
+  "pigments": [
+    {
+      "index": 0,
+      "name": "姜黄猫",
+      "color": "#D9934F",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 1,
+      "name": "栗棕熊",
+      "color": "#A4683B",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 2,
+      "name": "麦芽兔",
+      "color": "#E1C58B",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 3,
+      "name": "苔绿蛙",
+      "color": "#6C9D40",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 4,
+      "name": "奶橘猫",
+      "color": "#F1B869",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 5,
+      "name": "可可熊",
+      "color": "#73503F",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 6,
+      "name": "奶油兔",
+      "color": "#F1DCC1",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 7,
+      "name": "溪绿蛙",
+      "color": "#448A67",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 8,
+      "name": "榛果猫",
+      "color": "#B78157",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 9,
+      "name": "赤陶熊",
+      "color": "#BD784F",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 10,
+      "name": "雪白兔",
+      "color": "#F4E5CF",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 11,
+      "name": "嫩叶蛙",
+      "color": "#87B76B",
+      "arrow": "#172D39"
+    }
+  ],
+  "themes": [
+    {
+      "id": "lagoon",
+      "label": "轻松",
+      "name": "青草野餐",
+      "background": "#A9CD69",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFF2D2",
+        "boardGrid": "#A9AC80",
+        "track": "#527345",
+        "trackHalo": "#FFF2D2"
+      },
+      "anchorPalette": [
+        0,
+        1,
+        2,
+        3,
+        6,
+        7,
+        10
+      ],
+      "palettes": {
+        "4": [
+          0,
+          1,
+          2,
+          3
+        ],
+        "7": [
+          0,
+          1,
+          2,
+          3,
+          6,
+          7,
+          10
+        ],
+        "9": [
+          0,
+          1,
+          2,
+          3,
+          6,
+          7,
+          10,
+          4,
+          5
+        ],
+        "12": [
+          0,
+          1,
+          2,
+          3,
+          6,
+          7,
+          10,
+          4,
+          5,
+          8,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 9.183048868633442,
+        "trackOnBoard": 4.8456513485094925
+      }
+    },
+    {
+      "id": "apricot",
+      "label": "进阶",
+      "name": "橡果秋游",
+      "background": "#E7B947",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFEDB5",
+        "boardGrid": "#B6A076",
+        "track": "#79572E",
+        "trackHalo": "#FFEDB5"
+      },
+      "anchorPalette": [
+        1,
+        4,
+        8,
+        5,
+        2,
+        6,
+        11
+      ],
+      "palettes": {
+        "4": [
+          1,
+          4,
+          8,
+          5
+        ],
+        "7": [
+          1,
+          4,
+          8,
+          5,
+          2,
+          6,
+          11
+        ],
+        "9": [
+          1,
+          4,
+          8,
+          5,
+          2,
+          6,
+          11,
+          0,
+          3
+        ],
+        "12": [
+          1,
+          4,
+          8,
+          5,
+          2,
+          6,
+          11,
+          0,
+          3,
+          7,
+          9,
+          10
+        ]
+      },
+      "contrast": {
+        "sceneText": 9.028864535418991,
+        "trackOnBoard": 5.607739454320704
+      }
+    },
+    {
+      "id": "lavender",
+      "label": "烧脑",
+      "name": "溪边捉迷藏",
+      "background": "#72BEB2",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#ECF1D8",
+        "boardGrid": "#9CA987",
+        "track": "#3B7262",
+        "trackHalo": "#ECF1D8"
+      },
+      "anchorPalette": [
+        7,
+        3,
+        6,
+        10,
+        0,
+        4,
+        9
+      ],
+      "palettes": {
+        "4": [
+          7,
+          3,
+          6,
+          10
+        ],
+        "7": [
+          7,
+          3,
+          6,
+          10,
+          0,
+          4,
+          9
+        ],
+        "9": [
+          7,
+          3,
+          6,
+          10,
+          0,
+          4,
+          9,
+          1,
+          2
+        ],
+        "12": [
+          7,
+          3,
+          6,
+          10,
+          0,
+          4,
+          9,
+          1,
+          2,
+          5,
+          8,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 7.6821442549225605,
+        "trackOnBoard": 4.812692332706211
+      }
+    },
+    {
+      "id": "rose",
+      "label": "挑战",
+      "name": "红土探险",
+      "background": "#C67B47",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#F6DCB2",
+        "boardGrid": "#B19169",
+        "track": "#684835",
+        "trackHalo": "#F6DCB2"
+      },
+      "anchorPalette": [
+        8,
+        5,
+        4,
+        2,
+        7,
+        10,
+        1
+      ],
+      "palettes": {
+        "4": [
+          8,
+          5,
+          4,
+          2
+        ],
+        "7": [
+          8,
+          5,
+          4,
+          2,
+          7,
+          10,
+          1
+        ],
+        "9": [
+          8,
+          5,
+          4,
+          2,
+          7,
+          10,
+          1,
+          0,
+          3
+        ],
+        "12": [
+          8,
+          5,
+          4,
+          2,
+          7,
+          10,
+          1,
+          0,
+          3,
+          6,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 4.997261835536376,
+        "trackOnBoard": 6.154627594688633
+      }
+    },
+    {
+      "id": "midnight",
+      "label": "每周挑战",
+      "name": "萤火森林",
+      "background": "#183F36",
+      "ink": "#FFFFFF",
+      "materials": {
+        "board": "#355C43",
+        "boardGrid": "#879969",
+        "track": "#E6E9AE",
+        "trackHalo": "#355C43"
+      },
+      "anchorPalette": [
+        6,
+        10,
+        2,
+        4,
+        11,
+        0,
+        9
+      ],
+      "palettes": {
+        "4": [
+          6,
+          10,
+          2,
+          4
+        ],
+        "7": [
+          6,
+          10,
+          2,
+          4,
+          11,
+          0,
+          9
+        ],
+        "9": [
+          6,
+          10,
+          2,
+          4,
+          11,
+          0,
+          9,
+          1,
+          3
+        ],
+        "12": [
+          6,
+          10,
+          2,
+          4,
+          11,
+          0,
+          9,
+          1,
+          3,
+          5,
+          7,
+          8
+        ]
+      },
+      "contrast": {
+        "sceneText": 11.64654981527941,
+        "trackOnBoard": 6.018692953375532
+      }
+    }
+  ]
+}
@@ -1,27 +1,5 @@
-# 柔和原色
+# 01 · 柔和原色

-低饱和环境与平面六角棋子，让注意力留在轨道和方向。
+本文件为旧入口。完整、人工维护的 Agent 规范已迁移到 [calm/design.md](calm/design.md)。

-## 设计规则
-
- 哑光色块，克制装饰
- 蓝灰细轨道，保持视觉留白
- 金色奖励，柔和浮现
-
-## 五种主题
-
-| 难度 | 名称 | 环境色 |
-| --- | --- | --- |
-| 轻松 | 薄荷浅湾 | #C5E4DF |
-| 进阶 | 杏色午后 | #F1D7B8 |
-| 烧脑 | 鸢尾花园 | #D8D0EB |
-| 挑战 | 玫瑰暮色 | #E7C3CE |
-| 每周挑战 | 午夜极光 | #293956 |
-
-## 游戏道具与布局
-
- 撤销、重来、提示使用独立彩色底座，64–68px，图标 32px，标签 13px。顶部导航保持紧凑。道具使用纯色平面，不使用阴影、立体底边或渐变高光。
- 右上角预留次数或“▶ AD”角标。设计稿展示“撤销 3 次”和“广告获取提示”，仅为样式，不启用真实库存或广告逻辑。
- 棋盘在通知区与独立旋转区之间垂直居中。旋转区和道具区占据真实布局行，不覆盖棋盘。
-
-此方案使用独立的棋子造型、轨道材质和控件样式，共用现有弯曲轨道玩法。审核页支持同时保留多套方案。
+[设计稿](calm/index.html) · [配色数据](calm/tokens.json) · [Agent 接入说明](../README.md)
@@ -0,0 +1,51 @@
+# 01 · 柔和原色
+
+设计 ID：`calm` · 渲染风格：`classic` · 英文名：QUIET TRAILS。这是当前默认的基础方案，可与其他候选方案同时保留。
+
+[Agent 接入约定](../../shared.md) · [配色数据](tokens.json) · [完整设计稿](index.html) · [试玩与审核](../../../design-showcase.html?design=calm)
+
+## 设计目标
+
+低饱和环境、暖白底盘和哑光六角棋子，让注意力集中在弯曲轨道与方向。原有棋子是较鲜明的颜色；“柔和”主要指背景和整体气氛，不代表把全部棋子调成灰色。
+
+## 棋盘与棋子怎么画
+
+以格半径 s 为单位。复用 [renderer.js](../../../src/renderer.js) 的 classic 回退分支和 [tile-shape.js](../../../src/tile-shape.js)，不要用 paper 的细线比例替换。
+
+| 部件 | 当前实现 |
+| --- | --- |
+| 底格 | 正六角面，半径 s + 0.2；轻微重叠消除抗锯齿接缝 |
+| 分格线 | 半径 s，线宽 max(1, s × 0.024) |
+| 轨道外缘 | max(4, s × 0.16)，颜色为当前 trackHalo |
+| 轨道中心线 | max(2.5, s × 0.10)，边界端点内收；中间轨道保持连接 |
+| 棋子 | 半径 s × 0.985 的圆角六边形，rounding 由 roundedHex 实现 |
+| 箭头 | 实心七点形状，尺度为棋子半径 × 0.58；不新增编号 |
+
+前四个色库索引可使用 [tiles-matte-clean-v8.png](../../../assets/tiles-matte-clean-v8.png) 的原图中心采样，由 [sprites.js](../../../src/sprites.js) 提供裁切框。其余八色或图集未就绪时用纯色回退。保留共享箭头，不把方向烘焙进图集。
+
+## 五种主题
+
+| 主题 ID | 阶段 | 名称 | 氛围 |
+| --- | --- | --- | --- |
+| lagoon | 轻松 | 薄荷浅湾 | 浅湾背景，蓝青与日光黄 |
+| apricot | 进阶 | 杏色午后 | 杏底配珊瑚、鸢尾蓝 |
+| lavender | 烧脑 | 鸢尾花园 | 柔紫背景，绿与冰川青 |
+| rose | 挑战 | 玫瑰暮色 | 玫瑰背景与明亮暖色 |
+| midnight | 每周挑战 | 午夜极光 | 深靛蓝环境，棋盘仍是暖白 |
+
+完整环境色、文字色、棋盘材质与 4/7/9/12 色有序 palette 见 tokens.json。源为 [design-tokens.js](../../../src/design-tokens.js) 的 LEVEL_THEMES / PIGMENTS。五主题共享基础棋盘材质；不能因为 midnight 是夜间环境就擅自把它的棋盘变深色。箭头按该色库的 3:1 对比度门槛选白色或深蓝灰。
+
+## 控件与边界
+
+底部道具保持圆形纯色底座：撤销蓝、重来紫、提示黄，均无阴影。顶部是紧凑的蓝灰导航控件。尺寸、通知位置、居中棋盘及金色奖励按 shared.md；角标只在设计示例出现。
+
+修改此方案的基础语义色可能影响其他设计继承的面板、奖励与组件，需要检查全部五套。不要替换已接受图集，也不要把新增设计的颜料库复制到 PIGMENTS。
+
+## 验收与接入
+
+使用 `artDirection('calm')` → `directionTheme(direction, themeId, colorCount)` → `drawScene(..., {theme})`。详细代码和验证命令见 shared.md。
+
+- 对比前四色的图集版本与纯色回退，确认方向一致且形状没有脏边。
+- 检查移除、撤销、离场后颜色稳定；白／深箭头按对应色库切换。
+- 检查五主题文字与轨道识别度，尤其深背景中的暖白棋盘。
+- 现有 Cocos 示例可参考图集适配，但五套设计切换与当前动画尚未完成原生验收。
@@ -0,0 +1,453 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "designId": "calm",
+  "artStyle": "classic",
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "accent": "#6652B8",
+  "documentBackground": "#F7F6F2",
+  "sharedSemanticColors": {
+    "background": "#A8BECF",
+    "board": "#F2EEE5",
+    "boardGrid": "#89867D",
+    "track": "#435F78",
+    "trackHalo": "#F2EEE5",
+    "surface": "#F7F6F2",
+    "textPrimary": "#273B50",
+    "textSecondary": "#314A5F",
+    "primary": "#6652B8",
+    "onPrimary": "#FFFFFF",
+    "secondary": "#E4EAF0",
+    "utility": "#52697E",
+    "onUtility": "#FFFFFF",
+    "selection": "#DFD9F3",
+    "onSelection": "#3F327A",
+    "disabled": "#CBD4DD",
+    "onDisabled": "#526579",
+    "input": "#FFFFFF",
+    "reward": "#B9760C",
+    "warning": "#A44825",
+    "warningSurface": "#F9E3D2",
+    "scrim": "#273B507A",
+    "focus": "#3F327A",
+    "tileBlue": "#2392FD",
+    "tilePink": "#FC3E80",
+    "tileYellow": "#FDBC28",
+    "tilePurple": "#874FFD",
+    "arrowLight": "#FFFFFF",
+    "arrowDark": "#273B50"
+  },
+  "assets": {
+    "tileAtlas": "assets/tiles-matte-clean-v8.png",
+    "uiIconAtlas": "assets/ui-icons-generated.png"
+  },
+  "pigments": [
+    {
+      "index": 0,
+      "name": "晴空蓝",
+      "color": "#2392FD",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 1,
+      "name": "莓果粉",
+      "color": "#FC3E80",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 2,
+      "name": "日光黄",
+      "color": "#FDBC28",
+      "arrow": "#273B50"
+    },
+    {
+      "index": 3,
+      "name": "葡萄紫",
+      "color": "#874FFD",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 4,
+      "name": "湖水青",
+      "color": "#008B83",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 5,
+      "name": "珊瑚橙",
+      "color": "#EF704F",
+      "arrow": "#273B50"
+    },
+    {
+      "index": 6,
+      "name": "嫩芽绿",
+      "color": "#91C95B",
+      "arrow": "#273B50"
+    },
+    {
+      "index": 7,
+      "name": "鸢尾蓝",
+      "color": "#5267CF",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 8,
+      "name": "玫瑰红",
+      "color": "#C83F66",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 9,
+      "name": "蜜桃杏",
+      "color": "#F5AA83",
+      "arrow": "#273B50"
+    },
+    {
+      "index": 10,
+      "name": "冰川青",
+      "color": "#58C9D5",
+      "arrow": "#273B50"
+    },
+    {
+      "index": 11,
+      "name": "兰花紫",
+      "color": "#AE64C7",
+      "arrow": "#FFFFFF"
+    }
+  ],
+  "themes": [
+    {
+      "id": "lagoon",
+      "label": "轻松",
+      "name": "薄荷浅湾",
+      "background": "#C5E4DF",
+      "ink": "#273B50",
+      "materials": {
+        "board": "#F2EEE5",
+        "boardGrid": "#89867D",
+        "track": "#435F78",
+        "trackHalo": "#F2EEE5"
+      },
+      "anchorPalette": [
+        0,
+        4,
+        2
+      ],
+      "palettes": {
+        "4": [
+          0,
+          4,
+          2,
+          1
+        ],
+        "7": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6
+        ],
+        "9": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6,
+          7,
+          8
+        ],
+        "12": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6,
+          7,
+          8,
+          9,
+          10,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 8.500875345312332,
+        "trackOnBoard": 5.763617196441413
+      }
+    },
+    {
+      "id": "apricot",
+      "label": "进阶",
+      "name": "杏色午后",
+      "background": "#F1D7B8",
+      "ink": "#273B50",
+      "materials": {
+        "board": "#F2EEE5",
+        "boardGrid": "#89867D",
+        "track": "#435F78",
+        "trackHalo": "#F2EEE5"
+      },
+      "anchorPalette": [
+        5,
+        7,
+        4,
+        9
+      ],
+      "palettes": {
+        "4": [
+          5,
+          7,
+          4,
+          9
+        ],
+        "7": [
+          5,
+          7,
+          4,
+          9,
+          0,
+          1,
+          2
+        ],
+        "9": [
+          5,
+          7,
+          4,
+          9,
+          0,
+          1,
+          2,
+          3,
+          6
+        ],
+        "12": [
+          5,
+          7,
+          4,
+          9,
+          0,
+          1,
+          2,
+          3,
+          6,
+          8,
+          10,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 8.290501231652167,
+        "trackOnBoard": 5.763617196441413
+      }
+    },
+    {
+      "id": "lavender",
+      "label": "烧脑",
+      "name": "鸢尾花园",
+      "background": "#D8D0EB",
+      "ink": "#273B50",
+      "materials": {
+        "board": "#F2EEE5",
+        "boardGrid": "#89867D",
+        "track": "#435F78",
+        "trackHalo": "#F2EEE5"
+      },
+      "anchorPalette": [
+        3,
+        6,
+        8,
+        10
+      ],
+      "palettes": {
+        "4": [
+          3,
+          6,
+          8,
+          10
+        ],
+        "7": [
+          3,
+          6,
+          8,
+          10,
+          0,
+          1,
+          2
+        ],
+        "9": [
+          3,
+          6,
+          8,
+          10,
+          0,
+          1,
+          2,
+          4,
+          5
+        ],
+        "12": [
+          3,
+          6,
+          8,
+          10,
+          0,
+          1,
+          2,
+          4,
+          5,
+          7,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 7.737507893072143,
+        "trackOnBoard": 5.763617196441413
+      }
+    },
+    {
+      "id": "rose",
+      "label": "挑战",
+      "name": "玫瑰暮色",
+      "background": "#E7C3CE",
+      "ink": "#273B50",
+      "materials": {
+        "board": "#F2EEE5",
+        "boardGrid": "#89867D",
+        "track": "#435F78",
+        "trackHalo": "#F2EEE5"
+      },
+      "anchorPalette": [
+        8,
+        7,
+        2,
+        11
+      ],
+      "palettes": {
+        "4": [
+          8,
+          7,
+          2,
+          11
+        ],
+        "7": [
+          8,
+          7,
+          2,
+          11,
+          0,
+          1,
+          3
+        ],
+        "9": [
+          8,
+          7,
+          2,
+          11,
+          0,
+          1,
+          3,
+          4,
+          5
+        ],
+        "12": [
+          8,
+          7,
+          2,
+          11,
+          0,
+          1,
+          3,
+          4,
+          5,
+          6,
+          9,
+          10
+        ]
+      },
+      "contrast": {
+        "sceneText": 7.164821183322833,
+        "trackOnBoard": 5.763617196441413
+      }
+    },
+    {
+      "id": "midnight",
+      "label": "每周挑战",
+      "name": "午夜极光",
+      "background": "#293956",
+      "ink": "#F7F6F2",
+      "materials": {
+        "board": "#F2EEE5",
+        "boardGrid": "#89867D",
+        "track": "#435F78",
+        "trackHalo": "#F2EEE5"
+      },
+      "anchorPalette": [
+        10,
+        11,
+        2,
+        1
+      ],
+      "palettes": {
+        "4": [
+          10,
+          11,
+          2,
+          1
+        ],
+        "7": [
+          10,
+          11,
+          2,
+          1,
+          0,
+          3,
+          4
+        ],
+        "9": [
+          10,
+          11,
+          2,
+          1,
+          0,
+          3,
+          4,
+          5,
+          6
+        ],
+        "12": [
+          10,
+          11,
+          2,
+          1,
+          0,
+          3,
+          4,
+          5,
+          6,
+          7,
+          8,
+          9
+        ]
+      },
+      "contrast": {
+        "sceneText": 10.705759057123668,
+        "trackOnBoard": 5.763617196441413
+      }
+    }
+  ]
+}
@@ -0,0 +1 @@
+<!doctype html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="refresh" content="0;url=paper/index.html"><title>轻线纸境 · 设计稿已迁移</title></head><body><p>设计稿已整理到独立目录：<a href="paper/index.html">05 · 轻线纸境</a></p></body></html>
@@ -0,0 +1,5 @@
+# 05 · 轻线纸境
+
+本文件为旧入口。完整、人工维护的 Agent 规范已迁移到 [paper/design.md](paper/design.md)。
+
+[设计稿](paper/index.html) · [配色数据](paper/tokens.json) · [Agent 接入说明](../README.md)
@@ -0,0 +1,57 @@
+# 05 · 轻线纸境
+
+设计 ID：`paper` · 渲染风格：`paper` · 英文名：PAPER ROUTES。最新新增的候选方案，可与其他方案同时保留。
+
+[Agent 接入约定](../../shared.md) · [配色数据](tokens.json) · [完整设计稿](index.html) · [试玩与审核](../../../design-showcase.html?design=paper)
+
+## 来源与设计目标
+
+用户认可 [玩法变种实验页](../../../labs/variants/index.html) 的棋盘和棋子画法，要求整理成独立设计。提取暖白格面、浅蓝灰细轨道、陶橙／雾蓝纯色六角、细白边和线条箭头。五主题是这套画法的延展。
+
+独立设计稿里的「双色试航」只保留初始布局作视觉对照；**不绘制棋盘外围彩色标记，不绘制棋子编号**。实验页的出口颜色匹配规则及外围色标不属于本设计，也不改变主游戏玩法。
+
+## 棋盘与棋子怎么画
+
+以格半径 s 为单位，复用 [renderer.js](../../../src/renderer.js) 的 paper 分支和 [token-art.js](../../../src/token-art.js) 的 paper 分支。
+
+| 部件 | 当前实现 |
+| --- | --- |
+| 底格 | 正六角，半径 s × 0.97，保留细小格缝 |
+| 分格线 | max(0.4, s × 0.025)，使用主题 boardGrid |
+| 轨道 | 单层细线 max(0.7, s × 0.055)，不画粗 trackHalo、不做其他方案的端点内收 |
+| 棋子 | 正六角纯色面，半径 s × 0.88，不能换成原版大圆角轮廓 |
+| 白边 | #FFFFFFCC，线宽 s × 0.035 |
+| 箭杆 | 局部坐标 (-0.30s, 0) → (0.30s, 0) |
+| 箭头头部 | (0.08s, -0.17s) → (0.30s, 0) → (0.08s, 0.17s) |
+| 箭头线条 | 白色、圆头圆接，线宽 s × 0.09；两段开放折线，不是实心三角 |
+
+头部与箭杆一起按棋子方向或运动切线旋转。绘制分支内部 r = s × 0.88，再用 r / 0.88 还原单位，所以运动缩放时白边和箭头一起缩放。无棋子投影、高光、渐变；不用 PNG 冒充细线箭头。
+
+## 五种主题
+
+| 主题 ID | 阶段 | 名称 | 用色方向 |
+| --- | --- | --- | --- |
+| lagoon | 轻松 | 雾蓝信纸 | 实验页雾蓝环境、暖白格面、陶橙与雾蓝棋子 |
+| apricot | 进阶 | 暖砂手札 | 暖砂纸底、灰棕细线 |
+| lavender | 烧脑 | 鼠尾草页 | 浅灰绿纸底、蓝与苔绿棋子 |
+| rose | 挑战 | 石墨练习 | 灰白图纸、石墨蓝细线 |
+| midnight | 每周挑战 | 夜航图纸 | 深蓝灰板面、浅灰蓝轨道与暖色棋子 |
+
+完整色值和每主题 4/7/9/12 色有序 palette 见 tokens.json，源为 [art-directions.js](../../../src/art-directions.js)。轻松主题关键参考色：环境 #EAF0F3、格面 #FAFBF7、分格 #D3DFE3、轨道 #B2C4CE、陶橙 #D66C4D、雾蓝 #477FC0。全部十二色固定白色箭头，其对比度至少 3:1。
+
+浅色细轨道低于基础轨道的 3:1 目标，这是保留参考观感的已知取舍，不能为了套用原版指标而擅自加粗、加深或加轮廓。tokens 中的 contrast 是实测比值，不是合规认证。
+
+## 控件与边界
+
+顶部使用紧凑蓝灰控件，通知暖白、浅灰蓝边线，均无阴影。底部道具为圆形：撤销雾蓝、重来陶橙、提示赭金，1px 细白边，无阴影。旋转图标在浅主题为蓝灰，midnight 恢复白色；同时设置 body.dataset.design 和 body.dataset.theme。
+
+通知位置、棋盘居中、大道具、金色发光星星以及示意角标都继承 shared.md。这里的“无阴影”不取消用户要求的奖励星星光感。
+
+## 验收与接入
+
+使用 `artDirection('paper')` 和 `directionTheme(direction, themeId, colorCount)`；禁止只换背景而继续使用 classic 的棋子和轨道画法。
+
+- 对照实验页的细线与六角比例；参考布局没有外围色标与编号。
+- 检查每个主题的长弯路，移动中仍为开放线条箭头、细白边棋子。
+- 检查手机小图上的细线不断裂，以及午夜主题的旋转按钮颜色。
+- 原生适配需检查圆头线端、透明细白边与格缝；尚未完成原生实机验收。
@@ -0,0 +1,469 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "designId": "paper",
+  "artStyle": "paper",
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "accent": "#294D60",
+  "documentBackground": "#F7F9F8",
+  "sharedSemanticColors": {
+    "background": "#A8BECF",
+    "board": "#F2EEE5",
+    "boardGrid": "#89867D",
+    "track": "#435F78",
+    "trackHalo": "#F2EEE5",
+    "surface": "#F7F6F2",
+    "textPrimary": "#273B50",
+    "textSecondary": "#314A5F",
+    "primary": "#6652B8",
+    "onPrimary": "#FFFFFF",
+    "secondary": "#E4EAF0",
+    "utility": "#52697E",
+    "onUtility": "#FFFFFF",
+    "selection": "#DFD9F3",
+    "onSelection": "#3F327A",
+    "disabled": "#CBD4DD",
+    "onDisabled": "#526579",
+    "input": "#FFFFFF",
+    "reward": "#B9760C",
+    "warning": "#A44825",
+    "warningSurface": "#F9E3D2",
+    "scrim": "#273B507A",
+    "focus": "#3F327A",
+    "tileBlue": "#2392FD",
+    "tilePink": "#FC3E80",
+    "tileYellow": "#FDBC28",
+    "tilePurple": "#874FFD",
+    "arrowLight": "#FFFFFF",
+    "arrowDark": "#273B50"
+  },
+  "assets": {
+    "tileAtlas": null,
+    "uiIconAtlas": "assets/ui-icons-generated.png"
+  },
+  "pigments": [
+    {
+      "index": 0,
+      "name": "陶橙",
+      "color": "#D66C4D",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 1,
+      "name": "雾蓝",
+      "color": "#477FC0",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 2,
+      "name": "鼠尾草",
+      "color": "#668877",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 3,
+      "name": "赭金",
+      "color": "#B58943",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 4,
+      "name": "雾紫",
+      "color": "#8B7297",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 5,
+      "name": "湖青",
+      "color": "#45868C",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 6,
+      "name": "陶红",
+      "color": "#B76260",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 7,
+      "name": "钢蓝",
+      "color": "#607B90",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 8,
+      "name": "暖木",
+      "color": "#B28168",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 9,
+      "name": "松绿",
+      "color": "#46765F",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 10,
+      "name": "烟蓝",
+      "color": "#6B8AAB",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 11,
+      "name": "藕灰",
+      "color": "#9C7284",
+      "arrow": "#FFFFFF"
+    }
+  ],
+  "themes": [
+    {
+      "id": "lagoon",
+      "label": "轻松",
+      "name": "雾蓝信纸",
+      "background": "#EAF0F3",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FAFBF7",
+        "boardGrid": "#D3DFE3",
+        "track": "#B2C4CE",
+        "trackHalo": "#FAFBF7"
+      },
+      "anchorPalette": [
+        0,
+        1,
+        2,
+        3,
+        4,
+        5,
+        7
+      ],
+      "palettes": {
+        "4": [
+          0,
+          1,
+          2,
+          3
+        ],
+        "7": [
+          0,
+          1,
+          2,
+          3,
+          4,
+          5,
+          7
+        ],
+        "9": [
+          0,
+          1,
+          2,
+          3,
+          4,
+          5,
+          7,
+          6,
+          8
+        ],
+        "12": [
+          0,
+          1,
+          2,
+          3,
+          4,
+          5,
+          7,
+          6,
+          8,
+          9,
+          10,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 14.423559313677755,
+        "trackOnBoard": 1.7299985145787213
+      }
+    },
+    {
+      "id": "apricot",
+      "label": "进阶",
+      "name": "暖砂手札",
+      "background": "#F3EEE5",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFFCF5",
+        "boardGrid": "#E3DCD0",
+        "track": "#C4B8A4",
+        "trackHalo": "#FFFCF5"
+      },
+      "anchorPalette": [
+        0,
+        1,
+        3,
+        6,
+        8,
+        9,
+        4
+      ],
+      "palettes": {
+        "4": [
+          0,
+          1,
+          3,
+          6
+        ],
+        "7": [
+          0,
+          1,
+          3,
+          6,
+          8,
+          9,
+          4
+        ],
+        "9": [
+          0,
+          1,
+          3,
+          6,
+          8,
+          9,
+          4,
+          2,
+          5
+        ],
+        "12": [
+          0,
+          1,
+          3,
+          6,
+          8,
+          9,
+          4,
+          2,
+          5,
+          7,
+          10,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 14.35675892235889,
+        "trackOnBoard": 1.90836044264981
+      }
+    },
+    {
+      "id": "lavender",
+      "label": "烧脑",
+      "name": "鼠尾草页",
+      "background": "#E8EFEB",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FAFCF8",
+        "boardGrid": "#D3DFD7",
+        "track": "#ADBCB2",
+        "trackHalo": "#FAFCF8"
+      },
+      "anchorPalette": [
+        1,
+        2,
+        3,
+        5,
+        9,
+        10,
+        0
+      ],
+      "palettes": {
+        "4": [
+          1,
+          2,
+          3,
+          5
+        ],
+        "7": [
+          1,
+          2,
+          3,
+          5,
+          9,
+          10,
+          0
+        ],
+        "9": [
+          1,
+          2,
+          3,
+          5,
+          9,
+          10,
+          0,
+          4,
+          6
+        ],
+        "12": [
+          1,
+          2,
+          3,
+          5,
+          9,
+          10,
+          0,
+          4,
+          6,
+          7,
+          8,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 14.202869576847103,
+        "trackOnBoard": 1.916933130789821
+      }
+    },
+    {
+      "id": "rose",
+      "label": "挑战",
+      "name": "石墨练习",
+      "background": "#E7EBEE",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#F8FAFB",
+        "boardGrid": "#D1DBE1",
+        "track": "#A5B6C1",
+        "trackHalo": "#F8FAFB"
+      },
+      "anchorPalette": [
+        0,
+        1,
+        4,
+        6,
+        7,
+        10,
+        11
+      ],
+      "palettes": {
+        "4": [
+          0,
+          1,
+          4,
+          6
+        ],
+        "7": [
+          0,
+          1,
+          4,
+          6,
+          7,
+          10,
+          11
+        ],
+        "9": [
+          0,
+          1,
+          4,
+          6,
+          7,
+          10,
+          11,
+          2,
+          3
+        ],
+        "12": [
+          0,
+          1,
+          4,
+          6,
+          7,
+          10,
+          11,
+          2,
+          3,
+          5,
+          8,
+          9
+        ]
+      },
+      "contrast": {
+        "sceneText": 13.838133934955545,
+        "trackOnBoard": 1.9936733854132391
+      }
+    },
+    {
+      "id": "midnight",
+      "label": "每周挑战",
+      "name": "夜航图纸",
+      "background": "#253B4A",
+      "ink": "#FFFFFF",
+      "materials": {
+        "board": "#304A59",
+        "boardGrid": "#435E6C",
+        "track": "#849FAE",
+        "trackHalo": "#304A59"
+      },
+      "anchorPalette": [
+        0,
+        2,
+        3,
+        4,
+        5,
+        8,
+        10
+      ],
+      "palettes": {
+        "4": [
+          0,
+          2,
+          3,
+          4
+        ],
+        "7": [
+          0,
+          2,
+          3,
+          4,
+          5,
+          8,
+          10
+        ],
+        "9": [
+          0,
+          2,
+          3,
+          4,
+          5,
+          8,
+          10,
+          1,
+          6
+        ],
+        "12": [
+          0,
+          2,
+          3,
+          4,
+          5,
+          8,
+          10,
+          1,
+          6,
+          7,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 11.646406631180858,
+        "trackOnBoard": 3.357082701757936
+      }
+    }
+  ]
+}
@@ -1,27 +1,5 @@
-# 积木轨道屋
+# 03 · 积木轨道屋

-圆润积木、原色塑胶与压下去有回弹的按钮。棋子像可以拿在手里的小零件。
+本文件为旧入口。完整、人工维护的 Agent 规范已迁移到 [toy/design.md](toy/design.md)。

-## 设计规则
-
- 同色深浅叠层，形成柔软厚度
- 红黄蓝绿积木配木色底板
- 圆角控件、凸起边缘与轻微高光
-
-## 五种主题
-
-| 难度 | 名称 | 环境色 |
-| --- | --- | --- |
-| 轻松 | 积木黄盒 | #F4C548 |
-| 进阶 | 蓝色装配台 | #56AFE0 |
-| 烧脑 | 橘红工坊 | #EA743E |
-| 挑战 | 绿毯小城 | #439A73 |
-| 每周挑战 | 太空玩具柜 | #244584 |
-
-## 游戏道具与布局
-
- 撤销、重来、提示使用独立彩色底座，64–68px，图标 32px，标签 13px。顶部导航保持紧凑。道具使用纯色平面，不使用阴影、立体底边或渐变高光。
- 右上角预留次数或“▶ AD”角标。设计稿展示“撤销 3 次”和“广告获取提示”，仅为样式，不启用真实库存或广告逻辑。
- 棋盘在通知区与独立旋转区之间垂直居中。旋转区和道具区占据真实布局行，不覆盖棋盘。
-
-此方案使用独立的棋子造型、轨道材质和控件样式，共用现有弯曲轨道玩法。审核页支持同时保留多套方案。
+[设计稿](toy/index.html) · [配色数据](toy/tokens.json) · [Agent 接入说明](../README.md)
@@ -0,0 +1,50 @@
+# 03 · 积木轨道屋
+
+设计 ID：`toy` · 渲染风格：`toy` · 英文名：LITTLE PLAYWORKS。玩具质感候选方案，可与其他方案同时保留。
+
+[Agent 接入约定](../../shared.md) · [配色数据](tokens.json) · [完整设计稿](index.html) · [试玩与审核](../../../design-showcase.html?design=toy)
+
+## 设计目标
+
+圆润积木、红黄蓝绿塑胶零件与原木色轨道板。厚度来自少量同色分层，棋子看起来可以拿在手里；不把整套方案做成灰雾或原版柔紫色系。
+
+## 棋盘与棋子怎么画
+
+复用 [renderer.js](../../../src/renderer.js) 的非 paper 棋盘、[token-art.js](../../../src/token-art.js) 的 toy 分支。r = 格半径 s × 0.985；tint 在 RGB 通道上按比例向白或黑混合。
+
+| 部件 | 当前实现 |
+| --- | --- |
+| 轨道 | 分格 max(1, s × 0.024)，外缘 max(4, s × 0.16)，中心线 max(2.5, s × 0.10) |
+| 下层厚度 | 半径 r × 0.94，向下偏移 r × 0.09，fill 暗化 30% |
+| 中间层 | 半径 r × 0.94，fill 暗化 8% |
+| 顶面 | 半径 r × 0.83，向上偏移 r × 0.06，原始 fill |
+| 边缘高光 | 半径 r × 0.75 的局部边线，fill 提亮 50%，线宽 r × 0.045 |
+| 中央压面 | 半径 r × 0.50 的圆，向上偏移 r × 0.04，fill 提亮 11% |
+| 箭头 | 实心七点箭头，尺度 r × 0.58，保持清楚独立的方向 |
+
+这套不依赖棋子图集，也不是物理材质或三维光照；所有效果由共享多边形、线与圆组成。移动和碰撞仍复用同一分层画法。
+
+## 五种主题
+
+| 主题 ID | 阶段 | 名称 | 独立用色方向 |
+| --- | --- | --- | --- |
+| lagoon | 轻松 | 积木黄盒 | 暖黄玩具盒、奶油板面、原色积木 |
+| apricot | 进阶 | 蓝色装配台 | 亮蓝台面与原木色插板 |
+| lavender | 烧脑 | 橘红工坊 | 橘红环境、木糖底板、绿蓝零件 |
+| rose | 挑战 | 绿毯小城 | 绿垫与木色道路 |
+| midnight | 每周挑战 | 太空玩具柜 | 太空蓝柜体、浅灰塑胶板 |
+
+完整色值及每主题 4/7/9/12 色搭配见 tokens.json，源为 [art-directions.js](../../../src/art-directions.js)。配色要保留原色塑胶与暖木关系。箭头按 4.5:1 门槛选白或 #172D39，不能给所有黄色积木统一加白箭头。
+
+## 控件与边界
+
+现有顶部控件保留玩具边缘和圆润感。底部道具单独使用 24px 圆角、蓝／红／黄底色与奶油色 3px 边框；**没有**棋子的厚度、投影或高光。不要因名称里有“玩具”就重新给底部道具加阴影。尺寸、位置和未来角标按 shared.md。
+
+## 验收与接入
+
+使用 `artDirection('toy')` 和 `directionTheme(direction, themeId, colorCount)`，不要用 CSS 滤镜把 calm 染成玩具配色。
+
+- 缩小到手机尺寸后，分层仍清楚且不遮住箭头。
+- 蓝色和太空主题保持木色／浅灰板面，不能五套都用同一个奶油背景。
+- 静态、运动与撤销造型一致；底部道具保持平面。
+- 原生几何可复用绘制命令，原生控件和实机效果尚未验收。
@@ -0,0 +1,469 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "designId": "toy",
+  "artStyle": "toy",
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "accent": "#245EAF",
+  "documentBackground": "#FFFAEE",
+  "sharedSemanticColors": {
+    "background": "#A8BECF",
+    "board": "#F2EEE5",
+    "boardGrid": "#89867D",
+    "track": "#435F78",
+    "trackHalo": "#F2EEE5",
+    "surface": "#F7F6F2",
+    "textPrimary": "#273B50",
+    "textSecondary": "#314A5F",
+    "primary": "#6652B8",
+    "onPrimary": "#FFFFFF",
+    "secondary": "#E4EAF0",
+    "utility": "#52697E",
+    "onUtility": "#FFFFFF",
+    "selection": "#DFD9F3",
+    "onSelection": "#3F327A",
+    "disabled": "#CBD4DD",
+    "onDisabled": "#526579",
+    "input": "#FFFFFF",
+    "reward": "#B9760C",
+    "warning": "#A44825",
+    "warningSurface": "#F9E3D2",
+    "scrim": "#273B507A",
+    "focus": "#3F327A",
+    "tileBlue": "#2392FD",
+    "tilePink": "#FC3E80",
+    "tileYellow": "#FDBC28",
+    "tilePurple": "#874FFD",
+    "arrowLight": "#FFFFFF",
+    "arrowDark": "#273B50"
+  },
+  "assets": {
+    "tileAtlas": null,
+    "uiIconAtlas": "assets/ui-icons-generated.png"
+  },
+  "pigments": [
+    {
+      "index": 0,
+      "name": "积木红",
+      "color": "#DF4033",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 1,
+      "name": "积木黄",
+      "color": "#F2C52E",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 2,
+      "name": "积木蓝",
+      "color": "#2478C5",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 3,
+      "name": "积木绿",
+      "color": "#32945C",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 4,
+      "name": "零件橙",
+      "color": "#EF862D",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 5,
+      "name": "拼装紫",
+      "color": "#7652B2",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 6,
+      "name": "奶油白",
+      "color": "#EFE4C4",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 7,
+      "name": "工具青",
+      "color": "#227B87",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 8,
+      "name": "砖红",
+      "color": "#B63845",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 9,
+      "name": "木棕",
+      "color": "#745B40",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 10,
+      "name": "玻璃蓝",
+      "color": "#73BFDC",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 11,
+      "name": "草绿",
+      "color": "#A7BA56",
+      "arrow": "#172D39"
+    }
+  ],
+  "themes": [
+    {
+      "id": "lagoon",
+      "label": "轻松",
+      "name": "积木黄盒",
+      "background": "#F4C548",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFF7DE",
+        "boardGrid": "#B5A184",
+        "track": "#765238",
+        "trackHalo": "#FFF7DE"
+      },
+      "anchorPalette": [
+        0,
+        2,
+        3,
+        5,
+        4,
+        8,
+        10
+      ],
+      "palettes": {
+        "4": [
+          0,
+          2,
+          3,
+          5
+        ],
+        "7": [
+          0,
+          2,
+          3,
+          5,
+          4,
+          8,
+          10
+        ],
+        "9": [
+          0,
+          2,
+          3,
+          5,
+          4,
+          8,
+          10,
+          1,
+          6
+        ],
+        "12": [
+          0,
+          2,
+          3,
+          5,
+          4,
+          8,
+          10,
+          1,
+          6,
+          7,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 10.212613961554808,
+        "trackOnBoard": 6.463066023255321
+      }
+    },
+    {
+      "id": "apricot",
+      "label": "进阶",
+      "name": "蓝色装配台",
+      "background": "#56AFE0",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#F5DFB6",
+        "boardGrid": "#B09C7C",
+        "track": "#386A8D",
+        "trackHalo": "#F5DFB6"
+      },
+      "anchorPalette": [
+        1,
+        0,
+        4,
+        3,
+        9,
+        6,
+        11
+      ],
+      "palettes": {
+        "4": [
+          1,
+          0,
+          4,
+          3
+        ],
+        "7": [
+          1,
+          0,
+          4,
+          3,
+          9,
+          6,
+          11
+        ],
+        "9": [
+          1,
+          0,
+          4,
+          3,
+          9,
+          6,
+          11,
+          2,
+          5
+        ],
+        "12": [
+          1,
+          0,
+          4,
+          3,
+          9,
+          6,
+          11,
+          2,
+          5,
+          7,
+          8,
+          10
+        ]
+      },
+      "contrast": {
+        "sceneText": 6.797539779539623,
+        "trackOnBoard": 4.458036518249096
+      }
+    },
+    {
+      "id": "lavender",
+      "label": "烧脑",
+      "name": "橘红工坊",
+      "background": "#EA743E",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFEFCB",
+        "boardGrid": "#BBA27B",
+        "track": "#695037",
+        "trackHalo": "#FFEFCB"
+      },
+      "anchorPalette": [
+        2,
+        3,
+        1,
+        7,
+        10,
+        5,
+        8
+      ],
+      "palettes": {
+        "4": [
+          2,
+          3,
+          1,
+          7
+        ],
+        "7": [
+          2,
+          3,
+          1,
+          7,
+          10,
+          5,
+          8
+        ],
+        "9": [
+          2,
+          3,
+          1,
+          7,
+          10,
+          5,
+          8,
+          0,
+          4
+        ],
+        "12": [
+          2,
+          3,
+          1,
+          7,
+          10,
+          5,
+          8,
+          0,
+          4,
+          6,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 5.582585700054348,
+        "trackOnBoard": 6.585478734470914
+      }
+    },
+    {
+      "id": "rose",
+      "label": "挑战",
+      "name": "绿毯小城",
+      "background": "#439A73",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#F2D6A6",
+        "boardGrid": "#AC987A",
+        "track": "#476556",
+        "trackHalo": "#F2D6A6"
+      },
+      "anchorPalette": [
+        0,
+        1,
+        2,
+        4,
+        6,
+        9,
+        11
+      ],
+      "palettes": {
+        "4": [
+          0,
+          1,
+          2,
+          4
+        ],
+        "7": [
+          0,
+          1,
+          2,
+          4,
+          6,
+          9,
+          11
+        ],
+        "9": [
+          0,
+          1,
+          2,
+          4,
+          6,
+          9,
+          11,
+          3,
+          5
+        ],
+        "12": [
+          0,
+          1,
+          2,
+          4,
+          6,
+          9,
+          11,
+          3,
+          5,
+          7,
+          8,
+          10
+        ]
+      },
+      "contrast": {
+        "sceneText": 4.82593081470767,
+        "trackOnBoard": 4.578974741098264
+      }
+    },
+    {
+      "id": "midnight",
+      "label": "每周挑战",
+      "name": "太空玩具柜",
+      "background": "#244584",
+      "ink": "#FFFFFF",
+      "materials": {
+        "board": "#D4E4E6",
+        "boardGrid": "#8DA4B2",
+        "track": "#35516F",
+        "trackHalo": "#D4E4E6"
+      },
+      "anchorPalette": [
+        1,
+        4,
+        0,
+        6,
+        10,
+        3,
+        8
+      ],
+      "palettes": {
+        "4": [
+          1,
+          4,
+          0,
+          6
+        ],
+        "7": [
+          1,
+          4,
+          0,
+          6,
+          10,
+          3,
+          8
+        ],
+        "9": [
+          1,
+          4,
+          0,
+          6,
+          10,
+          3,
+          8,
+          2,
+          5
+        ],
+        "12": [
+          1,
+          4,
+          0,
+          6,
+          10,
+          3,
+          8,
+          2,
+          5,
+          7,
+          9,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 9.29429328953417,
+        "trackOnBoard": 6.2705655843638315
+      }
+    }
+  ]
+}
@@ -1,27 +1,5 @@
-# 高彩游乐场
+# 02 · 高彩游乐场

-鲜明撞色、粗线条与贴纸式棋子。像一张能玩的彩色海报，明快、有力量。
+本文件为旧入口。完整、人工维护的 Agent 规范已迁移到 [vivid/design.md](vivid/design.md)。

-## 设计规则
-
- 高纯度主色，深色轮廓统一画面
- 轨道像印刷线，棋子像立起的贴纸
- 方圆按钮与错位硬阴影
-
-## 五种主题
-
-| 难度 | 名称 | 环境色 |
-| --- | --- | --- |
-| 轻松 | 青柠派对 | #B8F34A |
-| 进阶 | 爆橙热浪 | #FF771B |
-| 烧脑 | 钴蓝电场 | #3E42EE |
-| 挑战 | 荧粉冲刺 | #FF3588 |
-| 每周挑战 | 黑光嘉年华 | #1B104D |
-
-## 游戏道具与布局
-
- 撤销、重来、提示使用独立彩色底座，64–68px，图标 32px，标签 13px。顶部导航保持紧凑。道具使用纯色平面，不使用阴影、立体底边或渐变高光。
- 右上角预留次数或“▶ AD”角标。设计稿展示“撤销 3 次”和“广告获取提示”，仅为样式，不启用真实库存或广告逻辑。
- 棋盘在通知区与独立旋转区之间垂直居中。旋转区和道具区占据真实布局行，不覆盖棋盘。
-
-此方案使用独立的棋子造型、轨道材质和控件样式，共用现有弯曲轨道玩法。审核页支持同时保留多套方案。
+[设计稿](vivid/index.html) · [配色数据](vivid/tokens.json) · [Agent 接入说明](../README.md)
@@ -0,0 +1,49 @@
+# 02 · 高彩游乐场
+
+设计 ID：`vivid` · 渲染风格：`vivid` · 英文名：CHROMA CLUB。高饱和候选方案，可与其他方案同时保留。
+
+[Agent 接入约定](../../shared.md) · [配色数据](tokens.json) · [完整设计稿](index.html) · [试玩与审核](../../../design-showcase.html?design=vivid)
+
+## 设计目标
+
+鲜明撞色、深色轮廓与贴纸棋子，像可操作的彩色海报。用户明确要求五个主题都有高饱和感，不能只有轻松主题鲜艳，其余退回原版蓝紫粉背景。
+
+## 棋盘与棋子怎么画
+
+复用 [renderer.js](../../../src/renderer.js) 的非 paper 棋盘和 [token-art.js](../../../src/token-art.js) 的 vivid 分支。以格半径 s、棋子基准半径 r = s × 0.985 为单位。
+
+| 部件 | 当前实现 |
+| --- | --- |
+| 分格／轨道 | 分格 max(1, s × 0.024)，轨道外缘 max(4, s × 0.16)，中心线 max(2.5, s × 0.10) |
+| 棋子正面 | 半径 r × 0.94 的圆角六边形，独立颜料色纯色填充 |
+| 硬边底层 | 同形向右 r × 0.04、向下 r × 0.07 偏移，颜色 #30264C |
+| 深色描边 | #30264C，线宽 r × 0.065 |
+| 白色短划 | 左上方短线，线宽 r × 0.055；用于贴纸感 |
+| 箭头 | 实心七点箭头，尺度 r × 0.58，颜色取本套 pigments.arrow |
+
+棋子全部由多边形和线绘制，不使用 calm 的棋子 PNG。轨道几何与主玩法一致，颜色取该主题展开后的 materials，不能把装饰短线当作新路径。
+
+## 五种主题
+
+| 主题 ID | 阶段 | 名称 | 独立用色方向 |
+| --- | --- | --- | --- |
+| lagoon | 轻松 | 青柠派对 | 青柠大背景与奶油棋盘 |
+| apricot | 进阶 | 爆橙热浪 | 亮橙环境、明黄棋盘与冷色棋子 |
+| lavender | 烧脑 | 钴蓝电场 | 纯钴蓝环境、荧光青柠棋盘 |
+| rose | 挑战 | 荧粉冲刺 | 荧光粉舞台与明黄、蓝绿 |
+| midnight | 每周挑战 | 黑光嘉年华 | 深紫黑底、荧光绿轨道 |
+
+完整色值和每个主题的 4/7/9/12 色有序 palette 见 tokens.json；源为 [art-directions.js](../../../src/art-directions.js)。12 色独立于原版。主题背景保留较高 HSL 饱和度；当前测试要求至少 0.65。箭头按 4.5:1 门槛在白与 #172D39 中选取。
+
+## 控件与边界
+
+顶部控件与通知沿用深轮廓和贴纸风格。底部道具服从共用的扁平要求：撤销电青、重来亮粉、提示明黄，3px 深色边线，不加棋子的偏移硬阴影。顶部风格不能覆盖 game-tools.css 的最后加载规则。
+
+## 验收与接入
+
+使用 `artDirection('vivid')` 和 `directionTheme(direction, themeId, colorCount)`；完整流程见 shared.md。
+
+- 五主题都应与原版明显不同，保持高纯度用色，棋子与底盘容易分离。
+- 黑光主题检查浅色轨道和深色板面，其他主题检查深线与亮板面的关系。
+- 静态、移动、碰撞时都使用同一贴纸轮廓和箭头。
+- 底部道具无阴影；原生端尚未接入并实机验收此套风格。
@@ -0,0 +1,469 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "designId": "vivid",
+  "artStyle": "vivid",
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "accent": "#4A24E8",
+  "documentBackground": "#FFFCF0",
+  "sharedSemanticColors": {
+    "background": "#A8BECF",
+    "board": "#F2EEE5",
+    "boardGrid": "#89867D",
+    "track": "#435F78",
+    "trackHalo": "#F2EEE5",
+    "surface": "#F7F6F2",
+    "textPrimary": "#273B50",
+    "textSecondary": "#314A5F",
+    "primary": "#6652B8",
+    "onPrimary": "#FFFFFF",
+    "secondary": "#E4EAF0",
+    "utility": "#52697E",
+    "onUtility": "#FFFFFF",
+    "selection": "#DFD9F3",
+    "onSelection": "#3F327A",
+    "disabled": "#CBD4DD",
+    "onDisabled": "#526579",
+    "input": "#FFFFFF",
+    "reward": "#B9760C",
+    "warning": "#A44825",
+    "warningSurface": "#F9E3D2",
+    "scrim": "#273B507A",
+    "focus": "#3F327A",
+    "tileBlue": "#2392FD",
+    "tilePink": "#FC3E80",
+    "tileYellow": "#FDBC28",
+    "tilePurple": "#874FFD",
+    "arrowLight": "#FFFFFF",
+    "arrowDark": "#273B50"
+  },
+  "assets": {
+    "tileAtlas": null,
+    "uiIconAtlas": "assets/ui-icons-generated.png"
+  },
+  "pigments": [
+    {
+      "index": 0,
+      "name": "电蓝",
+      "color": "#2455E8",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 1,
+      "name": "热粉",
+      "color": "#E52879",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 2,
+      "name": "柠檬黄",
+      "color": "#FFE13E",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 3,
+      "name": "电紫",
+      "color": "#7136D8",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 4,
+      "name": "深青",
+      "color": "#007C70",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 5,
+      "name": "火橙",
+      "color": "#FF622C",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 6,
+      "name": "荧光绿",
+      "color": "#BBE929",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 7,
+      "name": "钴蓝",
+      "color": "#074DFF",
+      "arrow": "#FFFFFF"
+    },
+    {
+      "index": 8,
+      "name": "警示红",
+      "color": "#EB174E",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 9,
+      "name": "亮橘",
+      "color": "#FF9500",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 10,
+      "name": "电光青",
+      "color": "#08E8E1",
+      "arrow": "#172D39"
+    },
+    {
+      "index": 11,
+      "name": "激光紫",
+      "color": "#A92BFF",
+      "arrow": "#FFFFFF"
+    }
+  ],
+  "themes": [
+    {
+      "id": "lagoon",
+      "label": "轻松",
+      "name": "青柠派对",
+      "background": "#B8F34A",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFFBE7",
+        "boardGrid": "#AB9C82",
+        "track": "#30264C",
+        "trackHalo": "#FFFBE7"
+      },
+      "anchorPalette": [
+        0,
+        4,
+        2,
+        1,
+        3,
+        5,
+        6
+      ],
+      "palettes": {
+        "4": [
+          0,
+          4,
+          2,
+          1
+        ],
+        "7": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6
+        ],
+        "9": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6,
+          7,
+          8
+        ],
+        "12": [
+          0,
+          4,
+          2,
+          1,
+          3,
+          5,
+          6,
+          7,
+          8,
+          9,
+          10,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 12.60682592893418,
+        "trackOnBoard": 13.40477966198369
+      }
+    },
+    {
+      "id": "apricot",
+      "label": "进阶",
+      "name": "爆橙热浪",
+      "background": "#FF771B",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFEF45",
+        "boardGrid": "#B78335",
+        "track": "#462654",
+        "trackHalo": "#FFEF45"
+      },
+      "anchorPalette": [
+        7,
+        3,
+        10,
+        8,
+        2,
+        0,
+        11
+      ],
+      "palettes": {
+        "4": [
+          7,
+          3,
+          10,
+          8
+        ],
+        "7": [
+          7,
+          3,
+          10,
+          8,
+          2,
+          0,
+          11
+        ],
+        "9": [
+          7,
+          3,
+          10,
+          8,
+          2,
+          0,
+          11,
+          1,
+          4
+        ],
+        "12": [
+          7,
+          3,
+          10,
+          8,
+          2,
+          0,
+          11,
+          1,
+          4,
+          5,
+          6,
+          9
+        ]
+      },
+      "contrast": {
+        "sceneText": 6.246500288112486,
+        "trackOnBoard": 10.616992375930863
+      }
+    },
+    {
+      "id": "lavender",
+      "label": "烧脑",
+      "name": "钴蓝电场",
+      "background": "#3E42EE",
+      "ink": "#FFFFFF",
+      "materials": {
+        "board": "#C9F849",
+        "boardGrid": "#789344",
+        "track": "#252269",
+        "trackHalo": "#C9F849"
+      },
+      "anchorPalette": [
+        2,
+        9,
+        1,
+        10,
+        6,
+        5,
+        8
+      ],
+      "palettes": {
+        "4": [
+          2,
+          9,
+          1,
+          10
+        ],
+        "7": [
+          2,
+          9,
+          1,
+          10,
+          6,
+          5,
+          8
+        ],
+        "9": [
+          2,
+          9,
+          1,
+          10,
+          6,
+          5,
+          8,
+          0,
+          3
+        ],
+        "12": [
+          2,
+          9,
+          1,
+          10,
+          6,
+          5,
+          8,
+          0,
+          3,
+          4,
+          7,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 6.524329011511401,
+        "trackOnBoard": 11.251830170037788
+      }
+    },
+    {
+      "id": "rose",
+      "label": "挑战",
+      "name": "荧粉冲刺",
+      "background": "#FF3588",
+      "ink": "#12202A",
+      "materials": {
+        "board": "#FFF4CE",
+        "boardGrid": "#C491A1",
+        "track": "#502369",
+        "trackHalo": "#FFF4CE"
+      },
+      "anchorPalette": [
+        0,
+        6,
+        10,
+        2,
+        7,
+        4,
+        9
+      ],
+      "palettes": {
+        "4": [
+          0,
+          6,
+          10,
+          2
+        ],
+        "7": [
+          0,
+          6,
+          10,
+          2,
+          7,
+          4,
+          9
+        ],
+        "9": [
+          0,
+          6,
+          10,
+          2,
+          7,
+          4,
+          9,
+          1,
+          3
+        ],
+        "12": [
+          0,
+          6,
+          10,
+          2,
+          7,
+          4,
+          9,
+          1,
+          3,
+          5,
+          8,
+          11
+        ]
+      },
+      "contrast": {
+        "sceneText": 4.83248512643413,
+        "trackOnBoard": 10.688104062178175
+      }
+    },
+    {
+      "id": "midnight",
+      "label": "每周挑战",
+      "name": "黑光嘉年华",
+      "background": "#1B104D",
+      "ink": "#FFFFFF",
+      "materials": {
+        "board": "#35225D",
+        "boardGrid": "#837B9F",
+        "track": "#D9FF55",
+        "trackHalo": "#35225D"
+      },
+      "anchorPalette": [
+        10,
+        2,
+        6,
+        1,
+        9,
+        11,
+        5
+      ],
+      "palettes": {
+        "4": [
+          10,
+          2,
+          6,
+          1
+        ],
+        "7": [
+          10,
+          2,
+          6,
+          1,
+          9,
+          11,
+          5
+        ],
+        "9": [
+          10,
+          2,
+          6,
+          1,
+          9,
+          11,
+          5,
+          0,
+          3
+        ],
+        "12": [
+          10,
+          2,
+          6,
+          1,
+          9,
+          11,
+          5,
+          0,
+          3,
+          4,
+          7,
+          8
+        ]
+      },
+      "contrast": {
+        "sceneText": 17.102604907549345,
+        "trackOnBoard": 11.952226494271752
+      }
+    }
+  ]
+}
@@ -0,0 +1,30 @@
+// Run from the repository root: node design/examples/render-design.mjs paper lagoon 7
+// This engine-independent example records geometry; it does not validate PNG pixels or UI.
+import { pathToFileURL } from 'node:url';
+import { ART_DIRECTIONS, directionTheme } from '../../src/art-directions.js';
+import { drawScene } from '../../src/renderer.js';
+import { layout } from '../../src/geometry.js';
+import { createStudyLevel } from '../../src/study-levels.js';
+
+const level = createStudyLevel(3);
+
+export function recordDesign(designId = 'paper', themeId = 'lagoon', colorCount = 7) {
+  const direction = ART_DIRECTIONS.find(d => d.id === designId);
+  if (!direction) throw new Error(`Unknown design: ${designId}`);
+  if (!direction.themes.some(t => t.id === themeId)) throw new Error(`Unknown theme: ${themeId}`);
+  if (![4, 7, 9, 12].includes(colorCount)) throw new Error(`Unsupported color count: ${colorCount}`);
+  const theme = directionTheme(direction, themeId, colorCount), commands = [];
+  const painter = {
+    polygon: (points, fill) => commands.push({ type: 'polygon', points, fill }),
+    line: (points, color, width) => commands.push({ type: 'line', points, color, width }),
+    circle: (x, y, radius, fill) => commands.push({ type: 'circle', x, y, radius, fill }),
+  };
+  drawScene(painter, level, level.tiles, layout(level.cells, 600, 600), { theme });
+  return { designId, themeId, colorCount, background: theme.background, palette: theme.palette, cellCount: level.cells.length, commands };
+}
+
+if (process.argv[1] && import.meta.url === pathToFileURL(process.argv[1]).href) {
+  const [designId = 'paper', themeId = 'lagoon', count = '7'] = process.argv.slice(2);
+  const { commands, ...summary } = recordDesign(designId, themeId, Number(count));
+  console.log(JSON.stringify({ ...summary, commandCount: commands.length }, null, 2));
+}
@@ -0,0 +1,97 @@
+{
+  "schemaVersion": 1,
+  "generated": true,
+  "generatedBy": "scripts/build-art-directions.mjs",
+  "pathBase": "repository-root",
+  "entry": "design/README.md",
+  "agentGuide": "design/AGENTS.md",
+  "sharedRules": "design/shared.md",
+  "catalog": "design/index.html",
+  "example": "design/examples/render-design.mjs",
+  "defaultDesignId": "calm",
+  "latestDesignId": "paper",
+  "selectionPolicy": "multiple-candidates",
+  "themeIds": [
+    "lagoon",
+    "apricot",
+    "lavender",
+    "rose",
+    "midnight"
+  ],
+  "paletteCounts": [
+    4,
+    7,
+    9,
+    12
+  ],
+  "sources": {
+    "directions": "src/art-directions.js",
+    "baseTokens": "src/design-tokens.js",
+    "renderer": "src/renderer.js",
+    "tokenDrawing": "src/token-art.js",
+    "componentStyles": "design/art-directions.css",
+    "itemStyles": "design/game-tools.css"
+  },
+  "designs": [
+    {
+      "id": "calm",
+      "code": "01",
+      "name": "柔和原色",
+      "artStyle": "classic",
+      "status": "existing-default",
+      "directory": "design/directions/calm",
+      "designDoc": "design/directions/calm/design.md",
+      "tokens": "design/directions/calm/tokens.json",
+      "preview": "design/directions/calm/index.html",
+      "legacyPreview": "design/directions/calm.html"
+    },
+    {
+      "id": "vivid",
+      "code": "02",
+      "name": "高彩游乐场",
+      "artStyle": "vivid",
+      "status": "review-candidate",
+      "directory": "design/directions/vivid",
+      "designDoc": "design/directions/vivid/design.md",
+      "tokens": "design/directions/vivid/tokens.json",
+      "preview": "design/directions/vivid/index.html",
+      "legacyPreview": "design/directions/vivid.html"
+    },
+    {
+      "id": "toy",
+      "code": "03",
+      "name": "积木轨道屋",
+      "artStyle": "toy",
+      "status": "review-candidate",
+      "directory": "design/directions/toy",
+      "designDoc": "design/directions/toy/design.md",
+      "tokens": "design/directions/toy/tokens.json",
+      "preview": "design/directions/toy/index.html",
+      "legacyPreview": "design/directions/toy.html"
+    },
+    {
+      "id": "animals",
+      "code": "04",
+      "name": "动物弯弯镇",
+      "artStyle": "animals",
+      "status": "review-candidate",
+      "directory": "design/directions/animals",
+      "designDoc": "design/directions/animals/design.md",
+      "tokens": "design/directions/animals/tokens.json",
+      "preview": "design/directions/animals/index.html",
+      "legacyPreview": "design/directions/animals.html"
+    },
+    {
+      "id": "paper",
+      "code": "05",
+      "name": "轻线纸境",
+      "artStyle": "paper",
+      "status": "review-candidate",
+      "directory": "design/directions/paper",
+      "designDoc": "design/directions/paper/design.md",
+      "tokens": "design/directions/paper/tokens.json",
+      "preview": "design/directions/paper/index.html",
+      "legacyPreview": "design/directions/paper.html"
+    }
+  ]
+}
@@ -0,0 +1,116 @@
+# 五套设计的接入与维护约定
+
+适用于主游戏的 01–05 五套设计。先读 [方案目录](README.md)，确定设计 ID，再读对应的 `design.md`。本文和各套 design.md 是人工维护的设计规则；数值以实现源及其生成的 tokens.json 为准。发现文档与实现不一致时核对用户已确认要求并同步修正，不能用旧说明撤回新要求。
+
+## 选择一个设计与主题
+
+三个参数分别控制不同的事：
+
+| 参数 | 合法值 | 作用 |
+| --- | --- | --- |
+| `design` | `calm` / `vivid` / `toy` / `animals` / `paper` | 棋子造型、轨道画法、配色库和控件风格 |
+| `theme` | `lagoon` / `apricot` / `lavender` / `rose` / `midnight` | 轻松、进阶、烧脑、挑战、每周挑战的视觉主题 |
+| `colors` | 4 / 7 / 9 / 12 | 主游戏单关使用的棋子配色数量，默认 7 |
+
+在根目录执行 `npm run dev`。打开 [paper 的轻松主题](../index.html?design=paper&theme=lagoon&colors=7)，或 [paper 的夜间审核](../design-showcase.html?design=paper&theme=midnight#phone)。审核页用控件切换色数；`colors` URL 参数由主游戏读取。设计总览的主题切换只用于视觉对照。
+
+不传 design 时使用 calm。主游戏不传 theme 时按关卡评分选前四种主题；midnight 需显式指定。主题名与配色不改变难度或玩法。编辑模式和工坊试玩使用基础自由配色，不能拿它们判断设计参数是否生效。审核记录保存在 `hex-trails-art-review-v1`，与游戏存档分开。
+
+## Agent 如何读取数据
+
+1. 读取 [manifest.json](manifest.json)，确认 `schemaVersion === 1`。
+2. 按 `designs[].id` 找方案，读取 `designDoc` 与 `tokens`。manifest 的所有路径字段均从仓库根目录解析，不从当前 JSON 目录拼接。
+3. tokens 中的 `themes` 给出环境、文字和已展开的棋盘材质。`palettes["7"]` 是 7 色时的**有序色库索引**；索引指向本文件的 `pigments`，不能借用另一套设计的色库。
+4. tokens 是当前实现的只读数值导出，不能单独描述完整造型或所有 CSS 控件。几何和组件规则仍需读取 design.md、共享渲染器及 CSS。`design/tokens.json` 是旧有基础语义 token 导出，不包含五套方案全集。
+
+manifest 不存用户审核意见，也不表示最新方案已被选为默认。文档中的“最新”只表示新增顺序。
+
+## 复用现有渲染器
+
+浏览器页面已有 `<canvas id="board" width="600" height="600"></canvas>` 时，可在仓库根目录页面的 ES module 中运行以下代码；通过 HTTP 加载，不直接双击文件：
+
+```js
+import { artDirection, directionTheme } from './src/art-directions.js';
+import { CanvasPainter, drawScene } from './src/renderer.js';
+import { layout } from './src/geometry.js';
+import { createStudyLevel } from './src/study-levels.js';
+import { TILE_ATLAS } from './src/sprites.js';
+
+const direction = artDirection('paper');
+const theme = directionTheme(direction, 'lagoon', 7);
+const level = createStudyLevel(3);
+const canvas = document.querySelector('#board');
+const painter = new CanvasPainter(canvas.getContext('2d'));
+const atlas = new Image();
+atlas.src = TILE_ATLAS;
+await atlas.decode();
+painter.atlas = atlas;
+canvas.style.background = theme.background;
+canvas.style.color = theme.ink;
+painter.ctx.clearRect(0, 0, canvas.width, canvas.height);
+drawScene(painter, level, level.tiles,
+  layout(level.cells, canvas.width, canvas.height), { theme });
+```
+
+`drawScene` 只画棋盘、轨道与棋子，不画画布背景，也不自动清屏。响应式画布使用实际显示尺寸和 DPR，复用 [board-viewport.js](../src/board-viewport.js) / app.js 的适配逻辑。不要根据每枚棋子的位置另设显示比例。
+
+整盘绘制时传入完整的 `level.tiles` 与当前剩余 tiles。`drawScene` 以棋子在初始 `level.tiles` 中的索引映射主题 palette，因此移除、撤销与运动不换色；不要按“剩余棋子第几个”重新编号。独立棋子样本才使用 `appearanceTile({color: pigmentIndex, dir}, theme)` 再调用 `drawTile`，这里的 color 已是该设计的色库索引。
+
+所有方向以弧度 `-Math.PI / 2 + dir * Math.PI / 3` 绘制，dir 为 0–5。移动中的棋子经共享 `drawExit` / `drawTile` 保持同一造型。不要复制静态棋子绘制代码实现另一套移动画法。
+
+## 接入完整游戏界面
+
+| 接入点 | 实际来源 | 注意事项 |
+| --- | --- | --- |
+| 设计与主题定义 | [src/art-directions.js](../src/art-directions.js) | ID、12 色库、五主题、artStyle；calm 复用基础色库 |
+| 基础语义色、字体、动效 | [src/design-tokens.js](../src/design-tokens.js) | 被各设计继承；不能用基础色覆盖新方案的独立色库 |
+| 场景几何与运动绘制 | [src/renderer.js](../src/renderer.js)、[src/token-art.js](../src/token-art.js) | 使用同一套命令和曲线路径 |
+| 主游戏选择逻辑 | [src/app.js](../src/app.js) | 设置 body.dataset.design / theme，应用场景背景与文字色 |
+| 控件风格 | [art-directions.css](art-directions.css) | 用 body[data-design] 限定，避免影响其他方案 |
+| 底部道具及布局 | [game-tools.css](game-tools.css) | 最后加载，保证扁平道具覆盖既有立体风格 |
+| 通知与通用组件 | [notifications.css](notifications.css)、[components.css](components.css) | 通知位于剩余步数下方，奖励为金色发光星星 |
+| 图集与裁切 | [src/sprites.js](../src/sprites.js)、[src/ui-skin.js](../src/ui-skin.js) | 棋子图集只在 calm 分支使用；UI 图标各套共享 |
+
+主游戏 CSS 加载顺序参考 [index.html](../index.html)：style.css → tokens.css → components.css → notifications.css → campaign.css → art-directions.css → game-tools.css。只有设置 CSS 主题而没给 drawScene 传 theme，棋盘仍会使用基础画法。只有给画布传 theme 而没设置 body.dataset.design，控件不会切换。
+
+## 所有方案共用的产品要求
+
+- 棋盘在通知区与旋转区之间垂直居中。旋转与道具占真实布局行，不绝对定位压住棋盘。适配手机、Pad、折叠屏和桌面。
+- 撤销、重来、提示是游戏道具，与顶部紧凑导航分开。常规底座 64px，宽度至少 600px 时为 68px，短屏高度不超过 600px 时为 56px；图标 32px、标签 13px。底座无阴影、立体底边或渐变高光，方案的棋子材质不覆盖这条要求。
+- 次数和“▶ AD”角标只用于设计示例，当前不接入真实库存、广告或付费获取逻辑。
+- 奖励星星为黄色／金色并带光感。通知固定在剩余步数下方，不能挪回棋盘下方。
+- 路线以弯曲路径为主要观看内容。动画复用 [exit-animation.js](../src/exit-animation.js) 和 [collision-animation.js](../src/collision-animation.js)。离场时长按实际路径长度计算，不把旧文档中的固定时长或上下限当作当前速度公式。
+- 设计切换不改规则、关卡布局、编号、关卡版本或存档。设计编号 01–05 与关卡 v0.1–v0.5 是两套不同的标识。
+
+## 修改与验证
+
+只改配色：编辑 art-directions.js 中指定设计；calm 的色库及基础主题在 design-tokens.js。改造型：编辑 token-art.js 的指定分支，必要时改 renderer.js 的相关绘制，并同步该套 design.md。改控件：编辑对应 CSS 的作用域规则；共用道具约束仍需保留。
+
+文档整理不需要重新生成关卡。根目录执行：
+
+```sh
+npm run design
+node --test tests/design-packages.test.js tests/art-directions.test.js tests/themes.test.js
+node design/examples/render-design.mjs paper lagoon 7
+node scripts/build.mjs
+```
+
+`npm run design` 会刷新 manifest、每套 tokens、HTML 和旧入口；**不覆盖人工维护的 design.md、shared.md、README.md**。文档测试检查目录与链接、数值导出与运行时一致性，并执行接入示例。视觉修改另检查五主题、长弯路离场、碰撞、旋转与撤销；至少查看 390×844 手机、短屏、平板和桌面。纯文档修改检查链接和预览能加载即可。原生验证单独报告。
+
+## 跨引擎范围与已知限制
+
+绘制抽象只要求 polygon、line、circle，calm 可额外使用 sprite 图集。路径单位是格半径；不能把示例画布尺寸当作固定像素规范。实际应用背景和 UI 布局由宿主引擎实现。
+
+[cocos/HexTrailsBoard.ts](../cocos/HexTrailsBoard.ts) 是适配示例，当前没有传入这五套设计的 theme，且动画时序仍有旧值；[cocos/CandyUiSkin.ts](../cocos/CandyUiSkin.ts) 也不是五套设计的完整原生控件实现。移植时需显式接入主题、核对圆头线条与图层，并按浏览器参考画面验收；本目录不代表原生移植已完成。
+
+paper 的浅色轨道是用户认可的特例，轨道与棋盘对比度低于基础 3:1 目标；不要为通过基础轨道指标自行加深。文字和方向需保持可读。各套 design.md 标明具体差异。
+
+## 实现依据与旧文档
+
+| 依据 | 确认的事实 | 修改／复现入口 |
+| --- | --- | --- |
+| art-directions.js 导出的五个 ID | 五套方案共存且都有五种主题 | manifest.json、每套 tokens.json |
+| renderer.js 的 visualTile 与 paper 分支 | 固定初始索引配色，paper 使用更细轨道 | render-design.mjs、art-directions.test.js |
+| game-tools.css 的最后加载覆盖 | 道具保持扁平且分行布局 | 各套 index.html、主游戏 |
+
+[根目录 Design.md](../Design.md) / Design.html 保留基础组件规范与历史说明，[docs/art-direction.md](../docs/art-direction.md) 保留较早的制作简报。它们的“唯一色源”、轨道对比度和动画旧值不能无差别套用到五套设计。新增方案的接入从本目录开始。
				`@@ -0,0 +1 @@`
				`<!doctype html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="refresh" content="0;url=paper/index.html"><title>轻线纸境 · 设计稿已迁移</title></head><body><p>设计稿已整理到独立目录：<a href="paper/index.html">05 · 轻线纸境</a></p></body></html>`