/* PrismaCorp design tokens — the one source for colour, type, motion, radius and
   shadow, loaded by every front end (BaseLayout pages, PrismaOS, PrismaOS Mobile)
   BEFORE its own stylesheet. Page stylesheets add their own extras (e.g. PrismaOS's
   --glass) but never redefine these. Standalone Respawn pages (/respawn/now and the
   print sheets) intentionally carry their own minimal copies so they stay
   self-contained and one-page in print.

   Themes are attributes on <html>, set before paint by ThemeScript:
     data-theme="light|dark"   data-contrast="normal|high"   data-motion="auto|reduce" */
:root{
  /* Surfaces & text (flip with theme) */
  --paper:#FBF7EE; --paper-2:#F3ECDD; --card:#FFFFFF; --ink:#1A1623; --muted:#544E60; --hair:#D9CFBE;
  --label:var(--ink); --label-2:var(--muted); --label-3:#6E6878;
  --fixed-ink:#1A1623; /* a dark surface that never flips — tiles/badges that hold light content in both themes */

  /* Brand palette — one set everywhere. These are the AA-tuned hues (white text on
     cobalt/violet/pink-aa/teal-aa/tomato-aa clears 4.5:1). */
  --cobalt:#2240E6; --tomato:#E23A1E; --lime:#C6F24E; --violet:#6D28D9; --pink:#E0237E; --sun:#FFC53D; --teal:#0E978C;
  --pink-aa:#C21368; --teal-aa:#0B7A71; --tomato-aa:#CE3018;

  /* Primary UI accent (a user accent choice overrides --accent inline on <html>)
     and the link colour derived from it, so links stay readable in every theme. */
  --accent:#2240E6;
  --link:var(--accent);

  /* Type */
  --disp:'Bricolage Grotesque',system-ui,sans-serif; --sans:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'Space Mono',monospace; --hand:'Caveat',cursive;

  /* Motion. Durations collapse to 0 under reduced motion (OS setting or the
     in-app toggle), so ported effects need no special-casing beyond using them.
     Curves from ObsidianUI (MIT) — see audit/reference/OBSIDIANUI.md. */
  --ease:cubic-bezier(.2,.85,.25,1);          /* shared spring-ish ease (PrismaOS) */
  --ease-out-expo:cubic-bezier(.22,1,.36,1);  /* enters */
  --ease-in-quick:cubic-bezier(.55,0,1,.45);  /* exits */
  --ease-fill:cubic-bezier(.65,0,.076,1);     /* CTA fill sweep */
  --dur-1:120ms; --dur-2:160ms; --dur-3:260ms; --dur-4:480ms;

  /* Radius scale */
  --r-1:6px; --r-2:10px; --r-3:14px; --r-4:20px; --r-pill:999px;

  /* Elevation: ONE depth language — the hard offset "sticker" shadow, the brand's
     signature. No soft blur shadows anywhere (P-02). The shadow colour is its own
     token so it stays dark in dark mode instead of following --ink to near-white
     (P-01), and ink-coloured surfaces (.on-ink in site.css) can lift it (P-50).
     Steps: 1 chips/inputs · 2 buttons · 3 cards · 4 windows/hero cards. */
  --sh-color:var(--ink);
  --sh-1:2px 2px 0 var(--sh-color); --sh-2:3px 3px 0 var(--sh-color);
  --sh-3:4px 4px 0 var(--sh-color); --sh-4:6px 6px 0 var(--sh-color);

  /* Focus: one ring everywhere — 3px, 2px off the edge. Its colour follows the
     surface: the accent on paper, sun on ink bands (set by .on-ink). (P-06) */
  --focus:var(--accent);

  /* Controls: two button heights and one field height, site-wide. (P-09, P-112) */
  --btn-h:48px; --btn-h-sm:40px; --field-h:48px;

  /* Type helpers: all-caps mono labels share one tracking and a 11px floor. (P-11) */
  --track-caps:.08em; --fs-caps:0.6875rem;

  /* Page rhythm: every section's top and bottom padding. (P-55) */
  --section-y:clamp(48px, 4vw + 32px, 88px);

  /* Long-form measure. (P-12) */
  --measure:68ch;

  /* Spacing scale (4px base) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
}
[data-theme="dark"]{
  --paper:#14121C; --paper-2:#211D2E; --card:#1C1925; --ink:#F1ECE0; --muted:#ADA6B8; --hair:#3A3449; --label-3:#8C86A0;
  /* Light-theme accents are too dark to read on these surfaces; lift links toward white. */
  --link:color-mix(in srgb, var(--accent) 42%, #FFFFFF);
  /* Shadows stay dark: a light-ink offset read as a beige glow on every card. */
  --sh-color:rgba(0,0,0,.62);
}
/* High contrast — a genuine max-contrast theme (pure black/white), layered over light or dark. */
[data-theme="light"][data-contrast="high"]{ --paper:#FFFFFF; --paper-2:#FFFFFF; --card:#FFFFFF; --ink:#000000; --muted:#000000; --hair:#000000; --fixed-ink:#000000; --label-3:#000000; --link:#0000C8; }
[data-theme="dark"][data-contrast="high"]{ --paper:#000000; --paper-2:#0A0A0A; --card:#0A0A0A; --ink:#FFFFFF; --muted:#FFFFFF; --hair:#FFFFFF; --fixed-ink:#000000; --label-3:#FFFFFF; --link:#9DB4FF; }

@media (prefers-reduced-motion: reduce){ :root{ --dur-1:0s; --dur-2:0s; --dur-3:0s; --dur-4:0s; } }
:root[data-motion="reduce"]{ --dur-1:0s; --dur-2:0s; --dur-3:0s; --dur-4:0s; }