/* Tracefox theme: "Signal blocks".
   Source of truth for colour, type and layout. Colours are named by meaning
   (signal = attention, lime = fine, cobalt = the brand speaking), so components
   use the palette tokens directly; see DESIGN.md, "The Colour Means State Rule".
   The previous "Alpine instrument" theme is kept outside the deploy, in ../archive/site-v6/. */
/* Fonts: self-hosted latin subsets from Google Fonts (SIL Open Font License 1.1),
   downloaded 2026-10-18 (Anton 2026-10-19, Poppins 2026-10-20). Poppins replaced
   Archivo as the body font on 2026-10-20 and ships as three static weights
   (400, 500, 600); Anton has one weight (400). League Spartan was retired on
   2026-10-19. The pages preload Anton, Poppins 400 and 500, and Anonymous Pro. */
@font-face { font-family: "Anton"; src: url("fonts/anton-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Poppins"; src: url("fonts/poppins-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Poppins"; src: url("fonts/poppins-500-latin.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Poppins"; src: url("fonts/poppins-600-latin.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Anonymous Pro"; src: url("fonts/anonymous-pro-700-latin.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* Palette */
  --color-ink: #0D0F0E;
  --color-paper: #F3EFE6;
  --color-cobalt: #1F3BFF;
  --color-signal: #FF4A1C;
  --color-lime: #D7FF3C;
  --color-white: #FFFFFF;
  --color-ink-muted: rgba(13, 15, 14, 0.68);
  --color-white-muted: rgba(255, 255, 255, 0.72);
  --color-white-soft: rgba(255, 255, 255, 0.85); /* secondary text on cobalt: 5.2:1, where 72% only reaches 4.1:1 */
  --color-line-dark: rgba(255, 255, 255, 0.16);
  --color-line-light: rgba(13, 15, 14, 0.16);
  --color-logo-ink: #0B1B36;    /* logo letters on light backgrounds only */
  /* Report status text: sample monthly report only, on white. Signal and lime
     fail as text there, so these darker cuts carry the same meanings. */
  --color-status-ok: #0B7A3B;    /* "on target", 5.4:1 on white */
  --color-status-watch: #B4410F; /* "needs attention", 5.6:1 on white */

  /* Focus ring: ink by default; surfaces override it in styles.css so it
     reaches 3:1 on every ground (white on cobalt, signal on ink). */
  --focus-ring: var(--color-ink);

  /* Type */
  --font-headline: "Anton", Impact, sans-serif; /* hero, section headings, big figures */
  --font-sans: "Poppins", system-ui, sans-serif;
  --font-mono: "Anonymous Pro", ui-monospace, monospace;

  /* Sizes are in rem so text follows the reader's browser font size;
     px equivalents at the default 16px are in the comments. */
  --display-size: 4.25rem;   /* 68px; tablet 56, phone 42 */
  --heading-size: 3rem;      /* 48px; tablet 42, phone 34 */
  --stat-size: 2.5rem;       /* 40px; tablet 38, phone 34 */
  --subhead-size: 2rem;      /* 32px; phone 26. Prose h2, quiz result title */
  --title-size: 1.5rem;      /* 24px */
  --term-size: 1.25rem;      /* 20px. FAQ questions (phone 18), glossary terms */
  --lead-size: 1.25rem;      /* 20px; tablet and phone 16 */
  --prose-size: 1.125rem;    /* 18px; phone 17. Long-form body */
  --body-size: 1rem;         /* 16px */
  --small-size: 0.875rem;    /* 14px. Timeline detail, revoke strip, sources */
  --label-size: 0.8125rem;   /* 13px. Mono labels, chips */
  --tag-size: 0.75rem;       /* 12px. Allow/deny tags, smallest mono */

  --tracking-headline: 0.005em; /* Anton is already condensed; negative tracking makes it clot */
  --tracking-title: -0.01em;
  --tracking-label: 0.08em;

  /* Layout */
  --container: 1280px;
  --gutter: 40px;         /* tablet 32, phone 20 */
  --section-y: 120px;     /* tablet 96, phone 80 */
  --nav-height: 76px;     /* phone 68 */
  --radius: 0;            /* square corners throughout, matching the logo */

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}
/* Breakpoints (CSS variables can't be used inside
   @media, so they are written out literally in styles.css):
   tablet ≤1199px · phone ≤809px */