/* Night is the default palette; a chosen day mode is remembered. Artwork keeps its original colors. */
.theme-toggle{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--plum)}
body>header .nav{margin-left:auto}body>header>.theme-toggle{margin-left:0}
.theme-sun{display:none}.stars-toggle{display:none;min-height:44px;padding:8px 0;border:0;background:transparent;color:var(--muted);font-size:12px;text-decoration:underline;text-underline-offset:4px}
.night-sky{display:none;position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;contain:strict}
body>main,body>footer{position:relative;z-index:1}
html[data-theme=night]{color-scheme:dark;--cream:#24142f;--plum:#fff4df;--muted:#d2c3d8;--rust:#efc785;--line:#57405f;--sage:#32233f;--butter:#3b2946;--rose:#35213e;--surface:#2e1e39;--on-action:#2d1835;--action-hover:#f3d79f}
[data-theme=night] body>header{background:#24142ff2;border-color:var(--line)}
[data-theme=night] .theme-moon{display:none}[data-theme=night] .theme-sun{display:block}
[data-theme=night] .stars-toggle{display:inline-block}[data-theme=night] .night-sky{display:block}
[data-theme=night] .pill .download-apple,[data-theme=night] .soon .download-apple{filter:brightness(0)}
[data-theme=night] .pill.secondary{border-color:var(--line)}
[data-theme=night] .editorial-grid article{border-color:var(--line)}
[data-theme=night] .hero-art>img,[data-theme=night] .overview-steps img,[data-theme=night] .research-art{mix-blend-mode:normal}
[data-theme=night] .hero-art>img{box-shadow:0 0 80px #eac68a0c}
[data-theme=night] .turn-visual,[data-theme=night] .save-visual{mix-blend-mode:normal}
[data-theme=night] .research-art{border-radius:50%}
[data-theme=night] .sample-card,[data-theme=night] .sample-app-card{color:#35172f}
[data-theme=night] .app-preview-frame{--cream:#faf7ed;--plum:#35172f;--muted:#695962;--rust:#9e3d24;--sage:#e4e8dd;--butter:#f5efcf;--rose:#f1e2d8;color:#35172f}
.night-star{position:absolute;display:block;width:var(--star-size);height:var(--star-size);background:#f7dfa9;border-radius:50%;opacity:.35;animation:night-twinkle var(--twinkle) ease-in-out var(--delay) infinite}
@keyframes night-twinkle{0%,100%{opacity:.18;transform:scale(.8)}50%{opacity:.7;transform:scale(1.15)}}
/* Separate left and right lanes: the upward and downward trails never intersect. */
.shooting-star{position:absolute;display:block;width:70px;height:2px;border-radius:100%;background:linear-gradient(90deg,transparent,#ffe5b0);opacity:0;transform-origin:right center}
.shooting-up{left:6%;top:70%;animation:shoot-up 14s linear 2s infinite}
.shooting-down{left:70%;top:12%;animation:shoot-down 18s linear 8s infinite}
@keyframes shoot-up{0%,82%,100%{opacity:0;transform:translate(0,0) rotate(-55deg)}83%{opacity:.7}89%{opacity:0;transform:translate(15vw,-28vh) rotate(-55deg)}90%{opacity:0}}
@keyframes shoot-down{0%,84%,100%{opacity:0;transform:translate(0,0) rotate(65deg)}85%{opacity:.7}91%{opacity:0;transform:translate(12vw,28vh) rotate(65deg)}92%{opacity:0}}
.stars-paused .night-star,.stars-paused .shooting-star{animation-play-state:paused}.stars-paused .shooting-star{visibility:hidden}
@media(max-width:700px){body>header{gap:8px}body>header>.theme-toggle{margin-left:auto;order:2}body>header>.mobile-menu-toggle{order:3}.wordmark{margin-right:0}}
@media(max-width:374px){.wordmark{font-size:17px;letter-spacing:.4px}}
@media(prefers-reduced-motion:reduce){.night-star{animation:none;opacity:.35}.shooting-star{display:none}}

.header-clock{font:500 14px/1.2 var(--font-sans, -apple-system, BlinkMacSystemFont, sans-serif);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted);min-width:68px;text-align:right}
@media(max-width:700px){body>header>.header-clock{margin-left:auto;order:1;font-size:12px;min-width:58px}body>header>.theme-toggle{margin-left:0}.wordmark{gap:6px}}
@media(max-width:374px){body>header{gap:5px}.wordmark{font-size:15px;letter-spacing:0}.wordmark .brand-moon{width:24px;height:24px}}

/* Lamp transition: surroundings change; cards remain visually constant. */
.sample-card,.sample-app-card,.phone-question-card{
  --cream:#faf7ed;--plum:#35172f;--muted:#695962;--rust:#9e3d24;
  --sage:#e4e8dd;--butter:#f5efcf;--rose:#f1e2d8;
  color:#35172f;color-scheme:light;
}
html.theme-ready body,
html.theme-ready body>header,
html.theme-ready main>section,
html.theme-ready footer,
html.theme-ready #card-sample,
html.theme-ready .pill,
html.theme-ready .soon,
html.theme-ready .theme-toggle{
  transition:background-color 320ms ease-out,color 320ms ease-out,border-color 320ms ease-out;
}
.night-sky{display:block;opacity:0;transition:opacity 320ms ease-out}
[data-theme=night] .night-sky{opacity:1}
[data-theme=day] .night-sky *{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){
  html.theme-ready body,html.theme-ready body>header,html.theme-ready main>section,
  html.theme-ready footer,html.theme-ready #card-sample,html.theme-ready .pill,
  html.theme-ready .soon,html.theme-ready .theme-toggle,.night-sky{transition:none}
}