What this site is made of, and which of its decisions are load-bearing.
What this site is made of. The first five sections are the five axes the stylesheet itself is organised on — type, colour, measure, motion, machinery — so this page and the file it describes cannot fall out of step. The sixth is the panda’s repertoire.
Every number here is measured rather than estimated. Where a decision has a reason, the reason is the part in italics.
Type
Nunito
Weights 400–700. One family, no pairing.
0 1 2 3 4 5 6 7 8 9
Family
Nunito alone, committed 2026-08-03. Chosen for the character its rounded terminals give the display sizes; the consequence is that every scale decision has to make that character an asset rather than reach for a second face.
Numerals
ui-monospace, at 13.8px. Mono is the numbering system and nothing else — section numerals in the article gutter, counts in the hero ledger. The moment it touches words it stops reading as instrumentation and starts reading as a second font.
Prose
One size, flat, hierarchy carried by weight. Under it sits an apparatus tier at 14px and --gray-1000 for captions, dates and filing lines — the rule being that nothing which carries argument may use it.
Colour
Ramp
Twelve steps of warm gray on a stone paper (#eeece6), zero chroma — the Radix Sand ramp re-derived one notch off white. Warm gray rather than neutral, which is what lets a vermillion accent sit on it without the page splitting into two temperatures; stone rather than white, because a near-white page had stopped reading as a choice.
Accent
#bd6593 at 3.26:1 for marks and rules, #b43c7a at 4.60:1 for text. One colour cannot do both jobs: the lighter step clears the 3:1 bar for non-text and fails the 4.5:1 bar for small type, so the darker step exists only to carry words.
Spending rule
Interaction only — link hover, figure hover, focus ring, the active rail mark. At rest the page is monochrome, so colour reads as a response rather than as decoration.
Tertiary text
#6f6f69 at 4.97:1. It was #82827c at 3.80:1, which failed AA while carrying every caption, date and timestamp on the site. One Radix step darker, same hue and chroma.
Measure
Column
~646px of prose, declared in rem. So the column widens on a large display while the line stays near 75 characters — the width, not the character count, is what scales.
Root
16px below ~880px, 17px at 1440px, 19px at 2560px. Every rhythm number in the stylesheet was calibrated at 17px/1440, where the fluid site is pixel-identical to the fixed one it replaced.
Rail budget
Section headings fit one line in the TOC rail: ~25 characters, floor 20. Measured against the live rail — a 184px label box, Nunito running 7.4–8.0px per character. The rail sets text-overflow: ellipsis as a tripwire, so an ellipsis appearing there is a bug report about the heading, not about the rail.
Audit
Zero automated violations, zero horizontal overflow, 2026-08-05.
Motion
Navigation
Cross-document view transitions, two lines and no JavaScript. The masthead name is the shared element, so it holds still while the page changes under it.
Hero
A staggered entrance: three headline beats, then the role, links, the Now paragraph, status and ledger. It runs once per session — a repeat visit within the same session renders the resting page directly, because an entrance that plays on every navigation stops being an entrance.
Rail
The TOC collapses to hairlines on scroll-down and restores its words on scroll-up, hover or focus.
Everything
Transform and opacity only, and all of it cancelled under prefers-reduced-motion. Including the transitions the browser generates itself, which the media query does not cover on its own.
Machinery
Maths
KaTeX 0.18.1, vendored and pinned. The default emits katex@latest from a CDN, which is two problems in one script tag: a floating version that can retypeset every equation here without a commit, and a third party in the critical path of a page whose maths renders client-side.
Résumé
One TOML file compiles to both the web page and the PDF. The page body regenerates on every render, so the two surfaces cannot drift; the PDF’s only difference is the private fields the page is not given.
Figures
compute.py runs the model once and caches every number; plot.py draws from the cache and needs only numpy and matplotlib. A post’s entire visual language can be reworked in seconds instead of a two-thousand-forward-pass rerun, and the figures stay reproducible by someone without the model.
Build
Four post-render passes: image dimensions read from the files themselves, accessibility repairs to the generated chrome, a listings manifest, and the icon-set removal. The last one re-proves on every render that the icon set is still unused and fails the build rather than serving a page a missing glyph — 273 KB that this site had been shipping for an icon it never had.
Published
Quarto to GitHub Pages, built by Actions. Every branch renders and reports whether the site still builds; merging to main is the act of publishing, and built HTML never enters the history.
Panda
Every move the hat panda and the troupe have been given, whether or not it is on the page today. The list is generated from tools/home/animations.toml, so a move built and later taken off is still on the record here. The sprite sheet is ma5a’s panda collision (MIT); the straw hat is drawn here.
Cels
What the sprite sheet can draw: every pose and cycle, and the hat.
Walk
Columns 0, 1, 2, 1 — contact, dip, contact, dip — one cel every 140 ms, in any of the five facing rows.
on the home page
Stop
Column 0 held: the contact stride, feet apart.
built, not on the page
Idle
Column 1 held: legs together, the settled mid-stride dip. Chosen over column 0 because a planted panda should not look caught mid-step.
Stop on the left, then idle on the right: the same panda, feet apart against feet together.
on the home page
Fall
Columns 3, 4, 5, 6, 5, 7: the tumble, ending face-down. The hat is not drawn on these cels — it is on the ground by then.
built, not on the page
Fallen
Column 7 held, lying down.
built, not on the page
Stand up
Columns 7 to 12: from the ground back to standing.
built, not on the page
Sit down
The stand-up cycle run backwards from standing: columns 12, 11, 10, 9 of the down-facing row, one a beat, and the last held — a stand-up frame that reads, alone, as sitting. The home page plays it for the rest at the end of the road, hat set down beside at the first beat. Until 2026-09-22 it cut straight to column 9.
Standing, then the three cels down into the sit.
on the home page
Leap
Column 0 of the diagonal rows held while airborne: the contact stride reads as a jump. The tumble frames would be livelier but are drawn hatless.
on the home page
Seated rider
Five hand-drawn seated cels, one per facing, for a panda riding on another's head. The one piece of new art the chaos spec allowed, drawn in the body editor. Replaced the zero-art standing rider, which looked wrong.
Riding on the base panda's head.
built, not on the page
The straw hat
A hand-tweaked pixel dǒulì, exported from the studio and baked per facing with a seat offset per walk frame, so it rides the head bob as one piece. A separate loose-hat cel lies on the ground.
on the home page
Primitives
Motions the code composes from cels.
Glide
Every stride is one 50 px step, and the wrapper glides to it over 2 s (a CSS transition in the original; a ported per-tick ease in the engine, restart semantics and all). The float is ma5a's signature.
Three strides of 50 px, each a 2 s ease-out.
built, not on the page
Scroll walk
The home page's replacement for the glide: the panda's place on the spine is a linear read of scroll position, and the legs run on the 140 ms cel clock only while scrolling continues. Facing follows scroll direction.
on the home page
Jump
A timed 620 ms arc between two live endpoints (the hero stage and the head of the road), scaled 6x to 2x in flight, with a sine lift of 22% of the distance. Runs on a clock so it always lands; reverses in the air if the reader turns back. Replaced a scroll-scrubbed shrink-and-walk that could park the panda halfway, standing on the intro paragraph.
on the home page
Knock
Four hit-corners per panda checked pairwise every 50 ms; the corner pattern picks a knock direction, the loser slides 80 px, plays the fall, lies a while, stands up. Asymmetric: an unstoppable-force flag lets one side knock without being knocked.
An 80 px slide, then the fall plays through.
built, not on the page
Tap to knock
Clicking a panda knocks it down. built, not on the page
Throw arc
A parabola from one point to another over a set time, the sprite frozen on a cel, landing back into the walk. Used for the stack's mount hop, the topple tosses, the hiccup's pop, and the entrance drop.
built, not on the page
Spin
A facing-cycle: the sprite steps through its eight headings one flip per tick for about 1.2 s, which reads as a turn on the spot. Also the tumbler's skid.
built, not on the page
Breathe
A 2.6 s bob of half a pixel (three pixels on the old hero) on a planted panda, so standing reads as alive rather than stopped.
on the home page
Double blink
Eight face-white pixels laid over the eyes of the standing panda for one 140 ms beat, leaving a one-pixel lid line: two blinks close together, a long rest, one blink, on a 6.9 s loop. Only the eyes change; head, hat and hands hold. Chosen in the idle studio over breathing, head bobs and glances: at 48 px a belly can only grow by whole pixels and never came out fluid, and ma5a's own idles are one-pixel changes. Runs alongside Breathe whenever the panda stands facing the reader.
The loop in full: a double blink, a rest of three and a half seconds, a single.
on the home page
Sharp glide
The hat panda alone glided in 0.5 s with a sharp ease-out and a 440 ms stride, to read as alert against the troupe's uniform 2 s float. Reverted the same day (6a8295a): too fast, darted around. Worth knowing before touching the walker's speed again.
Above, the troupe's 2 s float. Below, the reverted 0.5 s snap at a 440 ms stride.
reverted
The hat panda
The observer’s own behaviours.
Observe
The hat panda holds one incident at a time, walks to a vantage beside it, plants, and watches: a gaze that shifts every 2–4 s between the subject, the nearest bystander and a glance aside.
A sleeper goes down; the hat panda walks to a vantage and its gaze shifts every couple of seconds.
built, not on the page
Weave
Navigates around the troupe on the way to a subject, choosing an axis by crowd; if boxed in it holds, re-vantages, or abandons.
built, not on the page
Alert stride
Within 130 px of a closing panda the calm 540 ms stride drops to 380 ms. Never as fast as zoomies.
A 540 ms stride, then 380 ms once something is closing.
built, not on the page
Sidestep
A single slow panda closing within 108 px: step calmly aside into the least crowded cell.
built, not on the page
Dive-roll
The emergency: a fast or too-close threat triggers the tumble cels at 58 ms each without settling to fallen, carrying him 92 px with invincibility frames, then a 2.6 s cooldown. Rarity is the cooldown, never a scripted miss.
Five tumble cels at 58 ms, 92 px of travel. The cels are drawn hatless.
built, not on the page
Hat drop and retrieve
A knock tosses the hat forward with a small spin; bare-headed, he sprints back at 300 ms a stride, stands over it for a beat, and puts it on. The calm drop variant, not a launch.
Re-enacted: the loose hat is the second actor here.
built, not on the page
Overwhelmed
During a cascade he is pulled to the origin and stands amid the fallen. No freeze, no spotlight.
built, not on the page
Learned line-walker
A policy network trained on the engine's rollouts drives the hat panda's 17-way action choice (hold, step in eight headings, roll in eight). The site ships only the rules expert; the network lives in the panda-engine repo. A linear probe over it is the belief overlay, which reads but never drives. The note 'A statue with reflexes' is the write-up of what the policy learned and unlearned.built, not on the page
A roamer
One panda at a time going strange: the tier-one anomalies.
Sleeper
Stops, plays the fall deliberately with no slide, lies 8–20 s, stands, resumes.
built, not on the page
Tumbler
Trips on nothing: a facing-cycle over a 46 px skid, ends splayed in the fall frames, gets up.
built, not on the page
Spinner
Spins in place 1.2 s, then two or three quick stagger-steps in random directions.
built, not on the page
Loop
Walks a small closed octagon, turning one step each stride, two to four laps at 420 ms, then snaps out.
built, not on the page
Starer
Stops, faces the nearest edge, holds the idle 6–12 s. Nothing happens.
built, not on the page
Zoomies
Locks a heading at three times walking speed until it hits a wall (tumbles) or a panda (an ordinary knock).
Three times walking speed into the wall.
built, not on the page
Moonwalk
Travels one heading while facing the exact opposite; the walk cycle plays as usual.
built, not on the page
Hiccup
Every two strides, a small convulsive pop straight up: a pocket throw arc that lands back into the gait.
built, not on the page
The oblivious one
One roamer chosen at spawn wanders a small radius, idles often, and is never picked for anything.
built, not on the page
Ensembles
Several pandas acting together.
The stack
Every 60–120 s a base with headroom is chosen; riders hop on by throw arc and sit; the base parades as the unstoppable force while a wobble grows until it topples, tossing riders off. A zoomies panda into the tower topples it early.
Re-enacted at the engine's timings: mount by throw arc, parade, topple.
built, not on the page
The cascade
Armed every 2–5 min, the next collision escalates: a hard slide aimed at the crowd, then a steered nearest-neighbour chain until 70–90% of the field is down. Recovery is the ordinary get-up, naturally staggered.
built, not on the page
Conga lines
Roamers formed follow-the-leader snakes, each follower stepping into the cell the one ahead vacated; lines grew, dissolved and reformed. Retired 2026-07-23 by design review: coordination read as uniform and janky, and line membership suppressed the collisions that are the scene's charm.
Re-enacted: each follower steps into the cell the one ahead vacated.
retired
Activation patching
When two lines of four or more had headings more than 45° apart, the hat panda froze the scene, spotlit the pair, grabbed a panda from one line by throw arc and inserted it into the other, whose tail peeled onto the new heading. Retired with the lines: it fired too rarely and too late for anyone to see. The metaphor was exact and the audience could not read it.
Re-enacted: two lines freeze, one panda is flung from the first into the tail of the second, and carries on with its heading.
retired
Scenes
Entrances, tableaux, whole-page choreography.
Walk-in entrance
The stage starts empty; the hat panda ambles in alone with a 1.8 s head start, then the troupe walks on from the edges two at a time.
built, not on the page
Drop entrance
The roamers rain onto their spots over about 7 s, 650 ms in the air each, and 40% bounce once on landing; the hat panda still walks on.
Re-enacted: 650 ms in the air, and some bounce once.
built, not on the page
Hero pin
The troupe pins to the viewport and stops routing around the hero's words; the fence stopped measuring a moving target. On an unmerged branch.built, not on the page
Reduced-motion tableau
With reduced motion, a composed still: the troupe scattered, one three-high stack mid-parade, one panda fallen, and the hat panda planted facing it.
A still: the stack mid-parade, one fallen, the hat panda facing it.
built, not on the page
Hero to road
The home page's whole choreography: large and breathing on the first screen, one leap to the head of the timeline, a scroll-driven walk down it past each era, and a sit at the end with the hat set down. Reduced motion parks the panda in the hero. on the home page
Cursor trail
An induction-head trail that replayed the cursor's past trajectory rather than merely lagging it. Rejected before building.rejected unbuilt