/* Keep the existing daylight palette and add a quiet celestial night palette. */
:root {
  --theme-bg: #ffffff;
  --theme-surface: #ffffff;
  --theme-surface-raised: #f5fbfd;
  --theme-text: #132238;
  --theme-muted: #5b6c7e;
  --theme-border: #dbeaf0;
  --theme-cyan: #007a9e;
  --theme-pink: #ba2f72;
  --theme-lavender: #777bd5;
}

.theme-toggle {
  display: grid;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--theme-border);
  border-radius: 50%;
  color: var(--theme-text);
  background: var(--theme-surface);
  cursor: pointer;
  transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease;
}
.theme-toggle:hover { color: var(--theme-cyan); border-color: var(--theme-cyan); background: var(--theme-surface-raised); }
.theme-toggle:focus-visible { outline: 3px solid var(--theme-cyan); outline-offset: 3px; }
.theme-toggle svg { display: block; width: 20px; height: 20px; }
.theme-toggle .theme-icon-sun { display: none; }
:root[data-theme="dark"] .theme-toggle .theme-icon-moon { display: none; }
:root[data-theme="dark"] .theme-toggle .theme-icon-sun { display: block; }
.mobile-nav .mobile-social-link { display: none; }
.mobile-nav {
  max-height: calc(100dvh - var(--header) - 14px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: #081923;
  --theme-surface: #0d2a35;
  --theme-surface-raised: #123d4b;
  --theme-text: #e2f4f7;
  --theme-muted: #a4c4ce;
  --theme-border: #285568;
  --theme-cyan: #63dbef;
  --theme-pink: #f2a5d2;
  --theme-lavender: #bcb7ff;
  --night: var(--theme-bg);
  --night-deep: var(--theme-bg);
  --night-raised: var(--theme-surface-raised);
  --panel: var(--theme-surface);
  --panel-solid: var(--theme-surface);
  --panel-light: var(--theme-surface-raised);
  --ink: var(--theme-text);
  --ice: var(--theme-cyan);
  --muted: var(--theme-muted);
  --muted-bright: #c2dfe7;
  --cyan: var(--theme-cyan);
  --cyan-deep: var(--theme-cyan);
  --pink: var(--theme-pink);
  --pink-hot: var(--theme-pink);
  --violet: var(--theme-lavender);
  --gold: #efd09a;
  --line: var(--theme-border);
  --line-bright: #397a8c;
}

:root[data-theme="dark"] body {
  color: var(--theme-text);
  background:
    radial-gradient(ellipse at 15% 10%, rgba(35, 181, 211, .1), transparent 35rem),
    radial-gradient(ellipse at 85% 42%, rgba(181, 131, 218, .045), transparent 40rem),
    var(--theme-bg);
}
:root[data-theme="dark"] body::before { opacity: .12; }
:root[data-theme="dark"] ::selection { color: #0b1220; background: var(--theme-cyan); }
:root[data-theme="dark"] :focus-visible { outline-color: var(--theme-cyan); }
:root[data-theme="dark"] code { border-color: var(--theme-border); color: var(--theme-cyan); background: #103745; }
:root[data-theme="dark"] :is(.kicker, .eyebrow) { color: var(--theme-cyan); }
:root[data-theme="dark"] :is(.section-heading h2 em, .world-copy h2 em, .final-cta h2 em, .page-hero h1 em) { color: var(--theme-cyan); }

/* Shared navigation, calls to action, and footer. */
:root[data-theme="dark"] .site-header {
  border-color: var(--theme-border);
  background: rgba(8, 25, 35, .96);
  box-shadow: 0 4px 24px rgba(0, 0, 0, .2);
}
:root[data-theme="dark"] :is(.brand-word, .nav a, .mobile-nav a) { color: var(--theme-text); }
:root[data-theme="dark"] .brand-suffix { color: var(--theme-muted); }
:root[data-theme="dark"] .brand-mark {
  border-color: #3e607a;
  background: radial-gradient(circle at 30% 20%, #223e50, var(--theme-surface));
  box-shadow: inset 0 0 14px rgba(121, 221, 235, .04);
}
:root[data-theme="dark"] :is(.nav a:hover, .nav a.is-active) { color: var(--theme-cyan); }
:root[data-theme="dark"] :is(.nav a.is-active::before, .site-header::after) { background: linear-gradient(90deg, var(--theme-cyan) 0 74%, var(--theme-pink) 74%); }
:root[data-theme="dark"] .social-link { border-color: var(--theme-border); background: var(--theme-surface); }
:root[data-theme="dark"] .social-link-instagram { color: var(--theme-pink); }
:root[data-theme="dark"] .social-link-youtube { color: #ff9fab; }
:root[data-theme="dark"] .social-link:hover { border-color: currentColor; background: var(--theme-surface-raised); }
:root[data-theme="dark"] .nav-toggle { border-color: var(--theme-border); background: var(--theme-surface); }
:root[data-theme="dark"] .nav-toggle span { background: var(--theme-text); }
:root[data-theme="dark"] .mobile-nav { border-color: var(--theme-border); background: var(--theme-surface); box-shadow: 0 16px 38px rgba(0, 0, 0, .35); }
:root[data-theme="dark"] :is(.mobile-nav a:hover, .mobile-nav a.is-active) { color: var(--theme-cyan); background: var(--theme-surface-raised); }
:root[data-theme="dark"] .mobile-nav .mobile-invite { color: var(--theme-text); border-color: #3e607a; background: var(--theme-surface-raised); }

:root[data-theme="dark"] :is(.header-cta, .invite-button, .invite-button-secondary) {
  color: var(--theme-text);
  border-color: transparent;
  background:
    linear-gradient(135deg, #164859, #10333f) padding-box,
    linear-gradient(110deg, #79ddeb 12%, #80a7d9 60%, #f2a5d2 100%) border-box;
  box-shadow: 0 7px 24px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .05);
}
:root[data-theme="dark"] :is(.header-cta:hover, .invite-button:hover) {
  color: #ffffff;
  background:
    linear-gradient(135deg, #1c596a, #164454) padding-box,
    linear-gradient(110deg, #9ce8f2 12%, #a3b9ee 60%, #f6bedf 100%) border-box;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .28), 0 0 24px rgba(121, 221, 235, .06);
}
:root[data-theme="dark"] .invite-button::before { background: linear-gradient(115deg, rgba(255, 255, 255, .05), transparent 44%); }
:root[data-theme="dark"] .secondary-button { border-color: var(--theme-cyan); color: #0b1220; background: var(--theme-cyan); }
:root[data-theme="dark"] .secondary-button:hover { border-color: #b0edf5; color: #0b1220; background: #b0edf5; }
:root[data-theme="dark"] :is(.secondary-link, .scroll-cue) { color: var(--theme-muted); }
:root[data-theme="dark"] .secondary-link:hover { color: var(--theme-cyan); }
:root[data-theme="dark"] .scroll-cue span { background: var(--theme-border); }

/* The daylight cyan footer becomes deep cyan, with a lighter teal community card. */
:root[data-theme="dark"] .site-footer { color: var(--theme-text); border-top: 1px solid #28778b; background: #08465a; }
:root[data-theme="dark"] :is(.site-footer .brand-word, .footer-links a, .footer-inner > div:first-child > p, .footer-meta) { color: var(--theme-text); }
:root[data-theme="dark"] .footer-links a:hover { color: var(--theme-cyan); }
:root[data-theme="dark"] :is(.footer-signoff, .footer-meta, .footer-topgg-note) { color: #c1dfe7; }
:root[data-theme="dark"] .footer-meta { border-color: #2d7486; }
:root[data-theme="dark"] .footer-topgg { border-color: #367f91; background: #10576a; }
:root[data-theme="dark"] .footer-topgg-title { color: var(--theme-text); }
:root[data-theme="dark"] .footer-topgg-note strong { color: #8de9f5; }
:root[data-theme="dark"] .footer-topgg-link { border-color: #55b5c9; color: var(--theme-text); background: #0b3544; }
:root[data-theme="dark"] .footer-topgg-link:hover { border-color: var(--theme-cyan); background: #124759; }
:root[data-theme="dark"] .error-view > span { color: var(--theme-cyan); }

/* The artwork stays intact; the surrounding panels carry the night palette. */
:root[data-theme="dark"] :is(.glass-panel, .loop-card, .demo-card, .roadmap-grid article, .patch-edit-note) {
  border-color: var(--theme-border);
  color: var(--theme-text);
  background: var(--theme-surface);
  box-shadow: 0 14px 36px rgba(0, 0, 0, .16);
}
:root[data-theme="dark"] .home-hero { background: var(--theme-bg); }
:root[data-theme="dark"] .hero-banner-shell { border-color: var(--theme-border); box-shadow: 0 18px 50px rgba(0, 0, 0, .3); }
:root[data-theme="dark"] .hero-conversion { --hero-copy-accent: var(--theme-text); }
:root[data-theme="dark"] .hero-copy-panel {
  border-color: rgba(99, 219, 239, .4);
  background: linear-gradient(135deg, rgba(8, 30, 41, .97), rgba(15, 54, 68, .95));
  box-shadow: 0 12px 32px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .04);
}
:root[data-theme="dark"] :is(.hero-conversion .eyebrow, .hero-conversion h1, .hero-promise) { text-shadow: none; }
:root[data-theme="dark"] .hero-conversion .eyebrow { color: var(--theme-cyan); }
:root[data-theme="dark"] .hero-conversion h1 em { color: var(--theme-pink); }
:root[data-theme="dark"] :is(.hero-loop, .hero-start) { color: var(--theme-text) !important; }
:root[data-theme="dark"] :is(.hero-loop span, .hero-start) {
  border-color: #397a8c;
  background: rgba(13, 42, 53, .95);
  box-shadow: 0 5px 16px rgba(0, 0, 0, .14);
}
:root[data-theme="dark"] .hero-loop i { color: var(--theme-pink); }
:root[data-theme="dark"] :is(.hero-mantra, .hero-description) { color: var(--theme-muted) !important; }
:root[data-theme="dark"] .hero-how-link {
  padding: 6px 10px;
  border-radius: 8px;
  color: var(--theme-cyan);
  background: rgba(8, 25, 35, .94);
}
:root[data-theme="dark"] .signal-strip { border-color: var(--theme-border); }
:root[data-theme="dark"] .signal-strip strong { color: var(--theme-cyan); }
:root[data-theme="dark"] :is(.signal-strip span, .loop-card > span) { color: var(--theme-muted); }
:root[data-theme="dark"] :is(.loop-card h3, .demo-copy h3) { color: var(--theme-text); }
:root[data-theme="dark"] .loop-card:hover { border-color: #507b93; box-shadow: 0 22px 56px rgba(0, 0, 0, .2); }
:root[data-theme="dark"] .loop-card > i { background: rgba(121, 221, 235, .06); }
:root[data-theme="dark"] .loop-card:nth-child(even) > i { background: rgba(242, 165, 210, .06); }
:root[data-theme="dark"] .world-visual { border-color: var(--theme-border); background: var(--theme-surface); box-shadow: 0 30px 85px rgba(0, 0, 0, .25); }
:root[data-theme="dark"] .world-visual::after { background: linear-gradient(0deg, rgba(11, 18, 32, .92), transparent 55%); }
:root[data-theme="dark"] .world-badge { border-color: #3e607a; color: var(--theme-text); background: rgba(17, 30, 49, .9); box-shadow: 0 15px 45px rgba(0, 0, 0, .2); }
:root[data-theme="dark"] .final-cta {
  border-color: var(--theme-border);
  background: radial-gradient(circle at 50% 45%, rgba(99, 219, 239, .12), transparent 45%), var(--theme-surface);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .2);
}
:root[data-theme="dark"] .final-cta > p:not(.kicker) { color: var(--theme-muted); }

/* Shared interior pages and the complete command finder. */
:root[data-theme="dark"] :is(.page-hero, .leaderboard-hero, .patch-hero) {
  border-color: var(--theme-border);
  background: radial-gradient(ellipse at 80% 0, rgba(121, 221, 235, .06), transparent 40rem), var(--theme-surface);
}
:root[data-theme="dark"] .page-hero-inner > p:not(.kicker) { color: var(--theme-muted); }
:root[data-theme="dark"] :is(.command-search, .command-search-popover, .docs-replay-card, .command-list, .no-search-results) {
  border-color: var(--theme-border);
  color: var(--theme-text);
  background: var(--theme-surface);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .14);
}
:root[data-theme="dark"] .command-search input { color: var(--theme-text); }
:root[data-theme="dark"] .command-search input::placeholder { color: var(--theme-muted); }
:root[data-theme="dark"] .command-search kbd { color: var(--theme-muted); background: var(--theme-surface-raised); }
:root[data-theme="dark"] .search-result { color: var(--theme-muted) !important; }
:root[data-theme="dark"] .category-rail { border-color: var(--theme-border); background: rgba(8, 25, 35, .97); }
:root[data-theme="dark"] .category-rail a { color: var(--theme-muted); }
:root[data-theme="dark"] .category-rail a:hover { color: var(--theme-text); background: var(--theme-surface-raised); }
:root[data-theme="dark"] .docs-demo-media { border-color: var(--theme-border); box-shadow: 0 12px 30px rgba(0, 0, 0, .2); }
:root[data-theme="dark"] .docs-replay-card .docs-demo-media { border-color: var(--theme-border); }
:root[data-theme="dark"] :is(.docs-replay-card p, .category-heading p, .command-summary-copy small, .summary-plus, .command-details > div > span) { color: var(--theme-muted); }
:root[data-theme="dark"] .command-card { border-color: var(--theme-border); }
:root[data-theme="dark"] .command-card summary:hover { background: var(--theme-surface-raised); }
:root[data-theme="dark"] .command-card[open] summary { background: var(--theme-surface-raised); }
:root[data-theme="dark"] .command-card summary > code { border-color: #397a8c; color: var(--theme-cyan); background: #103745; }
:root[data-theme="dark"] .command-summary-copy strong { color: #c2dfe7; }
:root[data-theme="dark"] .command-details { border-color: var(--theme-border); background: #0a202c; }
:root[data-theme="dark"] .category-icon { border-color: #397a8c; color: var(--theme-cyan); background: #103745; }
:root[data-theme="dark"] .command-mode { border-color: #624361; color: var(--theme-pink); }
:root[data-theme="dark"] .command-search-popover-head {
  border-color: var(--theme-border);
  color: var(--theme-muted);
  background: linear-gradient(90deg, #123d4b, #1c3044);
}
:root[data-theme="dark"] .command-search-popover-head strong { color: var(--theme-text); }
:root[data-theme="dark"] .command-search-option + .command-search-option { border-top-color: var(--theme-border); }
:root[data-theme="dark"] :is(.command-search-option:hover, .command-search-option[aria-selected="true"]) {
  border-color: #3e607a;
  background: linear-gradient(90deg, #124452, #263046);
  box-shadow: inset 4px 0 var(--theme-cyan);
}
:root[data-theme="dark"] .command-search-option code { border-color: #3e607a; color: var(--theme-cyan); background: #152f41; }
:root[data-theme="dark"] :is(.command-search-option-copy strong, .command-search-empty strong) { color: var(--theme-text); }
:root[data-theme="dark"] :is(.command-search-option-copy small, .command-search-empty span) { color: var(--theme-muted); }
:root[data-theme="dark"] .command-search-option-category { border-color: #624361; color: var(--theme-pink); background: #302238; }
:root[data-theme="dark"] .command-card.is-search-target { outline-color: var(--theme-cyan); box-shadow: inset 6px 0 var(--theme-pink), 0 0 0 5px rgba(121, 221, 235, .1); }
:root[data-theme="dark"] .command-card.is-search-target summary { background: linear-gradient(90deg, #173044, #29263d) !important; }

/* Patch notes keep the same quiet release layout. */
:root[data-theme="dark"] .patch-minimal { color: var(--theme-text); background: var(--theme-bg); }
:root[data-theme="dark"] .patch-minimal p:last-child { color: var(--theme-muted); }
:root[data-theme="dark"] .patch-release-page {
  color: var(--theme-text);
  background:
    radial-gradient(circle at 86% 10%, rgba(188, 183, 255, .07), transparent 25rem),
    radial-gradient(circle at 8% 34%, rgba(121, 221, 235, .06), transparent 28rem),
    var(--theme-bg);
}
:root[data-theme="dark"] .patch-release-hero h1 em { color: var(--theme-pink); }
:root[data-theme="dark"] :is(.patch-release-hero > p:last-child, .patch-release time, .patch-release header p, .patch-release-body li, .patch-command-list > span) { color: var(--theme-muted); }
:root[data-theme="dark"] .patch-release { border-color: var(--theme-border); background: var(--theme-surface); box-shadow: 0 18px 42px rgba(0, 0, 0, .2); }
:root[data-theme="dark"] :is(.patch-release > header, .patch-release-body li, .release-content) { border-color: var(--theme-border); }
:root[data-theme="dark"] .patch-status { border-color: #624361; color: var(--theme-pink); background: #302238; }
:root[data-theme="dark"] :is(.patch-release-body li::before, .patch-highlight-value) { color: var(--theme-cyan); }
:root[data-theme="dark"] .patch-release-body li.patch-highlight-warning { border-color: #794454; color: #ffb0bd; background: #35212d; }
:root[data-theme="dark"] .patch-release-body li.patch-highlight-warning::before { color: #ffb0bd; }
:root[data-theme="dark"] .patch-release-body li.patch-highlight-fixed { border-color: #3d6959; color: #9de3bd; background: #142d28; }
:root[data-theme="dark"] .patch-release-body li.patch-highlight-fixed::before { color: #9de3bd; }
:root[data-theme="dark"] .patch-command-list a { border-color: var(--theme-border); color: var(--theme-pink); background: #15243a; }
:root[data-theme="dark"] .patch-command-list a:hover { border-color: var(--theme-cyan); background: var(--theme-surface-raised); }
:root[data-theme="dark"] .release-version strong { color: #415c79; }

/* Starter offer and the first-session / returning-player guide. */
:root[data-theme="dark"] .starter-offer {
  --offer-gold: #efd09a;
  border-color: #4c4f4e;
  color: var(--theme-text);
  background: radial-gradient(ellipse at 0 0, rgba(181, 142, 78, .12), transparent 57%), var(--theme-surface);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .16);
}
:root[data-theme="dark"] :is(.starter-offer-copy > p:not(.starter-offer-kicker), .starter-offer-price small, .starter-offer-rewards div > span, .starter-offer-ticket > p) { color: var(--theme-muted); }
:root[data-theme="dark"] .starter-offer-ticket { border-color: #655a44; background: #1b2330; box-shadow: 0 7px 18px rgba(0, 0, 0, .15); }
:root[data-theme="dark"] .starter-offer-ticket-top { border-color: #655a44; }
:root[data-theme="dark"] .starter-offer-cta { color: #0b1220; background: #b9dce8; }
:root[data-theme="dark"] .starter-offer-cta:hover { background: #d5edf5; }
:root[data-theme="dark"] :is(.play-path, .return-path, .play-questions) { color: var(--theme-text); }
:root[data-theme="dark"] .play-path-heading .kicker { color: var(--theme-cyan); }
:root[data-theme="dark"] :is(.play-path p, .return-path p, .play-questions p) { color: var(--theme-muted); }
:root[data-theme="dark"] :is(.play-path a, .return-path a, .play-questions a, .step-number, .about-later > summary) { color: var(--theme-cyan); }
:root[data-theme="dark"] .play-path-steps li { border-color: #3e607a; }
:root[data-theme="dark"] :is(.start-command, .return-options article) { border-color: var(--theme-border); background: var(--theme-surface); }
:root[data-theme="dark"] .start-command { border-color: #397a8c; background: var(--theme-surface-raised); }
:root[data-theme="dark"] .copy-start { color: #0b1220; border-color: var(--theme-cyan); background: var(--theme-cyan); }
:root[data-theme="dark"] .copy-start:hover { border-color: #b0edf5; background: #b0edf5; }
:root[data-theme="dark"] :is(.return-path, .play-questions details, .about-later) { border-color: var(--theme-border); }

/* Make room for the always-visible theme button before navigation gets tight. */
@media (max-width: 1280px) {
  .site-header { grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; }
  .site-header .nav { display: none; }
  .site-header .nav-toggle { position: relative; display: grid; }
  .header-actions { grid-column: 2; gap: 8px; }
  .header-cta { min-width: 110px; padding-inline: 12px; }
}

@media (max-width: 800px) {
  :root[data-theme="dark"] .hero-conversion { border-color: var(--theme-border); background: var(--theme-surface); }
  :root[data-theme="dark"] .hero-copy-panel { border: 0; background: transparent; box-shadow: none; }
  :root[data-theme="dark"] .hero-how-link { background: transparent; }
}

@media (max-width: 480px) {
  .header-actions > .social-links { display: none; }
  .mobile-nav .mobile-social-link { display: flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 4px; }
  .mobile-nav .mobile-invite + .mobile-social-link { margin-top: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}