diff --git a/models/gpt-5-6-sol-ultra.json b/models/gpt-5-6-sol-ultra.json
index 51482ef..a36dbed 100644
--- a/models/gpt-5-6-sol-ultra.json
+++ b/models/gpt-5-6-sol-ultra.json
@@ -6,26 +6,64 @@
   "artifactDir": "gpt-5-6-sol/codex-cli-ultra",
   "order": 29,
   "runs": {
-    "mythos-craft": {
-      "note": {
-        "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示。原始 Ultra 回合在已完整写出可玩单 HTML 后，因宿主收到状态查询而在最终加固阶段中断；本页是中断前落盘的完整 fallback.html，仅原样重命名，未修改内容，也未重试生成。",
-        "en": "Generated from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness. The original Ultra turn was host-interrupted during final hardening after it had written a complete playable single-file HTML; this page is that saved fallback.html, renamed verbatim with no content changes and no retry."
+    "mythos-craft": [
+      {
+        "note": {
+          "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示。原始 Ultra 回合在已完整写出可玩单 HTML 后，因宿主收到状态查询而在最终加固阶段中断；本页是中断前落盘的完整 fallback.html，仅原样重命名，未修改内容，也未重试生成。",
+          "en": "Generated from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness. The original Ultra turn was host-interrupted during final hardening after it had written a complete playable single-file HTML; this page is that saved fallback.html, renamed verbatim with no content changes and no retry."
+        },
+        "contributor": "ZidongChen25"
       },
-      "contributor": "ZidongChen25"
-    },
-    "pelican-cycling": {
-      "note": {
-        "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词一次生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示；本页为未经人工修改的原始 agent 产物。",
-        "en": "Generated in one shot from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness; this is the original agent artifact with no human edits."
+      {
+        "file": "mythos-craft-block-era.html",
+        "note": {
+          "zh": "同一 case 的另一版一次生成产物，与主产物并列保留。GPT-5.6-Sol（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词生成，未经人工修改。此版为『方块纪元』主题的沙盒建造。",
+          "en": "An alternate one-shot artifact for this case, kept alongside the primary run. Generated by GPT-5.6-Sol (ultra effort) in Codex CLI from the repository's canonical Chinese prompt with no human edits. A 'Block Era' sandbox-building take."
+        },
+        "contributor": "Nagi-ovo"
+      }
+    ],
+    "pelican-cycling": [
+      {
+        "note": {
+          "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词一次生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示；本页为未经人工修改的原始 agent 产物。",
+          "en": "Generated in one shot from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness; this is the original agent artifact with no human edits."
+        },
+        "contributor": "ZidongChen25"
       },
-      "contributor": "ZidongChen25"
-    },
-    "skeleton-watch": {
-      "note": {
-        "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词一次生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示。原始 Ultra 回合已生成完整 HTML 写入调用，但宿主状态查询在该调用执行前将回合中断；本页通过原样重放 rollout 中完整记录的 apply_patch 参数恢复，未续写模型，也未修改内容。",
-        "en": "Generated in one shot from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness. The original Ultra turn had produced the complete HTML write call when a host status query interrupted the turn before that call executed; this page was recovered by replaying the exact apply_patch payload recorded in the rollout, with no model continuation or content changes."
+      {
+        "file": "pelican-coastal-ride.svg",
+        "note": {
+          "zh": "同一 case 的另一版一次生成 SVG，与主产物并列保留。GPT-5.6-Sol（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词生成，未经人工修改。",
+          "en": "An alternate one-shot SVG for this case, kept alongside the primary run. Generated by GPT-5.6-Sol (ultra effort) in Codex CLI from the repository's canonical Chinese prompt with no human edits."
+        },
+        "contributor": "Nagi-ovo"
       },
-      "contributor": "ZidongChen25"
-    }
+      {
+        "file": "pelican-cyclist.svg",
+        "note": {
+          "zh": "同一 case 的又一版一次生成 SVG，与主产物并列保留。GPT-5.6-Sol（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词生成，未经人工修改。",
+          "en": "A further alternate one-shot SVG for this case, kept alongside the primary run. Generated by GPT-5.6-Sol (ultra effort) in Codex CLI from the repository's canonical Chinese prompt with no human edits."
+        },
+        "contributor": "Nagi-ovo"
+      }
+    ],
+    "skeleton-watch": [
+      {
+        "note": {
+          "zh": "在 Codex 应用内置的 Codex CLI 0.144.0-alpha.4 中以 GPT-5.6-Sol（ultra 思考档位），使用仓库标准中文提示词一次生成。此 case 使用独立、全新的 CODEX_HOME，并从空工作目录开始，未加载 harness 自带以外的任何 skill、插件、MCP、自定义规则或系统提示。原始 Ultra 回合已生成完整 HTML 写入调用，但宿主状态查询在该调用执行前将回合中断；本页通过原样重放 rollout 中完整记录的 apply_patch 参数恢复，未续写模型，也未修改内容。",
+          "en": "Generated in one shot from the repository's canonical Chinese prompt by GPT-5.6-Sol (ultra effort) in Codex CLI 0.144.0-alpha.4 bundled with the Codex app. This case used a separate clean CODEX_HOME and started in an empty working directory, with no skills, plugins, MCP servers, custom rules, or system prompts beyond those bundled with the harness. The original Ultra turn had produced the complete HTML write call when a host status query interrupted the turn before that call executed; this page was recovered by replaying the exact apply_patch payload recorded in the rollout, with no model continuation or content changes."
+        },
+        "contributor": "ZidongChen25"
+      },
+      {
+        "file": "skeleton-watch-calibre-01.html",
+        "note": {
+          "zh": "同一 case 的另一次独立、完整生成（『Calibre 01』），与主产物（受宿主中断后恢复的 AURELIUS S-01）并列保留。GPT-5.6-Sol（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词生成，未经人工修改。",
+          "en": "A separate, complete generation for this case ('Calibre 01'), kept alongside the primary run (the interruption-recovered AURELIUS S-01). Generated by GPT-5.6-Sol (ultra effort) in Codex CLI from the repository's canonical Chinese prompt with no human edits."
+        },
+        "contributor": "Nagi-ovo"
+      }
+    ]
   }
 }
diff --git a/models/gpt-5-6-terra.json b/models/gpt-5-6-terra.json
new file mode 100644
index 0000000..6f1ec5e
--- /dev/null
+++ b/models/gpt-5-6-terra.json
@@ -0,0 +1,31 @@
+{
+  "label": "GPT-5.6-Terra",
+  "vendor": "OpenAI",
+  "harness": "Codex CLI",
+  "effort": "ultra",
+  "artifactDir": "gpt-5-6-terra/codex-cli-ultra",
+  "order": 29.5,
+  "runs": {
+    "mythos-craft": {
+      "note": {
+        "zh": "GPT-5.6-Terra（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词一次生成，未经人工修改。此版为『阿斯特拉：方块神话』主题的沙盒建造。",
+        "en": "One-shot by GPT-5.6-Terra (ultra effort) in Codex CLI from the repository's canonical Chinese prompt, with no human edits. An 'Astra: Block Myth' sandbox-building take."
+      },
+      "contributor": "Nagi-ovo"
+    },
+    "pelican-cycling": {
+      "note": {
+        "zh": "GPT-5.6-Terra（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词一次生成，未经人工修改。海边骑行鹈鹕 SVG。",
+        "en": "One-shot by GPT-5.6-Terra (ultra effort) in Codex CLI from the repository's canonical Chinese prompt, with no human edits. A seaside pelican-on-bicycle SVG."
+      },
+      "contributor": "Nagi-ovo"
+    },
+    "skeleton-watch": {
+      "note": {
+        "zh": "GPT-5.6-Terra（ultra 思考档位）在 Codex CLI 中用仓库标准中文提示词一次生成，未经人工修改。镂空机械腕表交互演示。",
+        "en": "One-shot by GPT-5.6-Terra (ultra effort) in Codex CLI from the repository's canonical Chinese prompt, with no human edits. An interactive skeleton mechanical-watch demo."
+      },
+      "contributor": "Nagi-ovo"
+    }
+  }
+}
diff --git a/outputs/gpt-5-6-sol/codex-cli-ultra/mythos-craft-block-era.html b/outputs/gpt-5-6-sol/codex-cli-ultra/mythos-craft-block-era.html
new file mode 100644
index 0000000..88a62ef
--- /dev/null
+++ b/outputs/gpt-5-6-sol/codex-cli-ultra/mythos-craft-block-era.html
@@ -0,0 +1,1834 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
+  <title>MYTHOS：方块纪元</title>
+  <style>
+    :root {
+      --ink: #eef2dc;
+      --muted: #aeb89e;
+      --gold: #d8b86c;
+      --cyan: #78e0d4;
+      --panel: rgba(10, 17, 24, .78);
+      --line: rgba(216, 184, 108, .32);
+    }
+
+    * { box-sizing: border-box; }
+
+    html, body {
+      width: 100%;
+      height: 100%;
+      margin: 0;
+      overflow: hidden;
+      background: #09131c;
+      color: var(--ink);
+      font-family: Inter, ui-sans-serif, system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
+      user-select: none;
+    }
+
+    canvas { display: block; }
+
+    #game {
+      position: fixed;
+      inset: 0;
+      background: radial-gradient(circle at 50% 35%, #233f4a 0%, #101c29 42%, #071018 100%);
+    }
+
+    #vignette {
+      pointer-events: none;
+      position: fixed;
+      inset: 0;
+      z-index: 5;
+      background:
+        linear-gradient(to bottom, rgba(3, 8, 14, .18), transparent 20%, transparent 72%, rgba(3, 7, 11, .42)),
+        radial-gradient(ellipse at center, transparent 48%, rgba(2, 7, 11, .46) 100%);
+    }
+
+    #hud {
+      position: fixed;
+      inset: 0;
+      z-index: 10;
+      pointer-events: none;
+      opacity: 0;
+      transition: opacity .25s ease;
+    }
+
+    body.playing #hud { opacity: 1; }
+
+    .hud-card {
+      background: linear-gradient(145deg, rgba(13, 22, 29, .84), rgba(8, 14, 21, .68));
+      border: 1px solid var(--line);
+      box-shadow: 0 14px 34px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .04);
+      backdrop-filter: blur(12px);
+    }
+
+    #status {
+      position: absolute;
+      top: 24px;
+      left: 24px;
+      min-width: 236px;
+      padding: 13px 15px 12px;
+      border-radius: 3px 13px 3px 13px;
+    }
+
+    .eyebrow {
+      color: var(--gold);
+      font-size: 10px;
+      letter-spacing: .22em;
+      font-weight: 800;
+      text-transform: uppercase;
+    }
+
+    #biome {
+      margin-top: 6px;
+      font-size: 16px;
+      font-weight: 720;
+      letter-spacing: .05em;
+    }
+
+    #coords {
+      margin-top: 4px;
+      color: var(--muted);
+      font: 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
+    }
+
+    #lore {
+      position: absolute;
+      top: 24px;
+      right: 24px;
+      width: min(318px, calc(100vw - 48px));
+      padding: 15px 17px 16px;
+      border-radius: 13px 3px 13px 3px;
+    }
+
+    #lore-title {
+      margin-top: 6px;
+      color: #f2e7c7;
+      font-family: Georgia, "Noto Serif SC", serif;
+      font-size: 19px;
+      letter-spacing: .06em;
+    }
+
+    #lore-copy {
+      margin-top: 7px;
+      color: #b9c4b3;
+      font-size: 12px;
+      line-height: 1.7;
+    }
+
+    #compass {
+      position: absolute;
+      top: 24px;
+      left: 50%;
+      width: 270px;
+      transform: translateX(-50%);
+      text-align: center;
+      color: rgba(238, 242, 220, .78);
+      font: 11px/1.35 ui-monospace, SFMono-Regular, Menlo, monospace;
+      letter-spacing: .12em;
+      text-shadow: 0 2px 6px #000;
+    }
+
+    #compass::before {
+      content: "";
+      display: block;
+      width: 1px;
+      height: 9px;
+      margin: 0 auto 4px;
+      background: var(--gold);
+      box-shadow: 0 0 10px var(--gold);
+    }
+
+    #crosshair {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 18px;
+      height: 18px;
+      transform: translate(-50%, -50%);
+      filter: drop-shadow(0 1px 2px #000);
+    }
+
+    #crosshair::before,
+    #crosshair::after {
+      content: "";
+      position: absolute;
+      background: rgba(242, 239, 213, .92);
+      border-radius: 1px;
+    }
+
+    #crosshair::before { left: 8px; top: 2px; width: 2px; height: 14px; }
+    #crosshair::after { left: 2px; top: 8px; width: 14px; height: 2px; }
+
+    #target-label {
+      position: absolute;
+      left: 50%;
+      top: calc(50% + 28px);
+      transform: translateX(-50%);
+      min-width: 210px;
+      color: rgba(241, 242, 221, .84);
+      font-size: 10px;
+      letter-spacing: .08em;
+      text-align: center;
+      text-shadow: 0 2px 5px #000;
+    }
+
+    #hotbar-wrap {
+      position: absolute;
+      left: 50%;
+      bottom: 24px;
+      transform: translateX(-50%);
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 8px;
+    }
+
+    #selected-name {
+      color: #f2e8c7;
+      font-size: 11px;
+      font-weight: 700;
+      letter-spacing: .12em;
+      text-shadow: 0 2px 6px #000;
+    }
+
+    #hotbar {
+      display: flex;
+      gap: 5px;
+      padding: 6px;
+      border-radius: 10px 3px 10px 3px;
+      background: rgba(6, 12, 17, .72);
+      border: 1px solid rgba(235, 210, 139, .28);
+      box-shadow: 0 12px 28px rgba(0, 0, 0, .36);
+      backdrop-filter: blur(10px);
+    }
+
+    .slot {
+      position: relative;
+      width: 48px;
+      height: 48px;
+      padding: 5px;
+      border: 1px solid rgba(255, 255, 255, .12);
+      background: rgba(255, 255, 255, .035);
+      transition: transform .16s ease, border-color .16s ease, background .16s ease;
+    }
+
+    .slot.selected {
+      transform: translateY(-4px);
+      border-color: var(--gold);
+      background: rgba(216, 184, 108, .15);
+      box-shadow: 0 0 0 1px rgba(216, 184, 108, .2), 0 0 20px rgba(216, 184, 108, .16);
+    }
+
+    .slot-swatch {
+      width: 100%;
+      height: 100%;
+      image-rendering: pixelated;
+      background-size: cover;
+      box-shadow: inset -5px -5px rgba(0, 0, 0, .18), inset 3px 3px rgba(255, 255, 255, .08);
+    }
+
+    .slot-key {
+      position: absolute;
+      top: 2px;
+      left: 4px;
+      color: rgba(255, 255, 255, .86);
+      font: 9px ui-monospace, monospace;
+      text-shadow: 0 1px 2px #000;
+    }
+
+    #toast {
+      position: absolute;
+      left: 50%;
+      bottom: 104px;
+      max-width: min(440px, calc(100vw - 40px));
+      padding: 10px 15px;
+      transform: translate(-50%, 12px);
+      border: 1px solid rgba(120, 224, 212, .3);
+      border-radius: 2px 10px 2px 10px;
+      background: rgba(7, 18, 23, .84);
+      color: #d9f1e9;
+      font-size: 12px;
+      letter-spacing: .04em;
+      opacity: 0;
+      transition: opacity .25s ease, transform .25s ease;
+    }
+
+    #toast.show { opacity: 1; transform: translate(-50%, 0); }
+
+    #start-screen {
+      position: fixed;
+      inset: 0;
+      z-index: 30;
+      display: grid;
+      place-items: center;
+      padding: 24px;
+      background:
+        linear-gradient(90deg, rgba(5, 11, 16, .9), rgba(5, 11, 16, .54) 52%, rgba(5, 11, 16, .82)),
+        radial-gradient(circle at 65% 30%, rgba(54, 115, 116, .3), transparent 34%),
+        radial-gradient(circle at 35% 75%, rgba(111, 73, 128, .22), transparent 38%);
+      transition: opacity .35s ease, visibility .35s ease;
+    }
+
+    #start-screen.hidden { opacity: 0; visibility: hidden; }
+
+    #start-screen::before {
+      content: "";
+      position: absolute;
+      inset: 18px;
+      border: 1px solid rgba(216, 184, 108, .18);
+      pointer-events: none;
+    }
+
+    .start-panel {
+      position: relative;
+      width: min(900px, 100%);
+      display: grid;
+      grid-template-columns: 1.2fr .8fr;
+      gap: clamp(30px, 7vw, 100px);
+      align-items: end;
+    }
+
+    .sigil {
+      display: inline-flex;
+      align-items: center;
+      gap: 10px;
+      color: var(--gold);
+      font-size: 10px;
+      font-weight: 800;
+      letter-spacing: .3em;
+      text-transform: uppercase;
+    }
+
+    .sigil::before {
+      content: "";
+      width: 28px;
+      height: 1px;
+      background: currentColor;
+      box-shadow: 0 0 8px currentColor;
+    }
+
+    h1 {
+      margin: 18px 0 12px;
+      font-family: Georgia, "Noto Serif SC", serif;
+      font-size: clamp(52px, 8vw, 104px);
+      font-weight: 500;
+      line-height: .86;
+      letter-spacing: -.05em;
+      text-shadow: 0 8px 40px rgba(0, 0, 0, .48);
+    }
+
+    h1 span {
+      display: block;
+      margin-top: 18px;
+      color: #c8d8cb;
+      font-family: ui-sans-serif, system-ui, sans-serif;
+      font-size: .19em;
+      font-weight: 500;
+      letter-spacing: .42em;
+    }
+
+    .intro {
+      max-width: 570px;
+      margin: 22px 0 0;
+      color: #aebcae;
+      font-size: 14px;
+      line-height: 1.9;
+    }
+
+    .side-panel {
+      padding: 22px;
+      border-top: 1px solid rgba(216, 184, 108, .42);
+      border-bottom: 1px solid rgba(216, 184, 108, .2);
+      background: linear-gradient(90deg, rgba(12, 22, 27, .76), rgba(12, 22, 27, .2));
+    }
+
+    .control-grid {
+      display: grid;
+      grid-template-columns: auto 1fr;
+      gap: 9px 15px;
+      color: #a9b5a8;
+      font-size: 11px;
+      line-height: 1.4;
+    }
+
+    .control-grid b {
+      color: #e9e7d1;
+      font: 700 10px ui-monospace, SFMono-Regular, Menlo, monospace;
+      letter-spacing: .06em;
+    }
+
+    #enter {
+      width: 100%;
+      margin-top: 22px;
+      padding: 14px 18px;
+      border: 1px solid #d5bd7e;
+      border-radius: 0;
+      background: linear-gradient(100deg, #d9bd75, #b99c5c);
+      color: #10171a;
+      font: 800 11px ui-sans-serif, system-ui, sans-serif;
+      letter-spacing: .24em;
+      cursor: pointer;
+      box-shadow: 0 10px 28px rgba(192, 156, 82, .16);
+      transition: transform .18s ease, filter .18s ease;
+    }
+
+    #enter:hover { transform: translateY(-2px); filter: brightness(1.08); }
+
+    #load-status {
+      margin-top: 10px;
+      color: #83938a;
+      font: 9px ui-monospace, monospace;
+      letter-spacing: .08em;
+      text-align: center;
+    }
+
+    #fatal {
+      display: none;
+      position: fixed;
+      inset: 0;
+      z-index: 100;
+      place-items: center;
+      padding: 30px;
+      background: #081017;
+      color: #e6dfc7;
+      text-align: center;
+      line-height: 1.8;
+    }
+
+    @media (max-width: 720px) {
+      .start-panel { grid-template-columns: 1fr; gap: 26px; }
+      .intro { font-size: 12px; }
+      #lore { top: auto; bottom: 102px; right: 12px; width: 220px; }
+      #status { top: 12px; left: 12px; min-width: 190px; }
+      #compass { top: 95px; }
+      .slot { width: 40px; height: 40px; }
+      #hotbar-wrap { bottom: 14px; }
+    }
+  </style>
+</head>
+<body>
+  <div id="game"></div>
+  <div id="vignette"></div>
+
+  <div id="hud">
+    <div id="status" class="hud-card">
+      <div class="eyebrow">Realm telemetry</div>
+      <div id="biome">永暮高地</div>
+      <div id="coords">X 0 · Y 0 · Z 0</div>
+    </div>
+
+    <div id="compass">N · 曙光王城 · 0M</div>
+
+    <div id="lore" class="hud-card">
+      <div class="eyebrow" id="lore-index">Myth archive · 0/5</div>
+      <div id="lore-title">无名荒野</div>
+      <div id="lore-copy">远古地脉仍在方块之间低语。循着天际的塔影，寻找被遗忘的神话遗迹。</div>
+    </div>
+
+    <div id="crosshair"></div>
+    <div id="target-label">寻找方块</div>
+
+    <div id="hotbar-wrap">
+      <div id="selected-name">草方块</div>
+      <div id="hotbar"></div>
+    </div>
+
+    <div id="toast">已发现新的神话遗迹</div>
+  </div>
+
+  <div id="start-screen">
+    <div class="start-panel">
+      <section>
+        <div class="sigil">A procedural voxel myth</div>
+        <h1>MYTHOS<span>方块纪元</span></h1>
+        <p class="intro">
+          一座由柏林噪声与失落神话共同生成的无尽世界。越过王城的黑曜石城门，攀上浮空圣殿，
+          唤醒世界树的微光，并在龙骨荒原寻找通往月海的门。
+        </p>
+      </section>
+
+      <aside class="side-panel">
+        <div class="control-grid">
+          <b>W A S D</b><span>移动</span>
+          <b>鼠标</b><span>环视</span>
+          <b>空格</b><span>跳跃</span>
+          <b>SHIFT</b><span>疾跑</span>
+          <b>左键</b><span>破坏方块</span>
+          <b>右键</b><span>放置方块</span>
+          <b>1—6 / 滚轮</b><span>选择方块</span>
+          <b>ESC</b><span>暂停并释放鼠标</span>
+        </div>
+        <button id="enter" type="button">进入永暮世界</button>
+        <div id="load-status">正在编织地形 · 0%</div>
+      </aside>
+    </div>
+  </div>
+
+  <div id="fatal">
+    <div>
+      <strong>无法载入 3D 世界</strong><br />
+      请确认网络可访问 cdn.jsdelivr.net，然后刷新页面。
+    </div>
+  </div>
+
+  <script src="https://cdn.jsdelivr.net/npm/three@0.128.0/build/three.min.js"></script>
+  <script>
+  (() => {
+    'use strict';
+
+    if (!window.THREE) {
+      document.getElementById('fatal').style.display = 'grid';
+      return;
+    }
+
+    const $ = (id) => document.getElementById(id);
+    const game = $('game');
+    const startScreen = $('start-screen');
+    const enterButton = $('enter');
+    const loadStatus = $('load-status');
+    const biomeEl = $('biome');
+    const coordsEl = $('coords');
+    const compassEl = $('compass');
+    const loreTitleEl = $('lore-title');
+    const loreCopyEl = $('lore-copy');
+    const loreIndexEl = $('lore-index');
+    const targetLabelEl = $('target-label');
+    const selectedNameEl = $('selected-name');
+    const hotbarEl = $('hotbar');
+    const toastEl = $('toast');
+
+    const scene = new THREE.Scene();
+    scene.fog = new THREE.FogExp2(0x102331, 0.0125);
+
+    const camera = new THREE.PerspectiveCamera(72, innerWidth / innerHeight, 0.05, 310);
+    camera.rotation.order = 'YXZ';
+
+    const renderer = new THREE.WebGLRenderer({ antialias: true, powerPreference: 'high-performance' });
+    renderer.setPixelRatio(Math.min(devicePixelRatio, 1.7));
+    renderer.setSize(innerWidth, innerHeight);
+    renderer.outputEncoding = THREE.sRGBEncoding;
+    renderer.toneMapping = THREE.ACESFilmicToneMapping;
+    renderer.toneMappingExposure = 1.04;
+    renderer.shadowMap.enabled = true;
+    renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+    game.appendChild(renderer.domElement);
+
+    const sky = new THREE.Mesh(
+      new THREE.SphereGeometry(220, 32, 16),
+      new THREE.ShaderMaterial({
+        side: THREE.BackSide,
+        depthWrite: false,
+        uniforms: { uTime: { value: 0 } },
+        vertexShader: `
+          varying vec3 vPos;
+          void main() {
+            vPos = position;
+            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+          }
+        `,
+        fragmentShader: `
+          varying vec3 vPos;
+          uniform float uTime;
+          void main() {
+            float h = normalize(vPos).y * .5 + .5;
+            vec3 low = vec3(.055, .12, .16);
+            vec3 mid = vec3(.12, .25, .29);
+            vec3 high = vec3(.025, .045, .09);
+            vec3 col = mix(low, mid, smoothstep(.18, .46, h));
+            col = mix(col, high, smoothstep(.52, .92, h));
+            float band = sin(normalize(vPos).x * 8.0 + uTime * .035) * .5 + .5;
+            col += vec3(.025, .08, .07) * band * smoothstep(.52, .8, h) * (1.0 - smoothstep(.82, 1.0, h));
+            gl_FragColor = vec4(col, 1.0);
+          }
+        `
+      })
+    );
+    scene.add(sky);
+
+    const hemi = new THREE.HemisphereLight(0x99cad0, 0x182015, 1.22);
+    scene.add(hemi);
+
+    const sun = new THREE.DirectionalLight(0xffe5bb, 1.75);
+    sun.position.set(-55, 88, 36);
+    sun.castShadow = true;
+    sun.shadow.mapSize.set(2048, 2048);
+    sun.shadow.camera.left = -54;
+    sun.shadow.camera.right = 54;
+    sun.shadow.camera.top = 54;
+    sun.shadow.camera.bottom = -54;
+    sun.shadow.camera.near = 1;
+    sun.shadow.camera.far = 180;
+    sun.shadow.bias = -0.00025;
+    scene.add(sun);
+    scene.add(sun.target);
+
+    const celestial = new THREE.Group();
+    const moon = new THREE.Mesh(
+      new THREE.SphereGeometry(8, 24, 16),
+      new THREE.MeshBasicMaterial({ color: 0xd8ebe1, fog: false })
+    );
+    moon.position.set(72, 80, -145);
+    celestial.add(moon);
+    const moonHalo = new THREE.Mesh(
+      new THREE.RingGeometry(10.5, 14, 48),
+      new THREE.MeshBasicMaterial({ color: 0x8ec5c6, transparent: true, opacity: .12, side: THREE.DoubleSide, depthWrite: false, fog: false })
+    );
+    moonHalo.position.copy(moon.position);
+    moonHalo.lookAt(0, 0, 0);
+    celestial.add(moonHalo);
+    const secondMoon = new THREE.Mesh(
+      new THREE.SphereGeometry(3.2, 18, 12),
+      new THREE.MeshBasicMaterial({ color: 0xbc9ed1, fog: false })
+    );
+    secondMoon.position.set(98, 62, -140);
+    celestial.add(secondMoon);
+    scene.add(celestial);
+
+    const starGeometry = new THREE.BufferGeometry();
+    const starPositions = [];
+    let starSeed = 99173;
+    const starRand = () => {
+      starSeed |= 0;
+      starSeed = starSeed + 0x6D2B79F5 | 0;
+      let t = Math.imul(starSeed ^ starSeed >>> 15, 1 | starSeed);
+      t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+      return ((t ^ t >>> 14) >>> 0) / 4294967296;
+    };
+    for (let i = 0; i < 550; i++) {
+      const theta = starRand() * Math.PI * 2;
+      const phi = Math.acos(.08 + starRand() * .84);
+      const r = 198;
+      starPositions.push(Math.sin(phi) * Math.cos(theta) * r, Math.cos(phi) * r, Math.sin(phi) * Math.sin(theta) * r);
+    }
+    starGeometry.setAttribute('position', new THREE.Float32BufferAttribute(starPositions, 3));
+    const stars = new THREE.Points(starGeometry, new THREE.PointsMaterial({ color: 0xdde9dc, size: .48, transparent: true, opacity: .72, depthWrite: false, fog: false }));
+    celestial.add(stars);
+
+    const CHUNK = 16;
+    const VIEW_RADIUS = 2;
+    const SEA_LEVEL = 6;
+    const MAX_BUILD_Y = 48;
+    const REACH = 7;
+
+    const BLOCK = Object.freeze({
+      AIR: 0,
+      GRASS: 1,
+      DIRT: 2,
+      STONE: 3,
+      MARBLE: 4,
+      RUNE: 5,
+      CRYSTAL: 6,
+      WOOD: 7,
+      LEAVES: 8,
+      SAND: 9,
+      BONE: 10,
+      GILDED: 11
+    });
+
+    const BLOCK_INFO = {
+      [BLOCK.GRASS]: { name: '草方块', color: 0x668b45 },
+      [BLOCK.DIRT]: { name: '泥土', color: 0x785135 },
+      [BLOCK.STONE]: { name: '远古石', color: 0x687177 },
+      [BLOCK.MARBLE]: { name: '月白石', color: 0xd7d0b8 },
+      [BLOCK.RUNE]: { name: '符文石', color: 0x273c56 },
+      [BLOCK.CRYSTAL]: { name: '星辉晶体', color: 0x65ddd0 },
+      [BLOCK.WOOD]: { name: '世界树木', color: 0x735038 },
+      [BLOCK.LEAVES]: { name: '世界树叶', color: 0x456c55 },
+      [BLOCK.SAND]: { name: '月砂', color: 0xbda976 },
+      [BLOCK.BONE]: { name: '古龙骨', color: 0xd8cfad },
+      [BLOCK.GILDED]: { name: '日铸金', color: 0xc79e45 }
+    };
+
+    function mulberry32(seed) {
+      return function() {
+        let t = seed += 0x6D2B79F5;
+        t = Math.imul(t ^ t >>> 15, t | 1);
+        t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+        return ((t ^ t >>> 14) >>> 0) / 4294967296;
+      };
+    }
+
+    class PerlinNoise {
+      constructor(seed) {
+        const random = mulberry32(seed);
+        const p = Array.from({ length: 256 }, (_, i) => i);
+        for (let i = 255; i > 0; i--) {
+          const j = Math.floor(random() * (i + 1));
+          [p[i], p[j]] = [p[j], p[i]];
+        }
+        this.p = new Uint16Array(512);
+        for (let i = 0; i < 512; i++) this.p[i] = p[i & 255];
+      }
+
+      fade(t) { return t * t * t * (t * (t * 6 - 15) + 10); }
+      lerp(a, b, t) { return a + (b - a) * t; }
+      grad(hash, x, y) {
+        switch (hash & 7) {
+          case 0: return x + y;
+          case 1: return -x + y;
+          case 2: return x - y;
+          case 3: return -x - y;
+          case 4: return x;
+          case 5: return -x;
+          case 6: return y;
+          default: return -y;
+        }
+      }
+
+      noise(x, y) {
+        const xi = Math.floor(x) & 255;
+        const yi = Math.floor(y) & 255;
+        const xf = x - Math.floor(x);
+        const yf = y - Math.floor(y);
+        const u = this.fade(xf);
+        const v = this.fade(yf);
+        const aa = this.p[this.p[xi] + yi];
+        const ab = this.p[this.p[xi] + yi + 1];
+        const ba = this.p[this.p[xi + 1] + yi];
+        const bb = this.p[this.p[xi + 1] + yi + 1];
+        return this.lerp(
+          this.lerp(this.grad(aa, xf, yf), this.grad(ba, xf - 1, yf), u),
+          this.lerp(this.grad(ab, xf, yf - 1), this.grad(bb, xf - 1, yf - 1), u),
+          v
+        ) * .72;
+      }
+    }
+
+    const terrainNoise = new PerlinNoise(0xA57E11);
+    const detailNoise = new PerlinNoise(0x51DECA);
+    const biomeNoise = new PerlinNoise(0xB10B1E);
+
+    function fbm(noise, x, z, octaves = 5) {
+      let value = 0;
+      let amplitude = .5;
+      let frequency = 1;
+      let total = 0;
+      for (let i = 0; i < octaves; i++) {
+        value += noise.noise(x * frequency, z * frequency) * amplitude;
+        total += amplitude;
+        amplitude *= .5;
+        frequency *= 2.02;
+      }
+      return value / total;
+    }
+
+    function hash2(x, z) {
+      let h = Math.imul(x | 0, 374761393) + Math.imul(z | 0, 668265263);
+      h = Math.imul(h ^ h >>> 13, 1274126177);
+      return ((h ^ h >>> 16) >>> 0) / 4294967295;
+    }
+
+    function hash3(x, y, z) {
+      return hash2(x + Math.imul(y, 193), z - Math.imul(y, 389));
+    }
+
+    const heightCache = new Map();
+    function heightAt(x, z) {
+      const cacheKey = x + ',' + z;
+      const cached = heightCache.get(cacheKey);
+      if (cached !== undefined) return cached;
+
+      const continent = fbm(terrainNoise, x * .009, z * .009, 5);
+      const ridges = 1 - Math.abs(fbm(detailNoise, x * .019, z * .019, 4));
+      const small = fbm(detailNoise, x * .058, z * .058, 3);
+      let h = Math.floor(9 + continent * 10 + Math.pow(ridges, 4) * 6 + small * 2.4);
+      h = Math.max(3, Math.min(27, h));
+
+      const ax = Math.abs(x);
+      const az = Math.abs(z);
+      const insideCitadel = ax <= 19 && az <= 15;
+      const insideMoat = ax <= 27 && az <= 23;
+      if (insideCitadel) h = 15;
+      else if (insideMoat) h = Math.min(h, SEA_LEVEL - 2);
+
+      const treeD = Math.hypot(x + 38, z + 28);
+      if (treeD < 13) h = Math.max(h, Math.floor(12 - treeD * .26));
+
+      const portalD = Math.hypot(x - 36, z - 30);
+      if (portalD < 11) h = Math.max(h, Math.floor(10 - portalD * .18));
+
+      const boneD = Math.hypot(x + 36, z - 30);
+      if (boneD < 13) h = Math.min(Math.max(h, 8), 10);
+
+      heightCache.set(cacheKey, h);
+      return h;
+    }
+
+    function terrainBlockAt(x, y, z) {
+      if (y < 0) return BLOCK.STONE;
+      const h = heightAt(x, z);
+      if (y > h) return BLOCK.AIR;
+      if (y === h) {
+        if (h <= SEA_LEVEL + 1) return BLOCK.SAND;
+        if (h >= 23) return BLOCK.STONE;
+        return BLOCK.GRASS;
+      }
+      if (y >= h - 3) return h <= SEA_LEVEL + 1 ? BLOCK.SAND : BLOCK.DIRT;
+      if (hash3(x, y, z) > .994 && y > 2) return BLOCK.CRYSTAL;
+      return BLOCK.STONE;
+    }
+
+    function citadelBlockAt(x, y, z) {
+      if (Math.abs(x) > 31 || z < -17 || z > 32 || y < 14 || y > 42) return BLOCK.AIR;
+
+      const ax = Math.abs(x);
+      const az = Math.abs(z);
+
+      if (z >= 13 && z <= 30) {
+        if (ax <= 3 && y === 16) return (z % 6 === 0 && ax <= 1) ? BLOCK.RUNE : BLOCK.MARBLE;
+        if (ax === 3 && y === 17 && z % 2 === 0) return BLOCK.GILDED;
+      }
+
+      if (ax <= 16 && az <= 12 && y === 16) {
+        if ((x % 7 === 0 || z % 7 === 0) && hash2(x, z) > .48) return BLOCK.RUNE;
+        return BLOCK.MARBLE;
+      }
+
+      const outerEdge = (ax === 16 && az <= 12) || (az === 12 && ax <= 16);
+      const southGateVoid = z === 12 && ax <= 2 && y <= 21;
+      const slit = y === 20 && ((ax === 16 && Math.abs(z % 5) === 1) || (az === 12 && Math.abs(x % 5) === 1));
+      if (outerEdge && y >= 17 && y <= 22 && !southGateVoid && !slit) {
+        return (y === 18 && (x + z) % 4 === 0) ? BLOCK.GILDED : BLOCK.MARBLE;
+      }
+      if (outerEdge && y === 23 && (Math.abs(x + z) % 2 === 0)) return BLOCK.RUNE;
+
+      const corners = [[16, 12], [16, -12], [-16, 12], [-16, -12]];
+      for (const [cx, cz] of corners) {
+        const dx = Math.abs(x - cx);
+        const dz = Math.abs(z - cz);
+        const d = Math.max(dx, dz);
+        if (d === 3 && y >= 17 && y <= 27) {
+          if (y === 23 && ((dx === 3 && dz === 0) || (dz === 3 && dx === 0))) return BLOCK.CRYSTAL;
+          return y % 5 === 0 ? BLOCK.RUNE : BLOCK.MARBLE;
+        }
+        if (d <= 3 && y === 27) return BLOCK.MARBLE;
+        if (d === 3 && y === 28 && ((x + z) & 1) === 0) return BLOCK.GILDED;
+      }
+
+      const keepX = ax;
+      const keepZ = Math.abs(z + 1);
+      const keepEdge = (keepX === 7 && keepZ <= 6) || (keepZ === 6 && keepX <= 7);
+      const keepGateVoid = z === 5 && ax <= 1 && y <= 21;
+      const keepWindow = (y === 22 || y === 25) && ((keepX === 7 && Math.abs(z % 4) === 1) || (keepZ === 6 && Math.abs(x % 4) === 1));
+      if (keepEdge && y >= 17 && y <= 27 && !keepGateVoid && !keepWindow) {
+        return y === 20 ? BLOCK.RUNE : BLOCK.MARBLE;
+      }
+      if (keepX <= 7 && keepZ <= 6 && y === 17) return BLOCK.MARBLE;
+      if (keepX <= 7 && keepZ <= 6 && y === 28) return ((x + z) % 3 === 0) ? BLOCK.GILDED : BLOCK.MARBLE;
+      if (keepX <= 6 && keepZ <= 5 && y === 29) return BLOCK.RUNE;
+      if (keepX <= 5 && keepZ <= 4 && y === 30) return BLOCK.MARBLE;
+
+      const spireD = Math.max(ax, Math.abs(z + 1));
+      if (spireD === 3 && y >= 30 && y <= 36) {
+        if (y === 33 && (x === 0 || z === -1)) return BLOCK.CRYSTAL;
+        return y % 3 === 0 ? BLOCK.RUNE : BLOCK.MARBLE;
+      }
+      if (spireD <= 3 && y === 36) return BLOCK.GILDED;
+      if (ax <= Math.max(0, 2 - Math.floor((y - 37) / 2)) && Math.abs(z + 1) <= Math.max(0, 2 - Math.floor((y - 37) / 2)) && y >= 37 && y <= 40) return BLOCK.CRYSTAL;
+
+      const pylons = [[10, 6], [-10, 6], [10, -6], [-10, -6]];
+      for (const [px, pz] of pylons) {
+        const pd = Math.max(Math.abs(x - px), Math.abs(z - pz));
+        if (pd <= 1 && y >= 17 && y <= 22) return y === 20 ? BLOCK.GILDED : BLOCK.RUNE;
+        if (pd === 0 && y >= 23 && y <= 25) return BLOCK.CRYSTAL;
+      }
+
+      if (z === 12 && ax <= 3 && y === 22) return BLOCK.GILDED;
+      return BLOCK.AIR;
+    }
+
+    function pointSegmentDistanceSq(px, py, pz, ax, ay, az, bx, by, bz) {
+      const abx = bx - ax;
+      const aby = by - ay;
+      const abz = bz - az;
+      const apx = px - ax;
+      const apy = py - ay;
+      const apz = pz - az;
+      const denom = abx * abx + aby * aby + abz * abz;
+      const t = Math.max(0, Math.min(1, (apx * abx + apy * aby + apz * abz) / denom));
+      const dx = px - (ax + abx * t);
+      const dy = py - (ay + aby * t);
+      const dz = pz - (az + abz * t);
+      return dx * dx + dy * dy + dz * dz;
+    }
+
+    function worldTreeBlockAt(x, y, z) {
+      const dx = x + 38;
+      const dz = z + 28;
+      if (Math.abs(dx) > 13 || Math.abs(dz) > 13 || y < 11 || y > 39) return BLOCK.AIR;
+
+      if (y >= 13 && y <= 29) {
+        const radius = y < 18 ? 2.45 : y < 25 ? 1.75 : 1.15;
+        if (dx * dx + dz * dz <= radius * radius + hash3(x, y, z) * .55) return BLOCK.WOOD;
+      }
+
+      const roots = [[9, 0], [-9, 1], [0, 9], [1, -9], [7, 7], [-7, 7], [7, -7], [-7, -7]];
+      for (const [rx, rz] of roots) {
+        if (pointSegmentDistanceSq(x + .5, y + .5, z + .5, -37.5, 14, -27.5, -37.5 + rx, 12.5, -27.5 + rz) < 1.3) return BLOCK.WOOD;
+      }
+
+      const branches = [
+        [9, 31, 1], [-8, 30, 3], [2, 34, 8], [-3, 33, -8], [7, 35, -5], [-7, 35, -4]
+      ];
+      for (const [bx, by, bz] of branches) {
+        if (pointSegmentDistanceSq(x + .5, y + .5, z + .5, -37.5, 26.5, -27.5, -37.5 + bx, by, -27.5 + bz) < 1.15) return BLOCK.WOOD;
+      }
+
+      const crowns = [
+        [0, 33, 0, 6.4], [7, 33, 1, 4.4], [-7, 32, 3, 4.7], [2, 36, 7, 4.1], [-3, 35, -7, 4.5], [6, 37, -4, 3.7], [-6, 37, -3, 3.8]
+      ];
+      for (const [cx, cy, cz, r] of crowns) {
+        const ex = dx - cx;
+        const ey = (y - cy) * 1.1;
+        const ez = dz - cz;
+        const d2 = ex * ex + ey * ey + ez * ez;
+        if (d2 <= r * r && hash3(x, y, z) > .12) {
+          if (hash3(x + 71, y - 18, z + 9) > .976 && y < cy) return BLOCK.CRYSTAL;
+          return BLOCK.LEAVES;
+        }
+      }
+      return BLOCK.AIR;
+    }
+
+    const floatingIslands = [
+      { x: 34, z: -28, y: 32, r: 10 },
+      { x: 47, z: -34, y: 28, r: 5 },
+      { x: 23, z: -39, y: 35, r: 4 },
+      { x: 48, z: -17, y: 38, r: 3.5 }
+    ];
+
+    function floatingIslandBlockAt(x, y, z) {
+      for (const island of floatingIslands) {
+        const dx = x - island.x;
+        const dz = z - island.z;
+        const radial = Math.sqrt(dx * dx + dz * dz) / island.r;
+        if (radial <= 1) {
+          const top = island.y + Math.floor(detailNoise.noise(x * .21, z * .21) * 1.5);
+          const thickness = Math.max(1, Math.floor((1 - radial) * island.r * .78 + 1));
+          if (y <= top && y >= top - thickness) {
+            if (y === top) return BLOCK.GRASS;
+            if (y >= top - 2) return BLOCK.DIRT;
+            return hash3(x, y, z) > .94 ? BLOCK.CRYSTAL : BLOCK.STONE;
+          }
+        }
+      }
+
+      const dx = x - 34;
+      const dz = z + 28;
+      const r2 = dx * dx + dz * dz;
+      if (r2 <= 42 && y >= 32 && y <= 34) return y === 34 ? BLOCK.MARBLE : BLOCK.RUNE;
+
+      const columns = [[5, 0], [-5, 0], [0, 5], [0, -5], [4, 4], [-4, 4], [4, -4], [-4, -4]];
+      for (const [cx, cz] of columns) {
+        const d = Math.max(Math.abs(dx - cx), Math.abs(dz - cz));
+        if (d === 0 && y >= 35 && y <= 42) return y === 39 ? BLOCK.GILDED : BLOCK.MARBLE;
+        if (d <= 1 && y === 35) return BLOCK.RUNE;
+      }
+      if (r2 >= 18 && r2 <= 37 && y === 43) return (x + z) % 3 === 0 ? BLOCK.GILDED : BLOCK.MARBLE;
+      if (Math.abs(dx) <= 1 && Math.abs(dz) <= 1 && y >= 35 && y <= 41) return BLOCK.CRYSTAL;
+      if (dx === 0 && dz === 0 && y === 42) return BLOCK.GILDED;
+      return BLOCK.AIR;
+    }
+
+    function moonGateBlockAt(x, y, z) {
+      const dx = x - 36;
+      const dz = z - 30;
+      if (Math.abs(dx) > 10 || Math.abs(dz) > 6 || y < 9 || y > 29) return BLOCK.AIR;
+      const base = 11;
+      const d2 = dx * dx + dz * dz;
+      if (y === base && d2 <= 64) return d2 > 45 ? BLOCK.GILDED : BLOCK.RUNE;
+      if (y === base + 1 && d2 <= 25) return BLOCK.MARBLE;
+
+      if (Math.abs(dz) <= 1) {
+        const ny = y - 19;
+        const ring = Math.sqrt((dx * dx) / 49 + (ny * ny) / 81);
+        if (ring > .82 && ring < 1.12) {
+          if ((x + y) % 5 === 0) return BLOCK.CRYSTAL;
+          return BLOCK.RUNE;
+        }
+      }
+      if ((Math.abs(dx) === 8 || Math.abs(dx) === 9) && Math.abs(dz) <= 2 && y >= base && y <= base + 3) return BLOCK.MARBLE;
+      return BLOCK.AIR;
+    }
+
+    function dragonBoneBlockAt(x, y, z) {
+      if (x < -48 || x > -24 || z < 14 || z > 46 || y < 10 || y > 23) return BLOCK.AIR;
+      const spineX = -36 + Math.round(Math.sin((z - 18) * .31));
+      if (z >= 18 && z <= 42 && Math.abs(x - spineX) <= (z % 5 === 0 ? 1 : 0) && y === 13) return BLOCK.BONE;
+
+      const ribs = [21, 25, 29, 33, 37];
+      for (const rz of ribs) {
+        const dx = x + 36;
+        if (Math.abs(dx) <= 8 && Math.abs(z - rz) <= (Math.abs(dx) === 8 ? 1 : 0)) {
+          const arch = 13 + Math.round(Math.sqrt(Math.max(0, 1 - (dx * dx) / 64)) * 7);
+          if (y === arch) return BLOCK.BONE;
+        }
+      }
+
+      const sx = x + 36;
+      const sz = z - 16;
+      if (Math.abs(sx) <= 3 && sz >= -2 && sz <= 2 && y >= 12 && y <= 16) {
+        const shell = Math.abs(sx) === 3 || Math.abs(sz) === 2 || y === 16;
+        const eye = y === 14 && Math.abs(sx) === 2 && sz === -2;
+        if (eye) return BLOCK.RUNE;
+        if (shell) return BLOCK.BONE;
+      }
+      if (pointSegmentDistanceSq(x + .5, y + .5, z + .5, -38, 16, 15, -44, 21, 9) < .9) return BLOCK.BONE;
+      if (pointSegmentDistanceSq(x + .5, y + .5, z + .5, -34, 16, 15, -28, 21, 9) < .9) return BLOCK.BONE;
+      return BLOCK.AIR;
+    }
+
+    function shrineBlockAt(x, y, z) {
+      const cell = 96;
+      const cx = Math.floor((x + cell / 2) / cell) * cell;
+      const cz = Math.floor((z + cell / 2) / cell) * cell;
+      if (Math.abs(cx) < 70 && Math.abs(cz) < 70) return BLOCK.AIR;
+      if (hash2(cx / cell, cz / cell) < .48) return BLOCK.AIR;
+      const dx = x - cx;
+      const dz = z - cz;
+      if (Math.abs(dx) > 5 || Math.abs(dz) > 5) return BLOCK.AIR;
+      const base = heightAt(cx, cz) + 1;
+      if (y === base && Math.max(Math.abs(dx), Math.abs(dz)) <= 4) return (dx === 0 || dz === 0) ? BLOCK.RUNE : BLOCK.MARBLE;
+      if ((Math.abs(dx) === 3 && Math.abs(dz) === 3) && y >= base + 1 && y <= base + 6) return y === base + 4 ? BLOCK.GILDED : BLOCK.MARBLE;
+      if (y === base + 7 && Math.max(Math.abs(dx), Math.abs(dz)) <= 4 && (Math.abs(dx) + Math.abs(dz) >= 3)) return BLOCK.RUNE;
+      if (dx === 0 && dz === 0 && y >= base + 1 && y <= base + 5) return BLOCK.CRYSTAL;
+      return BLOCK.AIR;
+    }
+
+    function structureBlockAt(x, y, z) {
+      let block = citadelBlockAt(x, y, z);
+      if (block) return block;
+      block = worldTreeBlockAt(x, y, z);
+      if (block) return block;
+      block = floatingIslandBlockAt(x, y, z);
+      if (block) return block;
+      block = moonGateBlockAt(x, y, z);
+      if (block) return block;
+      block = dragonBoneBlockAt(x, y, z);
+      if (block) return block;
+      return shrineBlockAt(x, y, z);
+    }
+
+    const edits = new Map();
+    function blockKey(x, y, z) { return x + ',' + y + ',' + z; }
+
+    try {
+      const saved = JSON.parse(localStorage.getItem('mythos-voxel-edits-v1') || '[]');
+      for (const entry of saved) {
+        if (Array.isArray(entry) && entry.length === 2) edits.set(entry[0], entry[1]);
+      }
+    } catch (_) { /* A sandbox may disable storage. */ }
+
+    let saveTimer = 0;
+    function scheduleSave() {
+      clearTimeout(saveTimer);
+      saveTimer = setTimeout(() => {
+        try { localStorage.setItem('mythos-voxel-edits-v1', JSON.stringify(Array.from(edits.entries()).slice(-4000))); } catch (_) {}
+      }, 250);
+    }
+
+    function getBlock(x, y, z) {
+      const edited = edits.get(blockKey(x, y, z));
+      if (edited !== undefined) return edited;
+      const terrain = terrainBlockAt(x, y, z);
+      if (terrain) return terrain;
+      return structureBlockAt(x, y, z);
+    }
+
+    const textureUrls = {};
+    function makePixelTexture(base, accent, painter, seed = 1) {
+      const canvas = document.createElement('canvas');
+      canvas.width = 16;
+      canvas.height = 16;
+      const ctx = canvas.getContext('2d');
+      ctx.fillStyle = base;
+      ctx.fillRect(0, 0, 16, 16);
+      const random = mulberry32(seed);
+      for (let i = 0; i < 62; i++) {
+        const alpha = .07 + random() * .18;
+        ctx.fillStyle = accent.replace('ALPHA', alpha.toFixed(3));
+        ctx.fillRect(Math.floor(random() * 16), Math.floor(random() * 16), random() > .86 ? 2 : 1, 1);
+      }
+      if (painter) painter(ctx, random);
+      const texture = new THREE.CanvasTexture(canvas);
+      texture.magFilter = THREE.NearestFilter;
+      texture.minFilter = THREE.NearestFilter;
+      texture.generateMipmaps = false;
+      texture.encoding = THREE.sRGBEncoding;
+      textureUrls[seed] = canvas.toDataURL();
+      return texture;
+    }
+
+    const tex = {};
+    tex.dirt = makePixelTexture('#775136', 'rgba(39,24,18,ALPHA)', null, 11);
+    tex.grassTop = makePixelTexture('#5e8c45', 'rgba(194,217,101,ALPHA)', (ctx, random) => {
+      for (let i = 0; i < 18; i++) {
+        ctx.fillStyle = random() > .5 ? '#426f3d' : '#81a64f';
+        ctx.fillRect(Math.floor(random() * 16), Math.floor(random() * 16), 1, 1);
+      }
+    }, 12);
+    tex.grassSide = makePixelTexture('#775136', 'rgba(43,27,19,ALPHA)', (ctx, random) => {
+      ctx.fillStyle = '#5d8b45';
+      ctx.fillRect(0, 0, 16, 4);
+      for (let x = 0; x < 16; x++) {
+        if (random() > .27) {
+          ctx.fillStyle = random() > .5 ? '#537f42' : '#70984b';
+          ctx.fillRect(x, 4, 1, 1 + Math.floor(random() * 3));
+        }
+      }
+    }, 13);
+    tex.stone = makePixelTexture('#6d7578', 'rgba(22,31,35,ALPHA)', (ctx) => {
+      ctx.fillStyle = 'rgba(178,188,183,.22)';
+      ctx.fillRect(2, 3, 5, 1);
+      ctx.fillRect(11, 9, 3, 1);
+      ctx.fillRect(7, 13, 4, 1);
+    }, 14);
+    tex.marble = makePixelTexture('#d5d0bd', 'rgba(73,89,94,ALPHA)', (ctx) => {
+      ctx.strokeStyle = 'rgba(95,110,113,.34)';
+      ctx.lineWidth = 1;
+      ctx.beginPath();
+      ctx.moveTo(0, 12); ctx.lineTo(5, 9); ctx.lineTo(8, 5); ctx.lineTo(16, 3); ctx.stroke();
+      ctx.strokeStyle = 'rgba(255,248,219,.4)';
+      ctx.beginPath(); ctx.moveTo(4, 16); ctx.lineTo(9, 11); ctx.lineTo(16, 10); ctx.stroke();
+    }, 15);
+    tex.rune = makePixelTexture('#26384f', 'rgba(101,157,167,ALPHA)', (ctx) => {
+      ctx.strokeStyle = '#5bc4c2';
+      ctx.globalAlpha = .7;
+      ctx.lineWidth = 1;
+      ctx.beginPath();
+      ctx.moveTo(8, 2); ctx.lineTo(5, 7); ctx.lineTo(9, 7); ctx.lineTo(6, 14);
+      ctx.moveTo(8, 2); ctx.lineTo(11, 7); ctx.lineTo(8, 10); ctx.lineTo(11, 14);
+      ctx.stroke();
+      ctx.globalAlpha = 1;
+    }, 16);
+    tex.woodSide = makePixelTexture('#6f4a33', 'rgba(31,20,15,ALPHA)', (ctx) => {
+      ctx.fillStyle = 'rgba(41,25,17,.42)';
+      for (const x of [2, 7, 12]) ctx.fillRect(x, 0, 1, 16);
+      ctx.fillStyle = 'rgba(181,123,72,.25)';
+      ctx.fillRect(5, 0, 1, 16);
+    }, 17);
+    tex.woodTop = makePixelTexture('#906442', 'rgba(45,27,18,ALPHA)', (ctx) => {
+      ctx.strokeStyle = 'rgba(48,28,18,.55)';
+      ctx.strokeRect(3, 3, 10, 10);
+      ctx.strokeRect(6, 6, 4, 4);
+    }, 18);
+    tex.leaves = makePixelTexture('#466b52', 'rgba(147,205,121,ALPHA)', (ctx, random) => {
+      for (let i = 0; i < 17; i++) {
+        if (random() > .45) ctx.clearRect(Math.floor(random() * 16), Math.floor(random() * 16), 1, 1);
+      }
+    }, 19);
+    tex.sand = makePixelTexture('#b7a475', 'rgba(82,70,47,ALPHA)', null, 20);
+    tex.bone = makePixelTexture('#d7cfad', 'rgba(85,72,54,ALPHA)', (ctx) => {
+      ctx.fillStyle = 'rgba(248,239,200,.28)';
+      ctx.fillRect(2, 4, 7, 1);
+      ctx.fillRect(9, 11, 5, 1);
+    }, 21);
+    tex.gold = makePixelTexture('#bb913b', 'rgba(255,230,128,ALPHA)', (ctx) => {
+      ctx.fillStyle = 'rgba(255,235,153,.42)';
+      ctx.fillRect(2, 2, 12, 2);
+      ctx.fillRect(2, 2, 2, 12);
+    }, 22);
+
+    const mat = (map, options = {}) => new THREE.MeshStandardMaterial({ map, roughness: .88, metalness: 0, ...options });
+    const dirtMat = mat(tex.dirt);
+    const grassSideMat = mat(tex.grassSide);
+    const grassTopMat = mat(tex.grassTop);
+    const stoneMat = mat(tex.stone, { roughness: .96 });
+    const marbleMat = mat(tex.marble, { roughness: .72 });
+    const runeMat = mat(tex.rune, { roughness: .68, emissive: 0x0b3037, emissiveIntensity: .34 });
+    const crystalMat = new THREE.MeshStandardMaterial({ color: 0x77e4d8, roughness: .2, metalness: .08, emissive: 0x1ca49d, emissiveIntensity: 1.15, transparent: true, opacity: .9 });
+    const woodSideMat = mat(tex.woodSide);
+    const woodTopMat = mat(tex.woodTop);
+    const leavesMat = mat(tex.leaves, { color: 0x91b787, alphaTest: .36, transparent: true, side: THREE.DoubleSide });
+    const sandMat = mat(tex.sand, { roughness: 1 });
+    const boneMat = mat(tex.bone, { roughness: .85 });
+    const goldMat = mat(tex.gold, { roughness: .42, metalness: .62, emissive: 0x3a2305, emissiveIntensity: .25 });
+
+    const materials = {
+      [BLOCK.GRASS]: [grassSideMat, grassSideMat, grassTopMat, dirtMat, grassSideMat, grassSideMat],
+      [BLOCK.DIRT]: dirtMat,
+      [BLOCK.STONE]: stoneMat,
+      [BLOCK.MARBLE]: marbleMat,
+      [BLOCK.RUNE]: runeMat,
+      [BLOCK.CRYSTAL]: crystalMat,
+      [BLOCK.WOOD]: [woodSideMat, woodSideMat, woodTopMat, woodTopMat, woodSideMat, woodSideMat],
+      [BLOCK.LEAVES]: leavesMat,
+      [BLOCK.SAND]: sandMat,
+      [BLOCK.BONE]: boneMat,
+      [BLOCK.GILDED]: goldMat
+    };
+
+    const swatchTextures = {
+      [BLOCK.GRASS]: tex.grassTop.image.toDataURL(),
+      [BLOCK.DIRT]: tex.dirt.image.toDataURL(),
+      [BLOCK.STONE]: tex.stone.image.toDataURL(),
+      [BLOCK.MARBLE]: tex.marble.image.toDataURL(),
+      [BLOCK.RUNE]: tex.rune.image.toDataURL(),
+      [BLOCK.CRYSTAL]: (() => {
+        const c = document.createElement('canvas'); c.width = c.height = 16;
+        const g = c.getContext('2d');
+        const grad = g.createLinearGradient(0, 16, 16, 0);
+        grad.addColorStop(0, '#1e7779'); grad.addColorStop(.5, '#7de9d9'); grad.addColorStop(1, '#c7fff0');
+        g.fillStyle = grad; g.fillRect(0, 0, 16, 16);
+        g.fillStyle = 'rgba(255,255,255,.55)'; g.fillRect(4, 2, 2, 10);
+        return c.toDataURL();
+      })()
+    };
+
+    const geometry = new THREE.BoxGeometry(1, 1, 1);
+    const worldGroup = new THREE.Group();
+    scene.add(worldGroup);
+    const chunks = new Map();
+    let rayMeshes = [];
+    const buildQueue = [];
+    const queuedChunks = new Set();
+    const desiredChunks = new Set();
+    const instanceMatrix = new THREE.Matrix4();
+
+    function chunkKey(cx, cz) { return cx + ',' + cz; }
+    function chunkCoord(n) { return Math.floor(n / CHUNK); }
+
+    function isExposed(x, y, z) {
+      return !getBlock(x + 1, y, z) || !getBlock(x - 1, y, z) ||
+             !getBlock(x, y + 1, z) || !getBlock(x, y - 1, z) ||
+             !getBlock(x, y, z + 1) || !getBlock(x, y, z - 1);
+    }
+
+    function buildChunk(cx, cz) {
+      const key = chunkKey(cx, cz);
+      if (chunks.has(key)) removeChunk(key);
+      const buckets = new Map();
+      const x0 = cx * CHUNK;
+      const z0 = cz * CHUNK;
+
+      for (let x = x0; x < x0 + CHUNK; x++) {
+        for (let z = z0; z < z0 + CHUNK; z++) {
+          for (let y = 0; y <= MAX_BUILD_Y; y++) {
+            const type = getBlock(x, y, z);
+            if (!type || !isExposed(x, y, z)) continue;
+            if (!buckets.has(type)) buckets.set(type, []);
+            buckets.get(type).push([x, y, z]);
+          }
+        }
+      }
+
+      const group = new THREE.Group();
+      group.userData.chunkKey = key;
+      const meshes = [];
+      for (const [type, positions] of buckets) {
+        if (!positions.length) continue;
+        const mesh = new THREE.InstancedMesh(geometry, materials[type], positions.length);
+        mesh.userData.positions = positions;
+        mesh.userData.blockType = type;
+        for (let i = 0; i < positions.length; i++) {
+          const [x, y, z] = positions[i];
+          instanceMatrix.makeTranslation(x + .5, y + .5, z + .5);
+          mesh.setMatrixAt(i, instanceMatrix);
+        }
+        mesh.instanceMatrix.needsUpdate = true;
+        mesh.castShadow = type !== BLOCK.LEAVES;
+        mesh.receiveShadow = true;
+        mesh.frustumCulled = true;
+        group.add(mesh);
+        meshes.push(mesh);
+        rayMeshes.push(mesh);
+      }
+      worldGroup.add(group);
+      chunks.set(key, { group, meshes, cx, cz });
+    }
+
+    function removeChunk(key) {
+      const chunk = chunks.get(key);
+      if (!chunk) return;
+      worldGroup.remove(chunk.group);
+      const removing = new Set(chunk.meshes);
+      rayMeshes = rayMeshes.filter((mesh) => !removing.has(mesh));
+      chunks.delete(key);
+    }
+
+    function queueChunk(cx, cz) {
+      const key = chunkKey(cx, cz);
+      if (chunks.has(key) || queuedChunks.has(key)) return;
+      queuedChunks.add(key);
+      buildQueue.push({ cx, cz, key });
+    }
+
+    function refreshDesiredChunks(px, pz) {
+      const centerX = chunkCoord(px);
+      const centerZ = chunkCoord(pz);
+      desiredChunks.clear();
+      const pending = [];
+      for (let dx = -VIEW_RADIUS; dx <= VIEW_RADIUS; dx++) {
+        for (let dz = -VIEW_RADIUS; dz <= VIEW_RADIUS; dz++) {
+          const cx = centerX + dx;
+          const cz = centerZ + dz;
+          const key = chunkKey(cx, cz);
+          desiredChunks.add(key);
+          if (!chunks.has(key) && !queuedChunks.has(key)) pending.push({ cx, cz, d: dx * dx + dz * dz });
+        }
+      }
+      pending.sort((a, b) => a.d - b.d);
+      for (const item of pending) queueChunk(item.cx, item.cz);
+
+      for (const key of Array.from(chunks.keys())) {
+        if (!desiredChunks.has(key)) removeChunk(key);
+      }
+    }
+
+    function processBuildQueue() {
+      while (buildQueue.length) {
+        const next = buildQueue.shift();
+        queuedChunks.delete(next.key);
+        if (!desiredChunks.has(next.key) || chunks.has(next.key)) continue;
+        buildChunk(next.cx, next.cz);
+        break;
+      }
+      const progress = Math.min(100, Math.round(chunks.size / ((VIEW_RADIUS * 2 + 1) ** 2) * 100));
+      loadStatus.textContent = progress < 100 ? `正在编织地形 · ${progress}%` : '世界已生成 · 地形将随探索延展';
+    }
+
+    function rebuildAtBlock(x, z) {
+      const cx = chunkCoord(x);
+      const cz = chunkCoord(z);
+      const targets = [[cx, cz]];
+      if (((x % CHUNK) + CHUNK) % CHUNK === 0) targets.push([cx - 1, cz]);
+      if (((x % CHUNK) + CHUNK) % CHUNK === CHUNK - 1) targets.push([cx + 1, cz]);
+      if (((z % CHUNK) + CHUNK) % CHUNK === 0) targets.push([cx, cz - 1]);
+      if (((z % CHUNK) + CHUNK) % CHUNK === CHUNK - 1) targets.push([cx, cz + 1]);
+      for (const [tx, tz] of targets) {
+        if (chunks.has(chunkKey(tx, tz))) buildChunk(tx, tz);
+      }
+    }
+
+    const water = new THREE.Mesh(
+      new THREE.PlaneGeometry(250, 250, 1, 1),
+      new THREE.MeshPhysicalMaterial({
+        color: 0x246b76,
+        transparent: true,
+        opacity: .62,
+        roughness: .18,
+        metalness: .05,
+        clearcoat: 1,
+        clearcoatRoughness: .15,
+        side: THREE.DoubleSide,
+        depthWrite: false
+      })
+    );
+    water.rotation.x = -Math.PI / 2;
+    water.position.y = SEA_LEVEL + .58;
+    water.receiveShadow = true;
+    scene.add(water);
+
+    const portalMaterial = new THREE.ShaderMaterial({
+      transparent: true,
+      depthWrite: false,
+      side: THREE.DoubleSide,
+      uniforms: { uTime: { value: 0 } },
+      vertexShader: `
+        varying vec2 vUv;
+        void main() {
+          vUv = uv;
+          vec3 p = position;
+          gl_Position = projectionMatrix * modelViewMatrix * vec4(p, 1.0);
+        }
+      `,
+      fragmentShader: `
+        varying vec2 vUv;
+        uniform float uTime;
+        void main() {
+          vec2 p = (vUv - .5) * vec2(1.0, 1.15);
+          float r = length(p);
+          float a = atan(p.y, p.x);
+          float wave = sin(a * 7.0 - uTime * 1.4 + r * 24.0) * .5 + .5;
+          float mist = sin((p.x + p.y) * 19.0 + uTime * .7) * .5 + .5;
+          float edge = 1.0 - smoothstep(.34, .5, r);
+          vec3 col = mix(vec3(.16, .45, .52), vec3(.53, .30, .72), wave);
+          col += vec3(.45, .9, .78) * pow(mist, 7.0) * .45;
+          gl_FragColor = vec4(col, edge * (.42 + wave * .26));
+        }
+      `
+    });
+    const portal = new THREE.Mesh(new THREE.PlaneGeometry(11.3, 14.2, 1, 1), portalMaterial);
+    portal.position.set(36.5, 19, 30.53);
+    scene.add(portal);
+    const portalLight = new THREE.PointLight(0x4ed5c8, 1.8, 24, 2);
+    portalLight.position.set(36.5, 18, 29);
+    scene.add(portalLight);
+
+    const cloudMaterial = new THREE.MeshLambertMaterial({ color: 0xe0e5d5, transparent: true, opacity: .16, depthWrite: false });
+    const clouds = new THREE.Group();
+    const cloudRandom = mulberry32(0xC10DD5);
+    for (let i = 0; i < 16; i++) {
+      const cloud = new THREE.Group();
+      const pieces = 3 + Math.floor(cloudRandom() * 4);
+      for (let j = 0; j < pieces; j++) {
+        const cube = new THREE.Mesh(new THREE.BoxGeometry(5 + cloudRandom() * 8, 1.8 + cloudRandom() * 2, 4 + cloudRandom() * 6), cloudMaterial);
+        cube.position.set(j * 4 - pieces * 2, cloudRandom() * 2, (cloudRandom() - .5) * 5);
+        cloud.add(cube);
+      }
+      cloud.position.set((cloudRandom() - .5) * 180, 39 + cloudRandom() * 15, (cloudRandom() - .5) * 180);
+      cloud.userData.speed = .18 + cloudRandom() * .2;
+      clouds.add(cloud);
+    }
+    scene.add(clouds);
+
+    const moteCount = 180;
+    const motePositions = new Float32Array(moteCount * 3);
+    const moteSeeds = new Float32Array(moteCount);
+    const moteRandom = mulberry32(0xF1AEF1);
+    for (let i = 0; i < moteCount; i++) {
+      motePositions[i * 3] = (moteRandom() - .5) * 100;
+      motePositions[i * 3 + 1] = 6 + moteRandom() * 34;
+      motePositions[i * 3 + 2] = (moteRandom() - .5) * 100;
+      moteSeeds[i] = moteRandom() * Math.PI * 2;
+    }
+    const moteGeometry = new THREE.BufferGeometry();
+    moteGeometry.setAttribute('position', new THREE.BufferAttribute(motePositions, 3));
+    const motes = new THREE.Points(moteGeometry, new THREE.PointsMaterial({ color: 0x8be1c4, size: .14, transparent: true, opacity: .7, depthWrite: false }));
+    scene.add(motes);
+
+    const outline = new THREE.LineSegments(
+      new THREE.EdgesGeometry(new THREE.BoxGeometry(1.018, 1.018, 1.018)),
+      new THREE.LineBasicMaterial({ color: 0xf4d985, transparent: true, opacity: .95, depthTest: false })
+    );
+    outline.renderOrder = 20;
+    outline.visible = false;
+    scene.add(outline);
+
+    const hotbarTypes = [BLOCK.GRASS, BLOCK.DIRT, BLOCK.STONE, BLOCK.MARBLE, BLOCK.RUNE, BLOCK.CRYSTAL];
+    let selectedSlot = 0;
+
+    for (let i = 0; i < hotbarTypes.length; i++) {
+      const type = hotbarTypes[i];
+      const slot = document.createElement('div');
+      slot.className = 'slot' + (i === 0 ? ' selected' : '');
+      const swatch = document.createElement('div');
+      swatch.className = 'slot-swatch';
+      swatch.style.backgroundImage = `url(${swatchTextures[type]})`;
+      const key = document.createElement('span');
+      key.className = 'slot-key';
+      key.textContent = String(i + 1);
+      slot.append(swatch, key);
+      hotbarEl.appendChild(slot);
+    }
+
+    function selectSlot(index) {
+      selectedSlot = (index + hotbarTypes.length) % hotbarTypes.length;
+      Array.from(hotbarEl.children).forEach((slot, i) => slot.classList.toggle('selected', i === selectedSlot));
+      selectedNameEl.textContent = BLOCK_INFO[hotbarTypes[selectedSlot]].name;
+    }
+
+    const player = {
+      position: new THREE.Vector3(.5, 17, 27.5),
+      velocity: new THREE.Vector3(),
+      radius: .31,
+      height: 1.78,
+      eye: 1.62,
+      grounded: false,
+      yaw: 0,
+      pitch: -.04
+    };
+
+    const keys = Object.create(null);
+    let pointerLocked = false;
+
+    function playerCollides(position) {
+      const minX = Math.floor(position.x - player.radius);
+      const maxX = Math.floor(position.x + player.radius);
+      const minY = Math.floor(position.y + .02);
+      const maxY = Math.floor(position.y + player.height - .02);
+      const minZ = Math.floor(position.z - player.radius);
+      const maxZ = Math.floor(position.z + player.radius);
+      for (let x = minX; x <= maxX; x++) {
+        for (let y = minY; y <= maxY; y++) {
+          for (let z = minZ; z <= maxZ; z++) {
+            if (getBlock(x, y, z)) return true;
+          }
+        }
+      }
+      return false;
+    }
+
+    function moveAxis(axis, amount) {
+      const steps = Math.max(1, Math.ceil(Math.abs(amount) / .09));
+      const step = amount / steps;
+      for (let i = 0; i < steps; i++) {
+        player.position[axis] += step;
+        if (playerCollides(player.position)) {
+          player.position[axis] -= step;
+          player.velocity[axis] = 0;
+          return false;
+        }
+      }
+      return true;
+    }
+
+    function wouldBlockPlayer(x, y, z) {
+      const minX = player.position.x - player.radius;
+      const maxX = player.position.x + player.radius;
+      const minY = player.position.y;
+      const maxY = player.position.y + player.height;
+      const minZ = player.position.z - player.radius;
+      const maxZ = player.position.z + player.radius;
+      return x < maxX && x + 1 > minX && y < maxY && y + 1 > minY && z < maxZ && z + 1 > minZ;
+    }
+
+    const raycaster = new THREE.Raycaster();
+    raycaster.far = REACH;
+    let currentHit = null;
+    let lastRaycast = 0;
+
+    function updateRaycast(force = false) {
+      const now = performance.now();
+      if (!force && now - lastRaycast < 70) return;
+      lastRaycast = now;
+      raycaster.setFromCamera({ x: 0, y: 0 }, camera);
+      const hits = raycaster.intersectObjects(rayMeshes, false);
+      currentHit = null;
+      for (const hit of hits) {
+        if (hit.distance > REACH || hit.instanceId === undefined) continue;
+        const pos = hit.object.userData.positions[hit.instanceId];
+        if (!pos) continue;
+        currentHit = { hit, x: pos[0], y: pos[1], z: pos[2], type: hit.object.userData.blockType };
+        break;
+      }
+      if (currentHit) {
+        outline.position.set(currentHit.x + .5, currentHit.y + .5, currentHit.z + .5);
+        outline.visible = true;
+        targetLabelEl.textContent = `${BLOCK_INFO[currentHit.type]?.name || '未知方块'} · 左键破坏 / 右键放置`;
+      } else {
+        outline.visible = false;
+        targetLabelEl.textContent = '探索地平线上的神话遗迹';
+      }
+    }
+
+    const effects = [];
+    function spawnDebris(x, y, z, type) {
+      const color = BLOCK_INFO[type]?.color || 0xffffff;
+      for (let i = 0; i < 9; i++) {
+        const mesh = new THREE.Mesh(
+          new THREE.BoxGeometry(.1 + Math.random() * .09, .1 + Math.random() * .09, .1 + Math.random() * .09),
+          new THREE.MeshBasicMaterial({ color, transparent: true })
+        );
+        mesh.position.set(x + .5 + (Math.random() - .5) * .55, y + .5 + (Math.random() - .5) * .55, z + .5 + (Math.random() - .5) * .55);
+        scene.add(mesh);
+        effects.push({ mesh, velocity: new THREE.Vector3((Math.random() - .5) * 2.6, 1.5 + Math.random() * 2.2, (Math.random() - .5) * 2.6), life: .75 });
+      }
+    }
+
+    let audioContext = null;
+    function playTone(kind) {
+      try {
+        if (!audioContext) audioContext = new (window.AudioContext || window.webkitAudioContext)();
+        if (audioContext.state === 'suspended') audioContext.resume();
+        const oscillator = audioContext.createOscillator();
+        const gain = audioContext.createGain();
+        oscillator.type = kind === 'break' ? 'square' : 'sine';
+        oscillator.frequency.setValueAtTime(kind === 'break' ? 125 : 210, audioContext.currentTime);
+        oscillator.frequency.exponentialRampToValueAtTime(kind === 'break' ? 58 : 335, audioContext.currentTime + .09);
+        gain.gain.setValueAtTime(.045, audioContext.currentTime);
+        gain.gain.exponentialRampToValueAtTime(.001, audioContext.currentTime + .1);
+        oscillator.connect(gain).connect(audioContext.destination);
+        oscillator.start();
+        oscillator.stop(audioContext.currentTime + .11);
+      } catch (_) {}
+    }
+
+    function breakBlock() {
+      updateRaycast(true);
+      if (!currentHit || currentHit.y <= 0) return;
+      const { x, y, z, type } = currentHit;
+      edits.set(blockKey(x, y, z), BLOCK.AIR);
+      spawnDebris(x, y, z, type);
+      playTone('break');
+      rebuildAtBlock(x, z);
+      scheduleSave();
+      currentHit = null;
+    }
+
+    function placeBlock() {
+      updateRaycast(true);
+      if (!currentHit || !currentHit.hit.face) return;
+      const normal = currentHit.hit.face.normal;
+      const x = currentHit.x + Math.round(normal.x);
+      const y = currentHit.y + Math.round(normal.y);
+      const z = currentHit.z + Math.round(normal.z);
+      if (getBlock(x, y, z) || wouldBlockPlayer(x, y, z) || y < 0 || y > MAX_BUILD_Y) return;
+      const type = hotbarTypes[selectedSlot];
+      edits.set(blockKey(x, y, z), type);
+      playTone('place');
+      rebuildAtBlock(x, z);
+      scheduleSave();
+    }
+
+    const landmarks = [
+      {
+        x: 0, z: 0, radius: 28,
+        title: '曙光王城',
+        copy: '天空破碎之夜，七位守望者用月白石封存第一缕火。王城中央的星辉塔至今仍为迷途者指路。'
+      },
+      {
+        x: -38, z: -28, radius: 21,
+        title: '伊尔明世界树',
+        copy: '它的根系穿过所有时代。树冠垂落的晶体并非果实，而是世界尚未发生的记忆。'
+      },
+      {
+        x: 34, z: -28, radius: 22,
+        title: '苍穹浮岛圣殿',
+        copy: '浮岛被古老引力符文托举。八根月柱围绕星核，记录着天穹诸神最后一次议会。'
+      },
+      {
+        x: 36, z: 30, radius: 20,
+        title: '月海之门',
+        copy: '门后的潮汐没有水，只有缓慢流动的星光。符文环每隔一个纪元便短暂苏醒。'
+      },
+      {
+        x: -36, z: 30, radius: 22,
+        title: '古龙长眠地',
+        copy: '最后的云脊龙在这里坠落。它的肋骨仍保持飞行姿态，双角指向消失的北辰。'
+      }
+    ];
+    const discovered = new Set();
+    let toastTimer = 0;
+    let currentLore = null;
+
+    function showToast(message) {
+      toastEl.textContent = message;
+      toastEl.classList.add('show');
+      clearTimeout(toastTimer);
+      toastTimer = setTimeout(() => toastEl.classList.remove('show'), 3000);
+    }
+
+    function updateLore() {
+      let nearest = landmarks[0];
+      let nearestDistance = Infinity;
+      for (const landmark of landmarks) {
+        const distance = Math.hypot(player.position.x - landmark.x, player.position.z - landmark.z);
+        if (distance < nearestDistance) {
+          nearestDistance = distance;
+          nearest = landmark;
+        }
+        if (distance < landmark.radius && !discovered.has(landmark.title)) {
+          discovered.add(landmark.title);
+          showToast(`神话图鉴已更新：${landmark.title}`);
+        }
+      }
+      if (nearest !== currentLore) {
+        currentLore = nearest;
+        loreTitleEl.textContent = nearest.title;
+        loreCopyEl.textContent = nearest.copy;
+      }
+      loreIndexEl.textContent = `Myth archive · ${discovered.size}/${landmarks.length}`;
+
+      const dx = nearest.x - player.position.x;
+      const dz = nearest.z - player.position.z;
+      const targetAngle = Math.atan2(-dx, -dz);
+      let relative = targetAngle - player.yaw;
+      while (relative > Math.PI) relative -= Math.PI * 2;
+      while (relative < -Math.PI) relative += Math.PI * 2;
+      const direction = Math.abs(relative) < .22 ? '正前方' : relative > 0 ? '右前方' : '左前方';
+      compassEl.textContent = `${direction} · ${nearest.title} · ${Math.round(nearestDistance)}M`;
+    }
+
+    function biomeAt(x, z) {
+      if (Math.hypot(x, z) < 31) return '曙光王城领地';
+      if (Math.hypot(x + 38, z + 28) < 24) return '世界树荫庭';
+      if (Math.hypot(x - 34, z + 28) < 24) return '苍穹裂谷';
+      if (Math.hypot(x - 36, z - 30) < 20) return '月海门庭';
+      if (Math.hypot(x + 36, z - 30) < 22) return '龙骨荒原';
+      const moisture = biomeNoise.noise(x * .012, z * .012);
+      const h = heightAt(Math.floor(x), Math.floor(z));
+      if (h <= SEA_LEVEL + 1) return '镜潮浅滩';
+      if (h >= 21) return '风蚀峰脊';
+      return moisture > .16 ? '翡翠苔原' : moisture < -.18 ? '灰烬旷野' : '永暮高地';
+    }
+
+    document.addEventListener('keydown', (event) => {
+      keys[event.code] = true;
+      if (event.code === 'Space') event.preventDefault();
+      if (/^Digit[1-6]$/.test(event.code)) selectSlot(Number(event.code.slice(5)) - 1);
+    });
+
+    document.addEventListener('keyup', (event) => { keys[event.code] = false; });
+    document.addEventListener('mousemove', (event) => {
+      if (!pointerLocked) return;
+      player.yaw -= event.movementX * .00205;
+      player.pitch -= event.movementY * .00205;
+      player.pitch = Math.max(-Math.PI / 2 + .015, Math.min(Math.PI / 2 - .015, player.pitch));
+    });
+
+    renderer.domElement.addEventListener('mousedown', (event) => {
+      if (!pointerLocked) return;
+      if (event.button === 0) breakBlock();
+      if (event.button === 2) placeBlock();
+    });
+    renderer.domElement.addEventListener('contextmenu', (event) => event.preventDefault());
+    renderer.domElement.addEventListener('wheel', (event) => {
+      if (!pointerLocked) return;
+      selectSlot(selectedSlot + (event.deltaY > 0 ? 1 : -1));
+    }, { passive: true });
+
+    enterButton.addEventListener('click', () => {
+      renderer.domElement.requestPointerLock();
+      try {
+        if (!audioContext) audioContext = new (window.AudioContext || window.webkitAudioContext)();
+        audioContext.resume();
+      } catch (_) {}
+    });
+
+    document.addEventListener('pointerlockchange', () => {
+      pointerLocked = document.pointerLockElement === renderer.domElement;
+      startScreen.classList.toggle('hidden', pointerLocked);
+      document.body.classList.toggle('playing', pointerLocked);
+      enterButton.textContent = pointerLocked ? '已进入世界' : '继续探索';
+      if (!pointerLocked) {
+        keys.KeyW = keys.KeyA = keys.KeyS = keys.KeyD = keys.Space = false;
+      }
+    });
+
+    window.addEventListener('resize', () => {
+      camera.aspect = innerWidth / innerHeight;
+      camera.updateProjectionMatrix();
+      renderer.setSize(innerWidth, innerHeight);
+      renderer.setPixelRatio(Math.min(devicePixelRatio, 1.7));
+    });
+
+    let lastTime = performance.now();
+    let lastChunkX = Infinity;
+    let lastChunkZ = Infinity;
+    let hudClock = 0;
+
+    function updatePlayer(dt) {
+      const forwardInput = (keys.KeyW ? 1 : 0) - (keys.KeyS ? 1 : 0);
+      const rightInput = (keys.KeyD ? 1 : 0) - (keys.KeyA ? 1 : 0);
+      const length = Math.hypot(forwardInput, rightInput) || 1;
+      const forward = forwardInput / length;
+      const right = rightInput / length;
+      const speed = keys.ShiftLeft || keys.ShiftRight ? 9.2 : 5.7;
+      const desiredX = (-Math.sin(player.yaw) * forward + Math.cos(player.yaw) * right) * speed;
+      const desiredZ = (-Math.cos(player.yaw) * forward - Math.sin(player.yaw) * right) * speed;
+      const responsiveness = player.grounded ? 15 : 5;
+      player.velocity.x += (desiredX - player.velocity.x) * Math.min(1, responsiveness * dt);
+      player.velocity.z += (desiredZ - player.velocity.z) * Math.min(1, responsiveness * dt);
+
+      player.grounded = playerCollides(new THREE.Vector3(player.position.x, player.position.y - .075, player.position.z));
+      if (player.grounded && player.velocity.y < 0) player.velocity.y = 0;
+      if (player.grounded && keys.Space) {
+        player.velocity.y = 8.3;
+        player.grounded = false;
+        keys.Space = false;
+      }
+      player.velocity.y -= 23 * dt;
+      player.velocity.y = Math.max(player.velocity.y, -32);
+
+      moveAxis('x', player.velocity.x * dt);
+      moveAxis('z', player.velocity.z * dt);
+      const verticalMoved = moveAxis('y', player.velocity.y * dt);
+      if (!verticalMoved && player.velocity.y <= 0) player.grounded = true;
+
+      if (player.position.y < -15) {
+        player.position.set(.5, 17, 27.5);
+        player.velocity.set(0, 0, 0);
+      }
+
+      camera.position.set(player.position.x, player.position.y + player.eye, player.position.z);
+      camera.rotation.y = player.yaw;
+      camera.rotation.x = player.pitch;
+    }
+
+    function updateEffects(dt) {
+      for (let i = effects.length - 1; i >= 0; i--) {
+        const effect = effects[i];
+        effect.life -= dt;
+        effect.velocity.y -= 7 * dt;
+        effect.mesh.position.addScaledVector(effect.velocity, dt);
+        effect.mesh.rotation.x += dt * 5;
+        effect.mesh.rotation.y += dt * 7;
+        effect.mesh.material.opacity = Math.max(0, effect.life / .75);
+        if (effect.life <= 0) {
+          scene.remove(effect.mesh);
+          effect.mesh.geometry.dispose();
+          effect.mesh.material.dispose();
+          effects.splice(i, 1);
+        }
+      }
+    }
+
+    function animate(now) {
+      requestAnimationFrame(animate);
+      const dt = Math.min(.05, (now - lastTime) / 1000 || .016);
+      lastTime = now;
+
+      if (pointerLocked) updatePlayer(dt);
+      else {
+        camera.position.set(player.position.x, player.position.y + player.eye, player.position.z);
+        camera.rotation.y = player.yaw;
+        camera.rotation.x = player.pitch;
+      }
+
+      const cx = chunkCoord(player.position.x);
+      const cz = chunkCoord(player.position.z);
+      if (cx !== lastChunkX || cz !== lastChunkZ) {
+        lastChunkX = cx;
+        lastChunkZ = cz;
+        refreshDesiredChunks(player.position.x, player.position.z);
+      }
+      processBuildQueue();
+      updateRaycast();
+      updateEffects(dt);
+
+      hudClock += dt;
+      if (hudClock > .18) {
+        hudClock = 0;
+        biomeEl.textContent = biomeAt(player.position.x, player.position.z);
+        coordsEl.textContent = `X ${Math.floor(player.position.x)} · Y ${Math.floor(player.position.y)} · Z ${Math.floor(player.position.z)} · ${chunks.size} 区块`;
+        updateLore();
+      }
+
+      const t = now * .001;
+      sky.material.uniforms.uTime.value = t;
+      portalMaterial.uniforms.uTime.value = t;
+      crystalMat.emissiveIntensity = 1.02 + Math.sin(t * 2.1) * .18;
+      portalLight.intensity = 1.65 + Math.sin(t * 1.7) * .35;
+      water.material.opacity = .59 + Math.sin(t * .7) * .025;
+      water.position.x = Math.round(player.position.x / 20) * 20;
+      water.position.z = Math.round(player.position.z / 20) * 20;
+      sky.position.copy(camera.position);
+      celestial.position.set(camera.position.x, camera.position.y, camera.position.z);
+
+      sun.position.set(player.position.x - 55, 88, player.position.z + 36);
+      sun.target.position.set(player.position.x, 0, player.position.z);
+      sun.target.updateMatrixWorld();
+
+      clouds.children.forEach((cloud) => {
+        cloud.position.x += cloud.userData.speed * dt;
+        const dx = cloud.position.x - player.position.x;
+        const dz = cloud.position.z - player.position.z;
+        if (dx > 105) cloud.position.x -= 210;
+        if (dx < -105) cloud.position.x += 210;
+        if (dz > 105) cloud.position.z -= 210;
+        if (dz < -105) cloud.position.z += 210;
+      });
+
+      const pos = moteGeometry.attributes.position.array;
+      for (let i = 0; i < moteCount; i++) {
+        pos[i * 3 + 1] += Math.sin(t * 1.1 + moteSeeds[i]) * .0025;
+        pos[i * 3] += Math.sin(t * .43 + moteSeeds[i]) * .0015;
+      }
+      moteGeometry.attributes.position.needsUpdate = true;
+      motes.position.x = Math.round(player.position.x / 70) * 70;
+      motes.position.z = Math.round(player.position.z / 70) * 70;
+
+      renderer.render(scene, camera);
+    }
+
+    refreshDesiredChunks(player.position.x, player.position.z);
+    updateLore();
+    selectSlot(0);
+    requestAnimationFrame(animate);
+  })();
+  </script>
+</body>
+</html>
diff --git a/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-coastal-ride.svg b/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-coastal-ride.svg
new file mode 100644
index 0000000..76c193c
--- /dev/null
+++ b/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-coastal-ride.svg
@@ -0,0 +1,320 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 1000" role="img" aria-labelledby="title desc">
+  <title id="title">海边骑自行车的鹈鹕</title>
+  <desc id="desc">一只羽毛细腻的鹈鹕迎着海风骑过金色海岸，浪花、飞鸟与自行车的转动让画面充满活力。</desc>
+
+  <defs>
+    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#4aa8db"/>
+      <stop offset=".5" stop-color="#9fd8e8"/>
+      <stop offset="1" stop-color="#f9d5ad"/>
+    </linearGradient>
+    <radialGradient id="sunGlow">
+      <stop offset="0" stop-color="#fffbd1" stop-opacity=".95"/>
+      <stop offset=".28" stop-color="#ffd88c" stop-opacity=".55"/>
+      <stop offset="1" stop-color="#ffd88c" stop-opacity="0"/>
+    </radialGradient>
+    <linearGradient id="sea" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#187fa8"/>
+      <stop offset=".45" stop-color="#159bb0"/>
+      <stop offset="1" stop-color="#58c1bc"/>
+    </linearGradient>
+    <linearGradient id="sand" x1="0" y1="0" x2=".8" y2="1">
+      <stop offset="0" stop-color="#d4a25f"/>
+      <stop offset=".45" stop-color="#e9c681"/>
+      <stop offset="1" stop-color="#b9773d"/>
+    </linearGradient>
+    <linearGradient id="road" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#d7ac6d"/>
+      <stop offset=".55" stop-color="#f1d09b"/>
+      <stop offset="1" stop-color="#bc7748"/>
+    </linearGradient>
+    <linearGradient id="beakTop" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#f4b56c"/>
+      <stop offset=".48" stop-color="#df8652"/>
+      <stop offset="1" stop-color="#a94c38"/>
+    </linearGradient>
+    <linearGradient id="pouch" x1="0" y1="0" x2=".5" y2="1">
+      <stop offset="0" stop-color="#eeaa72"/>
+      <stop offset=".55" stop-color="#d87861"/>
+      <stop offset="1" stop-color="#9c4651"/>
+    </linearGradient>
+    <radialGradient id="bodyFeather" cx="35%" cy="30%" r="75%">
+      <stop offset="0" stop-color="#fffdf1"/>
+      <stop offset=".45" stop-color="#ebe9dd"/>
+      <stop offset=".78" stop-color="#c9ced0"/>
+      <stop offset="1" stop-color="#858f95"/>
+    </radialGradient>
+    <linearGradient id="neckFeather" x1="0" y1="0" x2="1" y2=".75">
+      <stop offset="0" stop-color="#fffdf3"/>
+      <stop offset=".58" stop-color="#e9e7da"/>
+      <stop offset="1" stop-color="#b5bdbe"/>
+    </linearGradient>
+    <linearGradient id="wingFeather" x1=".25" y1="0" x2=".8" y2="1">
+      <stop offset="0" stop-color="#faf8ea"/>
+      <stop offset=".42" stop-color="#d7d8d1"/>
+      <stop offset=".75" stop-color="#929ba0"/>
+      <stop offset="1" stop-color="#4f5d64"/>
+    </linearGradient>
+    <linearGradient id="bikePaint" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#184b52"/>
+      <stop offset=".45" stop-color="#31a59a"/>
+      <stop offset=".7" stop-color="#0c6f72"/>
+      <stop offset="1" stop-color="#073f48"/>
+    </linearGradient>
+    <linearGradient id="metal" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#f4faf8"/>
+      <stop offset=".3" stop-color="#70878b"/>
+      <stop offset=".58" stop-color="#d4e1df"/>
+      <stop offset="1" stop-color="#42575b"/>
+    </linearGradient>
+    <radialGradient id="tire" cx="35%" cy="30%">
+      <stop offset="0" stop-color="#536166"/>
+      <stop offset=".65" stop-color="#1f292c"/>
+      <stop offset="1" stop-color="#090d0e"/>
+    </radialGradient>
+    <filter id="soft" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="12"/>
+    </filter>
+    <filter id="shadow" x="-30%" y="-30%" width="170%" height="180%">
+      <feDropShadow dx="0" dy="12" stdDeviation="12" flood-color="#233536" flood-opacity=".32"/>
+    </filter>
+    <filter id="smallShadow" x="-30%" y="-30%" width="170%" height="180%">
+      <feDropShadow dx="2" dy="5" stdDeviation="4" flood-color="#20363a" flood-opacity=".38"/>
+    </filter>
+    <filter id="waterTexture" x="-10%" y="-20%" width="120%" height="150%">
+      <feTurbulence type="fractalNoise" baseFrequency=".012 .08" numOctaves="2" seed="7" result="noise"/>
+      <feColorMatrix in="noise" values="1 0 0 0 .15  0 1 0 0 .35  0 0 1 0 .42  0 0 0 .24 0" result="colored"/>
+      <feBlend in="SourceGraphic" in2="colored" mode="soft-light"/>
+    </filter>
+    <filter id="grain" x="-10%" y="-10%" width="120%" height="120%">
+      <feTurbulence type="fractalNoise" baseFrequency=".55" numOctaves="2" seed="12" result="n"/>
+      <feColorMatrix in="n" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 .09 0"/>
+      <feBlend in="SourceGraphic" mode="multiply"/>
+    </filter>
+    <clipPath id="oceanClip">
+      <path d="M0 384 C350 375 580 395 835 384 C1110 373 1340 388 1600 374 L1600 725 C1280 735 950 687 700 657 C420 623 210 598 0 620Z"/>
+    </clipPath>
+    <pattern id="roadSpecks" width="74" height="58" patternUnits="userSpaceOnUse">
+      <circle cx="9" cy="13" r="2.2" fill="#885b39" opacity=".22"/>
+      <circle cx="48" cy="29" r="1.4" fill="#fff0c4" opacity=".45"/>
+      <path d="M20 49l10-3M61 8l6-2" stroke="#9b6841" stroke-width="2" stroke-linecap="round" opacity=".2"/>
+    </pattern>
+    <g id="spokeSet" stroke="#afc1c1" stroke-width="2" opacity=".78">
+      <path d="M0-151V151M-151 0H151M-107-107L107 107M107-107L-107 107M-139-58L139 58M-139 58L139-58M-58-139L58 139M58-139L-58 139"/>
+    </g>
+    <path id="featherLine" d="M0 0 C18 8 34 8 52 0 C35 22 17 24 0 0Z"/>
+  </defs>
+
+  <style>
+    .wheel { transform-box: fill-box; transform-origin: center; animation: wheel-spin 2.4s linear infinite; }
+    .wave-a { animation: wave-slide 6s ease-in-out infinite alternate; }
+    .wave-b { animation: wave-slide 8s ease-in-out -2s infinite alternate-reverse; }
+    .cloud { animation: cloud-drift 18s ease-in-out infinite alternate; }
+    .scarf-tip { transform-origin: 760px 355px; animation: flutter 1.3s ease-in-out infinite alternate; }
+    .bird { animation: bird-lift 3s ease-in-out infinite alternate; }
+    @keyframes wheel-spin { to { transform: rotate(360deg); } }
+    @keyframes wave-slide { to { transform: translateX(24px); } }
+    @keyframes cloud-drift { to { transform: translateX(18px); } }
+    @keyframes flutter { to { transform: rotate(4deg) translateY(-5px); } }
+    @keyframes bird-lift { to { transform: translateY(-8px); } }
+    @media (prefers-reduced-motion: reduce) {
+      .wheel,.wave-a,.wave-b,.cloud,.scarf-tip,.bird { animation: none; }
+    }
+  </style>
+
+  <!-- sky and late-afternoon light -->
+  <rect width="1600" height="1000" fill="url(#sky)"/>
+  <circle cx="1270" cy="170" r="230" fill="url(#sunGlow)"/>
+  <circle cx="1270" cy="170" r="53" fill="#fff3b4" opacity=".92"/>
+  <path d="M0 327 C220 302 430 331 605 313 C830 290 1030 329 1236 301 C1380 281 1495 294 1600 283 L1600 410 L0 410Z" fill="#ffe2bd" opacity=".23"/>
+
+  <g class="cloud" fill="#fff" opacity=".7" filter="url(#soft)">
+    <path d="M95 210 C140 166 193 187 214 218 C242 176 326 188 329 241 C379 235 410 263 421 294 H76 C60 258 72 230 95 210Z"/>
+    <path d="M1160 294 C1190 261 1233 271 1249 301 C1280 255 1350 270 1354 318 C1398 309 1432 335 1441 366 H1129 C1121 336 1135 308 1160 294Z" opacity=".5"/>
+  </g>
+  <g fill="none" stroke="#345e67" stroke-width="5" stroke-linecap="round" opacity=".72">
+    <path class="bird" d="M243 281q19-20 38 0q19-20 38 0"/>
+    <path class="bird" d="M356 225q13-14 26 0q13-14 26 0" style="animation-delay:-1.4s"/>
+    <path class="bird" d="M1425 249q16-17 32 0q16-17 32 0" style="animation-delay:-.7s"/>
+  </g>
+
+  <!-- distant cape -->
+  <path d="M0 360 C94 343 178 348 253 373 C302 389 347 407 408 417 L0 476Z" fill="#627d6c"/>
+  <path d="M0 356 C97 338 180 352 260 379 C176 372 106 385 0 408Z" fill="#8ba176"/>
+  <path d="M0 397 C121 383 219 391 404 417 L380 447 L0 471Z" fill="#4e665d" opacity=".72"/>
+
+  <!-- ocean -->
+  <path d="M0 384 C350 375 580 395 835 384 C1110 373 1340 388 1600 374 L1600 725 C1280 735 950 687 700 657 C420 623 210 598 0 620Z" fill="url(#sea)" filter="url(#waterTexture)"/>
+  <g clip-path="url(#oceanClip)" fill="none" stroke-linecap="round">
+    <path class="wave-a" d="M-70 440 C80 416 175 459 310 438 S550 414 670 442 S915 457 1055 429 S1320 419 1670 443" stroke="#d8f5ed" stroke-width="8" opacity=".52"/>
+    <path class="wave-b" d="M-50 495 C120 468 249 518 408 493 S701 478 852 509 S1160 488 1270 478 S1498 487 1660 505" stroke="#e9fcf1" stroke-width="10" opacity=".58"/>
+    <path class="wave-a" d="M-100 553 C70 518 200 577 377 548 S662 539 815 567 S1118 548 1244 537 S1485 544 1700 568" stroke="#f8fff4" stroke-width="15" opacity=".73" style="animation-delay:-3s"/>
+    <path class="wave-b" d="M-70 605 C96 568 240 627 412 601 S720 587 897 620 S1213 596 1370 590 S1540 602 1680 618" stroke="#e8fff2" stroke-width="20" opacity=".75"/>
+    <g stroke="#bceae1" stroke-width="4" opacity=".55">
+      <path d="M78 468l72-6M485 420l95 5M722 476l86-8M988 443l120 2M1295 522l112-7M205 539l79-5M579 588l109-8M1138 575l75 2"/>
+    </g>
+  </g>
+  <path d="M0 593 C165 565 311 598 461 621 C573 638 669 645 769 662 C535 671 329 690 0 728Z" fill="#f7f1d0" opacity=".9"/>
+  <path d="M0 620 C179 586 320 629 470 647 C600 663 707 667 820 688 C574 683 306 723 0 761Z" fill="#d7b878" opacity=".62"/>
+
+  <!-- beach and winding coastal path -->
+  <path d="M0 603 C230 611 426 666 606 693 C837 727 1076 712 1600 621 L1600 1000 L0 1000Z" fill="url(#sand)"/>
+  <path d="M0 720 C252 674 469 706 662 724 C912 747 1189 705 1600 641 L1600 1000 L0 1000Z" fill="url(#road)"/>
+  <path d="M0 720 C252 674 469 706 662 724 C912 747 1189 705 1600 641 L1600 1000 L0 1000Z" fill="url(#roadSpecks)" opacity=".8"/>
+  <path d="M0 714 C219 676 424 696 617 719" fill="none" stroke="#fff0c7" stroke-width="12" opacity=".48"/>
+  <path d="M1250 701 C1370 679 1490 657 1600 640" fill="none" stroke="#9e623c" stroke-width="6" opacity=".28"/>
+
+  <!-- grasses and rocks -->
+  <g fill="none" stroke-linecap="round">
+    <g stroke="#59784e" stroke-width="8">
+      <path d="M78 675q8-58 17-91M81 671q-18-45-35-68M92 667q29-47 52-69M1490 672q-5-58-4-103M1490 669q-29-49-52-78M1501 669q26-50 55-83"/>
+    </g>
+    <g stroke="#93a95f" stroke-width="5">
+      <path d="M121 688q5-45 18-79M119 686q-20-28-38-44M1431 684q4-55 17-90M1438 677q24-35 45-49M1544 675q-8-49-3-82"/>
+    </g>
+  </g>
+  <g filter="url(#smallShadow)">
+    <path d="M73 728q34-76 96-31q29 28-3 65H76Z" fill="#6f7165"/>
+    <path d="M83 722q38-55 80-25q-43-2-72 39Z" fill="#a5a08a"/>
+    <path d="M1427 751q23-73 91-57q50 15 45 77h-138Z" fill="#686d66"/>
+    <path d="M1443 733q25-45 73-33q-44 6-66 44Z" fill="#a4a08b"/>
+  </g>
+
+  <!-- cast shadow -->
+  <ellipse cx="884" cy="896" rx="415" ry="66" fill="#263f3d" opacity=".24" filter="url(#soft)"/>
+  <path d="M451 863 C625 827 1064 830 1324 874" fill="none" stroke="#5d4737" stroke-width="23" stroke-linecap="round" opacity=".19" filter="url(#soft)"/>
+
+  <!-- bicycle wheels -->
+  <g filter="url(#smallShadow)">
+    <g class="wheel" transform="translate(615 755)">
+      <circle r="170" fill="none" stroke="url(#tire)" stroke-width="25"/>
+      <circle r="154" fill="none" stroke="#c9d8d6" stroke-width="5"/>
+      <use href="#spokeSet"/>
+      <circle r="19" fill="url(#metal)" stroke="#23393d" stroke-width="5"/>
+      <circle r="7" fill="#d9eee9"/>
+    </g>
+    <g class="wheel" transform="translate(1126 755)">
+      <circle r="170" fill="none" stroke="url(#tire)" stroke-width="25"/>
+      <circle r="154" fill="none" stroke="#c9d8d6" stroke-width="5"/>
+      <use href="#spokeSet"/>
+      <circle r="19" fill="url(#metal)" stroke="#23393d" stroke-width="5"/>
+      <circle r="7" fill="#d9eee9"/>
+    </g>
+  </g>
+
+  <!-- bicycle frame -->
+  <g fill="none" stroke-linecap="round" stroke-linejoin="round" filter="url(#smallShadow)">
+    <path d="M615 755 L805 574 L861 746 L615 755 M805 574 L1010 591 L861 746 L982 701Z" stroke="#072f36" stroke-width="24"/>
+    <path d="M615 755 L805 574 L861 746 L615 755 M805 574 L1010 591 L861 746 L982 701Z" stroke="url(#bikePaint)" stroke-width="15"/>
+    <path d="M982 701 L1126 755 M1010 591 L1126 755" stroke="#243b3f" stroke-width="18"/>
+    <path d="M985 699 L1126 755 M1009 591 L1126 755" stroke="url(#metal)" stroke-width="10"/>
+    <path d="M982 701 L1010 591 L1038 517 L1092 496" stroke="#183b40" stroke-width="17"/>
+    <path d="M982 701 L1010 591 L1038 517 L1092 496" stroke="url(#bikePaint)" stroke-width="10"/>
+    <path d="M1060 493q32 16 55-5" stroke="#1e3033" stroke-width="12"/>
+    <path d="M783 570l28 4l-17-69" stroke="#273c3f" stroke-width="12"/>
+    <path d="M752 500q49-9 88 4" stroke="#2e2924" stroke-width="22"/>
+    <path d="M758 495q44-7 76 3" stroke="#70523a" stroke-width="9"/>
+  </g>
+  <!-- chain and crank -->
+  <g fill="none" stroke-linecap="round">
+    <path d="M615 745 C695 721 784 717 861 733 C784 759 692 770 615 765Z" stroke="#283638" stroke-width="6" opacity=".9"/>
+    <circle cx="861" cy="746" r="31" stroke="#d3ddda" stroke-width="7"/>
+    <circle cx="861" cy="746" r="8" fill="#26383b" stroke="none"/>
+    <path d="M861 746l61-27M861 746l-61 27" stroke="url(#metal)" stroke-width="9"/>
+    <path d="M913 714h38M770 779h38" stroke="#263538" stroke-width="11"/>
+  </g>
+  <g fill="#d9eee8" stroke="#304649" stroke-width="4">
+    <path d="M928 702h43v17h-43z"/>
+    <path d="M749 777h43v17h-43z"/>
+  </g>
+
+  <!-- pelican tail and body -->
+  <g filter="url(#shadow)">
+    <path d="M766 474 C709 445 653 434 598 448 C653 468 678 490 704 525 C664 519 635 527 609 548 C676 558 731 555 788 527Z" fill="#c7cecb" stroke="#69787d" stroke-width="5"/>
+    <path d="M732 461q-59-14-106-3q54 15 90 45M721 514q-45 1-78 21q58 2 91-3" fill="none" stroke="#eef0e7" stroke-width="12" stroke-linecap="round" opacity=".72"/>
+    <path d="M734 473 C738 393 800 352 878 365 C963 378 1022 445 1000 517 C980 583 905 620 814 585 C758 564 725 526 734 473Z" fill="url(#bodyFeather)" stroke="#68767a" stroke-width="6"/>
+    <path d="M748 421 C787 376 864 367 925 397 C854 396 794 423 754 475Z" fill="#fffdf1" opacity=".73"/>
+    <path d="M768 535 C817 576 897 592 962 547 C923 607 821 620 768 566Z" fill="#77848a" opacity=".48"/>
+  </g>
+
+  <!-- layered body plumage -->
+  <g fill="none" stroke-linecap="round" opacity=".7">
+    <path d="M755 446q42 24 84 1M746 478q49 26 96 4M757 514q44 29 93 11M789 554q47 25 95 7" stroke="#adb6b5" stroke-width="8"/>
+    <path d="M775 423q38 22 77 3M822 396q32 19 67 7M867 432q41 27 78 10M872 475q53 27 98 8M862 527q53 25 96 1" stroke="#f9f6e8" stroke-width="9"/>
+  </g>
+  <g fill="#c6cdcb" opacity=".5">
+    <use href="#featherLine" transform="translate(775 453) rotate(8) scale(.75)"/>
+    <use href="#featherLine" transform="translate(841 422) rotate(9) scale(.8)"/>
+    <use href="#featherLine" transform="translate(882 462) rotate(12) scale(.95)"/>
+    <use href="#featherLine" transform="translate(804 508) rotate(14) scale(.85)"/>
+    <use href="#featherLine" transform="translate(888 521) rotate(10) scale(.9)"/>
+  </g>
+
+  <!-- legs behind the near wing -->
+  <g fill="none" stroke="#c66f4e" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" filter="url(#smallShadow)">
+    <path d="M835 559 C836 618 868 662 919 715"/>
+    <path d="M884 565 C883 642 845 718 797 780"/>
+  </g>
+  <g fill="#df8c60" stroke="#8f4f42" stroke-width="5" stroke-linejoin="round">
+    <path d="M907 703q25-11 56 8l-14 13q-26 7-46-2Z"/>
+    <path d="M783 769q23-6 51 9l-14 16q-31 5-49-6Z"/>
+  </g>
+
+  <!-- neck, built as an S curve -->
+  <path d="M821 444 C807 394 816 346 854 318 C887 294 915 292 939 274 C960 258 965 236 981 211 C1000 180 1045 169 1081 191 C1118 213 1120 254 1100 281 C1079 309 1044 321 1018 336 C977 359 968 404 965 453 C959 493 922 512 887 490 C866 478 847 462 821 444Z" fill="url(#neckFeather)" stroke="#68777a" stroke-width="6" filter="url(#shadow)"/>
+  <path d="M837 429 C828 380 844 348 878 326 C915 302 944 301 969 270 C986 249 987 215 1015 197 C976 210 970 251 941 274 C914 295 877 296 848 323 C813 356 811 401 821 444Z" fill="#fffdf0" opacity=".77"/>
+  <g fill="none" stroke-linecap="round">
+    <path d="M837 394q34 21 65 4M841 354q38 18 68 0M881 315q25 18 52 9M927 285q23 15 46 5M972 251q23 13 42 2" stroke="#cbd0cb" stroke-width="8" opacity=".7"/>
+    <path d="M861 438q42 28 79 13M874 474q37 24 67 4" stroke="#f9f6e8" stroke-width="9" opacity=".72"/>
+  </g>
+
+  <!-- head and crest -->
+  <path d="M994 208 C1010 163 1065 142 1111 163 C1139 177 1155 211 1142 240 C1129 270 1084 282 1045 269 C1006 257 982 239 994 208Z" fill="url(#neckFeather)" stroke="#68777a" stroke-width="6" filter="url(#smallShadow)"/>
+  <path d="M1007 199 C1026 166 1068 154 1108 169 C1071 165 1040 182 1026 215Z" fill="#fffdf3" opacity=".8"/>
+  <path d="M1014 174q-17-32-4-62q14 26 28 49q0-42 21-66q-2 37 5 64q18-42 47-58q-18 37-23 65" fill="#f5f1e4" stroke="#788587" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"/>
+
+  <!-- bill and throat pouch -->
+  <path d="M1109 203 C1192 197 1319 205 1444 234 C1463 239 1467 250 1446 255 C1328 279 1206 275 1113 260 C1084 256 1080 213 1109 203Z" fill="url(#beakTop)" stroke="#83483e" stroke-width="6" filter="url(#smallShadow)"/>
+  <path d="M1111 230 C1213 231 1318 240 1448 246 C1371 263 1245 279 1139 268 C1106 265 1093 251 1111 230Z" fill="url(#pouch)" stroke="#8f4d4b" stroke-width="5"/>
+  <path d="M1124 241 C1224 244 1322 247 1424 248" fill="none" stroke="#703e3d" stroke-width="4" opacity=".72"/>
+  <path d="M1151 216 C1241 215 1328 225 1417 242" fill="none" stroke="#ffd5a5" stroke-width="7" stroke-linecap="round" opacity=".53"/>
+  <path d="M1444 234q31 7 10 24l-31-10Z" fill="#8b493b"/>
+
+  <!-- eye -->
+  <ellipse cx="1106" cy="200" rx="18" ry="16" fill="#f1dd88" stroke="#6a5b3d" stroke-width="5"/>
+  <circle cx="1110" cy="200" r="8" fill="#111819"/>
+  <circle cx="1114" cy="195" r="3" fill="#fff"/>
+  <path d="M1087 183q23-11 41 2" fill="none" stroke="#6a7474" stroke-width="7" stroke-linecap="round"/>
+
+  <!-- wind scarf -->
+  <path d="M843 339 C812 348 787 362 763 388 C732 371 686 350 631 350 C682 323 732 318 788 333 C807 318 826 309 846 307Z" fill="#d84c3f" stroke="#853c39" stroke-width="5" filter="url(#smallShadow)"/>
+  <path class="scarf-tip" d="M765 386 C717 373 669 386 626 412 C657 377 674 350 631 350 C688 351 732 368 765 386Z" fill="#ef6651" stroke="#8f3f3b" stroke-width="5"/>
+  <path d="M791 333q22 18 48 11" fill="none" stroke="#ff8b6c" stroke-width="7" stroke-linecap="round" opacity=".7"/>
+
+  <!-- near wing reaches the handlebars -->
+  <path d="M838 426 C904 420 970 452 1021 494 C1045 513 1061 523 1095 516 C1112 513 1124 530 1112 543 C1095 561 1062 560 1033 547 C980 523 930 511 865 521 C813 529 789 486 810 450 C817 438 826 430 838 426Z" fill="url(#wingFeather)" stroke="#59666b" stroke-width="7" filter="url(#shadow)"/>
+  <path d="M838 445 C903 445 958 470 1012 510 C962 492 910 485 846 501Z" fill="#f4f2e6" opacity=".65"/>
+  <g fill="none" stroke-linecap="round">
+    <path d="M834 465q81 1 147 49M836 492q69-2 129 29M862 515q58-3 101 11" stroke="#747f83" stroke-width="9" opacity=".72"/>
+    <path d="M851 445q69 8 126 46M885 449q66 13 113 51" stroke="#f9f6e9" stroke-width="8" opacity=".72"/>
+  </g>
+  <!-- wingtip curled around grip -->
+  <path d="M1035 520q39 25 76 4q16-8 26 8q8 15-10 27q-50 28-101-7Z" fill="#747f82" stroke="#4c5a5f" stroke-width="6"/>
+  <path d="M1084 533q20 8 37-1" fill="none" stroke="#dce0da" stroke-width="7" stroke-linecap="round"/>
+
+  <!-- foreground motion details -->
+  <g fill="none" stroke="#fff3cf" stroke-linecap="round" opacity=".62">
+    <path d="M260 837h170M190 880h118M1260 845h186" stroke-width="11"/>
+    <path d="M347 917h205M1189 906h117" stroke-width="7"/>
+  </g>
+  <g fill="#d9c58b" opacity=".85">
+    <circle cx="492" cy="879" r="8"/>
+    <circle cx="461" cy="856" r="5"/>
+    <circle cx="1314" cy="861" r="7"/>
+    <circle cx="1350" cy="842" r="4"/>
+  </g>
+
+  <!-- warm atmospheric glaze and subtle grain -->
+  <rect width="1600" height="1000" fill="#f7b56a" opacity=".045" pointer-events="none"/>
+  <rect width="1600" height="1000" fill="transparent" filter="url(#grain)" opacity=".34" pointer-events="none"/>
+</svg>
diff --git a/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-cyclist.svg b/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-cyclist.svg
new file mode 100644
index 0000000..a1f8230
--- /dev/null
+++ b/outputs/gpt-5-6-sol/codex-cli-ultra/pelican-cyclist.svg
@@ -0,0 +1,418 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="1000" viewBox="0 0 1600 1000" role="img" aria-labelledby="title desc">
+  <title id="title">海边骑自行车的鹈鹕</title>
+  <desc id="desc">一只羽毛细腻的鹈鹕迎着海风骑过金色沙滩，远处有海浪、礁石、云层与落日。</desc>
+
+  <defs>
+    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#4cb9df"/>
+      <stop offset="0.45" stop-color="#9fd9e8"/>
+      <stop offset="0.76" stop-color="#f4d2b4"/>
+      <stop offset="1" stop-color="#ffd7aa"/>
+    </linearGradient>
+    <radialGradient id="sunGlow">
+      <stop offset="0" stop-color="#fffbd8" stop-opacity="1"/>
+      <stop offset="0.18" stop-color="#ffe28b" stop-opacity="0.95"/>
+      <stop offset="0.5" stop-color="#ffbd6a" stop-opacity="0.35"/>
+      <stop offset="1" stop-color="#ffae62" stop-opacity="0"/>
+    </radialGradient>
+    <linearGradient id="sea" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#247fa1"/>
+      <stop offset="0.42" stop-color="#258ca7"/>
+      <stop offset="0.78" stop-color="#5bb6bd"/>
+      <stop offset="1" stop-color="#afd7cb"/>
+    </linearGradient>
+    <linearGradient id="wetSand" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#b9b8a2"/>
+      <stop offset="0.32" stop-color="#d4c69e"/>
+      <stop offset="1" stop-color="#e5bd7b"/>
+    </linearGradient>
+    <linearGradient id="drySand" x1="0" y1="0" x2="0.8" y2="1">
+      <stop offset="0" stop-color="#e8c88f"/>
+      <stop offset="0.55" stop-color="#dcb073"/>
+      <stop offset="1" stop-color="#c99256"/>
+    </linearGradient>
+    <linearGradient id="dune" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#f2d89f"/>
+      <stop offset="1" stop-color="#c88e52"/>
+    </linearGradient>
+    <radialGradient id="bodyFeather" cx="42%" cy="30%" r="75%">
+      <stop offset="0" stop-color="#fffdf1"/>
+      <stop offset="0.52" stop-color="#f2eee0"/>
+      <stop offset="0.82" stop-color="#d4d7d2"/>
+      <stop offset="1" stop-color="#aeb8b8"/>
+    </radialGradient>
+    <linearGradient id="wingFeather" x1="0.2" y1="0" x2="0.9" y2="1">
+      <stop offset="0" stop-color="#f7f4e7"/>
+      <stop offset="0.52" stop-color="#d8dcda"/>
+      <stop offset="1" stop-color="#89999d"/>
+    </linearGradient>
+    <linearGradient id="billTop" x1="0" y1="0" x2="1" y2="0.65">
+      <stop offset="0" stop-color="#f4cf76"/>
+      <stop offset="0.48" stop-color="#edbd5d"/>
+      <stop offset="0.88" stop-color="#d99b42"/>
+      <stop offset="1" stop-color="#b86f37"/>
+    </linearGradient>
+    <linearGradient id="pouch" x1="0" y1="0" x2="0.65" y2="1">
+      <stop offset="0" stop-color="#f7cb86"/>
+      <stop offset="0.48" stop-color="#efa45d"/>
+      <stop offset="1" stop-color="#d87844"/>
+    </linearGradient>
+    <linearGradient id="leg" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#efad54"/>
+      <stop offset="1" stop-color="#c96a37"/>
+    </linearGradient>
+    <linearGradient id="bikePaint" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#ff7c56"/>
+      <stop offset="0.5" stop-color="#df4b3f"/>
+      <stop offset="1" stop-color="#a92f36"/>
+    </linearGradient>
+    <linearGradient id="metal" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#f6fbfb"/>
+      <stop offset="0.35" stop-color="#8e9da1"/>
+      <stop offset="0.6" stop-color="#e9efee"/>
+      <stop offset="1" stop-color="#65767b"/>
+    </linearGradient>
+    <radialGradient id="eye" cx="35%" cy="30%" r="65%">
+      <stop offset="0" stop-color="#fff9b0"/>
+      <stop offset="0.32" stop-color="#d6b23e"/>
+      <stop offset="0.58" stop-color="#42513e"/>
+      <stop offset="1" stop-color="#050b0c"/>
+    </radialGradient>
+
+    <filter id="softShadow" x="-30%" y="-30%" width="160%" height="180%">
+      <feGaussianBlur stdDeviation="11"/>
+    </filter>
+    <filter id="bodyShadow" x="-25%" y="-25%" width="160%" height="170%">
+      <feDropShadow dx="0" dy="9" stdDeviation="9" flood-color="#26363c" flood-opacity="0.28"/>
+    </filter>
+    <filter id="smallBlur">
+      <feGaussianBlur stdDeviation="2.2"/>
+    </filter>
+    <filter id="grain" x="-10%" y="-10%" width="120%" height="120%">
+      <feTurbulence type="fractalNoise" baseFrequency="0.72" numOctaves="3" seed="9" stitchTiles="stitch"/>
+      <feColorMatrix type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 .13 0"/>
+    </filter>
+    <filter id="waterGlow" x="-30%" y="-100%" width="160%" height="300%">
+      <feGaussianBlur stdDeviation="3.5"/>
+    </filter>
+
+    <clipPath id="seaClip">
+      <path d="M0 359H1600V704C1394 667 1219 684 1035 654C831 621 673 655 464 631C273 609 137 626 0 604Z"/>
+    </clipPath>
+
+    <g id="spokes">
+      <g stroke="#c8d5d7" stroke-width="2.2" opacity="0.82">
+        <line x1="0" y1="-166" x2="0" y2="166"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(15)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(30)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(45)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(60)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(75)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(90)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(105)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(120)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(135)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(150)"/>
+        <line x1="0" y1="-166" x2="0" y2="166" transform="rotate(165)"/>
+      </g>
+      <circle r="11" fill="url(#metal)" stroke="#4d6268" stroke-width="3"/>
+      <circle r="4" fill="#263a40"/>
+    </g>
+
+    <style>
+      .spoke-spin { animation: wheel-spin 1.7s linear infinite; transform-box: fill-box; transform-origin: center; }
+      .cloud-near { animation: cloud-drift 34s ease-in-out infinite alternate; }
+      .cloud-far { animation: cloud-drift 48s ease-in-out -12s infinite alternate-reverse; }
+      .glint { animation: glimmer 4.2s ease-in-out infinite alternate; }
+      .glint:nth-of-type(2n) { animation-delay: -1.6s; }
+      .glint:nth-of-type(3n) { animation-delay: -2.7s; }
+      #crest { animation: crest-flutter 1.9s ease-in-out infinite alternate; transform-origin: 1015px 160px; }
+      #pouch-shape { animation: pouch-breathe 2.8s ease-in-out infinite; transform-origin: 1110px 244px; }
+      .sand-speck { animation: speck-fly 1.9s ease-out infinite; }
+      .sand-speck:nth-child(2n) { animation-delay: -.7s; }
+      .sand-speck:nth-child(3n) { animation-delay: -1.25s; }
+      @keyframes wheel-spin { to { transform: rotate(360deg); } }
+      @keyframes cloud-drift { from { transform: translateX(-18px); } to { transform: translateX(42px); } }
+      @keyframes glimmer { from { opacity: .22; transform: translateX(-5px); } to { opacity: .9; transform: translateX(9px); } }
+      @keyframes crest-flutter { from { transform: rotate(-1deg); } to { transform: rotate(4deg); } }
+      @keyframes pouch-breathe { 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(1.025); } }
+      @keyframes speck-fly { 0% { opacity: 0; transform: translate(0,0); } 20% { opacity: .8; } 100% { opacity: 0; transform: translate(-70px,-32px); } }
+      @media (prefers-reduced-motion: reduce) {
+        * { animation: none !important; }
+      }
+    </style>
+  </defs>
+
+  <!-- Golden-hour coast -->
+  <rect width="1600" height="1000" fill="url(#sky)"/>
+  <circle cx="1326" cy="198" r="260" fill="url(#sunGlow)"/>
+  <circle cx="1326" cy="198" r="69" fill="#fff4bd" opacity="0.97"/>
+
+  <g class="cloud-far" fill="#f8f4ea" opacity="0.55" filter="url(#smallBlur)">
+    <path d="M85 207C115 177 155 184 169 211C192 182 249 187 260 221C294 215 321 235 322 260H53C53 235 65 218 85 207Z"/>
+    <path d="M1120 91C1147 67 1182 73 1197 99C1221 72 1264 78 1276 108C1301 104 1322 116 1330 139H1082C1088 115 1100 100 1120 91Z"/>
+  </g>
+  <g class="cloud-near" fill="#fffaf0" opacity="0.82">
+    <path d="M329 111C360 73 414 81 430 119C457 80 531 89 540 137C571 127 615 151 617 182H284C286 151 303 126 329 111Z"/>
+    <path d="M642 252C662 227 700 233 711 259C731 235 770 237 782 267C805 260 832 275 836 298H613C616 277 625 262 642 252Z" opacity="0.62"/>
+  </g>
+
+  <g fill="none" stroke="#496f79" stroke-width="5" stroke-linecap="round" opacity="0.55">
+    <path d="M168 300q20-18 40 0q20-18 40 0"/>
+    <path d="M361 230q14-12 28 0q14-12 28 0" stroke-width="4"/>
+    <path d="M1462 315q17-15 34 0q17-15 34 0" stroke-width="4"/>
+  </g>
+
+  <!-- Distant sea and headlands -->
+  <path d="M0 359H1600V704C1394 667 1219 684 1035 654C831 621 673 655 464 631C273 609 137 626 0 604Z" fill="url(#sea)"/>
+  <path d="M0 366C212 350 399 371 590 359C808 345 1002 369 1212 357C1364 348 1489 354 1600 361" fill="none" stroke="#d9eef0" stroke-width="5" opacity="0.58"/>
+  <path d="M0 462C160 447 314 474 462 458C641 439 823 468 1014 451C1208 434 1388 460 1600 440" fill="none" stroke="#b8dde1" stroke-width="7" opacity="0.34"/>
+
+  <path d="M0 385C79 357 145 323 216 329C268 334 315 360 356 386Z" fill="#607976"/>
+  <path d="M0 385C77 362 148 339 225 344C273 347 314 367 356 386Z" fill="#829789"/>
+  <path d="M1314 371C1374 338 1453 320 1600 303V381Z" fill="#566f71"/>
+  <path d="M1393 356C1465 333 1524 324 1600 320V377Z" fill="#748981"/>
+
+  <g clip-path="url(#seaClip)" fill="none" stroke-linecap="round">
+    <g stroke="#edf6ee" opacity="0.62">
+      <path d="M66 520c86-15 139-11 218 2" stroke-width="6"/>
+      <path d="M349 561c111-18 208-7 304 7" stroke-width="7"/>
+      <path d="M755 515c91-16 153-10 232 4" stroke-width="5"/>
+      <path d="M1090 570c121-22 218-10 347 8" stroke-width="8"/>
+      <path d="M1307 491c71-10 132-6 210 3" stroke-width="5"/>
+    </g>
+    <g class="glint" stroke="#fff5c9" opacity="0.75" filter="url(#waterGlow)">
+      <path d="M1256 332l139 0" stroke-width="5"/>
+      <path d="M1219 387l199 0" stroke-width="7"/>
+      <path d="M1172 444l286 0" stroke-width="8"/>
+      <path d="M1127 507l331 0" stroke-width="10"/>
+      <path d="M1194 570l227 0" stroke-width="8"/>
+    </g>
+  </g>
+
+  <!-- Shore -->
+  <path d="M0 568C166 552 272 581 417 591C596 604 751 574 932 593C1120 613 1317 585 1600 623V1000H0Z" fill="url(#wetSand)"/>
+  <path d="M0 646C183 625 326 676 495 673C688 669 793 628 1003 662C1204 694 1375 645 1600 690V1000H0Z" fill="url(#drySand)"/>
+  <path d="M0 581C162 564 280 603 420 607C589 612 754 587 928 608C1113 631 1311 598 1600 640" fill="none" stroke="#f6f4db" stroke-width="20" opacity="0.86"/>
+  <path d="M0 586C157 571 285 611 420 615C607 622 762 596 929 616C1116 638 1321 609 1600 648" fill="none" stroke="#c7e3d8" stroke-width="8" opacity="0.8"/>
+  <path d="M0 612C160 597 289 638 430 643C603 649 759 618 930 639C1122 662 1328 633 1600 671" fill="none" stroke="#f7f2dc" stroke-width="4" stroke-dasharray="4 19" stroke-linecap="round" opacity="0.78"/>
+
+  <g fill="#8a6948" opacity="0.38">
+    <ellipse cx="105" cy="745" rx="5" ry="2.5" transform="rotate(18 105 745)"/>
+    <ellipse cx="197" cy="822" rx="8" ry="3" transform="rotate(-12 197 822)"/>
+    <ellipse cx="346" cy="703" rx="5" ry="2"/>
+    <ellipse cx="1397" cy="780" rx="7" ry="2.5" transform="rotate(22 1397 780)"/>
+    <ellipse cx="1506" cy="903" rx="5" ry="2"/>
+    <ellipse cx="1271" cy="720" rx="4" ry="2"/>
+  </g>
+
+  <!-- Dunes framing the action -->
+  <path d="M0 753C66 711 142 702 222 728C171 757 124 799 92 862L0 895Z" fill="url(#dune)" opacity="0.9"/>
+  <path d="M1452 763C1517 738 1568 742 1600 761V1000H1481C1495 905 1484 831 1452 763Z" fill="url(#dune)" opacity="0.9"/>
+  <g stroke="#68784e" stroke-width="6" stroke-linecap="round" fill="none" opacity="0.85">
+    <path d="M42 787Q56 732 75 696M58 777Q91 735 124 720M35 797Q20 749 21 719M92 774Q123 745 155 742"/>
+    <path d="M1520 802Q1508 749 1491 717M1533 795Q1552 747 1576 728M1555 810Q1580 775 1600 768M1498 798Q1467 759 1444 748"/>
+  </g>
+  <g stroke="#9f925a" stroke-width="3" stroke-linecap="round" fill="none" opacity="0.7">
+    <path d="M112 786Q116 741 105 706M128 790Q150 750 174 739M1480 807Q1458 769 1433 754M1579 823Q1569 775 1581 747"/>
+  </g>
+
+  <!-- Tire tracks and moving sand -->
+  <path d="M107 927C260 908 373 919 491 938" fill="none" stroke="#a8794d" stroke-width="6" stroke-dasharray="18 22" opacity="0.34"/>
+  <path d="M113 944C257 927 366 936 471 951" fill="none" stroke="#f0cc91" stroke-width="3" stroke-dasharray="14 25" opacity="0.66"/>
+  <g fill="#e9c484" opacity="0.9">
+    <circle class="sand-speck" cx="380" cy="923" r="4"/>
+    <circle class="sand-speck" cx="411" cy="945" r="3"/>
+    <circle class="sand-speck" cx="443" cy="919" r="5"/>
+    <circle class="sand-speck" cx="466" cy="949" r="2.5"/>
+    <circle class="sand-speck" cx="490" cy="930" r="3.5"/>
+  </g>
+
+  <!-- Grounded shadow -->
+  <ellipse cx="842" cy="950" rx="520" ry="42" fill="#5f604e" opacity="0.28" filter="url(#softShadow)"/>
+  <ellipse cx="842" cy="949" rx="421" ry="17" fill="#5f5542" opacity="0.26"/>
+
+  <!-- Bicycle wheels -->
+  <g transform="translate(515 770)">
+    <circle r="185" fill="#f8f1dd" fill-opacity="0.045" stroke="#16252c" stroke-width="17"/>
+    <circle r="176" fill="none" stroke="#4c6065" stroke-width="5"/>
+    <circle r="169" fill="none" stroke="#e1e8e7" stroke-width="3" opacity="0.8"/>
+    <g class="spoke-spin"><use href="#spokes"/></g>
+    <path d="M-135-116A178 178 0 0 1-29-174" fill="none" stroke="#6f8589" stroke-width="3" opacity="0.55"/>
+  </g>
+  <g transform="translate(1165 770)">
+    <circle r="185" fill="#f8f1dd" fill-opacity="0.045" stroke="#16252c" stroke-width="17"/>
+    <circle r="176" fill="none" stroke="#4c6065" stroke-width="5"/>
+    <circle r="169" fill="none" stroke="#e1e8e7" stroke-width="3" opacity="0.8"/>
+    <g class="spoke-spin"><use href="#spokes"/></g>
+    <path d="M-135-116A178 178 0 0 1-29-174" fill="none" stroke="#6f8589" stroke-width="3" opacity="0.55"/>
+  </g>
+
+  <!-- Rear leg, behind the frame -->
+  <g fill="none" stroke="url(#leg)" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M754 579C747 641 741 696 728 757C724 776 725 793 728 808" stroke="#a95531" stroke-width="23" opacity="0.5"/>
+    <path d="M754 579C747 641 741 696 728 757C724 776 725 793 728 808" stroke-width="17"/>
+    <path d="M728 808C708 809 690 814 676 824M730 808C710 821 699 833 692 845M732 808C727 827 727 841 730 852" stroke="#c96e39" stroke-width="8"/>
+  </g>
+
+  <!-- Bicycle frame -->
+  <g fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <g stroke="#762f34" stroke-width="22" opacity="0.88">
+      <path d="M515 770L721 603L800 770L515 770Z"/>
+      <path d="M721 603L997 599L800 770"/>
+      <path d="M997 599L1014 749"/>
+      <path d="M1014 749L1165 770"/>
+    </g>
+    <g stroke="url(#bikePaint)" stroke-width="15">
+      <path d="M515 770L721 603L800 770L515 770Z"/>
+      <path d="M721 603L997 599L800 770"/>
+      <path d="M997 599L1014 749"/>
+      <path d="M1014 749L1165 770"/>
+    </g>
+    <g stroke="#ffad75" stroke-width="3.5" opacity="0.75">
+      <path d="M526 760L720 614L787 755"/>
+      <path d="M733 612L980 609"/>
+    </g>
+  </g>
+
+  <!-- Chain, gears and pedals -->
+  <g fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M515 759L795 739M515 781L795 801" stroke="#30383a" stroke-width="5" opacity="0.86"/>
+    <circle cx="800" cy="770" r="39" stroke="#30383a" stroke-width="8"/>
+    <circle cx="800" cy="770" r="31" stroke="url(#metal)" stroke-width="5" stroke-dasharray="3 5"/>
+    <circle cx="515" cy="770" r="24" stroke="#30383a" stroke-width="6"/>
+    <circle cx="515" cy="770" r="17" stroke="#9aa7a8" stroke-width="3" stroke-dasharray="2 4"/>
+    <path d="M800 770L875 730M800 770L727 810" stroke="#56666a" stroke-width="9"/>
+    <path d="M858 730H901M705 810H748" stroke="#243238" stroke-width="10"/>
+    <circle cx="800" cy="770" r="10" fill="url(#metal)" stroke="#35484d" stroke-width="3"/>
+  </g>
+
+  <!-- Seat and steering -->
+  <g stroke-linecap="round" stroke-linejoin="round">
+    <path d="M721 603L710 559" stroke="#5b6d71" stroke-width="12"/>
+    <path d="M676 557C704 548 740 551 761 561C753 576 727 581 686 574Z" fill="#593b33" stroke="#2e2e2b" stroke-width="5"/>
+    <path d="M996 598L1031 525" fill="none" stroke="#586b70" stroke-width="12"/>
+    <path d="M1030 525C1058 514 1086 513 1111 524M1088 523L1105 495" fill="none" stroke="url(#metal)" stroke-width="10"/>
+    <path d="M1093 496L1121 496" stroke="#33464b" stroke-width="13"/>
+    <circle cx="1029" cy="531" r="11" fill="#e9c65e" stroke="#6f5934" stroke-width="4"/>
+    <path d="M1008 572L983 551" fill="none" stroke="#5b6e72" stroke-width="6"/>
+    <ellipse cx="977" cy="546" rx="14" ry="10" fill="#f4e6c3" stroke="#555e5e" stroke-width="3"/>
+  </g>
+
+  <!-- Pelican -->
+  <g id="pelican" filter="url(#bodyShadow)">
+    <!-- Tail -->
+    <g fill="url(#wingFeather)" stroke="#7f8d8e" stroke-width="2.2" stroke-linejoin="round">
+      <path d="M650 481C594 459 530 442 458 430C503 472 559 511 633 535Z"/>
+      <path d="M647 500C579 490 514 482 450 486C511 522 572 544 646 546Z"/>
+      <path d="M664 519C594 524 537 536 484 558C547 572 604 571 670 553Z"/>
+    </g>
+
+    <!-- Main body -->
+    <path d="M604 558C571 510 579 448 622 406C678 350 795 345 881 390C940 420 965 486 937 549C905 622 824 656 729 644C674 637 626 608 604 558Z" fill="url(#bodyFeather)" stroke="#849396" stroke-width="4"/>
+    <path d="M616 482C631 410 710 371 797 375C709 394 659 441 648 511C640 558 666 599 715 632C644 615 599 556 616 482Z" fill="#fffdf2" opacity="0.66"/>
+
+    <!-- Layered flank feathers -->
+    <g fill="none" stroke-linecap="round">
+      <path d="M633 516C682 539 715 538 758 520" stroke="#c4cbc7" stroke-width="5"/>
+      <path d="M646 546C704 573 755 568 805 544" stroke="#b8c2bf" stroke-width="5"/>
+      <path d="M676 589C733 614 802 603 845 571" stroke="#adb9b7" stroke-width="5"/>
+      <path d="M697 416C752 398 820 411 856 442" stroke="#fffdf5" stroke-width="8" opacity="0.75"/>
+    </g>
+    <g fill="#eef0e8" stroke="#b9c2bf" stroke-width="2" opacity="0.92">
+      <path d="M638 458q31-29 67-12q-28 6-52 30Z"/>
+      <path d="M669 438q35-27 69-6q-31 4-56 27Z"/>
+      <path d="M635 500q35-25 73-2q-33 3-60 24Z"/>
+      <path d="M664 527q38-24 77 2q-36 0-64 20Z"/>
+      <path d="M704 557q42-22 82 7q-38-2-70 16Z"/>
+    </g>
+
+    <!-- Neck and head -->
+    <path d="M828 427C875 398 900 352 897 301C893 245 915 193 958 163C1005 130 1073 140 1114 178C1145 206 1146 246 1122 274C1095 306 1055 312 1019 296C995 285 981 287 968 303C944 335 950 389 912 435C885 465 849 458 828 427Z" fill="url(#bodyFeather)" stroke="#849396" stroke-width="4"/>
+    <path d="M930 350C921 290 930 220 980 181C1013 155 1061 154 1095 177C1055 165 1020 176 997 205C967 244 981 298 962 346C947 384 923 417 892 438C914 411 936 389 930 350Z" fill="#fffdf4" opacity="0.74"/>
+    <path d="M1088 174C1060 146 1021 143 983 158C1010 132 1058 124 1098 145C1112 153 1122 163 1129 177Z" fill="#f8f5e9"/>
+
+    <!-- Crest -->
+    <g id="crest" fill="#faf8ed" stroke="#99a5a4" stroke-width="2" stroke-linejoin="round">
+      <path d="M1000 160C983 132 980 108 989 89C1005 113 1012 134 1010 158Z"/>
+      <path d="M1019 155C1011 120 1020 94 1035 77C1041 106 1038 132 1030 158Z"/>
+      <path d="M1041 158C1048 125 1064 105 1082 94C1077 124 1065 145 1054 166Z"/>
+    </g>
+
+    <!-- Eye and facial markings -->
+    <path d="M1030 185C1056 172 1083 178 1095 197C1074 213 1045 213 1026 197Z" fill="#efd17c" opacity="0.76"/>
+    <circle cx="1061" cy="192" r="13" fill="url(#eye)" stroke="#3b443e" stroke-width="3"/>
+    <circle cx="1057" cy="187" r="3.5" fill="#fff"/>
+    <path d="M1018 217C1040 224 1064 224 1087 215" fill="none" stroke="#a5aaa2" stroke-width="3" stroke-linecap="round"/>
+
+    <!-- Bill and throat pouch -->
+    <g id="pouch-shape">
+      <path d="M1077 190C1170 181 1290 192 1419 222C1448 229 1450 246 1422 255C1305 262 1190 252 1085 237Z" fill="url(#billTop)" stroke="#9e6b38" stroke-width="4" stroke-linejoin="round"/>
+      <path d="M1085 234C1183 244 1311 254 1422 251C1364 290 1267 318 1149 323C1118 325 1099 306 1090 278Z" fill="url(#pouch)" stroke="#a9633e" stroke-width="4" stroke-linejoin="round"/>
+      <path d="M1101 249C1187 262 1294 268 1387 259C1311 286 1219 301 1144 300C1122 299 1110 284 1101 249Z" fill="#f7bd76" opacity="0.42"/>
+      <path d="M1090 234C1192 244 1324 257 1424 251" fill="none" stroke="#885436" stroke-width="4" stroke-linecap="round"/>
+      <path d="M1417 222C1447 226 1457 240 1422 255C1436 242 1431 232 1417 222Z" fill="#9b5933"/>
+      <path d="M1100 211C1197 207 1308 215 1402 235" fill="none" stroke="#ffe29b" stroke-width="4" opacity="0.7" stroke-linecap="round"/>
+    </g>
+
+    <!-- Folded wing -->
+    <path d="M635 459C697 395 815 397 887 452C877 520 829 581 718 593C667 568 638 524 635 459Z" fill="url(#wingFeather)" stroke="#7e8e91" stroke-width="4"/>
+    <path d="M658 458C718 420 795 420 853 453C822 457 791 468 764 489C727 517 704 550 698 579C665 548 650 504 658 458Z" fill="#f6f3e7" opacity="0.68"/>
+    <g fill="none" stroke="#89989a" stroke-width="4" stroke-linecap="round" opacity="0.75">
+      <path d="M693 460C751 436 809 442 850 469"/>
+      <path d="M678 489C742 469 809 478 849 502"/>
+      <path d="M681 520C742 507 793 515 827 538"/>
+      <path d="M699 552C744 545 779 550 805 565"/>
+    </g>
+    <g fill="#c6cecb" stroke="#899698" stroke-width="2">
+      <path d="M820 468C852 463 879 470 899 490C871 486 848 493 827 509Z"/>
+      <path d="M799 506C833 499 863 508 881 529C850 523 827 530 806 546Z"/>
+      <path d="M771 543C805 538 830 545 848 564C817 560 797 566 780 579Z"/>
+    </g>
+
+    <!-- Forward wing reaching the handlebar -->
+    <g id="forward-wing">
+      <path d="M836 425C902 423 953 455 994 497C1018 522 1037 536 1053 532C1068 528 1080 540 1071 554C1064 567 1044 570 1026 560C994 543 966 520 934 505C903 491 879 494 850 511Z" fill="url(#wingFeather)" stroke="#7b8b8e" stroke-width="4" stroke-linejoin="round"/>
+      <path d="M863 440C907 440 949 466 985 504C953 486 920 474 888 476C873 477 859 481 848 487Z" fill="#fffdf2" opacity="0.66"/>
+      <path d="M924 473C967 490 997 526 1028 548M896 486C940 499 968 526 995 544M960 466C985 482 1006 504 1027 525" fill="none" stroke="#9aa7a7" stroke-width="4" stroke-linecap="round"/>
+      <path d="M1044 529C1052 519 1065 519 1071 527L1060 540L1075 536L1077 548L1063 555L1046 555Z" fill="#d7dcd7" stroke="#79888a" stroke-width="3"/>
+    </g>
+  </g>
+
+  <!-- Front leg and webbed foot -->
+  <g fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M818 599C813 650 830 691 873 730" stroke="#9d5131" stroke-width="24" opacity="0.48"/>
+    <path d="M818 599C813 650 830 691 873 730" stroke="url(#leg)" stroke-width="17"/>
+    <path d="M873 730C886 722 900 717 914 719M875 732C893 731 907 735 919 742M872 733C882 744 887 753 889 763" stroke="#d1783b" stroke-width="8"/>
+    <path d="M858 730H901" stroke="#26363b" stroke-width="8" opacity="0.8"/>
+  </g>
+
+  <!-- Small hardware highlights -->
+  <g fill="#eaf1ef" stroke="#45585d" stroke-width="3">
+    <circle cx="515" cy="770" r="9"/>
+    <circle cx="1165" cy="770" r="9"/>
+    <circle cx="1014" cy="749" r="7"/>
+  </g>
+
+  <!-- Speed strokes -->
+  <g fill="none" stroke-linecap="round" opacity="0.42">
+    <path d="M248 645H443" stroke="#fff4d9" stroke-width="8"/>
+    <path d="M184 688H394" stroke="#b7774d" stroke-width="5"/>
+    <path d="M264 736H406" stroke="#fff0ce" stroke-width="6"/>
+    <path d="M222 783H346" stroke="#b7774d" stroke-width="4"/>
+  </g>
+
+  <!-- Foreground shell and pebbles -->
+  <g transform="translate(1367 912) rotate(-12)">
+    <path d="M0 19C9-8 52-9 66 18C49 11 17 11 0 19Z" fill="#f0d7b4" stroke="#9c765b" stroke-width="3"/>
+    <path d="M13 15L17 3M28 13L31-1M44 14L43 2M56 17L53 7" stroke="#b38a68" stroke-width="2"/>
+  </g>
+  <g fill="#7f745e" opacity="0.6">
+    <ellipse cx="1260" cy="942" rx="12" ry="5" transform="rotate(-11 1260 942)"/>
+    <ellipse cx="1481" cy="873" rx="9" ry="4" transform="rotate(18 1481 873)"/>
+    <ellipse cx="272" cy="965" rx="7" ry="3"/>
+  </g>
+
+  <!-- Subtle film grain -->
+  <rect width="1600" height="1000" filter="url(#grain)" opacity="0.12" style="mix-blend-mode:multiply" pointer-events="none"/>
+</svg>
diff --git a/outputs/gpt-5-6-sol/codex-cli-ultra/skeleton-watch-calibre-01.html b/outputs/gpt-5-6-sol/codex-cli-ultra/skeleton-watch-calibre-01.html
new file mode 100644
index 0000000..5ef94f7
--- /dev/null
+++ b/outputs/gpt-5-6-sol/codex-cli-ultra/skeleton-watch-calibre-01.html
@@ -0,0 +1,1608 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="theme-color" content="#050706">
+  <title>Calibre 01 — 镂空机械腕表</title>
+  <style>
+    :root {
+      --ink: #f2f3ec;
+      --muted: #949b93;
+      --faint: rgba(225, 235, 226, .10);
+      --line: rgba(219, 233, 223, .16);
+      --panel: rgba(9, 13, 11, .68);
+      --accent: #c7ff8b;
+      --accent-2: #69f1c5;
+      --gold: #d8b878;
+      --danger: #ff5a60;
+    }
+
+    * { box-sizing: border-box; }
+
+    html, body {
+      width: 100%;
+      height: 100%;
+      margin: 0;
+      overflow: hidden;
+      background: #050706;
+      color: var(--ink);
+      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    }
+
+    body::before {
+      content: "";
+      position: fixed;
+      inset: 0;
+      pointer-events: none;
+      z-index: 2;
+      background:
+        radial-gradient(circle at 50% 42%, transparent 0 20%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.72) 100%),
+        linear-gradient(125deg, rgba(86, 122, 103, .07), transparent 35%, rgba(181, 143, 82, .035) 70%, transparent);
+      mix-blend-mode: screen;
+    }
+
+    body::after {
+      content: "";
+      position: fixed;
+      inset: -50%;
+      z-index: 3;
+      pointer-events: none;
+      opacity: .035;
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
+      animation: grain .28s steps(2) infinite;
+    }
+
+    @keyframes grain {
+      0% { transform: translate3d(0, 0, 0); }
+      25% { transform: translate3d(2%, -1%, 0); }
+      50% { transform: translate3d(-1%, 2%, 0); }
+      75% { transform: translate3d(1%, 1%, 0); }
+      100% { transform: translate3d(-2%, -1%, 0); }
+    }
+
+    button { font: inherit; }
+
+    #stage {
+      position: fixed;
+      inset: 0;
+      z-index: 1;
+    }
+
+    #stage canvas {
+      display: block;
+      width: 100%;
+      height: 100%;
+      cursor: grab;
+      outline: none;
+    }
+
+    #stage canvas:active { cursor: grabbing; }
+
+    .topbar {
+      position: fixed;
+      z-index: 10;
+      top: 0;
+      left: 0;
+      right: 0;
+      height: 92px;
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      padding: 26px 30px;
+      pointer-events: none;
+    }
+
+    .brand {
+      display: flex;
+      align-items: center;
+      gap: 14px;
+      pointer-events: auto;
+    }
+
+    .brand-mark {
+      width: 36px;
+      height: 36px;
+      border: 1px solid rgba(231, 239, 230, .45);
+      border-radius: 50%;
+      display: grid;
+      place-items: center;
+      position: relative;
+      box-shadow: inset 0 0 0 4px rgba(255,255,255,.025), 0 0 24px rgba(154, 255, 198, .08);
+    }
+
+    .brand-mark::before,
+    .brand-mark::after {
+      content: "";
+      position: absolute;
+      width: 1px;
+      height: 12px;
+      background: var(--accent);
+      transform-origin: 50% 100%;
+      bottom: 50%;
+      box-shadow: 0 0 8px rgba(199,255,139,.8);
+    }
+
+    .brand-mark::before { transform: rotate(42deg); }
+    .brand-mark::after { height: 8px; transform: rotate(-58deg); }
+
+    .brand-title {
+      font-family: Georgia, "Times New Roman", serif;
+      font-size: 18px;
+      letter-spacing: .16em;
+      line-height: 1;
+    }
+
+    .brand-sub {
+      margin-top: 7px;
+      color: var(--muted);
+      font-size: 9px;
+      letter-spacing: .28em;
+      text-transform: uppercase;
+    }
+
+    .scene-meta {
+      display: flex;
+      align-items: center;
+      gap: 14px;
+      padding-top: 2px;
+      color: var(--muted);
+      font-size: 10px;
+      letter-spacing: .18em;
+      text-transform: uppercase;
+    }
+
+    .live-dot {
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+      background: var(--accent-2);
+      box-shadow: 0 0 0 4px rgba(105,241,197,.08), 0 0 14px rgba(105,241,197,.65);
+      animation: pulse 2s ease-in-out infinite;
+    }
+
+    @keyframes pulse { 50% { opacity: .45; transform: scale(.8); } }
+
+    .chapter {
+      position: fixed;
+      z-index: 8;
+      left: 30px;
+      top: 50%;
+      transform: translateY(-50%);
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      writing-mode: vertical-rl;
+      color: rgba(220, 228, 220, .36);
+      font-size: 9px;
+      letter-spacing: .32em;
+      text-transform: uppercase;
+      pointer-events: none;
+    }
+
+    .chapter::before {
+      content: "";
+      width: 1px;
+      height: 46px;
+      background: linear-gradient(transparent, rgba(225,235,226,.42), transparent);
+    }
+
+    .panel {
+      position: fixed;
+      z-index: 12;
+      top: 104px;
+      right: 26px;
+      width: min(340px, calc(100vw - 52px));
+      max-height: calc(100vh - 202px);
+      overflow: auto;
+      padding: 22px;
+      border: 1px solid var(--line);
+      border-radius: 18px;
+      background: linear-gradient(145deg, rgba(17,22,19,.78), rgba(7,10,9,.56));
+      box-shadow: 0 22px 80px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.04);
+      backdrop-filter: blur(20px) saturate(125%);
+      -webkit-backdrop-filter: blur(20px) saturate(125%);
+      transition: opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1);
+    }
+
+    .panel.closed {
+      opacity: 0;
+      pointer-events: none;
+      transform: translateX(24px) scale(.97);
+    }
+
+    .panel-kicker {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      color: var(--accent);
+      font-size: 9px;
+      letter-spacing: .26em;
+      text-transform: uppercase;
+    }
+
+    .panel-close {
+      border: 0;
+      background: transparent;
+      color: var(--muted);
+      padding: 0;
+      width: 24px;
+      height: 24px;
+      cursor: pointer;
+      font-size: 19px;
+      line-height: 1;
+    }
+
+    .panel h1 {
+      margin: 20px 0 8px;
+      max-width: 270px;
+      font-family: Georgia, "Times New Roman", serif;
+      font-weight: 400;
+      font-size: clamp(24px, 3vw, 34px);
+      letter-spacing: -.025em;
+      line-height: 1.04;
+    }
+
+    .panel-lead {
+      margin: 0;
+      color: #b7bdb6;
+      font-size: 12px;
+      line-height: 1.75;
+    }
+
+    .metric-grid {
+      display: grid;
+      grid-template-columns: repeat(3, 1fr);
+      gap: 1px;
+      margin: 21px 0;
+      border: 1px solid var(--line);
+      border-radius: 12px;
+      overflow: hidden;
+      background: var(--line);
+    }
+
+    .metric {
+      min-height: 68px;
+      padding: 12px 10px;
+      background: rgba(6,9,7,.76);
+    }
+
+    .metric-value {
+      color: var(--ink);
+      font-family: Georgia, "Times New Roman", serif;
+      font-size: 17px;
+    }
+
+    .metric-label {
+      margin-top: 6px;
+      color: #737a73;
+      font-size: 8px;
+      letter-spacing: .12em;
+      text-transform: uppercase;
+      white-space: nowrap;
+    }
+
+    .detail-list {
+      border-top: 1px solid var(--line);
+      margin-top: 4px;
+    }
+
+    .detail-row {
+      display: flex;
+      justify-content: space-between;
+      gap: 16px;
+      padding: 11px 0;
+      border-bottom: 1px solid rgba(225,235,226,.075);
+      font-size: 10px;
+    }
+
+    .detail-row span:first-child { color: #747b74; }
+    .detail-row span:last-child { color: #d9ddd7; text-align: right; }
+
+    .focus-button {
+      width: 100%;
+      margin-top: 18px;
+      padding: 12px 16px;
+      border: 1px solid rgba(199,255,139,.27);
+      border-radius: 10px;
+      color: var(--accent);
+      background: linear-gradient(180deg, rgba(199,255,139,.09), rgba(199,255,139,.025));
+      font-size: 10px;
+      letter-spacing: .14em;
+      text-transform: uppercase;
+      cursor: pointer;
+      transition: background .25s, border-color .25s, transform .25s;
+    }
+
+    .focus-button:hover {
+      background: rgba(199,255,139,.13);
+      border-color: rgba(199,255,139,.5);
+      transform: translateY(-1px);
+    }
+
+    .toolbar-wrap {
+      position: fixed;
+      z-index: 15;
+      left: 50%;
+      bottom: 22px;
+      transform: translateX(-50%);
+      display: flex;
+      align-items: center;
+      gap: 10px;
+    }
+
+    .toolbar {
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      padding: 6px;
+      border: 1px solid var(--line);
+      border-radius: 15px;
+      background: rgba(8,12,10,.72);
+      box-shadow: 0 16px 54px rgba(0,0,0,.36), inset 0 1px rgba(255,255,255,.04);
+      backdrop-filter: blur(18px);
+      -webkit-backdrop-filter: blur(18px);
+    }
+
+    .tool-button {
+      position: relative;
+      height: 42px;
+      min-width: 42px;
+      padding: 0 12px;
+      border: 1px solid transparent;
+      border-radius: 10px;
+      background: transparent;
+      color: #9da49d;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      transition: color .25s, border-color .25s, background .25s;
+    }
+
+    .tool-button svg {
+      width: 17px;
+      height: 17px;
+      fill: none;
+      stroke: currentColor;
+      stroke-width: 1.5;
+      stroke-linecap: round;
+      stroke-linejoin: round;
+      pointer-events: none;
+    }
+
+    .tool-button span {
+      font-size: 9px;
+      letter-spacing: .12em;
+      text-transform: uppercase;
+      white-space: nowrap;
+    }
+
+    .tool-button:hover,
+    .tool-button.active {
+      color: var(--accent);
+      border-color: rgba(199,255,139,.18);
+      background: rgba(199,255,139,.065);
+    }
+
+    .separator { width: 1px; height: 22px; background: var(--line); margin: 0 2px; }
+
+    .info-toggle {
+      width: 46px;
+      height: 46px;
+      flex: 0 0 auto;
+      border: 1px solid var(--line);
+      border-radius: 50%;
+      color: var(--ink);
+      background: rgba(8,12,10,.72);
+      cursor: pointer;
+      backdrop-filter: blur(16px);
+      font-family: Georgia, serif;
+      font-style: italic;
+      font-size: 16px;
+      transition: border-color .25s, color .25s;
+    }
+
+    .info-toggle:hover { color: var(--accent); border-color: rgba(199,255,139,.35); }
+
+    .hint {
+      position: fixed;
+      z-index: 8;
+      left: 50%;
+      bottom: 86px;
+      transform: translateX(-50%);
+      color: rgba(218,225,217,.44);
+      font-size: 9px;
+      letter-spacing: .13em;
+      white-space: nowrap;
+      pointer-events: none;
+      transition: opacity .5s;
+    }
+
+    .hint.hide { opacity: 0; }
+
+    #tooltip {
+      position: fixed;
+      z-index: 20;
+      left: 0;
+      top: 0;
+      pointer-events: none;
+      opacity: 0;
+      transform: translate3d(-100px,-100px,0);
+      transition: opacity .15s;
+    }
+
+    #tooltip.visible { opacity: 1; }
+
+    .tooltip-box {
+      position: relative;
+      margin: 14px 0 0 14px;
+      min-width: 128px;
+      padding: 9px 12px 10px;
+      border: 1px solid rgba(199,255,139,.28);
+      border-radius: 8px;
+      background: rgba(7,10,8,.88);
+      box-shadow: 0 12px 36px rgba(0,0,0,.35);
+      backdrop-filter: blur(12px);
+    }
+
+    .tooltip-box::before {
+      content: "";
+      position: absolute;
+      width: 5px;
+      height: 5px;
+      top: -18px;
+      left: -18px;
+      border: 1px solid var(--accent);
+      border-radius: 50%;
+      box-shadow: 0 0 10px rgba(199,255,139,.7);
+    }
+
+    .tooltip-id {
+      color: var(--accent);
+      font-size: 8px;
+      letter-spacing: .2em;
+      text-transform: uppercase;
+    }
+
+    .tooltip-name { margin-top: 4px; color: var(--ink); font-size: 11px; }
+
+    #hotspots {
+      position: fixed;
+      inset: 0;
+      z-index: 9;
+      pointer-events: none;
+    }
+
+    .hotspot {
+      position: absolute;
+      left: 0;
+      top: 0;
+      display: flex;
+      align-items: center;
+      gap: 7px;
+      color: rgba(227,234,226,.72);
+      font-size: 8px;
+      letter-spacing: .13em;
+      text-transform: uppercase;
+      pointer-events: auto;
+      cursor: pointer;
+      transform: translate(-4px,-4px);
+      transition: opacity .2s, color .2s;
+      white-space: nowrap;
+    }
+
+    .hotspot::before {
+      content: "";
+      width: 7px;
+      height: 7px;
+      flex: 0 0 auto;
+      border: 1px solid currentColor;
+      border-radius: 50%;
+      background: rgba(5,7,6,.7);
+      box-shadow: 0 0 0 3px rgba(199,255,139,.045);
+    }
+
+    .hotspot::after {
+      content: "";
+      position: absolute;
+      left: 7px;
+      top: 3px;
+      width: 22px;
+      height: 1px;
+      background: currentColor;
+      opacity: .28;
+    }
+
+    .hotspot span {
+      margin-left: 20px;
+      padding: 5px 7px;
+      border-radius: 5px;
+      background: rgba(5,8,6,.54);
+      backdrop-filter: blur(8px);
+    }
+
+    .hotspot:hover { color: var(--accent); }
+    .hotspot.offscreen { opacity: 0; pointer-events: none; }
+
+    .loading {
+      position: fixed;
+      inset: 0;
+      z-index: 100;
+      display: grid;
+      place-items: center;
+      background: #050706;
+      transition: opacity .8s ease, visibility .8s;
+    }
+
+    .loading.done { opacity: 0; visibility: hidden; }
+
+    .loader {
+      width: min(360px, calc(100vw - 64px));
+      text-align: center;
+    }
+
+    .loader-ring {
+      position: relative;
+      width: 72px;
+      height: 72px;
+      margin: 0 auto 28px;
+      border: 1px solid rgba(225,235,226,.12);
+      border-radius: 50%;
+    }
+
+    .loader-ring::before {
+      content: "";
+      position: absolute;
+      inset: 7px;
+      border: 1px solid transparent;
+      border-top-color: var(--accent);
+      border-right-color: rgba(199,255,139,.24);
+      border-radius: 50%;
+      animation: spin 1.3s cubic-bezier(.6,.1,.4,.9) infinite;
+    }
+
+    .loader-ring::after {
+      content: "";
+      position: absolute;
+      inset: 23px;
+      border: 1px solid rgba(225,235,226,.25);
+      border-radius: 50%;
+    }
+
+    @keyframes spin { to { transform: rotate(360deg); } }
+
+    .loader-title {
+      font-family: Georgia, serif;
+      font-size: 20px;
+      letter-spacing: .08em;
+    }
+
+    .loader-copy {
+      margin-top: 10px;
+      color: #747c74;
+      font-size: 9px;
+      letter-spacing: .2em;
+      text-transform: uppercase;
+    }
+
+    .loader-track {
+      height: 1px;
+      margin-top: 26px;
+      overflow: hidden;
+      background: rgba(225,235,226,.1);
+    }
+
+    .loader-track::before {
+      content: "";
+      display: block;
+      width: 42%;
+      height: 100%;
+      background: linear-gradient(90deg, transparent, var(--accent), transparent);
+      animation: load 1.2s ease-in-out infinite;
+    }
+
+    @keyframes load { from { transform: translateX(-110%); } to { transform: translateX(330%); } }
+
+    .noscript {
+      position: fixed;
+      z-index: 200;
+      inset: 0;
+      display: grid;
+      place-items: center;
+      padding: 40px;
+      color: #ddd;
+      background: #050706;
+      text-align: center;
+    }
+
+    @media (max-width: 820px) {
+      .topbar { height: 76px; padding: 18px; }
+      .scene-meta, .chapter { display: none; }
+      .brand-title { font-size: 15px; }
+      .panel {
+        top: auto;
+        right: 12px;
+        bottom: 82px;
+        width: calc(100vw - 24px);
+        max-height: min(55vh, 520px);
+        padding: 18px;
+      }
+      .panel.closed { transform: translateY(18px) scale(.98); }
+      .toolbar-wrap { bottom: 12px; width: calc(100vw - 24px); justify-content: center; }
+      .toolbar { flex: 1; justify-content: space-around; }
+      .tool-button { min-width: 38px; height: 40px; padding: 0 8px; }
+      .tool-button span { display: none; }
+      .info-toggle { width: 44px; height: 44px; }
+      .hint { bottom: 70px; font-size: 8px; }
+      .hotspot span { display: none; }
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      body::after, .live-dot, .loader-ring::before, .loader-track::before { animation: none !important; }
+      * { scroll-behavior: auto !important; }
+    }
+  </style>
+  <script type="importmap">
+    {
+      "imports": {
+        "three": "https://cdn.jsdelivr.net/npm/three@0.166.1/build/three.module.js",
+        "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.166.1/examples/jsm/"
+      }
+    }
+  </script>
+</head>
+<body>
+  <noscript><div class="noscript">需要启用 JavaScript 才能查看 3D 机械腕表。</div></noscript>
+
+  <div id="stage" aria-label="可旋转的 3D 镂空机械腕表"></div>
+
+  <header class="topbar">
+    <div class="brand">
+      <div class="brand-mark" aria-hidden="true"></div>
+      <div>
+        <div class="brand-title">CALIBRE 01</div>
+        <div class="brand-sub">Openworked Manufacture</div>
+      </div>
+    </div>
+    <div class="scene-meta"><span class="live-dot"></span><span>机械运转中 · 28,800 vph</span></div>
+  </header>
+
+  <div class="chapter">01 · Anatomy of time</div>
+
+  <aside class="panel" id="panel" aria-live="polite">
+    <div class="panel-kicker">
+      <span id="panel-kicker">Manufacture Calibre</span>
+      <button class="panel-close" id="panel-close" aria-label="关闭信息面板">×</button>
+    </div>
+    <h1 id="panel-title">时间的机械建筑</h1>
+    <p class="panel-lead" id="panel-lead">由 248 枚零件组成的手动上链镂空机芯。拖动观察，悬停识别零件，点击锁定并探索其功能。</p>
+    <div class="metric-grid" id="metric-grid">
+      <div class="metric"><div class="metric-value">72 h</div><div class="metric-label">动力储存</div></div>
+      <div class="metric"><div class="metric-value">31</div><div class="metric-label">红宝石</div></div>
+      <div class="metric"><div class="metric-value">4 Hz</div><div class="metric-label">摆频</div></div>
+    </div>
+    <div class="detail-list" id="detail-list">
+      <div class="detail-row"><span>机芯直径</span><span>34.6 mm</span></div>
+      <div class="detail-row"><span>结构</span><span>手动上链 · 镂空</span></div>
+      <div class="detail-row"><span>表壳</span><span>钛金属 · 蓝宝石水晶</span></div>
+      <div class="detail-row"><span>显示</span><span>时 · 分 · 小秒</span></div>
+    </div>
+    <button class="focus-button" id="focus-button">聚焦当前部件</button>
+  </aside>
+
+  <div id="tooltip">
+    <div class="tooltip-box">
+      <div class="tooltip-id" id="tooltip-id">Part 01</div>
+      <div class="tooltip-name" id="tooltip-name">部件</div>
+    </div>
+  </div>
+
+  <div id="hotspots" aria-hidden="true"></div>
+  <div class="hint" id="hint">拖动旋转 · 滚轮缩放 · 悬停识别 · 点击锁定</div>
+
+  <div class="toolbar-wrap">
+    <div class="toolbar" role="toolbar" aria-label="3D 腕表控制">
+      <button class="tool-button active" id="rotate-button" aria-pressed="true" title="自动旋转">
+        <svg viewBox="0 0 24 24"><path d="M20 7v5h-5"/><path d="M19 12a7 7 0 1 1-2.05-4.95L20 10"/></svg><span>旋转</span>
+      </button>
+      <button class="tool-button" id="explode-button" aria-pressed="false" title="爆炸视图">
+        <svg viewBox="0 0 24 24"><path d="m12 3 7 4-7 4-7-4 7-4Z"/><path d="m5 12 7 4 7-4"/><path d="m5 17 7 4 7-4"/></svg><span>爆炸</span>
+      </button>
+      <button class="tool-button" id="label-button" aria-pressed="false" title="部件标签">
+        <svg viewBox="0 0 24 24"><path d="M20 13 13 20l-9-9V4h7l9 9Z"/><path d="M8.5 8.5h.01"/></svg><span>标签</span>
+      </button>
+      <button class="tool-button" id="lume-button" aria-pressed="false" title="夜光模式">
+        <svg viewBox="0 0 24 24"><path d="M21 12.8A8.2 8.2 0 1 1 11.2 3 6.4 6.4 0 0 0 21 12.8Z"/></svg><span>夜光</span>
+      </button>
+      <div class="separator"></div>
+      <button class="tool-button" id="reset-button" title="重置视角">
+        <svg viewBox="0 0 24 24"><path d="M3 12a9 9 0 1 0 3-6.7L3 8"/><path d="M3 3v5h5"/></svg><span>复位</span>
+      </button>
+    </div>
+    <button class="info-toggle" id="info-toggle" aria-label="显示机芯信息">i</button>
+  </div>
+
+  <div class="loading" id="loading">
+    <div class="loader">
+      <div class="loader-ring"></div>
+      <div class="loader-title">CALIBRE 01</div>
+      <div class="loader-copy">正在组装 248 枚精密零件</div>
+      <div class="loader-track"></div>
+    </div>
+  </div>
+
+  <script type="module">
+    import * as THREE from 'three';
+    import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+    import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
+    import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
+    import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js';
+    import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
+    import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js';
+
+    const stage = document.getElementById('stage');
+    const reduceMotion = matchMedia('(prefers-reduced-motion: reduce)').matches;
+    const isTouch = matchMedia('(pointer: coarse)').matches;
+
+    const scene = new THREE.Scene();
+    scene.background = new THREE.Color(0x050706);
+    scene.fog = new THREE.FogExp2(0x050706, 0.022);
+
+    const camera = new THREE.PerspectiveCamera(32, innerWidth / innerHeight, 0.1, 80);
+    camera.position.set(0.2, 1.1, isTouch ? 25 : 22);
+
+    const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: false, powerPreference: 'high-performance' });
+    renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
+    renderer.setSize(innerWidth, innerHeight);
+    renderer.shadowMap.enabled = true;
+    renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+    renderer.toneMapping = THREE.ACESFilmicToneMapping;
+    renderer.toneMappingExposure = 1.16;
+    renderer.outputColorSpace = THREE.SRGBColorSpace;
+    stage.appendChild(renderer.domElement);
+
+    const pmrem = new THREE.PMREMGenerator(renderer);
+    const room = new RoomEnvironment();
+    scene.environment = pmrem.fromScene(room, 0.04).texture;
+    room.dispose();
+    pmrem.dispose();
+
+    const composer = new EffectComposer(renderer);
+    composer.addPass(new RenderPass(scene, camera));
+    const bloom = new UnrealBloomPass(new THREE.Vector2(innerWidth, innerHeight), 0.52, 0.75, 0.72);
+    composer.addPass(bloom);
+    composer.addPass(new OutputPass());
+
+    const controls = new OrbitControls(camera, renderer.domElement);
+    controls.enableDamping = true;
+    controls.dampingFactor = 0.055;
+    controls.minDistance = 12;
+    controls.maxDistance = 34;
+    controls.minPolarAngle = 0.35;
+    controls.maxPolarAngle = Math.PI - 0.35;
+    controls.autoRotate = !reduceMotion;
+    controls.autoRotateSpeed = 0.42;
+    controls.target.set(0, 0, 0.8);
+
+    const mat = {
+      titanium: new THREE.MeshPhysicalMaterial({ color: 0x5f6865, metalness: 1, roughness: 0.22, clearcoat: 0.48, clearcoatRoughness: 0.18 }),
+      darkTitanium: new THREE.MeshPhysicalMaterial({ color: 0x151b19, metalness: 0.93, roughness: 0.24, clearcoat: 0.34 }),
+      blackMetal: new THREE.MeshStandardMaterial({ color: 0x090c0b, metalness: 0.88, roughness: 0.3 }),
+      steel: new THREE.MeshPhysicalMaterial({ color: 0xb9c0ba, metalness: 1, roughness: 0.17, clearcoat: 0.35 }),
+      brushedSteel: new THREE.MeshStandardMaterial({ color: 0x89918c, metalness: 1, roughness: 0.38 }),
+      gold: new THREE.MeshPhysicalMaterial({ color: 0xb9904c, metalness: 1, roughness: 0.2, clearcoat: 0.45 }),
+      roseGold: new THREE.MeshPhysicalMaterial({ color: 0xb27255, metalness: 1, roughness: 0.22, clearcoat: 0.42 }),
+      brass: new THREE.MeshPhysicalMaterial({ color: 0x9e7737, metalness: 1, roughness: 0.3, clearcoat: 0.28 }),
+      blueSteel: new THREE.MeshPhysicalMaterial({ color: 0x153f75, metalness: 1, roughness: 0.17, clearcoat: 0.62 }),
+      ruby: new THREE.MeshPhysicalMaterial({ color: 0x9c061f, emissive: 0x2a0007, emissiveIntensity: 1.4, metalness: 0.05, roughness: 0.12, transmission: 0.22, thickness: 0.32, ior: 2.1, clearcoat: 1 }),
+      lume: new THREE.MeshStandardMaterial({ color: 0xc9ff9d, emissive: 0x79ffba, emissiveIntensity: 2.6, roughness: 0.28, metalness: 0.03 }),
+      glass: new THREE.MeshPhysicalMaterial({ color: 0xc9fff2, metalness: 0, roughness: 0.035, transmission: 0.96, thickness: 0.28, ior: 1.77, transparent: true, opacity: 0.24, clearcoat: 1, clearcoatRoughness: 0 }),
+      smokedGlass: new THREE.MeshPhysicalMaterial({ color: 0x24322d, metalness: 0.05, roughness: 0.2, transmission: 0.6, thickness: 0.38, transparent: true, opacity: 0.5, side: THREE.DoubleSide }),
+      strap: new THREE.MeshPhysicalMaterial({ color: 0x080b0a, roughness: 0.66, metalness: 0.05, clearcoat: 0.12, sheen: 0.35, sheenColor: new THREE.Color(0x56645d) })
+    };
+
+    const lights = [];
+    const key = new THREE.SpotLight(0xe7fff0, 1050, 45, Math.PI * 0.18, 0.55, 1.2);
+    key.position.set(-9, 12, 16);
+    key.target.position.set(0, 0, 0);
+    key.castShadow = true;
+    key.shadow.mapSize.set(2048, 2048);
+    key.shadow.bias = -0.00015;
+    scene.add(key, key.target); lights.push(key);
+
+    const warm = new THREE.SpotLight(0xffc987, 760, 40, Math.PI * 0.22, 0.65, 1.4);
+    warm.position.set(12, 5, 10);
+    warm.target.position.set(0, 0, 0);
+    scene.add(warm, warm.target); lights.push(warm);
+
+    const rim = new THREE.SpotLight(0x77ffd3, 920, 36, Math.PI * 0.2, 0.7, 1.25);
+    rim.position.set(-8, -8, 9);
+    rim.target.position.set(0, 0, 0);
+    scene.add(rim, rim.target); lights.push(rim);
+
+    const topLight = new THREE.PointLight(0xffffff, 75, 18, 2);
+    topLight.position.set(0, 7, 7);
+    scene.add(topLight); lights.push(topLight);
+
+    scene.add(new THREE.HemisphereLight(0x8eafa2, 0x17100b, 0.55));
+
+    const watch = new THREE.Group();
+    watch.rotation.set(-0.08, 0.02, -0.055);
+    scene.add(watch);
+
+    const caseGroup = new THREE.Group();
+    const movement = new THREE.Group();
+    const dial = new THREE.Group();
+    const display = new THREE.Group();
+    watch.add(caseGroup, movement, dial, display);
+
+    const interactives = [];
+    const parts = new Map();
+    const animatedGears = [];
+    const hotspotIds = ['barrel', 'gear-train', 'balance', 'escapement', 'bridges', 'jewels', 'sapphire', 'display'];
+
+    function cloneInteractiveMaterials(root) {
+      root.traverse(child => {
+        if (!child.isMesh) return;
+        if (Array.isArray(child.material)) child.material = child.material.map(m => m.clone());
+        else child.material = child.material.clone();
+        const materials = Array.isArray(child.material) ? child.material : [child.material];
+        for (const m of materials) {
+          m.userData.baseEmissive = m.emissive ? m.emissive.clone() : null;
+          m.userData.baseEmissiveIntensity = m.emissiveIntensity ?? 1;
+        }
+      });
+    }
+
+    function registerPart(root, data, explode = 0) {
+      cloneInteractiveMaterials(root);
+      root.userData.basePosition = root.position.clone();
+      root.userData.explode = explode;
+      root.userData.partId = data.id;
+      root.traverse(child => {
+        if (child.isMesh) {
+          child.userData.partId = data.id;
+          interactives.push(child);
+          child.castShadow = true;
+          child.receiveShadow = true;
+        }
+      });
+      parts.set(data.id, { root, data });
+      return root;
+    }
+
+    function roundedRectShape(width, height, radius) {
+      const x = -width / 2, y = -height / 2;
+      const s = new THREE.Shape();
+      s.moveTo(x + radius, y);
+      s.lineTo(x + width - radius, y);
+      s.quadraticCurveTo(x + width, y, x + width, y + radius);
+      s.lineTo(x + width, y + height - radius);
+      s.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
+      s.lineTo(x + radius, y + height);
+      s.quadraticCurveTo(x, y + height, x, y + height - radius);
+      s.lineTo(x, y + radius);
+      s.quadraticCurveTo(x, y, x + radius, y);
+      return s;
+    }
+
+    function extrudedShape(shape, depth, material, bevel = 0.05) {
+      const geo = new THREE.ExtrudeGeometry(shape, { depth, bevelEnabled: true, bevelSegments: 2, bevelSize: bevel, bevelThickness: bevel, curveSegments: 24 });
+      geo.center();
+      geo.computeVertexNormals();
+      return new THREE.Mesh(geo, material);
+    }
+
+    function cylinder(radius, depth, material, segments = 64) {
+      const mesh = new THREE.Mesh(new THREE.CylinderGeometry(radius, radius, depth, segments, 1, false), material);
+      mesh.rotation.x = Math.PI / 2;
+      return mesh;
+    }
+
+    function ring(radius, tube, material, radial = 96) {
+      return new THREE.Mesh(new THREE.TorusGeometry(radius, tube, 12, radial), material);
+    }
+
+    function screw(radius = 0.15, depth = 0.12, blue = true) {
+      const g = new THREE.Group();
+      const head = cylinder(radius, depth, blue ? mat.blueSteel : mat.steel, 32);
+      g.add(head);
+      const slotMat = new THREE.MeshBasicMaterial({ color: blue ? 0x081325 : 0x262b29 });
+      const slot = new THREE.Mesh(new THREE.BoxGeometry(radius * 1.35, radius * .22, depth * .22), slotMat);
+      slot.position.z = depth * .55;
+      g.add(slot);
+      return g;
+    }
+
+    function jewel(radius = 0.18) {
+      const g = new THREE.Group();
+      const setting = ring(radius * 1.15, radius * .16, mat.gold, 36);
+      const stone = cylinder(radius, .11, mat.ruby, 32);
+      stone.position.z = .025;
+      g.add(setting, stone);
+      return g;
+    }
+
+    function gearShape(radius, teeth, toothDepth, holeRadius) {
+      const s = new THREE.Shape();
+      const count = teeth * 4;
+      for (let i = 0; i <= count; i++) {
+        const a = (i / count) * Math.PI * 2;
+        const phase = i % 4;
+        const r = phase === 1 || phase === 2 ? radius + toothDepth : radius;
+        const x = Math.cos(a) * r, y = Math.sin(a) * r;
+        i === 0 ? s.moveTo(x, y) : s.lineTo(x, y);
+      }
+      const hole = new THREE.Path();
+      hole.absarc(0, 0, holeRadius, 0, Math.PI * 2, true);
+      s.holes.push(hole);
+      return s;
+    }
+
+    function createGear({ radius, teeth, depth = .16, material = mat.brass, spokes = 5, hub = .2, toothDepth = .11 }) {
+      const g = new THREE.Group();
+      const wheel = extrudedShape(gearShape(radius, teeth, toothDepth, radius * .29), depth, material, .025);
+      g.add(wheel);
+      const spokeMaterial = material.clone();
+      spokeMaterial.roughness = Math.min(1, (material.roughness || .2) + .08);
+      for (let i = 0; i < spokes; i++) {
+        const a = i / spokes * Math.PI * 2;
+        const len = radius * .66;
+        const spoke = new THREE.Mesh(new THREE.BoxGeometry(len, Math.max(.055, radius * .075), depth * .72), spokeMaterial);
+        spoke.position.set(Math.cos(a) * radius * .33, Math.sin(a) * radius * .33, 0);
+        spoke.rotation.z = a;
+        g.add(spoke);
+      }
+      g.add(cylinder(hub, depth * 1.35, material, 32));
+      const pinion = cylinder(hub * .48, depth * 2.8, mat.steel, 24);
+      pinion.position.z = depth * .55;
+      g.add(pinion);
+      return g;
+    }
+
+    function spiralTube(inner, outer, turns, depth, material, thickness = .025, points = 220) {
+      const p = [];
+      for (let i = 0; i <= points; i++) {
+        const t = i / points;
+        const a = t * turns * Math.PI * 2;
+        const r = inner + (outer - inner) * t;
+        p.push(new THREE.Vector3(Math.cos(a) * r, Math.sin(a) * r, depth + Math.sin(t * Math.PI) * .015));
+      }
+      const curve = new THREE.CatmullRomCurve3(p);
+      return new THREE.Mesh(new THREE.TubeGeometry(curve, points, thickness, 5, false), material);
+    }
+
+    function bridge(width, height, angle, x, y, z, material, holes = []) {
+      const s = roundedRectShape(width, height, Math.min(height * .42, .24));
+      for (const h of holes) {
+        const cut = new THREE.Path();
+        cut.absarc(h.x, h.y, h.r, 0, Math.PI * 2, true);
+        s.holes.push(cut);
+      }
+      const mesh = extrudedShape(s, .2, material, .055);
+      mesh.position.set(x, y, z);
+      mesh.rotation.z = angle;
+      return mesh;
+    }
+
+    function canvasTexture(draw, width = 1024, height = 256) {
+      const c = document.createElement('canvas');
+      c.width = width; c.height = height;
+      const ctx = c.getContext('2d');
+      draw(ctx, width, height);
+      const t = new THREE.CanvasTexture(c);
+      t.colorSpace = THREE.SRGBColorSpace;
+      t.anisotropy = renderer.capabilities.getMaxAnisotropy();
+      return t;
+    }
+
+    function addEngraving(text, x, y, z, width = 2.7, rotation = 0) {
+      const tex = canvasTexture((ctx, w, h) => {
+        ctx.clearRect(0,0,w,h);
+        ctx.font = '500 56px Georgia';
+        ctx.letterSpacing = '12px';
+        ctx.textAlign = 'center';
+        ctx.textBaseline = 'middle';
+        ctx.fillStyle = 'rgba(233,221,186,.78)';
+        ctx.fillText(text, w/2, h/2);
+      });
+      const plane = new THREE.Mesh(new THREE.PlaneGeometry(width, width / 4), new THREE.MeshBasicMaterial({ map: tex, transparent: true, depthWrite: false, opacity: .82, blending: THREE.AdditiveBlending }));
+      plane.position.set(x,y,z);
+      plane.rotation.z = rotation;
+      movement.add(plane);
+    }
+
+    // Strap and sculpted case
+    const strapTop = extrudedShape(roundedRectShape(4.35, 7.8, .72), .62, mat.strap, .11);
+    strapTop.position.set(0, 9.15, -1.0);
+    strapTop.rotation.x = -.045;
+    const strapBottom = strapTop.clone();
+    strapBottom.material = mat.strap.clone();
+    strapBottom.position.y = -9.15;
+    strapBottom.rotation.x = .045;
+    caseGroup.add(strapTop, strapBottom);
+
+    for (const sign of [-1, 1]) {
+      for (let i = -1; i <= 1; i++) {
+        const stitchTop = new THREE.Mesh(new THREE.BoxGeometry(.34, .035, .018), new THREE.MeshBasicMaterial({ color: 0x4d5550 }));
+        stitchTop.position.set(i * 1.25, sign > 0 ? 7.2 + sign * .25 : -7.2 + sign * .25, -.65);
+        caseGroup.add(stitchTop);
+      }
+    }
+
+    for (const y of [-5.8, 5.8]) {
+      for (const x of [-4.35, 4.35]) {
+        const lug = extrudedShape(roundedRectShape(1.05, 2.2, .36), .85, mat.titanium, .12);
+        lug.position.set(x, y, -.25);
+        lug.rotation.z = x * y > 0 ? -.19 : .19;
+        caseGroup.add(lug);
+        const lugInset = extrudedShape(roundedRectShape(.54, 1.65, .22), .91, mat.blackMetal, .06);
+        lugInset.position.copy(lug.position);
+        lugInset.position.z += .03;
+        lugInset.rotation.z = lug.rotation.z;
+        caseGroup.add(lugInset);
+      }
+    }
+
+    const caseBack = cylinder(6.28, .64, mat.darkTitanium, 128);
+    caseBack.position.z = -.43;
+    caseGroup.add(caseBack);
+
+    const exhibitionBack = cylinder(5.58, .68, mat.smokedGlass, 128);
+    exhibitionBack.position.z = -.45;
+    caseGroup.add(exhibitionBack);
+
+    const caseRing = ring(6.22, .52, mat.titanium, 160);
+    caseRing.position.z = .35;
+    caseGroup.add(caseRing);
+
+    const bezelOuter = ring(6.18, .23, mat.darkTitanium, 160);
+    bezelOuter.position.z = 2.62;
+    caseGroup.add(bezelOuter);
+
+    const bezelLip = ring(5.93, .08, mat.steel, 160);
+    bezelLip.position.z = 2.8;
+    caseGroup.add(bezelLip);
+
+    // Crown with knurling and crown guards
+    const crown = new THREE.Group();
+    crown.position.set(6.8, .12, .45);
+    const crownCore = cylinder(.62, .62, mat.titanium, 48);
+    crownCore.rotation.set(0,0,Math.PI/2);
+    crown.add(crownCore);
+    for (let i = 0; i < 24; i++) {
+      const a = i / 24 * Math.PI * 2;
+      const tooth = new THREE.Mesh(new THREE.BoxGeometry(.6, .045, .12), mat.steel);
+      tooth.position.set(0, Math.cos(a) * .61, Math.sin(a) * .61);
+      tooth.rotation.x = a;
+      crown.add(tooth);
+    }
+    const crownCap = cylinder(.45, .08, mat.darkTitanium, 48);
+    crownCap.rotation.set(0,0,Math.PI/2);
+    crownCap.position.x = .34;
+    crown.add(crownCap);
+    const crownMark = ring(.19, .035, mat.lume, 40);
+    crownMark.rotation.y = Math.PI/2;
+    crownMark.position.x = .39;
+    crown.add(crownMark);
+    caseGroup.add(crown);
+
+    for (const y of [-.78, .95]) {
+      const guard = extrudedShape(roundedRectShape(.74, 1.15, .26), .65, mat.titanium, .1);
+      guard.position.set(6.26, y, .2);
+      guard.rotation.z = .08 * Math.sign(y);
+      caseGroup.add(guard);
+    }
+
+    registerPart(caseGroup, {
+      id: 'case', code: 'Exterior 01', name: '钛金属表壳',
+      lead: '多层喷砂与镜面倒角构成的轻量化表壳，保护机芯并形成鲜明的光影边界。',
+      metrics: [['Grade 5','钛金属'],['43 mm','直径'],['10 ATM','防水']],
+      details: [['表面','拉丝 · 抛光倒角'],['结构','四体式表壳'],['表冠','螺旋防滑纹'],['重量','约 78 g']]
+    }, 0);
+
+    // Main plate and architectural rings
+    const mainPlate = new THREE.Group();
+    const plate = cylinder(5.48, .3, mat.smokedGlass, 128);
+    plate.position.z = .18;
+    mainPlate.add(plate);
+    const plateRing = ring(5.14, .14, mat.brushedSteel, 128);
+    plateRing.position.z = .36;
+    mainPlate.add(plateRing);
+    const innerRing = ring(4.15, .055, mat.gold, 128);
+    innerRing.position.z = .39;
+    mainPlate.add(innerRing);
+    for (let r = 1.15; r < 5; r += .64) {
+      const groove = ring(r, .009, new THREE.MeshBasicMaterial({ color: 0x6b746e, transparent: true, opacity: .24 }), 96);
+      groove.position.z = .38;
+      mainPlate.add(groove);
+    }
+    movement.add(mainPlate);
+
+    // Mainspring barrel
+    const barrel = new THREE.Group();
+    barrel.position.set(-2.55, 1.62, .76);
+    const barrelTeeth = createGear({ radius: 1.36, teeth: 46, depth: .2, material: mat.brass, spokes: 6, hub: .25, toothDepth: .09 });
+    barrel.add(barrelTeeth);
+    const barrelWall = ring(1.05, .09, mat.roseGold, 80);
+    barrelWall.position.z = .18;
+    barrel.add(barrelWall);
+    const barrelSpring = spiralTube(.12, .92, 7.2, .23, mat.blueSteel, .028, 260);
+    barrel.add(barrelSpring);
+    const barrelHub = cylinder(.26, .38, mat.steel, 40);
+    barrelHub.position.z = .16;
+    barrel.add(barrelHub);
+    const barrelScrew = screw(.13,.1,true);
+    barrelScrew.position.set(0,0,.39);
+    barrel.add(barrelScrew);
+    movement.add(registerPart(barrel, {
+      id:'barrel', code:'Energy 02', name:'开放式主发条盒',
+      lead:'可见的蓝钢主发条缓慢释放储存能量，经由发条盒齿圈传向走时轮系。',
+      metrics:[['72 h','动力储存'],['7.2','发条圈数'],['0.11 mm','簧片厚度']],
+      details:[['功能','储存与稳定释放能量'],['材质','Nivaflex 合金'],['上链','手动双向'],['安全结构','滑动末端']]
+    }, 3.2));
+    animatedGears.push({ object: barrelTeeth, speed: .018 });
+
+    // Gear train, including a deep background wheel for layered parallax
+    const gearTrain = new THREE.Group();
+    const gearSpecs = [
+      { x:-.35, y:.55, r:1.05, teeth:38, color:mat.gold, speed:-.11, z:.82, spokes:5 },
+      { x:1.62, y:1.45, r:.86, teeth:32, color:mat.brass, speed:.21, z:.76, spokes:5 },
+      { x:2.82, y:-.05, r:.71, teeth:28, color:mat.roseGold, speed:-.36, z:.9, spokes:5 },
+      { x:1.62, y:-1.47, r:.79, teeth:30, color:mat.gold, speed:.5, z:.73, spokes:6 },
+      { x:-.3, y:-1.4, r:.68, teeth:26, color:mat.brass, speed:-.72, z:.62, spokes:5 },
+      { x:3.63, y:1.8, r:.4, teeth:18, color:mat.steel, speed:-.72, z:.65, spokes:4 },
+      { x:-3.65, y:-.5, r:.48, teeth:20, color:mat.steel, speed:.52, z:.6, spokes:4 }
+    ];
+    gearSpecs.forEach((s, index) => {
+      const g = createGear({ radius:s.r, teeth:s.teeth, depth:.13 + index % 2 * .03, material:s.color, spokes:s.spokes, hub:s.r*.2, toothDepth:Math.max(.055,s.r*.095) });
+      g.position.set(s.x,s.y,s.z);
+      g.rotation.z = index * .31;
+      gearTrain.add(g);
+      animatedGears.push({ object:g, speed:s.speed });
+    });
+    // Pinion stacks communicate real depth and gearing
+    [[-.35,.55],[1.62,1.45],[2.82,-.05],[1.62,-1.47]].forEach(([x,y],i) => {
+      const pinion = createGear({ radius:.27, teeth:12, depth:.23, material: i%2 ? mat.steel : mat.blueSteel, spokes:4, hub:.08, toothDepth:.055 });
+      pinion.position.set(x,y,1.03);
+      gearTrain.add(pinion);
+      animatedGears.push({ object:pinion, speed:(i%2?-1:1)*(1.2+i*.3) });
+    });
+    movement.add(registerPart(gearTrain, {
+      id:'gear-train', code:'Transmission 03', name:'五级走时轮系',
+      lead:'不同齿数的轮与小齿轴逐级传递扭矩，把发条盒的缓慢转动转换成精准的秒脉冲。',
+      metrics:[['5','传动级'],['0.4 μm','齿面公差'],['14 K','金质轮']],
+      details:[['组成','中心轮 · 三轮 · 四轮'],['修饰','太阳纹与环形纹'],['轴榫','镜面抛光钢'],['啮合','渐开线齿形']]
+    }, 4.2));
+
+    // Balance wheel and breathing hairspring
+    const balance = new THREE.Group();
+    balance.position.set(-2.55,-2.66,1.02);
+    const balanceWheel = new THREE.Group();
+    const balanceRim = ring(1.19,.10,mat.roseGold,96);
+    balanceWheel.add(balanceRim);
+    for(let i=0;i<3;i++){
+      const a=i*Math.PI*2/3;
+      const spoke=new THREE.Mesh(new THREE.BoxGeometry(1.07,.085,.11),mat.roseGold);
+      spoke.position.set(Math.cos(a)*.53,Math.sin(a)*.53,0);
+      spoke.rotation.z=a;
+      balanceWheel.add(spoke);
+    }
+    for(let i=0;i<8;i++){
+      const a=i*Math.PI/4;
+      const weight=cylinder(.095,.12,mat.gold,24);
+      weight.position.set(Math.cos(a)*1.18,Math.sin(a)*1.18,.02);
+      balanceWheel.add(weight);
+    }
+    balanceWheel.add(cylinder(.18,.28,mat.steel,36));
+    balance.add(balanceWheel);
+    const hairspring = spiralTube(.08,.82,9.2,.09,mat.blueSteel,.018,300);
+    balance.add(hairspring);
+    const stud = cylinder(.08,.24,mat.gold,20); stud.position.set(.84,.04,.1); balance.add(stud);
+    balance.add(jewel(.18));
+    movement.add(registerPart(balance, {
+      id:'balance', code:'Regulation 04', name:'摆轮与游丝',
+      lead:'无卡度摆轮每秒往复八次；蓝钢游丝如同机芯的呼吸，决定腕表的时间基准。',
+      metrics:[['4 Hz','振动频率'],['28,800','每小时振次'],['8','微调砝码']],
+      details:[['摆轮','可变惯量三臂摆轮'],['游丝','平面式蓝钢合金'],['抗磁','约 15,000 高斯'],['调校','五方位调校']]
+    }, 5.5));
+
+    // Escapement wheel, pallet fork and impulse jewel
+    const escapement = new THREE.Group();
+    escapement.position.set(.15,-2.78,1.18);
+    const escapeWheel = createGear({radius:.58,teeth:20,depth:.11,material:mat.steel,spokes:5,hub:.11,toothDepth:.12});
+    escapeWheel.position.x=.47;
+    escapement.add(escapeWheel);
+    animatedGears.push({object:escapeWheel,speed:1.35,stepped:true});
+    const forkShape = new THREE.Shape();
+    forkShape.moveTo(-.72,-.16); forkShape.lineTo(-.2,-.08); forkShape.lineTo(.05,-.4);
+    forkShape.lineTo(.2,-.32); forkShape.lineTo(.05,.04); forkShape.lineTo(.21,.38);
+    forkShape.lineTo(.04,.44); forkShape.lineTo(-.22,.13); forkShape.lineTo(-.72,.2); forkShape.closePath();
+    const fork = extrudedShape(forkShape,.12,mat.roseGold,.02);
+    fork.position.x=-.3;
+    escapement.add(fork);
+    const pallet1 = new THREE.Mesh(new THREE.BoxGeometry(.24,.11,.14),mat.ruby); pallet1.position.set(.06,.37,.08); pallet1.rotation.z=-.35;
+    const pallet2 = pallet1.clone(); pallet2.material=mat.ruby.clone(); pallet2.position.set(.06,-.35,.08); pallet2.rotation.z=.35;
+    escapement.add(pallet1,pallet2);
+    const impulse = jewel(.11); impulse.position.set(-.76,0,.1); escapement.add(impulse);
+    movement.add(registerPart(escapement, {
+      id:'escapement', code:'Impulse 05', name:'瑞士杠杆擒纵',
+      lead:'擒纵轮与红宝石叉瓦交替锁止，将连续能量切分为稳定脉冲并维持摆轮振荡。',
+      metrics:[['20','擒纵齿'],['2','红宝石叉瓦'],['8 Hz','锁止脉冲']],
+      details:[['类型','瑞士杠杆式'],['擒纵轮','镍磷合金'],['叉瓦','合成红宝石'],['润滑','微量定点润滑']]
+    }, 6.2));
+
+    // Skeleton bridges with polished bevels, screws and engraving
+    const bridges = new THREE.Group();
+    const bridgePieces = [
+      bridge(3.3,.62,-.18,1.72,2.66,1.55,mat.roseGold,[{x:1.05,y:0,r:.17},{x:-1.08,y:0,r:.15}]),
+      bridge(3.85,.56,.46,.5,-.55,1.65,mat.brushedSteel,[{x:1.5,y:0,r:.16},{x:-1.5,y:0,r:.13}]),
+      bridge(2.2,.52,-.52,-3.15,-1.68,1.63,mat.roseGold,[{x:-.76,y:0,r:.14}]),
+      bridge(2.45,.45,.82,3.0,.8,1.5,mat.brushedSteel,[{x:.88,y:0,r:.12}])
+    ];
+    bridgePieces.forEach(p=>bridges.add(p));
+    const bridgeBosses=[[-.06,2.39],[3.0,2.33],[-3.77,-1.14],[-2.44,-2.2],[1.8,.1],[3.76,1.55]];
+    bridgeBosses.forEach(([x,y],i)=>{
+      const boss=cylinder(.24,.2,i%2?mat.roseGold:mat.brushedSteel,36); boss.position.set(x,y,1.58); bridges.add(boss);
+      const s=screw(.115,.1,i%3!==0); s.position.set(x,y,1.72); bridges.add(s);
+    });
+    movement.add(registerPart(bridges, {
+      id:'bridges', code:'Architecture 06', name:'镂空夹板系统',
+      lead:'以最少覆盖支撑整套轮系。手工抛光内角、拉丝表面与镜面倒角在光线下清晰分层。',
+      metrics:[['4','独立夹板'],['42','手工倒角'],['0.2 mm','夹板厚度']],
+      details:[['材质','钛金属与玫瑰金'],['倒角','手工镜面抛光'],['表面','直纹拉丝'],['固定','热蓝钢螺钉']]
+    }, 7.0));
+    addEngraving('CAL. 01  ·  THIRTY-ONE JEWELS',.72,2.7,1.68,2.55,-.18);
+
+    // Ruby bearing array
+    const jewels = new THREE.Group();
+    const jewelPositions=[[-.35,.55,1.38],[1.62,1.45,1.32],[2.82,-.05,1.42],[1.62,-1.47,1.29],[-.3,-1.4,1.2],[-2.55,1.62,1.39],[-2.55,-2.66,1.26],[.63,-2.78,1.38],[3.62,1.8,1.1],[-3.64,-.5,1.08]];
+    jewelPositions.forEach(([x,y,z],i)=>{const j=jewel(i<8?.14:.11);j.position.set(x,y,z);jewels.add(j);});
+    movement.add(registerPart(jewels, {
+      id:'jewels', code:'Friction 07', name:'红宝石轴承',
+      lead:'合成红宝石以极低摩擦承托高速旋转的轮轴，同时呈现机芯标志性的深红光点。',
+      metrics:[['31','宝石总数'],['9 Mohs','硬度'],['0.02','摩擦系数']],
+      details:[['材料','单晶氧化铝'],['用途','降低轴榫摩擦'],['安装','金套筒压入'],['颜色','铬离子致色']]
+    }, 7.8));
+
+    // Fine screws and banking pins across the movement
+    [[-4.45,2.55],[4.38,2.7],[-4.2,-3.15],[4.3,-2.8],[-.2,4.42],[2.7,3.75],[-3.1,3.75],[3.75,-1.55]].forEach(([x,y],i)=>{
+      const s=screw(.12,.1,i%3!==1); s.position.set(x,y,.72); movement.add(s);
+    });
+
+    // Peripheral dial, minute track and luminous applied indices
+    const dialRing = new THREE.Mesh(new THREE.RingGeometry(5.35,5.86,128),mat.blackMetal);
+    dialRing.position.z=2.16;
+    dial.add(dialRing);
+    const dialEdge=ring(5.58,.08,mat.roseGold,128);dialEdge.position.z=2.23;dial.add(dialEdge);
+    const minuteRail=ring(5.15,.018,new THREE.MeshBasicMaterial({color:0x80928a,transparent:true,opacity:.45}),128);minuteRail.position.z=2.28;dial.add(minuteRail);
+
+    const indexGroup=new THREE.Group();
+    const lumeMeshes=[];
+    for(let i=0;i<60;i++){
+      const a=i/60*Math.PI*2;
+      const major=i%5===0;
+      const base=new THREE.Mesh(new THREE.BoxGeometry(major?(i%15===0?.16:.11):.022,major?.58:.16,.09),major?mat.roseGold:mat.brushedSteel);
+      base.position.set(Math.sin(a)*(major?5.22:5.34),Math.cos(a)*(major?5.22:5.34),2.3);
+      base.rotation.z=-a;
+      indexGroup.add(base);
+      if(major){
+        const lume=new THREE.Mesh(new THREE.BoxGeometry(i%15===0?.09:.055,.39,.055),mat.lume);
+        lume.position.set(Math.sin(a)*5.22,Math.cos(a)*5.22,2.37);
+        lume.rotation.z=-a;
+        indexGroup.add(lume);lumeMeshes.push(lume);
+      }
+    }
+    dial.add(indexGroup);
+
+    // Cardinal markers with doubled geometry at twelve
+    const twelveL=new THREE.Mesh(new THREE.BoxGeometry(.11,.62,.08),mat.lume);twelveL.position.set(-.13,5.17,2.4);
+    const twelveR=twelveL.clone();twelveR.material=mat.lume.clone();twelveR.position.x=.13;
+    dial.add(twelveL,twelveR);lumeMeshes.push(twelveL,twelveR);
+
+    // Small seconds register
+    const secondsRing=ring(1.08,.035,mat.roseGold,72); secondsRing.position.set(2.55,-2.72,2.42); dial.add(secondsRing);
+    for(let i=0;i<30;i++){
+      const a=i/30*Math.PI*2;
+      const tick=new THREE.Mesh(new THREE.BoxGeometry(i%5===0?.035:.018,i%5===0?.18:.10,.02),new THREE.MeshBasicMaterial({color:i%5===0?0xc5a36b:0x66716b}));
+      tick.position.set(2.55+Math.sin(a)*.92,-2.72+Math.cos(a)*.92,2.44);tick.rotation.z=-a;dial.add(tick);
+    }
+    registerPart(dial, {
+      id:'dial', code:'Reading 08', name:'悬浮式分钟轨道',
+      lead:'外围分钟圈悬浮于机芯上方，保留完整读时功能，同时不遮挡机械结构。',
+      metrics:[['60','分钟刻度'],['12','镶贴时标'],['1','小秒盘']],
+      details:[['底材','黑色钛金属'],['刻度','玫瑰金镶贴'],['分钟轨','铁路式'],['结构','外围悬浮']]
+    }, 8.8);
+
+    function handShape(length,width,tail=.36){
+      const s=new THREE.Shape();
+      s.moveTo(-width*.55,-tail);s.lineTo(-width*.9,.1);s.lineTo(-width*.38,length*.78);
+      s.lineTo(0,length);s.lineTo(width*.38,length*.78);s.lineTo(width*.9,.1);s.lineTo(width*.55,-tail);s.closePath();return s;
+    }
+    function createHand(length,width,angle){
+      const g=new THREE.Group();
+      const metal=extrudedShape(handShape(length,width),.075,mat.roseGold,.015);
+      g.add(metal);
+      const lumeShape=handShape(length*.74,width*.31,.05);
+      const lume=extrudedShape(lumeShape,.045,mat.lume,.009);
+      lume.position.y=length*.15;lume.position.z=.065;g.add(lume);lumeMeshes.push(lume);
+      g.rotation.z=angle;return g;
+    }
+    const hands=new THREE.Group();
+    hands.position.z=2.65;
+    const hourHand=createHand(2.72,.28,Math.PI/3);
+    const minuteHand=createHand(4.02,.21,-Math.PI/3);
+    minuteHand.position.z=.13;
+    hands.add(hourHand,minuteHand);
+    const canonPinion=cylinder(.24,.28,mat.roseGold,40);canonPinion.position.z=.18;hands.add(canonPinion);
+    const cap=cylinder(.11,.33,mat.lume,32);cap.position.z=.34;hands.add(cap);lumeMeshes.push(cap);
+    const secondsHand=new THREE.Group();secondsHand.position.set(2.55,-2.72,.02);
+    const secNeedle=new THREE.Mesh(new THREE.BoxGeometry(.027,1.5,.035),mat.lume);secNeedle.position.y=.46;secondsHand.add(secNeedle);lumeMeshes.push(secNeedle);
+    const secCounter=cylinder(.085,.08,mat.roseGold,24);secondsHand.add(secCounter);hands.add(secondsHand);
+    display.add(registerPart(hands, {
+      id:'display', code:'Luminous 09', name:'夜光镂空指针',
+      lead:'镂空玫瑰金指针填充高强度夜光材料，暗光中呈现悬浮于机芯之上的绿色轮廓。',
+      metrics:[['10 h','余辉时长'],['1600 K','烧结温度'],['3','显示指针']],
+      details:[['夜光材料','长余辉铝酸盐'],['指针','玫瑰金镂空'],['读时','小时 · 分钟 · 小秒'],['预设位置','经典 10:10']]
+    }, 10.4));
+
+    // Sapphire crystal: a thin transmitted disc plus polished edge
+    const sapphire=new THREE.Group();
+    const crystal=cylinder(5.92,.16,mat.glass,128);crystal.position.z=3.02;sapphire.add(crystal);
+    const crystalEdge=ring(5.91,.075,mat.glass,144);crystalEdge.position.z=3.04;sapphire.add(crystalEdge);
+    const glareTex=canvasTexture((ctx,w,h)=>{
+      const grad=ctx.createLinearGradient(0,0,w,h);
+      grad.addColorStop(0,'rgba(255,255,255,0)');grad.addColorStop(.42,'rgba(210,255,241,.05)');
+      grad.addColorStop(.5,'rgba(255,255,255,.2)');grad.addColorStop(.57,'rgba(190,244,228,.03)');grad.addColorStop(1,'rgba(255,255,255,0)');
+      ctx.fillStyle=grad;ctx.fillRect(0,0,w,h);
+    },512,512);
+    const glare=new THREE.Mesh(new THREE.CircleGeometry(5.68,96),new THREE.MeshBasicMaterial({map:glareTex,transparent:true,opacity:.34,depthWrite:false,blending:THREE.AdditiveBlending}));
+    glare.position.z=3.12;glare.rotation.z=-.32;sapphire.add(glare);
+    watch.add(registerPart(sapphire, {
+      id:'sapphire', code:'Crystal 10', name:'拱形蓝宝石水晶',
+      lead:'高折射率双面防眩蓝宝石形成近乎无形的保护层，并保留边缘冷色反光。',
+      metrics:[['1.77','折射率'],['9 Mohs','硬度'],['2','防眩镀层']],
+      details:[['材质','合成蓝宝石'],['轮廓','微拱形'],['镀膜','双面防反射'],['透光率','约 99%']]
+    }, 13.0));
+
+    // Ground reflection, architectural halos and restrained floating dust
+    const ground=new THREE.Mesh(new THREE.PlaneGeometry(60,60),new THREE.MeshPhysicalMaterial({color:0x050706,metalness:.35,roughness:.34,transparent:true,opacity:.72}));
+    ground.rotation.x=-Math.PI/2;ground.position.y=-7.4;ground.receiveShadow=true;scene.add(ground);
+    const haloMat=new THREE.MeshBasicMaterial({color:0x4ebf96,transparent:true,opacity:.045,side:THREE.DoubleSide,blending:THREE.AdditiveBlending,depthWrite:false});
+    for(let i=0;i<4;i++){
+      const halo=new THREE.Mesh(new THREE.TorusGeometry(8.7+i*1.55,.012,6,160),haloMat.clone());
+      halo.position.set(-.8+i*.55,.3-i*.2,-2.4-i*.7);halo.rotation.x=.18;scene.add(halo);
+    }
+    const dustGeo=new THREE.BufferGeometry();
+    const dustCount=isTouch?90:180;const dustPos=new Float32Array(dustCount*3);
+    for(let i=0;i<dustCount;i++){dustPos[i*3]=(Math.random()-.5)*30;dustPos[i*3+1]=(Math.random()-.5)*22;dustPos[i*3+2]=(Math.random()-.5)*18;}
+    dustGeo.setAttribute('position',new THREE.BufferAttribute(dustPos,3));
+    const dust=new THREE.Points(dustGeo,new THREE.PointsMaterial({color:0xb8d6ca,size:.018,transparent:true,opacity:.23,depthWrite:false}));scene.add(dust);
+
+    const raycaster=new THREE.Raycaster();
+    const pointer=new THREE.Vector2(-10,-10);
+    const tooltip=document.getElementById('tooltip');
+    const tooltipId=document.getElementById('tooltip-id');
+    const tooltipName=document.getElementById('tooltip-name');
+    let hoveredId=null,selectedId=null,pointerDown={x:0,y:0};
+
+    function setHighlight(id,on,strength=1){
+      const entry=parts.get(id);if(!entry)return;
+      entry.root.traverse(child=>{
+        if(!child.isMesh)return;
+        const materials=Array.isArray(child.material)?child.material:[child.material];
+        materials.forEach(m=>{
+          if(!m.emissive)return;
+          const base=m.userData.baseEmissive || new THREE.Color(0);
+          m.emissive.copy(base).lerp(new THREE.Color(0x5affb8),on?.38*strength:0);
+          m.emissiveIntensity=on?Math.max(m.userData.baseEmissiveIntensity||1,1.45):m.userData.baseEmissiveIntensity||1;
+        });
+      });
+    }
+
+    function updateHover(id,event){
+      if(hoveredId===id){
+        if(id)tooltip.style.transform=`translate3d(${event.clientX}px,${event.clientY}px,0)`;
+        return;
+      }
+      if(hoveredId&&hoveredId!==selectedId)setHighlight(hoveredId,false);
+      hoveredId=id;
+      if(id){
+        const data=parts.get(id).data;
+        setHighlight(id,true,.75);
+        tooltipId.textContent=data.code;
+        tooltipName.textContent=data.name;
+        tooltip.style.transform=`translate3d(${event.clientX}px,${event.clientY}px,0)`;
+        tooltip.classList.add('visible');
+        renderer.domElement.style.cursor='pointer';
+      }else{
+        tooltip.classList.remove('visible');
+        renderer.domElement.style.cursor=controls.state===-1?'grab':'grabbing';
+      }
+    }
+
+    function updatePanel(id){
+      const panel=document.getElementById('panel');
+      if(!id){
+        document.getElementById('panel-kicker').textContent='Manufacture Calibre';
+        document.getElementById('panel-title').textContent='时间的机械建筑';
+        document.getElementById('panel-lead').textContent='由 248 枚零件组成的手动上链镂空机芯。拖动观察，悬停识别零件，点击锁定并探索其功能。';
+        document.getElementById('metric-grid').innerHTML='<div class="metric"><div class="metric-value">72 h</div><div class="metric-label">动力储存</div></div><div class="metric"><div class="metric-value">31</div><div class="metric-label">红宝石</div></div><div class="metric"><div class="metric-value">4 Hz</div><div class="metric-label">摆频</div></div>';
+        document.getElementById('detail-list').innerHTML='<div class="detail-row"><span>机芯直径</span><span>34.6 mm</span></div><div class="detail-row"><span>结构</span><span>手动上链 · 镂空</span></div><div class="detail-row"><span>表壳</span><span>钛金属 · 蓝宝石水晶</span></div><div class="detail-row"><span>显示</span><span>时 · 分 · 小秒</span></div>';
+        return;
+      }
+      const d=parts.get(id).data;
+      document.getElementById('panel-kicker').textContent=d.code;
+      document.getElementById('panel-title').textContent=d.name;
+      document.getElementById('panel-lead').textContent=d.lead;
+      document.getElementById('metric-grid').innerHTML=d.metrics.map(m=>`<div class="metric"><div class="metric-value">${m[0]}</div><div class="metric-label">${m[1]}</div></div>`).join('');
+      document.getElementById('detail-list').innerHTML=d.details.map(row=>`<div class="detail-row"><span>${row[0]}</span><span>${row[1]}</span></div>`).join('');
+      panel.classList.remove('closed');
+    }
+
+    function selectPart(id){
+      if(selectedId)setHighlight(selectedId,false);
+      selectedId=id;
+      if(id)setHighlight(id,true,1);
+      updatePanel(id);
+    }
+
+    function hitTest(event){
+      const rect=renderer.domElement.getBoundingClientRect();
+      pointer.x=((event.clientX-rect.left)/rect.width)*2-1;
+      pointer.y=-((event.clientY-rect.top)/rect.height)*2+1;
+      raycaster.setFromCamera(pointer,camera);
+      const hit=raycaster.intersectObjects(interactives,false)[0];
+      return hit?.object.userData.partId || null;
+    }
+
+    renderer.domElement.addEventListener('pointermove',e=>{
+      if(isTouch)return;
+      updateHover(hitTest(e),e);
+    });
+    renderer.domElement.addEventListener('pointerleave',e=>updateHover(null,e));
+    renderer.domElement.addEventListener('pointerdown',e=>{pointerDown={x:e.clientX,y:e.clientY};document.getElementById('hint').classList.add('hide');});
+    renderer.domElement.addEventListener('pointerup',e=>{
+      const moved=Math.hypot(e.clientX-pointerDown.x,e.clientY-pointerDown.y);
+      if(moved<5)selectPart(hitTest(e));
+    });
+
+    // Persistent hotspot labels
+    const hotspotsRoot=document.getElementById('hotspots');
+    const hotspotElements=new Map();
+    hotspotIds.forEach(id=>{
+      const el=document.createElement('button');
+      el.className='hotspot';el.type='button';el.dataset.id=id;
+      el.innerHTML=`<span>${parts.get(id).data.name}</span>`;
+      el.addEventListener('click',()=>selectPart(id));
+      hotspotsRoot.appendChild(el);hotspotElements.set(id,el);
+    });
+    let labelsVisible=false;
+
+    function updateHotspots(){
+      if(!labelsVisible){hotspotsRoot.style.display='none';return;}
+      hotspotsRoot.style.display='block';
+      const w=innerWidth,h=innerHeight;
+      hotspotElements.forEach((el,id)=>{
+        const obj=parts.get(id).root;
+        const pos=new THREE.Vector3();obj.getWorldPosition(pos);pos.project(camera);
+        const visible=pos.z>-1&&pos.z<1&&Math.abs(pos.x)<1.08&&Math.abs(pos.y)<1.08;
+        el.classList.toggle('offscreen',!visible);
+        el.style.transform=`translate3d(${(pos.x*.5+.5)*w}px,${(-pos.y*.5+.5)*h}px,0) translate(-4px,-4px)`;
+      });
+    }
+
+    let explodeTarget=0,explodeProgress=0;
+    let lumeMode=false;
+    const explodeButton=document.getElementById('explode-button');
+    explodeButton.addEventListener('click',()=>{
+      explodeTarget=explodeTarget?0:1;
+      explodeButton.classList.toggle('active',!!explodeTarget);
+      explodeButton.setAttribute('aria-pressed',String(!!explodeTarget));
+      if(explodeTarget&&!labelsVisible)document.getElementById('label-button').click();
+    });
+
+    const rotateButton=document.getElementById('rotate-button');
+    rotateButton.addEventListener('click',()=>{
+      controls.autoRotate=!controls.autoRotate;
+      rotateButton.classList.toggle('active',controls.autoRotate);
+      rotateButton.setAttribute('aria-pressed',String(controls.autoRotate));
+    });
+
+    const labelButton=document.getElementById('label-button');
+    labelButton.addEventListener('click',()=>{
+      labelsVisible=!labelsVisible;
+      labelButton.classList.toggle('active',labelsVisible);
+      labelButton.setAttribute('aria-pressed',String(labelsVisible));
+      hotspotsRoot.setAttribute('aria-hidden',String(!labelsVisible));
+    });
+
+    document.getElementById('lume-button').addEventListener('click',e=>{
+      lumeMode=!lumeMode;
+      e.currentTarget.classList.toggle('active',lumeMode);
+      e.currentTarget.setAttribute('aria-pressed',String(lumeMode));
+      renderer.toneMappingExposure=lumeMode?.72:1.16;
+      bloom.strength=lumeMode?1.24:.52;
+      bloom.threshold=lumeMode?.42:.72;
+      mat.lume.emissiveIntensity=lumeMode?5.8:2.6;
+      lumeMeshes.forEach(mesh=>mesh.material.emissiveIntensity=lumeMode?5.8:2.6);
+      lights.forEach((light,i)=>light.intensity*=lumeMode?.55:1/.55);
+    });
+
+    let cameraGoal=null,targetGoal=null;
+    function resetView(){
+      cameraGoal=new THREE.Vector3(.2,1.1,isTouch?25:22);
+      targetGoal=new THREE.Vector3(0,0,.8);
+      selectPart(null);
+    }
+    document.getElementById('reset-button').addEventListener('click',resetView);
+
+    document.getElementById('focus-button').addEventListener('click',()=>{
+      if(!selectedId){cameraGoal=new THREE.Vector3(.2,1.1,17);targetGoal=new THREE.Vector3(0,0,1);return;}
+      const pos=new THREE.Vector3();parts.get(selectedId).root.getWorldPosition(pos);
+      targetGoal=pos.clone();
+      const direction=camera.position.clone().sub(controls.target).normalize();
+      cameraGoal=pos.clone().add(direction.multiplyScalar(9.2));
+      controls.autoRotate=false;rotateButton.classList.remove('active');rotateButton.setAttribute('aria-pressed','false');
+    });
+
+    const panel=document.getElementById('panel');
+    document.getElementById('panel-close').addEventListener('click',()=>panel.classList.add('closed'));
+    document.getElementById('info-toggle').addEventListener('click',()=>panel.classList.toggle('closed'));
+
+    let forkAngle=0;
+    const clock=new THREE.Clock();
+    function animate(){
+      requestAnimationFrame(animate);
+      const t=clock.getElapsedTime();
+      const dt=Math.min(clock.getDelta(),.05);
+
+      controls.update();
+      if(cameraGoal){
+        camera.position.lerp(cameraGoal,.055);
+        controls.target.lerp(targetGoal,.065);
+        if(camera.position.distanceTo(cameraGoal)<.03){cameraGoal=null;targetGoal=null;}
+      }
+
+      explodeProgress=THREE.MathUtils.damp(explodeProgress,explodeTarget,4.2,Math.max(dt,.016));
+      parts.forEach(({root})=>{
+        const base=root.userData.basePosition;
+        if(!base)return;
+        root.position.z=base.z+(root.userData.explode||0)*explodeProgress;
+      });
+
+      if(!reduceMotion){
+        animatedGears.forEach((g,i)=>{
+          if(g.stepped){
+            const steps=20;g.object.rotation.z=Math.floor(t*g.speed*steps)/steps;
+          }else g.object.rotation.z+=g.speed*.0026;
+        });
+        const beat=Math.sin(t*Math.PI*8);
+        balanceWheel.rotation.z=beat*.39;
+        hairspring.scale.setScalar(1+beat*.032);
+        forkAngle=beat*.12;fork.rotation.z=forkAngle;
+        secondsHand.rotation.z=-t*Math.PI/30;
+        crown.rotation.x=Math.sin(t*.22)*.025;
+        dust.rotation.y=t*.006;dust.position.y=Math.sin(t*.14)*.08;
+        glare.material.opacity=.24+Math.sin(t*.35)*.08;
+      }
+
+      updateHotspots();
+      composer.render();
+    }
+
+    controls.addEventListener('start',()=>document.getElementById('hint').classList.add('hide'));
+    window.addEventListener('resize',()=>{
+      camera.aspect=innerWidth/innerHeight;camera.updateProjectionMatrix();
+      renderer.setPixelRatio(Math.min(devicePixelRatio,2));renderer.setSize(innerWidth,innerHeight);composer.setSize(innerWidth,innerHeight);
+      bloom.resolution.set(innerWidth,innerHeight);
+    });
+
+    renderer.compile(scene,camera);
+    animate();
+    setTimeout(()=>document.getElementById('loading').classList.add('done'),720);
+  </script>
+</body>
+</html>
diff --git a/outputs/gpt-5-6-terra/codex-cli-ultra/mythos-craft.html b/outputs/gpt-5-6-terra/codex-cli-ultra/mythos-craft.html
new file mode 100644
index 0000000..001bbb9
--- /dev/null
+++ b/outputs/gpt-5-6-terra/codex-cli-ultra/mythos-craft.html
@@ -0,0 +1,1078 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>阿斯特拉：方块神话</title>
+  <style>
+    :root {
+      color-scheme: dark;
+      --ink: #efe6c9;
+      --line: rgba(243, 224, 170, .42);
+      --panel: rgba(8, 17, 24, .68);
+      --amber: #ffd56d;
+    }
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #87b9dc; }
+    body {
+      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
+      user-select: none;
+      cursor: crosshair;
+    }
+    canvas { position: fixed; inset: 0; display: block; image-rendering: pixelated; }
+    #hud { position: fixed; inset: 0; pointer-events: none; color: var(--ink); text-shadow: 0 2px 2px #081117; }
+    #brand {
+      position: absolute; top: 22px; left: 24px; max-width: 360px;
+      border-left: 3px solid var(--amber); padding: 8px 0 8px 13px;
+      background: linear-gradient(90deg, rgba(8,17,24,.63), transparent);
+    }
+    #brand h1 { margin: 0 0 4px; font-size: 14px; letter-spacing: .16em; color: #fff0ba; }
+    #brand p { margin: 0; font-size: 11px; opacity: .84; line-height: 1.55; }
+    #readout {
+      position: absolute; top: 22px; right: 24px; text-align: right;
+      font-size: 11px; line-height: 1.72; color: #edf4e6;
+    }
+    #crosshair {
+      position: absolute; left: 50%; top: 50%; width: 20px; height: 20px;
+      transform: translate(-50%, -50%);
+    }
+    #crosshair::before, #crosshair::after {
+      content: ""; position: absolute; background: rgba(255,255,255,.94);
+      box-shadow: 0 1px 2px #000;
+    }
+    #crosshair::before { width: 2px; height: 20px; left: 9px; top: 0; }
+    #crosshair::after { width: 20px; height: 2px; left: 0; top: 9px; }
+    #lore {
+      position: absolute; left: 24px; bottom: 112px; width: min(350px, calc(100vw - 48px));
+      padding: 11px 13px; border: 1px solid var(--line); background: var(--panel);
+      font-size: 11px; line-height: 1.62; color: #e4e7d8;
+    }
+    #lore strong { color: #ffe59b; letter-spacing: .08em; }
+    #toast {
+      position: absolute; left: 50%; bottom: 154px; transform: translateX(-50%);
+      padding: 8px 13px; border: 1px solid rgba(255,229,155,.38);
+      background: rgba(7,15,22,.75); color: #fff2bf; font-size: 11px;
+      opacity: 0; transition: opacity .2s ease;
+    }
+    #toast.show { opacity: 1; }
+    #hotbar {
+      position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%);
+      display: flex; gap: 6px; padding: 7px; border: 1px solid rgba(255,245,204,.42);
+      background: rgba(5,12,17,.62);
+    }
+    .slot {
+      position: relative; width: 56px; height: 56px; border: 1px solid rgba(241,231,194,.32);
+      background: rgba(25,39,43,.74); display: grid; place-items: center;
+      transition: transform .12s ease, border-color .12s ease, background .12s ease;
+    }
+    .slot.active {
+      transform: translateY(-5px); border-color: #ffe69a; background: rgba(99,79,42,.76);
+      box-shadow: 0 0 0 1px rgba(255,224,132,.35), 0 5px 18px rgba(0,0,0,.35);
+    }
+    .swatch { width: 27px; height: 27px; border: 2px solid rgba(0,0,0,.34); image-rendering: pixelated; }
+    .slot b { position: absolute; left: 5px; top: 3px; font-size: 10px; color: #fff3c8; }
+    .slot span { position: absolute; bottom: 4px; left: 0; width: 100%; text-align: center; font-size: 9px; color: #dce7dc; }
+    #cover {
+      position: fixed; inset: 0; z-index: 5; display: grid; place-items: center;
+      background:
+        linear-gradient(rgba(5,12,16,.32), rgba(5,12,16,.78)),
+        radial-gradient(circle at 50% 30%, rgba(105,181,214,.34), transparent 42%);
+      transition: opacity .25s ease;
+    }
+    #cover.hidden { opacity: 0; pointer-events: none; }
+    .card {
+      width: min(560px, calc(100vw - 40px)); padding: 30px 32px 27px;
+      border: 1px solid rgba(255,229,157,.54); background: rgba(5,14,21,.76);
+      box-shadow: 0 16px 70px rgba(0,0,0,.48), inset 0 0 0 1px rgba(119,188,205,.12);
+      text-align: center;
+    }
+    .eyebrow { font-size: 11px; letter-spacing: .26em; color: #f6d977; }
+    .card h2 { margin: 12px 0 9px; font-size: clamp(25px, 5vw, 42px); letter-spacing: .1em; color: #fff2c0; }
+    .card p { margin: 0 auto 21px; max-width: 440px; color: #d7e3de; font-size: 12px; line-height: 1.75; }
+    #enter {
+      border: 1px solid #ffe39a; background: linear-gradient(#9c7440, #614424);
+      color: #fff3c2; padding: 12px 22px; cursor: pointer; font: inherit; letter-spacing: .14em;
+      box-shadow: inset 0 0 0 1px rgba(255,255,255,.15), 0 5px 18px rgba(0,0,0,.28);
+    }
+    #enter:hover { background: linear-gradient(#bf9452, #76522b); }
+    .keys { margin-top: 19px; color: #adc7c3; font-size: 10px; line-height: 1.8; }
+    .key { display: inline-block; min-width: 23px; padding: 1px 5px; border: 1px solid rgba(214,235,226,.42); color: #f0f3da; }
+    #loading {
+      position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
+      color: #fff2bd; font-size: 10px; letter-spacing: .12em;
+    }
+    @media (max-width: 650px) {
+      #brand { top: 12px; left: 12px; }
+      #readout { top: 12px; right: 12px; font-size: 9px; }
+      #lore { left: 12px; bottom: 98px; font-size: 9px; width: calc(100vw - 24px); }
+      #hotbar { bottom: 16px; gap: 3px; padding: 4px; }
+      .slot { width: 44px; height: 44px; }
+      .slot span { font-size: 7px; }
+      .swatch { width: 22px; height: 22px; }
+      .card { padding: 24px 18px; }
+    }
+  </style>
+</head>
+<body>
+  <div id="hud">
+    <section id="brand">
+      <h1>阿斯特拉 方块神话</h1>
+      <p>柏林噪声塑造的无尽荒野。古星祠、世界树与云穹浮城在同一片地平线上苏醒。</p>
+    </section>
+    <div id="readout">
+      <div id="zone">区域：星祠遗址</div>
+      <div id="coords">X 0　Y 0　Z 0</div>
+      <div id="chunkInfo">地形：准备中</div>
+    </div>
+    <div id="crosshair"></div>
+    <div id="toast"></div>
+    <div id="lore"><strong>旅者札记</strong><br>向北穿过月门可见云穹浮城；西侧有一株被星火唤醒的世界树。方块可被自由采掘与重塑。</div>
+    <div id="hotbar"></div>
+  </div>
+  <main id="cover">
+    <section class="card">
+      <div class="eyebrow">ONE WORLD · MANY LEGENDS</div>
+      <h2>进入阿斯特拉</h2>
+      <p>这是一片由程序化柏林噪声延展的方块世界。近处的石阶通往破碎星祠，远处的瀑布从漂浮的古城倾泻而下。</p>
+      <button id="enter">点击开始探索</button>
+      <div class="keys">
+        <span class="key">W</span><span class="key">A</span><span class="key">S</span><span class="key">D</span> 移动　
+        鼠标 环视　
+        <span class="key">空格</span> 跳跃<br>
+        左键 破坏　右键 放置　<span class="key">1</span> 至 <span class="key">6</span> 选择方块　<span class="key">Shift</span> 冲刺
+      </div>
+      <div id="loading">正在唤醒中心地形</div>
+    </section>
+  </main>
+
+  <script type="importmap">
+    { "imports": { "three": "https://cdn.jsdelivr.net/npm/three@0.161.0/build/three.module.js" } }
+  </script>
+  <script type="module">
+    import * as THREE from "three";
+
+    const AIR = 0;
+    const GRASS = 1;
+    const DIRT = 2;
+    const STONE = 3;
+    const SAND = 4;
+    const MOSS = 5;
+    const MARBLE = 6;
+    const OBSIDIAN = 7;
+    const WOOD = 8;
+    const LEAVES = 9;
+    const CRYSTAL = 10;
+    const GOLD = 11;
+    const WATER = 12;
+
+    const BLOCK_NAMES = {
+      [GRASS]: "草方块",
+      [STONE]: "古岩",
+      [MARBLE]: "月白石",
+      [OBSIDIAN]: "夜曜石",
+      [WOOD]: "世界树木",
+      [CRYSTAL]: "星辉晶"
+    };
+    const SELECTABLE = [GRASS, STONE, MARBLE, OBSIDIAN, WOOD, CRYSTAL];
+    const CHUNK_SIZE = 16;
+    const LOAD_RADIUS = 2;
+    const MIN_Y = -8;
+    const WATER_LEVEL = 7;
+    const PLAYER_RADIUS = 0.32;
+    const PLAYER_HEIGHT = 1.72;
+    const EYE_HEIGHT = 1.62;
+
+    const cover = document.getElementById("cover");
+    const enterButton = document.getElementById("enter");
+    const loadingText = document.getElementById("loading");
+    const readout = document.getElementById("coords");
+    const zoneReadout = document.getElementById("zone");
+    const chunkReadout = document.getElementById("chunkInfo");
+    const toast = document.getElementById("toast");
+    const hotbar = document.getElementById("hotbar");
+
+    const scene = new THREE.Scene();
+    scene.background = new THREE.Color(0x89bfdf);
+    scene.fog = new THREE.FogExp2(0x90bdd1, 0.0105);
+
+    const camera = new THREE.PerspectiveCamera(70, innerWidth / innerHeight, 0.05, 320);
+    camera.rotation.order = "YXZ";
+
+    const renderer = new THREE.WebGLRenderer({ antialias: false, powerPreference: "high-performance" });
+    renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
+    renderer.setSize(innerWidth, innerHeight);
+    renderer.outputColorSpace = THREE.SRGBColorSpace;
+    renderer.domElement.id = "world";
+    document.body.prepend(renderer.domElement);
+
+    const world = new THREE.Group();
+    scene.add(world);
+
+    const skyLight = new THREE.HemisphereLight(0xbde8ff, 0x384832, 2.15);
+    scene.add(skyLight);
+    const sunLight = new THREE.DirectionalLight(0xffe1a1, 2.25);
+    sunLight.position.set(-60, 100, -45);
+    scene.add(sunLight);
+    const sun = new THREE.Mesh(
+      new THREE.SphereGeometry(7, 12, 8),
+      new THREE.MeshBasicMaterial({ color: 0xffefb0, fog: false })
+    );
+    sun.position.set(-105, 112, -142);
+    scene.add(sun);
+
+    function hashSeed(text) {
+      let h = 2166136261;
+      for (let i = 0; i < text.length; i++) {
+        h ^= text.charCodeAt(i);
+        h = Math.imul(h, 16777619);
+      }
+      return h >>> 0;
+    }
+
+    function makeTexture(name, base, flecks, style) {
+      const canvas = document.createElement("canvas");
+      canvas.width = canvas.height = 16;
+      const ctx = canvas.getContext("2d");
+      ctx.imageSmoothingEnabled = false;
+      ctx.fillStyle = base;
+      ctx.fillRect(0, 0, 16, 16);
+      let seed = hashSeed(name);
+      const next = function () {
+        seed |= 0;
+        seed = (seed + 0x6d2b79f5) | 0;
+        let t = Math.imul(seed ^ seed >>> 15, 1 | seed);
+        t = (t + Math.imul(t ^ t >>> 7, 61 | t)) ^ t;
+        return ((t ^ t >>> 14) >>> 0) / 4294967296;
+      };
+      for (let i = 0; i < 62; i++) {
+        const size = next() > .82 ? 2 : 1;
+        ctx.fillStyle = flecks[Math.floor(next() * flecks.length)];
+        ctx.globalAlpha = .3 + next() * .7;
+        ctx.fillRect(Math.floor(next() * 16), Math.floor(next() * 16), size, size);
+      }
+      ctx.globalAlpha = 1;
+      if (style === "grass-side") {
+        ctx.fillStyle = "#6da83c";
+        ctx.fillRect(0, 0, 16, 4);
+        ctx.fillStyle = "#477a2c";
+        for (let x = 0; x < 16; x += 2) {
+          const depth = 3 + Math.floor(next() * 4);
+          ctx.fillRect(x, 3, 2, depth);
+        }
+      }
+      if (style === "wood") {
+        ctx.fillStyle = "rgba(57,31,17,.52)";
+        for (let x = 1; x < 16; x += 4) ctx.fillRect(x, 0, 1, 16);
+        ctx.fillStyle = "rgba(238,181,82,.24)";
+        for (let x = 3; x < 16; x += 5) ctx.fillRect(x, 0, 1, 16);
+      }
+      if (style === "obsidian") {
+        ctx.fillStyle = "rgba(103,63,137,.72)";
+        for (let i = 0; i < 11; i++) ctx.fillRect(Math.floor(next() * 16), Math.floor(next() * 16), 1, 1);
+      }
+      if (style === "crystal") {
+        ctx.fillStyle = "rgba(232,255,255,.86)";
+        ctx.fillRect(4, 1, 2, 12);
+        ctx.fillRect(9, 3, 1, 10);
+      }
+      if (style === "water") {
+        ctx.fillStyle = "rgba(205,250,255,.62)";
+        for (let y = 2; y < 16; y += 5) {
+          ctx.fillRect(0, y, 6, 1);
+          ctx.fillRect(9, (y + 2) % 16, 5, 1);
+        }
+      }
+      const texture = new THREE.CanvasTexture(canvas);
+      texture.colorSpace = THREE.SRGBColorSpace;
+      texture.magFilter = THREE.NearestFilter;
+      texture.minFilter = THREE.NearestMipMapNearestFilter;
+      return texture;
+    }
+
+    const tex = {
+      grassTop: makeTexture("grass-top", "#71ad42", ["#4f842e", "#96c552", "#3e6d28"]),
+      grassSide: makeTexture("grass-side", "#89532d", ["#633a20", "#a36a39", "#c1844b"], "grass-side"),
+      dirt: makeTexture("dirt", "#89532d", ["#5f371f", "#b4733c", "#6b4025"]),
+      stone: makeTexture("stone", "#68727a", ["#48535b", "#919ca0", "#59636a"]),
+      sand: makeTexture("sand", "#cdb66f", ["#e9d688", "#aa9154", "#bfa661"]),
+      moss: makeTexture("moss", "#667a58", ["#9dac6d", "#435942", "#798b54"]),
+      marble: makeTexture("marble", "#c6d5cf", ["#f3f5e6", "#8ca5a4", "#aebfba"]),
+      obsidian: makeTexture("obsidian", "#22182f", ["#4d3565", "#171222", "#5e3a75"], "obsidian"),
+      wood: makeTexture("worldroot", "#9a602c", ["#6d3c1e", "#c78b42", "#5d331b"], "wood"),
+      leaves: makeTexture("leaves", "#3f773d", ["#24562e", "#6ba44b", "#8ab958"]),
+      crystal: makeTexture("crystal", "#64d9e8", ["#a7f7fa", "#298cae", "#d1ffff"], "crystal"),
+      gold: makeTexture("gold", "#c89532", ["#f7dc78", "#8e6120", "#e9b84e"]),
+      water: makeTexture("water", "#3b9fce", ["#0f6eaa", "#78d6ed", "#2b84b6"], "water")
+    };
+
+    const materials = [
+      new THREE.MeshLambertMaterial({ map: tex.grassTop }),
+      new THREE.MeshLambertMaterial({ map: tex.grassSide }),
+      new THREE.MeshLambertMaterial({ map: tex.dirt }),
+      new THREE.MeshLambertMaterial({ map: tex.stone }),
+      new THREE.MeshLambertMaterial({ map: tex.sand }),
+      new THREE.MeshLambertMaterial({ map: tex.moss }),
+      new THREE.MeshLambertMaterial({ map: tex.marble }),
+      new THREE.MeshLambertMaterial({ map: tex.obsidian }),
+      new THREE.MeshLambertMaterial({ map: tex.wood }),
+      new THREE.MeshLambertMaterial({ map: tex.leaves }),
+      new THREE.MeshPhongMaterial({ map: tex.crystal, emissive: 0x116c7c, shininess: 95, transparent: true, opacity: .86, side: THREE.DoubleSide }),
+      new THREE.MeshPhongMaterial({ map: tex.gold, shininess: 75 }),
+      new THREE.MeshLambertMaterial({ map: tex.water, transparent: true, opacity: .68, depthWrite: false })
+    ];
+
+    function materialFor(type, normal) {
+      if (type === GRASS) return normal[1] === 1 ? 0 : normal[1] === -1 ? 2 : 1;
+      if (type === DIRT) return 2;
+      if (type === STONE) return 3;
+      if (type === SAND) return 4;
+      if (type === MOSS) return 5;
+      if (type === MARBLE) return 6;
+      if (type === OBSIDIAN) return 7;
+      if (type === WOOD) return 8;
+      if (type === LEAVES) return 9;
+      if (type === CRYSTAL) return 10;
+      if (type === GOLD) return 11;
+      return 12;
+    }
+
+    const faces = [
+      { n: [1, 0, 0], v: [[1,0,0],[1,1,0],[1,1,1],[1,0,1]] },
+      { n: [-1, 0, 0], v: [[0,0,1],[0,1,1],[0,1,0],[0,0,0]] },
+      { n: [0, 1, 0], v: [[0,1,1],[1,1,1],[1,1,0],[0,1,0]] },
+      { n: [0, -1, 0], v: [[0,0,0],[1,0,0],[1,0,1],[0,0,1]] },
+      { n: [0, 0, 1], v: [[1,0,1],[1,1,1],[0,1,1],[0,0,1]] },
+      { n: [0, 0, -1], v: [[0,0,0],[0,1,0],[1,1,0],[1,0,0]] }
+    ];
+    const quadOrder = [0, 1, 2, 0, 2, 3];
+    const quadUV = [0,0, 0,1, 1,1, 0,0, 1,1, 1,0];
+
+    const permutation = new Uint8Array(512);
+    (function makePermutation() {
+      const values = Array.from({ length: 256 }, function (_, i) { return i; });
+      let seed = 0x9e3779b9;
+      function random() {
+        seed ^= seed << 13;
+        seed ^= seed >>> 17;
+        seed ^= seed << 5;
+        return (seed >>> 0) / 4294967296;
+      }
+      for (let i = values.length - 1; i > 0; i--) {
+        const j = Math.floor(random() * (i + 1));
+        const temporary = values[i];
+        values[i] = values[j];
+        values[j] = temporary;
+      }
+      for (let i = 0; i < 512; i++) permutation[i] = values[i & 255];
+    })();
+
+    function fade(t) { return t * t * t * (t * (t * 6 - 15) + 10); }
+    function lerp(a, b, t) { return a + (b - a) * t; }
+    function grad(hash, x, y, z) {
+      const h = hash & 15;
+      const u = h < 8 ? x : y;
+      const v = h < 4 ? y : (h === 12 || h === 14 ? x : z);
+      return ((h & 1) === 0 ? u : -u) + ((h & 2) === 0 ? v : -v);
+    }
+    function perlin(x, y, z) {
+      const xi = Math.floor(x) & 255;
+      const yi = Math.floor(y) & 255;
+      const zi = Math.floor(z) & 255;
+      x -= Math.floor(x);
+      y -= Math.floor(y);
+      z -= Math.floor(z);
+      const u = fade(x), v = fade(y), w = fade(z);
+      const a = permutation[xi] + yi;
+      const aa = permutation[a] + zi;
+      const ab = permutation[a + 1] + zi;
+      const b = permutation[xi + 1] + yi;
+      const ba = permutation[b] + zi;
+      const bb = permutation[b + 1] + zi;
+      return lerp(
+        lerp(lerp(grad(permutation[aa], x, y, z), grad(permutation[ba], x - 1, y, z), u),
+             lerp(grad(permutation[ab], x, y - 1, z), grad(permutation[bb], x - 1, y - 1, z), u), v),
+        lerp(lerp(grad(permutation[aa + 1], x, y, z - 1), grad(permutation[ba + 1], x - 1, y, z - 1), u),
+             lerp(grad(permutation[ab + 1], x, y - 1, z - 1), grad(permutation[bb + 1], x - 1, y - 1, z - 1), u), v),
+        w
+      );
+    }
+
+    const heightCache = new Map();
+    function smoothstep(edge0, edge1, value) {
+      const t = Math.max(0, Math.min(1, (value - edge0) / (edge1 - edge0)));
+      return t * t * (3 - 2 * t);
+    }
+    function terrainHeight(x, z) {
+      const key = x + "," + z;
+      const remembered = heightCache.get(key);
+      if (remembered !== undefined) return remembered;
+      const broad = perlin(x * .017, z * .017, 3.2) * 8.4;
+      const medium = perlin(x * .047, z * .047, 17.3) * 3.8;
+      const detail = perlin(x * .115, z * .115, 81.6) * 1.2;
+      const ridge = Math.pow(Math.abs(perlin(x * .009, z * .009, 41.7)), 2) * 8.5;
+      let height = 12 + broad + medium + detail + ridge;
+
+      const shrineDistance = Math.hypot(x, z);
+      if (shrineDistance < 53) {
+        const blend = 1 - smoothstep(22, 53, shrineDistance);
+        const sacredPlateau = 13.6 + perlin(x * .12, z * .12, 6.4) * .75;
+        height = lerp(height, sacredPlateau, blend);
+      }
+      const dragonRidge = Math.abs((z + 73) - x * .48);
+      if (dragonRidge < 11) height += (11 - dragonRidge) * 1.22;
+      if (z > 38 && Math.abs(x - Math.sin(z * .065) * 11) < 2.4) height = Math.min(height, 6);
+
+      const result = Math.max(-3, Math.min(34, Math.floor(height)));
+      heightCache.set(key, result);
+      if (heightCache.size > 45000) heightCache.clear();
+      return result;
+    }
+
+    const templePillars = [
+      [-15, -8, 14], [-15, 8, 10], [-8, -15, 12], [8, -15, 14],
+      [15, -8, 11], [15, 8, 14], [-8, 15, 9], [8, 15, 12]
+    ];
+    const worldrootBranches = [
+      [-31, 30, 18, -47, 43, 9, 1.45],
+      [-30, 34, 18, -14, 45, 12, 1.35],
+      [-31, 37, 18, -41, 51, 29, 1.2],
+      [-29, 35, 19, -19, 49, 30, 1.12],
+      [-32, 22, 18, -45, 27, 25, 1.55],
+      [-30, 18, 18, -16, 20, 25, 1.25]
+    ];
+    const worldrootCanopies = [
+      [-48, 44, 9, 8, 7, 7], [-40, 51, 28, 9, 7, 8],
+      [-22, 49, 29, 10, 8, 9], [-13, 45, 12, 9, 8, 8],
+      [-29, 51, 18, 11, 8, 10]
+    ];
+
+    function segmentDistanceSq(px, py, pz, ax, ay, az, bx, by, bz) {
+      const abx = bx - ax, aby = by - ay, abz = bz - az;
+      const apx = px - ax, apy = py - ay, apz = pz - az;
+      const lengthSq = abx * abx + aby * aby + abz * abz;
+      const t = Math.max(0, Math.min(1, (apx * abx + apy * aby + apz * abz) / lengthSq));
+      const dx = px - (ax + abx * t);
+      const dy = py - (ay + aby * t);
+      const dz = pz - (az + abz * t);
+      return dx * dx + dy * dy + dz * dz;
+    }
+
+    function sanctuaryBlock(x, y, z) {
+      if (Math.abs(x) > 32 || Math.abs(z) > 34 || y < 14 || y > 35) return AIR;
+      const radialSq = x * x + z * z;
+
+      if (Math.abs(z + 8) <= 1 && y >= 18 && y <= 32) {
+        const ringDistance = Math.hypot(x, y - 25);
+        if (Math.abs(ringDistance - 7) < 1.15) return (x + y) % 3 === 0 ? CRYSTAL : OBSIDIAN;
+        if (ringDistance < 5.9 && y >= 20 && y <= 30) return CRYSTAL;
+      }
+
+      for (let i = 0; i < templePillars.length; i++) {
+        const pillar = templePillars[i];
+        const dx = Math.abs(x - pillar[0]);
+        const dz = Math.abs(z - pillar[1]);
+        if (dx <= 1 && dz <= 1) {
+          if (y >= 18 && y < 18 + pillar[2]) return (dx === 1 || dz === 1) ? MARBLE : MOSS;
+          if (y === 17 || y === 18 + pillar[2] || y === 19 + pillar[2]) return MARBLE;
+        }
+      }
+
+      if (Math.abs(x) <= 2 && Math.abs(z) <= 2 && y >= 18 && y <= 20) return y === 20 ? GOLD : MARBLE;
+      if (Math.abs(x) <= 1 && Math.abs(z) <= 1 && y >= 21 && y <= 25) return CRYSTAL;
+      if (radialSq <= 22 * 22) {
+        if (y === 16) return STONE;
+        if (y === 17) return radialSq > 18 * 18 ? MARBLE : ((x * 7 + z * 13) % 9 === 0 ? GOLD : MOSS);
+        if (y === 18 && radialSq > 18 * 18) return MARBLE;
+      }
+      if (z >= 19 && z <= 29 && Math.abs(x) <= 5) {
+        const level = 15 + Math.floor((29 - z) / 4);
+        if (y <= level && y >= 13) return MARBLE;
+      }
+      if (radialSq > 105 && radialSq < 144 && y >= 18 && y <= 20 && (x * 3 + z * 5) % 7 === 0) return CRYSTAL;
+      return AIR;
+    }
+
+    function worldrootBlock(x, y, z) {
+      if (x < -58 || x > -5 || z < -2 || z > 43 || y < 12 || y > 60) return AIR;
+      const dx = x + 30;
+      const dz = z - 18;
+      const trunkRadius = y < 24 ? 3.3 : y < 35 ? 2.45 : 1.72;
+      if (y >= 13 && y <= 42 && dx * dx + dz * dz <= trunkRadius * trunkRadius) return WOOD;
+
+      for (let i = 0; i < worldrootBranches.length; i++) {
+        const branch = worldrootBranches[i];
+        if (segmentDistanceSq(x, y, z, branch[0], branch[1], branch[2], branch[3], branch[4], branch[5]) <= branch[6] * branch[6]) return WOOD;
+      }
+      for (let i = 0; i < worldrootCanopies.length; i++) {
+        const canopy = worldrootCanopies[i];
+        const nx = (x - canopy[0]) / canopy[3];
+        const ny = (y - canopy[1]) / canopy[4];
+        const nz = (z - canopy[2]) / canopy[5];
+        if (nx * nx + ny * ny + nz * nz < 1 && perlin(x * .42, y * .42, z * .42) > -.42) return LEAVES;
+      }
+      if (y >= 13 && y <= 16) {
+        const rootD = Math.min(
+          segmentDistanceSq(x, y, z, -30, 16, 18, -48, 14, 28),
+          segmentDistanceSq(x, y, z, -30, 16, 18, -13, 15, 29),
+          segmentDistanceSq(x, y, z, -30, 16, 18, -43, 14, 7)
+        );
+        if (rootD < 1.5) return WOOD;
+      }
+      return AIR;
+    }
+
+    function citadelBlock(x, y, z) {
+      if (x < 2 || x > 50 || z < -70 || z > -8 || y < 27 || y > 86) return AIR;
+      const dx = x - 26;
+      const dz = z + 41;
+
+      if (x >= 22 && x <= 29 && z >= -31 && z <= -10) {
+        const bridgeY = 51 + Math.floor((-z - 10) * .10);
+        if (y === bridgeY || y === bridgeY - 1) return MARBLE;
+        if ((x === 22 || x === 29) && y > bridgeY && y < bridgeY + 4) return MOSS;
+      }
+
+      const islandShape = (dx * dx) / (22 * 22) + (dz * dz) / (17 * 17) + ((y - 43) * (y - 43)) / (9 * 9);
+      if (islandShape < 1 && y <= 50) {
+        if (y < 37 && Math.abs(dx) + Math.abs(dz) < 13 + (y - 27) * .45) return CRYSTAL;
+        if (y > 46 && (x + z) % 5 === 0) return MOSS;
+        return y < 43 ? STONE : MOSS;
+      }
+
+      if (x >= 11 && x <= 13 && z >= -43 && z <= -38 && y >= 29 && y <= 47) return WATER;
+      if (x >= 39 && x <= 40 && z >= -45 && z <= -40 && y >= 33 && y <= 47) return WATER;
+
+      if (y === 50 && Math.abs(dx) <= 14 && Math.abs(dz) <= 11) return MARBLE;
+      if (y === 51 && Math.abs(dx) <= 12 && Math.abs(dz) <= 9) return MOSS;
+
+      const towers = [[-10,-7], [10,-7], [-10,7], [10,7]];
+      for (let i = 0; i < towers.length; i++) {
+        const tx = dx - towers[i][0], tz = dz - towers[i][1];
+        const towerDistance = tx * tx + tz * tz;
+        if (towerDistance <= 5 && y >= 52 && y <= 72) return y % 7 === 0 ? MOSS : MARBLE;
+        if (towerDistance <= 2 && y >= 73 && y <= 78 - Math.floor(Math.abs(tx) + Math.abs(tz))) return CRYSTAL;
+      }
+
+      const onOuterWall = (Math.abs(dx) >= 12 && Math.abs(dx) <= 13 && Math.abs(dz) <= 9) || (Math.abs(dz) >= 9 && Math.abs(dz) <= 10 && Math.abs(dx) <= 12);
+      if (onOuterWall && y >= 52 && y <= 59) {
+        if (dz === 10 && Math.abs(dx) < 3 && y < 56) return AIR;
+        return (x + y + z) % 6 === 0 ? MOSS : MARBLE;
+      }
+      if (Math.abs(dx) <= 7 && Math.abs(dz) <= 5 && y === 60) return MARBLE;
+      if (Math.abs(dx) <= 5 && Math.abs(dz) <= 3 && y >= 61 && y <= 66) {
+        const dome = (dx * dx) / 26 + (dz * dz) / 11 + ((y - 62) * (y - 62)) / 22;
+        if (dome < 1.2) return CRYSTAL;
+      }
+      if (Math.abs(dx) <= 2 && Math.abs(dz) <= 2 && y >= 67 && y <= 81) return OBSIDIAN;
+      if (Math.abs(dx) <= 1 && Math.abs(dz) <= 1 && y >= 79 && y <= 84) return CRYSTAL;
+
+      if (y >= 46 && y <= 49 && Math.abs(dx) < 22 && Math.abs(dz) < 17 && (Math.abs(dx) > 17 || Math.abs(dz) > 13) && (x + z) % 4 === 0) return GOLD;
+      return AIR;
+    }
+
+    const edits = new Map();
+    function editKey(x, y, z) { return x + "|" + y + "|" + z; }
+    function generatedBlock(x, y, z) {
+      const skyCity = citadelBlock(x, y, z);
+      if (skyCity !== AIR) return skyCity;
+      const shrine = sanctuaryBlock(x, y, z);
+      if (shrine !== AIR) return shrine;
+      const root = worldrootBlock(x, y, z);
+      if (root !== AIR) return root;
+
+      const height = terrainHeight(x, z);
+      if (y <= height) {
+        if (y === height) {
+          if (height <= WATER_LEVEL + 1) return SAND;
+          return GRASS;
+        }
+        if (y >= height - 3) return DIRT;
+        return STONE;
+      }
+      if (y > height && y <= WATER_LEVEL && z > 34) return WATER;
+      return AIR;
+    }
+    function getBlock(x, y, z) {
+      const overridden = edits.get(editKey(x, y, z));
+      return overridden === undefined ? generatedBlock(x, y, z) : overridden;
+    }
+    function isSolid(type) { return type !== AIR && type !== WATER; }
+
+    const chunks = new Map();
+    const chunkQueue = [];
+    const queuedChunks = new Set();
+    let previousChunkX = 99999;
+    let previousChunkZ = 99999;
+
+    function chunkKey(cx, cz) { return cx + "," + cz; }
+    function chunkMaximumY(cx, cz) {
+      const x = cx * CHUNK_SIZE + 8;
+      const z = cz * CHUNK_SIZE + 8;
+      if (x > -2 && x < 54 && z > -74 && z < -5) return 88;
+      if (x > -62 && x < 0 && z > -8 && z < 48) return 62;
+      if (Math.abs(x) < 40 && Math.abs(z) < 42) return 40;
+      return 43;
+    }
+    function shouldShowFace(type, neighbor) {
+      if (neighbor === AIR) return true;
+      return neighbor === WATER && type !== WATER;
+    }
+    function addFace(bucket, x, y, z, face) {
+      for (let i = 0; i < 6; i++) {
+        const vertex = face.v[quadOrder[i]];
+        bucket.positions.push(x + vertex[0], y + vertex[1], z + vertex[2]);
+        bucket.normals.push(face.n[0], face.n[1], face.n[2]);
+        bucket.uvs.push(quadUV[i * 2], quadUV[i * 2 + 1]);
+      }
+      bucket.blocks.push({ x: x, y: y, z: z, nx: face.n[0], ny: face.n[1], nz: face.n[2] });
+    }
+    function buildChunk(cx, cz) {
+      const key = chunkKey(cx, cz);
+      if (chunks.has(key)) return;
+      const buckets = Array.from({ length: materials.length }, function () {
+        return { positions: [], normals: [], uvs: [], blocks: [] };
+      });
+      const xStart = cx * CHUNK_SIZE;
+      const zStart = cz * CHUNK_SIZE;
+      const maxY = chunkMaximumY(cx, cz);
+      for (let x = xStart; x < xStart + CHUNK_SIZE; x++) {
+        for (let z = zStart; z < zStart + CHUNK_SIZE; z++) {
+          for (let y = MIN_Y; y <= maxY; y++) {
+            const type = getBlock(x, y, z);
+            if (type === AIR) continue;
+            for (let f = 0; f < faces.length; f++) {
+              const face = faces[f];
+              if (y === MIN_Y && face.n[1] === -1) continue;
+              const neighbor = getBlock(x + face.n[0], y + face.n[1], z + face.n[2]);
+              if (!shouldShowFace(type, neighbor)) continue;
+              addFace(buckets[materialFor(type, face.n)], x, y, z, face);
+            }
+          }
+        }
+      }
+      const positions = [];
+      const normals = [];
+      const uvs = [];
+      const faceBlocks = [];
+      const geometry = new THREE.BufferGeometry();
+      let vertexOffset = 0;
+      for (let i = 0; i < buckets.length; i++) {
+        const bucket = buckets[i];
+        if (!bucket.positions.length) continue;
+        for (let p = 0; p < bucket.positions.length; p++) positions.push(bucket.positions[p]);
+        for (let n = 0; n < bucket.normals.length; n++) normals.push(bucket.normals[n]);
+        for (let u = 0; u < bucket.uvs.length; u++) uvs.push(bucket.uvs[u]);
+        for (let b = 0; b < bucket.blocks.length; b++) faceBlocks.push(bucket.blocks[b]);
+        geometry.addGroup(vertexOffset, bucket.positions.length / 3, i);
+        vertexOffset += bucket.positions.length / 3;
+      }
+      geometry.setAttribute("position", new THREE.Float32BufferAttribute(positions, 3));
+      geometry.setAttribute("normal", new THREE.Float32BufferAttribute(normals, 3));
+      geometry.setAttribute("uv", new THREE.Float32BufferAttribute(uvs, 2));
+      geometry.computeBoundingSphere();
+      const mesh = new THREE.Mesh(geometry, materials);
+      mesh.userData.faceBlocks = faceBlocks;
+      mesh.userData.chunkKey = key;
+      mesh.frustumCulled = true;
+      world.add(mesh);
+      chunks.set(key, mesh);
+    }
+    function disposeChunk(key) {
+      const mesh = chunks.get(key);
+      if (!mesh) return;
+      world.remove(mesh);
+      mesh.geometry.dispose();
+      chunks.delete(key);
+    }
+    function enqueueChunk(cx, cz, priority) {
+      const key = chunkKey(cx, cz);
+      if (chunks.has(key) || queuedChunks.has(key)) return;
+      queuedChunks.add(key);
+      if (priority) chunkQueue.unshift({ cx: cx, cz: cz, key: key });
+      else chunkQueue.push({ cx: cx, cz: cz, key: key });
+    }
+    function refreshVisibleChunks(force) {
+      const cx = Math.floor(player.position.x / CHUNK_SIZE);
+      const cz = Math.floor(player.position.z / CHUNK_SIZE);
+      if (!force && cx === previousChunkX && cz === previousChunkZ) return;
+      previousChunkX = cx;
+      previousChunkZ = cz;
+      for (const entry of chunks) {
+        const parts = entry[0].split(",");
+        const x = Number(parts[0]), z = Number(parts[1]);
+        if (Math.abs(x - cx) > LOAD_RADIUS || Math.abs(z - cz) > LOAD_RADIUS) disposeChunk(entry[0]);
+      }
+      const needed = [];
+      for (let x = cx - LOAD_RADIUS; x <= cx + LOAD_RADIUS; x++) {
+        for (let z = cz - LOAD_RADIUS; z <= cz + LOAD_RADIUS; z++) {
+          needed.push({ cx: x, cz: z, d: Math.abs(x - cx) + Math.abs(z - cz) });
+        }
+      }
+      needed.sort(function (a, b) { return a.d - b.d; });
+      for (let i = 0; i < needed.length; i++) enqueueChunk(needed[i].cx, needed[i].cz, false);
+    }
+    function processOneChunk() {
+      const next = chunkQueue.shift();
+      if (!next) return;
+      queuedChunks.delete(next.key);
+      const currentX = Math.floor(player.position.x / CHUNK_SIZE);
+      const currentZ = Math.floor(player.position.z / CHUNK_SIZE);
+      if (Math.abs(next.cx - currentX) <= LOAD_RADIUS && Math.abs(next.cz - currentZ) <= LOAD_RADIUS) buildChunk(next.cx, next.cz);
+    }
+    function remeshAt(x, z) {
+      const candidates = [[x,z], [x-1,z], [x+1,z], [x,z-1], [x,z+1]];
+      const unique = new Set();
+      for (let i = 0; i < candidates.length; i++) {
+        const cx = Math.floor(candidates[i][0] / CHUNK_SIZE);
+        const cz = Math.floor(candidates[i][1] / CHUNK_SIZE);
+        unique.add(chunkKey(cx, cz));
+      }
+      for (const key of unique) {
+        if (!chunks.has(key)) continue;
+        disposeChunk(key);
+        const parts = key.split(",");
+        enqueueChunk(Number(parts[0]), Number(parts[1]), true);
+      }
+    }
+
+    function makeClouds() {
+      const group = new THREE.Group();
+      const cloudMaterial = new THREE.MeshLambertMaterial({ color: 0xf1f5de, transparent: true, opacity: .74 });
+      const cloudGeometry = new THREE.BoxGeometry(1, 1, 1);
+      for (let i = 0; i < 28; i++) {
+        const cloud = new THREE.Group();
+        const angle = i * 2.399;
+        const radius = 42 + (i * 29) % 145;
+        cloud.position.set(Math.cos(angle) * radius, 47 + (i * 17) % 30, Math.sin(angle) * radius);
+        cloud.userData.seed = i * 19;
+        for (let part = 0; part < 5; part++) {
+          const puff = new THREE.Mesh(cloudGeometry, cloudMaterial);
+          puff.scale.set(5 + (part % 3) * 2.2, 2.2 + (part % 2), 3.5 + ((part + 1) % 3) * 2);
+          puff.position.set((part - 2) * 4, (part % 2) * 1.1, (part % 3 - 1) * 2.3);
+          cloud.add(puff);
+        }
+        group.add(cloud);
+      }
+      scene.add(group);
+      return group;
+    }
+    const clouds = makeClouds();
+
+    function makeMotes() {
+      const count = 105;
+      const positions = new Float32Array(count * 3);
+      const phases = new Float32Array(count);
+      for (let i = 0; i < count; i++) {
+        const a = i * 2.399;
+        const radius = 3.6 + (i % 11) * .28;
+        positions[i * 3] = Math.cos(a) * radius;
+        positions[i * 3 + 1] = 1 + (i % 19) * .56;
+        positions[i * 3 + 2] = Math.sin(a) * .8;
+        phases[i] = i * .61;
+      }
+      const geometry = new THREE.BufferGeometry();
+      geometry.setAttribute("position", new THREE.BufferAttribute(positions, 3));
+      const material = new THREE.PointsMaterial({ color: 0xc9ffff, size: .16, transparent: true, opacity: .82, depthWrite: false });
+      const points = new THREE.Points(geometry, material);
+      points.position.set(0, 20, -8);
+      scene.add(points);
+      return { points: points, positions: positions, phases: phases };
+    }
+    const motes = makeMotes();
+
+    const outline = new THREE.LineSegments(
+      new THREE.EdgesGeometry(new THREE.BoxGeometry(1.008, 1.008, 1.008)),
+      new THREE.LineBasicMaterial({ color: 0xfff3b0, transparent: true, opacity: .95 })
+    );
+    outline.visible = false;
+    scene.add(outline);
+
+    const raycaster = new THREE.Raycaster();
+    raycaster.far = 7.5;
+    let targetBlock = null;
+    function updateTarget() {
+      const candidates = [];
+      for (const mesh of chunks.values()) candidates.push(mesh);
+      raycaster.setFromCamera(new THREE.Vector2(0, 0), camera);
+      const hits = raycaster.intersectObjects(candidates, false);
+      if (!hits.length) {
+        targetBlock = null;
+        outline.visible = false;
+        return;
+      }
+      const hit = hits[0];
+      const block = hit.object.userData.faceBlocks[Math.floor(hit.faceIndex / 2)];
+      if (!block) {
+        targetBlock = null;
+        outline.visible = false;
+        return;
+      }
+      targetBlock = block;
+      outline.position.set(block.x + .5, block.y + .5, block.z + .5);
+      outline.visible = true;
+    }
+
+    const player = {
+      position: new THREE.Vector3(7, 18, 20),
+      velocity: new THREE.Vector3(),
+      grounded: false
+    };
+    let yaw = .11;
+    let pitch = -.04;
+    const keys = new Set();
+    let selectedBlock = STONE;
+    let locked = false;
+
+    function anySolidInBody(px, py, pz) {
+      const minX = Math.floor(px - PLAYER_RADIUS);
+      const maxX = Math.floor(px + PLAYER_RADIUS);
+      const minY = Math.floor(py + .06);
+      const maxY = Math.floor(py + PLAYER_HEIGHT - .05);
+      const minZ = Math.floor(pz - PLAYER_RADIUS);
+      const maxZ = Math.floor(pz + PLAYER_RADIUS);
+      for (let x = minX; x <= maxX; x++) {
+        for (let y = minY; y <= maxY; y++) {
+          for (let z = minZ; z <= maxZ; z++) {
+            if (isSolid(getBlock(x, y, z))) return true;
+          }
+        }
+      }
+      return false;
+    }
+    function floorBelow(px, py, pz, lowest) {
+      let top = -Infinity;
+      const samples = [[-.27,-.27],[.27,-.27],[-.27,.27],[.27,.27]];
+      for (let i = 0; i < samples.length; i++) {
+        const sx = Math.floor(px + samples[i][0]);
+        const sz = Math.floor(pz + samples[i][1]);
+        for (let y = Math.floor(py + .02); y >= Math.floor(lowest - .2); y--) {
+          if (isSolid(getBlock(sx, y, sz))) {
+            top = Math.max(top, y + 1);
+            break;
+          }
+        }
+      }
+      return top;
+    }
+    function findSpawnFloor(px, pz) {
+      for (let y = 92; y >= MIN_Y; y--) {
+        if (isSolid(getBlock(Math.floor(px), y, Math.floor(pz)))) return y + 1;
+      }
+      return 18;
+    }
+    player.position.y = findSpawnFloor(player.position.x, player.position.z);
+
+    function tryMove(axis, amount) {
+      player.position[axis] += amount;
+      if (!anySolidInBody(player.position.x, player.position.y, player.position.z)) return;
+      if (player.grounded && !anySolidInBody(player.position.x, player.position.y + 1.01, player.position.z)) {
+        player.position.y += 1.01;
+        return;
+      }
+      player.position[axis] -= amount;
+    }
+    function updatePhysics(delta) {
+      let inputX = 0;
+      let inputZ = 0;
+      if (keys.has("KeyW")) inputZ -= 1;
+      if (keys.has("KeyS")) inputZ += 1;
+      if (keys.has("KeyA")) inputX -= 1;
+      if (keys.has("KeyD")) inputX += 1;
+      if (inputX || inputZ) {
+        const length = Math.hypot(inputX, inputZ);
+        inputX /= length;
+        inputZ /= length;
+        const speed = keys.has("ShiftLeft") || keys.has("ShiftRight") ? 8.4 : 4.85;
+        const forwardX = Math.sin(yaw);
+        const forwardZ = -Math.cos(yaw);
+        const rightX = Math.cos(yaw);
+        const rightZ = Math.sin(yaw);
+        tryMove("x", (rightX * inputX + forwardX * inputZ) * speed * delta);
+        tryMove("z", (rightZ * inputX + forwardZ * inputZ) * speed * delta);
+      }
+
+      player.velocity.y -= 23 * delta;
+      const oldY = player.position.y;
+      const nextY = oldY + player.velocity.y * delta;
+      if (player.velocity.y <= 0) {
+        const ground = floorBelow(player.position.x, oldY, player.position.z, nextY);
+        if (ground > -Infinity && ground <= oldY + .08 && ground >= nextY - .1) {
+          player.position.y = ground;
+          player.velocity.y = 0;
+          player.grounded = true;
+        } else {
+          player.position.y = nextY;
+          player.grounded = false;
+        }
+      } else if (anySolidInBody(player.position.x, nextY, player.position.z)) {
+        player.velocity.y = 0;
+      } else {
+        player.position.y = nextY;
+        player.grounded = false;
+      }
+      if (player.position.y < -16) {
+        player.position.set(7, findSpawnFloor(7, 20), 20);
+        player.velocity.set(0, 0, 0);
+        showToast("星祠的回响将你带回了起点");
+      }
+    }
+    function updateCamera() {
+      camera.position.set(player.position.x, player.position.y + EYE_HEIGHT, player.position.z);
+      camera.rotation.set(pitch, yaw, 0);
+    }
+    function blockWouldHitPlayer(x, y, z) {
+      return x + 1 > player.position.x - PLAYER_RADIUS &&
+        x < player.position.x + PLAYER_RADIUS &&
+        z + 1 > player.position.z - PLAYER_RADIUS &&
+        z < player.position.z + PLAYER_RADIUS &&
+        y + 1 > player.position.y &&
+        y < player.position.y + PLAYER_HEIGHT;
+    }
+    function editTarget(place) {
+      if (!targetBlock) return;
+      const x = targetBlock.x + (place ? targetBlock.nx : 0);
+      const y = targetBlock.y + (place ? targetBlock.ny : 0);
+      const z = targetBlock.z + (place ? targetBlock.nz : 0);
+      if (place && blockWouldHitPlayer(x, y, z)) {
+        showToast("不能把方块放进自己体内");
+        return;
+      }
+      if (place && getBlock(x, y, z) !== AIR && getBlock(x, y, z) !== WATER) return;
+      edits.set(editKey(x, y, z), place ? selectedBlock : AIR);
+      remeshAt(x, z);
+      showToast(place ? "放置：" + BLOCK_NAMES[selectedBlock] : "已采掘方块");
+    }
+
+    function renderHotbar() {
+      hotbar.innerHTML = "";
+      const swatches = ["#71ad42", "#68727a", "#c6d5cf", "#22182f", "#9a602c", "#64d9e8"];
+      for (let i = 0; i < SELECTABLE.length; i++) {
+        const type = SELECTABLE[i];
+        const slot = document.createElement("div");
+        slot.className = "slot" + (type === selectedBlock ? " active" : "");
+        slot.innerHTML = '<b>' + (i + 1) + '</b><i class="swatch"></i><span>' + BLOCK_NAMES[type] + '</span>';
+        slot.querySelector(".swatch").style.background = swatches[i];
+        hotbar.appendChild(slot);
+      }
+    }
+    function chooseBlock(index) {
+      if (!SELECTABLE[index]) return;
+      selectedBlock = SELECTABLE[index];
+      renderHotbar();
+      showToast("已选择：" + BLOCK_NAMES[selectedBlock]);
+    }
+    let toastTimer = 0;
+    function showToast(text) {
+      toast.textContent = text;
+      toast.classList.add("show");
+      clearTimeout(toastTimer);
+      toastTimer = setTimeout(function () { toast.classList.remove("show"); }, 1450);
+    }
+    function zoneName(x, y, z) {
+      if (Math.abs(x - 26) < 30 && Math.abs(z + 41) < 34 && y > 30) return "区域：云穹浮城";
+      if (Math.abs(x + 30) < 30 && Math.abs(z - 18) < 28) return "区域：世界树根庭";
+      if (Math.hypot(x, z) < 30) return "区域：星祠遗址";
+      if (z < -58) return "区域：龙脊远山";
+      if (z > 37) return "区域：镜河低地";
+      return "区域：无名荒野";
+    }
+    function updateReadout() {
+      const x = Math.floor(player.position.x);
+      const y = Math.floor(player.position.y);
+      const z = Math.floor(player.position.z);
+      readout.textContent = "X " + x + "　Y " + y + "　Z " + z;
+      zoneReadout.textContent = zoneName(x, y, z);
+      chunkReadout.textContent = "地形：" + chunks.size + " 区块已显现";
+    }
+
+    document.addEventListener("keydown", function (event) {
+      keys.add(event.code);
+      if (event.code === "Space") {
+        event.preventDefault();
+        if (player.grounded) {
+          player.velocity.y = 8.35;
+          player.grounded = false;
+        }
+      }
+      if (/^Digit[1-6]$/.test(event.code)) chooseBlock(Number(event.code.slice(5)) - 1);
+    });
+    document.addEventListener("keyup", function (event) { keys.delete(event.code); });
+    document.addEventListener("mousemove", function (event) {
+      if (!locked) return;
+      yaw -= event.movementX * .00225;
+      pitch -= event.movementY * .00225;
+      pitch = Math.max(-1.48, Math.min(1.48, pitch));
+    });
+    document.addEventListener("contextmenu", function (event) { event.preventDefault(); });
+    document.addEventListener("mousedown", function (event) {
+      if (!locked) return;
+      if (event.button === 0) editTarget(false);
+      if (event.button === 2) editTarget(true);
+    });
+    document.addEventListener("pointerlockchange", function () {
+      locked = document.pointerLockElement === renderer.domElement;
+      cover.classList.toggle("hidden", locked);
+      if (!locked) {
+        keys.clear();
+        if (chunks.size) loadingText.textContent = "点击开始探索以继续";
+      }
+    });
+    enterButton.addEventListener("click", function () { renderer.domElement.requestPointerLock(); });
+    renderer.domElement.addEventListener("click", function () {
+      if (!locked) renderer.domElement.requestPointerLock();
+    });
+    addEventListener("resize", function () {
+      camera.aspect = innerWidth / innerHeight;
+      camera.updateProjectionMatrix();
+      renderer.setSize(innerWidth, innerHeight);
+    });
+
+    renderHotbar();
+    refreshVisibleChunks(true);
+    updateCamera();
+    for (let i = 0; i < 2; i++) processOneChunk();
+
+    const clock = new THREE.Clock();
+    let targetCooldown = 0;
+    let terrainCooldown = 0;
+    function animate() {
+      requestAnimationFrame(animate);
+      const delta = Math.min(clock.getDelta(), .05);
+      if (locked) updatePhysics(delta);
+      updateCamera();
+      refreshVisibleChunks(false);
+      terrainCooldown += delta;
+      if (terrainCooldown > .045) {
+        terrainCooldown = 0;
+        processOneChunk();
+      }
+      targetCooldown += delta;
+      if (targetCooldown > .045) {
+        targetCooldown = 0;
+        updateTarget();
+      }
+
+      const time = performance.now() * .001;
+      const cloudChildren = clouds.children;
+      for (let i = 0; i < cloudChildren.length; i++) {
+        const cloud = cloudChildren[i];
+        cloud.position.x += Math.sin(time * .06 + cloud.userData.seed) * .002;
+        cloud.position.z += Math.cos(time * .05 + cloud.userData.seed) * .0015;
+        if (Math.abs(cloud.position.x - player.position.x) > 220) cloud.position.x = player.position.x + (cloud.position.x > player.position.x ? -170 : 170);
+        if (Math.abs(cloud.position.z - player.position.z) > 220) cloud.position.z = player.position.z + (cloud.position.z > player.position.z ? -170 : 170);
+      }
+      motes.points.rotation.y = time * .19;
+      const motep = motes.points.geometry.attributes.position;
+      for (let i = 0; i < motes.phases.length; i++) {
+        motep.array[i * 3 + 1] = 1 + (i % 19) * .56 + Math.sin(time * 1.8 + motes.phases[i]) * .42;
+      }
+      motep.needsUpdate = true;
+      updateReadout();
+      if (chunkQueue.length) loadingText.textContent = "正在塑造远方地形 " + chunks.size + " / 25";
+      else loadingText.textContent = "世界已苏醒";
+      renderer.render(scene, camera);
+    }
+    animate();
+  </script>
+</body>
+</html>
diff --git a/outputs/gpt-5-6-terra/codex-cli-ultra/pelican-cycling.svg b/outputs/gpt-5-6-terra/codex-cli-ultra/pelican-cycling.svg
new file mode 100644
index 0000000..d51112c
--- /dev/null
+++ b/outputs/gpt-5-6-terra/codex-cli-ultra/pelican-cycling.svg
@@ -0,0 +1,290 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 1000" role="img" aria-labelledby="title desc">
+  <title id="title">海边骑自行车的鹈鹕</title>
+  <desc id="desc">一只羽毛细腻的褐鹈鹕沿着阳光海滩骑着复古自行车，身后是波光粼粼的大海。</desc>
+  <defs>
+    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#70b4df"/>
+      <stop offset=".43" stop-color="#bfe1ec"/>
+      <stop offset=".72" stop-color="#f8d8af"/>
+      <stop offset="1" stop-color="#f0b68d"/>
+    </linearGradient>
+    <linearGradient id="sea" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#397fa6"/>
+      <stop offset=".2" stop-color="#52a4bc"/>
+      <stop offset=".67" stop-color="#91cad2"/>
+      <stop offset="1" stop-color="#d0dbca"/>
+    </linearGradient>
+    <linearGradient id="sand" x1="0" y1="0" x2=".15" y2="1">
+      <stop offset="0" stop-color="#f8e0a9"/>
+      <stop offset=".35" stop-color="#edc783"/>
+      <stop offset="1" stop-color="#c98c54"/>
+    </linearGradient>
+    <linearGradient id="creamFeather" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#fff9df"/>
+      <stop offset=".38" stop-color="#e9d5a5"/>
+      <stop offset=".72" stop-color="#ad8464"/>
+      <stop offset="1" stop-color="#60483e"/>
+    </linearGradient>
+    <linearGradient id="neck" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#ffffe9"/>
+      <stop offset=".26" stop-color="#f1e4bc"/>
+      <stop offset=".63" stop-color="#b38d6e"/>
+      <stop offset="1" stop-color="#725348"/>
+    </linearGradient>
+    <linearGradient id="wing" x1=".1" y1="0" x2=".9" y2="1">
+      <stop offset="0" stop-color="#f5e2b0"/>
+      <stop offset=".24" stop-color="#b78d67"/>
+      <stop offset=".58" stop-color="#715144"/>
+      <stop offset="1" stop-color="#302e32"/>
+    </linearGradient>
+    <linearGradient id="bill" x1="0" y1=".15" x2="1" y2=".85">
+      <stop offset="0" stop-color="#f8c856"/>
+      <stop offset=".4" stop-color="#dc9738"/>
+      <stop offset=".7" stop-color="#a75e31"/>
+      <stop offset="1" stop-color="#563b37"/>
+    </linearGradient>
+    <linearGradient id="pouch" x1="0" y1="0" x2=".8" y2="1">
+      <stop offset="0" stop-color="#d2a66a"/>
+      <stop offset=".4" stop-color="#b7785d"/>
+      <stop offset="1" stop-color="#744a42"/>
+    </linearGradient>
+    <linearGradient id="leg" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#b9a994"/>
+      <stop offset=".45" stop-color="#857466"/>
+      <stop offset="1" stop-color="#493e3d"/>
+    </linearGradient>
+    <linearGradient id="metal" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#fcfded"/>
+      <stop offset=".18" stop-color="#9eb0b1"/>
+      <stop offset=".38" stop-color="#f4e3a9"/>
+      <stop offset=".62" stop-color="#546468"/>
+      <stop offset=".82" stop-color="#c5d5d1"/>
+      <stop offset="1" stop-color="#526168"/>
+    </linearGradient>
+    <radialGradient id="tire" cx="40%" cy="33%" r="72%">
+      <stop offset="0" stop-color="#52616a"/>
+      <stop offset=".52" stop-color="#252b32"/>
+      <stop offset="1" stop-color="#11161d"/>
+    </radialGradient>
+    <radialGradient id="sun" cx="50%" cy="50%" r="50%">
+      <stop offset="0" stop-color="#fffce2"/>
+      <stop offset=".38" stop-color="#ffe7a0" stop-opacity=".95"/>
+      <stop offset="1" stop-color="#ffd288" stop-opacity="0"/>
+    </radialGradient>
+    <filter id="softShadow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="13"/>
+    </filter>
+    <filter id="smallShadow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="4"/>
+    </filter>
+    <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
+      <feGaussianBlur stdDeviation="7" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+    <filter id="paperTexture" x="-10%" y="-10%" width="120%" height="120%">
+      <feTurbulence type="fractalNoise" baseFrequency=".75" numOctaves="3" seed="27" result="noise"/>
+      <feColorMatrix in="noise" type="saturate" values="0" result="mono"/>
+      <feComponentTransfer in="mono" result="grain"><feFuncA type="table" tableValues="0 .075"/></feComponentTransfer>
+      <feBlend in="SourceGraphic" in2="grain" mode="multiply"/>
+    </filter>
+    <clipPath id="seaClip"><path d="M0 412 C212 391 390 421 601 402 C825 381 1080 417 1600 389 L1600 690 L0 690Z"/></clipPath>
+    <clipPath id="beachClip"><path d="M0 631 C212 601 376 632 579 651 C808 672 1003 631 1243 639 C1397 644 1504 669 1600 697 L1600 1000 L0 1000Z"/></clipPath>
+  </defs>
+
+  <g filter="url(#paperTexture)">
+    <rect width="1600" height="670" fill="url(#sky)"/>
+    <ellipse cx="1310" cy="163" rx="177" ry="177" fill="url(#sun)"/>
+    <circle cx="1310" cy="163" r="56" fill="#fff4bf" opacity=".95"/>
+
+    <!-- high, soft coastal clouds -->
+    <g fill="#fffaf0" opacity=".62">
+      <path d="M65 175 C86 139 127 135 150 158 C164 112 225 108 247 156 C270 131 316 140 326 177 C286 191 126 195 65 175Z"/>
+      <path d="M1010 112 C1032 78 1070 78 1089 105 C1104 59 1173 61 1184 110 C1208 88 1255 101 1264 130 C1195 143 1066 140 1010 112Z" opacity=".72"/>
+      <path d="M1340 293 C1362 264 1407 267 1426 294 C1442 261 1492 266 1505 304 C1530 288 1571 300 1582 325 C1512 338 1400 331 1340 293Z" opacity=".43"/>
+    </g>
+    <g fill="none" stroke="#f9ffff" stroke-linecap="round" opacity=".7">
+      <path d="M280 286 q15-15 30 0 q15-15 30 0" stroke-width="4"/>
+      <path d="M369 224 q12-12 24 0 q12-12 24 0" stroke-width="3"/>
+      <path d="M104 315 q9-9 18 0 q9-9 18 0" stroke-width="3"/>
+    </g>
+
+    <!-- distant headlands -->
+    <path d="M0 398 C70 367 144 361 216 385 C307 416 378 422 483 393 C559 371 638 373 705 398 L705 452 L0 452Z" fill="#537f82" opacity=".72"/>
+    <path d="M1058 408 C1142 360 1224 365 1301 391 C1408 427 1493 400 1600 352 L1600 456 L1058 456Z" fill="#4a7779" opacity=".74"/>
+    <path d="M0 421 C243 404 466 422 661 414 C907 402 1118 429 1600 399 L1600 691 L0 691Z" fill="url(#sea)"/>
+
+    <!-- layered surf lines -->
+    <g clip-path="url(#seaClip)" fill="none" stroke-linecap="round">
+      <path d="M-40 454 C104 432 196 470 338 449 S589 434 748 454 S1038 475 1193 449 S1458 430 1650 453" stroke="#d8f1e9" stroke-width="9" opacity=".54"/>
+      <path d="M-74 483 C105 459 237 500 394 476 S670 465 831 485 S1118 508 1307 478 S1482 468 1654 486" stroke="#f7fff1" stroke-width="5" opacity=".55"/>
+      <path d="M-45 525 C110 496 239 535 389 514 S649 509 820 531 S1124 553 1313 523 S1495 512 1650 529" stroke="#e5f5e9" stroke-width="8" opacity=".64"/>
+      <path d="M-30 570 C170 534 293 584 488 558 S809 557 970 579 S1261 596 1450 561 S1563 554 1644 574" stroke="#f9fff2" stroke-width="6" opacity=".72"/>
+      <path d="M-47 612 C137 576 320 622 526 599 S800 599 1015 622 S1343 641 1648 596" stroke="#fffbe6" stroke-width="10" opacity=".85"/>
+      <path d="M64 435 l105 -13 M534 435 l118 -13 M894 444 l118 -12 M1245 428 l130 -17" stroke="#b9e1db" stroke-width="4" opacity=".5"/>
+      <path d="M180 554 l84 -12 M478 578 l115 -12 M1178 567 l123 -18 M1424 535 l86 -12" stroke="#82c4ca" stroke-width="4" opacity=".5"/>
+    </g>
+
+    <!-- beach, wet sand, and foam -->
+    <path d="M0 631 C212 601 376 632 579 651 C808 672 1003 631 1243 639 C1397 644 1504 669 1600 697 L1600 1000 L0 1000Z" fill="url(#sand)"/>
+    <g clip-path="url(#beachClip)">
+      <path d="M-20 678 C158 634 345 693 533 687 S836 642 1033 673 S1382 696 1620 652" fill="none" stroke="#ffeed0" stroke-width="29" opacity=".74"/>
+      <path d="M-35 693 C169 654 322 716 535 709 S830 662 1037 692 S1363 715 1632 670" fill="none" stroke="#fff8db" stroke-width="9" opacity=".92"/>
+      <path d="M-20 739 C227 697 432 763 653 742 S1105 702 1608 730" fill="none" stroke="#c59567" stroke-width="3" opacity=".55"/>
+      <path d="M-40 819 C187 779 446 839 684 812 S1178 773 1640 823" fill="none" stroke="#e7b878" stroke-width="5" opacity=".5"/>
+      <path d="M-28 909 C194 862 414 930 684 900 S1200 862 1641 911" fill="none" stroke="#a96f4d" stroke-width="4" opacity=".35"/>
+      <g fill="#a46d4e" opacity=".52">
+        <ellipse cx="171" cy="805" rx="7" ry="3" transform="rotate(-18 171 805)"/>
+        <ellipse cx="260" cy="908" rx="4" ry="2" transform="rotate(20 260 908)"/>
+        <ellipse cx="467" cy="768" rx="8" ry="3" transform="rotate(-9 467 768)"/>
+        <ellipse cx="1253" cy="782" rx="6" ry="2.5" transform="rotate(22 1253 782)"/>
+        <ellipse cx="1436" cy="883" rx="9" ry="3" transform="rotate(-16 1436 883)"/>
+        <ellipse cx="1107" cy="929" rx="4" ry="2" transform="rotate(12 1107 929)"/>
+      </g>
+    </g>
+
+    <!-- grounding shadows -->
+    <ellipse cx="891" cy="888" rx="455" ry="55" fill="#805c4b" opacity=".28" filter="url(#softShadow)"/>
+    <ellipse cx="894" cy="856" rx="360" ry="26" fill="#624a42" opacity=".24" filter="url(#smallShadow)"/>
+
+    <!-- bicycle wheels -->
+    <g>
+      <g transform="translate(625 769)">
+        <circle r="157" fill="none" stroke="url(#tire)" stroke-width="24"/>
+        <circle r="142" fill="none" stroke="#dbe0d5" stroke-width="4" opacity=".9"/>
+        <circle r="136" fill="none" stroke="#697d80" stroke-width="2" opacity=".85"/>
+        <g stroke="#c8d7d1" stroke-width="2" opacity=".78">
+          <path d="M0 0 L0 -135 M0 0 L67 -118 M0 0 L117 -67 M0 0 L135 0 M0 0 L117 67 M0 0 L67 118 M0 0 L0 135 M0 0 L-67 118 M0 0 L-117 67 M0 0 L-135 0 M0 0 L-117 -67 M0 0 L-67 -118"/>
+        </g>
+        <circle r="16" fill="#d6b866" stroke="#49565d" stroke-width="5"/>
+        <circle r="5" fill="#38434a"/>
+      </g>
+      <g transform="translate(1137 769)">
+        <circle r="157" fill="none" stroke="url(#tire)" stroke-width="24"/>
+        <circle r="142" fill="none" stroke="#dbe0d5" stroke-width="4" opacity=".9"/>
+        <circle r="136" fill="none" stroke="#697d80" stroke-width="2" opacity=".85"/>
+        <g stroke="#c8d7d1" stroke-width="2" opacity=".78">
+          <path d="M0 0 L0 -135 M0 0 L67 -118 M0 0 L117 -67 M0 0 L135 0 M0 0 L117 67 M0 0 L67 118 M0 0 L0 135 M0 0 L-67 118 M0 0 L-117 67 M0 0 L-135 0 M0 0 L-117 -67 M0 0 L-67 -118"/>
+        </g>
+        <circle r="16" fill="#d6b866" stroke="#49565d" stroke-width="5"/>
+        <circle r="5" fill="#38434a"/>
+      </g>
+    </g>
+
+    <!-- bicycle frame behind the rider -->
+    <g fill="none" stroke-linejoin="round" stroke-linecap="round">
+      <path d="M625 769 L810 579 L949 769 Z M810 579 L1011 620 L949 769 M810 579 L887 539" stroke="#1e5c68" stroke-width="24"/>
+      <path d="M625 769 L810 579 L949 769 Z M810 579 L1011 620 L949 769 M810 579 L887 539" stroke="#59a5a4" stroke-width="11"/>
+      <path d="M949 769 L1137 769 L1011 620" stroke="#1f5b68" stroke-width="24"/>
+      <path d="M949 769 L1137 769 L1011 620" stroke="#57a6a5" stroke-width="11"/>
+      <path d="M1011 620 L1099 493 L1165 510" stroke="url(#metal)" stroke-width="13"/>
+      <path d="M1095 492 C1121 473 1150 475 1178 491 C1190 498 1206 489 1210 474" stroke="#45585b" stroke-width="12"/>
+      <path d="M1095 492 C1121 473 1150 475 1178 491 C1190 498 1206 489 1210 474" stroke="#f0d798" stroke-width="3"/>
+      <path d="M810 579 L797 519" stroke="url(#metal)" stroke-width="15"/>
+      <path d="M754 517 Q794 494 837 514 Q839 530 824 537 L769 537 Q753 533 754 517Z" fill="#714b3c" stroke="#3e3637" stroke-width="5"/>
+      <path d="M949 769 L907 729" stroke="#47575a" stroke-width="8"/>
+      <circle cx="949" cy="769" r="39" fill="#e3c05e" stroke="#34464d" stroke-width="10"/>
+      <circle cx="949" cy="769" r="14" fill="#40575d"/>
+      <path d="M949 769 L1016 802 M949 769 L891 735" stroke="#4a5656" stroke-width="9"/>
+      <path d="M1009 805 l44 2 M884 733 l-43 -3" stroke="#2f3f45" stroke-width="12"/>
+      <path d="M625 769 L949 769" stroke="#4d4d42" stroke-width="5" opacity=".8"/>
+      <path d="M653 754 C732 730 835 740 912 766" stroke="#d5b65c" stroke-width="3" opacity=".72"/>
+    </g>
+
+    <!-- rear rack and small beach basket -->
+    <g>
+      <path d="M501 620 L601 620 L627 649 L520 649Z" fill="#b7854f" stroke="#5a4238" stroke-width="7"/>
+      <path d="M505 623 L621 649 M526 620 L542 649 M554 620 L569 649 M582 620 L597 649" stroke="#efcb79" stroke-width="4" opacity=".75"/>
+      <path d="M516 648 L548 712 M607 648 L578 705" fill="none" stroke="#45595b" stroke-width="8"/>
+      <path d="M510 618 Q549 573 591 618" fill="none" stroke="#5a4238" stroke-width="7"/>
+      <path d="M527 617 Q550 590 574 616" fill="none" stroke="#e2ba69" stroke-width="3"/>
+      <path d="M540 601 Q550 580 561 601" fill="#6a9d72"/>
+      <path d="M551 599 Q571 575 582 604" fill="#5d8d68"/>
+    </g>
+
+    <!-- pelican's long legs, intentionally visible through frame -->
+    <g>
+      <path d="M774 672 C765 710 786 737 825 754 C853 766 868 762 891 736" fill="none" stroke="#3e3638" stroke-width="35" stroke-linecap="round"/>
+      <path d="M774 672 C765 710 786 737 825 754 C853 766 868 762 891 736" fill="none" stroke="url(#leg)" stroke-width="25" stroke-linecap="round"/>
+      <path d="M868 670 C891 701 932 720 981 724 C1005 726 1026 746 1047 798" fill="none" stroke="#3e3638" stroke-width="35" stroke-linecap="round"/>
+      <path d="M868 670 C891 701 932 720 981 724 C1005 726 1026 746 1047 798" fill="none" stroke="url(#leg)" stroke-width="25" stroke-linecap="round"/>
+      <!-- webbed feet wrapped over pedals -->
+      <path d="M852 732 C871 725 899 727 915 739 C899 746 892 754 882 764 C868 754 853 754 837 751 C838 743 844 736 852 732Z" fill="#5b4b46"/>
+      <path d="M852 732 C871 725 899 727 915 739 C899 746 892 754 882 764 C868 754 853 754 837 751 C838 743 844 736 852 732Z" fill="url(#leg)" opacity=".8"/>
+      <path d="M1018 788 C1035 778 1067 783 1082 801 C1063 803 1054 814 1044 824 C1030 813 1019 811 1003 808 C1005 800 1010 793 1018 788Z" fill="#51423f"/>
+      <path d="M1021 790 C1038 783 1064 788 1078 802" fill="none" stroke="#aa957f" stroke-width="5" opacity=".65"/>
+    </g>
+
+    <!-- pelican body -->
+    <g>
+      <path d="M739 454 C709 489 690 554 698 624 C703 684 731 726 772 744 C815 763 901 754 949 717 C994 681 999 602 960 551 C925 505 871 477 821 459 C788 448 761 443 739 454Z" fill="#3e3738" opacity=".52" filter="url(#smallShadow)"/>
+      <path d="M742 425 C699 462 686 528 699 604 C707 664 734 716 781 739 C825 760 901 748 945 710 C982 677 990 613 961 556 C930 494 870 465 824 440 C793 423 763 414 742 425Z" fill="url(#creamFeather)" stroke="#4c3e3b" stroke-width="7"/>
+      <!-- pale breast -->
+      <path d="M759 466 C726 514 731 588 757 642 C777 684 814 716 848 724 C818 661 824 613 843 570 C861 528 840 480 807 453 C787 436 770 446 759 466Z" fill="#f7edc7" opacity=".94"/>
+      <path d="M763 484 C748 539 757 595 786 645 M783 470 C773 530 789 595 815 648 M810 471 C804 526 820 579 844 626" fill="none" stroke="#b69577" stroke-width="5" opacity=".55"/>
+      <!-- folded wing -->
+      <path d="M805 461 C857 463 932 500 962 554 C978 585 966 641 942 678 C923 707 883 734 829 728 C858 700 878 671 881 635 C884 596 853 545 805 461Z" fill="url(#wing)" stroke="#493a3a" stroke-width="7"/>
+      <path d="M840 500 C883 536 907 579 910 637 C909 666 897 693 875 711 M867 490 C911 525 938 568 938 617 C939 651 925 683 904 704 M894 503 C930 535 953 571 956 603" fill="none" stroke="#e1c18e" stroke-width="5" opacity=".5"/>
+      <path d="M825 534 C858 574 869 612 864 657 C860 685 845 707 829 728" fill="none" stroke="#2d3033" stroke-width="8" opacity=".58"/>
+      <!-- feather tips -->
+      <path d="M829 728 C856 711 881 697 905 703 C891 718 870 733 841 739Z" fill="#272b2f"/>
+      <path d="M862 719 C891 697 916 684 937 683 C924 706 900 725 878 735Z" fill="#323135"/>
+    </g>
+
+    <!-- neck and head, placed in front of torso -->
+    <g>
+      <path d="M765 486 C720 457 687 418 686 371 C684 330 708 310 727 283 C743 261 746 230 731 199 C722 178 739 159 766 159 C808 160 839 180 843 213 C848 260 823 301 810 335 C797 369 805 415 844 463 C818 490 790 499 765 486Z" fill="#4b3c3b" opacity=".52" filter="url(#smallShadow)"/>
+      <path d="M767 471 C725 447 701 414 701 372 C701 330 728 303 744 277 C762 248 765 219 749 190 C742 174 755 158 778 159 C818 160 845 181 849 216 C854 258 833 299 820 335 C806 373 816 414 851 455 C828 485 797 489 767 471Z" fill="url(#neck)" stroke="#51413d" stroke-width="7"/>
+      <path d="M756 191 C786 194 806 213 807 238 C810 276 786 310 777 345 C770 380 782 419 812 455" fill="none" stroke="#fff6d7" stroke-width="12" opacity=".72"/>
+      <path d="M730 353 C741 365 751 371 765 375 M727 383 C740 393 753 400 769 402 M737 414 C751 422 767 427 782 428" fill="none" stroke="#72584a" stroke-width="5" opacity=".65"/>
+      <!-- crown -->
+      <path d="M748 188 C735 169 745 145 764 138 C790 127 826 143 845 171 C818 158 792 158 766 170Z" fill="#f5edd0"/>
+      <path d="M759 158 C774 130 797 123 822 134 M775 159 C796 132 818 133 839 153" fill="none" stroke="#6e594b" stroke-width="5" stroke-linecap="round"/>
+      <!-- head -->
+      <path d="M738 208 C746 177 781 164 814 177 C845 189 855 215 843 239 C827 268 792 280 756 266 C735 258 729 232 738 208Z" fill="#f4e7bd" stroke="#57443e" stroke-width="7"/>
+      <path d="M744 220 C765 195 802 190 831 207 C833 218 829 228 822 238 C797 252 769 250 748 237Z" fill="#fff7d9" opacity=".82"/>
+      <!-- eye and face stripe -->
+      <path d="M748 222 C764 209 781 207 796 217 C781 223 766 233 752 241Z" fill="#6d5447" opacity=".72"/>
+      <ellipse cx="777" cy="214" rx="13" ry="11" fill="#efe48c" stroke="#3c3332" stroke-width="4"/>
+      <circle cx="778" cy="215" r="5.7" fill="#151a1b"/>
+      <circle cx="781" cy="211" r="2" fill="#fffde2"/>
+      <path d="M792 227 Q809 233 822 226" fill="none" stroke="#6f5242" stroke-width="4"/>
+    </g>
+
+    <!-- enormous pelican bill and pouch -->
+    <g>
+      <path d="M747 230 C706 224 671 234 625 253 C552 283 467 293 360 290 C325 289 297 304 297 325 C299 348 330 356 364 351 C478 337 585 338 666 319 C711 308 747 280 767 248 C769 239 760 233 747 230Z" fill="#574039" opacity=".42" filter="url(#smallShadow)"/>
+      <path d="M746 218 C702 215 671 227 625 244 C553 270 468 280 361 278 C326 277 300 291 301 311 C302 332 330 342 366 336 C476 321 583 324 664 304 C710 293 743 268 765 239 C767 230 758 221 746 218Z" fill="url(#bill)" stroke="#523d39" stroke-width="7"/>
+      <path d="M306 309 C356 308 459 306 570 294 C632 287 690 271 748 231" fill="none" stroke="#ffdd6a" stroke-width="8" opacity=".55"/>
+      <path d="M357 338 C433 341 543 331 632 313 C686 302 722 277 755 245 C745 295 716 331 674 359 C610 403 497 414 394 395 C352 387 327 369 331 354 C334 345 343 340 357 338Z" fill="url(#pouch)" stroke="#593f3b" stroke-width="7"/>
+      <path d="M356 351 C444 365 557 350 650 326 C690 315 722 291 750 260" fill="none" stroke="#e7bb82" stroke-width="7" opacity=".58"/>
+      <path d="M386 365 C465 381 558 367 642 344 M423 381 C497 395 565 383 619 366" fill="none" stroke="#82574b" stroke-width="5" opacity=".52"/>
+      <path d="M301 311 C297 297 310 282 334 277 C322 291 319 305 329 319 C321 322 311 319 301 311Z" fill="#40373a"/>
+      <path d="M735 232 Q751 223 764 235 Q750 249 739 257Z" fill="#403236"/>
+    </g>
+
+    <!-- front wing reaches the handlebars -->
+    <g>
+      <path d="M861 492 C918 467 982 463 1030 486 C1075 508 1107 524 1140 516 C1159 511 1175 521 1178 538 C1181 557 1163 570 1145 570 C1105 570 1071 553 1031 548 C976 541 931 552 889 570 C858 557 847 523 861 492Z" fill="#453a3b" opacity=".48" filter="url(#smallShadow)"/>
+      <path d="M857 479 C919 456 982 454 1028 476 C1073 497 1104 514 1137 505 C1156 500 1172 510 1175 527 C1178 545 1161 558 1143 558 C1104 558 1070 541 1032 536 C977 529 931 541 887 557 C858 545 846 509 857 479Z" fill="url(#wing)" stroke="#493a3a" stroke-width="7"/>
+      <path d="M884 491 C934 479 976 485 1015 502 C1051 519 1083 531 1122 531 M881 510 C930 501 968 509 1006 524 C1045 540 1084 546 1128 544" fill="none" stroke="#e3c38f" stroke-width="5" opacity=".52"/>
+      <path d="M1129 516 C1142 505 1159 510 1165 524 C1169 537 1159 548 1144 548 C1130 543 1123 530 1129 516Z" fill="#9b846e" stroke="#4c3d3c" stroke-width="5"/>
+      <path d="M1138 531 L1162 521 M1138 537 L1160 535" stroke="#e0cfaf" stroke-width="3"/>
+    </g>
+
+    <!-- bike details in foreground -->
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <path d="M1099 493 L1137 769" stroke="#344a50" stroke-width="7" opacity=".78"/>
+      <path d="M1153 521 Q1164 513 1175 521" stroke="#f8e4a3" stroke-width="4"/>
+      <path d="M956 776 C974 794 1000 807 1028 808" stroke="#f5d878" stroke-width="4" opacity=".85"/>
+      <circle cx="1011" cy="620" r="11" fill="#e7c861" stroke="#3d4f54" stroke-width="5"/>
+      <path d="M563 613 L550 587" stroke="#47595c" stroke-width="9"/>
+      <path d="M537 585 Q551 572 566 584" stroke="#efda94" stroke-width="4"/>
+    </g>
+
+    <!-- foreground dune grass gives a little depth -->
+    <g fill="none" stroke-linecap="round">
+      <path d="M88 1000 C75 929 96 884 142 841 M102 1000 C116 941 145 900 196 872 M141 1000 C135 939 121 907 92 871 M1496 1000 C1490 931 1519 889 1563 853 M1532 1000 C1539 940 1566 913 1591 899 M1462 1000 C1446 942 1420 909 1388 884" stroke="#8b9b57" stroke-width="10"/>
+      <path d="M88 1000 C75 929 96 884 142 841 M102 1000 C116 941 145 900 196 872 M141 1000 C135 939 121 907 92 871 M1496 1000 C1490 931 1519 889 1563 853 M1532 1000 C1539 940 1566 913 1591 899 M1462 1000 C1446 942 1420 909 1388 884" stroke="#c9be6d" stroke-width="3" opacity=".7"/>
+    </g>
+  </g>
+</svg>
diff --git a/outputs/gpt-5-6-terra/codex-cli-ultra/skeleton-watch.html b/outputs/gpt-5-6-terra/codex-cli-ultra/skeleton-watch.html
new file mode 100644
index 0000000..9ec38d1
--- /dev/null
+++ b/outputs/gpt-5-6-terra/codex-cli-ultra/skeleton-watch.html
@@ -0,0 +1,1605 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="color-scheme" content="dark">
+  <title>机械镂空腕表</title>
+  <style>
+    :root {
+      --ink: #eaf5ef;
+      --muted: #93aaa0;
+      --line: rgba(196, 236, 219, 0.15);
+      --panel: rgba(11, 23, 22, 0.76);
+      --panel-solid: #0d1918;
+      --accent: #6ee2bd;
+      --accent-soft: rgba(110, 226, 189, 0.18);
+      --chrome: #bfd1cb;
+      --radius: 18px;
+    }
+
+    * { box-sizing: border-box; }
+
+    html, body {
+      width: 100%;
+      min-height: 100%;
+      margin: 0;
+      overflow: hidden;
+      background: #06100f;
+      color: var(--ink);
+      font-family: "SF Pro Display", "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
+      -webkit-font-smoothing: antialiased;
+      text-rendering: geometricPrecision;
+    }
+
+    body {
+      background:
+        radial-gradient(ellipse at 50% 42%, rgba(35, 78, 69, 0.28), transparent 36%),
+        radial-gradient(ellipse at 12% 14%, rgba(73, 108, 98, 0.16), transparent 26%),
+        linear-gradient(135deg, #071312 0%, #07100f 48%, #0a1514 100%);
+    }
+
+    #experience {
+      position: relative;
+      width: 100%;
+      min-height: 100dvh;
+      overflow: hidden;
+      isolation: isolate;
+    }
+
+    #experience::before {
+      content: "";
+      position: absolute;
+      inset: 0;
+      z-index: -1;
+      pointer-events: none;
+      opacity: 0.58;
+      background:
+        repeating-linear-gradient(90deg, rgba(190, 241, 217, 0.017) 0 1px, transparent 1px 7px),
+        repeating-linear-gradient(0deg, rgba(190, 241, 217, 0.012) 0 1px, transparent 1px 9px);
+      mask-image: radial-gradient(circle at 50% 45%, black, transparent 73%);
+    }
+
+    #watch-canvas {
+      position: absolute;
+      inset: 0;
+      width: 100%;
+      height: 100%;
+      display: block;
+      touch-action: none;
+      cursor: grab;
+      outline: none;
+    }
+
+    #watch-canvas:active { cursor: grabbing; }
+
+    .topbar {
+      position: absolute;
+      z-index: 3;
+      top: 0;
+      left: 0;
+      right: 0;
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      gap: 24px;
+      padding: 28px 34px;
+      pointer-events: none;
+    }
+
+    .brand {
+      display: grid;
+      gap: 6px;
+      user-select: none;
+    }
+
+    .brand-mark {
+      display: flex;
+      align-items: center;
+      gap: 11px;
+      color: #f4fcf8;
+      font-size: 12px;
+      font-weight: 650;
+      letter-spacing: 0.23em;
+      text-transform: uppercase;
+    }
+
+    .brand-mark::before {
+      content: "";
+      width: 22px;
+      height: 1px;
+      background: linear-gradient(90deg, transparent, var(--accent));
+      box-shadow: 0 0 12px rgba(110, 226, 189, 0.46);
+    }
+
+    .brand-sub {
+      color: var(--muted);
+      font-size: 11px;
+      letter-spacing: 0.08em;
+    }
+
+    .live-status {
+      display: flex;
+      align-items: center;
+      gap: 9px;
+      min-height: 30px;
+      padding: 7px 11px 7px 10px;
+      border: 1px solid var(--line);
+      border-radius: 999px;
+      background: rgba(13, 27, 25, 0.48);
+      box-shadow: inset 0 1px 0 rgba(235, 255, 245, 0.06);
+      color: #bed1c8;
+      font-size: 11px;
+      letter-spacing: 0.08em;
+      white-space: nowrap;
+      backdrop-filter: blur(16px) saturate(125%);
+      -webkit-backdrop-filter: blur(16px) saturate(125%);
+    }
+
+    .live-status i {
+      display: block;
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+      background: var(--accent);
+      box-shadow: 0 0 10px rgba(110, 226, 189, 0.85);
+    }
+
+    .info-panel {
+      position: absolute;
+      z-index: 4;
+      top: 104px;
+      right: 32px;
+      width: min(310px, calc(100vw - 64px));
+      overflow: hidden;
+      border: 1px solid var(--line);
+      border-radius: var(--radius);
+      background:
+        linear-gradient(145deg, rgba(30, 57, 52, 0.27), transparent 52%),
+        var(--panel);
+      box-shadow:
+        inset 0 1px 0 rgba(245, 255, 250, 0.09),
+        0 18px 60px rgba(0, 0, 0, 0.22);
+      backdrop-filter: blur(18px) saturate(130%);
+      -webkit-backdrop-filter: blur(18px) saturate(130%);
+      transition: border-color 360ms ease, transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
+    }
+
+    .info-panel[data-selected="true"] {
+      border-color: rgba(110, 226, 189, 0.42);
+      transform: translateY(-2px);
+    }
+
+    .panel-top {
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      gap: 14px;
+      padding: 18px 19px 16px;
+      border-bottom: 1px solid rgba(196, 236, 219, 0.1);
+    }
+
+    .panel-kicker {
+      margin: 0 0 7px;
+      color: var(--accent);
+      font-size: 10px;
+      font-weight: 650;
+      letter-spacing: 0.16em;
+      text-transform: uppercase;
+    }
+
+    .panel-title {
+      margin: 0;
+      color: #f0faf4;
+      font-size: 20px;
+      font-weight: 620;
+      letter-spacing: -0.03em;
+      line-height: 1.15;
+    }
+
+    .panel-state {
+      margin-top: 2px;
+      flex: 0 0 auto;
+      max-width: 92px;
+      padding: 5px 7px;
+      border: 1px solid rgba(110, 226, 189, 0.25);
+      border-radius: 7px;
+      color: #b4dacf;
+      background: rgba(110, 226, 189, 0.08);
+      font-size: 10px;
+      line-height: 1.2;
+      text-align: center;
+    }
+
+    .panel-body {
+      padding: 15px 19px 18px;
+    }
+
+    .panel-body p {
+      margin: 0;
+      color: #b8cac3;
+      font-size: 12px;
+      line-height: 1.7;
+    }
+
+    .part-tags {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 7px;
+      margin-top: 15px;
+    }
+
+    .part-tags span {
+      padding: 5px 7px;
+      border: 1px solid rgba(196, 236, 219, 0.12);
+      border-radius: 7px;
+      background: rgba(4, 13, 12, 0.3);
+      color: #a7beb5;
+      font-size: 10px;
+      line-height: 1.1;
+    }
+
+    .panel-hint {
+      margin-top: 15px;
+      padding-top: 12px;
+      border-top: 1px solid rgba(196, 236, 219, 0.09);
+      color: #6e897e;
+      font-size: 10px;
+      line-height: 1.55;
+    }
+
+    .controls {
+      position: absolute;
+      z-index: 4;
+      bottom: 32px;
+      left: 32px;
+      display: flex;
+      flex-wrap: wrap;
+      gap: 8px;
+      max-width: min(480px, calc(100vw - 64px));
+    }
+
+    .control {
+      appearance: none;
+      min-height: 39px;
+      padding: 0 13px;
+      border: 1px solid rgba(196, 236, 219, 0.17);
+      border-radius: 11px;
+      background: rgba(12, 25, 23, 0.65);
+      box-shadow: inset 0 1px 0 rgba(248, 255, 251, 0.08);
+      color: #d5e5de;
+      font: inherit;
+      font-size: 12px;
+      line-height: 1;
+      cursor: pointer;
+      white-space: nowrap;
+      backdrop-filter: blur(14px) saturate(120%);
+      -webkit-backdrop-filter: blur(14px) saturate(120%);
+      transition:
+        transform 220ms cubic-bezier(0.16, 1, 0.3, 1),
+        border-color 220ms ease,
+        background 220ms ease,
+        color 220ms ease;
+    }
+
+    .control:hover,
+    .control[aria-pressed="true"] {
+      border-color: rgba(110, 226, 189, 0.55);
+      background: rgba(61, 122, 101, 0.24);
+      color: #f2fff9;
+    }
+
+    .control:focus-visible {
+      outline: 2px solid var(--accent);
+      outline-offset: 3px;
+    }
+
+    .control:active { transform: scale(0.98); }
+
+    .interaction-note {
+      position: absolute;
+      z-index: 2;
+      left: 50%;
+      bottom: 40px;
+      transform: translateX(-50%);
+      width: max-content;
+      max-width: calc(100vw - 700px);
+      color: rgba(190, 215, 204, 0.66);
+      font-size: 11px;
+      letter-spacing: 0.05em;
+      pointer-events: none;
+      text-align: center;
+      transition: opacity 600ms ease;
+    }
+
+    .interaction-note.hidden { opacity: 0; }
+
+    #part-tooltip {
+      position: absolute;
+      z-index: 6;
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      padding: 8px 10px;
+      border: 1px solid rgba(128, 241, 205, 0.52);
+      border-radius: 9px;
+      background: rgba(9, 24, 21, 0.86);
+      box-shadow:
+        inset 0 1px 0 rgba(245, 255, 249, 0.1),
+        0 12px 26px rgba(0, 0, 0, 0.28);
+      color: #ecfff6;
+      font-size: 11px;
+      line-height: 1;
+      letter-spacing: 0.04em;
+      pointer-events: none;
+      opacity: 0;
+      transform: translate(-50%, -135%) scale(0.96);
+      transform-origin: 50% 100%;
+      transition: opacity 140ms ease, transform 140ms ease;
+      white-space: nowrap;
+      backdrop-filter: blur(11px);
+      -webkit-backdrop-filter: blur(11px);
+    }
+
+    #part-tooltip.visible {
+      opacity: 1;
+      transform: translate(-50%, -135%) scale(1);
+    }
+
+    #part-tooltip::after {
+      content: "";
+      position: absolute;
+      left: 50%;
+      bottom: -5px;
+      width: 8px;
+      height: 8px;
+      border-right: 1px solid rgba(128, 241, 205, 0.52);
+      border-bottom: 1px solid rgba(128, 241, 205, 0.52);
+      background: rgba(9, 24, 21, 0.86);
+      transform: translateX(-50%) rotate(45deg);
+    }
+
+    #part-tooltip b {
+      color: var(--accent);
+      font-weight: 650;
+    }
+
+    #toast {
+      position: absolute;
+      z-index: 8;
+      left: 50%;
+      top: 88px;
+      padding: 9px 12px;
+      border: 1px solid rgba(110, 226, 189, 0.28);
+      border-radius: 10px;
+      background: rgba(9, 25, 22, 0.84);
+      box-shadow: 0 14px 30px rgba(0, 0, 0, 0.2);
+      color: #d9f6e9;
+      font-size: 11px;
+      pointer-events: none;
+      opacity: 0;
+      transform: translate(-50%, -12px);
+      transition: opacity 260ms ease, transform 260ms ease;
+      backdrop-filter: blur(14px);
+      -webkit-backdrop-filter: blur(14px);
+    }
+
+    #toast.visible {
+      opacity: 1;
+      transform: translate(-50%, 0);
+    }
+
+    #loading {
+      position: absolute;
+      z-index: 10;
+      inset: 0;
+      display: grid;
+      place-items: center;
+      background:
+        radial-gradient(circle at 50% 50%, rgba(38, 87, 75, 0.18), transparent 30%),
+        #07100f;
+      transition: opacity 650ms ease, visibility 650ms ease;
+    }
+
+    #loading.done {
+      visibility: hidden;
+      opacity: 0;
+    }
+
+    .loader-content {
+      display: grid;
+      justify-items: center;
+      gap: 16px;
+      color: #c9ddd4;
+      font-size: 11px;
+      letter-spacing: 0.15em;
+    }
+
+    .loader-ring {
+      width: 42px;
+      height: 42px;
+      border: 1px solid rgba(110, 226, 189, 0.24);
+      border-top-color: var(--accent);
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+    }
+
+    @keyframes spin { to { transform: rotate(1turn); } }
+
+    @media (max-width: 820px) {
+      .topbar { padding: 20px; }
+      .info-panel { top: 88px; right: 20px; width: min(286px, calc(100vw - 40px)); }
+      .controls { bottom: 20px; left: 20px; max-width: calc(100vw - 40px); }
+      .interaction-note { display: none; }
+    }
+
+    @media (max-width: 620px) {
+      .topbar { padding: 16px; }
+      .brand-sub { display: none; }
+      .live-status { font-size: 10px; }
+      .info-panel {
+        top: auto;
+        right: 14px;
+        left: 14px;
+        bottom: 82px;
+        width: auto;
+        max-width: none;
+      }
+      .panel-top { padding: 14px 15px 12px; }
+      .panel-body { padding: 11px 15px 13px; }
+      .panel-title { font-size: 17px; }
+      .panel-body p { font-size: 11px; line-height: 1.55; }
+      .part-tags, .panel-hint { display: none; }
+      .controls {
+        left: 14px;
+        right: 14px;
+        bottom: 14px;
+        justify-content: stretch;
+        max-width: none;
+      }
+      .control { flex: 1 1 calc(33% - 6px); min-width: 0; padding: 0 8px; font-size: 11px; }
+      #toast { top: 64px; }
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      *, *::before, *::after {
+        scroll-behavior: auto !important;
+        animation-duration: 0.001ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.001ms !important;
+      }
+    }
+  </style>
+</head>
+<body>
+  <main id="experience">
+    <canvas id="watch-canvas" aria-label="可交互的三维镂空机械腕表。拖拽旋转，悬停或点击零件查看信息。"></canvas>
+
+    <header class="topbar">
+      <div class="brand">
+        <div class="brand-mark">AURORA HOROLOGY</div>
+        <div class="brand-sub">SKELETON CALIBRE 01</div>
+      </div>
+      <div class="live-status"><i></i><span id="motion-status">机械运转中</span></div>
+    </header>
+
+    <aside class="info-panel" id="info-panel" data-selected="false" aria-live="polite">
+      <div class="panel-top">
+        <div>
+          <p class="panel-kicker" id="panel-kicker">探索机芯</p>
+          <h1 class="panel-title" id="panel-title">镂空机械机芯</h1>
+        </div>
+        <div class="panel-state" id="panel-state">实时联动</div>
+      </div>
+      <div class="panel-body">
+        <p id="panel-copy">拖拽自由观察。悬停或点击任一高亮部件，查看它在计时系统中的作用。</p>
+        <div class="part-tags" id="part-tags">
+          <span>手工倒角</span><span>动态擒纵</span><span>蓝宝石镜面</span>
+        </div>
+        <div class="panel-hint">拖拽旋转视角，滚轮缩放。点击后将锁定当前零件。</div>
+      </div>
+    </aside>
+
+    <div class="controls" aria-label="展示控制">
+      <button class="control" id="explode-toggle" type="button" aria-pressed="false">爆炸视图</button>
+      <button class="control" id="rotate-toggle" type="button" aria-pressed="true">自动旋转</button>
+      <button class="control" id="reset-view" type="button">复位镜头</button>
+    </div>
+
+    <div class="interaction-note" id="interaction-note">拖拽旋转腕表，悬停探索精密机芯</div>
+    <div id="part-tooltip" role="status"><b>部件</b><span id="tooltip-text"></span></div>
+    <div id="toast" aria-live="polite"></div>
+
+    <div id="loading" aria-live="polite">
+      <div class="loader-content">
+        <div class="loader-ring"></div>
+        <span>精密机芯装配中</span>
+      </div>
+    </div>
+  </main>
+
+  <script type="module">
+    import * as THREE from "https://cdn.jsdelivr.net/npm/three@0.162.0/build/three.module.js";
+    import { OrbitControls } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/controls/OrbitControls.js";
+    import { RoomEnvironment } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/environments/RoomEnvironment.js";
+    import { Reflector } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/objects/Reflector.js";
+    import { EffectComposer } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/postprocessing/EffectComposer.js";
+    import { RenderPass } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/postprocessing/RenderPass.js";
+    import { OutlinePass } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/postprocessing/OutlinePass.js";
+    import { UnrealBloomPass } from "https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/postprocessing/UnrealBloomPass.js";
+
+    const canvas = document.querySelector("#watch-canvas");
+    const stage = document.querySelector("#experience");
+    const loading = document.querySelector("#loading");
+    const tooltip = document.querySelector("#part-tooltip");
+    const tooltipText = document.querySelector("#tooltip-text");
+    const panel = document.querySelector("#info-panel");
+    const panelKicker = document.querySelector("#panel-kicker");
+    const panelTitle = document.querySelector("#panel-title");
+    const panelState = document.querySelector("#panel-state");
+    const panelCopy = document.querySelector("#panel-copy");
+    const tagBox = document.querySelector("#part-tags");
+    const interactionNote = document.querySelector("#interaction-note");
+    const toast = document.querySelector("#toast");
+    const explodeButton = document.querySelector("#explode-toggle");
+    const rotateButton = document.querySelector("#rotate-toggle");
+    const resetButton = document.querySelector("#reset-view");
+    const motionStatus = document.querySelector("#motion-status");
+
+    const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+    const renderer = new THREE.WebGLRenderer({ canvas, antialias: true, alpha: true });
+    renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
+    renderer.setSize(stage.clientWidth, stage.clientHeight, false);
+    renderer.shadowMap.enabled = true;
+    renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+    renderer.outputColorSpace = THREE.SRGBColorSpace;
+    renderer.toneMapping = THREE.ACESFilmicToneMapping;
+    renderer.toneMappingExposure = 1.08;
+
+    const scene = new THREE.Scene();
+    scene.fog = new THREE.FogExp2(0x07100f, 0.043);
+
+    const camera = new THREE.PerspectiveCamera(34, stage.clientWidth / stage.clientHeight, 0.1, 100);
+    const defaultCamera = new THREE.Vector3(0, 9.6, 13.8);
+    const defaultTarget = new THREE.Vector3(0, 0.22, 0);
+    camera.position.copy(defaultCamera);
+
+    const controls = new OrbitControls(camera, canvas);
+    controls.target.copy(defaultTarget);
+    controls.enableDamping = true;
+    controls.dampingFactor = 0.055;
+    controls.enablePan = false;
+    controls.minDistance = 8.2;
+    controls.maxDistance = 18;
+    controls.minPolarAngle = 0.24;
+    controls.maxPolarAngle = 1.42;
+    controls.rotateSpeed = 0.62;
+    controls.zoomSpeed = 0.72;
+
+    const composer = new EffectComposer(renderer);
+    composer.addPass(new RenderPass(scene, camera));
+    const bloomPass = new UnrealBloomPass(
+      new THREE.Vector2(stage.clientWidth, stage.clientHeight),
+      0.48,
+      0.62,
+      0.86
+    );
+    composer.addPass(bloomPass);
+    const outlinePass = new OutlinePass(new THREE.Vector2(stage.clientWidth, stage.clientHeight), scene, camera);
+    outlinePass.edgeStrength = 3.1;
+    outlinePass.edgeGlow = 0.48;
+    outlinePass.edgeThickness = 1.3;
+    outlinePass.pulsePeriod = 0;
+    outlinePass.visibleEdgeColor.set(0x77f2c9);
+    outlinePass.hiddenEdgeColor.set(0x1a6c57);
+    composer.addPass(outlinePass);
+
+    const pmrem = new THREE.PMREMGenerator(renderer);
+    const room = new RoomEnvironment();
+    scene.environment = pmrem.fromScene(room, 0.05).texture;
+    room.dispose();
+    pmrem.dispose();
+
+    const hemi = new THREE.HemisphereLight(0xc8fff0, 0x07100f, 1.35);
+    scene.add(hemi);
+
+    const keyLight = new THREE.SpotLight(0xe7fff8, 120, 35, 0.52, 0.64, 2);
+    keyLight.position.set(-7, 12, 7);
+    keyLight.target.position.set(0, 0, 0);
+    keyLight.castShadow = true;
+    keyLight.shadow.mapSize.set(1024, 1024);
+    keyLight.shadow.bias = -0.00018;
+    scene.add(keyLight, keyLight.target);
+
+    const rimLight = new THREE.SpotLight(0x77e8cc, 74, 30, 0.72, 0.84, 2);
+    rimLight.position.set(8, 8, -7);
+    rimLight.target.position.set(0, 0.25, 0);
+    scene.add(rimLight, rimLight.target);
+
+    const warmLight = new THREE.PointLight(0xffbd75, 18, 16, 2);
+    warmLight.position.set(-2, 4, -6);
+    scene.add(warmLight);
+
+    const floorMirror = new Reflector(new THREE.CircleGeometry(10.8, 128), {
+      textureWidth: Math.min(2048, stage.clientWidth * Math.min(window.devicePixelRatio, 2)),
+      textureHeight: Math.min(2048, stage.clientHeight * Math.min(window.devicePixelRatio, 2)),
+      color: 0x0c1817,
+      clipBias: 0.004
+    });
+    floorMirror.rotation.x = -Math.PI / 2;
+    floorMirror.position.y = -0.88;
+    scene.add(floorMirror);
+
+    const shadowFloor = new THREE.Mesh(
+      new THREE.CircleGeometry(10.55, 128),
+      new THREE.ShadowMaterial({ color: 0x000000, opacity: 0.36 })
+    );
+    shadowFloor.rotation.x = -Math.PI / 2;
+    shadowFloor.position.y = -0.872;
+    shadowFloor.receiveShadow = true;
+    scene.add(shadowFloor);
+
+    const floorHalo = new THREE.Mesh(
+      new THREE.RingGeometry(8.95, 9.02, 128),
+      new THREE.MeshBasicMaterial({ color: 0x5a8e7f, transparent: true, opacity: 0.12, side: THREE.DoubleSide })
+    );
+    floorHalo.rotation.x = -Math.PI / 2;
+    floorHalo.position.y = -0.865;
+    scene.add(floorHalo);
+
+    const materials = {
+      caseSteel: new THREE.MeshPhysicalMaterial({
+        color: 0x899a9d,
+        metalness: 0.96,
+        roughness: 0.18,
+        clearcoat: 0.72,
+        clearcoatRoughness: 0.14
+      }),
+      brushedSteel: new THREE.MeshPhysicalMaterial({
+        color: 0x637377,
+        metalness: 0.92,
+        roughness: 0.36,
+        clearcoat: 0.25,
+        clearcoatRoughness: 0.3
+      }),
+      darkSteel: new THREE.MeshPhysicalMaterial({
+        color: 0x172627,
+        metalness: 0.9,
+        roughness: 0.28,
+        clearcoat: 0.48,
+        clearcoatRoughness: 0.18
+      }),
+      blackMetal: new THREE.MeshPhysicalMaterial({
+        color: 0x0a1112,
+        metalness: 0.88,
+        roughness: 0.23,
+        clearcoat: 0.44,
+        clearcoatRoughness: 0.13
+      }),
+      gold: new THREE.MeshPhysicalMaterial({
+        color: 0xb58a3d,
+        metalness: 0.92,
+        roughness: 0.2,
+        clearcoat: 0.68,
+        clearcoatRoughness: 0.16
+      }),
+      goldDark: new THREE.MeshPhysicalMaterial({
+        color: 0x624617,
+        metalness: 0.9,
+        roughness: 0.32,
+        clearcoat: 0.35
+      }),
+      blueSteel: new THREE.MeshPhysicalMaterial({
+        color: 0x31596d,
+        metalness: 0.92,
+        roughness: 0.2,
+        clearcoat: 0.7,
+        clearcoatRoughness: 0.13
+      }),
+      ruby: new THREE.MeshPhysicalMaterial({
+        color: 0xa3142d,
+        metalness: 0.25,
+        roughness: 0.08,
+        transmission: 0.16,
+        thickness: 0.35,
+        ior: 1.5,
+        clearcoat: 1,
+        clearcoatRoughness: 0.04,
+        emissive: 0x280006,
+        emissiveIntensity: 0.42
+      }),
+      lume: new THREE.MeshStandardMaterial({
+        color: 0xa6f7d5,
+        emissive: 0x4ac79d,
+        emissiveIntensity: 1.5,
+        roughness: 0.34,
+        metalness: 0.1
+      }),
+      strap: new THREE.MeshPhysicalMaterial({
+        color: 0x0b1717,
+        metalness: 0.15,
+        roughness: 0.54,
+        clearcoat: 0.26,
+        clearcoatRoughness: 0.35
+      }),
+      crystal: new THREE.MeshPhysicalMaterial({
+        color: 0xcffcff,
+        metalness: 0,
+        roughness: 0.04,
+        transmission: 0.86,
+        thickness: 0.27,
+        ior: 1.47,
+        transparent: true,
+        opacity: 0.31,
+        clearcoat: 1,
+        clearcoatRoughness: 0.025,
+        side: THREE.DoubleSide,
+        depthWrite: false
+      }),
+      crystalEdge: new THREE.MeshPhysicalMaterial({
+        color: 0x95d5d2,
+        metalness: 0.22,
+        roughness: 0.05,
+        transmission: 0.42,
+        transparent: true,
+        opacity: 0.48,
+        clearcoat: 1
+      })
+    };
+
+    const partData = {
+      barrel: {
+        kicker: "能量模块",
+        name: "主发条盒",
+        state: "持续释能",
+        copy: "盘绕的主发条储存上链能量，并通过桶轮将稳定扭矩传递给整组传动齿轮。",
+        tags: ["发条钢带", "镀金桶轮", "扭矩输出"]
+      },
+      train: {
+        kicker: "传动模块",
+        name: "齿轮系",
+        state: "比例传动",
+        copy: "多级齿轮以互相啮合的节奏分配能量。不同直径形成清晰的转速层级与方向关系。",
+        tags: ["轮系啮合", "抛光齿面", "轴心联动"]
+      },
+      balance: {
+        kicker: "调速模块",
+        name: "摆轮与游丝",
+        state: "高频摆动",
+        copy: "摆轮提供规律惯性，游丝以极细的呼吸式收放维持振幅，决定整枚机芯的走时节拍。",
+        tags: ["蓝钢游丝", "微调砝码", "惯性摆轮"]
+      },
+      escapement: {
+        kicker: "擒纵模块",
+        name: "瑞士杠杆擒纵",
+        state: "脉冲释放",
+        copy: "擒纵叉将轮系连续释放的能量切分为短促脉冲，并在每次摆动中为摆轮补充动力。",
+        tags: ["擒纵叉", "逃逸轮", "脉冲传递"]
+      },
+      bridge: {
+        kicker: "结构模块",
+        name: "镂空夹板",
+        state: "稳定支承",
+        copy: "经过倒角处理的夹板固定轴承位置，同时以开放轮廓保留机芯纵深和齿轮运动的可见性。",
+        tags: ["手工倒角", "拉丝钢面", "固定螺丝"]
+      },
+      jewels: {
+        kicker: "轴承模块",
+        name: "红宝石轴承",
+        state: "低摩擦支点",
+        copy: "人工红宝石为高速转轴提供耐磨支点，降低摩擦并让润滑油膜保持稳定。",
+        tags: ["合成红宝石", "金属镶口", "耐磨支承"]
+      },
+      hands: {
+        kicker: "显示模块",
+        name: "夜光指针",
+        state: "实时走时",
+        copy: "分层抛光指针覆盖夜光涂层，透过全景镂空结构仍能在暗处保持清晰辨读。",
+        tags: ["夜光涂层", "分层指针", "秒针扫动"]
+      },
+      crystal: {
+        kicker: "保护模块",
+        name: "蓝宝石水晶",
+        state: "双面防眩",
+        copy: "弧面蓝宝石镜面为机芯提供硬质保护，边缘高光与细微反射强调它的通透厚度。",
+        tags: ["高硬度镜面", "通透镀膜", "弧面折射"]
+      }
+    };
+
+    const watch = new THREE.Group();
+    watch.rotation.y = -0.18;
+    watch.position.y = -0.08;
+    scene.add(watch);
+
+    const selectables = [];
+    const explodables = [];
+    const movingGears = [];
+    const reusable = {
+      screwHead: new THREE.CylinderGeometry(0.105, 0.12, 0.07, 16),
+      screwSlot: new THREE.BoxGeometry(0.12, 0.009, 0.018),
+      jewelSeat: new THREE.TorusGeometry(0.115, 0.026, 8, 24),
+      jewel: new THREE.SphereGeometry(0.097, 20, 12)
+    };
+
+    function setShadow(object) {
+      object.traverse(function(child) {
+        if (child.isMesh) {
+          child.castShadow = true;
+          child.receiveShadow = true;
+        }
+      });
+      return object;
+    }
+
+    function horizontalTorus(radius, tube, material, segments) {
+      const mesh = new THREE.Mesh(
+        new THREE.TorusGeometry(radius, tube, 12, segments || 72),
+        material
+      );
+      mesh.rotation.x = Math.PI / 2;
+      return mesh;
+    }
+
+    function ringGeometry(outerRadius, innerRadius, material, height) {
+      const shape = new THREE.Shape();
+      shape.absarc(0, 0, outerRadius, 0, Math.PI * 2, false);
+      const hole = new THREE.Path();
+      hole.absarc(0, 0, innerRadius, 0, Math.PI * 2, true);
+      shape.holes.push(hole);
+      const geometry = new THREE.ExtrudeGeometry(shape, {
+        depth: height,
+        bevelEnabled: true,
+        bevelSegments: 2,
+        bevelSize: 0.022,
+        bevelThickness: 0.02,
+        curveSegments: 96
+      });
+      geometry.rotateX(-Math.PI / 2);
+      return new THREE.Mesh(geometry, material);
+    }
+
+    function addScrew(parent, x, z, y, material) {
+      const screw = new THREE.Group();
+      const head = new THREE.Mesh(reusable.screwHead, material || materials.blueSteel);
+      head.position.y = 0;
+      const slot = new THREE.Mesh(reusable.screwSlot, materials.blackMetal);
+      slot.position.y = 0.039;
+      slot.rotation.y = (x * 2.51 + z * 1.37) % Math.PI;
+      screw.add(head, slot);
+      screw.position.set(x, y, z);
+      parent.add(screw);
+      return screw;
+    }
+
+    function addJewel(parent, x, z, y, scale) {
+      const size = scale || 1;
+      const seat = horizontalTorus(0.115 * size, 0.026 * size, materials.goldDark, 28);
+      const stone = new THREE.Mesh(reusable.jewel, materials.ruby);
+      stone.scale.setScalar(size);
+      stone.scale.y = 0.42;
+      seat.position.set(x, y, z);
+      stone.position.set(x, y + 0.016, z);
+      parent.add(seat, stone);
+    }
+
+    function makePart(id) {
+      const group = new THREE.Group();
+      group.userData.part = partData[id];
+      selectables.push(group);
+      return group;
+    }
+
+    function registerExplodable(group, displacement) {
+      group.userData.basePosition = group.position.clone();
+      group.userData.explodedPosition = group.position.clone().add(displacement);
+      explodables.push(group);
+    }
+
+    function makeGear(radius, teeth, material, spokeCount, thickness) {
+      const group = new THREE.Group();
+      const bodyHeight = thickness || 0.15;
+      const rim = horizontalTorus(radius * 0.72, radius * 0.115, material, 72);
+      rim.position.y = 0.004;
+      group.add(rim);
+
+      const spokeGeometry = new THREE.BoxGeometry(radius * 0.12, bodyHeight * 1.25, radius * 1.3);
+      const toothGeometry = new THREE.BoxGeometry(
+        Math.max(0.065, radius * 0.14),
+        bodyHeight * 1.12,
+        Math.max(0.095, radius * 0.16)
+      );
+      const spokeMaterial = material === materials.gold ? materials.goldDark : materials.darkSteel;
+      for (let index = 0; index < spokeCount; index += 1) {
+        const angle = (index / spokeCount) * Math.PI * 2;
+        const spoke = new THREE.Mesh(spokeGeometry, spokeMaterial);
+        spoke.rotation.y = angle;
+        spoke.position.y = 0;
+        group.add(spoke);
+      }
+      for (let index = 0; index < teeth; index += 1) {
+        const angle = (index / teeth) * Math.PI * 2;
+        const tooth = new THREE.Mesh(toothGeometry, material);
+        tooth.position.set(Math.sin(angle) * radius * 0.96, 0, Math.cos(angle) * radius * 0.96);
+        tooth.rotation.y = angle;
+        group.add(tooth);
+      }
+
+      const hub = new THREE.Mesh(
+        new THREE.CylinderGeometry(radius * 0.18, radius * 0.18, bodyHeight * 1.45, 32),
+        materials.blueSteel
+      );
+      const hubCap = new THREE.Mesh(
+        new THREE.CylinderGeometry(radius * 0.065, radius * 0.065, bodyHeight * 1.65, 20),
+        materials.ruby
+      );
+      hubCap.position.y = 0.014;
+      group.add(hub, hubCap);
+      return setShadow(group);
+    }
+
+    function makeSpiral(radius, turns, tube, material, inward) {
+      const points = [];
+      const count = 220;
+      for (let index = 0; index < count; index += 1) {
+        const progress = index / (count - 1);
+        const angle = progress * Math.PI * 2 * turns;
+        const adjusted = inward ? radius * (1 - progress * 0.84) : radius * (0.13 + progress * 0.87);
+        points.push(new THREE.Vector3(Math.sin(angle) * adjusted, 0, Math.cos(angle) * adjusted));
+      }
+      const curve = new THREE.CatmullRomCurve3(points);
+      return new THREE.Mesh(new THREE.TubeGeometry(curve, 260, tube, 7, false), material);
+    }
+
+    function makeBridgePlate(points, width, material) {
+      const left = [];
+      const right = [];
+      for (let index = 0; index < points.length; index += 1) {
+        const prev = points[Math.max(0, index - 1)];
+        const next = points[Math.min(points.length - 1, index + 1)];
+        const tangent = new THREE.Vector2(next.x - prev.x, next.z - prev.z).normalize();
+        const normal = new THREE.Vector2(-tangent.y, tangent.x).multiplyScalar(width * 0.5);
+        left.push(new THREE.Vector2(points[index].x + normal.x, -points[index].z - normal.y));
+        right.push(new THREE.Vector2(points[index].x - normal.x, -points[index].z + normal.y));
+      }
+      const shape = new THREE.Shape();
+      shape.moveTo(left[0].x, left[0].y);
+      for (let index = 1; index < left.length; index += 1) shape.lineTo(left[index].x, left[index].y);
+      for (let index = right.length - 1; index >= 0; index -= 1) shape.lineTo(right[index].x, right[index].y);
+      shape.closePath();
+      const geometry = new THREE.ExtrudeGeometry(shape, {
+        depth: 0.145,
+        bevelEnabled: true,
+        bevelSegments: 3,
+        bevelSize: 0.035,
+        bevelThickness: 0.026,
+        curveSegments: 18
+      });
+      geometry.rotateX(-Math.PI / 2);
+      const mesh = new THREE.Mesh(geometry, material);
+      return mesh;
+    }
+
+    function makeHand(length, width, material, lumeLength) {
+      const group = new THREE.Group();
+      const body = new THREE.Mesh(new THREE.BoxGeometry(width, 0.072, length), material);
+      body.position.z = length * 0.5 - width * 0.06;
+      const inlay = new THREE.Mesh(
+        new THREE.BoxGeometry(width * 0.45, 0.081, lumeLength || length * 0.58),
+        materials.lume
+      );
+      inlay.position.set(0, 0.015, (lumeLength || length * 0.58) * 0.5 + width * 0.12);
+      const counter = new THREE.Mesh(new THREE.BoxGeometry(width * 0.72, 0.07, length * 0.23), material);
+      counter.position.z = -length * 0.11;
+      group.add(body, inlay, counter);
+      return group;
+    }
+
+    function makeLabelSprite(text) {
+      const textureCanvas = document.createElement("canvas");
+      textureCanvas.width = 256;
+      textureCanvas.height = 64;
+      const context = textureCanvas.getContext("2d");
+      context.clearRect(0, 0, 256, 64);
+      context.font = "600 24px Arial";
+      context.letterSpacing = "5px";
+      context.fillStyle = "rgba(197, 224, 214, 0.72)";
+      context.textAlign = "center";
+      context.textBaseline = "middle";
+      context.fillText(text, 128, 33);
+      const texture = new THREE.CanvasTexture(textureCanvas);
+      texture.colorSpace = THREE.SRGBColorSpace;
+      const sprite = new THREE.Sprite(new THREE.SpriteMaterial({
+        map: texture,
+        transparent: true,
+        depthWrite: false,
+        opacity: 0.76
+      }));
+      sprite.scale.set(1.35, 0.337, 1);
+      return sprite;
+    }
+
+    const strapGroup = new THREE.Group();
+    watch.add(strapGroup);
+    const strapGeometry = new THREE.BoxGeometry(2.58, 0.24, 4.7);
+    const upperStrap = new THREE.Mesh(strapGeometry, materials.strap);
+    upperStrap.position.set(0, -0.22, 6.58);
+    const lowerStrap = new THREE.Mesh(strapGeometry, materials.strap);
+    lowerStrap.position.set(0, -0.22, -6.58);
+    strapGroup.add(upperStrap, lowerStrap);
+    for (let index = 0; index < 7; index += 1) {
+      const offset = index * 0.52 + 4.98;
+      const stitchA = new THREE.Mesh(new THREE.BoxGeometry(1.96, 0.012, 0.026), materials.brushedSteel);
+      const stitchB = stitchA.clone();
+      stitchA.position.set(0, -0.094, offset);
+      stitchB.position.set(0, -0.094, -offset);
+      strapGroup.add(stitchA, stitchB);
+    }
+
+    const caseGroup = new THREE.Group();
+    watch.add(caseGroup);
+    const caseBody = new THREE.Mesh(
+      new THREE.CylinderGeometry(5.34, 5.47, 0.72, 144),
+      materials.caseSteel
+    );
+    caseBody.position.y = -0.22;
+    caseGroup.add(caseBody);
+
+    const caseSide = ringGeometry(5.43, 5.02, materials.brushedSteel, 0.44);
+    caseSide.position.y = -0.43;
+    caseGroup.add(caseSide);
+
+    const backPlate = new THREE.Mesh(
+      new THREE.CylinderGeometry(4.94, 4.94, 0.09, 128),
+      materials.blackMetal
+    );
+    backPlate.position.y = 0.145;
+    caseGroup.add(backPlate);
+
+    const bezelGroup = new THREE.Group();
+    const bezel = horizontalTorus(5.0, 0.22, materials.caseSteel, 128);
+    bezel.position.y = 0.72;
+    const bezelInner = horizontalTorus(4.78, 0.038, materials.goldDark, 128);
+    bezelInner.position.y = 0.732;
+    bezelGroup.add(bezel, bezelInner);
+    watch.add(bezelGroup);
+    bezelGroup.userData.part = partData.crystal;
+    selectables.push(bezelGroup);
+    registerExplodable(bezelGroup, new THREE.Vector3(0, 0.82, 0));
+
+    const lugs = new THREE.Group();
+    const lugGeometry = new THREE.BoxGeometry(1.14, 0.34, 0.64);
+    const lugPositions = [
+      [-1.68, 5.1], [1.68, 5.1], [-1.68, -5.1], [1.68, -5.1]
+    ];
+    lugPositions.forEach(function(position) {
+      const lug = new THREE.Mesh(lugGeometry, materials.caseSteel);
+      lug.position.set(position[0], -0.18, position[1]);
+      lugs.add(lug);
+    });
+    watch.add(lugs);
+
+    const crown = new THREE.Group();
+    const crownBody = new THREE.Mesh(new THREE.CylinderGeometry(0.37, 0.37, 0.34, 32), materials.caseSteel);
+    crownBody.rotation.z = Math.PI / 2;
+    crownBody.position.x = 5.55;
+    const crownCap = new THREE.Mesh(new THREE.CylinderGeometry(0.29, 0.29, 0.06, 32), materials.blueSteel);
+    crownCap.rotation.z = Math.PI / 2;
+    crownCap.position.x = 5.76;
+    crown.add(crownBody, crownCap);
+    for (let index = 0; index < 16; index += 1) {
+      const groove = new THREE.Mesh(new THREE.BoxGeometry(0.08, 0.037, 0.07), materials.darkSteel);
+      groove.position.set(5.75, Math.sin(index / 16 * Math.PI * 2) * 0.3, Math.cos(index / 16 * Math.PI * 2) * 0.3);
+      crown.add(groove);
+    }
+    watch.add(crown);
+
+    const movementPlate = new THREE.Group();
+    const plateRing = ringGeometry(4.72, 4.36, materials.darkSteel, 0.17);
+    plateRing.position.y = 0.18;
+    const innerPlate = new THREE.Mesh(new THREE.CylinderGeometry(4.31, 4.31, 0.052, 128), materials.blackMetal);
+    innerPlate.position.y = 0.255;
+    movementPlate.add(plateRing, innerPlate);
+    watch.add(movementPlate);
+
+    const tickGroup = new THREE.Group();
+    watch.add(tickGroup);
+    for (let index = 0; index < 60; index += 1) {
+      const angle = index / 60 * Math.PI * 2;
+      const major = index % 5 === 0;
+      const length = major ? 0.43 : 0.19;
+      const width = major ? 0.065 : 0.025;
+      const marker = new THREE.Mesh(
+        new THREE.BoxGeometry(width, 0.048, length),
+        major ? materials.lume : materials.brushedSteel
+      );
+      marker.position.set(Math.sin(angle) * 4.27, 0.52, Math.cos(angle) * 4.27);
+      marker.rotation.y = angle;
+      tickGroup.add(marker);
+      if (major) {
+        const innerMarker = new THREE.Mesh(new THREE.BoxGeometry(width * 0.38, 0.054, length * 0.62), materials.caseSteel);
+        innerMarker.position.set(Math.sin(angle) * 4.16, 0.545, Math.cos(angle) * 4.16);
+        innerMarker.rotation.y = angle;
+        tickGroup.add(innerMarker);
+      }
+    }
+
+    const dialLabel = makeLabelSprite("AURORA");
+    dialLabel.position.set(0, 0.57, 2.93);
+    dialLabel.material.rotation = 0;
+    watch.add(dialLabel);
+    const dialCalibre = makeLabelSprite("CALIBRE 01");
+    dialCalibre.position.set(0, 0.57, -2.76);
+    dialCalibre.scale.set(1.04, 0.26, 1);
+    watch.add(dialCalibre);
+
+    const barrelPart = makePart("barrel");
+    barrelPart.position.set(-1.86, 0.41, 0.82);
+    const barrelOuter = horizontalTorus(1.46, 0.12, materials.gold, 96);
+    barrelOuter.position.y = 0.03;
+    const barrelInner = horizontalTorus(1.24, 0.046, materials.goldDark, 72);
+    barrelInner.position.y = 0.075;
+    const barrelBase = new THREE.Mesh(new THREE.CylinderGeometry(1.28, 1.28, 0.09, 80), materials.blackMetal);
+    barrelBase.position.y = -0.02;
+    const barrelSpring = makeSpiral(1.08, 5.2, 0.024, materials.gold, true);
+    barrelSpring.position.y = 0.095;
+    const barrelHub = new THREE.Mesh(new THREE.CylinderGeometry(0.19, 0.19, 0.16, 32), materials.blueSteel);
+    barrelHub.position.y = 0.11;
+    barrelPart.add(barrelBase, barrelOuter, barrelInner, barrelSpring, barrelHub);
+    for (let index = 0; index < 32; index += 1) {
+      const angle = index / 32 * Math.PI * 2;
+      const tooth = new THREE.Mesh(new THREE.BoxGeometry(0.12, 0.13, 0.16), materials.gold);
+      tooth.position.set(Math.sin(angle) * 1.47, 0.02, Math.cos(angle) * 1.47);
+      tooth.rotation.y = angle;
+      barrelPart.add(tooth);
+    }
+    addJewel(barrelPart, 0, 0, 0.19, 1.3);
+    watch.add(barrelPart);
+    registerExplodable(barrelPart, new THREE.Vector3(-0.9, 0.6, 0.48));
+
+    const trainPart = makePart("train");
+    trainPart.position.y = 0.4;
+    const trainCoordinates = [
+      { x: 1.36, z: 1.55, radius: 1.02, teeth: 33, spokes: 6, material: materials.gold, speed: -0.48 },
+      { x: 2.58, z: 0.14, radius: 0.64, teeth: 22, spokes: 5, material: materials.brushedSteel, speed: 0.8 },
+      { x: 1.45, z: -1.19, radius: 0.84, teeth: 29, spokes: 6, material: materials.gold, speed: -0.61 },
+      { x: 0.21, z: -1.83, radius: 0.5, teeth: 18, spokes: 4, material: materials.blueSteel, speed: 1.12 },
+      { x: -0.72, z: -1.42, radius: 0.55, teeth: 19, spokes: 5, material: materials.brushedSteel, speed: -0.94 }
+    ];
+    trainCoordinates.forEach(function(item, index) {
+      const gear = makeGear(item.radius, item.teeth, item.material, item.spokes, 0.13);
+      gear.position.set(item.x, 0.03 + (index % 2) * 0.04, item.z);
+      trainPart.add(gear);
+      movingGears.push({ object: gear, speed: item.speed, phase: index * 0.6 });
+      addJewel(trainPart, item.x, item.z, 0.17 + (index % 2) * 0.04, item.radius < 0.65 ? 0.72 : 0.96);
+    });
+    watch.add(trainPart);
+    registerExplodable(trainPart, new THREE.Vector3(0.48, 0.62, -0.54));
+
+    const escapementPart = makePart("escapement");
+    escapementPart.position.set(2.35, 0.56, -1.82);
+    const escapeWheel = makeGear(0.51, 19, materials.gold, 5, 0.1);
+    escapeWheel.position.x = 0.5;
+    escapeWheel.position.z = 0.16;
+    const escapeWheelHub = new THREE.Mesh(new THREE.CylinderGeometry(0.09, 0.09, 0.16, 20), materials.ruby);
+    escapeWheelHub.position.set(0.5, 0.085, 0.16);
+    const anchor = new THREE.Group();
+    const anchorStem = new THREE.Mesh(new THREE.BoxGeometry(0.085, 0.11, 0.96), materials.blueSteel);
+    anchorStem.position.z = -0.16;
+    const anchorFork = new THREE.Mesh(new THREE.BoxGeometry(0.92, 0.11, 0.1), materials.blueSteel);
+    anchorFork.position.z = -0.58;
+    const forkLeft = new THREE.Mesh(new THREE.BoxGeometry(0.12, 0.11, 0.32), materials.blueSteel);
+    const forkRight = forkLeft.clone();
+    forkLeft.position.set(-0.38, 0, -0.43);
+    forkRight.position.set(0.38, 0, -0.43);
+    forkLeft.rotation.y = -0.62;
+    forkRight.rotation.y = 0.62;
+    const palletA = new THREE.Mesh(new THREE.BoxGeometry(0.14, 0.13, 0.16), materials.ruby);
+    const palletB = palletA.clone();
+    palletA.position.set(-0.39, 0.02, -0.42);
+    palletB.position.set(0.39, 0.02, -0.42);
+    anchor.add(anchorStem, anchorFork, forkLeft, forkRight, palletA, palletB);
+    anchor.position.set(-0.18, 0.1, -0.04);
+    const anchorPivot = new THREE.Mesh(new THREE.CylinderGeometry(0.13, 0.13, 0.13, 24), materials.ruby);
+    anchorPivot.position.set(-0.18, 0.11, -0.04);
+    escapementPart.add(escapeWheel, escapeWheelHub, anchor, anchorPivot);
+    watch.add(escapementPart);
+    registerExplodable(escapementPart, new THREE.Vector3(0.98, 1.05, -0.35));
+    movingGears.push({ object: escapeWheel, speed: 3.3, phase: 0 });
+
+    const balancePart = makePart("balance");
+    balancePart.position.set(-1.92, 0.44, -2.12);
+    const balanceRotor = new THREE.Group();
+    const balanceRing = horizontalTorus(1.28, 0.08, materials.blueSteel, 92);
+    balanceRing.position.y = 0.07;
+    balanceRotor.add(balanceRing);
+    for (let index = 0; index < 8; index += 1) {
+      const angle = index / 8 * Math.PI * 2;
+      const spoke = new THREE.Mesh(new THREE.BoxGeometry(0.075, 0.11, 1.92), materials.caseSteel);
+      spoke.rotation.y = angle;
+      balanceRotor.add(spoke);
+      const weight = new THREE.Mesh(new THREE.CylinderGeometry(0.105, 0.105, 0.12, 16), materials.gold);
+      weight.position.set(Math.sin(angle) * 1.28, 0.07, Math.cos(angle) * 1.28);
+      balanceRotor.add(weight);
+    }
+    const balanceHub = new THREE.Mesh(new THREE.CylinderGeometry(0.2, 0.2, 0.18, 32), materials.blueSteel);
+    balanceHub.position.y = 0.08;
+    const balanceJewel = new THREE.Mesh(new THREE.SphereGeometry(0.12, 20, 12), materials.ruby);
+    balanceJewel.scale.y = 0.44;
+    balanceJewel.position.y = 0.18;
+    balanceRotor.add(balanceHub, balanceJewel);
+    const hairspring = makeSpiral(0.96, 5.4, 0.018, materials.gold, true);
+    hairspring.position.y = 0.19;
+    balancePart.add(balanceRotor, hairspring);
+    watch.add(balancePart);
+    registerExplodable(balancePart, new THREE.Vector3(-0.72, 1.24, -0.42));
+
+    const jewelPart = makePart("jewels");
+    jewelPart.position.y = 0.48;
+    [
+      [-3.18, 1.9, 0.9], [-3.55, -1.24, 0.78], [-0.1, 2.82, 0.75],
+      [3.22, 2.42, 0.86], [3.86, -0.64, 0.76], [0.25, -3.25, 0.68]
+    ].forEach(function(item) {
+      addJewel(jewelPart, item[0], item[1], 0.04, item[2]);
+    });
+    watch.add(jewelPart);
+    registerExplodable(jewelPart, new THREE.Vector3(0, 0.44, 0));
+
+    const bridgePart = makePart("bridge");
+    bridgePart.position.y = 0.52;
+    const upperBridge = makeBridgePlate([
+      { x: -3.42, z: 1.83 },
+      { x: -2.8, z: 2.83 },
+      { x: -1.25, z: 3.15 },
+      { x: 0.5, z: 2.88 },
+      { x: 2.28, z: 2.34 }
+    ], 0.31, materials.brushedSteel);
+    const lowerBridge = makeBridgePlate([
+      { x: -3.35, z: -2.52 },
+      { x: -2.52, z: -3.2 },
+      { x: -0.86, z: -3.48 },
+      { x: 0.88, z: -3.2 },
+      { x: 2.45, z: -2.65 }
+    ], 0.25, materials.brushedSteel);
+    const balanceBridge = makeBridgePlate([
+      { x: -3.4, z: -1.22 },
+      { x: -3.2, z: -2.75 },
+      { x: -2.3, z: -3.65 },
+      { x: -1.18, z: -3.17 }
+    ], 0.24, materials.caseSteel);
+    bridgePart.add(upperBridge, lowerBridge, balanceBridge);
+    [
+      [-3.36, 1.84], [2.24, 2.35], [-3.3, -2.53], [2.42, -2.66], [-3.36, -1.2], [-1.15, -3.17]
+    ].forEach(function(item, index) {
+      addScrew(bridgePart, item[0], item[1], 0.12, index % 2 ? materials.blueSteel : materials.caseSteel);
+    });
+    watch.add(bridgePart);
+    registerExplodable(bridgePart, new THREE.Vector3(0.15, 1.58, 0.18));
+
+    const handsPart = makePart("hands");
+    handsPart.position.y = 0.72;
+    const hourHand = makeHand(2.08, 0.2, materials.caseSteel, 1.18);
+    const minuteHand = makeHand(3.16, 0.13, materials.blueSteel, 1.85);
+    const secondHand = new THREE.Group();
+    const secondStem = new THREE.Mesh(new THREE.BoxGeometry(0.032, 0.055, 3.65), materials.gold);
+    secondStem.position.z = 1.48;
+    const secondTip = new THREE.Mesh(new THREE.BoxGeometry(0.088, 0.06, 0.26), materials.lume);
+    secondTip.position.z = 3.18;
+    const secondCounter = new THREE.Mesh(new THREE.CylinderGeometry(0.14, 0.14, 0.07, 24), materials.gold);
+    secondHand.add(secondStem, secondTip, secondCounter);
+    const centralHub = new THREE.Mesh(new THREE.CylinderGeometry(0.28, 0.28, 0.16, 32), materials.caseSteel);
+    centralHub.position.y = 0.05;
+    const centralRuby = new THREE.Mesh(new THREE.SphereGeometry(0.13, 20, 12), materials.ruby);
+    centralRuby.position.y = 0.14;
+    centralRuby.scale.y = 0.45;
+    handsPart.add(hourHand, minuteHand, secondHand, centralHub, centralRuby);
+    watch.add(handsPart);
+    registerExplodable(handsPart, new THREE.Vector3(0, 1.48, 0));
+
+    const crystalPart = makePart("crystal");
+    crystalPart.position.y = 0.85;
+    const crystal = new THREE.Mesh(new THREE.CylinderGeometry(4.88, 4.88, 0.07, 128), materials.crystal);
+    const crystalRim = horizontalTorus(4.89, 0.03, materials.crystalEdge, 128);
+    crystalRim.position.y = 0.047;
+    const crystalHighlight = new THREE.Mesh(
+      new THREE.TorusGeometry(4.48, 0.012, 6, 96, Math.PI * 0.6),
+      new THREE.MeshBasicMaterial({ color: 0xc9fff4, transparent: true, opacity: 0.34 })
+    );
+    crystalHighlight.rotation.x = Math.PI / 2;
+    crystalHighlight.rotation.z = 0.82;
+    crystalHighlight.position.set(0, 0.058, 0);
+    crystalPart.add(crystal, crystalRim, crystalHighlight);
+    watch.add(crystalPart);
+    registerExplodable(crystalPart, new THREE.Vector3(0, 2.45, 0));
+
+    const apertureRing = horizontalTorus(4.44, 0.025, materials.goldDark, 128);
+    apertureRing.position.y = 0.49;
+    watch.add(apertureRing);
+
+    const dustGeometry = new THREE.BufferGeometry();
+    const dustPoints = [];
+    const dustColor = [];
+    const random = function(seed) {
+      const value = Math.sin(seed * 12.9898) * 43758.5453;
+      return value - Math.floor(value);
+    };
+    for (let index = 0; index < 320; index += 1) {
+      const radius = 7 + random(index + 3) * 12;
+      const angle = random(index + 7) * Math.PI * 2;
+      dustPoints.push(Math.cos(angle) * radius, -1.3 + random(index + 11) * 6.5, Math.sin(angle) * radius);
+      const shade = 0.3 + random(index + 13) * 0.45;
+      dustColor.push(shade * 0.5, shade, shade * 0.78);
+    }
+    dustGeometry.setAttribute("position", new THREE.Float32BufferAttribute(dustPoints, 3));
+    dustGeometry.setAttribute("color", new THREE.Float32BufferAttribute(dustColor, 3));
+    const dust = new THREE.Points(dustGeometry, new THREE.PointsMaterial({
+      size: 0.025,
+      vertexColors: true,
+      transparent: true,
+      opacity: 0.55,
+      sizeAttenuation: true,
+      depthWrite: false
+    }));
+    scene.add(dust);
+
+    setShadow(watch);
+
+    const raycaster = new THREE.Raycaster();
+    const pointer = new THREE.Vector2(2, 2);
+    let hoveredPart = null;
+    let selectedPart = null;
+    let exploded = false;
+    let autoRotate = !reducedMotion;
+    let resetCamera = false;
+    let staticHandsSet = false;
+    let pointerDown = null;
+    let showInstruction = true;
+    let toastTimer = null;
+    const clock = new THREE.Clock();
+    const projectedPosition = new THREE.Vector3();
+    const bounds = new THREE.Box3();
+    const boundsCenter = new THREE.Vector3();
+
+    if (reducedMotion) {
+      rotateButton.setAttribute("aria-pressed", "false");
+      rotateButton.textContent = "自动旋转";
+      motionStatus.textContent = "静态观察模式";
+    }
+
+    function getPartFromObject(object) {
+      let current = object;
+      while (current) {
+        if (current.userData && current.userData.part) return current;
+        current = current.parent;
+      }
+      return null;
+    }
+
+    function meshesForPart(group) {
+      const meshes = [];
+      if (!group) return meshes;
+      group.traverse(function(child) {
+        if (child.isMesh && child.visible) meshes.push(child);
+      });
+      return meshes;
+    }
+
+    function syncOutline() {
+      const selectedMeshes = meshesForPart(selectedPart);
+      const hoverMeshes = hoveredPart && hoveredPart !== selectedPart ? meshesForPart(hoveredPart) : [];
+      outlinePass.selectedObjects = selectedMeshes.concat(hoverMeshes);
+    }
+
+    function renderPanel(data, locked) {
+      panel.dataset.selected = locked ? "true" : "false";
+      panelKicker.textContent = data.kicker;
+      panelTitle.textContent = data.name;
+      panelState.textContent = data.state;
+      panelCopy.textContent = data.copy;
+      tagBox.innerHTML = "";
+      data.tags.forEach(function(tag) {
+        const tagElement = document.createElement("span");
+        tagElement.textContent = tag;
+        tagBox.appendChild(tagElement);
+      });
+    }
+
+    function showToast(message) {
+      toast.textContent = message;
+      toast.classList.add("visible");
+      clearTimeout(toastTimer);
+      toastTimer = setTimeout(function() {
+        toast.classList.remove("visible");
+      }, 1500);
+    }
+
+    function setHovered(nextPart) {
+      if (hoveredPart === nextPart) return;
+      hoveredPart = nextPart;
+      canvas.style.cursor = hoveredPart ? "pointer" : "grab";
+      if (hoveredPart) {
+        tooltipText.textContent = hoveredPart.userData.part.name;
+        tooltip.classList.add("visible");
+        if (!selectedPart) renderPanel(hoveredPart.userData.part, false);
+      } else {
+        tooltip.classList.remove("visible");
+        if (!selectedPart) {
+          renderPanel({
+            kicker: "探索机芯",
+            name: "镂空机械机芯",
+            state: "实时联动",
+            copy: "拖拽自由观察。悬停或点击任一高亮部件，查看它在计时系统中的作用。",
+            tags: ["手工倒角", "动态擒纵", "蓝宝石镜面"]
+          }, false);
+        }
+      }
+      syncOutline();
+    }
+
+    function setSelected(nextPart) {
+      selectedPart = nextPart;
+      if (selectedPart) {
+        renderPanel(selectedPart.userData.part, true);
+        showToast("已锁定：" + selectedPart.userData.part.name);
+      }
+      syncOutline();
+    }
+
+    function updateRaycast(event) {
+      const rect = canvas.getBoundingClientRect();
+      pointer.x = ((event.clientX - rect.left) / rect.width) * 2 - 1;
+      pointer.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+      raycaster.setFromCamera(pointer, camera);
+      const hits = raycaster.intersectObjects(selectables, true);
+      setHovered(hits.length ? getPartFromObject(hits[0].object) : null);
+    }
+
+    function updateTooltipPosition() {
+      if (!hoveredPart) return;
+      bounds.setFromObject(hoveredPart);
+      bounds.getCenter(boundsCenter);
+      projectedPosition.copy(boundsCenter).project(camera);
+      const onScreen = projectedPosition.z > -1 && projectedPosition.z < 1
+        && Math.abs(projectedPosition.x) < 1.15
+        && Math.abs(projectedPosition.y) < 1.15;
+      if (!onScreen) {
+        tooltip.classList.remove("visible");
+        return;
+      }
+      const x = (projectedPosition.x * 0.5 + 0.5) * stage.clientWidth;
+      const y = (-projectedPosition.y * 0.5 + 0.5) * stage.clientHeight;
+      tooltip.style.left = x + "px";
+      tooltip.style.top = y + "px";
+      tooltip.classList.add("visible");
+    }
+
+    canvas.addEventListener("pointermove", function(event) {
+      updateRaycast(event);
+      if (showInstruction) {
+        showInstruction = false;
+        interactionNote.classList.add("hidden");
+      }
+    });
+
+    canvas.addEventListener("pointerleave", function() {
+      setHovered(null);
+    });
+
+    canvas.addEventListener("pointerdown", function(event) {
+      pointerDown = { x: event.clientX, y: event.clientY };
+    });
+
+    canvas.addEventListener("pointerup", function(event) {
+      if (!pointerDown) return;
+      const travel = Math.hypot(event.clientX - pointerDown.x, event.clientY - pointerDown.y);
+      if (travel < 7) {
+        updateRaycast(event);
+        if (hoveredPart) setSelected(hoveredPart);
+      }
+      pointerDown = null;
+    });
+
+    explodeButton.addEventListener("click", function() {
+      exploded = !exploded;
+      explodeButton.setAttribute("aria-pressed", String(exploded));
+      explodeButton.textContent = exploded ? "收拢机芯" : "爆炸视图";
+      showToast(exploded ? "已展开机芯装配层级" : "已收拢至运行状态");
+    });
+
+    rotateButton.addEventListener("click", function() {
+      autoRotate = !autoRotate;
+      rotateButton.setAttribute("aria-pressed", String(autoRotate));
+      rotateButton.textContent = autoRotate ? "自动旋转" : "暂停旋转";
+      motionStatus.textContent = autoRotate ? "机械运转中" : "观察已暂停";
+    });
+
+    resetButton.addEventListener("click", function() {
+      resetCamera = true;
+      showToast("镜头已回到展示视角");
+    });
+
+    function resize() {
+      const width = stage.clientWidth;
+      const height = stage.clientHeight;
+      camera.aspect = width / height;
+      camera.updateProjectionMatrix();
+      renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
+      renderer.setSize(width, height, false);
+      composer.setSize(width, height);
+      bloomPass.setSize(width, height);
+      outlinePass.setSize(width, height);
+    }
+
+    window.addEventListener("resize", resize);
+
+    function setHandsFromCurrentTime() {
+      const date = new Date();
+      const milliseconds = date.getMilliseconds();
+      const second = date.getSeconds() + milliseconds / 1000;
+      const minute = date.getMinutes() + second / 60;
+      const hour = (date.getHours() % 12) + minute / 60;
+      secondHand.rotation.y = -second / 60 * Math.PI * 2;
+      minuteHand.rotation.y = -minute / 60 * Math.PI * 2;
+      hourHand.rotation.y = -hour / 12 * Math.PI * 2;
+    }
+
+    function animateMechanics(time, delta) {
+      if (reducedMotion) {
+        if (!staticHandsSet) {
+          setHandsFromCurrentTime();
+          staticHandsSet = true;
+        }
+        return;
+      }
+      const seconds = time * 0.001;
+      movingGears.forEach(function(entry) {
+        entry.object.rotation.y = entry.phase + seconds * entry.speed;
+      });
+      barrelSpring.rotation.y = seconds * -0.09;
+      balanceRotor.rotation.y = Math.sin(seconds * 18) * 0.23;
+      hairspring.scale.setScalar(1 + Math.sin(seconds * 18 + 0.8) * 0.032);
+      anchor.rotation.y = Math.sin(seconds * 18) * 0.25;
+      escapeWheel.rotation.y = seconds * 3.3;
+      setHandsFromCurrentTime();
+      crystalHighlight.material.opacity = 0.23 + Math.sin(seconds * 0.72) * 0.08;
+      dust.rotation.y = seconds * 0.006;
+      watch.position.y = -0.08 + Math.sin(seconds * 0.8) * 0.035;
+      if (autoRotate && !pointerDown) watch.rotation.y += delta * 0.000075;
+    }
+
+    function animateExplosion() {
+      explodables.forEach(function(group) {
+        const target = exploded ? group.userData.explodedPosition : group.userData.basePosition;
+        group.position.lerp(target, reducedMotion ? 1 : 0.105);
+      });
+    }
+
+    function animateCamera() {
+      if (!resetCamera) return;
+      camera.position.lerp(defaultCamera, 0.085);
+      controls.target.lerp(defaultTarget, 0.085);
+      if (camera.position.distanceTo(defaultCamera) < 0.025 && controls.target.distanceTo(defaultTarget) < 0.01) {
+        camera.position.copy(defaultCamera);
+        controls.target.copy(defaultTarget);
+        resetCamera = false;
+      }
+    }
+
+    function render() {
+      const delta = clock.getDelta();
+      const elapsed = clock.elapsedTime;
+      animateMechanics(elapsed * 1000, delta);
+      animateExplosion();
+      animateCamera();
+      controls.update();
+      updateTooltipPosition();
+      composer.render();
+      requestAnimationFrame(render);
+    }
+
+    requestAnimationFrame(function() {
+      loading.classList.add("done");
+      render();
+    });
+  </script>
+</body>
+</html>