/* ═══════════════════════════════════════════════════════════════════════════
   Swiss — the design system stylesheet.  Print first, web second.

   Everything that can vary is a token (a CSS custom property) set by index.js
   from pad data: theme → brand → document → page → URL directives. This file
   only knows structure: sheets, margins, the 12-column grid, the baseline
   rhythm, the block types. It never names a colour or a font family of its own.

   Units: print geometry is millimetres, type is points; on screen the same
   tokens are reused so the two renderings share one hierarchy.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* palette (overwritten by the theme) */
  --paper: #ffffff; --ink: #111111; --ink-2: #444444; --muted: #7a7a7a; --line: #d6d6d6;
  --accent: #e30613; --accent-2: #111111; --accent-ink: #ffffff; --surface: #f3f3f1; --surface-2: #e9e9e6;
  --pos: #1f8a5b; --neg: #b3261e; --warn: #e3a008;
  --c1: #e30613; --c2: #111111; --c3: #7a7a7a; --c4: #c9a227; --c5: #384e9c; --c6: #1f8a5b;
  /* type */
  --font-display: 'Archivo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --fs: 10.5pt; --lh: 1.45; --scale: 1.25; --tracking: -0.01em; --display-weight: 800; --display-transform: none;
  --module: calc(var(--fs) * var(--lh));          /* one baseline unit */
  --s1: calc(var(--module) * 0.5); --s2: var(--module); --s3: calc(var(--module) * 1.5);
  --s4: calc(var(--module) * 2);  --s6: calc(var(--module) * 3); --s8: calc(var(--module) * 4); --s12: calc(var(--module) * 6);
  --h6: var(--fs); --h5: calc(var(--fs) * var(--scale)); --h4: calc(var(--h5) * var(--scale));
  --h3: calc(var(--h4) * var(--scale)); --h2: calc(var(--h3) * var(--scale)); --h1: calc(var(--h2) * var(--scale));
  --hero: calc(var(--h1) * var(--scale) * var(--scale));
  --small: calc(var(--fs) * 0.85); --tiny: calc(var(--fs) * 0.72);
  /* geometry */
  --page-w: 210mm; --page-h: 297mm; --m-top: 22mm; --m-right: 18mm; --m-bottom: 22mm; --m-left: 18mm;
  --gutter: 5mm; --rule-w: 0.4pt; --rule-strong: 1.5pt; --radius: 0; --bleed: 0mm;
  --density: 1;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--surface-2); color: var(--ink); font-family: var(--font-body); font-size: var(--fs); line-height: var(--lh);
  font-feature-settings: "kern" 1, "liga" 1, "tnum" 0; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body[data-mode="web"] { background: var(--paper); }
img, svg, canvas { max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 var(--s2); orphans: 3; widows: 3; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--tracking); line-height: 1.08; margin: 0; text-transform: var(--display-transform); break-after: avoid; overflow-wrap: break-word; hyphens: manual; }
h1 { font-size: var(--h1); } h2 { font-size: var(--h2); } h3 { font-size: var(--h3); line-height: 1.15; }
h4 { font-size: var(--h4); line-height: 1.2; } h5 { font-size: var(--h5); line-height: 1.25; } h6 { font-size: var(--h6); line-height: 1.3; text-transform: uppercase; letter-spacing: .08em; }
strong, b { font-weight: 700; }
code, pre, kbd, .mono { font-family: var(--font-mono); font-size: 0.92em; }
pre { background: var(--surface); padding: var(--s2); overflow: auto; margin: 0 0 var(--s2); border-left: var(--rule-strong) solid var(--ink); }
hr { border: 0; border-top: var(--rule-w) solid var(--ink); margin: var(--s3) 0; }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
th, td { text-align: left; vertical-align: top; padding: calc(var(--s1) * .7) var(--s1); border-bottom: var(--rule-w) solid var(--line); }
th { font-family: var(--font-display); font-weight: 700; font-size: var(--small); text-transform: uppercase; letter-spacing: .06em; border-bottom: var(--rule-strong) solid var(--ink); }
td.num, th.num { text-align: right; }
ul, ol { margin: 0 0 var(--s2); padding-left: 1.9em; }
li { margin-bottom: calc(var(--s1) * .5); }
blockquote { margin: 0 0 var(--s2); padding-left: var(--s2); border-left: var(--rule-strong) solid var(--accent); color: var(--ink-2); }
figure { margin: 0; }
figcaption, .caption { font-size: var(--small); color: var(--muted); margin-top: var(--s1); line-height: 1.35; }
.label { font-family: var(--font-display); font-size: var(--tiny); text-transform: uppercase; letter-spacing: .12em; color: var(--muted); font-weight: 600; }
.label.accent { color: var(--accent); }
.num { font-variant-numeric: tabular-nums; }
.uc { text-transform: uppercase; letter-spacing: .04em; }
.inverse { background: var(--ink-0); color: var(--paper-0); --ink: var(--paper-0); --paper: var(--ink-0); --ink-2: var(--surface-2-0); --muted: var(--line-0); --surface: rgba(255,255,255,.08); --surface-2: rgba(255,255,255,.14); --line: rgba(255,255,255,.35); }
.inverse .label, .inverse .caption, .inverse .muted { color: var(--surface-2); }
.accent-bg { background: var(--accent); color: var(--accent-ink); }
.accent-bg .label { color: var(--accent-ink); opacity: .8; }
.muted { color: var(--muted); }

/* ── Sheets (print mode): every physical page is one fixed box ─────────── */
.sheets { display: flex; flex-direction: column; align-items: center; gap: 12mm; padding: 12mm 0; }
.sheet { position: relative; width: var(--page-w); height: var(--page-h); background: var(--paper); color: var(--ink); overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.12), 0 12px 32px rgba(0,0,0,.12); flex: 0 0 auto; page-break-after: always; break-after: page; }
.sheet:last-child { page-break-after: auto; break-after: auto; }
.sheet-bg { position: absolute; inset: 0; z-index: 0; }
.sheet-body { position: absolute; z-index: 2; top: var(--m-top); right: var(--m-right); bottom: var(--m-bottom); left: var(--m-left); display: flex; flex-direction: column; }
.sheet-body > .spanning { flex: 0 0 auto; margin-bottom: var(--s2); }
.sheet-header, .sheet-footer { position: absolute; left: var(--m-left); right: var(--m-right); z-index: 3; display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: var(--gutter);
  font-family: var(--font-display); font-size: var(--tiny); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); line-height: 1.3; }
