:root {
  /* ---- Brand (from the MIA logotype) ---- */
  --brand-navy: #132e4e;
  --brand-navy-700: #1c4270;
  --brand-navy-500: #2b5c93;
  --brand-green: #00906c;
  --brand-green-600: #038067;
  --brand-green-700: #056055;
  --brand-gradient: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-green) 100%);

  /* ---- MIA accent: orange marks everything the agent produced ---- */
  --accent-orange-50: oklch(0.98 0.016 74);
  --accent-orange-200: oklch(0.9 0.06 70);
  --accent-orange-300: oklch(0.84 0.09 68);
  --accent-orange-500: oklch(0.705 0.176 47.6);
  --accent-orange-600: oklch(0.646 0.19 41.1);
  --accent-orange-700: oklch(0.553 0.166 40.9);
  --accent-orange-900: oklch(0.352 0.108 39.5);

  /* ---- Neutral ramp (achromatic, straight from the product theme) ---- */
  --neutral-0: oklch(1 0 0);
  --neutral-50: oklch(0.985 0 0);
  --neutral-100: oklch(0.97 0 0);
  --neutral-200: oklch(0.922 0 0);
  --neutral-400: oklch(0.708 0 0);
  --neutral-500: oklch(0.556 0 0);
  --neutral-600: oklch(0.439 0 0);
  --neutral-700: oklch(0.371 0 0);
  --neutral-800: oklch(0.269 0 0);
  --neutral-900: oklch(0.205 0 0);
  --neutral-950: oklch(0.145 0 0);

  /* ---- Semantic surface / text aliases ---- */
  --background: var(--neutral-0);
  --foreground: var(--neutral-950);
  --card: var(--neutral-0);
  --card-foreground: var(--neutral-950);
  --popover: var(--neutral-0);
  --popover-foreground: var(--neutral-950);
  --primary: var(--neutral-900);
  --primary-foreground: var(--neutral-50);
  --secondary: var(--neutral-100);
  --secondary-foreground: var(--neutral-900);
  --muted: var(--neutral-100);
  --muted-foreground: var(--neutral-500);
  --accent: var(--neutral-100);
  --accent-foreground: var(--neutral-900);
  --destructive: oklch(0.577 0.245 27.325);
  --border: var(--neutral-200);
  --input: var(--neutral-200);
  --ring: var(--neutral-400);

  --surface-app: color-mix(in oklab, var(--muted) 30%, transparent);
  --surface-card: var(--card);
  --surface-sunken: color-mix(in oklab, var(--muted) 40%, transparent);
  --surface-rail: color-mix(in oklab, var(--muted) 30%, transparent);
  --text-body: var(--foreground);
  --text-muted: var(--muted-foreground);
  --text-on-primary: var(--primary-foreground);

  /* ---- Status tones (panel data quality + program status) ---- */
  --tone-ok: oklch(0.696 0.17 162.48);
  --tone-ok-surface: oklch(0.95 0.052 163);
  --tone-ok-text: oklch(0.508 0.118 165.6);
  --tone-waiting: oklch(0.769 0.188 70.08);
  --tone-waiting-surface: oklch(0.962 0.059 95.6);
  --tone-waiting-text: oklch(0.554 0.135 66.4);
  --tone-blocked: oklch(0.637 0.237 25.331);
  --tone-blocked-surface: oklch(0.936 0.032 17.7);
  --tone-blocked-text: oklch(0.505 0.213 27.5);
  --tone-info: oklch(0.623 0.214 259.815);
  --tone-info-surface: oklch(0.932 0.032 255.6);
  --tone-info-text: oklch(0.488 0.243 264.4);
  --tone-neutral: oklch(0.869 0.022 252.9);
  --tone-neutral-surface: oklch(0.968 0.007 247.9);
  --tone-neutral-text: oklch(0.446 0.03 256.8);

  --chart-1: oklch(0.87 0 0);
  --chart-2: oklch(0.556 0 0);
  --chart-3: oklch(0.439 0 0);
  --chart-4: oklch(0.371 0 0);
  --chart-5: oklch(0.269 0 0);
}

.dark {
  --background: var(--neutral-950);
  --foreground: var(--neutral-50);
  --card: var(--neutral-900);
  --card-foreground: var(--neutral-50);
  --popover: var(--neutral-900);
  --popover-foreground: var(--neutral-50);
  --primary: oklch(0.922 0 0);
  --primary-foreground: var(--neutral-900);
  --secondary: var(--neutral-800);
  --secondary-foreground: var(--neutral-50);
  --muted: var(--neutral-800);
  --muted-foreground: var(--neutral-400);
  --accent: var(--neutral-800);
  --accent-foreground: var(--neutral-50);
  --destructive: oklch(0.704 0.191 22.216);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: var(--neutral-500);
}