Keynote-Style Launch Film In One File

You are an expert creative technologist specializing in browser-based motion design and Apple-style product films. Your task is to build a cinematic, single-take launch video as a self-contained HTML file, then provide instructions to render it to MP4.

## Brand & Assets

**Brand name (wordmark):** {{brand-name}}  
**Visual assets:** {{image-urls}}  
(Provide 9–12 high-resolution image URLs, one per line. These will be composited into the film as product shots, hero frames, or environmental textures.)

**Audio track:** {{audio-url}}  
(Royalty-free music around 120 BPM with a distinct drop and a quiet breakdown section. Mixkit or similar; confirm commercial-use license.)

---

## Technical Specification

### Animation Style
- **One continuous camera move** – no cuts, no fades, no scene transitions. The viewer should feel they are gliding through a single choreographed space.
- **Effects palette:** liquid glass (refractive distortions, caustics), mechanical iris blades (hexagonal or circular aperture wipes), and viscous goo morphs (metaball blobs, surface tension).
- **Timing backbone:** 54 beats at 120 BPM = 27 seconds. Lock every keyframe, wipe, morph, and reveal to the beat grid so the film pulses with the music.

### Implementation Requirements
1. **Single HTML file** – embed all JavaScript, CSS, and encode small assets as data URIs where feasible; reference the provided image and audio URLs inline.
2. **Rendering target:** 1920×1080, 60 fps, ~27 s duration.
3. **Tech stack:** Use Canvas 2D, WebGL (Three.js or raw shaders), or CSS3 with GSAP/anime.js – choose whichever best achieves the liquid-glass and iris effects at 60 fps.
4. **Stock assets:** If you need textures (normal maps, HDRIs, gradients) or placeholder geometry, pull from royalty-free sources (Polyhaven, Unsplash, etc.) and cite URLs in code comments.

---

## Delivery

1. **HTML file** – complete, runnable, with inline comments marking beat sync points and effect triggers.  
2. **Render instructions** – step-by-step CLI commands or tool recommendations (Puppeteer + FFmpeg, OBS Browser Source + recording, or Remotion/MediaPipe if preferred) to capture the 60 fps MP4 from the live HTML.

---

## Creative Direction

Channel the pacing and craft of an Apple Special Event reveal:  
- Open on the {{brand-name}} wordmark emerging through a refractive glass surface.  
- Guide the camera through each image in sequence, using iris-blade wipes and goo morphs to transition *within* the continuous shot.  
- Time the main product hero frame to the music drop.  
- Pull back through a final liquid-glass flourish during the breakdown, ending on the wordmark lockup.  

Prioritize **elegance over complexity** – every effect should feel intentional, not decorative. The film must render smoothly in a headless Chromium instance; optimize draw calls and avoid real-time physics that may stutter during capture.