AI 大比拼 · 第 8 期

制作一个可以直接打开的单文件网页作品《活的机械城堡》。

核心任务：用原创 SVG 做一段有剧情、可交互的连续机械变形动画。请自主完成设计、实现和验证，不需要向我询问设计偏好。

【动画剧情】
一轮约 30 秒，包含四个连续阶段：
1. 散落的齿轮、塔楼、窗框、金属板从不同方向聚拢，组装成一座机械城堡。
2. 城堡底部展开六条机械腿，开始行走。腿部关节、城堡重心和地面接触要相互配合。
3. 城堡停下，机械腿收回，塔楼与金属板展开成翼板，推进器启动，变成飞船。
4. 飞船升空、盘旋后降落，零件重新散开，自然进入下一轮。

主要零件要贯穿变形过程，观众能追踪它们的位置和用途。请通过移动、旋转、折叠和关节运动完成变形，避免用几张不同造型的图片淡入淡出来代替。

【视觉要求】
- 风格：奇幻工业，铜色金属、深蓝天空、暖色窗灯。
- 有前景、主体和远景层次，以及适量烟雾、火花、阴影和推进尾焰。
- 重点表现机械结构、运动节奏和重量感。
- 主画面突出作品，文字与控制面板保持简洁。

【交互要求】
- 暂停/继续、重新开始、播放速度调节。
- 点击烟囱，产生一次额外喷烟。
- 点击一个明显的齿轮，切换它的旋转方向。
- 拖动天空中的月亮，连续改变天空和城堡灯光，形成昼夜变化。
- 重复操作、暂停后恢复、连续重新开始，都应保持状态正确。

【技术要求】
- 交付 index.html，CSS、JavaScript 和 SVG 全部内嵌，离线直接打开即可运行。
- 主要画面与动画使用 SVG，可用 CSS 和 JavaScript 驱动。
- 不依赖外部库、网络请求、图片、字体或图像生成服务。
- 桌面和手机均能观看及操作，至少适配 1280px 和 390px 宽度。
- 控制动画开销，避免无限增加粒子或事件监听器。

【完成与验证】
完成后使用你实际可用的浏览器工具检查：
1. 四阶段剧情是否完整，循环衔接是否自然。
2. 所有交互是否有效。
3. 暂停、恢复和重新开始是否造成动画错乱。
4. 手机布局是否遮挡主体或控制按钮。
5. 是否存在控制台报错和外部网络依赖。

最后给出作品路径、简短操作说明、实际执行的验证及尚未解决的问题。没有执行的检查请如实注明。