They are not skins of one thing. Different components, different type rules, different jobs. Answer what you are building before you link a stylesheet, because a token-perfect artifact built on the wrong system looks deliberate.
| What you are building | System | What you link |
|---|---|---|
| Staff reading data in a browser | Dashboards | design.greenvilletriumph.club/tokens.css |
| A member or a guest using a screen | Screens | design.greenvilletriumph.club/screens/tokens.css |
| A flyer, an ad, a poster, or one printed sheet, graphic-led | design.greenvilletriumph.club/print/tokens.css |
|
| A multi-page proposal, report, or guide read as a PDF | Documents | design.greenvilletriumph.club/documents/tokens.css |
More than one page, a running head, or page numbers means Documents. One sheet built from type, colour blocks, and the weave means Print.
Staff reading data in a browser. Scan rates, revenue, inventory, prospect boards.
tokens.css · components.css · agents.md · starter.html
Graphite canvas, one Fabiola hero, Inter headings, mono on every label and number.
screens/tokens.css · pattern.css · components.css · field.js · screen.js · screens/agents.md
Two grounds only, navy and fog, with one continuous weave running the page.
A flyer, an ad, a poster, or a single printed sheet. Graphic-led: type, colour blocks, and the weave.
print/tokens.css · pattern.css · logos.css · components.css · print/agents.md
Navy weave bands on white paper, or on fog for a screen ad. Fabiola once, green as accent. One sheet, never a document.
A multi-page proposal, report, or guide read as a PDF. The 2027 Ticketing Proposal, the Audience Reach Report, the Ticket Access Guide.
documents/tokens.css · logos.css · document.css · documents/agents.md
White paper, no weave anywhere. The full-colour crest in a header bar over a navy rule, a running head and page numbers on every interior page, Inter 900 headings.
/tokens.css, /components.css, /fonts/, /vendor/, /images/, and the two starters keep their URLs, because roughly forty live projects link them at load time. Changes are additive only: never rename a token, never remove a component class.
Each system folder is self contained, with its own fonts and images. Anything that renders behind office TLS inspection or gets exported to PDF has to self host, so take the whole folder rather than a stylesheet URL.
Sean's own site runs on a separate brand, palette, and repo at design.seantippen.com. It is named here only so nobody reaches for a Triumph sheet on a personal page.