:root{--page:#f4f4ee;--ink:#22251f;--subtle:#5d694f;--surface:#fafbf5;--surface-alt:#e9ece2;--line:#d1d7c7;--brand:#304bff;--brand-ink:#fff;--focus:#304bff;--lime:#d6f368;color-scheme:light}
:root[data-theme=dark]{--page:#151917;--ink:#edf1e8;--subtle:#abb5a3;--surface:#1d231f;--surface-alt:#202821;--line:#3d493d;--brand:#acb8ff;--brand-ink:#151f52;--focus:#b9c3ff;color-scheme:dark}
body{background:var(--page);color:var(--ink)}
.theme-toggle{border:1px solid var(--line);background:var(--surface-alt);color:var(--ink);width:72px;height:38px;border-radius:40px;padding:3px;display:inline-flex;align-items:center;flex:none;cursor:pointer;position:relative;isolation:isolate;outline-offset:4px}
.theme-toggle:focus-visible{outline:2px solid var(--focus)}
.theme-toggle-track{display:flex;justify-content:space-between;align-items:center;position:relative;width:100%;height:100%;padding:0 5px}
.theme-sun,.theme-moon{height:24px;width:24px;display:grid;place-items:center;position:relative;z-index:1;transition:color .25s}
.theme-toggle svg{width:17px;height:17px;display:block}
.theme-sun{color:#25301c}.theme-moon{color:#5d694f}
.theme-toggle-thumb{position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #15201026;transition:transform .4s cubic-bezier(.2,.8,.2,1),background .3s;z-index:0}
[data-theme=dark] .theme-toggle-thumb{transform:translateX(34px);background:#d6f368}
[data-theme=dark] .theme-sun{color:#a6b39b}[data-theme=dark] .theme-moon{color:#243215}
.theme-transition-accent{position:fixed;top:0;left:0;width:100%;height:3px;background:var(--brand);transform-origin:left;pointer-events:none;z-index:999;opacity:0}
[data-theme=dark] .app-top{background:var(--page);border-color:var(--line)}
[data-theme=dark] :is(.topbar,.ticker,.footer,.section-heading,.process-list,.process-row,details,.app-footer,.data-row,.account-profile,.sidebar-bottom,.login-security){border-color:var(--line)}
[data-theme=dark] :is(.muted,.hero-note,.footer,.login-foot,.hero-copy,.brand-name span,.exhibit-legend,.feature-number,.feature p,.side-link,.nav-counter,.quick-row .number,.stat-top,.stat small,.project-meta,.section-bar a,.account-role,.sidebar-note,.nav-label,.app-top-left,.app-footer,.account-profile p,.data-row span,.account-info p,.guide-card p,.guide-card li,.render-row p,.activity-item small,.quick-row small,.page-heading p,.section-heading p,.process-row p,details p,.closing p,.login-panel>p,.login-security,.login-or,.login-waiting .muted,.legal p,.empty p,.loading-text){color:var(--subtle)}
[data-theme=dark] :is(.feature,.project-card,.stat,.panel,.guide-card,.render-row,dialog){background:var(--surface);border-color:var(--line);color:var(--ink)}
[data-theme=dark] :is(.feature:first-child,.sidebar,.faq-section,.empty,.login-waiting){background:var(--surface-alt);border-color:var(--line)}
[data-theme=dark] :is(.text-link,.pill,.icon-button,.button,.toolbar select){border-color:var(--line)}
[data-theme=dark] :is(input,textarea,select){background:#171e18;color:var(--ink);border-color:#526049}
[data-theme=dark] :is(input,textarea)::placeholder{color:#a2b193}
[data-theme=dark] .button{color:var(--ink)}
[data-theme=dark] .button:hover{background:#303c2d;border-color:#6d8061}
[data-theme=dark] .button.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
[data-theme=dark] .button.primary:hover{background:#c0caff;border-color:#c0caff}
[data-theme=dark] .button.ink{background:#edf1e8;color:#1b2517;border-color:#edf1e8}
[data-theme=dark] .button.lime{background:#d6f368;border-color:#d6f368;color:#22251f}
[data-theme=dark] .side-link:hover{background:#303c2d;color:#f2f7e8}
[data-theme=dark] .side-link.active{background:#35432d;color:#f1f6e8;box-shadow:none}
[data-theme=dark] :is(.hero h1 span,.process-row>span,.side-link.active svg,.login-code,.login-security svg,.guide-card .eyebrow,.ticker svg){color:var(--brand)}
[data-theme=dark] .brandmark{background:#e9efdc;color:#192114}
[data-theme=dark] .brandmark span{color:#3b4e14}
[data-theme=dark] .brand{color:var(--ink)}
[data-theme=dark] .nav-counter{background:#26331f}
[data-theme=dark] .avatar{background:#3c4d2e;color:#e7f3cc}
[data-theme=dark] .app-top-left strong{color:var(--ink)}
[data-theme=dark] :is(.project-detail-bottom,.quick-row,.activity-item){border-color:var(--line);color:var(--subtle)}
[data-theme=dark] .project-poster{background:#2c3829}
[data-theme=dark] .project-poster.alt-1{background:#2d354d}
[data-theme=dark] .project-poster.alt-2{background:#40362c}
[data-theme=dark] .poster-symbol{color:#a4bb84}[data-theme=dark] .alt-1 .poster-symbol{color:#a9bdf0}[data-theme=dark] .alt-2 .poster-symbol{color:#dbb986}
[data-theme=dark] .poster-caption{color:#d4dfc5}
[data-theme=dark] .project-poster .pill{background:#192019;color:#dce7d0;border-color:#55634a}
[data-theme=dark] .badge{color:#b9d78c}[data-theme=dark] :is(.badge.RUNNING,.badge.QUEUED){color:#b8c3ff}[data-theme=dark] .badge.FAILED{color:#ffb4a2}
[data-theme=dark] :is(.feature .feature-icon,.empty-icon){background:#2e3b24;border-color:#5b6c4a;color:#c7dba8}
[data-theme=dark] .dot{background:#bbdf87}
[data-theme=dark] .access-banner{background:#28351f;border-color:#61734d}
[data-theme=dark] .access-banner p{color:#c1d0b1}[data-theme=dark] .access-banner strong{color:#ebf5dd}
[data-theme=dark] .login-art{background:#232e22}
[data-theme=dark] .login-art .eyebrow{color:#d1ddc4}
[data-theme=dark] .form-error{color:#ffb7a9}
[data-theme=dark] .error-panel{background:#392b25;border-color:#855b45}[data-theme=dark] .error-panel p{color:#e0ba9e}
[data-theme=dark] .skeleton{background:#2d3927}
[data-theme=dark] .skip{background:var(--surface);color:var(--ink)}
[data-theme=dark] :is(a,button,input,select,textarea):focus-visible{outline-color:var(--focus)}
[data-theme=dark] .boot{color:var(--ink)}
[data-theme=dark] #toast{background:#e9f0dc;color:#202b15}
[data-theme=dark] .login-graphic{color:#d6f368}
/* The editor keeps a dark preview canvas; UI chrome follows the account preference. */
html[data-studio][data-theme=light]{--bg:#f4f4ee;--panel:#fafbf5;--panel2:#e9ece2;--edge:#cdd5c1;--edge2:#aab89a;--text:#22251f;--muted:#59674c;--mint:#304bff;--mint-ink:#fff;--cyan:#2844cf;--warn:#7e510b;--bad:#9b2929;--ok:#3d6425}
html[data-studio][data-theme=light] body{background:var(--bg);color:var(--text)}
html[data-studio][data-theme=light] :is(header,.intro-main,.intro-side,.panel,.account-menu,.sheet){background:var(--panel);color:var(--text);border-color:var(--edge)}
html[data-studio][data-theme=light] :is(input,textarea,select,button,.pill,.status,.hint,.state,.seg-group button){color:var(--text);border-color:var(--edge);background:var(--panel2)}
html[data-studio][data-theme=light] :is(.primary,button.primary){background:#304bff;color:white;border-color:#304bff}
html[data-studio][data-theme=light] :is(.stepper a,.account-popover,.account-row,.intro-links a,summary){color:var(--text);background:var(--panel)}
html[data-studio][data-theme=light] .hint{background:transparent;color:var(--muted)}
html[data-studio] .studio-website-nav{display:flex;align-items:center;justify-content:space-between;padding:8px 0;gap:20px}
html[data-studio] .theme-toggle{width:72px;min-width:72px;height:38px;padding:3px;background:var(--surface-alt);border:1px solid var(--line);border-radius:40px}
@media(max-width:500px){.top-actions{gap:9px}.topbar .theme-toggle{width:60px;height:34px;padding:3px}.topbar .theme-toggle-track{padding:0 2px}.topbar .theme-toggle-thumb{width:26px;height:26px}.topbar [data-theme-toggle] svg{width:15px;height:15px}.topbar .theme-sun,.topbar .theme-moon{width:22px}.topbar .theme-toggle[aria-pressed=true] .theme-toggle-thumb{transform:translateX(26px)}.topbar .plain-login{display:none}.topbar .brand-name span{display:none}.topbar .brand{gap:8px;font-size:13px}.topbar .button{font-size:10px;gap:5px;padding:9px 10px}.topbar{gap:10px}.app-top-right{gap:9px}.app-top-right .theme-toggle{width:60px;height:34px}.app-top-right .theme-toggle-track{padding:0 2px}.app-top-right .theme-toggle-thumb{width:26px;height:26px}.app-top-right .theme-toggle[aria-pressed=true] .theme-toggle-thumb{transform:translateX(26px)}.app-top-right .theme-sun,.app-top-right .theme-moon{width:22px}.app-top-right .theme-toggle svg{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){.theme-toggle-thumb,.theme-sun,.theme-moon{transition:none}}
/* Light editor surfaces require dark labels, including legacy fixed-colour rules. */
html[data-studio][data-theme=light] :is(label,.bar small,.intro-main p,.intro-side strong,.intro-side li,.intro-side li b,.eyebrow,.account-menu summary,.account-menu summary strong,.account-card dt,.account-card dd,.account-card #account-browser-state,.pvrow,.ph .state,.script-info){color:#526048}
html[data-studio][data-theme=light] :is(.ph,.stepper a,.stepper a i,.intro-links a,.intro-links a.secondary,.ph b,.scenechips button){border-color:#a9b79c}
html[data-studio][data-theme=light] :is(.ph b,.stepper a i){background:#dce5cf;color:#324b21}
html[data-studio][data-theme=light] :is(.style,.preset-card,.pcard,.template-choice,.diagnostic,.chip,.seg-group,.account-card,.sheet .card){background:#edf1e5;color:#26351c;border-color:#aebb9e}
html[data-studio][data-theme=light] :is(.style.sel,.preset-card.sel,.template-choice.sel,.stepper a.active){background:#e0e5ff;color:#2136ab;border-color:#7e91f0}
html[data-studio][data-theme=light] :is(input,textarea)::placeholder{color:#5d6e50}
html[data-studio][data-theme=light] #source{background:#f9fbf4;color:#293821;border-color:#b0bea0}
html[data-studio][data-theme=light] .sheet{background:#17211688}
html[data-studio][data-theme=light] .logo{background:#dfe5ff;color:#304bff;box-shadow:none}
html[data-studio][data-theme=light] header{box-shadow:0 8px 28px #1d291512}
@media(max-width:380px){.topbar .brand-name{display:none}.app-top-left{gap:7px}.app-top-left>a{display:none}.app-top-left>span{display:none}.app-top-right{gap:7px}}
[data-theme=dark] .ticker-label{color:var(--subtle)}
html[data-studio] .tols-logo{background:#22251f;color:#f4f4ee;box-shadow:none;overflow:hidden}html[data-studio] .tols-logo .mark-play{color:#d6f368}html[data-studio][data-theme=dark] .tols-logo{background:#edf1e8;color:#22251f}html[data-studio][data-theme=dark] .tols-logo .mark-play{color:#304bff}
html[data-studio] .tols-logo img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
