/* ============================================================
   Ink & Pixels — design tokens  (governed by DESIGN.md, LOCKED)
   Neo-Brutalist base + generative-texture signature
   ============================================================ */

:root {
  /* ---- palette (design-for-ai palette.mjs · seed 150 · balanced · complementary) ---- */
  --neutral-1:#fcfdfc; --neutral-2:#f8f9f8; --neutral-3:#eff1ef; --neutral-4:#e5e9e6;
  --neutral-5:#dadfdb; --neutral-6:#ced4cf; --neutral-7:#bec6bf; --neutral-8:#a5aea6;
  --neutral-9:#b0bbb1; --neutral-10:#9da89f; --neutral-11:#5f6560; --neutral-12:#2c2f2c;
  --accent-1:#f8fff9; --accent-2:#f1fcf3; --accent-3:#e0f8e4; --accent-4:#d0f3d5;
  --accent-5:#bcecc5; --accent-6:#a6e4b2; --accent-7:#8cd99c; --accent-8:#64c37b;
  --accent-9:#59d57b; --accent-10:#4bc06d; --accent-11:#327343; --accent-12:#15361d;
  --accent-on-solid:#071009;
  --purple-3:#ffe8fc; --purple-9:#e25cdb; --purple-11:#8c4386; --purple-on-solid:#120a11;
  --error-9:#e1524f; --error-11:#974843;
  --success-9:#5ad664; --success-11:#337437;
  --warning-9:#dbb155; --warning-11:#76602f;
  --info-9:#5baee5; --info-11:#3d6886;

  /* ---- warm cream canvas (deliberate identity deviation, LOCKED) ---- */
  --background:#f6f1e5; --surface:#fbf6ec; --surface-hover:#f0e9da; --surface-active:#e9e0cd;
  --border-subtle:var(--neutral-6); --border:var(--neutral-7); --border-strong:var(--neutral-8);
  --text-secondary:var(--neutral-11); --text:var(--neutral-12);
  --accent-bg-subtle:var(--accent-3); --accent-solid:var(--accent-9);
  --accent-solid-hover:var(--accent-10); --accent-text:var(--accent-11);

  /* ---- identity aliases ---- */
  --ink:var(--neutral-12);            /* hue-shifted near-black; mark text + light-mode strokes (never #000) */
  --stroke:var(--ink);                /* borders + hard offset shadows (flips light in dark mode) */
  --pixels:var(--accent-9);           /* green — engineer/markets voice + dither */
  --pixels-deep:var(--accent-12);     /* green AS TEXT on cream (>=4.5:1) */
  --expression:var(--purple-9);       /* magenta — the artist accent (fills) */
  --expression-text:var(--purple-11); /* magenta AS TEXT on cream */

  /* ---- type ---- */
  --font-display:'Bricolage Grotesque', 'Arial Black', sans-serif;
  --font-body:'Space Grotesk', system-ui, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace;
  /* fluid scale, ratio 1.5 (perfect fifth), base 18px */
  --text-xs:0.75rem;     /* 12 — mono labels */
  --text-sm:0.875rem;    /* 14 */
  --text-base:1.125rem;  /* 18 — body */
  --text-lg:1.5rem;      /* 24 */
  --text-xl:2rem;        /* 32 */
  --text-2xl:2.75rem;    /* 44 */
  --text-3xl:clamp(3rem, 5vw, 3.75rem);
  --text-4xl:clamp(3.5rem, 8vw, 5.25rem);
  --text-display:clamp(3.75rem, 11vw, 8rem);
  --leading-body:1.5; --leading-tight:1.02;

  /* ---- space (4px base, with rhythm — never uniform) ---- */
  --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; --space-32:128px;

  /* ---- shape + the signature offset shadow ---- */
  --border-w:3px;
  --radius-0:0;
  --radius-sticker:14px;           /* mixed radius, license for "sticker" elements only */
  --shadow:6px 6px 0 var(--stroke);   /* hard offset, ZERO blur (signature) */
  --shadow-hover:9px 9px 0 var(--stroke);
  --shadow-press:2px 2px 0 var(--stroke);

  /* ---- motion ---- */
  --t-micro:100ms; --t-standard:170ms; --t-large:300ms;
  --ease-out:cubic-bezier(.2,.7,.3,1);
}

[data-theme="dark"] {
  --neutral-1:#121312; --neutral-2:#191a19; --neutral-3:#212321; --neutral-4:#282b29;
  --neutral-5:#303330; --neutral-6:#383d39; --neutral-7:#454b46; --neutral-8:#5b635c;
  --neutral-9:#b0bbb1; --neutral-10:#c3cec5; --neutral-11:#b3b9b4; --neutral-12:#e5e9e6;
  --accent-9:#59d57b; --accent-10:#75e792; --accent-11:#88ca95; --accent-12:#cdf4d4;
  --accent-on-solid:#071009;
  --purple-9:#e25cdb; --purple-11:#e797df;
  --error-9:#e1524f; --error-11:#f49c95; --success-9:#5ad664; --success-11:#88cb8a;
  --warning-9:#dbb155; --warning-11:#cdb482; --info-9:#5baee5; --info-11:#90bedf;

  /* warm-dark canvas (tinted, never flat #111) */
  --background:#16140f; --surface:#1d1b15; --surface-hover:#252219; --surface-active:#2d2920;
  --text-secondary:var(--neutral-11); --text:var(--neutral-12);
  --ink:#0c0d0b;                     /* mark text stays dark on the light green/magenta fills */
  --stroke:#d8dcd6;                  /* borders/shadows go LIGHT so the signature reads on dark */
  --pixels-deep:var(--accent-9);     /* on dark, full-strength green reads as text */
  --expression-text:var(--purple-11);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-micro:0ms; --t-standard:0ms; --t-large:0ms; }
}