:root{--bg:#05060a;--cy:#33ffff;--mg:#ff33cc;--au:#ffc94a;--fg:#d9e3ee;--dim:#6b7a8c;--glass:rgba(12,16,26,.62)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#0c1424 0%,var(--bg) 70%);color:var(--fg);font-family:'JetBrains Mono',monospace;font-size:12px}
#scene-container{position:fixed;inset:0}
#hdr{position:fixed;top:12px;left:50%;transform:translateX(-50%);text-align:center;pointer-events:none;width:92%;animation:rise .9s ease-out}
h1{font-family:Fraunces,serif;font-weight:900;font-size:clamp(26px,4.4vw,52px);margin:0;letter-spacing:-.02em;line-height:1}
h1 i{font-weight:200;color:var(--cy)}
.sub{margin:4px 0 8px;color:var(--dim);font-family:Fraunces,serif;font-style:italic;font-weight:300;font-size:13px}
.stats{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;color:var(--dim)}
.stats b{color:var(--cy);font-weight:800}
#sNuc{color:var(--au)}#sName{color:var(--mg)}
.panel{position:fixed;top:130px;width:280px;max-height:calc(100vh - 180px);overflow:auto;padding:14px;background:var(--glass);backdrop-filter:blur(10px);border:1px solid rgba(51,255,255,.15);border-radius:4px;animation:rise .9s .2s both}
#left{left:14px}#right{right:14px;animation-delay:.35s}
h2{font-family:Fraunces,serif;font-weight:900;font-size:18px;margin:0 0 10px;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:6px}
.stim{display:grid;gap:6px;margin-bottom:12px}
.stim button{text-align:left;font-size:13px;padding:10px}
.stim em{font-style:normal;color:var(--mg);margin-right:10px;font-weight:800}
button{font-family:inherit;background:rgba(255,255,255,.04);color:var(--fg);border:1px solid rgba(255,255,255,.14);padding:7px 10px;cursor:pointer;border-radius:3px;transition:.15s}
button:hover{border-color:var(--cy);color:var(--cy);box-shadow:0 0 14px rgba(51,255,255,.25)}
button:active{transform:scale(.97)}
label{display:block;margin:7px 0;color:var(--dim)}
label input[type=range]{width:100%;accent-color:var(--cy)}
.tg{display:flex;gap:6px;align-items:center}
.tg input{accent-color:var(--au)}
.row{display:flex;gap:6px;margin-top:8px}.row button{flex:1}
#toast{color:var(--au);min-height:16px;margin-top:6px}
canvas#wasp,canvas#raster{width:100%;display:block;background:#03040a;border:1px solid rgba(255,255,255,.08);border-radius:3px}
#thoughts{height:120px;overflow:hidden;margin:8px 0;font-family:Fraunces,serif;font-style:italic;font-size:14px;display:flex;flex-direction:column-reverse}
#thoughts div{padding:2px 0;animation:fade .4s}
#thoughts div:first-child{color:var(--cy)}
#ask{width:100%;margin-bottom:8px}
#tip{position:fixed;display:none;pointer-events:none;background:#0b0f18ee;border:1px solid var(--mg);padding:8px 10px;border-radius:3px;line-height:1.5;z-index:9}
#tip .b{color:var(--au)}
footer{position:fixed;bottom:8px;width:100%;text-align:center;color:var(--dim);font-size:10px;padding:0 10px}
footer a{color:var(--mg)}
.tabs{display:none}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
#hdr{animation-name:rise2}@keyframes rise2{from{opacity:0;transform:translate(-50%,-10px)}}
@keyframes fade{from{opacity:0}}
@media(max-width:760px){
  #hdr{top:6px}.sub{display:none}
  .panel{top:auto;bottom:62px;left:8px!important;right:8px!important;width:auto;max-height:42vh}
  .panel.hide{display:none}
  .tabs{display:flex;position:fixed;bottom:28px;left:8px;right:8px;gap:4px;z-index:5}
  .tabs button{flex:1}.tabs .on{border-color:var(--cy);color:var(--cy)}
}