.sheet-header { top: 0; height: var(--m-top); padding-bottom: calc(var(--s1) * 1.2); }
.sheet-footer { bottom: 0; height: var(--m-bottom); align-items: start; padding-top: calc(var(--s1) * 1.2); }
.sheet-header > .c, .sheet-footer > .c { text-align: center; }
.sheet-header > .r, .sheet-footer > .r { text-align: right; }
.sheet-header .logo, .sheet-footer .logo { height: var(--logo-h, calc(var(--m-top) * .42)); max-height: var(--logo-h, 12mm); width: auto; display: inline-block; vertical-align: bottom; }
.sheet-footer .logo { height: var(--logo-h, calc(var(--m-bottom) * .4)); }
.sheet-header.rule { border-bottom: 0; }
.sheet-header.rule::after { content: ""; position: absolute; left: 0; right: 0; bottom: calc(var(--s1) * .5); border-top: var(--rule-w) solid var(--ink); }
.sheet-footer.rule::before { content: ""; position: absolute; left: 0; right: 0; top: calc(var(--s1) * .5); border-top: var(--rule-w) solid var(--ink); }
.sheet-header.band { background: var(--ink); color: var(--paper); left: 0; right: 0; padding-left: var(--m-left); padding-right: var(--m-right); height: calc(var(--m-top) * .55); align-items: center; }
.sheet-footer.band { background: var(--ink); color: var(--paper); left: 0; right: 0; padding-left: var(--m-left); padding-right: var(--m-right); height: calc(var(--m-bottom) * .55); top: auto; align-items: center; }
.page-no { font-variant-numeric: tabular-nums; }

/* frames: parametrised page borders */
.sheet-frame { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.sheet-frame.frame { inset: var(--frame-inset, 8mm); border: var(--frame-w, var(--rule-w)) solid var(--frame-color, var(--ink)); }
.sheet-frame.corner::before, .sheet-frame.corner::after { content: ""; position: absolute; width: 10mm; height: 10mm; border: var(--frame-w, var(--rule-strong)) solid var(--frame-color, var(--ink)); }
.sheet-frame.corner::before { top: var(--frame-inset, 8mm); left: var(--frame-inset, 8mm); border-right: 0; border-bottom: 0; }
.sheet-frame.corner::after { bottom: var(--frame-inset, 8mm); right: var(--frame-inset, 8mm); border-left: 0; border-top: 0; }
.sheet-frame.rule::before { content: ""; position: absolute; left: var(--m-left); right: var(--m-right); top: calc(var(--m-top) * .5); border-top: var(--frame-w, var(--rule-strong)) solid var(--frame-color, var(--accent)); }
.sheet-frame.band { background: linear-gradient(to right, var(--frame-color, var(--accent)) 0, var(--frame-color, var(--accent)) var(--frame-w, 6mm), transparent var(--frame-w, 6mm)); }
.sheet-frame.band-top { background: linear-gradient(to bottom, var(--frame-color, var(--accent)) 0, var(--frame-color, var(--accent)) var(--frame-w, 6mm), transparent var(--frame-w, 6mm)); }
.sheet-frame.drafting { inset: var(--frame-inset, 10mm); border: 0.7mm solid var(--ink); }
.sheet-frame.drafting .zone { position: absolute; font-family: var(--font-mono); font-size: 7pt; color: var(--ink); }
.sheet-frame.drafting .zone.h { top: -5mm; transform: translateX(-50%); }
.sheet-frame.drafting .zone.v { left: -5mm; transform: translateY(-50%); }
.sheet-frame.drafting .tick { position: absolute; background: var(--ink); }
.sheet-frame.drafting .tick.h { top: -5mm; width: 0.3mm; height: 5mm; }
.sheet-frame.drafting .tick.v { left: -5mm; height: 0.3mm; width: 5mm; }
.sheet-frame.drafting .centre { position: absolute; background: var(--ink); }
.sheet-frame.drafting .centre.top { top: -5mm; left: 50%; width: 0.4mm; height: 5mm; }
.sheet-frame.drafting .centre.bottom { bottom: -5mm; left: 50%; width: 0.4mm; height: 5mm; }
.sheet-frame.drafting .centre.left { left: -5mm; top: 50%; height: 0.4mm; width: 5mm; }
.sheet-frame.drafting .centre.right { right: -5mm; top: 50%; height: 0.4mm; width: 5mm; }

/* watermark, overlays, crop marks */
.sheet-watermark { position: absolute; inset: 0; z-index: 4; display: flex; align-items: center; justify-content: center; pointer-events: none; overflow: hidden; }
.sheet-watermark .wm-text { font-family: var(--font-display); font-weight: 900; font-size: var(--wm-size, 64pt); letter-spacing: .12em; color: var(--wm-color, var(--ink)); opacity: var(--wm-opacity, .08); transform: rotate(var(--wm-angle, -24deg)); white-space: nowrap; text-transform: uppercase; }
.sheet-watermark .wm-image { width: var(--wm-size, 60%); opacity: var(--wm-opacity, .08); transform: rotate(var(--wm-angle, 0deg)); }
.sheet-watermark.corner { align-items: flex-end; justify-content: flex-end; padding: var(--m-bottom) var(--m-right); }
.sheet-watermark.top { align-items: flex-start; padding-top: var(--m-top); }
.sheet-overlay { position: absolute; inset: 0; z-index: 9; pointer-events: none; }
.sheet-overlay .cols { position: absolute; top: var(--m-top); bottom: var(--m-bottom); left: var(--m-left); right: var(--m-right); display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); }
.sheet-overlay .cols > i { background: rgba(0, 160, 255, .09); outline: 1px solid rgba(0, 160, 255, .25); }
.sheet-overlay .baseline { position: absolute; inset: var(--m-top) var(--m-right) var(--m-bottom) var(--m-left); background: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--module) - 1px), rgba(255, 0, 120, .35) calc(var(--module) - 1px), rgba(255, 0, 120, .35) var(--module)); }
.sheet-overlay .margins { position: absolute; inset: var(--m-top) var(--m-right) var(--m-bottom) var(--m-left); outline: 1px dashed rgba(255, 0, 120, .6); }
.sheet-marks { position: absolute; inset: 0; z-index: 10; pointer-events: none; }
.sheet-marks i { position: absolute; background: var(--ink); }
.sheet-marks .h { height: 0.25pt; width: 5mm; } .sheet-marks .v { width: 0.25pt; height: 5mm; }
.sheet.bleed { outline: 1px dashed rgba(0,0,0,.3); }

/* ── Flow and grid inside a sheet ─────────────────────────────────────── */
.flow { position: relative; flex: 1 1 auto; min-height: 0; display: grid; gap: 0 var(--gutter); grid-auto-flow: column; }
.flow.cols-1 { grid-template-columns: 1fr; } .flow.cols-2 { grid-template-columns: 1fr 1fr; } .flow.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
.flow > .col { min-width: 0; overflow: hidden; height: 100%; position: relative; }
.flow > .col > * { max-width: 100%; }
.grid12 { position: relative; flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(0, auto); gap: var(--s2) var(--gutter); align-content: start; }
.grid12.fill { grid-auto-rows: minmax(0, 1fr); align-content: stretch; }
.grid12.fill > .blk, .grid12[style*="grid-template-rows"] > .blk { overflow: hidden; }
.grid12 > .blk { grid-column: span var(--span, 12); min-width: 0; min-height: 0; }
.grid12 > .blk[style*="--start"] { grid-column-start: var(--start); grid-column-end: span var(--span, 12); }
.grid12 > .blk[style*="--rows"] { grid-row: span var(--rows); }
.blk { position: relative; }
.blk.keep { break-inside: avoid; }
.blk.bottom { align-self: end; } .blk.middle { align-self: center; } .blk.stretch { align-self: stretch; }
.blk.pad { padding: var(--s2); } .blk.pad-lg { padding: var(--s4); }
.blk.box { border: var(--rule-w) solid var(--ink); } .blk.fill { background: var(--surface); }
.blk.rule-top { border-top: var(--rule-strong) solid var(--ink); padding-top: var(--s1); }
.blk.rule-bottom { border-bottom: var(--rule-w) solid var(--ink); padding-bottom: var(--s1); }
.blk.rule-left { border-left: var(--rule-strong) solid var(--accent); padding-left: var(--s2); }
.blk.full-bleed { margin: calc(-1 * var(--m-top)) calc(-1 * var(--m-right)) calc(-1 * var(--m-bottom)) calc(-1 * var(--m-left)); }
.blk.diag { border: 2px dashed var(--neg); color: var(--neg); padding: var(--s1); font-family: var(--font-mono); font-size: var(--small); }

