/* Design tokens — single source of truth.
   Calibrated for long sessions in a darkened operations room. */

:root {
  /* Neutral scale — eleven steps, slightly warm to soften CRT glare. */
  --neu-0:  #06070A;   /* page base */
  --neu-1:  #0A0B0E;   /* surface 0 */
  --neu-2:  #0F1116;   /* surface 1 */
  --neu-3:  #14161D;   /* surface 2 (cards) */
  --neu-4:  #1B1E27;   /* hover surfaces */
  --neu-5:  #262A35;   /* dividers */
  --neu-6:  #353A48;   /* subtle border */
  --neu-7:  #4A5061;   /* muted border */
  --neu-8:  #6B7388;   /* placeholder text */
  --neu-9:  #9AA1B4;   /* secondary text */
  --neu-10: #C7CCD8;   /* primary text */
  --neu-11: #ECEEF3;   /* loud text */

  /* Single accent. Adjusted to stay below WCAG max chroma so it doesn't
     glow obnoxiously. We earn intensity through restraint elsewhere. */
  --accent-bg: #1F3A86;
  --accent: #4F8CFF;
  --accent-hi: #7BA8FF;
  --accent-soft: rgba(79, 140, 255, 0.10);
  --accent-ring: rgba(79, 140, 255, 0.32);

  /* Status hues — desaturated, paired with neutral background tint. */
  --ok: #45B27A;
  --ok-soft: rgba(69, 178, 122, 0.12);
  --warn: #D19B3B;
  --warn-soft: rgba(209, 155, 59, 0.12);
  --err: #D85763;
  --err-soft: rgba(216, 87, 99, 0.12);
  --info: var(--accent);
  --info-soft: var(--accent-soft);

  /* Typography */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo,
               Consolas, monospace;

  --fs-xxs: 11px;
  --fs-xs:  12px;
  --fs-sm:  13px;
  --fs-md:  14px;
  --fs-lg:  16px;
  --fs-xl:  20px;
  --fs-2xl: 28px;
  --fs-3xl: 38px;

  --lh-tight: 1.2;
  --lh-snug:  1.35;
  --lh-normal: 1.5;

  --fw-regular: 420;
  --fw-medium:  520;
  --fw-semi:    600;
  --fw-bold:    680;

  /* Spacing — 4px grid. Half-steps allowed for hairlines. */
  --s-0: 0;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 32px;
  --s-8: 40px;
  --s-9: 56px;
  --s-10: 80px;

  /* Radius — small, never pillowy. */
  --r-xs: 3px;
  --r-sm: 5px;
  --r-md: 7px;
  --r-lg: 10px;
  --r-pill: 999px;

  /* Borders */
  --bw: 1px;
  --bw-2: 2px;

  /* Shadows — restrained. Most surfaces use 1px borders, not blur. */
  --sh-1: 0 1px 0 0 rgba(0,0,0,0.45);
  --sh-2: 0 6px 18px -8px rgba(0,0,0,0.55), 0 1px 0 0 rgba(0,0,0,0.4);
  --sh-3: 0 24px 48px -16px rgba(0,0,0,0.7), 0 2px 4px -2px rgba(0,0,0,0.4);

  /* Motion — fast, never theatrical. */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --dur-1: 90ms;
  --dur-2: 160ms;
  --dur-3: 240ms;
  --dur-4: 360ms;

  /* Layout */
  --sidebar-w: 232px;
  --topbar-h: 56px;
  --content-max: 1320px;
}

/* The app is dark-only by design intent (operator console).
   We still respect prefers-reduced-motion. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms;
    --dur-2: 0ms;
    --dur-3: 0ms;
    --dur-4: 0ms;
  }
}