:root{--bg:#030409;--panel:#090b12b8;--line:#ffffff12;--line-strong:#ffffff24;--text:#e6ebf5;--muted:#8b95ad;--faint:#5b647a;--cyan:#3ee6ff;--amber:#ffb340;--red:#ff4d5e;--green:#52f2a6;--mono:"SF Mono", ui-monospace, Menlo, Consolas, monospace;--sans:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", system-ui, sans-serif;--r:16px}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}#app{width:100vw;height:100vh;position:relative}#main-canvas{cursor:crosshair;width:100%;height:100%;display:block;position:absolute;inset:0}.panel{background:var(--panel);-webkit-backdrop-filter:blur(22px)saturate(1.3);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:0 24px 60px #00000073,inset 0 1px #ffffff0a}.panel h2{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);align-items:center;gap:10px;margin:0 0 10px;font-size:11px;font-weight:600;display:flex}.panel h2 small{letter-spacing:0;text-transform:none;color:var(--faint);font-size:10.5px;font-weight:400;font-family:var(--mono)}#title{pointer-events:none;max-width:480px;position:absolute;top:22px;left:24px}#title h1{letter-spacing:-.02em;margin:0;font-size:26px;font-weight:800}#title h1 span{color:var(--cyan);font-weight:300}#title p{color:var(--muted);margin:6px 0 10px;font-size:13px;line-height:1.45}.chips{flex-wrap:wrap;gap:6px;display:flex}.chips span{font:10.5px var(--mono);color:var(--muted);border:1px solid var(--line-strong);background:#ffffff08;border-radius:999px;padding:3px 9px}#cam{border-radius:999px;align-items:center;gap:4px;padding:5px;display:flex;position:absolute;top:22px;left:50%;transform:translate(calc(-50% - 30px))}#cam .seg{background:0 0;border-color:#0000;padding:6px 12px}#cam .seg.on{color:#d9fbff;background:#3ee6ff24;border-color:#3ee6ff73}#cam small{font:10.5px var(--mono);color:var(--faint);white-space:nowrap;padding:0 10px 0 6px}#right{flex-direction:column;gap:12px;width:420px;display:flex;position:absolute;top:18px;bottom:18px;right:18px}#brain-panel{flex-direction:column;flex:1.3;min-height:0;display:flex}#eye-panel{flex-direction:column;flex:1;min-height:0;display:flex}#brain-canvas,#eye-canvas{border:1px solid var(--line);background:radial-gradient(at 50% 45%,#141c34e6 0%,#04060ce6 70%);border-radius:12px;flex:1;width:100%;min-height:0;display:block}#brain-legend{flex-direction:column;gap:4px;margin-top:10px;display:flex}#brain-legend .stage{grid-template-columns:8px 74px 1fr 72px 48px;align-items:center;gap:8px;font-size:11px;display:grid}#brain-legend .stage i{background:var(--c);width:8px;height:8px;box-shadow:0 0 8px var(--c);border-radius:50%}#brain-legend .stage b{color:var(--text);font-weight:600}#brain-legend .stage span{color:var(--faint);font-family:var(--mono);white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}#brain-legend .stage .bar{background:#ffffff0f;border-radius:2px;height:4px;overflow:hidden}#brain-legend .stage .bar em{background:var(--c);width:0;height:100%;box-shadow:0 0 6px var(--c);transition:width 70ms linear;display:block}#brain-legend .stage var{font:10.5px var(--mono);color:var(--muted);text-align:right;font-style:normal}#brain-synapses{flex-wrap:wrap;gap:5px;margin-top:10px;display:flex}#brain-synapses .chip{font:10px var(--mono);color:var(--faint);border:1px solid var(--line);border-radius:999px;padding:2px 8px}#brain-synapses .chip b{color:var(--cyan);margin-left:5px;font-weight:500}#eye-legend{font:10.5px var(--mono);color:var(--muted);flex-wrap:wrap;gap:12px;margin-top:9px;display:flex}#eye-legend i{vertical-align:-1px;border-radius:2px;width:8px;height:8px;margin-right:5px;display:inline-block}#controls{width:360px;position:absolute;bottom:22px;left:24px}#controls h2 button{margin-left:auto}#controls label{color:var(--text);grid-template-columns:1fr auto auto;align-items:baseline;gap:0 6px;margin:9px 0 0;font-size:12.5px;display:grid}#controls label small{color:var(--faint);font:10.5px var(--mono)}#controls label output{font:500 12.5px var(--mono);color:var(--cyan);text-align:right;min-width:30px}#controls label input{grid-column:1/-1;margin:6px 0 0}#controls .row{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}input[type=range]{appearance:none;cursor:pointer;--p:0%;background:0 0;width:100%;height:18px}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--cyan) var(--p), #ffffff1a var(--p));border-radius:2px;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--cyan);background:#0e1420;border-radius:50%;width:14px;height:14px;margin-top:-5px;box-shadow:0 0 0 3px #3ee6ff1f}input[type=range]::-moz-range-track{background:#ffffff1a;border-radius:2px;height:4px}input[type=range]::-moz-range-progress{background:var(--cyan);border-radius:2px;height:4px}input[type=range]::-moz-range-thumb{border:2px solid var(--cyan);background:#0e1420;border-radius:50%;width:12px;height:12px}button{white-space:nowrap;font:500 11.5px var(--sans);color:var(--text);border:1px solid var(--line-strong);cursor:pointer;background:#ffffff0f;border-radius:999px;align-items:center;gap:6px;padding:6px 11px;transition:background .15s,border-color .15s,color .15s;display:inline-flex}button:hover{background:#ffffff1f}button kbd{font:9.5px var(--mono);color:var(--faint);background:#ffffff12;border-radius:4px;padding:1px 4px}button.primary{background:var(--cyan);border-color:var(--cyan);color:#04141a;font-weight:600}button.primary kbd{color:#0000008c;background:#0000001f}button.primary:hover{background:#7df0ff}button.toggle.on{color:#d9fbff;background:#3ee6ff24;border-color:#3ee6ff8c}button.toggle.on kbd{color:#d9fbff99}button.ghost{background:0 0}#hud{pointer-events:none;padding:0;display:flex;position:absolute;bottom:22px;left:50%;transform:translate(calc(-50% - 30px))}#hud .stat{text-align:center;border-left:1px solid var(--line);min-width:112px;padding:10px 20px}#hud .stat:first-child{border-left:0}#hud .stat b{font:600 24px var(--mono);letter-spacing:-.02em;line-height:1.1;display:block}#hud .stat span{color:var(--faint);letter-spacing:.12em;text-transform:uppercase;margin-top:4px;font-size:9.5px;display:block}#hud .stat.good b{color:var(--green)}#hud .stat.bad b{color:var(--red)}#hud .stat.gf b{align-items:center;height:26px;display:flex}#hud .stat.gf b i{background:#ffffff14;border-radius:3px;width:100%;height:6px;display:block;position:relative;overflow:hidden}#hud .stat.gf b i:after{content:"";width:var(--gf,0%);background:linear-gradient(90deg, var(--cyan), var(--amber) 70%, var(--red));transition:width 40ms linear;position:absolute;inset:0}#flash{font:700 13px var(--mono);letter-spacing:.32em;pointer-events:none;opacity:0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid;border-radius:999px;padding:8px 18px 8px 22px;transition:opacity .3s;position:absolute;top:14%;left:50%;transform:translate(-50%)}#flash.show{opacity:1;transition:none}#flash.escape{color:var(--amber);background:#ffb3401f;box-shadow:0 0 40px #ffb34040}#flash.hit{color:var(--red);background:#ff4d5e24;box-shadow:0 0 40px #ff4d5e4d}#loading{background:var(--bg);z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:16px;transition:opacity .6s;display:flex;position:absolute;inset:0}#loading.hide{opacity:0;pointer-events:none}#loading p{color:var(--muted);font:13px var(--mono)}.spinner{border:3px solid #3ee6ff26;border-top-color:var(--cyan);border-radius:50%;width:42px;height:42px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1200px){#right{width:340px}#controls{width:310px}#title p,.chips{display:none}}