Timeline archive

The signature is that one section holds two densities. Above, the eyebrow, the heading and the lede are given a spacing-70 run of air and the lede is held to a 40rem measure, so the opening breathes like the top of an essay. Below, the sheet is packed: the gap between frames is clamp(0.5rem, 1.2vw, 0.75rem), the same value between the two rows as between the cells, captions are small, and eight dated frames sit hard against each other on one screen. The switch from one density to the other, in the same band and on the same ground, is what makes the archive read as an archive rather than as a gallery with dates on it.

Nothing here is at display size except the section heading, and that is the point. Every caption, the year and the title alike, sits at a clamp() floored at 0.9375rem. A contact sheet is not a place where any one frame is louder than the others; the moment a year is set at 3rem the sheet becomes a timeline with a favourite. The heading carries the whole of the section's scale so the sheet can stay flat.

How a cell is built

Each cell is a core/group holding an empty core/image at aspectRatio 1/1 with scale: cover, then a second group carrying a 1px currentColor border-top and the two caption lines. The rule belongs to the caption, not to the image, so it sits under the frame like the line on a filing card and follows your text colour wherever your theme puts it. It cannot resolve to nothing, which a preset colour rung could.

The year is uppercase at 0.18em tracking; the title is the same size with no tracking and a tighter line height. That is the only contrast inside a cell, and it is enough to tell a date from a description without a second colour, a second family or a bold weight fighting the heading.

What happens at 390, stated honestly

The four columns stack. Core sets flex-basis: 100% on a column below 782px and this pattern does not override it, because four across at 390 leaves about 88px a cell and a three-word title ladders into a ribbon at that width. So on a phone the sheet becomes a single column of eight dated frames, read top to bottom. It is a different reading than the sheet gives on a laptop, and it is still an archive: the rule, the year and the title arrive in the same order under every photograph. isStackedOnMobile: false was deliberately not set; the measured cost of forcing four across on a phone is worse than the loss of the grid.