# 测试题目：SEASONS IN GLASS——掌心里的四季世界

请用单个 HTML 文件制作一段 **30 秒、9:16 竖屏、自动循环播放的微缩生态短片**。一只透明玻璃球中，同一座小岛经历春芽、盛夏、秋叶、冬雪，再回到早春。

这是一段无需交互的视觉作品。观众应感到自己在看同一个小世界随时间生长与变化，而不是四张季节插画切换。

## 一、统一容器与空间

- 一个透明玻璃球置于简洁的深色圆形底座上，玻璃球和小岛始终完整可见；主体约占画幅宽度的 75%–85%。
- 球内固定包含：一座有厚度与土层的悬浮微缩小岛、一棵中央主树、三棵较小的树、一条弯曲溪流、一座跨溪小桥、一间小屋、沿岸至少 12 株可辨认的地被植物，以及若干石块。
- 主树、三棵小树、小桥、小屋、溪流及岛体使用固定身份和位置，四季之间不得重建成不同地图。
- 同时呈现前景玻璃边缘与植被、中景主树及小屋、后景植物与球体轮廓。小桥真实跨越同一条溪流，小屋落在地表，树根和树冠有明确归属。
- 玻璃需有边缘反射、柔和高光和透明厚度感，但不能通过强反射、严重折射或雾气遮住剧情。不要求精确光线追踪。
- 摄影棚背景固定为暖灰 `#E9E5DE`，底座为深灰 `#293431`。容器和背景不随季节换主题；季节颜色来自球内植物、天气、水体和光照。

## 二、季节视觉语言

- **春：** 嫩绿 `#A8C97F`、柔粉 `#E8B5BD`，枝条上出现嫩芽与花，溪水清亮，光线柔和。
- **夏：** 深绿 `#39745A`、暖金 `#E8C77A`，树冠茂密，植被舒展，水面更活跃，有昆虫或鸟类的生活细节。
- **秋：** 琥珀 `#C9823C`、赤陶 `#B95B42`，叶片渐变后脱落、旋转、落地，地面形成可见落叶层。
- **冬：** 雪白 `#E7EFF2`、冰蓝 `#A9C8D5`，枝叶减少，屋顶与地面逐渐积雪，溪流结冰，小屋窗内出现克制的暖光。
- 允许自然的明暗与颜色插值，不把整幅画面覆盖一层滤镜当作季节变化。暖光和天气均服务于球内世界，不新增炫目的界面色。

## 三、固定的 30 秒分镜

| 时间与 phase | 必须发生的动作 |
| :--- | :--- |
| 0–6 秒，spring | 首帧已有完整玻璃球与早春小岛；前 3 秒主树嫩芽展开，至少一组花朵依次开放。溪水流动，一只小昆虫开始活动。 |
| 6–12 秒，summer | 同一批枝条上的叶片长大，树冠变密；至少六只可辨认的小昆虫或鸟分布活动。一小片云带来短暂阵雨，雨滴与溪水或地面产生可见接触反馈。 |
| 12–18 秒，autumn | 树叶分批变黄或转红，至少 12 片可追踪叶片脱离原枝条、旋转下落并积在地面；风影响不同高度植被，不能全体同幅摆动。 |
| 18–24 秒，winter | 雪从球内上方落下，屋顶、地表和树枝逐渐积雪，溪流逐步结冰；小屋窗灯温暖亮起，保持屋体和桥梁位置不变。 |
| 24–30 秒，thaw | 日光回暖，积雪与冰逐渐退去，融水重新流动，地被与嫩芽恢复到开场早春状态；天气、昆虫、灯光及镜头自然衔接下一周期。 |

## 四、变化必须发生在世界内部

- 植物需要枝干、叶片或花瓣的结构变化。春夏生长不只是整体缩放，秋季落叶不能只是一批与树无关的随机粒子。
- 至少 12 片秋叶使用稳定 ID，可从树冠位置追踪到地面；落地后保持一段可见时间，随后随积雪遮盖或后续自然过程消退，不能在触地瞬间全部消失。
- 雨、雪和落叶具有不同运动规律：雨较快下落，雪缓慢飘动，叶片旋转并受风偏移；都应与球体边界和岛面合理关联，不能穿过玻璃飘到摄影棚。
- 雪层必须体现在屋顶、地面和至少部分枝条上；不能只有空中白点。水面结冰与融化须有可见面积变化，不能只修改状态或水面颜色。
- 至少三类持续环境运动：溪流或水面变化、植被受风、昆虫／鸟类活动。它们随季节调整；不要求冬天仍有夏季昆虫。
- 四季变化可使用浓缩时间与艺术化表达，不要求真实气象模拟。但雨落到哪里、雪积在哪里、叶片来自哪棵树必须看得懂。
- 同一地标跨季节保持位置、形态身份和可辨识特征，不允许整座小岛交叉淡入淡出后换成另一套场景。
- 镜头只做缓慢、小幅绕行与轻微推进，保持中央主树、小桥和小屋可辨；不能靠大幅旋转或遮挡掩盖状态切换。
- `loop: true`。30 秒后持续循环，恢复早春时仍是同一座岛。首尾容器、地标、植被状态、天气、活动对象和镜头应连续，不能在边界瞬间清空积雪或落叶。

