/* ===== DESIGN TOKENS: the only place color/space/type/motion live ===== */
:root{
  /* neutral ramp: warm technical paper */
  --gray-50:#f5f3ee; --gray-100:#ece9e1; --gray-200:#ddd9cf; --gray-300:#c2bdb0;
  --gray-500:#7a7668; --gray-700:#45423a; --gray-900:#171a1f;

  --color-primary:#1a35c8;      /* text-safe accent (AA on paper) */
  --color-accent:#2f54ff;       /* fills, marks, the signature blue */

  --bg:var(--gray-50); --surface:#faf9f5; --text:var(--gray-900);
  --text-muted:#5c594e; --border:var(--gray-200); --line:rgba(23,26,31,.14);
  --ok:#12805c; --danger:#b3261e;
  --ring:color-mix(in srgb,var(--color-accent) 55%,transparent);

  --fig-wash-a:#eae7dc; --fig-wash-b:#dbd7c8; --fig-line:rgba(23,26,31,.32);
  --fig-ink:#22252b; --fig-muted:#5b574b; --fig-node:#f5f3ee;

  --font-display:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;
  --font-text:"Inter",ui-sans-serif,system-ui,sans-serif;
  --font-mono:ui-monospace,"Cascadia Code","SF Mono",Menlo,monospace;

  /* modular fluid scale */
  --step--1:clamp(.78rem,.75rem + .2vw,.86rem);
  --step-0:clamp(.98rem,.92rem + .3vw,1.08rem);
  --step-1:clamp(1.25rem,1.12rem + .6vw,1.5rem);
  --step-2:clamp(1.6rem,1.35rem + 1.2vw,2.2rem);
  --step-3:clamp(2.1rem,1.6rem + 2.4vw,3.4rem);
  --step-4:clamp(2.9rem,2rem + 4.6vw,5.6rem);

  /* 4px spacing scale */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-6:24px; --s-8:32px;
  --s-12:48px; --s-16:64px; --s-24:96px;
  --act-gap:clamp(96px,14vh,160px);      /* ONE vertical rhythm token */

  --radius:2px; --radius-lg:6px;         /* precise, near-square language */
  --shadow-sm:0 1px 2px rgba(23,26,31,.05);

  --t-fast:.14s; --t:.24s; --t-slow:.5s;
  --ease-out:cubic-bezier(.16,1,.3,1);

  --max:1240px; --gutter:clamp(20px,4vw,56px);
}

[data-theme="dark"]{
  --bg:#101216; --surface:#171a20; --text:#eceae3; --text-muted:#a4a094;
  --border:#2a2d35; --line:rgba(236,234,227,.14);
  --color-primary:#93a5ff; --color-accent:#5c78ff;
  --fig-wash-a:#181b21; --fig-wash-b:#1e222a; --fig-line:rgba(236,234,227,.25);
  --fig-ink:#d9d7cf; --fig-muted:#8b887c; --fig-node:#20242c;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
}

/* reset-lite */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--text);
  font:400 var(--step-0)/1.6 var(--font-text);
  -webkit-font-smoothing:antialiased;overflow-x:clip;}
img,svg,video{max-width:100%;display:block}
h1,h2,h3{font-family:var(--font-display);line-height:1.08;margin:0;text-wrap:balance;letter-spacing:-.015em}
p{margin:0}
a{color:inherit}
::selection{background:var(--color-accent);color:#fff}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:var(--radius)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
/* capture hook (verification only) */
.frozen *,.frozen *::before,.frozen *::after{animation:none!important;transition:none!important}
