/* Neutral Blue - Generated by tools/build.mjs from tokens/. Do not edit by hand.
   Theme selection: <html data-theme="light|dark">. Without the attribute the OS setting is followed. */

:root {
  --font-sans: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Cascadia Mono", Consolas, "Roboto Mono", ui-monospace, monospace;
  --text-display: 600 1.75rem/2.25rem var(--font-sans);
  --text-title-lg: 600 1.375rem/1.75rem var(--font-sans);
  --text-title: 600 1.125rem/1.5rem var(--font-sans);
  --text-subtitle: 600 0.9375rem/1.25rem var(--font-sans);
  --text-body-lg: 400 1rem/1.5rem var(--font-sans);
  --text-body: 400 0.875rem/1.25rem var(--font-sans);
  --text-body-strong: 600 0.875rem/1.25rem var(--font-sans);
  --text-caption: 400 0.75rem/1rem var(--font-sans);
  --text-label: 600 0.75rem/1rem var(--font-sans);
  --text-code: 400 0.8125rem/1.25rem var(--font-mono);
  --space-0: 0px;
  --space-xxs: 2px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-xxl: 32px;
  --space-xxxl: 48px;
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-pill: 999px;
  --size-control-sm: 28px;
  --size-control-md: 32px;
  --size-control-lg: 40px;
  --size-touch-min: 48px;
  --size-icon-sm: 16px;
  --size-icon-md: 20px;
  --size-icon-lg: 24px;
  --size-border: 1px;
  --size-focus-ring: 2px;
  --size-nav-rail: 56px;
  --size-nav-drawer: 256px;
  --size-app-bar: 48px;
  --size-app-bar-mobile: 56px;
  --duration-fast: 100ms;
  --duration-normal: 180ms;
  --duration-slow: 280ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-exit: cubic-bezier(0.3, 0, 1, 1);
}

:root,
:root[data-theme="light"] {
  color-scheme: light;
  --color-bg-canvas: #F4F6F8;
  --color-bg-surface: #FFFFFF;
  --color-bg-surface-alt: #FAFBFC;
  --color-bg-elevated: #FFFFFF;
  --color-bg-input: #FFFFFF;
  --color-bg-hover: #EBEEF2;
  --color-bg-pressed: #E1E5EA;
  --color-bg-selected: #EFF5FF;
  --color-bg-inverse: #21262D;
  --color-bg-overlay: #0B0D1073;
  --color-text-primary: #181C22;
  --color-text-secondary: #525C6A;
  --color-text-tertiary: #636E7D;
  --color-text-disabled: #808B99;
  --color-text-on-accent: #FFFFFF;
  --color-text-link: #1F5FD6;
  --color-text-inverse: #F4F6F8;
  --color-border-subtle: #E1E5EA;
  --color-border-default: #D3D9E0;
  --color-border-strong: #808B99;
  --color-border-focus: #1F5FD6;
  --color-accent-default: #1F5FD6;
  --color-accent-hover: #1A4DAF;
  --color-accent-pressed: #1B408C;
  --color-accent-subtle: #EFF5FF;
  --color-accent-text: #1A4DAF;
  --color-accent-border: #DCE8FE;
  --color-success-solid: #0B8141;
  --color-success-text: #046231;
  --color-success-subtle: #EAF7EF;
  --color-success-border: #CDEED9;
  --color-warning-solid: #F5B83D;
  --color-warning-on-solid: #181C22;
  --color-warning-text: #9A6419;
  --color-warning-subtle: #FFF7E6;
  --color-warning-border: #FFEBC2;
  --color-danger-solid: #CA342B;
  --color-danger-hover: #A12822;
  --color-danger-pressed: #7E211C;
  --color-danger-text: #A12822;
  --color-danger-subtle: #FEF0EF;
  --color-danger-border: #FDDAD7;
  --color-info-solid: #005D6D;
  --color-info-text: #08798D;
  --color-info-subtle: #EAFAFE;
  --color-info-border: #C0EAF4;
  --color-header-bg: #FFFFFF;
  --color-header-text: #181C22;
  --color-header-text-secondary: #525C6A;
  --color-header-hover: #EBEEF2;
  --color-header-border: #E1E5EA;
  --color-header-mark-bg: #1F5FD6;
  --color-header-mark-text: #FFFFFF;
  --color-header-focus: #1F5FD6;
  --color-progress-fill: #1F5FD6;
  --color-progress-track: #E1E5EA;
  --chart-1: #2A78D6;
  --chart-2: #D85B2A;
  --chart-3: #15885E;
  --chart-4: #A36D00;
  --chart-5: #BE527B;
  --chart-6: #008300;
  --chart-7: #4A3AA7;
  --chart-8: #E34948;
  --chart-seq-1: #CDE2FB;
  --chart-seq-2: #9EC5F4;
  --chart-seq-3: #6DA7EC;
  --chart-seq-4: #3987E5;
  --chart-seq-5: #256ABF;
  --chart-seq-6: #184F95;
  --chart-seq-7: #0D366B;
  --chart-comp-1: #002E86;
  --chart-comp-2: #0D4FC5;
  --chart-comp-3: #3879F2;
  --chart-diverging-mid: #EEF0F3;
  --chart-grid: #E1E5EA;
  --chart-axis: #B6BFCA;
  --chart-status-good: #047C05;
  --chart-status-warning: #FFBE49;
  --chart-status-serious: #EC835A;
  --chart-status-critical: #D23D3D;
  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.18);
}