## 五、专属场景状态

`getScene()` 至少返回：

- `landmarks`：岛体、四棵树、小桥、小屋与溪流的稳定 ID、实际位置、屏幕边界框。
- `plants`：地被植物、主树叶片与花朵的 ID、实际生长／开花状态和可见性。允许合理组织为组件，不用每个网格面冒充一株植物。
- `trackedLeaves`：至少 12 片秋叶的稳定 ID、所属树 ID、是否仍连接枝条、当前位置、旋转和是否落地。
- `seasonEffects`：实际使用的积雪覆盖、冰面覆盖、窗灯强度与天气阶段。屋顶、地面、树枝的积雪应可分别验证。
- `creatures`：昆虫或鸟类的 ID、位置、可见性与当前活动状态。
- `camera`：实际镜头参数。全部数据来自渲染状态，不返回与画面无关的季节标签。

## 播放与录制规范

- 主画幅 **1080 × 1920，9:16 竖屏**，同时适配 720 × 1280；在其他窗口内等比容纳完整画幅，不裁掉主体、不拉伸，无页面滚动条。
- 关键动作尽量位于画幅横向 8%–92%、纵向 8%–82% 范围，为后期字幕与平台界面留余量；这是本题统一构图约定，不代表任何平台的官方安全区。
- 页面就绪后自动静音播放，无点击、滚动、授权或悬停要求。首帧就呈现作品，前 3 秒出现可理解的动作，不放加载片头或大段文字。
- 不显示导航栏、参数面板、进度条、播放按钮、鼠标提示或调试信息。观众不需要读说明也能理解过程。
- 按空格暂停／继续，按 R 重置并从头播放；快捷键不显示在作品中。所有镜头、几何、材质、灯光、粒子和 CSS 动画都服从同一时间轴，暂停时一起停止。
- 使用固定随机种子与基于时间的动画，避免按帧累加造成不同机器上的剧情漂移；重播和指定时间采样应得到相同场景。
- 不依赖音效掩盖动作缺失；不使用频繁闪白、全屏遮挡或突然切镜头隐藏过程。

## 单文件交付与技术要求

- 只交付一个完整 HTML，HTML、CSS、JavaScript 全部内嵌。使用原生 SVG、Canvas、WebGL 或其组合，不使用第三方库。
- 所有几何、材质、纹理与装饰由代码生成；禁止外部或内嵌的现成图片、视频、模型、字体素材，禁止任何网络请求。代码生成的 Canvas 纹理允许使用。
- 断网后双击文件即可播放，不需要安装、构建或服务器。
- 不要求复杂物理引擎，可以使用确定性的轨迹和关键帧，但视觉过程必须符合本题的空间与因果要求。
- 控制对象、监听器和动画循环数量；重播或循环不能持续新增未清理的资源。
- 优先保证主体清晰、动作完整与流畅，不用粒子数量代替制作质量。

## 测试接口

在 `window.__VIDEO_DEMO__` 暴露以下接口，仅供测试，不显示在画面上：

```text
getState()
返回 { ready, time, duration: 30, paused, phase, loop, cycle }
time 为当前周期内的秒数；cycle 从 0 开始，完成一轮循环后加 1。
phase 使用本题分镜表给出的标识；loop 按本题的结尾规则设置。

restart()
重置场景、随机种子、cycle 和时间，从 0 秒开始播放。

pause()
暂停全部动画，保持当前画面与时间。

play()
从当前时间继续；非循环影片在终点调用不从头播放，重播使用 restart()。

seek(seconds)
跳到 0–30 秒之间的指定时刻并暂停，超界值截断。
直接计算该时刻完整场景，不能只改时间数字。
seek(30) 显示本轮结束状态，不立即跳回开头。
循环影片从该终点 play() 时进入下一轮；restart() 始终清零 cycle。

getScene()
返回本题规定的实际场景状态。对象 ID 跨重播保持稳定；
涉及屏幕位置时使用相对浏览器视口的 CSS 像素坐标。
```

接口必须从实际渲染使用的数据中取值，不得返回虚构对象、伪造完成状态或独立于画面的计数。场景状态细节见本题专属要求。

交付前自行检查完整播放、暂停、重播、时间定位、结尾行为、双画幅和离线运行。

**最终输出：只输出完整 HTML 代码，不附加解释。**
