/* Design tokens — single source of truth.
   Direction: enterprise analytics. One sans voice (Inter Tight), tabular mono
   for numerics. Neutral slate palette with gold reserved as a status signal.
   Calibrated for C-level daily use: calm, unadorned, data-first. */

:root {
  /* ── Signal palette (status only — never decoration) ─────────── */
  --gold: #ad7f00;        /* on-target / primary signal; contrast 4.9:1 on white */
  --gold-bg: rgba(173, 127, 0, 0.08);
  --red: #b42318;
  --red-bg: rgba(180, 35, 24, 0.07);
  --green: #087443;
  --green-bg: rgba(8, 116, 67, 0.07);
  --blue: #0b4bac;
  --blue-bg: rgba(11, 75, 172, 0.06);
  --amber: #b54708;
  --amber-bg: rgba(181, 71, 8, 0.07);
  --violet: #6941c6;
  --teal: #116f62;

  /* ── Light theme — cool enterprise slate ─────────────────────── */
  --bg: #f7f8fa;
  --card: #ffffff;
  --fg: #0f172a;          /* slate-900 */
  --fg-soft: #1e293b;     /* slate-800 */
  --fg-muted: #475569;    /* slate-600 */
  --muted: #64748b;       /* slate-500 */
  --subtle: #f1f5f9;      /* slate-100 */
  --subtle-2: #e2e8f0;    /* slate-200 */
  --border: #e2e8f0;      /* slate-200 — solid, not rgba */
  --border-strong: #cbd5e1;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 1px 3px rgba(15, 23, 42, 0.05), 0 4px 12px rgba(15, 23, 42, 0.04);

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

  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-base: 13.5px;
  --fs-md: 15px;
  --fs-lg: 18px;
  --fs-xl: 26px;
  --fs-2xl: 34px;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi: 600;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.55;

  --tracking-tight: -0.01em;
  --tracking-wide: 0.04em;
  --tracking-label: 0.06em;

  /* ── Spacing (4px rhythm) ────────────────────────────────────── */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;

  /* ── Radii ───────────────────────────────────────────────────── */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 8px;
  --r-xl: 10px;
  --r-2xl: 14px;
  --r-pill: 999px;

  /* ── Layout ──────────────────────────────────────────────────── */
  --page-max: 1240px;
  --hairline: 1px;

  /* ── Motion ──────────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 120ms;
  --dur-med: 200ms;
}

/* ── Dark theme — Linear-style cool charcoal ──────────────────── */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0d12;
    --card: #13161d;
    --fg: #f1f5f9;
    --fg-soft: #cbd5e1;
    --fg-muted: #94a3b8;
    --muted: #64748b;
    --subtle: #1a1f2a;
    --subtle-2: #242a36;
    --border: #242a36;
    --border-strong: #2f3745;
    --gold: #e5b031;
    --gold-bg: rgba(229, 176, 49, 0.09);
    --red: #f87171;
    --red-bg: rgba(248, 113, 113, 0.09);
    --green: #4ade80;
    --green-bg: rgba(74, 222, 128, 0.09);
    --blue: #7aa9ff;
    --blue-bg: rgba(122, 169, 255, 0.08);
    --amber: #fbbf24;
    --amber-bg: rgba(251, 191, 36, 0.08);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 1px 2px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.35);
  }
}

[data-theme="dark"] {
  --bg: #0b0d12;
  --card: #13161d;
  --fg: #f1f5f9;
  --fg-soft: #cbd5e1;
  --fg-muted: #94a3b8;
  --muted: #64748b;
  --subtle: #1a1f2a;
  --subtle-2: #242a36;
  --border: #242a36;
  --border-strong: #2f3745;
  --gold: #e5b031;
  --gold-bg: rgba(229, 176, 49, 0.09);
  --red: #f87171;
  --red-bg: rgba(248, 113, 113, 0.09);
  --green: #4ade80;
  --green-bg: rgba(74, 222, 128, 0.09);
  --blue: #7aa9ff;
  --blue-bg: rgba(122, 169, 255, 0.08);
  --amber: #fbbf24;
  --amber-bg: rgba(251, 191, 36, 0.08);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 1px 2px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.35);
}