/*
  Quant Compose accent system — tokens.

  The six properties accent.js writes on <html>, with the default (graphite
  on light surfaces, paper on dark ones) as their initial values so a page
  reads correctly before any script runs; and the semantic properties a host
  uses in its styles (--accent-base, -hot, -ink, -soft, -glow and --warm),
  resolved for the current scheme to the same values the website's
  tokens.css resolves.

  A host that already declares these (the website's tokens.css does) does
  not need this file. A host with its own token names maps them once:

    :root { --my-accent: var(--accent-base); --my-accent-ink: var(--accent-ink); }
*/
:root {
  --accent-light-base: #12161c;
  --accent-light-hot: #262e3b;
  --accent-light-ink: #ffffff;
  --accent-dark-base: #f4f5f8;
  --accent-dark-hot: #f3f4f7;
  --accent-dark-ink: #06141a;

  /* warm counterweight: baselines, caveats, the worst fold; never the accent */
  --warm-light: #985a05;
  --warm-dark: #f2b84b;

  --accent-base: var(--accent-light-base);
  --accent-hot: var(--accent-light-hot);
  --accent-ink: var(--accent-light-ink);
  --accent-soft: color-mix(in oklab, var(--accent-base) 12%, transparent);
  --accent-glow: color-mix(in oklab, var(--accent-hot) 32%, transparent);
  --warm: var(--warm-light);
}

/* Dark scheme, chosen or inherited from the system, and any dark zone inside a light page. */
:root[data-theme="dark"], [data-zone="deep"], .accent-on-dark {
  --accent-base: var(--accent-dark-base);
  --accent-hot: var(--accent-dark-hot);
  --accent-ink: var(--accent-dark-ink);
  --accent-soft: color-mix(in oklab, var(--accent-base) 14%, transparent);
  --accent-glow: color-mix(in oklab, var(--accent-hot) 28%, transparent);
  --warm: var(--warm-dark);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --accent-base: var(--accent-dark-base);
    --accent-hot: var(--accent-dark-hot);
    --accent-ink: var(--accent-dark-ink);
    --accent-soft: color-mix(in oklab, var(--accent-base) 14%, transparent);
    --accent-glow: color-mix(in oklab, var(--accent-hot) 28%, transparent);
    --warm: var(--warm-dark);
  }
}
