/* Shared color themes. Artwork and the source game's light UI are not inverted. */
:root { color-scheme: light; }
.theme-toggle { display: inline-grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 10px; color: var(--ink); background: var(--surface-blue); border: 1px solid var(--frame); border-radius: 4px 14px 4px 14px; }
.theme-toggle svg { width: 22px; height: 22px; }
.theme-toggle:hover { border-color: var(--accent); background: var(--accent-soft); }
.theme-toggle:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.policy-page > .theme-toggle, .prerender > .theme-toggle { float: right; margin-left: 16px; }
.not-found > .theme-toggle { margin-bottom: 24px; }
.feed-site-header, .notice-header { flex-wrap: wrap; }
.feed-site-header .theme-toggle, .notice-header .theme-toggle { margin-left: auto; }
@media (max-width: 600px) {
  .header-inner { gap: 8px; }
  .header-actions { gap: 5px; }
  .header-actions .button > span:last-child { display: none; }
  .feed-site-header .feed-back { order: 2; width: 100%; }
  .notice-header > .text-button { order: 2; width: 100%; }
}
@media (max-width: 380px) {
  .site-header .brand-lockup { gap: 5px; }
  .site-header .brand-lockup .brand-wordmark { width: 70px; }
  .site-header .brand-lockup .brand-symbol { width: 20px; }
  .header-actions .button { padding-inline: 8px; }
  .header-actions .menu-toggle { width: 40px; min-width: 40px; }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0b1426;
  --ink: #eaf3ff;
  --muted: #b1c3dc;
  --accent: #91caff;
  --accent-bright: #65afff;
  --accent-soft: #284c76;
  --action: #1c59c7;
  --action-hover: #154cae;
  --line: #365170;
  --surface-blue: #142843;
  --frame: #658bbb;
  --control-edge: #658bbb;
  --night: #070f20;
  --sun: #dfff7e;
  --ice: #12243f;
  --sky: #3a70b4;
  --cobalt: #143e8a;
  background: var(--paper);
  color: var(--ink);
}
html[data-theme="dark"] body { background: var(--paper); color: var(--ink); }
html[data-theme="dark"] :focus-visible { outline-color: #dfff7e; }
html[data-theme="dark"] ::selection { background: #c4e1ff; color: #102b57; }
html[data-theme="dark"] .hero-brand { mix-blend-mode: normal; }
/* The vector logo (docs/81) is transparent, so the header lockup sits on the dark header without a light badge. */
html[data-theme="dark"] .hero-hook { background: #91caff; color: #102b57; }
html[data-theme="dark"] .site-header { border-bottom-color: var(--line); }
html[data-theme="dark"] .layout-review, html[data-theme="dark"] .character-intro,
html[data-theme="dark"] .world-copy, html[data-theme="dark"] .register .section-description,
html[data-theme="dark"] .register-rewards p, html[data-theme="dark"] .register-rewards .reward-item,
html[data-theme="dark"] .voice-disclosure, html[data-theme="dark"] .voice-transcript-pending,
html[data-theme="dark"] .voice-soon, html[data-theme="dark"] .voice-time,
html[data-theme="dark"] .locale-switch a, html[data-theme="dark"] .info-updated { color: var(--muted); }
html[data-theme="dark"] .button { border-color: var(--frame); }
html[data-theme="dark"] .button.primary { color: #fff; box-shadow: 4px 4px 0 #030b19; }
html[data-theme="dark"] .button.primary:hover { box-shadow: 6px 6px 0 #030b19; }
html[data-theme="dark"] .button.secondary { color: var(--ink); background: var(--surface-blue); }
html[data-theme="dark"] .button.secondary:hover { background: #244767; color: #fff; }
html[data-theme="dark"] .button.ink { color: #fff; background: #153862; }
html[data-theme="dark"] .button.ink:hover { background: #24538b; }
html[data-theme="dark"] .skip-link { background: #dfff7e; color: #102b57; }
html[data-theme="dark"] .header-actions .button,
html[data-theme="dark"] .world-lead,
html[data-theme="dark"] .release-status,
html[data-theme="dark"] .character-tabs [aria-selected="true"],
html[data-theme="dark"] .character-tabs [aria-selected="true"] .cast-slot,
html[data-theme="dark"] .character-controls button,
html[data-theme="dark"] .scene-tabs button[aria-selected="true"],
html[data-theme="dark"] .scene-tabs [aria-selected="true"] :is(small, .step-number, .step-arrow),
html[data-theme="dark"] .site-footer .locale-switch [aria-current],
html[data-theme="dark"] .office-floor,
html[data-theme="dark"] .office-pin[aria-pressed="true"],
html[data-theme="dark"] .office-motion[aria-pressed="true"] { background: #dfff7e; color: #102b57; border-color: #dfff7e; }
html[data-theme="dark"] .character-tabs [aria-selected="true"]::after { border-left-color: #102b57; }
html[data-theme="dark"] .character-controls button:hover { background: #c4e9ff; }
html[data-theme="dark"] .release-notice.wrap, html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .world-logo, html[data-theme="dark"] .world-scene-bar,
html[data-theme="dark"] .character-index > span:last-child,
html[data-theme="dark"] .loop .screen-caption,
html[data-theme="dark"] .register-rewards li > span,
html[data-theme="dark"] .media-badge { background: #0d2850; color: #eaf3ff; }
html[data-theme="dark"] .hook-item:nth-child(2), html[data-theme="dark"] .world-intro::before { background: #193657; }
html[data-theme="dark"] .hook-item::before { color: #96bce9; }
html[data-theme="dark"] .hook-item .text-button > span { background: #193657; color: #c4e1ff; }
html[data-theme="dark"] .hook-item .text-button:hover > span { background: #244f80; color: #fff; }
html[data-theme="dark"] .characters { color: #eaf3ff; }
html[data-theme="dark"] .characters::before { background: #091b37; }
html[data-theme="dark"] .character-panel { border-color: #577da9; }
html[data-theme="dark"] .character-info { background: linear-gradient(135deg, transparent 75%, #254469 75%) right top / 110px 110px no-repeat, var(--paper); }
html[data-theme="dark"] .character-info .character-traits li { background: #193657; color: #eaf3ff; border-color: #658bbb; }
html[data-theme="dark"] .character-info .character-traits li:first-child { color: #102b57; background: var(--character-accent, #c4e1ff); }
html[data-theme="dark"] .character-info .character-traits li:first-child::before { background: #0955d5; }
html[data-theme="dark"] .character-media .voice-button { background: #1c59c7; color: #fff; border-color: #88b5ed; }
html[data-theme="dark"] .character-media .voice-button:hover { background: #154cae; }
html[data-theme="dark"] .character-media .voice-button[aria-pressed="true"] { background: #154cae; }
html[data-theme="dark"] .inline-voice-error { color: #ffadbb; }
html[data-theme="dark"] .character-x { background: #193e6b; color: #fff; border-color: #658bbb; }
html[data-theme="dark"] .character-x:hover { background: #255389; }
html[data-theme="dark"] .voice-languages { background: var(--paper); box-shadow: 4px 4px 0 #030b19; border-color: var(--frame); }
html[data-theme="dark"] .voice-languages button:hover { background: #294f7d; color: #fff; }
html[data-theme="dark"] .voice-languages button[aria-pressed="true"] { color: #fff; background: #1c59c7; }
html[data-theme="dark"] .voice-play { background: #1c59c7; color: #fff; }
html[data-theme="dark"] .voice-row[data-voice-state="playing"] .voice-play { background: #91caff; color: #102b57; }
html[data-theme="dark"] .voice-progress { background: #365170; }
html[data-theme="dark"] .voice-progress i { background: #91caff; }
html[data-theme="dark"] .moment { background: #123267; color: #fff; }
html[data-theme="dark"] .moment-grid[data-scene="schedule"] .moment-preview { background: #162c4f; border-color: #577da9; }
html[data-theme="dark"] .moment .autoplay [data-auto-state] { color: #102b57; }
html[data-theme="dark"] .play, html[data-theme="dark"] .register { background: #112642; }
html[data-theme="dark"] .register::before { background: #1e416d; }
html[data-theme="dark"] .registration-count { background: var(--paper); }
html[data-theme="dark"] .inline-form { box-shadow: 10px 10px 0 #060f22; border-color: #658bbb; border-top-color: #65afff; }
html[data-theme="dark"] input[type="email"], html[data-theme="dark"] textarea { background: var(--paper); color: var(--ink); border-color: var(--frame); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: #a5b9d4; opacity: 1; }
html[data-theme="dark"] .field-error, html[data-theme="dark"] .voice-error { color: #ffadbb; }
html[data-theme="dark"] input[aria-invalid="true"] { border-color: #ffadbb; }
html[data-theme="dark"] .media-error { background: #3b2332; color: #ffd5dc; }
html[data-theme="dark"] .dialog { color: var(--ink); background: var(--paper); border-color: var(--frame); }
html[data-theme="dark"] .dialog-close { color: var(--ink); background: var(--surface-blue); border-color: var(--frame); }
html[data-theme="dark"] .media-card { background: var(--surface-blue); border-color: var(--frame); }
html[data-theme="dark"] .media-filters button[aria-pressed="true"] { background: #244f80; color: #fff; }
html[data-theme="dark"] .media-kind, html[data-theme="dark"] .media-language { color: var(--muted); }
html[data-theme="dark"] .info-status { background: #22436c; color: #d3e7ff; }
html[data-theme="dark"] .locale-switch [aria-current] { color: #eaf3ff; background: #244f80; }
html[data-theme="dark"] .mobile-cta { border-color: var(--line); }
html[data-theme="dark"] .session-time, html[data-theme="dark"] .loop .round-button { background: var(--paper); color: var(--accent); }
html[data-theme="dark"] .voice-name span,
html[data-theme="dark"] .community .section-description,
html[data-theme="dark"] .community .official-account p,
html[data-theme="dark"] .official-account > span,
html[data-theme="dark"] .account-state { color: var(--muted); }
html[data-theme="dark"] .loop-tabs { background: #193657; }
html[data-theme="dark"] .loop-tabs [role="tab"]:hover { background: #24476d; }
html[data-theme="dark"] .loop-tabs [role="tab"][aria-selected="true"],
html[data-theme="dark"] .loop-pager > span { background: #24476d; color: #fff; border-color: #658bbb; }
html[data-theme="dark"] .loop-tabs .loop-number { background: var(--paper); color: var(--accent); }
html[data-theme="dark"] .loop-tabs [aria-selected="true"] .loop-number { background: #dfff7e; color: #102b57; }
html[data-theme="dark"] .loop-copy > .eyebrow { background: #1c59c7; color: #fff; }
html[data-theme="dark"] .schedule-more, html[data-theme="dark"] .schedule-reference { background: var(--paper); }
html[data-theme="dark"] .schedule-items li { background: var(--surface-blue); }
html[data-theme="dark"] #schedule-demo { padding: 18px; background: #fcfcfc; border: 2px solid #658bbb; border-radius: 3px 18px 3px 18px; }
html[data-theme="dark"] .office-map-column { background: #132b48; }
html[data-theme="dark"] .office-map-footer, html[data-theme="dark"] .office-note,
html[data-theme="dark"] .office-motion, html[data-theme="dark"] .office-pin,
html[data-theme="dark"] .office-bubble, html[data-theme="dark"] .office-destinations button,
html[data-theme="dark"] .diorama-action { color: var(--ink); background: var(--surface-blue); border-color: var(--frame); }
html[data-theme="dark"] .office-destinations button[aria-pressed="true"],
html[data-theme="dark"] .office-destinations button:hover { background: #24476d; border-color: #91caff; }
html[data-theme="dark"] .office-pin:hover { background: #24476d; color: #fff; }
html[data-theme="dark"] .office-pin[aria-pressed="true"],
html[data-theme="dark"] .office-motion[aria-pressed="true"] { color: #102b57; background: #dfff7e; }
/* The embedded game previews keep their local light tokens. */
html[data-theme="dark"] :is(.phone, .schedule-demo, #moment-schedule-guide) { color-scheme: light; color: #253646; }
html[data-theme="dark"] :is(.phone, .schedule-demo, #moment-schedule-guide) :focus-visible { outline-color: #075caa; }
/* Connected feed and policy pages use the same saved theme. */
html[data-theme="dark"] .feed-page { background: var(--paper); }
html[data-theme="dark"] .feed-page :is(.feed-site-header, .feed-column, .feed-card, .feed-top-filter, .feed-save-filter, .feed-character-strip button, .feed-compose-prompt, .feed-result-status, .feed-cast-panel, .feed-manager-note, .feed-fab) { background: var(--surface-blue); }
html[data-theme="dark"] .feed-page .feed-side-filters [aria-pressed="true"] { background: #24476d; color: var(--ink); }
html[data-theme="dark"] .feed-page .feed-filter { background: var(--paper); }
html[data-theme="dark"] .feed-page :is(.feed-post-text, .feed-quote > p:last-child) { color: var(--ink); }
html[data-theme="dark"] .feed-page .feed-character-strip [aria-pressed="true"] { background: #24476d; }
html[data-theme="dark"] .feed-page .feed-dock { --accent: #075caa; --ink: #253646; color-scheme: light; }
html[data-theme="dark"] #feed-compose-error { color: #ffadbb; }
html[data-theme="dark"] .notice-section > .notice-next,
html[data-theme="dark"] .legal-quote { background: var(--surface-blue); }
@media (max-width: 380px) {
  html[data-theme="dark"] .header-inner { width: calc(100% - 24px); gap: 4px; }
}