:root{
  --bg:#0d1117; --panel:rgba(22,28,38,.72); --line:rgba(140,170,200,.14);
  --cyan:#3ff0e0; --purple:#b78bff; --orange:#ff9d3c; --text:#d9e2ec; --dim:#7a8a9c;
  --agar:#d8d2a8;
}
*{box-sizing:border-box}
body{margin:0;color:var(--text);font-family:'Bricolage Grotesque',sans-serif;
  background:radial-gradient(circle at 15% 0%,rgba(63,240,224,.08),transparent 40%),
  radial-gradient(circle at 90% 30%,rgba(183,139,255,.08),transparent 45%),
  repeating-linear-gradient(0deg,transparent 0 39px,rgba(255,255,255,.02) 39px 40px),
  repeating-linear-gradient(90deg,transparent 0 39px,rgba(255,255,255,.02) 39px 40px),var(--bg);
  min-height:100vh;padding:18px;max-width:1300px;margin:0 auto}
.mono{font-family:'JetBrains Mono',monospace}
.dim{color:var(--dim);font-size:11px;font-weight:300}
header{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px;margin-bottom:16px;animation:rise .6s both}
h1{margin:0;font-weight:800;font-size:clamp(36px,6vw,68px);letter-spacing:-2px;line-height:.9}
h1 span{font-weight:200;color:var(--cyan);margin-left:6px}
.sub{margin:6px 0 0;font-weight:200;color:var(--dim);font-size:15px}
#ticker{font-size:12px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--cyan)}
main{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:820px){main{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;backdrop-filter:blur(8px);animation:rise .7s both}
#brainPanel{animation-delay:.1s}.scope{animation-delay:.2s;margin-top:16px}
.ptitle{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-weight:800;font-size:13px;letter-spacing:3px;margin-bottom:8px}
.cwrap{position:relative;width:100%}
.square{aspect-ratio:1/1}
.cwrap canvas{width:100%;height:100%;display:block;border-radius:10px;touch-action:none}
#scope{width:100%;height:140px;display:block;border-radius:8px;background:#030806}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 4px 0 8px}
.dot.s{background:var(--cyan)}.dot.i{background:var(--purple)}.dot.m{background:var(--orange)}
#tip{position:absolute;pointer-events:none;background:#05080c;border:1px solid var(--purple);padding:8px 10px;border-radius:8px;font-size:11px;max-width:220px;display:none;z-index:5}
#controls{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;animation:rise .8s .3s both}
.group h3{margin:0 0 10px;font-size:12px;letter-spacing:3px;font-weight:800;color:var(--dim)}
.btns{display:flex;flex-wrap:wrap;gap:6px}
button{font-family:'JetBrains Mono',monospace;font-size:12px;background:#111925;color:var(--text);border:1px solid var(--line);padding:9px 12px;border-radius:8px;cursor:pointer;transition:.15s}
button:hover{border-color:var(--cyan);color:var(--cyan)}
button.on{background:var(--cyan);color:#041014;border-color:var(--cyan);font-weight:700}
button.danger:hover{border-color:#ff5a6a;color:#ff5a6a}
label.sl{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;margin-bottom:10px;color:var(--dim)}
label.sl b{color:var(--text);float:right;font-weight:500}
input[type=range]{width:100%;accent-color:var(--purple)}
label.tg{font-family:'JetBrains Mono',monospace;font-size:12px;display:inline-flex;gap:6px;align-items:center;margin-right:12px;cursor:pointer}
input[type=checkbox]{accent-color:var(--cyan)}
.ach{margin-top:16px;animation-delay:.4s}
#achList{display:flex;flex-wrap:wrap;gap:6px;font-size:11px}
.badge{padding:5px 9px;border-radius:20px;border:1px dashed var(--line);color:var(--dim)}
.badge.got{border:1px solid var(--orange);color:var(--orange);background:rgba(255,157,60,.08)}
footer{text-align:center;color:var(--dim);font-size:13px;margin:28px 0 10px;font-weight:200}
footer a{color:var(--cyan);font-family:'JetBrains Mono',monospace;font-size:12px}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(80px);background:var(--orange);color:#140a00;padding:10px 16px;border-radius:10px;font-size:12px;font-weight:700;transition:.35s;z-index:20}
#toast.show{transform:translateX(-50%) translateY(0)}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}