Landing orbit

The second hero, and it exists to be compared rather than to replace anything. The promise moves off the centre line to the left, a round window holds the subscription platforms in the middle, the count sits in the bottom left corner and the example total in the bottom right.

Organism 1 grey page 1 coloured page the landing's hero since 2026-08-15 added 2026-08-14

What it is

It was a candidate for one day and it won. It stood at design/index-circle.html beside a centred hero at design/index.html, listed in design/_nav.js as a state of the welcome screen so the two could be looked at side by side. On 2026-08-15 the founder chose it: "давай теперь перенесем index-circle.html на основу index.html". It is design/index.html now, the extra registry row is gone, and the loser went with it - landing hero lost its three .lp-hero layout rules and kept only the two type roles this component still places. And the grey followed in the same step, which is what this paragraph promised would happen on the day one was picked: wireframes/index.html carries this structure now, with the founder's decision written on the section. That is why the meta above says 1 grey page and not 0.

Why a circle and not another rectangle. Every other object on this page is a rectangle: cards, rows, the list, the bands. A round window is the one shape that reads as a view into something rather than as another panel of content, and that is exactly what it is: a look at a stack bigger than the window showing it. The chips drift past its edge and dissolve there, so the fourteen are never all countable at once, which is the feeling being named. The count in the corner is what says how many there are, in words.

The copy leaves the centre, and that is the real difference. The first hero is centred and symmetrical, which is what an opening statement looks like. This one is asymmetric: the argument holds the left edge, the picture holds the middle, and the two numbers hold the bottom corners. It reads as a spread rather than as a poster. Neither is more correct; they are two answers to "what does a person see first".

The window has two hosts on the same page, which is why its own rules name none. The hero opens on it, and the landing story below carries fromcircle and opens on it again: there the window contracts into the list over roughly a screen and a half, instead of three tracks gathering into it. What the window looks like is written once, here; where it stands and how big it is belongs to whoever places it. fromcircle is a declared modifier in landing-story.css, not an override written from this file.

Anatomy

Behaviour on width

One point, 60rem, and it is a third point on the product, declared locally and deliberately not added to tokens.css. It was 72rem, and 64 before that: at 72 the spread was waiting for a 1152px window, so a 1000px one - which is what the founder was looking at - got the column fallback with the promise full width, the window under it and the two figures pushed off the first screen. Fixed tracks at 20 + 30 + 9rem are 944 and do not fit an 880 wrap, so all three give way now: minmax(15rem, 1.35fr), clamp(12rem, 30cqw, 30rem), minmax(8rem, 0.5fr), and the composition holds from 960 up. This hero won on 2026-08-15, so the point is no longer a candidate's sketch: either it is registered in tokens.css with 75 and 85, or the composition is changed to live on the two points that exist. That is a founder's decision and it is the one thing the move left open, carried as a row in docs/backlog.md. Below the point it is a column, and the promise comes first, before the window, because on a 390 x 844 screen a window big enough to recognise anything in pushes the two buttons to roughly 800px down the page.

Limits

The middle track is capped and fluid, not auto. Written auto the track takes the circle's max-content width, the side columns fall to their minimums, and past that the grid overflows the page. Written minmax(0, 34rem) the track gives way first and the circle, at min(100%, 52svh), fills whatever it is given.

The section's own 192px of padding is taken off, and that is not tidiness. Every .lp-section carries 96 top and bottom from landing-shell.css, which is the rhythm between blocks of argument. This section is not a block of argument, it is the first screenful, and its job is to stand inside one screen with the two corner figures still on it. With both paddings the composition was 909 tall at 1440 x 900 and the corners fell off the bottom.

The window is sized off its wrapper and the wrapper off the section, so no two rules measure cqw against different boxes: the wrapper is min(--container-column, 52cqw) and the window min(38rem, 66svh, 100%) of it. 608 at 1920, 594 at 1440, 520 at 1000, and the whole first screen - promise, window and both corner figures - is in view at 1000 x 800, 1152 x 900, 1280 x 720, 1440 x 900 and 1920 x 1080, within 2px.

