/* Earnings Prints (copy of design/tokens.css, do not edit here) — design tokens v1.1 (2026-10-29, ui-designer; delta: design/DELTA-2026-10-29.md)
   Source of truth for colours, type, spacing. ux-engineer: import this file first, never hard-code values.
   Palette is the card palette (cards/STYLE.md) extended for long reading on paper.
   Contrast (WCAG 2.1) is measured and listed in design/DESIGN.md §2. */

/* ---------- Fonts (SIL OFL 1.1, files + licences in design/fonts/) ---------- */
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-Var.woff2") format("woff2");
  font-weight: 400 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Newsreader";
  src: url("fonts/Newsreader-Var.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Newsreader";
  src: url("fonts/Newsreader-Italic-Var.woff2") format("woff2");
  font-weight: 400 500; font-style: italic; font-display: swap;
}

:root {
  color-scheme: light dark;

  /* ---------- Brand constants (same in both themes; equal to the cards) ---------- */
  --qp-navy: #0B1220;        /* "ink navy": card background, masthead, plates */
  --qp-navy-2: #141F36;      /* card pill / raised plate */
  --qp-cream: #F4EFE6;       /* "paper cream": text on navy */
  --qp-amber: #FFB020;       /* "print amber": the one highlighted number / bar. Fill only on paper. */
  --qp-coral: #FF7A66;       /* negative change on navy. Fill only on paper. */
  --qp-slate: #8FA0BC;       /* secondary text on navy (7.1:1) */

  /* ---------- Semantic colours: LIGHT (default) ---------- */
  /* v1.1: cool "print paper" instead of warm beige (247wallst uses warm paper + gold rule + serif). */
  --c-page: #F5F7FA;         /* page paper, navy-tinted */
  --c-sunk: #E9EDF3;         /* sunken paper: editor's note, table head */
  --c-text: #0B1220;         /* 17.5:1 on page */
  --c-text-2: #3D4A63;       /* secondary prose, 8.3:1 */
  --c-muted: #5A6479;        /* meta, captions, 5.5:1 on page, 5.1:1 on sunk */
  --c-rule: #D3D9E3;         /* hairlines (decorative only) */
  --c-rule-strong: #0B1220;  /* table top/bottom rules, section rules */
  --c-accent-ink: #0B1220;   /* v1.1: NO amber on paper. Amber lives only on navy (plates, masthead, dark theme). */
  --c-neg-ink: #B23A26;      /* negative as TEXT on paper, 5.6:1 */
  --c-link: var(--c-text);
  --c-link-line: #7C879C;    /* v1.1: neutral underline (3.4:1), hover = text colour, 3px */
  --c-focus: #0B1220;        /* focus ring outer */
  --c-focus-inner: #FFB020;  /* focus ring inner */
  --c-ad-bg: #E9EDF3;
  --c-hi-col: #E7EBF2;       /* v1.1: current-quarter column in tables (was amber 14%) */
  --c-flag-correction: #B23A26;
  --c-flag-update: #1F4FB5;  /* only for the "Updated from 10-Q" stamp, 6.9:1 */

  /* Plates (hook block with mini bar chart, charts, status stamp) stay navy in both themes = the card look.
     v1.1: the plate is THE brand carrier; everything on paper is neutral navy/grey. */
  --c-plate: #0B1220;
  --c-plate-raised: #141F36;
  --c-plate-border: transparent;
  --c-plate-text: #F4EFE6;
  --c-plate-muted: #8FA0BC;
  --c-plate-grid: #1F2B45;   /* gridlines / zero line on plates */
  --c-plate-bar: #52668E;    /* history bars on plates, 3.25:1 vs plate (WCAG 1.4.11); cream labels on it 5.0:1 */
  --c-plate-bar-dim: #2A3756;/* excluded / not comparable (hatched) */
  --c-plate-hi: #FFB020;     /* highlighted bar / the hook number */
  --c-plate-neg: #FF7A66;

  /* ---------- Type ---------- */
  --f-serif: "Newsreader", "Iowan Old Style", "Palatino Linotype", Georgia, serif;  /* v1.1: running prose + editor's note ONLY */
  --f-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; /* data, UI, hooks */
  --f-head: var(--f-sans);                /* v1.1: H1/H2 in Inter (card voice), not serif */
  --f-num-features: "tnum" 1, "lnum" 1;   /* every number in data contexts */

  /* fluid scale 360px -> 1280px */
  --fs-display: clamp(3.5rem, 1.9rem + 7.2vw, 7rem);      /* hook number: 56 -> 112 */
  --fs-hook:    clamp(1.5rem, 1.18rem + 1.4vw, 2.25rem);  /* hook text: 24 -> 36, Inter 750 */
  --fs-h1:      clamp(1.75rem, 1.4rem + 1.6vw, 2.625rem); /* 28 -> 42, Inter 800, -0.025em */
  --fs-h2:      clamp(1.25rem, 1.12rem + .6vw, 1.625rem); /* 20 -> 26, Inter 750, -0.015em */
  --fs-h3:      1.0625rem;                                 /* 17, Inter 700 */
  --fs-lede:    clamp(1.1875rem, 1.1rem + .35vw, 1.375rem);/* 19 -> 22, Newsreader */
  --fs-body:    clamp(1.125rem, 1.09rem + .15vw, 1.1875rem);/* 18 -> 19, Newsreader */
  --fs-figure:  clamp(1.5rem, 1.2rem + 1.3vw, 2.25rem);    /* ledger figures 24 -> 36, Inter 700 tnum */
  --fs-ui:      0.9375rem;   /* 15: tables, nav, buttons */
  --fs-small:   0.8125rem;   /* 13: meta, captions, disclaimers */
  --fs-label:   0.75rem;     /* 12: uppercase labels, tracking .08em */
  --fs-chart:   12px;        /* chart labels (SVG), never below 10px on mobile */

  --lh-tight: 1.05;
  --lh-head: 1.15;
  --lh-ui: 1.4;
  --lh-body: 1.6;
  --track-label: 0.08em;
  --track-brand: 0.18em;

  /* ---------- Space (4px base) ---------- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;
  --gutter: clamp(16px, 4vw, 32px);       /* page side padding */
  --section-gap: clamp(40px, 6vw, 64px);  /* between sections */

  /* ---------- Layout ---------- */
  --measure: 40rem;     /* 640px prose column (~66ch at 19px Newsreader) */
  --wide: 52rem;        /* 832px: plates, charts, tables */
  --page-max: 75rem;    /* 1200px: masthead/footer */
  --rail: 13.5rem;      /* 216px desktop left rail (>= 1180px) */
  --masthead-h: 56px;

  /* ---------- Shape ---------- */
  --r-0: 0;
  --r-1: 2px;      /* plates, inputs, ad slot */
  --r-pill: 999px; /* ticker pill only */
  --hair: 1px;
  --rule-heavy: 2px;

  /* ---------- Motion ---------- */
  --t-fast: 120ms;
  --ease: cubic-bezier(.2, .7, .2, 1);

  /* ---------- Ads (R4): reserved heights so CLS stays < 0.1 ---------- */
  --ad-h-mobile: 280px;   /* 300x250 / responsive + label */
  --ad-h-desktop: 120px;  /* 728x90 + label; responsive unit may grow, reserve min */
}

