Auto-Zoom Site Audit

Build this in Layerz Canvas using the layerz-canvas MCP.

A 15-second square promo, 1080×1080 at 60 fps, that captures the feel of a Layerz Canvas screen recording with auto zoom: a walkthrough of a website audit where the camera zooms to every click. All interface is built as vector shapes and text so it renders natively.

Look: a white browser window on a soft grey stage #EEF0F3; ink #1A1D21; issue red #E5484D; pass green #30A46C. SF Pro Text and Display. Window radius 18 with a 40px shadow at 12% opacity.

Beats:
- 0.0–1.5s: A small red REC dot blinks top-left. The browser window scales up from 0.9 and the address bar types "example.com".
- 1.5–4.0s: A donut score dial sweeps from 0 to 72 with a counter rolling alongside. The cursor glides to "Run audit" and clicks; the camera zooms 1.0 → 1.8 on the button, holds 0.4s and eases back.
- 4.0–7.5s: Audit rows reveal with a stagger: "Images missing alt text", "Slow hero image", "Low-contrast button", each with a red or green badge. The cursor clicks the first row; the camera zooms toward it and a highlight ring pulses around the page image.
- 7.5–10.5s: Fix montage, three quick zooms in sequence: a badge flips red to green (2.5D flip), the button darkens to pass contrast, the hero image shrinks with a "lighter" chip.
- 10.5–12.5s: Zoom out to the whole window; the dial sweeps 72 → 98, the ring turns green and a small sparkle burst fires.
- 12.5–15.0s: The window shrinks into a rounded tile that becomes the Layerz Canvas chevron. "Record. Auto-zoom. Share." appears one word-group at a time, wordmark beneath. Hold 0.7s.

Craft notes: every zoom is a 0.5s ease-in-out and zooms never stack; the cursor always moves first and the camera follows; keep a 64px safe margin; scores are illustrative.