TITLE
Totality

PROMPT
A scroll-driven total solar eclipse. The viewport is a fixed sky; scrolling moves time from first contact to fourth contact, and at the centre of the scroll the Moon covers the Sun completely. Everything a real eclipse does to the world happens in order: the light thins, the temperature drops, shadows sharpen, the horizon glows like sunset all the way round, stars come out, the corona blooms. Concept: the most dramatic two minutes in nature, operated by the viewer's own hand.

Palette (the page travels through it): day sky blue #9CC9EA with pale sun-warm #F7E7B4; mid-eclipse the sky turns steel then deep twilight indigo; totality sky #0A0A12 with corona white #FFFFFF and a horizon band of sunset orange #FF9E5E; prominences in a hot pink-red (#FF4F6D). The page is light at both ends and dark only in the middle.

Composition: a full-viewport Canvas (fixed) with the Sun at upper centre (large: diameter about 22% of the shorter viewport side); below, a landscape silhouette: a ridge of low hills, a single tree, a small crowd of spectators with tripods and upturned faces, a field. Text annotations are DOM elements that appear at the side at their moments, each tied to a scroll range. A thin vertical timeline at the right edge with tick marks labelled C1, C2, MAX, C3, C4 and clock times of an invented eclipse ("14:03:22" …) shows progress; a temperature readout and a light-level readout (in percent and as a little drawn light meter) change with the scroll.

Sequence (scroll progress 0→1, all continuous, eased, reversible): 0.00–0.35 partial phase: the Moon's disc slides across the Sun from the right (in daylight it shows only as the bite it takes out of the Sun, turning into a black disc as the sky darkens); sky brightness falls slowly then quickly; the landscape colours desaturate toward silver; under the tree, the dappled light becomes hundreds of tiny crescent suns on the ground (an inset "look down" vignette); spectators raise eclipse glasses. 0.35–0.45: last minute: shadow bands ripple across the field as faint moving stripes; a dark wall (the umbra) rises from the western horizon (the viewer faces south, so west is on the right, the side the Moon arrives from); Baily's beads sparkle along the Moon's limb (bright points through lunar valleys, computed from a fixed jagged limb profile), collapsing to the diamond ring: one dazzling point with a thin ring of inner corona: a signature frame with lens-like bloom and diffraction spikes. 0.45–0.55 totality: the corona unfurls: long asymmetrical streamers and fine radial plumes drawn procedurally (noise-modulated rays, brighter and shorter at the poles, long equatorial streamers), slowly shimmering; pink prominences at the limb; the sky is deep indigo with Venus, a few bright stars and planets fading in; the horizon glows orange for 360°; the crowd is silhouetted, a dog howls (in text), birds fly to roost across the sky; the temperature readout has dropped 6 °C; a large quiet caption in the sky: "Two minutes, eleven seconds." 0.55–0.65: second diamond ring on the opposite limb, beads, light floods back from the west. 0.65–1.0: the partial phases in reverse, colour returns, people begin to pack up; final note.

Signature moment: the transition into totality and the corona itself: a believable, delicate, shimmering corona with the diamond ring flash just before it.

Typography: sparse, large-scale contrasts: annotation text in a refined serif (Georgia/Palatino) at modest size with small-caps time stamps; one monumental word, "TOTALITY", in very wide-tracked thin capitals (a light sans stack: "Helvetica Neue" Light/"Gill Sans" Light/system-ui 200) that fades in across the sky only during totality and whose letterspacing breathes outward; the opening screen says "Scroll slowly. This happened in four minutes." with a designed scroll cue (a tiny sun being eaten). Copy is in second person, concrete and sensory: "The light goes strange before it goes dark: thin, as if the day were running low on battery."

Interaction: scroll (wheel, touch, keyboard); a small "play in real time" control auto-scrolls the whole event smoothly over about 90 seconds; hovering the Sun (or tapping it on touch screens) shows the percentage covered; the timeline ticks C1, C2, MAX, C3, C4 are buttons that glide to that contact, and the final note offers "Watch it again". Text colour switches for contrast as the sky darkens. Reduced motion: the canvas updates in discrete stages rather than continuously shimmering; no shadow bands. Performance: one canvas, procedural corona pre-rendered to an offscreen buffer and modulated.

