用途：把一次视觉变换做成响应式滚动“乐器”，滚动位置决定精确视觉状态，支持正反双向，且页面在无动效时仍可用、渲染器可替换。
主要能力：先定义序列配置（scrollVh、frameCount、fit、posterFrame、reducedMotionFrame、copyStops），再用归一化 progress 统一驱动各渲染器。渲染器可选：视频（连续/摄影类，频繁关键帧、预加载元数据、保留宽高比、在 requestAnimationFrame 中合并 currentTime 写入）；图像序列（精确艺术帧，先预加载当前帧再邻近帧，不阻塞首屏）；Canvas（程序化绘制，设备像素比上限 2，仅进度变化时重绘）；SVG/DOM（图表、产品卡、界面状态与可访问文本，驱动 transform、opacity、clip path、CSS 变量）；WebGL 仅在深度、光照或真实 3D 相机明显增强时使用，并提供静态海报与资源释放。
使用方式：区块保持正常文档流，高度由 scrollVh 决定；视觉放入 position: sticky 的视口大小舞台；文案与控件独立分层，不把关键文字烘焙进帧。进度到渲染器映射不加隐式缓动，正确后再加平滑。字体与媒体尺寸稳定后刷新测量，并在下一区块前干净释放粘性舞台。项目已用 GSAP 或需精确 pin/refresh/时间线协调时可用 ScrollTrigger.create({...scrub:true, invalidateOnRefresh:true, onUpdate:({progress})=>render(progress)})；无依赖实现则在 scroll 与 resize 时测量，每动画帧调度一次渲染。
限制与注意：首帧绘制前保持海报可见；帧索引钳制在 0...frameCount-1；取消过期图像请求，快速滚动时不排队所有 seek；用 object-fit 与明确焦点保证移动端裁切；区块离屏或文档隐藏时暂停解码、渲染与观察；路由切换或卸载时清理 ScrollTrigger、观察器、监听器、动画帧、Blob URL 与渲染器资源。保留语义化标题、文案、字幕与 CTA，不困住滚动、不阻断键盘导航；prefers-reduced-motion: reduce 下移除 pin 与 scrub，渲染选定静态帧并恢复普通文档流；若序列传达有序信息，需以文本或列表暴露相同状态。验证正反向滚动、快速滑动、激活时缩放、390/768/1024/1440 宽度、未加载帧、视频被阻止、减少动效、键盘顺序、路由清理与控制台错误，同一滚动位置必须复现同一状态。demo/index.html 为工作参考，demo/PROMPT.md 用于重建或改编，REFERENCES.md 为仅链接的实现来源列表。