:root,
[data-theme="grid-night"] {
  color-scheme: dark;
  --c-bg: #061016;
  --c-bg-elevated: #0b1b24;
  --c-surface: #122833;
  --c-surface-2: #183442;
  --c-fg: #e7eef1;
  --c-muted: #8ea3ae;
  --c-subtle: #8ca2ac;
  --c-border: color-mix(in oklab, #e7eef1 11%, transparent);
  --c-border-strong: color-mix(in oklab, #e7eef1 20%, transparent);
  --c-primary: #13b35e;
  --c-primary-fg: #04210f;
  --c-sg: #009a44;
  --c-info: #3ec9d6;
  --c-info-deep: #2a6fdb;
  --c-warn: #e0b122;
  --c-risk: #e8782a;
  --c-danger: #f8767d;
  --c-offline: #7d8a90;
  --c-idle: #13b35e;
  --c-assigned: #3ec9d6;
  --c-enroute: #2a6fdb;
  --c-delay: #e0b122;
  --c-sos: #d9363e;
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 24px;
  --sh-panel: 0 10px 32px rgba(0, 0, 0, .28);
  --sh-float: 0 18px 50px rgba(0, 0, 0, .4);
}

[data-theme="paper"] {
  color-scheme: light;
  --c-bg: #efece5;
  --c-bg-elevated: #fbfaf7;
  --c-surface: #e5e1d8;
  --c-surface-2: #dad5ca;
  --c-fg: #1a2328;
  --c-muted: #4f5d65;
  --c-subtle: #4f5d65;
  --c-border: color-mix(in oklab, #1a2328 10%, transparent);
  --c-border-strong: color-mix(in oklab, #1a2328 18%, transparent);
  --c-primary: #096b33;
  --c-primary-fg: #fff;
  --c-sg: #009a44;
  --c-info: #0e6f7c;
  --c-info-deep: #1d5bb8;
  --c-warn: #765300;
  --c-risk: #c45c14;
  --c-danger: #aa2027;
  --c-offline: #6b787e;
  --c-idle: #0c7a3a;
  --c-assigned: #0e6f7c;
  --c-enroute: #1d5bb8;
  --c-delay: #b78108;
  --c-sos: #c0262c;
  --sh-panel: 0 1px 2px rgba(26, 35, 40, .05), 0 8px 24px rgba(26, 35, 40, .06);
  --sh-float: 0 16px 40px rgba(26, 35, 40, .12);
}

[data-theme="slate"] {
  color-scheme: dark;
  --c-bg: #090b0e;
  --c-bg-elevated: #11141a;
  --c-surface: #1a1f28;
  --c-surface-2: #232a35;
  --c-fg: #eceef2;
  --c-muted: #9aa3b0;
  --c-subtle: #8d97a4;
  --c-border: color-mix(in oklab, #eceef2 10%, transparent);
  --c-border-strong: color-mix(in oklab, #eceef2 20%, transparent);
  --c-primary: #4aa3e8;
  --c-primary-fg: #041018;
  --c-sg: #4aa3e8;
  --c-info: #62c4e8;
  --c-info-deep: #3b82f6;
  --c-warn: #e0b122;
  --c-risk: #e8782a;
  --c-danger: #ff7272;
  --c-offline: #7d8793;
  --c-idle: #34d399;
  --c-assigned: #62c4e8;
  --c-enroute: #3b82f6;
  --c-delay: #e0b122;
  --c-sos: #ef4444;
  --sh-panel: 0 10px 32px rgba(0, 0, 0, .4);
  --sh-float: 0 22px 56px rgba(0, 0, 0, .5);
}

[data-theme="mist"] {
  color-scheme: light;
  --c-bg: #e7eef1;
  --c-bg-elevated: #f7fafb;
  --c-surface: #dbe4e9;
  --c-surface-2: #cdd8df;
  --c-fg: #152028;
  --c-muted: #54636e;
  --c-subtle: #4b5a64;
  --c-border: color-mix(in oklab, #152028 10%, transparent);
  --c-border-strong: color-mix(in oklab, #152028 18%, transparent);
  --c-primary: #0c6c65;
  --c-primary-fg: #fff;
  --c-sg: #0b746c;
  --c-info: #1b6f9c;
  --c-info-deep: #1d5bb8;
  --c-warn: #765300;
  --c-risk: #c45c14;
  --c-danger: #aa2027;
  --c-offline: #6b787e;
  --c-idle: #0b746c;
  --c-assigned: #1b6f9c;
  --c-enroute: #1d5bb8;
  --c-delay: #b78108;
  --c-sos: #c0262c;
  --sh-panel: 0 1px 2px rgba(21, 32, 40, .05), 0 8px 24px rgba(21, 32, 40, .06);
  --sh-float: 0 16px 40px rgba(21, 32, 40, .12);
}

:root {
  --font-sans: "Noto Sans SC", "IBM Plex Sans", "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --bg: var(--c-bg);
  --bg2: var(--c-bg-elevated);
  --panel: var(--c-bg-elevated);
  --panel2: var(--c-surface);
  --panel-2: var(--c-surface);
  --line: var(--c-border);
  --ink: var(--c-fg);
  --ink2: var(--c-muted);
  --ink3: var(--c-muted);
  --muted: var(--c-muted);
  --cyan: var(--c-info);
  --blue: var(--c-info-deep);
  --amber: var(--c-warn);
  --red: var(--c-danger);
  --green: var(--c-primary);
  --violet: var(--c-info-deep);
  --r: var(--r-md);
  --r2: var(--r-sm);
  --shadow: var(--sh-panel);
}

.shell-console {
  --r-xs: 3px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 14px;
}

.shell-app {
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
}

.shell-adapt {
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
}

@media (min-width: 1024px) {
  .shell-adapt {
    --r-xs: 3px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 10px;
    --r-xl: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}