用途：把任何有序流程做成数据驱动的纵向或横向滚动故事，用一条进度线连接有序信息。要求序列在加入动画前就保持完整、可读、可导航。
主要能力：内容数据驱动，例如用 steps 数组保存 id、number、title、body，并渲染为带真实标题的有序列表；线条、圆点、媒体和激活状态只做增强，不替代结构。实现上先渲染一条安静的基线，再叠加进度线，纵向用 transform-origin: top，横向用 left；测量首尾点中心而非任意区块边缘，把滚动位置在两点中心之间归一化，用 scaleY(progress) 或 scaleX(progress) 让更新留在合成层；进度头越过某步中心时标记该步激活。
布局选择：仅当两侧宽度足够且内容权重相近时用居中交替时间线；长文案、紧凑步骤或卡片高度不一时用左侧轨道；短序列且标签简洁时用横向线，并保证键盘安全的溢出；仅当每步有独立视觉状态时才用固定全屏章节，且固定要有限并在下一节前释放；小屏折叠为简单左轨，不牺牲阅读顺序。
动画与导航：用小幅透明度、位移、缩放、模糊、颜色或媒体过渡，未激活步骤仍可读；仅在状态有意义且当前时用 aria-current="step"，不要用实时区域播报每次滚动。简单激活可用 IntersectionObserver，需要连续填充或协调固定媒体时用归一化滚动测量或 GSAP ScrollTrigger。步骤链接用真实锚点，为粘性头部加 scroll-margin，保持焦点不因被动滚动而移动，URL 与浏览器历史保持稳定，除非用户明确选择某步；交互步骤用按钮或链接并显示焦点，装饰性圆点不能是唯一控件。
限制与验证：在 prefers-reduced-motion: reduce 下显示完整线或离散已达状态，不做插值、模糊、固定或大位移，保留普通文档流和全部内容。需测试不同步骤数、不等高卡片、缺失媒体、长翻译、390/768/1024/1440 宽度、200% 缩放、快速正反向滚动、直接锚点导航、键盘顺序、减少动态、字体图片延迟布局、路由清理和控制台错误，并确保激活步骤与线头在每个边界一致。demo/index.html 为工作参考，demo/PROMPT.md 用于重建或改编，REFERENCES.md 为仅链接的实现来源列表。