Button
Six variants (primary, secondary, accent, neutral, ghost, outline), three sizes, default and pill shapes.
Tokens
--primary--secondary--accent--radius-md--radius-full--font-primaryVariants
Sizes
Shape
State
For the seers who want to hone their craft, and for the crafters who want to sharpen their vision.
A library, not a website. One source, every surface.
Four readers, in the order the work serves them: the builder first, students in the course, serious general readers, and scholars last in order and first in constraint.
The person who reads it and writes it
This is a working research library that happens to be public. It is built by the person who reads it, which is why the voice is a good commit message rather than marketing, and why nothing is written to persuade. Any wider audience is downstream of this one.
Charleston Southern, ART 220 and ART 418, Fall 2026
Real readers with a term, a syllabus, and a next session. They arrive at a specific passage because it was assigned, not because they were browsing. This is why the classroom exists as its own register: a reader who is here on a schedule needs an instrument, and the instrument has different rules from the book page.
Already circling this vocabulary
People already talking about mythology, meaning, psychology, and design online, who do not know how deep the tradition goes, how recent it is, or that the people they are quoting were arguing with each other. THESIS §III is written about them. They are not addressed as beginners: the material is set at full strength and the apparatus does the work.
The citation-first user
People who need an addressable passage, an auditable annotation, and a citation that survives. They are the reason for the permanent identifiers and for keeping annotation beside the text rather than in it. Last in order and first in constraint: build for them, write for the others.
The name set at full width, edge to edge, touching both trim margins. A masthead that spans the measure is what a newspaper and a journal do, and it is the one piece of chrome allowed to be loud, because it appears once at the top and then the page belongs to the text. A small logo in a corner is an app. A masthead is a publication.
Red is the mark. Blue is the machine.
The accent is a second colour on a title page: it rules, marks, and ornaments, and it is never text. Red is the primordial second colour, the first to appear in manuscripts and in early printing, which is the sincere half of the thesis. Blue is load-bearing in a different way: every mark whose origin is a model is rendered in it, and nothing else is, so colour carries the human and machine seam without a reader having to read a label.
Select any step to copy its hex. The widest step in each ramp is the working default.
The palette mapped to intent. Values are copyable.
Serif means this is a text. Nothing interactive is ever serif.
The house serif carries the content: titles, citations, running prose, the masthead, plus a condensed cut for structural type. Stratos carries the interface: every button, chip, key, tab, and empty state. Maison Neue Mono carries the machine: folios, timecodes, references, and nothing that is not measured. A fourth family is not added for a geometric modernist grotesque; the modernist argument is made structurally, by the grid and the rules, not by quoting a typeface.
Every role stacked the way it ships.
Covers are typographic, generated from title, author, and tradition, the way a Penguin or a Suhrkamp spine is. A project that insists on labelling machine provenance cannot decorate itself with unlabelled synthesis.
Typographic. The cover is drawn from the work's own metadata in .ml-cover, sized in cqi so one drawing serves every scale. Where an image does appear inside a text it is the document's own: plates, diagrams, manuscript pages, set with a caption and a credit in the grammar's plate style (block.kind = 'plate').
Eighteen primitives in chrome.css carry the whole system. They exist so that a surface is assembled from the vocabulary rather than re-derived, and so that the rules below can be checked rather than trusted. One sheet does three jobs on purpose: building three would guarantee three behaviours for dismissal, focus, and safe areas.
Compose from these before writing new CSS.
The page frame. Shared width, safe-area trim. Every surface sits in it.
Rules carry the hierarchy that shadow would otherwise carry. Depth is made of rules, offset, and flat colour.
Mono, uppercase, letterspaced. The machine's voice. Carries only what is measured: folios, timecodes, refs, counts, weights.
Bracketed reference, set as { No. 1 }. Series numbers are folios, never '#1'.
Display type at four scales.
The name at full width, justified to both trims by a ResizeObserver solve. The only full-bleed element in the system. See the logo section: this is the mark.
Flat block of second colour. The ONLY reversed type in the system.
A ruled region. Hover is a heavier rule plus a 1px offset, never a shadow.
Square, ruled. Interface voice (Stratos), never serif.
An underline to be filled in, not a boxed input.
A ruled box, NOT a pill. The pill is the default decoration the thesis rules out.
Hairline progress, 3px tall and square. A radius on it would be a smudge, not an edge.
Snap-scrolling row that becomes a grid at 48rem.
Typographic cover, sized in cqi so one drawing serves every scale. Covers are generated from title, author, and tradition, the way a Penguin or Suhrkamp spine is.
Bottom sheet that becomes a side panel at 62rem. ONE SHEET, THREE JOBS: the concept drawer, the mobile note reader, and the annotation editor. Building three would guarantee three behaviours for dismissal, focus, and safe areas.
The foot. Where the imprint signs the edition.
Clamp to the measure. Prose never exceeds 55 to 65 characters.
Visually hidden, still read aloud.
Checkable in review. Each has a reason, not a preference.
The fastest way to hear the voice.
The player lives in the layout, not on the reading page.
We've decided that it would probably make sense for the player to be located in the layout.
A player that stops when you open another page is not a player, it is a preview.
We built a persistent player for a seamless listening experience.
A real input[type=range] rather than a div: keyboard, screen readers and touch all work without reimplementing any of it.
We leveraged a custom slider component to deliver a powerful, elegant interaction.
We start with a curated collection. Whether this becomes a product is not settled.
We're still figuring things out, and it's worth noting that this may or may not become a product, but we think there's something here.
Proposed connection — unreviewed
AI-powered smart recommendations
Words we use
Words we never use
Ready-to-run prompts for anyone writing as Meaning Layer.
Write a {length, default: 3-5 sentence} note recording this decision: {decision}. Follow The Meaning Layer voice. State the decision first, then the reason, in that order. Name the alternative that was rejected and say why it fails, in one sentence that closes the door. Present tense, active. No 'we think,' 'arguably,' 'it's worth noting,' 'simply,' 'just,' 'leverage,' 'seamless,' 'powerful,' 'robust,' 'elegant.' No exclamation points, no emoji. If the decision is provisional, say so once in one clause and keep going.
Write the copy for this surface: {surface}. The Meaning Layer voice, sentence case. Say what is true and what to do; never apologise twice, never say 'Please wait,' never 'Oops.' Progress is a position in a text ('Passage 74 of 312'), never a percentage. If a model produced any part of what is shown, label it in words at the point of use: 'Proposed,' 'Machine-found,' or 'Unreviewed,' never 'AI-powered.' Use: reading, work, library, passage, note, connection, edition, shelf, index. Do not use: content, asset, feed, chunk, highlight, recommendation, category.
Draft an amendment to {document} §{section} permitting {change}. Follow the form the existing amendments use: state what is now permitted and where its scope ends; state what does NOT move, as a list, so nothing later reads as an oversight; draw the distinction the amendment turns on in its own words; and name the enforcement, since scope is enforced, not trusted. Close by stating what a future widening would require. Voice: declarative, specific, willing to state a reason.
Write the colophon copy for {work}. The register is a well-edited book's front matter written by someone who built the thing. Name the faces and why they were chosen, cite where any constraint came from, and sign it with the imprint: Meaning Layer, without the article. The library is The Meaning Layer, with the article; the two are not interchangeable.
The library and the imprint
One name, one register. It names the library — the reading surfaces, the index, the dock, the classroom — and it signs the edition in the footer colophon, on covers, on title pages, in printed folios, and in the publisher field in EPUB and audio metadata. The masthead sets it at full width on every page. It is never used as a kicker on a page the masthead already heads. The library and the imprint are the same house; they were not, and the retired imprint was Workhorse Editions.
digital
The primary surface and the one every rule was written for. Reading pages, the dock, the player, the index, the colophon, the book view. This is where the book page is inviolate: no fill, no radius, no shadow, no colour beyond the three and the ink scale.
digital
Charleston Southern University, Fall 2026: ART 220 Digital Illustration and ART 418 Business of Design, twenty-eight meetings each, August 24 to December 7. The course index, term chart, session brief, syllabus, and course bar are the surfaces the 2026-08 amendments were written for, and they are the reason the amendments exist at all. A reader arriving on a schedule needs to see state, so state is drawn: a raised next session, a today field, a progress track. It is the only instrument scope in the system, and every carve-out it takes stops at the reading page.
The print tier: exported PDFs set in Freight, with the imprint on the title page and folios in the mono. This tier ran Libre Caslon while the screen ran Blacker Pro, so a work's printed edition and its web edition were set in different faces; the 2026-09 swap ended that and re-proofed the editions rather than leaving the split standing. One source, every surface, is a shipping claim here and not a promise.
digital
Registered as a brand so that brand, media, content, prompts and skills are shared rather than re-derived by every person and every agent that touches the work. It is the first system registered for that reason and not for a case study, and it is here to prove the platform can carry a real one: a user should be able to manage the design, hosting and content of their own app in this console. The repo stays the source of truth for the grammar; the registration is what makes the grammar legible outside it.