:root {
  color-scheme: dark;

  /* Core semantic colors */
  --bg:
    radial-gradient(circle at top, rgba(59, 130, 246, 0.10), transparent 26%),
    linear-gradient(180deg, #020817 0%, #01040b 100%);
  --surface: #07111f;
  --surface-elevated: #07111f;
  --card: #07111f;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --border: rgba(148, 163, 184, 0.20);

  /* Brand / accent */
  --brand: #c19a2e;
  --accent: #c19a2e;
  --primary: #7ea8ff;
  --primary-rgb: 126, 168, 255;

  /* Shared component helpers */
  --theme-pills-bg: rgba(15, 23, 42, 0.78);
  --theme-pills-shadow: none;

  /* Surfaces / effects */
  --shell-bg: #07111f;
  --card-bg: rgba(7, 17, 31, 0.98);
  --card-border: rgba(148, 163, 184, 0.18);
  --card-shadow: 0 12px 32px rgba(0, 0, 0, 0.26);

  /* Text nuance */
  --heading: #ffffff;
  --link: var(--accent);

  /* Optional compatibility aliases */
  --background: var(--bg);
  --foreground: var(--text);
}

html[data-theme="system"] {
  color-scheme: dark;

  --bg:
    radial-gradient(circle at top, rgba(59, 130, 246, 0.10), transparent 26%),
    linear-gradient(180deg, #020817 0%, #01040b 100%);
  --surface: #07111f;
  --surface-elevated: #07111f;
  --card: #07111f;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --border: rgba(148, 163, 184, 0.20);

  --brand: #c19a2e;
  --accent: #c19a2e;
  --primary: #7ea8ff;
  --primary-rgb: 126, 168, 255;

  --theme-pills-bg: rgba(15, 23, 42, 0.78);
  --theme-pills-shadow: none;

  --shell-bg: #07111f;
  --card-bg: rgba(7, 17, 31, 0.98);
  --card-border: rgba(148, 163, 184, 0.18);
  --card-shadow: 0 12px 32px rgba(0, 0, 0, 0.26);

  --heading: #ffffff;
  --link: var(--accent);

  --background: var(--bg);
  --foreground: var(--text);
}

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

  --bg: #06080c;
  --surface: #0d1118;
  --surface-elevated: #0d1118;
  --card: #0d1118;
  --text: #e6e9ef;
  --muted: #aab2c0;
  --border: #2b3345;

  --brand: #c19a2e;
  --accent: #c19a2e;
  --primary: #b38f45;
  --primary-rgb: 180, 143, 69;

  --theme-pills-bg: rgba(9, 12, 18, 0.92);
  --theme-pills-shadow: none;

  --shell-bg: #0d1118;
  --card-bg: rgba(15, 18, 23, 0.99);
  --card-border: rgba(179, 143, 69, 0.14);
  --card-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);

  --heading: #f4f6fa;
  --link: var(--accent);

  --background: var(--bg);
  --foreground: var(--text);
}

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

  --bg: #f2f4f8;
  --surface: #ffffff;
  --surface-elevated: #ffffff;
  --card: #fbfcfe;
  --text: #1c2433;
  --muted: #5f6b7a;
  --border: #e3e8f0;

  --brand: #c19a2e;
  --accent: #c19a2e;
  --primary: #4f7cff;
  --primary-rgb: 79, 124, 255;

  --theme-pills-bg: rgba(255, 255, 255, 0.94);
  --theme-pills-shadow: none;

  --shell-bg: #ffffff;
  --card-bg: #ffffff;
  --card-border: rgba(15, 23, 42, 0.08);
  --card-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);

  --heading: #0f172a;
  --link: #9a6f12;

  --background: var(--bg);
  --foreground: var(--text);
}

html[data-theme="soft"] {
  color-scheme: dark;

  --bg: #0f1412;
  --surface: #161d18;
  --surface-elevated: #161d18;
  --card: #161d18;
  --text: #e6efe9;
  --muted: #9fb3a8;
  --border: #26322c;

  --brand: #c19a2e;
  --accent: #c19a2e;
  --primary: #4dbd88;
  --primary-rgb: 77, 189, 136;

  --theme-pills-bg: rgba(14, 20, 17, 0.88);
  --theme-pills-shadow: none;

  --shell-bg: #161d18;
  --card-bg: rgba(18, 24, 20, 0.98);
  --card-border: rgba(77, 189, 136, 0.12);
  --card-shadow: 0 10px 28px rgba(0, 0, 0, 0.20);

  --heading: #eef7f1;
  --link: var(--accent);

  --background: var(--bg);
  --foreground: var(--text);
}

@media (prefers-color-scheme: light) {
  html:not([data-theme]),
  html[data-theme="system"] {
    color-scheme: light;

    --bg: #f2f4f8;
    --surface: #ffffff;
    --surface-elevated: #ffffff;
    --card: #fbfcfe;
    --text: #1c2433;
    --muted: #5f6b7a;
    --border: #e3e8f0;

    --brand: #c19a2e;
    --accent: #c19a2e;
    --primary: #4f7cff;
    --primary-rgb: 79, 124, 255;

    --theme-pills-bg: rgba(255, 255, 255, 0.94);
    --theme-pills-shadow: none;

    --shell-bg: #ffffff;
    --card-bg: #ffffff;
    --card-border: rgba(15, 23, 42, 0.08);
    --card-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);

    --heading: #0f172a;
    --link: #9a6f12;

    --background: var(--bg);
    --foreground: var(--text);
  }
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme]),
  html[data-theme="system"] {
    color-scheme: dark;

    --bg:
      radial-gradient(circle at top, rgba(59, 130, 246, 0.10), transparent 26%),
      linear-gradient(180deg, #020817 0%, #01040b 100%);
    --surface: #07111f;
    --surface-elevated: #07111f;
    --card: #07111f;
    --text: #e5e7eb;
    --muted: #94a3b8;
    --border: rgba(148, 163, 184, 0.20);

    --brand: #c19a2e;
    --accent: #c19a2e;
    --primary: #7ea8ff;
    --primary-rgb: 126, 168, 255;

    --theme-pills-bg: rgba(15, 23, 42, 0.78);
    --theme-pills-shadow: none;

    --shell-bg: #07111f;
    --card-bg: rgba(7, 17, 31, 0.98);
    --card-border: rgba(148, 163, 184, 0.18);
    --card-shadow: 0 12px 32px rgba(0, 0, 0, 0.26);

    --heading: #ffffff;
    --link: var(--accent);

    --background: var(--bg);
    --foreground: var(--text);
  }
}