/**
 * Quorum · design tokens (L0-L4). Generated from the design spec by .hallmark/qa/gen-tokens.py;
 * edit the generator, not this file.
 *
 * "The ruled board": warm paper ground, white cells, ink rules, one civic accent and a hi-vis
 * yellow rationed to "now, pinned and you". Light is the seeded scheme ("auto" follows the OS);
 * dark is the same board after hours.
 *
 * Block map (kit tokens-template.css; contract §2.5):
 *   A  :root, [data-ec-preset="quorum"], [data-bs-theme="light"]:not(:root)   default preset, light, FULL set
 *   B  :root[data-color-scheme="dark"], [data-bs-theme="dark"]:not(:root)      default preset, dark, FULL colour set
 *   C  [data-ec-preset="<slug>"]                           per preset, light, FULL colour set
 *   D  [data-ec-preset="<slug>"][data-color-scheme="dark"]  per preset, dark, FULL colour set
 *   then: custom accent, K knobs, L3 legacy Studio aliases, L4 extension/core maps, E (TinyMCE on a
 *   dark OS), reduced motion.
 * Presets (presets/*.json): quorum (Quorum Teal), civic-blue (Civic Blue), aubergine (Aubergine).
 * Colours are literal hex; derived accent colours print their hex first and a color-mix() after,
 * so a custom accent flows through every tint. Max specificity 0,2,0 (the library's inline
 * TokenCompiler block, also 0,2,0 and printed later, owns the accent triplet at runtime).
 */
/* ==========================================================================
   A. Default preset (Quorum Teal), light: FULL set + every scheme-invariant token
   ========================================================================== */

:root,
[data-ec-preset="quorum"],
[data-bs-theme="light"]:not(:root) {
    color-scheme: light;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #F3F2EF;
    --ec-surface: #FFFFFF;
    --ec-surface-2: #E8E6E1;
    --ec-fg: #1A1917;
    --ec-fg-2: #57534E;
    --ec-border: #D6D2CB;
    --ec-accent: #00706C;
    --ec-accent-fg: #FFFFFF;
    --ec-accent-soft: #DDF0ED;   /* preset accentSoft (the library prints the same value) */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #1A1917;
    --q-control: #857F77;
    --q-hover: #F3F2EF;
    --q-accent-strong: #004A47;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 66%, #000);
    --q-tint: #DBEBEA;
    --q-tint: color-mix(in srgb, var(--ec-accent) 14%, var(--ec-surface));
    --q-tint-hover: #CCE2E2;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 20%, var(--ec-surface));
    --q-tint-2: #B8D7D6;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #1F7A3A;
    --q-success-soft: #E4F2E7;
    --q-danger: #B3261E;
    --q-danger-soft: #FBEAE8;
    --q-warning: #7A5300;
    --q-warning-soft: #FDF1CF;
    --q-inverse-bg: #1A1917;
    --q-inverse-fg: #FFFFFF;
    --q-focus-ring: #1A1917;
    --q-focus-gap: #F2B705;
    --q-disabled-bg: #E8E6E1;
    --q-disabled-fg: #8C877F;
    --q-scrim: rgb(26 25 23 / 0.48);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 243, 242, 239;
    --ts-fg-rgb: 26, 25, 23;
    --ts-accent-rgb: 0, 112, 108;
    --ts-link-rgb: 0, 112, 108;
    --ts-link-hover-rgb: 0, 74, 71;
    --ts-success-rgb: 31, 122, 58;
    --ts-danger-rgb: 179, 38, 30;
    --ts-warning-rgb: 122, 83, 0;
    --ts-info-rgb: 0, 112, 108;
    --ts-fg-2-rgb: 87, 83, 78;
    --ts-surface-rgb: 255, 255, 255;
    --ts-surface-2-rgb: 232, 230, 225;

    /* L0 · shape, type, layout and motion (scheme invariant: block A only) */
    --ec-radius: 0px;                      /* Quorum is designed square; a Studio radius override only rounds outer frames and buttons */
    --ec-btn-radius: 0px;
    --ec-img-radius: 0px;
    --ec-shadow: none;                     /* elevation comes from rules, hairlines and the scrim, never blur */
    --ec-font-display: 'Big Shoulders', 'Big Shoulders Fallback', 'Big Shoulders Fallback Arial', 'Arial Narrow', 'Liberation Sans Narrow', sans-serif;
    --ec-font-body: 'Public Sans', 'Public Sans Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ec-disp-weight: 700;                 /* section titles; the H1 is 900 and numerals 800, set per component */
    --ec-disp-style: normal;
    --ec-disp-tracking: 0em;
    --ec-disp-transform: none;             /* only the poster H1 is uppercase */
    --ec-cw: 1280px;
    --ec-gut: clamp(1rem, 8.33vw - 2.5rem, 5rem);      /* 16px at 390, 80px at 1440 */
    --ec-sect-y: clamp(3rem, 5.56vw, 5rem);           /* section bottom padding: 48 mobile, 80 desktop */
    --ec-grid: 3;                          /* card-list density only, never the 12-column layout */
    --ec-grid-gap: 2rem;                   /* gap between the two halves of a split band */
    --ec-dur-1: 150ms;
    --ec-dur-2: 250ms;
    --ec-dur-3: 400ms;
    --ec-ease: cubic-bezier(0.2, 0, 0, 1);

    /* L1 · scheme-invariant Quorum tokens (design spec §2.3, §4.1, §4.5) */
    --q-font-mono: 'Overpass Mono', 'Overpass Mono Fallback', ui-monospace, Consolas, monospace;
    --q-rule-w: 2px;                       /* heavy ink rule */
    --q-hair-w: 1px;                       /* gap-rule and dividers */
    --q-pin-w: 6px;                        /* yellow rule of the pinned row and the member's own row */
    --q-current-w: 4px;                    /* teal current-page bar */
    --q-signal: #F2B705;                   /* hi-vis yellow, identical in both schemes; always carries ink */
    --q-signal-fg: #1A1917;
    --q-focus-ring-on-signal: #1A1917;
    --q-avatar-1: #6B4C9A;
    --q-avatar-2: #2E6B4A;
    --q-avatar-3: #A3344F;
    --q-avatar-4: #9C4221;
    --q-avatar-5: #2B5C8A;
    --q-avatar-6: #4E5D2C;
    --q-avatar-7: #7A4A1E;
    --q-s1: 0.25rem;
    --q-s2: 0.5rem;
    --q-s3: 0.75rem;
    --q-s4: 1rem;
    --q-s5: 1.25rem;
    --q-s6: 1.5rem;
    --q-s7: 1.75rem;
    --q-s8: 2rem;
    --q-s10: 3rem;
    --q-s11: 3.5rem;
    --q-s12: 5rem;
    --q-header-h: 4.625rem;                /* 72px of cells + the 2px rule (desktop) */
    --q-header-h-compact: 4rem;            /* 62px of cells + the 2px rule (below 75rem) */
    --q-strip-h: 2.5rem;                   /* notice strip */
    /* L2 · stacking and sticky (scheme invariant: block A only) */
    --ts-z-scrim: 1005;                    /* drawer scrim; above Leaflet (400-1000) */
    --ts-z-header: 1010;                   /* sticky header; the drawer and mega panels live inside it */
    --ts-z-dropdown: 1020;                 /* template dropdowns and account menus */
    --ts-z-toast: 1100;                    /* below the EasyCommerce cart (1200-1300) and app dialogs (10000+) */
    --ts-sticky-offset: 0px;               /* template.js writes the sticky header height here */
}

