fix(examples): host the kinetic-type A-roll so the video actually renders

[miguel-heygen]

Problem

The kinetic-type flagship example fails hyperframes lint with 8 errors, and its A-roll footage is not driven by the live runtime. The centerpiece error is media_in_subcomposition: the A-roll <video> was authored inside the main-graphics sub-composition <template>.

Root cause

The runtime only seeks and decodes media that is a direct child of the host root (index.html). Media nested in a sub-composition template is never seeked, so it renders blank in Studio preview and the <hyperframes-player> web component. The composition's server render only worked because the producer's compile step hoists nested media and auto-stamps timing, which masked the contract violation. The example also carried crossorigin (breaks preview), an untimed video (media_missing_data_start), three gsap_css_transform_conflict cases where a CSS translateY would be discarded by a GSAP y tween, and an unbundled Libre Baskerville family with no @font-face.

Fix (root cause, no suppressions)

• Move the <video> out of compositions/main-graphics.html and into index.html as a direct child of #root (archetype B from composition-patterns), with data-start / data-duration / data-track-index and class="clip". Its per-scene opacity reveal now runs on the main timeline at global time, since a sub-composition timeline cannot reach host elements.
• Make the sub-composition a transparent overlay shell (background: transparent) stacked above the host video, so the type renders over the footage.
• Remove crossorigin; mark the audible footage with data-has-audio="true".
• Replace the three CSS translateY values with fromTo tweens (carson-line-1, wes-text-top, wes-text-bottom) so GSAP no longer overwrites them.
• Swap the unbundled Libre Baskerville for the bundled Playfair Display serif (an auto-resolved family) so the renderer supplies the Wes Anderson typography, and drop the redundant -apple-system token from the body font stack.

Verification

• hyperframes lint registry/examples/kinetic-type: was 8 errors, now 0 errors (2 pre-existing warnings remain: google_fonts_import, composition_self_attribute_selector).
• hyperframes validate registry/examples/kinetic-type: passes (exit 0, no console errors).
• Draft render + ffmpeg frame extraction: the A-roll composites correctly under the Swiss panel (3.0s), the David Carson "No timeline" headline (10.0s, correctly positioned after the fromTo change), and the Vignelli outro (14.0s). The Wes Anderson scene (12.5s) shows the elegant Playfair Display italic serif with the footage hidden as intended. ffprobe confirms both h264 video and aac audio streams in the output. Before and after renders match visually, with the after version now contract-correct and lint-clean.