/* Whole-page themes; the artwork remains a cinematic dark field in both. */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;padding:9px;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:transparent;cursor:pointer;transition:background .2s,border-color .2s}
.theme-toggle[hidden]{display:none}.theme-toggle:hover{background:var(--pale);border-color:var(--teal)}.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.theme-toggle .theme-sun{display:none}html[data-theme=dark] .theme-toggle .theme-moon{display:none}html[data-theme=dark] .theme-toggle .theme-sun{display:block}
@media screen{
html[data-theme=dark]{--ink:#e9efef;--muted:#b0bbbb;--paper:#141414;--pale:#202323;--line:#353c3c;--teal:#82e4ce;--hero-surface:#07191e;background:#141414}
html[data-theme=dark] body,html[data-theme=dark] .site-header{background:var(--paper);color:var(--ink)}
html[data-theme=dark] .hero{background:#07191e;color:#f2f7f7}
html[data-theme=dark] .hero-art{background:#07191e}
html[data-theme=dark] .primary{color:#081c29}
html[data-theme=dark] .language-switch a[aria-current=page]{background:#d9eeea;color:#102420}
html[data-theme=dark] .lens-panel{background:#0b1c20;color:#eff5f5;border:1px solid #354644}
html[data-theme=dark] .contact{background:#101d1e;color:#eff5f5;border-top:1px solid var(--line)}
html[data-theme=dark] .section-label>span{color:#a0afaf;border-color:#586868}
html[data-theme=dark] .toggle{border-color:#637675}
html[data-theme=dark] .project[open] .toggle:before,html[data-theme=dark] .project[open] .toggle:after{background:#081c29}
html[data-theme=dark] .skip{color:#081c29}
html[data-theme=dark] ::selection{background:#82f1dc;color:#081c29}
html[data-theme=dark] a:focus-visible,html[data-theme=dark] button:focus-visible,html[data-theme=dark] summary:focus-visible{outline-color:#a2f2df}
}
/* Keep the extra control from crowding navigation on compact screens. */
@media(max-width:1100px){.header-controls{gap:16px}nav{gap:18px}}
@media(max-width:850px){nav a:not(.nav-contact){display:none}.header-controls{gap:12px}}
@media(max-width:650px){.header-controls{gap:9px}.theme-toggle{width:36px;height:36px;flex-basis:36px;padding:7px}.language-switch a{padding:5px 6px}}
@media(max-width:450px){nav{display:none}.header-controls{gap:9px}}
@media print{.theme-toggle{display:none!important}}