The two figures start at the foot of the stage and rise to its head. The founder drew three frames on 2026-08-14: the promise with the window beside it and the count and the total in the BOTTOM corners; then the promise gone off the top and the two figures at the TOP corners; then the window gone and a deck of cards in its place. A grid area cannot be animated, so the placement is the one they end in and the travel is a transform: the stage is 100svh - 64 tall and the top row with its air is 126, so the distance to the foot is 100svh - 190px. The promise leaves upward rather than dissolving where it stands, because in the second frame its last line is half off the top of the screen: the page is moving under it, and a block that only loses opacity reads as a light going out. The beats are in order and that is a correction: the section's heading used to arrive at 8%, the middle of the count's climb up the left edge, so "14 subscriptions" was drawn through "Tendd is not a budgeting app" for a fifth of the scroll.

The window becomes a DECK, not a column. Each plate carries its own scale and its own opacity as variables, overlaps the one above it by --pbite, and paints behind it: the front plate is at full size and full opacity, the fourteenth at 0.44 and 0.12, which is far enough back to read as depth and near enough to read as the same object. Fourteen pairs of numbers written out rather than computed, because CSS has no counter to do the arithmetic with and a generated ramp nobody can read is worse than a table anybody can correct. Variables and not properties, and that is what makes it compose: the cancellation animates transform and opacity on the same node, so a keyframe writing scale(1) would snap the eleventh plate back to full size on its way out. sgo reads var(--pscale, 1) and var(--pfade, 1), and the fallbacks are what the plain column uses. Every plate arrives on its own clock, 0.9 points apart, and everything is in place at contain 52 - the beat where the deck is meant to be whole - two points clear of the first cancellation at 54.

The second half is one band at the top and a card at the front. The section's heading takes the top centre with the count on its left and the example total on its right; it leaves the promise's cell to get there, because the two never share a moment, and it is capped at the deck's own width so it stays off the count at 1000. The two corners come out of the grid, which is what raises the promise: as grid items they held a row about 126px tall, and on the first screen - where they are translated to the FOOT of the stage - that row was 126px of nothing above the promise. The front plate is a card, and so is every plate behind it: the same box, the same 40px mark and the same title-weight name and price, at fourteen scales. No date line. The founder's drawing has "Aug 3" under the name and there is no next-charge date for these fourteen in voice/docs/microcopy.md; a date invented for a demo is the mistake this stage's own log records against nine invented prices.

One card, fourteen times, at fourteen scales, and the deck ROLLS. The front plate used to carry its own box, mark and type, and the moment it was cancelled the deck had no front at all: the card vanished and the one behind it stayed a small row. The ramp is the only difference between plates now. The list is top anchored, which is what lets it roll - bottom anchored, a plate collapsing at the front moved the list's top edge down by exactly as much as it moved its contents up, so the deck did not move and Netflix left a 76px hole above a Disney+ that was still small. Top anchored the plates below come up on their own, which leaves the second one --pbite too high and still at 0.957, so the list comes down by --pbite and grows by --pstepk = 1 / 0.957. Two numbers, both the ramp's own, both inside the one keyframe set that already owns the list's transform. The front plate is the same card as every other one: it used to carry a taller box, a 56px mark and its own type, and that was the whole reason the deck lost its front the moment Netflix was cancelled.

The steps are not even, and the depth of field is what makes it a deck. A plate is 76 tall and its content 40, so an even step of 38 left the second, third and fourth plates showing the bottom half of their own mark and the bottom half of their own name. 66 at the front falling to 22 at the back: thirteen numbers adding to 510, a 586px deck in a window that is 560 at its shortest, with the last three plates at 0.05 opacity and below. Scale falls 4.3% a plate, opacity 9.8%, and blur is zero on the first two and 0.42px a plate after them - in focus the front card, and behind it the size of the problem rather than fourteen things to read. No recline: a rotateX on the whole deck was carrying the depth before the blur did, and the two together read as a photograph of a screen.

The eight strands are the brand's own letter, which is the only reason they are allowed. D-Brand: the identity is Crop, one letterform larger than any frame with a window cut out of it, and a d is a stem and a bowl. Eight of them at eight radii around the aperture is that letter, not a ring of neon. The colour is borrowed, not new: each strand is the fill of a mark already inside the window, read out of design/visuals/logos/<name>.svg, and the generator refuses to write if one has moved. Petrol still has exactly four jobs inside a screen since D-Plot on 2026-08-18, and a place of its own in the chrome. Rejected: a single petrol strand, which would have made the ribbon the product's own voice and given petrol a job it does not have.

