Reference
Design system
Every ratio was computed with tools/a11y/contrast.py, not eyeballed. This page is
noindex: it documents the template for whoever builds with it.
The band inverts
Days 91–100 were light pages with a dark band. This one is a dark page with a light
band, which means every --on-band token had to be recomputed from scratch
rather than inherited — the accent in particular, which goes from
#7FB2E8 on the page to #1F5E9E on the band. Reusing the page
accent there would have rendered 2.15:1. That is the whole reason the two are separate
tokens instead of one with an opacity.
No gallery, on a photography-adjacent site
Four frames, and each one sits inside the setup it came from — 14A, 14E, 14F, 14J. The argument the page is making is that a frame cannot tell you whether a scene was shot well, so putting the four of them in a grid would have contradicted the copy on the way past. In the shot list they are evidence for a specific claim about a specific setup.
The diagram is decorative on purpose
Four nested rectangles at real aspect ratios, sharing a projected width. It is
aria-hidden and carries no text, because every ratio and every consequence of
choosing it is in the list beside it. A diagram that needs a description is a list that
has been drawn badly.
Everything quoted is summed
“60 takes”, “4m 34s on screen” and the seconds-per-hour figure are all computed from the shot list at build time. Hard-coding them is how a template ships a headline that stops matching its own table three edits later — which is exactly what happened on day 88 and had to be caught by arithmetic rather than by reading.
Type
League Gothic — display
Share Tech Mono — 25mm · T2.8 · 14A
Lens data, take counts and durations run in columns that have to align, so the mono face is load-bearing rather than styling. Neither face appears in days 1–100.
Tokens
| Swatch | Token | Value | Measured |
|---|---|---|---|
--color-bg | #0A0D13 | Blue-black ground, hue 220 | |
--color-bg-alt | #12161F | Banding | |
--color-surface | #1A1F2A | Cards, the diagram plate | |
--color-text | #E9EDF4 | 16.56 / 15.41 / 14.05:1 · AAA | |
--color-text-muted | #9BA5B5 | 7.82 / 7.28 / 6.63:1 · AA | |
--color-border | #67707F | 3.89 / 3.62 / 3.30 — non-text, carries the shot-list rules | |
--color-accent | #7FB2E8 | Cold steel blue — 8.74:1 on ground · AAA | |
--color-band | #E9EDF4 | The band inverts: light on a dark site | |
--color-on-band | #0A0D13 | 16.56:1 on band · AAA | |
--color-on-band-muted | #4A5160 | 6.78:1 on band · AA | |
--color-accent-on-band | #1F5E9E | 5.67:1 on band · AA — the same blue darkened |
The border token clears 3:1 against all three grounds, which is what WCAG 1.4.11 asks of a non-text boundary. It is never used for text.