/* ── Blocks ────────────────────────────────────────────────────────────── */
/* hero: one word, one line, one number. The Swiss poster inside the report. */
.hero { display: flex; flex-direction: column; justify-content: flex-end; min-height: 0; }
.hero .hero-title { font-size: var(--h1); line-height: 1.02; margin: 0 0 var(--s2); }
.hero .hero-word { font-family: var(--font-display); font-weight: var(--display-weight); font-size: var(--hero-size, var(--hero)); line-height: .92; letter-spacing: -0.035em; text-transform: var(--hero-transform, var(--display-transform)); margin: 0 0 var(--s2) -0.04em; overflow-wrap: anywhere; hyphens: manual; }
.hero .hero-word.accent { color: var(--accent); }
.hero .hero-word.outline { color: transparent; -webkit-text-stroke: 1.5pt var(--ink); }
.hero .hero-kicker { margin-bottom: var(--s2); }
.hero .hero-dek { font-size: var(--h5); line-height: 1.3; max-width: 34em; color: var(--ink-2); }
.hero.top { justify-content: flex-start; } .hero.center { justify-content: center; }
.hero.xl .hero-word { font-size: calc(var(--hero) * 1.8); } .hero.lg .hero-word { font-size: calc(var(--hero) * 1.35); }
.hero.md .hero-word { font-size: var(--h1); } .hero.sm .hero-word { font-size: var(--h2); }
.hero.stack .hero-word { display: block; }
.hero .hero-rule { border-top: var(--rule-strong) solid var(--ink); width: 20%; margin: 0 0 var(--s3); }
.hero .hero-meta { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); margin-top: var(--s3); font-size: var(--small); }
.hero .hero-meta b { display: block; font-size: var(--tiny); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); font-weight: 600; }

.heading { margin: 0 0 var(--s2); break-after: avoid; }
.heading .label { display: block; margin-bottom: calc(var(--s1) * .6); }
.heading.numbered { display: grid; grid-template-columns: 2.4em 1fr; gap: var(--gutter); }
.heading.numbered .n { font-family: var(--font-display); color: var(--accent); font-weight: var(--display-weight); font-variant-numeric: tabular-nums; }
.heading.ruled { border-top: var(--rule-strong) solid var(--ink); padding-top: var(--s1); }
.heading.section { border-top: var(--rule-strong) solid var(--ink); padding-top: var(--s2); }
.heading.section h1, .heading.section h2 { font-size: var(--h2); }
.heading .dek { font-size: var(--h5); color: var(--ink-2); margin-top: var(--s1); line-height: 1.3; }

.text { hyphens: auto; }
.text.justify p { text-align: justify; }
.text.lead { font-size: var(--h5); line-height: 1.4; color: var(--ink-2); }
.text.lead p:first-child::first-letter { font-family: var(--font-display); }
.text.dropcap:not(.cont) > p:first-of-type:not([data-cont])::first-letter { font-family: var(--font-display); font-weight: var(--display-weight); font-size: 3.2em; float: left; line-height: .82; padding: .06em .08em 0 0; color: var(--accent); }
.text.small { font-size: var(--small); }
.text.mono { font-family: var(--font-mono); font-size: var(--small); }
.text h1, .text h2, .text h3, .text h4 { margin: var(--s3) 0 var(--s1); }
.text h1:first-child, .text h2:first-child, .text h3:first-child { margin-top: 0; }
.text h2 { font-size: var(--h3); } .text h3 { font-size: var(--h4); } .text h4 { font-size: var(--h5); }
.text img { display: block; margin: var(--s2) 0; }
.text table { margin: var(--s1) 0 var(--s2); font-size: var(--small); }
.text sup { font-size: .7em; line-height: 0; }
.text .footnotes { font-size: var(--small); color: var(--ink-2); border-top: var(--rule-w) solid var(--ink); padding-top: var(--s1); margin-top: var(--s3); }

.stat { display: flex; flex-direction: column; gap: calc(var(--s1) * .5); }
.stat .stat-value { font-family: var(--font-display); font-weight: var(--display-weight); font-size: var(--stat-size, var(--h1)); line-height: .95; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.stat .stat-value small { font-size: .45em; font-weight: 600; letter-spacing: 0; margin-left: .1em; }
.stat .stat-label { font-size: var(--small); color: var(--ink-2); }
.stat .stat-delta { font-size: var(--small); font-weight: 600; } .stat .stat-delta.up { color: var(--pos); } .stat .stat-delta.down { color: var(--neg); }
.stat.ruled { border-top: var(--rule-strong) solid var(--ink); padding-top: var(--s1); }
.stat.accent .stat-value { color: var(--accent); }
.stat.sm .stat-value { font-size: var(--h3); } .stat.lg .stat-value { font-size: var(--hero); }
.stats { display: grid; gap: var(--s2) var(--gutter); grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); }
.stat .spark { height: calc(var(--module) * 1.6); margin-top: calc(var(--s1) * .5); }

.quote { }
.quote .q { font-family: var(--font-display); font-weight: 500; font-size: var(--quote-size, var(--h3)); line-height: 1.2; letter-spacing: -0.01em; margin: 0 0 var(--s2); text-indent: -0.4em; overflow-wrap: break-word; hyphens: auto; }
.quote .q::before { content: "“"; color: var(--accent); }
.quote .q::after { content: "”"; color: var(--accent); }
.quote .who { font-size: var(--small); } .quote .who b { display: block; font-weight: 700; }
.quote.big .q { font-size: var(--h1); line-height: 1.05; }
.quote.mark::before { content: "“"; display: block; font-family: var(--font-display); font-size: calc(var(--h1) * 2); line-height: .5; color: var(--accent); margin-bottom: var(--s2); }

.callout { border: var(--rule-w) solid var(--ink); padding: var(--s2); }
.callout .label { margin-bottom: calc(var(--s1) * .6); display: block; }
.callout.tint { background: var(--surface); border: 0; }
.callout.accent { background: var(--accent); color: var(--accent-ink); border: 0; }
.callout.accent .label { color: var(--accent-ink); opacity: .85; }
.callout.left { border: 0; border-left: var(--rule-strong) solid var(--accent); padding-left: var(--s2); }
.callout > :last-child { margin-bottom: 0; }

