html[data-theme="dark"] {
  color-scheme: dark;
  --d-bg: #0A1226;
  --d-surface: #121D3A;
  --d-surface-2: #1B2A52;
  --d-text: #FFF8E8;
  --d-muted: #D3DEF5;
  --d-edge: #FFE8A3;
  --d-yellow: #FFD23F;
  --d-gold: #D6A900;
  --d-pink: #FF6B9A;
  --d-blue: #4DA3FF;
  --d-ink: #16120E;
  background: var(--d-bg);
}

html[data-theme="dark"] {
  background-color: var(--d-bg);
  background-image:
    radial-gradient(circle at 8% 18%, rgba(77,163,255,.10), transparent 30rem),
    radial-gradient(circle at 92% 55%, rgba(77,163,255,.12), transparent 28rem),
    radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: auto, auto, 13px 13px;
  background-attachment: fixed, fixed, scroll;
}
html[data-theme="dark"] body {
  background: transparent;
  color: var(--d-text);
}

html[data-theme="dark"] body::before {
  background:
    repeating-conic-gradient(
      from -8deg at 50% 8vh,
      rgba(77, 163, 255, .13) 0 3.5deg,
      rgba(77, 163, 255, 0) 3.5deg 7deg);
}
html[data-theme="dark"] .hero {
  background: linear-gradient(180deg, rgba(77,163,255,.08), transparent 78%);
  border-bottom-color: rgba(255,232,163,.28);
}
html[data-theme="dark"] .hero::before,
html[data-theme="dark"] .hero::after { opacity: .18; }
html[data-theme="dark"] .clouds { opacity: .35; }

