/* IBO design tokens v11 — shadcn/ui (neutral, dark) + Luma preset (claude/ibo-tokens-v11.css, RESTYLE v11 §1).
   Names follow shadcn so the product can move to shadcn/Tailwind later without renaming.
   Every colour in the product comes from this file. */
:root, .dark {
  color-scheme: dark;
  /* surfaces & text */
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.922 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 7.5%);
  --ring: oklch(0.556 0 0);

  /* status (always with a word, sign or icon) */
  --destructive: oklch(0.704 0.191 22.216);
  --pos: oklch(0.765 0.177 163.2);
  --neg: var(--destructive);
  --warn: oklch(0.828 0.189 84.4);

  /* charts: one series = neutral ramp; several = series 1–4 (validated dark, card surface) */
  --chart-1: oklch(0.87 0 0);   /* current period */
  --chart-2: oklch(0.556 0 0);
  --chart-3: oklch(0.439 0 0);  /* past periods */
  --chart-4: oklch(0.371 0 0);
  --chart-5: oklch(0.269 0 0);
  --series-1: #2296D1;
  --series-2: #D4599B;
  --series-3: #7E6ADE;
  --series-4: #1AA291;

  /* sidebar (menu inverted / translucent, accent subtle) */
  --sidebar: color-mix(in oklch, var(--card) 70%, transparent);
  --sidebar-foreground: oklch(0.985 0 0 / 72%);
  --sidebar-accent: oklch(0.985 0 0 / 9%);
  --sidebar-border: var(--border);
  --sidebar-w: 248px;
  --sidebar-w-collapsed: 64px;

  /* shape */
  --radius: 0.625rem;            /* shadcn base */
  --radius-card: 26px;
  --radius-inner: 16px;
  --radius-chip: 9px;
  --radius-pill: 999px;

  /* type */
  --font-sans: "Inter", "Inter Variable", system-ui, sans-serif;
  --text-display: 600 32px/1.15 var(--font-sans);
  --text-section: 600 20px/1.3 var(--font-sans);
  --text-title: 500 16px/1.5 var(--font-sans);
  --text-body: 400 14px/1.45 var(--font-sans);
  --text-caption: 400 12px/1.4 var(--font-sans);

  /* layout */
  --container: 1280px;
  --page-x: 32px;
  --gap: 16px;
  --header-h: 64px;
  --control-h: 36px;

  /* motion · FEATURE v11.3 §1: every duration and curve in CSS and JS comes from these tokens */
  --dur-1: 120ms;   /* hover, press, switches */
  --dur-2: 180ms;   /* popovers, tooltips, tabs */
  --dur-3: 240ms;   /* pages, dialogs, sheet, expanding sections */
  --dur-4: 600ms;   /* the first drawing of charts */
  --ease-out: cubic-bezier(.22, .9, .24, 1);   /* appearing */
  --ease-in: cubic-bezier(.4, 0, 1, 1);        /* leaving */
  --ease-io: cubic-bezier(.65, 0, .35, 1);     /* size change, reordering */
  --ease-linear: linear;                       /* loops (spinner, marching gap, progress) */
  --stagger: 30ms;  /* cascade step, 8 steps at most */
  --stagger-row: 20ms;  /* table rows, chart bars */
  --rise: 8px;      /* shift when appearing */
  --shift: 12px;    /* deeper / back */
  --tip-delay: 150ms;   /* tooltip waits before showing */
  --load-delay: 150ms;  /* a load shows the progress bar after this */
  /* loops kept from production (RESTYLE §7): critical row glow, dot, marching gap, tip ripple; spinner, skeleton, progress */
  --dur-crit-glow: 2.4s; --dur-crit-dot: 1.2s; --dur-crit-march: .9s; --dur-crit-tip: 1.6s; --dur-crit-ring: 1.8s;
  --dur-spin: .8s; --dur-spin-slow: 2.4s; --dur-pulse: 1.6s; --dur-progress: 1s;

  /* ---- IBO extensions: every value derives from the tokens above ---- */
  --pos-soft: color-mix(in oklch, var(--pos) 18%, transparent);       /* badge fills (§3 Badge: colour 18% + text) */
  --neg-soft: color-mix(in oklch, var(--neg) 18%, transparent);
  --warn-soft: color-mix(in oklch, var(--warn) 18%, transparent);
  --neutral-soft: oklch(1 0 0 / 6%);
  --well: oklch(1 0 0 / 4%);                                           /* §3 Well: foreground 4% */
  --border-strong: oklch(1 0 0 / 15%);
  --row-hover: oklch(1 0 0 / 3%);                                      /* §5.1 hover 3% white */
  --row-group: oklch(1 0 0 / 2.5%);                                    /* Σ / ƒx rows */
  --meter-track: oklch(1 0 0 / 9%);
  --plan-line: color-mix(in oklch, var(--foreground) 70%, transparent);
  --chart-grid: oklch(1 0 0 / 6%);
  --chart-zero: oklch(1 0 0 / 20%);
  --neg-past: color-mix(in oklch, var(--neg) 45%, transparent);
  --pos-band: color-mix(in oklch, var(--pos) 8%, transparent);
  --scrim: oklch(0 0 0 / 60%);
  --ring-focus: color-mix(in oklch, var(--ring) 45%, transparent);
  --shadow-pop: 0 8px 24px oklch(0 0 0 / 40%);
  --no-glow: transparent;
  --series-other: var(--chart-2);
  --crit-edge: color-mix(in oklch, var(--neg) 35%, transparent);
  --crit-line: color-mix(in oklch, var(--neg) 35%, transparent);
  --entered-tile-edge: var(--border-strong);
  --calc-edge: var(--border-strong);
  --new-row: var(--row-group);
  --elev-1: none; --elev-2: none; --elev-left: none; --elev-dialog: none;
  --num-hero: 600 32px/1.15 var(--font-sans);

  /* FEATURE v11.18 · quality bands behind a chart: barely there, the data stays on top (Normal has no fill) */
  --band-poor: color-mix(in oklch, var(--neg) 5%, transparent);
  --band-fair: color-mix(in oklch, var(--warn) 4%, transparent);
  --band-good: color-mix(in oklch, var(--pos) 3%, transparent);
  --band-excellent: color-mix(in oklch, var(--pos) 6%, transparent);
  --band-edge: color-mix(in oklch, var(--border) 40%, transparent);
}
/* FEATURE v11.18 · light values. The product ships dark only: this scope holds what a light theme gets (shadcn neutral light) and is
   checked on a light sample in /dev/ui; the bands are a little denser on white, where the same share reads fainter */
