/* One preference for the whole website. App screenshots retain their own palette. */
.theme-switch { display: inline-flex; align-items: center; flex-shrink: 0; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 28px; background: var(--surface); }
.theme-choice { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 39px; min-height: 38px; padding: 8px 11px; border: 0; border-radius: 24px; background: transparent; color: var(--sage); font-size: 11px; line-height: 1.4; }
.theme-choice svg { display: block; width: 17px; height: 17px; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.theme-choice[aria-pressed="true"] { background: #426653; color: #faf7f2; }
.theme-choice:not([aria-pressed="true"]):hover { background: var(--sage-soft); }
.theme-choice:focus-visible { outline: 2px solid var(--peach); outline-offset: 3px; }
.header-actions { gap: 14px; }
.mobile-language { display: none; }
.privacy-header-links { gap: 22px; }

html[data-theme="night"] {
  color-scheme: dark;
  --bg: #14251e;
  --paper: #14251e;
  --surface: #20382c;
  --raised: #294534;
  --text: #f5f0e8;
  --cream: var(--text);
  --muted: #c2cebe;
  --quiet: #abbea8;
  --sage: #bfd2b7;
  --sage-soft: #2c4836;
  --peach: #edb89a;
  --apricot: #edb89a;
  --line: #48634b;
  --ink: #182a20;
  --on-green: #182a20;
  background: var(--bg);
}
html[data-theme="night"] ::selection { color: #182a20; background: #edb89a; }
html[data-theme="night"] .site-header { background: #14251ef2; border-color: #48634b; }
html[data-theme="night"] .site-header.is-scrolled { background: #14251ef7; box-shadow: 0 5px 24px #06100a33; }
html[data-theme="night"] .desktop-nav a[aria-current="location"] { color: #f5f0e8; }
html[data-theme="night"] .desktop-nav a[aria-current="location"]::before { background: #edb89a; }
html[data-theme="night"] .mobile-menu a[aria-current="location"] { color: #edb89a; }
html[data-theme="night"] .mobile-menu a[aria-current="location"]::after { background: #edb89a; }
html[data-theme="night"] .reading-progress span { background: linear-gradient(90deg, #bfd2b7 60%, #edb89a); }
html[data-theme="night"] .language-switch span { color: #abbea8; }
html[data-theme="night"] .theme-choice[aria-pressed="true"] { background: #bfd2b7; color: #182a20; }
html[data-theme="night"] .button-outline { border-color: #819977; }
html[data-theme="night"] .button-outline:hover { background: #294534; border-color: #edb89a; }
html[data-theme="night"] .button-primary, html[data-theme="night"] .hero .store-button { --button-fill: #bfd2b7; color: #182a20; }
html[data-theme="night"] .button-primary:hover, html[data-theme="night"] .hero .store-button:hover { --button-fill: #d0dfc9; }
html[data-theme="night"] .hero .scene-note { background: #20382cee; border-color: #607b56; color: #c2cebe; box-shadow: 0 5px 14px #06120b1a; }
html[data-theme="night"] .sound-note { background: #20382c; border-color: #607b56; box-shadow: 0 10px 40px #06120b33; }
html[data-theme="night"] .sound-note-icon { background: #2c4836; color: #bfd2b7; }
html[data-theme="night"] .hero-bridge-ring { fill: #294534; stroke: #bfd2b7; }
html[data-theme="night"] .hero-sound-bridge path { stroke: #bfd2b7; }

html[data-theme="night"] .pairing-demo { --muted: #c2cebe; --quiet: #abbea8; background: radial-gradient(ellipse at 50% 27%, #edb89a0c, transparent 70%), #20382c; }
html[data-theme="night"] .pairing-phone { background: #294534; border-color: #819977; }
html[data-theme="night"] .pairing-phone-speaker { background: #bfd2b7; }
html[data-theme="night"] .pairing-next { background: #bfd2b7; color: #182a20; border-color: #bfd2b7; }
html[data-theme="night"] .pairing-next:hover { background: #d0dfc9; }
html[data-theme="night"] .pairing-next:active { background: #afc6a5; }
html[data-theme="night"] .pairing-demo[data-stage="paired"] .pairing-next { color: #bfd2b7; background: transparent; }
html[data-theme="night"] .pairing-demo[data-stage="paired"] .pairing-next:hover { background: #294534; }

html[data-theme="night"] .features-section { background: #1a3025; }
html[data-theme="night"] .features-copy .muted-heading { color: #bfd2b7; }
html[data-theme="night"] .feature-choice { background: #20382c; color: #f5f0e8; border-color: #48634b; }
html[data-theme="night"] .feature-choice-number { color: #bfd2b7; border-color: #819977; }
html[data-theme="night"] .feature-choice-copy > span { color: #c2cebe; }
html[data-theme="night"] .feature-choice-copy small, html[data-theme="night"] .feature-choice .feature-choice-arrow { color: #bfd2b7; }
html[data-theme="night"] .feature-choice:hover { background: #294534; border-color: #9bb28e; }
html[data-theme="night"] .feature-choice[aria-current="true"] { background: #294534; border-color: #bfd2b7; box-shadow: 0 5px 15px #07150e33; }
html[data-theme="night"] .feature-choice[aria-current="true"] .feature-choice-number { background: #bfd2b7; color: #182a20; border-color: #bfd2b7; }
html[data-theme="night"] .feature-choice:focus-visible { outline-color: #edb89a; }
html[data-theme="night"] .feature-device-note { color: #c2cebe; }
html[data-theme="night"] .feature-talk-note { color: #abbea8; }
html[data-theme="night"] .app-showcase { background: #20382c; border-color: #48634b; }
html[data-theme="night"] .showcase-heading { color: #bfd2b7; }
html[data-theme="night"] .showcase-heading > span:last-child { color: #abbea8; }
html[data-theme="night"] .showcase-heading b { color: #f5f0e8; }
html[data-theme="night"] .app-showcase .preview-tabs { background: #14251e; border-color: #48634b; }
html[data-theme="night"] .app-showcase .preview-tabs button { color: #c2cebe; }
html[data-theme="night"] .app-showcase .preview-tabs button[aria-selected="true"] { background: #bfd2b7; color: #182a20; }
html[data-theme="night"] .app-showcase.is-enhanced .preview-tabs::before { background: #bfd2b7; }
html[data-theme="night"] .app-showcase.is-enhanced .preview-tabs button[aria-selected="true"] { background: transparent; }
html[data-theme="night"] .app-showcase .preview-tabs button:not([aria-selected="true"]):hover { background: #294534; color: #f5f0e8; }
html[data-theme="night"] .screen-arch { background: #314d3b; border-color: #48634b; }
html[data-theme="night"] .app-showcase[data-screen="baby"] .screen-arch { background: #414a36; }
html[data-theme="night"] .app-showcase[data-screen="start"] .screen-arch { background: #294534; }
html[data-theme="night"] .screen-scenery svg { color: #bfd2b733; }
html[data-theme="night"] .app-showcase .screen-caption { color: #c2cebe; }
html[data-theme="night"] .app-showcase .screen-gallery-note { color: #abbea8; border-color: #48634b; }
html[data-theme="night"] .app-screen-link:hover { border-color: #edb89a; }
html[data-theme="night"] .screen-dialog { background: #20382c; color: #f5f0e8; border-color: #819977; }
html[data-theme="night"] .screen-dialog::backdrop { background: #07130be6; }
html[data-theme="night"] .screen-dialog-close { background: #294534; color: #f5f0e8; border-color: #819977; }

html[data-theme="night"] .mobile-download-bar { background: #20382c; border-color: #48634b; color: #f5f0e8; box-shadow: 0 -8px 24px #07150e33; }
html[data-theme="night"] .mobile-download-copy small { color: #c2cebe; }
html[data-theme="night"] .mobile-download-link { background: #bfd2b7; border-color: #bfd2b7; color: #182a20; }
html[data-theme="night"] .mobile-download-link:hover { background: #d0dfc9; border-color: #d0dfc9; }
html[data-theme="night"] .mobile-download-link:focus-visible { outline-color: #edb89a; }
html[data-theme="night"] .privacy-contact-icon { color: #182a20; }

/* Color-only transitions: layout, focus, tabs and image pixels stay in place. */
html.theme-changing :where(body,header,main,section,article,aside,nav,footer,button,a,p,h1,h2,h3,h4,strong,small,span,li,summary,details,div,svg,path,rect,circle,stop) {
  transition-property: background-color, color, border-color, box-shadow, fill, stroke, stop-color;
  transition-duration: .4s;
  transition-timing-function: ease;
}
html[data-motion="paused"] .hero-scene-room *, html[data-motion="paused"] .hero-scene-route * { transition: none !important; }
@media (max-width: 1300px) {
  .theme-choice > span { display: none; }
  .theme-choice { min-width: 36px; padding-inline: 9px; }
  .header-inner { gap: 18px; }
}
@media (min-width: 701px) and (max-width: 900px) {
  .desktop-nav { gap: 14px; }
  .header-actions { gap: 10px; }
  .header-inner { gap: 14px; }
}
@media (max-width: 700px) {
  .header-inner { gap: 10px; }
  .theme-enabled .header-actions > .language-switch { display: none; }
  .header-actions { gap: 7px; }
  .theme-switch { padding: 2px; gap: 0; }
  .theme-choice { min-width: 36px; min-height: 38px; padding: 8px; }
  .header-actions .menu-toggle { width: 40px; }
  .mobile-language { display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--line); padding-top: 10px; margin-top: 6px; }
  .mobile-language > span { margin-right: auto; font-size: 12px; color: var(--quiet); }
  .mobile-menu .mobile-language a { display: inline-flex; align-items: center; border: 0; padding: 8px; min-height: 44px; font-size: 13px; }
  .mobile-menu .mobile-language a[aria-current="page"] { color: var(--peach); text-decoration: underline; text-underline-offset: 5px; }
  .privacy-header-links { gap: 12px; }
}
@media (max-width: 440px) {
  .privacy-header-links .privacy-back { display: none; }
  .privacy-header-links { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html.theme-changing *, html.theme-changing *::before, html.theme-changing *::after { transition: none !important; }
}
