:root[data-theme="dark"] {
  --highlight: #66B7FF;
  --highlight-dark: #94C9FF;
  --highlight-light: #BEE3FF;
  --foam: rgba(21, 36, 52, 0.9);
  --surface: rgba(19, 30, 44, 0.9);
  --background: linear-gradient(180deg, #071E35 0%, #0E243D 60%, #0A1A2E 100%);
  --text: #EDF4FF;
  --muted: #9DB4D1;
  --shadow: rgba(0, 0, 0, 0.55);
  --ark-wood: #D09A5F;
  --ark-dark: #A6783F;
  --water: linear-gradient(120deg, rgba(58, 160, 255, 0.08), rgba(18, 52, 90, 0.3));
}

[data-theme="dark"] body {
  background: var(--background);
  color: var(--text);
}

[data-theme="dark"] .app-header {
  background: linear-gradient(145deg, rgba(8, 38, 68, 0.95) 0%, rgba(9, 25, 44, 0.95) 96%);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .sky-ornaments .cloud {
  background: rgba(90, 130, 180, 0.2);
}

[data-theme="dark"] .rainbow-accent {
  opacity: 0.4;
}

[data-theme="dark"] .difficulty-label {
  color: rgba(237, 244, 255, 0.75);
}

[data-theme="dark"] .difficulty-segments {
  background: linear-gradient(145deg, rgba(12, 28, 48, 0.95), rgba(16, 32, 54, 0.9));
  border: 1px solid rgba(100, 150, 210, 0.28);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .difficulty-option {
  color: rgba(190, 208, 230, 0.85);
}

[data-theme="dark"] .difficulty-option__meta {
  color: rgba(190, 208, 230, 0.55);
}

[data-theme="dark"] .difficulty-option.is-active {
  background: linear-gradient(145deg, rgba(80, 140, 210, 0.25), rgba(30, 70, 110, 0.3));
  border-color: rgba(120, 180, 240, 0.35);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .hud {
  background: rgba(9, 29, 48, 0.55);
  box-shadow: inset 0 0 0 1px rgba(120, 170, 220, 0.12);
}

[data-theme="dark"] .meta-card {
  background: rgba(14, 32, 52, 0.85);
  border-color: rgba(82, 140, 200, 0.28);
  box-shadow: 0 24px 42px rgba(0, 0, 0, 0.36);
}

[data-theme="dark"] .meta-card--accent {
  background: linear-gradient(140deg, rgba(32, 88, 148, 0.55), rgba(20, 52, 96, 0.55));
  border-color: rgba(100, 160, 220, 0.4);
}

[data-theme="dark"] .ark-frame {
  background: rgba(14, 24, 38, 0.92);
  border: 1px solid rgba(82, 140, 200, 0.28);
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.42);
}

[data-theme="dark"] .card {
  max-width: 120px;
}

[data-theme="dark"] .card-inner {
  box-shadow: 0 18px 32px rgba(0, 0, 0, 0.55);
}

[data-theme="dark"] .card-face--front {
  background: linear-gradient(145deg, rgba(23, 48, 80, 0.65), rgba(50, 86, 130, 0.45));
  border: 2px solid rgba(40, 70, 110, 0.4);
}

[data-theme="dark"] .card-face--back {
  background: linear-gradient(160deg, rgba(26, 48, 78, 0.95), rgba(46, 92, 136, 0.85));
  border: 2px solid rgba(90, 150, 210, 0.3);
}

[data-theme="dark"] .card.is-matched .card-face--back {
  background: linear-gradient(160deg, rgba(46, 92, 136, 0.95), rgba(70, 132, 180, 0.85));
  border-color: rgba(120, 180, 240, 0.35);
}

[data-theme="dark"] .fact-panel,
[data-theme="dark"] .tip-card,
[data-theme="dark"] .control-panel {
  background: rgba(16, 28, 46, 0.88);
  border-color: rgba(80, 130, 190, 0.28);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .action-row .accent {
  background: linear-gradient(145deg, rgba(80, 150, 220, 0.9), rgba(35, 100, 170, 0.9));
}

[data-theme="dark"] .action-row .secondary {
  background: rgba(16, 32, 50, 0.92);
  color: var(--highlight-light);
  border: 1px solid rgba(80, 130, 190, 0.3);
}

[data-theme="dark"] .tip-title {
  color: var(--highlight);
}

[data-theme="dark"] .tip-copy {
  color: var(--muted);
}

[data-theme="dark"] .app-footer {
  color: rgba(180, 208, 240, 0.8);
}
