/* mirrors apps/desktop/src/renderer/src/styles/tokens.css — keep in sync */
/* Dark theme only; the app's light theme is not used on the site. */
:root {
  color-scheme: dark;

  --background: #14171a;
  --surface-sunken: #0f1214;
  --surface-raised: #1a1d21;
  --card: #1c2024;
  --card-hover: #232830;
  --card-active: #2b3138;

  --border: #262c31;
  --border-strong: #343c43;

  --foreground: #f2eee7;
  --muted-foreground: #949ca4;
  --faint-foreground: #69727a; /* decorative only, never body copy */

  --accent: #e7d2ad;
  --accent-foreground: #1d160a;
  --accent-strong: color-mix(in oklab, var(--accent) 82%, white);
  --accent-soft: color-mix(in oklab, var(--accent) 15%, transparent);
  --accent-line: color-mix(in oklab, var(--accent) 55%, transparent);
  --ring: color-mix(in oklab, var(--accent) 60%, transparent);

  --live: #e8402a; /* one on-air dot only */
  --fault: #f0745c;

  --s-1: 2px;
  --s-2: 4px;
  --s-3: 8px;
  --s-4: 12px;
  --s-5: 16px;
  --s-6: 20px;
  --s-7: 24px;
  --s-8: 32px;
  --s-9: 48px;
  --s-10: 64px; /* site only */
  --s-11: 96px; /* site only */

  --r-1: 6px;
  --r-2: 9px;
  --r-3: 13px;
  --r-pill: 999px;

  --elev-1: 0 1px 2px rgb(0 0 0 / 0.4);
  --elev-2: 0 6px 20px -6px rgb(0 0 0 / 0.5);
  --elev-3: 0 16px 44px -12px rgb(0 0 0 / 0.6);
  --edge-light: inset 0 1px 0 rgb(255 255 255 / 0.04);

  --t-micro: 11px;
  --t-small: 12px;
  --wght-regular: 400;
  --wght-medium: 520;
  --wght-semibold: 600;
  --wght-bold: 700;
  --track-tight: -0.011em;
  --track-wide: 0.04em;
  --font-ui:
    "Inter Variable", "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system,
    sans-serif;

  --dur-1: 120ms;
  --dur-2: 160ms;
  --dur-3: 240ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 1ms;
    --dur-2: 1ms;
    --dur-3: 1ms;
  }
}