/* Page-wide palette switch. Scene artwork retains its own day/night control. */
html { color-scheme: dark; }
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex: none;
  min-height: 44px;
  padding: 10px 15px;
  border: 1px solid #718069;
  border-radius: 0;
  background: #202b24;
  color: #f5edd4;
  font-family: var(--display);
  font-size: 14px;
  line-height: 1.3;
  white-space: nowrap;
}
.theme-toggle:hover { border-color: #ffd56a; }
.theme-mode-icon { color: #ffd56a; font-size: 19px; line-height: 1; }

html[data-theme="day"] { color-scheme: light; --muted: #62695c; }
html[data-theme="day"] body { background: #faf9f3; color: #252a24; }
html[data-theme="day"] :is(button, a, input, select):focus-visible { outline-color: #16713b; }
html[data-theme="day"] .site-header { border-bottom-color: #b8bba6; }
html[data-theme="day"] .brand { color: #805416; }
html[data-theme="day"] .brand > span:first-child { color: #16713b; }
html[data-theme="day"] .site-header nav a { color: #4d5c44; }
html[data-theme="day"] .site-header nav a:hover { color: #16713b; }
html[data-theme="day"] .theme-toggle { background: #eae5d6; color: #252a24; border-color: #8d977b; }
html[data-theme="day"] .theme-toggle:hover { border-color: #16713b; }
html[data-theme="day"] .theme-mode-icon { color: #805416; }

html[data-theme="day"] .hero { background: #faf9f3; }
html[data-theme="day"] .hero-grain { opacity: .16; background-image: radial-gradient(#8a906a 1px, transparent 1px); }
html[data-theme="day"] .eyebrow { color: #79591e; }
html[data-theme="day"] .hero h1 { color: #252a24; }
html[data-theme="day"] .hero h1 span { color: #16713b; }
html[data-theme="day"] .hero-description { color: #5b6554; }
html[data-theme="day"] .quiet-link { color: #3d5938; }
html[data-theme="day"] .quiet-link:hover { color: #16713b; }
html[data-theme="day"] .development-note { color: #68705f; }
html[data-theme="day"] .hero-art-caption { color: #667259; }
html[data-theme="day"] .world-strip { background: #eae5d6; border-color: #b1b69d; }
html[data-theme="day"] .strip-inner { color: #46533d; }
html[data-theme="day"] .strip-inner b { color: #16713b; }
html[data-theme="day"] .strip-last { color: #5e6b51; }
html[data-theme="day"] .small-cross { color: #805416; }

html[data-theme="day"] .city-section { background: #eae5d6; border-top-color: #c8c3ae; }
html[data-theme="day"] :is(.city-heading, .people-heading) > p { color: #5d6853; }
html[data-theme="day"] .time-toggle { background: #faf9f3; color: #35482f; border-color: #8f9a7b; }
html[data-theme="day"] .time-icon { color: #805416; }
html[data-theme="day"] .toggle-track { background: #b6c0a5; }
html[data-theme="day"] .toggle-track > span { background: #16713b; }
html[data-theme="day"] .city-tabs { border-color: #849274; }
html[data-theme="day"] .city-tabs button { background: #faf9f3; color: #4c5d40; border-color: #b1b89f; }
html[data-theme="day"] .city-tabs button > span { color: #657652; }
html[data-theme="day"] .city-tabs button[aria-selected="true"] { background: #16713b; color: #f5edd4; box-shadow: inset 0 -4px #0b4328; }
html[data-theme="day"] .city-tabs button[aria-selected="true"] > span { color: #f5edd4; }
html[data-theme="day"] .city-scene-frame { border-color: #849274; }
html[data-theme="day"] .city-scene-overlay { color: #f5edd4; }
html[data-theme="day"] .city-scene-overlay .scene-kicker,
html[data-theme="day"] .city-scene-overlay .scene-index { color: #ffd56a; }
html[data-theme="day"] .city-locations button { color: #56664a; }
html[data-theme="day"] .city-locations button[aria-pressed="true"] { color: #0b6330; border-color: #16713b; }
html[data-theme="day"] .city-locations button:hover { color: #16713b; }
html[data-theme="day"] .city-footnote { color: #657257; }

html[data-theme="day"] .people-section { background: #faf9f3; border-top-color: #bfc5ad; }
html[data-theme="day"] .person { color: #252a24; }
html[data-theme="day"] .portrait-window { border-color: #9da98a; background: linear-gradient(0deg, #e0e6d5, transparent); }
html[data-theme="day"] .person-name { color: #3c5132; }
html[data-theme="day"] .person-role { color: #627157; }
html[data-theme="day"] .person[aria-pressed="true"] .portrait-window { border-color: #16713b; background: linear-gradient(0deg, #d7e2c8, transparent); }
html[data-theme="day"] .person[aria-pressed="true"] .person-name,
html[data-theme="day"] .person:hover .person-name { color: #16713b; }
html[data-theme="day"] .contact-detail { border-color: #b5bea3; }
html[data-theme="day"] .contact-detail strong { color: #16713b; }
html[data-theme="day"] .contact-detail p { color: #59664e; }

html[data-theme="day"] .retro-section { background: #eae5d6; color: #252a24; }
html[data-theme="day"] .retro-copy > p:not(.eyebrow),
html[data-theme="day"] .retro-principles p { color: #5b6751; }
html[data-theme="day"] .last-call { background: #e3e5d5; border-top-color: #b5bda4; }
html[data-theme="day"] .last-call h2 { color: #252a24; }
html[data-theme="day"] .release-note { color: #5c6a51; }
html[data-theme="day"] .site-footer p { color: #5d6b52; }
html[data-theme="day"] .site-footer > span { color: #627157; }

/* These components remain cream-on-green or cream-on-photography in both modes. */
html[data-theme="day"] .primary,
html[data-theme="day"] .dark-button { color: #fff4d9; }

@media (max-width: 850px) {
  .theme-toggle { font-size: 12px; gap: 10px; padding-inline: 12px; }
}
@media (max-width: 650px) {
  .theme-toggle { font-size: 10px; gap: 8px; padding: 9px 10px; min-height: 44px; }
  .theme-mode-icon { font-size: 16px; }
}
@media (max-width: 370px) {
  .theme-toggle { font-size: 9px; gap: 6px; padding-inline: 8px; }
  .theme-mode-icon { font-size: 14px; }
}