:root{color-scheme:light;--page:#fff;--surface:#fff;--soft:#fff4ed;--tint:#fff5ef;--ink:#25201c;--muted:#76706b;--line:#ebe7e4;--bubble:#f6f3f0;--outgoing:#ffeadf;--outgoing-ink:#a93505;--subtle:#fff8f3;--accent-line:#f1daca;--brand-contrast:#25201c;--loader-rgb:255,255,255}
:root[data-theme=dark]{color-scheme:dark;--page:#141414;--surface:#202020;--soft:#332219;--tint:#241b17;--ink:#fefffa;--muted:#b9b2ac;--line:#38322e;--bubble:#302a26;--outgoing:#4a281b;--outgoing-ink:#ffc3a0;--subtle:#27211d;--accent-line:#593728;--brand-contrast:#fefffa;--loader-rgb:20,20,20;--orange:#fe7028}
@media(prefers-color-scheme:dark){:root:not([data-theme]){color-scheme:dark;--page:#141414;--surface:#202020;--soft:#332219;--tint:#241b17;--ink:#fefffa;--muted:#b9b2ac;--line:#38322e;--bubble:#302a26;--outgoing:#4a281b;--outgoing-ink:#ffc3a0;--subtle:#27211d;--accent-line:#593728;--brand-contrast:#fefffa;--loader-rgb:20,20,20;--orange:#fe7028}}
body,.story-section{background:var(--page);color:var(--ink)}
.secondary,.chat-window{background:var(--surface)}
.chat-rail{background:var(--subtle);border-color:var(--line)}
.chat-title,.mock-composer{border-color:var(--line)}
.bubble{background:var(--bubble)}.outgoing .bubble{background:var(--outgoing);color:var(--outgoing-ink)}
.avatar,.rail-item.selected{background:var(--outgoing)}.avatar.self{background:var(--bubble);color:var(--muted)}
.hero-note,.hero-bottom,.section-index,.sender,.sender time,.chat-title small,.chat-more,.date-line,.mock-composer,.rail-item,.feature-number,footer p,footer>span,.friendlinks-label,.friendlink>div>span,.story-top .eyebrow,.story-total,.story-figure figcaption,.story-detail,.story-hint,.story-scroll,.cloud-back,.cloud-copy .eyebrow,.cloud-family>.eyebrow,.cloud-family-caption span:last-child{color:var(--muted)}
.experience,.cloud-family{background:var(--tint)}
.experience-brand>span,.cloud-availability{color:var(--outgoing-ink);border-color:var(--accent-line)}
.cloud-availability{background:var(--subtle)}.cloud-family,.cloud-family-caption,.story-figure img{border-color:var(--accent-line)}
.story-enabled .story-figure img{background:var(--tint)}.story-progress>span{background:var(--line)}
.friendlink:hover{background:var(--tint);border-color:var(--orange)}
#intro,.series-loader{background:rgba(var(--loader-rgb),1)}
#intro.intro-exit,.series-loader.series-exit{background:rgba(var(--loader-rgb),.18)}
.loading-caption,.series-caption{color:var(--muted)}.loader-error,.series-error{color:var(--ink)}
.loader-error button,.series-error button{background:#fe7028;color:#141414}
svg{display:block;max-width:100%}
.header-controls{display:flex;align-items:center;gap:24px;min-width:0}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:1px solid var(--line);border-radius:100px;padding:8px 12px;background:var(--surface);color:var(--ink);font-size:.875rem;white-space:nowrap;flex-shrink:0}
.theme-toggle:hover{border-color:var(--orange)}.theme-icon{font-size:1.25rem;line-height:1}
@media(max-width:1100px){.header nav{gap:20px}}
@media(max-width:760px){.theme-toggle{padding:8px;width:40px;min-height:40px}.theme-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.header nav{gap:12px}.header-controls{gap:12px}.header .brand{gap:7px}.header .nav-word{width:112px}}
@media(max-width:420px){.header{padding-left:16px;padding-right:16px}.header nav{gap:10px}.header nav>a[href="#experience"]{display:none}.header .nav-word{width:105px}.header-controls{gap:8px}.cloud-back{font-size:.75rem}}
@media(max-width:360px){.header .nav-word{width:90px}.cloud-back span{display:none}}
