/* Generated by scripts/build.py from tokens/*.json. Do not edit by hand. */
:root {
  --font-family-display: "Big Shoulders", "Big Shoulders Display", "Arial Narrow", "Roboto Condensed", sans-serif;
  --font-family-sans: Overpass, -apple-system, BlinkMacSystemFont, "Segoe UI Variable", Roboto, sans-serif;
  --font-family-mono: "Overpass Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-heavy: 800;
  --space-0: 0px;
  --space-0-5: 2px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-none: 0px;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-full: 9999px;
  --size-touch: 44px;
  --size-row: 36px;
  --size-row-touch: 44px;
  --size-icon: 16px;
  --size-icon-sm: 14px;
  --size-mark: 28px;
  --size-focus-ring: 2px;
  --size-focus-offset: 2px;
  --size-tick: 11px;
  --size-tick-stroke: 1.5px;
  --size-dim-cap: 9px;
  --size-dim-stroke: 1px;
  --size-route: 4px;
  --size-station: 14px;
  --size-station-stroke: 3px;
  --size-plate-keyline: 1.5px;
  --size-badge-stroke: 2px;
  --size-rule: 1px;
  --duration-instant: 0ms;
  --duration-press: 80ms;
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 240ms;
  --duration-chart: 240ms;
  --duration-draw-in: 320ms;
  --easing-enter: cubic-bezier(0.2, 0.8, 0.2, 1.0);
  --easing-exit: cubic-bezier(0.4, 0.0, 1.0, 1.0);
  --easing-move: cubic-bezier(0.3, 0.0, 0.0, 1.0);
  --breakpoint-phone: 0px;
  --breakpoint-tablet: 640px;
  --breakpoint-desktop: 1100px;
  --breakpoint-wide: 1800px;
  --z-base: 0;
  --z-sticky: 10;
  --z-dropdown: 20;
  --z-overlay: 30;
  --z-modal: 40;
  --z-toast: 50;
  --z-tooltip: 60;
  --type-caption: 400 11px/1.45 var(--font-family-sans);
  --type-caption-tracking: 0px;
  --type-kicker: 700 11px/1.3 var(--font-family-sans);
  --type-kicker-tracking: 1.0px;
  --type-small: 400 12px/1.45 var(--font-family-sans);
  --type-small-tracking: 0px;
  --type-body: 400 14px/1.45 var(--font-family-sans);
  --type-body-tracking: 0px;
  --type-body-strong: 600 14px/1.45 var(--font-family-sans);
  --type-body-strong-tracking: 0px;
  --type-read: 400 16px/1.6 var(--font-family-sans);
  --type-read-tracking: 0px;
  --type-title: 800 18px/1.2 var(--font-family-display);
  --type-title-tracking: 1.0px;
  --type-plate-sm: 800 24px/1.0 var(--font-family-display);
  --type-plate-sm-tracking: 0.8px;
  --type-plate: 800 32px/1.0 var(--font-family-display);
  --type-plate-tracking: 1.0px;
  --type-display: 800 48px/1.0 var(--font-family-display);
  --type-display-tracking: 0.5px;
  --type-hero: 800 96px/0.95 var(--font-family-display);
  --type-hero-tracking: 0px;
  --type-num: 400 13px/1.45 var(--font-family-mono);
  --type-num-tracking: 0px;
  --type-num-lg: 600 38px/1.1 var(--font-family-mono);
  --type-num-lg-tracking: 0px;
  --type-dim: 400 11px/1.3 var(--font-family-mono);
  --type-dim-tracking: 0px;
  --type-code: 400 12px/1.5 var(--font-family-mono);
  --type-code-tracking: 0px;
  --motion-distance: 1;
  color-scheme: dark;
}