.list { }
.list ul, .list ol { list-style: none; padding: 0; margin: 0; }
.list li { display: grid; grid-template-columns: 2.2em 1fr; gap: var(--s1); padding: calc(var(--s1) * .8) 0; border-top: var(--rule-w) solid var(--line); margin: 0; }
.list li:first-child { border-top: var(--rule-strong) solid var(--ink); }
.list li .n { font-family: var(--font-display); font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; }
.list li b { display: block; }
.list.compact li { padding: calc(var(--s1) * .35) 0; }
.list.plain li { border: 0; padding: calc(var(--s1) * .3) 0; }
.list.check li .n { color: var(--pos); }
.list.cols-2 ul, .list.cols-2 ol { columns: 2; column-gap: var(--gutter); } .list.cols-2 li { break-inside: avoid; }

.figure img { display: block; width: 100%; height: auto; max-height: var(--fig-h, none); }
.figure.contain img { object-fit: contain; width: auto; max-width: 100%; height: var(--fig-h, auto); margin: 0 auto; }
.figure.cover img { object-fit: cover; height: var(--fig-h, auto); width: 100%; }
.figure.fillbox { height: 100%; } .figure.fillbox img { height: 100%; object-fit: cover; }
.figure .placeholder { background: var(--surface); display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: var(--small); aspect-ratio: var(--ar, 3 / 2); overflow: hidden; }
.figure .placeholder svg { width: 100%; height: 100%; }
.figure figcaption { display: grid; grid-template-columns: auto 1fr; gap: var(--s1); }
.figure figcaption .fn { font-family: var(--font-display); font-weight: 700; color: var(--ink); }
.figure.mono img { filter: grayscale(1) contrast(1.05); }
.figure.duotone img { filter: grayscale(1) contrast(1.1); mix-blend-mode: multiply; }
.figure.duotone { background: var(--accent); }
.figure.frame img { border: var(--rule-w) solid var(--ink); }

.chart { display: flex; flex-direction: column; min-height: 0; }
.chart .chart-title { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); margin-bottom: calc(var(--s1) * .5); }
.chart .chart-sub { font-size: var(--small); color: var(--muted); margin-bottom: var(--s1); }
.chart .plot { flex: 1 1 auto; min-height: 0; width: 100%; }
.chart .plot svg, .chart .plot figure { max-width: 100%; }
.chart .plot [class*="-swatches"] { font-size: var(--small); }
.chart .plot text { font-family: var(--font-body); }
.chart .source { font-size: var(--tiny); color: var(--muted); margin-top: var(--s1); text-transform: uppercase; letter-spacing: .06em; }
.chart svg { display: block; overflow: visible; }

.map { display: flex; flex-direction: column; min-height: 0; }
.map .map-box { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; background: var(--surface); }
/* the d3 map is the box's own svg; Leaflet's overlay svg lives in a 0×0 pane and must keep its own size */
.map .map-box > svg { display: block; width: 100%; height: 100%; }
.map .map-box .leaflet-container { width: 100%; height: 100%; font: inherit; }
.map .legend { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s2); font-size: var(--tiny); margin-top: var(--s1); }
.map .legend i { display: inline-block; width: 1em; height: 1em; margin-right: .35em; vertical-align: -0.15em; }

.diagram .mermaid, .diagram svg { max-width: 100%; }
.diagram svg { height: auto; display: block; margin: 0 auto; }
.diagram { text-align: center; }
.diagram .chart-title { text-align: left; }

.table { font-size: var(--table-size, var(--small)); }
.table .chart-title { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); margin-bottom: var(--s1); }
.table table { width: 100%; }
.table.zebra tbody tr:nth-child(even) { background: var(--surface); }
.table.dense th, .table.dense td { padding: calc(var(--s1) * .4) calc(var(--s1) * .6); }
.table.lines td { border-bottom: var(--rule-w) solid var(--ink); }
.table tfoot td, .table tr.total td { font-weight: 700; border-top: var(--rule-strong) solid var(--ink); border-bottom: 0; }
.table tr.group td { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: var(--tiny); padding-top: var(--s2); border-bottom: var(--rule-w) solid var(--ink); }
.table tr.subtotal td { font-weight: 600; background: var(--surface); border-bottom: var(--rule-w) solid var(--ink); }
.table td.rn { color: var(--muted); width: 2.2em; }
.table .chart-title .cont, .table .label.cont { color: var(--muted); font-weight: 400; text-transform: none; letter-spacing: 0; }
.table .label.cont { margin-bottom: var(--s1); }
.table thead { break-inside: avoid; }
.table td.bar { padding-right: 0; } .table td.bar i { display: block; height: .8em; background: var(--accent); }
.table .source { font-size: var(--tiny); color: var(--muted); margin-top: var(--s1); text-transform: uppercase; letter-spacing: .06em; }

.kv { display: grid; grid-template-columns: max-content 1fr; gap: 0 var(--s2); font-size: var(--small); }
.kv > div { padding: calc(var(--s1) * .6) 0; border-bottom: var(--rule-w) solid var(--line); }
.kv > .k { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; font-size: var(--tiny); color: var(--muted); padding-top: calc(var(--s1) * .8); }
.kv.box { border-top: var(--rule-strong) solid var(--ink); }

