:root[data-theme="dark"]{color-scheme:dark;--bg:#171717;--card:#202020;--ink:#f3f0ec;--muted:#aca7a1;--red:#ed6c60;--line:#353332;--soft:#392926;--input:#191919;--hover:#292524;--accent-ink:#191514;--avatar:#3c4541;--avatar-ink:#d1e0d1;--success:#273027;--success-ink:#c4d3b5;--error:#382019;--error-ink:#e4ac95}
:root[data-theme="light"]{color-scheme:light;--bg:#f6f4f0;--card:#ffffff;--ink:#252322;--muted:#655e58;--red:#ac3e33;--line:#d9d3cb;--soft:#f5e4df;--input:#faf9f6;--hover:#eee8e2;--accent-ink:#ffffff;--avatar:#e0e9e2;--avatar-ink:#354f3c;--success:#e6f1e4;--success-ink:#30522b;--error:#fbe8e3;--error-ink:#8b2f20}
html[data-theme]{background:var(--bg);color:var(--ink)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 12px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:9px;font:600 13px/1.4 Arial,Helvetica,sans-serif;cursor:pointer;white-space:nowrap}
.theme-toggle:before{content:'☀';font-size:18px;line-height:1}
[data-theme="light"] .theme-toggle:before{content:'☾'}
.theme-toggle:hover{background:var(--hover)}
.theme-toggle:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.rail-footer .theme-toggle{margin-bottom:15px;width:100%}
.mobile-header .theme-toggle{display:none}
[data-theme] .nav-item:hover,[data-theme] .composer-teaser:hover{background:var(--hover);color:var(--ink)}
[data-theme] .button,[data-theme] .ranking-tabs button.selected,[data-theme] .nav-item[data-page-link="post"],[data-theme] .app-rail .brand-symbol,[data-theme] .mobile-header .brand-symbol{color:var(--accent-ink)}
[data-theme] .button{background:var(--red)}
[data-theme] .button:hover{background:var(--red);border-color:var(--red);filter:brightness(1.08);color:var(--accent-ink)}
[data-theme] .button-outline{background:transparent;color:var(--ink);border-color:var(--line)}
[data-theme] .button-outline:hover{background:var(--soft);color:var(--ink);border-color:var(--red);filter:none}
[data-theme] input,[data-theme] textarea,[data-theme] select,[data-theme] .compose-panel input,[data-theme] .compose-panel textarea,[data-theme] .compose-panel select,[data-theme] .full-receipt,[data-theme] .social-app .full-receipt{background:var(--input);color:var(--ink);border-color:var(--line)}
[data-theme] .avatar,[data-theme] .social-app .avatar,[data-theme] .thread-avatar{background:var(--avatar);color:var(--avatar-ink)}
[data-theme] .text-link:hover,[data-theme] .read-story-link:hover{color:var(--red);text-decoration:underline}
[data-theme] .thread-collapse,[data-theme] .thread-form-status{color:var(--red)}
[data-theme] #auth-status{background:var(--success);color:var(--success-ink);border-color:var(--success-ink)}
[data-theme] #auth-status.error{background:var(--error);color:var(--error-ink);border-color:var(--error-ink)}
[data-theme] .loading-state,[data-theme] .moderation-report,[data-theme] .local-mail{border-color:var(--line);color:var(--muted)}
[data-theme] .local-mail a,[data-theme] .local-mail span,[data-theme] .comment-report-label{color:var(--red)}
[data-theme] .translator-panel .side-intro,[data-theme] .translation-label,[data-theme] .translation-credit{color:var(--muted)}
[data-theme] .translator-panel blockquote,[data-theme] .translator-panel .translation{color:var(--ink)}
[data-theme] .translation-divider{color:var(--red);border-color:var(--line)}
[data-theme] .toast{background:var(--ink);color:var(--bg);border-color:var(--line)}
/* Shared story and privacy pages use the same preference as the community app. */
[data-theme] body:not(.social-app){background:var(--bg);color:var(--ink)}
[data-theme] body:not(.social-app) header,[data-theme] body:not(.social-app) footer,[data-theme] body:not(.social-app) .join{border-color:var(--line)}
[data-theme] body:not(.social-app) .byline,[data-theme] body:not(.social-app) .back,[data-theme] body:not(.social-app) .context,[data-theme] body:not(.social-app) .small,[data-theme] body:not(.social-app) footer{color:var(--muted)}
[data-theme] body:not(.social-app) .source{background:var(--card);border-color:var(--red)}
[data-theme] body:not(.social-app) .brand em,[data-theme] body:not(.social-app) .eyebrow{color:var(--red)}
body:not(.social-app) header{flex-wrap:wrap}
body:not(.social-app) header .theme-toggle{margin-left:auto}
body:not(.social-app) header{padding-top:max(20px,env(safe-area-inset-top,0px))}
body:not(.social-app) footer{padding-bottom:max(24px,env(safe-area-inset-bottom,0px))}
@media(max-width:600px){
 body:not(.social-app) header{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px 12px;align-items:center;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
 body:not(.social-app) header .brand{grid-column:1;grid-row:1;min-width:0}
 body:not(.social-app) header .theme-toggle{grid-column:2;grid-row:1;width:44px;height:44px;font-size:0;padding:0;gap:0;margin:0}
 body:not(.social-app) header .theme-toggle:before{font-size:21px}
 body:not(.social-app) header>a:not(.brand){grid-column:1/-1;grid-row:2;display:flex;align-items:center;min-height:44px;font-size:14px}
}
@media(max-width:1023px){
 .social-app .app-rail{background:var(--bg)}
 [data-theme] .nav-item[data-page-link="post"]{color:var(--muted)}
 [data-theme] .nav-item[data-page-link="post"] svg{color:var(--accent-ink)}
}
