/* Atlas tokens — every colour, shadow, radius and curve the shell, the kit and the modules read.
   Values are Atlas v7.1's (ui-kit/atlas.css §1, shell.css aura/frame/bubble), in OKLCH.
   Light is on :root. Dark is written twice: under the system preference (unless the user picked
   light) and under an explicit data-theme="dark". With no system preference the page is light.
   No raw colour inside a component: components read these names, so both themes turn by themselves.

   Load order: tokens.css → components.css → blocks.css → (shell styles). */

:root {
  /* --- constants ------------------------------------------------------------------------------------- */
  /* Brand colours of the orb. NEVER changed (brand standard, docs/marka.md). */
  --atlas-cyan: #04deef; --atlas-teal: #02a2d0; --atlas-blue: #0051d4; --atlas-deep: #001a3a;

  /* The accent is two numbers; the aura (frame, backdrop, user bubble) is two more, which
     prefs.js writes onto <html> from the user's choice. */
  --accent-h: 248; --accent-c: .135;
  --aura-h: 248; --aura-k: 1;

  /* Glass grows thicker with its step: blur, shadow and edge contrast move together. */
  --glass-blur-1: 8px; --glass-blur-2: 18px; --glass-blur-3: 28px; --glass-blur-4: 40px;
  --glass-saturation: 1.8;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --spring: cubic-bezier(.34, 1.56, .64, 1);

  --r-1: 8px; --r-2: 12px; --r-3: 16px; --r-4: 22px; --r-pill: 999px;
  --u: 4px;                       /* every measure is a multiple */
  --touch-target: 44px;           /* a gloved finger on a line tablet */

  /* System faces only: nothing is downloaded (air-gapped installs, CSP). Inter / Geist are
     used only if the machine has them. */
  --font-sans: -apple-system, BlinkMacSystemFont, "Inter", "Geist Variable", "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Geist Mono Variable", Menlo, monospace;

  /* --- light ------------------------------------------------------------------------------------------- */
  color-scheme: light;
  --bg: oklch(98.6% .004 240); --bg-2: oklch(97% .005 240);
  --frame: oklch(94.5% calc(.008 * var(--aura-k)) var(--aura-h));
  --surface: oklch(100% 0 0); --surface-2: oklch(98% .004 240); --surface-3: oklch(96% .006 240);

  --glass-1: oklch(100% 0 0 / .55); --glass-2: oklch(100% 0 0 / .68);
  --glass-3: oklch(100% 0 0 / .82); --glass-4: oklch(100% 0 0 / .90);
  --glass-edge-top: oklch(100% 0 0 / .90); --glass-edge-bottom: oklch(100% 0 0 / .25);
  --glass-inner-light: oklch(100% 0 0 / .60);
  --glass-body-shadow: oklch(25% .03 255 / .10);
  --glass-dimming: oklch(20% .02 255 / .35);
  --sheen-1: oklch(100% 0 0 / .18); --sheen-2: oklch(100% 0 0 / .05);

  --border: oklch(92% .006 250 / .9); --border-2: oklch(89% .008 250); --border-strong: oklch(84% .01 250);

  --text: oklch(22% .02 255); --text-2: oklch(46% .014 255);
  --text-3: oklch(62% .012 255); --text-faint: oklch(74% .01 255);
  --hover: oklch(22% .02 255 / .05);

  --accent: oklch(58% var(--accent-c) var(--accent-h));
  --accent-2: oklch(64% calc(var(--accent-c) * .95) calc(var(--accent-h) + 18));
  --accent-strong: oklch(50% var(--accent-c) var(--accent-h));
  --accent-fg: oklch(99% 0 0);
  --accent-soft: oklch(95% .04 var(--accent-h));
  --accent-text: oklch(45% var(--accent-c) var(--accent-h));
  --ring: oklch(58% var(--accent-c) var(--accent-h) / .35);

  --good: oklch(56% .13 155); --good-soft: oklch(94% .05 155);
  --warn: oklch(64% .14 70);  --warn-soft: oklch(95% .06 75);
  --bad: oklch(58% .18 25);   --bad-soft: oklch(95% .05 25);
  --info: oklch(56% .12 235); --info-soft: oklch(95% .04 235);
  /* Status steps the kit needs beyond v7.1 (an orange between warn and bad, and text inks that
     read on the soft fills), derived on the same hues. */
  --good-ink: oklch(42% .12 155); --warn-ink: oklch(48% .12 70);
  --serious: oklch(62% .16 45); --serious-soft: oklch(95% .05 45); --serious-ink: oklch(50% .15 45);
  --bad-ink: oklch(48% .17 25); --info-ink: oklch(45% .11 235);

  /* Colour grammar: three yellows, three meanings, and a green that is only ever text.
     quote = "the answer came from exactly here", admin = "admin-only place" (background),
     folder = "a container", assigned = "you have extra work here" (text, no fill). */
  --quote: oklch(93% .11 95);
  --admin: oklch(72% .14 85); --admin-soft: oklch(96% .06 88); --admin-text: oklch(52% .12 82);
  --folder: oklch(76% .14 82);
  --assigned: oklch(58% .13 155); --assigned-soft: oklch(94% .05 155);

  /* Series: identity, not state. Fixed order, never cycled past eight. */
  --series-1: #2a78d6; --series-2: #eb6834; --series-3: #1baf7a; --series-4: #eda100;
  --series-5: #e87ba4; --series-6: #008300; --series-7: #4a3aa7; --series-8: #e34948;

  --code-bg: oklch(97% .004 250);
  --scrim: oklch(30% .02 255 / .28);
  --overlay: oklch(0% 0 0 / .42);

  --bubble-me: oklch(91% calc(.07 * (.25 + .75 * var(--aura-k))) var(--aura-h));
  --bubble-me-text: oklch(25% .02 var(--aura-h));

  --sh-1: 0 1px 2px oklch(25% .03 255 / .06), 0 1px 1px oklch(25% .03 255 / .04);
  --sh-2: 0 4px 16px oklch(25% .03 255 / .08), 0 1px 3px oklch(25% .03 255 / .05);
  --sh-3: 0 18px 50px oklch(25% .04 255 / .16), 0 6px 18px oklch(25% .03 255 / .08);
  --sh-pop: 0 26px 70px oklch(25% .05 255 / .22), 0 10px 24px oklch(25% .03 255 / .1);

  /* Aura: three drifting glows behind the content, pale here, deep in the dark. */
  --aura-opacity: .62;
  --aura-1: oklch(95% calc(.09 * var(--aura-k)) var(--aura-h));
  --aura-2: oklch(96% calc(.075 * var(--aura-k)) calc(var(--aura-h) - 32));
  --aura-3: oklch(96% calc(.08 * var(--aura-k)) calc(var(--aura-h) + 30));
}