Eight glowing objects at once is Vegas. So the strand is a hairline at 0.14 and what moves is a comet: a 42 unit head, a 62 unit middle at half and a 150 unit tail at a fifth, each lagging the one in front by exactly its own length. The lag is a fraction of the strand's own duration rather than a count of seconds, because the eight run at eight speeds - 13.3 to 19.3 seconds, none of them round, for the same reason the five marquee bands are 47, 39, 33, 43 and 36. At one speed and one spacing eight strands are a loading spinner. The phases are negative, so every strand is already mid-travel on the first frame instead of lighting up one at a time over the first two minutes of a page nobody waits on. pathLength="1000" is what lets one dash pattern and one keyframe set drive eight different circumferences.

The glow is two wide soft strokes and not a drop-shadow, and that is a measurement. Eight drop-shadows are eight filter passes over an 800 x 828 box every frame: measured at 1440 x 900 while scrolling, the page went from 8.3ms a frame to 16.7 with a p95 of 25, which is 40fps on the one screen in this product that has to feel expensive. Removing them put it back to 8.3 exactly, level with the other landing. The blur on the field costs nothing, because it is a static filter on a layer the marquee composites inside: measured both ways, on and off, before either was kept.

Nothing box-relative goes in --owidth, and it took two measurements to write that. A custom property is substituted at the point of USE, so every unit inside it that depends on a box resolves against the reader's box and not the writer's. Written min(..., 100%) the window read it against the swap and the svg against the pin: 440 against 502 at a 1000px window, twelve pixels of air between the glass and the first strand at 1440 and forty-three at 1000. Written min(..., 44cqw) it was worse, because .storyswap is itself a query container: the window resolved 44cqw against its own 620px parent and came out 273 instead of 564. The variable carries only what a root can answer, rem and svh, and each site writes its own cap in its own terms. Separately: an svg with a viewBox is a replaced element, so top: 0; bottom: 0; height: auto does not stretch it between the insets, it takes its intrinsic ratio, and 400 x 1200 at 800 wide is 2401 tall.

The field is a background now, and the stage no longer dissolves at the end. The chip was a 64px disc carrying a mark alone, sized for recognition at a glance; it is a pill with the item's own price beside a 40px mark, blurred by a hair and held at 0.62, so the sentence on its left never competes with a price on its right. The other landing keeps the disc: there the field stands under a headline that has to stay readable. And the stage no longer dissolves at the end - the founder, 2026-08-15: “в конце давай не делать исчезновение всего каскада, а просто продолжим скролл дальше”. That rule was written HERE, inside the 60rem gate, which is why only the desk ran it and why the founder had to ask for the same thing a second time on 2026-08-18 after meeting the fade on a phone. It is not in this file any more: the pin carries no animation in the shared component, which owns it, and the measurement that moved it is written there.

The clock is shaped, and linear was the strongest decision in the file. Every animation on this stage ran on animation-timing-function: linear, which on a scroll timeline is not a neutral default: it welds the object to the scrollbar, so nothing accelerates, nothing arrives and nothing settles. The stage was correct and read like a scrubbed video. Three curves now, each naming a job: --ease-arrive is expo-out and covers everything coming ON, --ease-leave is its mirror and covers everything going OFF, and --ease-settle is a spring written as linear() with a single 1.5% overshoot at 66, used in exactly one place - the deck closing over a cancelled plate, the one moment on this stage meant to feel like an object arriving at a stop. Any more overshoot and a calm product starts bouncing. The three are declared locally on the pin and deliberately not registered: stage 11 owns the motion scale, and a scale derived from one surface is a sample of one.

A lone fade is the one entrance that always reads as cheap. Four of the shared keyframes in the landing story are opacity and nothing else, which is right where they carry a card and a figure that never move. Here the same four moments are the ones the reader is watching hardest, so this hero has its own set and the shared ones are untouched: the heading arrives out of focus and lands (sheadin); a reason card glides in from the side it stands on, and the signs are the measured sides and not the property names, because right: var(--scardoff) is a card at x=50 (--scardc hands the keyframes the centring translate that an animation on transform would otherwise replace); the four totals and the four counts roll instead of crossfading, because two numbers at half opacity on top of each other in one cell is a smear and neither is readable; and the badge turns over with a small scale, because a change of word under a pure crossfade reads as a rendering glitch. The window leaves out of focus (ovanish) against a deck arriving sharp, so the two read as one exchange rather than a dissolve between two pictures.