:root, [data-theme="dark"] {
  --color-bg-canvas: #101113;
  --color-bg-surface: #16171A;
  --color-bg-raised: #1E1F23;
  --color-bg-sunken: #0B0C0D;
  --color-bg-overlay: #000000B3;
  --color-text-primary: #F2E9DA;
  --color-text-secondary: #B7AE9F;
  --color-text-tertiary: #948C80;
  --color-text-inverse: #101113;
  --color-border-subtle: #2A2B2F;
  --color-border-default: #3A3B40;
  --color-border-control: #7A776F;
  --color-border-strong: #F2E9DA;
  --color-accent-default: #E8743B;
  --color-accent-text: #E8894A;
  --color-accent-fill: #E8743B;
  --color-accent-on-fill: #120A05;
  --color-accent-tint: #E8743B1F;
  --color-plate-fill: #E8743B;
  --color-plate-on: #120A05;
  --color-plate-keyline: #120A05;
  --color-route-line: #8C877E;
  --color-route-station: #F2E9DA;
  --color-focus: #E8894A;
  --color-status-success-fg: #5FCB8C;
  --color-status-success-bg: #5FCB8C1A;
  --color-status-warning-fg: #F2C14E;
  --color-status-warning-bg: #F2C14E1A;
  --color-status-danger-fg: #FF6B5E;
  --color-status-danger-bg: #FF6B5E1A;
  --color-status-neutral-fg: #B7AE9F;
  --color-status-neutral-bg: #B7AE9F1A;
  --color-chart-grid: #2A2B2F;
  --color-chart-axis: #948C80;
  --color-chart-previous: #7A776F;
  --color-chart-series-1: #E0702F;
  --color-chart-series-2: #3987E5;
  --color-chart-series-3: #1FA595;
  --color-chart-series-4: #9085E9;
  --color-chart-series-5: #D55181;
  --color-chart-series-6: #8C8F2E;
  --color-status-success-icon: "✓";
  --color-status-success-label: "Running";
  --color-status-warning-icon: "⚠";
  --color-status-warning-label: "Slow";
  --color-status-danger-icon: "⊘";
  --color-status-danger-label: "Failed";
  --color-status-neutral-icon: "⏸";
  --color-status-neutral-label: "Paused";
  --shadow-1: 0px 1px 2px 0px rgba(0,0,0,0.4);
  --shadow-2: 0px 8px 24px 0px rgba(0,0,0,0.451);
  --shadow-3: 0px 16px 48px 0px rgba(0,0,0,0.549);
  color-scheme: dark;
}

[data-theme="light"] {
  --color-bg-canvas: #F4EFE6;
  --color-bg-surface: #FBF8F2;
  --color-bg-raised: #EEE8DD;
  --color-bg-sunken: #FFFFFF;
  --color-bg-overlay: #17140F66;
  --color-text-primary: #17140F;
  --color-text-secondary: #5A5247;
  --color-text-tertiary: #6B6359;
  --color-text-inverse: #FFFFFF;
  --color-border-subtle: #E2DBCF;
  --color-border-default: #CFC6B8;
  --color-border-control: #7E786F;
  --color-border-strong: #17140F;
  --color-accent-default: #C95A20;
  --color-accent-text: #A3460F;
  --color-accent-fill: #A3460F;
  --color-accent-on-fill: #FFFFFF;
  --color-accent-tint: #E8743B1F;
  --color-plate-fill: #E8743B;
  --color-plate-on: #120A05;
  --color-plate-keyline: #120A05;
  --color-route-line: #6F685E;
  --color-route-station: #17140F;
  --color-focus: #A3460F;
  --color-status-success-fg: #176D42;
  --color-status-success-bg: #176D4214;
  --color-status-warning-fg: #684B00;
  --color-status-warning-bg: #684B0014;
  --color-status-danger-fg: #B52B2B;
  --color-status-danger-bg: #B52B2B14;
  --color-status-neutral-fg: #5A5247;
  --color-status-neutral-bg: #5A524714;
  --color-chart-grid: #E2DBCF;
  --color-chart-axis: #6B6359;
  --color-chart-previous: #7E786F;
  --color-chart-series-1: #C95A20;
  --color-chart-series-2: #2A78D6;
  --color-chart-series-3: #00897A;
  --color-chart-series-4: #6250D6;
  --color-chart-series-5: #C2457A;
  --color-chart-series-6: #6F7220;
  --color-status-success-icon: "✓";
  --color-status-success-label: "Running";
  --color-status-warning-icon: "⚠";
  --color-status-warning-label: "Slow";
  --color-status-danger-icon: "⊘";
  --color-status-danger-label: "Failed";
  --color-status-neutral-icon: "⏸";
  --color-status-neutral-label: "Paused";
  --shadow-1: 0px 1px 2px 0px rgba(0,0,0,0.059);
  --shadow-2: 0px 8px 24px 0px rgba(0,0,0,0.102);
  --shadow-3: 0px 16px 48px 0px rgba(0,0,0,0.161);
  color-scheme: light;
}