/* --- dark (1/2): the system says dark and the user did not pick light ------------------------------------ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: oklch(15% .012 260); --bg-2: oklch(17.5% .014 260);
    --frame: oklch(19.5% calc(.014 * var(--aura-k)) var(--aura-h));
    --surface: oklch(20% .016 260); --surface-2: oklch(23% .016 260); --surface-3: oklch(26% .018 260);
    --glass-1: oklch(24% .016 260 / .50); --glass-2: oklch(23% .016 260 / .62);
    --glass-3: oklch(22% .016 260 / .78); --glass-4: oklch(20% .016 260 / .88);
    --glass-edge-top: oklch(100% .02 255 / .28); --glass-edge-bottom: oklch(100% .02 255 / .06);
    --glass-inner-light: oklch(100% .02 255 / .12);
    --glass-body-shadow: oklch(0% 0 0 / .50);
    --glass-dimming: oklch(0% 0 0 / .35);
    --sheen-1: oklch(100% 0 0 / .10); --sheen-2: oklch(100% 0 0 / .03);
    --border: oklch(100% 0 0 / .08); --border-2: oklch(100% 0 0 / .12); --border-strong: oklch(100% 0 0 / .18);
    --text: oklch(95% .008 250); --text-2: oklch(74% .012 255);
    --text-3: oklch(60% .012 255); --text-faint: oklch(48% .012 255);
    --hover: oklch(95% .008 250 / .06);
    --accent: oklch(72% calc(var(--accent-c) * 1.05) var(--accent-h));
    --accent-2: oklch(76% var(--accent-c) calc(var(--accent-h) + 18));
    --accent-strong: oklch(78% var(--accent-c) var(--accent-h));
    --accent-fg: oklch(16% .02 255);
    --accent-soft: oklch(30% .05 var(--accent-h) / .5);
    --accent-text: oklch(80% var(--accent-c) var(--accent-h));
    --ring: oklch(72% var(--accent-c) var(--accent-h) / .4);
    --good: oklch(74% .13 155); --good-soft: oklch(32% .06 155 / .5);
    --warn: oklch(80% .12 75);  --warn-soft: oklch(34% .06 75 / .5);
    --bad: oklch(70% .16 25);   --bad-soft: oklch(34% .07 25 / .5);
    --info: oklch(74% .11 235); --info-soft: oklch(32% .05 235 / .5);
    --good-ink: oklch(82% .12 155); --warn-ink: oklch(86% .11 75);
    --serious: oklch(76% .14 45); --serious-soft: oklch(34% .07 45 / .5); --serious-ink: oklch(84% .12 45);
    --bad-ink: oklch(82% .14 25); --info-ink: oklch(82% .10 235);
    --quote: oklch(40% .09 95 / .6);
    --admin: oklch(82% .13 88); --admin-soft: oklch(34% .07 88 / .45); --admin-text: oklch(84% .12 88);
    --folder: oklch(78% .13 82);
    --assigned: oklch(74% .13 155); --assigned-soft: oklch(32% .06 155 / .45);
    --series-1: #6fa8f0; --series-2: #ff9163; --series-3: #4fd3a0; --series-4: #f5c451;
    --series-5: #f5a3c1; --series-6: #5cc45c; --series-7: #9b8ce8; --series-8: #ff7f7e;
    --code-bg: oklch(19% .014 260);
    --scrim: oklch(0% 0 0 / .5);
    --bubble-me: oklch(41% calc(.10 * (.25 + .75 * var(--aura-k))) var(--aura-h));
    --bubble-me-text: oklch(97% .01 var(--aura-h));
    --sh-1: 0 1px 2px oklch(0% 0 0 / .30);
    --sh-2: 0 4px 16px oklch(0% 0 0 / .40), 0 1px 3px oklch(0% 0 0 / .30);
    --sh-3: 0 18px 50px oklch(0% 0 0 / .55), 0 6px 18px oklch(0% 0 0 / .35);
    --sh-pop: 0 26px 70px oklch(0% 0 0 / .65), 0 10px 24px oklch(0% 0 0 / .40);
    --aura-opacity: .5;
    --aura-1: oklch(38% calc(.11 * var(--aura-k)) var(--aura-h));
    --aura-2: oklch(34% calc(.09 * var(--aura-k)) calc(var(--aura-h) - 32));
    --aura-3: oklch(36% calc(.10 * var(--aura-k)) calc(var(--aura-h) + 30));
  }
}

/* --- dark (2/2): the user picked dark. Keep in step with the block above. -------------------------------- */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: oklch(15% .012 260); --bg-2: oklch(17.5% .014 260);
  --frame: oklch(19.5% calc(.014 * var(--aura-k)) var(--aura-h));
  --surface: oklch(20% .016 260); --surface-2: oklch(23% .016 260); --surface-3: oklch(26% .018 260);
  --glass-1: oklch(24% .016 260 / .50); --glass-2: oklch(23% .016 260 / .62);
  --glass-3: oklch(22% .016 260 / .78); --glass-4: oklch(20% .016 260 / .88);
  --glass-edge-top: oklch(100% .02 255 / .28); --glass-edge-bottom: oklch(100% .02 255 / .06);
  --glass-inner-light: oklch(100% .02 255 / .12);
  --glass-body-shadow: oklch(0% 0 0 / .50);
  --glass-dimming: oklch(0% 0 0 / .35);
  --sheen-1: oklch(100% 0 0 / .10); --sheen-2: oklch(100% 0 0 / .03);
  --border: oklch(100% 0 0 / .08); --border-2: oklch(100% 0 0 / .12); --border-strong: oklch(100% 0 0 / .18);
  --text: oklch(95% .008 250); --text-2: oklch(74% .012 255);
  --text-3: oklch(60% .012 255); --text-faint: oklch(48% .012 255);
  --hover: oklch(95% .008 250 / .06);
  --accent: oklch(72% calc(var(--accent-c) * 1.05) var(--accent-h));
  --accent-2: oklch(76% var(--accent-c) calc(var(--accent-h) + 18));
  --accent-strong: oklch(78% var(--accent-c) var(--accent-h));
  --accent-fg: oklch(16% .02 255);
  --accent-soft: oklch(30% .05 var(--accent-h) / .5);
  --accent-text: oklch(80% var(--accent-c) var(--accent-h));
  --ring: oklch(72% var(--accent-c) var(--accent-h) / .4);
  --good: oklch(74% .13 155); --good-soft: oklch(32% .06 155 / .5);
  --warn: oklch(80% .12 75);  --warn-soft: oklch(34% .06 75 / .5);
  --bad: oklch(70% .16 25);   --bad-soft: oklch(34% .07 25 / .5);
  --info: oklch(74% .11 235); --info-soft: oklch(32% .05 235 / .5);
  --good-ink: oklch(82% .12 155); --warn-ink: oklch(86% .11 75);
  --serious: oklch(76% .14 45); --serious-soft: oklch(34% .07 45 / .5); --serious-ink: oklch(84% .12 45);
  --bad-ink: oklch(82% .14 25); --info-ink: oklch(82% .10 235);
  --quote: oklch(40% .09 95 / .6);
  --admin: oklch(82% .13 88); --admin-soft: oklch(34% .07 88 / .45); --admin-text: oklch(84% .12 88);
  --folder: oklch(78% .13 82);
  --assigned: oklch(74% .13 155); --assigned-soft: oklch(32% .06 155 / .45);
  --series-1: #6fa8f0; --series-2: #ff9163; --series-3: #4fd3a0; --series-4: #f5c451;
  --series-5: #f5a3c1; --series-6: #5cc45c; --series-7: #9b8ce8; --series-8: #ff7f7e;
  --code-bg: oklch(19% .014 260);
  --scrim: oklch(0% 0 0 / .5);
  --bubble-me: oklch(41% calc(.10 * (.25 + .75 * var(--aura-k))) var(--aura-h));
  --bubble-me-text: oklch(97% .01 var(--aura-h));
  --sh-1: 0 1px 2px oklch(0% 0 0 / .30);
  --sh-2: 0 4px 16px oklch(0% 0 0 / .40), 0 1px 3px oklch(0% 0 0 / .30);
  --sh-3: 0 18px 50px oklch(0% 0 0 / .55), 0 6px 18px oklch(0% 0 0 / .35);
  --sh-pop: 0 26px 70px oklch(0% 0 0 / .65), 0 10px 24px oklch(0% 0 0 / .40);
  --aura-opacity: .5;
  --aura-1: oklch(38% calc(.11 * var(--aura-k)) var(--aura-h));
  --aura-2: oklch(34% calc(.09 * var(--aura-k)) calc(var(--aura-h) - 32));
  --aura-3: oklch(36% calc(.10 * var(--aura-k)) calc(var(--aura-h) + 30));
}

