:root:not([data-theme="dark"]){color-scheme:light;--bg:#f7f4ed;--sidebar:#eeeae1;--surface:#fffdf8;--surface2:#eae6dd;--line:#263c3024;--text:#262c28;--muted:#626b60;--gold:#876337;--green:#345c46}
html:not([data-theme="dark"]) body{background:var(--bg);color:var(--text)}
html:not([data-theme="dark"]) .landing-page{background:var(--bg)}
html:not([data-theme="dark"]) :is(.landing-header nav,.landing-tagline,.landing-description,.install-reassurance,.landing-divider,.archive-note,.landing-live p,.landing-footer p,.footer-bottom p,.book-preview-footer,.launch-announcement .launch-date,.visual-folio,.feature-number,.landing-install>p){color:var(--muted)}
html:not([data-theme="dark"]) :is(.header-open,.experience-grid article,.footer-bottom,.book-preview-footer .footer-bottom,.mobile-menu,.launch-announcement){border-color:var(--line)}
html:not([data-theme="dark"]) :is(.landing-book>div,.landing-book:nth-child(n)>div){background:#e9e6dc;border-color:var(--line)}
html:not([data-theme="dark"]) .landing-live{background:linear-gradient(115deg,#f0eee3,#e2e9df);border-color:var(--line)}
html:not([data-theme="dark"]) .visual-note{background:#fffdf5ed;color:var(--text);border-color:var(--line);box-shadow:0 12px 30px #263c3015}
html:not([data-theme="dark"]) :is(.landing-install,.phone){background:#e7e9df;color:var(--text);border-color:#52605655}
html:not([data-theme="dark"]) .phone{box-shadow:-20px 28px 55px #263c3025,inset 0 0 0 6px #fdfbf5}
html:not([data-theme="dark"]) .phone:before{background:#fdfbf5}
html:not([data-theme="dark"]) :is(.phone-label,.phone>p,.phone>small){color:var(--muted)}
html:not([data-theme="dark"]) :is(.primary,.play-button){background:#345c46;color:#fffdf8}
html:not([data-theme="dark"]) :is(.secondary,.header-open,.account-button){border-color:#345c4640}
html:not([data-theme="dark"]) :is(.footer-credit a,.book-preview-footer a){color:var(--gold)}
html:not([data-theme="dark"]) img[src*="bird-branch-v50.svg"]{filter:brightness(0)}
html:not([data-theme="dark"]) :is(.topbar,.player,.bottom-nav,dialog,.startup-splash){background:var(--surface);color:var(--text);border-color:var(--line)}
html:not([data-theme="dark"]) :is(input,textarea,select){background:var(--surface);color:var(--text);border-color:var(--line)}
html:not([data-theme="dark"]) :is(.sidebar,.mobile-nav){background:var(--sidebar)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;color:var(--text);font:inherit;font-size:12px;white-space:nowrap;background:var(--surface);cursor:pointer}
.landing-header>.theme-toggle{margin-inline-start:auto}.landing-header:has(>.theme-toggle) nav{margin-inline-start:0}
@media(max-width:720px){.landing-header>.theme-toggle{margin-inline-start:auto}.topbar .theme-toggle{font-size:11px;padding:6px;min-width:40px}}
html:not([data-theme="dark"]) .launch-brief{background:var(--surface);border-color:var(--line)}
html:not([data-theme="dark"]) .launch-brief :is(p,strong){color:var(--text)}
html:not([data-theme="dark"]) .launch-brief a{color:var(--gold)}
html:not([data-theme="dark"]) :is(.cover-well,.live-experience,.live-strip,.hero-note,.letter-card,.notice,.toast){background:var(--surface2);color:var(--text);border-color:var(--line)}
html:not([data-theme="dark"]) :is(.hero-note p,.live-experience p,.live-experience small){color:var(--muted)}
html:not([data-theme="dark"]) :is(.card-play,.filter-bar button.active){background:#345c46;color:#fffdf8}
html:not([data-theme="dark"]) .quiet-sparrow>span{display:none}
html:not([data-theme="dark"]) .site-footer{color:var(--muted)}
html:not([data-theme="dark"]) .site-footer>a{color:var(--text)}
html:not([data-theme="dark"]) .site-footer p{color:var(--muted)}
.quiet-sparrow>span{display:none}
html:not([data-theme="dark"]) .hero-tagline{color:var(--muted)}
html:not([data-theme="dark"]) .floating-label{background:var(--surface);border-color:var(--line);color:var(--text)}
html:not([data-theme="dark"]) .floating-label small{color:var(--muted)}

/* Give the circular wordmark a quiet white surround in night mode. */
html[data-theme="dark"] img[src*="logo-circle-v48.svg"]{box-sizing:border-box;padding:5px;background:#fff;border-radius:50%}
html[data-theme="dark"] .phone img[src*="logo-circle-v48.svg"]{padding:2px}
html[data-theme="dark"] .startup-splash img[src*="logo-circle-v48.svg"]{padding:9px}