:root[data-theme="dark"],
:root[data-theme="night"] {
  color-scheme: dark;
  --color-background: #0f172a;
  --color-surface: #172033;
  --color-text: #f8fafc;
  --color-muted: #a8b3c7;
  --color-border: #28364d;
  --color-primary: #2dd4bf;
  --shadow-soft: 0 16px 40px rgba(0, 0, 0, 0.28);
}

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

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]),
  :root[data-theme="system"] {
    color-scheme: dark;
    --color-background: #0f172a;
    --color-surface: #172033;
    --color-text: #f8fafc;
    --color-muted: #a8b3c7;
    --color-border: #28364d;
    --color-primary: #2dd4bf;
    --shadow-soft: 0 16px 40px rgba(0, 0, 0, 0.28);
  }
}