/* ============================================================
   Feedwrk design tokens — single source of truth.
   Import once, globally (e.g. in app/layout.tsx).
   These mirror dev.feedwrk.com (cool-slate restyle, Jul 2026). Never hardcode a raw value
   in a component; reference a token.
   ============================================================ */
:root{
  /* --- accents --- */
  --voltage:#5b3df5;        /* primary: main actions, selection, active tab */
  --voltage-hover:#4928e5;
  --voltage-press:#3a1fcc;
  --voltage-tint:#ece7fe;   /* selected-row / active wash */
  --citrus:#d4ff3f;         /* attention: do-next chips, secondary CTA */
  --citrus-hover:#c1ed2c;
  --on-accent:#fff;         /* text/icons on voltage or ink fills */

  /* --- ink (text + lines) --- */
  --ink-1:#1a2533;          /* headings, primary text */
  --ink-2:#2a2a30;          /* body */
  --ink-3:#586273;          /* secondary */
  --ink-4:#8b94a3;          /* muted / placeholder */
  --ink-5:#b8b8c0;          /* disabled / faint */
  --rule:#e3e8ef;           /* default borders, table lines */
  --rule-strong:#ccd3de;    /* stronger dividers */
  --canvas:#f5f7fa;         /* page background (warm off-white) */
  --surface:#ffffff;        /* cards, inputs */
  --surface-sunken:#eceff4; /* sunken fill: segmented track, progress track, thumb/img placeholder, neutral badge */
  /* legacy M3 surface-ramp aliases — the app's globals.css still emits these; map here so master + app agree */
  --surface-container:var(--surface);              /* #ffffff */
  --surface-container-high:var(--surface-sunken);  /* #f2f2ee */
  --surface-container-highest:var(--rule);         /* #e8e8e3 */

  /* --- signals (status only) --- */
  --signal-green:#2ba471;  --signal-green-tint:#e3f6ec;  --signal-green-ink:#1d7a53;
  --signal-amber:#f0a412;  --signal-amber-tint:#fdf1d6;  --signal-amber-ink:#845a05;
  --signal-red:#e5484d;    --signal-red-tint:#fce9ea;    --signal-red-ink:#b4282d;

  /* --- state --- */
  --state-hover:color-mix(in oklab,#0a0a0b 6%,transparent);
  --state-press:color-mix(in oklab,#0a0a0b 10%,transparent);

  /* --- spacing (8px base; 4px half-step) --- */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px;

  /* --- radius --- */
  --r-1:4px; --r-2:8px; --r-3:12px; --r-pill:999px;

  /* --- control heights --- */
  --ctl-h:40px; --ctl-h-sm:32px;

  /* --- elevation (soft, restrained scale — the app stays mostly flat) --- */
  --shadow-xs:0 1px 2px rgba(10,10,11,.04);     /* barely-there lift: tile / row hover */
  --shadow-sm:0 2px 8px rgba(10,10,11,.05);     /* raised / selectable card hover */
  --shadow-pop:0 8px 24px rgba(10,10,11,.12);   /* menus, popovers, toasts */
  --shadow-modal:0 30px 80px -20px rgba(10,10,11,.45),0 8px 24px -12px rgba(10,10,11,.3); /* layered: product / detail modal */
  --shadow-drawer:-8px 0 32px rgba(10,10,11,.12); /* side panels */

  /* --- motion --- */
  --motion-fast:120ms; --motion-base:180ms; --motion-slow:240ms;
  --ease-standard:cubic-bezier(.2,0,0,1);       /* default enter / exit */
  --ease-spring:cubic-bezier(.32,.72,0,1);      /* drawers, sheets, bulk bar — the designed spring */

  /* --- focus ring --- */
  --focus:0 0 0 3px color-mix(in oklab,var(--voltage) 35%,transparent);

  /* --- z-index scale --- */
  --z-sticky:2; --z-float:40; --z-scrim:50; --z-overlay:51; --z-toast:60;

  /* --- type --- */
  /* Prefer the app's self-hosted next/font families (exposed as --font-*-next);
     fall back to the plain family name for standalone use (styleguide, prototypes). */
  --font-sans:var(--font-sans-next,"Inter"),ui-sans-serif,system-ui,-apple-system,sans-serif;
  --font-mono:var(--font-mono-next,"JetBrains Mono"),ui-monospace,Menlo,monospace;

  /* --- type tracking --- */
  --track-tight:-0.022em;   /* large headings */
  --track-eyebrow:0.06em;   /* uppercase mono eyebrows / labels */
  --track-mono:-0.01em;     /* dense mono data */
}