/* ==========================================================================
   B. Default preset, dark ("the board after hours"): FULL colour set + rgb twins
      (also serves unknown preset slugs, contract B2)
   ========================================================================== */

:root[data-color-scheme="dark"],
[data-bs-theme="dark"]:not(:root) {
    color-scheme: dark;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #151412;
    --ec-surface: #1E1D1A;
    --ec-surface-2: #292724;
    --ec-fg: #F1EFEA;
    --ec-fg-2: #B8B2A8;
    --ec-border: #3D3A35;
    --ec-accent: #4CC9C0;
    --ec-accent-fg: #0A1F1E;
    --ec-accent-soft: #0E3533;   /* preset accentSoft (the library prints the same value) */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #B8B2A8;
    --q-control: #76716A;
    --q-hover: #2E2C28;
    --q-accent-strong: #9DE1DC;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 55%, #fff);
    --q-tint: #253935;
    --q-tint: color-mix(in srgb, var(--ec-accent) 16%, var(--ec-surface));
    --q-tint-hover: #294642;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 24%, var(--ec-surface));
    --q-tint-2: #2B4D48;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #5FC47E;
    --q-success-soft: #15301F;
    --q-danger: #FF8A7D;
    --q-danger-soft: #3A1B17;
    --q-warning: #F2C14E;
    --q-warning-soft: #2F2610;
    --q-inverse-bg: #F1EFEA;
    --q-inverse-fg: #151412;
    --q-focus-ring: #F2B705;
    --q-focus-gap: #151412;
    --q-disabled-bg: #292724;
    --q-disabled-fg: #6B665F;
    --q-scrim: rgb(0 0 0 / 0.64);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 21, 20, 18;
    --ts-fg-rgb: 241, 239, 234;
    --ts-accent-rgb: 76, 201, 192;
    --ts-link-rgb: 76, 201, 192;
    --ts-link-hover-rgb: 157, 225, 220;
    --ts-success-rgb: 95, 196, 126;
    --ts-danger-rgb: 255, 138, 125;
    --ts-warning-rgb: 242, 193, 78;
    --ts-info-rgb: 76, 201, 192;
    --ts-fg-2-rgb: 184, 178, 168;
    --ts-surface-rgb: 30, 29, 26;
    --ts-surface-2-rgb: 41, 39, 36;

    /* K · the dark accent carries ink (accentFgDark), so checks, radios and switches get ink marks */
    --ts-check-mark: var(--ts-mark-ink-check);
    --ts-radio-mark: var(--ts-mark-ink-dot);
    --ts-dash-mark: var(--ts-mark-ink-dash);
    --ts-switch-mark: var(--ts-mark-ink-knob);
}

/* ==========================================================================
   C. One block per preset (default included), light: FULL colour set
   D. The same preset, dark: FULL colour set
   ========================================================================== */

/* ---- Quorum Teal (quorum) ---- */