/* --- compatibility aliases ---------------------------------------------------------------------------------
   The names the shell, kit.js and every module's widgets.css used before v7.1 (audited with
   grep "var(--" over atlas/web and every module version folder). They point at the new tokens, so old CSS
   turns with the theme. Defined once: each var() resolves on :root, where the theme blocks live.
   Never remove one in this release. Chart code also builds var(--<status>) and var(--s<n>) names. */
:root {
  --side: var(--frame);
  --panel: var(--surface); --panel-2: var(--surface-2);
  --line: var(--border); --line-2: var(--border-2);
  --muted: var(--text-3);
  --accent-ink: var(--accent-text);
  --shadow: var(--sh-2); --shadow-lg: var(--sh-3);
  --r: var(--r-2); --r-sm: var(--r-1);
  --font: var(--font-sans); --mono: var(--font-mono);

  --s1: var(--series-1); --s2: var(--series-2); --s3: var(--series-3); --s4: var(--series-4);
  --s5: var(--series-5); --s6: var(--series-6); --s7: var(--series-7); --s8: var(--series-8);

  /* status: good / warning / serious / critical (+ info, neutral, done), each with -bg and -ink */
  --good-bg: var(--good-soft);
  --warning: var(--warn); --warning-bg: var(--warn-soft); --warning-ink: var(--warn-ink);
  --serious-bg: var(--serious-soft);
  --critical: var(--bad); --critical-bg: var(--bad-soft); --critical-ink: var(--bad-ink);
  --info-bg: var(--info-soft);
  --neutral: var(--text-3); --neutral-bg: var(--surface-3); --neutral-ink: var(--text-2);
  --done: var(--text-3); --done-bg: var(--surface-2); --done-ink: var(--text-2);
}