:root{color-scheme:light;--ink:#202632;--muted:#606b79;--bg:#f7f8fa;--panel:#fff;--panel2:#f1f3f4;--line:#dce2e7;--cyan:#087f65;--violet:#5466b8;--lime:#087f65;--shadow:0 5px 22px rgba(30,40,55,.06)}
html[data-sj-theme] :is(.ex-demo-stage,.ex-reactor-fields,.agent-paths>article){background:var(--panel)!important;background-image:none!important;color:var(--ink)!important;border-color:var(--line)!important}
html[data-sj-theme] :is(.ex-demo-stage,.ex-reactor-fields,.agent-paths>article) :is(h1,h2,h3,p,a,label,.ex-story-text){color:var(--ink)!important}
html[data-sj-theme] :is(.editor-fields,.editor-output,.prompt-panel,.structured-panel,.detail-aside section,.ex-reactor-result){background:var(--panel)!important;color:var(--ink)!important;border-color:var(--line)!important}
html[data-sj-theme] :is(.editor-fields,.editor-output,.prompt-panel,.structured-panel,.detail-aside,.ex-reactor-result) :is(h1,h2,h3,label,p,li,strong){color:var(--ink)!important}
html[data-sj-theme] :is(.editor-fields,.editor-output,.prompt-panel,.ex-reactor-result,.agent-setup,.story-panel){background:var(--panel);color:var(--ink);border-color:var(--line)}
html[data-sj-theme] :is(.editor-fields,.editor-output,.prompt-panel,.ex-reactor-result,.agent-card,.form-grid) :is(h2,h3,label,p,li,strong){color:var(--ink)}
html[data-sj-theme] :is(.variable-chip,.variable,.var-chip){background:var(--panel2);color:var(--violet);border-color:var(--line)}
:root[data-sj-theme=dark]{color-scheme:dark;--ink:#edf0f5;--muted:#a5afbd;--bg:#13161c;--panel:#1d2027;--panel2:#272b34;--line:#353b47;--cyan:#69d4b2;--lime:#69d4b2;--violet:#aaaef3;--shadow:0 5px 22px rgba(0,0,0,.12)}
html[data-sj-theme] body{background:var(--bg);color:var(--ink)}
html[data-sj-theme] :is(.site-header,.site-footer,.site-nav.is-open,.prompt-card,.prompt-sheet,.tool-panel,.detail-panel,.kit-card,.agent-card,.feature-card,.library-toolbar,.filters,.editor-panel,.content-card){background:var(--panel);color:var(--ink);border-color:var(--line);box-shadow:var(--shadow);backdrop-filter:none}
html[data-sj-theme] .brand-mark{background:var(--cyan);box-shadow:none;color:var(--panel)}
html[data-sj-theme] :is(input,textarea,select){background:var(--panel2);color:var(--ink);border-color:var(--line)}
html[data-sj-theme] :is(.prompt-body,pre,code,.chip,.tag,.prompt-preview,.hero-card){background:var(--panel2);color:var(--ink);border-color:var(--line)}
html[data-sj-theme] .button{background:var(--cyan);color:var(--panel);box-shadow:none;border-color:var(--cyan)}
html[data-sj-theme] .button.secondary{background:var(--panel);color:var(--ink);border-color:var(--line)}
html[data-sj-theme] .hero{padding-top:clamp(2.5rem,5vw,5rem)}
html[data-sj-theme] .hero h1{font-size:clamp(2.8rem,6vw,5.5rem)}
html[data-sj-theme] .sj-theme-select{font-size:12px;padding:7px;border-radius:10px;max-width:90px}
@media(max-width:700px){.site-header{gap:.6rem}.brand{font-size:1rem}.site-header>.sj-theme-select{width:75px}}
html[data-sj-theme] :is(.hero-card,.anatomy,.hero-demo){background:var(--panel2);color:var(--ink);border-color:var(--line)}
html[data-sj-theme] .hero-demo :is(strong,span){color:var(--ink)}
@media(max-width:1050px){.site-header{flex-wrap:wrap}.site-nav{flex-wrap:wrap;max-width:100%;gap:.2rem}.site-nav a{padding:.45rem .55rem}}
@media(max-width:680px){html[data-sj-theme] .site-nav.open{background:var(--panel);color:var(--ink)}}