html[data-theme="dark"] .bar { background: #060C1E; border-bottom: 4px solid var(--d-yellow); }
html[data-theme="dark"] .bar__inner { background: transparent; }
html[data-theme="dark"] .bar__mark,
html[data-theme="dark"] .bar__mark span { color: var(--d-text) !important; }
html[data-theme="dark"] .foot { background: #060C1E !important; border-top: 4px solid var(--d-yellow); }
html[data-theme="dark"] .foot,
html[data-theme="dark"] .foot *,
html[data-theme="dark"] .foot .muted { color: var(--d-text) !important; }
html[data-theme="dark"] .intro { background-color: #060C1E; }
html[data-theme="dark"] .theme-toggle { background: var(--d-text); color: var(--d-ink); }

html[data-theme="dark"] :is(
  .card, .panel2, .nowcard, .project, .quote, .songbox, .lvl, .crew__card,
  .reasons article, .kgroup, .stats li, .showcase__side, .archive__card,
  .cgroup, .panel2--live, .pnote, .who.card, .chart, .thm
) {
  background-color: var(--d-surface) !important;
  border-color: var(--d-edge) !important;
  color: var(--d-text) !important;
}
html[data-theme="dark"] :is(.card, .project, .nowcard, .panel2, .quote, .songbox, .lvl,
  .badge, .kgroup, .crew__card, .reasons article) {
  box-shadow: 5px 5px 0 var(--d-edge) !important;
}
html[data-theme="dark"] .who.card { background-image: none !important; box-shadow: 8px 8px 0 #050A18, 14px 14px 0 #D9779A !important; }
html[data-theme="dark"] .chart { box-shadow: 8px 8px 0 #050A18, 14px 14px 0 var(--d-blue) !important; }
html[data-theme="dark"] .panel2:not(.panel2--live) { background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.04) 0 8px, transparent 8px 16px) !important; }
html[data-theme="dark"] .panel2--live { background-image: radial-gradient(rgba(255,210,63,.18) 1.2px, transparent 1.5px) !important; background-size: 9px 9px !important; }
html[data-theme="dark"] .badge {
  background: linear-gradient(145deg, #1C2B52, #16223F) !important;
  border-color: var(--d-edge) !important;
}
html[data-theme="dark"] .project:nth-child(n) { background-color: var(--d-surface) !important; }
html[data-theme="dark"] .project__art { background: #fff !important; }
html[data-theme="dark"] .tabs {
  background: rgba(18,29,58,.96) !important;
  border-color: var(--d-edge) !important;
  box-shadow: 5px 5px 0 var(--d-edge) !important;
}
html[data-theme="dark"] .meter,
html[data-theme="dark"] .nowcard__track,
html[data-theme="dark"] .archive__bar { background: #2C3E6B !important; }
html[data-theme="dark"] .meter i,
html[data-theme="dark"] .nowcard__fill,
html[data-theme="dark"] .archive__fill { background: var(--d-yellow) !important; }

html[data-theme="dark"] main :where(h1, h2, h3, h4, h5, p, li, dd, dt, small, span, strong, em, b,
  figcaption, blockquote, cite, label, td, th, summary, div, button) {
  color: var(--d-text) !important;
}
html[data-theme="dark"] main :where(.team__label--old) { color: #C5D3F0 !important; }
html[data-theme="dark"] main :where(.nowcard__num, .lost__q) { color: #FF8FB4 !important; }
html[data-theme="dark"] :where(a) { color: var(--d-yellow); }
html[data-theme="dark"] main a:not(.pill):not(.thm__link):not(.hero-action) { color: var(--d-yellow) !important; }
html[data-theme="dark"] .skip { color: var(--d-ink); }
html[data-theme="dark"] .hero__manifesto { color: var(--d-text); }

html[data-theme="dark"] :is(.pill, .chips li, .chip, .cchip, .who__facts li, .sec__title, .music__title, .quotes__label, .nowcard__icon, .lvl__orbit, .badge__img, .rows .row, .thm__rank, .thm__link, .lvl__items li, .song__cover, .who__status, .crew__av, .crew__role, .panel2__stamp, .archive__mark, .hero-action, .tabs button.is-active, .lightbox, .lightbox__close, .lightbox__nav, .project__status, .nowcard__chips li, .archive__tag),
html[data-theme="dark"] :is(.pill, .chips li, .chip, .cchip, .who__facts li, .sec__title, .music__title, .quotes__label, .nowcard__icon, .lvl__orbit, .badge__img, .rows .row, .thm__rank, .thm__link, .lvl__items li, .song__cover, .who__status, .crew__av, .crew__role, .panel2__stamp, .archive__mark, .hero-action, .tabs button.is-active, .lightbox, .lightbox__close, .lightbox__nav, .project__status, .nowcard__chips li, .archive__tag) * {
  color: var(--d-ink) !important;
}
html[data-theme="dark"] .who.card::before, html[data-theme="dark"] .zigzag::before { color: var(--d-ink) !important; }

html[data-theme="dark"] .pill,
html[data-theme="dark"] .links .pill:nth-child(odd) { background: var(--d-yellow) !important; }
html[data-theme="dark"] .links .pill:nth-child(even) { background: var(--d-blue) !important; }
html[data-theme="dark"] .pill--meme { background: var(--d-yellow) !important; }
html[data-theme="dark"] .pill { border-color: var(--d-edge) !important; box-shadow: 3px 3px 0 var(--d-edge); }
html[data-theme="dark"] :is(.chips li, .chip, .cchip, .nowcard__chips li, .archive__tag) { background-color: var(--d-yellow) !important; }
html[data-theme="dark"] .project__status { background-color: var(--d-yellow) !important; border-color: var(--d-ink) !important; }
html[data-theme="dark"] .sec__title { background: var(--d-gold) !important; border-color: var(--d-edge) !important; box-shadow: 5px 5px 0 var(--d-edge) !important; }
html[data-theme="dark"] :is(.music__title, .quotes__label) { background: var(--d-yellow) !important; }
html[data-theme="dark"] .who.card::before { background: var(--d-yellow); }
html[data-theme="dark"] .crew__role { background: var(--d-yellow); }
html[data-theme="dark"] .panel2:not(.panel2--live) .panel2__stamp { background: #D9D4C7; }
html[data-theme="dark"] .panel2--live .panel2__stamp { background: var(--d-pink); }
html[data-theme="dark"] .archive__mark { background: var(--d-yellow); }
html[data-theme="dark"] .thm__rank { background: var(--d-yellow); }
html[data-theme="dark"] .thm__rank:nth-child(2) { background: var(--d-blue) !important; }
html[data-theme="dark"] .thm__link { background: var(--d-pink) !important; }
html[data-theme="dark"] .hero-action--primary { background: #D9779A; border-color: var(--d-edge); box-shadow: 4px 4px 0 var(--d-edge); }
html[data-theme="dark"] .hero-action--secondary { background: #7DBBFF; border-color: var(--d-edge); box-shadow: 4px 4px 0 var(--d-edge); }
html[data-theme="dark"] .lightbox { background: #FFF1CC; border-color: var(--d-ink); }

html[data-theme="dark"] .tabs button:not(.is-active) {
  background: var(--d-surface-2) !important;
  border-color: var(--d-edge) !important;
  color: var(--d-text) !important;
}
html[data-theme="dark"] .tabs button.is-active { background: var(--d-gold) !important; }

html[data-theme="dark"] .shot--soon { background: var(--d-surface-2); border-color: var(--d-edge); box-shadow: 3px 3px 0 var(--d-pink); }
html[data-theme="dark"] .shot--soon,
html[data-theme="dark"] .shot--soon * { color: var(--d-text) !important; }

html[data-theme="dark"] .zigzag {
  background:
    linear-gradient(135deg, #FFE8A3 25%, transparent 25%) -8px 0/16px 16px repeat-x,
    linear-gradient(225deg, #FFE8A3 25%, transparent 25%) -8px 0/16px 16px repeat-x;
}
html[data-theme="dark"] .zigzag::before { background: #FFE8A3; box-shadow: 3px 3px 0 var(--d-pink); }
html[data-theme="dark"] .back-to-top { border-color: var(--d-edge); box-shadow: 4px 4px 0 var(--d-edge); }
html[data-theme="dark"] :where(.tabs button, .theme-toggle, .pill, a, .songs__row, .shot__btn, .bugwalk):focus-visible {
  outline-color: var(--d-yellow) !important;
  box-shadow: 4px 4px 0 var(--d-yellow);
}
html[data-theme="dark"] .songs__row { border-color: rgba(255,232,163,.25); }
html[data-theme="dark"] hr { border-color: rgba(255,232,163,.25); }
html[data-theme="dark"] .project img,
html[data-theme="dark"] .badge img { filter: none; }

html[data-theme="dark"] .who__status { background: #FFF8E8 !important; }
html[data-theme="dark"] .lvl__items li { background: var(--d-yellow) !important; }
html[data-theme="dark"] .archive__item { background: transparent !important; box-shadow: none !important; border-color: transparent !important; }
html[data-theme="dark"] .thm { box-shadow: 8px 8px 0 #050A18, 14px 14px 0 var(--d-blue) !important; }
html[data-theme="dark"] .issue__no { background: #050A18; border-color: var(--d-edge); }
html[data-theme="dark"] .zigzag::before { color: var(--d-ink) !important; }
html[data-theme="dark"] .kcourse__track { background: #2C3E6B !important; border-color: var(--d-edge) !important; }
html[data-theme="dark"] .kcourse__fill { border-right-color: var(--d-edge); }

html[data-theme="dark"] .thm__rank strong,
html[data-theme="dark"] .thm__rank strong * { color: var(--d-pink) !important; -webkit-text-fill-color: var(--d-pink); text-shadow: 2px 2px 0 #fff; }
html[data-theme="dark"] .thm__rank span { color: var(--d-ink) !important; }

html[data-theme="dark"] .panel2 .panel2__title,
html[data-theme="dark"] .panel2--live .panel2__title,
html[data-theme="dark"] .panel2:not(.panel2--live) .panel2__title { color: var(--d-text) !important; -webkit-text-fill-color: var(--d-text); }
html[data-theme="dark"] .panel2 .panel2__st,
html[data-theme="dark"] .panel2:not(.panel2--live) .panel2__st { color: var(--d-muted) !important; -webkit-text-fill-color: var(--d-muted); }
html[data-theme="dark"] .panel2 .panel2__stamp { color: var(--d-ink) !important; -webkit-text-fill-color: var(--d-ink); }
html[data-theme="dark"] .tabs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .tabs button:not(.is-active) {
  background: var(--d-surface) !important;
  border-color: var(--d-edge) !important;
  box-shadow: 3px 3px 0 #050A18 !important;
}
html[data-theme="dark"] .tabs button.is-active {
  background: var(--d-yellow) !important;
  border-color: var(--d-ink) !important;
  color: var(--d-ink) !important;
  box-shadow: 4px 4px 0 var(--d-pink) !important;
}
html[data-theme="dark"] .hero { background: none !important; border-bottom-color: transparent !important; }