:root,
[data-theme="dark"] {
  color-scheme: dark;

  --bg-deep: #05070c;
  --bg-base: #080c14;
  --bg-surface: #0e131d;
  --bg-elevated: #131926;
  --bg-glass: rgba(255, 255, 255, 0.04);
  --bg-glass-strong: rgba(8, 11, 18, 0.88);

  --glass-bg: rgba(255, 255, 255, 0.06);
  --glass-bg-hover: rgba(255, 255, 255, 0.11);
  --glass-border: rgba(255, 255, 255, 0.14);
  --glass-border-strong: rgba(255, 255, 255, 0.22);
  --glass-highlight: rgba(255, 255, 255, 0.1);
  --glass-blur: 24px;
  --glass-blur-strong: 40px;
  --glass-saturate: 1.85;
  --glass-shadow:
    0 4px 30px rgba(0, 0, 0, 0.24),
    0 1px 0 rgba(255, 255, 255, 0.06) inset,
    0 0 0 1px rgba(255, 255, 255, 0.04) inset;
  --glass-shadow-hover:
    0 12px 40px rgba(0, 0, 0, 0.32),
    0 1px 0 rgba(255, 255, 255, 0.12) inset,
    0 0 48px rgba(45, 212, 179, 0.06);

  --accent: #2dd4b3;
  --accent-soft: #6ee7c7;
  --accent-dim: rgba(45, 212, 179, 0.1);
  --accent-glow: rgba(45, 212, 179, 0.18);
  --accent-line: rgba(45, 212, 179, 0.35);

  --gold: #d4b86a;
  --gold-dim: rgba(212, 184, 106, 0.1);
  --gold-glow: rgba(212, 184, 106, 0.14);

  --blue: #60a5fa;
  --blue-dim: rgba(96, 165, 250, 0.1);
  --amber: #fbbf24;
  --amber-dim: rgba(251, 191, 36, 0.1);
  --red: #f87171;
  --red-dim: rgba(248, 113, 113, 0.1);
  --purple: #a78bfa;
  --purple-dim: rgba(167, 139, 250, 0.1);
  --green: #34d399;
  --green-dim: rgba(52, 211, 153, 0.1);
  --orange: #fb923c;
  --orange-dim: rgba(251, 146, 60, 0.1);
  --cyan: #22d3ee;
  --cyan-dim: rgba(34, 211, 238, 0.1);

  --text: #f1f5f9;
  --text-secondary: #9aa8bc;
  --text-muted: #64748b;
  --border: rgba(255, 255, 255, 0.07);
  --border-strong: rgba(255, 255, 255, 0.11);
  --border-accent: rgba(45, 212, 179, 0.2);

  --bg-gradient-1: rgba(45, 212, 179, 0.05);
  --bg-gradient-2: rgba(96, 165, 250, 0.04);
  --theme-color-meta: #05070c;
  --toggle-knob-bg: rgba(255, 255, 255, 0.14);
  --toggle-track-bg: rgba(255, 255, 255, 0.06);

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;

  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 20px;
  --space-xl: 24px;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.24);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.28);
  --shadow-card: var(--glass-shadow);
  --shadow-hover: var(--glass-shadow-hover);

  --font-ui: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", ui-monospace, monospace;

  --sidebar-w: 256px;
  --header-h: 64px;
  --bottom-nav-h: 72px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.2, 0.64, 1);
  --transition: 0.24s var(--ease-out);
  --transition-fast: 0.16s var(--ease-out);
  --hover-lift: -2px;

  --btn-primary-text: #05070c;
}

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

  --bg-deep: #e8edf4;
  --bg-base: #eef2f7;
  --bg-surface: #f8fafc;
  --bg-elevated: #ffffff;
  --bg-glass: rgba(255, 255, 255, 0.55);
  --bg-glass-strong: rgba(255, 255, 255, 0.78);

  --glass-bg: rgba(255, 255, 255, 0.52);
  --glass-bg-hover: rgba(255, 255, 255, 0.68);
  --glass-border: rgba(255, 255, 255, 0.78);
  --glass-border-strong: rgba(255, 255, 255, 0.92);
  --glass-highlight: rgba(255, 255, 255, 0.85);
  --glass-blur: 20px;
  --glass-blur-strong: 32px;
  --glass-saturate: 1.9;
  --glass-shadow:
    0 4px 24px rgba(15, 23, 42, 0.07),
    0 1px 0 rgba(255, 255, 255, 0.95) inset;
  --glass-shadow-hover:
    0 12px 36px rgba(15, 23, 42, 0.11),
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 0 40px rgba(13, 148, 136, 0.08);

  --accent: #0d9488;
  --accent-soft: #14b8a6;
  --accent-dim: rgba(13, 148, 136, 0.1);
  --accent-glow: rgba(13, 148, 136, 0.16);
  --accent-line: rgba(13, 148, 136, 0.35);

  --gold: #b8942e;
  --gold-dim: rgba(184, 148, 46, 0.1);
  --gold-glow: rgba(184, 148, 46, 0.12);

  --blue: #2563eb;
  --blue-dim: rgba(37, 99, 235, 0.08);
  --amber: #d97706;
  --amber-dim: rgba(217, 119, 6, 0.08);
  --red: #dc2626;
  --red-dim: rgba(220, 38, 38, 0.08);
  --purple: #7c3aed;
  --purple-dim: rgba(124, 58, 237, 0.08);
  --green: #059669;
  --green-dim: rgba(5, 150, 105, 0.08);
  --orange: #ea580c;
  --orange-dim: rgba(234, 88, 12, 0.08);
  --cyan: #0891b2;
  --cyan-dim: rgba(8, 145, 178, 0.08);

  --text: #0f172a;
  --text-secondary: #475569;
  --text-muted: #64748b;
  --border: rgba(15, 23, 42, 0.08);
  --border-strong: rgba(15, 23, 42, 0.12);
  --border-accent: rgba(13, 148, 136, 0.22);

  --bg-gradient-1: rgba(13, 148, 136, 0.06);
  --bg-gradient-2: rgba(37, 99, 235, 0.05);
  --theme-color-meta: #e8edf4;
  --toggle-knob-bg: rgba(255, 255, 255, 0.95);
  --toggle-track-bg: rgba(255, 255, 255, 0.45);

  --btn-primary-text: #ffffff;
}