[data-ec-preset="quorum"] {
    color-scheme: light;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #F3F2EF;
    --ec-surface: #FFFFFF;
    --ec-surface-2: #E8E6E1;
    --ec-fg: #1A1917;
    --ec-fg-2: #57534E;
    --ec-border: #D6D2CB;
    --ec-accent: #00706C;
    --ec-accent-fg: #FFFFFF;
    --ec-accent-soft: #DDF0ED;   /* preset accentSoft (the library prints the same value) */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #1A1917;
    --q-control: #857F77;
    --q-hover: #F3F2EF;
    --q-accent-strong: #004A47;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 66%, #000);
    --q-tint: #DBEBEA;
    --q-tint: color-mix(in srgb, var(--ec-accent) 14%, var(--ec-surface));
    --q-tint-hover: #CCE2E2;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 20%, var(--ec-surface));
    --q-tint-2: #B8D7D6;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #1F7A3A;
    --q-success-soft: #E4F2E7;
    --q-danger: #B3261E;
    --q-danger-soft: #FBEAE8;
    --q-warning: #7A5300;
    --q-warning-soft: #FDF1CF;
    --q-inverse-bg: #1A1917;
    --q-inverse-fg: #FFFFFF;
    --q-focus-ring: #1A1917;
    --q-focus-gap: #F2B705;
    --q-disabled-bg: #E8E6E1;
    --q-disabled-fg: #8C877F;
    --q-scrim: rgb(26 25 23 / 0.48);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 243, 242, 239;
    --ts-fg-rgb: 26, 25, 23;
    --ts-accent-rgb: 0, 112, 108;
    --ts-link-rgb: 0, 112, 108;
    --ts-link-hover-rgb: 0, 74, 71;
    --ts-success-rgb: 31, 122, 58;
    --ts-danger-rgb: 179, 38, 30;
    --ts-warning-rgb: 122, 83, 0;
    --ts-info-rgb: 0, 112, 108;
    --ts-fg-2-rgb: 87, 83, 78;
    --ts-surface-rgb: 255, 255, 255;
    --ts-surface-2-rgb: 232, 230, 225;
}

[data-ec-preset="quorum"][data-color-scheme="dark"] {
    color-scheme: dark;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #151412;
    --ec-surface: #1E1D1A;
    --ec-surface-2: #292724;
    --ec-fg: #F1EFEA;
    --ec-fg-2: #B8B2A8;
    --ec-border: #3D3A35;
    --ec-accent: #4CC9C0;
    --ec-accent-fg: #0A1F1E;
    --ec-accent-soft: #0E3533;   /* preset accentSoft (the library prints the same value) */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #B8B2A8;
    --q-control: #76716A;
    --q-hover: #2E2C28;
    --q-accent-strong: #9DE1DC;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 55%, #fff);
    --q-tint: #253935;
    --q-tint: color-mix(in srgb, var(--ec-accent) 16%, var(--ec-surface));
    --q-tint-hover: #294642;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 24%, var(--ec-surface));
    --q-tint-2: #2B4D48;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #5FC47E;
    --q-success-soft: #15301F;
    --q-danger: #FF8A7D;
    --q-danger-soft: #3A1B17;
    --q-warning: #F2C14E;
    --q-warning-soft: #2F2610;
    --q-inverse-bg: #F1EFEA;
    --q-inverse-fg: #151412;
    --q-focus-ring: #F2B705;
    --q-focus-gap: #151412;
    --q-disabled-bg: #292724;
    --q-disabled-fg: #6B665F;
    --q-scrim: rgb(0 0 0 / 0.64);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 21, 20, 18;
    --ts-fg-rgb: 241, 239, 234;
    --ts-accent-rgb: 76, 201, 192;
    --ts-link-rgb: 76, 201, 192;
    --ts-link-hover-rgb: 157, 225, 220;
    --ts-success-rgb: 95, 196, 126;
    --ts-danger-rgb: 255, 138, 125;
    --ts-warning-rgb: 242, 193, 78;
    --ts-info-rgb: 76, 201, 192;
    --ts-fg-2-rgb: 184, 178, 168;
    --ts-surface-rgb: 30, 29, 26;
    --ts-surface-2-rgb: 41, 39, 36;

    /* K · the dark accent carries ink (accentFgDark), so checks, radios and switches get ink marks */
    --ts-check-mark: var(--ts-mark-ink-check);
    --ts-radio-mark: var(--ts-mark-ink-dot);
    --ts-dash-mark: var(--ts-mark-ink-dash);
    --ts-switch-mark: var(--ts-mark-ink-knob);
}

/* ---- Civic Blue (civic-blue) ---- */

[data-ec-preset="civic-blue"] {
    color-scheme: light;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #F3F2EF;
    --ec-surface: #FFFFFF;
    --ec-surface-2: #E8E6E1;
    --ec-fg: #1A1917;
    --ec-fg-2: #57534E;
    --ec-border: #D6D2CB;
    --ec-accent: #1F4F9E;
    --ec-accent-fg: #FFFFFF;
    --ec-accent-soft: #E4EAF3;   /* static stand-in; the library re-emits a 12% rgba */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #1A1917;
    --q-control: #857F77;
    --q-hover: #F3F2EF;
    --q-accent-strong: #143468;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 66%, #000);
    --q-tint: #E0E6F1;
    --q-tint: color-mix(in srgb, var(--ec-accent) 14%, var(--ec-surface));
    --q-tint-hover: #D2DCEC;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 20%, var(--ec-surface));
    --q-tint-2: #C0CEE4;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #1F7A3A;
    --q-success-soft: #E4F2E7;
    --q-danger: #B3261E;
    --q-danger-soft: #FBEAE8;
    --q-warning: #7A5300;
    --q-warning-soft: #FDF1CF;
    --q-inverse-bg: #1A1917;
    --q-inverse-fg: #FFFFFF;
    --q-focus-ring: #1A1917;
    --q-focus-gap: #F2B705;
    --q-disabled-bg: #E8E6E1;
    --q-disabled-fg: #8C877F;
    --q-scrim: rgb(26 25 23 / 0.48);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 243, 242, 239;
    --ts-fg-rgb: 26, 25, 23;
    --ts-accent-rgb: 31, 79, 158;
    --ts-link-rgb: 31, 79, 158;
    --ts-link-hover-rgb: 20, 52, 104;
    --ts-success-rgb: 31, 122, 58;
    --ts-danger-rgb: 179, 38, 30;
    --ts-warning-rgb: 122, 83, 0;
    --ts-info-rgb: 31, 79, 158;
    --ts-fg-2-rgb: 87, 83, 78;
    --ts-surface-rgb: 255, 255, 255;
    --ts-surface-2-rgb: 232, 230, 225;
}