/* ---------- DARK: system preference, unless the reader forced light ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-page: #0B1220;
    --c-sunk: #111A2E;
    --c-text: #F4EFE6;
    --c-text-2: #C9D1DF;
    --c-muted: #9AAAC4;
    --c-rule: #24314D;
    --c-rule-strong: #8FA0BC;
    --c-accent-ink: #FFB020;
    --c-neg-ink: #FF8F7D;
    --c-link: var(--c-text);
    --c-link-line: #FFB020;
    --c-focus: #F4EFE6;
    --c-focus-inner: #FFB020;
    --c-ad-bg: #111A2E;
    --c-hi-col: #1A2742;
    --c-flag-correction: #FF8F7D;
    --c-flag-update: #8DB4FF;
    --c-plate: #141F36;
    --c-plate-raised: #1A2742;
    --c-plate-border: #26355A;
    --c-plate-grid: #26355A;
    --c-plate-bar: #5B709A;
    --c-plate-bar-dim: #2E3C5E;
  }
}
/* ---------- DARK: explicit toggle ---------- */
:root[data-theme="dark"] {
  --c-page: #0B1220;
  --c-sunk: #111A2E;
  --c-text: #F4EFE6;
  --c-text-2: #C9D1DF;
  --c-muted: #9AAAC4;
  --c-rule: #24314D;
  --c-rule-strong: #8FA0BC;
  --c-accent-ink: #FFB020;
  --c-neg-ink: #FF8F7D;
  --c-link: var(--c-text);
  --c-link-line: #FFB020;
  --c-focus: #F4EFE6;
  --c-focus-inner: #FFB020;
  --c-ad-bg: #111A2E;
  --c-hi-col: #1A2742;
  --c-flag-correction: #FF8F7D;
  --c-flag-update: #8DB4FF;
  --c-plate: #141F36;
  --c-plate-raised: #1A2742;
  --c-plate-border: #26355A;
  --c-plate-grid: #26355A;
  --c-plate-bar: #5B709A;
  --c-plate-bar-dim: #2E3C5E;
}
