/* Mintward design tokens. Single source of truth for every Mintward surface.
 * Hallmark · route: custom (tuned) · vibe: "calm instrument, spruce and bone, one mint signal"
 * paper: oklch(97% 0.010 95) · accent: oklch(86% 0.125 166) on dark / oklch(47% 0.085 172) on light
 * display: Schibsted Grotesk · text: IBM Plex Sans · data: IBM Plex Mono
 * axes: light (dark mode: dark) / grotesk-sans / chromatic-green
 * Hex values are the sRGB equivalents; use them where OKLCH is not supported (PIL, email, Figma).
 */
:root {
  /* Brand core */
  --mw-spruce:     oklch(22% 0.035 170);  /* #072018  ink, primary dark surface, the mark */
  --mw-spruce-2:   oklch(29% 0.035 170);  /* #183129  raised dark surface */
  --mw-bone:       oklch(97% 0.010 95);   /* #f7f5ee  paper */
  --mw-bone-2:     oklch(93% 0.012 95);   /* #eae8df  raised light surface */
  --mw-mint:       oklch(86% 0.125 166);  /* #77ebbe  signal accent: ONLY on spruce/night */
  --mw-verdigris:  oklch(47% 0.085 172);  /* #136a55  accent on light: links, focus, small marks */
  --mw-stone:      oklch(52% 0.015 170);  /* #616c67  secondary text on bone (5.0:1) */
  --mw-rule:       oklch(86% 0.012 120);  /* #d0d2ca  hairlines on bone */
  --mw-night:      oklch(17% 0.022 170);  /* #05130e  dark-mode paper */
  --mw-night-2:    oklch(22% 0.026 170);  /* #0d1f19  dark-mode raised */
  --mw-night-rule: oklch(32% 0.025 170);  /* #263731  hairlines on night */
  --mw-fog:        oklch(72% 0.018 170);  /* #9aa8a3  secondary text on night (7.7:1) */

  /* Verdict colours: product UI states, never brand decoration */
  --mw-pass:    oklch(50% 0.11 150);   /* #2b7440  "no known issues" */
  --mw-caution: oklch(78% 0.15 78);    /* #ebaa2d  "check this" (use with spruce text) */
  --mw-block:   oklch(56% 0.18 32);    /* #c83c25  "high risk" */

  /* Semantic roles: light (default) */
  --color-paper:   var(--mw-bone);
  --color-paper-2: var(--mw-bone-2);
  --color-ink:     var(--mw-spruce);
  --color-muted:   var(--mw-stone);
  --color-rule:    var(--mw-rule);
  --color-accent:  var(--mw-verdigris);
  --color-focus:   var(--mw-verdigris);
  --color-mark:    var(--mw-spruce);

  /* Type */
  --font-display: "Schibsted Grotesk", ui-sans-serif, sans-serif;  /* headings, wordmark source, 600-800 */
  --font-body:    "IBM Plex Sans", ui-sans-serif, sans-serif;      /* text and UI, 400/500 */
  --font-mono:    "IBM Plex Mono", ui-monospace, monospace;        /* addresses, hashes, verdict codes */

  /* Scale: perfect fourth (1.333), base 16px */
  --text-xs: 0.75rem; --text-sm: 0.875rem; --text-base: 1rem; --text-lg: 1.333rem;
  --text-xl: 1.777rem; --text-2xl: 2.369rem; --text-3xl: 3.157rem; --text-display: 4.209rem;

  /* Space: 4pt */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px;
  --space-8: 32px; --space-12: 48px; --space-16: 64px; --space-24: 96px;

  --radius-sm: 4px; --radius-md: 8px;   /* square-ish: the mark has no curves */
  --rule-hair: 1px;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1); --ease-in: cubic-bezier(0.5, 0, 0.75, 0); --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms; --dur-base: 200ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-paper:   var(--mw-night);
    --color-paper-2: var(--mw-night-2);
    --color-ink:     var(--mw-bone);
    --color-muted:   var(--mw-fog);
    --color-rule:    var(--mw-night-rule);
    --color-accent:  var(--mw-mint);
    --color-focus:   var(--mw-mint);
    --color-mark:    var(--mw-bone);
  }
}