DESCRIPTION
A fixed sky above a stubble field outside the invented village of Ellery, where a small crowd, two tripods, a dog and a single ash tree wait for a total eclipse. Scrolling is time: the Moon bites into a pale warm Sun, the blue sky thins to steel and then to twilight indigo, the field drains to silver, shadows harden, and an inset shows the ground under the tree covered in crescent suns. In the last minute shadow bands ripple over the field, the umbra rises from the west, the crescent breaks into Baily's beads along a jagged lunar limb and collapses into a diamond ring with bloom and diffraction spikes. Then the page goes dark: a delicate, asymmetric, shimmering corona unfurls around a black Moon, pink prominences cling to the limb, Venus and stars appear, the horizon glows orange all the way round, rooks fly to roost, the dog howls, and the word TOTALITY breathes across the sky above the quiet line "Two minutes, eleven seconds." Scrolling on plays it all in reverse on the opposite limb until daylight, colour and an ordinary afternoon return and people pack up. A clock, a contact timeline, a thermometer that falls six degrees and a needle light meter keep the facts while sparse second-person annotations keep the feeling.

VISUAL TECHNIQUES
- One fixed full-viewport 2D canvas (DPR capped at 2) redrawn from a single eased scroll-progress value; everything is reversible
- Real eclipse geometry: circle-intersection area drives the light level, sky keyframes, land colour, shadow sharpness and readouts
- Sky built from four interpolated six-stop gradients (day blue, steel, indigo, totality with a sunset-orange horizon band)
- Procedural corona: polar texture of noise-modulated rays, tapering equatorial streamers and fanning polar plumes, tone-mapped and pre-rendered to two offscreen buffers that are cross-faded, slightly counter-rotated and radially masked to unfurl
- Fixed jagged lunar limb profile (720 samples) used both to draw the Moon and to compute which valleys still pass sunlight, producing Baily's beads and the final diamond
- Diamond ring with additive bloom sprite, eight tapered diffraction spikes, soft halo ring and lens ghosts along the optical axis
- Pink prominences and chromosphere arc drawn on the Sun's limb and uncovered asymmetrically by the Moon's motion
- Landscape of layered hills, village with spire, furrowed field, ash tree and a crowd of silhouettes whose colours desaturate toward silver and fall to black against the horizon glow
- Radial-gradient shadows whose penumbra narrows as the Sun becomes a sliver; wavy moving shadow bands clipped to the field; umbra as a growing dark radial wall from the west
- "Look down" inset: 280 pinhole images stamped from a live crescent sprite matching the current phase, inverted as a pinhole would
- Twinkling stars, labelled planets, a flock of flapping birds crossing the orange band, a howling dog with drifting letters
- DOM typography over the canvas: Georgia annotations with small-caps time stamps, thin wide-tracked sans for TOTALITY with per-letter breathing spacing, ink colour that switches with sky and field luminance
- SVG needle light meter, thermometer readout, vertical contact timeline with live clock; film grain overlay
- Reduced-motion mode: scroll progress quantised into discrete stages, no shimmer, flicker, grain jitter or shadow bands

INTERACTION MODEL
Scroll with wheel, touch or keyboard to move time from first contact to fourth contact; the scene follows with a short eased lag and runs backwards if you scroll back. Annotations fade in and out at the left (at the bottom on phones) at their moments. The "Play in real time" button auto-scrolls the whole event in about ninety seconds and becomes Pause; any wheel, touch or navigation key hands control back to the viewer. The timeline ticks C1, C2, MAX, C3 and C4 are buttons that glide to each contact, and "Watch it again" at the end returns to the start. Hovering the Sun with a mouse, or tapping it on a touch screen, draws a dotted ring and shows how much of it is covered. The temperature, light percentage, light-meter needle and clock update continuously with the scroll.