How this is built.

Monospace carries structure, a reading face carries language, and separation comes from rules and space rather than from cards.

If a piece of text tells you what kind of thing you are looking at — a label, a number, a date, an address — it is monospace, uppercase and tracked. If it says something, it is the reading face. There are no rounded corners, no drop shadows and no fills except the row hover. A hairline separates peers; a 2px ink rule opens and closes the page. Those three rules — under the masthead, above the first block, above the footer — are what hold a page together at a glance.

The three sites share that structure and nothing else. Colour and the reading face are each site's own: the hub stays monochrome so it reads as the neutral index, weindie is warm paper and green, and this is warm paper and clay — the colour of a correction, on a notebook of them.

Nothing is shared at build time. Three static sites should not acquire a common dependency to stay in step; instead the token names are identical across all three, so a diff between the stylesheets shows only the differences that were chosen.

Two faces, both self-hosted and subset to latin, so an English page fetches nothing it cannot read.

Eight tokens, declared three times so that system-default, explicit light and explicit dark all resolve. Every text colour clears WCAG AA on the surfaces it actually sits on.

Astro and MDX, statically generated, deployed on Cloudflare Pages. Notes are one MDX file each with validated frontmatter; a note that breaks the content model fails the build rather than shipping a broken page.

The only client JavaScript is /theme.js, which applies and toggles the theme. It is a real file rather than an inline script so the content-security policy can stay script-src 'self' with no hash to keep in step. Everything else is HTML and CSS.

The full system is written up in design/STYLEGUIDE.html in the site's repository, alongside the prototypes it came from.