@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) {
    color-scheme: dark;
    --color-bg-canvas: #111418;
    --color-bg-surface: #181C22;
    --color-bg-surface-alt: #1C2127;
    --color-bg-elevated: #21262D;
    --color-bg-input: #14181D;
    --color-bg-hover: #2A3039;
    --color-bg-pressed: #333A45;
    --color-bg-selected: #1A2B48;
    --color-bg-inverse: #EBEEF2;
    --color-bg-overlay: #0B0D10A6;
    --color-text-primary: #E8ECF1;
    --color-text-secondary: #AAB3BF;
    --color-text-tertiary: #949FAD;
    --color-text-disabled: #5F6977;
    --color-text-on-accent: #FFFFFF;
    --color-text-link: #8DB6FA;
    --color-text-inverse: #181C22;
    --color-border-subtle: #21262D;
    --color-border-default: #333A45;
    --color-border-strong: #636E7D;
    --color-border-focus: #5B92F5;
    --color-accent-default: #2463DA;
    --color-accent-hover: #2A6BE0;
    --color-accent-pressed: #1A4DAF;
    --color-accent-subtle: #1D2A43;
    --color-accent-text: #8DB6FA;
    --color-accent-border: #243F74;
    --color-success-solid: #0B8141;
    --color-success-text: #75DA9F;
    --color-success-subtle: #1C2F2C;
    --color-success-border: #25553E;
    --color-warning-solid: #F5B83D;
    --color-warning-on-solid: #181C22;
    --color-warning-text: #FFCB5C;
    --color-warning-subtle: #332F25;
    --color-warning-border: #65532B;
    --color-danger-solid: #CA342B;
    --color-danger-hover: #D73A31;
    --color-danger-pressed: #A12822;
    --color-danger-text: #E8918C;
    --color-danger-subtle: #352226;
    --color-danger-border: #6A2E2E;
    --color-info-solid: #005D6D;
    --color-info-text: #55AEC3;
    --color-info-subtle: #163039;
    --color-info-border: #124D5A;
    --color-header-bg: #181C22;
    --color-header-text: #E8ECF1;
    --color-header-text-secondary: #AAB3BF;
    --color-header-hover: #2A3039;
    --color-header-border: #21262D;
    --color-header-mark-bg: #2463DA;
    --color-header-mark-text: #FFFFFF;
    --color-header-focus: #5B92F5;
    --color-progress-fill: #5B92F5;
    --color-progress-track: #333A45;
    --chart-1: #3987E5;
    --chart-2: #D95926;
    --chart-3: #199E70;
    --chart-4: #C98500;
    --chart-5: #D55181;
    --chart-6: #008300;
    --chart-7: #9085E9;
    --chart-8: #E66767;
    --chart-seq-1: #0D366B;
    --chart-seq-2: #184F95;
    --chart-seq-3: #256ABF;
    --chart-seq-4: #3987E5;
    --chart-seq-5: #6DA7EC;
    --chart-seq-6: #9EC5F4;
    --chart-seq-7: #CDE2FB;
    --chart-comp-1: #B9D2FE;
    --chart-comp-2: #76A6FF;
    --chart-comp-3: #3979F2;
    --chart-diverging-mid: #2F3640;
    --chart-grid: #2A3039;
    --chart-axis: #3D4551;
    --chart-status-good: #047C05;
    --chart-status-warning: #FFBE49;
    --chart-status-serious: #EC835A;
    --chart-status-critical: #D23D3D;
    --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.5);
    --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.6);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg-canvas: #111418;
  --color-bg-surface: #181C22;
  --color-bg-surface-alt: #1C2127;
  --color-bg-elevated: #21262D;
  --color-bg-input: #14181D;
  --color-bg-hover: #2A3039;
  --color-bg-pressed: #333A45;
  --color-bg-selected: #1A2B48;
  --color-bg-inverse: #EBEEF2;
  --color-bg-overlay: #0B0D10A6;
  --color-text-primary: #E8ECF1;
  --color-text-secondary: #AAB3BF;
  --color-text-tertiary: #949FAD;
  --color-text-disabled: #5F6977;
  --color-text-on-accent: #FFFFFF;
  --color-text-link: #8DB6FA;
  --color-text-inverse: #181C22;
  --color-border-subtle: #21262D;
  --color-border-default: #333A45;
  --color-border-strong: #636E7D;
  --color-border-focus: #5B92F5;
  --color-accent-default: #2463DA;
  --color-accent-hover: #2A6BE0;
  --color-accent-pressed: #1A4DAF;
  --color-accent-subtle: #1D2A43;
  --color-accent-text: #8DB6FA;
  --color-accent-border: #243F74;
  --color-success-solid: #0B8141;
  --color-success-text: #75DA9F;
  --color-success-subtle: #1C2F2C;
  --color-success-border: #25553E;
  --color-warning-solid: #F5B83D;
  --color-warning-on-solid: #181C22;
  --color-warning-text: #FFCB5C;
  --color-warning-subtle: #332F25;
  --color-warning-border: #65532B;
  --color-danger-solid: #CA342B;
  --color-danger-hover: #D73A31;
  --color-danger-pressed: #A12822;
  --color-danger-text: #E8918C;
  --color-danger-subtle: #352226;
  --color-danger-border: #6A2E2E;
  --color-info-solid: #005D6D;
  --color-info-text: #55AEC3;
  --color-info-subtle: #163039;
  --color-info-border: #124D5A;
  --color-header-bg: #181C22;
  --color-header-text: #E8ECF1;
  --color-header-text-secondary: #AAB3BF;
  --color-header-hover: #2A3039;
  --color-header-border: #21262D;
  --color-header-mark-bg: #2463DA;
  --color-header-mark-text: #FFFFFF;
  --color-header-focus: #5B92F5;
  --color-progress-fill: #5B92F5;
  --color-progress-track: #333A45;
  --chart-1: #3987E5;
  --chart-2: #D95926;
  --chart-3: #199E70;
  --chart-4: #C98500;
  --chart-5: #D55181;
  --chart-6: #008300;
  --chart-7: #9085E9;
  --chart-8: #E66767;
  --chart-seq-1: #0D366B;
  --chart-seq-2: #184F95;
  --chart-seq-3: #256ABF;
  --chart-seq-4: #3987E5;
  --chart-seq-5: #6DA7EC;
  --chart-seq-6: #9EC5F4;
  --chart-seq-7: #CDE2FB;
  --chart-comp-1: #B9D2FE;
  --chart-comp-2: #76A6FF;
  --chart-comp-3: #3979F2;
  --chart-diverging-mid: #2F3640;
  --chart-grid: #2A3039;
  --chart-axis: #3D4551;
  --chart-status-good: #047C05;
  --chart-status-warning: #FFBE49;
  --chart-status-serious: #EC835A;
  --chart-status-critical: #D23D3D;
  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.6);
}