[data-theme="hc"] {
  --color-bg-canvas: #000000;
  --color-bg-surface: #0B0C0D;
  --color-bg-raised: #16171A;
  --color-bg-sunken: #000000;
  --color-bg-overlay: #000000E0;
  --color-text-primary: #FFFFFF;
  --color-text-secondary: #D9D0C1;
  --color-text-tertiary: #B7AE9F;
  --color-text-inverse: #000000;
  --color-border-subtle: #8C877E;
  --color-border-default: #948C80;
  --color-border-control: #B7AE9F;
  --color-border-strong: #FFFFFF;
  --color-accent-default: #F59E5B;
  --color-accent-text: #F59E5B;
  --color-accent-fill: #F59E5B;
  --color-accent-on-fill: #000000;
  --color-accent-tint: #F59E5B1F;
  --color-plate-fill: #E8743B;
  --color-plate-on: #120A05;
  --color-plate-keyline: #120A05;
  --color-route-line: #B7AE9F;
  --color-route-station: #FFFFFF;
  --color-focus: #FFFFFF;
  --color-status-success-fg: #7BE0A6;
  --color-status-success-bg: #7BE0A626;
  --color-status-warning-fg: #FFD84D;
  --color-status-warning-bg: #FFD84D26;
  --color-status-danger-fg: #FF8F8F;
  --color-status-danger-bg: #FF8F8F26;
  --color-status-neutral-fg: #D9D0C1;
  --color-status-neutral-bg: #D9D0C126;
  --color-chart-grid: #8C877E;
  --color-chart-axis: #B7AE9F;
  --color-chart-previous: #948C80;
  --color-chart-series-1: #E0702F;
  --color-chart-series-2: #3987E5;
  --color-chart-series-3: #1FA595;
  --color-chart-series-4: #9085E9;
  --color-chart-series-5: #D55181;
  --color-chart-series-6: #8C8F2E;
  --color-status-success-icon: "✓";
  --color-status-success-label: "Running";
  --color-status-warning-icon: "⚠";
  --color-status-warning-label: "Slow";
  --color-status-danger-icon: "⊘";
  --color-status-danger-label: "Failed";
  --color-status-neutral-icon: "⏸";
  --color-status-neutral-label: "Paused";
  --shadow-1: 0px 0px 0px 0px rgba(0,0,0,0.0);
  --shadow-2: 0px 0px 0px 0px rgba(0,0,0,0.0);
  --shadow-3: 0px 0px 0px 0px rgba(0,0,0,0.0);
  color-scheme: dark;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --color-bg-canvas: #F4EFE6;
    --color-bg-surface: #FBF8F2;
    --color-bg-raised: #EEE8DD;
    --color-bg-sunken: #FFFFFF;
    --color-bg-overlay: #17140F66;
    --color-text-primary: #17140F;
    --color-text-secondary: #5A5247;
    --color-text-tertiary: #6B6359;
    --color-text-inverse: #FFFFFF;
    --color-border-subtle: #E2DBCF;
    --color-border-default: #CFC6B8;
    --color-border-control: #7E786F;
    --color-border-strong: #17140F;
    --color-accent-default: #C95A20;
    --color-accent-text: #A3460F;
    --color-accent-fill: #A3460F;
    --color-accent-on-fill: #FFFFFF;
    --color-accent-tint: #E8743B1F;
    --color-plate-fill: #E8743B;
    --color-plate-on: #120A05;
    --color-plate-keyline: #120A05;
    --color-route-line: #6F685E;
    --color-route-station: #17140F;
    --color-focus: #A3460F;
    --color-status-success-fg: #176D42;
    --color-status-success-bg: #176D4214;
    --color-status-warning-fg: #684B00;
    --color-status-warning-bg: #684B0014;
    --color-status-danger-fg: #B52B2B;
    --color-status-danger-bg: #B52B2B14;
    --color-status-neutral-fg: #5A5247;
    --color-status-neutral-bg: #5A524714;
    --color-chart-grid: #E2DBCF;
    --color-chart-axis: #6B6359;
    --color-chart-previous: #7E786F;
    --color-chart-series-1: #C95A20;
    --color-chart-series-2: #2A78D6;
    --color-chart-series-3: #00897A;
    --color-chart-series-4: #6250D6;
    --color-chart-series-5: #C2457A;
    --color-chart-series-6: #6F7220;
    --color-status-success-icon: "✓";
    --color-status-success-label: "Running";
    --color-status-warning-icon: "⚠";
    --color-status-warning-label: "Slow";
    --color-status-danger-icon: "⊘";
    --color-status-danger-label: "Failed";
    --color-status-neutral-icon: "⏸";
    --color-status-neutral-label: "Paused";
    --shadow-1: 0px 1px 2px 0px rgba(0,0,0,0.059);
    --shadow-2: 0px 8px 24px 0px rgba(0,0,0,0.102);
    --shadow-3: 0px 16px 48px 0px rgba(0,0,0,0.161);
    color-scheme: light;
  }
  
}

