:root {
  color-scheme: light dark;
  --radius-card: 26px;
  --radius-settings-card: 24px;
  --radius-chip: 22px;
  --radius-pill: 999px;
  --radius-input: 16px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 20px;
  --space-xl: 24px;
  --glass-alpha: 0.88;
  --glass-border-alpha: 0.08;
  --system-message-alpha: 0.72;
  --glow-alpha: 0.18;
  --glow-blur: 10px;
  --glow-spread: 0.4px;
  --content-max-width: 760px;
  --screen-padding: 16px;
  --accent: #9ca3af;
  --accent-on: #0a0f1a;
  --accent-neutral: #9ca3af;
  --accent-amber: #f4b63a;
  --accent-green: #5bbf5a;
  --accent-blue: #4f8cff;
  --accent-orange: #e0673e;
  --accent-violet: #b46bff;
  --accent-red: #e25656;
  --accent-sky: #7ec9ff;
  --accent-yellow: #f5e24b;
  --accent-sand: #9c8660;
  --bg: #0f1115;
  --surface: #1a1d22;
  --surface-strong: #20242b;
  --surface-soft: #141820;
  --text: #e9f2f0;
  --muted: rgba(233, 242, 240, 0.68);
  --stroke: rgba(233, 242, 240, 0.1);
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  --noise: rgba(233, 242, 240, 0.05);
  --header-strong: rgba(15, 17, 21, 0.85);
  --header-soft: rgba(15, 17, 21, 0.6);
}

@media (prefers-color-scheme: light) {
  :root {
    --bg: #f4f6fa;
    --surface: #ffffff;
    --surface-strong: #f8f9fc;
    --surface-soft: #edf1f7;
    --text: #0a0f1a;
    --muted: rgba(10, 15, 26, 0.68);
    --stroke: rgba(10, 15, 26, 0.12);
    --shadow: 0 18px 40px rgba(10, 15, 26, 0.12);
    --noise: rgba(10, 15, 26, 0.04);
    --header-strong: rgba(244, 246, 250, 0.95);
    --header-soft: rgba(244, 246, 250, 0.6);
  }
}

[data-theme='light'] {
  color-scheme: light;
  --bg: #f4f6fa;
  --surface: #ffffff;
  --surface-strong: #f8f9fc;
  --surface-soft: #edf1f7;
  --text: #0a0f1a;
  --muted: rgba(10, 15, 26, 0.68);
  --stroke: rgba(10, 15, 26, 0.12);
  --shadow: 0 18px 40px rgba(10, 15, 26, 0.12);
  --noise: rgba(10, 15, 26, 0.04);
  --header-strong: rgba(244, 246, 250, 0.95);
  --header-soft: rgba(244, 246, 250, 0.6);
}

[data-theme='dark'] {
  color-scheme: dark;
  --bg: #0f1115;
  --surface: #1a1d22;
  --surface-strong: #20242b;
  --surface-soft: #141820;
  --text: #e9f2f0;
  --muted: rgba(233, 242, 240, 0.68);
  --stroke: rgba(233, 242, 240, 0.1);
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  --noise: rgba(233, 242, 240, 0.05);
  --header-strong: rgba(15, 17, 21, 0.85);
  --header-soft: rgba(15, 17, 21, 0.6);
}