:root {
  color-scheme: light dark;
  --blue-900: #0b2750; --blue-800: #123e7a; --blue-700: #1b4f96; --blue-600: #2563b8; --blue-100: #e3ecf8; --blue-50: #f2f6fc;
  --orange-600: #ea5b0c; --orange-500: #f07a33; --orange-100: #fde8da;
  --green-600: #15803d; --green-100: #dcf5e4; --red-600: #c62828; --red-100: #fde2e2;
  --gray-950: #0c111b; --gray-900: #151b28; --gray-800: #232b3b; --gray-700: #364155; --gray-500: #6a7488; --gray-300: #c9cfda; --gray-200: #e3e7ee; --gray-100: #f1f3f7; --white: #ffffff;

  --bg: var(--gray-100); --surface: var(--white); --surface-2: var(--blue-50);
  --text: var(--gray-900); --text-muted: #525c70; --border: var(--gray-200); --border-strong: var(--gray-500);
  --primary: var(--blue-800); --primary-hover: var(--blue-700); --on-primary: var(--white); --primary-soft: var(--blue-100);
  --accent: var(--orange-600); --accent-soft: var(--orange-100);
  --success: var(--green-600); --success-soft: var(--green-100); --danger: var(--red-600); --danger-soft: var(--red-100);
  --focus: var(--orange-600);

  --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fs-xs: 0.8125rem; --fs-sm: 0.9375rem; --fs-base: 1.0625rem; --fs-lg: 1.25rem; --fs-xl: 1.5rem; --fs-2xl: 2rem;
  --lh: 1.5; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
  --radius-sm: 8px; --radius: 12px; --radius-lg: 16px; --radius-full: 999px;
  --shadow-1: 0 1px 2px rgb(12 17 27 / 0.06), 0 1px 3px rgb(12 17 27 / 0.08);
  --shadow-2: 0 4px 12px rgb(12 17 27 / 0.10);
  --shadow-sheet: 0 -8px 24px rgb(12 17 27 / 0.14);
  --shadow-inset: inset 0 -4px 0 rgb(12 17 27 / 0.18);
  --dur-fast: 150ms; --dur: 220ms; --dur-slow: 300ms;
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1); --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --z-header: 10; --z-sheet: 40; --z-toast: 100;
  --col: 640px; --wide: 1040px; --tap: 44px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: var(--gray-950); --surface: var(--gray-900); --surface-2: #17233a;
    --text: #eef1f6; --text-muted: #a4adbd; --border: var(--gray-800); --border-strong: #7d8699;
    --primary: #5b8fd9; --primary-hover: #77a3e2; --on-primary: #08152b; --primary-soft: #1a2c4a;
    --accent: var(--orange-500); --accent-soft: #3a2415;
    --success: #4ade80; --success-soft: #11321f; --danger: #f87171; --danger-soft: #3b1618;
    --focus: var(--orange-500);
    --shadow-1: 0 1px 2px rgb(0 0 0 / 0.4); --shadow-2: 0 4px 12px rgb(0 0 0 / 0.5); --shadow-sheet: 0 -8px 24px rgb(0 0 0 / 0.5);
    --shadow-inset: inset 0 -4px 0 rgb(0 0 0 / 0.35);
  }
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 1ms; --dur: 120ms; --dur-slow: 120ms; }
}