/* largen dark theme.
 *
 * Eleven token overrides and the whole library follows — every component, every
 * variant, every size — because all of them resolve through --tone*, and the
 * mixes recompute against the new canvas.
 *
 * There is no per-component dark rule anywhere in largen. That is the test of
 * whether the algebra is real.
 *
 * Layered, like every other stylesheet largen ships. That is not a detail: an
 * unlayered theme outranks every layer, so a consumer's own token overrides
 * written inside `@layer largen.tokens` would lose to it silently. This file was
 * unlayered while src/tokens.css was not, and the asymmetry was invisible in
 * light mode — where the layered defaults were the only competition — and total
 * in dark, where this file is the only way to get there at all.
 *
 * Override these from unlayered CSS, which beats every layer by design.
 */

@layer largen.tokens {
  [data-theme="dark"] {
    --canvas: #101214;
    --ink: #f2f4f6;
    --ink-muted: #99a1ab;
    --surface: #1a1e22;
    --line: #2c3238;

    /* Hues lifted for legibility on a dark canvas; -on colours flip to dark. */
    --primary: #5aa9f0;   --primary-on: #0a1622;
    --secondary: #a8b0ba; --secondary-on: #101214;
    --success: #5cc97c;   --success-on: #07160c;
    --info: #46c2d8;      --info-on: #04171a;
    --warning: #e0a44a;   --warning-on: #1b1204;
    --danger: #f07878;    --danger-on: #200a0a;
    --neutral: #e6e9ec;   --neutral-on: #101214;

    --hue-red: #f07878;    --hue-pink: #ef7ba5;   --hue-grape: #c88ae8;
    --hue-violet: #a08cf5; --hue-indigo: #8496f2; --hue-blue: #5aa9f0;
    --hue-cyan: #46c2d8;   --hue-teal: #3fc9a3;   --hue-green: #5cc97c;
    --hue-lime: #a3d148;   --hue-yellow: #e0c94a; --hue-orange: #ef9a5c;
    --hue-slate: #99a1ab;  --hue-stone: #b3a89f;

    --shade: rgba(255, 255, 255, 0.07);
    --shade-strong: rgba(0, 0, 0, 0.6);

    color-scheme: dark;
  }
}