.tree .chart-title { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); margin-bottom: var(--s1); }
.tree ul { list-style: none; margin: 0; padding: 0; }
.tree li { margin: 0; padding: 0; position: relative; }
.tree .node { display: flex; align-items: baseline; gap: .5em; padding: calc(var(--s1) * .45) 0; }
.tree .node .lbl { font-weight: 600; } .tree .node.leaf .lbl { font-weight: 400; }
.tree .node .txt { color: var(--ink-2); font-size: var(--small); flex: 1 1 auto; }
.tree .node .val { margin-left: auto; font-family: var(--font-display); font-weight: 700; }
.tree .node .badge { font-size: var(--tiny); text-transform: uppercase; letter-spacing: .08em; background: var(--surface); padding: 1px 6px; }
.tree .node .ic { color: var(--accent); }
.tree.lines ul ul { margin-left: 1.1em; padding-left: 1em; border-left: var(--rule-w) solid var(--line); }
.tree.lines ul ul > li::before { content: ""; position: absolute; left: -1em; top: calc(var(--s1) * .45 + .6em); width: .7em; border-top: var(--rule-w) solid var(--line); }
.tree.lines > ul > li > .node { border-top: var(--rule-w) solid var(--ink); }
.tree.outline ul { counter-reset: t; } .tree.outline li { counter-increment: t; }
.tree.outline .node::before { content: counters(t, ".") "."; font-family: var(--font-display); font-weight: 700; color: var(--accent); min-width: 2.6em; font-variant-numeric: tabular-nums; }
.tree.outline ul ul { margin-left: 2.6em; }
.tree details > summary { list-style: none; cursor: pointer; } .tree details > summary::-webkit-details-marker { display: none; }
.tree details > summary .node .lbl::before { content: "▸ "; color: var(--muted); } .tree details[open] > summary .node .lbl::before { content: "▾ "; }
.list.outline li .n { min-width: 2.4em; }
.list.outline ol.sub { margin: calc(var(--s1) * .5) 0 0; padding: 0; grid-column: 1 / -1; }
.list.outline ol.sub li { border-top: var(--rule-w) solid var(--line); padding-left: 1.2em; grid-template-columns: 3em 1fr; }
.list.outline li { grid-template-columns: 2.4em 1fr; } .list.outline li > ol.sub { grid-column: 2; }
.bullets .bullet, .funnel .step { display: grid; grid-template-columns: 9em 1fr 4em; gap: var(--s1); align-items: center; padding: calc(var(--s1) * .5) 0; border-bottom: var(--rule-w) solid var(--line); font-size: var(--small); }
.bullets .track { position: relative; height: 1em; background: var(--surface); }
.bullets .track .range { position: absolute; left: 0; top: 0; height: 100%; background: var(--surface-2); }
.bullets .track .bar { position: absolute; left: 0; top: 25%; height: 50%; background: var(--accent); }
.bullets.progress .track .bar { top: 0; height: 100%; }
.bullets .track .mark { position: absolute; top: -15%; height: 130%; width: 2px; background: var(--ink); }
.bullets .val, .funnel .val { text-align: right; font-weight: 600; } .funnel .val small { color: var(--muted); font-weight: 400; }
.funnel .track i { display: block; height: 1.1em; background: var(--accent); margin: 0 auto; }
.timeline { position: relative; }
.timeline ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.timeline.vertical li { display: grid; grid-template-columns: 6em 1fr; gap: var(--s2); padding: var(--s1) 0 var(--s2); position: relative; margin: 0; }
.timeline.vertical li::before { content: ""; position: absolute; left: calc(6em + var(--s2) - .5em - 3px); top: 0; bottom: 0; width: 2px; background: var(--line); }
.timeline.vertical li .dot { position: absolute; left: calc(6em + var(--s2) - .5em - 6px); top: calc(var(--s1) + .35em); width: 8px; height: 8px; background: var(--accent); border-radius: 50%; }
.timeline.vertical li .when { font-family: var(--font-display); font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; padding-right: var(--s2); }
.timeline.vertical li .what { padding-left: var(--s2); } .timeline li .what b { display: block; }
.timeline.horizontal ol { grid-auto-flow: column; grid-auto-columns: 1fr; border-top: var(--rule-strong) solid var(--ink); }
.timeline.horizontal li { padding: var(--s2) var(--s1) 0 0; position: relative; margin: 0; }
.timeline.horizontal li::before { content: ""; position: absolute; top: -5px; left: 0; width: 8px; height: 8px; background: var(--accent); border-radius: 50%; }
.timeline.horizontal li .when { font-family: var(--font-display); font-weight: 700; display: block; margin-bottom: calc(var(--s1) * .5); }

.form fieldset { border: 0; padding: 0; margin: 0 0 var(--s2); min-width: 0; }
.form legend { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); text-transform: uppercase; letter-spacing: .08em; padding: 0; margin-bottom: var(--s1); border-bottom: var(--rule-strong) solid var(--ink); width: 100%; }
.form .fields { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s2) var(--gutter); }
.form .field { grid-column: span var(--w, 12); display: flex; flex-direction: column; gap: calc(var(--s1) * .4); min-width: 0; }
.form .field > label { font-size: var(--tiny); text-transform: uppercase; letter-spacing: .08em; font-family: var(--font-display); font-weight: 600; color: var(--ink-2); }
.form .field .req { color: var(--accent); }
.form .field .help { font-size: var(--tiny); color: var(--muted); }
.form input, .form select, .form textarea { font: inherit; color: inherit; background: var(--paper); border: 0; border-bottom: var(--rule-w) solid var(--ink); padding: calc(var(--s1) * .6) 0; outline: 0; border-radius: 0; width: 100%; }
.form textarea { min-height: calc(var(--module) * 4); resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { border-bottom: var(--rule-strong) solid var(--accent); }
.form .choices { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s2); }
.form .choices label { display: inline-flex; align-items: center; gap: .4em; font-size: var(--small); }
.form .choices input { width: auto; }
.form .write { border-bottom: var(--rule-w) solid var(--ink); height: calc(var(--module) * 1.4); }
.form .write.lines { height: auto; border: 0; background: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--module) * 1.4 - 1px), var(--ink) calc(var(--module) * 1.4 - 1px), var(--ink) calc(var(--module) * 1.4)); min-height: calc(var(--module) * 4.2); }
.form .boxes { display: flex; gap: 2px; } .form .boxes i { width: calc(var(--module) * 1.3); height: calc(var(--module) * 1.5); border: var(--rule-w) solid var(--ink); }
.form .check { display: inline-block; width: 1em; height: 1em; border: var(--rule-w) solid var(--ink); vertical-align: -0.15em; margin-right: .4em; }
.form .check.on { background: var(--ink); }
.form .signature { height: calc(var(--module) * 3.4); border-bottom: var(--rule-w) solid var(--ink); display: flex; align-items: flex-end; }
.form .signature canvas { width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.form .actions { display: flex; gap: var(--s1); margin-top: var(--s2); }
.form button, .btn { font: inherit; font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: var(--small); background: var(--ink); color: var(--paper); border: 0; padding: calc(var(--s1) * .9) var(--s3); cursor: pointer; border-radius: var(--radius); }
.form button.secondary, .btn.secondary { background: transparent; color: var(--ink); border: var(--rule-w) solid var(--ink); }
.form .status { font-size: var(--small); color: var(--muted); align-self: center; }
.form.print .field > label { color: var(--ink); }
.form .office { border: var(--rule-w) solid var(--ink); padding: var(--s1); font-size: var(--tiny); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); display: grid; grid-template-columns: repeat(var(--n, 3), 1fr); gap: var(--s1); }
.form .office > div { min-height: calc(var(--module) * 2); }

