/* @version documents-document-2026.09.05 - bump on ANY edit */
:root { --ds-doc-version: "documents-document-2026.09.05"; }
/* ============================================================================
TRIUMPH DOCUMENTS v4 - the print document class.
Multi-page US Letter, 8.5 by 11 inches. White paper, a full-colour crest
header bar over a navy rule, a running head, and page numbers. No weave, no
navy ground, no full bleed. This is the class for anything a person READS on
paper: proposals, reports, guides, registers, and pricing plans that end as
a PDF. It is not the Print v2 flyer system at /print/, which is graphic-led,
one sheet, weave bands, and a Fabiola hero.
Link order: tokens.css, logos.css, document.css.
There is no pattern.css in this folder. That is not an oversight and it is
not a judgment call: the weave never appears in this class.
Nothing here hardcodes a brand hex. Every colour resolves to a tokens.css
variable. The single literal is the paper. tokens.css owns that token too and
declares the same white; because this sheet links last, the declaration below
overrides it rather than backing it up.
========================================================================== */
/* ---- 1. document tokens -------------------------------------------------- */
:root{
/* tokens.css owns --paper and declares this same white. document.css links
last, so at equal specificity this line OVERRIDES it; it is not a fallback.
It stays because a page that links document.css against an older tokens.css
still has to render on white. Change the two together or neither. White is
the physical sheet, not a brand colour. */
--paper: #ffffff;
/* Faces. NO fallback stack of any kind. A fallback silently renders a
Fabiola hero in some other face and the failed load never gets noticed. */
--font-doc-body: "Inter";
--font-doc-display: "Fabiola Capitals";
--font-doc-mono: "JetBrains Mono";
/* Paper and page box. Changing any of these invalidates the two geometry
constants in document.config.json. Change both or neither. */
--doc-page-w: 8.5in;
--doc-page-h: 11in;
--doc-pad-top: 0.35in;
--doc-pad-x: 0.55in;
--doc-pad-bottom: 0.34in;
--doc-foot-offset: 0.18in;
/* THE POINT SCALE. Ten tokens, and every font-size in this class resolves to
one of them or to a one sheet variant token below. The rem and clamp()
--text-* scale in tokens.css is the SCREEN scale; it is sized against a
viewport and does not survive contact with a fixed 8.5 by 11 inch sheet.
If a size is not on this list, it does not go on the page. */
--text-doc-hero: calc(290cqi / var(--mast-chars, 16)); /* cover h1 only */
--text-doc-h2: 22pt; /* section opener. Floor 20pt. */
--text-doc-step: 19pt; /* the step numeral, tabular */
--text-doc-part: 15pt; /* run-in part bar, NOT a section opener */
--text-doc-h3: 13pt; /* floor 12pt */
--text-doc-lede: 11.5pt; /* cover standfirst and page lede */
--text-doc-h4: 11pt;
--text-doc-body: 10.5pt; /* floor 10.5pt */
--text-doc-label: 10pt; /* eyebrows, captions, table heads. Floor 10pt. */
--text-doc-chrome: 9pt; /* running head tag, footer, page number.
THE ABSOLUTE FLOOR. Nothing is smaller. */
/* One sheet reference variant only. See section 12 for why these four exist
and why nothing outside .sheet may use them. */
--text-sheet-title: 16pt;
--text-sheet-body: 10pt;
--text-sheet-note: 8.5pt;
--text-sheet-chrome: 8pt;
/* Leading and tracking. A value used in more than one place is a token; a
value used once, on one component, stays inline where it can be read
beside the rule it belongs to. */
--leading-doc-body: 1.45;
--leading-doc-tight: 1.24;
--leading-doc-head: 1.08;
--leading-doc-cap: 1.2; /* a heading that sits inside a row, not on the page */
--track-doc-label: 0.14em;
--track-doc-caption: 0.10em;
--track-doc-chrome: 0.13em; /* running head tag and part number */
--track-doc-tight: 0.02em; /* table head */
/* Inks and rules, all derived from tokens.css. */
--ink-quiet: color-mix(in srgb, var(--ink-body) 66%, var(--paper));
--rule-strong: var(--navy);
--rule-hair: var(--hairline);
--tint-head: var(--mist); /* table head only */
--tint-panel: var(--fog); /* callout and row stripe only, never the page */
/* Rule weights. Nine, and the class uses no others. The first four draw the
page chrome, the last five draw the emphasis edges and the two hairlines.
There are two hairlines on purpose: table rows sit at 0.4pt, the chrome and
step hairlines at 0.5pt. Settling on one is a visual change, not a tidy-up,
so it is not made here. */
--rule-cover: 2pt;
--rule-run: 1.5pt;
--rule-head: 0.75pt;
--rule-line: 0.4pt;
--rule-thin: 0.5pt; /* footer, step rows, screenshot edge, sheet rules */
--rule-total: 1pt; /* the two rules that bound a total row */
--rule-callout: 3pt;
--rule-hint: 2.5pt;
--rule-quote: 2pt;
/* Crest heights. Three approved document sizes, plus one for the variant. */
--crest-cover: 96pt; /* a cover sheet that carries the bar and little else */
--crest-cover-work: 74pt; /* a working cover that also carries content */
--crest-run: 22pt; /* running head */
--crest-sheet: 40pt; /* the one sheet reference variant */
/* Figure widths, chosen so a source image stays above roughly 190dpi. */
--fig-w-narrow: 5.2in;
--fig-w-mid: 5.6in;
--fig-w: 6.3in;
--fig-w-wide: 7.0in;
/* The screenshot box. .figure.shot reads --w and --h off the element, which
is how one shot gets its own size without a class; these two are what it
falls back to when the author sets neither, so an unmeasured shot still
draws at a sane size instead of collapsing to nothing. */
--shot-w: var(--fig-w-narrow);
--shot-h: 3.2in;
}
/* ---- 2. reset and page geometry ----------------------------------------- */
*{margin:0;padding:0;box-sizing:border-box;
-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
@page{size:letter;margin:0}
html,body{background:var(--paper)}
body{
font-family:var(--font-doc-body);
color:var(--ink-body);
font-size:var(--text-doc-body);
line-height:var(--leading-doc-body);
font-synthesis:none; /* never fake-bold Fabiola into mush */
-webkit-font-smoothing:antialiased;
}
/* No overflow:hidden, on purpose and permanently. A page that outgrows its 11in
box must SPILL onto an extra sheet so the build's page-count assert catches
it. With overflow:hidden the last row silently disappears and every check
passes. */
.page{position:relative;width:var(--doc-page-w);height:var(--doc-page-h);
background:var(--paper);
padding:var(--doc-pad-top) var(--doc-pad-x) var(--doc-pad-bottom)}
.page + .page{page-break-before:always}
/* Optional column flow for a sheet whose blocks size themselves. Never combine
it with margin-top:auto on the last block: pinned, that block sits below the
content box whenever the page runs long and lands on top of the footer. */
.page.flow{display:flex;flex-direction:column}
/* ---- 3. cover bar --------------------------------------------------------
The approved cover: white paper, full colour crest at the left, kicker,
title, and standfirst at the right, ONE navy rule under all of it, content
starting immediately below. No navy band. No weave. The dark band belongs to
promotional work.
The title OWNS the bar per the header law: --mast-chars is the character
count of the title, spaces included, and it drives a cqi size so the hero
spans its column instead of sitting small beside a dead field. Recount it
whenever the title changes. */
.cover-bar{display:flex;align-items:center;gap:16pt;
padding-bottom:11pt;border-bottom:var(--rule-cover) solid var(--rule-strong);
margin-bottom:26pt}
.cover-bar > img{height:var(--crest-cover);width:auto;flex:none}
.cover-bar.work{gap:15pt;padding-bottom:9pt;margin-bottom:0}
.cover-bar.work > img{height:var(--crest-cover-work)}
.cover-head{flex:1;container-type:inline-size}
.cover-kicker{font-size:var(--text-doc-label);font-weight:800;text-transform:uppercase;
letter-spacing:var(--track-doc-label);color:var(--ink-quiet);margin-bottom:5pt}
/* Fabiola is OPTIONAL on the cover and appears at most ONCE in a document.
Never in the running head, never on an h2, never on a part bar, never on a
table. Its vertical fix is the tokens.css metric override plus this trim,
and nothing else. Never add margin, line-height, or a translate on top; that
double-corrects. The optional margin-left on the element is a left side
bearing nudge for the first glyph and is the only inline style allowed
here. */
h1.hero{font-family:var(--font-doc-display);font-weight:400;
font-size:var(--text-doc-hero);
line-height:1;letter-spacing:0;text-transform:none;color:var(--ink);
text-box-trim:trim-both;text-box-edge:cap alphabetic;margin:0}
/* The Inter alternative, for a cover that carries no Fabiola at all. */
h1.hero.inter{font-family:var(--font-doc-body);font-weight:900;
font-size:var(--text-doc-h2);letter-spacing:-0.015em;
text-box-trim:none;line-height:var(--leading-doc-head)}
.cover-sub{font-size:var(--text-doc-lede);line-height:1.4;color:var(--ink-body);margin-top:8pt}
.lede{font-size:var(--text-doc-lede);line-height:1.5;color:var(--ink);max-width:6.6in}
.lede strong{font-weight:700}
/* ---- 4. running chrome ---------------------------------------------------
Every sheet after the cover opens with .runhead and closes with .pagefoot.
The crest repeats at 22pt, which is the smallest the full colour lockup
reads at. Do not put the venue or a partner mark in the running head: a mark
with interior detail stops reading at about one inch. The stacked wordmark
is banned in both, because a title set beside a two-line lockup reads as a
four-line mark with a mistake in it. */
.runhead{display:flex;align-items:center;gap:9pt;padding-bottom:5pt;
border-bottom:var(--rule-run) solid var(--rule-strong);margin-bottom:9pt;flex:none}
.runhead img{height:var(--crest-run);width:auto}
.runhead .doc{font-size:var(--text-doc-label);font-weight:800;color:var(--ink)}
.runhead .sec{margin-left:auto;font-size:var(--text-doc-chrome);font-weight:700;
text-transform:uppercase;letter-spacing:var(--track-doc-chrome);color:var(--ink-quiet)}
/* The footer is absolutely positioned so a page that runs long spills THROUGH
it and the check sees the collision, rather than pushing it off the sheet.
It carries data provenance only: the source system, the as-of stamp, and the
basis caveat. No names, no titles, no on-behalf-of line. */
.pagefoot{position:absolute;left:var(--doc-pad-x);right:var(--doc-pad-x);
bottom:var(--doc-foot-offset);
display:flex;justify-content:space-between;font-size:var(--text-doc-chrome);
color:var(--ink-quiet);border-top:var(--rule-thin) solid var(--rule-hair);padding-top:4pt}
.pagefoot .num{font-family:var(--font-doc-mono);font-weight:500}
/* A closing block may carry the last sheet's page number instead of a footer.
Running both puts two footers on the same 20 points and they overprint. */
.close{margin-top:10pt;padding-top:9pt;border-top:var(--rule-run) solid var(--rule-strong);
display:flex;align-items:baseline;gap:10pt}
.close .org{font-size:var(--text-doc-h4);font-weight:800;color:var(--ink);white-space:nowrap}
.close .q{font-size:var(--text-doc-body);color:var(--ink-body)}
.close .cnum{margin-left:auto;font-family:var(--font-doc-mono);font-weight:500;
font-size:var(--text-doc-chrome);color:var(--ink-quiet)}
/* ---- 5. headings ---------------------------------------------------------
The eyebrow carries the section number. Section numbering is manual and
sequential across the document, written "Section 3" and "Section 3,
continued" when a section runs over a page break. There is no auto counter,
because a section that splits must not renumber.
Every one of these is a HEADING, not a label. h2 is Inter 900, never Fabiola
and never routed through the display face; Fabiola synthetic-bolds to mush at
working sizes. An eyebrow is a number, not a subheader: never demote a real
subheader into .eyebrow to save vertical space. */
.eyebrow{font-size:var(--text-doc-label);font-weight:800;text-transform:uppercase;
letter-spacing:var(--track-doc-label);color:var(--ink-quiet);margin-bottom:4pt}
h2{font-size:var(--text-doc-h2);font-weight:900;line-height:var(--leading-doc-head);
letter-spacing:-0.012em;color:var(--ink);margin-bottom:7pt}
h2 + .intro{margin-top:0}
h3{font-size:var(--text-doc-h3);font-weight:800;line-height:1.25;color:var(--ink);
margin:12pt 0 3pt}
h3:first-of-type{margin-top:9pt}
h4{font-size:var(--text-doc-h4);font-weight:800;color:var(--ink);margin:9pt 0 2pt}
p{margin-bottom:5pt}
p:last-child{margin-bottom:0}
.intro{color:var(--ink-body);margin-bottom:7pt}
/* The part bar is a run-in divider for a document organised in named parts,
e.g. a step guide. It is NOT a shrunken h2 and it never replaces one. A
document uses .part OR h2 sections, not both at the same level. */
.part{display:flex;align-items:baseline;gap:8pt;margin-top:9pt;padding-bottom:3pt;
border-bottom:var(--rule-total) solid var(--rule-strong);flex:none}
.part.lead{margin-top:16pt}
.part .n{font-size:var(--text-doc-label);font-weight:800;letter-spacing:var(--track-doc-chrome);
text-transform:uppercase;color:var(--ink-quiet);font-variant-numeric:tabular-nums}
.part h2{font-size:var(--text-doc-part);font-weight:900;letter-spacing:-0.012em;
color:var(--ink);line-height:1.1;margin:0}
.part .rng{margin-left:auto;font-size:var(--text-doc-chrome);font-weight:700;
text-transform:uppercase;letter-spacing:0.11em;color:var(--ink-quiet);
white-space:nowrap}
/* ---- 6. body, measure, and lists -----------------------------------------
Body copy runs the full content column, 7.4in, EXCEPT the cover lede, which
is capped at 6.6in so the cover reads as a page rather than a wall. Two
column body text is banned in this class. It was rejected twice on the
Ticket Access Guide: at roughly 25 characters a line the copy breaks into
short ragged lines while space pools at the foot of the sheet. The only
multi-column blocks allowed are .contents, .cols2 holding two tables, and
.warnings holding two short notices. */
ul,ol{margin:4pt 0 6pt 14pt}
li{margin-bottom:2.5pt;padding-left:2pt}
li::marker{color:var(--ink-quiet)}
ul.tight li{margin-bottom:1.5pt}
/* ---- 7. tables -----------------------------------------------------------
Mist head, hairline rows, Fog on even rows, mono right-aligned figures, a
quiet trailing column for classification, and a total row bounded by two
navy rules. Show the full build: never post a total whose arithmetic a
reader cannot follow line by line. One value per cell. */
table{width:100%;border-collapse:collapse;font-size:var(--text-doc-body);margin:5pt 0 3pt}
caption{caption-side:top;text-align:left;font-size:var(--text-doc-label);font-weight:800;
text-transform:uppercase;letter-spacing:var(--track-doc-caption);
color:var(--ink-quiet);padding-bottom:4pt}
th{background:var(--tint-head);color:var(--ink);font-size:var(--text-doc-label);
font-weight:800;text-align:left;padding:2.8pt 6pt;letter-spacing:var(--track-doc-tight);
line-height:1.18;border-bottom:var(--rule-head) solid var(--rule-strong);
vertical-align:bottom}
td{padding:2.8pt 6pt;border-bottom:var(--rule-line) solid var(--rule-hair);
line-height:var(--leading-doc-tight);vertical-align:top}
/* THE ZEBRA. Every table in this class writes its header row in a and
its data rows in a , so the stripe counts data rows and the header is
never one of them. Write the two elements even for a three-row table.
The two rules under it are the safety net for a table that puts its header
row inside the tbody anyway: there the header is child 1, so striping the
even children stripes the row directly under the header and every stripe
after it sits on the wrong row. These re-point the stripe at the odd children
after the first, which is the same set of data rows a thead table stripes. A
renderer without :has ignores them and gets the old, shifted result rather
than no stripe at all. */
tbody tr:nth-child(even) td{background:var(--tint-panel)}
tbody:has(> tr:first-child > th) > tr:nth-child(even) td{background:var(--paper)}
tbody:has(> tr:first-child > th) > tr:nth-child(odd):not(:first-child) td{
background:var(--tint-panel)}
th.r,td.r{text-align:right}
th.c,td.c{text-align:center}
td.num{text-align:right;font-family:var(--font-doc-mono);font-weight:500;
font-variant-numeric:tabular-nums;white-space:nowrap}
/* Headers must WRAP. A nowrap header widens the widest table past the page and
Chromium then shrink-to-fit scales the whole PDF, which silently drops every
type size below the print floor at once. */
th.num{text-align:right;white-space:normal}
td.st{white-space:nowrap}
td.lvl{font-weight:800;color:var(--ink);white-space:nowrap}
td.k{font-weight:800;color:var(--ink)}
td.q{color:var(--ink-quiet)}
tr.total td{background:var(--paper);border-top:var(--rule-total) solid var(--rule-strong);
border-bottom:var(--rule-total) solid var(--rule-strong);font-weight:800;color:var(--ink)}
tr.total td.num{font-weight:700}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:20pt}
/* A note carries the caveat, the arithmetic behind a figure, or the thing a
reader has to confirm. It never carries new facts. */
.note{font-size:var(--text-doc-body);color:var(--ink-quiet);
line-height:1.35;margin-top:4pt}
.note strong{color:var(--ink);font-weight:700}
.nb{white-space:nowrap}
/* ---- 8. emphasis on the paper --------------------------------------------
THE CALLOUT RULE. Emphasis is a rule plus a lead-in, never a filled box.
.callout is a flat Fog panel with a solid navy rule down its left edge and
NOTHING else: no navy ground, no weave, no border on the other three sides,
no tint that is not Fog, no shadow, no radius. A navy weave-filled panel
floating on the paper is banned in every variation, at every size, at every
opacity, and the fix for one that reads badly is to delete it, not to
restyle it. Nothing on the paper touches the running head or the footer:
every block clears both by real space.
All four shapes read down one left edge: the rule sits on the margin and the
text starts 14pt inside it, so the padding compensates for the rule weight.
Change a rule weight and change its padding in the same edit. */
.callout{background:var(--tint-panel);border-left:var(--rule-callout) solid var(--rule-strong);
padding:8pt 11pt;margin:9pt 0 4pt}
.callout .lab{font-size:var(--text-doc-label);font-weight:800;text-transform:uppercase;
letter-spacing:0.12em;color:var(--ink);margin-bottom:3pt}
/* The compact form, for a one line aside inside a step or beside a table. */
.callout.hint{padding:5pt 8pt 5pt 11.5pt;margin-top:5pt;border-left-width:var(--rule-hint);
font-size:var(--text-doc-body);line-height:1.32}
/* Green rides the RULE, never the lead-in text. Triumph Green does not carry
small type on white paper, so the label stays navy and only the 3pt edge
changes colour. One accent callout per page at most. */
.callout.accent{border-left-color:var(--green)}
/* Two short notices side by side. TWO columns, never three: two gives about 45
characters a line, three gives about 25 and reads as smashed together. */
.warnings{display:grid;grid-template-columns:1fr 1fr;gap:16pt;margin-top:16pt}
/* A quote block holds language lifted from a source, a vendor, or a comparable
club. It stays in quotation marks and is never paraphrased into house voice.
Its rule is Mist, not navy, so it reads as quieter than a callout. */
.quote{border-left:var(--rule-quote) solid var(--mist);padding-left:12pt;color:var(--ink);
margin:4pt 0 6pt}
/* ---- 9. figures ----------------------------------------------------------
Figures sit straight on the white page. No frame, no rule, no shadow: the
system defines none of those. Prefer a transparent PNG. Pick the width class
so the source image stays above roughly 190dpi at print scale, and never
upscale past native pixels or re-encode the source. */
.figure{margin:12pt 0 0}
.figure img{display:block;width:var(--fig-w);height:auto;margin:0 auto}
.figure.w52 img{width:var(--fig-w-narrow)}
.figure.w56 img{width:var(--fig-w-mid)}
.figure.w70 img{width:var(--fig-w-wide)}
.figure .cap{font-size:var(--text-doc-body);color:var(--ink-quiet);line-height:1.35;
margin-top:6pt;text-align:center}
/* Three images that make one point share a row and one caption. */
.figure-row{display:flex;gap:12pt;align-items:flex-end;justify-content:center;margin-top:12pt}
.figure-row img{height:1.62in;width:auto}
/* A UI screenshot has a white background and therefore no edge of its own, so
it is the ONE figure that takes a hairline. An illustration, a render, a map,
or a chart does not. margin:0 kills the UA figure margin, which otherwise
widens the column by 0.83in and pushes a wide shot off the page.
This is the one component sized off the element: --w is the box width and --h
the height cap, both set inline on the .figure.shot div and measured from the
source image. Set both or neither; unset, they fall back to --shot-w and
--shot-h. They are the only two custom properties the class reads that it
does not declare a value for. */
.figure.shot{margin:0;width:var(--w, var(--shot-w));display:flex;justify-content:center}
.figure.shot img{width:auto;max-width:100%;max-height:var(--h, var(--shot-h));
border:var(--rule-thin) solid var(--rule-hair)}
/* ---- 10. cover contents --------------------------------------------------
Two columns of leader rows, filled by the build from each page's data-toc or
its first h2. Page numbers are mono. */
.facts{margin-top:22pt}
.contents{margin-top:26pt;column-count:2;column-gap:26pt}
.contents .row{display:flex;align-items:baseline;gap:5pt;font-size:var(--text-doc-body);
padding:3pt 0;border-bottom:var(--rule-line) solid var(--rule-hair);
break-inside:avoid}
.contents .row .t{color:var(--ink);font-weight:600}
.contents .row .d{flex:1}
.contents .row .p{font-family:var(--font-doc-mono);font-weight:500;color:var(--ink-quiet)}
/* ---- 11. step rows -------------------------------------------------------
For a procedural document. Number, copy, screenshot on one row, hairline
between rows, rows at their natural height with no space-evenly stretching.
The copy centres against the screenshot: top aligned, a two line instruction
beside a 3in portrait shot leaves a dead white block under every step.
.step.stack overrides back to start, for a shot that sits under the copy.
The number is INK, the same navy every heading wears, reached through --ink
like the rest of the sheet rather than through the raw brand token. Triumph
Green does not carry small type on white paper. */
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:0.30in 1fr auto;column-gap:0.17in;
align-items:center;padding:0.10in 0}
.step + .step{border-top:var(--rule-thin) solid var(--rule-hair)}
.step.stack{align-items:start;grid-template-columns:0.30in 1fr}
.step.text{padding:0.06in 0}
.step-n{font-size:var(--text-doc-step);font-weight:900;line-height:0.95;color:var(--ink);
font-variant-numeric:tabular-nums;padding-top:1pt}
/* min-width:0 keeps a wide figure from forcing the 1fr column past the margin */
.step-body{min-width:0}
.step-body h3{font-size:var(--text-doc-h3);font-weight:800;line-height:var(--leading-doc-cap);color:var(--ink);
margin:0 0 2.5pt;letter-spacing:-0.008em}
.step-body p{font-size:var(--text-doc-body);line-height:1.38;color:var(--ink-body)}
.step-body p + p{margin-top:3pt}
/* ---- 12. the one sheet reference variant ---------------------------------
A dense staff or client lookup table that fits one sheet by design, where
spilling to a second sheet would make it wrong. It keeps the class grammar,
white paper, crest header bar, tokenised colour, no weave, and relaxes two
things and only two:
* the crest drops to 40pt and the rule under the bar to 1.5pt, because the
bar is chrome on a working sheet, not a cover;
* chrome type may run to 8pt, because the sheet is a lookup table, not
continuous reading. BODY STAYS AT 10pt. An 8pt body was rejected outright.
It keeps the 11in page box for the same reason .page does: a lookup sheet is
defined by fitting on one sheet, so one that outgrows the box has to SPILL
where the build's page-count assert can see it.
Everything else holds. It does not get its own colour literals, its own
fallback font stacks, or its own green.
The shipped 2027 price sheet is an approved exemption: its off-palette greens
and its 7.5pt table heads stay as they are and that file is not edited. New
one sheet work uses the tokens below. */
.sheet{width:var(--doc-page-w);height:var(--doc-page-h);padding:0.34in 0.42in 0.18in}
.sheet .header-bar{display:flex;align-items:center;gap:11pt;margin-bottom:9pt;
padding-bottom:7pt;border-bottom:var(--rule-run) solid var(--rule-strong)}
.sheet .header-bar img{height:var(--crest-sheet);width:auto}
.sheet .header-bar h1{font-size:var(--text-sheet-title);font-weight:800;color:var(--ink);
letter-spacing:-0.01em}
.sheet .header-bar .sub{font-size:var(--text-sheet-chrome);color:var(--ink-quiet);margin-top:2pt}
.sheet .section-title{font-size:var(--text-sheet-chrome);font-weight:800;text-transform:uppercase;
letter-spacing:0.05em;color:var(--ink);
border-bottom:var(--rule-thin) solid var(--rule-hair);
padding-bottom:2.5pt;margin:9pt 0 4pt}
.sheet table{font-size:var(--text-sheet-body)}
.sheet th{font-size:var(--text-sheet-chrome);letter-spacing:0.03em;text-transform:uppercase}
.sheet td{white-space:nowrap;font-variant-numeric:tabular-nums;padding:3pt 6pt}
.sheet .price{color:var(--ink);font-weight:700;font-family:var(--font-doc-mono);
font-variant-numeric:tabular-nums}
.sheet .note{font-size:var(--text-sheet-note)}
.sheet .footer{text-align:center;font-size:var(--text-sheet-chrome);color:var(--ink-quiet);
margin-top:6pt;padding-top:5pt;border-top:var(--rule-thin) solid var(--rule-hair)}
/* ---- 13. motion and states ----------------------------------------------
There are none. A printed document does not animate, count up, reveal,
hover, focus, or press. Do not design a state onto it and do not copy one in
from components.css. tokens.css ships the global reduced-motion kill for the
system's on-screen reference pages; never re-implement it per page and never
remove it. */