:root {
  --bg: #f5f8fc;
  --surface: #ffffff;
  --surface-variant: #f0f4fa;
  --surface-card: #ffffff;
  --card-border: #e2e8f4;
  --primary: #0e336b;
  --primary-light: #1d4b8f;
  --accent: #2563eb;
  --accent-soft: #e0ecff;
  --text: #1a2233;
  --text-muted: #4d5c7a;
  --success: #10b981;
  --success-text: #047857;
  --success-soft: rgba(16, 185, 129, 0.14);
  --warning: #f59e0b;
  --warning-text: #b45309;
  --warning-soft: rgba(245, 158, 11, 0.16);
  --danger: #ef4444;
  --danger-text: #b91c1c;
  --danger-soft: rgba(239, 68, 68, 0.14);
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --shadow: 0 4px 16px rgba(14, 51, 107, 0.06);
  --shadow-lg: 0 12px 32px rgba(14, 51, 107, 0.14);
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d121d;
    --surface: #151c2b;
    --surface-variant: #1c2538;
    --surface-card: #151c2b;
    --card-border: #242f47;
    --primary: #194685;
    --primary-light: #285da6;
    --accent: #60a5fa;
    --accent-soft: rgba(96, 165, 250, 0.16);
    --text: #f0f4fc;
    --text-muted: #9eb0cf;
    --success-text: #34d399;
    --success-soft: rgba(52, 211, 153, 0.16);
    --warning-text: #fbbf24;
    --warning-soft: rgba(251, 191, 36, 0.16);
    --danger-text: #f87171;
    --danger-soft: rgba(248, 113, 113, 0.16);
    --shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.55);
  }
}

:root[data-theme="dark"] {
  --bg: #0d121d;
  --surface: #151c2b;
  --surface-variant: #1c2538;
  --surface-card: #151c2b;
  --card-border: #242f47;
  --primary: #194685;
  --primary-light: #285da6;
  --accent: #60a5fa;
  --accent-soft: rgba(96, 165, 250, 0.16);
  --text: #f0f4fc;
  --text-muted: #9eb0cf;
  --success-text: #34d399;
  --success-soft: rgba(52, 211, 153, 0.16);
  --warning-text: #fbbf24;
  --warning-soft: rgba(251, 191, 36, 0.16);
  --danger-text: #f87171;
  --danger-soft: rgba(248, 113, 113, 0.16);
  --shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.55);
}