On a wide desktop the two figures come down off the band, and both bounds of "down" are the founder's. "Пониже цифры бы поставил" took them from the top band to the deck's face at 336, and "выше чуть, чтобы не налазило" took them back up, settling after one more "еще трохи выше" at 192: at 336 the count's word sat 23px above the first reason card's title in the same column, one pile. At 192 they paint at 264..338, eighty-odd pixels under the heading band (foot 182) and far above the highest reason card (486 at 1440; 396 at 1280x720, where the card lies across the deck's foot and shares no column with them anyway). The travel from the foot shortens by the same distance the landing came down, so the foot never moves. Not below 75rem, and the point is a measurement: the example total is a 271px block right-aligned on a 40px gutter and the window is 44cqw, so at a 1000px window the total's left edge crossed the window's rim by 31px and at 1120 by 13; solved for a 16px clearance the crossing stops at about 1200. Below the point the figures keep the top band, where three rounds have verified them. A third local width value here, beside 60 and 85. All three are still local, and since this hero was chosen on 2026-08-15 that is a live question rather than a candidate's licence: see the width note above and the backlog row it points at.

The phone runs the same stage now, and the act it replaced is worth keeping on the record. Until 2026-08-18 the phone had a second, smaller piece of choreography of its own: no pin and no shared clock, every block introducing itself on its own view() timeline as it came up the screen. It was the honest answer to the layout that existed, because the landing story released the whole stage under 60rem and left a column with no motion in it. Founder, on a screenshot: "мы не можем сделать такую же идею, как и на десктопе?" - and the answer was yes, because the narrow arrangement of the STAGE had been written all along and had simply never run. Two acts for one section, each undoing the other's placement, is how the swap ended up stacked by one and unstacked by the other in the same breath, so the smaller act was deleted rather than re-tuned. mrise and mpose went with it.

The release was half applied, and the half that never applied is the lesson. Its first line was min-height: 0 on .lp-story, written inside @container story (...) - and .lp-story is the element that DECLARES the container named story. A container query is answered by an ancestor, so a rule on the container itself, asked of its own container, matches nothing and is dropped in silence. Every other line in the block addressed a descendant and landed. Measured at 390 x 844: the pin released to position: static at 1529px of content while the section kept the 320svh - 2701px - it had reserved for a stage that was no longer running. 1172px of nothing, one full blank screen, at every phone width, for as long as the release existed.

The head's choreography is not the spread, and it was gated with it for one round too long. The point below exists for absolute placement measured in cqw, which is meaningless on a phone. The promise trading places with the heading is not that: it is one cell holding two blocks and two animations deciding which is on screen. Swept behind the point with the spread, it cost nothing while the phone had no stage - and the moment the phone got one, the promise and the heading simply stacked, 547px of head on a 780px stage, which is the arithmetic that made "the figures are pushed off the bottom" true and made the release look necessary. Six rules moved out of the gate; the spread's own placement and the two figures' climb to the top band stayed inside it.

On a phone the promise fills the pin instead of taking a row in it. At the desk it is a column with the window beside it; a phone has one column, so "beside" does not exist and a promise laid out in the head row leaves the list 97px. Over the stage instead, on the page's own ground, it is the same first beat - same sup, same range, same 18% - and what it uncovers when it lifts is a stage already fully laid out. Two details cost a measurement each: height: 100% and not bottom: 0, because the promise still carries grid-area: one and a grid area keeps the box sizing to its own content (400px with the insets, 780 with the percentage); and padding-inline of its own, because an absolute box is laid out against its containing block's PADDING box, so the pin's 40px gutter is inside the area it fills rather than around it.

The settling is a CONDUCTOR now, and CSS snap was tried both ways before it went. proximity could not give the founder's "one small scroll, and the whole movement plays" - it settles a scroll that stopped near a beat and abandons one that stopped anywhere else, in the middle of a movement. mandatory with scroll-snap-stop: always gave exactly that, and juddered doing it, which is the founder's next note verbatim: the page lagged frame by frame under the wheel. The mechanism is structural, not a tuning problem: on a document scroller every wheel tick starts the browser's own snap animation, the NEXT tick interrupts it, and the page moves in the staircase of those collisions - snapping and scrolling are two hands on one scrollbar. So design/story.js, loaded by this page alone, took the job: the reader's scroll is native and untouched, which is the whole cure, and only once it has been still for 130ms does the conductor glide the page to the next beat in the direction the reader was going, on a smoothstep whose duration scales with the distance. Any input cancels it instantly; standing on a beat is standing still (the first cut lacked that check and was an autonomous crawler, walking the reader through the whole stage one settle at a time - found by the beat probe, whose reads came back scrambled by a page conducting itself); it does nothing under reduced motion, below the 60rem point, or outside this one section. The anchors stay in the CSS, derived from the ranges - the stage is 320svh, its pinned part 220svh, the beat at contain N% is 2.2 x N svh - so the choreography keeps one owner and the script reads it from the DOM. The gaps stay near-even on purpose - 57, 35, 36, 30, 31, 31 - and the first is the long one deliberately: act one is the biggest movement on the stage and softness is scroll room. The promise leaves over 0..18, the two figures travel 0..26 on their own gentle in-out curve (--ease-travel: every other entrance is expo-out, which on a 600px journey is a rocket that then creeps), the heading lands with them at 12..26, the window gives way at 26..40 and the deck arrives at 30..45, so act one is finished before act two begins. The conductor's travel time scales with distance, which is what keeps one gesture from being a hop and the next a voyage. It moved with the page when the page moved and did not change a line.

The window leans toward the hand, and the script owns none of the style of it. story.js damps the pointer's offset from the viewport centre into two custom properties on the stage, --parx and --pary, and landing-orbit.css decides what they mean: the swap leans up to 9px by 6px, the strands take the same two numbers at 1.35, one ring nearer the reader than the glass they surround - the same depth statement the ramp makes behind the deck. The lerp runs at 0.085, so the picture lags the hand a little, which is what makes it read as weight rather than as a cursor effect. Zero when there is no pointer, when the pointer is coarse, when motion is reduced, or when the script is absent: the fallback of both variables is the whole no-lean picture.

The deck is dealt from three times, and the deck's order is not the fixture table's. The three the product cancels stand 1st, 11th and 13th in the table, so on a deck the second and the third were plates at 0.13 and 0.05 opacity ten cards deep: the count fell from 13 to 12 to 11 and nothing on the stage moved. On this deck they come first, in the order they are cancelled in, and every other item keeps the table's order behind them. Nothing about the data moves - the same fourteen, the same prices, the same three cancellations, the same fall to $144.92 - only the order they are dealt in, and only here: the marquee above keeps the table's order, and so does the other landing, whose list is the grey wireframe's twin and may differ from it by styling only.

The front four plates are flat and they do not touch, and both halves were corrections. Flat first: every plate used to carry its own scale, so the moment the front one was cancelled the second took its place 4.3% smaller, and the correction was a scale on the whole list. One cancellation could afford that; three compound to 1.148 and the front card would have grown by a seventh of itself. Then the air: at full size, four cards of identical weight overlapping by ten pixels do not read as depth at all - they read as four rows whose shadows are stacked on each other. They are a list at the front and a deck behind it now: 12px of air between the four, and the recession starts at the fifth plate, which is also the first one that is scaled and faded.

Three corrections, one per cancellation, and they go up. While the front four overlapped, the flow closed the gap by itself after the first cancellation and one 8px correction held the front card at y 302 through all three. With air between them it is the other way round: a collapsed plate leaves its two 1px borders and its 12px gap behind, so every cancellation pushes the next front card 14px further down and the error accumulates. Measured at 1440 x 900, uncorrected the front card stood at 302, 324, 338 and 352. Fourteen, twenty-eight, forty-two, upward, and it stands at 302 at all four. Both the number and its sign are measurements: the first cut of this reasoned its way to 8, 16 and 24 downward, which was wrong in size and in direction.

A cancelled card leaves the deck, it does not deflate in it. The shared sgo is a ROW leaving a list: it recedes, holds, and folds upward by three quarters of a rem while its height collapses. That is right on the other landing, where the thing leaving is a 32px line in a column and the eye is on the column. Here the thing leaving is the card the reader is looking at, at the front of a deck, and it has to go somewhere: it goes quiet and its badge turns over, holds for a fifth of the beat so the word "Cancelled" is readable on a card that is still there, then lifts five rem, drops four per cent of its size, goes out of focus and is gone while its height collapses under it. Fast, still, fast is what makes a movement look expensive. Two rules had to go for it: the cut plate no longer carries box-shadow: none (three of the four cards at the front of this deck are cancelled in turn, so three times out of four the front card was the one card with no shadow) and no longer clips itself (anything the exit translated slid out of its own box instead of off the stage).

The comets go one way round now. Each strand comes down its stem and meets the loop at its rightmost point, and the arc was written counter-clockwise: the light arrived travelling down, turned round, went back the way it came and turned again to leave. Clockwise the tangent at the entry and the tangent at the exit are both straight down, so it is one continuous travel from above the screen, round the window and away below it. Two characters in the path, and the difference between a light going somewhere and a light bouncing off something.

The geometry was wrong on a small window and right on a big one, which is how it survived three rounds. Measured at 1000, 1280, 1440 and 1680: the headline started at -20 at 1000 (it is wider than its column on purpose, and margin-inline: auto splits the overflow between both sides, so the stack needs min-width: 0 and justify-items: start); the section heading at y 215..293 and the deck's front plate at y 236 were in the same 250px; a reason card sat at x=0 with no gutter at 1280, because a fixed 334px off the centre plus two 336px cards is 1316 against a 1280 page. The card offset is the deck's half-width plus air now, clamped by min() to the page's gutter, and the side point is 85rem. The deck is 44cqw rather than 52 so it stands clear of the two figures in the top corners. Rejected: a slot of its own for the reason card - it left the deck 384px of a 560 window, and a 52px plate biting 32 into the one above shows twenty pixels of itself, which is four plates reading as one smear. The card lies across the foot instead, over plates at 0.2 opacity and below.

Three things this round found that no overflow check could see. The depth ramp stood at the top level of the file: scale, opacity and blur are only read behind the point, but margin-top is a plain property and applied on a phone too, so a plain mobile column had fourteen rows biting between 10 and 54px into each other. In reduced motion the deck cannot roll, so its plates stood where the ramp put them - four legible and ten between 0.21 and 0.05 opacity - and the reader who asked for no motion is exactly the reader who has to read that list; the release flattens the ramp now. And released from the pinned layout, the window and the three cards became grid items again, both still asking for an area called swap that the pin's "say . ." template does not define: an item asking for an area that is not there goes into an implicit column, the pin came out with five columns inside 920 of content width, and that was 136px of sideways scroll at 1000 x 800.

And a day later the rest of the story came out of the gate too. Founder, on the phone running the stage for the first time: “анимации на мобилке очень далеки от оригинала”. They were. This file holds two kinds of rule inside the 60rem gate and they had never been separated: the SPREAD, which is geometry in cqw and a deck of fourteen overlapping plates, and the STORY, which is what the objects do. The phone was running the shared keyframes from the landing story - a row folding away, a badge crossfading, a total crossfading, a card appearing - where the desk ran this file's own, and the shared four are exactly the ones this page calls the entrance that always reads as cheap. Seven rules moved out: the window leaving out of focus, the promise's exit curve, the heading's arrival, the cancellation that holds so “Cancelled” can be read, the badge's turn, the rolling figures and the gliding reason cards. Not one of them needs a width. What stayed behind the point is the deck - sfall's three promotions, pdrop's fourteen-plate cascade and the depth ramp they read - because those are statements about a picture that only exists there. The ranges were not touched: the landing story has carried a narrow set and a wide one all along.

And moving one of them found a rule that had been decided by source order rather than by anybody. The window's own rule inside the gate said animation-name: ofold and was overruled twenty lines later by ovanish at the same specificity, so what the desk actually ran was ovanish over the gate's range. The moment ovanish moved above the gate to reach the phone, the order flipped and the desk quietly went back to ofold - caught by the fingerprint, which reported the window at 1024 reading ofold where it had read ovanish and the marquee under it moved 4px. Two rules setting one property at one specificity are settled by which is written last, which is not a decision anybody takes. The name has one owner now and the gated rule states the one thing that is genuinely different at the desk: when.

The SPREAD is behind the point, and that is structural. It was written unguarded inside @supports, so at 390 it applied too: the wrap resolved to 52cqw of a phone, 203px, and the plates inside it were 310 wide and hung off the side of the page. What is behind the point is the placement - the window and the deck on the centre line, the heading's top band, the two figures in the corners. What is not behind it, since 2026-08-18, is the story those objects tell: the phone runs the same clock, in the landing story's narrow arrangement of the same five things.

The hand-off is behind @supports (animation-timeline: view()). Unguarded, the declaration stays valid, falls back to the document timeline, and the window shrinks away once on load at the top of the page where nobody is looking. The range is exit and never cover: it is the part of the scroll where the hero is leaving the top of the screen, which is exactly when the section under it is arriving at the bottom.

Where it comes from

Drawn by design/system/components/landing-orbit.css through ../system/index.css, the same entry point a product screen loads. It stands on the landing and nowhere else, in colour and in grey. Ground: docs/decisions.md, D-Hero. Registered in docs/inventory.md and in _nav.js, in the organism group.