:root {
  color-scheme: light;
  --bg: #f7f8fb;
  --bg-elevated: #ffffff;
  --bg-muted: #eef1f6;
  --surface-border: #dce3ef;
  --text-primary: #12151f;
  --text-secondary: #4f5b73;
  --text-inverse: #f7f9ff;
  --brand: #2563eb;
  --brand-strong: #1d4ed8;
  --brand-soft: #dbe7ff;
  --shadow-sm: 0 2px 10px rgba(18, 21, 31, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: #0f131b;
    --bg-elevated: #151b26;
    --bg-muted: #1a2231;
    --surface-border: #2d3950;
    --text-primary: #eef2fb;
    --text-secondary: #afbdd7;
    --text-inverse: #0f131b;
    --brand: #6ea8ff;
    --brand-strong: #89b9ff;
    --brand-soft: #21314c;
    --shadow-sm: 0 2px 14px rgba(0, 0, 0, 0.3);
  }
}

:root[data-theme="light"] {
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f131b;
  --bg-elevated: #151b26;
  --bg-muted: #1a2231;
  --surface-border: #2d3950;
  --text-primary: #eef2fb;
  --text-secondary: #afbdd7;
  --text-inverse: #0f131b;
  --brand: #6ea8ff;
  --brand-strong: #89b9ff;
  --brand-soft: #21314c;
  --shadow-sm: 0 2px 14px rgba(0, 0, 0, 0.3);
}