diff --git a/README.en.md b/README.en.md
index 9467a9e..8e06a6e 100644
--- a/README.en.md
+++ b/README.en.md
@@ -30,13 +30,13 @@ One-shot LLM eval cases by NAGI STUDIO: same prompt, different model x harness x
 | Model | Vendor | Harness x Effort | Runs |
 |---|---|---|---|
 | Claude Fable 5 | Anthropic | Claude Web App · Max<br>Claude Code · Max<br>Cursor · High | 06 |
-| Claude Opus 4.8 | Anthropic | Claude Code · Max | 04 |
-| Claude Opus 4.7 | Anthropic | Cursor · Max | 02 |
-| Claude Opus 4.6 | Anthropic | Cursor · Max | 02 |
+| Claude Opus 4.6 | Anthropic | Claude Code · Max<br>Cursor · Max | 04 |
+| Claude Opus 4.7 | Anthropic | Claude Code · Max<br>Cursor · Max | 05 |
+| Claude Opus 4.8 | Anthropic | Claude Code · Max | 05 |
 | Claude Opus 4.5 | Anthropic | Cursor · Thinking | 02 |
 | Claude Sonnet 4.6 | Anthropic | Claude Code · Max<br>Cursor · High | 03 |
 | Claude Haiku 4.5 | Anthropic | Claude Code · Default | 02 |
-| GPT-5.5 Pro | OpenAI | ChatGPT Web · Extended Pro | 02 |
+| GPT-5.5 Pro | OpenAI | ChatGPT Web · Extended Pro | 03 |
 | GPT-5.5 | OpenAI | Codex CLI · xhigh | 02 |
 | GPT-5.4 | OpenAI | Cursor · xhigh<br>Codex CLI · xhigh | 05 |
 | GPT-5.3 Codex | OpenAI | Cursor · xhigh | 02 |
diff --git a/README.md b/README.md
index c53e82f..a1fb2a7 100644
--- a/README.md
+++ b/README.md
@@ -30,13 +30,13 @@ NAGI STUDIO 的 LLM 测评案例集：同一段提示词，不同「模型 × Ha
 | 模型 | 厂商 | 运行环境（Harness）× 思考配额 | 产出 |
 |---|---|---|---|
 | Claude Fable 5 | Anthropic | Claude Web App · Max<br>Claude Code · Max<br>Cursor · High | 06 |
-| Claude Opus 4.8 | Anthropic | Claude Code · Max | 04 |
-| Claude Opus 4.7 | Anthropic | Cursor · Max | 02 |
-| Claude Opus 4.6 | Anthropic | Cursor · Max | 02 |
+| Claude Opus 4.6 | Anthropic | Claude Code · Max<br>Cursor · Max | 04 |
+| Claude Opus 4.7 | Anthropic | Claude Code · Max<br>Cursor · Max | 05 |
+| Claude Opus 4.8 | Anthropic | Claude Code · Max | 05 |
 | Claude Opus 4.5 | Anthropic | Cursor · Thinking | 02 |
 | Claude Sonnet 4.6 | Anthropic | Claude Code · Max<br>Cursor · High | 03 |
 | Claude Haiku 4.5 | Anthropic | Claude Code · Default | 02 |
-| GPT-5.5 Pro | OpenAI | ChatGPT Web · Extended Pro | 02 |
+| GPT-5.5 Pro | OpenAI | ChatGPT Web · Extended Pro | 03 |
 | GPT-5.5 | OpenAI | Codex CLI · xhigh | 02 |
 | GPT-5.4 | OpenAI | Cursor · xhigh<br>Codex CLI · xhigh | 05 |
 | GPT-5.3 Codex | OpenAI | Cursor · xhigh | 02 |
diff --git a/cases.json b/cases.json
index a1ea978..b1a27a1 100644
--- a/cases.json
+++ b/cases.json
@@ -28,5 +28,20 @@
       "en": "Create a realistic, lively <svg> of a pelican riding a bicycle by the sea."
     },
     "tags": ["SVG", "ILLUSTRATION", "ONE-SHOT"]
+  },
+  {
+    "id": "skeleton-watch",
+    "index": "03",
+    "kind": "html",
+    "title": { "zh": "镂空机械表", "en": "Skeleton Watch" },
+    "tagline": {
+      "zh": "单个 HTML 文件，一次生成一只可旋转、可爆炸视图的 3D 镂空机械腕表，机芯全可见。",
+      "en": "A single HTML file: a rotatable, exploded-view 3D skeleton mechanical watch with a fully visible movement, generated in one shot."
+    },
+    "prompt": {
+      "zh": "创建一个精美、高细节的交互式 3D 镂空机械表。\n\n核心要求：\n• 完全可见的复杂机芯：包括主发条、齿轮系、带游丝的摆轮、擒纵机构、夹板、红宝石轴承等。\n• 真实的金属材质、蓝宝石水晶玻璃、反射、阴影，以及奢华腕表摄影级别的照明效果。\n• 荧光指针与刻度。\n• 交互式控制：支持旋转手表、切换爆炸视图、悬停/点击时高亮显示的零件标签、机芯信息面板。\n• 流畅的动画，达到专业级产品展示质量。\n• 深色优雅背景，带有细微的反射效果。\n\n在一次回复中尽可能真实且令人惊叹地完成。输出为一个完整的、自包含的单 HTML 文件，使用 Three.js (CDN)，所有代码均采用内联形式。",
+      "en": "Create an exquisite, highly detailed, interactive 3D skeleton mechanical watch.\n\nCore requirements:\n• A fully visible, complex movement: mainspring, gear train, balance wheel with hairspring, escapement, bridges, ruby bearings, and so on.\n• Realistic metal materials, sapphire crystal glass, reflections, shadows, and luxury-watch photography-grade lighting.\n• Luminous hands and markers.\n• Interactive controls: rotate the watch, toggle an exploded view, part labels highlighted on hover/click, and a movement info panel.\n• Smooth animation at professional product-showcase quality.\n• A dark, elegant background with subtle reflections.\n\nMake it as realistic and stunning as possible in a single response. Output a complete, self-contained single HTML file using Three.js (CDN), with all code inline."
+    },
+    "tags": ["HTML", "3D", "THREE.JS", "ONE-SHOT"]
   }
 ]
diff --git a/models/claude-haiku-4-5-cc.json b/models/claude-haiku-4-5-cc.json
index d3d5b7e..59c7b31 100644
--- a/models/claude-haiku-4-5-cc.json
+++ b/models/claude-haiku-4-5-cc.json
@@ -7,7 +7,6 @@
   "order": 19.5,
   "runs": {
     "mythos-craft": {
-      "file": "minecraft-clone.html",
       "note": {
         "zh": "在 Claude Code 中以 Claude Haiku 4.5（Default 思考配额）一次生成。原始 HTML 因 Three.js 异步加载、渲染 canvas 绑定和 world 变量接线问题无法正常打开；Codex 仅修复启动接线以让原始实现可运行，未改动玩法、地形、视觉设计或控制逻辑。",
         "en": "Generated in one shot by Claude Haiku 4.5 (Default effort) inside Claude Code. The original HTML could not open correctly due to Three.js async loading, render-canvas binding, and world variable wiring issues; Codex only fixed the startup wiring so the original implementation can run, without changing gameplay, terrain, visual design, or control logic."
@@ -15,7 +14,6 @@
       "contributor": "Nagi-ovo"
     },
     "pelican-cycling": {
-      "file": "pelican-bike.svg",
       "note": {
         "zh": "在 Claude Code 中以 Claude Haiku 4.5（Default 思考配额）一次生成；本页为未经修改的原始 SVG 产出。",
         "en": "Generated in one shot by Claude Haiku 4.5 (Default effort) inside Claude Code; unmodified original SVG output."
diff --git a/models/claude-opus-4-6-cc.json b/models/claude-opus-4-6-cc.json
new file mode 100644
index 0000000..7429f95
--- /dev/null
+++ b/models/claude-opus-4-6-cc.json
@@ -0,0 +1,24 @@
+{
+  "label": "Claude Opus 4.6",
+  "vendor": "Anthropic",
+  "harness": "Claude Code",
+  "effort": "Max",
+  "artifactDir": "claude-opus-4-6/claude-code-max",
+  "order": 14.6,
+  "runs": {
+    "pelican-cycling": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.6（Max 思考配额）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot by Claude Opus 4.6 (Max effort) inside Claude Code; unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
+    },
+    "skeleton-watch": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.6（Max 思考配额）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot by Claude Opus 4.6 (Max effort) inside Claude Code; unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
+    }
+  }
+}
diff --git a/models/claude-opus-4-6-cursor.json b/models/claude-opus-4-6-cursor.json
index c317e93..d31ceaf 100644
--- a/models/claude-opus-4-6-cursor.json
+++ b/models/claude-opus-4-6-cursor.json
@@ -14,7 +14,6 @@
       "contributor": "Nagi-ovo"
     },
     "pelican-cycling": {
-      "file": "pelican-bicycle.svg",
       "note": {
         "zh": "在 Cursor CLI 中以 Claude Opus 4.6（Max 思考配额）一次生成；本页为未经修改的原始产出。",
         "en": "Generated in one shot by Claude Opus 4.6 (Max effort) inside Cursor CLI; unmodified original output."
diff --git a/models/claude-opus-4-7-cc.json b/models/claude-opus-4-7-cc.json
new file mode 100644
index 0000000..e498150
--- /dev/null
+++ b/models/claude-opus-4-7-cc.json
@@ -0,0 +1,31 @@
+{
+  "label": "Claude Opus 4.7",
+  "vendor": "Anthropic",
+  "harness": "Claude Code",
+  "effort": "Max",
+  "artifactDir": "claude-opus-4-7/claude-code-max",
+  "order": 14.7,
+  "runs": {
+    "mythos-craft": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.7（Max 思考配额）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot by Claude Opus 4.7 (Max effort) inside Claude Code; unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
+    },
+    "pelican-cycling": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.7（Max 思考配额）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot by Claude Opus 4.7 (Max effort) inside Claude Code; unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
+    },
+    "skeleton-watch": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.7（Max 思考配额）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot by Claude Opus 4.7 (Max effort) inside Claude Code; unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
+    }
+  }
+}
diff --git a/models/claude-opus-4-8-cc.json b/models/claude-opus-4-8-cc.json
index 1f41c8b..a04c49f 100644
--- a/models/claude-opus-4-8-cc.json
+++ b/models/claude-opus-4-8-cc.json
@@ -39,6 +39,13 @@
         },
         "contributor": "OHMFOHS"
       }
-    ]
+    ],
+    "skeleton-watch": {
+      "note": {
+        "zh": "在 Claude Code 中以 Claude Opus 4.8（Max 思考配额）一次生成，本页为未经修改的原始产出。基于 Three.js 的交互式 3D 镂空机械表：可旋转、切换爆炸视图、零件标签高亮与机芯信息面板，含擒纵机构、摆轮等机芯结构。",
+        "en": "Generated in one shot by Claude Opus 4.8 (Max effort) inside Claude Code; unmodified original output. An interactive 3D skeleton mechanical watch on Three.js — orbit rotation, exploded view, highlighted part labels and a movement info panel, with escapement, balance wheel and other movement parts."
+      },
+      "contributor": "Nagi-ovo"
+    }
   }
 }
diff --git a/models/claude-sonnet-4-6-cc.json b/models/claude-sonnet-4-6-cc.json
index d52999e..7a70225 100644
--- a/models/claude-sonnet-4-6-cc.json
+++ b/models/claude-sonnet-4-6-cc.json
@@ -7,7 +7,6 @@
   "order": 18.9,
   "runs": {
     "pelican-cycling": {
-      "file": "pelican-beach.svg",
       "note": {
         "zh": "在 Claude Code 中以 Claude Sonnet 4.6（Max 思考配额）一次生成。",
         "en": "Generated in one shot by Claude Sonnet 4.6 (Max effort) inside Claude Code."
diff --git a/models/claude-sonnet-4-6-cursor.json b/models/claude-sonnet-4-6-cursor.json
index 72fdedb..30fec7f 100644
--- a/models/claude-sonnet-4-6-cursor.json
+++ b/models/claude-sonnet-4-6-cursor.json
@@ -8,7 +8,6 @@
   "runs": {
     "pelican-cycling": [
       {
-        "file": "pelican-beach.svg",
         "note": {
           "zh": "在 Cursor CLI 中以 Claude Sonnet 4.6（High 思考配额）一次生成。原始 SVG 的注释中混入非法 XML/编码字节，导致浏览器只渲染到一半并显示解析错误；Codex 仅将这些注释里的坏字符替换为 ASCII 连字符以修复加载错误，未改动任何图形元素。",
           "en": "Generated in one shot by Claude Sonnet 4.6 (High effort) inside Cursor CLI. The original SVG contained invalid XML/encoding bytes inside comments, causing browsers to stop rendering partway through with a parse error; Codex only replaced those bad comment characters with ASCII hyphens to fix loading, without changing any graphical elements."
@@ -16,7 +15,7 @@
         "contributor": "Nagi-ovo"
       },
       {
-        "file": "pelican-beach-2.svg",
+        "file": "pelican-cycling-2.svg",
         "note": {
           "zh": "第二版：在 Cursor CLI 中以 Claude Sonnet 4.6（High 思考配额）一次生成，作为独立 SVG 变体登记，保留原版产物不变。",
           "en": "Second version: generated in one shot by Claude Sonnet 4.6 (High effort) inside Cursor CLI and registered as a separate SVG variant, preserving the original artifact."
diff --git a/models/glm-5-2.json b/models/glm-5-2.json
index e8fad09..cceb09e 100644
--- a/models/glm-5-2.json
+++ b/models/glm-5-2.json
@@ -7,7 +7,6 @@
   "order": 121,
   "runs": {
     "mythos-craft": {
-      "file": "mythos-craft.html",
       "note": {
         "zh": "在 ZCode 中以 GLM-5.2（Max 思考配额）一次生成。原始 HTML 因热栏引用了未定义的 GLASS 常量而无法进入；Codex 仅将该引用修正为已有的 CRYSTAL 方块，未改动玩法或视觉设计。",
         "en": "Generated in one shot by GLM-5.2 (Max effort) inside ZCode. The original HTML could not enter the game because the hotbar referenced an undefined GLASS constant; Codex only corrected that reference to the existing CRYSTAL block, without changing gameplay or visual design."
@@ -16,7 +15,6 @@
     },
     "pelican-cycling": [
       {
-        "file": "pelican-bike.svg",
         "note": {
           "zh": "在 ZCode 中以 GLM-5.2（Max 思考配额）一次生成；本页为未经修改的原始 SVG 产出。",
           "en": "Generated in one shot by GLM-5.2 (Max effort) inside ZCode; unmodified original SVG output."
@@ -24,7 +22,7 @@
         "contributor": "Nagi-ovo"
       },
       {
-        "file": "pelican-bike-2.svg",
+        "file": "pelican-cycling-2.svg",
         "note": {
           "zh": "在 ZCode 中以 GLM-5.2（Max 思考配额）一次生成的第二个 SVG 版本；本页为未经修改的原始 SVG 产出。",
           "en": "Second SVG variant generated in one shot by GLM-5.2 (Max effort) inside ZCode; unmodified original SVG output."
diff --git a/models/glm-5-turbo.json b/models/glm-5-turbo.json
index 47c988c..bc67582 100644
--- a/models/glm-5-turbo.json
+++ b/models/glm-5-turbo.json
@@ -8,7 +8,6 @@
   "runs": {
     "mythos-craft": [
       {
-        "file": "mythos-craft.html",
         "note": {
           "zh": "在 ZCode 中以 GLM-5 Turbo（Thinking 思考配额）一次生成。原始 HTML 因脚本括号错误、缺少 Game 初始化和缺少收尾标签而无法进入；Codex 仅修复这些启动接线问题，未改动玩法或视觉设计。",
           "en": "Generated in one shot by GLM-5 Turbo (Thinking effort) inside ZCode. The original HTML could not enter the game because of script-brace errors, missing Game initialization, and missing closing tags; Codex only fixed those startup wiring issues, without changing gameplay or visual design."
@@ -25,7 +24,6 @@
       }
     ],
     "pelican-cycling": {
-      "file": "pelican-bike.svg",
       "note": {
         "zh": "在 ZCode 中以 GLM-5 Turbo（Thinking 思考配额）一次生成；本页为未经修改的原始 SVG 产出。",
         "en": "Generated in one shot by GLM-5 Turbo (Thinking effort) inside ZCode; unmodified original SVG output."
diff --git a/models/gpt-5-2-cursor.json b/models/gpt-5-2-cursor.json
index 099f075..12a1134 100644
--- a/models/gpt-5-2-cursor.json
+++ b/models/gpt-5-2-cursor.json
@@ -7,7 +7,6 @@
   "order": 33,
   "runs": {
     "mythos-craft": {
-      "file": "mythiccraft.html",
       "note": {
         "zh": "在 Cursor CLI 中以 GPT-5.2（xhigh 思考配额）一次生成；本页为未经修改的原始产出。",
         "en": "Generated in one shot by GPT-5.2 (xhigh effort) inside Cursor CLI; unmodified original output."
diff --git a/models/gpt-5-3-codex-cursor.json b/models/gpt-5-3-codex-cursor.json
index 515f17e..86d0a83 100644
--- a/models/gpt-5-3-codex-cursor.json
+++ b/models/gpt-5-3-codex-cursor.json
@@ -7,7 +7,6 @@
   "order": 32,
   "runs": {
     "mythos-craft": {
-      "file": "mythic-craft.html",
       "note": {
         "zh": "在 Cursor CLI 中以 GPT-5.3 Codex（xhigh 思考配额）一次生成；本页为未经修改的原始产出。",
         "en": "Generated in one shot by GPT-5.3 Codex (xhigh effort) inside Cursor CLI; unmodified original output."
diff --git a/models/gpt-5-4-cursor.json b/models/gpt-5-4-cursor.json
index 348f9c3..7191ecd 100644
--- a/models/gpt-5-4-cursor.json
+++ b/models/gpt-5-4-cursor.json
@@ -7,7 +7,6 @@
   "order": 31,
   "runs": {
     "mythos-craft": {
-      "file": "index.html",
       "note": {
         "zh": "在 Cursor CLI 中以 GPT-5.4（xhigh 思考配额）一次生成；本页为未经修改的原始产出。",
         "en": "Generated in one shot by GPT-5.4 (xhigh effort) inside Cursor CLI; unmodified original output."
diff --git a/models/gpt-5-5-pro.json b/models/gpt-5-5-pro.json
index bcb701c..3913bff 100644
--- a/models/gpt-5-5-pro.json
+++ b/models/gpt-5-5-pro.json
@@ -19,6 +19,13 @@
         "en": "Generated in one shot in the ChatGPT web app on GPT-5.5 Pro (Extended Pro enabled)."
       },
       "contributor": "Nagi-ovo"
+    },
+    "skeleton-watch": {
+      "note": {
+        "zh": "在 ChatGPT 网页版以 GPT-5.5 Pro（开启 Extended Pro）一次生成；本页为未经修改的原始产出。",
+        "en": "Generated in one shot in the ChatGPT web app on GPT-5.5 Pro (Extended Pro enabled); unmodified original output."
+      },
+      "contributor": "Nagi-ovo"
     }
   }
 }
diff --git a/models/grok-4-3-cursor.json b/models/grok-4-3-cursor.json
index ae7da76..d3ea204 100644
--- a/models/grok-4-3-cursor.json
+++ b/models/grok-4-3-cursor.json
@@ -14,7 +14,6 @@
       "contributor": "Nagi-ovo"
     },
     "pelican-cycling": {
-      "file": "pelican-bike.svg",
       "note": {
         "zh": "在 Cursor CLI 中以 Grok 4.3 默认设置一次生成；本页为未经修改的原始产出。",
         "en": "Generated in one shot by Grok 4.3 inside Cursor CLI with default settings; unmodified original output."
diff --git a/outputs/claude-haiku-4-5/claude-code-default/minecraft-clone.html b/outputs/claude-haiku-4-5/claude-code-default/mythos-craft.html
similarity index 100%
rename from outputs/claude-haiku-4-5/claude-code-default/minecraft-clone.html
rename to outputs/claude-haiku-4-5/claude-code-default/mythos-craft.html
diff --git a/outputs/claude-haiku-4-5/claude-code-default/pelican-bike.svg b/outputs/claude-haiku-4-5/claude-code-default/pelican-cycling.svg
similarity index 100%
rename from outputs/claude-haiku-4-5/claude-code-default/pelican-bike.svg
rename to outputs/claude-haiku-4-5/claude-code-default/pelican-cycling.svg
diff --git a/outputs/claude-opus-4-6/claude-code-max/pelican-cycling.svg b/outputs/claude-opus-4-6/claude-code-max/pelican-cycling.svg
new file mode 100644
index 0000000..d0a554b
--- /dev/null
+++ b/outputs/claude-opus-4-6/claude-code-max/pelican-cycling.svg
@@ -0,0 +1,379 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 600">
+  <defs>
+    <linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#1565a8"/>
+      <stop offset="35%" stop-color="#4aa3df"/>
+      <stop offset="60%" stop-color="#87ceeb"/>
+      <stop offset="78%" stop-color="#fcd281"/>
+      <stop offset="90%" stop-color="#f4a460"/>
+      <stop offset="100%" stop-color="#e8734a"/>
+    </linearGradient>
+    <linearGradient id="oceanGrad" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#1a7baa"/>
+      <stop offset="50%" stop-color="#2694c4"/>
+      <stop offset="100%" stop-color="#5ab8d8"/>
+    </linearGradient>
+    <linearGradient id="sandGrad" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#d4a555"/>
+      <stop offset="30%" stop-color="#e8c07a"/>
+      <stop offset="100%" stop-color="#f0d090"/>
+    </linearGradient>
+    <linearGradient id="wetSand" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#b08840"/>
+      <stop offset="100%" stop-color="#c49a55"/>
+    </linearGradient>
+    <radialGradient id="sunGlow" cx="0.5" cy="0.5" r="0.5">
+      <stop offset="0%" stop-color="#fff8dc"/>
+      <stop offset="40%" stop-color="#ffd700" stop-opacity="0.8"/>
+      <stop offset="70%" stop-color="#ffa500" stop-opacity="0.3"/>
+      <stop offset="100%" stop-color="#ff8c00" stop-opacity="0"/>
+    </radialGradient>
+    <linearGradient id="pelBody" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#f5f0e8"/>
+      <stop offset="50%" stop-color="#ede5d5"/>
+      <stop offset="100%" stop-color="#ddd5c5"/>
+    </linearGradient>
+    <linearGradient id="billGrad" x1="0" y1="0" x2="1" y2="0.3">
+      <stop offset="0%" stop-color="#d4a030"/>
+      <stop offset="50%" stop-color="#e8b840"/>
+      <stop offset="100%" stop-color="#cc9020"/>
+    </linearGradient>
+    <linearGradient id="pouchGrad" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#e8a060"/>
+      <stop offset="100%" stop-color="#d08050"/>
+    </linearGradient>
+    <linearGradient id="frameGrad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#2ba5a5"/>
+      <stop offset="100%" stop-color="#1d7a7a"/>
+    </linearGradient>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
+      <feOffset dx="2" dy="3"/>
+      <feComponentTransfer><feFuncA type="linear" slope="0.3"/></feComponentTransfer>
+      <feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+
+  <!-- Sky -->
+  <rect width="900" height="600" fill="url(#skyGrad)"/>
+
+  <!-- Sun -->
+  <circle cx="730" cy="310" r="100" fill="url(#sunGlow)"/>
+  <circle cx="730" cy="310" r="40" fill="#fff5d0" opacity="0.95"/>
+  <circle cx="730" cy="310" r="35" fill="#fffce8"/>
+
+  <!-- Clouds -->
+  <g opacity="0.7">
+    <ellipse cx="180" cy="120" rx="70" ry="25" fill="white" opacity="0.6"/>
+    <ellipse cx="210" cy="110" rx="50" ry="20" fill="white" opacity="0.5"/>
+    <ellipse cx="150" cy="115" rx="40" ry="18" fill="white" opacity="0.4"/>
+    <ellipse cx="550" cy="80" rx="80" ry="22" fill="white" opacity="0.5"/>
+    <ellipse cx="580" cy="70" rx="55" ry="18" fill="white" opacity="0.4"/>
+    <ellipse cx="520" cy="75" rx="45" ry="16" fill="white" opacity="0.35"/>
+    <ellipse cx="650" cy="200" rx="60" ry="18" fill="#ffe8c0" opacity="0.5"/>
+    <ellipse cx="680" cy="192" rx="45" ry="15" fill="#ffe0b0" opacity="0.4"/>
+  </g>
+
+  <!-- Ocean -->
+  <path d="M0,320 Q150,310 300,325 Q450,340 600,320 Q750,300 900,315 L900,470 L0,470 Z" fill="url(#oceanGrad)" opacity="0.9"/>
+  <path d="M0,345 Q100,340 200,350 Q300,360 400,348 Q500,336 600,345 Q700,354 800,342 Q850,336 900,340" stroke="#7dd4ef" stroke-width="1.5" fill="none" opacity="0.6"/>
+  <path d="M0,370 Q120,365 240,375 Q360,385 480,370 Q600,355 720,368 Q810,376 900,370" stroke="#8de0f5" stroke-width="1" fill="none" opacity="0.5"/>
+  <path d="M0,395 Q100,390 200,398 Q350,408 450,395 Q550,382 700,393 Q800,400 900,395" stroke="#a0e8f8" stroke-width="1" fill="none" opacity="0.4"/>
+
+  <!-- Sun reflection on water -->
+  <g opacity="0.35">
+    <ellipse cx="730" cy="360" rx="20" ry="8" fill="#ffd700"/>
+    <ellipse cx="728" cy="380" rx="15" ry="5" fill="#ffc800"/>
+    <ellipse cx="732" cy="400" rx="12" ry="4" fill="#ffb800"/>
+    <ellipse cx="730" cy="420" rx="8" ry="3" fill="#ffa500"/>
+    <ellipse cx="729" cy="440" rx="5" ry="2" fill="#ff9000"/>
+  </g>
+
+  <!-- Wave foam at shore -->
+  <path d="M0,455 Q80,448 160,458 Q240,468 320,455 Q400,442 480,455 Q560,468 640,455 Q720,442 800,452 Q850,457 900,450" stroke="white" stroke-width="3" fill="none" opacity="0.7" stroke-linecap="round"/>
+  <path d="M0,460 Q100,453 200,462 Q300,471 400,458 Q500,445 600,458 Q700,471 800,458 Q850,452 900,456" stroke="white" stroke-width="2" fill="none" opacity="0.4"/>
+
+  <!-- Wet sand strip -->
+  <path d="M0,455 Q80,448 160,458 Q240,468 320,455 Q400,442 480,455 Q560,468 640,455 Q720,442 800,452 Q850,457 900,450 L900,480 L0,480 Z" fill="url(#wetSand)" opacity="0.7"/>
+
+  <!-- Dry sand -->
+  <rect x="0" y="470" width="900" height="130" fill="url(#sandGrad)"/>
+
+  <!-- Sand texture -->
+  <g fill="#c4a050" opacity="0.15">
+    <circle cx="50" cy="490" r="1"/><circle cx="120" cy="510" r="1.2"/><circle cx="200" cy="495" r="0.8"/>
+    <circle cx="280" cy="520" r="1"/><circle cx="350" cy="505" r="1.5"/><circle cx="420" cy="530" r="0.9"/>
+    <circle cx="500" cy="498" r="1.1"/><circle cx="580" cy="525" r="1.3"/><circle cx="650" cy="510" r="0.8"/>
+    <circle cx="720" cy="535" r="1"/><circle cx="790" cy="500" r="1.2"/><circle cx="850" cy="515" r="0.9"/>
+    <circle cx="100" cy="540" r="1"/><circle cx="180" cy="555" r="1.2"/><circle cx="300" cy="550" r="0.8"/>
+    <circle cx="450" cy="560" r="1.1"/><circle cx="600" cy="545" r="1"/><circle cx="750" cy="560" r="1.3"/>
+  </g>
+
+  <!-- Palm tree -->
+  <g>
+    <path d="M85,600 Q80,520 90,450 Q95,400 88,350 Q83,310 90,280" stroke="#8B6914" stroke-width="12" fill="none" stroke-linecap="round"/>
+    <path d="M85,600 Q80,520 90,450 Q95,400 88,350 Q83,310 90,280" stroke="#9B7924" stroke-width="8" fill="none" stroke-linecap="round"/>
+    <g stroke="#705510" stroke-width="1" fill="none" opacity="0.5">
+      <path d="M80,580 Q88,575 96,580"/><path d="M79,550 Q87,545 95,550"/>
+      <path d="M80,520 Q88,515 96,520"/><path d="M81,490 Q88,485 95,490"/>
+      <path d="M82,460 Q89,455 96,460"/><path d="M83,430 Q90,425 97,430"/>
+      <path d="M84,400 Q90,395 96,400"/><path d="M84,370 Q89,365 94,370"/>
+      <path d="M83,340 Q88,335 93,340"/><path d="M84,310 Q89,305 94,310"/>
+    </g>
+    <!-- Fronds -->
+    <g>
+      <path d="M90,280 Q140,250 190,270 Q220,280 240,300" stroke="#2d7a2d" stroke-width="3" fill="none"/>
+      <path d="M90,280 Q130,260 170,270" fill="#3a8a3a" opacity="0.8"/>
+      <path d="M130,265 Q160,255 190,270" fill="#2d7a2d" opacity="0.6"/>
+      <path d="M110,270 Q120,255 130,265" fill="#4a9a4a" opacity="0.7"/>
+      <path d="M140,265 Q155,250 165,268" fill="#3d8d3d" opacity="0.7"/>
+      <path d="M170,270 Q185,258 195,275" fill="#2d7a2d" opacity="0.6"/>
+
+      <path d="M90,280 Q50,250 20,275 Q5,285 -10,310" stroke="#2d7a2d" stroke-width="3" fill="none"/>
+      <path d="M90,280 Q55,260 30,275" fill="#3a8a3a" opacity="0.8"/>
+      <path d="M55,268 Q30,258 15,280" fill="#2d7a2d" opacity="0.6"/>
+      <path d="M75,272 Q60,258 50,270" fill="#4a9a4a" opacity="0.7"/>
+      <path d="M40,275 Q25,262 18,282" fill="#3d8d3d" opacity="0.7"/>
+
+      <path d="M90,280 Q130,230 180,220 Q200,215 210,220" stroke="#358535" stroke-width="2.5" fill="none"/>
+      <path d="M90,280 Q120,240 160,228" fill="#3a8a3a" opacity="0.7"/>
+      <path d="M120,248 Q150,232 175,225" fill="#2d7a2d" opacity="0.5"/>
+      <path d="M110,255 Q125,238 135,248" fill="#4a9a4a" opacity="0.6"/>
+      <path d="M145,238 Q160,222 170,232" fill="#358535" opacity="0.6"/>
+
+      <path d="M90,280 Q60,230 30,225 Q10,222 -5,228" stroke="#358535" stroke-width="2.5" fill="none"/>
+      <path d="M90,280 Q65,240 40,230" fill="#3a8a3a" opacity="0.7"/>
+      <path d="M65,245 Q42,232 25,232" fill="#2d7a2d" opacity="0.5"/>
+      <path d="M75,252 Q60,238 50,245" fill="#4a9a4a" opacity="0.6"/>
+
+      <path d="M90,280 Q120,250 155,245 Q170,243 180,248" stroke="#408040" stroke-width="2" fill="none"/>
+      <path d="M90,280 Q110,258 140,250" fill="#4a9a4a" opacity="0.6"/>
+
+      <path d="M90,280 Q95,240 105,210 Q110,195 115,190" stroke="#2a752a" stroke-width="2" fill="none"/>
+      <path d="M90,280 Q93,250 100,225" fill="#3a8a3a" opacity="0.5"/>
+    </g>
+    <circle cx="88" cy="285" r="5" fill="#6b4226"/>
+    <circle cx="95" cy="282" r="4.5" fill="#7a5030"/>
+    <circle cx="82" cy="282" r="4" fill="#5a3620"/>
+  </g>
+
+  <!-- Ground shadow -->
+  <ellipse cx="430" cy="530" rx="140" ry="12" fill="#a08030" opacity="0.2"/>
+
+  <!-- ===== BICYCLE ===== -->
+  <g filter="url(#shadow)">
+    <!-- Rear wheel -->
+    <g>
+      <circle cx="310" cy="510" r="48" fill="none" stroke="#2a2a2a" stroke-width="6"/>
+      <circle cx="310" cy="510" r="45" fill="none" stroke="#3a3a3a" stroke-width="2"/>
+      <circle cx="310" cy="510" r="48" fill="none" stroke="#1a1a1a" stroke-width="1" stroke-dasharray="4 3"/>
+      <circle cx="310" cy="510" r="6" fill="#888" stroke="#666" stroke-width="1.5"/>
+      <line x1="310" y1="466" x2="310" y2="554" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="266" y1="510" x2="354" y2="510" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="276" y1="476" x2="344" y2="544" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="344" y1="476" x2="276" y2="544" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="268" y1="495" x2="352" y2="525" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="268" y1="525" x2="352" y2="495" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="295" y1="466" x2="325" y2="554" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="325" y1="466" x2="295" y2="554" stroke="#aaa" stroke-width="0.6"/>
+    </g>
+    <!-- Front wheel -->
+    <g>
+      <circle cx="545" cy="510" r="48" fill="none" stroke="#2a2a2a" stroke-width="6"/>
+      <circle cx="545" cy="510" r="45" fill="none" stroke="#3a3a3a" stroke-width="2"/>
+      <circle cx="545" cy="510" r="48" fill="none" stroke="#1a1a1a" stroke-width="1" stroke-dasharray="4 3"/>
+      <circle cx="545" cy="510" r="6" fill="#888" stroke="#666" stroke-width="1.5"/>
+      <line x1="545" y1="466" x2="545" y2="554" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="501" y1="510" x2="589" y2="510" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="511" y1="476" x2="579" y2="544" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="579" y1="476" x2="511" y2="544" stroke="#aaa" stroke-width="0.8"/>
+      <line x1="503" y1="495" x2="587" y2="525" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="503" y1="525" x2="587" y2="495" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="530" y1="466" x2="560" y2="554" stroke="#aaa" stroke-width="0.6"/>
+      <line x1="560" y1="466" x2="530" y2="554" stroke="#aaa" stroke-width="0.6"/>
+    </g>
+
+    <!-- Frame -->
+    <g stroke="url(#frameGrad)" stroke-width="5" fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <line x1="365" y1="440" x2="390" y2="505"/>
+      <line x1="520" y1="460" x2="390" y2="505"/>
+      <path d="M365,440 Q440,425 520,460"/>
+      <line x1="390" y1="505" x2="310" y2="510"/>
+      <line x1="365" y1="440" x2="310" y2="510"/>
+    </g>
+
+    <!-- Front fork -->
+    <path d="M520,460 Q530,485 545,510" stroke="#1d7a7a" stroke-width="4" fill="none" stroke-linecap="round"/>
+    <line x1="520" y1="455" x2="523" y2="468" stroke="url(#frameGrad)" stroke-width="6" stroke-linecap="round"/>
+
+    <!-- Handlebars -->
+    <g stroke="#888" stroke-width="3" fill="none" stroke-linecap="round">
+      <path d="M515,445 L520,455"/>
+      <path d="M500,435 Q510,438 515,445 Q520,452 530,448" stroke-width="3.5"/>
+      <line x1="497" y1="434" x2="503" y2="436" stroke="#333" stroke-width="5" stroke-linecap="round"/>
+      <line x1="528" y1="447" x2="534" y2="450" stroke="#333" stroke-width="5" stroke-linecap="round"/>
+    </g>
+
+    <!-- Seat -->
+    <ellipse cx="360" cy="437" rx="20" ry="8" fill="#4a3020" transform="rotate(-5, 360, 437)"/>
+    <ellipse cx="360" cy="436" rx="18" ry="6" fill="#5a3a28" transform="rotate(-5, 360, 436)"/>
+    <line x1="363" y1="443" x2="365" y2="440" stroke="#888" stroke-width="3"/>
+
+    <!-- Crank and pedals -->
+    <circle cx="390" cy="505" r="8" fill="#666" stroke="#555" stroke-width="1.5"/>
+    <line x1="390" y1="505" x2="375" y2="520" stroke="#666" stroke-width="3" stroke-linecap="round"/>
+    <line x1="390" y1="505" x2="405" y2="490" stroke="#666" stroke-width="3" stroke-linecap="round"/>
+    <rect x="368" y="518" width="14" height="5" rx="2" fill="#444" transform="rotate(10, 375, 520)"/>
+    <rect x="398" y="487" width="14" height="5" rx="2" fill="#444" transform="rotate(10, 405, 490)"/>
+
+    <!-- Chain -->
+    <path d="M398,505 Q430,520 540,510" stroke="#555" stroke-width="1.5" fill="none" stroke-dasharray="2 1.5" opacity="0.6"/>
+
+    <!-- Fenders -->
+    <path d="M285,470 Q275,490 280,510 Q290,535 315,545 Q340,550 355,535" stroke="#2ba5a5" stroke-width="2.5" fill="none" opacity="0.7"/>
+    <path d="M520,475 Q515,490 520,510 Q530,535 550,545 Q570,548 580,530" stroke="#2ba5a5" stroke-width="2.5" fill="none" opacity="0.7"/>
+
+    <!-- Wire basket on front -->
+    <g stroke="#999" stroke-width="1.2" fill="none" opacity="0.7">
+      <path d="M540,440 L560,440 L565,470 L535,470 Z"/>
+      <line x1="545" y1="440" x2="543" y2="470"/>
+      <line x1="550" y1="440" x2="548" y2="470"/>
+      <line x1="555" y1="440" x2="553" y2="470"/>
+      <line x1="537" y1="450" x2="563" y2="450"/>
+      <line x1="536" y1="460" x2="564" y2="460"/>
+    </g>
+
+    <!-- Fish in basket -->
+    <g transform="translate(550, 436)">
+      <path d="M-8,0 Q-5,-4 0,-3 Q5,-2 8,0 Q5,2 0,3 Q-5,4 -8,0 Z" fill="#8ab4c8" stroke="#6090a0" stroke-width="0.5"/>
+      <path d="M8,0 L13,-4 L13,4 Z" fill="#7aa4b8"/>
+      <circle cx="-4" cy="-1" r="1" fill="#2a3040"/>
+    </g>
+  </g>
+
+  <!-- Sand spray from rear wheel (motion) -->
+  <g opacity="0.3">
+    <circle cx="272" cy="528" r="2" fill="#d4a555"/>
+    <circle cx="262" cy="522" r="1.5" fill="#d4a555"/>
+    <circle cx="257" cy="532" r="1.8" fill="#d4a555"/>
+    <circle cx="267" cy="518" r="1" fill="#d4a555"/>
+    <circle cx="252" cy="526" r="1.2" fill="#d4a555"/>
+    <circle cx="247" cy="523" r="0.8" fill="#d4a555"/>
+    <circle cx="240" cy="528" r="0.6" fill="#d4a555"/>
+  </g>
+
+  <!-- ===== PELICAN ===== -->
+  <g>
+    <!-- Tail feathers -->
+    <path d="M280,420 Q270,415 265,425 Q260,435 270,430" fill="#c0b8a0" stroke="#a0986a" stroke-width="0.5"/>
+    <path d="M285,418 Q272,410 268,420 Q264,430 275,428" fill="#d0c8b0" stroke="#a0986a" stroke-width="0.5"/>
+    <path d="M290,416 Q278,408 275,418 Q272,428 283,425" fill="#bab2a0" stroke="#a0986a" stroke-width="0.5"/>
+
+    <!-- Main body -->
+    <path d="M290,380 Q280,360 310,340 Q340,325 380,330 Q420,335 430,360 Q435,380 425,400 Q415,420 390,430 Q360,438 330,435 Q300,428 285,410 Z" fill="url(#pelBody)" stroke="#ccc5b5" stroke-width="1"/>
+    <path d="M310,350 Q340,338 375,340 Q410,345 420,365 Q425,380 418,398" fill="none" stroke="white" stroke-width="1.5" opacity="0.3"/>
+    <ellipse cx="365" cy="400" rx="30" ry="20" fill="white" opacity="0.15"/>
+
+    <!-- Far wing -->
+    <path d="M300,365 Q285,370 275,380 Q265,395 275,405 Q285,415 300,410" fill="#e8e0d0" stroke="#c5bda8" stroke-width="0.8"/>
+    <path d="M275,380 Q265,395 275,405 Q280,410 288,408 Q280,400 278,390 Z" fill="#4a4540" opacity="0.6"/>
+
+    <!-- Near wing extended toward handlebar -->
+    <path d="M380,345 Q410,350 440,365 Q465,380 480,395 Q490,405 485,415 Q478,425 460,420 Q440,415 420,408 Q395,400 380,390 Z" fill="#e5ddd0" stroke="#c5bda8" stroke-width="0.8"/>
+    <path d="M480,395 Q490,405 488,415 Q485,420 475,418 Q460,415 450,410 Q465,408 478,400 Z" fill="#4a4540" opacity="0.8"/>
+    <path d="M470,408 Q458,412 445,408" stroke="#3a3530" stroke-width="1.5" fill="none" opacity="0.5"/>
+    <path d="M395,360 Q420,370 445,385" stroke="#ccc5b5" stroke-width="0.6" fill="none" opacity="0.5"/>
+    <path d="M390,370 Q415,380 440,395" stroke="#ccc5b5" stroke-width="0.6" fill="none" opacity="0.5"/>
+    <path d="M385,380 Q410,390 435,405" stroke="#ccc5b5" stroke-width="0.6" fill="none" opacity="0.5"/>
+
+    <!-- Wing tip on handlebar -->
+    <path d="M485,415 Q495,420 500,430 Q503,438 500,440" fill="#e0d8c8" stroke="#c0b8a0" stroke-width="0.8"/>
+
+    <!-- Neck -->
+    <path d="M395,340 Q405,320 420,300 Q435,280 445,270 Q455,262 460,260" fill="none" stroke="#e8e0d0" stroke-width="18" stroke-linecap="round"/>
+    <path d="M395,340 Q405,320 420,300 Q435,280 445,270 Q455,262 460,260" fill="none" stroke="#f0e8d8" stroke-width="14" stroke-linecap="round"/>
+    <path d="M400,330 Q410,310 425,290 Q438,275 448,268" fill="none" stroke="white" stroke-width="4" opacity="0.15" stroke-linecap="round"/>
+
+    <!-- Head -->
+    <ellipse cx="465" cy="258" rx="22" ry="18" fill="#f0e8d8" transform="rotate(-15, 465, 258)"/>
+    <path d="M448,248 Q460,238 478,245 Q485,250 480,255" fill="#e8dcc8" opacity="0.5"/>
+
+    <!-- Crest feathers (wind-blown) -->
+    <path d="M448,245 Q442,232 438,225" stroke="#ddd0b8" stroke-width="2" fill="none" stroke-linecap="round"/>
+    <path d="M453,242 Q448,228 445,222" stroke="#ddd0b8" stroke-width="1.5" fill="none" stroke-linecap="round"/>
+    <path d="M458,240 Q454,230 452,224" stroke="#e0d5c0" stroke-width="1" fill="none" stroke-linecap="round"/>
+
+    <!-- Eye -->
+    <circle cx="470" cy="253" r="5.5" fill="none" stroke="#c0a050" stroke-width="1"/>
+    <circle cx="470" cy="253" r="4.5" fill="white"/>
+    <circle cx="471" cy="253" r="3" fill="#2a2520"/>
+    <circle cx="472" cy="251.5" r="1" fill="white" opacity="0.8"/>
+
+    <!-- Upper mandible -->
+    <path d="M483,255 Q510,248 540,252 Q560,256 570,260 Q575,262 575,265 Q573,268 565,268 Q540,265 510,262 Q490,262 483,262 Z" fill="url(#billGrad)" stroke="#b89028" stroke-width="0.8"/>
+    <path d="M483,258 Q520,253 555,260 Q568,263 573,265" stroke="#c9a035" stroke-width="1" fill="none" opacity="0.6"/>
+    <ellipse cx="500" cy="256" rx="3" ry="1.5" fill="#a08020" opacity="0.5"/>
+    <path d="M573,263 Q576,265 575,268 Q573,270 571,268" fill="#cc9020" stroke="#a07818" stroke-width="0.5"/>
+
+    <!-- Lower mandible -->
+    <path d="M483,262 Q510,266 540,268 Q560,270 570,268" stroke="#c0a030" stroke-width="2" fill="none"/>
+
+    <!-- Gular pouch -->
+    <path d="M483,262 Q490,275 510,282 Q530,286 545,280 Q560,272 570,268 Q555,275 535,280 Q515,282 500,278 Q488,272 483,262 Z" fill="url(#pouchGrad)" opacity="0.75" stroke="#c08040" stroke-width="0.5"/>
+    <path d="M495,270 Q510,278 530,278 Q548,275 558,270" stroke="#c08848" stroke-width="0.5" fill="none" opacity="0.4"/>
+    <path d="M498,274 Q515,280 535,279 Q550,276 560,272" stroke="#c08848" stroke-width="0.4" fill="none" opacity="0.3"/>
+
+    <!-- Right leg to front pedal -->
+    <path d="M390,425 Q400,450 405,470 Q408,485 405,490" stroke="#3a3530" stroke-width="3.5" fill="none" stroke-linecap="round"/>
+    <g transform="translate(405, 490) rotate(10)">
+      <path d="M-8,0 L-12,8 L0,12 L12,8 L8,0" fill="#e8a040" stroke="#c08030" stroke-width="0.8"/>
+      <line x1="-2" y1="1" x2="-8" y2="10" stroke="#c08030" stroke-width="0.5"/>
+      <line x1="0" y1="1" x2="0" y2="12" stroke="#c08030" stroke-width="0.5"/>
+      <line x1="2" y1="1" x2="8" y2="10" stroke="#c08030" stroke-width="0.5"/>
+    </g>
+
+    <!-- Left leg to rear pedal -->
+    <path d="M360,430 Q365,455 370,475 Q373,492 375,500 Q377,515 375,520" stroke="#2a2520" stroke-width="3" fill="none" stroke-linecap="round" opacity="0.7"/>
+    <g transform="translate(375, 520) rotate(-5)" opacity="0.7">
+      <path d="M-7,0 L-10,7 L0,10 L10,7 L7,0" fill="#d89535" stroke="#b07828" stroke-width="0.8"/>
+      <line x1="-2" y1="1" x2="-7" y2="8" stroke="#b07828" stroke-width="0.5"/>
+      <line x1="0" y1="1" x2="0" y2="10" stroke="#b07828" stroke-width="0.5"/>
+      <line x1="2" y1="1" x2="7" y2="8" stroke="#b07828" stroke-width="0.5"/>
+    </g>
+  </g>
+
+  <!-- Distant seagulls -->
+  <g stroke="#556" stroke-width="1.2" fill="none" opacity="0.4">
+    <path d="M620,140 Q625,135 630,138 Q635,135 640,140"/>
+    <path d="M670,170 Q674,166 678,168 Q682,166 686,170"/>
+    <path d="M590,180 Q595,175 600,178 Q605,175 610,180"/>
+  </g>
+
+  <!-- Water sparkles -->
+  <g fill="white" opacity="0.5">
+    <circle cx="300" cy="350" r="1"/><circle cx="450" cy="360" r="0.8"/>
+    <circle cx="600" cy="345" r="1.2"/><circle cx="200" cy="370" r="0.7"/>
+    <circle cx="500" cy="355" r="0.9"/><circle cx="700" cy="340" r="1"/>
+    <circle cx="800" cy="355" r="0.8"/>
+  </g>
+
+  <!-- Small wave details -->
+  <g stroke="#7cc8e0" stroke-width="0.8" fill="none" opacity="0.3">
+    <path d="M100,380 Q115,377 130,382"/>
+    <path d="M250,365 Q265,362 280,367"/>
+    <path d="M400,385 Q415,382 430,387"/>
+    <path d="M600,370 Q615,367 630,372"/>
+    <path d="M150,410 Q165,407 180,412"/>
+    <path d="M500,395 Q515,392 530,397"/>
+  </g>
+
+  <!-- Shells on beach -->
+  <ellipse cx="200" cy="520" rx="3" ry="2" fill="#f0e0c0" opacity="0.3" transform="rotate(20, 200, 520)"/>
+  <ellipse cx="650" cy="535" rx="2.5" ry="1.8" fill="#e8d8b8" opacity="0.3" transform="rotate(-15, 650, 535)"/>
+
+  <!-- Tire tracks in sand -->
+  <g stroke="#c4a050" stroke-width="1.5" fill="none" opacity="0.15">
+    <path d="M200,530 Q230,528 260,530 Q280,532 310,530"/>
+    <path d="M200,525 Q230,523 260,525 Q280,527 310,525"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/outputs/claude-opus-4-6/claude-code-max/skeleton-watch.html b/outputs/claude-opus-4-6/claude-code-max/skeleton-watch.html
new file mode 100644
index 0000000..bf401b4
--- /dev/null
+++ b/outputs/claude-opus-4-6/claude-code-max/skeleton-watch.html
@@ -0,0 +1,1103 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Skeleton Mechanical Watch</title>
+<style>
+*{margin:0;padding:0;box-sizing:border-box}
+body{background:#08080a;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;color:#d0d0d0;-webkit-font-smoothing:antialiased}
+canvas{display:block;width:100vw;height:100vh}
+.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.65) 100%);z-index:1}
+.title{position:fixed;top:28px;left:32px;z-index:10;opacity:0;animation:fadeSlideIn .8s .3s forwards}
+.title h1{font-size:17px;font-weight:200;letter-spacing:5px;text-transform:uppercase;color:#c4a97d}
+.title p{font-size:10px;letter-spacing:3px;color:#555;margin-top:3px;text-transform:uppercase}
+.controls{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:10;opacity:0;animation:fadeSlideUp .6s .6s forwards}
+.controls button{padding:9px 18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#999;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:all .25s;border-radius:3px;font-family:inherit;outline:none}
+.controls button:hover{background:rgba(255,255,255,.12);color:#ddd;border-color:rgba(255,255,255,.2)}
+.controls button.active{background:rgba(196,169,125,.18);border-color:rgba(196,169,125,.35);color:#c4a97d}
+#partLabel{position:fixed;padding:7px 13px;background:rgba(8,8,12,.92);border:1px solid rgba(196,169,125,.3);color:#c4a97d;font-size:11px;letter-spacing:.8px;pointer-events:none;opacity:0;transition:opacity .15s;border-radius:2px;white-space:nowrap;z-index:20;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
+#partLabel.visible{opacity:1}
+.info-panel{position:fixed;top:28px;right:28px;width:260px;background:rgba(8,8,12,.8);border:1px solid rgba(255,255,255,.07);padding:22px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:4px;z-index:10;opacity:0;transform:translateX(16px);transition:all .35s cubic-bezier(.4,0,.2,1);pointer-events:none}
+.info-panel.visible{opacity:1;transform:translateX(0);pointer-events:auto}
+.info-panel h2{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:#c4a97d;margin-bottom:14px;font-weight:300}
+.info-panel .row{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.04);font-size:11px}
+.info-panel .row span:first-child{color:#666}
+.info-panel .row span:last-child{color:#aaa;text-align:right}
+.part-detail{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);padding:10px 20px;background:rgba(8,8,12,.9);border:1px solid rgba(196,169,125,.25);border-radius:3px;font-size:12px;color:#c4a97d;letter-spacing:.5px;z-index:15;opacity:0;transition:opacity .3s;pointer-events:none;text-align:center;max-width:400px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
+.part-detail.visible{opacity:1}
+@keyframes fadeSlideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
+@keyframes fadeSlideUp{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
+</style>
+</head>
+<body>
+<canvas id="c"></canvas>
+<div class="vignette"></div>
+<div class="title"><h1>Calibre NB-01</h1><p>Squelette &middot; Manufacture</p></div>
+<div class="controls">
+<button id="btnExplode">Explode</button>
+<button id="btnInfo">Specs</button>
+<button id="btnAnim" class="active">Animate</button>
+<button id="btnLume">Lume</button>
+</div>
+<div id="partLabel"></div>
+<div class="info-panel" id="infoPanel">
+<h2>Movement</h2>
+<div class="row"><span>Calibre</span><span>NB-01 Squelette</span></div>
+<div class="row"><span>Type</span><span>Manual Winding</span></div>
+<div class="row"><span>Frequency</span><span>28,800 vph / 4 Hz</span></div>
+<div class="row"><span>Jewels</span><span>27 Rubies</span></div>
+<div class="row"><span>Power Reserve</span><span>72 h</span></div>
+<div class="row"><span>Diameter</span><span>30.4 mm</span></div>
+<div class="row"><span>Height</span><span>5.65 mm</span></div>
+<div class="row"><span>Components</span><span>268</span></div>
+<div class="row"><span>Decoration</span><span>C&ocirc;tes de Gen&egrave;ve</span></div>
+<div class="row"><span>Case</span><span>42 mm, 316L Steel</span></div>
+<div class="row"><span>Crystal</span><span>Sapphire, AR Coated</span></div>
+</div>
+<div class="part-detail" id="partDetail"></div>
+
+<script type="importmap">{"imports":{"three":"https://cdn.jsdelivr.net/npm/three@0.162.0/build/three.module.js","three/addons/":"https://cdn.jsdelivr.net/npm/three@0.162.0/examples/jsm/"}}</script>
+<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';
+
+const PI=Math.PI,TWO_PI=PI*2,sin=Math.sin,cos=Math.cos;
+const canvas=document.getElementById('c');
+const renderer=new THREE.WebGLRenderer({canvas,antialias:true});
+renderer.setSize(window.innerWidth,window.innerHeight);
+renderer.setPixelRatio(Math.min(window.devicePixelRatio,2));
+renderer.toneMapping=THREE.ACESFilmicToneMapping;
+renderer.toneMappingExposure=1.0;
+renderer.shadowMap.enabled=true;
+renderer.shadowMap.type=THREE.PCFSoftShadowMap;
+renderer.outputColorSpace=THREE.SRGBColorSpace;
+
+const scene=new THREE.Scene();
+scene.background=new THREE.Color(0x08080a);
+
+const camera=new THREE.PerspectiveCamera(32,window.innerWidth/window.innerHeight,0.1,500);
+camera.position.set(0,35,55);
+
+const controls=new OrbitControls(camera,canvas);
+controls.enableDamping=true;
+controls.dampingFactor=0.04;
+controls.minDistance=28;
+controls.maxDistance=90;
+controls.target.set(0,0,0);
+controls.autoRotate=true;
+controls.autoRotateSpeed=0.4;
+controls.maxPolarAngle=PI*0.75;
+controls.minPolarAngle=PI*0.1;
+
+const composer=new EffectComposer(renderer);
+composer.addPass(new RenderPass(scene,camera));
+const bloomPass=new UnrealBloomPass(new THREE.Vector2(window.innerWidth,window.innerHeight),0.25,0.35,0.88);
+composer.addPass(bloomPass);
+try{composer.addPass(new OutputPass())}catch(e){}
+
+/* ── Lighting ── */
+const keyLight=new THREE.DirectionalLight(0xfff3e0,2.8);
+keyLight.position.set(25,40,20);
+keyLight.castShadow=true;
+keyLight.shadow.mapSize.set(2048,2048);
+keyLight.shadow.camera.near=1;keyLight.shadow.camera.far=120;
+keyLight.shadow.camera.left=-30;keyLight.shadow.camera.right=30;
+keyLight.shadow.camera.top=30;keyLight.shadow.camera.bottom=-30;
+keyLight.shadow.bias=-0.0003;
+keyLight.shadow.radius=3;
+scene.add(keyLight);
+
+const fillLight=new THREE.DirectionalLight(0xc8d8f0,1.2);
+fillLight.position.set(-20,25,-10);
+scene.add(fillLight);
+
+const rimLight=new THREE.DirectionalLight(0xffffff,2.2);
+rimLight.position.set(-5,8,-35);
+scene.add(rimLight);
+
+const underLight=new THREE.PointLight(0xffe8c8,0.6,60);
+underLight.position.set(0,-15,10);
+scene.add(underLight);
+
+scene.add(new THREE.AmbientLight(0x404050,0.15));
+
+/* ── Procedural environment ── */
+{
+  const pmrem=new THREE.PMREMGenerator(renderer);
+  pmrem.compileEquirectangularShader();
+  const envScene=new THREE.Scene();
+  envScene.background=new THREE.Color(0x0c0c10);
+  const addPanel=(c,i,px,py,pz,sx,sy)=>{const m=new THREE.Mesh(new THREE.PlaneGeometry(sx,sy),new THREE.MeshBasicMaterial({color:c,side:THREE.DoubleSide}));m.material.color.multiplyScalar(i);m.position.set(px,py,pz);m.lookAt(0,0,0);envScene.add(m)};
+  addPanel(0xfff5e0,2.2,30,45,20,30,25);
+  addPanel(0xd0e0f8,1.2,-28,20,-10,20,18);
+  addPanel(0xffffff,1.8,0,8,-40,12,35);
+  addPanel(0xffe8d0,0.8,15,-10,30,25,15);
+  addPanel(0xe0e8ff,0.6,-10,50,0,40,10);
+  const envMap=pmrem.fromScene(envScene,0,0.1,100).texture;
+  scene.environment=envMap;
+  pmrem.dispose();
+}
+
+/* ── Textures ── */
+function makeStripeTex(w,h,stripeW,angle){
+  const cv=document.createElement('canvas');cv.width=w;cv.height=h;
+  const ctx=cv.getContext('2d');
+  ctx.fillStyle='#888';ctx.fillRect(0,0,w,h);
+  const s=stripeW||24;
+  for(let i=-w;i<w*2;i+=s){
+    const g=ctx.createLinearGradient(i,0,i+s,0);
+    g.addColorStop(0,'rgba(180,180,190,0)');
+    g.addColorStop(0.35,'rgba(210,210,220,0.35)');
+    g.addColorStop(0.5,'rgba(230,230,240,0.5)');
+    g.addColorStop(0.65,'rgba(210,210,220,0.35)');
+    g.addColorStop(1,'rgba(180,180,190,0)');
+    ctx.fillStyle=g;ctx.fillRect(i,0,s,h);
+  }
+  const t=new THREE.CanvasTexture(cv);
+  t.wrapS=t.wrapT=THREE.RepeatWrapping;
+  return t;
+}
+function makeRoughnessTex(w,h,stripeW){
+  const cv=document.createElement('canvas');cv.width=w;cv.height=h;
+  const ctx=cv.getContext('2d');
+  for(let x=0;x<w;x++){
+    const v=((sin(x/w*PI*16)+1)/2)*0.3+0.15;
+    const c=Math.floor(v*255);
+    ctx.fillStyle=`rgb(${c},${c},${c})`;
+    ctx.fillRect(x,0,1,h);
+  }
+  const t=new THREE.CanvasTexture(cv);t.wrapS=t.wrapT=THREE.RepeatWrapping;return t;
+}
+const genevaTex=makeStripeTex(512,512);
+const genevaRough=makeRoughnessTex(256,256);
+
+/* ── Materials ── */
+const mat={
+  steel:new THREE.MeshPhysicalMaterial({color:0xbcc2cc,metalness:1,roughness:0.06,envMapIntensity:1.6}),
+  steelDark:new THREE.MeshPhysicalMaterial({color:0x8a9098,metalness:1,roughness:0.1,envMapIntensity:1.3}),
+  steelBrushed:new THREE.MeshPhysicalMaterial({color:0xb0b5be,metalness:0.95,roughness:0.25,envMapIntensity:1.0}),
+  bridge:new THREE.MeshPhysicalMaterial({color:0xb0aca4,metalness:0.88,roughness:0.25,roughnessMap:genevaRough,envMapIntensity:0.8,clearcoat:0.2,clearcoatRoughness:0.2}),
+  roseGold:new THREE.MeshPhysicalMaterial({color:0xc4956a,metalness:1,roughness:0.12,envMapIntensity:1.5}),
+  blueSteel:new THREE.MeshPhysicalMaterial({color:0x1a3a6c,metalness:0.95,roughness:0.08,envMapIntensity:1.8}),
+  ruby:new THREE.MeshPhysicalMaterial({color:0xcc1133,metalness:0,roughness:0.03,transmission:0.55,thickness:0.4,ior:1.77,envMapIntensity:2}),
+  sapphire:new THREE.MeshPhysicalMaterial({color:0xffffff,metalness:0,roughness:0.03,transmission:0.98,thickness:0.3,ior:1.45,envMapIntensity:0.12}),
+  lume:new THREE.MeshPhysicalMaterial({color:0xc8ffdc,metalness:0.1,roughness:0.4,emissive:0x88ffaa,emissiveIntensity:0.15}),
+  handSteel:new THREE.MeshPhysicalMaterial({color:0xd0d5dc,metalness:1,roughness:0.04,envMapIntensity:2}),
+  plate:new THREE.MeshPhysicalMaterial({color:0x8a8680,metalness:0.85,roughness:0.32,envMapIntensity:0.6,clearcoat:0.1}),
+  gearWheel:new THREE.MeshPhysicalMaterial({color:0xc0c3c8,metalness:0.92,roughness:0.12,envMapIntensity:1.0}),
+  ground:new THREE.MeshStandardMaterial({color:0x040404,metalness:0.95,roughness:0.08}),
+};
+
+/* ── Geometry helpers ── */
+function circleShape(r,segs){const s=new THREE.Shape();s.absarc(0,0,r,0,TWO_PI,false);return s}
+function holeFromCircle(r,segs){const p=new THREE.Path();p.absarc(0,0,r,0,TWO_PI,true);return p}
+
+function gearShape(outerR,teeth,toothDepth){
+  const s=new THREE.Shape();
+  const step=TWO_PI/teeth;
+  const baseR=outerR-toothDepth;
+  for(let i=0;i<teeth;i++){
+    const a=i*step;
+    const fn=i===0?'moveTo':'lineTo';
+    s[fn](cos(a)*baseR,sin(a)*baseR);
+    s.lineTo(cos(a+step*.22)*baseR,sin(a+step*.22)*baseR);
+    s.lineTo(cos(a+step*.28)*outerR,sin(a+step*.28)*outerR);
+    s.lineTo(cos(a+step*.72)*outerR,sin(a+step*.72)*outerR);
+    s.lineTo(cos(a+step*.78)*baseR,sin(a+step*.78)*baseR);
+  }
+  s.closePath();
+  return s;
+}
+
+function escapeShape(R,teeth){
+  const s=new THREE.Shape();
+  const step=TWO_PI/teeth;
+  const baseR=R*0.72;
+  for(let i=0;i<teeth;i++){
+    const a=i*step;
+    const fn=i===0?'moveTo':'lineTo';
+    s[fn](cos(a)*baseR,sin(a)*baseR);
+    s.lineTo(cos(a+step*0.12)*(R*0.95),sin(a+step*0.12)*(R*0.95));
+    s.lineTo(cos(a+step*0.18)*R,sin(a+step*0.18)*R);
+    s.lineTo(cos(a+step*0.3)*(baseR*1.05),sin(a+step*0.3)*(baseR*1.05));
+    s.lineTo(cos(a+step*0.55)*baseR,sin(a+step*0.55)*baseR);
+  }
+  s.closePath();
+  return s;
+}
+
+function extrudeGear(shape,holeR,thickness,bevel){
+  if(holeR)shape.holes.push(holeFromCircle(holeR));
+  return new THREE.ExtrudeGeometry(shape,{depth:thickness,bevelEnabled:!!bevel,bevelThickness:bevel||0,bevelSize:bevel||0,bevelSegments:2,curveSegments:64});
+}
+
+function makeSpokes(hub,rim,count,w,thickness,material){
+  const g=new THREE.Group();
+  for(let i=0;i<count;i++){
+    const a=i/count*TWO_PI;
+    const len=rim-hub;
+    const geo=new THREE.BoxGeometry(w,thickness,len);
+    const m=new THREE.Mesh(geo,material);
+    m.position.set(cos(a)*(hub+len/2),0,sin(a)*(hub+len/2));
+    m.rotation.y=-a;
+    g.add(m);
+  }
+  return g;
+}
+
+function spiralPoints(innerR,outerR,turns,segs){
+  const pts=[];
+  for(let i=0;i<=segs;i++){
+    const t=i/segs;
+    const a=t*turns*TWO_PI;
+    const r=innerR+(outerR-innerR)*t;
+    pts.push(new THREE.Vector3(cos(a)*r,0,sin(a)*r));
+  }
+  return pts;
+}
+
+/* ── State ── */
+const watch=new THREE.Group();
+scene.add(watch);
+const interactives=[];
+const partInfo={};
+const layers={caseBack:[],plate:[],wheels:[],bridges:[],dial:[],hands:[],crystal:[]};
+let explodeTarget=0,explodeVal=0;
+let animActive=true,lumeActive=false;
+let hoveredMesh=null;
+const clock=new THREE.Clock();
+const refs={};
+
+function addPart(mesh,layer,name,info){
+  mesh.castShadow=true;
+  mesh.receiveShadow=true;
+  mesh.userData.partName=name;
+  mesh.userData.layer=layer;
+  mesh.userData.baseY=mesh.position.y;
+  if(info)partInfo[name]=info;
+  interactives.push(mesh);
+  if(layers[layer])layers[layer].push(mesh);
+  return mesh;
+}
+
+/* ── Case ── */
+function buildCase(){
+  const caseG=new THREE.Group();
+  const R=21,H=11,wall=1.8;
+
+  // main body (open-ended tube so movement is visible through crystal)
+  const bodyGeo=new THREE.CylinderGeometry(R,R,H,64,1,true);
+  const body=new THREE.Mesh(bodyGeo,mat.steel);
+  body.position.y=0;
+  caseG.add(addPart(body,'caseBack','Case Body','316L surgical steel, 42mm diameter, polished and satin-finished flanks'));
+
+  // inner wall
+  const innerGeo=new THREE.CylinderGeometry(R-wall,R-wall,H-1.5,64,1,true);
+  const innerMat=new THREE.MeshStandardMaterial({color:0x0c0c10,side:THREE.BackSide});
+  const inner=new THREE.Mesh(innerGeo,innerMat);
+  inner.position.y=0;
+  caseG.add(inner);
+
+  // bezel ring
+  const bezelGeo=new THREE.TorusGeometry(R-0.3,1.1,16,64);
+  const bezel=new THREE.Mesh(bezelGeo,mat.steel);
+  bezel.rotation.x=PI/2;
+  bezel.position.y=H/2;
+  caseG.add(addPart(bezel,'crystal','Bezel','Polished steel bezel with chamfered edge'));
+
+  // back bezel
+  const backBezelGeo=new THREE.TorusGeometry(R-0.3,0.8,12,64);
+  const backBezel=new THREE.Mesh(backBezelGeo,mat.steelBrushed);
+  backBezel.rotation.x=PI/2;
+  backBezel.position.y=-H/2;
+  caseG.add(addPart(backBezel,'caseBack','Case Back Ring','Exhibition case back retention ring'));
+
+  // front sapphire crystal (flat disc covering the opening)
+  const crystalGeo=new THREE.CylinderGeometry(R-wall,R-wall,0.5,64);
+  const crystal=new THREE.Mesh(crystalGeo,mat.sapphire);
+  crystal.position.y=H/2-0.1;
+  crystal.renderOrder=100;
+  caseG.add(addPart(crystal,'crystal','Sapphire Crystal','Anti-reflective coated sapphire crystal, domed, Mohs 9'));
+
+  // back sapphire
+  const backCrystalGeo=new THREE.CylinderGeometry(R-wall-0.5,R-wall-0.5,0.6,64);
+  const backCrystal=new THREE.Mesh(backCrystalGeo,mat.sapphire);
+  backCrystal.position.y=-H/2+0.2;
+  backCrystal.renderOrder=100;
+  caseG.add(addPart(backCrystal,'caseBack','Display Back','Sapphire exhibition case back'));
+
+  // lugs
+  for(let side of[-1,1]){
+    for(let lr of[-1,1]){
+      const lugGeo=new THREE.BoxGeometry(3.5,3,8);
+      lugGeo.translate(0,0,4);
+      const lug=new THREE.Mesh(lugGeo,mat.steel);
+      lug.position.set(lr*8,1,side*(R+2.5));
+      lug.rotation.x=side*0.25;
+      caseG.add(addPart(lug,'caseBack','Lug','Integrated lugs, 20mm lug width'));
+
+      // lug drilled hole
+      const pinGeo=new THREE.CylinderGeometry(0.5,0.5,4.5,12);
+      pinGeo.rotateZ(PI/2);
+      const pin=new THREE.Mesh(pinGeo,mat.steelDark);
+      pin.position.set(lr*8,0,side*(R+5.8));
+      caseG.add(pin);
+    }
+  }
+
+  // crown
+  const crownGroup=new THREE.Group();
+  const crownBody=new THREE.CylinderGeometry(2.2,2,3.5,24);
+  crownBody.rotateZ(PI/2);
+  const crownMesh=new THREE.Mesh(crownBody,mat.steel);
+  crownGroup.add(crownMesh);
+  // crown knurl
+  for(let i=0;i<20;i++){
+    const a=i/20*TWO_PI;
+    const kGeo=new THREE.BoxGeometry(3.2,0.25,0.15);
+    kGeo.rotateZ(PI/2);
+    const k=new THREE.Mesh(kGeo,mat.steelDark);
+    k.position.set(0,cos(a)*2.1,sin(a)*2.1);
+    k.rotation.x=a;
+    crownGroup.add(k);
+  }
+  // crown guard tube
+  const guardGeo=new THREE.CylinderGeometry(1.5,2.2,1.8,24);
+  guardGeo.rotateZ(PI/2);
+  const guard=new THREE.Mesh(guardGeo,mat.steel);
+  guard.position.x=-2.2;
+  crownGroup.add(guard);
+  crownGroup.position.set(R+3.5,1,0);
+  caseG.add(crownGroup);
+  addPart(crownMesh,'caseBack','Crown','Screw-down crown with rubber gasket, signed with logo');
+
+  watch.add(caseG);
+}
+
+/* ── Main plate ── */
+function buildPlate(){
+  const plateShape=circleShape(19);
+  // extensive skeletonization
+  plateShape.holes.push(holeFromCircle(1.5));
+  const cutouts=[
+    [0,0,3],[6,7.5,3.5],[-7,2.5,2.8],[0,-7,2.2],
+    [5.5,-5,2],[8,-8,3.2],
+    [-3,10,2.5],[10,0,2.5],[-8,-5,2.5],
+    [3,4,1.8],[-4,-2,1.8],[5,-10,2],
+    [-10,6,2],[-2,14,2],[12,4,2],
+  ];
+  for(const[cx,cz,r]of cutouts){
+    if(cx*cx+cz*cz<(18-r)*(18-r)){
+      const h=new THREE.Path();h.absarc(cx,cz,r,0,TWO_PI,true);
+      plateShape.holes.push(h);
+    }
+  }
+  const geo=new THREE.ExtrudeGeometry(plateShape,{depth:1.2,bevelEnabled:true,bevelThickness:0.15,bevelSize:0.15,bevelSegments:1,curveSegments:64});
+  geo.rotateX(-PI/2);
+  const plate=new THREE.Mesh(geo,mat.plate);
+  plate.position.y=-3.5;
+  watch.add(addPart(plate,'plate','Main Plate','German silver (maillechort) main plate, rhodium plated, Geneva stripes'));
+  refs.plate=plate;
+}
+
+/* ── Wheels / Gears ── */
+function buildWheels(){
+  const wheelY=-1.5;
+  const gearMat=mat.gearWheel;
+
+  // barrel (mainspring housing)
+  const barrelGroup=new THREE.Group();
+  barrelGroup.position.set(6,wheelY,7.5);
+
+  const barrelShape=gearShape(5.5,60,0.35);
+  barrelShape.holes.push(holeFromCircle(4));
+  const barrelGeo=extrudeGear(barrelShape,null,1.8,0.1);
+  barrelGeo.rotateX(-PI/2);
+  const barrelWheel=new THREE.Mesh(barrelGeo,gearMat);
+  barrelGroup.add(barrelWheel);
+
+  // barrel housing walls
+  const wallGeo=new THREE.CylinderGeometry(4.8,4.8,1.6,48,1,true);
+  const wallMesh=new THREE.Mesh(wallGeo,mat.steelBrushed);
+  wallMesh.position.y=0;
+  barrelGroup.add(wallMesh);
+
+  // mainspring inside barrel
+  const springPts=spiralPoints(0.8,4.2,6,200);
+  const springCurve=new THREE.CatmullRomCurve3(springPts);
+  const springGeo=new THREE.TubeGeometry(springCurve,200,0.08,6,false);
+  const springMesh=new THREE.Mesh(springGeo,mat.blueSteel);
+  barrelGroup.add(springMesh);
+
+  // barrel cap (top)
+  const capGeo=new THREE.CylinderGeometry(4.6,4.6,0.25,48);
+  const cap=new THREE.Mesh(capGeo,new THREE.MeshPhysicalMaterial({color:0xb8b4ac,metalness:0.9,roughness:0.15,envMapIntensity:1.2,transparent:true,opacity:0.5}));
+  cap.position.y=0.9;
+  barrelGroup.add(cap);
+
+  watch.add(barrelGroup);
+  addPart(barrelWheel,'wheels','Mainspring Barrel','Contains the mainspring, 72-hour power reserve. Click-spring ratchet winding');
+  refs.barrel=barrelGroup;
+
+  // center wheel
+  const centerGroup=new THREE.Group();
+  centerGroup.position.set(0,wheelY,0);
+  const cwShape=gearShape(4,80,0.3);
+  cwShape.holes.push(holeFromCircle(0.6));
+  // skeleton cutouts
+  for(let i=0;i<5;i++){
+    const a=i/5*TWO_PI;
+    const h=new THREE.Path();h.absarc(cos(a)*2.2,sin(a)*2.2,1,0,TWO_PI,true);
+    cwShape.holes.push(h);
+  }
+  const cwGeo=extrudeGear(cwShape,null,0.9,0.08);
+  cwGeo.rotateX(-PI/2);
+  const cw=new THREE.Mesh(cwGeo,gearMat);
+  centerGroup.add(cw);
+  watch.add(centerGroup);
+  addPart(cw,'wheels','Center Wheel','80 teeth. Drives the minute hand. 1 revolution per hour');
+  refs.centerWheel=centerGroup;
+
+  // third wheel
+  const thirdGroup=new THREE.Group();
+  thirdGroup.position.set(-7,wheelY,2.5);
+  const twShape=gearShape(3,75,0.25);
+  twShape.holes.push(holeFromCircle(0.5));
+  for(let i=0;i<4;i++){
+    const a=i/4*TWO_PI+PI/4;
+    const h=new THREE.Path();h.absarc(cos(a)*1.6,sin(a)*1.6,0.7,0,TWO_PI,true);
+    twShape.holes.push(h);
+  }
+  const twGeo=extrudeGear(twShape,null,0.7,0.06);
+  twGeo.rotateX(-PI/2);
+  const tw=new THREE.Mesh(twGeo,gearMat);
+  thirdGroup.add(tw);
+  watch.add(thirdGroup);
+  addPart(tw,'wheels','Third Wheel','75 teeth. Intermediate gear in the going train');
+  refs.thirdWheel=thirdGroup;
+
+  // fourth wheel (seconds)
+  const fourthGroup=new THREE.Group();
+  fourthGroup.position.set(0,wheelY,-7);
+  const fwShape=gearShape(2.5,60,0.2);
+  fwShape.holes.push(holeFromCircle(0.4));
+  for(let i=0;i<3;i++){
+    const a=i/3*TWO_PI;
+    const h=new THREE.Path();h.absarc(cos(a)*1.2,sin(a)*1.2,0.5,0,TWO_PI,true);
+    fwShape.holes.push(h);
+  }
+  const fwGeo=extrudeGear(fwShape,null,0.6,0.05);
+  fwGeo.rotateX(-PI/2);
+  const fw=new THREE.Mesh(fwGeo,gearMat);
+  fourthGroup.add(fw);
+  watch.add(fourthGroup);
+  addPart(fw,'wheels','Fourth Wheel','60 teeth. Seconds wheel, 1 revolution per minute');
+  refs.fourthWheel=fourthGroup;
+
+  // escape wheel
+  const escGroup=new THREE.Group();
+  escGroup.position.set(5.5,wheelY,-5);
+  const ewShape=escapeShape(2.3,15);
+  ewShape.holes.push(holeFromCircle(0.35));
+  const ewGeo=extrudeGear(ewShape,null,0.45,0.04);
+  ewGeo.rotateX(-PI/2);
+  const ew=new THREE.Mesh(ewGeo,new THREE.MeshPhysicalMaterial({color:0xe0dcd4,metalness:0.95,roughness:0.05,envMapIntensity:1.8}));
+  escGroup.add(ew);
+  watch.add(escGroup);
+  addPart(ew,'wheels','Escape Wheel','15 teeth, club-tooth lever escapement. Controls energy release');
+  refs.escapeWheel=escGroup;
+
+  // arbors (axles visible through center)
+  [refs.centerWheel,refs.thirdWheel,refs.fourthWheel,refs.escapeWheel].forEach(g=>{
+    const arborGeo=new THREE.CylinderGeometry(0.25,0.25,4,12);
+    const arbor=new THREE.Mesh(arborGeo,mat.steelDark);
+    g.add(arbor);
+  });
+  const barrelArbor=new THREE.CylinderGeometry(0.4,0.4,3.5,12);
+  refs.barrel.add(new THREE.Mesh(barrelArbor,mat.steelDark));
+}
+
+/* ── Pallet Fork ── */
+function buildPalletFork(){
+  const pfGroup=new THREE.Group();
+  pfGroup.position.set(6.5,-1,-6.8);
+
+  // lever arm
+  const armGeo=new THREE.BoxGeometry(0.4,0.35,3.5);
+  const arm=new THREE.Mesh(armGeo,mat.bridge);
+  arm.position.z=0.5;
+  pfGroup.add(arm);
+
+  // fork prongs
+  for(let s of[-1,1]){
+    const prong=new THREE.BoxGeometry(0.3,0.3,1.2);
+    const p=new THREE.Mesh(prong,mat.bridge);
+    p.position.set(s*0.6,0,2.6);
+    p.rotation.y=s*0.25;
+    pfGroup.add(p);
+
+    // pallet stones (ruby)
+    const palGeo=new THREE.BoxGeometry(0.5,0.3,0.2);
+    const pal=new THREE.Mesh(palGeo,mat.ruby);
+    pal.position.set(s*0.9,0,2.8);
+    pal.rotation.y=s*0.3;
+    pfGroup.add(pal);
+  }
+
+  // pivot
+  const pivGeo=new THREE.CylinderGeometry(0.3,0.3,0.6,12);
+  const piv=new THREE.Mesh(pivGeo,mat.steelDark);
+  piv.position.set(0,0,-1);
+  pfGroup.add(piv);
+
+  watch.add(pfGroup);
+  addPart(arm,'wheels','Pallet Fork','Swiss lever escapement. Two ruby pallet stones regulate the escape wheel');
+  refs.palletFork=pfGroup;
+}
+
+/* ── Balance Wheel + Hairspring ── */
+function buildBalance(){
+  const balGroup=new THREE.Group();
+  balGroup.position.set(8,-0.8,-8);
+
+  // rim
+  const rimGeo=new THREE.TorusGeometry(3.8,0.25,12,64);
+  rimGeo.rotateX(PI/2);
+  const rim=new THREE.Mesh(rimGeo,mat.gearWheel);
+  balGroup.add(rim);
+
+  // arms (3-arm design)
+  for(let i=0;i<3;i++){
+    const a=i/3*TWO_PI;
+    const armGeo=new THREE.BoxGeometry(0.35,0.3,3.5);
+    const arm=new THREE.Mesh(armGeo,mat.gearWheel);
+    arm.position.set(cos(a)*1.9,0,sin(a)*1.9);
+    arm.rotation.y=-a;
+    balGroup.add(arm);
+  }
+
+  // hub
+  const hubGeo=new THREE.CylinderGeometry(0.5,0.5,0.5,16);
+  const hub=new THREE.Mesh(hubGeo,mat.steelDark);
+  balGroup.add(hub);
+
+  // adjustment screws on rim
+  for(let i=0;i<4;i++){
+    const a=i/4*TWO_PI+PI/8;
+    const scGeo=new THREE.CylinderGeometry(0.2,0.2,0.35,8);
+    const sc=new THREE.Mesh(scGeo,mat.blueSteel);
+    sc.position.set(cos(a)*3.8,0.2,sin(a)*3.8);
+    balGroup.add(sc);
+  }
+
+  // hairspring
+  const hsPts=spiralPoints(0.7,3.4,14,400);
+  const hsCurve=new THREE.CatmullRomCurve3(hsPts);
+  const hsGeo=new THREE.TubeGeometry(hsCurve,400,0.025,4,false);
+  const hsMesh=new THREE.Mesh(hsGeo,new THREE.MeshPhysicalMaterial({color:0x4466aa,metalness:0.8,roughness:0.15,envMapIntensity:1.3}));
+  hsMesh.position.y=0.4;
+  balGroup.add(hsMesh);
+
+  watch.add(balGroup);
+  addPart(rim,'wheels','Balance Wheel','Glucydur balance wheel, 28,800 vph (4 Hz). Free-sprung with 4 Microstella adjustment weights');
+  addPart(hsMesh,'wheels','Hairspring','Nivarox flat hairspring, 14 active coils. Breguet overcoil terminal curve');
+  refs.balance=balGroup;
+}
+
+/* ── Bridges ── */
+function buildBridges(){
+  const bridgeY=0.8;
+
+  // barrel bridge
+  {
+    const s=new THREE.Shape();
+    s.moveTo(1,4);s.bezierCurveTo(5,7,10,7,12,4);
+    s.bezierCurveTo(13,1,10,-1,6,-1);
+    s.bezierCurveTo(2,-1,-1,1,1,4);
+    s.holes.push(holeFromCircle(0.6));// screw hole center
+    const h2=new THREE.Path();h2.absarc(9,3,0.5,0,TWO_PI,true);s.holes.push(h2);
+    const h3=new THREE.Path();h3.absarc(3,1,0.5,0,TWO_PI,true);s.holes.push(h3);
+    // jewel window
+    const jw=new THREE.Path();jw.absarc(6,3.5,1.5,0,TWO_PI,true);s.holes.push(jw);
+    const geo=new THREE.ExtrudeGeometry(s,{depth:0.8,bevelEnabled:true,bevelThickness:0.12,bevelSize:0.12,bevelSegments:2,curveSegments:32});
+    geo.rotateX(-PI/2);
+    geo.translate(-6,0,-3);
+    const bridge=new THREE.Mesh(geo,mat.bridge);
+    bridge.position.set(6,bridgeY,7.5);
+    watch.add(addPart(bridge,'bridges','Barrel Bridge','Hand-finished with C&ocirc;tes de Gen&egrave;ve, beveled edges'));
+
+    // screws on barrel bridge
+    for(const pos of [[0,3],[9,3],[3,1]]){
+      makeScrew(6-6+pos[0],bridgeY+0.45,7.5-3+pos[1],watch);
+    }
+  }
+
+  // train bridge (covers center, third, fourth wheels)
+  {
+    const s=new THREE.Shape();
+    s.moveTo(-3,8);s.bezierCurveTo(-8,6,-12,2,-10,-3);
+    s.bezierCurveTo(-8,-7,-3,-10,2,-10);
+    s.bezierCurveTo(5,-9,6,-6,5,-2);
+    s.bezierCurveTo(4,2,1,6,-3,8);
+    // bearing windows
+    const cw=new THREE.Path();cw.absarc(0,0,1.5,0,TWO_PI,true);s.holes.push(cw);
+    const tw2=new THREE.Path();tw2.absarc(-7,2.5,1.2,0,TWO_PI,true);s.holes.push(tw2);
+    const fw2=new THREE.Path();fw2.absarc(0,-7,1,0,TWO_PI,true);s.holes.push(fw2);
+    // decorative cutouts
+    const d1=new THREE.Path();d1.absarc(-3,-3,1.5,0,TWO_PI,true);s.holes.push(d1);
+    const d2=new THREE.Path();d2.absarc(-5,5,1,0,TWO_PI,true);s.holes.push(d2);
+    // screw holes
+    for(const p of[[-8,-2],[-1,7],[4,-7],[-9,5]]){
+      const sh=new THREE.Path();sh.absarc(p[0],p[1],0.45,0,TWO_PI,true);s.holes.push(sh);
+    }
+    const geo=new THREE.ExtrudeGeometry(s,{depth:0.7,bevelEnabled:true,bevelThickness:0.1,bevelSize:0.1,bevelSegments:2,curveSegments:32});
+    geo.rotateX(-PI/2);
+    const bridge=new THREE.Mesh(geo,mat.bridge);
+    bridge.position.y=bridgeY;
+    watch.add(addPart(bridge,'bridges','Train Bridge','Skeletonized train bridge, hand-beveled edges, perlage underside'));
+
+    for(const p of[[-8,-2],[-1,7],[4,-7],[-9,5]]){
+      makeScrew(p[0],bridgeY+0.4,p[1],watch);
+    }
+  }
+
+  // balance cock
+  {
+    const s=new THREE.Shape();
+    s.moveTo(3,0);s.bezierCurveTo(5,2,7,5,9,6);
+    s.bezierCurveTo(12,7,14,3,13,-2);
+    s.bezierCurveTo(12,-6,9,-9,6,-8);
+    s.bezierCurveTo(3,-7,1,-4,2,-1);
+    s.bezierCurveTo(2.5,0,3,0,3,0);
+    // balance bearing window
+    const bw=new THREE.Path();bw.absarc(8,-2,2.8,0,TWO_PI,true);s.holes.push(bw);
+    // regulator slot
+    const rs=new THREE.Path();rs.absarc(5,-5,0.8,0,TWO_PI,true);s.holes.push(rs);
+    // screw
+    const sc=new THREE.Path();sc.absarc(4,2,0.4,0,TWO_PI,true);s.holes.push(sc);
+    const sc2=new THREE.Path();sc2.absarc(11,-5,0.4,0,TWO_PI,true);s.holes.push(sc2);
+    const geo=new THREE.ExtrudeGeometry(s,{depth:0.6,bevelEnabled:true,bevelThickness:0.1,bevelSize:0.1,bevelSegments:2,curveSegments:32});
+    geo.rotateX(-PI/2);
+    geo.translate(-8,0,2);
+    const cock=new THREE.Mesh(geo,mat.bridge);
+    cock.position.set(8,bridgeY+0.5,-8);
+    watch.add(addPart(cock,'bridges','Balance Cock','Individually decorated balance cock with fine adjustment regulator'));
+
+    makeScrew(8-8+4,bridgeY+0.95,-8+2,watch);
+    makeScrew(8-8+11,bridgeY+0.95,-8-5,watch);
+  }
+}
+
+function makeScrew(x,y,z,parent){
+  const headGeo=new THREE.CylinderGeometry(0.4,0.4,0.2,12);
+  const head=new THREE.Mesh(headGeo,mat.blueSteel);
+  head.position.set(x,y,z);
+  parent.add(head);
+  addPart(head,'bridges','Blued Screw','Heat-blued to 290&deg;C, hand-polished heads, slotted');
+
+  // slot
+  const slotGeo=new THREE.BoxGeometry(0.5,0.05,0.08);
+  const slot=new THREE.Mesh(slotGeo,mat.steelDark);
+  slot.position.set(x,y+0.11,z);
+  parent.add(slot);
+}
+
+/* ── Ruby bearings ── */
+function buildRubies(){
+  const positions=[
+    [0,1.3,0],[0,-3,0], // center wheel top/bottom
+    [-7,1.3,2.5],[-7,-3,2.5], // third wheel
+    [0,1.3,-7],[0,-3,-7], // fourth wheel
+    [5.5,1.3,-5],[5.5,-3,-5], // escape wheel
+    [6.5,1.3,-6.8],[6.5,-3,-6.8], // pallet fork
+    [8,1.5,-8],[8,-3,-8], // balance
+    [6,1.3,7.5],[6,-3,7.5], // barrel
+    [8,0.2,-8], // balance cap jewel
+  ];
+  const rubyGeo=new THREE.CylinderGeometry(0.45,0.45,0.2,16);
+  const rubyChatonGeo=new THREE.TorusGeometry(0.5,0.08,8,16);
+
+  positions.forEach(([x,y,z])=>{
+    const ruby=new THREE.Mesh(rubyGeo,mat.ruby);
+    ruby.position.set(x,y,z);
+    watch.add(ruby);
+    addPart(ruby,y>0?'bridges':'plate','Ruby Bearing','Synthetic ruby jewel bearing, 0.9mm, reduces friction at pivot points');
+
+    const chaton=new THREE.Mesh(rubyChatonGeo,mat.roseGold);
+    chaton.rotation.x=PI/2;
+    chaton.position.set(x,y,z);
+    watch.add(chaton);
+  });
+}
+
+/* ── Dial elements ── */
+function buildDial(){
+  const dialY=2.8;
+
+  // chapter ring (outer ring with minute track)
+  const ringGeo=new THREE.RingGeometry(17.5,19,64);
+  ringGeo.rotateX(-PI/2);
+  const ring=new THREE.Mesh(ringGeo,mat.steelDark);
+  ring.position.y=dialY;
+  watch.add(addPart(ring,'dial','Chapter Ring','Rehaut with minute track'));
+
+  // minute ticks
+  for(let i=0;i<60;i++){
+    const a=i/60*TWO_PI-PI/2;
+    const len=i%5===0?1.8:0.8;
+    const w=i%5===0?0.25:0.12;
+    const tickGeo=new THREE.BoxGeometry(w,0.15,len);
+    const tick=new THREE.Mesh(tickGeo,i%5===0?mat.handSteel:mat.steelBrushed);
+    tick.position.set(cos(a)*(19-len/2),dialY+0.1,sin(a)*(19-len/2));
+    tick.rotation.y=-a+PI/2;
+    watch.add(tick);
+  }
+
+  // applied hour indices
+  for(let i=0;i<12;i++){
+    const a=i/12*TWO_PI-PI/2;
+    if(i%3===0){
+      // double baton at 12,3,6,9
+      for(let s of[-0.35,0.35]){
+        const indGeo=new THREE.BoxGeometry(0.3,0.5,2.5);
+        const ind=new THREE.Mesh(indGeo,mat.handSteel);
+        ind.position.set(cos(a)*(16)+cos(a+PI/2)*s, dialY+0.3, sin(a)*(16)+sin(a+PI/2)*s);
+        ind.rotation.y=-a+PI/2;
+        watch.add(addPart(ind,'dial','Applied Index','18K white gold applied hour marker'));
+      }
+      // lume dot between batons
+      const lumeDotGeo=new THREE.BoxGeometry(0.4,0.3,1.8);
+      const lumeDot=new THREE.Mesh(lumeDotGeo,mat.lume);
+      lumeDot.position.set(cos(a)*16,dialY+0.25,sin(a)*16);
+      lumeDot.rotation.y=-a+PI/2;
+      watch.add(lumeDot);
+      refs['lumeIdx'+i]=lumeDot;
+    } else {
+      const indGeo=new THREE.BoxGeometry(0.25,0.4,1.8);
+      const ind=new THREE.Mesh(indGeo,mat.handSteel);
+      ind.position.set(cos(a)*16.2,dialY+0.25,sin(a)*16.2);
+      ind.rotation.y=-a+PI/2;
+      watch.add(addPart(ind,'dial','Applied Index','Polished applied baton index'));
+
+      const lumeDotGeo=new THREE.BoxGeometry(0.3,0.25,1.2);
+      const lumeDot=new THREE.Mesh(lumeDotGeo,mat.lume);
+      lumeDot.position.set(cos(a)*16.2,dialY+0.2,sin(a)*16.2);
+      lumeDot.rotation.y=-a+PI/2;
+      watch.add(lumeDot);
+      refs['lumeIdx'+i]=lumeDot;
+    }
+  }
+}
+
+/* ── Hands ── */
+function buildHands(){
+  const handY=3.5;
+
+  // hour hand
+  const hShape=new THREE.Shape();
+  hShape.moveTo(-0.5,0);hShape.lineTo(-0.35,10);hShape.lineTo(0.35,10);hShape.lineTo(0.5,0);hShape.closePath();
+  // lume cutout
+  const hLume=new THREE.Path();
+  hLume.moveTo(-0.2,2);hLume.lineTo(-0.15,8.5);hLume.lineTo(0.15,8.5);hLume.lineTo(0.2,2);hLume.closePath();
+  hShape.holes.push(hLume);
+  const hGeo=new THREE.ExtrudeGeometry(hShape,{depth:0.3,bevelEnabled:true,bevelThickness:0.05,bevelSize:0.05,bevelSegments:1,curveSegments:8});
+  hGeo.rotateX(-PI/2);
+  hGeo.rotateY(PI);
+  const hourHand=new THREE.Mesh(hGeo,mat.handSteel);
+  hourHand.position.y=handY;
+  watch.add(addPart(hourHand,'hands','Hour Hand','Dauphine-style, polished, SuperLuminova fill'));
+  refs.hourHand=hourHand;
+
+  // hour hand lume fill
+  const hlShape=new THREE.Shape();
+  hlShape.moveTo(-0.18,2.2);hlShape.lineTo(-0.13,8.3);hlShape.lineTo(0.13,8.3);hlShape.lineTo(0.18,2.2);hlShape.closePath();
+  const hlGeo=new THREE.ExtrudeGeometry(hlShape,{depth:0.2,bevelEnabled:false,curveSegments:4});
+  hlGeo.rotateX(-PI/2);hlGeo.rotateY(PI);
+  const hourLume=new THREE.Mesh(hlGeo,mat.lume);
+  hourLume.position.y=handY+0.05;
+  hourHand.add(hourLume);
+  refs.hourLume=hourLume;
+
+  // minute hand
+  const mShape=new THREE.Shape();
+  mShape.moveTo(-0.4,0);mShape.lineTo(-0.22,14);mShape.lineTo(0.22,14);mShape.lineTo(0.4,0);mShape.closePath();
+  const mLume=new THREE.Path();
+  mLume.moveTo(-0.15,2);mLume.lineTo(-0.1,12.5);mLume.lineTo(0.1,12.5);mLume.lineTo(0.15,2);mLume.closePath();
+  mShape.holes.push(mLume);
+  const mGeo=new THREE.ExtrudeGeometry(mShape,{depth:0.25,bevelEnabled:true,bevelThickness:0.04,bevelSize:0.04,bevelSegments:1,curveSegments:8});
+  mGeo.rotateX(-PI/2);mGeo.rotateY(PI);
+  const minHand=new THREE.Mesh(mGeo,mat.handSteel);
+  minHand.position.y=handY+0.5;
+  watch.add(addPart(minHand,'hands','Minute Hand','Dauphine-style, mirror-polished, SuperLuminova fill'));
+  refs.minHand=minHand;
+
+  const mlShape=new THREE.Shape();
+  mlShape.moveTo(-0.13,2.2);mlShape.lineTo(-0.08,12.3);mlShape.lineTo(0.08,12.3);mlShape.lineTo(0.13,2.2);mlShape.closePath();
+  const mlGeo=new THREE.ExtrudeGeometry(mlShape,{depth:0.15,bevelEnabled:false,curveSegments:4});
+  mlGeo.rotateX(-PI/2);mlGeo.rotateY(PI);
+  const minLume=new THREE.Mesh(mlGeo,mat.lume);
+  minLume.position.y=0.03;
+  minHand.add(minLume);
+  refs.minLume=minLume;
+
+  // seconds hand
+  const sShape=new THREE.Shape();
+  sShape.moveTo(-0.08,-3);sShape.lineTo(-0.06,16);sShape.lineTo(0.06,16);sShape.lineTo(0.08,-3);sShape.closePath();
+  const sGeo=new THREE.ExtrudeGeometry(sShape,{depth:0.12,bevelEnabled:false,curveSegments:4});
+  sGeo.rotateX(-PI/2);sGeo.rotateY(PI);
+  const secHand=new THREE.Mesh(sGeo,mat.roseGold);
+  secHand.position.y=handY+0.9;
+  watch.add(addPart(secHand,'hands','Seconds Hand','Rose gold-toned, counterbalanced'));
+  refs.secHand=secHand;
+
+  // seconds counterweight (circle at tail)
+  const cwGeo=new THREE.CylinderGeometry(0.5,0.5,0.12,12);
+  cwGeo.rotateX(PI/2);cwGeo.translate(0,0,2.5);
+  const cwMesh=new THREE.Mesh(cwGeo,mat.roseGold);
+  secHand.add(cwMesh);
+
+  // center cap
+  const capGeo=new THREE.CylinderGeometry(0.8,0.8,0.6,16);
+  const cap=new THREE.Mesh(capGeo,mat.handSteel);
+  cap.position.y=handY+1.2;
+  watch.add(cap);
+}
+
+/* ── Ground plane ── */
+function buildGround(){
+  const geo=new THREE.PlaneGeometry(250,250);
+  const ground=new THREE.Mesh(geo,mat.ground);
+  ground.rotation.x=-PI/2;
+  ground.position.y=-8;
+  ground.receiveShadow=true;
+  scene.add(ground);
+}
+
+/* ── Build everything ── */
+buildCase();
+buildPlate();
+buildWheels();
+buildPalletFork();
+buildBalance();
+buildBridges();
+buildRubies();
+buildDial();
+buildHands();
+buildGround();
+
+/* ── Exploded view offsets ── */
+const explodeOffsets={
+  caseBack:-14,
+  plate:-7,
+  wheels:0,
+  bridges:7,
+  dial:12,
+  hands:16,
+  crystal:20
+};
+
+/* ── Animation ── */
+function updateAnimation(dt,elapsed){
+  if(!animActive)return;
+
+  const speed=elapsed*0.25;
+
+  // gears
+  if(refs.barrel)refs.barrel.rotation.y=speed*0.02;
+  if(refs.centerWheel)refs.centerWheel.rotation.y=-speed*0.15;
+  if(refs.thirdWheel)refs.thirdWheel.rotation.y=speed*0.6;
+  if(refs.fourthWheel)refs.fourthWheel.rotation.y=-speed*2;
+  if(refs.escapeWheel)refs.escapeWheel.rotation.y=speed*6;
+
+  // balance wheel oscillation
+  if(refs.balance){
+    refs.balance.rotation.y=sin(elapsed*PI*1.2)*1.3;
+  }
+  // pallet fork rocks with balance
+  if(refs.palletFork){
+    refs.palletFork.rotation.y=sin(elapsed*PI*1.2)*0.18;
+  }
+
+  // hands track real time
+  const now=new Date();
+  const sec=now.getSeconds()+now.getMilliseconds()/1000;
+  const min=now.getMinutes()+sec/60;
+  const hr=(now.getHours()%12)+min/60;
+
+  if(refs.secHand)refs.secHand.rotation.y=PI-(sec/60)*TWO_PI;
+  if(refs.minHand)refs.minHand.rotation.y=PI-(min/60)*TWO_PI;
+  if(refs.hourHand)refs.hourHand.rotation.y=PI-(hr/12)*TWO_PI;
+}
+
+/* ── Exploded view ── */
+function updateExplode(){
+  explodeVal+=(explodeTarget-explodeVal)*0.06;
+  if(Math.abs(explodeVal-explodeTarget)<0.001)explodeVal=explodeTarget;
+
+  for(const[layer,meshes]of Object.entries(layers)){
+    const offset=explodeOffsets[layer]||0;
+    meshes.forEach(m=>{
+      const base=m.userData.baseY||0;
+      m.position.y=base+explodeVal*offset;
+    });
+  }
+}
+
+/* ── Lume ── */
+const lumeMats=[];
+function collectLumeMats(){
+  watch.traverse(c=>{
+    if(c.isMesh&&c.material===mat.lume){
+      lumeMats.push(c);
+    }
+  });
+}
+collectLumeMats();
+
+function updateLume(){
+  const target=lumeActive?2.5:0.15;
+  const current=mat.lume.emissiveIntensity;
+  mat.lume.emissiveIntensity+=(target-current)*0.08;
+  bloomPass.strength+=(lumeActive?1.2:0.25-bloomPass.strength)*0.06;
+}
+
+/* ── Interaction ── */
+const raycaster=new THREE.Raycaster();
+const mouse=new THREE.Vector2(-10,-10);
+const labelEl=document.getElementById('partLabel');
+const detailEl=document.getElementById('partDetail');
+let detailTimer=null;
+
+canvas.addEventListener('mousemove',e=>{
+  mouse.x=(e.clientX/window.innerWidth)*2-1;
+  mouse.y=-(e.clientY/window.innerHeight)*2+1;
+});
+canvas.addEventListener('mouseleave',()=>{mouse.x=-10;mouse.y=-10});
+
+canvas.addEventListener('click',()=>{
+  if(hoveredMesh&&hoveredMesh.userData.partName){
+    const info=partInfo[hoveredMesh.userData.partName];
+    if(info){
+      detailEl.textContent=hoveredMesh.userData.partName+' — '+info;
+      detailEl.classList.add('visible');
+      clearTimeout(detailTimer);
+      detailTimer=setTimeout(()=>detailEl.classList.remove('visible'),4000);
+    }
+  }
+});
+
+function updateInteraction(){
+  raycaster.setFromCamera(mouse,camera);
+  const hits=raycaster.intersectObjects(interactives,false);
+
+  if(hits.length>0){
+    const obj=hits[0].object;
+    const name=obj.userData.partName;
+    if(name){
+      canvas.style.cursor='pointer';
+      const pt=hits[0].point.clone().project(camera);
+      const x=(pt.x+1)/2*window.innerWidth;
+      const y=-(pt.y-1)/2*window.innerHeight;
+      labelEl.style.left=(x+18)+'px';
+      labelEl.style.top=(y-12)+'px';
+      labelEl.textContent=name;
+      labelEl.classList.add('visible');
+
+      if(hoveredMesh!==obj){
+        if(hoveredMesh)unhighlight(hoveredMesh);
+        highlight(obj);
+        hoveredMesh=obj;
+      }
+    }
+  }else{
+    canvas.style.cursor='grab';
+    labelEl.classList.remove('visible');
+    if(hoveredMesh){unhighlight(hoveredMesh);hoveredMesh=null}
+  }
+}
+
+function highlight(m){
+  if(!m.userData._origMat){
+    m.userData._origMat=m.material;
+    m.material=m.material.clone();
+  }
+  m.material.emissive=m.material.emissive||new THREE.Color();
+  m.material.emissive.setHex(0x1a1510);
+}
+function unhighlight(m){
+  if(m.userData._origMat){
+    m.material.dispose();
+    m.material=m.userData._origMat;
+    delete m.userData._origMat;
+  }
+}
+
+/* ── UI ── */
+const btnExplode=document.getElementById('btnExplode');
+const btnInfo=document.getElementById('btnInfo');
+const btnAnim=document.getElementById('btnAnim');
+const btnLume=document.getElementById('btnLume');
+const infoPanel=document.getElementById('infoPanel');
+
+btnExplode.addEventListener('click',()=>{
+  explodeTarget=explodeTarget>0?0:1;
+  btnExplode.classList.toggle('active',explodeTarget>0);
+});
+btnInfo.addEventListener('click',()=>{
+  infoPanel.classList.toggle('visible');
+  btnInfo.classList.toggle('active');
+});
+btnAnim.addEventListener('click',()=>{
+  animActive=!animActive;
+  btnAnim.classList.toggle('active',animActive);
+});
+btnLume.addEventListener('click',()=>{
+  lumeActive=!lumeActive;
+  btnLume.classList.toggle('active',lumeActive);
+});
+
+/* ── Resize ── */
+window.addEventListener('resize',()=>{
+  const w=window.innerWidth,h=window.innerHeight;
+  camera.aspect=w/h;
+  camera.updateProjectionMatrix();
+  renderer.setSize(w,h);
+  composer.setSize(w,h);
+  bloomPass.resolution.set(w,h);
+});
+
+/* ── Intro camera ── */
+const camStart=new THREE.Vector3(0,55,75);
+const camEnd=new THREE.Vector3(0,28,48);
+camera.position.copy(camStart);
+let introT=0;
+function easeOutCubic(t){return 1-Math.pow(1-t,3)}
+
+/* ── Render loop ── */
+function loop(){
+  requestAnimationFrame(loop);
+  const dt=clock.getDelta();
+  const elapsed=clock.getElapsedTime();
+
+  if(introT<1){
+    introT=Math.min(introT+dt*0.35,1);
+    const t=easeOutCubic(introT);
+    camera.position.lerpVectors(camStart,camEnd,t);
+  }
+
+  controls.update();
+  updateAnimation(dt,elapsed);
+  updateExplode();
+  updateLume();
+  updateInteraction();
+  composer.render();
+}
+loop();
+</script>
+</body>
+</html>
diff --git a/outputs/claude-opus-4-6/cursor-max/pelican-bicycle.svg b/outputs/claude-opus-4-6/cursor-max/pelican-cycling.svg
similarity index 100%
rename from outputs/claude-opus-4-6/cursor-max/pelican-bicycle.svg
rename to outputs/claude-opus-4-6/cursor-max/pelican-cycling.svg
diff --git a/outputs/claude-opus-4-7/claude-code-max/mythos-craft.html b/outputs/claude-opus-4-7/claude-code-max/mythos-craft.html
new file mode 100644
index 0000000..65757d7
--- /dev/null
+++ b/outputs/claude-opus-4-7/claude-code-max/mythos-craft.html
@@ -0,0 +1,2181 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Mythoscraft — 神话方块世界</title>
+<style>
+  :root { color-scheme: dark; }
+  * { box-sizing: border-box; }
+  html, body { margin: 0; padding: 0; height: 100%; overflow: hidden; background: #0a0612; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #fff; user-select: none; -webkit-user-select: none; }
+  canvas { display: block; image-rendering: pixelated; image-rendering: crisp-edges; }
+
+  #crosshair {
+    position: fixed; left: 50%; top: 50%; width: 22px; height: 22px;
+    margin: -11px 0 0 -11px; pointer-events: none; z-index: 5;
+    mix-blend-mode: difference;
+  }
+  #crosshair::before, #crosshair::after {
+    content: ''; position: absolute; background: #fff;
+  }
+  #crosshair::before { left: 50%; top: 3px; width: 2px; height: 16px; margin-left: -1px; }
+  #crosshair::after  { top: 50%; left: 3px; height: 2px; width: 16px; margin-top: -1px; }
+
+  #hotbar {
+    position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%);
+    display: flex; gap: 4px; padding: 4px;
+    background: rgba(10, 6, 18, 0.7); border: 2px solid rgba(255, 220, 140, 0.4);
+    border-radius: 6px; z-index: 5;
+    box-shadow: 0 0 24px rgba(255, 200, 80, 0.15), inset 0 0 16px rgba(0,0,0,0.6);
+  }
+  .slot {
+    width: 46px; height: 46px; background: rgba(0,0,0,0.5); border: 2px solid #2a2238;
+    display: flex; align-items: center; justify-content: center; position: relative;
+  }
+  .slot.active { border-color: #ffdc8c; box-shadow: 0 0 12px rgba(255, 220, 140, 0.7), inset 0 0 8px rgba(255,220,140,0.2); }
+  .slot canvas { width: 32px; height: 32px; image-rendering: pixelated; }
+  .slot .num { position: absolute; top: 1px; left: 3px; font-size: 10px; color: #ffe8a8; text-shadow: 1px 1px 0 #000; }
+  .slot .name { position: absolute; bottom: -16px; left: 50%; transform: translateX(-50%); font-size: 10px; white-space: nowrap; color: #ffe8a8; opacity: 0; transition: opacity .2s; pointer-events: none; }
+  .slot.active .name { opacity: 1; }
+
+  #hud {
+    position: fixed; top: 12px; left: 12px; padding: 10px 14px;
+    background: rgba(10, 6, 18, 0.65); border: 1px solid rgba(255, 220, 140, 0.25);
+    border-radius: 6px; font-size: 12px; line-height: 1.7; z-index: 5;
+    backdrop-filter: blur(4px); max-width: 240px;
+  }
+  #hud .tag { color: #ffdc8c; }
+  #hud .place { font-size: 10px; opacity: 0.65; margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255,220,140,0.15); }
+
+  #start {
+    position: fixed; inset: 0; z-index: 100;
+    display: flex; align-items: center; justify-content: center; flex-direction: column;
+    cursor: pointer;
+    background:
+      radial-gradient(ellipse at 20% 30%, rgba(120, 60, 200, 0.35), transparent 50%),
+      radial-gradient(ellipse at 80% 70%, rgba(220, 80, 50, 0.25), transparent 50%),
+      radial-gradient(ellipse at 50% 100%, rgba(80, 180, 255, 0.18), transparent 60%),
+      linear-gradient(180deg, #0a0612 0%, #1a0c2a 50%, #0a0612 100%);
+    overflow: hidden;
+  }
+  #start::before {
+    content: ''; position: absolute; inset: 0;
+    background-image:
+      radial-gradient(1px 1px at 13% 22%, #fff 50%, transparent),
+      radial-gradient(1px 1px at 27% 65%, #ffe8b0 50%, transparent),
+      radial-gradient(1.5px 1.5px at 41% 11%, #fff 50%, transparent),
+      radial-gradient(1px 1px at 55% 79%, #fff 50%, transparent),
+      radial-gradient(1px 1px at 70% 33%, #ffe8b0 50%, transparent),
+      radial-gradient(1px 1px at 82% 14%, #fff 50%, transparent),
+      radial-gradient(1px 1px at 90% 56%, #cce8ff 50%, transparent),
+      radial-gradient(1px 1px at 5% 90%, #fff 50%, transparent),
+      radial-gradient(1.5px 1.5px at 32% 88%, #fff 50%, transparent),
+      radial-gradient(1px 1px at 62% 50%, #fff 50%, transparent);
+    opacity: 0.7;
+    animation: twinkle 6s ease-in-out infinite alternate;
+  }
+  @keyframes twinkle { from { opacity: 0.4 } to { opacity: 0.9 } }
+  #start h1 {
+    font-size: clamp(40px, 8vw, 88px); margin: 0; letter-spacing: 6px;
+    background: linear-gradient(180deg, #ffe8b0 0%, #ffb44a 45%, #b94a2a 100%);
+    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
+    text-shadow: 0 0 48px rgba(255, 160, 60, 0.5);
+    font-weight: 900;
+    position: relative; z-index: 1;
+  }
+  #start .sub { font-size: 14px; color: #c0a3d8; margin: 4px 0 28px; letter-spacing: 4px; position: relative; z-index: 1; }
+  #start .controls { font-size: 13px; color: #fff; opacity: 0.85; line-height: 2; text-align: center; position: relative; z-index: 1; padding: 16px 24px; background: rgba(0,0,0,0.4); border: 1px solid rgba(255,220,140,0.2); border-radius: 8px; max-width: 480px; }
+  #start .controls span { color: #ffdc8c; }
+  #start .prompt { margin-top: 20px; font-size: 14px; color: #ffdc8c; animation: pulse 2s ease-in-out infinite; position: relative; z-index: 1; }
+  @keyframes pulse { 0%, 100% { opacity: 0.6 } 50% { opacity: 1 } }
+  #start.hidden { display: none; }
+
+  #loading { position: relative; z-index: 1; margin-top: 20px; font-size: 12px; color: #c0a3d8; min-height: 18px; }
+  #loading .bar { width: 280px; height: 6px; background: rgba(255,255,255,0.1); margin: 8px auto 0; border-radius: 3px; overflow: hidden; }
+  #loading .bar div { height: 100%; width: 0; background: linear-gradient(90deg, #ffb44a, #ffe8b0); transition: width .15s; }
+
+  #toast {
+    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
+    background: rgba(10,6,18,0.85); border: 1px solid rgba(255,220,140,0.4);
+    padding: 16px 28px; border-radius: 8px; font-size: 14px; color: #ffe8b0;
+    pointer-events: none; z-index: 6; opacity: 0; transition: opacity .3s;
+  }
+  #toast.show { opacity: 1; }
+</style>
+</head>
+<body>
+
+<div id="start">
+  <h1>MYTHOSCRAFT</h1>
+  <div class="sub">神 话 方 块 世 界</div>
+  <div class="controls">
+    <span>WASD</span> 移动 &nbsp;·&nbsp; <span>SPACE</span> 跳跃 &nbsp;·&nbsp; <span>SHIFT</span> 疾跑<br>
+    <span>鼠标</span> 视角 &nbsp;·&nbsp; <span>左键</span> 破坏 &nbsp;·&nbsp; <span>右键</span> 放置<br>
+    <span>1-9</span> 切换方块 &nbsp;·&nbsp; <span>F</span> 飞行 &nbsp;·&nbsp; <span>ESC</span> 暂停
+  </div>
+  <div id="loading">铸造世界中… <div class="bar"><div></div></div></div>
+  <div class="prompt">— 点击屏幕，启程探索 —</div>
+</div>
+
+<div id="hud" style="display:none">
+  <div><span class="tag">坐标</span> <span id="hud-pos">—</span></div>
+  <div><span class="tag">朝向</span> <span id="hud-dir">—</span></div>
+  <div><span class="tag">脚下</span> <span id="hud-block">—</span></div>
+  <div><span class="tag">FPS</span> <span id="hud-fps">—</span> &nbsp; <span class="tag">区块</span> <span id="hud-chunks">—</span></div>
+  <div class="place">F 切换飞行 &nbsp;·&nbsp; ESC 暂停</div>
+</div>
+
+<div id="crosshair" style="display:none"></div>
+<div id="hotbar" style="display:none"></div>
+<div id="toast"></div>
+
+<script type="importmap">
+{ "imports": { "three": "https://unpkg.com/three@0.160.0/build/three.module.js" } }
+</script>
+
+<script type="module">
+import * as THREE from 'three';
+
+/* ============================================================
+   常量与方块定义
+   ============================================================ */
+
+const CHUNK = 16;
+const WORLD_W = 16;                      // 16x16 区块
+const WORLD_H = 128;                     // 高度（含天空层）
+const WORLD_SIZE = WORLD_W * CHUNK;      // 256
+const SEA = 28;                          // 海平面
+const SEED = 0x6a09e667;
+
+// 方块 ID
+const AIR = 0, GRASS = 1, DIRT = 2, STONE = 3, SAND = 4, LOG = 5,
+      LEAVES = 6, WATER = 7, PLANK = 8, COBBLE = 9, GLASS = 10,
+      GOLD = 11, OBSIDIAN = 12, CRYSTAL = 13, BEDROCK = 14, BRICK = 15,
+      MOSS = 16, BOOKSHELF = 17, LAVA = 18, ICE = 19, GOLD_ORE = 20,
+      CRYSTAL_ORE = 21, MAGMA = 22, SNOW = 23, MARBLE = 24, RUNE = 25;
+
+// 中文名（用于 UI）
+const BLOCK_NAME = {
+  [GRASS]: '草方块', [DIRT]: '泥土', [STONE]: '石头', [SAND]: '沙子',
+  [LOG]: '原木', [LEAVES]: '树叶', [WATER]: '水', [PLANK]: '木板',
+  [COBBLE]: '圆石', [GLASS]: '玻璃', [GOLD]: '黄金', [OBSIDIAN]: '黑曜石',
+  [CRYSTAL]: '水晶', [BEDROCK]: '基岩', [BRICK]: '红砖', [MOSS]: '苔石',
+  [BOOKSHELF]: '书架', [LAVA]: '岩浆', [ICE]: '冰块', [GOLD_ORE]: '金矿',
+  [CRYSTAL_ORE]: '水晶矿', [MAGMA]: '岩浆石', [SNOW]: '积雪',
+  [MARBLE]: '神纹石', [RUNE]: '符文石',
+};
+
+// 纹理图集索引
+const T = {
+  GRASS_TOP: 0, GRASS_SIDE: 1, DIRT: 2, STONE: 3, SAND: 4,
+  LOG_TOP: 5, LOG_SIDE: 6, LEAVES: 7, PLANK: 8, COBBLE: 9,
+  GLASS: 10, GOLD: 11, OBSIDIAN: 12, CRYSTAL: 13, BEDROCK: 14,
+  BRICK: 15, MOSS: 16, BOOKSHELF: 17, LAVA: 18, ICE: 19,
+  WATER: 20, GOLD_ORE: 21, CRYSTAL_ORE: 22, MAGMA: 23, SNOW: 24,
+  MARBLE: 25, RUNE: 26,
+};
+
+// 每个方块的 [顶, 底, 侧] 纹理
+const FACE_TEX = {
+  [GRASS]: [T.GRASS_TOP, T.DIRT, T.GRASS_SIDE],
+  [DIRT]: [T.DIRT, T.DIRT, T.DIRT],
+  [STONE]: [T.STONE, T.STONE, T.STONE],
+  [SAND]: [T.SAND, T.SAND, T.SAND],
+  [LOG]: [T.LOG_TOP, T.LOG_TOP, T.LOG_SIDE],
+  [LEAVES]: [T.LEAVES, T.LEAVES, T.LEAVES],
+  [WATER]: [T.WATER, T.WATER, T.WATER],
+  [PLANK]: [T.PLANK, T.PLANK, T.PLANK],
+  [COBBLE]: [T.COBBLE, T.COBBLE, T.COBBLE],
+  [GLASS]: [T.GLASS, T.GLASS, T.GLASS],
+  [GOLD]: [T.GOLD, T.GOLD, T.GOLD],
+  [OBSIDIAN]: [T.OBSIDIAN, T.OBSIDIAN, T.OBSIDIAN],
+  [CRYSTAL]: [T.CRYSTAL, T.CRYSTAL, T.CRYSTAL],
+  [BEDROCK]: [T.BEDROCK, T.BEDROCK, T.BEDROCK],
+  [BRICK]: [T.BRICK, T.BRICK, T.BRICK],
+  [MOSS]: [T.MOSS, T.MOSS, T.MOSS],
+  [BOOKSHELF]: [T.PLANK, T.PLANK, T.BOOKSHELF],
+  [LAVA]: [T.LAVA, T.LAVA, T.LAVA],
+  [ICE]: [T.ICE, T.ICE, T.ICE],
+  [GOLD_ORE]: [T.GOLD_ORE, T.GOLD_ORE, T.GOLD_ORE],
+  [CRYSTAL_ORE]: [T.CRYSTAL_ORE, T.CRYSTAL_ORE, T.CRYSTAL_ORE],
+  [MAGMA]: [T.MAGMA, T.MAGMA, T.MAGMA],
+  [SNOW]: [T.SNOW, T.SNOW, T.SNOW],
+  [MARBLE]: [T.MARBLE, T.MARBLE, T.MARBLE],
+  [RUNE]: [T.MARBLE, T.MARBLE, T.RUNE],
+};
+
+// 用于面剔除：相邻方块如果属于 TRANSPARENT 且与自身不同，则需要画面
+const TRANSPARENT = new Set([AIR, WATER, GLASS, LEAVES, ICE]);
+// 用于网格分类：真正需要 alpha 混合渲染的方块
+const RENDER_ALPHA = new Set([WATER, GLASS, ICE]);
+const PASSABLE = new Set([AIR, WATER, LAVA]);
+const EMISSIVE = new Set([GOLD, CRYSTAL, CRYSTAL_ORE, GOLD_ORE, LAVA, MAGMA, RUNE]);
+
+/* ============================================================
+   伪随机 + Perlin 噪声
+   ============================================================ */
+
+function mulberry32(seed) {
+  let s = seed | 0;
+  return function () {
+    s = s + 0x6D2B79F5 | 0;
+    let t = s;
+    t = Math.imul(t ^ t >>> 15, t | 1);
+    t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+
+class Perlin {
+  constructor(seed) {
+    this.p = new Uint8Array(512);
+    const perm = new Uint8Array(256);
+    for (let i = 0; i < 256; i++) perm[i] = i;
+    const rand = mulberry32(seed);
+    for (let i = 255; i > 0; i--) {
+      const j = Math.floor(rand() * (i + 1));
+      const t = perm[i]; perm[i] = perm[j]; perm[j] = t;
+    }
+    for (let i = 0; i < 512; i++) this.p[i] = perm[i & 255];
+  }
+  fade(t) { return t * t * t * (t * (t * 6 - 15) + 10); }
+  lerp(a, b, t) { return a + t * (b - a); }
+  grad(h, x, y, z) {
+    const g = h & 15;
+    const u = g < 8 ? x : y;
+    const v = g < 4 ? y : (g === 12 || g === 14 ? x : z);
+    return ((g & 1) === 0 ? u : -u) + ((g & 2) === 0 ? v : -v);
+  }
+  noise(x, y, z = 0) {
+    const X = Math.floor(x) & 255, Y = Math.floor(y) & 255, Z = Math.floor(z) & 255;
+    x -= Math.floor(x); y -= Math.floor(y); z -= Math.floor(z);
+    const u = this.fade(x), v = this.fade(y), w = this.fade(z);
+    const p = this.p;
+    const A = p[X] + Y, AA = p[A] + Z, AB = p[A + 1] + Z;
+    const B = p[X + 1] + Y, BA = p[B] + Z, BB = p[B + 1] + Z;
+    return this.lerp(
+      this.lerp(
+        this.lerp(this.grad(p[AA], x, y, z), this.grad(p[BA], x - 1, y, z), u),
+        this.lerp(this.grad(p[AB], x, y - 1, z), this.grad(p[BB], x - 1, y - 1, z), u), v),
+      this.lerp(
+        this.lerp(this.grad(p[AA + 1], x, y, z - 1), this.grad(p[BA + 1], x - 1, y, z - 1), u),
+        this.lerp(this.grad(p[AB + 1], x, y - 1, z - 1), this.grad(p[BB + 1], x - 1, y - 1, z - 1), u), v), w);
+  }
+  fbm(x, y, oct = 4, lac = 2, gain = 0.5, scale = 1) {
+    let f = scale, a = 1, s = 0, n = 0;
+    for (let i = 0; i < oct; i++) { s += this.noise(x * f, y * f) * a; n += a; a *= gain; f *= lac; }
+    return s / n;
+  }
+  fbm3(x, y, z, oct = 3) {
+    let f = 1, a = 1, s = 0, n = 0;
+    for (let i = 0; i < oct; i++) { s += this.noise(x * f, y * f, z * f) * a; n += a; a *= 0.5; f *= 2; }
+    return s / n;
+  }
+}
+
+const noise = new Perlin(SEED);
+const noise2 = new Perlin(SEED ^ 0x12345);
+const noise3 = new Perlin(SEED ^ 0xabcde);
+
+/* ============================================================
+   纹理图集（程序生成）
+   ============================================================ */
+
+const TILE = 16, COLS = 8, ROWS = 4;
+
+function buildAtlas() {
+  const canvas = document.createElement('canvas');
+  canvas.width = TILE * COLS;
+  canvas.height = TILE * ROWS;
+  const ctx = canvas.getContext('2d');
+  ctx.fillStyle = '#ff00ff';
+  ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+  const rng = mulberry32(7331);
+  const r = () => rng();
+  const pick = a => a[Math.floor(r() * a.length)];
+
+  function tile(idx, fn) {
+    const cx = (idx % COLS) * TILE;
+    const cy = Math.floor(idx / COLS) * TILE;
+    ctx.save();
+    ctx.translate(cx, cy);
+    fn(ctx);
+    ctx.restore();
+  }
+  function px(x, y, c) { ctx.fillStyle = c; ctx.fillRect(x, y, 1, 1); }
+  function fillNoise(cols) {
+    for (let y = 0; y < TILE; y++)
+      for (let x = 0; x < TILE; x++) {
+        ctx.fillStyle = pick(cols);
+        ctx.fillRect(x, y, 1, 1);
+      }
+  }
+  function spots(count, cs, sz = 1) {
+    for (let i = 0; i < count; i++) {
+      ctx.fillStyle = typeof cs === 'string' ? cs : pick(cs);
+      ctx.fillRect(Math.floor(r() * TILE), Math.floor(r() * TILE), sz, sz);
+    }
+  }
+
+  // GRASS TOP
+  tile(T.GRASS_TOP, () => {
+    fillNoise(['#5fa632', '#6ab83a', '#549929', '#7bc545', '#4e8c25']);
+    spots(2, '#dde8a0');
+    spots(3, '#c8d885');
+  });
+  // GRASS SIDE
+  tile(T.GRASS_SIDE, () => {
+    fillNoise(['#8b6240', '#7c5635', '#9a6e4a', '#6c4a2b']);
+    for (let x = 0; x < TILE; x++) {
+      const h = 2 + Math.floor(r() * 3);
+      for (let y = 0; y < h; y++)
+        px(x, y, pick(['#5fa632', '#6ab83a', '#7bc545', '#549929']));
+    }
+    for (let x = 0; x < TILE; x++) {
+      if (r() < 0.3) px(x, 3 + Math.floor(r() * 2), pick(['#6ab83a', '#549929']));
+    }
+  });
+  // DIRT
+  tile(T.DIRT, () => {
+    fillNoise(['#8b6240', '#7c5635', '#9a6e4a', '#6c4a2b', '#a07a55']);
+    spots(4, '#5a3820');
+  });
+  // STONE
+  tile(T.STONE, () => {
+    fillNoise(['#7d7d7d', '#878787', '#737373', '#909090', '#6a6a6a']);
+    spots(6, '#5d5d5d');
+    spots(3, '#a0a0a0');
+  });
+  // SAND
+  tile(T.SAND, () => {
+    fillNoise(['#dcce8b', '#d2c281', '#e3d693', '#c8b878', '#e8da9a']);
+    spots(8, '#b8a868');
+  });
+  // LOG TOP — 同心年轮
+  tile(T.LOG_TOP, () => {
+    fillNoise(['#8b6635', '#7a5a2f']);
+    const cx = 7.5, cy = 7.5;
+    for (let y = 0; y < TILE; y++)
+      for (let x = 0; x < TILE; x++) {
+        const d = Math.sqrt((x - cx) ** 2 + (y - cy) ** 2);
+        const ring = (d * 1.8) | 0;
+        if (ring % 3 === 0) px(x, y, '#5d4225');
+        else if (ring % 3 === 1) px(x, y, '#9c7440');
+      }
+    ctx.fillStyle = '#4a3318';
+    ctx.fillRect(7, 7, 2, 2);
+  });
+  // LOG SIDE — 竖纹树皮
+  tile(T.LOG_SIDE, () => {
+    for (let x = 0; x < TILE; x++) {
+      const dark = r() < 0.4;
+      for (let y = 0; y < TILE; y++) {
+        const rr = r();
+        if (dark) px(x, y, rr < 0.4 ? '#3a2818' : rr < 0.7 ? '#4a3220' : '#5d4327');
+        else      px(x, y, rr < 0.3 ? '#5d4327' : rr < 0.7 ? '#6e4d2a' : '#7a5630');
+      }
+    }
+    const kx = 3 + Math.floor(r() * 10), ky = 3 + Math.floor(r() * 10);
+    ctx.fillStyle = '#2a1d10';
+    ctx.fillRect(kx, ky, 3, 2);
+    ctx.fillStyle = '#4a3220';
+    ctx.fillRect(kx + 1, ky + 2, 1, 1);
+  });
+  // LEAVES
+  tile(T.LEAVES, () => {
+    fillNoise(['#2b6e1a', '#3a8a23', '#4ca12c', '#256013', '#3d7a1f']);
+    spots(15, ['#5db437', '#6dc742', '#7ad84a']);
+    spots(8, '#173b08');
+    for (let i = 0; i < 6; i++) {
+      const cx = Math.floor(r() * TILE), cy = Math.floor(r() * TILE);
+      ctx.fillStyle = '#5db437';
+      ctx.fillRect(cx, cy, 2, 1);
+      ctx.fillRect(cx, cy + 1, 1, 1);
+    }
+  });
+  // PLANK
+  tile(T.PLANK, () => {
+    fillNoise(['#b88550', '#a87644', '#c89360', '#9a6638', '#a87a48']);
+    for (const y of [3, 8, 12]) {
+      for (let x = 0; x < TILE; x++) px(x, y, '#6e4823');
+      for (let x = 0; x < TILE; x++) px(x, y + 1, '#8a5e30');
+    }
+    spots(8, '#7a5128');
+    spots(3, '#d2a070');
+  });
+  // COBBLE
+  tile(T.COBBLE, () => {
+    fillNoise(['#3a3a3a', '#444', '#505050']);
+    const stones = [[1,1,5,4], [7,1,6,4], [1,6,4,4], [6,6,4,3], [11,6,4,4],
+                    [1,11,5,4], [7,11,4,3], [12,11,3,4]];
+    for (const [sx, sy, sw, sh] of stones) {
+      for (let y = sy; y < sy + sh && y < TILE; y++)
+        for (let x = sx; x < sx + sw && x < TILE; x++) {
+          const rr = r();
+          px(x, y, rr < 0.25 ? '#909090' : rr < 0.6 ? '#7d7d7d' : rr < 0.85 ? '#6a6a6a' : '#5d5d5d');
+        }
+      for (let x = sx; x < sx + sw && x < TILE; x++) px(x, sy, '#a0a0a0');
+      for (let y = sy; y < sy + sh && y < TILE; y++) px(sx, y, '#a0a0a0');
+    }
+  });
+  // GLASS
+  tile(T.GLASS, () => {
+    ctx.clearRect(0, 0, TILE, TILE);
+    ctx.fillStyle = 'rgba(180, 220, 240, 0.55)';
+    ctx.fillRect(0, 0, TILE, 1); ctx.fillRect(0, TILE - 1, TILE, 1);
+    ctx.fillRect(0, 0, 1, TILE); ctx.fillRect(TILE - 1, 0, 1, TILE);
+    ctx.fillStyle = 'rgba(200, 230, 245, 0.12)';
+    ctx.fillRect(1, 1, TILE - 2, TILE - 2);
+    ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
+    ctx.fillRect(2, 1, 3, 1); ctx.fillRect(1, 2, 1, 3);
+    ctx.fillStyle = 'rgba(255, 255, 255, 0.35)';
+    ctx.fillRect(11, 13, 3, 1); ctx.fillRect(13, 11, 1, 2);
+  });
+  // GOLD
+  tile(T.GOLD, () => {
+    fillNoise(['#f5d030', '#ffe056', '#e1bf28', '#d4ad1c', '#f0c428']);
+    for (let i = 0; i < TILE; i++) {
+      px(i, i, '#fff3a0');
+      if (i > 0) px(i, i - 1, '#fffabe');
+    }
+    spots(4, '#a8841a');
+    spots(2, '#ffffd0');
+  });
+  // OBSIDIAN
+  tile(T.OBSIDIAN, () => {
+    fillNoise(['#0a0a18', '#10102a', '#0c0c25', '#161636']);
+    spots(12, '#4a2270');
+    spots(5, '#7a4ab0');
+    spots(2, '#a878d0');
+    for (let i = 0; i < 5; i++) {
+      const x = Math.floor(r() * TILE);
+      const y = Math.floor(r() * TILE);
+      px(x, y, '#252550');
+      if (x + 1 < TILE) px(x + 1, y, '#1a1a3a');
+    }
+  });
+  // CRYSTAL
+  tile(T.CRYSTAL, () => {
+    fillNoise(['#5be0e8', '#3ec8d6', '#268f9c', '#1d6f7c']);
+    for (let y = 0; y < TILE; y++)
+      for (let x = 0; x < TILE; x++) {
+        const dx = x - 7.5, dy = y - 7.5;
+        const d = Math.abs(dx) + Math.abs(dy);
+        if (d < 3) px(x, y, '#cefcff');
+        else if (d < 5) px(x, y, '#7fe9ee');
+        else if (d < 7) px(x, y, '#5be0e8');
+        else if (d > 9) px(x, y, '#1d6f7c');
+      }
+    spots(4, '#ffffff');
+  });
+  // BEDROCK
+  tile(T.BEDROCK, () => {
+    fillNoise(['#2a2a2a', '#3a3a3a', '#1a1a1a', '#444', '#252525']);
+    for (let i = 0; i < 4; i++) {
+      const x = Math.floor(r() * (TILE - 3));
+      const y = Math.floor(r() * (TILE - 3));
+      ctx.fillStyle = '#1a1a1a';
+      ctx.fillRect(x, y, 3, 2);
+      ctx.fillStyle = '#101010';
+      px(x, y, '#0a0a0a');
+    }
+  });
+  // BRICK
+  tile(T.BRICK, () => {
+    fillNoise(['#9c4733', '#8c4030', '#a04a35', '#7a3625']);
+    ctx.fillStyle = '#d6c898';
+    ctx.fillRect(0, 4, TILE, 1); ctx.fillRect(0, 9, TILE, 1); ctx.fillRect(0, 14, TILE, 1);
+    ctx.fillRect(8, 0, 1, 4); ctx.fillRect(8, 10, 1, 4);
+    ctx.fillRect(4, 5, 1, 4); ctx.fillRect(12, 5, 1, 4);
+    ctx.fillRect(4, 15, 1, 1); ctx.fillRect(12, 15, 1, 1);
+    for (let i = 0; i < 10; i++) {
+      const x = Math.floor(r() * TILE);
+      const y = Math.floor(r() * TILE);
+      if ([4, 9, 14].includes(y)) continue;
+      px(x, y, r() < 0.5 ? '#7a3625' : '#b85540');
+    }
+  });
+  // MOSS — 苔石
+  tile(T.MOSS, () => {
+    fillNoise(['#3a3a3a', '#444', '#505050']);
+    const stones = [[1,1,5,4], [7,1,6,4], [1,6,4,4], [6,6,4,3], [11,6,4,4],
+                    [1,11,5,4], [7,11,4,3], [12,11,3,4]];
+    for (const [sx, sy, sw, sh] of stones) {
+      for (let y = sy; y < sy + sh && y < TILE; y++)
+        for (let x = sx; x < sx + sw && x < TILE; x++) {
+          const rr = r();
+          px(x, y, rr < 0.4 ? '#5d6d3d' : rr < 0.7 ? '#6a7d45' : '#4d5530');
+        }
+    }
+    spots(10, ['#7c9853', '#8aab5d']);
+    spots(5, '#3a4525');
+  });
+  // BOOKSHELF
+  tile(T.BOOKSHELF, () => {
+    fillNoise(['#b88550', '#a87644', '#9a6638']);
+    ctx.fillStyle = '#6e4823';
+    ctx.fillRect(0, 0, TILE, 3); ctx.fillRect(0, 13, TILE, 3);
+    ctx.fillStyle = '#8a5e30';
+    ctx.fillRect(0, 2, TILE, 1); ctx.fillRect(0, 13, TILE, 1);
+    const bookCols = ['#7a2424', '#1a4a7a', '#7a5a1a', '#3a7a2a', '#5a2a7a', '#7a3a4a', '#2a6a7a', '#a05a2a'];
+    let x = 0;
+    for (let b = 0; b < 7; b++) {
+      const c = bookCols[Math.floor(r() * bookCols.length)];
+      const w = 1 + Math.floor(r() * 2);
+      ctx.fillStyle = c;
+      ctx.fillRect(x, 4, w, 8);
+      ctx.fillStyle = 'rgba(255,255,255,0.18)';
+      ctx.fillRect(x, 4, 1, 8);
+      ctx.fillStyle = '#ddd6a0';
+      ctx.fillRect(x, 6, w, 1);
+      ctx.fillRect(x, 10, w, 1);
+      x += w + 1;
+      if (x >= TILE) break;
+    }
+  });
+  // LAVA
+  tile(T.LAVA, () => {
+    fillNoise(['#ff6a00', '#ff8a1a', '#e84a00', '#c83000']);
+    for (let i = 0; i < 12; i++) {
+      ctx.fillStyle = pick(['#ffd44a', '#ffec70']);
+      ctx.fillRect(Math.floor(r() * TILE), Math.floor(r() * TILE), 1 + Math.floor(r() * 2), 1);
+    }
+    spots(8, '#8a2000');
+    spots(3, '#5a0a00');
+  });
+  // ICE
+  tile(T.ICE, () => {
+    fillNoise(['#a0d8f0', '#b4e2f5', '#88c8e8', '#c8eaf8']);
+    ctx.fillStyle = '#ffffff';
+    ctx.fillRect(2, 3, 4, 1); ctx.fillRect(6, 3, 1, 3);
+    ctx.fillRect(8, 8, 5, 1); ctx.fillRect(12, 8, 1, 4);
+    ctx.fillRect(3, 11, 3, 1); ctx.fillRect(5, 11, 1, 3);
+    spots(6, '#d4f0fa');
+  });
+  // WATER
+  tile(T.WATER, () => {
+    fillNoise(['#2a6cb8', '#3678c4', '#1f5fae', '#4288d0']);
+    for (let i = 0; i < 6; i++) {
+      const y = Math.floor(r() * TILE);
+      ctx.fillStyle = '#5fa8e0';
+      for (let x = 0; x < TILE; x++) if (r() < 0.5) px(x, y, '#5fa8e0');
+    }
+    spots(8, '#7ec0f0');
+    spots(2, '#a8d8f8');
+  });
+  // GOLD ORE
+  tile(T.GOLD_ORE, () => {
+    fillNoise(['#7d7d7d', '#878787', '#6a6a6a']);
+    const clusters = [[3, 4], [9, 6], [5, 11], [11, 12]];
+    for (const [cx, cy] of clusters) {
+      ctx.fillStyle = '#f5d030';
+      px(cx, cy, '#f5d030');
+      if (r() < 0.7) px(cx + 1, cy, '#ffe056');
+      if (r() < 0.7) px(cx, cy + 1, '#e1bf28');
+      if (r() < 0.5) px(cx + 1, cy + 1, '#fff3a0');
+    }
+  });
+  // CRYSTAL ORE
+  tile(T.CRYSTAL_ORE, () => {
+    fillNoise(['#7d7d7d', '#878787', '#6a6a6a']);
+    const clusters = [[4, 3], [10, 5], [6, 10], [12, 11]];
+    for (const [cx, cy] of clusters) {
+      ctx.fillStyle = '#7fe9ee';
+      px(cx, cy, '#5be0e8');
+      if (r() < 0.7) px(cx + 1, cy, '#7fe9ee');
+      if (r() < 0.7) px(cx, cy + 1, '#3ec8d6');
+      if (r() < 0.5) px(cx + 1, cy + 1, '#cefcff');
+    }
+  });
+  // MAGMA
+  tile(T.MAGMA, () => {
+    fillNoise(['#4a1a00', '#5d2200', '#3a1500']);
+    for (let i = 0; i < 5; i++) {
+      const x = Math.floor(r() * TILE);
+      const y = Math.floor(r() * TILE);
+      const len = 2 + Math.floor(r() * 3);
+      ctx.fillStyle = '#ff8a1a';
+      for (let j = 0; j < len; j++) {
+        if (x + j < TILE) px(x + j, y, '#ff6a00');
+        if (x + j < TILE && y + 1 < TILE) px(x + j, y + 1, '#c83000');
+      }
+    }
+    spots(3, '#ffe070');
+  });
+  // SNOW
+  tile(T.SNOW, () => {
+    fillNoise(['#f0f4fa', '#e6eef8', '#fafcff', '#dde8f4']);
+    spots(8, '#ffffff');
+    spots(4, '#c8d4e4');
+  });
+  // MARBLE
+  tile(T.MARBLE, () => {
+    fillNoise(['#e0e0e8', '#d4d4dc', '#ececf2']);
+    for (let i = 0; i < 3; i++) {
+      const sx = Math.floor(r() * TILE);
+      let x = sx, y = Math.floor(r() * TILE);
+      for (let s = 0; s < 12; s++) {
+        if (x < 0 || x >= TILE || y < 0 || y >= TILE) break;
+        px(x, y, r() < 0.5 ? '#a0a0b0' : '#888898');
+        x += r() < 0.5 ? 1 : 0;
+        y += r() < 0.5 ? 1 : -1;
+      }
+    }
+    spots(3, '#f8f8fc');
+  });
+  // RUNE
+  tile(T.RUNE, () => {
+    fillNoise(['#e0e0e8', '#d4d4dc', '#ececf2']);
+    for (let i = 0; i < 2; i++) {
+      let x = Math.floor(r() * TILE), y = Math.floor(r() * TILE);
+      for (let s = 0; s < 8; s++) {
+        if (x < 0 || x >= TILE || y < 0 || y >= TILE) break;
+        px(x, y, '#888898');
+        x += r() < 0.5 ? 1 : 0;
+        y += r() < 0.5 ? 1 : -1;
+      }
+    }
+    ctx.fillStyle = '#5be0e8';
+    ctx.fillRect(5, 4, 6, 1);
+    ctx.fillRect(5, 4, 1, 8);
+    ctx.fillRect(10, 4, 1, 8);
+    ctx.fillRect(5, 11, 6, 1);
+    ctx.fillRect(7, 7, 2, 1);
+    ctx.fillStyle = '#9fffff';
+    ctx.fillRect(5, 4, 6, 1);
+    ctx.fillRect(5, 11, 6, 1);
+  });
+
+  const texture = new THREE.CanvasTexture(canvas);
+  texture.magFilter = THREE.NearestFilter;
+  texture.minFilter = THREE.NearestFilter;
+  texture.flipY = false;
+  texture.colorSpace = THREE.SRGBColorSpace;
+  return { texture, canvas };
+}
+
+const atlas = buildAtlas();
+
+// 单个方块预览图（用于 hotbar）
+function makeBlockIcon(blockId) {
+  const canvas = document.createElement('canvas');
+  const W = 48; canvas.width = W; canvas.height = W;
+  const ctx = canvas.getContext('2d');
+  ctx.imageSmoothingEnabled = false;
+  const [topT, botT, sideT] = FACE_TEX[blockId];
+  function drawFace(tex, points) {
+    const cx = (tex % COLS) * TILE, cy = Math.floor(tex / COLS) * TILE;
+    const offsCanvas = atlas.canvas;
+    const tmp = document.createElement('canvas');
+    tmp.width = TILE; tmp.height = TILE;
+    tmp.getContext('2d').drawImage(offsCanvas, cx, cy, TILE, TILE, 0, 0, TILE, TILE);
+    ctx.save();
+    ctx.beginPath();
+    ctx.moveTo(points[0][0], points[0][1]);
+    for (let i = 1; i < points.length; i++) ctx.lineTo(points[i][0], points[i][1]);
+    ctx.closePath();
+    ctx.clip();
+    ctx.drawImage(tmp,
+      Math.min(...points.map(p => p[0])), Math.min(...points.map(p => p[1])),
+      Math.max(...points.map(p => p[0])) - Math.min(...points.map(p => p[0])),
+      Math.max(...points.map(p => p[1])) - Math.min(...points.map(p => p[1])));
+    ctx.restore();
+  }
+  const cx = W / 2;
+  ctx.fillStyle = 'rgba(255,255,255,1)';
+  drawFace(topT, [[cx, 4], [W - 4, 16], [cx, 28], [4, 16]]);
+  ctx.globalAlpha = 0.78;
+  drawFace(sideT, [[4, 16], [cx, 28], [cx, W - 4], [4, W - 18]]);
+  ctx.globalAlpha = 0.62;
+  drawFace(sideT, [[cx, 28], [W - 4, 16], [W - 4, W - 18], [cx, W - 4]]);
+  ctx.globalAlpha = 1;
+  return canvas;
+}
+
+/* ============================================================
+   面方向数据 + AO
+   ============================================================ */
+
+// 面索引：0=+x, 1=-x, 2=+y, 3=-y, 4=+z, 5=-z
+// 顶点 CCW（从外侧看）以使 FrontSide 正面渲染
+const FACES = [
+  { // +x
+    n: [1, 0, 0],
+    v: [[1,1,0], [1,1,1], [1,0,1], [1,0,0]],
+    u: [[1,0], [0,0], [0,1], [1,1]],
+  },
+  { // -x
+    n: [-1, 0, 0],
+    v: [[0,1,1], [0,1,0], [0,0,0], [0,0,1]],
+    u: [[1,0], [0,0], [0,1], [1,1]],
+  },
+  { // +y
+    n: [0, 1, 0],
+    v: [[0,1,1], [1,1,1], [1,1,0], [0,1,0]],
+    u: [[0,1], [1,1], [1,0], [0,0]],
+  },
+  { // -y
+    n: [0, -1, 0],
+    v: [[0,0,0], [1,0,0], [1,0,1], [0,0,1]],
+    u: [[0,0], [1,0], [1,1], [0,1]],
+  },
+  { // +z
+    n: [0, 0, 1],
+    v: [[1,1,1], [0,1,1], [0,0,1], [1,0,1]],
+    u: [[1,0], [0,0], [0,1], [1,1]],
+  },
+  { // -z
+    n: [0, 0, -1],
+    v: [[0,1,0], [1,1,0], [1,0,0], [0,0,0]],
+    u: [[1,0], [0,0], [0,1], [1,1]],
+  },
+];
+
+function aoOffsets(faceIdx, vertLocal) {
+  const sx = vertLocal[0] === 1 ? 1 : -1;
+  const sy = vertLocal[1] === 1 ? 1 : -1;
+  const sz = vertLocal[2] === 1 ? 1 : -1;
+  switch (faceIdx) {
+    case 0: return [[1, 0, sz], [1, sy, 0], [1, sy, sz]];
+    case 1: return [[-1, 0, sz], [-1, sy, 0], [-1, sy, sz]];
+    case 2: return [[sx, 1, 0], [0, 1, sz], [sx, 1, sz]];
+    case 3: return [[sx, -1, 0], [0, -1, sz], [sx, -1, sz]];
+    case 4: return [[sx, 0, 1], [0, sy, 1], [sx, sy, 1]];
+    case 5: return [[sx, 0, -1], [0, sy, -1], [sx, sy, -1]];
+  }
+}
+
+const FACE_SHADE = [0.82, 0.82, 1.0, 0.55, 0.72, 0.92];
+
+/* ============================================================
+   世界数据
+   ============================================================ */
+
+const chunks = new Map();
+function chunkKey(cx, cz) { return cx + ',' + cz; }
+
+class Chunk {
+  constructor(cx, cz) {
+    this.cx = cx; this.cz = cz;
+    this.blocks = new Uint8Array(CHUNK * CHUNK * WORLD_H);
+    this.mesh = null;
+    this.transMesh = null;
+    this.dirty = true;
+    this.generated = false;
+  }
+  idx(lx, y, lz) { return lx + lz * CHUNK + y * CHUNK * CHUNK; }
+  get(lx, y, lz) { return this.blocks[this.idx(lx, y, lz)]; }
+  set(lx, y, lz, id) {
+    this.blocks[this.idx(lx, y, lz)] = id;
+    this.dirty = true;
+  }
+}
+
+function getChunk(cx, cz) {
+  return chunks.get(chunkKey(cx, cz));
+}
+
+function getBlock(x, y, z) {
+  if (y < 0 || y >= WORLD_H) return AIR;
+  const cx = Math.floor(x / CHUNK), cz = Math.floor(z / CHUNK);
+  const c = getChunk(cx, cz);
+  if (!c) return AIR;
+  const lx = ((x % CHUNK) + CHUNK) % CHUNK;
+  const lz = ((z % CHUNK) + CHUNK) % CHUNK;
+  return c.get(lx, y, lz);
+}
+
+function setBlock(x, y, z, id, markNeighborDirty = true) {
+  if (y < 0 || y >= WORLD_H) return;
+  const cx = Math.floor(x / CHUNK), cz = Math.floor(z / CHUNK);
+  const c = getChunk(cx, cz);
+  if (!c) return;
+  const lx = ((x % CHUNK) + CHUNK) % CHUNK;
+  const lz = ((z % CHUNK) + CHUNK) % CHUNK;
+  c.set(lx, y, lz, id);
+  if (markNeighborDirty) {
+    if (lx === 0) { const n = getChunk(cx - 1, cz); if (n) n.dirty = true; }
+    if (lx === CHUNK - 1) { const n = getChunk(cx + 1, cz); if (n) n.dirty = true; }
+    if (lz === 0) { const n = getChunk(cx, cz - 1); if (n) n.dirty = true; }
+    if (lz === CHUNK - 1) { const n = getChunk(cx, cz + 1); if (n) n.dirty = true; }
+  }
+}
+
+for (let cx = 0; cx < WORLD_W; cx++)
+  for (let cz = 0; cz < WORLD_W; cz++)
+    chunks.set(chunkKey(cx, cz), new Chunk(cx, cz));
+
+/* ============================================================
+   地形生成
+   ============================================================ */
+
+function heightAt(x, z) {
+  const continental = noise.fbm(x * 0.005, z * 0.005, 4, 2, 0.55) * 0.5 + 0.5;
+  const hill = noise.fbm(x * 0.015, z * 0.015, 5, 2, 0.5) * 0.5 + 0.5;
+  const detail = noise2.fbm(x * 0.05, z * 0.05, 3, 2, 0.5) * 0.5 + 0.5;
+  let h = continental * 18 + hill * 18 + detail * 6 + 14;
+  const ridge = 1 - Math.abs(noise.noise(x * 0.008, z * 0.008));
+  if (ridge > 0.85) h += (ridge - 0.85) * 80;
+  return Math.floor(h);
+}
+
+function biomeAt(x, z) {
+  const t = noise2.fbm(x * 0.006, z * 0.006, 3, 2, 0.5);
+  const m = noise3.fbm(x * 0.006, z * 0.006, 3, 2, 0.5);
+  if (t > 0.2) return 'desert';
+  if (t < -0.2 && m < 0) return 'snowy';
+  if (m > 0.15) return 'forest';
+  return 'plains';
+}
+
+function generateTerrainColumn(x, z) {
+  const h = heightAt(x, z);
+  const biome = biomeAt(x, z);
+
+  for (let y = 0; y < 2; y++) setBlock(x, y, z, BEDROCK, false);
+  for (let y = 2; y < h - 4; y++) setBlock(x, y, z, STONE, false);
+
+  for (let y = 4; y < h - 4; y++) {
+    const r = noise3.noise(x * 0.3, y * 0.3, z * 0.3);
+    if (r > 0.6 && y < 24) setBlock(x, y, z, GOLD_ORE, false);
+    else if (r < -0.62 && y < 20) setBlock(x, y, z, CRYSTAL_ORE, false);
+  }
+
+  if (biome === 'desert' || h < SEA + 1) {
+    for (let y = h - 4; y < h; y++) setBlock(x, y, z, SAND, false);
+  } else if (biome === 'snowy') {
+    for (let y = h - 4; y < h - 1; y++) setBlock(x, y, z, DIRT, false);
+    setBlock(x, h - 1, z, GRASS, false);
+    setBlock(x, h, z, SNOW, false);
+  } else {
+    for (let y = h - 4; y < h - 1; y++) setBlock(x, y, z, DIRT, false);
+    setBlock(x, h - 1, z, GRASS, false);
+  }
+
+  if (h < SEA) {
+    for (let y = h; y < SEA; y++) setBlock(x, y, z, WATER, false);
+  }
+
+  // 3D 洞穴：简单噪声雕刻（仅深层）
+  for (let y = 6; y < h - 4; y++) {
+    const n = noise.fbm3(x * 0.05, y * 0.07, z * 0.05, 2);
+    if (Math.abs(n) > 0.45) setBlock(x, y, z, AIR, false);
+  }
+}
+
+/* ============================================================
+   植被 & 结构
+   ============================================================ */
+
+function findGround(x, z) {
+  for (let y = WORLD_H - 1; y >= 0; y--) {
+    const b = getBlock(x, y, z);
+    if (b !== AIR && b !== WATER) return y;
+  }
+  return 0;
+}
+
+function placeTree(x, z, type = 'oak') {
+  const gy = findGround(x, z);
+  const top = getBlock(x, gy, z);
+  if (top !== GRASS && top !== DIRT && top !== SAND) return;
+
+  if (type === 'oak') {
+    const h = 4 + Math.floor(Math.abs(noise.noise(x * 0.7, z * 0.7)) * 3);
+    for (let y = 1; y <= h; y++) setBlock(x, gy + y, z, LOG);
+    for (let dy = -2; dy <= 2; dy++)
+      for (let dx = -2; dx <= 2; dx++)
+        for (let dz = -2; dz <= 2; dz++) {
+          const d = dx * dx + dy * dy + dz * dz;
+          if (d > 7) continue;
+          if (d === 0 && dy < 1) continue;
+          const yy = gy + h + dy;
+          const xx = x + dx, zz = z + dz;
+          if (getBlock(xx, yy, zz) === AIR) setBlock(xx, yy, zz, LEAVES);
+        }
+  } else if (type === 'pine') {
+    const h = 8 + Math.floor(Math.abs(noise.noise(x, z)) * 4);
+    for (let y = 1; y <= h; y++) setBlock(x, gy + y, z, LOG);
+    for (let layer = 0; layer < 5; layer++) {
+      const r = 3 - Math.floor(layer * 0.6);
+      const yy = gy + h - layer * 2;
+      for (let dx = -r; dx <= r; dx++)
+        for (let dz = -r; dz <= r; dz++) {
+          if (Math.abs(dx) + Math.abs(dz) > r + 1) continue;
+          if (dx === 0 && dz === 0 && layer > 0) continue;
+          const b = getBlock(x + dx, yy, z + dz);
+          if (b === AIR) setBlock(x + dx, yy, z + dz, LEAVES);
+        }
+    }
+  } else if (type === 'palm') {
+    const h = 6;
+    for (let y = 1; y <= h; y++) setBlock(x, gy + y, z, LOG);
+    for (const [dx, dz] of [[2, 0], [-2, 0], [0, 2], [0, -2], [1, 1], [-1, 1], [1, -1], [-1, -1]]) {
+      const yy = gy + h + 1;
+      if (getBlock(x + dx, yy, z + dz) === AIR) setBlock(x + dx, yy, z + dz, LEAVES);
+      if (getBlock(x + Math.sign(dx), yy, z + Math.sign(dz)) === AIR) setBlock(x + Math.sign(dx), yy, z + Math.sign(dz), LEAVES);
+    }
+    if (getBlock(x, gy + h + 1, z) === AIR) setBlock(x, gy + h + 1, z, LEAVES);
+  }
+}
+
+function scatterTrees() {
+  const rng = mulberry32(SEED ^ 0xdead);
+  for (let x = 4; x < WORLD_SIZE - 4; x += 1) {
+    for (let z = 4; z < WORLD_SIZE - 4; z += 1) {
+      const biome = biomeAt(x, z);
+      const gy = findGround(x, z);
+      if (gy < SEA) continue;
+      const surface = getBlock(x, gy, z);
+      if (surface !== GRASS) continue;
+      const treeChance = biome === 'forest' ? 0.04 : biome === 'plains' ? 0.005 : 0;
+      if (rng() < treeChance) {
+        const t = biome === 'forest' && rng() < 0.4 ? 'pine' : 'oak';
+        placeTree(x, z, t);
+      }
+    }
+  }
+}
+
+/* ===== 神话结构生成器 ===== */
+
+function safeSet(x, y, z, id) {
+  if (x < 0 || x >= WORLD_SIZE || z < 0 || z >= WORLD_SIZE) return;
+  if (y < 0 || y >= WORLD_H) return;
+  setBlock(x, y, z, id);
+}
+
+function fillBox(x0, y0, z0, x1, y1, z1, id) {
+  const ax = Math.min(x0, x1), bx = Math.max(x0, x1);
+  const ay = Math.min(y0, y1), by = Math.max(y0, y1);
+  const az = Math.min(z0, z1), bz = Math.max(z0, z1);
+  for (let y = ay; y <= by; y++)
+    for (let z = az; z <= bz; z++)
+      for (let x = ax; x <= bx; x++)
+        safeSet(x, y, z, id);
+}
+
+function hollowBox(x0, y0, z0, x1, y1, z1, id) {
+  const ax = Math.min(x0, x1), bx = Math.max(x0, x1);
+  const ay = Math.min(y0, y1), by = Math.max(y0, y1);
+  const az = Math.min(z0, z1), bz = Math.max(z0, z1);
+  for (let y = ay; y <= by; y++)
+    for (let z = az; z <= bz; z++)
+      for (let x = ax; x <= bx; x++) {
+        const edge = (x === ax || x === bx) + (y === ay || y === by) + (z === az || z === bz);
+        if (edge >= 1) safeSet(x, y, z, id);
+      }
+}
+
+function clearBox(x0, y0, z0, x1, y1, z1) { fillBox(x0, y0, z0, x1, y1, z1, AIR); }
+
+function cylinderY(cx, cz, y0, y1, r, id, hollow = false, fillBelow = false) {
+  for (let y = y0; y <= y1; y++)
+    for (let dz = -r; dz <= r; dz++)
+      for (let dx = -r; dx <= r; dx++) {
+        const d2 = dx * dx + dz * dz;
+        if (d2 > r * r) continue;
+        if (hollow && d2 < (r - 1) * (r - 1)) continue;
+        safeSet(cx + dx, y, cz + dz, id);
+      }
+}
+
+function sphere(cx, cy, cz, r, id, hollow = false) {
+  for (let dy = -r; dy <= r; dy++)
+    for (let dz = -r; dz <= r; dz++)
+      for (let dx = -r; dx <= r; dx++) {
+        const d2 = dx * dx + dy * dy + dz * dz;
+        if (d2 > r * r) continue;
+        if (hollow && d2 < (r - 1) * (r - 1)) continue;
+        safeSet(cx + dx, cy + dy, cz + dz, id);
+      }
+}
+
+function levelGround(cx, cz, rx, rz, baseId = GRASS) {
+  let totalH = 0, n = 0;
+  for (let dx = -rx; dx <= rx; dx++)
+    for (let dz = -rz; dz <= rz; dz++) {
+      totalH += findGround(cx + dx, cz + dz);
+      n++;
+    }
+  const avg = Math.round(totalH / n);
+  for (let dx = -rx; dx <= rx; dx++)
+    for (let dz = -rz; dz <= rz; dz++) {
+      const x = cx + dx, z = cz + dz;
+      const gy = findGround(x, z);
+      for (let y = avg + 1; y <= gy; y++) safeSet(x, y, z, AIR);
+      for (let y = gy + 1; y <= avg; y++) safeSet(x, y, z, baseId);
+      safeSet(x, avg, z, baseId);
+    }
+  return avg;
+}
+
+/* --- 1. 天空浮空城堡 --- */
+function buildSkyCastle(cx, cz, baseY) {
+  for (let dx = -22; dx <= 22; dx++)
+    for (let dz = -22; dz <= 22; dz++) {
+      const d = Math.sqrt(dx * dx + dz * dz);
+      if (d > 22) continue;
+      const thick = Math.max(1, Math.floor(6 - d * 0.22));
+      for (let dy = -thick; dy <= 0; dy++) {
+        const id = dy === 0 ? GRASS : (dy === -thick ? STONE : DIRT);
+        safeSet(cx + dx, baseY + dy, cz + dz, id);
+      }
+      if (d < 18 && Math.abs(noise.noise(dx * 0.3, dz * 0.3)) > 0.45) {
+        safeSet(cx + dx, baseY - thick - 1, cz + dz, STONE);
+      }
+    }
+
+  hollowBox(cx - 14, baseY + 1, cz - 14, cx + 14, baseY + 1, cz + 14, MARBLE);
+  fillBox(cx - 14, baseY + 1, cz - 14, cx + 14, baseY + 1, cz + 14, MARBLE);
+
+  for (let dx = -14; dx <= 14; dx++) {
+    for (let h = 0; h < 6; h++) {
+      safeSet(cx + dx, baseY + 2 + h, cz - 14, MARBLE);
+      safeSet(cx + dx, baseY + 2 + h, cz + 14, MARBLE);
+    }
+  }
+  for (let dz = -14; dz <= 14; dz++) {
+    for (let h = 0; h < 6; h++) {
+      safeSet(cx - 14, baseY + 2 + h, cz + dz, MARBLE);
+      safeSet(cx + 14, baseY + 2 + h, cz + dz, MARBLE);
+    }
+  }
+  for (let dx = -14; dx <= 14; dx += 2) {
+    safeSet(cx + dx, baseY + 8, cz - 14, MARBLE);
+    safeSet(cx + dx, baseY + 8, cz + 14, MARBLE);
+  }
+  for (let dz = -14; dz <= 14; dz += 2) {
+    safeSet(cx - 14, baseY + 8, cz + dz, MARBLE);
+    safeSet(cx + 14, baseY + 8, cz + dz, MARBLE);
+  }
+
+  fillBox(cx - 2, baseY + 2, cz + 14, cx + 2, baseY + 6, cz + 14, AIR);
+  safeSet(cx - 2, baseY + 6, cz + 14, GOLD);
+  safeSet(cx + 2, baseY + 6, cz + 14, GOLD);
+  safeSet(cx - 1, baseY + 7, cz + 14, GOLD);
+  safeSet(cx + 1, baseY + 7, cz + 14, GOLD);
+  safeSet(cx, baseY + 7, cz + 14, RUNE);
+
+  const corners = [[-14, -14], [14, -14], [-14, 14], [14, 14]];
+  for (const [ox, oz] of corners) {
+    const tx = cx + ox, tz = cz + oz;
+    cylinderY(tx, tz, baseY + 2, baseY + 16, 3, MARBLE);
+    cylinderY(tx, tz, baseY + 4, baseY + 15, 2, AIR);
+    for (let k = 0; k < 5; k++) {
+      const r = 3 - k;
+      cylinderY(tx, tz, baseY + 17 + k, baseY + 17 + k, r, BRICK);
+    }
+    cylinderY(tx, tz, baseY + 22, baseY + 23, 1, GOLD);
+    safeSet(tx, baseY + 24, tz, CRYSTAL);
+    for (let h = 6; h < 14; h += 3) {
+      safeSet(tx + 2, baseY + h, tz, GLASS);
+      safeSet(tx - 2, baseY + h, tz, GLASS);
+      safeSet(tx, baseY + h, tz + 2, GLASS);
+      safeSet(tx, baseY + h, tz - 2, GLASS);
+    }
+  }
+
+  cylinderY(cx, cz, baseY + 2, baseY + 20, 5, MARBLE);
+  cylinderY(cx, cz, baseY + 4, baseY + 19, 4, AIR);
+  for (let h = 6; h < 18; h += 4) {
+    for (const d of [[5, 0], [-5, 0], [0, 5], [0, -5]]) {
+      safeSet(cx + d[0], baseY + h, cz + d[1], GLASS);
+      safeSet(cx + d[0], baseY + h + 1, cz + d[1], GLASS);
+    }
+  }
+  cylinderY(cx, cz, baseY + 21, baseY + 21, 6, GOLD);
+  for (let k = 0; k < 6; k++) {
+    const r = 5 - k;
+    if (r < 0) break;
+    cylinderY(cx, cz, baseY + 22 + k, baseY + 22 + k, r, GOLD);
+  }
+  for (let h = 28; h < 32; h++) safeSet(cx, baseY + h, cz, CRYSTAL);
+  safeSet(cx, baseY + 32, cz, CRYSTAL);
+
+  for (let dx = -13; dx <= 13; dx++)
+    for (let dz = -13; dz <= 13; dz++)
+      safeSet(cx + dx, baseY + 1, cz + dz, MARBLE);
+
+  fillBox(cx - 2, baseY + 2, cz - 2, cx + 2, baseY + 2, cz + 2, RUNE);
+  safeSet(cx, baseY + 3, cz, CRYSTAL);
+  safeSet(cx, baseY + 4, cz, CRYSTAL);
+
+  for (let i = 0; i < 14; i++) {
+    const sx = cx;
+    const sz = cz + 14 + i * 2;
+    const sy = baseY + 2 - i;
+    safeSet(sx - 1, sy, sz, MARBLE);
+    safeSet(sx, sy, sz, MARBLE);
+    safeSet(sx + 1, sy, sz, MARBLE);
+    if (i % 3 === 1) {
+      safeSet(sx + 2, sy + 1, sz, GOLD);
+    }
+  }
+}
+
+/* --- 2. 巫师塔 --- */
+function buildWizardTower(cx, cz) {
+  const gy = levelGround(cx, cz, 8, 8, GRASS);
+  cylinderY(cx, cz, gy + 1, gy + 28, 5, COBBLE);
+  cylinderY(cx, cz, gy + 2, gy + 27, 4, AIR);
+  for (let h = 1; h < 28; h++) {
+    const ang = h * 0.6;
+    const dx = Math.round(Math.cos(ang) * 5);
+    const dz = Math.round(Math.sin(ang) * 5);
+    safeSet(cx + dx, gy + h, cz + dz, BRICK);
+  }
+  for (let h = 1; h <= 3; h++) safeSet(cx, gy + h, cz + 5, AIR);
+  safeSet(cx, gy + 4, cz + 5, OBSIDIAN);
+  for (let h = 5; h < 26; h += 4) {
+    safeSet(cx + 5, gy + h, cz, GLASS);
+    safeSet(cx - 5, gy + h, cz, GLASS);
+    safeSet(cx, gy + h, cz + 5, GLASS);
+    safeSet(cx, gy + h, cz - 5, GLASS);
+  }
+  cylinderY(cx, cz, gy + 28, gy + 28, 6, COBBLE);
+  for (let dx = -6; dx <= 6; dx += 2) {
+    safeSet(cx + dx, gy + 29, cz - 6, COBBLE);
+    safeSet(cx + dx, gy + 29, cz + 6, COBBLE);
+  }
+  for (let dz = -6; dz <= 6; dz += 2) {
+    safeSet(cx - 6, gy + 29, cz + dz, COBBLE);
+    safeSet(cx + 6, gy + 29, cz + dz, COBBLE);
+  }
+  for (let k = 0; k < 8; k++) {
+    const r = 5 - k;
+    if (r < 0) break;
+    cylinderY(cx, cz, gy + 29 + k, gy + 29 + k, r, OBSIDIAN);
+  }
+  safeSet(cx, gy + 37, cz, CRYSTAL);
+  safeSet(cx, gy + 38, cz, CRYSTAL);
+  for (let h = 3; h < 26; h += 6) {
+    for (let dx = -4; dx <= 4; dx++) {
+      for (let dz = -4; dz <= 4; dz++) {
+        const onEdge = Math.abs(dx) === 4 || Math.abs(dz) === 4;
+        if (!onEdge) continue;
+        if ((dx === 0 && dz === 4) || (dx === 0 && dz === -4)) continue;
+        if (getBlock(cx + dx, gy + h, cz + dz) === AIR)
+          safeSet(cx + dx, gy + h, cz + dz, BOOKSHELF);
+      }
+    }
+  }
+  for (let h = 1; h < 28; h++) {
+    const ang = h * 0.7;
+    const dx = Math.round(Math.cos(ang) * 3);
+    const dz = Math.round(Math.sin(ang) * 3);
+    safeSet(cx + dx, gy + h, cz + dz, PLANK);
+  }
+  for (let dx = -5; dx <= 5; dx++)
+    for (let dz = -5; dz <= 5; dz++) {
+      if (dx * dx + dz * dz > 25) continue;
+      if (getBlock(cx + dx, gy + 28, cz + dz) === AIR)
+        safeSet(cx + dx, gy + 28, cz + dz, PLANK);
+    }
+}
+
+/* --- 3. 世界树 Yggdrasil --- */
+function buildYggdrasil(cx, cz) {
+  const gy = levelGround(cx, cz, 16, 16, GRASS);
+  for (let h = 1; h <= 42; h++) {
+    const radius = h < 8 ? 4 : h < 22 ? 3 : h < 32 ? 2 : 1;
+    for (let dx = -radius; dx <= radius; dx++)
+      for (let dz = -radius; dz <= radius; dz++) {
+        if (dx * dx + dz * dz > radius * radius) continue;
+        safeSet(cx + dx, gy + h, cz + dz, LOG);
+      }
+  }
+  for (let i = 0; i < 8; i++) {
+    const ang = (i / 8) * Math.PI * 2;
+    let x = cx, z = cz;
+    for (let s = 1; s < 18; s++) {
+      x = cx + Math.round(Math.cos(ang) * s);
+      z = cz + Math.round(Math.sin(ang) * s);
+      const yy = gy - Math.floor(s * 0.3);
+      const r = Math.max(0, 2 - Math.floor(s * 0.15));
+      for (let dx = -r; dx <= r; dx++)
+        for (let dz = -r; dz <= r; dz++)
+          safeSet(x + dx, yy, z + dz, LOG);
+    }
+  }
+  for (let dy = -10; dy <= 14; dy++) {
+    for (let dz = -16; dz <= 16; dz++) {
+      for (let dx = -16; dx <= 16; dx++) {
+        const d = (dx * dx) / (16 * 16) + (dy * dy) / (12 * 12) + (dz * dz) / (16 * 16);
+        if (d > 1) continue;
+        if (d < 0.6 && Math.abs(noise.noise(dx * 0.2, dy * 0.2, dz * 0.2)) > 0.4) continue;
+        const x = cx + dx, y = gy + 36 + dy, z = cz + dz;
+        if (getBlock(x, y, z) !== LOG && getBlock(x, y, z) === AIR)
+          safeSet(x, y, z, LEAVES);
+      }
+    }
+  }
+  for (let i = 0; i < 14; i++) {
+    const ang = noise.noise(i, i * 1.3) * Math.PI * 2;
+    const dist = 6 + Math.abs(noise.noise(i * 2)) * 8;
+    const x = cx + Math.round(Math.cos(ang) * dist);
+    const z = cz + Math.round(Math.sin(ang) * dist);
+    const y = gy + 36 + Math.round(noise.noise(i * 3) * 8);
+    if (getBlock(x, y, z) === LEAVES) safeSet(x, y, z, CRYSTAL);
+  }
+  for (let dx = -3; dx <= 3; dx++)
+    for (let dz = -3; dz <= 3; dz++) {
+      if (dx * dx + dz * dz > 9) continue;
+      safeSet(cx + dx + 8, gy, cz + dz + 8, AIR);
+      safeSet(cx + dx + 8, gy - 1, cz + dz + 8, WATER);
+      safeSet(cx + dx + 8, gy - 2, cz + dz + 8, COBBLE);
+    }
+}
+
+/* --- 4. 龙之黑曜石金字塔 --- */
+function buildDragonPyramid(cx, cz) {
+  const gy = levelGround(cx, cz, 18, 18, SAND);
+  const size = 16;
+  for (let k = 0; k < size; k++) {
+    const s = size - k;
+    fillBox(cx - s, gy + k, cz - s, cx + s, gy + k, cz + s, OBSIDIAN);
+  }
+  fillBox(cx - 4, gy + 1, cz - 4, cx + 4, gy + 6, cz + 4, AIR);
+  fillBox(cx - 1, gy + 1, cz - size, cx + 1, gy + 3, cz - 4, AIR);
+  for (let z = -size; z < -4; z++) {
+    safeSet(cx, gy + 4, cz + z, GOLD);
+  }
+  fillBox(cx - 3, gy, cz - 3, cx + 3, gy, cz + 3, GOLD);
+  safeSet(cx, gy + 1, cz, GOLD);
+  safeSet(cx - 2, gy + 1, cz - 2, GOLD);
+  safeSet(cx + 2, gy + 1, cz - 2, GOLD);
+  safeSet(cx - 2, gy + 1, cz + 2, GOLD);
+  safeSet(cx + 2, gy + 1, cz + 2, GOLD);
+  safeSet(cx, gy + 2, cz, CRYSTAL);
+  safeSet(cx - 4, gy + 4, cz - 4, MAGMA);
+  safeSet(cx + 4, gy + 4, cz - 4, MAGMA);
+  safeSet(cx - 4, gy + 4, cz + 4, MAGMA);
+  safeSet(cx + 4, gy + 4, cz + 4, MAGMA);
+
+  const top = gy + size;
+  for (let i = 0; i < 6; i++) {
+    safeSet(cx, top + 1 + i, cz - 2 + i, OBSIDIAN);
+  }
+  safeSet(cx, top + 7, cz + 4, OBSIDIAN);
+  safeSet(cx, top + 8, cz + 4, OBSIDIAN);
+  safeSet(cx - 1, top + 7, cz + 4, OBSIDIAN);
+  safeSet(cx + 1, top + 7, cz + 4, OBSIDIAN);
+  safeSet(cx, top + 7, cz + 5, OBSIDIAN);
+  safeSet(cx, top + 7, cz + 6, OBSIDIAN);
+  safeSet(cx - 1, top + 8, cz + 5, CRYSTAL);
+  safeSet(cx + 1, top + 8, cz + 5, CRYSTAL);
+  for (let i = 0; i < 5; i++) {
+    safeSet(cx - 2 - i, top + 3 + Math.floor(i * 0.7), cz - 1, OBSIDIAN);
+    safeSet(cx + 2 + i, top + 3 + Math.floor(i * 0.7), cz - 1, OBSIDIAN);
+    safeSet(cx - 2 - i, top + 2 + Math.floor(i * 0.5), cz, OBSIDIAN);
+    safeSet(cx + 2 + i, top + 2 + Math.floor(i * 0.5), cz, OBSIDIAN);
+  }
+  for (let i = 0; i < 7; i++) {
+    safeSet(cx, top + 1 + Math.floor(i * 0.3), cz - 4 - i, OBSIDIAN);
+  }
+}
+
+/* --- 5. 巨石阵 --- */
+function buildStonehenge(cx, cz) {
+  const gy = levelGround(cx, cz, 14, 14, GRASS);
+  const R = 10;
+  const N = 8;
+  for (let i = 0; i < N; i++) {
+    const ang = (i / N) * Math.PI * 2;
+    const sx = cx + Math.round(Math.cos(ang) * R);
+    const sz = cz + Math.round(Math.sin(ang) * R);
+    for (let h = 1; h <= 5; h++) {
+      fillBox(sx - 1, gy + h, sz - 1, sx + 1, gy + h, sz + 1, RUNE);
+    }
+    const ang2 = ((i + 1) / N) * Math.PI * 2;
+    const sx2 = cx + Math.round(Math.cos(ang2) * R);
+    const sz2 = cz + Math.round(Math.sin(ang2) * R);
+    if (i % 2 === 0) {
+      const steps = 6;
+      for (let s = 0; s <= steps; s++) {
+        const t = s / steps;
+        const ix = Math.round(sx + (sx2 - sx) * t);
+        const iz = Math.round(sz + (sz2 - sz) * t);
+        safeSet(ix, gy + 6, iz, MARBLE);
+        safeSet(ix, gy + 7, iz, MARBLE);
+      }
+    }
+  }
+  const R2 = 5;
+  for (let i = 0; i < 6; i++) {
+    const ang = (i / 6) * Math.PI * 2 + 0.2;
+    const sx = cx + Math.round(Math.cos(ang) * R2);
+    const sz = cz + Math.round(Math.sin(ang) * R2);
+    for (let h = 1; h <= 3; h++) safeSet(sx, gy + h, sz, MARBLE);
+    safeSet(sx, gy + 4, sz, CRYSTAL);
+  }
+  fillBox(cx - 1, gy + 1, cz - 1, cx + 1, gy + 1, cz + 1, RUNE);
+  safeSet(cx, gy + 2, cz, CRYSTAL);
+  for (let dx = -8; dx <= 8; dx++)
+    for (let dz = -8; dz <= 8; dz++) {
+      const d = dx * dx + dz * dz;
+      if (d > 64) continue;
+      if (d < 9) continue;
+      if ((dx + dz) % 3 === 0) safeSet(cx + dx, gy, cz + dz, COBBLE);
+    }
+}
+
+/* --- 6. 水晶洞穴 --- */
+function buildCrystalCave(cx, cz) {
+  for (let dx = -16; dx <= 16; dx++)
+    for (let dz = -16; dz <= 16; dz++) {
+      const d = Math.sqrt(dx * dx + dz * dz);
+      if (d > 16) continue;
+      const h = Math.floor(18 * (1 - d / 16));
+      const gy = findGround(cx + dx, cz + dz);
+      for (let y = 1; y <= h; y++)
+        safeSet(cx + dx, gy + y, cz + dz, y > h - 2 ? STONE : COBBLE);
+    }
+  const gy0 = findGround(cx, cz);
+  fillBox(cx - 2, gy0 + 1, cz + 13, cx + 2, gy0 + 4, cz + 17, AIR);
+  for (let s = 0; s < 10; s++) {
+    fillBox(cx - 2, gy0 + 1, cz + 6 - s, cx + 2, gy0 + 4, cz + 12 - s, AIR);
+  }
+  for (let dx = -7; dx <= 7; dx++)
+    for (let dz = -7; dz <= 7; dz++) {
+      const d = dx * dx + dz * dz;
+      if (d > 49) continue;
+      for (let h = 1; h <= 7; h++) {
+        const dy = h - 4;
+        const dyd = dy * dy;
+        const total = d + dyd * 2;
+        if (total < 49) safeSet(cx + dx - 4, gy0 + h, cz + dz - 4, AIR);
+      }
+    }
+  for (let i = 0; i < 80; i++) {
+    const ang = noise.noise(i, i * 1.7) * Math.PI * 2;
+    const dist = Math.abs(noise.noise(i * 2, i)) * 6;
+    const x = cx - 4 + Math.round(Math.cos(ang) * dist);
+    const z = cz - 4 + Math.round(Math.sin(ang) * dist);
+    const y = gy0 + 1 + Math.floor(Math.abs(noise.noise(i * 3, i * 5)) * 7);
+    if (getBlock(x, y, z) === AIR) safeSet(x, y, z, CRYSTAL);
+  }
+  for (let h = 1; h <= 6; h++) safeSet(cx - 4, gy0 + h, cz - 4, CRYSTAL);
+  fillBox(cx - 6, gy0, cz - 6, cx - 2, gy0, cz - 2, WATER);
+  fillBox(cx - 6, gy0 - 1, cz - 6, cx - 2, gy0 - 1, cz - 2, COBBLE);
+}
+
+/* --- 7. 地狱传送门 + 岩浆湖 --- */
+function buildPortal(cx, cz) {
+  const gy = levelGround(cx, cz, 14, 14, STONE);
+  for (let dx = -8; dx <= 8; dx++)
+    for (let dz = -8; dz <= 8; dz++) {
+      const d = dx * dx + dz * dz;
+      if (d > 64) continue;
+      const depth = Math.max(1, Math.floor(3 * (1 - d / 64) + 1));
+      for (let h = 0; h < depth; h++) safeSet(cx + dx, gy - h, cz + dz, AIR);
+      safeSet(cx + dx, gy - depth, cz + dz, LAVA);
+      if (d < 50) safeSet(cx + dx, gy - depth - 1, cz + dz, MAGMA);
+      else safeSet(cx + dx, gy - depth - 1, cz + dz, OBSIDIAN);
+    }
+  fillBox(cx - 2, gy + 1, cz, cx + 2, gy + 1, cz, OBSIDIAN);
+  fillBox(cx - 2, gy + 6, cz, cx + 2, gy + 6, cz, OBSIDIAN);
+  fillBox(cx - 2, gy + 2, cz, cx - 2, gy + 5, cz, OBSIDIAN);
+  fillBox(cx + 2, gy + 2, cz, cx + 2, gy + 5, cz, OBSIDIAN);
+  fillBox(cx - 1, gy + 2, cz, cx + 1, gy + 5, cz, OBSIDIAN);
+  for (let dx = -1; dx <= 1; dx++)
+    for (let dy = 2; dy <= 5; dy++)
+      safeSet(cx + dx, gy + dy, cz, RUNE);
+  for (const [ox, oz] of [[-10, -10], [10, -10], [-10, 10], [10, 10]]) {
+    cylinderY(cx + ox, cz + oz, gy + 1, gy + 8, 2, OBSIDIAN);
+    safeSet(cx + ox, gy + 9, cz + oz, MAGMA);
+    safeSet(cx + ox, gy + 10, cz + oz, CRYSTAL);
+  }
+}
+
+/* --- 8. 神殿废墟 --- */
+function buildRuins(cx, cz) {
+  const gy = levelGround(cx, cz, 10, 10, GRASS);
+  const cols = [[-5, -5], [5, -5], [-5, 5], [5, 5]];
+  for (let i = 0; i < cols.length; i++) {
+    const [ox, oz] = cols[i];
+    const h = 5 + (i % 2) * 2;
+    for (let dy = 1; dy <= h; dy++) safeSet(cx + ox, gy + dy, cz + oz, MOSS);
+    if (i % 2 === 1) safeSet(cx + ox, gy + h - 1, cz + oz, AIR);
+    if (i === 2) {
+      safeSet(cx + ox, gy + 3, cz + oz + 1, MOSS);
+      safeSet(cx + ox, gy + 2, cz + oz + 2, MOSS);
+    }
+  }
+  for (let dx = -5; dx <= 5; dx++) safeSet(cx + dx, gy + 1, cz - 5, MOSS);
+  for (let dz = -5; dz <= -2; dz++) safeSet(cx + 5, gy + 2, cz + dz, MOSS);
+  fillBox(cx - 2, gy + 1, cz - 2, cx + 2, gy + 1, cz + 2, MOSS);
+  safeSet(cx, gy + 2, cz, RUNE);
+  safeSet(cx, gy + 3, cz, CRYSTAL);
+  for (let dx = -8; dx <= 8; dx++)
+    for (let dz = -8; dz <= 8; dz++) {
+      const d = dx * dx + dz * dz;
+      if (d > 64 || d < 16) continue;
+      if ((dx * 7 + dz * 11) % 5 === 0) safeSet(cx + dx, gy, cz + dz, COBBLE);
+      if ((dx * 13 + dz * 5) % 7 === 0) safeSet(cx + dx, gy + 1, cz + dz, MOSS);
+    }
+}
+
+/* --- 9. 山顶神坛 --- */
+function buildMountainShrine(cx, cz) {
+  for (let dx = -20; dx <= 20; dx++)
+    for (let dz = -20; dz <= 20; dz++) {
+      const d = Math.sqrt(dx * dx + dz * dz);
+      if (d > 20) continue;
+      const h = Math.floor(25 * Math.pow(1 - d / 20, 1.5));
+      const gy = findGround(cx + dx, cz + dz);
+      for (let y = 1; y <= h; y++) {
+        const id = y > h - 3 ? (y > h - 1 ? SNOW : STONE) : STONE;
+        safeSet(cx + dx, gy + y, cz + dz, id);
+      }
+    }
+  const peakY = findGround(cx, cz);
+  for (let dx = -4; dx <= 4; dx++)
+    for (let dz = -4; dz <= 4; dz++) {
+      if (dx * dx + dz * dz > 16) continue;
+      safeSet(cx + dx, peakY, cz + dz, MARBLE);
+    }
+  for (const [ox, oz] of [[-3, -3], [3, -3], [-3, 3], [3, 3]]) {
+    for (let h = 1; h <= 5; h++) safeSet(cx + ox, peakY + h, cz + oz, MARBLE);
+    safeSet(cx + ox, peakY + 6, cz + oz, GOLD);
+  }
+  fillBox(cx - 1, peakY + 1, cz - 1, cx + 1, peakY + 1, cz + 1, RUNE);
+  safeSet(cx, peakY + 2, cz, GOLD);
+  safeSet(cx, peakY + 3, cz, CRYSTAL);
+  safeSet(cx, peakY + 4, cz, CRYSTAL);
+}
+
+/* --- 10. 海中沉没神殿 --- */
+function buildSunkenTemple(cx, cz) {
+  let gy = SEA - 6;
+  fillBox(cx - 10, gy, cz - 10, cx + 10, gy, cz + 10, MARBLE);
+  hollowBox(cx - 8, gy + 1, cz - 8, cx + 8, gy + 6, cz + 8, MARBLE);
+  fillBox(cx - 2, gy + 1, cz + 8, cx + 2, gy + 4, cz + 8, WATER);
+  for (const [ox, oz] of [[-5, -5], [5, -5], [-5, 5], [5, 5]]) {
+    for (let h = 1; h <= 5; h++) safeSet(cx + ox, gy + h, cz + oz, MARBLE);
+  }
+  for (let dx = -8; dx <= 8; dx++)
+    for (let dz = -8; dz <= 8; dz++)
+      safeSet(cx + dx, gy + 7, cz + dz, MARBLE);
+  for (let k = 0; k < 4; k++) {
+    const s = 4 - k;
+    fillBox(cx - s, gy + 8 + k, cz - s, cx + s, gy + 8 + k, cz + s, GOLD);
+  }
+  safeSet(cx, gy + 3, cz, CRYSTAL);
+  safeSet(cx, gy + 4, cz, CRYSTAL);
+  safeSet(cx, gy + 5, cz, CRYSTAL);
+  fillBox(cx - 7, gy + 1, cz - 7, cx + 7, gy + 6, cz + 7, AIR);
+}
+
+/* --- 11. 村庄 --- */
+function buildVillage(cx, cz) {
+  const gy = levelGround(cx, cz, 20, 20, GRASS);
+  const houses = [
+    [-12, -8], [-4, -12], [8, -10], [12, 0], [10, 8], [0, 12], [-10, 10], [-14, 2],
+  ];
+  for (const [ox, oz] of houses) {
+    const hx = cx + ox, hz = cz + oz;
+    fillBox(hx - 2, gy + 1, hz - 2, hx + 2, gy + 1, hz + 2, PLANK);
+    hollowBox(hx - 2, gy + 1, hz - 2, hx + 2, gy + 4, hz + 2, LOG);
+    fillBox(hx - 2, gy + 5, hz - 2, hx + 2, gy + 5, hz + 2, PLANK);
+    for (let k = 0; k < 3; k++) {
+      const s = 2 - k;
+      fillBox(hx - s, gy + 6 + k, hz - s, hx + s, gy + 6 + k, hz + s, BRICK);
+    }
+    fillBox(hx, gy + 2, hz + 2, hx, gy + 3, hz + 2, AIR);
+    safeSet(hx + 2, gy + 3, hz, GLASS);
+    safeSet(hx - 2, gy + 3, hz, GLASS);
+    safeSet(hx, gy + 3, hz - 2, GLASS);
+  }
+  fillBox(cx - 1, gy - 2, cz - 1, cx + 1, gy - 1, cz + 1, WATER);
+  fillBox(cx - 2, gy + 1, cz - 2, cx + 2, gy + 1, cz + 2, COBBLE);
+  fillBox(cx - 1, gy + 1, cz - 1, cx + 1, gy + 1, cz + 1, AIR);
+  for (const [ox, oz] of [[-2, -2], [2, -2], [-2, 2], [2, 2]]) {
+    for (let h = 2; h <= 4; h++) safeSet(cx + ox, gy + h, cz + oz, LOG);
+  }
+  fillBox(cx - 2, gy + 5, cz - 2, cx + 2, gy + 5, cz + 2, PLANK);
+  for (const [ox, oz] of houses) {
+    const dx = ox > 0 ? 1 : (ox < 0 ? -1 : 0);
+    const dz = oz > 0 ? 1 : (oz < 0 ? -1 : 0);
+    let x = cx, z = cz;
+    for (let s = 3; s < Math.max(Math.abs(ox), Math.abs(oz)); s++) {
+      x = cx + Math.round((ox - dx) * (s / Math.max(Math.abs(ox), Math.abs(oz))));
+      z = cz + Math.round((oz - dz) * (s / Math.max(Math.abs(ox), Math.abs(oz))));
+      safeSet(x, gy, z, COBBLE);
+    }
+  }
+}
+
+/* --- 12. 漂浮飞船 --- */
+function buildFloatingShip(cx, cz, baseY) {
+  for (let dx = -8; dx <= 8; dx++)
+    for (let dz = -3; dz <= 3; dz++)
+      for (let dy = 0; dy <= 3; dy++) {
+        const fx = dx * dx / 64 + dy * dy / 9 + dz * dz / 9;
+        if (fx > 1) continue;
+        safeSet(cx + dx, baseY + dy, cz + dz, PLANK);
+      }
+  for (let dx = -7; dx <= 7; dx++)
+    for (let dz = -2; dz <= 2; dz++)
+      safeSet(cx + dx, baseY + 4, cz + dz, PLANK);
+  for (let dx = -7; dx <= 7; dx++) {
+    safeSet(cx + dx, baseY + 5, cz - 3, LOG);
+    safeSet(cx + dx, baseY + 5, cz + 3, LOG);
+  }
+  for (let dz = -3; dz <= 3; dz++) {
+    safeSet(cx - 8, baseY + 5, cz + dz, LOG);
+    safeSet(cx + 8, baseY + 5, cz + dz, LOG);
+  }
+  for (let h = 0; h < 12; h++) safeSet(cx, baseY + 5 + h, cz, LOG);
+  for (let dx = -4; dx <= 4; dx++) safeSet(cx + dx, baseY + 13, cz, LOG);
+  for (let h = 7; h < 13; h++)
+    for (let dx = -3; dx <= 3; dx++)
+      safeSet(cx + dx, baseY + h, cz, GLASS);
+  safeSet(cx + 8, baseY + 4, cz, CRYSTAL);
+  for (let h = -1; h > -10; h--) safeSet(cx + 6, baseY + h, cz + 2, OBSIDIAN);
+}
+
+function buildAllStructures(onProgress) {
+  const tasks = [
+    () => buildVillage(80, 100),
+    () => buildWizardTower(40, 180),
+    () => buildYggdrasil(200, 60),
+    () => buildDragonPyramid(60, 40),
+    () => buildStonehenge(130, 230),
+    () => buildCrystalCave(210, 130),
+    () => buildPortal(40, 220),
+    () => buildRuins(180, 200),
+    () => buildMountainShrine(220, 50),
+    () => buildSunkenTemple(40, 40),
+    () => buildSkyCastle(140, 60, 90),
+    () => buildFloatingShip(180, 170, 105),
+  ];
+  for (let i = 0; i < tasks.length; i++) {
+    tasks[i]();
+    if (onProgress) onProgress(0.6 + (i + 1) / tasks.length * 0.2);
+  }
+}
+
+/* ============================================================
+   网格构建
+   ============================================================ */
+
+const opaqueMat = new THREE.MeshBasicMaterial({
+  map: atlas.texture,
+  vertexColors: true,
+  side: THREE.FrontSide,
+});
+const transMat = new THREE.MeshBasicMaterial({
+  map: atlas.texture,
+  vertexColors: true,
+  side: THREE.DoubleSide,
+  transparent: true,
+  alphaTest: 0.05,
+  depthWrite: false,
+});
+
+function uvAtTile(tileIdx, u, v) {
+  const col = tileIdx % COLS;
+  const row = Math.floor(tileIdx / COLS);
+  return [(col + u) / COLS, (row + v) / ROWS];
+}
+
+function buildChunkMesh(chunk) {
+  const posO = [], norO = [], uvO = [], colO = [], idxO = [];
+  const posT = [], norT = [], uvT = [], colT = [], idxT = [];
+  let countO = 0, countT = 0;
+
+  const bx0 = chunk.cx * CHUNK;
+  const bz0 = chunk.cz * CHUNK;
+
+  for (let lx = 0; lx < CHUNK; lx++) {
+    for (let lz = 0; lz < CHUNK; lz++) {
+      for (let y = 0; y < WORLD_H; y++) {
+        const block = chunk.get(lx, y, lz);
+        if (block === AIR) continue;
+        const bx = bx0 + lx, bz = bz0 + lz;
+        const isTrans = RENDER_ALPHA.has(block);
+        const faceTex = FACE_TEX[block];
+
+        for (let f = 0; f < 6; f++) {
+          const face = FACES[f];
+          const nx = bx + face.n[0], ny = y + face.n[1], nz = bz + face.n[2];
+          const nb = getBlock(nx, ny, nz);
+          let draw = false;
+          if (nb === AIR) draw = true;
+          else if (TRANSPARENT.has(nb) && nb !== block) draw = true;
+          if (block === WATER && f !== 2) {
+            if (nb === WATER) draw = false;
+          }
+          if (!draw) continue;
+
+          let tIdx;
+          if (f === 2) tIdx = faceTex[0];
+          else if (f === 3) tIdx = faceTex[1];
+          else tIdx = faceTex[2];
+
+          const isEm = EMISSIVE.has(block);
+          const shade = isEm ? 1.05 : FACE_SHADE[f];
+
+          const arrPos = isTrans ? posT : posO;
+          const arrNor = isTrans ? norT : norO;
+          const arrUV = isTrans ? uvT : uvO;
+          const arrCol = isTrans ? colT : colO;
+          const arrIdx = isTrans ? idxT : idxO;
+          const count = isTrans ? countT : countO;
+
+          for (let v = 0; v < 4; v++) {
+            const vp = face.v[v];
+            arrPos.push(bx + vp[0], y + vp[1], bz + vp[2]);
+            arrNor.push(face.n[0], face.n[1], face.n[2]);
+            const [tu, tv] = uvAtTile(tIdx, face.u[v][0], face.u[v][1]);
+            arrUV.push(tu, tv);
+            const offs = aoOffsets(f, vp);
+            let occ = 0;
+            for (const o of offs) {
+              const ob = getBlock(bx + o[0], y + o[1], bz + o[2]);
+              if (ob !== AIR && !TRANSPARENT.has(ob)) occ++;
+            }
+            const ao = [0.45, 0.65, 0.82, 1.0][3 - occ] ?? 1.0;
+            const c = Math.min(1, shade * ao);
+            let rB = c, gB = c, bB = c;
+            if (block === WATER) { rB *= 0.6; gB *= 0.85; bB *= 1.0; }
+            else if (block === LEAVES) { rB *= 0.85; gB *= 1.05; bB *= 0.8; }
+            else if (block === SNOW) { rB *= 1.0; gB *= 1.0; bB *= 1.0; }
+            arrCol.push(rB, gB, bB);
+          }
+          arrIdx.push(count, count + 1, count + 2, count, count + 2, count + 3);
+          if (isTrans) countT += 4; else countO += 4;
+        }
+      }
+    }
+  }
+
+  function buildBufGeom(pos, nor, uv, col, idx) {
+    if (pos.length === 0) return null;
+    const g = new THREE.BufferGeometry();
+    g.setAttribute('position', new THREE.Float32BufferAttribute(pos, 3));
+    g.setAttribute('normal', new THREE.Float32BufferAttribute(nor, 3));
+    g.setAttribute('uv', new THREE.Float32BufferAttribute(uv, 2));
+    g.setAttribute('color', new THREE.Float32BufferAttribute(col, 3));
+    g.setIndex(idx);
+    g.computeBoundingSphere();
+    return g;
+  }
+
+  const opaqueGeo = buildBufGeom(posO, norO, uvO, colO, idxO);
+  const transGeo = buildBufGeom(posT, norT, uvT, colT, idxT);
+
+  if (chunk.mesh) { scene.remove(chunk.mesh); chunk.mesh.geometry.dispose(); chunk.mesh = null; }
+  if (chunk.transMesh) { scene.remove(chunk.transMesh); chunk.transMesh.geometry.dispose(); chunk.transMesh = null; }
+
+  if (opaqueGeo) {
+    const m = new THREE.Mesh(opaqueGeo, opaqueMat);
+    m.frustumCulled = true;
+    scene.add(m);
+    chunk.mesh = m;
+  }
+  if (transGeo) {
+    const m = new THREE.Mesh(transGeo, transMat);
+    m.frustumCulled = true;
+    m.renderOrder = 1;
+    scene.add(m);
+    chunk.transMesh = m;
+  }
+  chunk.dirty = false;
+}
+
+/* ============================================================
+   Three.js 场景
+   ============================================================ */
+
+const scene = new THREE.Scene();
+scene.background = new THREE.Color(0x9cc8e8);
+scene.fog = new THREE.Fog(0x9cc8e8, 60, 220);
+
+const camera = new THREE.PerspectiveCamera(72, window.innerWidth / window.innerHeight, 0.1, 600);
+
+const renderer = new THREE.WebGLRenderer({ antialias: false, powerPreference: 'high-performance' });
+renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));
+renderer.setSize(window.innerWidth, window.innerHeight);
+renderer.outputColorSpace = THREE.SRGBColorSpace;
+document.body.appendChild(renderer.domElement);
+
+const sun = new THREE.DirectionalLight(0xfff4d8, 0.0);
+sun.position.set(80, 100, 50);
+scene.add(sun);
+const ambient = new THREE.AmbientLight(0xffffff, 0.0);
+scene.add(ambient);
+
+const sunGeo = new THREE.SphereGeometry(8, 16, 16);
+const sunMat = new THREE.MeshBasicMaterial({ color: 0xffefb0, fog: false });
+const sunMesh = new THREE.Mesh(sunGeo, sunMat);
+sunMesh.position.set(200, 180, -100);
+scene.add(sunMesh);
+
+const hlGeo = new THREE.BoxGeometry(1.005, 1.005, 1.005);
+const hlEdges = new THREE.EdgesGeometry(hlGeo);
+const hlMat = new THREE.LineBasicMaterial({ color: 0x000000, transparent: true, opacity: 0.85, fog: false });
+const highlight = new THREE.LineSegments(hlEdges, hlMat);
+highlight.visible = false;
+scene.add(highlight);
+
+function makeClouds() {
+  const cloudMat = new THREE.MeshBasicMaterial({ color: 0xffffff, transparent: true, opacity: 0.85, fog: false });
+  const group = new THREE.Group();
+  const rng = mulberry32(99);
+  for (let i = 0; i < 32; i++) {
+    const x = rng() * 600 - 300;
+    const z = rng() * 600 - 300;
+    const y = 140 + rng() * 30;
+    const w = 10 + rng() * 16;
+    const d = 5 + rng() * 9;
+    const g = new THREE.BoxGeometry(w, 3, d);
+    const m = new THREE.Mesh(g, cloudMat);
+    m.position.set(x, y, z);
+    group.add(m);
+  }
+  scene.add(group);
+  return group;
+}
+const clouds = makeClouds();
+
+/* ============================================================
+   玩家
+   ============================================================ */
+
+const player = {
+  pos: new THREE.Vector3(WORLD_SIZE / 2, 0, WORLD_SIZE / 2),
+  vel: new THREE.Vector3(),
+  yaw: 0,
+  pitch: 0,
+  onGround: false,
+  inWater: false,
+  flying: false,
+  EYE: 1.62,
+  W: 0.3,
+  H: 1.8,
+};
+
+function spawnPlayer() {
+  // 生成于村庄附近，可看见浮空城堡
+  const sx = 80, sz = 100;
+  const gy = findGround(sx, sz);
+  player.pos.set(sx + 0.5, gy + 3, sz + 0.5);
+  // 朝北看 — 浮空城堡在北侧
+  player.yaw = Math.PI;
+  player.pitch = -0.1;
+}
+
+function isSolid(b) {
+  return b !== AIR && b !== WATER && b !== LAVA;
+}
+
+function blockAABBOverlap(x, y, z) {
+  const w = player.W;
+  const feetY = y - player.EYE;
+  const headY = feetY + player.H;
+  const x0 = Math.floor(x - w), x1 = Math.floor(x + w);
+  const z0 = Math.floor(z - w), z1 = Math.floor(z + w);
+  const y0 = Math.floor(feetY), y1 = Math.floor(headY);
+  for (let by = y0; by <= y1; by++)
+    for (let bx = x0; bx <= x1; bx++)
+      for (let bz = z0; bz <= z1; bz++)
+        if (isSolid(getBlock(bx, by, bz))) return true;
+  return false;
+}
+
+function inWaterAtPos(x, y, z) {
+  const feetY = y - player.EYE + 0.1;
+  return getBlock(Math.floor(x), Math.floor(feetY), Math.floor(z)) === WATER;
+}
+
+const keys = {};
+window.addEventListener('keydown', e => {
+  keys[e.code] = true;
+  if (e.code === 'KeyF') { player.flying = !player.flying; player.vel.y = 0; toast(player.flying ? '飞行模式 开启' : '飞行模式 关闭'); }
+  if (e.code >= 'Digit1' && e.code <= 'Digit9') {
+    selectSlot(parseInt(e.code.slice(5)) - 1);
+  }
+});
+window.addEventListener('keyup', e => { keys[e.code] = false; });
+
+let pointerLocked = false;
+renderer.domElement.addEventListener('click', () => {
+  if (!pointerLocked) renderer.domElement.requestPointerLock();
+});
+document.addEventListener('pointerlockchange', () => {
+  pointerLocked = document.pointerLockElement === renderer.domElement;
+});
+document.addEventListener('mousemove', e => {
+  if (!pointerLocked) return;
+  player.yaw -= e.movementX * 0.0022;
+  player.pitch -= e.movementY * 0.0022;
+  const lim = Math.PI / 2 - 0.01;
+  if (player.pitch > lim) player.pitch = lim;
+  if (player.pitch < -lim) player.pitch = -lim;
+});
+
+document.addEventListener('mousedown', e => {
+  if (!pointerLocked) return;
+  if (e.button === 0) doBreak();
+  else if (e.button === 2) doPlace();
+});
+document.addEventListener('contextmenu', e => e.preventDefault());
+
+/* ============================================================
+   物理 / 移动
+   ============================================================ */
+
+function tryMove(axis, delta) {
+  const oldPos = player.pos[axis];
+  const next = oldPos + delta;
+  player.pos[axis] = next;
+  if (blockAABBOverlap(player.pos.x, player.pos.y, player.pos.z)) {
+    player.pos[axis] = oldPos;
+    return false;
+  }
+  return true;
+}
+
+function updatePlayer(dt) {
+  player.inWater = inWaterAtPos(player.pos.x, player.pos.y, player.pos.z);
+
+  const forward = new THREE.Vector3(-Math.sin(player.yaw), 0, -Math.cos(player.yaw));
+  const right = new THREE.Vector3(Math.cos(player.yaw), 0, -Math.sin(player.yaw));
+  const wish = new THREE.Vector3();
+  if (keys.KeyW) wish.add(forward);
+  if (keys.KeyS) wish.sub(forward);
+  if (keys.KeyD) wish.add(right);
+  if (keys.KeyA) wish.sub(right);
+  if (wish.lengthSq() > 0) wish.normalize();
+
+  const sprint = keys.ShiftLeft || keys.ShiftRight;
+  let speed = sprint ? 7.2 : 4.6;
+  if (player.inWater) speed *= 0.6;
+  if (player.flying) speed = sprint ? 18 : 10;
+
+  if (player.flying) {
+    player.vel.x = wish.x * speed;
+    player.vel.z = wish.z * speed;
+    player.vel.y = 0;
+    if (keys.Space) player.vel.y = speed;
+    if (keys.ShiftLeft || keys.ShiftRight) player.vel.y = -speed;
+  } else {
+    const accel = player.onGround ? 35 : 15;
+    player.vel.x += (wish.x * speed - player.vel.x) * Math.min(1, accel * dt / Math.max(speed, 0.001));
+    player.vel.z += (wish.z * speed - player.vel.z) * Math.min(1, accel * dt / Math.max(speed, 0.001));
+    if (!player.inWater) player.vel.y -= 28 * dt;
+    else player.vel.y -= 8 * dt;
+    if (player.vel.y < -50) player.vel.y = -50;
+    if (keys.Space) {
+      if (player.onGround) player.vel.y = 9.0;
+      else if (player.inWater) player.vel.y = Math.min(4, player.vel.y + 18 * dt);
+    }
+  }
+
+  tryMove('x', player.vel.x * dt);
+  tryMove('z', player.vel.z * dt);
+  const oldY = player.pos.y;
+  player.pos.y += player.vel.y * dt;
+  if (blockAABBOverlap(player.pos.x, player.pos.y, player.pos.z)) {
+    player.pos.y = oldY;
+    if (player.vel.y < 0) player.onGround = true;
+    player.vel.y = 0;
+  } else {
+    player.onGround = false;
+  }
+
+  if (player.pos.y < -5) {
+    player.pos.y = WORLD_H;
+    player.vel.y = 0;
+  }
+
+  camera.position.copy(player.pos);
+  camera.rotation.order = 'YXZ';
+  camera.rotation.y = player.yaw;
+  camera.rotation.x = player.pitch;
+}
+
+/* ============================================================
+   射线 / 方块交互
+   ============================================================ */
+
+function raycastBlock(maxDist) {
+  const dir = new THREE.Vector3(0, 0, -1).applyEuler(camera.rotation).normalize();
+  const ox = player.pos.x, oy = player.pos.y, oz = player.pos.z;
+  let x = Math.floor(ox), y = Math.floor(oy), z = Math.floor(oz);
+  const sx = dir.x > 0 ? 1 : -1;
+  const sy = dir.y > 0 ? 1 : -1;
+  const sz = dir.z > 0 ? 1 : -1;
+  const tdx = Math.abs(1 / dir.x);
+  const tdy = Math.abs(1 / dir.y);
+  const tdz = Math.abs(1 / dir.z);
+  let tmx = dir.x !== 0 ? ((sx > 0 ? Math.ceil(ox) - ox : ox - Math.floor(ox)) * tdx) : Infinity;
+  let tmy = dir.y !== 0 ? ((sy > 0 ? Math.ceil(oy) - oy : oy - Math.floor(oy)) * tdy) : Infinity;
+  let tmz = dir.z !== 0 ? ((sz > 0 ? Math.ceil(oz) - oz : oz - Math.floor(oz)) * tdz) : Infinity;
+  if (tmx === 0) tmx = tdx;
+  if (tmy === 0) tmy = tdy;
+  if (tmz === 0) tmz = tdz;
+  let face = -1;
+  let t = 0;
+  while (t < maxDist) {
+    const b = getBlock(x, y, z);
+    if (b !== AIR && b !== WATER) return { x, y, z, face, block: b };
+    if (tmx < tmy && tmx < tmz) {
+      t = tmx; tmx += tdx; x += sx; face = sx > 0 ? 1 : 0;
+    } else if (tmy < tmz) {
+      t = tmy; tmy += tdy; y += sy; face = sy > 0 ? 3 : 2;
+    } else {
+      t = tmz; tmz += tdz; z += sz; face = sz > 0 ? 5 : 4;
+    }
+  }
+  return null;
+}
+
+function doBreak() {
+  const hit = raycastBlock(6);
+  if (!hit) return;
+  if (hit.block === BEDROCK) return;
+  setBlock(hit.x, hit.y, hit.z, AIR);
+}
+
+function doPlace() {
+  const hit = raycastBlock(6);
+  if (!hit || hit.face < 0) return;
+  const n = FACES[hit.face].n;
+  const px = hit.x + n[0], py = hit.y + n[1], pz = hit.z + n[2];
+  if (py < 0 || py >= WORLD_H) return;
+  const old = getBlock(px, py, pz);
+  if (old !== AIR) return;
+  const pmin = [px, py, pz], pmax = [px + 1, py + 1, pz + 1];
+  const feetY = player.pos.y - player.EYE;
+  const headY = feetY + player.H;
+  const w = player.W;
+  if (player.pos.x + w > pmin[0] && player.pos.x - w < pmax[0] &&
+      headY > pmin[1] && feetY < pmax[1] &&
+      player.pos.z + w > pmin[2] && player.pos.z - w < pmax[2]) {
+    return;
+  }
+  setBlock(px, py, pz, hotbar[activeSlot]);
+}
+
+/* ============================================================
+   UI
+   ============================================================ */
+
+const hotbar = [GRASS, STONE, DIRT, PLANK, COBBLE, GLASS, LOG, GOLD, CRYSTAL];
+let activeSlot = 0;
+
+function setupHotbar() {
+  const el = document.getElementById('hotbar');
+  el.innerHTML = '';
+  for (let i = 0; i < hotbar.length; i++) {
+    const slot = document.createElement('div');
+    slot.className = 'slot' + (i === 0 ? ' active' : '');
+    slot.dataset.idx = i;
+    const num = document.createElement('div');
+    num.className = 'num';
+    num.textContent = (i + 1);
+    slot.appendChild(num);
+    const icon = makeBlockIcon(hotbar[i]);
+    slot.appendChild(icon);
+    const name = document.createElement('div');
+    name.className = 'name';
+    name.textContent = BLOCK_NAME[hotbar[i]] || '';
+    slot.appendChild(name);
+    slot.addEventListener('click', () => selectSlot(i));
+    el.appendChild(slot);
+  }
+}
+
+function selectSlot(i) {
+  if (i < 0 || i >= hotbar.length) return;
+  activeSlot = i;
+  document.querySelectorAll('#hotbar .slot').forEach((s, idx) => {
+    s.classList.toggle('active', idx === i);
+  });
+}
+
+let toastTimer;
+function toast(msg) {
+  const el = document.getElementById('toast');
+  el.textContent = msg;
+  el.classList.add('show');
+  clearTimeout(toastTimer);
+  toastTimer = setTimeout(() => el.classList.remove('show'), 1400);
+}
+
+window.addEventListener('wheel', e => {
+  if (!pointerLocked) return;
+  if (e.deltaY > 0) selectSlot((activeSlot + 1) % hotbar.length);
+  else selectSlot((activeSlot - 1 + hotbar.length) % hotbar.length);
+});
+
+/* ============================================================
+   主循环
+   ============================================================ */
+
+let lastT = performance.now();
+let fps = 0, fpsFrames = 0, fpsTimer = 0;
+let dirtyBudget = 2;
+
+const hudPos = document.getElementById('hud-pos');
+const hudDir = document.getElementById('hud-dir');
+const hudBlk = document.getElementById('hud-block');
+const hudFps = document.getElementById('hud-fps');
+const hudCk = document.getElementById('hud-chunks');
+
+let totalChunks = 0;
+
+function frame() {
+  requestAnimationFrame(frame);
+  const now = performance.now();
+  let dt = (now - lastT) / 1000;
+  if (dt > 0.1) dt = 0.1;
+  lastT = now;
+
+  if (pointerLocked) {
+    updatePlayer(dt);
+  } else {
+    camera.position.copy(player.pos);
+    camera.rotation.order = 'YXZ';
+    camera.rotation.y = player.yaw;
+    camera.rotation.x = player.pitch;
+  }
+
+  const hit = raycastBlock(6);
+  if (hit) {
+    highlight.position.set(hit.x + 0.5, hit.y + 0.5, hit.z + 0.5);
+    highlight.visible = true;
+  } else {
+    highlight.visible = false;
+  }
+
+  let rebuilt = 0;
+  for (const c of chunks.values()) {
+    if (c.dirty && rebuilt < dirtyBudget) {
+      buildChunkMesh(c);
+      rebuilt++;
+    }
+  }
+
+  clouds.position.x += dt * 4;
+  if (clouds.position.x > 80) clouds.position.x -= 160;
+
+  renderer.render(scene, camera);
+
+  fpsFrames++;
+  fpsTimer += dt;
+  if (fpsTimer >= 0.5) {
+    fps = Math.round(fpsFrames / fpsTimer);
+    fpsTimer = 0;
+    fpsFrames = 0;
+    hudFps.textContent = fps;
+  }
+
+  hudPos.textContent = `${player.pos.x.toFixed(1)}, ${player.pos.y.toFixed(1)}, ${player.pos.z.toFixed(1)}`;
+  const yawDeg = ((player.yaw * 180 / Math.PI) % 360 + 360) % 360;
+  let dirName = '北';
+  const d = ((yawDeg + 360 + 45) % 360) / 90 | 0;
+  dirName = ['南', '东', '北', '西'][d];
+  hudDir.textContent = `${dirName} ${yawDeg.toFixed(0)}°`;
+  const belowB = getBlock(Math.floor(player.pos.x), Math.floor(player.pos.y - player.EYE - 0.1), Math.floor(player.pos.z));
+  hudBlk.textContent = BLOCK_NAME[belowB] || (belowB === 0 ? '空' : '?');
+  hudCk.textContent = totalChunks;
+}
+
+/* ============================================================
+   初始化
+   ============================================================ */
+
+function setProgress(p, msg) {
+  const bar = document.querySelector('#loading .bar div');
+  const txt = document.querySelector('#loading');
+  if (bar) bar.style.width = (p * 100).toFixed(1) + '%';
+  if (txt && msg) txt.firstChild.textContent = msg + ' ';
+}
+
+async function init() {
+  setProgress(0.02, '生成神话地形…');
+  await new Promise(r => requestAnimationFrame(r));
+
+  const cols = WORLD_SIZE;
+  for (let x = 0; x < cols; x++) {
+    for (let z = 0; z < cols; z++) generateTerrainColumn(x, z);
+    if (x % 32 === 0) {
+      setProgress(0.02 + (x / cols) * 0.45, '生成神话地形…');
+      await new Promise(r => requestAnimationFrame(r));
+    }
+  }
+
+  setProgress(0.48, '构筑神话建筑…');
+  await new Promise(r => requestAnimationFrame(r));
+  buildAllStructures(p => setProgress(p, '构筑神话建筑…'));
+
+  setProgress(0.8, '种植树木…');
+  await new Promise(r => requestAnimationFrame(r));
+  scatterTrees();
+
+  setProgress(0.85, '编织方块网格…');
+  await new Promise(r => requestAnimationFrame(r));
+
+  const arr = Array.from(chunks.values());
+  totalChunks = arr.length;
+  let i = 0;
+  for (const c of arr) {
+    buildChunkMesh(c);
+    i++;
+    if (i % 16 === 0) {
+      setProgress(0.85 + (i / arr.length) * 0.14, `编织方块网格… ${i}/${arr.length}`);
+      await new Promise(r => requestAnimationFrame(r));
+    }
+  }
+  setProgress(0.99, '点燃太阳…');
+  await new Promise(r => requestAnimationFrame(r));
+
+  spawnPlayer();
+  setupHotbar();
+
+  setProgress(1.0, '世界铸成。');
+  document.getElementById('hud').style.display = 'block';
+  document.getElementById('crosshair').style.display = 'block';
+  document.getElementById('hotbar').style.display = 'flex';
+  document.getElementById('start').classList.add('ready');
+  document.querySelector('#start .prompt').textContent = '— 点击屏幕，启程探索 —';
+
+  frame();
+}
+
+document.getElementById('start').addEventListener('click', () => {
+  if (document.getElementById('start').classList.contains('ready')) {
+    document.getElementById('start').classList.add('hidden');
+    renderer.domElement.requestPointerLock();
+  }
+});
+
+window.addEventListener('keydown', e => {
+  if (e.code === 'Escape') {
+    if (pointerLocked) document.exitPointerLock();
+  }
+});
+
+document.addEventListener('pointerlockchange', () => {
+  if (!pointerLocked) {
+    if (!document.getElementById('start').classList.contains('hidden')) return;
+    toast('点击屏幕以继续');
+  }
+});
+
+window.addEventListener('resize', () => {
+  camera.aspect = window.innerWidth / window.innerHeight;
+  camera.updateProjectionMatrix();
+  renderer.setSize(window.innerWidth, window.innerHeight);
+});
+
+init();
+
+</script>
+</body>
+</html>
diff --git a/outputs/claude-opus-4-7/claude-code-max/pelican-cycling.svg b/outputs/claude-opus-4-7/claude-code-max/pelican-cycling.svg
new file mode 100644
index 0000000..7a3dd91
--- /dev/null
+++ b/outputs/claude-opus-4-7/claude-code-max/pelican-cycling.svg
@@ -0,0 +1,425 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 700">
+  <defs>
+    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#FF9F7A"/>
+      <stop offset="30%" stop-color="#FFC59A"/>
+      <stop offset="60%" stop-color="#FFE6CB"/>
+      <stop offset="100%" stop-color="#B0D8E5"/>
+    </linearGradient>
+    <radialGradient id="sunRad" cx="0.5" cy="0.5" r="0.5">
+      <stop offset="0%" stop-color="#FFFCE6"/>
+      <stop offset="55%" stop-color="#FFE066"/>
+      <stop offset="100%" stop-color="#FFB347"/>
+    </radialGradient>
+    <radialGradient id="sunGlow" cx="0.5" cy="0.5" r="0.5">
+      <stop offset="0%" stop-color="#FFE066" stop-opacity="0.55"/>
+      <stop offset="100%" stop-color="#FFE066" stop-opacity="0"/>
+    </radialGradient>
+    <linearGradient id="sea" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#4D90B8"/>
+      <stop offset="60%" stop-color="#3D7DA0"/>
+      <stop offset="100%" stop-color="#2A5C7E"/>
+    </linearGradient>
+    <linearGradient id="sand" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#EFD7A0"/>
+      <stop offset="50%" stop-color="#E0C588"/>
+      <stop offset="100%" stop-color="#BFA070"/>
+    </linearGradient>
+    <linearGradient id="pelicanBody" x1="0" y1="0" x2="0.3" y2="1">
+      <stop offset="0%" stop-color="#FFFFFF"/>
+      <stop offset="60%" stop-color="#EAEAEA"/>
+      <stop offset="100%" stop-color="#B8B8B8"/>
+    </linearGradient>
+    <linearGradient id="wing" x1="0" y1="0" x2="0.5" y2="1">
+      <stop offset="0%" stop-color="#F5F5F5"/>
+      <stop offset="40%" stop-color="#D0D0D0"/>
+      <stop offset="80%" stop-color="#5A5A5A"/>
+      <stop offset="100%" stop-color="#1A1A1A"/>
+    </linearGradient>
+    <linearGradient id="beak" x1="0" y1="0" x2="0.4" y2="1">
+      <stop offset="0%" stop-color="#FFE0A0"/>
+      <stop offset="50%" stop-color="#F0B860"/>
+      <stop offset="100%" stop-color="#C68A30"/>
+    </linearGradient>
+    <linearGradient id="pouch" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#FFC080"/>
+      <stop offset="60%" stop-color="#F09060"/>
+      <stop offset="100%" stop-color="#C46030"/>
+    </linearGradient>
+    <linearGradient id="leg" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#F08040"/>
+      <stop offset="100%" stop-color="#A04010"/>
+    </linearGradient>
+    <radialGradient id="tireRad" cx="0.5" cy="0.5" r="0.5">
+      <stop offset="75%" stop-color="#1F1F1F"/>
+      <stop offset="100%" stop-color="#000000"/>
+    </radialGradient>
+    <linearGradient id="frameRed" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#E63B3B"/>
+      <stop offset="100%" stop-color="#A01818"/>
+    </linearGradient>
+  </defs>
+
+  <!-- Sky -->
+  <rect width="1000" height="485" fill="url(#sky)"/>
+
+  <!-- Sun -->
+  <circle cx="770" cy="130" r="140" fill="url(#sunGlow)"/>
+  <circle cx="770" cy="130" r="62" fill="url(#sunRad)"/>
+
+  <!-- Clouds -->
+  <g fill="#FFFFFF" opacity="0.9">
+    <ellipse cx="200" cy="100" rx="65" ry="14"/>
+    <ellipse cx="235" cy="88" rx="42" ry="12"/>
+    <ellipse cx="170" cy="90" rx="38" ry="11"/>
+    <ellipse cx="155" cy="105" rx="32" ry="10"/>
+    <ellipse cx="500" cy="65" rx="55" ry="11"/>
+    <ellipse cx="535" cy="58" rx="38" ry="10"/>
+    <ellipse cx="475" cy="62" rx="32" ry="9"/>
+    <ellipse cx="900" cy="220" rx="60" ry="12"/>
+    <ellipse cx="935" cy="213" rx="42" ry="10"/>
+    <ellipse cx="875" cy="225" rx="30" ry="8"/>
+    <ellipse cx="50" cy="180" rx="50" ry="10" opacity="0.7"/>
+    <ellipse cx="85" cy="175" rx="32" ry="8" opacity="0.7"/>
+  </g>
+
+  <!-- Distant seagulls -->
+  <g fill="none" stroke="#444444" stroke-width="1.8" stroke-linecap="round" opacity="0.65">
+    <path d="M 600 180 Q 608 172 615 180 M 615 180 Q 622 172 630 180"/>
+    <path d="M 650 210 Q 656 204 662 210 M 662 210 Q 668 204 674 210"/>
+    <path d="M 100 215 Q 108 207 116 215 M 116 215 Q 124 207 132 215"/>
+    <path d="M 350 150 Q 357 144 364 150 M 364 150 Q 371 144 378 150"/>
+    <path d="M 430 230 Q 435 226 440 230 M 440 230 Q 445 226 450 230"/>
+  </g>
+
+  <!-- Distant land -->
+  <path d="M 0 385 Q 80 372 160 378 Q 230 372 290 380 Q 320 378 320 390 L 0 390 Z" fill="#4D6B7F" opacity="0.55"/>
+
+  <!-- Sea -->
+  <rect y="390" width="1000" height="95" fill="url(#sea)"/>
+
+  <!-- Sun reflection on water -->
+  <g opacity="0.85">
+    <ellipse cx="770" cy="395" rx="75" ry="3" fill="#FFE066"/>
+    <ellipse cx="770" cy="410" rx="60" ry="2.5" fill="#FFE066" opacity="0.7"/>
+    <ellipse cx="770" cy="425" rx="45" ry="2" fill="#FFE066" opacity="0.55"/>
+    <ellipse cx="770" cy="440" rx="32" ry="1.8" fill="#FFE066" opacity="0.4"/>
+    <ellipse cx="770" cy="455" rx="22" ry="1.5" fill="#FFE066" opacity="0.3"/>
+    <ellipse cx="770" cy="470" rx="14" ry="1.2" fill="#FFE066" opacity="0.2"/>
+  </g>
+
+  <!-- Waves -->
+  <g stroke="#FFFFFF" stroke-width="1.3" fill="none" opacity="0.6">
+    <path d="M 0 410 Q 40 405 80 410 T 160 410 T 240 410 T 320 410 T 400 410 T 480 410 T 560 410 T 640 410 T 720 410 T 800 410 T 880 410 T 960 410"/>
+    <path d="M 0 430 Q 45 426 90 430 T 180 430 T 270 430 T 360 430 T 450 430 T 540 430 T 630 430 T 720 430 T 810 430 T 900 430 T 990 430"/>
+    <path d="M 0 455 Q 50 451 100 455 T 200 455 T 300 455 T 400 455 T 500 455 T 600 455 T 700 455 T 800 455 T 900 455 T 1000 455"/>
+    <path d="M 0 475 Q 55 470 110 475 T 220 475 T 330 475 T 440 475 T 550 475 T 660 475 T 770 475 T 880 475 T 990 475" opacity="0.4"/>
+  </g>
+
+  <!-- Wet sand band -->
+  <path d="M 0 478 Q 200 472 400 480 Q 600 477 800 482 Q 900 480 1000 483 L 1000 502 L 0 502 Z" fill="#A88A65" opacity="0.85"/>
+
+  <!-- Foam -->
+  <g fill="#FFFFFF" opacity="0.8">
+    <ellipse cx="100" cy="481" rx="18" ry="2"/>
+    <ellipse cx="195" cy="478" rx="22" ry="2.5"/>
+    <ellipse cx="285" cy="483" rx="18" ry="2"/>
+    <ellipse cx="395" cy="481" rx="25" ry="2.5"/>
+    <ellipse cx="510" cy="484" rx="20" ry="2"/>
+    <ellipse cx="630" cy="479" rx="22" ry="2.2"/>
+    <ellipse cx="760" cy="482" rx="18" ry="2"/>
+    <ellipse cx="890" cy="481" rx="20" ry="2"/>
+    <ellipse cx="980" cy="484" rx="15" ry="1.8"/>
+  </g>
+
+  <!-- Sand -->
+  <rect y="498" width="1000" height="202" fill="url(#sand)"/>
+
+  <!-- Sand texture -->
+  <g fill="#B59868" opacity="0.5">
+    <circle cx="80" cy="560" r="2"/>
+    <circle cx="150" cy="620" r="1.5"/>
+    <circle cx="220" cy="580" r="2.5"/>
+    <circle cx="280" cy="660" r="2"/>
+    <circle cx="80" cy="680" r="1.5"/>
+    <circle cx="200" cy="540" r="1.8"/>
+    <circle cx="320" cy="600" r="1.5"/>
+    <circle cx="700" cy="540" r="2"/>
+    <circle cx="850" cy="600" r="2.5"/>
+    <circle cx="920" cy="650" r="2"/>
+    <circle cx="180" cy="640" r="1.5"/>
+    <circle cx="50" cy="620" r="2"/>
+    <circle cx="280" cy="610" r="1.5"/>
+    <circle cx="370" cy="660" r="2"/>
+    <circle cx="780" cy="640" r="1.5"/>
+    <circle cx="880" cy="540" r="2"/>
+    <circle cx="950" cy="580" r="1.5"/>
+    <circle cx="120" cy="555" r="1.5"/>
+    <circle cx="730" cy="680" r="2"/>
+    <circle cx="820" cy="570" r="1.5"/>
+  </g>
+
+  <!-- Pebbles -->
+  <g fill="#937555" opacity="0.7">
+    <ellipse cx="160" cy="675" rx="4" ry="2.5"/>
+    <ellipse cx="850" cy="660" rx="3.5" ry="2"/>
+    <ellipse cx="50" cy="650" rx="3" ry="2"/>
+    <ellipse cx="930" cy="595" rx="3.5" ry="2"/>
+  </g>
+
+  <!-- Seashell -->
+  <g transform="translate(820, 670)">
+    <path d="M 0 0 Q -10 -14 -4 -22 Q 0 -26 6 -22 Q 14 -14 9 -3 Q 6 4 0 0 Z" fill="#F5C68C" stroke="#C9966A" stroke-width="0.6"/>
+    <path d="M -6 -14 Q 0 -18 6 -14" fill="none" stroke="#C9966A" stroke-width="0.5"/>
+    <path d="M -7 -10 Q 0 -13 7 -10" fill="none" stroke="#C9966A" stroke-width="0.4"/>
+  </g>
+
+  <!-- Starfish -->
+  <g transform="translate(220, 690)" opacity="0.85">
+    <path d="M 0 -12 L 3 -3 L 12 -2 L 5 4 L 7 13 L 0 8 L -7 13 L -5 4 L -12 -2 L -3 -3 Z" fill="#E68959" stroke="#A85530" stroke-width="0.6"/>
+  </g>
+
+  <!-- Bike tire tracks -->
+  <g stroke="#9a7a55" stroke-width="3" fill="none" opacity="0.4" stroke-dasharray="5 3">
+    <path d="M 30 665 Q 150 658 270 655"/>
+    <path d="M 30 675 Q 150 668 270 665"/>
+  </g>
+
+  <!-- Ground shadow under bike -->
+  <ellipse cx="500" cy="652" rx="200" ry="14" fill="#5a3018" opacity="0.3"/>
+
+  <!-- BICYCLE -->
+  <g id="bicycle">
+    <!-- Back wheel -->
+    <circle cx="340" cy="595" r="65" fill="url(#tireRad)"/>
+    <circle cx="340" cy="595" r="52" fill="#F0F0F0"/>
+    <circle cx="340" cy="595" r="50" fill="none" stroke="#A0A0A0" stroke-width="2"/>
+    <g stroke="#909090" stroke-width="1.3">
+      <line x1="340" y1="545" x2="340" y2="645"/>
+      <line x1="290" y1="595" x2="390" y2="595"/>
+      <line x1="306" y1="561" x2="374" y2="629"/>
+      <line x1="306" y1="629" x2="374" y2="561"/>
+      <line x1="295" y1="578" x2="385" y2="612"/>
+      <line x1="295" y1="612" x2="385" y2="578"/>
+    </g>
+    <circle cx="340" cy="595" r="9" fill="#666666"/>
+    <circle cx="340" cy="595" r="5" fill="#1F1F1F"/>
+    <circle cx="338" cy="593" r="1.5" fill="#A0A0A0"/>
+
+    <!-- Front wheel -->
+    <circle cx="660" cy="595" r="65" fill="url(#tireRad)"/>
+    <circle cx="660" cy="595" r="52" fill="#F0F0F0"/>
+    <circle cx="660" cy="595" r="50" fill="none" stroke="#A0A0A0" stroke-width="2"/>
+    <g stroke="#909090" stroke-width="1.3">
+      <line x1="660" y1="545" x2="660" y2="645"/>
+      <line x1="610" y1="595" x2="710" y2="595"/>
+      <line x1="626" y1="561" x2="694" y2="629"/>
+      <line x1="626" y1="629" x2="694" y2="561"/>
+      <line x1="615" y1="578" x2="705" y2="612"/>
+      <line x1="615" y1="612" x2="705" y2="578"/>
+    </g>
+    <circle cx="660" cy="595" r="9" fill="#666666"/>
+    <circle cx="660" cy="595" r="5" fill="#1F1F1F"/>
+    <circle cx="658" cy="593" r="1.5" fill="#A0A0A0"/>
+
+    <!-- Frame tubes -->
+    <g stroke="url(#frameRed)" stroke-width="10" stroke-linecap="round" fill="none">
+      <line x1="500" y1="585" x2="640" y2="455"/>
+      <line x1="440" y1="465" x2="640" y2="455"/>
+      <line x1="500" y1="585" x2="440" y2="465"/>
+      <line x1="500" y1="585" x2="340" y2="595"/>
+      <line x1="440" y1="465" x2="340" y2="595"/>
+    </g>
+
+    <!-- Frame highlights -->
+    <g stroke="#FF8888" stroke-width="2" stroke-linecap="round" fill="none" opacity="0.7">
+      <line x1="503" y1="582" x2="640" y2="453"/>
+      <line x1="445" y1="463" x2="638" y2="453"/>
+    </g>
+
+    <!-- Crank -->
+    <circle cx="500" cy="585" r="16" fill="#404040"/>
+    <circle cx="500" cy="585" r="11" fill="#1a1a1a"/>
+    <circle cx="500" cy="585" r="4" fill="#666"/>
+    <g stroke="#2a2a2a" stroke-width="6" stroke-linecap="round">
+      <line x1="500" y1="585" x2="545" y2="618"/>
+      <line x1="500" y1="585" x2="455" y2="552"/>
+    </g>
+    <rect x="535" y="613" width="26" height="9" rx="2" fill="#1a1a1a"/>
+    <rect x="535" y="611" width="26" height="2" rx="1" fill="#444"/>
+    <rect x="439" y="548" width="26" height="9" rx="2" fill="#1a1a1a"/>
+    <rect x="439" y="546" width="26" height="2" rx="1" fill="#444"/>
+
+    <!-- Chain -->
+    <path d="M 340 595 Q 420 590 500 600" stroke="#5a5a5a" stroke-width="2" fill="none" stroke-dasharray="3 2"/>
+
+    <!-- Seat -->
+    <line x1="440" y1="465" x2="440" y2="440" stroke="#2a2a2a" stroke-width="7" stroke-linecap="round"/>
+    <path d="M 408 438 Q 408 432 416 432 L 468 434 Q 478 434 475 442 Q 470 446 460 444 L 418 444 Q 410 444 408 438 Z" fill="#3a2010"/>
+    <ellipse cx="440" cy="436" rx="32" ry="5" fill="#5a3018"/>
+    <ellipse cx="438" cy="434" rx="20" ry="2" fill="#7a4020" opacity="0.7"/>
+
+    <!-- Handlebar stem and bars -->
+    <line x1="640" y1="455" x2="640" y2="420" stroke="#2a2a2a" stroke-width="7" stroke-linecap="round"/>
+    <path d="M 580 425 Q 600 415 620 422 L 660 422 Q 680 415 700 425" fill="none" stroke="#2a2a2a" stroke-width="6" stroke-linecap="round"/>
+    <line x1="572" y1="425" x2="585" y2="425" stroke="#1a1a1a" stroke-width="11" stroke-linecap="round"/>
+    <line x1="695" y1="425" x2="708" y2="425" stroke="#1a1a1a" stroke-width="11" stroke-linecap="round"/>
+    <line x1="575" y1="425" x2="580" y2="425" stroke="#FF6644" stroke-width="3" stroke-linecap="round"/>
+    <line x1="700" y1="425" x2="705" y2="425" stroke="#FF6644" stroke-width="3" stroke-linecap="round"/>
+
+    <!-- Front fork -->
+    <line x1="640" y1="455" x2="660" y2="595" stroke="url(#frameRed)" stroke-width="8" stroke-linecap="round"/>
+
+    <!-- Front basket with fish -->
+    <path d="M 668 405 L 720 405 L 715 440 L 673 440 Z" fill="#C09060" stroke="#7A5030" stroke-width="1.5"/>
+    <g stroke="#7A5030" stroke-width="0.8" fill="none">
+      <line x1="675" y1="412" x2="715" y2="412"/>
+      <line x1="676" y1="422" x2="714" y2="422"/>
+      <line x1="677" y1="432" x2="713" y2="432"/>
+      <line x1="680" y1="405" x2="678" y2="440"/>
+      <line x1="690" y1="405" x2="688" y2="440"/>
+      <line x1="700" y1="405" x2="700" y2="440"/>
+      <line x1="710" y1="405" x2="712" y2="440"/>
+    </g>
+    <g transform="translate(694, 418)">
+      <ellipse cx="0" cy="0" rx="13" ry="6" fill="#7AB8D8"/>
+      <ellipse cx="-2" cy="-2" rx="9" ry="3" fill="#A0D0E8" opacity="0.7"/>
+      <path d="M 11 0 L 18 -6 L 18 6 Z" fill="#7AB8D8"/>
+      <circle cx="-7" cy="-1" r="1.8" fill="#1a1a1a"/>
+      <circle cx="-7" cy="-1" r="0.6" fill="#FFF"/>
+      <path d="M -5 3 Q 0 5 5 3" stroke="#5090B0" stroke-width="0.5" fill="none"/>
+    </g>
+  </g>
+
+  <!-- PELICAN -->
+  <g id="pelican">
+    <!-- Tail feathers -->
+    <path d="M 380 425 L 320 415 L 305 425 L 320 435 L 380 440 Z" fill="url(#wing)"/>
+    <path d="M 380 430 L 330 425 L 320 432 L 340 445 L 380 445 Z" fill="#9a9a9a" opacity="0.7"/>
+    <g stroke="#666" stroke-width="0.6" fill="none">
+      <line x1="370" y1="425" x2="325" y2="420"/>
+      <line x1="370" y1="432" x2="325" y2="430"/>
+      <line x1="370" y1="440" x2="325" y2="440"/>
+    </g>
+
+    <!-- Far wing shape behind body -->
+    <path d="M 460 410 Q 530 405 590 415 Q 620 420 615 430 Q 595 432 565 425 Q 510 422 470 425 Z" fill="#B8B8B8" opacity="0.7"/>
+
+    <!-- Body -->
+    <ellipse cx="455" cy="430" rx="92" ry="58" fill="url(#pelicanBody)"/>
+
+    <!-- Body bottom shading -->
+    <path d="M 380 450 Q 420 488 480 490 Q 530 488 545 460 Q 530 480 470 484 Q 410 482 380 450 Z" fill="#BABABA" opacity="0.55"/>
+
+    <!-- Belly highlight -->
+    <ellipse cx="430" cy="420" rx="40" ry="20" fill="#FFFFFF" opacity="0.4"/>
+
+    <!-- Folded wing on visible side -->
+    <path d="M 405 405 Q 440 395 490 410 Q 530 425 535 460 Q 530 475 495 478 Q 450 478 415 465 Q 395 442 405 405 Z" fill="url(#wing)"/>
+
+    <!-- Feather lines on wing -->
+    <g stroke="#777" stroke-width="0.9" fill="none" opacity="0.7">
+      <path d="M 425 410 Q 432 432 440 458"/>
+      <path d="M 445 410 Q 452 432 458 460"/>
+      <path d="M 465 415 Q 472 435 478 462"/>
+      <path d="M 485 420 Q 492 440 495 463"/>
+      <path d="M 505 430 Q 510 445 512 463"/>
+    </g>
+
+    <!-- Dark wing tips -->
+    <path d="M 405 455 Q 392 465 386 480 Q 395 482 412 470 Q 415 463 405 455 Z" fill="#1F1F1F"/>
+    <path d="M 415 460 Q 405 472 400 485 Q 410 486 422 475 Q 425 468 415 460 Z" fill="#2A2A2A"/>
+    <path d="M 425 462 Q 416 475 412 488 Q 422 490 432 478 Q 434 470 425 462 Z" fill="#363636"/>
+
+    <!-- Wing shoulder highlight -->
+    <ellipse cx="450" cy="420" rx="25" ry="10" fill="#FFFFFF" opacity="0.5"/>
+
+    <!-- Wing-arm reaching forward to handlebar -->
+    <path d="M 510 425 Q 555 420 595 425 Q 615 425 620 432 Q 615 438 595 438 Q 555 438 510 440 Z" fill="url(#pelicanBody)" stroke="#C0C0C0" stroke-width="0.5"/>
+    <g stroke="#999" stroke-width="0.6" fill="none" opacity="0.5">
+      <path d="M 530 426 Q 545 432 545 436"/>
+      <path d="M 555 425 Q 568 432 568 436"/>
+      <path d="M 580 425 Q 590 432 590 436"/>
+    </g>
+
+    <!-- Wing tip "hand" gripping handlebar -->
+    <ellipse cx="612" cy="430" rx="14" ry="8" fill="url(#pelicanBody)" stroke="#A0A0A0" stroke-width="0.6"/>
+    <g fill="#666" opacity="0.7">
+      <ellipse cx="615" cy="436" rx="3" ry="2"/>
+      <ellipse cx="608" cy="437" rx="3" ry="2"/>
+      <ellipse cx="601" cy="436" rx="3" ry="2"/>
+    </g>
+
+    <!-- Neck S-curve -->
+    <path d="M 515 410 C 525 380, 545 360, 575 350 C 600 348, 615 358, 615 380 C 615 395, 600 405, 580 400 C 555 400, 535 415, 525 425 Z" fill="url(#pelicanBody)" stroke="#C8C8C8" stroke-width="0.5"/>
+    <path d="M 525 415 C 540 400, 560 388, 590 388 C 600 388, 605 395, 600 400 C 585 402, 565 410, 545 420 Z" fill="#D8D8D8" opacity="0.5"/>
+
+    <!-- Head -->
+    <circle cx="605" cy="355" r="34" fill="url(#pelicanBody)"/>
+    <path d="M 580 358 Q 590 385 615 388 Q 632 386 635 372 Q 628 378 605 380 Q 588 377 580 358 Z" fill="#D0D0D0" opacity="0.55"/>
+    <ellipse cx="600" cy="328" rx="15" ry="6" fill="#FFFFFF" opacity="0.7"/>
+
+    <!-- Eye patch (yellowish skin) -->
+    <ellipse cx="615" cy="350" rx="10" ry="7" fill="#FFE08A" opacity="0.7"/>
+
+    <!-- Eye -->
+    <circle cx="617" cy="349" r="5" fill="#FFFFFF"/>
+    <circle cx="618" cy="350" r="4" fill="#2a1a08"/>
+    <circle cx="618" cy="350" r="2.5" fill="#000000"/>
+    <circle cx="619" cy="348" r="1.5" fill="#FFFFFF"/>
+
+    <!-- Eyebrow -->
+    <path d="M 608 342 Q 618 340 626 343" stroke="#999" stroke-width="0.8" fill="none"/>
+
+    <!-- Upper beak -->
+    <path d="M 630 358 Q 670 348 715 352 Q 745 354 752 360 Q 750 366 745 367 Q 715 365 670 367 Q 640 368 630 365 Z" fill="url(#beak)" stroke="#A06820" stroke-width="0.8"/>
+    <path d="M 635 358 Q 680 352 720 354 Q 730 356 728 360 Q 700 358 670 360 Q 645 360 635 358 Z" fill="#FFE9B0" opacity="0.5"/>
+
+    <!-- Beak hook -->
+    <path d="M 745 362 Q 758 364 760 372 Q 756 376 745 370 Z" fill="#9a6010"/>
+    <path d="M 750 365 Q 757 367 758 372" stroke="#7a4810" stroke-width="0.8" fill="none"/>
+
+    <!-- Nostril -->
+    <ellipse cx="660" cy="360" rx="2.5" ry="1.2" fill="#6a3a08"/>
+
+    <!-- Beak segment lines -->
+    <g stroke="#A06820" stroke-width="0.5" fill="none" opacity="0.5">
+      <path d="M 680 358 Q 680 363 680 367"/>
+      <path d="M 710 357 Q 710 362 710 366"/>
+    </g>
+
+    <!-- Pouch / lower beak -->
+    <path d="M 630 370 Q 645 410 685 425 Q 725 425 745 410 Q 752 395 748 378 Q 720 378 685 376 Q 650 374 630 370 Z" fill="url(#pouch)" stroke="#A05020" stroke-width="0.8"/>
+    <path d="M 630 370 Q 700 376 748 378" fill="none" stroke="#B04020" stroke-width="0.8"/>
+    <path d="M 645 385 Q 670 408 705 414 Q 695 405 670 398 Q 650 390 645 385 Z" fill="#FFD0A0" opacity="0.5"/>
+    <g stroke="#9A4018" stroke-width="0.6" fill="none" opacity="0.55">
+      <path d="M 650 388 Q 680 410 715 412"/>
+      <path d="M 670 400 Q 695 418 720 415"/>
+      <path d="M 690 395 Q 710 412 730 405"/>
+    </g>
+
+    <!-- Legs -->
+    <path d="M 455 485 Q 452 525 458 550" stroke="url(#leg)" stroke-width="9" fill="none" stroke-linecap="round"/>
+    <g transform="translate(452, 550)">
+      <path d="M 0 0 Q -5 -2 -8 3 Q -7 8 0 9 Q 8 10 14 8 Q 18 5 16 0 Q 14 -3 8 -2 Q 4 -3 0 0 Z" fill="url(#leg)" stroke="#7a3010" stroke-width="0.8"/>
+      <g stroke="#7a3010" stroke-width="0.5" fill="none">
+        <path d="M -2 4 L 4 8"/>
+        <path d="M 4 5 L 10 9"/>
+        <path d="M 9 4 L 14 7"/>
+      </g>
+    </g>
+
+    <path d="M 505 480 Q 525 555 545 612" stroke="url(#leg)" stroke-width="9" fill="none" stroke-linecap="round"/>
+    <g transform="translate(540, 612)">
+      <path d="M 0 0 Q -5 -2 -8 3 Q -7 8 0 9 Q 8 10 14 8 Q 18 5 16 0 Q 14 -3 8 -2 Q 4 -3 0 0 Z" fill="url(#leg)" stroke="#7a3010" stroke-width="0.8"/>
+      <g stroke="#7a3010" stroke-width="0.5" fill="none">
+        <path d="M -2 4 L 4 8"/>
+        <path d="M 4 5 L 10 9"/>
+        <path d="M 9 4 L 14 7"/>
+      </g>
+    </g>
+  </g>
+
+  <!-- Warm atmospheric overlay -->
+  <rect width="1000" height="700" fill="url(#sunGlow)" opacity="0.12"/>
+</svg>
diff --git a/outputs/claude-opus-4-7/claude-code-max/skeleton-watch.html b/outputs/claude-opus-4-7/claude-code-max/skeleton-watch.html
new file mode 100644
index 0000000..a16a1d6
--- /dev/null
+++ b/outputs/claude-opus-4-7/claude-code-max/skeleton-watch.html
@@ -0,0 +1,968 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width,initial-scale=1" />
+<title>Cal. 1894 — Skeleton Mechanical Watch</title>
+<style>
+  *{margin:0;padding:0;box-sizing:border-box}
+  html,body{width:100%;height:100%;overflow:hidden;background:#06070a;color:#e8e8e8;font-family:'Helvetica Neue',Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
+  #app{position:fixed;inset:0}
+  canvas{display:block}
+  .vignette{position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 50% 45%,transparent 35%,rgba(0,0,0,.65) 100%)}
+  .grain{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
+  .ui{position:fixed;z-index:10;pointer-events:none}
+  .ui>*{pointer-events:auto}
+  .brand{top:30px;left:34px;font-family:'Times New Roman',serif;letter-spacing:.45em;font-size:10px;color:#7a7a7a;text-transform:uppercase}
+  .brand .crest{width:34px;height:1px;background:linear-gradient(90deg,transparent,#b48a4c,transparent);margin:14px 0 12px}
+  .brand .ttl{font-size:22px;letter-spacing:.32em;color:#ececec;font-weight:200;margin-top:2px}
+  .brand .sub{margin-top:8px;font-size:9px;color:#555;letter-spacing:.55em}
+  .info{top:30px;right:32px;width:300px;background:rgba(14,15,18,.72);backdrop-filter:blur(20px) saturate(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.1);border:1px solid rgba(255,255,255,.06);padding:24px 26px;border-radius:2px;box-shadow:0 30px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.04)}
+  .info h2{font-size:10px;letter-spacing:.42em;color:#888;text-transform:uppercase;font-weight:300;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid rgba(180,140,80,.18);display:flex;justify-content:space-between;align-items:center}
+  .info h2 .mark{color:#c8a05a;font-family:'Times New Roman',serif;letter-spacing:.2em;font-size:9px}
+  .info .row{display:flex;justify-content:space-between;padding:6px 0;font-size:11.5px}
+  .info .lbl{color:#666;letter-spacing:.12em;text-transform:uppercase;font-size:10px}
+  .info .val{color:#d4d4d4;font-family:'Courier New',monospace;letter-spacing:.05em}
+  .controls{bottom:34px;left:34px;display:flex;gap:8px;flex-wrap:wrap;max-width:520px}
+  .btn{background:rgba(20,22,26,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#c8c8c8;border:1px solid rgba(255,255,255,.08);padding:11px 18px;cursor:pointer;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;transition:.28s cubic-bezier(.4,0,.2,1);border-radius:2px;font-family:inherit;position:relative;overflow:hidden}
+  .btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(200,160,90,.08) 50%,transparent 60%);transform:translateX(-100%);transition:transform .6s}
+  .btn:hover{background:rgba(34,36,42,.85);color:#fff;border-color:rgba(255,255,255,.18);transform:translateY(-1px)}
+  .btn:hover::before{transform:translateX(100%)}
+  .btn.active{background:rgba(180,140,80,.16);border-color:rgba(200,160,90,.5);color:#e8c98c;box-shadow:0 0 22px rgba(200,160,90,.15)}
+  .part-panel{bottom:34px;right:32px;width:310px;background:rgba(14,15,18,.82);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(200,160,90,.22);padding:22px 26px;border-radius:2px;opacity:0;transform:translateY(10px);transition:.35s cubic-bezier(.4,0,.2,1);pointer-events:none;box-shadow:0 25px 60px rgba(0,0,0,.55)}
+  .part-panel.show{opacity:1;transform:translateY(0);pointer-events:auto}
+  .part-panel .pcat{font-size:9px;letter-spacing:.45em;color:#c8a05a;margin-bottom:6px;text-transform:uppercase}
+  .part-panel .pname{font-size:18px;letter-spacing:.18em;color:#f0f0f0;text-transform:uppercase;margin-bottom:14px;font-weight:200;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.07)}
+  .part-panel .pdesc{font-size:12.5px;line-height:1.75;color:#b4b4b4;font-weight:300}
+  .part-panel .pspec{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;font-size:10px}
+  .part-panel .pspec span:nth-child(odd){color:#666;letter-spacing:.1em;text-transform:uppercase}
+  .part-panel .pspec span:nth-child(even){color:#c5c5c5;font-family:'Courier New',monospace}
+  .hint{position:fixed;left:50%;bottom:12vh;transform:translateX(-50%);color:#3d3d3d;font-size:9.5px;letter-spacing:.55em;text-transform:uppercase;pointer-events:none;z-index:5;text-align:center;transition:opacity .8s;white-space:nowrap}
+  .tooltip{position:fixed;background:rgba(8,9,12,.94);border:1px solid rgba(200,160,90,.4);color:#e8c98c;padding:6px 13px;font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;pointer-events:none;border-radius:1px;opacity:0;transition:opacity .15s,transform .15s;z-index:20;white-space:nowrap;font-weight:400;transform:translate(-50%,-100%) translateY(-12px)}
+  .tooltip.show{opacity:1;transform:translate(-50%,-100%) translateY(-18px)}
+  .tooltip::after{content:'';position:absolute;left:50%;bottom:-5px;transform:translateX(-50%) rotate(45deg);width:6px;height:6px;background:rgba(8,9,12,.94);border-right:1px solid rgba(200,160,90,.4);border-bottom:1px solid rgba(200,160,90,.4)}
+  .labels{position:fixed;inset:0;pointer-events:none;z-index:6}
+  .label{position:absolute;display:flex;align-items:center;font-size:9.5px;letter-spacing:.3em;color:#9c9c9c;text-transform:uppercase;white-space:nowrap;transition:opacity .35s;opacity:0;font-weight:300}
+  .label.show{opacity:1}
+  .label .ln{width:60px;height:1px;background:linear-gradient(90deg,rgba(200,160,90,.7),rgba(200,160,90,.1));margin-right:10px;position:relative}
+  .label .ln::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:#c8a05a;box-shadow:0 0 8px #c8a05a}
+  .label.right{flex-direction:row-reverse}
+  .label.right .ln{margin-right:0;margin-left:10px;background:linear-gradient(-90deg,rgba(200,160,90,.7),rgba(200,160,90,.1))}
+  .label.right .ln::before{left:auto;right:0}
+  .corners{position:fixed;inset:24px;pointer-events:none;z-index:4}
+  .corners span{position:absolute;width:18px;height:18px;border:1px solid rgba(200,160,90,.22)}
+  .corners span:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}
+  .corners span:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}
+  .corners span:nth-child(3){bottom:0;left:0;border-right:0;border-top:0}
+  .corners span:nth-child(4){bottom:0;right:0;border-left:0;border-top:0}
+  .loading{position:fixed;inset:0;background:#06070a;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:100;transition:opacity 1s}
+  .loading.hide{opacity:0;pointer-events:none}
+  .loading .lt{font-size:10px;letter-spacing:.55em;color:#888;margin-bottom:24px;text-transform:uppercase}
+  .loading .lb{width:200px;height:1px;background:rgba(255,255,255,.07);position:relative;overflow:hidden}
+  .loading .lb::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#c8a05a,transparent);animation:sw 1.5s infinite}
+  @keyframes sw{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
+</style>
+</head>
+<body>
+<div id="app"></div>
+<div class="vignette"></div>
+<div class="grain"></div>
+<div class="corners"><span></span><span></span><span></span><span></span></div>
+<div class="loading" id="loading"><div class="lt">Calibrating Movement</div><div class="lb"></div></div>
+<div class="ui brand">
+  <div>Maison Horologie</div>
+  <div class="crest"></div>
+  <div class="ttl">SKELETON · CAL. 1894</div>
+  <div class="sub">GENÈVE · SUISSE</div>
+</div>
+<div class="ui info">
+  <h2><span>Specification</span><span class="mark">N° 0027 / 88</span></h2>
+  <div class="row"><span class="lbl">Caliber</span><span class="val">1894-SK</span></div>
+  <div class="row"><span class="lbl">Movement</span><span class="val">Manual Wind</span></div>
+  <div class="row"><span class="lbl">Frequency</span><span class="val">28,800 vph</span></div>
+  <div class="row"><span class="lbl">Jewels</span><span class="val">29 Rubies</span></div>
+  <div class="row"><span class="lbl">Reserve</span><span class="val">72 Hours</span></div>
+  <div class="row"><span class="lbl">Case</span><span class="val">904L Steel</span></div>
+  <div class="row"><span class="lbl">Crystal</span><span class="val">Sapphire AR</span></div>
+  <div class="row"><span class="lbl">Diameter</span><span class="val">41.0 mm</span></div>
+  <div class="row"><span class="lbl">Finishing</span><span class="val">Côtes / Anglage</span></div>
+</div>
+<div class="ui controls">
+  <button class="btn active" id="btn-spin">Auto Rotate</button>
+  <button class="btn" id="btn-explode">Exploded View</button>
+  <button class="btn" id="btn-labels">Labels</button>
+  <button class="btn" id="btn-lume">Lume</button>
+  <button class="btn" id="btn-reset">Reset</button>
+</div>
+<div class="part-panel" id="partPanel">
+  <div class="pcat" id="pCat">Component</div>
+  <div class="pname" id="pName">—</div>
+  <div class="pdesc" id="pDesc"></div>
+  <div class="pspec" id="pSpec"></div>
+</div>
+<div class="labels" id="labelLayer"></div>
+<div class="tooltip" id="tooltip"></div>
+<div class="hint" id="hint">Drag to rotate · Scroll to zoom · Click parts</div>
+
+<script type="importmap">
+{
+  "imports": {
+    "three": "https://unpkg.com/three@0.160.0/build/three.module.js",
+    "three/addons/": "https://unpkg.com/three@0.160.0/examples/jsm/"
+  }
+}
+</script>
+<script type="module">
+import * as THREE from 'three';
+import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js';
+
+const META = {
+  case:{cat:'Exterior',name:'Case',desc:'Mirror-polished 904L stainless steel mid-case with vertically brushed flanks. Hand-finished to a 40 µm tolerance over 24 hours of polishing.',spec:[['Material','904L Steel'],['Finish','Mirror Polished'],['Diameter','41.0 mm'],['Thickness','11.2 mm']]},
+  crystal:{cat:'Exterior',name:'Sapphire Crystal',desc:'Domed monocrystalline sapphire with a seven-layer anti-reflective coating on both surfaces. Hardness 9 on the Mohs scale, second only to diamond.',spec:[['Material','Sapphire'],['IOR','1.770'],['Coating','7-Layer AR'],['Hardness','Mohs 9']]},
+  bezel:{cat:'Exterior',name:'Polished Bezel',desc:'Fixed polished bezel with internal step. A diamond-cut chamfer at the inner edge catches the light along the dial perimeter.',spec:[['Profile','Stepped'],['Finish','Mirror']]},
+  caseback:{cat:'Exterior',name:'Caseback Ring',desc:'Screw-down caseback ring with sapphire display window, allowing a full view of the movement from both sides of the watch.',spec:[['Type','Screw-down'],['Seal','Triple Gasket']]},
+  crown:{cat:'Exterior',name:'Onion Crown',desc:'Fluted onion-style crown with embossed maison crest. Triple-gasket sealed and screw-locked for 100 m water resistance.',spec:[['Profile','Fluted Onion'],['Gaskets','3']]},
+  lug:{cat:'Exterior',name:'Strap Lugs',desc:'Integrated polished lugs with curved underside contour to match the wrist. Drilled through-holes for tool-free strap exchange.',spec:[['Span','20 mm'],['Spring Bar','1.8 mm']]},
+  mainspring:{cat:'Power',name:'Mainspring Barrel',desc:'Houses a 1,460 mm coiled flat spring storing 72 hours of energy. Releases torque linearly via a Geneva-stop mechanism.',spec:[['Coils','11.5'],['Reserve','72 h'],['Torque','9.4 g·cm']]},
+  centerWheel:{cat:'Gear Train',name:'Center Wheel',desc:'The second wheel after the barrel, mounted at the heart of the movement. Drives the minute hand at one rotation per hour.',spec:[['Teeth','64'],['Period','60 min'],['Pivots','2 Rubies']]},
+  thirdWheel:{cat:'Gear Train',name:'Third Wheel',desc:'Intermediate transmission wheel that steps down torque between the center wheel and the fourth wheel of the gear train.',spec:[['Teeth','60'],['Pinion','10 leaves']]},
+  fourthWheel:{cat:'Gear Train',name:'Fourth Wheel',desc:'Penultimate wheel before the escape wheel. Carries the small seconds hand at six o\'clock — one rotation per minute.',spec:[['Teeth','56'],['Period','60 s']]},
+  escapeWheel:{cat:'Escapement',name:'Escape Wheel',desc:'15-tooth lever-escapement wheel released one tooth at a time by the pallet fork. Each release is one tick of the watch.',spec:[['Teeth','15'],['Beats','8/s']]},
+  pallet:{cat:'Escapement',name:'Pallet Fork',desc:'Lever with two ruby pallet stones (entry and exit) that lock and release the escape wheel. The audible "tick-tock" originates here.',spec:[['Stones','2 Rubies'],['Travel','12°']]},
+  balance:{cat:'Regulator',name:'Balance Wheel',desc:'Glucydur free-sprung balance with four gold mean-time regulating screws. Oscillates at 4 Hz — the heart of the watch.',spec:[['Frequency','4 Hz'],['Inertia','11 mg·cm²'],['Material','Glucydur']]},
+  hairspring:{cat:'Regulator',name:'Hairspring',desc:'Phillips terminal-curve Nivarox-1 hairspring with Breguet overcoil. Returns the balance to neutral after each oscillation.',spec:[['Material','Nivarox-1'],['Coils','13']]},
+  bridge:{cat:'Architecture',name:'Skeleton Bridge',desc:'German silver bridge hand-engraved and beveled (anglage). Each interior angle is hand-polished to a 0.05 mm chamfer over six hours of work.',spec:[['Material','German Silver'],['Finish','Anglage']]},
+  jewel:{cat:'Bearings',name:'Ruby Jewel',desc:'Synthetic ruby pivot bearing. Reduces friction at high-rotation pivots to virtually nothing — a horological tradition since Fatio in 1704.',spec:[['Material','Synthetic Ruby'],['Count','29 total']]},
+  screw:{cat:'Hardware',name:'Blued Screw',desc:'Hand-heated steel screw, polished and chamfered. Heat-blued at 290 °C to a precise cornflower-blue tint.',spec:[['Treatment','290 °C Blued'],['Slot','Polished']]},
+  hands:{cat:'Display',name:'Skeleton Hands',desc:'Diamond-polished steel hands with cutaway skeleton design. Filled with Super-LumiNova X1 for night legibility up to 8 hours.',spec:[['Material','Steel'],['Lume','SLN X1']]},
+  indices:{cat:'Display',name:'Applied Indices',desc:'Solid steel indices machined from bar stock and individually polished. Each carries a luminescent SLN inlay.',spec:[['Count','12'],['Profile','Faceted']]},
+  mainPlate:{cat:'Architecture',name:'Main Plate',desc:'Base plate of the movement, hand-finished with perlage — a circular grain applied by spinning peg-wood at every pivot site.',spec:[['Material','German Silver'],['Finish','Perlage']]},
+};
+
+const APP = document.getElementById('app');
+const scene = new THREE.Scene();
+scene.background = new THREE.Color(0x06070a);
+scene.fog = new THREE.Fog(0x06070a, 22, 55);
+
+const camera = new THREE.PerspectiveCamera(34, innerWidth/innerHeight, 0.1, 100);
+camera.position.set(2, 6.5, 11);
+
+const renderer = new THREE.WebGLRenderer({ antialias:true, powerPreference:'high-performance' });
+renderer.setSize(innerWidth, innerHeight);
+renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
+renderer.shadowMap.enabled = true;
+renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+renderer.toneMapping = THREE.ACESFilmicToneMapping;
+renderer.toneMappingExposure = 1.05;
+renderer.outputColorSpace = THREE.SRGBColorSpace;
+APP.appendChild(renderer.domElement);
+
+const pmrem = new THREE.PMREMGenerator(renderer);
+pmrem.compileEquirectangularShader();
+scene.environment = pmrem.fromScene(new RoomEnvironment(), 0.035).texture;
+
+const controls = new OrbitControls(camera, renderer.domElement);
+controls.enableDamping = true;
+controls.dampingFactor = 0.07;
+controls.minDistance = 5;
+controls.maxDistance = 22;
+controls.minPolarAngle = 0.05;
+controls.maxPolarAngle = Math.PI * 0.52;
+controls.target.set(0, 0.2, 0);
+controls.autoRotate = true;
+controls.autoRotateSpeed = 0.35;
+
+const ambientLight = new THREE.AmbientLight(0x445566, 0.22);
+scene.add(ambientLight);
+const keyLight = new THREE.SpotLight(0xfff2d8, 14, 30, Math.PI/5.5, 0.55, 1.6);
+keyLight.position.set(6.5, 11, 6);
+keyLight.target.position.set(0, 0, 0); scene.add(keyLight.target);
+keyLight.castShadow = true;
+keyLight.shadow.mapSize.set(2048, 2048);
+keyLight.shadow.bias = -0.00012;
+keyLight.shadow.normalBias = 0.012;
+keyLight.shadow.radius = 7;
+keyLight.shadow.camera.near = 1;
+keyLight.shadow.camera.far = 30;
+scene.add(keyLight);
+const rimLight = new THREE.SpotLight(0x88a8ff, 8, 28, Math.PI/4.5, 0.7, 1.2);
+rimLight.position.set(-7.5, 7, -4);
+rimLight.target.position.set(0, 0, 0); scene.add(rimLight.target);
+scene.add(rimLight);
+const fillLight = new THREE.DirectionalLight(0xfff0d0, 0.25);
+fillLight.position.set(-2, 3, 6);
+scene.add(fillLight);
+const warmAccent = new THREE.PointLight(0xffaa55, 1.4, 12);
+warmAccent.position.set(2.5, 3.5, 5);
+scene.add(warmAccent);
+const coolAccent = new THREE.PointLight(0x4080ff, 1.0, 12);
+coolAccent.position.set(-3.5, 3, 4);
+scene.add(coolAccent);
+
+const floor = new THREE.Mesh(
+  new THREE.CircleGeometry(28, 96),
+  new THREE.MeshPhysicalMaterial({ color: 0x080a0d, metalness: 0.55, roughness: 0.22, clearcoat: 1.0, clearcoatRoughness: 0.06 })
+);
+floor.rotation.x = -Math.PI/2;
+floor.position.y = -1.65;
+floor.receiveShadow = true;
+scene.add(floor);
+const fadeRing = new THREE.Mesh(
+  new THREE.RingGeometry(3.5, 18, 64),
+  new THREE.MeshBasicMaterial({ color:0x06070a, transparent:true, opacity:0.45, side:THREE.DoubleSide })
+);
+fadeRing.rotation.x = -Math.PI/2;
+fadeRing.position.y = -1.64;
+scene.add(fadeRing);
+
+const MAT = {
+  steelHi: new THREE.MeshPhysicalMaterial({ color:0xd5d8de, metalness:1.0, roughness:0.10, clearcoat:0.6, clearcoatRoughness:0.05, envMapIntensity:1.3 }),
+  steelMid: new THREE.MeshPhysicalMaterial({ color:0xb8bcc4, metalness:1.0, roughness:0.22, envMapIntensity:1.15 }),
+  steelBrushed: new THREE.MeshPhysicalMaterial({ color:0xa6abb3, metalness:1.0, roughness:0.42, envMapIntensity:1.0 }),
+  germanSilver: new THREE.MeshPhysicalMaterial({ color:0xd4cdb2, metalness:1.0, roughness:0.32, clearcoat:0.3, envMapIntensity:1.1 }),
+  brass: new THREE.MeshPhysicalMaterial({ color:0xd8a868, metalness:1.0, roughness:0.22, envMapIntensity:1.45 }),
+  gold: new THREE.MeshPhysicalMaterial({ color:0xf2c878, metalness:1.0, roughness:0.13, envMapIntensity:1.5 }),
+  blued: new THREE.MeshPhysicalMaterial({ color:0x1c3a82, metalness:1.0, roughness:0.18, clearcoat:0.85, clearcoatRoughness:0.04, envMapIntensity:1.4 }),
+  ruby: new THREE.MeshPhysicalMaterial({ color:0xb01828, metalness:0.0, roughness:0.04, transmission:0.72, ior:1.77, thickness:0.35, clearcoat:1.0, envMapIntensity:1.6 }),
+  sapphire: new THREE.MeshPhysicalMaterial({ color:0xffffff, metalness:0.0, roughness:0.02, transmission:1.0, ior:1.77, thickness:0.25, clearcoat:1.0, clearcoatRoughness:0.0, transparent:true, opacity:0.82, envMapIntensity:2.0, side:THREE.DoubleSide }),
+  lume: new THREE.MeshStandardMaterial({ color:0xc4f0c8, emissive:0x80ffa8, emissiveIntensity:0.55, roughness:0.55, metalness:0.05 }),
+};
+
+function gearShape(outerR, innerR, teeth, hubR, spokes, spokeWidthFrac){
+  const s = new THREE.Shape();
+  const seg = teeth * 8;
+  for (let i = 0; i <= seg; i++){
+    const a = i / seg * Math.PI * 2;
+    const ph = (a * teeth) % (Math.PI*2) / (Math.PI*2);
+    let r;
+    if (ph < 0.30) r = outerR;
+    else if (ph < 0.50) r = outerR - (ph-0.30)/0.20 * (outerR-innerR);
+    else if (ph < 0.80) r = innerR;
+    else r = innerR + (ph-0.80)/0.20 * (outerR-innerR);
+    const x = Math.cos(a)*r, y = Math.sin(a)*r;
+    if (i===0) s.moveTo(x,y); else s.lineTo(x,y);
+  }
+  const hp = new THREE.Path();
+  hp.absarc(0, 0, hubR, 0, Math.PI*2, true);
+  s.holes.push(hp);
+  if (spokes > 0){
+    const outR = innerR * 0.83;
+    const inR = hubR * 1.7;
+    const slot = (Math.PI*2 / spokes) * (1 - spokeWidthFrac);
+    for (let k = 0; k < spokes; k++){
+      const c = (k + 0.5) * Math.PI*2 / spokes;
+      const a1 = c - slot/2, a2 = c + slot/2;
+      const p = new THREE.Path();
+      p.moveTo(Math.cos(a1)*inR, Math.sin(a1)*inR);
+      p.lineTo(Math.cos(a1)*outR, Math.sin(a1)*outR);
+      p.absarc(0, 0, outR, a1, a2, false);
+      p.lineTo(Math.cos(a2)*inR, Math.sin(a2)*inR);
+      p.absarc(0, 0, inR, a2, a1, true);
+      s.holes.push(p);
+    }
+  }
+  return s;
+}
+
+function makeWheel({ outerR, innerR, teeth, thickness=0.07, hubR=0.10, spokes=4, spokeW=0.22, mat=MAT.brass, withPinion=true }){
+  const g = new THREE.Group();
+  const shape = gearShape(outerR, innerR, teeth, hubR, spokes, spokeW);
+  const geo = new THREE.ExtrudeGeometry(shape, { depth: thickness, bevelEnabled: true, bevelThickness: thickness*0.28, bevelSize: thickness*0.20, bevelSegments: 2, curveSegments: 1, steps: 1 });
+  geo.translate(0, 0, -thickness/2);
+  geo.rotateX(Math.PI/2);
+  const mesh = new THREE.Mesh(geo, mat);
+  mesh.castShadow = true; mesh.receiveShadow = true;
+  g.add(mesh);
+  if (withPinion){
+    const pinShape = gearShape(hubR*1.85, hubR*1.45, 8, hubR*0.55, 0, 0);
+    const pinGeo = new THREE.ExtrudeGeometry(pinShape, { depth: thickness*1.4, bevelEnabled: true, bevelThickness: thickness*0.18, bevelSize: thickness*0.12, bevelSegments: 1, curveSegments:1, steps:1 });
+    pinGeo.translate(0, 0, -thickness*0.7);
+    pinGeo.rotateX(Math.PI/2);
+    const pin = new THREE.Mesh(pinGeo, MAT.steelHi);
+    pin.position.y = -thickness*1.0;
+    pin.castShadow = true;
+    g.add(pin);
+  }
+  const arbor = new THREE.Mesh(new THREE.CylinderGeometry(hubR*0.55, hubR*0.55, thickness*3.5, 14), MAT.steelHi);
+  g.add(arbor);
+  const cap = new THREE.Mesh(new THREE.CylinderGeometry(hubR*1.1, hubR*1.1, 0.025, 16), MAT.ruby);
+  cap.position.y = thickness*0.6;
+  g.add(cap);
+  return g;
+}
+
+function makeRoundedRectShape(w, h, r){
+  const s = new THREE.Shape();
+  s.moveTo(-w/2+r, -h/2);
+  s.lineTo(w/2-r, -h/2);
+  s.quadraticCurveTo(w/2, -h/2, w/2, -h/2+r);
+  s.lineTo(w/2, h/2-r);
+  s.quadraticCurveTo(w/2, h/2, w/2-r, h/2);
+  s.lineTo(-w/2+r, h/2);
+  s.quadraticCurveTo(-w/2, h/2, -w/2, h/2-r);
+  s.lineTo(-w/2, -h/2+r);
+  s.quadraticCurveTo(-w/2, -h/2, -w/2+r, -h/2);
+  return s;
+}
+
+function makeBridge({ w, h, thickness, r=0.18, holes=[], mat=MAT.germanSilver }){
+  const shape = makeRoundedRectShape(w, h, r);
+  for (const ho of holes){
+    const hp = new THREE.Path();
+    hp.absarc(ho.x, ho.y, ho.r, 0, Math.PI*2, true);
+    shape.holes.push(hp);
+  }
+  const geo = new THREE.ExtrudeGeometry(shape, { depth: thickness, bevelEnabled: true, bevelThickness: thickness*0.35, bevelSize: thickness*0.30, bevelSegments: 3, curveSegments: 6, steps: 1 });
+  geo.translate(0, 0, -thickness/2);
+  geo.rotateX(Math.PI/2);
+  const m = new THREE.Mesh(geo, mat);
+  m.castShadow = true; m.receiveShadow = true;
+  return m;
+}
+
+function makeHairspring({ innerR=0.22, outerR=0.62, turns=13, segments=420 }){
+  const pts = [];
+  for (let i = 0; i <= segments; i++){
+    const t = i / segments;
+    const a = t * Math.PI * 2 * turns;
+    const r = innerR + (outerR - innerR) * t;
+    pts.push(new THREE.Vector3(Math.cos(a)*r, 0, Math.sin(a)*r));
+  }
+  const last = pts[pts.length-1];
+  pts.push(new THREE.Vector3(last.x + 0.06, 0, last.z + 0.04));
+  const curve = new THREE.CatmullRomCurve3(pts);
+  const geo = new THREE.TubeGeometry(curve, segments, 0.012, 6, false);
+  const m = new THREE.Mesh(geo, MAT.blued);
+  m.castShadow = true;
+  return m;
+}
+
+function makeScrew(r=0.085, h=0.10, mat=MAT.blued){
+  const g = new THREE.Group();
+  const head = new THREE.Mesh(new THREE.CylinderGeometry(r, r*0.92, h, 18, 1), mat);
+  head.castShadow = true;
+  g.add(head);
+  const slot = new THREE.Mesh(new THREE.BoxGeometry(r*1.7, h*0.18, r*0.22), new THREE.MeshStandardMaterial({ color:0x000000, roughness:0.6, metalness:0.2 }));
+  slot.position.y = h/2 + 0.001;
+  g.add(slot);
+  return g;
+}
+
+function makeJewel(r=0.075){
+  const g = new THREE.Group();
+  const bezelMesh = new THREE.Mesh(new THREE.CylinderGeometry(r*1.55, r*1.55, 0.04, 18), MAT.gold);
+  g.add(bezelMesh);
+  const stone = new THREE.Mesh(new THREE.CylinderGeometry(r, r, 0.05, 18), MAT.ruby);
+  stone.position.y = 0.012;
+  g.add(stone);
+  const hole = new THREE.Mesh(new THREE.CylinderGeometry(r*0.18, r*0.18, 0.06, 12), new THREE.MeshBasicMaterial({ color:0x000000 }));
+  hole.position.y = 0.04;
+  g.add(hole);
+  return g;
+}
+
+const parts = [];
+function registerPart(obj, key, explodeOffset=0){
+  obj.userData.partKey = key;
+  obj.traverse(c => {
+    if (c.isMesh){
+      c.userData.partKey = key;
+      if (c.material) c.userData._origMat = c.material;
+    }
+  });
+  parts.push({ obj, key, basePos: obj.position.clone(), explodeOffset });
+}
+
+const watch = new THREE.Group();
+watch.rotation.x = -0.08;
+scene.add(watch);
+
+const caseGroup = new THREE.Group();
+watch.add(caseGroup);
+
+const caseBodyShape = new THREE.Shape();
+caseBodyShape.absarc(0, 0, 4.0, 0, Math.PI*2, false);
+const caseBodyHole = new THREE.Path();
+caseBodyHole.absarc(0, 0, 3.55, 0, Math.PI*2, true);
+caseBodyShape.holes.push(caseBodyHole);
+const caseBody = new THREE.Mesh(
+  new THREE.ExtrudeGeometry(caseBodyShape, { depth: 0.95, bevelEnabled: true, bevelThickness: 0.10, bevelSize: 0.10, bevelSegments: 6, curveSegments: 80, steps:1 }),
+  MAT.steelHi
+);
+caseBody.geometry.translate(0, 0, -0.475);
+caseBody.geometry.rotateX(Math.PI/2);
+caseBody.position.y = -0.05;
+caseBody.castShadow = true;
+caseBody.receiveShadow = true;
+caseGroup.add(caseBody);
+registerPart(caseBody, 'case');
+
+const bezelShape = new THREE.Shape();
+bezelShape.absarc(0, 0, 4.05, 0, Math.PI*2, false);
+const bezelHole = new THREE.Path();
+bezelHole.absarc(0, 0, 3.60, 0, Math.PI*2, true);
+bezelShape.holes.push(bezelHole);
+const bezel = new THREE.Mesh(
+  new THREE.ExtrudeGeometry(bezelShape, { depth: 0.18, bevelEnabled: true, bevelThickness: 0.06, bevelSize: 0.07, bevelSegments: 4, curveSegments: 80, steps:1 }),
+  MAT.steelHi
+);
+bezel.geometry.rotateX(Math.PI/2);
+bezel.position.y = 0.52;
+bezel.castShadow = true;
+bezel.receiveShadow = true;
+caseGroup.add(bezel);
+registerPart(bezel, 'bezel', 1.2);
+
+const backShape = new THREE.Shape();
+backShape.absarc(0, 0, 3.95, 0, Math.PI*2, false);
+const backHole = new THREE.Path();
+backHole.absarc(0, 0, 3.55, 0, Math.PI*2, true);
+backShape.holes.push(backHole);
+const caseback = new THREE.Mesh(
+  new THREE.ExtrudeGeometry(backShape, { depth: 0.15, bevelEnabled: true, bevelThickness: 0.05, bevelSize: 0.05, bevelSegments: 3, curveSegments: 64, steps:1 }),
+  MAT.steelBrushed
+);
+caseback.geometry.rotateX(Math.PI/2);
+caseback.position.y = -0.58;
+caseGroup.add(caseback);
+registerPart(caseback, 'caseback', -1.2);
+
+for (const sign of [1, -1]){
+  const lugGrp = new THREE.Group();
+  lugGrp.position.z = sign * 3.85;
+  for (const side of [-1, 1]){
+    const lug = new THREE.Mesh(new THREE.BoxGeometry(0.42, 0.55, 1.0), MAT.steelHi);
+    lug.position.set(side * 0.95, -0.10, sign * 0.45);
+    lug.castShadow = true;
+    lug.receiveShadow = true;
+    lug.rotation.x = sign * 0.18;
+    lugGrp.add(lug);
+    registerPart(lug, 'lug');
+  }
+  caseGroup.add(lugGrp);
+}
+
+const crownGrp = new THREE.Group();
+crownGrp.position.set(4.25, -0.05, 0);
+const stem = new THREE.Mesh(new THREE.CylinderGeometry(0.09, 0.09, 0.30, 14), MAT.steelHi);
+stem.rotation.z = Math.PI/2;
+stem.position.x = -0.18;
+crownGrp.add(stem);
+const crownBody = new THREE.Group();
+const crownCore = new THREE.Mesh(new THREE.CylinderGeometry(0.30, 0.32, 0.42, 28), MAT.steelHi);
+crownCore.rotation.z = Math.PI/2;
+crownBody.add(crownCore);
+for (let i = 0; i < 22; i++){
+  const a = i / 22 * Math.PI * 2;
+  const flute = new THREE.Mesh(new THREE.BoxGeometry(0.40, 0.06, 0.05), MAT.steelMid);
+  flute.position.set(0, Math.sin(a)*0.31, Math.cos(a)*0.31);
+  flute.rotation.x = a;
+  crownBody.add(flute);
+}
+const crownCap = new THREE.Mesh(new THREE.CylinderGeometry(0.18, 0.18, 0.05, 20), MAT.gold);
+crownCap.rotation.z = Math.PI/2;
+crownCap.position.x = 0.22;
+crownBody.add(crownCap);
+crownGrp.add(crownBody);
+caseGroup.add(crownGrp);
+registerPart(crownGrp, 'crown', 0.6);
+
+const mainPlateShape = new THREE.Shape();
+mainPlateShape.absarc(0, 0, 3.45, 0, Math.PI*2, false);
+const mpHole = new THREE.Path();
+mpHole.absarc(0, 0, 0.18, 0, Math.PI*2, true);
+mainPlateShape.holes.push(mpHole);
+const skelWindows = [
+  { x: 0,    y:  1.9, r: 1.05 },
+  { x: -1.8, y: -0.8, r: 0.85 },
+  { x:  1.7, y: -1.0, r: 0.75 },
+  { x:  0,   y: -1.85, r: 1.0 }
+];
+for (const w of skelWindows){
+  const p = new THREE.Path();
+  p.absarc(w.x, w.y, w.r, 0, Math.PI*2, true);
+  mainPlateShape.holes.push(p);
+}
+const mainPlate = new THREE.Mesh(
+  new THREE.ExtrudeGeometry(mainPlateShape, { depth: 0.10, bevelEnabled: true, bevelThickness: 0.04, bevelSize: 0.05, bevelSegments: 3, curveSegments: 64, steps:1 }),
+  MAT.germanSilver
+);
+mainPlate.geometry.translate(0, 0, -0.05);
+mainPlate.geometry.rotateX(Math.PI/2);
+mainPlate.position.y = -0.30;
+mainPlate.castShadow = true;
+mainPlate.receiveShadow = true;
+watch.add(mainPlate);
+registerPart(mainPlate, 'mainPlate', -0.8);
+
+const movement = new THREE.Group();
+watch.add(movement);
+
+const mainBarrelGrp = new THREE.Group();
+mainBarrelGrp.position.set(-1.55, 0.05, -1.55);
+const barrelOuter = new THREE.Mesh(new THREE.CylinderGeometry(1.10, 1.10, 0.38, 56, 1, true), MAT.steelHi);
+mainBarrelGrp.add(barrelOuter);
+const barrelTopShape = new THREE.Shape();
+barrelTopShape.absarc(0, 0, 1.10, 0, Math.PI*2, false);
+const barrelTopHole = new THREE.Path();
+barrelTopHole.absarc(0, 0, 0.12, 0, Math.PI*2, true);
+barrelTopShape.holes.push(barrelTopHole);
+const barrelTop = new THREE.Mesh(new THREE.ExtrudeGeometry(barrelTopShape, { depth: 0.03, bevelEnabled: false, curveSegments: 60, steps: 1 }), MAT.steelMid);
+barrelTop.geometry.rotateX(Math.PI/2);
+barrelTop.position.y = 0.19;
+mainBarrelGrp.add(barrelTop);
+for (let i = 0; i < 11; i++){
+  const r = 0.20 + i * 0.082;
+  const coil = new THREE.Mesh(new THREE.TorusGeometry(r, 0.014, 6, 80), MAT.blued);
+  coil.rotation.x = Math.PI/2;
+  coil.position.y = 0.205;
+  mainBarrelGrp.add(coil);
+}
+const barrelTeethGeo = new THREE.ExtrudeGeometry(gearShape(1.18, 1.10, 80, 1.05, 0, 0), { depth: 0.10, bevelEnabled: true, bevelThickness: 0.02, bevelSize: 0.02, bevelSegments: 1, curveSegments: 1, steps: 1 });
+barrelTeethGeo.translate(0, 0, -0.05);
+barrelTeethGeo.rotateX(Math.PI/2);
+const barrelTeeth = new THREE.Mesh(barrelTeethGeo, MAT.brass);
+barrelTeeth.castShadow = true;
+mainBarrelGrp.add(barrelTeeth);
+const barrelPivot = new THREE.Mesh(new THREE.CylinderGeometry(0.10, 0.10, 0.55, 16), MAT.steelHi);
+mainBarrelGrp.add(barrelPivot);
+movement.add(mainBarrelGrp);
+registerPart(mainBarrelGrp, 'mainspring', 1.6);
+
+const wheelDefs = [
+  { key:'centerWheel', pos:[0.40, 0.05, 0.10],  outerR:0.78, innerR:0.65, teeth:64, spokes:4, mat:MAT.brass },
+  { key:'thirdWheel',  pos:[1.55, 0.08, 0.35],  outerR:0.55, innerR:0.45, teeth:54, spokes:4, mat:MAT.brass },
+  { key:'fourthWheel', pos:[0.55, 0.10, 1.55],  outerR:0.48, innerR:0.39, teeth:48, spokes:3, mat:MAT.brass },
+  { key:'escapeWheel', pos:[1.55, 0.10, 1.60],  outerR:0.40, innerR:0.30, teeth:15, spokes:3, mat:MAT.steelHi },
+];
+const wheels = {};
+for (const d of wheelDefs){
+  const w = makeWheel({ outerR: d.outerR, innerR: d.innerR, teeth: d.teeth, thickness: 0.07, hubR: 0.08, spokes: d.spokes, spokeW: 0.22, mat: d.mat });
+  w.position.set(...d.pos);
+  movement.add(w);
+  registerPart(w, d.key, 0.7 + (d.key === 'escapeWheel' ? 0.2 : 0));
+  wheels[d.key] = w;
+}
+
+const palletGrp = new THREE.Group();
+palletGrp.position.set(0.55, 0.12, -1.10);
+const palletShape = new THREE.Shape();
+palletShape.moveTo(-0.45, -0.06);
+palletShape.lineTo(0.45, -0.06);
+palletShape.quadraticCurveTo(0.50, 0, 0.45, 0.06);
+palletShape.lineTo(-0.45, 0.06);
+palletShape.quadraticCurveTo(-0.50, 0, -0.45, -0.06);
+const palletGeo = new THREE.ExtrudeGeometry(palletShape, { depth: 0.05, bevelEnabled: true, bevelThickness: 0.012, bevelSize: 0.012, bevelSegments: 2 });
+palletGeo.translate(0, 0, -0.025);
+palletGeo.rotateX(Math.PI/2);
+const palletArm = new THREE.Mesh(palletGeo, MAT.steelHi);
+palletArm.castShadow = true;
+palletGrp.add(palletArm);
+const tineShape = new THREE.Shape();
+tineShape.moveTo(-0.04, -0.30);
+tineShape.lineTo(0.04, -0.30);
+tineShape.lineTo(0.06, 0.30);
+tineShape.quadraticCurveTo(0, 0.34, -0.06, 0.30);
+const tineGeo = new THREE.ExtrudeGeometry(tineShape, { depth: 0.05, bevelEnabled: true, bevelThickness: 0.01, bevelSize: 0.01, bevelSegments: 1 });
+tineGeo.translate(0, 0, -0.025);
+tineGeo.rotateX(Math.PI/2);
+const tine = new THREE.Mesh(tineGeo, MAT.steelHi);
+tine.position.x = 0.42;
+tine.castShadow = true;
+palletGrp.add(tine);
+for (const x of [-0.15, 0.15]){
+  const ps = new THREE.Mesh(new THREE.BoxGeometry(0.06, 0.08, 0.05), MAT.ruby);
+  ps.position.set(x, 0.05, 0);
+  palletGrp.add(ps);
+}
+const palletPivot = new THREE.Mesh(new THREE.CylinderGeometry(0.05, 0.05, 0.35, 12), MAT.steelHi);
+palletGrp.add(palletPivot);
+movement.add(palletGrp);
+registerPart(palletGrp, 'pallet', 0.9);
+
+const balanceGrp = new THREE.Group();
+balanceGrp.position.set(-0.45, 0.20, -1.95);
+const balanceRim = new THREE.Mesh(new THREE.TorusGeometry(0.78, 0.06, 14, 80), MAT.gold);
+balanceRim.rotation.x = Math.PI/2;
+balanceRim.castShadow = true;
+balanceGrp.add(balanceRim);
+for (let i = 0; i < 3; i++){
+  const a = i * Math.PI * 2 / 3;
+  const spk = new THREE.Mesh(new THREE.BoxGeometry(1.50, 0.04, 0.07), MAT.gold);
+  spk.rotation.y = a;
+  spk.castShadow = true;
+  balanceGrp.add(spk);
+}
+for (let i = 0; i < 4; i++){
+  const a = i * Math.PI / 2 + Math.PI/4;
+  const sc = new THREE.Mesh(new THREE.CylinderGeometry(0.05, 0.05, 0.14, 12), MAT.gold);
+  sc.position.set(Math.cos(a)*0.78, 0.02, Math.sin(a)*0.78);
+  sc.rotation.x = Math.PI/2;
+  sc.rotation.z = a;
+  balanceGrp.add(sc);
+}
+const balHub = new THREE.Mesh(new THREE.CylinderGeometry(0.10, 0.10, 0.12, 18), MAT.steelHi);
+balanceGrp.add(balHub);
+const balArbor = new THREE.Mesh(new THREE.CylinderGeometry(0.04, 0.04, 0.50, 12), MAT.steelHi);
+balanceGrp.add(balArbor);
+movement.add(balanceGrp);
+registerPart(balanceGrp, 'balance', 1.0);
+
+const hairGrp = new THREE.Group();
+hairGrp.position.copy(balanceGrp.position);
+hairGrp.position.y += 0.18;
+const hair = makeHairspring({ innerR: 0.14, outerR: 0.62, turns: 13, segments: 480 });
+hairGrp.add(hair);
+const stud = new THREE.Mesh(new THREE.BoxGeometry(0.10, 0.05, 0.08), MAT.gold);
+stud.position.set(0.66, 0.02, 0.05);
+hairGrp.add(stud);
+movement.add(hairGrp);
+registerPart(hairGrp, 'hairspring', 1.25);
+
+const bridge1 = makeBridge({ w: 4.6, h: 1.2, thickness: 0.10, r: 0.45, holes: [ { x: -1.6, y: 0, r: 0.78 }, { x: 0.45, y: 0.10, r: 0.55 }, { x: 1.55, y: -0.05, r: 0.40 } ] });
+bridge1.rotation.y = -0.22;
+bridge1.position.set(-0.2, 0.30, 0.0);
+movement.add(bridge1);
+registerPart(bridge1, 'bridge', 0.9);
+
+const bridge2 = makeBridge({ w: 2.8, h: 1.0, thickness: 0.10, r: 0.35, holes: [ { x: -0.5, y: 0, r: 0.35 }, { x: 0.55, y: 0, r: 0.30 } ] });
+bridge2.position.set(1.05, 0.30, 1.55);
+bridge2.rotation.y = 0.15;
+movement.add(bridge2);
+registerPart(bridge2, 'bridge', 0.9);
+
+const balanceCock = makeBridge({ w: 1.7, h: 0.55, thickness: 0.08, r: 0.22, holes: [{ x: -0.35, y: 0, r: 0.13 }] });
+balanceCock.position.set(-0.20, 0.46, -1.95);
+balanceCock.rotation.y = -0.35;
+movement.add(balanceCock);
+registerPart(balanceCock, 'bridge', 0.9);
+
+const palletCock = makeBridge({ w: 1.1, h: 0.35, thickness: 0.07, r: 0.15, holes: [] });
+palletCock.position.set(0.55, 0.36, -1.10);
+palletCock.rotation.y = 0.2;
+movement.add(palletCock);
+registerPart(palletCock, 'bridge', 0.9);
+
+const jewelPositions = [
+  [-1.55, 0.41, -1.55], [ 0.45, 0.41,  0.10], [ 1.55, 0.41,  0.35],
+  [ 0.55, 0.41,  1.55], [ 1.55, 0.41,  1.60],
+  [-0.45, 0.52, -1.95], [ 0.55, 0.45, -1.10],
+];
+for (const [x,y,z] of jewelPositions){
+  const j = makeJewel(0.075);
+  j.position.set(x, y, z);
+  movement.add(j);
+  registerPart(j, 'jewel', 1.1);
+}
+
+const screwSpots = [
+  [-2.2, 0.42, -0.5], [1.55, 0.42, -0.55], [1.45, 0.42, 0.65], [-2.15, 0.42, 0.5],
+  [0.05, 0.42, 1.50], [2.05, 0.42, 1.60],
+  [0.50, 0.55, -1.85], [-0.95, 0.55, -2.05],
+  [1.05, 0.45, -1.05]
+];
+for (const [x,y,z] of screwSpots){
+  const sc = makeScrew(0.085, 0.10);
+  sc.position.set(x, y, z);
+  movement.add(sc);
+  registerPart(sc, 'screw', 1.2);
+}
+
+const dialGrp = new THREE.Group();
+dialGrp.position.y = 0.50;
+watch.add(dialGrp);
+const chapterRing = new THREE.Mesh(new THREE.RingGeometry(3.10, 3.45, 96), MAT.steelMid);
+chapterRing.rotation.x = -Math.PI/2;
+chapterRing.position.y = 0.001;
+dialGrp.add(chapterRing);
+for (let i = 0; i < 12; i++){
+  const a = i / 12 * Math.PI * 2 - Math.PI/2;
+  const isQuarter = i % 3 === 0;
+  const len = isQuarter ? 0.34 : 0.22;
+  const w = isQuarter ? 0.08 : 0.05;
+  const idx = new THREE.Mesh(new THREE.BoxGeometry(w, 0.06, len), MAT.steelHi);
+  const r = 3.22;
+  idx.position.set(Math.cos(a)*r, 0.04, Math.sin(a)*r);
+  idx.rotation.y = -a + Math.PI/2;
+  idx.castShadow = true;
+  dialGrp.add(idx);
+  registerPart(idx, 'indices', 0.5);
+  const lumeInset = new THREE.Mesh(new THREE.BoxGeometry(w*0.55, 0.04, len*0.7), MAT.lume);
+  lumeInset.position.set(Math.cos(a)*r, 0.085, Math.sin(a)*r);
+  lumeInset.rotation.y = -a + Math.PI/2;
+  dialGrp.add(lumeInset);
+  registerPart(lumeInset, 'indices', 0.5);
+}
+const triShape = new THREE.Shape();
+triShape.moveTo(-0.13, -0.10);
+triShape.lineTo(0.13, -0.10);
+triShape.lineTo(0, 0.18);
+const triGeo = new THREE.ExtrudeGeometry(triShape, { depth: 0.04, bevelEnabled: true, bevelThickness: 0.01, bevelSize: 0.01, bevelSegments: 1 });
+triGeo.translate(0, 0, -0.02);
+triGeo.rotateX(Math.PI/2);
+const triMarker = new THREE.Mesh(triGeo, MAT.lume);
+triMarker.position.set(0, 0.10, -3.20);
+dialGrp.add(triMarker);
+registerPart(triMarker, 'indices', 0.5);
+
+const handsGrp = new THREE.Group();
+handsGrp.position.y = 0.60;
+watch.add(handsGrp);
+function makeHand({ length, width, color=MAT.steelHi, height=0.04 }){
+  const grp = new THREE.Group();
+  const sh = new THREE.Shape();
+  sh.moveTo(-width/2, -0.1);
+  sh.lineTo(width/2, -0.1);
+  sh.lineTo(width*0.15, length*0.92);
+  sh.quadraticCurveTo(0, length, -width*0.15, length*0.92);
+  const cut = new THREE.Path();
+  cut.moveTo(-width*0.25, length*0.15);
+  cut.lineTo(width*0.25, length*0.15);
+  cut.lineTo(width*0.06, length*0.70);
+  cut.quadraticCurveTo(0, length*0.75, -width*0.06, length*0.70);
+  sh.holes.push(cut);
+  const geo = new THREE.ExtrudeGeometry(sh, { depth: height, bevelEnabled: true, bevelThickness: height*0.4, bevelSize: height*0.4, bevelSegments: 2 });
+  geo.translate(0, 0, -height/2);
+  geo.rotateX(Math.PI/2);
+  const m = new THREE.Mesh(geo, color);
+  m.castShadow = true;
+  grp.add(m);
+  const lumeSh = new THREE.Shape();
+  lumeSh.moveTo(-width*0.20, length*0.18);
+  lumeSh.lineTo(width*0.20, length*0.18);
+  lumeSh.lineTo(width*0.05, length*0.68);
+  lumeSh.quadraticCurveTo(0, length*0.72, -width*0.05, length*0.68);
+  const lumeGeo = new THREE.ExtrudeGeometry(lumeSh, { depth: height*0.4, bevelEnabled: false });
+  lumeGeo.rotateX(Math.PI/2);
+  const lm = new THREE.Mesh(lumeGeo, MAT.lume);
+  lm.position.y = height*0.5;
+  grp.add(lm);
+  return grp;
+}
+const hourHand = makeHand({ length: 1.55, width: 0.20, color: MAT.steelHi, height: 0.045 });
+handsGrp.add(hourHand);
+registerPart(hourHand, 'hands', 0.4);
+const minHand = makeHand({ length: 2.25, width: 0.16, color: MAT.steelHi, height: 0.04 });
+minHand.position.y = 0.05;
+handsGrp.add(minHand);
+registerPart(minHand, 'hands', 0.5);
+const secHand = new THREE.Group();
+const secNeedle = new THREE.Mesh(new THREE.BoxGeometry(0.04, 0.025, 2.50), MAT.blued);
+secNeedle.position.z = 1.07;
+secHand.add(secNeedle);
+const secCounter = new THREE.Mesh(new THREE.CylinderGeometry(0.10, 0.10, 0.04, 16), MAT.blued);
+secCounter.position.z = -0.18;
+secHand.add(secCounter);
+secHand.position.y = 0.10;
+handsGrp.add(secHand);
+registerPart(secHand, 'hands', 0.6);
+const centralCap = new THREE.Mesh(new THREE.SphereGeometry(0.16, 24, 12, 0, Math.PI*2, 0, Math.PI/2), MAT.steelHi);
+centralCap.position.y = 0.15;
+handsGrp.add(centralCap);
+
+const crystalRadius = 3.55;
+const crystalGeo = new THREE.SphereGeometry(crystalRadius * 2.1, 64, 32, 0, Math.PI*2, 0, Math.PI/6);
+const crystal = new THREE.Mesh(crystalGeo, MAT.sapphire);
+crystal.position.y = -5.4;
+watch.add(crystal);
+registerPart(crystal, 'crystal', 2.2);
+const crystalRing = new THREE.Mesh(new THREE.TorusGeometry(3.58, 0.06, 12, 80), MAT.steelHi);
+crystalRing.rotation.x = Math.PI/2;
+crystalRing.position.y = 0.66;
+watch.add(crystalRing);
+
+const labelLayer = document.getElementById('labelLayer');
+const labelDefs = [
+  { key:'mainspring',  side:'left',  worldOffset:[ -1.55, 1.2, -1.55 ] },
+  { key:'balance',     side:'left',  worldOffset:[ -0.45, 1.0, -1.95 ] },
+  { key:'hairspring',  side:'left',  worldOffset:[ -1.05, 1.4, -2.15 ] },
+  { key:'pallet',      side:'right', worldOffset:[  0.55, 0.95, -1.10 ] },
+  { key:'escapeWheel', side:'right', worldOffset:[  1.55, 0.90,  1.60 ] },
+  { key:'centerWheel', side:'right', worldOffset:[  0.45, 0.85,  0.10 ] },
+  { key:'crown',       side:'right', worldOffset:[  4.55, 0.20,  0.0 ] },
+  { key:'crystal',     side:'left',  worldOffset:[ -2.4, 0.95, -1.4 ] }
+];
+const labelEls = [];
+for (const ld of labelDefs){
+  const el = document.createElement('div');
+  el.className = 'label ' + ld.side;
+  el.innerHTML = `<div class="ln"></div><span>${META[ld.key].name}</span>`;
+  labelLayer.appendChild(el);
+  labelEls.push({ el, def: ld });
+}
+
+const raycaster = new THREE.Raycaster();
+const pointer = new THREE.Vector2();
+let hoveredKey = null;
+const tooltip = document.getElementById('tooltip');
+const partPanel = document.getElementById('partPanel');
+const pName = document.getElementById('pName');
+const pCat = document.getElementById('pCat');
+const pDesc = document.getElementById('pDesc');
+const pSpec = document.getElementById('pSpec');
+
+function pickPart(){
+  raycaster.setFromCamera(pointer, camera);
+  const objs = [];
+  parts.forEach(p => p.obj.traverse(c => { if (c.isMesh) objs.push(c); }));
+  const hits = raycaster.intersectObjects(objs, false);
+  for (const h of hits){
+    let o = h.object;
+    while (o && !o.userData.partKey) o = o.parent;
+    if (o && o.userData.partKey) return { obj: o, key: o.userData.partKey };
+  }
+  return null;
+}
+function clearHighlight(key){
+  parts.filter(p => p.key === key).forEach(p => {
+    p.obj.traverse(c => { if (c.isMesh && c.userData._origMat) c.material = c.userData._origMat; });
+  });
+}
+function applyHighlight(key){
+  parts.filter(p => p.key === key).forEach(p => {
+    p.obj.traverse(c => {
+      if (c.isMesh && c.userData._origMat){
+        const cloned = c.userData._origMat.clone();
+        if ('emissive' in cloned){ cloned.emissive = new THREE.Color(0xffa550); cloned.emissiveIntensity = 0.42; }
+        c.material = cloned;
+      }
+    });
+  });
+}
+addEventListener('pointermove', e => {
+  pointer.x = (e.clientX / innerWidth) * 2 - 1;
+  pointer.y = -(e.clientY / innerHeight) * 2 + 1;
+  const pick = pickPart();
+  const nowKey = pick ? pick.key : null;
+  if (nowKey !== hoveredKey){
+    if (hoveredKey) clearHighlight(hoveredKey);
+    hoveredKey = nowKey;
+    if (hoveredKey && META[hoveredKey]){
+      applyHighlight(hoveredKey);
+      tooltip.textContent = META[hoveredKey].name;
+      tooltip.classList.add('show');
+      document.body.style.cursor = 'pointer';
+    } else {
+      tooltip.classList.remove('show');
+      document.body.style.cursor = '';
+    }
+  }
+  if (hoveredKey){
+    tooltip.style.left = e.clientX + 'px';
+    tooltip.style.top = e.clientY + 'px';
+  }
+});
+addEventListener('pointerdown', e => {
+  if (e.target !== renderer.domElement) return;
+  const pick = pickPart();
+  if (pick && META[pick.key]) showPartPanel(pick.key);
+  else partPanel.classList.remove('show');
+});
+function showPartPanel(key){
+  const m = META[key];
+  pCat.textContent = m.cat;
+  pName.textContent = m.name;
+  pDesc.textContent = m.desc;
+  pSpec.innerHTML = '';
+  for (const [lbl, val] of (m.spec || [])){
+    const a = document.createElement('span'); a.textContent = lbl;
+    const b = document.createElement('span'); b.textContent = val;
+    pSpec.appendChild(a); pSpec.appendChild(b);
+  }
+  partPanel.classList.add('show');
+}
+
+const btnSpin    = document.getElementById('btn-spin');
+const btnExplode = document.getElementById('btn-explode');
+const btnLabels  = document.getElementById('btn-labels');
+const btnLume    = document.getElementById('btn-lume');
+const btnReset   = document.getElementById('btn-reset');
+let explodeAmount = 0;
+let explodeTarget = 0;
+let labelsVisible = false;
+let lumeMode = false;
+btnSpin.addEventListener('click', () => { controls.autoRotate = !controls.autoRotate; btnSpin.classList.toggle('active', controls.autoRotate); });
+btnExplode.addEventListener('click', () => { const exploded = explodeTarget > 0.5; explodeTarget = exploded ? 0 : 1; btnExplode.classList.toggle('active', !exploded); });
+btnLabels.addEventListener('click', () => { labelsVisible = !labelsVisible; btnLabels.classList.toggle('active', labelsVisible); labelEls.forEach(({el}) => el.classList.toggle('show', labelsVisible)); });
+btnLume.addEventListener('click', () => {
+  lumeMode = !lumeMode;
+  btnLume.classList.toggle('active', lumeMode);
+  if (lumeMode){
+    renderer.toneMappingExposure = 0.30;
+    scene.background = new THREE.Color(0x010204);
+    floor.material.color.setHex(0x010206);
+    MAT.lume.emissiveIntensity = 3.2;
+    keyLight.intensity = 1.2;
+    rimLight.intensity = 0.5;
+    warmAccent.intensity = 0.25;
+    coolAccent.intensity = 0.4;
+    ambientLight.intensity = 0.05;
+  } else {
+    renderer.toneMappingExposure = 1.05;
+    scene.background = new THREE.Color(0x06070a);
+    floor.material.color.setHex(0x080a0d);
+    MAT.lume.emissiveIntensity = 0.55;
+    keyLight.intensity = 14;
+    rimLight.intensity = 8;
+    warmAccent.intensity = 1.4;
+    coolAccent.intensity = 1.0;
+    ambientLight.intensity = 0.22;
+  }
+});
+btnReset.addEventListener('click', () => { camera.position.set(2, 6.5, 11); controls.target.set(0, 0.2, 0); controls.update(); });
+
+const clock = new THREE.Clock();
+function updateLabels(){
+  if (!labelsVisible) return;
+  for (const { el, def } of labelEls){
+    const wp = new THREE.Vector3(...def.worldOffset);
+    wp.applyMatrix4(watch.matrixWorld);
+    const proj = wp.clone().project(camera);
+    if (proj.z > 1 || proj.z < -1){ el.style.display = 'none'; continue; }
+    el.style.display = '';
+    const x = (proj.x * 0.5 + 0.5) * innerWidth;
+    const y = (-proj.y * 0.5 + 0.5) * innerHeight;
+    const ox = def.side === 'right' ? 90 : -90;
+    el.style.left = (x + ox) + 'px';
+    el.style.top = y + 'px';
+    el.style.transform = def.side === 'right' ? 'translate(0,-50%)' : 'translate(-100%,-50%)';
+  }
+}
+function animate(){
+  const t = clock.getElapsedTime();
+  const dt = Math.min(clock.getDelta(), 0.05);
+  const beat = Math.sin(t * Math.PI * 8) * Math.PI * 0.35;
+  balanceGrp.rotation.y = beat;
+  hairGrp.rotation.y = beat * 0.92;
+  palletGrp.rotation.y = -Math.sin(t * Math.PI * 8 + 0.4) * 0.10;
+  const beatN = Math.floor(t * 8);
+  const beatPhase = (t * 8) % 1;
+  const tick = beatN + Math.min(1, beatPhase * 4);
+  wheels.escapeWheel.rotation.y = -tick * (Math.PI * 2 / 15);
+  wheels.fourthWheel.rotation.y = -t * 0.42;
+  wheels.thirdWheel.rotation.y  =  t * 0.19;
+  wheels.centerWheel.rotation.y = -t * 0.06;
+  mainBarrelGrp.rotation.y      =  t * 0.015;
+  secHand.rotation.y  = -t * 0.42;
+  minHand.rotation.y  = -t * 0.042;
+  hourHand.rotation.y = -t * 0.0035;
+  explodeAmount += (explodeTarget - explodeAmount) * Math.min(1, dt * 4);
+  for (const p of parts) p.obj.position.y = p.basePos.y + p.explodeOffset * explodeAmount;
+  crystal.position.y = (-5.4) + 2.2 * explodeAmount;
+  crystalRing.position.y = 0.66 + 0.7 * explodeAmount;
+  if (!lumeMode) warmAccent.intensity = 1.4 * (1 + Math.sin(t * 1.6) * 0.05);
+  controls.update();
+  renderer.render(scene, camera);
+  updateLabels();
+  requestAnimationFrame(animate);
+}
+addEventListener('resize', () => { camera.aspect = innerWidth / innerHeight; camera.updateProjectionMatrix(); renderer.setSize(innerWidth, innerHeight); });
+animate();
+setTimeout(() => {
+  document.getElementById('loading').classList.add('hide');
+  setTimeout(() => { const h = document.getElementById('hint'); if (h) h.style.opacity = '0'; }, 6500);
+}, 700);
+</script>
+</body>
+</html>
diff --git a/outputs/claude-opus-4-8/claude-code-max/skeleton-watch.html b/outputs/claude-opus-4-8/claude-code-max/skeleton-watch.html
new file mode 100644
index 0000000..103e43e
--- /dev/null
+++ b/outputs/claude-opus-4-8/claude-code-max/skeleton-watch.html
@@ -0,0 +1,1014 @@
+<!doctype html>
+<html lang="zh">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
+<title>NAGI Mécanique — Skeleton Calibre · 镂空机械腕表</title>
+<style>
+  :root{
+    --gold:#c9a463; --gold-2:#e7cf9c; --lume:#86ffd6; --ink:#e9edf2;
+    --glass:rgba(14,17,22,.62); --line:rgba(255,255,255,.10);
+  }
+  *{box-sizing:border-box;margin:0;padding:0}
+  html,body{height:100%;width:100%;overflow:hidden;background:#05060a;color:var(--ink);
+    font-family:"Helvetica Neue",Arial,system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
+  #app{position:fixed;inset:0}
+  canvas{display:block}
+  /* vignette + grain overlay */
+  #vignette{position:absolute;inset:0;pointer-events:none;z-index:3;
+    background:radial-gradient(120% 90% at 50% 38%,transparent 42%,rgba(0,0,0,.30) 72%,rgba(0,0,0,.62) 100%);}
+
+  /* brand */
+  #brand{position:absolute;left:26px;top:22px;z-index:5;pointer-events:none}
+  #brand .mk{font-family:Georgia,"Times New Roman",serif;font-size:23px;letter-spacing:.16em;
+    font-weight:400;color:#f3efe6}
+  #brand .mk b{color:var(--gold-2);font-weight:600}
+  #brand .sub{margin-top:5px;font-size:10.5px;letter-spacing:.42em;text-transform:uppercase;
+    color:rgba(233,237,242,.55)}
+  #brand .zh{margin-top:3px;font-size:11px;letter-spacing:.30em;color:rgba(201,164,99,.8)}
+
+  /* info panel */
+  #panel{position:absolute;right:20px;top:20px;width:288px;z-index:5;
+    background:var(--glass);backdrop-filter:blur(16px) saturate(1.2);
+    -webkit-backdrop-filter:blur(16px) saturate(1.2);
+    border:1px solid var(--line);border-radius:14px;padding:17px 18px;
+    box-shadow:0 24px 60px rgba(0,0,0,.5);transition:opacity .4s}
+  #panel h2{font-family:Georgia,serif;font-size:15px;letter-spacing:.05em;font-weight:600;color:#fff}
+  #panel .pz{font-size:11.5px;color:var(--gold-2);letter-spacing:.16em;margin-top:2px}
+  #panel .pd{margin-top:11px;font-size:12px;line-height:1.6;color:rgba(233,237,242,.78)}
+  #panel .pd .en{display:block;color:rgba(233,237,242,.92)}
+  #panel .pd .zh{display:block;margin-top:5px;color:rgba(233,237,242,.62)}
+  #panel hr{border:none;border-top:1px solid var(--line);margin:14px 0}
+  #panel .specs{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
+  #panel .specs div{font-size:11px}
+  #panel .specs .k{color:rgba(233,237,242,.45);letter-spacing:.06em}
+  #panel .specs .v{color:#f0e9d8;font-family:Georgia,serif;letter-spacing:.03em;margin-top:1px;font-size:13px}
+  #panel .hintline{margin-top:13px;font-size:10.5px;color:rgba(233,237,242,.38);letter-spacing:.05em}
+
+  /* controls */
+  #controls{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:5;
+    display:flex;gap:8px;padding:8px;border-radius:16px;background:var(--glass);
+    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);
+    box-shadow:0 20px 50px rgba(0,0,0,.5);flex-wrap:wrap;justify-content:center;max-width:94vw}
+  .btn{appearance:none;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);
+    color:var(--ink);font-size:12px;letter-spacing:.04em;padding:9px 13px;border-radius:11px;cursor:pointer;
+    display:flex;align-items:center;gap:7px;transition:.18s;white-space:nowrap}
+  .btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}
+  .btn.on{background:linear-gradient(180deg,rgba(201,164,99,.26),rgba(201,164,99,.12));
+    border-color:rgba(201,164,99,.55);color:#fbf3e2;box-shadow:0 0 0 1px rgba(201,164,99,.18) inset}
+  .btn svg{width:15px;height:15px;opacity:.85}
+  .btn .zh{opacity:.6;font-size:10.5px}
+
+  /* hint */
+  #hint{position:absolute;left:26px;bottom:26px;z-index:5;font-size:11px;letter-spacing:.05em;
+    color:rgba(233,237,242,.42);pointer-events:none;line-height:1.7}
+  #hint b{color:rgba(201,164,99,.85);font-weight:500}
+
+  /* labels (CSS2D) */
+  #labels{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
+  .label{pointer-events:auto;cursor:pointer;transform:transl(-50%,-50%);
+    display:flex;align-items:center;gap:7px;padding:4px 9px 4px 7px;border-radius:20px;
+    background:rgba(8,10,14,.66);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
+    border:1px solid rgba(201,164,99,.30);white-space:nowrap;
+    font-size:11px;letter-spacing:.04em;color:#f1ecdf;box-shadow:0 6px 18px rgba(0,0,0,.4);
+    opacity:0;transition:opacity .35s, border-color .2s, background .2s;transform:translateZ(0)}
+  .label.show{opacity:.96}
+  .label:hover{border-color:var(--gold);background:rgba(16,19,25,.85)}
+  .label .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-2);
+    box-shadow:0 0 8px var(--gold-2);flex:0 0 auto}
+  .label b{font-weight:600}
+  .label i{font-style:normal;opacity:.55;font-size:10px}
+
+  /* hover tooltip */
+  #tip{position:absolute;z-index:6;pointer-events:none;padding:5px 10px;border-radius:9px;
+    background:rgba(8,10,14,.86);border:1px solid rgba(201,164,99,.35);
+    font-size:12px;letter-spacing:.03em;color:#f3efe4;opacity:0;transform:translate(-50%,-140%);
+    transition:opacity .12s;white-space:nowrap;box-shadow:0 8px 20px rgba(0,0,0,.5)}
+  #tip i{font-style:normal;opacity:.6;font-size:10.5px;margin-left:4px}
+
+  /* loader */
+  #loader{position:absolute;inset:0;z-index:20;background:radial-gradient(circle at 50% 45%,#0c0f15,#05060a 70%);
+    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .8s}
+  #loader.hide{opacity:0;pointer-events:none}
+  .ring{width:54px;height:54px;border-radius:50%;border:2px solid rgba(201,164,99,.18);
+    border-top-color:var(--gold-2);animation:spin 1s linear infinite}
+  @keyframes spin{to{transform:rotate(360deg)}}
+  #loader .lt{font-family:Georgia,serif;font-size:13px;letter-spacing:.42em;text-transform:uppercase;
+    color:rgba(201,164,99,.8)}
+  @media (max-width:680px){
+    #panel{display:none}
+    #brand .mk{font-size:19px}
+    .btn .zh{display:none}
+  }
+</style>
+</head>
+<body>
+<div id="app">
+  <div id="labels"></div>
+  <div id="vignette"></div>
+
+  <header id="brand">
+    <div class="mk">NAGI <b>Mécanique</b></div>
+    <div class="sub">Skeleton Calibre N-01 · Haute Horlogerie</div>
+    <div class="zh">镂空陀飞轮机芯 · 高级制表工艺</div>
+  </header>
+
+  <aside id="panel">
+    <h2 id="p-name">Skeleton Calibre N-01</h2>
+    <div class="pz" id="p-zh">自动镂空机芯</div>
+    <div class="pd" id="p-desc">
+      <span class="en">A fully open-worked automatic movement — every wheel, jewel and bridge laid bare beneath sapphire crystal. Click any component to inspect it.</span>
+      <span class="zh">完全镂空的自动机芯，蓝宝石玻璃下每一枚齿轮、宝石与夹板尽收眼底。点击任意零件查看详情。</span>
+    </div>
+    <hr/>
+    <div class="specs">
+      <div><div class="k">Frequency 频率</div><div class="v">21'600 vph</div></div>
+      <div><div class="k">Jewels 宝石</div><div class="v">27</div></div>
+      <div><div class="k">Reserve 储能</div><div class="v">42 h</div></div>
+      <div><div class="k">Diameter 直径</div><div class="v">40.0 mm</div></div>
+    </div>
+    <div class="hintline">Drag to rotate · scroll to zoom · click parts<br/>拖动旋转 · 滚轮缩放 · 点击零件</div>
+  </aside>
+
+  <div id="tip"></div>
+
+  <nav id="controls">
+    <button class="btn on" id="b-rotate"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M21 12a9 9 0 1 1-3-6.7"/><path d="M21 4v4h-4"/></svg>Auto-Rotate<span class="zh">自转</span></button>
+    <button class="btn" id="b-explode"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M12 3v4M12 17v4M3 12h4M17 12h4M6 6l2.5 2.5M15.5 15.5 18 18M18 6l-2.5 2.5M8.5 15.5 6 18"/></svg>Exploded<span class="zh">爆炸视图</span></button>
+    <button class="btn" id="b-labels"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M3 7h13l4 5-4 5H3z"/><circle cx="7" cy="12" r="1.3" fill="currentColor" stroke="none"/></svg>Labels<span class="zh">标签</span></button>
+    <button class="btn" id="b-lume"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M12 3a6 6 0 0 0-4 10.5c.8.7 1 1.2 1 2.5h6c0-1.3.2-1.8 1-2.5A6 6 0 0 0 12 3z"/><path d="M9.5 21h5"/></svg>Lume Mode<span class="zh">夜光</span></button>
+    <button class="btn" id="b-reset"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M3 12a9 9 0 1 0 9-9M3 5v4h4"/></svg>Reset<span class="zh">复位</span></button>
+  </nav>
+
+  <div id="loader">
+    <div class="ring"></div>
+    <div class="lt">Assembling Calibre</div>
+  </div>
+</div>
+
+<script type="importmap">
+{
+  "imports": {
+    "three": "https://cdn.jsdelivr.net/npm/three@0.161.0/build/three.module.js",
+    "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.161.0/examples/jsm/"
+  }
+}
+</script>
+
+<script type="module">
+import * as THREE from 'three';
+import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.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 { CSS2DRenderer, CSS2DObject } from 'three/addons/renderers/CSS2DRenderer.js';
+import { RectAreaLightUniformsLib } from 'three/addons/lights/RectAreaLightUniformsLib.js';
+import { Reflector } from 'three/addons/objects/Reflector.js';
+
+/* ============================== globals ============================== */
+let renderer, scene, camera, controls, composer, bloomPass, labelRenderer;
+const clock = new THREE.Clock();
+const watch = new THREE.Group();          // everything that explodes lives here
+const parts = {};                         // id -> {group, materials, meta, label, targetScale}
+const labels = [];
+const selectable = [];                    // raycast targets
+const lumeSet = new Set();                // lume materials (boosted in night mode)
+const anim = { spinners: [] };
+const raycaster = new THREE.Raycaster();
+const ndc = new THREE.Vector2();
+
+let explodeT = 0, explodeTarget = 0;
+let nightT = 0, nightTarget = 0;
+let showLabels = false;
+let hovered = null, selected = null;
+let camTween = null;
+
+/* part metadata (bilingual) */
+const PARTS = {
+  crystal:{en:'Sapphire Crystal', zh:'蓝宝石水晶玻璃',
+    d_en:'A domed, anti-reflective sapphire crystal — second only to diamond in hardness, virtually scratch-proof.',
+    d_zh:'拱形防眩蓝宝石玻璃，硬度仅次于钻石，几乎不可刮花，透光纯净。'},
+  chapterring:{en:'Dial & Markers', zh:'时标环 / 表盘',
+    d_en:'A skeletonised chapter ring with applied gold appliqués and luminous inlays, opening the dial onto the movement.',
+    d_zh:'镂空时标环，立体金质刻度与荧光填料，开放式表盘直视机芯运作。'},
+  hands:{en:'Hands', zh:'指针',
+    d_en:'Hand-polished, open-tipped hands filled with Super-LumiNova for legibility in the dark.',
+    d_zh:'手工抛光镂空指针，填充长效荧光材料，暗处依旧清晰可读。'},
+  balancecock:{en:'Balance Cock', zh:'摆轮夹板',
+    d_en:'A bridge fixing the upper balance pivot, carrying the regulator index and a polished cap-jewel.',
+    d_zh:'固定摆轮上轴的夹板，承载快慢针调校系统与抛光盖宝石。'},
+  balance:{en:'Balance Wheel', zh:'摆轮',
+    d_en:'The beating heart — a Glucydur balance oscillating 3 times per second, ±2.5 swings governing time.',
+    d_zh:'机芯的心脏——铍青铜摆轮每秒往复摆动 3 次，以恒定振幅切分时间。'},
+  hairspring:{en:'Hairspring', zh:'游丝',
+    d_en:'A blued-steel Breguet overcoil that returns the balance to centre — its breathing sets the rate.',
+    d_zh:'蓝钢宝玑上绕游丝，令摆轮回中往复，其“呼吸”决定走时精度。'},
+  palletfork:{en:'Pallet Fork', zh:'擒纵叉',
+    d_en:'The anchor with two ruby pallet stones — it locks and releases the escape wheel, ticking the seconds.',
+    d_zh:'镶有两颗红宝石擒纵石的叉式杠杆，锁定并释放擒纵轮，敲出每一次“滴答”。'},
+  escapewheel:{en:'Escape Wheel', zh:'擒纵轮',
+    d_en:'Club-toothed escape wheel — it delivers measured impulses to the balance through the pallet fork.',
+    d_zh:'棒齿擒纵轮，经擒纵叉向摆轮输送定量冲量，是动力与振荡的桥梁。'},
+  geartrain:{en:'Gear Train', zh:'轮系',
+    d_en:'Centre, third and fourth wheels — the going train that divides the barrel’s torque down to the hands.',
+    d_zh:'二轮、三轮与四轮组成的轮系，将发条盒扭矩逐级减速传递至指针。'},
+  barrel:{en:'Mainspring Barrel', zh:'发条盒 / 主发条',
+    d_en:'The power source: a coiled mainspring stores energy and feeds it to the train for ~42 hours.',
+    d_zh:'动力之源：盘绕的主发条储存能量，持续约 42 小时驱动整个轮系。'},
+  bridges:{en:'Bridges', zh:'夹板',
+    d_en:'Anglage-bevelled, Côtes-de-Genève bridges hold the wheel pivots in perfect alignment.',
+    d_zh:'经倒角抛光、饰以日内瓦波纹的夹板，将各轮轴枢固定于精准位置。'},
+  mainplate:{en:'Main Plate', zh:'主夹板',
+    d_en:'The foundation onto which every component is built — perlage-finished and pierced for the skeleton.',
+    d_zh:'整枚机芯的基板，珍珠纹打磨并镂空雕通，承载所有零件。'},
+  jewels:{en:'Ruby Jewels', zh:'红宝石轴承',
+    d_en:'Synthetic ruby bearings at every pivot — hard, low-friction and unwearing, set in gold chatons.',
+    d_zh:'每处轴枢镶嵌合成红宝石轴承，硬度高、摩擦低、耐磨损，嵌于金质宝石座。'},
+  screws:{en:'Blued Screws', zh:'蓝钢螺丝',
+    d_en:'Heat-blued steel screws — tempered to a peacock blue, both decorative and functional.',
+    d_zh:'热处理蓝钢螺丝，回火至孔雀蓝，兼具装饰性与功能性。'},
+  cASE:{}, // placeholder guard
+  watchcase:{en:'Case', zh:'表壳',
+    d_en:'A polished and brushed precious-metal case with curved lugs — water-resistant housing for the calibre.',
+    d_zh:'抛光与拉丝相间的贵金属表壳，弧形表耳，为机芯提供防水保护。'},
+  crown:{en:'Crown', zh:'表冠',
+    d_en:'A fluted winding crown — used to wind the mainspring and set the time.',
+    d_zh:'刻纹上链表冠，用于为主发条上链并校准时间。'}
+};
+
+/* ============================== materials ============================== */
+const env = { intensity: 1.0 };
+const M = {
+  steel:   () => track(new THREE.MeshStandardMaterial({color:0xb7c0c9, metalness:1, roughness:0.27, envMapIntensity:env.intensity})),
+  rhodium: () => track(new THREE.MeshStandardMaterial({color:0xcdd4da, metalness:1, roughness:0.22, envMapIntensity:env.intensity*1.05})),
+  brass:   () => track(new THREE.MeshStandardMaterial({color:0xc6a04a, metalness:1, roughness:0.30, envMapIntensity:env.intensity})),
+  gold:    () => track(new THREE.MeshStandardMaterial({color:0xd9ac51, metalness:1, roughness:0.25, envMapIntensity:env.intensity*1.05})),
+  rose:    () => track(new THREE.MeshStandardMaterial({color:0xc78a5c, metalness:1, roughness:0.36, envMapIntensity:env.intensity*0.82})),
+  darksteel:()=> track(new THREE.MeshStandardMaterial({color:0x3a4048, metalness:1, roughness:0.34, envMapIntensity:env.intensity*0.9})),
+  blued:   () => track(new THREE.MeshStandardMaterial({color:0x1f3d8f, metalness:1, roughness:0.30, envMapIntensity:env.intensity*0.95, emissive:0x0a1740, emissiveIntensity:0.3})),
+  ruby:    () => track(new THREE.MeshPhysicalMaterial({color:0x9c1535, metalness:0, roughness:0.12, transparent:true, opacity:0.9, clearcoat:1, clearcoatRoughness:0.08, emissive:0x52001a, emissiveIntensity:0.55, envMapIntensity:env.intensity*1.3})),
+  glass:   () => track(new THREE.MeshPhysicalMaterial({color:0xeef4ff, metalness:0, roughness:0.02, transparent:true, opacity:0.12, clearcoat:1, clearcoatRoughness:0.02, ior:1.74, reflectivity:0.42, envMapIntensity:env.intensity*1.0, side:THREE.DoubleSide, depthWrite:false})),
+  blacken: () => track(new THREE.MeshStandardMaterial({color:0x14171c, metalness:0.55, roughness:0.5, envMapIntensity:0.7})),
+};
+function track(m){ m.userData.e0 = m.emissive ? m.emissive.clone() : null; m.userData.i0 = m.emissiveIntensity||0; return m; }
+function lume(color){
+  const m = new THREE.MeshStandardMaterial({color:0x12281f, emissive:new THREE.Color(color), emissiveIntensity:1.5, metalness:0, roughness:0.55});
+  lumeSet.add(m); m.userData.lumeBase=1.5; return m;
+}
+
+/* ============================== geometry helpers ============================== */
+// Flat extruded shape laid into the XZ plane (thickness along +Y), centred.
+function flat(shape, thickness, bevel=0.05){
+  const opts = {depth:thickness, bevelEnabled:bevel>0, bevelThickness:bevel, bevelSize:bevel, bevelSegments:1, steps:1, curveSegments:24};
+  const g = new THREE.ExtrudeGeometry(shape, opts);
+  g.translate(0,0,-thickness/2);
+  g.rotateX(-Math.PI/2);
+  g.computeVertexNormals();
+  return g;
+}
+// Toothed annular gear shape -> geometry (ring with teeth + centre hole)
+function gearGeo({teeth=24, pitch=4, tooth=0.9, thickness=0.6, rimInner=0.74, bevel=0.04, pointed=false}){
+  const rTip = pitch + tooth*0.5, rRoot = pitch - tooth*0.5;
+  const step = Math.PI*2/teeth;
+  const s = new THREE.Shape();
+  const P = (r,a)=>[Math.cos(a)*r, Math.sin(a)*r];
+  for(let i=0;i<teeth;i++){
+    const a = i*step;
+    const f = pointed ? {a:0.16,b:0.30,c:0.36,d:0.58} : {a:0.16,b:0.30,c:0.46,d:0.60};
+    let q;
+    if(i===0){ const m=P(rRoot,a); s.moveTo(m[0],m[1]); }
+    q=P(rRoot,a+step*f.a); s.lineTo(q[0],q[1]);
+    q=P(rTip ,a+step*f.b); s.lineTo(q[0],q[1]);
+    q=P(rTip ,a+step*f.c); s.lineTo(q[0],q[1]);
+    q=P(rRoot,a+step*f.d); s.lineTo(q[0],q[1]);
+    q=P(rRoot,a+step    ); s.lineTo(q[0],q[1]);
+  }
+  s.closePath();
+  const hole = new THREE.Path(); hole.absarc(0,0, pitch*rimInner, 0, Math.PI*2, true);
+  s.holes.push(hole);
+  return flat(s, thickness, bevel);
+}
+// A complete wheel: toothed rim + hub + arbor + spokes
+function wheel({teeth, pitch, tooth=0.85, thickness=0.55, spokes=4, hubR=0.62, mat, hubMat, pointed=false}){
+  const g = new THREE.Group();
+  const rim = new THREE.Mesh(gearGeo({teeth, pitch, tooth, thickness, rimInner:0.76, pointed, bevel:pointed?0:0.035}), mat);
+  g.add(rim);
+  const hm = hubMat || mat;
+  const hub = new THREE.Mesh(new THREE.CylinderGeometry(hubR, hubR, thickness*1.15, 22), hm); g.add(hub);
+  const arbor = new THREE.Mesh(new THREE.CylinderGeometry(hubR*0.42, hubR*0.42, thickness*2.6, 16), hm); g.add(arbor);
+  const rimIn = pitch*0.76;
+  for(let i=0;i<spokes;i++){
+    const ang = i/spokes*Math.PI*2;
+    const len = rimIn - hubR;
+    const sp = new THREE.Mesh(new THREE.BoxGeometry(len, thickness*0.55, 0.42), mat);
+    sp.position.set(Math.cos(ang)*(hubR+len/2), 0, Math.sin(ang)*(hubR+len/2));
+    sp.rotation.y = -ang; g.add(sp);
+  }
+  return g;
+}
+// Rounded-blob bridge outline from a list of [x,z] anchor points
+function bridgeShape(pts, r=0.8){
+  const s = new THREE.Shape();
+  const v = pts.map(p=>new THREE.Vector2(p[0],p[1]));
+  // build with quadratic rounded corners
+  for(let i=0;i<v.length;i++){
+    const cur=v[i], prev=v[(i-1+v.length)%v.length], next=v[(i+1)%v.length];
+    const a=cur.clone().sub(prev).normalize(), b=next.clone().sub(cur).normalize();
+    const p1=cur.clone().addScaledVector(a,-r), p2=cur.clone().addScaledVector(b, r);
+    if(i===0) s.moveTo(p1.x,p1.y); else s.lineTo(p1.x,p1.y);
+    s.quadraticCurveTo(cur.x,cur.y,p2.x,p2.y);
+  }
+  s.closePath();
+  return s;
+}
+// jewel chaton (gold seat + ruby)
+function jewel(r=0.42){
+  const g=new THREE.Group();
+  const seat=new THREE.Mesh(new THREE.CylinderGeometry(r*1.5, r*1.6, 0.34, 20), M.gold());
+  const stone=new THREE.Mesh(new THREE.CylinderGeometry(r, r, 0.40, 18), M.ruby());
+  stone.position.y=0.04; g.add(seat,stone); return g;
+}
+// blued screw
+function screw(r=0.34){
+  const g=new THREE.Group();
+  const head=new THREE.Mesh(new THREE.CylinderGeometry(r, r, 0.26, 20), M.blued());
+  const slot=new THREE.Mesh(new THREE.BoxGeometry(r*2.1, 0.10, r*0.32), M.darksteel());
+  slot.position.y=0.16; g.add(head,slot); return g;
+}
+
+/* ============================== build the calibre ============================== */
+const Y = { plate:0, wheel:1.75, barrel:2.05, bridge:2.7, pallet:2.25, balance:3.5, hair:3.62, cock:4.7,
+            chapter:5.6, hand_h:6.1, hand_m:6.5, hand_s:6.9, cap:7.1, crystal:6.6, bezel:6.45 };
+
+function addPart(id, group, explode, anchor){
+  group.userData.base = group.position.clone();
+  group.userData.explode = explode || new THREE.Vector3();
+  group.userData.curScale = 1;
+  const mats = new Set();
+  group.traverse(o=>{
+    if(o.isMesh){
+      o.userData.partId = id; selectable.push(o);
+      const ms = Array.isArray(o.material)? o.material : [o.material];
+      ms.forEach(m=>mats.add(m));
+    }
+  });
+  const meta = PARTS[id];
+  const part = {id, group, materials:[...mats], targetScale:1, meta};
+  parts[id] = part;
+  if(meta && meta.en){
+    const div = document.createElement('div');
+    div.className = 'label';
+    div.innerHTML = `<span class="dot"></span><b>${meta.en}</b><i>${meta.zh}</i>`;
+    div.addEventListener('pointerdown', e=>{ e.stopPropagation(); selectPart(id); });
+    const lab = new CSS2DObject(div);
+    lab.position.copy(anchor || new THREE.Vector3(0,1.2,0));
+    lab.visible = false;
+    group.add(lab);
+    part.label = lab; part.labelEl = div; labels.push(part);
+  }
+  watch.add(group);
+  return part;
+}
+
+function buildCalibre(){
+  /* ---- main plate (skeletonised disc) ---- */
+  (function(){
+    const g = new THREE.Group();
+    const R = 13;
+    const s = new THREE.Shape(); s.absarc(0,0,R,0,Math.PI*2,false);
+    // large skeleton cut-outs so the train shows through
+    const cuts = [[4.5,3.2,3.4],[-4.2,3.6,3.0],[5.6,-3.0,2.4],[-5.4,-3.2,2.6],[0,-6.2,2.3],[0.5,6.5,2.2],[-0.2,0.2,2.0]];
+    cuts.forEach(c=>{ const h=new THREE.Path(); h.absarc(c[0],c[1],c[2],0,Math.PI*2,true); s.holes.push(h); });
+    const plate = new THREE.Mesh(flat(s, 1.1, 0.12), M.rhodium());
+    g.add(plate);
+    // perlage-ish inner ring detail
+    const ring = new THREE.Mesh(new THREE.TorusGeometry(R-0.5, 0.18, 14, 120), M.rhodium());
+    ring.rotation.x = Math.PI/2; ring.position.y = 0.55; g.add(ring);
+    g.position.y = Y.plate;
+    addPart('mainplate', g, new THREE.Vector3(0,-4,0), new THREE.Vector3(-9,0.8,7));
+  })();
+
+  /* ---- mainspring barrel (open, spring visible) ---- */
+  (function(){
+    const g = new THREE.Group();
+    const cx=-0.6, cz=7.0, rO=4.0, h=1.6;
+    g.position.set(cx, Y.barrel, cz);
+    const spin = new THREE.Group(); g.add(spin); anim.barrel = spin;
+    // drum wall
+    const wall = new THREE.Mesh(new THREE.CylinderGeometry(rO, rO, h, 64, 1, true), M.gold());
+    wall.material.side = THREE.DoubleSide; spin.add(wall);
+    const floor = new THREE.Mesh(new THREE.CylinderGeometry(rO-0.05, rO-0.05, 0.18, 64), M.gold());
+    floor.position.y = -h/2+0.09; spin.add(floor);
+    // toothed ring around the barrel
+    const teethRing = new THREE.Mesh(gearGeo({teeth:64, pitch:rO+0.42, tooth:0.5, thickness:0.5, rimInner:0.95}), M.gold());
+    teethRing.position.y = -h/2+0.25; spin.add(teethRing);
+    // coiled mainspring ribbon
+    const spring = new THREE.Mesh(mainspringGeo(0.95, rO-0.28, 8.4, h*0.82), M.blued());
+    spring.material.side = THREE.DoubleSide; spring.position.y = -h*0.32; spin.add(spring);
+    // arbor + hook
+    const arbor = new THREE.Mesh(new THREE.CylinderGeometry(0.6,0.6,h*1.5,18), M.steel()); spin.add(arbor);
+    const cap = new THREE.Mesh(new THREE.CylinderGeometry(0.85,0.85,0.2,24), M.steel()); cap.position.y=h*0.65; spin.add(cap);
+    addPart('barrel', g, new THREE.Vector3(0,3.0,0), new THREE.Vector3(0, h*0.7+0.6, 0));
+  })();
+
+  /* ---- going train (centre / third / fourth) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.wheel;
+    const defs = [
+      {x:3.6, z:2.4, pitch:3.4, teeth:46, rate: 0.55},
+      {x:5.7, z:-1.4, pitch:2.7, teeth:36, rate:-0.95},
+      {x:3.1, z:-4.4, pitch:2.1, teeth:28, rate: 1.5 },
+      {x:0.0, z:0.2, pitch:1.6, teeth:22, rate:-0.7 }, // motion-works (centre)
+    ];
+    defs.forEach((d,i)=>{
+      const w = wheel({teeth:d.teeth, pitch:d.pitch, tooth:0.8, thickness:0.5, spokes:i===3?3:4, mat:M.brass(), hubMat:M.gold()});
+      w.position.set(d.x, 0, d.z);
+      g.add(w); anim.spinners.push({g:w, rate:d.rate});
+      // a small pinion stacked above for richness
+      if(i<3){
+        const p = wheel({teeth:10, pitch:0.7, tooth:0.28, thickness:0.45, spokes:3, hubR:0.3, mat:M.steel()});
+        p.position.set(d.x,0.55,d.z); g.add(p); anim.spinners.push({g:p, rate:d.rate});
+      }
+    });
+    addPart('geartrain', g, new THREE.Vector3(0,3.0,0), new THREE.Vector3(5.7,0.8,-1.4));
+  })();
+
+  /* ---- escapement: escape wheel + pallet fork ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.wheel;
+    const esc = wheel({teeth:18, pitch:1.55, tooth:0.7, thickness:0.42, spokes:4, hubR:0.4, mat:M.steel(), pointed:true});
+    esc.position.set(0.2,0,-5.6); g.add(esc); anim.escape = esc;
+    // pallet fork
+    const fork = new THREE.Group(); fork.position.set(-1.7, Y.pallet-Y.wheel, -6.1);
+    const body = new THREE.Mesh(new THREE.BoxGeometry(0.5,0.34,2.6), M.steel()); body.position.z=0.2;
+    const armA = new THREE.Mesh(new THREE.BoxGeometry(1.7,0.3,0.4), M.steel()); armA.position.set(0.6,0,-0.9); armA.rotation.y=0.5;
+    const armB = new THREE.Mesh(new THREE.BoxGeometry(1.7,0.3,0.4), M.steel()); armB.position.set(-0.6,0,-0.9); armB.rotation.y=-0.5;
+    const palA = new THREE.Mesh(new THREE.BoxGeometry(0.34,0.34,0.5), M.ruby()); palA.position.set(1.2,0,-1.35);
+    const palB = new THREE.Mesh(new THREE.BoxGeometry(0.34,0.34,0.5), M.ruby()); palB.position.set(-1.2,0,-1.35);
+    const horn = new THREE.Mesh(new THREE.BoxGeometry(0.28,0.3,0.7), M.steel()); horn.position.set(0,0,1.55);
+    const piv = new THREE.Mesh(new THREE.CylinderGeometry(0.34,0.34,0.5,16), M.gold());
+    fork.add(body,armA,armB,palA,palB,horn,piv); g.add(fork); anim.pallet = fork;
+    addPart('escapewheel', g, new THREE.Vector3(0,3.0,0), new THREE.Vector3(0.2,0.8,-5.6));
+    // expose pallet as its own labelled part by re-tagging its meshes
+    fork.traverse(o=>{ if(o.isMesh) o.userData.partId='palletfork'; });
+    PARTS.palletfork.__group = fork;
+    registerSub('palletfork', fork, new THREE.Vector3(-1.7,1.4,-6.1));
+  })();
+
+  /* ---- balance wheel + hairspring ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.set(-4.8, Y.balance, -3.4);
+    const bal = new THREE.Group(); g.add(bal); anim.balance = bal;
+    const R=3.6;
+    const rim = new THREE.Mesh(new THREE.TorusGeometry(R, 0.32, 18, 96), M.gold());
+    rim.rotation.x = Math.PI/2; bal.add(rim);
+    for(let i=0;i<3;i++){
+      const a=i/3*Math.PI*2;
+      const arm=new THREE.Mesh(new THREE.BoxGeometry(R*2,0.26,0.42), M.gold());
+      arm.rotation.y=-a; bal.add(arm);
+    }
+    const hub=new THREE.Mesh(new THREE.CylinderGeometry(0.55,0.55,0.7,20), M.gold()); bal.add(hub);
+    const staff=new THREE.Mesh(new THREE.CylinderGeometry(0.16,0.16,2.6,12), M.steel()); bal.add(staff);
+    // timing screws around the rim
+    for(let i=0;i<8;i++){
+      const a=i/8*Math.PI*2;
+      const sc=new THREE.Mesh(new THREE.CylinderGeometry(0.26,0.26,0.5,12), M.steel());
+      sc.position.set(Math.cos(a)*R, 0, Math.sin(a)*R); sc.rotation.x=Math.PI/2;
+      sc.rotation.z=Math.PI/2*Math.sign(Math.cos(a)); bal.add(sc);
+    }
+    addPart('balance', g, new THREE.Vector3(0,8.5,0), new THREE.Vector3(0, R+1.0, 0));
+
+    // hairspring (separate part, sits just under balance)
+    const hg = new THREE.Group(); hg.position.set(-4.8, Y.hair, -3.4);
+    const hair = new THREE.Group(); hg.add(hair); anim.hairspring = hair;
+    hair.add(new THREE.Mesh(hairspringGeo(0.55, 2.7, 7), M.blued()));
+    const stud=new THREE.Mesh(new THREE.BoxGeometry(0.3,0.4,0.3), M.gold()); stud.position.set(2.7,0,0); hair.add(stud);
+    addPart('hairspring', hg, new THREE.Vector3(0,11,0), new THREE.Vector3(0,0.6,0));
+  })();
+
+  /* ---- bridges (slim skeleton arms with Côtes-de-Genève) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.bridge;
+    const stripeMat = M.rhodium(); stripeMat.roughnessMap = stripeTexture(); stripeMat.roughness = 0.34;
+    const mk = (pts)=> new THREE.Mesh(flat(bridgeShape(pts,0.7), 0.6, 0.14), stripeMat);
+    // train bridge
+    g.add(mk([[1.5,4.0],[6.5,1.0],[6.6,-2.2],[3.2,-3.4],[2.0,-0.2]]));
+    // barrel bridge
+    g.add(mk([[-6.2,2.0],[-1.5,3.2],[-1.0,7.6],[-4.5,8.2],[-7.0,5.0]]));
+    addPart('bridges', g, new THREE.Vector3(0,7,0), new THREE.Vector3(-4.0,0.9,7.0));
+  })();
+
+  /* ---- balance cock (over the balance) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.cock;
+    const cock = new THREE.Mesh(flat(bridgeShape([[-9.5,-3.0],[-4.6,-4.4],[-3.2,-2.6],[-4.0,-1.0],[-8.5,-0.6]],0.7),0.55,0.14), M.rhodium());
+    g.add(cock);
+    const capJewel = jewel(0.34); capJewel.position.set(-4.8,0.4,-3.4); g.add(capJewel);
+    // regulator index arm
+    const idx = new THREE.Mesh(new THREE.BoxGeometry(1.6,0.2,0.22), M.steel()); idx.position.set(-3.9,0.4,-3.4); idx.rotation.y=0.5; g.add(idx);
+    addPart('balancecock', g, new THREE.Vector3(0,12,0), new THREE.Vector3(-6.0,0.8,-2.0));
+  })();
+
+  /* ---- ruby jewels at pivots (grouped) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.wheel+0.5;
+    const spots = [[3.6,2.4],[5.7,-1.4],[3.1,-4.4],[0.2,-5.6],[-0.6,7.0],[0,0.2],[-4.8,-3.4],[-1.7,-6.1]];
+    spots.forEach(p=>{ const j=jewel(0.34); j.position.set(p[0],0,p[1]); g.add(j); });
+    addPart('jewels', g, new THREE.Vector3(0,5,0), new THREE.Vector3(3.1,0.6,-4.4));
+  })();
+
+  /* ---- blued screws (grouped) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.bridge+0.35;
+    const spots = [[6.4,0.8],[3.3,-3.2],[-4.4,8.0],[-6.8,4.6],[-1.2,7.4],[2.0,4.0],[-8.4,-0.8],[-3.4,-2.6],[11.5,0],[-11.5,0.5],[0,11.6],[0,-11.6]];
+    spots.forEach(p=>{ const s=screw(0.32); s.position.set(p[0],0,p[1]); g.add(s); });
+    addPart('screws', g, new THREE.Vector3(0,8,0), new THREE.Vector3(-6.8,0.5,4.6));
+  })();
+
+  /* ---- chapter ring + hour markers + lume ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = Y.chapter;
+    const ringShape = new THREE.Shape(); ringShape.absarc(0,0,16.4,0,Math.PI*2,false);
+    const rh = new THREE.Path(); rh.absarc(0,0,14.6,0,Math.PI*2,true); ringShape.holes.push(rh);
+    const ring = new THREE.Mesh(flat(ringShape, 0.4, 0.06), M.rose()); g.add(ring);
+    // markers
+    const Rm = 15.3;
+    for(let i=0;i<12;i++){
+      const a = i/12*Math.PI*2;
+      const dbl = (i%3===0);
+      const mk = new THREE.Group();
+      const w = dbl?0.5:0.4, len = dbl?2.0:1.5;
+      const base = new THREE.Mesh(new THREE.BoxGeometry(len, 0.4, w), M.gold());
+      const lum = new THREE.Mesh(new THREE.BoxGeometry(len*0.82, 0.22, w*0.5), lume(0x86ffd6)); lum.position.y=0.28;
+      mk.add(base, lum);
+      if(dbl){ // second baton for cardinal hours
+        const base2=base.clone(); const lum2=lum.clone();
+        mk.add(base2, lum2); base.position.z=-w*0.7; base2.position.z=w*0.7; lum.position.z=-w*0.7; lum2.position.z=w*0.7;
+      }
+      mk.position.set(Math.cos(a)*Rm, 0.1, Math.sin(a)*Rm);
+      mk.rotation.y = -a;
+      g.add(mk);
+    }
+    // tiny minute lume pips
+    for(let i=0;i<60;i++){
+      if(i%5===0) continue;
+      const a=i/60*Math.PI*2;
+      const pip=new THREE.Mesh(new THREE.CylinderGeometry(0.10,0.10,0.18,8), lume(0x6fe9c8));
+      pip.position.set(Math.cos(a)*16.0, 0.18, Math.sin(a)*16.0); g.add(pip);
+    }
+    addPart('chapterring', g, new THREE.Vector3(0,15,0), new THREE.Vector3(0, 0.7, -15.3));
+  })();
+
+  /* ---- hands ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.y = 0;
+    const handShape = (len, w, tail)=>{
+      const s=new THREE.Shape();
+      s.moveTo(-tail, 0);
+      s.lineTo(-tail*0.4, w*0.5);
+      s.lineTo(len*0.7, w*0.4);
+      s.lineTo(len, 0);
+      s.lineTo(len*0.7, -w*0.4);
+      s.lineTo(-tail*0.4, -w*0.5);
+      s.closePath();
+      // open window (skeleton) near base
+      const hole=new THREE.Path();
+      hole.absarc(len*0.32, 0, w*0.22, 0, Math.PI*2, true);
+      s.holes.push(hole);
+      return s;
+    };
+    const lumeStrip=(len,w,y)=>{
+      const s=new THREE.Shape();
+      s.moveTo(len*0.40,0); s.lineTo(len*0.5,w*0.18); s.lineTo(len*0.62,w*0.16); s.lineTo(len*0.64,0);
+      s.lineTo(len*0.62,-w*0.16); s.lineTo(len*0.5,-w*0.18); s.closePath();
+      const m=new THREE.Mesh(flat(s,0.12,0), lume(0x86ffd6)); m.position.y=y; return m;
+    };
+    // hour
+    const hour=new THREE.Group(); hour.position.y=Y.hand_h;
+    hour.add(new THREE.Mesh(flat(handShape(8.4,1.0,2.2),0.22,0.05), M.gold()));
+    hour.add(lumeStrip(8.4,1.0,0.18));
+    g.add(hour); anim.hour=hour;
+    // minute
+    const min=new THREE.Group(); min.position.y=Y.hand_m;
+    min.add(new THREE.Mesh(flat(handShape(13.2,0.8,2.4),0.20,0.05), M.gold()));
+    min.add(lumeStrip(13.2,0.8,0.16));
+    g.add(min); anim.min=min;
+    // second (thin, counterweighted)
+    const sec=new THREE.Group(); sec.position.y=Y.hand_s;
+    const ss=new THREE.Shape();
+    ss.moveTo(-4.0,0); ss.lineTo(-3.6,0.32); ss.lineTo(-0.3,0.16); ss.lineTo(14.4,0.05);
+    ss.lineTo(14.4,-0.05); ss.lineTo(-0.3,-0.16); ss.lineTo(-3.6,-0.32); ss.closePath();
+    sec.add(new THREE.Mesh(flat(ss,0.14,0), lume(0xff5a7a)));
+    const cw=new THREE.Mesh(new THREE.CylinderGeometry(0.7,0.7,0.16,20), M.gold()); cw.position.set(-3.4,0,0); sec.add(cw);
+    g.add(sec); anim.sec=sec;
+    // centre cap
+    const cap=new THREE.Mesh(new THREE.ConeGeometry(0.7,1.0,22), M.gold()); cap.position.y=Y.cap; g.add(cap);
+    const capRing=new THREE.Mesh(new THREE.CylinderGeometry(0.9,0.9,0.25,22), M.rose()); capRing.position.y=Y.hand_h-0.1; g.add(capRing);
+    addPart('hands', g, new THREE.Vector3(0,19,0), new THREE.Vector3(8, Y.hand_m+0.6, 0));
+  })();
+
+  /* ---- case (band + bezel + caseback + lugs) ---- */
+  (function(){
+    const g = new THREE.Group();
+    const Ro=18.8, Ri=16.9, top=Y.bezel, bot=-2.8;
+    const band = new THREE.Mesh(new THREE.CylinderGeometry(Ro, Ro, top-bot, 96, 1, true), M.rose());
+    band.position.y=(top+bot)/2; g.add(band);
+    const inner = new THREE.Mesh(new THREE.CylinderGeometry(Ri, Ri, top-bot, 96, 1, true), M.rose());
+    inner.material.side=THREE.BackSide; inner.position.y=(top+bot)/2; g.add(inner);
+    const bezel = new THREE.Mesh(new THREE.TorusGeometry(Ri+0.9, 1.0, 22, 120), M.rose());
+    bezel.rotation.x=Math.PI/2; bezel.position.y=top; g.add(bezel);
+    const backRing = new THREE.Mesh(new THREE.TorusGeometry(Ri+0.5, 1.1, 22, 120), M.rose());
+    backRing.rotation.x=Math.PI/2; backRing.position.y=bot; g.add(backRing);
+    // open display back ring (thin)
+    const backInner = new THREE.Mesh(new THREE.CylinderGeometry(Ri+0.4, Ri+0.4, 0.3, 96), M.rose());
+    backInner.position.y=bot-0.1; backInner.material.side=THREE.DoubleSide; g.add(backInner);
+    // lugs at 12 / 6
+    const lugAt=(zSign)=>{
+      for(const xs of [-1,1]){
+        const lug=new THREE.Mesh(new THREE.BoxGeometry(2.4,3.6,3.0), M.rose());
+        lug.position.set(xs*9.5, (top+bot)/2, zSign*(Ro-0.5));
+        lug.rotation.x = zSign*0.32;
+        g.add(lug);
+      }
+    };
+    lugAt(1); lugAt(-1);
+    addPart('watchcase', g, new THREE.Vector3(0,-7,0), new THREE.Vector3(0, top+1.2, Ro-1));
+  })();
+
+  /* ---- crown (3 o'clock) ---- */
+  (function(){
+    const g = new THREE.Group(); g.position.set(19.6, 1.2, 0);
+    const body=new THREE.Mesh(new THREE.CylinderGeometry(1.5,1.6,1.6,30), M.rose());
+    body.rotation.z=Math.PI/2; g.add(body);
+    for(let i=0;i<22;i++){
+      const a=i/22*Math.PI*2;
+      const fl=new THREE.Mesh(new THREE.BoxGeometry(1.6,0.22,0.34), M.rose());
+      fl.position.set(0, Math.cos(a)*1.55, Math.sin(a)*1.55); fl.rotation.x=-a; g.add(fl);
+    }
+    const stem=new THREE.Mesh(new THREE.CylinderGeometry(0.5,0.5,1.6,16), M.steel());
+    stem.rotation.z=Math.PI/2; stem.position.x=-1.4; g.add(stem);
+    const cab=new THREE.Mesh(new THREE.SphereGeometry(0.7,18,14), M.ruby()); cab.position.x=0.9; g.add(cab);
+    addPart('crown', g, new THREE.Vector3(7,0,0), new THREE.Vector3(0,2.2,0));
+  })();
+
+  /* ---- sapphire crystal (domed) ---- */
+  (function(){
+    const g = new THREE.Group();
+    const R=17.0;
+    const dome = new THREE.Mesh(new THREE.SphereGeometry(R, 80, 48, 0, Math.PI*2, 0, 0.46), M.glass());
+    dome.scale.y = 0.30; dome.position.y = Y.crystal;
+    dome.userData.noShadow = true;
+    g.add(dome);
+    // thin under-glass ring to sell thickness
+    const rim = new THREE.Mesh(new THREE.TorusGeometry(R*0.985, 0.25, 16, 100), M.glass());
+    rim.rotation.x=Math.PI/2; rim.position.y=Y.crystal; g.add(rim);
+    addPart('crystal', g, new THREE.Vector3(0,24,0), new THREE.Vector3(0, Y.crystal+3.2, 0));
+  })();
+}
+
+// allow a child group inside a built part to also be an independently labelled/selectable part
+function registerSub(id, group, anchor){
+  const mats = new Set();
+  group.traverse(o=>{ if(o.isMesh){ const ms=Array.isArray(o.material)?o.material:[o.material]; ms.forEach(m=>mats.add(m)); }});
+  const meta = PARTS[id];
+  const part = {id, group, materials:[...mats], targetScale:1, meta, isSub:true};
+  parts[id]=part;
+  if(meta && meta.en){
+    const div=document.createElement('div'); div.className='label';
+    div.innerHTML=`<span class="dot"></span><b>${meta.en}</b><i>${meta.zh}</i>`;
+    div.addEventListener('pointerdown',e=>{ e.stopPropagation(); selectPart(id); });
+    const lab=new CSS2DObject(div); lab.position.copy(anchor); lab.visible=false; group.add(lab);
+    part.label=lab; part.labelEl=div; labels.push(part);
+  }
+}
+
+/* coiled mainspring ribbon geometry (vertical wall following an Archimedean spiral) */
+function mainspringGeo(innerR, outerR, turns, height){
+  const N = Math.floor(turns*70);
+  const pos=[], idx=[];
+  for(let i=0;i<=N;i++){
+    const t=i/N, ang=t*turns*Math.PI*2, r=innerR+(outerR-innerR)*t;
+    const x=Math.cos(ang)*r, z=Math.sin(ang)*r;
+    pos.push(x,0,z, x,height,z);
+  }
+  for(let i=0;i<N;i++){ const a=i*2; idx.push(a,a+1,a+2, a+1,a+3,a+2); }
+  const g=new THREE.BufferGeometry();
+  g.setAttribute('position', new THREE.Float32BufferAttribute(pos,3));
+  g.setIndex(idx); g.computeVertexNormals(); return g;
+}
+/* hairspring: flat Archimedean spiral as a thin tube */
+function hairspringGeo(innerR, outerR, turns){
+  const pts=[]; const N=Math.floor(turns*64);
+  for(let i=0;i<=N;i++){
+    const t=i/N, ang=t*turns*Math.PI*2, r=innerR+(outerR-innerR)*t;
+    pts.push(new THREE.Vector3(Math.cos(ang)*r, 0, Math.sin(ang)*r));
+  }
+  const curve=new THREE.CatmullRomCurve3(pts);
+  return new THREE.TubeGeometry(curve, N, 0.075, 7, false);
+}
+/* procedural Côtes-de-Genève roughness stripes */
+function stripeTexture(){
+  const c=document.createElement('canvas'); c.width=c.height=256; const x=c.getContext('2d');
+  x.fillStyle='#888'; x.fillRect(0,0,256,256);
+  for(let i=0;i<256;i+=8){ const g=70+Math.sin(i*0.4)*22; x.fillStyle=`rgb(${g},${g},${g})`; x.fillRect(0,i,256,4); }
+  const t=new THREE.CanvasTexture(c); t.wrapS=t.wrapT=THREE.RepeatWrapping; t.repeat.set(3,3); return t;
+}
+
+/* ============================== interaction ============================== */
+function partFromObject(o){
+  let id=null, p=o;
+  while(p){ if(p.userData && p.userData.partId){ id=p.userData.partId; break; } p=p.parent; }
+  return id && parts[id] ? parts[id] : null;
+}
+function applyHighlight(part, on){
+  if(!part) return;
+  part.targetScale = on ? 1.04 : 1.0;
+  part.materials.forEach(m=>{
+    if(!m.emissive) return;
+    if(lumeSet.has(m)){ m.userData.hl = on; return; } // lume handled in night loop
+    if(on){ m.emissive.setHex(0x5a3c14); m.emissiveIntensity=0.6; }
+    else  { m.emissive.copy(m.userData.e0||new THREE.Color(0)); m.emissiveIntensity=m.userData.i0||0; }
+  });
+  if(part.labelEl) part.labelEl.classList.toggle('hl', on);
+}
+function selectPart(id){
+  const part = parts[id]; if(!part) return;
+  if(selected && selected!==part) applyHighlight(selected, false);
+  selected = part; applyHighlight(part, true);
+  const m=part.meta;
+  document.getElementById('p-name').textContent = m.en;
+  document.getElementById('p-zh').textContent = m.zh;
+  document.getElementById('p-desc').innerHTML = `<span class="en">${m.d_en}</span><span class="zh">${m.d_zh}</span>`;
+}
+function setHover(part){
+  if(part===hovered) return;
+  if(hovered && hovered!==selected) applyHighlight(hovered, false);
+  hovered = part;
+  const tip=document.getElementById('tip');
+  if(part){
+    if(part!==selected) applyHighlight(part, true);
+    tip.innerHTML = `${part.meta.en}<i>${part.meta.zh}</i>`;
+    tip.style.opacity='1';
+    document.body.style.cursor='pointer';
+  } else {
+    tip.style.opacity='0';
+    document.body.style.cursor='default';
+  }
+}
+
+/* ============================== init ============================== */
+function init(){
+  const app=document.getElementById('app');
+  renderer = new THREE.WebGLRenderer({antialias:true, powerPreference:'high-performance'});
+  renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
+  renderer.setSize(innerWidth, innerHeight);
+  renderer.toneMapping = THREE.ACESFilmicToneMapping;
+  renderer.toneMappingExposure = 0.96;
+  renderer.shadowMap.enabled = true;
+  renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+  app.appendChild(renderer.domElement);
+
+  scene = new THREE.Scene();
+  scene.background = bgTexture();
+
+  camera = new THREE.PerspectiveCamera(38, innerWidth/innerHeight, 0.1, 3000);
+  camera.position.set(22, 40, 38);
+
+  // environment for metal reflections
+  const pmrem = new THREE.PMREMGenerator(renderer);
+  scene.environment = pmrem.fromScene(new RoomEnvironment(), 0.04).texture;
+
+  // labels overlay
+  labelRenderer = new CSS2DRenderer();
+  labelRenderer.setSize(innerWidth, innerHeight);
+  const lr = labelRenderer.domElement;
+  lr.style.position='absolute'; lr.style.top='0'; lr.style.left='0'; lr.style.pointerEvents='none';
+  document.getElementById('labels').appendChild(lr);
+
+  controls = new OrbitControls(camera, renderer.domElement);
+  controls.target.set(0, 2, 0);
+  controls.enableDamping=true; controls.dampingFactor=0.06;
+  controls.minDistance=28; controls.maxDistance=140;
+  controls.maxPolarAngle=1.52; controls.autoRotate=true; controls.autoRotateSpeed=0.65;
+  controls.enablePan=false;
+
+  buildLights();
+  buildGround();
+  buildCalibre();
+  scene.add(watch);
+
+  // shadows
+  watch.traverse(o=>{ if(o.isMesh){ o.castShadow = !o.userData.noShadow; o.receiveShadow = true; } });
+
+  buildComposer();
+  bindUI();
+
+  addEventListener('resize', onResize);
+  renderer.domElement.addEventListener('pointermove', onPointerMove);
+  renderer.domElement.addEventListener('pointerdown', onPointerDown);
+  renderer.domElement.addEventListener('pointerup', onPointerUp);
+
+  if(matchMedia('(prefers-reduced-motion: reduce)').matches){ controls.autoRotate=false; document.getElementById('b-rotate').classList.remove('on'); }
+
+  selectPart('balance'); applyHighlight(parts.balance, false); selected=null;
+  document.getElementById('p-name').textContent='Skeleton Calibre N-01';
+  document.getElementById('p-zh').textContent='自动镂空机芯';
+
+  renderer.compile(scene, camera);
+  setTimeout(()=>document.getElementById('loader').classList.add('hide'), 420);
+  animate();
+}
+
+function buildLights(){
+  RectAreaLightUniformsLib.init();
+  const hemi = new THREE.HemisphereLight(0xbcd4ff, 0x14110c, 0.5); scene.add(hemi); anim.hemi=hemi;
+
+  const key = new THREE.DirectionalLight(0xfff4e2, 2.1);
+  key.position.set(22, 40, 20); key.castShadow=true;
+  key.shadow.mapSize.set(2048,2048);
+  const sc=key.shadow.camera; sc.left=-28; sc.right=28; sc.top=28; sc.bottom=-28; sc.near=1; sc.far=140;
+  key.shadow.bias=-0.0002; key.shadow.normalBias=0.04; key.shadow.radius=4;
+  scene.add(key); anim.key=key;
+
+  const rim = new THREE.DirectionalLight(0x9fc2ff, 1.3); rim.position.set(-24,14,-26); scene.add(rim); anim.rim=rim;
+  const fill = new THREE.DirectionalLight(0xffe6c4, 0.5); fill.position.set(-12,10,24); scene.add(fill); anim.fill=fill;
+
+  const soft1 = new THREE.RectAreaLight(0xffffff, 2.2, 32, 15); soft1.position.set(2,30,14); soft1.lookAt(0,0,0); scene.add(soft1); anim.soft1=soft1;
+  const soft2 = new THREE.RectAreaLight(0xbfe0ff, 1.4, 30, 14); soft2.position.set(-20,18,-18); soft2.lookAt(0,0,0); scene.add(soft2); anim.soft2=soft2;
+}
+
+function buildGround(){
+  const reflector = new Reflector(new THREE.PlaneGeometry(420,420), {
+    textureWidth: 1024, textureHeight: 1024, color: 0x0a0d12
+  });
+  reflector.rotation.x = -Math.PI/2; reflector.position.y = -3.0; scene.add(reflector);
+
+  // fade-out + contact-shadow overlay so the reflection stays subtle and grounded
+  const fade = new THREE.Mesh(new THREE.PlaneGeometry(420,420),
+    new THREE.MeshBasicMaterial({map:fadeTexture(true), transparent:true, depthWrite:false}));
+  fade.rotation.x=-Math.PI/2; fade.position.y=-2.95; scene.add(fade);
+
+  const contact = new THREE.Mesh(new THREE.PlaneGeometry(70,70),
+    new THREE.MeshBasicMaterial({map:fadeTexture(false), transparent:true, depthWrite:false, opacity:0.9}));
+  contact.rotation.x=-Math.PI/2; contact.position.y=-2.9; scene.add(contact);
+}
+
+function buildComposer(){
+  composer = new EffectComposer(renderer);
+  composer.addPass(new RenderPass(scene, camera));
+  bloomPass = new UnrealBloomPass(new THREE.Vector2(innerWidth, innerHeight), 0.42, 0.5, 1.05);
+  composer.addPass(bloomPass);
+  composer.addPass(new OutputPass());
+}
+
+/* background + ground textures */
+function bgTexture(){
+  const c=document.createElement('canvas'); c.width=c.height=1024; const x=c.getContext('2d');
+  const g=x.createRadialGradient(512,400,80, 512,512,720);
+  g.addColorStop(0,'#171b22'); g.addColorStop(0.45,'#0c0f15'); g.addColorStop(1,'#05060a');
+  x.fillStyle=g; x.fillRect(0,0,1024,1024);
+  const t=new THREE.CanvasTexture(c); t.colorSpace=THREE.SRGBColorSpace; t.mapping=THREE.EquirectangularReflectionMapping; return t;
+}
+function fadeTexture(invert){
+  const c=document.createElement('canvas'); c.width=c.height=512; const x=c.getContext('2d');
+  const g=x.createRadialGradient(256,256,20,256,256,256);
+  if(invert){ g.addColorStop(0,'rgba(5,6,10,0)'); g.addColorStop(0.5,'rgba(5,6,10,0.45)'); g.addColorStop(1,'rgba(5,6,10,1)'); }
+  else { g.addColorStop(0,'rgba(0,0,0,0.55)'); g.addColorStop(0.7,'rgba(0,0,0,0.12)'); g.addColorStop(1,'rgba(0,0,0,0)'); }
+  x.fillStyle=g; x.fillRect(0,0,512,512);
+  const t=new THREE.CanvasTexture(c); t.colorSpace=THREE.SRGBColorSpace; return t;
+}
+
+/* ============================== UI ============================== */
+function bindUI(){
+  const r=document.getElementById('b-rotate');
+  r.onclick=()=>{ controls.autoRotate=!controls.autoRotate; r.classList.toggle('on', controls.autoRotate); };
+  const e=document.getElementById('b-explode');
+  e.onclick=()=>{ explodeTarget = explodeTarget>0.5?0:1; e.classList.toggle('on', explodeTarget>0.5); };
+  const l=document.getElementById('b-labels');
+  l.onclick=()=>{ showLabels=!showLabels; l.classList.toggle('on', showLabels);
+    labels.forEach(p=>{ p.label.visible=true; p.labelEl.classList.toggle('show', showLabels); }); };
+  const n=document.getElementById('b-lume');
+  n.onclick=()=>{ nightTarget = nightTarget>0.5?0:1; n.classList.toggle('on', nightTarget>0.5); };
+  const rs=document.getElementById('b-reset');
+  rs.onclick=()=>{ camTween={ from:camera.position.clone(), to:new THREE.Vector3(22,40,38),
+    tFrom:controls.target.clone(), tTo:new THREE.Vector3(0,2,0), k:0 }; };
+  // make labels always present in DOM (visibility controlled by .show), start hidden
+  labels.forEach(p=>{ p.label.visible=true; });
+}
+
+function onResize(){
+  camera.aspect=innerWidth/innerHeight; camera.updateProjectionMatrix();
+  renderer.setSize(innerWidth, innerHeight);
+  composer.setSize(innerWidth, innerHeight);
+  labelRenderer.setSize(innerWidth, innerHeight);
+}
+let downPt=null;
+function onPointerDown(e){ downPt={x:e.clientX, y:e.clientY}; }
+function onPointerUp(e){
+  if(!downPt) return;
+  const moved=Math.hypot(e.clientX-downPt.x, e.clientY-downPt.y);
+  downPt=null;
+  if(moved>6) return; // it was a drag
+  const p=raycastPart(e);
+  if(p) selectPart(p.id);
+}
+function onPointerMove(e){
+  const p=raycastPart(e);
+  setHover(p);
+  const tip=document.getElementById('tip');
+  tip.style.left=e.clientX+'px'; tip.style.top=e.clientY+'px';
+}
+function raycastPart(e){
+  ndc.x=(e.clientX/innerWidth)*2-1; ndc.y=-(e.clientY/innerHeight)*2+1;
+  raycaster.setFromCamera(ndc, camera);
+  const hits=raycaster.intersectObjects(selectable, false);
+  for(const h of hits){
+    // skip the transparent crystal for hover unless it's the only thing
+    const part=partFromObject(h.object);
+    if(part && part.id==='crystal' && hits.length>1) continue;
+    return part;
+  }
+  return null;
+}
+
+/* ============================== animate ============================== */
+const BAL_FREQ=3.0, W=2*Math.PI*BAL_FREQ, BAL_AMP=2.4, PAL_AMP=0.30;
+const BEAT=6.0, ESC_TEETH=18, ESC_STEP=(Math.PI*2/ESC_TEETH);
+const SEC_REV=24; // seconds per revolution (sped up for liveliness)
+const smoother=t=>t<=0?0:t>=1?1:t*t*t*(t*(t*6-15)+10);
+const lerp=(a,b,t)=>a+(b-a)*t;
+
+function animate(){
+  requestAnimationFrame(animate);
+  const dt=Math.min(clock.getDelta(), 0.05);
+  const el=clock.elapsedTime;
+
+  // --- mechanics ---
+  if(anim.balance) anim.balance.rotation.y = BAL_AMP*Math.sin(W*el);
+  if(anim.hairspring){
+    anim.hairspring.rotation.y = BAL_AMP*0.85*Math.sin(W*el);
+    const br=1+0.07*Math.sin(W*el); anim.hairspring.scale.set(br,1,br);
+  }
+  if(anim.pallet) anim.pallet.rotation.y = PAL_AMP*Math.max(-1,Math.min(1, 2.6*Math.sin(W*el)));
+  if(anim.escape){
+    const beat=el*BEAT, si=Math.floor(beat), fr=beat-si;
+    const ease=fr<0.3?smoother(fr/0.3):1;
+    anim.escape.rotation.y = (si+ease)*ESC_STEP*0.5;
+  }
+  anim.spinners.forEach(s=> s.g.rotation.y += s.rate*dt);
+  if(anim.barrel) anim.barrel.rotation.y += 0.14*dt;
+  if(anim.sec)  anim.sec.rotation.y  += dt*(Math.PI*2/SEC_REV);
+  if(anim.min)  anim.min.rotation.y  += dt*(Math.PI*2/(SEC_REV*30));
+  if(anim.hour) anim.hour.rotation.y += dt*(Math.PI*2/(SEC_REV*360));
+
+  // --- explode + highlight scale ---
+  explodeT += (explodeTarget-explodeT)*Math.min(1, dt*3.4);
+  const ee=smoother(explodeT);
+  for(const id in parts){
+    const p=parts[id]; if(p.isSub) continue; const g=p.group;
+    g.position.copy(g.userData.base).addScaledVector(g.userData.explode, ee);
+    const cs=lerp(g.userData.curScale, p.targetScale, Math.min(1,dt*9));
+    g.userData.curScale=cs; g.scale.setScalar(cs);
+  }
+
+  // --- night / lume mode ---
+  nightT += (nightTarget-nightT)*Math.min(1, dt*2.6);
+  const nl=nightT;
+  if(anim.key)  anim.key.intensity  = lerp(2.1,0.22,nl);
+  if(anim.rim)  anim.rim.intensity  = lerp(1.3,0.35,nl);
+  if(anim.fill) anim.fill.intensity = lerp(0.5,0.05,nl);
+  if(anim.hemi) anim.hemi.intensity = lerp(0.5,0.07,nl);
+  if(anim.soft1) anim.soft1.intensity = lerp(2.2,0.4,nl);
+  if(anim.soft2) anim.soft2.intensity = lerp(1.4,0.25,nl);
+  renderer.toneMappingExposure = lerp(0.96,0.86,nl);
+  bloomPass.strength = lerp(0.42,0.95,nl);
+  lumeSet.forEach(m=>{
+    const base=lerp(1.5, 3.2, nl);
+    m.emissiveIntensity = m.userData.hl ? base*1.5 : base;
+  });
+
+  // --- camera reset tween ---
+  if(camTween){
+    camTween.k=Math.min(1, camTween.k+dt*1.4); const k=smoother(camTween.k);
+    camera.position.lerpVectors(camTween.from, camTween.to, k);
+    controls.target.lerpVectors(camTween.tFrom, camTween.tTo, k);
+    if(camTween.k>=1) camTween=null;
+  }
+
+  controls.update();
+  composer.render();
+  labelRenderer.render(scene, camera);
+}
+
+/* boot */
+try { init(); }
+catch(err){
+  console.error(err);
+  document.getElementById('loader').innerHTML =
+    '<div class="lt" style="color:#e88">Failed to load 3D scene — check your network (CDN).</div>';
+}
+</script>
+</body>
+</html>
diff --git a/outputs/claude-sonnet-4-6/claude-code-max/pelican-beach.svg b/outputs/claude-sonnet-4-6/claude-code-max/pelican-cycling.svg
similarity index 100%
rename from outputs/claude-sonnet-4-6/claude-code-max/pelican-beach.svg
rename to outputs/claude-sonnet-4-6/claude-code-max/pelican-cycling.svg
diff --git a/outputs/claude-sonnet-4-6/cursor-high/pelican-beach-2.svg b/outputs/claude-sonnet-4-6/cursor-high/pelican-cycling-2.svg
similarity index 100%
rename from outputs/claude-sonnet-4-6/cursor-high/pelican-beach-2.svg
rename to outputs/claude-sonnet-4-6/cursor-high/pelican-cycling-2.svg
diff --git a/outputs/claude-sonnet-4-6/cursor-high/pelican-beach.svg b/outputs/claude-sonnet-4-6/cursor-high/pelican-cycling.svg
similarity index 100%
rename from outputs/claude-sonnet-4-6/cursor-high/pelican-beach.svg
rename to outputs/claude-sonnet-4-6/cursor-high/pelican-cycling.svg
diff --git a/outputs/glm-5-2/zcode-max/pelican-bike-2.svg b/outputs/glm-5-2/zcode-max/pelican-cycling-2.svg
similarity index 100%
rename from outputs/glm-5-2/zcode-max/pelican-bike-2.svg
rename to outputs/glm-5-2/zcode-max/pelican-cycling-2.svg
diff --git a/outputs/glm-5-2/zcode-max/pelican-bike.svg b/outputs/glm-5-2/zcode-max/pelican-cycling.svg
similarity index 100%
rename from outputs/glm-5-2/zcode-max/pelican-bike.svg
rename to outputs/glm-5-2/zcode-max/pelican-cycling.svg
diff --git a/outputs/glm-5-turbo/zcode-thinking/pelican-bike.svg b/outputs/glm-5-turbo/zcode-thinking/pelican-cycling.svg
similarity index 100%
rename from outputs/glm-5-turbo/zcode-thinking/pelican-bike.svg
rename to outputs/glm-5-turbo/zcode-thinking/pelican-cycling.svg
diff --git a/outputs/gpt-5-2/cursor-xhigh/mythiccraft.html b/outputs/gpt-5-2/cursor-xhigh/mythos-craft.html
similarity index 100%
rename from outputs/gpt-5-2/cursor-xhigh/mythiccraft.html
rename to outputs/gpt-5-2/cursor-xhigh/mythos-craft.html
diff --git a/outputs/gpt-5-3-codex/cursor-xhigh/mythic-craft.html b/outputs/gpt-5-3-codex/cursor-xhigh/mythos-craft.html
similarity index 100%
rename from outputs/gpt-5-3-codex/cursor-xhigh/mythic-craft.html
rename to outputs/gpt-5-3-codex/cursor-xhigh/mythos-craft.html
diff --git a/outputs/gpt-5-4/cursor-xhigh/index.html b/outputs/gpt-5-4/cursor-xhigh/mythos-craft.html
similarity index 100%
rename from outputs/gpt-5-4/cursor-xhigh/index.html
rename to outputs/gpt-5-4/cursor-xhigh/mythos-craft.html
diff --git a/outputs/gpt-5-5-pro/chatgpt-web-extended-pro/skeleton-watch.html b/outputs/gpt-5-5-pro/chatgpt-web-extended-pro/skeleton-watch.html
new file mode 100644
index 0000000..761a517
--- /dev/null
+++ b/outputs/gpt-5-5-pro/chatgpt-web-extended-pro/skeleton-watch.html
@@ -0,0 +1,1412 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Interactive Skeleton Mechanical Watch — Three.js</title>
+  <style>
+    :root {
+      --glass: rgba(8, 14, 24, 0.58);
+      --glass-strong: rgba(8, 14, 24, 0.78);
+      --line: rgba(205, 230, 255, 0.18);
+      --text: #edf6ff;
+      --muted: #9bb1c9;
+      --gold: #e5c16b;
+      --cyan: #8fffee;
+    }
+
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+      color: var(--text);
+      background:
+        radial-gradient(circle at 50% 42%, rgba(42, 58, 84, 0.32), transparent 35%),
+        radial-gradient(circle at 15% 12%, rgba(90, 145, 210, 0.20), transparent 30%),
+        linear-gradient(145deg, #02030a 0%, #060914 45%, #02040a 100%);
+    }
+
+    #viewport { position: fixed; inset: 0; }
+    canvas { display: block; }
+
+    #vignette {
+      pointer-events: none;
+      position: fixed;
+      inset: 0;
+      background:
+        radial-gradient(circle at center, transparent 44%, rgba(0,0,0,0.42) 78%, rgba(0,0,0,0.85) 100%),
+        linear-gradient(180deg, rgba(255,255,255,0.035), transparent 16%);
+      mix-blend-mode: normal;
+    }
+
+    .ui {
+      position: fixed;
+      top: 22px;
+      left: 24px;
+      width: min(380px, calc(100vw - 48px));
+      padding: 18px 18px 16px;
+      border: 1px solid var(--line);
+      background: linear-gradient(180deg, rgba(12, 19, 31, 0.74), rgba(5, 8, 15, 0.45));
+      backdrop-filter: blur(18px) saturate(135%);
+      border-radius: 22px;
+      box-shadow: 0 28px 70px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08);
+      user-select: none;
+    }
+
+    .eyebrow {
+      display: flex;
+      align-items: center;
+      gap: 9px;
+      color: var(--gold);
+      text-transform: uppercase;
+      letter-spacing: 0.22em;
+      font-size: 11px;
+      font-weight: 700;
+    }
+    .eyebrow::before {
+      content: "";
+      width: 8px;
+      height: 8px;
+      border-radius: 999px;
+      background: var(--cyan);
+      box-shadow: 0 0 18px var(--cyan);
+    }
+    h1 {
+      margin: 10px 0 8px;
+      font-size: clamp(24px, 3vw, 38px);
+      line-height: 1.03;
+      letter-spacing: -0.04em;
+      font-weight: 780;
+    }
+    .sub {
+      margin: 0 0 15px;
+      color: var(--muted);
+      font-size: 13px;
+      line-height: 1.65;
+    }
+    .controls {
+      display: grid;
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+      gap: 9px;
+    }
+    button {
+      appearance: none;
+      border: 1px solid rgba(178, 217, 255, 0.24);
+      border-radius: 14px;
+      color: #eef8ff;
+      background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.035));
+      padding: 10px 10px;
+      cursor: pointer;
+      font-weight: 700;
+      letter-spacing: 0.02em;
+      box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
+      transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
+    }
+    button:hover {
+      transform: translateY(-1px);
+      border-color: rgba(143, 255, 238, 0.62);
+      background: linear-gradient(180deg, rgba(143,255,238,0.20), rgba(255,255,255,0.045));
+      box-shadow: 0 0 24px rgba(143,255,238,0.10), inset 0 1px 0 rgba(255,255,255,0.16);
+    }
+    button.active {
+      border-color: rgba(229, 193, 107, 0.72);
+      color: #fff7dc;
+      box-shadow: 0 0 28px rgba(229, 193, 107, 0.14), inset 0 1px 0 rgba(255,255,255,0.18);
+    }
+
+    #infoPanel {
+      position: fixed;
+      right: 24px;
+      top: 22px;
+      width: min(395px, calc(100vw - 48px));
+      border: 1px solid var(--line);
+      border-radius: 24px;
+      padding: 18px;
+      background: linear-gradient(180deg, rgba(9, 15, 27, 0.78), rgba(3, 5, 10, 0.52));
+      backdrop-filter: blur(18px) saturate(135%);
+      box-shadow: 0 28px 75px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.08);
+      user-select: none;
+    }
+    #infoPanel .label {
+      color: var(--cyan);
+      font-size: 11px;
+      text-transform: uppercase;
+      letter-spacing: 0.24em;
+      font-weight: 800;
+      margin-bottom: 8px;
+    }
+    #partName {
+      margin: 0;
+      font-size: 25px;
+      letter-spacing: -0.03em;
+    }
+    #partSubtitle {
+      margin: 5px 0 12px;
+      color: var(--gold);
+      font-size: 13px;
+      font-weight: 700;
+    }
+    #partDesc {
+      color: #bfd0e4;
+      line-height: 1.68;
+      font-size: 13px;
+      margin: 0 0 14px;
+    }
+    .specGrid {
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      gap: 8px;
+    }
+    .spec {
+      min-height: 58px;
+      padding: 10px 11px;
+      border: 1px solid rgba(205,230,255,0.14);
+      background: rgba(255,255,255,0.035);
+      border-radius: 14px;
+    }
+    .spec b { display: block; color: #f5fbff; font-size: 16px; letter-spacing: -0.02em; }
+    .spec span { color: #8ea6bd; font-size: 11px; }
+
+    #hint {
+      position: fixed;
+      left: 50%;
+      bottom: 22px;
+      transform: translateX(-50%);
+      color: rgba(229, 240, 255, 0.72);
+      border: 1px solid rgba(205,230,255,0.15);
+      background: rgba(4, 7, 13, 0.42);
+      backdrop-filter: blur(12px);
+      border-radius: 999px;
+      padding: 10px 15px;
+      font-size: 12px;
+      letter-spacing: .04em;
+      white-space: nowrap;
+      user-select: none;
+    }
+
+    .tooltip, .pinnedLabel {
+      position: fixed;
+      pointer-events: none;
+      padding: 8px 10px;
+      border-radius: 12px;
+      border: 1px solid rgba(143,255,238,0.34);
+      background: rgba(4, 10, 18, 0.86);
+      color: #efffff;
+      font-size: 12px;
+      font-weight: 800;
+      letter-spacing: 0.02em;
+      box-shadow: 0 15px 34px rgba(0,0,0,.42), 0 0 30px rgba(143,255,238,0.10);
+      transform: translate(-50%, calc(-100% - 18px));
+      opacity: 0;
+      transition: opacity .15s ease, transform .15s ease;
+      white-space: nowrap;
+    }
+    .tooltip::after, .pinnedLabel::after {
+      content: "";
+      position: absolute;
+      left: 50%;
+      bottom: -9px;
+      transform: translateX(-50%);
+      width: 1px;
+      height: 18px;
+      background: linear-gradient(to bottom, rgba(143,255,238,0.8), transparent);
+      box-shadow: 0 0 12px rgba(143,255,238,0.7);
+    }
+    .tooltip.visible, .pinnedLabel.visible {
+      opacity: 1;
+      transform: translate(-50%, calc(-100% - 12px));
+    }
+    .pinnedLabel {
+      border-color: rgba(229,193,107,0.48);
+      color: #fff6d5;
+      box-shadow: 0 15px 34px rgba(0,0,0,.42), 0 0 30px rgba(229,193,107,0.12);
+    }
+    .pinnedLabel::after { background: linear-gradient(to bottom, rgba(229,193,107,0.8), transparent); }
+
+    #loading {
+      position: fixed;
+      inset: 0;
+      display: grid;
+      place-items: center;
+      background: radial-gradient(circle at center, rgba(23, 32, 50, .90), rgba(0,0,0,.96));
+      color: #dcecff;
+      z-index: 10;
+      letter-spacing: .12em;
+      text-transform: uppercase;
+      font-size: 12px;
+      transition: opacity .7s ease, visibility .7s ease;
+    }
+    #loading.hide { opacity: 0; visibility: hidden; }
+
+    @media (max-width: 820px) {
+      .ui { top: 14px; left: 14px; padding: 14px; }
+      #infoPanel { right: 14px; top: auto; bottom: 62px; padding: 14px; max-height: 34vh; overflow: auto; }
+      .specGrid { grid-template-columns: 1fr 1fr; }
+      h1 { font-size: 24px; }
+      #partName { font-size: 20px; }
+      .sub, #partDesc { font-size: 12px; }
+    }
+  </style>
+</head>
+<body>
+  <div id="viewport"></div>
+  <div id="vignette"></div>
+
+  <section class="ui" aria-label="watch controls">
+    <div class="eyebrow">Calibre OAI-SK01</div>
+    <h1>镂空机械表<br/>交互式产品展示</h1>
+    <p class="sub">完全程序化建模：蓝宝石水晶、发条盒、齿轮系、擒纵、摆轮游丝、夹板、红宝石轴承与夜光显示。</p>
+    <div class="controls">
+      <button id="explodeBtn">切换爆炸视图</button>
+      <button id="motionBtn" class="active">机芯运转</button>
+      <button id="autoBtn" class="active">自动旋转</button>
+      <button id="resetBtn">重置视角</button>
+    </div>
+  </section>
+
+  <aside id="infoPanel" aria-live="polite">
+    <div class="label">Movement Intelligence</div>
+    <h2 id="partName">机芯总览</h2>
+    <div id="partSubtitle">Skeletonized hand-wound calibre · conceptual render</div>
+    <p id="partDesc">拖拽旋转手表，滚轮缩放；悬停任意零件会高亮并显示标签，点击则锁定零件说明。爆炸视图会分离蓝宝石玻璃、指针、夹板、齿轮与摆轮，让完整机芯层次一览无遗。</p>
+    <div id="specGrid" class="specGrid"></div>
+  </aside>
+
+  <div id="tooltip" class="tooltip"></div>
+  <div id="pinnedLabel" class="pinnedLabel"></div>
+  <div id="hint">拖拽旋转 · 滚轮缩放 · 悬停 / 点击零件 · 按钮切换爆炸视图</div>
+  <div id="loading">Assembling jeweled movement...</div>
+
+  <script type="importmap">
+    {
+      "imports": {
+        "three": "https://unpkg.com/three@0.184.0/build/three.module.js",
+        "three/addons/": "https://unpkg.com/three@0.184.0/examples/jsm/"
+      }
+    }
+  </script>
+
+  <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 container = document.getElementById('viewport');
+    const loading = document.getElementById('loading');
+    const tooltip = document.getElementById('tooltip');
+    const pinnedLabel = document.getElementById('pinnedLabel');
+    const partName = document.getElementById('partName');
+    const partSubtitle = document.getElementById('partSubtitle');
+    const partDesc = document.getElementById('partDesc');
+    const specGrid = document.getElementById('specGrid');
+
+    const renderer = new THREE.WebGLRenderer({ antialias: true, powerPreference: 'high-performance' });
+    renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
+    renderer.setSize(window.innerWidth, window.innerHeight);
+    renderer.outputColorSpace = THREE.SRGBColorSpace;
+    renderer.toneMapping = THREE.ACESFilmicToneMapping;
+    renderer.toneMappingExposure = 1.15;
+    renderer.shadowMap.enabled = true;
+    renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+    container.appendChild(renderer.domElement);
+
+    const scene = new THREE.Scene();
+    scene.background = new THREE.Color(0x02040a);
+    scene.fog = new THREE.FogExp2(0x03050d, 0.032);
+
+    const camera = new THREE.PerspectiveCamera(42, window.innerWidth / window.innerHeight, 0.1, 80);
+    camera.position.set(0.05, -7.7, 7.4);
+
+    const controls = new OrbitControls(camera, renderer.domElement);
+    controls.enableDamping = true;
+    controls.dampingFactor = 0.075;
+    controls.autoRotate = true;
+    controls.autoRotateSpeed = 0.42;
+    controls.target.set(0, 0, 0.05);
+    controls.minDistance = 5.2;
+    controls.maxDistance = 15;
+    controls.maxPolarAngle = Math.PI * 0.72;
+    controls.minPolarAngle = Math.PI * 0.12;
+
+    const pmrem = new THREE.PMREMGenerator(renderer);
+    scene.environment = pmrem.fromScene(new RoomEnvironment(), 0.04).texture;
+
+    const composer = new EffectComposer(renderer);
+    composer.addPass(new RenderPass(scene, camera));
+    const bloom = new UnrealBloomPass(new THREE.Vector2(window.innerWidth, window.innerHeight), 0.72, 0.58, 0.18);
+    composer.addPass(bloom);
+    composer.addPass(new OutputPass());
+
+    const root = new THREE.Group();
+    scene.add(root);
+
+    const watch = new THREE.Group();
+    watch.rotation.z = -0.04;
+    root.add(watch);
+
+    const raycaster = new THREE.Raycaster();
+    const pointer = new THREE.Vector2();
+    const parts = new Map();
+    const pickables = [];
+    const explodables = [];
+    const animated = [];
+    let hoveredId = null;
+    let selectedId = null;
+    let explosionTarget = 0;
+    let explosion = 0;
+    let motionRunning = true;
+    let lastPointer = { x: 0, y: 0 };
+
+    const MAT = {
+      platinum: new THREE.MeshPhysicalMaterial({ color: 0xcfd8e2, metalness: 1, roughness: 0.18, clearcoat: 0.8, clearcoatRoughness: 0.08 }),
+      darkSteel: new THREE.MeshPhysicalMaterial({ color: 0x354357, metalness: 1, roughness: 0.24, clearcoat: 0.45 }),
+      blackSteel: new THREE.MeshPhysicalMaterial({ color: 0x0d121b, metalness: 0.8, roughness: 0.38, clearcoat: 0.6 }),
+      brushed: new THREE.MeshPhysicalMaterial({ color: 0xaeb8c6, metalness: 1, roughness: 0.28, clearcoat: 0.32 }),
+      bevelSteel: new THREE.MeshPhysicalMaterial({ color: 0xf2f6fb, metalness: 1, roughness: 0.12, clearcoat: 0.9, clearcoatRoughness: 0.04 }),
+      gold: new THREE.MeshPhysicalMaterial({ color: 0xd8a94d, metalness: 1, roughness: 0.22, clearcoat: 0.48, clearcoatRoughness: 0.08 }),
+      roseGold: new THREE.MeshPhysicalMaterial({ color: 0xc98962, metalness: 1, roughness: 0.20, clearcoat: 0.42 }),
+      blueSteel: new THREE.MeshPhysicalMaterial({ color: 0x315ea8, metalness: 1, roughness: 0.18, clearcoat: 0.64 }),
+      ruby: new THREE.MeshPhysicalMaterial({ color: 0xff124a, metalness: 0, roughness: 0.035, transmission: 0.18, thickness: 0.22, transparent: true, opacity: 0.88, clearcoat: 1, clearcoatRoughness: 0.02, ior: 1.76 }),
+      sapphire: new THREE.MeshPhysicalMaterial({ color: 0xcdf8ff, metalness: 0, roughness: 0.005, transmission: 0.78, thickness: 0.38, transparent: true, opacity: 0.30, clearcoat: 1, clearcoatRoughness: 0.01, ior: 1.45, reflectivity: 1 }),
+      sapphireEdge: new THREE.MeshPhysicalMaterial({ color: 0x9cefff, metalness: 0, roughness: 0.02, transmission: 0.45, transparent: true, opacity: 0.42, clearcoat: 1, ior: 1.45 }),
+      lume: new THREE.MeshStandardMaterial({ color: 0xdffff1, emissive: 0x8ffff0, emissiveIntensity: 2.6, roughness: 0.45, metalness: 0.02 }),
+      lumeSoft: new THREE.MeshStandardMaterial({ color: 0xbaffda, emissive: 0x7fffc7, emissiveIntensity: 1.75, roughness: 0.48 }),
+      redAccent: new THREE.MeshStandardMaterial({ color: 0xff3355, emissive: 0xff1133, emissiveIntensity: 0.7, roughness: 0.3 }),
+      blackGlass: new THREE.MeshPhysicalMaterial({ color: 0x080d16, metalness: 0.25, roughness: 0.22, clearcoat: 1, clearcoatRoughness: 0.05, transparent: true, opacity: 0.72 }),
+      strap: new THREE.MeshPhysicalMaterial({ color: 0x05070b, metalness: 0.2, roughness: 0.62, clearcoat: 0.35 }),
+      stripe: new THREE.MeshStandardMaterial({ color: 0xeff8ff, metalness: 0.2, roughness: 0.35, transparent: true, opacity: 0.20 }),
+      shadowPlane: new THREE.MeshPhysicalMaterial({ color: 0x03060c, metalness: 0.25, roughness: 0.34, clearcoat: 0.9, clearcoatRoughness: 0.12 })
+    };
+
+    const PART_DATA = {
+      overview: {
+        name: '机芯总览',
+        subtitle: 'Skeletonized hand-wound calibre · conceptual render',
+        desc: '拖拽旋转手表，滚轮缩放；悬停任意零件会高亮并显示标签，点击则锁定零件说明。爆炸视图会分离蓝宝石玻璃、指针、夹板、齿轮与摆轮，让完整机芯层次一览无遗。',
+        specs: [['OAI-SK01', '概念镂空机芯'], ['21,600 vph', '摆频模拟'], ['46 h', '动力储存设定'], ['22 jewels', '红宝石轴承布局']]
+      },
+      case: {
+        name: '抛光表壳与表冠',
+        subtitle: 'polished steel case · fluted crown · articulated lugs',
+        desc: '多层金属外壳包围完全开放的机芯。表圈、底盖、表耳与带槽表冠采用高金属度材质，配合环境反射与柔和阴影呈现摄影棚级产品质感。',
+        specs: [['42 mm', '视觉表径'], ['多层倒角', '抛光 / 拉丝对比'], ['防护结构', '前后蓝宝石夹层'], ['表冠', '细密齿纹造型']]
+      },
+      sapphire: {
+        name: '蓝宝石水晶玻璃',
+        subtitle: 'front & exhibition back crystal',
+        desc: '前镜和透底以透明高折射材质表现，保留玻璃边缘蓝色折光；爆炸视图中会向前分离，露出指针与机芯层次。',
+        specs: [['IOR 1.45', '折射率模拟'], ['超低粗糙度', '强镜面反射'], ['双面透明', '正面与透底'], ['防眩光', '浅蓝镀膜外观']]
+      },
+      lume: {
+        name: '荧光刻度与分钟轨',
+        subtitle: 'luminous hour indexes · 60 minute track',
+        desc: '立体夜光时标围绕镂空机芯悬浮，配合 Bloom 泛光形成夜光涂层的柔亮边缘。每五分钟刻度加粗，读取清晰。',
+        specs: [['12', '夜光小时刻度'], ['60', '分钟刻线'], ['Bloom', '柔和发光'], ['悬浮结构', '无遮挡机芯']]
+      },
+      hands: {
+        name: '荧光镂空指针',
+        subtitle: 'skeletonized hour / minute hands with luminous inserts',
+        desc: '时针、分针采用金属边框加夜光填充；秒针以红色发光尾针做视觉焦点。指针以加速方式运行，便于观察动态。',
+        specs: [['3 hands', '时 / 分 / 秒'], ['Lume fill', '夜光填充'], ['Openworked', '镂空轮廓'], ['Fast demo', '展示级加速']]
+      },
+      mainPlate: {
+        name: '镂空主夹板',
+        subtitle: 'openworked mainplate · radial architecture',
+        desc: '主夹板以圆环和辐条支撑机芯，保留大量开孔，使发条盒、轮系、擒纵与摆轮都可以从正面直接看见。',
+        specs: [['Open bridge', '大面积镂空'], ['Radial spokes', '辐射式承载'], ['Micro screws', '螺丝固定'], ['Black polish', '暗色抛光底层']]
+      },
+      bridges: {
+        name: '镂空轮系夹板',
+        subtitle: 'rhodium bridges · cutaways · Geneva stripes',
+        desc: '轮系夹板以切面几何和开孔展示轮轴；表面加上浅色日内瓦纹装饰线，红宝石轴承与蓝钢螺丝固定在夹板上方。',
+        specs: [['Rhodium tone', '铑色金属'], ['Cutaway holes', '轮轴开孔'], ['Geneva stripes', '装饰纹理'], ['Layered', '爆炸视图可分层']]
+      },
+      barrel: {
+        name: '主发条与发条盒',
+        subtitle: 'mainspring barrel · visible coiled spring',
+        desc: '左上方的大直径发条盒内可见盘绕主发条，外围齿圈向中心轮输出扭矩。动画中它缓慢旋转，模拟动力释放。',
+        specs: [['Coiled spring', '可见盘绕发条'], ['72 teeth', '外圈齿形'], ['Slow torque', '低速高扭矩'], ['Skeleton cap', '开放式桶盖']]
+      },
+      centerWheel: {
+        name: '中心轮',
+        subtitle: 'center wheel · motion works pivot',
+        desc: '中心轮位于表盘中心下方，承接发条盒动力并驱动显示系统。其金色轮辐与中心宝石轴承形成视觉焦点。',
+        specs: [['48 teeth', '金色齿轮'], ['Central pivot', '指针轴附近'], ['Open spokes', '镂空轮辐'], ['Train ratio', '轮系传动起点']]
+      },
+      thirdWheel: {
+        name: '三轮',
+        subtitle: 'third wheel · intermediate gear',
+        desc: '三轮将中心轮的动力继续传向四轮，以更高转速运行。齿轮开孔减少视觉遮挡，让夹板下方结构清晰可见。',
+        specs: [['36 teeth', '中间传动'], ['Higher rpm', '较高转速'], ['Jeweled pivot', '红宝石轴承'], ['Skeleton wheel', '减重开孔']]
+      },
+      fourthWheel: {
+        name: '四轮 / 秒轮',
+        subtitle: 'fourth wheel · seconds train',
+        desc: '四轮位于右下区域，通常与秒显示相关；在此展示中它高速旋转，并将动力送往擒纵轮。',
+        specs: [['30 teeth', '细齿轮'], ['Fast train', '高速轮系'], ['Pinion layer', '叠层小齿轴'], ['Visual seconds', '秒级动态']]
+      },
+      escapeWheel: {
+        name: '擒纵轮',
+        subtitle: 'escape wheel · tick-stepped impulse',
+        desc: '擒纵轮以间歇步进方式释放能量，和擒纵叉、摆轮共同形成机械表的“滴答”节奏。',
+        specs: [['15 teeth', '尖齿擒纵轮'], ['Step motion', '间歇释放'], ['Impulse', '传递冲量'], ['High polish', '金属反光']]
+      },
+      palletFork: {
+        name: '擒纵叉与叉瓦',
+        subtitle: 'pallet fork · ruby pallet stones',
+        desc: '蓝钢擒纵叉在摆轮节奏下左右摆动，红宝石叉瓦交替锁止与释放擒纵轮，是能量被分割为稳定节拍的关键。',
+        specs: [['Ruby pallets', '红宝石叉瓦'], ['Lock / unlock', '锁止与释放'], ['Oscillation', '左右摆动'], ['Impulse jewel', '与摆轮交互']]
+      },
+      balance: {
+        name: '摆轮与游丝',
+        subtitle: 'free sprung balance · blue hairspring',
+        desc: '摆轮高速往复振荡，蓝色游丝在中心盘绕。它与擒纵机构共同决定走时稳定性，是机芯中最具生命感的部件。',
+        specs: [['21,600 vph', '摆频模拟'], ['Blue hairspring', '蓝钢游丝'], ['Micro weights', '配重螺钉'], ['Oscillating', '平滑往复动画']]
+      },
+      balanceBridge: {
+        name: '摆轮夹板',
+        subtitle: 'balance cock · jeweled cap setting',
+        desc: '单臂摆轮夹板横跨摆轮上方，以中心红宝石端石固定摆轴；造型留出大窗口展示摆轮与游丝运动。',
+        specs: [['Single arm', '单臂夹板'], ['Cap jewel', '端石结构'], ['Open view', '无遮挡窗口'], ['Blue screw', '蓝钢固定螺丝']]
+      },
+      jewels: {
+        name: '红宝石轴承',
+        subtitle: 'synthetic ruby bearings · low-friction pivots',
+        desc: '红宝石轴承分布在轮轴和摆轮位置，以透明红色宝石材质呈现。它们减少摩擦并让机芯视觉层次更精致。',
+        specs: [['22 jewels', '布局模拟'], ['Low friction', '降低轴颈磨耗'], ['Transparent red', '宝石折光'], ['Chaton rings', '金属套圈']]
+      },
+      screws: {
+        name: '蓝钢螺丝与微型固定件',
+        subtitle: 'heat-blued screws · polished slots',
+        desc: '多枚蓝钢螺丝固定夹板、表壳与桥板。槽口和边缘使用小型几何体建模，在强光下产生精密机械的闪耀细节。',
+        specs: [['Blued steel', '热处理蓝色'], ['Slotted heads', '抛光槽口'], ['Bridge fixing', '夹板固定'], ['Micro scale', '细节增强']]
+      },
+      strap: {
+        name: '黑色鳄纹表带',
+        subtitle: 'subtle leather strap · stitched texture',
+        desc: '深色表带置于机芯后方，提供高级腕表摄影的暗调背景，同时避免抢夺镂空机芯的视觉焦点。',
+        specs: [['Matte black', '低反射皮革'], ['Stitching', '缝线细节'], ['Recessed', '位于表壳后方'], ['Luxury contrast', '暗色衬托金属']]
+      }
+    };
+
+    function setDefaultInfo() { updateInfo('overview'); }
+
+    function updateInfo(id) {
+      const data = PART_DATA[id] || PART_DATA.overview;
+      partName.textContent = data.name;
+      partSubtitle.textContent = data.subtitle;
+      partDesc.textContent = data.desc;
+      specGrid.innerHTML = '';
+      data.specs.forEach(([value, label]) => {
+        const div = document.createElement('div');
+        div.className = 'spec';
+        div.innerHTML = `<b>${value}</b><span>${label}</span>`;
+        specGrid.appendChild(div);
+      });
+    }
+
+    function applyShadows(object) {
+      object.traverse((child) => {
+        if (child.isMesh) {
+          child.castShadow = true;
+          child.receiveShadow = true;
+        }
+      });
+    }
+
+    function cloneInteractiveMaterials(rootObject) {
+      rootObject.traverse((child) => {
+        if (!child.isMesh) return;
+        if (Array.isArray(child.material)) child.material = child.material.map((mat) => mat.clone());
+        else child.material = child.material.clone();
+      });
+    }
+
+    function registerPart(rootObject, id, explodeVector = new THREE.Vector3(0, 0, 0)) {
+      cloneInteractiveMaterials(rootObject);
+      applyShadows(rootObject);
+      rootObject.userData.basePosition = rootObject.position.clone();
+      rootObject.userData.explodeVector = explodeVector.clone();
+      parts.set(id, { id, root: rootObject, data: PART_DATA[id] || PART_DATA.overview });
+      explodables.push(rootObject);
+      rootObject.traverse((child) => {
+        if (!child.isMesh) return;
+        child.userData.partId = id;
+        pickables.push(child);
+      });
+      return rootObject;
+    }
+
+    function storeMaterialBase(mat) {
+      if (!mat.userData.baseStored) {
+        mat.userData.baseStored = true;
+        mat.userData.baseColor = mat.color ? mat.color.clone() : new THREE.Color(0xffffff);
+        mat.userData.baseEmissive = mat.emissive ? mat.emissive.clone() : null;
+        mat.userData.baseEmissiveIntensity = mat.emissiveIntensity || 0;
+        mat.userData.baseOpacity = mat.opacity;
+      }
+    }
+
+    function visitMaterials(object, callback) {
+      object.traverse((child) => {
+        if (!child.isMesh) return;
+        const materials = Array.isArray(child.material) ? child.material : [child.material];
+        materials.forEach(callback);
+      });
+    }
+
+    const activeHighlights = new Set();
+    function setPartHighlighted(id, on) {
+      const part = parts.get(id);
+      if (!part) return;
+      visitMaterials(part.root, (mat) => {
+        storeMaterialBase(mat);
+        if (on) {
+          if (mat.color) mat.color.copy(mat.userData.baseColor).lerp(new THREE.Color(0x9ffff0), 0.36);
+          if (mat.emissive) {
+            mat.emissive.set(0x4ffff0);
+            mat.emissiveIntensity = Math.max(mat.userData.baseEmissiveIntensity || 0, 1.15);
+          }
+        } else {
+          if (mat.color) mat.color.copy(mat.userData.baseColor);
+          if (mat.emissive && mat.userData.baseEmissive) mat.emissive.copy(mat.userData.baseEmissive);
+          if ('emissiveIntensity' in mat) mat.emissiveIntensity = mat.userData.baseEmissiveIntensity;
+          mat.opacity = mat.userData.baseOpacity;
+        }
+      });
+    }
+
+    function refreshHighlights() {
+      const target = new Set();
+      if (hoveredId) target.add(hoveredId);
+      if (selectedId) target.add(selectedId);
+      activeHighlights.forEach((id) => {
+        if (!target.has(id)) {
+          setPartHighlighted(id, false);
+          activeHighlights.delete(id);
+        }
+      });
+      target.forEach((id) => {
+        if (!activeHighlights.has(id)) {
+          setPartHighlighted(id, true);
+          activeHighlights.add(id);
+        }
+      });
+    }
+
+    function cylinderZ(radiusTop, radiusBottom, depth, material, segments = 96, openEnded = false) {
+      const geo = new THREE.CylinderGeometry(radiusTop, radiusBottom, depth, segments, 1, openEnded);
+      geo.rotateX(Math.PI / 2);
+      const mesh = new THREE.Mesh(geo, material);
+      return mesh;
+    }
+
+    function discZ(radius, depth, material, segments = 96) {
+      return cylinderZ(radius, radius, depth, material, segments, false);
+    }
+
+    function ringShape(outerR, innerR) {
+      const shape = new THREE.Shape();
+      shape.absarc(0, 0, outerR, 0, Math.PI * 2, false);
+      const hole = new THREE.Path();
+      hole.absarc(0, 0, innerR, 0, Math.PI * 2, true);
+      shape.holes.push(hole);
+      return shape;
+    }
+
+    function extrudeShape(shape, depth, material, bevelSize = 0.035, bevelSegments = 4) {
+      const geo = new THREE.ExtrudeGeometry(shape, {
+        depth,
+        bevelEnabled: true,
+        bevelSize,
+        bevelThickness: bevelSize * 0.85,
+        bevelSegments,
+        curveSegments: 64
+      });
+      geo.center();
+      const mesh = new THREE.Mesh(geo, material);
+      return mesh;
+    }
+
+    function extrudedRing(outerR, innerR, depth, material, bevelSize = 0.045) {
+      return extrudeShape(ringShape(outerR, innerR), depth, material, bevelSize, 5);
+    }
+
+    function roundedRectShape(w, h, r) {
+      const x = -w / 2;
+      const y = -h / 2;
+      const shape = new THREE.Shape();
+      shape.moveTo(x + r, y);
+      shape.lineTo(x + w - r, y);
+      shape.quadraticCurveTo(x + w, y, x + w, y + r);
+      shape.lineTo(x + w, y + h - r);
+      shape.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
+      shape.lineTo(x + r, y + h);
+      shape.quadraticCurveTo(x, y + h, x, y + h - r);
+      shape.lineTo(x, y + r);
+      shape.quadraticCurveTo(x, y, x + r, y);
+      return shape;
+    }
+
+    function roundedRectMesh(w, h, depth, r, material) {
+      return extrudeShape(roundedRectShape(w, h, r), depth, material, Math.min(depth * 0.28, r * 0.42), 4);
+    }
+
+    function makeBarBetween(x1, y1, x2, y2, width, depth, material, z = 0) {
+      const dx = x2 - x1;
+      const dy = y2 - y1;
+      const len = Math.hypot(dx, dy);
+      const mesh = new THREE.Mesh(new THREE.BoxGeometry(len, width, depth), material);
+      mesh.position.set((x1 + x2) / 2, (y1 + y2) / 2, z);
+      mesh.rotation.z = Math.atan2(dy, dx);
+      return mesh;
+    }
+
+    function addLocalBar(group, length, width, depth, x, y, angle, material) {
+      const mesh = new THREE.Mesh(new THREE.BoxGeometry(length, width, depth), material);
+      mesh.position.set(x, y, 0);
+      mesh.rotation.z = angle;
+      group.add(mesh);
+      return mesh;
+    }
+
+    function makeGearGeometry(teeth, outerR, rootR, innerR, depth, holes = 5, holeScale = 0.13) {
+      const shape = new THREE.Shape();
+      const steps = teeth * 2;
+      const phase = Math.PI / steps;
+      for (let i = 0; i <= steps; i++) {
+        const r = i % 2 === 0 ? outerR : rootR;
+        const a = (i / steps) * Math.PI * 2 + phase;
+        const x = Math.cos(a) * r;
+        const y = Math.sin(a) * r;
+        if (i === 0) shape.moveTo(x, y);
+        else shape.lineTo(x, y);
+      }
+      shape.closePath();
+
+      const centerHole = new THREE.Path();
+      centerHole.absarc(0, 0, innerR, 0, Math.PI * 2, true);
+      shape.holes.push(centerHole);
+
+      const midR = (rootR + innerR) * 0.53;
+      const holeR = Math.max(0.035, outerR * holeScale);
+      for (let i = 0; i < holes; i++) {
+        const a = (i / holes) * Math.PI * 2 + Math.PI / holes;
+        const hole = new THREE.Path();
+        hole.absarc(Math.cos(a) * midR, Math.sin(a) * midR, holeR, 0, Math.PI * 2, true);
+        shape.holes.push(hole);
+      }
+
+      const geo = new THREE.ExtrudeGeometry(shape, {
+        depth,
+        bevelEnabled: true,
+        bevelSize: Math.min(depth * 0.22, 0.028),
+        bevelThickness: Math.min(depth * 0.16, 0.020),
+        bevelSegments: 2,
+        curveSegments: 10
+      });
+      geo.center();
+      return geo;
+    }
+
+    function createGear({ teeth, outerR, rootR, innerR, depth, material, pinion = true, holes = 5, holeScale = 0.13, z = 0 }) {
+      const group = new THREE.Group();
+      group.position.z = z;
+      const mesh = new THREE.Mesh(makeGearGeometry(teeth, outerR, rootR, innerR, depth, holes, holeScale), material);
+      group.add(mesh);
+
+      const hub = discZ(innerR * 1.28, depth * 0.68, MAT.roseGold, 48);
+      hub.position.z = depth * 0.08;
+      group.add(hub);
+
+      const hubRing = new THREE.Mesh(new THREE.TorusGeometry(innerR * 1.55, 0.012, 10, 60), MAT.bevelSteel);
+      hubRing.position.z = depth * 0.42;
+      group.add(hubRing);
+
+      if (pinion) {
+        const p = new THREE.Mesh(makeGearGeometry(Math.max(8, Math.round(teeth / 4)), outerR * 0.25, outerR * 0.20, innerR * 0.46, depth * 1.18, 0, 0.1), MAT.brushed);
+        p.position.z = depth * 0.92;
+        group.add(p);
+      }
+
+      const pivot = discZ(innerR * 0.48, depth * 1.5, MAT.bevelSteel, 36);
+      pivot.position.z = depth * 1.08;
+      group.add(pivot);
+      return group;
+    }
+
+    class SpiralCurve extends THREE.Curve {
+      constructor(turns, r0, r1, z = 0, phase = 0) {
+        super();
+        this.turns = turns;
+        this.r0 = r0;
+        this.r1 = r1;
+        this.z = z;
+        this.phase = phase;
+      }
+      getPoint(t, target = new THREE.Vector3()) {
+        const angle = this.phase + t * this.turns * Math.PI * 2;
+        const r = THREE.MathUtils.lerp(this.r0, this.r1, t);
+        return target.set(Math.cos(angle) * r, Math.sin(angle) * r, this.z);
+      }
+    }
+
+    function createSpiralTube(turns, r0, r1, radius, material, z = 0, phase = 0) {
+      const curve = new SpiralCurve(turns, r0, r1, z, phase);
+      const geo = new THREE.TubeGeometry(curve, Math.max(96, turns * 38), radius, 8, false);
+      const mesh = new THREE.Mesh(geo, material);
+      return mesh;
+    }
+
+    function makeJewel(radius = 0.075) {
+      const group = new THREE.Group();
+      const jewel = new THREE.Mesh(new THREE.SphereGeometry(radius, 32, 16), MAT.ruby);
+      jewel.scale.z = 0.42;
+      jewel.position.z = 0.018;
+      group.add(jewel);
+      const chaton = new THREE.Mesh(new THREE.TorusGeometry(radius * 1.22, radius * 0.115, 10, 42), MAT.gold);
+      chaton.position.z = -0.005;
+      group.add(chaton);
+      return group;
+    }
+
+    function makeScrew(radius = 0.075, depth = 0.035) {
+      const group = new THREE.Group();
+      const head = discZ(radius, depth, MAT.blueSteel, 44);
+      group.add(head);
+      const slot = new THREE.Mesh(new THREE.BoxGeometry(radius * 1.48, radius * 0.18, depth * 0.42), MAT.bevelSteel);
+      slot.position.z = depth * 0.52;
+      group.add(slot);
+      return group;
+    }
+
+    function makeHand(length, width, z, metalMat, lumeMat, hasTail = false) {
+      const group = new THREE.Group();
+      group.position.z = z;
+      const shape = new THREE.Shape();
+      const tail = hasTail ? -length * 0.28 : -0.22;
+      shape.moveTo(-width * 0.5, tail);
+      shape.lineTo(width * 0.5, tail);
+      shape.lineTo(width * 0.34, length * 0.82);
+      shape.lineTo(width * 0.08, length);
+      shape.lineTo(-width * 0.08, length);
+      shape.lineTo(-width * 0.34, length * 0.82);
+      shape.closePath();
+      const body = extrudeShape(shape, 0.025, metalMat, 0.006, 2);
+      group.add(body);
+
+      const fill = new THREE.Shape();
+      fill.moveTo(-width * 0.18, 0.08);
+      fill.lineTo(width * 0.18, 0.08);
+      fill.lineTo(width * 0.10, length * 0.70);
+      fill.lineTo(0, length * 0.82);
+      fill.lineTo(-width * 0.10, length * 0.70);
+      fill.closePath();
+      const lume = extrudeShape(fill, 0.028, lumeMat, 0.002, 1);
+      lume.position.z = 0.022;
+      group.add(lume);
+      return group;
+    }
+
+    function makeMarker(angle, radius, big) {
+      const w = big ? 0.055 : 0.018;
+      const h = big ? 0.38 : 0.19;
+      const d = big ? 0.055 : 0.035;
+      const marker = new THREE.Mesh(new THREE.BoxGeometry(w, h, d), big ? MAT.lume : MAT.lumeSoft);
+      marker.position.set(Math.sin(angle) * radius, Math.cos(angle) * radius, 0.71);
+      marker.rotation.z = -angle;
+      return marker;
+    }
+
+    function polygonPlate(points, holes, depth, material) {
+      const shape = new THREE.Shape();
+      shape.moveTo(points[0][0], points[0][1]);
+      for (let i = 1; i < points.length; i++) shape.lineTo(points[i][0], points[i][1]);
+      shape.closePath();
+      holes.forEach(([x, y, r]) => {
+        const hole = new THREE.Path();
+        hole.absarc(x, y, r, 0, Math.PI * 2, true);
+        shape.holes.push(hole);
+      });
+      return extrudeShape(shape, depth, material, 0.025, 4);
+    }
+
+    function radialPosition(angle, radius, z = 0) {
+      return new THREE.Vector3(Math.sin(angle) * radius, Math.cos(angle) * radius, z);
+    }
+
+    // Studio background and reflective dark base.
+    const backdrop = new THREE.Mesh(new THREE.PlaneGeometry(34, 34), MAT.shadowPlane);
+    backdrop.position.z = -0.72;
+    backdrop.receiveShadow = true;
+    scene.add(backdrop);
+
+    const halo = new THREE.Mesh(new THREE.TorusGeometry(5.25, 0.018, 8, 180), new THREE.MeshBasicMaterial({ color: 0x23415f, transparent: true, opacity: 0.28 }));
+    halo.position.z = -0.67;
+    scene.add(halo);
+
+    const starGeo = new THREE.BufferGeometry();
+    const starPositions = [];
+    for (let i = 0; i < 260; i++) {
+      const a = Math.random() * Math.PI * 2;
+      const r = 5.4 + Math.random() * 10.0;
+      starPositions.push(Math.cos(a) * r, Math.sin(a) * r, -0.66 + Math.random() * 0.08);
+    }
+    starGeo.setAttribute('position', new THREE.Float32BufferAttribute(starPositions, 3));
+    const starField = new THREE.Points(starGeo, new THREE.PointsMaterial({ color: 0x8fb8ff, size: 0.018, transparent: true, opacity: 0.32 }));
+    scene.add(starField);
+
+    // Lighting: large soft reflection + controlled rim highlights.
+    const ambient = new THREE.HemisphereLight(0xdbeeff, 0x02040b, 1.1);
+    scene.add(ambient);
+
+    const key = new THREE.SpotLight(0xffffff, 96, 24, Math.PI * 0.24, 0.42, 1.35);
+    key.position.set(-4.6, -5.8, 8.0);
+    key.target.position.set(0.1, 0.1, 0);
+    key.castShadow = true;
+    key.shadow.mapSize.set(2048, 2048);
+    key.shadow.bias = -0.00008;
+    scene.add(key, key.target);
+
+    const rim = new THREE.SpotLight(0x7ec9ff, 54, 18, Math.PI * 0.28, 0.55, 1.7);
+    rim.position.set(4.5, 2.9, 5.6);
+    rim.target.position.set(0, 0, 0.2);
+    scene.add(rim, rim.target);
+
+    const warm = new THREE.PointLight(0xffd498, 8.5, 13);
+    warm.position.set(-2.6, 3.8, 3.2);
+    scene.add(warm);
+
+    // Strap behind the case.
+    const strapGroup = new THREE.Group();
+    const strapTop = roundedRectMesh(2.35, 4.2, 0.12, 0.24, MAT.strap);
+    strapTop.position.set(0, 5.42, -0.42);
+    strapGroup.add(strapTop);
+    const strapBottom = roundedRectMesh(2.35, 4.2, 0.12, 0.24, MAT.strap);
+    strapBottom.position.set(0, -5.42, -0.42);
+    strapGroup.add(strapBottom);
+    for (const y of [3.95, 4.55, 5.15, 5.75, 6.35, -3.95, -4.55, -5.15, -5.75, -6.35]) {
+      const stitchL = new THREE.Mesh(new THREE.BoxGeometry(0.08, 0.018, 0.014), MAT.stripe);
+      const stitchR = stitchL.clone();
+      stitchL.position.set(-0.92, y, -0.34);
+      stitchR.position.set(0.92, y, -0.34);
+      strapGroup.add(stitchL, stitchR);
+    }
+    watch.add(strapGroup);
+    registerPart(strapGroup, 'strap', new THREE.Vector3(0, 0, -0.55));
+
+    // Case, lugs, crown.
+    const caseGroup = new THREE.Group();
+    const caseRing = extrudedRing(4.23, 3.62, 0.64, MAT.platinum, 0.055);
+    caseRing.position.z = 0.02;
+    caseGroup.add(caseRing);
+
+    const frontBezel = new THREE.Mesh(new THREE.TorusGeometry(3.84, 0.115, 16, 160), MAT.bevelSteel);
+    frontBezel.position.z = 0.51;
+    caseGroup.add(frontBezel);
+
+    const backBezel = new THREE.Mesh(new THREE.TorusGeometry(3.84, 0.095, 16, 160), MAT.darkSteel);
+    backBezel.position.z = -0.42;
+    caseGroup.add(backBezel);
+
+    const innerRehaut = new THREE.Mesh(new THREE.TorusGeometry(3.48, 0.045, 10, 140), MAT.blackSteel);
+    innerRehaut.position.z = 0.48;
+    caseGroup.add(innerRehaut);
+
+    for (const y of [3.95, -3.95]) {
+      for (const x of [-1.42, 1.42]) {
+        const lug = roundedRectMesh(0.42, 1.55, 0.42, 0.14, MAT.platinum);
+        lug.position.set(x, y, -0.02);
+        lug.rotation.z = x * (y > 0 ? -0.055 : 0.055);
+        caseGroup.add(lug);
+      }
+      const bar = cylinderZ(0.055, 0.055, 2.65, MAT.bevelSteel, 32);
+      bar.rotation.y = Math.PI / 2;
+      bar.position.set(0, y + Math.sign(y) * 0.55, -0.02);
+      caseGroup.add(bar);
+    }
+
+    const crownGroup = new THREE.Group();
+    const crown = cylinderZ(0.28, 0.28, 0.54, MAT.platinum, 64);
+    crown.rotation.y = Math.PI / 2;
+    crownGroup.add(crown);
+    for (let i = -2; i <= 2; i++) {
+      const ridge = new THREE.Mesh(new THREE.TorusGeometry(0.285, 0.012, 8, 54), MAT.bevelSteel);
+      ridge.rotation.y = Math.PI / 2;
+      ridge.position.x = i * 0.075;
+      crownGroup.add(ridge);
+    }
+    crownGroup.position.set(4.42, 0.04, 0.02);
+    caseGroup.add(crownGroup);
+
+    watch.add(caseGroup);
+    registerPart(caseGroup, 'case', new THREE.Vector3(0.32, 0.04, 0.55));
+
+    // Sapphire crystals.
+    const sapphireGroup = new THREE.Group();
+    const crystal = discZ(3.57, 0.045, MAT.sapphire, 160);
+    crystal.position.z = 0.94;
+    crystal.userData.passThrough = true;
+    sapphireGroup.add(crystal);
+    const crystalEdge = new THREE.Mesh(new THREE.TorusGeometry(3.57, 0.024, 10, 160), MAT.sapphireEdge);
+    crystalEdge.position.z = 0.975;
+    sapphireGroup.add(crystalEdge);
+    const backCrystal = discZ(3.50, 0.035, MAT.sapphire, 160);
+    backCrystal.position.z = -0.56;
+    backCrystal.userData.passThrough = true;
+    sapphireGroup.add(backCrystal);
+    const backEdge = new THREE.Mesh(new THREE.TorusGeometry(3.50, 0.020, 10, 160), MAT.sapphireEdge);
+    backEdge.position.z = -0.535;
+    sapphireGroup.add(backEdge);
+    watch.add(sapphireGroup);
+    registerPart(sapphireGroup, 'sapphire', new THREE.Vector3(0, -0.15, 1.30));
+
+    // Luminous chapter ring.
+    const lumeGroup = new THREE.Group();
+    const chapterOuter = new THREE.Mesh(new THREE.TorusGeometry(3.28, 0.026, 8, 160), MAT.lumeSoft);
+    chapterOuter.position.z = 0.695;
+    lumeGroup.add(chapterOuter);
+    const chapterInner = new THREE.Mesh(new THREE.TorusGeometry(2.95, 0.012, 8, 160), MAT.lumeSoft);
+    chapterInner.position.z = 0.692;
+    lumeGroup.add(chapterInner);
+    for (let i = 0; i < 60; i++) {
+      const a = i / 60 * Math.PI * 2;
+      const big = i % 5 === 0;
+      lumeGroup.add(makeMarker(a, big ? 3.12 : 3.20, big));
+    }
+    for (let i = 0; i < 12; i++) {
+      const a = i / 12 * Math.PI * 2;
+      const pip = discZ(i % 3 === 0 ? 0.105 : 0.075, 0.042, MAT.lume, 32);
+      const p = radialPosition(a, 2.78, 0.715);
+      pip.position.copy(p);
+      lumeGroup.add(pip);
+    }
+    watch.add(lumeGroup);
+    registerPart(lumeGroup, 'lume', new THREE.Vector3(0, 0, 0.46));
+
+    // Main plate and radial architecture.
+    const mainPlate = new THREE.Group();
+    const mainRing = extrudedRing(3.03, 0.40, 0.10, MAT.blackSteel, 0.03);
+    mainRing.position.z = -0.12;
+    mainPlate.add(mainRing);
+    const outerMovementRing = extrudedRing(3.20, 2.96, 0.09, MAT.darkSteel, 0.025);
+    outerMovementRing.position.z = -0.05;
+    mainPlate.add(outerMovementRing);
+
+    for (let i = 0; i < 8; i++) {
+      const a = i / 8 * Math.PI * 2 + 0.16;
+      const start = radialPosition(a, 0.62, -0.04);
+      const end = radialPosition(a, 2.75, -0.04);
+      const spoke = makeBarBetween(start.x, start.y, end.x, end.y, 0.105, 0.085, MAT.darkSteel, -0.04);
+      mainPlate.add(spoke);
+    }
+    for (const [x, y, r] of [[-2.22,1.94,.18],[2.05,1.72,.16],[2.35,-1.78,.15],[-2.18,-2.0,.16],[0,2.32,.13]]) {
+      const sink = extrudedRing(r, r * 0.42, 0.055, MAT.bevelSteel, 0.012);
+      sink.position.set(x, y, 0.025);
+      mainPlate.add(sink);
+    }
+    watch.add(mainPlate);
+    registerPart(mainPlate, 'mainPlate', new THREE.Vector3(-0.12, 0.06, 0.32));
+
+    // Bridges and decorative plates.
+    const bridges = new THREE.Group();
+    const trainBridge = polygonPlate(
+      [[-0.38, 0.82], [0.62, 1.18], [1.82, 0.62], [2.16, -0.42], [1.52, -1.30], [0.24, -1.46], [-0.50, -0.68]],
+      [[0, 0, 0.30], [1.02, 0.48, 0.25], [1.42, -0.42, 0.22], [0.55, -1.25, 0.22]],
+      0.115,
+      MAT.brushed
+    );
+    trainBridge.position.z = 0.33;
+    bridges.add(trainBridge);
+
+    const barrelBridge = polygonPlate(
+      [[-2.62, 1.82], [-1.88, 2.36], [-0.72, 1.85], [-0.52, 0.80], [-1.18, 0.22], [-2.25, 0.52], [-2.88, 1.08]],
+      [[-1.45, 1.08, 0.46], [-2.18, 1.48, 0.17]],
+      0.105,
+      MAT.brushed
+    );
+    barrelBridge.position.z = 0.36;
+    bridges.add(barrelBridge);
+
+    for (let i = -5; i <= 5; i++) {
+      const stripe = new THREE.Mesh(new THREE.BoxGeometry(3.45, 0.012, 0.012), MAT.stripe);
+      stripe.rotation.z = -0.43;
+      stripe.position.set(0.74, i * 0.28, 0.43);
+      bridges.add(stripe);
+    }
+    for (let i = -3; i <= 3; i++) {
+      const stripe = new THREE.Mesh(new THREE.BoxGeometry(1.85, 0.012, 0.012), MAT.stripe);
+      stripe.rotation.z = 0.58;
+      stripe.position.set(-1.65, 1.16 + i * 0.22, 0.45);
+      bridges.add(stripe);
+    }
+
+    watch.add(bridges);
+    registerPart(bridges, 'bridges', new THREE.Vector3(0.16, 0.02, 0.70));
+
+    // Gear train and mainspring barrel.
+    const barrel = createGear({ teeth: 72, outerR: 0.92, rootR: 0.83, innerR: 0.17, depth: 0.125, material: MAT.gold, holes: 7, holeScale: 0.08, z: 0.06 });
+    barrel.position.set(-1.45, 1.08, 0.06);
+    const barrelDrum = discZ(0.63, 0.075, MAT.blackGlass, 96);
+    barrelDrum.position.z = 0.12;
+    barrel.add(barrelDrum);
+    const barrelRing = new THREE.Mesh(new THREE.TorusGeometry(0.66, 0.026, 10, 96), MAT.bevelSteel);
+    barrelRing.position.z = 0.19;
+    barrel.add(barrelRing);
+    const spring = createSpiralTube(5.8, 0.08, 0.57, 0.012, MAT.blueSteel, 0.21, 0.2);
+    barrel.add(spring);
+    watch.add(barrel);
+    registerPart(barrel, 'barrel', new THREE.Vector3(-0.42, 0.34, 0.48));
+    animated.push({ object: barrel, speed: 0.22, mode: 'continuous' });
+
+    const centerWheel = createGear({ teeth: 48, outerR: 0.68, rootR: 0.60, innerR: 0.13, depth: 0.105, material: MAT.gold, holes: 6, holeScale: 0.10, z: 0.08 });
+    centerWheel.position.set(0, 0, 0.08);
+    watch.add(centerWheel);
+    registerPart(centerWheel, 'centerWheel', new THREE.Vector3(0.02, 0.00, 0.38));
+    animated.push({ object: centerWheel, speed: -0.72, mode: 'continuous' });
+
+    const thirdWheel = createGear({ teeth: 36, outerR: 0.49, rootR: 0.43, innerR: 0.105, depth: 0.095, material: MAT.gold, holes: 5, holeScale: 0.105, z: 0.12 });
+    thirdWheel.position.set(1.02, 0.48, 0.12);
+    watch.add(thirdWheel);
+    registerPart(thirdWheel, 'thirdWheel', new THREE.Vector3(0.36, 0.10, 0.42));
+    animated.push({ object: thirdWheel, speed: 1.55, mode: 'continuous' });
+
+    const fourthWheel = createGear({ teeth: 30, outerR: 0.40, rootR: 0.35, innerR: 0.085, depth: 0.085, material: MAT.gold, holes: 5, holeScale: 0.095, z: 0.16 });
+    fourthWheel.position.set(1.42, -0.42, 0.16);
+    watch.add(fourthWheel);
+    registerPart(fourthWheel, 'fourthWheel', new THREE.Vector3(0.42, -0.14, 0.44));
+    animated.push({ object: fourthWheel, speed: -2.55, mode: 'continuous' });
+
+    const escapeWheel = createGear({ teeth: 15, outerR: 0.34, rootR: 0.25, innerR: 0.065, depth: 0.072, material: MAT.gold, holes: 5, holeScale: 0.07, z: 0.22 });
+    escapeWheel.position.set(0.55, -1.25, 0.22);
+    watch.add(escapeWheel);
+    registerPart(escapeWheel, 'escapeWheel', new THREE.Vector3(0.30, -0.30, 0.56));
+    animated.push({ object: escapeWheel, speed: 0, mode: 'escapement' });
+
+    // Pallet fork.
+    const palletFork = new THREE.Group();
+    palletFork.position.set(-0.18, -1.25, 0.36);
+    addLocalBar(palletFork, 0.82, 0.070, 0.055, 0.18, 0.02, 0.08, MAT.blueSteel);
+    addLocalBar(palletFork, 0.48, 0.052, 0.050, -0.25, 0.12, 0.70, MAT.blueSteel);
+    addLocalBar(palletFork, 0.48, 0.052, 0.050, -0.25, -0.12, -0.70, MAT.blueSteel);
+    const palletPivot = discZ(0.075, 0.060, MAT.bevelSteel, 40);
+    palletPivot.position.z = 0.03;
+    palletFork.add(palletPivot);
+    const rubyA = new THREE.Mesh(new THREE.BoxGeometry(0.20, 0.055, 0.045), MAT.ruby);
+    rubyA.position.set(0.54, 0.14, 0.04);
+    rubyA.rotation.z = 0.28;
+    const rubyB = rubyA.clone();
+    rubyB.position.set(0.54, -0.14, 0.04);
+    rubyB.rotation.z = -0.28;
+    palletFork.add(rubyA, rubyB);
+    const impulseJewel = makeJewel(0.052);
+    impulseJewel.position.set(-0.51, 0, 0.045);
+    palletFork.add(impulseJewel);
+    watch.add(palletFork);
+    registerPart(palletFork, 'palletFork', new THREE.Vector3(-0.10, -0.42, 0.56));
+
+    // Balance wheel with hairspring.
+    const balance = new THREE.Group();
+    balance.position.set(-1.32, -1.25, 0.34);
+    const balanceRim = new THREE.Mesh(new THREE.TorusGeometry(0.68, 0.034, 14, 144), MAT.bevelSteel);
+    balance.add(balanceRim);
+    const balanceInner = new THREE.Mesh(new THREE.TorusGeometry(0.18, 0.014, 10, 72), MAT.gold);
+    balanceInner.position.z = 0.026;
+    balance.add(balanceInner);
+    for (let i = 0; i < 3; i++) {
+      const a = i / 3 * Math.PI * 2;
+      const spoke = new THREE.Mesh(new THREE.BoxGeometry(0.96, 0.032, 0.034), MAT.gold);
+      spoke.position.set(Math.cos(a) * 0.24, Math.sin(a) * 0.24, 0.018);
+      spoke.rotation.z = a;
+      balance.add(spoke);
+    }
+    for (let i = 0; i < 10; i++) {
+      const a = i / 10 * Math.PI * 2 + 0.1;
+      const weight = discZ(0.045, 0.030, i % 2 ? MAT.gold : MAT.blueSteel, 22);
+      weight.position.set(Math.cos(a) * 0.68, Math.sin(a) * 0.68, 0.045);
+      balance.add(weight);
+    }
+    const hairspring = createSpiralTube(6.4, 0.038, 0.33, 0.0068, MAT.blueSteel, 0.082, 0.4);
+    balance.add(hairspring);
+    const balanceJewel = makeJewel(0.072);
+    balanceJewel.position.z = 0.098;
+    balance.add(balanceJewel);
+    watch.add(balance);
+    registerPart(balance, 'balance', new THREE.Vector3(-0.38, -0.34, 0.66));
+
+    // Balance bridge / cock.
+    const balanceBridge = new THREE.Group();
+    const cockArm = makeBarBetween(-2.16, -0.78, -0.92, -1.54, 0.22, 0.105, MAT.brushed, 0.54);
+    balanceBridge.add(cockArm);
+    const cockBase = extrudedRing(0.35, 0.105, 0.09, MAT.brushed, 0.018);
+    cockBase.position.set(-1.32, -1.25, 0.58);
+    balanceBridge.add(cockBase);
+    const cockJewel = makeJewel(0.085);
+    cockJewel.position.set(-1.32, -1.25, 0.64);
+    balanceBridge.add(cockJewel);
+    const regulator = makeBarBetween(-1.74, -0.98, -1.15, -0.98, 0.040, 0.040, MAT.blueSteel, 0.62);
+    balanceBridge.add(regulator);
+    const cockScrew = makeScrew(0.080, 0.040);
+    cockScrew.position.set(-2.08, -0.80, 0.61);
+    balanceBridge.add(cockScrew);
+    watch.add(balanceBridge);
+    registerPart(balanceBridge, 'balanceBridge', new THREE.Vector3(-0.35, -0.12, 0.72));
+
+    // Jewels at pivots.
+    const jewelsGroup = new THREE.Group();
+    const jewelPositions = [
+      [-1.45, 1.08, 0.47, .075], [0, 0, 0.49, .080], [1.02, 0.48, 0.50, .068], [1.42, -0.42, 0.51, .060], [0.55, -1.25, 0.52, .057],
+      [-1.32, -1.25, 0.70, .080], [-2.18, 1.48, 0.48, .055], [0.48, 0.96, 0.48, .052], [1.78, 0.26, 0.48, .052], [1.25, -1.13, 0.50, .052],
+      [-2.30, -1.83, 0.16, .052], [2.28, -1.80, 0.16, .052], [2.18, 1.72, 0.16, .052], [-2.20, 1.93, 0.16, .052]
+    ];
+    jewelPositions.forEach(([x, y, z, r]) => {
+      const jewel = makeJewel(r);
+      jewel.position.set(x, y, z);
+      jewelsGroup.add(jewel);
+    });
+    watch.add(jewelsGroup);
+    registerPart(jewelsGroup, 'jewels', new THREE.Vector3(0.08, 0.08, 0.82));
+
+    // Blue screws and fasteners.
+    const screwGroup = new THREE.Group();
+    const screwPositions = [
+      [-2.66, 1.12, 0.47], [-0.75, 1.70, 0.49], [0.68, 1.05, 0.47], [2.02, 0.42, 0.47], [1.66, -1.12, 0.47], [0.05, -1.25, 0.47],
+      [-2.56, -2.02, 0.08], [2.58, -1.94, 0.08], [2.55, 1.82, 0.08], [-2.58, 1.92, 0.08], [0, 2.42, 0.08], [0, -2.55, 0.08],
+      [-3.56, 0, 0.56], [3.56, 0, 0.56], [0, 3.56, 0.56], [0, -3.56, 0.56]
+    ];
+    screwPositions.forEach(([x, y, z], idx) => {
+      const screw = makeScrew(idx > 11 ? 0.064 : 0.078, 0.038);
+      screw.position.set(x, y, z);
+      screw.rotation.z = idx * 0.37;
+      screwGroup.add(screw);
+    });
+    watch.add(screwGroup);
+    registerPart(screwGroup, 'screws', new THREE.Vector3(0.05, 0, 0.78));
+
+    // Hands and center cap.
+    const hands = new THREE.Group();
+    const hourHand = makeHand(1.50, 0.20, 0.74, MAT.bevelSteel, MAT.lume, true);
+    const minuteHand = makeHand(2.34, 0.150, 0.77, MAT.bevelSteel, MAT.lume, true);
+    const secondHand = new THREE.Group();
+    secondHand.position.z = 0.82;
+    const secBar = new THREE.Mesh(new THREE.BoxGeometry(0.030, 2.55, 0.026), MAT.redAccent);
+    secBar.position.y = 0.86;
+    secondHand.add(secBar);
+    const secCounter = new THREE.Mesh(new THREE.BoxGeometry(0.050, 0.70, 0.024), MAT.redAccent);
+    secCounter.position.y = -0.42;
+    secondHand.add(secCounter);
+    const secTip = discZ(0.060, 0.028, MAT.lume, 28);
+    secTip.position.set(0, 2.17, 0.018);
+    secondHand.add(secTip);
+    const handCap = discZ(0.17, 0.105, MAT.bevelSteel, 64);
+    handCap.position.z = 0.86;
+    hands.add(hourHand, minuteHand, secondHand, handCap);
+    watch.add(hands);
+    registerPart(hands, 'hands', new THREE.Vector3(0, 0, 1.02));
+
+    // Subtle reflection rings on crystal surface.
+    const reflectionGroup = new THREE.Group();
+    for (let i = 0; i < 3; i++) {
+      const arc = new THREE.Mesh(new THREE.TorusGeometry(2.2 + i * 0.36, 0.006, 6, 140, Math.PI * 1.18), new THREE.MeshBasicMaterial({ color: 0xbef8ff, transparent: true, opacity: 0.13 - i * 0.028 }));
+      arc.rotation.z = 0.45 + i * 0.22;
+      arc.position.z = 1.005 + i * 0.002;
+      reflectionGroup.add(arc);
+    }
+    watch.add(reflectionGroup);
+
+    // Save base rotations after construction.
+    animated.forEach((item) => { item.baseRotationZ = item.object.rotation.z; });
+    const balanceBaseRotation = balance.rotation.z;
+    const palletBaseRotation = palletFork.rotation.z;
+
+    function updateExploded(dt) {
+      explosion = THREE.MathUtils.damp(explosion, explosionTarget, 5.5, dt);
+      const eased = explosion * explosion * (3 - 2 * explosion);
+      explodables.forEach((object) => {
+        const base = object.userData.basePosition;
+        const vec = object.userData.explodeVector;
+        if (!base || !vec) return;
+        object.position.copy(base).addScaledVector(vec, eased);
+      });
+    }
+
+    function updateMotion(time) {
+      if (!motionRunning) return;
+      animated.forEach((item) => {
+        if (item.mode === 'continuous') {
+          item.object.rotation.z = item.baseRotationZ + time * item.speed;
+        } else if (item.mode === 'escapement') {
+          const ticksPerSecond = 8;
+          const step = Math.floor(time * ticksPerSecond);
+          const local = (time * ticksPerSecond) % 1;
+          const snap = step * (Math.PI * 2 / 15) + THREE.MathUtils.smootherstep(local, 0.56, 0.82) * (Math.PI * 2 / 15);
+          item.object.rotation.z = snap;
+        }
+      });
+
+      const beat = Math.sin(time * 14.8);
+      balance.rotation.z = balanceBaseRotation + beat * 0.48;
+      hairspring.scale.setScalar(1 + Math.sin(time * 14.8 + 0.4) * 0.030);
+      palletFork.rotation.z = palletBaseRotation + Math.sin(time * 14.8 + 0.8) * 0.18;
+
+      const fastSeconds = time * 0.92;
+      secondHand.rotation.z = -fastSeconds * Math.PI * 2;
+      minuteHand.rotation.z = -fastSeconds * Math.PI * 2 / 60 - 0.40;
+      hourHand.rotation.z = -fastSeconds * Math.PI * 2 / 720 + 0.60;
+      reflectionGroup.rotation.z = Math.sin(time * 0.18) * 0.10 + 0.28;
+      starField.rotation.z = time * 0.006;
+    }
+
+    function screenPositionForPart(id) {
+      const part = parts.get(id);
+      if (!part) return null;
+      const pos = new THREE.Vector3();
+      part.root.getWorldPosition(pos);
+      pos.project(camera);
+      if (pos.z < -1 || pos.z > 1) return null;
+      return {
+        x: (pos.x * 0.5 + 0.5) * window.innerWidth,
+        y: (-pos.y * 0.5 + 0.5) * window.innerHeight
+      };
+    }
+
+    function updatePinnedLabel() {
+      if (!selectedId) {
+        pinnedLabel.classList.remove('visible');
+        return;
+      }
+      const part = parts.get(selectedId);
+      const p = screenPositionForPart(selectedId);
+      if (!part || !p) {
+        pinnedLabel.classList.remove('visible');
+        return;
+      }
+      pinnedLabel.textContent = part.data.name;
+      pinnedLabel.style.left = `${p.x}px`;
+      pinnedLabel.style.top = `${p.y}px`;
+      pinnedLabel.classList.add('visible');
+    }
+
+    function showTooltip(id, x, y) {
+      const part = parts.get(id);
+      if (!part) return;
+      tooltip.textContent = part.data.name;
+      tooltip.style.left = `${x}px`;
+      tooltip.style.top = `${y}px`;
+      tooltip.classList.add('visible');
+    }
+
+    function hideTooltip() {
+      tooltip.classList.remove('visible');
+    }
+
+    function pickPart(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 hits = raycaster.intersectObjects(pickables, true);
+      for (const hit of hits) {
+        if (hit.object.userData.passThrough) continue;
+        const id = hit.object.userData.partId;
+        if (id) return id;
+      }
+      return null;
+    }
+
+    renderer.domElement.addEventListener('pointermove', (event) => {
+      lastPointer = { x: event.clientX, y: event.clientY };
+      const id = pickPart(event);
+      if (id !== hoveredId) {
+        hoveredId = id;
+        refreshHighlights();
+      }
+      if (hoveredId) showTooltip(hoveredId, event.clientX, event.clientY);
+      else hideTooltip();
+    });
+
+    renderer.domElement.addEventListener('pointerleave', () => {
+      hoveredId = null;
+      hideTooltip();
+      refreshHighlights();
+    });
+
+    renderer.domElement.addEventListener('click', (event) => {
+      const id = pickPart(event);
+      if (id) {
+        selectedId = id;
+        updateInfo(id);
+      } else {
+        selectedId = null;
+        setDefaultInfo();
+      }
+      refreshHighlights();
+      updatePinnedLabel();
+    });
+
+    document.getElementById('explodeBtn').addEventListener('click', (event) => {
+      explosionTarget = explosionTarget > 0.5 ? 0 : 1;
+      event.currentTarget.classList.toggle('active', explosionTarget > 0.5);
+    });
+
+    document.getElementById('motionBtn').addEventListener('click', (event) => {
+      motionRunning = !motionRunning;
+      event.currentTarget.classList.toggle('active', motionRunning);
+      event.currentTarget.textContent = motionRunning ? '机芯运转' : '机芯暂停';
+    });
+
+    document.getElementById('autoBtn').addEventListener('click', (event) => {
+      controls.autoRotate = !controls.autoRotate;
+      event.currentTarget.classList.toggle('active', controls.autoRotate);
+      event.currentTarget.textContent = controls.autoRotate ? '自动旋转' : '手动旋转';
+    });
+
+    document.getElementById('resetBtn').addEventListener('click', () => {
+      camera.position.set(0.05, -7.7, 7.4);
+      controls.target.set(0, 0, 0.05);
+      controls.autoRotate = true;
+      explosionTarget = 0;
+      document.getElementById('explodeBtn').classList.remove('active');
+      document.getElementById('autoBtn').classList.add('active');
+      document.getElementById('autoBtn').textContent = '自动旋转';
+      selectedId = null;
+      hoveredId = null;
+      hideTooltip();
+      refreshHighlights();
+      setDefaultInfo();
+    });
+
+    function resize() {
+      const w = window.innerWidth;
+      const h = window.innerHeight;
+      camera.aspect = w / h;
+      camera.updateProjectionMatrix();
+      renderer.setSize(w, h);
+      composer.setSize(w, h);
+      bloom.setSize(w, h);
+    }
+    window.addEventListener('resize', resize);
+
+    const clock = new THREE.Clock();
+    function animate() {
+      requestAnimationFrame(animate);
+      const dt = Math.min(clock.getDelta(), 0.033);
+      const time = clock.elapsedTime;
+      controls.update();
+      updateExploded(dt);
+      updateMotion(time);
+      updatePinnedLabel();
+      if (hoveredId) showTooltip(hoveredId, lastPointer.x, lastPointer.y);
+      composer.render();
+    }
+
+    setDefaultInfo();
+    setTimeout(() => loading.classList.add('hide'), 450);
+    animate();
+  </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/outputs/grok-4-3/cursor-default/pelican-bike.svg b/outputs/grok-4-3/cursor-default/pelican-cycling.svg
similarity index 100%
rename from outputs/grok-4-3/cursor-default/pelican-bike.svg
rename to outputs/grok-4-3/cursor-default/pelican-cycling.svg