/* Design tokens — UX spec §Visual Design Foundation + §Direction Selection
 * (warm amber, Direction 1). One canonical source: inlined into the shell at
 * SSR and served at /assets/tokens.css for the restyled auth shim (A4).
 * Every rendered color/spacing value routes through a token here — inline
 * literals in component code are rejected by scripts/check-frontend-tokens.py.
 * Contrast pairs are validated by the same script (WCAG 2.1 AA, task 075).
 */
:root {
  /* Neutral scale (12-stop warm undertone, UX spec §Color System) */
  --color-neutral-50: #FAFAF8;
  --color-neutral-100: #F5F4F1;
  --color-neutral-200: #E8E6E1;
  --color-neutral-300: #CCC9C2;
  --color-neutral-400: #A8A49B;
  --color-neutral-500: #7A756C;
  --color-neutral-600: #5C5750;
  --color-neutral-700: #3D3A34;
  --color-neutral-800: #28251F;
  --color-neutral-900: #1A1815;

  /* Semantic surfaces + text */
  --color-surface: var(--color-neutral-50);
  --color-surface-raised: var(--color-neutral-100);
  --color-border: var(--color-neutral-200);
  --color-text: var(--color-neutral-700);
  --color-text-strong: var(--color-neutral-800);
  /* Spec's neutral-500 secondary text is 4.4:1 on --color-surface — just
   * under AA. Secondary text uses neutral-600 instead (pickup tightening). */
  --color-text-secondary: var(--color-neutral-600);

  /* Accent — warm amber (Direction 1, UX spec §Chosen Direction) */
  --color-accent: #C17B2F;
  --color-accent-light: #F5E9D9;
  --color-accent-dark: #8A5520;
  /* Text on the amber primary action: near-black clears AA; white doesn't. */
  --color-on-accent: var(--color-neutral-900);

  /* State colors (UX spec §State colors; warning darkened from ~#B5860D to
   * clear 4.5:1 as text on --color-surface) */
  --color-state-success: #3A7D44;
  --color-state-warning: #8A6509;
  --color-state-error: #C0392B;

  /* Typography — single humanist sans (Inter, UX spec §Typography System) */
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;
  --text-caption: 0.75rem;
  --text-label: 0.875rem;
  --text-body: 1rem;
  --text-heading-sm: 1.125rem;
  --text-heading-lg: clamp(1.375rem, 1.25rem + 0.5vw, 1.5rem);

  /* Spacing — four steps of the 4px base scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;

  /* Shape + touch */
  --radius: 16px;
  --tap-target: 44px;

  /* Modal scrim (neutral-900 at 40%) */
  --color-scrim: rgb(26 24 21 / 0.4);
}

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/InterVariable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}