/* Public semantic tokens. Component CSS must consume these instead of light-only colours. */
:root {
    --kb-primary:#2563eb;
    --kb-canvas:#f5f7fb;
    --kb-surface:#ffffff;
    --kb-surface-soft:#f7f9fc;
    --kb-surface-hover:#edf3fc;
    --kb-text:#263449;
    --kb-text-secondary:#475569;
    --kb-muted:#64748b;
    --kb-placeholder:#8290a5;
    --kb-border:#e0e6ef;
    --kb-border-strong:#cbd5e1;
    --kb-accent:var(--kb-primary);
    --kb-accent-soft:color-mix(in srgb,var(--kb-primary) 9%,var(--kb-surface));
    --kb-focus:color-mix(in srgb,var(--kb-primary) 22%,transparent);
    --kb-on-solid:#ffffff;
    --kb-danger-solid:#b91c1c;
    --kb-success-solid:#15803d;
    --kb-warning-solid:#b45309;
    --kb-special-solid:#6d28d9;
    --kb-danger:#dc2626;
    --kb-danger-soft:#fff1f2;
    --kb-success:#15803d;
    --kb-success-soft:#ecfdf5;
    --kb-special:#6d28d9;
    --kb-special-soft:#f3edff;
    --kb-warning:#b45309;
    --kb-warning-soft:#fffbeb;
    --kb-chart-1:var(--kb-primary);
    --kb-chart-2:#0891b2;
    --kb-chart-3:var(--kb-success);
    --kb-chart-4:var(--kb-warning);
    --kb-chart-5:var(--kb-special);
    --kb-chart-6:var(--kb-danger);
    --kb-chart-7:var(--kb-muted);
    --kb-button-bg:var(--kb-surface-soft);
    --kb-button-text:var(--kb-text-secondary);
    --kb-button-border:var(--kb-border-strong);
    --kb-button-hover-bg:var(--kb-surface-hover);
    --kb-header-bg:var(--kb-surface);
    --kb-header-text:var(--kb-text);
    --kb-menu-bg:var(--kb-surface-soft);
    --kb-menu-text:var(--kb-text-secondary);
}
html[data-kb-white-default] {
    --kb-canvas:#ffffff;
    --kb-surface-soft:#ffffff;
    --kb-menu-bg:#ffffff;
}
html[data-theme="dark"] {
    --kb-canvas:#101114;
    --kb-surface:#15171a;
    --kb-surface-soft:#232427;
    --kb-surface-hover:#29292c;
    --kb-text:#e5e7eb;
    --kb-text-secondary:#c7c9ce;
    --kb-muted:#a0a3ab;
    --kb-placeholder:#81858e;
    --kb-border:#303238;
    --kb-border-strong:#484b53;
    --kb-accent:color-mix(in srgb,var(--kb-primary) 55%,#ffffff);
    --kb-accent-soft:color-mix(in srgb,var(--kb-primary) 18%,var(--kb-surface));
    --kb-danger:#ff929c;
    --kb-danger-soft:#3d242f;
    --kb-success:#71dca0;
    --kb-success-soft:#18382e;
    --kb-special:#c4a8ff;
    --kb-special-soft:#302541;
    --kb-warning:#f5c578;
    --kb-warning-soft:#3c3021;
    --kb-chart-2:#67d4e8;
    --kb-menu-bg:var(--kb-surface);
}

/* Circular page reveal, scoped to theme switches so other view transitions are unaffected. */
html.kb-theme-transition::view-transition-group(root) { animation-duration:0s; }
html.kb-theme-transition::view-transition-old(root),
html.kb-theme-transition::view-transition-new(root) { animation:none; mix-blend-mode:normal; will-change:clip-path; }
html.kb-theme-transition::view-transition-old(root) { z-index:1; }
html.kb-theme-transition::view-transition-new(root) { z-index:2; }
html.kb-theme-transition.kb-theme-transition-contract::view-transition-old(root) { z-index:2; }
html.kb-theme-transition.kb-theme-transition-contract::view-transition-new(root) { z-index:1; }
html.kb-theme-transition::view-transition-image-pair(root) { isolation:isolate; }
html.kb-theme-transition *,
html.kb-theme-transition *::before,
html.kb-theme-transition *::after { transition:none!important; }
[data-theme-toggle]:focus-visible { outline:2px solid var(--kb-accent, #2563eb); outline-offset:3px; }