.svgblock svg { width: 100%; height: auto; display: block; }
.svgblock.fillbox, .svgblock.fillbox svg { height: 100%; }
.drawing svg { width: 100%; height: auto; display: block; font-family: var(--font-mono); }
.drawing.fillbox { height: 100%; } .drawing.fillbox svg { height: 100%; }
.drawing .dim { stroke: var(--ink); stroke-width: .3; fill: none; }
.drawing .dim-text { font-size: 3px; fill: var(--ink); text-anchor: middle; }
.drawing .outline { stroke: var(--ink); stroke-width: .7; fill: none; }
.drawing .hidden { stroke: var(--ink); stroke-width: .35; stroke-dasharray: 2 1; fill: none; }
.drawing .centre { stroke: var(--ink); stroke-width: .25; stroke-dasharray: 6 1 1 1; fill: none; }
.drawing .hatch { fill: url(#hatch); stroke: var(--ink); stroke-width: .5; }
.drawing .fine { stroke: var(--ink); stroke-width: .18; fill: none; }

.titleblock { border: 0.5mm solid var(--ink); font-family: var(--font-mono); font-size: 7pt; display: grid; grid-template-columns: repeat(6, 1fr); }
.titleblock > div { border-right: 0.25mm solid var(--ink); border-bottom: 0.25mm solid var(--ink); padding: 1.2mm 2mm; min-height: 8mm; }
.titleblock > div:nth-child(6n) { border-right: 0; }
.titleblock > div.w2 { grid-column: span 2; } .titleblock > div.w3 { grid-column: span 3; } .titleblock > div.w4 { grid-column: span 4; } .titleblock > div.w6 { grid-column: span 6; border-right: 0; }
.titleblock > div.h2 { grid-row: span 2; }
.titleblock > div b { display: block; font-size: 5.5pt; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 400; margin-bottom: .6mm; }
.titleblock > div .big { font-family: var(--font-display); font-size: 11pt; font-weight: 700; }
.titleblock .last { border-bottom: 0; }

.observable .cell { margin-bottom: var(--s2); }
.observable .cell:last-child { margin-bottom: 0; }
.observable .cell-name { font-family: var(--font-mono); font-size: var(--tiny); color: var(--muted); margin-bottom: calc(var(--s1) * .3); }
.observable form, .observable label { font: inherit; }
.observable .cell pre { margin: 0; }
.observable .cell.error { color: var(--neg); font-family: var(--font-mono); font-size: var(--small); }
.observable input[type=range] { width: 100%; }

.toc ol { list-style: none; padding: 0; margin: 0; }
.toc li { display: grid; grid-template-columns: 2.2em 1fr auto; gap: var(--s1); align-items: baseline; padding: calc(var(--s1) * .7) 0; border-bottom: var(--rule-w) solid var(--line); margin: 0; }
.toc li.l1 { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); }
.toc li.l2 { font-size: var(--small); padding-left: 2.2em; grid-template-columns: 1fr auto; }
.toc li .n { font-family: var(--font-display); color: var(--accent); font-weight: 700; font-variant-numeric: tabular-nums; }
.toc li .pg { font-variant-numeric: tabular-nums; font-family: var(--font-display); font-weight: 600; }
.toc.dots li .t { position: relative; overflow: hidden; }
.toc.dots li .t::after { content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ."; position: absolute; white-space: nowrap; padding-left: .3em; color: var(--muted); }
.toc.big li { font-size: var(--h4); padding: var(--s1) 0; border-bottom: var(--rule-strong) solid var(--ink); }
.toc.big li.l2 { font-size: var(--h6); border-bottom: var(--rule-w) solid var(--line); }

.rule { border-top: var(--rule-w) solid var(--ink); } .rule.strong { border-top-width: var(--rule-strong); } .rule.accent { border-color: var(--accent); }
.rule.hair { border-color: var(--line); } .rule.thick { border-top-width: 3pt; }
.spacer { height: var(--h, var(--s4)); }

.index { display: flex; justify-content: space-between; gap: var(--s2); font-family: var(--font-display); font-size: var(--tiny); text-transform: uppercase; letter-spacing: .12em; color: var(--muted); border-top: var(--rule-strong) solid var(--ink); padding-top: calc(var(--s1) * .7); font-weight: 600; }
.index b { color: var(--ink); } .index .accent { color: var(--accent); }
.index.bottom { border-top: 0; border-bottom: var(--rule-w) solid var(--ink); padding: 0 0 calc(var(--s1) * .7); }
.index.marks { justify-content: flex-start; gap: var(--s4); }

.signature-block { display: grid; grid-template-columns: repeat(var(--n, 2), 1fr); gap: var(--s6) var(--s4); padding-top: var(--s8); }
.signature-block .sig { border-top: var(--rule-w) solid var(--ink); padding-top: var(--s1); font-size: var(--small); }
.signature-block .sig b { display: block; text-transform: uppercase; letter-spacing: .04em; font-family: var(--font-display); }
.signature-block .sig .role { color: var(--ink-2); }
.signature-block .sig img { display: block; height: calc(var(--module) * 3); margin-bottom: calc(-1 * var(--s1)); }

.qr { display: flex; gap: var(--s2); align-items: center; }
.qr .code { flex: 0 0 auto; width: var(--qr-size, 22mm); }
.qr .code svg, .qr .code img { display: block; width: 100%; height: auto; }
.qr .qr-text { font-size: var(--small); min-width: 0; overflow-wrap: anywhere; } .qr .qr-text b { display: block; }

.columns { display: grid; gap: var(--s2) var(--gutter); grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); }
.columns > .blk { min-width: 0; }
.columns.ruled > .blk + .blk { border-left: var(--rule-w) solid var(--line); padding-left: var(--gutter); }

.htmlblock { }

/* ── Web mode: the same blocks, flowing ─────────────────────────────────── */
body[data-mode="web"] { --fs: 17px; }
@media (max-width: 640px) { body[data-mode="web"] { --fs: 16px; } }
.web { max-width: var(--web-max, 1180px); margin: 0 auto; padding: 0 clamp(16px, 4vw, 48px); }
.web-masthead { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--s2); padding: var(--s2) 0; border-bottom: var(--rule-w) solid var(--ink); font-family: var(--font-display); font-size: var(--tiny); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); position: sticky; top: 0; background: var(--paper); z-index: 20; }
.web-masthead .c { text-align: center; } .web-masthead .r { text-align: right; }
.web-masthead .logo { height: 28px; width: auto; vertical-align: middle; }
.web-masthead a:hover { color: var(--accent); }
.web-page { padding: var(--s6) 0; border-bottom: var(--rule-w) solid var(--line); position: relative; }
.web-page[data-layout="cover"] { min-height: min(92vh, 900px); display: flex; flex-direction: column; justify-content: center; border-bottom: var(--rule-strong) solid var(--ink); }
.web-page .grid12 { position: static; }
.web-page .flow { position: static; display: block; }
.web-page .flow.cols-2, .web-page .flow.cols-3 { columns: var(--n, 1); column-gap: var(--gutter); }
.web-page .flow > .col { overflow: visible; height: auto; }
.web-page .flow.cols-2 > .col, .web-page .flow.cols-3 > .col { display: contents; }
.web-page .flow .blk { break-inside: avoid; margin-bottom: var(--s2); }
.web-page .flow .text { break-inside: auto; }
.web-page .blk.full-bleed { margin: 0 calc(50% - 50vw); padding: 0 clamp(16px, 4vw, 48px); }
.web-page .hero .hero-word { font-size: clamp(2.6rem, 12vw, var(--hero-size, calc(var(--hero) * 1.4))); }
.web-page .hero.xl .hero-word { font-size: clamp(3rem, 16vw, calc(var(--hero) * 2.4)); }
.web-footer { padding: var(--s4) 0 var(--s8); font-size: var(--small); color: var(--muted); display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); justify-content: space-between; }
.web-nav { position: fixed; left: 0; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 6px; padding: 8px; z-index: 20; }
.web-nav a { width: 8px; height: 8px; border-radius: 50%; background: var(--line); display: block; }
.web-nav a.on, .web-nav a:hover { background: var(--accent); }
@media (max-width: 900px) {
  .web-page .grid12 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .web-page .grid12 > .blk { grid-column: span min(var(--span, 12), 6) !important; grid-column-start: auto !important; }
  .web-page .flow.cols-3 { columns: 2; }
  .web .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .web-nav { display: none; }
}
@media (max-width: 640px) {
  .web-page .grid12 { grid-template-columns: 1fr; }
  .web-page .grid12 > .blk { grid-column: span 1 !important; }
  .web-page .flow.cols-2, .web-page .flow.cols-3 { columns: 1; }
  .web .columns { grid-template-columns: 1fr; } .web .columns.ruled > .blk + .blk { border-left: 0; padding-left: 0; }
  .web .stats { grid-template-columns: 1fr 1fr; }
  .web-masthead { grid-template-columns: 1fr auto; } .web-masthead .c { display: none; }
  .web .timeline.horizontal ol { grid-auto-flow: row; }
  .web .kv { grid-template-columns: 1fr; } .web .kv > .k { border: 0; padding-bottom: 0; }
  .web .signature-block { grid-template-columns: 1fr; }
  .web .form .field { grid-column: span 12 !important; }
  .web .list.cols-2 ul, .web .list.cols-2 ol { columns: 1; }
}
.web-page .blk.web-hide, .sheet .blk.print-hide { display: none; }
.web .table { overflow-x: auto; } .web .table table { min-width: 100%; }
.web .chart .plot, .web .map .map-box { overflow-x: auto; }
.web .bullets .bullet, .web .funnel .step { grid-template-columns: minmax(6em, 9em) 1fr 4em; }