[data-ec-preset="civic-blue"][data-color-scheme="dark"] {
    color-scheme: dark;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #151412;
    --ec-surface: #1E1D1A;
    --ec-surface-2: #292724;
    --ec-fg: #F1EFEA;
    --ec-fg-2: #B8B2A8;
    --ec-border: #3D3A35;
    --ec-accent: #8AB4F8;
    --ec-accent-fg: #141312;
    --ec-accent-soft: #2B2F35;   /* static stand-in; the library re-emits a 12% rgba */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #B8B2A8;
    --q-control: #76716A;
    --q-hover: #2E2C28;
    --q-accent-strong: #BFD6FB;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 55%, #fff);
    --q-tint: #2F353E;
    --q-tint: color-mix(in srgb, var(--ec-accent) 16%, var(--ec-surface));
    --q-tint-hover: #38414F;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 24%, var(--ec-surface));
    --q-tint-2: #3C4758;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #5FC47E;
    --q-success-soft: #15301F;
    --q-danger: #FF8A7D;
    --q-danger-soft: #3A1B17;
    --q-warning: #F2C14E;
    --q-warning-soft: #2F2610;
    --q-inverse-bg: #F1EFEA;
    --q-inverse-fg: #151412;
    --q-focus-ring: #F2B705;
    --q-focus-gap: #151412;
    --q-disabled-bg: #292724;
    --q-disabled-fg: #6B665F;
    --q-scrim: rgb(0 0 0 / 0.64);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 21, 20, 18;
    --ts-fg-rgb: 241, 239, 234;
    --ts-accent-rgb: 138, 180, 248;
    --ts-link-rgb: 138, 180, 248;
    --ts-link-hover-rgb: 191, 214, 251;
    --ts-success-rgb: 95, 196, 126;
    --ts-danger-rgb: 255, 138, 125;
    --ts-warning-rgb: 242, 193, 78;
    --ts-info-rgb: 138, 180, 248;
    --ts-fg-2-rgb: 184, 178, 168;
    --ts-surface-rgb: 30, 29, 26;
    --ts-surface-2-rgb: 41, 39, 36;

    /* K · the dark accent carries ink (accentFgDark), so checks, radios and switches get ink marks */
    --ts-check-mark: var(--ts-mark-ink-check);
    --ts-radio-mark: var(--ts-mark-ink-dot);
    --ts-dash-mark: var(--ts-mark-ink-dash);
    --ts-switch-mark: var(--ts-mark-ink-knob);
}

/* ---- Aubergine (aubergine) ---- */

[data-ec-preset="aubergine"] {
    color-scheme: light;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #F3F2EF;
    --ec-surface: #FFFFFF;
    --ec-surface-2: #E8E6E1;
    --ec-fg: #1A1917;
    --ec-fg-2: #57534E;
    --ec-border: #D6D2CB;
    --ec-accent: #6B3F8F;
    --ec-accent-fg: #FFFFFF;
    --ec-accent-soft: #EDE8F2;   /* static stand-in; the library re-emits a 12% rgba */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #1A1917;
    --q-control: #857F77;
    --q-hover: #F3F2EF;
    --q-accent-strong: #472A5E;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 66%, #000);
    --q-tint: #EAE4EF;
    --q-tint: color-mix(in srgb, var(--ec-accent) 14%, var(--ec-surface));
    --q-tint-hover: #E1D9E9;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 20%, var(--ec-surface));
    --q-tint-2: #D6C9E0;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #1F7A3A;
    --q-success-soft: #E4F2E7;
    --q-danger: #B3261E;
    --q-danger-soft: #FBEAE8;
    --q-warning: #7A5300;
    --q-warning-soft: #FDF1CF;
    --q-inverse-bg: #1A1917;
    --q-inverse-fg: #FFFFFF;
    --q-focus-ring: #1A1917;
    --q-focus-gap: #F2B705;
    --q-disabled-bg: #E8E6E1;
    --q-disabled-fg: #8C877F;
    --q-scrim: rgb(26 25 23 / 0.48);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 243, 242, 239;
    --ts-fg-rgb: 26, 25, 23;
    --ts-accent-rgb: 107, 63, 143;
    --ts-link-rgb: 107, 63, 143;
    --ts-link-hover-rgb: 71, 42, 94;
    --ts-success-rgb: 31, 122, 58;
    --ts-danger-rgb: 179, 38, 30;
    --ts-warning-rgb: 122, 83, 0;
    --ts-info-rgb: 107, 63, 143;
    --ts-fg-2-rgb: 87, 83, 78;
    --ts-surface-rgb: 255, 255, 255;
    --ts-surface-2-rgb: 232, 230, 225;
}

