:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101214;
  --bg-elevated: #10141d;
  --surface: #151a25;
  --surface-2: #1b2230;
  --surface-3: #222b3c;
  --border: #2b3547;
  --border-strong: #3b4960;
  --text: #f2f5fb;
  --text-soft: #c0c9d8;
  --muted: #8895a8;
  --accent: #6c7cff;
  --accent-strong: #8f9aff;
  --accent-soft: rgba(108, 124, 255, .14);
  --cyan: #52d5ff;
  --green: #35d49a;
  --green-soft: rgba(53, 212, 154, .13);
  --yellow: #f5c451;
  --yellow-soft: rgba(245, 196, 81, .13);
  --orange: #f28b4b;
  --orange-soft: rgba(242, 139, 75, .14);
  --red: #f06472;
  --red-soft: rgba(240, 100, 114, .13);
  --gray-soft: rgba(136, 149, 168, .13);
  --shadow: 0 18px 55px rgba(0, 0, 0, .27);
  --radius-sm: .55rem;
  --radius: .85rem;
  --radius-lg: 1.2rem;
  --sidebar-width: 17rem;
  --content-max: 96rem;
  --transition: 160ms ease;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f4f4;
  --bg-elevated: #f8f9fc;
  --surface: #ffffff;
  --surface-2: #f3f5f9;
  --surface-3: #e9edf4;
  --border: #d7dde8;
  --border-strong: #bbc5d5;
  --text: #141a24;
  --text-soft: #3c4657;
  --muted: #697588;
  --accent: #4558db;
  --accent-strong: #3348d1;
  --accent-soft: rgba(69, 88, 219, .11);
  --cyan: #067eaa;
  --green: #087a57;
  --green-soft: rgba(8, 122, 87, .1);
  --yellow: #9a6700;
  --yellow-soft: rgba(154, 103, 0, .1);
  --orange: #af4b13;
  --orange-soft: rgba(175, 75, 19, .1);
  --red: #c13245;
  --red-soft: rgba(193, 50, 69, .1);
  --gray-soft: rgba(105, 117, 136, .1);
  --shadow: 0 18px 48px rgba(28, 39, 61, .1);
}

:root[data-theme="neon"] {
  color-scheme: dark;
  --bg: #030914;
  --bg-elevated: #081011;
  --surface: #0b1516;
  --surface-2: #0e1d1e;
  --surface-3: #132728;
  --border: #1f3b3d;
  --border-strong: #2c5b5d;
  --text: #effffd;
  --text-soft: #b8d8d4;
  --muted: #719792;
  --accent: #25f0cf;
  --accent-strong: #75ffe8;
  --accent-soft: rgba(37, 240, 207, .12);
  --cyan: #30d9ff;
  --green: #4dff9f;
  --green-soft: rgba(77, 255, 159, .11);
  --yellow: #f2ef62;
  --yellow-soft: rgba(242, 239, 98, .11);
  --orange: #ff995c;
  --orange-soft: rgba(255, 153, 92, .12);
  --red: #ff5f89;
  --red-soft: rgba(255, 95, 137, .12);
  --gray-soft: rgba(113, 151, 146, .12);
  --shadow: 0 0 40px rgba(37, 240, 207, .07);
}