/* ── Chrome: the toolbar that is never printed ─────────────────────────── */
.swiss-bar { position: fixed; right: 12px; bottom: 12px; z-index: 50; display: flex; gap: 6px; align-items: center; font: 12px/1 var(--font-body); background: rgba(20,20,20,.92); color: #fff; padding: 8px 10px; border-radius: 999px; box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.swiss-bar button, .swiss-bar a, .swiss-bar select { font: inherit; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; padding: 5px 10px; cursor: pointer; }
.swiss-bar button:hover, .swiss-bar a:hover { background: rgba(255,255,255,.15); }
.swiss-bar .badge { padding: 4px 8px; border-radius: 999px; background: var(--accent); font-weight: 700; }
.swiss-bar .badge.warn { background: #e3a008; color: #111; }
.swiss-toast { position: fixed; left: 50%; bottom: 64px; transform: translateX(-50%); z-index: 60; background: #111; color: #fff; padding: 10px 16px; font: 13px/1.4 var(--font-body); max-width: min(520px, 90vw); border-radius: 6px; box-shadow: 0 6px 24px rgba(0,0,0,.3); }
.swiss-diag { position: fixed; left: 12px; bottom: 12px; z-index: 50; max-width: min(520px, 90vw); max-height: 40vh; overflow: auto; background: #fff; color: #111; border: 2px solid #b3261e; padding: 10px 12px; font: 12px/1.4 var(--font-mono); box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.swiss-diag h4 { margin: 0 0 6px; font: 700 12px/1.2 var(--font-display); text-transform: uppercase; letter-spacing: .08em; color: #b3261e; }
.swiss-diag li { margin: 0 0 4px; }
.swiss-diag li.warn { color: #8a5a00; }
.swiss-help { max-width: 860px; margin: 0 auto; padding: 48px 24px; font-size: 16px; overflow-wrap: anywhere; }
.swiss-help table { table-layout: fixed; } .swiss-help td, .swiss-help li { word-break: break-word; }
.swiss-help h1 { font-size: 40px; margin-bottom: 16px; } .swiss-help h2 { font-size: 24px; margin: 32px 0 8px; }
.swiss-help table { font-size: 14px; } .swiss-help code { background: var(--surface); padding: 1px 5px; }
.swiss-help a { text-decoration: underline; }
.swiss-help .cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.swiss-help .card { border: 1px solid var(--ink); padding: 16px; } .swiss-help .card b { display: block; font-family: var(--font-display); font-size: 18px; margin-bottom: 6px; }
.swiss-help .card small { color: var(--muted); display: block; margin-bottom: 8px; }

@media print {
  body { background: #fff !important; }
  .sheets { display: block; padding: 0; gap: 0; }
  .sheet { box-shadow: none; margin: 0; outline: 0; }
  .swiss-bar, .swiss-diag, .web-nav, .no-print { display: none !important; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body[data-mode="web"] { --fs: 10.5pt; }
  body[data-mode="web"] .web { max-width: none; padding: 0 12mm; }
  body[data-mode="web"] .web-masthead { position: static; }
  body[data-mode="web"] .web-page { break-before: page; break-inside: auto; padding: 8mm 0; border: 0; }
  body[data-mode="web"] .web-page:first-of-type { break-before: auto; }
  body[data-mode="web"] .web-page[data-layout="cover"] { min-height: 0; }
  body[data-mode="web"] .web-page .blk { break-inside: avoid; }
  body[data-mode="web"] .web-page .flow.cols-2, body[data-mode="web"] .web-page .flow.cols-3 { columns: var(--n, 1); }
  body[data-mode="web"] .web-footer { break-before: avoid; }
}
@media screen { body[data-scale] .sheets { zoom: var(--zoom, 1); } }

/* ── the radar kit: monitoring blocks ─────────────────────────────────────── */
.kit-tip { position: fixed; z-index: 9999; display: none; max-width: 30ch; padding: 6px 9px; background: var(--ink); color: var(--paper); font: 400 11.5px/1.35 var(--font-body); border-radius: 4px; pointer-events: none; box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.kit-tip .muted { opacity: .72; margin-top: 2px; } .kit-tip.leaflet-tooltip { position: absolute; display: block; border: 0; }
.kit-empty { padding: var(--s2); color: var(--muted); font-size: var(--small); text-align: center; }
.kit-tools { display: flex; gap: 6px; justify-content: flex-end; margin-bottom: 6px; }
.kit-btn { font: 600 11px/1 var(--font-display); letter-spacing: .02em; padding: 5px 9px; border: var(--rule-w) solid var(--line); background: var(--paper); color: var(--ink); border-radius: 3px; cursor: pointer; } .kit-btn.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.kit-legend { display: flex; flex-wrap: wrap; gap: 4px var(--s2); font-size: var(--tiny); margin-top: var(--s1); color: var(--ink-2); }
.kit-legend i { display: inline-block; width: .8em; height: .8em; border-radius: 50%; margin-right: .4em; vertical-align: -0.05em; } .kit-legend b { margin-left: .3em; color: var(--ink); }
.sel { cursor: pointer; }
/* radar */
.radar { display: flex; flex-direction: column; min-height: 0; }
.radar .chart-title { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); margin-bottom: calc(var(--s1) * .5); } .radar .chart-sub { font-size: var(--small); color: var(--muted); margin-bottom: var(--s1); }
.radar .radar-box { position: relative; width: 100%; flex: 1 1 auto; min-height: 0; }
.radar .rd { display: block; overflow: visible; }
.rd-disc { fill: var(--surface); stroke: var(--line); stroke-width: .8; }
.rd-ring { fill: none; stroke: var(--line); stroke-width: .7; } .rd-sep { stroke: var(--line); stroke-width: .6; stroke-dasharray: 2 3; }
.rd-ringlbl { font: 500 8.5px var(--font-body); fill: var(--muted); } .rd-cat { font: 700 10px var(--font-display); letter-spacing: .01em; }
.rd-centre { fill: var(--ink); }
.rd-item .rd-halo { opacity: 0; } .rd-item .rd-dot { stroke: var(--paper); stroke-width: 1.2; }
.rd-item.pulse .rd-halo { opacity: .25; animation: rd-pulse 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.rd-item.sel:hover .rd-dot { stroke: var(--ink); stroke-width: 2; }
.rd-sweep { transform-box: view-box; transform-origin: 50% 50%; animation: rd-spin 7s linear infinite; pointer-events: none; }
.rd-beam { stroke: var(--accent); stroke-width: 1.2; opacity: .8; }
@keyframes rd-spin { to { transform: rotate(360deg); } }
@keyframes rd-pulse { 0% { transform: scale(.6); opacity: .35; } 100% { transform: scale(1.5); opacity: 0; } }
/* sankey */
.sk-link { fill: none; stroke-opacity: .38; transition: stroke-opacity .15s; } .sk-link.dim { stroke-opacity: .07; } .sk-link:hover { stroke-opacity: .7; }
.sk-node rect { stroke: var(--paper); stroke-width: .6; } .sk-label { font: 500 9.5px var(--font-body); fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; } .sk-label.small { font-size: 7px; fill: var(--ink-2); }
.sankey.chart .plot svg, .wordcloud.chart .plot svg, .network.chart .plot svg, .atlas.chart .plot svg { display: block; width: 100%; height: 100%; }
/* wordcloud */
.wc-word { font-weight: 700; cursor: default; } .wc-word.sel:hover { text-decoration: underline; }
/* network */
.nw-link { stroke: var(--line); stroke-opacity: .9; } .nw-node circle { stroke: var(--paper); stroke-width: 1; }
.nw-label { font: 500 9px var(--font-body); fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; pointer-events: none; }
.nw.focus .nw-node:not(.lit) { opacity: .18; } .nw.focus .nw-link:not(.lit) { stroke-opacity: .12; } .nw.focus .nw-link.lit { stroke: var(--ink); }
.nw-cosmo { width: 100%; }
/* ticker */
.ticker { position: relative; overflow: hidden; white-space: nowrap; border-top: var(--rule-strong) solid var(--ink); border-bottom: var(--rule-w) solid var(--line); padding: calc(var(--s1) * .7) 0; font-family: var(--font-display); }
.ticker .tk-track { display: inline-flex; gap: var(--s4); animation: tk-scroll var(--tk-dur, 40s) linear infinite; will-change: transform; }
.ticker.pausable:hover .tk-track { animation-play-state: paused; }
.tk-item { display: inline-flex; align-items: baseline; gap: .55em; color: inherit; text-decoration: none; }
.tk-tag { font-size: .72em; letter-spacing: .04em; color: var(--accent); } .tk-text { font-weight: 600; } .tk-sub { font-size: .78em; color: var(--muted); font-family: var(--font-body); }
.ticker.lg { font-size: calc(var(--fs) * 1.6); } .ticker.xl { font-size: calc(var(--fs) * 2.2); }
.ticker.static { white-space: normal; display: grid; gap: calc(var(--s1) * .6); } .ticker.static .tk-item { display: flex; }
@keyframes tk-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
/* pictogram */
.pictogram .chart-title { font-family: var(--font-display); font-weight: 700; font-size: var(--h6); margin-bottom: var(--s1); }
.pg-rows { display: grid; grid-template-columns: repeat(var(--n, 1), minmax(0, 1fr)); gap: calc(var(--s1) * .6) var(--gutter); }
.pg-row { display: grid; grid-template-columns: var(--lbl, 9em) 1fr auto; align-items: center; gap: var(--s1); padding: calc(var(--s1) * .4) 0; border-bottom: var(--rule-w) solid var(--line); }
.pg-label { font-size: var(--small); color: var(--ink-2); } .pg-icons { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; line-height: 0; } .pg-i { display: inline-block; }
.pg-part { display: inline-block; overflow: hidden; height: 20px; vertical-align: top; } .pg-more { font: 600 var(--tiny) var(--font-display); color: var(--muted); margin-left: 4px; line-height: 20px; }
.pg-value { font-family: var(--font-display); font-weight: 700; text-align: right; } .pg-value small { font-size: .7em; font-weight: 600; margin-left: .15em; }
.pg-note { font-size: var(--tiny); color: var(--muted); margin-top: var(--s1); display: flex; gap: .3em; align-items: center; }
/* bignumber */
.bignum { --bn: var(--accent); display: flex; flex-direction: column; gap: 2px; padding: var(--s2); border-top: var(--rule-strong) solid var(--bn); background: var(--surface); min-width: 0; }
.bignum.outline { background: none; border: var(--rule-w) solid var(--line); border-top: var(--rule-strong) solid var(--bn); }
.bignum.accent { background: var(--bn); color: var(--accent-ink); border-top-color: transparent; } .bignum.inverse { background: var(--ink); color: var(--paper); border-top-color: var(--bn); }
.bignum .bn-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; color: var(--bn); } .bignum.accent .bn-head, .bignum.inverse .bn-head { color: inherit; }
.bignum .bn-kicker { font: 600 var(--tiny) var(--font-display); letter-spacing: .04em; color: var(--ink-2); } .bignum.accent .bn-kicker, .bignum.inverse .bn-kicker { color: inherit; opacity: .8; }
.bn-ring-bg { fill: none; stroke: currentColor; stroke-opacity: .18; stroke-width: 3; } .bn-ring-fg { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; }
.bignum .bn-value { font-family: var(--font-display); font-weight: var(--display-weight); font-size: var(--bn-size, var(--h1)); line-height: .95; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.bignum .bn-value small { font-size: .42em; font-weight: 600; letter-spacing: 0; margin-left: .12em; }
.bignum .bn-label { font-size: var(--small); font-weight: 600; margin-top: 4px; } .bignum .bn-sub { font-size: var(--tiny); color: var(--muted); } .bignum.accent .bn-sub, .bignum.inverse .bn-sub { color: inherit; opacity: .75; }
.bignum .bn-delta { font-size: var(--small); font-weight: 600; margin-top: 2px; } .bn-delta.up { color: var(--pos); } .bn-delta.down { color: var(--neg); } .bignum.accent .bn-delta, .bignum.inverse .bn-delta { color: inherit; }
.bignum.sm { --bn-size: var(--h3); padding: var(--s1); } .bignum.lg { --bn-size: var(--hero); } .bignum.xl { --bn-size: calc(var(--hero) * 1.5); }
.bignums { display: grid; gap: var(--gutter); grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); }
/* atlas */
.at-pt { stroke: var(--paper); stroke-width: .4; fill-opacity: .85; } .at-pt.picked { stroke: var(--ink); stroke-width: 1.5; }
.at-label { font: 700 12px var(--font-display); fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 4px; stroke-linejoin: round; pointer-events: none; }
.at-brush .selection { fill: var(--accent); fill-opacity: .12; stroke: var(--accent); }
@media (prefers-reduced-motion: reduce) { .rd-sweep, .rd-item.pulse .rd-halo, .ticker .tk-track { animation: none; } }
@media print { .rd-sweep, .kit-tools, .kit-tip { display: none !important; } .ticker .tk-track { animation: none; } }