:root, [data-theme="light"] {
  --surface-0: #f5f6f6;
  --surface-1: #ffffff;
  --surface-2: #ebeeee;
  --border: #dde2e3;
  --border-strong: #7d8a90;
  --ink: #10222b;
  --ink-muted: #4a5b63;
  --brand: #f2a900;
  --brand-hover: #d99700;
  --on-brand: #10222b;
  --brand-ink: #1a5f75;
  --brand-surface: #fff4d6;
  --focus: #1a5f75;
  --danger: #b42318;
  --danger-hover: #912018;
  --on-danger: #ffffff;
  --danger-surface: #fdecea;
  --info: #1a5f75;
  --info-surface: #e6f0f3;
  --data-active: #1a5f75;
  --data-inactive: #c2cdd2;
  --status-muted: #586a72;
  --shell: #12303c;
  --on-shell: #f3f6f7;
  --on-shell-muted: #b4c3c9;
  --shadow-dialog: 0 12px 32px rgba(29,27,23,0.18);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --control-h: 40px;
  --shell-h: 56px;
  --content-max: 1216px;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
[data-theme="dark"] {
  --surface-0: #0c171c;
  --surface-1: #12222a;
  --surface-2: #1a2d36;
  --border: #243a45;
  --border-strong: #6f858f;
  --ink: #eef3f4;
  --ink-muted: #a9bac1;
  --brand: #f2a900;
  --brand-hover: #ffbb1a;
  --on-brand: #10222b;
  --brand-ink: #7cc4d8;
  --brand-surface: #2b2410;
  --focus: #7cc4d8;
  --danger: #f97066;
  --danger-hover: #fb8a82;
  --on-danger: #1d1b17;
  --danger-surface: #3a1714;
  --info: #7cc4d8;
  --info-surface: #0f2a33;
  --data-active: #7cc4d8;
  --data-inactive: #4a6572;
  --status-muted: #a1b2b9;
  --shell: #0a1419;
  --on-shell: #f3f6f7;
  --on-shell-muted: #b4c3c9;
  --shadow-dialog: 0 12px 32px rgba(0,0,0,0.5);
}