.light {
  color-scheme: light;
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --border: oklch(0.922 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --pos: oklch(0.596 0.145 163.225);
  --neg: var(--destructive);
  --warn: oklch(0.666 0.179 58.318);
  --chart-1: oklch(0.205 0 0);
  --chart-2: oklch(0.439 0 0);
  --chart-3: oklch(0.556 0 0);
  --chart-grid: oklch(0 0 0 / 6%);
  --plan-line: color-mix(in oklch, var(--foreground) 70%, transparent);
  --band-poor: color-mix(in oklch, var(--neg) 5%, transparent);
  --band-fair: color-mix(in oklch, var(--warn) 6%, transparent);
  --band-good: color-mix(in oklch, var(--pos) 4%, transparent);
  --band-excellent: color-mix(in oklch, var(--pos) 8%, transparent);
  --band-edge: color-mix(in oklch, oklch(0 0 0 / 10%) 40%, transparent);
  /* FIX v11.22 · the field and table surfaces on white (the dark values are white at a few %, invisible here) */
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --neutral-soft: oklch(0 0 0 / 5%);
  --well: oklch(0 0 0 / 3%);
  --border-strong: oklch(0 0 0 / 15%);
  --row-hover: oklch(0 0 0 / 3%);
  --row-group: oklch(0 0 0 / 2.5%);
  --meter-track: oklch(0 0 0 / 8%);
  --chart-zero: oklch(0 0 0 / 20%);
}
@media (prefers-reduced-motion: reduce){
  :root{ --dur-1:0ms; --dur-2:80ms; --dur-3:120ms; --dur-4:0ms; --stagger:0ms; --stagger-row:0ms; --rise:0px; --shift:0px; }
}
/* the in-app setting (Settings › Motion) does the same */
body.motion-reduced,body.motion-off{ --dur-1:0ms; --dur-2:80ms; --dur-3:120ms; --dur-4:0ms; --stagger:0ms; --stagger-row:0ms; --rise:0px; --shift:0px; }
body.motion-off{ --dur-2:0ms; --dur-3:0ms; }