/* DOS base: tokens + report components — see ../DESIGN.md (source of truth).
   Every colour and the font go through the --dos-* tokens; sizes and spacing below are measured
   from the DOS 2026 company profile and each is used by a single component.
   Font is self-hosted (no Google Fonts call: no visitor IP sent to a third party, GDPR). */
@font-face { font-family: "Red Hat Display"; font-style: normal; font-weight: 300 900; font-display: swap; src: url("../fonts/red-hat-display-latin.woff2") format("woff2"); }

:root {
  --dos-ink: #222222;
  --dos-ink-2: #242521;
  --dos-paper: #F1F1F1;
  --dos-white: #FFFFFF;
  --dos-gray-1: #E2E2E2;
  --dos-gray: #C3C3C3;
  --dos-gray-3: #9A9A9A;
  --dos-muted: #5E5E5E;
  --dos-alert: #D0021B; /* status only, never decoration: white on it 5.67:1, on paper 5.02:1 */
  --dos-font: "Red Hat Display", system-ui, sans-serif;
}

/* ds-allow-hardcode:start — one-off component metrics from the brand profile, see header */
@page { size: A4; margin: 14mm; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--dos-paper); color: var(--dos-ink); font: 400 15px/1.5 var(--dos-font); font-variant-numeric: tabular-nums; }
.dos-page { position: relative; max-width: 1120px; margin: 0 auto; padding: 0 48px 48px; overflow: hidden; background: var(--dos-paper); }
.dos-page + .dos-page { margin-top: 24px; }

/* Wordmark: DOS bold + area light, payoff below */
.dos-mark { display: inline-block; line-height: 1; text-transform: uppercase; }
.dos-mark b { font-weight: 700; letter-spacing: -.01em; }
.dos-mark span { font-weight: 400; }
.dos-mark small { display: block; margin-top: 4px; font-size: .38em; font-weight: 500; letter-spacing: .18em; }

/* Section header: giant number cropped by the top edge */
.dos-head { display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; height: 120px; }
.dos-num { margin-top: -0.38em; font-size: 150px; font-weight: 500; line-height: 1; letter-spacing: -.04em; }
.dos-kicker { padding-top: 40px; font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.dos-head .dos-mark { justify-self: end; padding-top: 32px; font-size: 20px; }

h1, h2, h3 { margin: 0; font-weight: 500; line-height: 1.05; letter-spacing: -.02em; }
h1 { font-size: clamp(40px, 6vw, 64px); }
h2 { font-size: clamp(30px, 4vw, 44px); margin: 24px 0 16px; }
h3 { font-size: 20px; margin: 24px 0 8px; }
p { max-width: 68ch; margin: 0 0 12px; }
strong { font-weight: 700; }
.dos-lead { font-size: 20px; line-height: 1.4; max-width: 60ch; }
.dos-muted { color: var(--dos-muted); }

/* Cover */
.dos-cover { min-height: 520px; padding: 40px 48px; display: flex; flex-direction: column; justify-content: space-between; background: var(--dos-ink); color: var(--dos-white); }
.dos-cover .dos-mark { font-size: 22px; }
.dos-cover h1 span { display: block; font-weight: 700; color: var(--dos-gray); }
.dos-cover .dos-meta { font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }

/* Full-bleed dark band for key data */
.dos-band { margin: 32px -48px; padding: 36px 48px; background: var(--dos-ink); color: var(--dos-white); }

/* KPI row */
.dos-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 24px; }
.dos-kpi b { display: block; font-size: 52px; font-weight: 500; line-height: 1; letter-spacing: -.03em; }
.dos-kpi span { display: block; margin-top: 10px; font-size: 13px; font-weight: 700; line-height: 1.25; }

/* Tables: horizontal rules only */
.dos-table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.dos-table th { padding: 0 12px 8px 0; text-align: left; font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--dos-muted); }
.dos-table td { padding: 10px 12px 10px 0; border-top: 1px solid var(--dos-gray); }
.dos-table .num { text-align: right; }

/* Status: an alert is a red accent on a white card (rule, label, key figure), never a red fill */
.dos-flag { display: inline-block; margin-right: 10px; padding: 1px 6px; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border: 1px solid var(--dos-ink); }
.dos-flag.is-alert { color: var(--dos-alert); border-color: var(--dos-alert); }
.dos-note { margin: 10px 0; padding: 12px 16px; border-left: 3px solid var(--dos-ink); background: var(--dos-white); }
.dos-note.is-alert { border-left: 4px solid var(--dos-alert); }
.dos-note.is-alert b { color: var(--dos-alert); }
.dos-note.is-ok { padding: 4px 0; border-left: 0; background: none; color: var(--dos-muted); }
.dos-summary { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.dos-summary .is-alert, .dos-alert-text { color: var(--dos-alert); font-weight: 700; }

/* Heat strip: tone t1..t5 = intensity in grays (text colour keeps >=4.5:1), red inset = past a stress threshold */
.dos-heat { width: 100%; border-collapse: separate; border-spacing: 2px; table-layout: fixed; font-size: 11px; }
.dos-heat th { font-size: 10px; font-weight: 500; color: var(--dos-muted); text-align: center; }
.dos-heat th[scope=row] { width: 110px; padding-right: 8px; text-align: left; font-weight: 700; color: var(--dos-ink); }
.dos-heat td { height: 34px; text-align: center; font-weight: 500; }
.dos-heat .t1 { background: var(--dos-gray-1); color: var(--dos-ink); }
.dos-heat .t2 { background: var(--dos-gray); color: var(--dos-ink); }
.dos-heat .t3 { background: var(--dos-gray-3); color: var(--dos-ink); }
.dos-heat .t4 { background: var(--dos-muted); color: var(--dos-white); }
.dos-heat .t5 { background: var(--dos-ink); color: var(--dos-white); }
.dos-heat .is-stress { box-shadow: inset 0 0 0 3px var(--dos-alert); }
.dos-heat .is-empty { color: var(--dos-muted); }

/* Bar chart: gray for ordinary values, ink above the mean, red only past a stress threshold */
.dos-bars { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; height: 180px; align-items: end; border-bottom: 1px solid var(--dos-ink); }
.dos-bar { height: 100%; display: flex; flex-direction: column; justify-content: end; }
.dos-bar i { display: block; background: var(--dos-ink); }
.dos-bar.is-secondary i, .dos-bar.is-low i { background: var(--dos-gray); }
.dos-bar.is-alert i { background: var(--dos-alert); }
.dos-bars + .dos-bar-labels { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; margin-top: 6px; font-size: 10px; text-align: center; color: var(--dos-muted); }

.dos-foot { margin-top: 40px; padding-top: 10px; border-top: 1px solid var(--dos-gray); font-size: 10px; color: var(--dos-muted); }

@media print {
  body { background: var(--dos-paper); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .dos-page, .dos-cover { break-after: page; max-width: none; margin: 0; }
}
@media (max-width: 700px) {
  .dos-page { padding: 0 16px 32px; }
  .dos-cover { padding: 24px 16px; min-height: 420px; }
  .dos-band { margin: 24px -16px; padding: 24px 16px; }
  .dos-head { grid-template-columns: auto 1fr; height: 90px; }
  .dos-num { font-size: 96px; }
  .dos-kicker { display: none; }
}
/* ds-allow-hardcode:end */
