:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#edf2fb}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#03060d}#scene{position:fixed;inset:0}#scene canvas{display:block;width:100%;height:100%}.shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(3,7,16,.63),transparent 42%,rgba(3,7,16,.12)),linear-gradient(0deg,rgba(2,6,14,.83),transparent 25%,transparent 72%,rgba(2,6,14,.65));z-index:1}header,footer,.centerQuote,.leftInfo,.rightInfo{position:absolute;z-index:2}header{top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:clamp(18px,3vw,42px);gap:12px}.brand,.right,.music{display:flex;align-items:center;gap:14px}.brandmark{font-size:37px;font-weight:200;color:#c7d9f6}.brand b{font-size:15px;letter-spacing:.22em}.brand b span{font-weight:300}.brand small{display:block;font-size:9px;letter-spacing:.22em;color:#8396b2;margin-top:5px}.right{font-size:11px;letter-spacing:.1em;color:#c3d0e4}.signal{color:#93d3b8}button{background:#16243a;border:1px solid #52658170;color:#f0f4ff;padding:11px 14px;border-radius:9px;cursor:pointer}button:hover{background:#263954}.right button{font-size:20px;padding:6px 12px}.centerQuote{left:50%;top:24%;transform:translateX(-50%);width:min(660px,75vw);text-align:center;text-shadow:0 2px 25px #000}.eyebrow,.small{font-size:10px;letter-spacing:.2em;color:#9aabc4}.centerQuote h1{font-size:clamp(20px,2.2vw,34px);font-weight:350;line-height:1.35;letter-spacing:.015em;margin:13px 0 7px}.centerQuote p{font-size:clamp(11px,1.15vw,14px);color:#c5d0e0;margin:0}.leftInfo{left:clamp(20px,3vw,45px);bottom:120px}.heading{font-size:clamp(19px,2vw,30px);font-weight:300;line-height:1.3;margin-top:12px}.divider{width:40px;height:1px;background:#7f94b5;margin:19px 0}.stat{font-size:35px;font-weight:250;margin-top:6px}.rightInfo{right:clamp(20px,3vw,45px);bottom:126px;text-align:right}.progress{width:160px;height:3px;background:#53607680;margin:13px 0 8px auto}.progress i{display:block;width:0;height:100%;background:#d7e7ff;transition:width .5s}.commands{line-height:2;margin-top:25px}footer{bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px clamp(20px,3vw,45px);border-top:1px solid #a3b3cf20;background:#02060d3d}.album{height:47px;width:47px;border:1px solid #7f95b680;background:#182a43a8;display:grid;place-items:center;font-size:22px;border-radius:6px}.music b,.music span{display:block;font-size:12px;margin-top:4px}.music span{color:#91a2ba;font-size:11px}.ticker{color:#aebbd0;font-size:11px;text-align:center}.bottomRight{font-size:10px;letter-spacing:.12em;white-space:nowrap}.bottomRight span{color:#8396b2}.panel{position:fixed;z-index:10;right:16px;top:16px;bottom:16px;width:min(360px,calc(100vw - 32px));overflow:auto;padding:22px;background:#0b1424f5;border:1px solid #647c9c66;border-radius:16px;box-shadow:0 20px 70px #000b;backdrop-filter:blur(20px)}.hidden{display:none!important}.panelHead{display:flex;align-items:center;justify-content:space-between}.panelHead h2{margin:0;font-size:20px;font-weight:500}.panel p{font-size:12px;color:#aab9cf;line-height:1.6}.panel label{display:block;margin:16px 0;color:#c4d2e6;font-size:12px}.panel input,.panel select{display:block;width:100%;padding:12px;margin-top:7px;border-radius:7px;background:#101e31;border:1px solid #4c6281;color:#fff;font-size:13px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.actions button{font-size:12px}.actions .primary{grid-column:span 2;background:#b9d1f4;color:#0a1424;font-weight:700}pre{white-space:pre-wrap;word-break:break-word;font-size:10px;color:#9fcbad}#error{position:fixed;z-index:20;left:20px;bottom:20px;max-width:500px;background:#371d29;padding:16px;border-radius:10px}@media(max-width:700px){header{padding:17px}.brand b{font-size:12px}.brand small{font-size:7px}.right{font-size:9px;gap:7px}.signal{max-width:85px}.centerQuote{top:26%;width:90vw}.leftInfo{bottom:113px}.rightInfo{bottom:117px}.heading{font-size:17px}.commands{display:none}.ticker,.bottomRight{display:none}footer{padding:15px 18px}.music .small{font-size:8px}.music b{font-size:11px}.stat{font-size:26px}}

/* Words After Dark: typewriter + readable fade, no layout jumps */
.centerQuote{pointer-events:none;transition:opacity .85s ease;opacity:.96}
.centerQuote h1{min-height:1.4em}
.centerQuote h1::after{content:'▍';font-size:.75em;color:#a7c6fa;animation:lunarBlink .8s steps(1) infinite}
.centerQuote p{opacity:0;transform:translateY(5px);transition:opacity .8s ease,transform .8s ease;min-height:2em}
.centerQuote.quote-visible p{opacity:1;transform:translateY(0)}
@keyframes lunarBlink{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.centerQuote h1::after{animation:none}}