[data-ec-preset="aubergine"][data-color-scheme="dark"] {
    color-scheme: dark;
    /* L0 · Studio inventory colours (design spec §2.2) */
    --ec-bg: #151412;
    --ec-surface: #1E1D1A;
    --ec-surface-2: #292724;
    --ec-fg: #F1EFEA;
    --ec-fg-2: #B8B2A8;
    --ec-border: #3D3A35;
    --ec-accent: #C8A5EC;
    --ec-accent-fg: #141312;
    --ec-accent-soft: #322D33;   /* static stand-in; the library re-emits a 12% rgba */

    /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
    --q-rule: #B8B2A8;
    --q-control: #76716A;
    --q-hover: #2E2C28;
    --q-accent-strong: #E1CEF5;
    --q-accent-strong: color-mix(in srgb, var(--ec-accent) 55%, #fff);
    --q-tint: #39333C;
    --q-tint: color-mix(in srgb, var(--ec-accent) 16%, var(--ec-surface));
    --q-tint-hover: #473E4C;
    --q-tint-hover: color-mix(in srgb, var(--ec-accent) 24%, var(--ec-surface));
    --q-tint-2: #4E4355;
    --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
    --q-success: #5FC47E;
    --q-success-soft: #15301F;
    --q-danger: #FF8A7D;
    --q-danger-soft: #3A1B17;
    --q-warning: #F2C14E;
    --q-warning-soft: #2F2610;
    --q-inverse-bg: #F1EFEA;
    --q-inverse-fg: #151412;
    --q-focus-ring: #F2B705;
    --q-focus-gap: #151412;
    --q-disabled-bg: #292724;
    --q-disabled-fg: #6B665F;
    --q-scrim: rgb(0 0 0 / 0.64);
    --q-info: var(--ec-accent);
    --q-track: var(--ec-bg);
    --q-tick: var(--ec-border);

    /* L2 · shared semantic layer (portable; read by every kit file) */
    --ts-link: var(--ec-accent);
    --ts-link-hover: var(--q-accent-strong);
    --ts-focus: var(--q-focus-ring);
    --ts-focus-gap: var(--q-focus-gap);
    --ts-control: var(--q-control);
    --ts-signal: var(--ec-accent);
    --ts-tint: var(--q-tint);
    --ts-on-tint: var(--q-accent-strong);
    --ts-success: var(--q-success);
    --ts-success-bg: var(--q-success-soft);
    --ts-danger: var(--q-danger);
    --ts-danger-bg: var(--q-danger-soft);
    --ts-warning: var(--q-warning);
    --ts-warning-bg: var(--q-warning-soft);
    --ts-info: var(--ec-accent);
    --ts-info-bg: var(--q-tint);
    --ts-font-mono: var(--q-font-mono);
    --ts-scrim: var(--q-scrim);
    --ts-overlay-shadow: none;

    /* L2 · rgb twins (literal r, g, b of this block's colours) */
    --ts-bg-rgb: 21, 20, 18;
    --ts-fg-rgb: 241, 239, 234;
    --ts-accent-rgb: 200, 165, 236;
    --ts-link-rgb: 200, 165, 236;
    --ts-link-hover-rgb: 225, 206, 245;
    --ts-success-rgb: 95, 196, 126;
    --ts-danger-rgb: 255, 138, 125;
    --ts-warning-rgb: 242, 193, 78;
    --ts-info-rgb: 200, 165, 236;
    --ts-fg-2-rgb: 184, 178, 168;
    --ts-surface-rgb: 30, 29, 26;
    --ts-surface-2-rgb: 41, 39, 36;

    /* K · the dark accent carries ink (accentFgDark), so checks, radios and switches get ink marks */
    --ts-check-mark: var(--ts-mark-ink-check);
    --ts-radio-mark: var(--ts-mark-ink-dot);
    --ts-dash-mark: var(--ts-mark-ink-dash);
    --ts-switch-mark: var(--ts-mark-ink-knob);
}

/* ==========================================================================
   Custom accent (Studio Style tab hex; PageContext adds body.ts-custom-accent and prints
   :root[data-ec-preset]{--ts-accent-rgb} inline). The derived --q-* family already follows
   --ec-accent through color-mix(); here the link triplets follow it too, and in dark the link
   text is lifted, because the library applies one custom accent to both schemes (design spec
   §2.7 caveat 1). Keyed on the root through :has() so every var() on :root re-resolves; the
   accent triplet itself stays with the library.
   ========================================================================== */

@supports (color: color-mix(in oklab, red 50%, blue)) {
    :root:not([data-color-scheme="dark"]):has(> body.ts-custom-accent) {
        --ts-link-rgb: var(--ts-accent-rgb);
        --ts-info-rgb: var(--ts-accent-rgb);
    }

    :root[data-color-scheme="dark"]:has(> body.ts-custom-accent) {
        --ts-link: color-mix(in oklab, var(--ec-accent), #fff 35%);
        --ts-signal: color-mix(in oklab, var(--ec-accent), #fff 35%);
    }
}

/* ==========================================================================
   K · component knobs read by the kit files (bootstrap-bridge.css, joomla.css, vendor, system).
   Scheme-dependent knobs are var() references; the dark ink marks live in B/D.
   ========================================================================== */

:root,
[data-bs-theme]:not(:root) {
    --ts-focus-width: 2px;                 /* ink ring (light) / yellow ring (dark) + a 2px gap band, W3C C40 */
    --ts-control-height: 3rem;             /* 48px inputs and buttons */
    --ts-control-height-sm: 2.5rem;
    --ts-control-radius: var(--ec-btn-radius);
    --ts-control-border-width: 1px;
    --ts-control-bg: var(--ec-surface);
    --ts-control-focus-border: var(--ec-fg);
    --ts-btn-font: var(--ec-font-body);
    --ts-btn-weight: 600;
    --ts-btn-transform: none;
    --ts-btn-tracking: normal;
    --ts-btn-pad-x: 1.375rem;
    --ts-btn-border-width: 2px;
    --ts-btn-primary-bg: var(--ec-accent);
    --ts-btn-primary-fg: var(--ec-accent-fg);
    --ts-btn-primary-border: var(--ts-btn-primary-bg);
    --ts-btn-primary-hover-bg: var(--q-accent-strong);
    --ts-btn-primary-hover-fg: var(--ec-accent-fg);
    --ts-btn-primary-shadow: none;
    --ts-btn-secondary-bg: transparent;
    --ts-btn-secondary-fg: var(--ec-fg);
    --ts-btn-secondary-border: var(--q-rule);
    --ts-btn-secondary-hover-bg: var(--q-inverse-bg);
    --ts-btn-secondary-hover-fg: var(--q-inverse-fg);
    --ts-btn-secondary-hover-border: var(--q-inverse-bg);
    --ts-check-size: 1.5em;                /* 24px boxes */
    --ts-check-bg: var(--ec-accent);
    --ts-check-mark: var(--ts-mark-paper-check);
    --ts-radio-mark: var(--ts-mark-paper-dot);
    --ts-dash-mark: var(--ts-mark-paper-dash);
    --ts-switch-mark: var(--ts-mark-paper-knob);
    --ts-card-bg: var(--ec-surface);
    --ts-card-border: var(--ec-border);
    --ts-card-radius: var(--ec-radius);
    --ts-card-shadow: none;
    --ts-overlay-radius: var(--ec-radius);
    --ts-badge-radius: 0px;                /* tags are square */
    --ts-tab-indicator: var(--ec-accent);
    --ts-tab-indicator-width: 4px;         /* the current bar */
    --ts-tab-active-bg: transparent;
    --ts-tab-active-border: transparent;
    --ts-table-head-bg: var(--ec-surface-2);
    --ts-table-head-fg: var(--ec-fg-2);
    --ts-table-head-rule: var(--q-rule);
    --ts-page-current-bg: var(--q-inverse-bg);
    --ts-page-current-fg: var(--q-inverse-fg);
    --ts-page-gap: 0px;                    /* pagination is one ruled row */
    --ts-alert-border-width: 1px;
    --ts-alert-bar-width: 4px;
    --ts-alert-radius: var(--ec-radius);
    --ts-tooltip-bg: var(--q-inverse-bg);
    --ts-tooltip-fg: var(--q-inverse-fg);
}

/* ==========================================================================
   L3 · legacy Studio aliases (the --color-*, --font-*, --space-* names of the earlier Studio templates). Community Answers'
   follow-template mode reads --color-* and --font-* as its second tier.
   ========================================================================== */

:root,
[data-bs-theme]:not(:root) {
    --color-paper: var(--ec-bg);
    --color-paper-2: var(--ec-surface);
    --color-paper-3: var(--ec-surface-2);
    --color-ink: var(--ec-fg);
    --color-ink-2: var(--ec-fg);
    --color-neutral: var(--ec-fg-2);
    --color-muted: var(--ec-fg-2);
    --color-rule: var(--ec-border);
    --color-rule-2: var(--ts-control);
    --color-accent: var(--ec-accent);
    --color-accent-ink: var(--ec-accent-fg);
    --color-accent-soft: var(--ec-accent-soft);
    --color-focus: var(--ts-focus);
    --color-error: var(--ts-danger);
    --color-error-soft: var(--ts-danger-bg);
    --color-success: var(--ts-success);
    --color-success-soft: var(--ts-success-bg);
    --color-warning: var(--ts-warning);
    --color-warning-soft: var(--ts-warning-bg);
    --color-scrim: var(--ts-scrim);

    --font-display: var(--ec-font-display);
    --font-body: var(--ec-font-body);
    --font-mono: var(--ts-font-mono);
    --font-ui: var(--ec-font-body);

    --space-3xs: 0.25rem;                  /* the board scale: 4 8 12 16 20 24 28 32 48 56 80 */
    --space-2xs: 0.5rem;
    --space-xs: 0.75rem;
    --space-sm: 1rem;
    --space-md: 1.25rem;
    --space-lg: 1.5rem;
    --space-xl: 1.75rem;
    --space-2xl: 2rem;
    --space-3xl: 3rem;
    --space-4xl: 3.5rem;
    --space-5xl: 5rem;

    --text-xs: 0.875rem;                   /* 14: tags and mono labels only, never sentences */
    --text-sm: 0.9375rem;                  /* 15: segmented and language buttons */
    --text-base: 1rem;
    --text-md: 1.0625rem;                  /* 17: section intro, inputs */
    --text-lg: 1.25rem;                    /* 20: hero lead */
    --text-xl: 1.375rem;                   /* 22: card titles */
    --text-2xl: 1.875rem;                  /* 30: panel titles */
    --text-3xl: clamp(2rem, 1.143vw + 1.721rem, 2.75rem);      /* 32 -> 44: section titles */
    --text-4xl: clamp(2.5rem, 2.3vw + 1.9rem, 3.5rem);         /* 40 -> 56: inner page titles */
    --text-display-s: clamp(4rem, 4.571vw + 2.886rem, 7rem);   /* 64 -> 112: agenda ordinals */
    --text-display: clamp(4rem, 5.333vw + 2.7rem, 7.5rem);     /* 64 -> 120: the poster H1 */

    --radius-xs: 0px;
    --radius-sm: 0px;
    --radius-md: var(--ec-radius);
    --radius-lg: var(--ec-radius);
    --radius-pill: 999px;                  /* people only: avatars, medallions, the online dot */

    --measure: 68ch;
    --target-min: 44px;
    --page-max: var(--ec-cw);
    --page-gutter: max(var(--ec-gut), env(safe-area-inset-left), env(safe-area-inset-right));
    --rule-hair: 1px;
    --rule-strong: 2px;
}

/* ==========================================================================
   L4 · extension and core maps (tokens.css §5). Variables only; values from L0/L2.
   Scoped maps that need !important or ID specificity live in ext/<key>.css, never here.
   ========================================================================== */

:root,
[data-bs-theme]:not(:root) {
    /* Community Answers follow-template mode: all 21 names */
    --template-bg: var(--ec-bg);
    --template-bg-elev: var(--ec-surface);
    --template-bg-subtle: var(--ec-surface);
    --template-bg-inset: var(--ec-surface-2);
    --template-border-color: var(--ec-border);
    --template-border-strong-color: var(--ts-control);
    --template-text-color: var(--ec-fg);
    --template-muted-color: var(--ec-fg-2);
    --template-subtle-color: var(--ec-fg-2);
    --template-link-color: var(--ts-link);
    --template-link-hover-color: var(--ts-link-hover);
    --template-accent-soft: var(--ts-tint);
    --template-success-color: var(--ts-success);
    --template-success-bg: var(--ts-success-bg);
    --template-warning-color: var(--ts-warning);
    --template-warning-bg: var(--ts-warning-bg);
    --template-danger-color: var(--ts-danger);
    --template-danger-bg: var(--ts-danger-bg);
    --template-heading-font: var(--ec-font-display);
    --template-font-family: var(--ec-font-body);
    --template-mono-font: var(--ts-font-mono);

    /* VidyaLMS public tokens */
    --vy-bg: var(--ec-bg);
    --vy-surface: var(--ec-surface);
    --vy-surface-2: var(--ec-surface-2);
    --vy-fg: var(--ec-fg);
    --vy-fg-2: var(--ec-fg-2);
    --vy-border: var(--ec-border);
    --vy-control-border: var(--ts-control);
    --vy-accent: var(--ec-accent);
    --vy-accent-fg: var(--ec-accent-fg);
    --vy-accent-soft: var(--ts-tint);
    --vy-ok: var(--ts-success);
    --vy-ok-strong: var(--ts-success);
    --vy-warn: var(--ts-warning);
    --vy-warn-strong: var(--ts-warning);
    --vy-danger: var(--ts-danger);
    --vy-danger-strong: var(--ts-danger);
    --vy-feature: var(--q-inverse-bg);
    --vy-feature-fg: var(--q-inverse-fg);
    --vy-feature-fg-2: var(--ec-surface-2);
    --vy-feature-action: var(--ec-accent);
    --vy-feature-action-fg: var(--ec-accent-fg);
    --vy-radius: var(--ec-btn-radius);
    --vy-radius-lg: var(--ec-radius);
    --vy-btn-radius: var(--ec-btn-radius);
    --vy-font-body: var(--ec-font-body);
    --vy-font-display: var(--ec-font-display);
    --vy-font-mono: var(--ts-font-mono);
    --vy-focus: var(--ts-focus-width, 2px) solid var(--ts-focus);
    --vy-dur-1: var(--ec-dur-1);
    --vy-dur-2: var(--ec-dur-2);

    /* Joomla calendar field (system/fields/calendar.css) */
    --calendar-bg: var(--ec-surface);
    --calendar-week-bg: var(--ec-surface-2);
    --calendar-select-color: var(--ec-fg);
    --calendar-select-bg-color: var(--ts-control-bg, var(--ec-surface));
    --calendar-disabled-bg: transparent;
    --calendar-disabled-color: var(--ec-fg-2);
    --btn-primary-bg: var(--ec-accent);
    --btn-primary-color: var(--ec-accent-fg);
    --body-bg: var(--ec-bg);

    /* Joomla switcher field (system/fields/switcher.css) */
    --focus: var(--ts-focus);

    /* Media Manager (com_media inside component.php): Atum/Cassiopeia names */
    --template-bg-dark: var(--ec-fg);
    --template-bg-dark-3: color-mix(in srgb, var(--ec-fg) 3%, var(--ec-surface));
    --template-bg-dark-5: color-mix(in srgb, var(--ec-fg) 5%, var(--ec-surface));
    --template-bg-dark-7: color-mix(in srgb, var(--ec-fg) 7%, var(--ec-surface));
    --template-bg-dark-10: color-mix(in srgb, var(--ec-fg) 10%, var(--ec-surface));
    --template-bg-dark-40: color-mix(in srgb, var(--ec-fg) 40%, var(--ec-surface));
    --template-bg-dark-50: color-mix(in srgb, var(--ec-fg) 50%, var(--ec-surface));
    --template-bg-dark-60: var(--ec-fg-2);
    --template-bg-dark-80: var(--ec-fg);
    --hue: 45;                             /* hue of the warm paper ground #F3F2EF */
    --link-color: var(--ts-link);
    --body-color: var(--ec-fg);
    --gray-400: var(--ec-border);
    --com-media-manager-content-bg: var(--ec-surface);
    --com-media-manager-content-color: var(--ec-fg);
    --com-media-manager-disk-name-color: var(--ec-fg);
    --com-media-manager-infobar-dt-color: var(--ec-fg-2);
    --com-media-manager-overlay-bg: var(--ec-surface-2);
    --com-media-manager-overlay-header-bg: var(--ec-surface-2);
    --com-media-manager-toolbar-icon-color: var(--ec-fg-2);
    --com-media-manager-tree-item-hover-bg: var(--ec-surface-2);

    /* mod_articles grid layout (media/mod_articles/css/mod-articles.css) */
    --grid-layout-gap: 1px;                /* gap-ruled: the hairline is the gap */
    --grid-item--min-width: 16rem;
}

/* ==========================================================================
   E. TinyMCE content iframe (seeded scheme "auto"): editor.css @imports this file into an
   iframe whose <html> carries no attributes, so block A applies; on a dark OS the content area
   follows the same preference as the oxide-dark skin index.php selects (data-color-scheme-os).
   ========================================================================== */

@media (prefers-color-scheme: dark) {
    :root:not([data-color-scheme]) {
        color-scheme: dark;
        /* L0 · Studio inventory colours (design spec §2.2) */
        --ec-bg: #151412;
        --ec-surface: #1E1D1A;
        --ec-surface-2: #292724;
        --ec-fg: #F1EFEA;
        --ec-fg-2: #B8B2A8;
        --ec-border: #3D3A35;
        --ec-accent: #4CC9C0;
        --ec-accent-fg: #0A1F1E;
        --ec-accent-soft: #0E3533;   /* preset accentSoft (the library prints the same value) */

        /* L1 · Quorum tokens that change with the scheme or the accent (design spec §2.3) */
        --q-rule: #B8B2A8;
        --q-control: #76716A;
        --q-hover: #2E2C28;
        --q-accent-strong: #9DE1DC;
        --q-accent-strong: color-mix(in srgb, var(--ec-accent) 55%, #fff);
        --q-tint: #253935;
        --q-tint: color-mix(in srgb, var(--ec-accent) 16%, var(--ec-surface));
        --q-tint-hover: #294642;
        --q-tint-hover: color-mix(in srgb, var(--ec-accent) 24%, var(--ec-surface));
        --q-tint-2: #2B4D48;
        --q-tint-2: color-mix(in srgb, var(--ec-accent) 28%, var(--ec-surface));
        --q-success: #5FC47E;
        --q-success-soft: #15301F;
        --q-danger: #FF8A7D;
        --q-danger-soft: #3A1B17;
        --q-warning: #F2C14E;
        --q-warning-soft: #2F2610;
        --q-inverse-bg: #F1EFEA;
        --q-inverse-fg: #151412;
        --q-focus-ring: #F2B705;
        --q-focus-gap: #151412;
        --q-disabled-bg: #292724;
        --q-disabled-fg: #6B665F;
        --q-scrim: rgb(0 0 0 / 0.64);
        --q-info: var(--ec-accent);
        --q-track: var(--ec-bg);
        --q-tick: var(--ec-border);

        /* L2 · shared semantic layer (portable; read by every kit file) */
        --ts-link: var(--ec-accent);
        --ts-link-hover: var(--q-accent-strong);
        --ts-focus: var(--q-focus-ring);
        --ts-focus-gap: var(--q-focus-gap);
        --ts-control: var(--q-control);
        --ts-signal: var(--ec-accent);
        --ts-tint: var(--q-tint);
        --ts-on-tint: var(--q-accent-strong);
        --ts-success: var(--q-success);
        --ts-success-bg: var(--q-success-soft);
        --ts-danger: var(--q-danger);
        --ts-danger-bg: var(--q-danger-soft);
        --ts-warning: var(--q-warning);
        --ts-warning-bg: var(--q-warning-soft);
        --ts-info: var(--ec-accent);
        --ts-info-bg: var(--q-tint);
        --ts-font-mono: var(--q-font-mono);
        --ts-scrim: var(--q-scrim);
        --ts-overlay-shadow: none;

        /* L2 · rgb twins (literal r, g, b of this block's colours) */
        --ts-bg-rgb: 21, 20, 18;
        --ts-fg-rgb: 241, 239, 234;
        --ts-accent-rgb: 76, 201, 192;
        --ts-link-rgb: 76, 201, 192;
        --ts-link-hover-rgb: 157, 225, 220;
        --ts-success-rgb: 95, 196, 126;
        --ts-danger-rgb: 255, 138, 125;
        --ts-warning-rgb: 242, 193, 78;
        --ts-info-rgb: 76, 201, 192;
        --ts-fg-2-rgb: 184, 178, 168;
        --ts-surface-rgb: 30, 29, 26;
        --ts-surface-2-rgb: 41, 39, 36;

        /* K · the dark accent carries ink (accentFgDark), so checks, radios and switches get ink marks */
        --ts-check-mark: var(--ts-mark-ink-check);
        --ts-radio-mark: var(--ts-mark-ink-dot);
        --ts-dash-mark: var(--ts-mark-ink-dash);
        --ts-switch-mark: var(--ts-mark-ink-knob);
    }
}

/* ==========================================================================
   Reduced motion (last, so it wins over A and C; D blocks never declare durations)
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    :root,
    [data-ec-preset] {
        --ec-dur-1: 0ms;
        --ec-dur-2: 0ms;
        --ec-dur-3: 0ms;
    }
}