Make slides and websites with any AI.

# Build an HTML presentation in the "Focus Stack" format

You are a senior front-end designer and engineer. Produce one self-contained HTML file (inline CSS and JavaScript, no frameworks, no build step) that presents the content below as a keyboard-driven slide deck. The format specification is the point of this task: match its layout, motion and navigation exactly instead of improvising your own.

## Deck
- Topic: Q3 review for the leadership team
- Audience: Leadership team
- Slides: 7 (one cover, 5 content slides, one closing slide)
- Language of all copy: English
- Tone: Direct and confident

## Format: Focus Stack
A vertical wheel of titles; the active one snaps into focus, the rest fall into blur.

Layout
- Full-bleed dark stage (#0a0a0a), no chrome, nothing centered. Two zones: a title stack pinned to the left (7vw from the edge, vertically centered on the viewport) and a content zone on the right half (from 50vw to 94vw, vertically centered).
- Every slide title lives permanently in the stack as one line of bold display type: 4.4vw, weight 700, letter-spacing -0.025em, line-height 1. A short horizontal dash (3.4vw wide, 3px tall, 2px radius) sits 1.6vw to the left of each title; the dash is the pivot.
- The active title is crisp and full contrast (#ffffff) at scale 1 and its dash is the accent (#f05a1e). Every other title is styled purely by its signed distance d from the active one (…, -2, -1, +1, +2, …), with a = |d|:
    transform: translateY(d × 15vh) rotate(d × 6deg) scale(1 - min(a,3) × 0.16), transform-origin left center;
    filter: blur(min(a,4) × 2.2px); opacity: 1 - a × 0.34; color: dim gray (#5d5d5d), dash the same gray.
  Read together the titles form a vertical wheel seen from the side: the title above tilts up to the right, the title below tilts down to the right, and everything else falls off into depth-of-field blur until it disappears.
- Moving one slide rotates the whole wheel one notch: every title animates transform, blur and opacity over 700ms with cubic-bezier(.22,1,.36,1). Nothing else on the page moves during that.
- The active slide's body content then fades and rises into the right zone (opacity 0→1, translateY 30px→0, 600ms, delayed 300ms so the wheel settles first). Content is a column with 1.6rem gaps, starting with a muted lede line. The cover slide leaves the right zone almost empty (one lede line at most); that near-empty frame with the wheel alone is the signature image of this format.
- HUD: slide counter "02 / 07" bottom-right in muted 0.9rem tabular figures; a one-line hint ("Scroll or press ↓ to move") bottom-left that disappears after the first slide.

Navigation: ↓ → Space PageDown = next; ↑ ← PageUp = prev; mouse wheel / trackpad moves one slide per gesture (debounced 750ms); clicking any title in the stack jumps to it; Home/End; number keys 1-9 jump.