/* Shared Raketa surfaces. Theme script runs in head before first paint. */
:root{--paper:#e9e5db;--surface:#f2efe7;--surface-low:#e2ddd2;--surface-high:#faf7f0;--ink:#292823;--muted:#656158;--line:#c9c3b7;--edge:#fffaf2;--accent:#b83b12;--accent-hover:#a1320e;--accent-text:#fff;--selected:#ead5c7;--reader:#f6f2e9;--reader-ink:#292823;--fade-start:#f6f2e9c9;--fade-end:#f6f2e9df;--overlay:#eee8dedf;--row:#29282308;--soft-shadow:5px 6px 12px #4e473321,-4px -4px 10px #ffffffb3;--hover-shadow:6px 9px 16px #4e47332e,-4px -4px 10px #ffffffb3;--inset:inset 2px 2px 5px #7d70502b,inset -2px -2px 4px #fff;--blue:var(--accent);--border:var(--line);color-scheme:light;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
:root[data-theme=dark]{--paper:#20201e;--surface:#2b2b28;--surface-low:#252522;--surface-high:#343430;--ink:#f1eee6;--muted:#b6b1a7;--line:#4b4942;--edge:#44433c;--accent:#f0a06f;--accent-hover:#ffb98e;--accent-text:#24190f;--selected:#49382b;--reader:#151513;--reader-ink:#f3f0e8;--fade-start:#151513ba;--fade-end:#151513df;--overlay:#181816e8;--row:#ffffff09;--soft-shadow:5px 6px 12px #0005,-3px -3px 9px #ffffff06;--hover-shadow:6px 9px 16px #0006,-3px -3px 9px #ffffff08;--inset:inset 2px 2px 5px #0005,inset -2px -2px 4px #ffffff05;color-scheme:dark}
/* Override legacy community-only palette without changing layout. */
:root body,:root body:has(.compact-community){--blue:var(--accent);--border:var(--line);background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
:root body:has(.compact-community){--paper:inherit;--surface:inherit;--ink:inherit;--muted:inherit;--line:inherit;--accent:inherit;--accent-hover:inherit;--soft-shadow:inherit}
h1,h2,h3{font-family:Arial,Helvetica,sans-serif;font-weight:650;color:var(--ink)}
.site-header,:root body .site-header{background:var(--paper);border-color:var(--line)}
.site-header nav{gap:20px;align-items:center}.site-header a,:root body .site-header a{color:var(--ink)}
.brand-avatar{border-color:var(--line)}.brand-name small,:root body .brand-name small{color:var(--muted)}
.languages,:root body .languages{padding:5px 10px;background:var(--surface);border:1px solid var(--edge);border-radius:9px;box-shadow:var(--inset)}
.languages [aria-current],:root body .languages [aria-current]{color:var(--accent);border-color:var(--accent)}.languages span{color:var(--muted)}
button,.telegram,.options label{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-radius:9px;box-shadow:var(--soft-shadow)}
button:hover,.telegram:hover{background:var(--surface-high);border-color:var(--line)}button:active{box-shadow:var(--inset)}
.primary,.community-teaser .primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text);border-radius:9px;box-shadow:0 3px 8px #0002;font-weight:600}
.primary:hover,.community-teaser .primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--accent-text)}
.theme-toggle{display:inline-flex;gap:8px;align-items:center;padding:9px 11px;min-height:38px;font-size:12px}.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}.theme-sun{display:none}[data-theme=dark] .theme-sun{display:block}[data-theme=dark] .theme-moon{display:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,.scroll-area:focus-visible,.compact-community a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.eyebrow,.hero .eyebrow,.club .eyebrow,.steps article>span,.story .eyebrow,.chat-intro .eyebrow{color:var(--accent)}
.lead,.intro,.benefits,.hero-note,.tool-feature p,.about p,.join p:not(.eyebrow),.story p,.article section p,.steps p,.faq p,.club p:not(.eyebrow),.hint,.script-meta,.timers,.timers b,.keyboard,.article-meta,.join small{color:var(--muted)}
.landing-hero h1 em,.secondary,.text-link,.story-link{color:var(--accent)}
.mascot{background:var(--surface);border-color:var(--line);box-shadow:var(--soft-shadow);transform:none;border-radius:16px}.mascot figcaption span{color:var(--accent)}
.tool-feature,.story,.join,.club,.article-tool,.tool{background:var(--surface);border:1px solid var(--edge);border-right-color:var(--line);border-bottom-color:var(--line);box-shadow:var(--soft-shadow);border-radius:14px}
.story{transition:background .15s,box-shadow .15s}.story:hover{background:var(--surface-high);border-color:var(--line);box-shadow:var(--hover-shadow)}
.reader-preview{background:var(--reader);border-color:var(--line);box-shadow:var(--inset);transform:none}.reader-preview>span{color:var(--muted)}.reader-preview p{color:var(--muted)}.reader-preview strong{background:var(--selected);color:var(--ink)}.reader-preview>div{color:var(--accent);border-color:var(--line)}
.about{border-color:var(--line)}.article-meta,.keyboard,.faq details{border-color:var(--line)}.club strong{color:var(--ink)}.club-raccoon{border-color:var(--line);box-shadow:var(--soft-shadow)}
textarea{background:var(--surface-low);color:var(--ink);border-color:var(--line);box-shadow:var(--inset);outline-color:var(--accent)}textarea::placeholder{color:var(--muted)}
.stage{background:var(--reader);color:var(--reader-ink);border-color:var(--line);box-shadow:var(--inset)}.reading-text{color:var(--reader-ink)}.reading-text.empty{color:var(--muted)}.reading-line{background:var(--row);border-color:var(--accent)}.reading-line span{color:var(--accent)}.stage:after{background:linear-gradient(var(--fade-start),transparent 18%,transparent 75%,var(--fade-end))}.countdown-overlay{background:var(--overlay);color:var(--reader-ink)}.progress-track{background:var(--line)}.progress-track>div{background:var(--accent)}
.segments button[aria-pressed=true],.options label:has(input:checked){background:var(--selected);color:var(--ink);border-color:var(--accent);box-shadow:var(--inset)}.options label{background:var(--surface);border-color:var(--line)}.options input,input[type=range]{accent-color:var(--accent)}
.setting-label,.editor-heading>label,.speed-control{color:var(--muted)}.benefits li:before{background:var(--accent)}kbd{background:var(--surface-low);border-color:var(--line);color:var(--muted)}
.reading-mode .reader-panel{background:var(--paper)}#toast{background:var(--surface-high);border-color:var(--line);color:var(--ink);box-shadow:var(--soft-shadow)}
footer,:root body footer{border-color:var(--line);color:var(--muted)}footer>span:first-child{color:var(--ink)}footer a,:root body footer a{color:var(--accent)}
.community-teaser{border-color:var(--line)}.community-teaser p:not(.eyebrow){color:var(--muted)}.chat-intro{border-color:var(--line)}.chat-intro h1,.chat-section h2{color:var(--ink)}.chat-intro>p:not(.eyebrow),.chat-copy>span,.chat-footnote,.section-number{color:var(--muted)}
.chat-button{background:linear-gradient(145deg,var(--surface-high),var(--surface));border-color:var(--edge);border-right-color:var(--line);border-bottom-color:var(--line);color:var(--ink);box-shadow:var(--soft-shadow)}.chat-button:hover{background:var(--surface-high);box-shadow:var(--hover-shadow)}.chat-button:active{box-shadow:var(--inset)}.chat-arrow{background:var(--accent);color:var(--accent-text)}.chat-button:hover .chat-arrow{background:var(--accent-hover)}.chat-avatar{background:var(--surface);border-color:var(--line);box-shadow:var(--inset)}.chat-avatar-badge{background:var(--surface);border-color:var(--line);color:var(--muted)}.chat-footnote{border-color:var(--line)}
@media(max-width:900px),(pointer:coarse){.transport{background:var(--surface);border-color:var(--line);box-shadow:var(--soft-shadow)}}
@media(max-width:760px){.site-header nav{gap:12px}.theme-toggle{padding:8px;min-width:36px;justify-content:center}.theme-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.landing-hero h1{font-size:40px}.site-header{justify-content:space-between}}
@media(prefers-reduced-motion:reduce){.story,.chat-button{transition:none}}
/* Keep the expanded navigation and theme switch usable on narrow screens. */
@media(max-width:760px){.site-header{position:relative}.site-header nav{width:100%;justify-content:flex-start;padding-right:0}.site-header .theme-toggle{position:absolute;top:14px;right:18px}.site-header nav>a:first-child{display:inline}}

.community-back{display:inline-flex;color:var(--accent);font-size:13px;margin-bottom:24px;text-decoration:underline;text-underline-offset:4px}.community-back:hover{color:var(--accent-hover)}

/* Shared slide-out navigation, kept outside header layout rules. */
.site-header{min-height:76px;justify-content:space-between!important;flex-wrap:nowrap!important}
.menu-open{display:inline-flex;align-items:center;gap:12px;padding:11px 15px;min-height:44px;font-size:13px}
.menu-open svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.site-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(380px,calc(100vw - 24px));height:100dvh;max-height:100dvh;max-width:none;padding:28px;border:0;border-left:1px solid var(--line);border-radius:18px 0 0 18px;background:var(--paper);color:var(--ink);box-shadow:-16px 0 60px #0002;overflow-y:auto;overscroll-behavior:contain}
.site-drawer[open]{display:flex;flex-direction:column;animation:drawer-in .2s ease-out}
.site-drawer::backdrop{background:#0007;backdrop-filter:blur(3px)}
.drawer-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:26px;border-bottom:1px solid var(--line);font-size:24px;font-weight:600}
.menu-close{min-width:44px;min-height:44px;font-size:18px;box-shadow:none;background:transparent}
.site-drawer nav{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding-top:24px;width:100%;font-size:18px}
.site-drawer nav>a,.site-drawer nav>a:first-child{display:block;padding:14px 12px;border-radius:9px;color:var(--ink);text-decoration:none}
.site-drawer nav>a:hover{background:var(--surface-low);color:var(--accent)}
.site-drawer .languages{display:flex;justify-content:center;gap:18px;margin-top:24px;padding:12px;font-size:14px}
.site-drawer .languages a{padding:8px 14px;color:var(--ink)}
.site-drawer .theme-toggle{position:static;display:flex;justify-content:center;gap:10px;min-height:48px;font-size:14px;margin-top:8px}
.site-drawer .theme-label{position:static;width:auto;height:auto;clip:auto;overflow:visible}
.drawer-note{margin-top:auto;padding-top:40px;color:var(--muted);font-size:10px;letter-spacing:2px}
html:has(.site-drawer[open]){overflow:hidden}
.menu-fallback{padding:16px;justify-content:center}
@keyframes drawer-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.site-drawer[open]{animation:none}}
@media(max-width:480px){.site-header{min-height:68px}.site-drawer{padding:22px}.menu-open{padding:9px 12px}}