@media (prefers-contrast: more) {
  :root:not([data-theme]) {
    --color-bg-canvas: #000000;
    --color-bg-surface: #0B0C0D;
    --color-bg-raised: #16171A;
    --color-bg-sunken: #000000;
    --color-bg-overlay: #000000E0;
    --color-text-primary: #FFFFFF;
    --color-text-secondary: #D9D0C1;
    --color-text-tertiary: #B7AE9F;
    --color-text-inverse: #000000;
    --color-border-subtle: #8C877E;
    --color-border-default: #948C80;
    --color-border-control: #B7AE9F;
    --color-border-strong: #FFFFFF;
    --color-accent-default: #F59E5B;
    --color-accent-text: #F59E5B;
    --color-accent-fill: #F59E5B;
    --color-accent-on-fill: #000000;
    --color-accent-tint: #F59E5B1F;
    --color-plate-fill: #E8743B;
    --color-plate-on: #120A05;
    --color-plate-keyline: #120A05;
    --color-route-line: #B7AE9F;
    --color-route-station: #FFFFFF;
    --color-focus: #FFFFFF;
    --color-status-success-fg: #7BE0A6;
    --color-status-success-bg: #7BE0A626;
    --color-status-warning-fg: #FFD84D;
    --color-status-warning-bg: #FFD84D26;
    --color-status-danger-fg: #FF8F8F;
    --color-status-danger-bg: #FF8F8F26;
    --color-status-neutral-fg: #D9D0C1;
    --color-status-neutral-bg: #D9D0C126;
    --color-chart-grid: #8C877E;
    --color-chart-axis: #B7AE9F;
    --color-chart-previous: #948C80;
    --color-chart-series-1: #E0702F;
    --color-chart-series-2: #3987E5;
    --color-chart-series-3: #1FA595;
    --color-chart-series-4: #9085E9;
    --color-chart-series-5: #D55181;
    --color-chart-series-6: #8C8F2E;
    --color-status-success-icon: "✓";
    --color-status-success-label: "Running";
    --color-status-warning-icon: "⚠";
    --color-status-warning-label: "Slow";
    --color-status-danger-icon: "⊘";
    --color-status-danger-label: "Failed";
    --color-status-neutral-icon: "⏸";
    --color-status-neutral-label: "Paused";
    --shadow-1: 0px 0px 0px 0px rgba(0,0,0,0.0);
    --shadow-2: 0px 0px 0px 0px rgba(0,0,0,0.0);
    --shadow-3: 0px 0px 0px 0px rgba(0,0,0,0.0);
    color-scheme: dark;
  }
  
}

/* Reduced motion: keep cross-fades, remove travel. Components multiply offsets by --motion-distance. */
@media (prefers-reduced-motion: reduce) {
  :root { --motion-distance: 0; --duration-slow: var(--duration-fast); --duration-chart: 0ms; --duration-draw-in: 0ms; }
}
/* Windows High Contrast / forced colours: let the system palette win, keep focus visible. */
@media (forced-colors: active) {
  :root { --color-focus: Highlight; --color-border-control: CanvasText; --color-border-default: CanvasText; }
}