/* Shared design tokens — brief §2.2 + the verite-spacing skill (.claude/skills/verite-spacing).
   Accent #E8622A pending O-1 (confirm vs Verite logo). */
:root {
  /* colour — one accent, used with discipline */
  --bg: #0A0A0A;
  --surface: #141414;
  --surface-2: #1C1C1C;
  --border: #262626;
  --text: #F5F5F0;
  --text-muted: #9A9A94;
  --accent: #E8622A;            /* family signature — see open item O-1 */
  --focus: #F5F5F0;

  /* spacing — the one shared scale (8px grid; 4px only for icon-to-label). Never extended:
     a layout that seems to need 40 or 56 gets the nearest token and a fixed layout. */
  --space-1:  0.25rem;  /* 4px  micro: icon-to-label only */
  --space-2:  0.5rem;   /* 8px  tight: inline elements, chip gaps */
  --space-3:  0.75rem;  /* 12px button vertical padding, form label gap */
  --space-4:  1rem;     /* 16px default component padding, grid gap */
  --space-6:  1.5rem;   /* 24px between related elements; minimum side gutter */
  --space-8:  2rem;     /* 32px section sub-spacing, card padding */
  --space-12: 3rem;     /* 48px between sections */
  --space-16: 4rem;     /* 64px major section breaks */
  --space-24: 6rem;     /* 96px page-level breathing room */

  /* layout */
  --max-w: 1200px;
  --cols: 12;
  --gutter: var(--space-6);     /* never below 24px, phone included */
  --radius: 2px;

  /* motion */
  --t-fast: 150ms; --t-base: 250ms; --t-slow: 400ms;
  --ease: cubic-bezier(.2,.7,.2,1);
}

/* Two densities, same scale ("shaken, not stirred"). Components only use these aliases. */
[data-site="verite"] {            /* utilitarian gear room: denser, scannable */
  --section-y:   var(--space-12);
  --section-y-m: var(--space-16);
  --card-pad:    var(--space-6);
  --stack-gap:   var(--space-4);
  --grid-gap:    var(--space-4);
}
[data-site="sip"] {               /* editorial location pitch: more Ma, slower read */
  --section-y:   var(--space-16);
  --section-y-m: var(--space-24);
  --card-pad:    var(--space-8);
  --stack-gap:   var(--space-6);
  --grid-gap:    var(--space-6);
}
[data-site="portal"] {            /* client portal: Verite's density, a working page and not a pitch */
  --section-y:   var(--space-12);
  --section-y-m: var(--space-16);
  --card-pad:    var(--space-6);
  --stack-gap:   var(--space-4);
  --grid-gap:    var(--space-4);
}
[data-site="admin"] {             /* Ricardo's tool: densest, space only for clarity */
  --section-y:   var(--space-8);
  --section-y-m: var(--space-8);
  --card-pad:    var(--space-4);
  --stack-gap:   var(--space-3);
  --grid-gap:    var(--space-4);
}
@media (prefers-reduced-motion: reduce) { :root { --t-fast:0ms; --t-base:0ms; --t-slow:0ms; } }
