🛠️ Engine Rules & Known Issues

Engine rules (already present in templates/scroll-cinematic.js)

• Preload all frames; paint frame 0 on first load; redraw only when the frame index changes.
• Fixed stage: outer section height: 420–600vh, internal position:sticky; top:0; height:100vh.

Progress = clamp(-rect.top / (rect.height - innerH), 0, 1). Apply rate limiting in the rAF loop.

• Drawing with coverage adjustment + HiDPI (devicePixelRatio, limit 2). Drive updates through Lenis's rAF loop

(robust to any scroll source). The overlaid text fades over progress windows [in,out] per line.

• Multi-section: array SCRUB_SECTIONS; the engine ignores sections whose element doesn't exist.

Known issues

• More frames or larger frames = slow loading → keep it at 1600px / q88 / ~180 frames.
• Continuous-motion clips only (no hard cuts—they look bad when scrolling backward).
• The headless screenshot tool leaves fixed canvas sections blank while scrolling; verify with pixel sampling and view it live in a real browser.
• Previews with python http.server shut down when idle — the launcher .command is the lasting proof.