:root{--bg:#0d1117;--card:#151b24;--line:#263041;--text:#dde3ec;--dim:#8792a3;--accent:#5fe0c8;--warn:#f0a24a;--bad:#e0574f}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:13px/1.4 system-ui,sans-serif}body{display:flex;overflow:hidden}#stage{flex:1;min-width:0;position:relative}#view{cursor:crosshair;width:100%;height:100%;display:block}#loading{background:var(--bg);z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}#loadTrack{background:var(--line);border-radius:3px;width:320px;height:6px;overflow:hidden}#loadBar{background:var(--accent);width:0;height:100%;display:block}#loadError{color:var(--bad);text-align:center;max-width:480px}#start{background:var(--accent);color:#062;cursor:pointer;border:0;border-radius:6px;padding:10px 28px;font-size:16px;font-weight:600}#reload{color:var(--text);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:6px;padding:8px 22px;font-size:14px}#title{pointer-events:none;text-shadow:0 1px 3px #000a;max-width:34%;position:absolute;top:12px;left:16px}#title h1{letter-spacing:.2em;margin:0;font-size:20px}#title p{color:#e8edf5;opacity:.85;margin:2px 0 0}#score{pointer-events:none;text-shadow:0 1px 3px #000a;flex-wrap:wrap;justify-content:flex-end;gap:6px 14px;max-width:60%;display:flex;position:absolute;top:12px;right:16px}#score div{flex-direction:column;align-items:center;display:flex}#score b{font-size:20px}#score span{color:#e8edf5;opacity:.8;font-size:11px}#toolbar{pointer-events:none;text-shadow:0 1px 3px #000a;align-items:center;gap:12px;display:flex;position:absolute;bottom:80px;left:16px;right:16px}#toolbar button{white-space:nowrap;color:var(--text);border:1px solid var(--line);cursor:pointer;pointer-events:auto;background:#0009;border-radius:5px;flex:none;padding:5px 10px}#paintInfo{color:var(--accent)}#toolbar #grenadeBtn{border-color:var(--warn)}#score .game b{color:var(--warn)}#brainstats{white-space:pre;color:#e8edf5;text-shadow:0 1px 2px #000;pointer-events:none;font:11px/1.35 ui-monospace,monospace;position:absolute;bottom:10px;left:16px}#banner{letter-spacing:.1em;opacity:0;pointer-events:none;text-shadow:0 2px 6px #000;font-size:22px;font-weight:700;transition:opacity .25s;position:absolute;top:22%;left:50%;transform:translate(-50%)}#banner.show{opacity:1}#links{z-index:11;gap:8px;display:flex;position:absolute;bottom:12px;right:16px}#links a{color:var(--text);border:1px solid var(--line);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000a;border-radius:999px;align-items:center;gap:6px;padding:5px 10px;font-size:12px;font-weight:600;text-decoration:none;display:inline-flex}#links a:hover{border-color:var(--dim);background:#000d}#panel{border-left:1px solid var(--line);width:340px;overflow-y:auto}.panel-col{flex-direction:column;gap:10px;padding:10px;transition:background-color .15s;display:flex}.panel-col.drop-target{background:#111720}.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:6px 10px 10px}.card.pinned{z-index:2;position:sticky;top:0;box-shadow:0 6px 16px #000a}.card h2{align-items:center;gap:4px;margin:0 0 6px;font-size:13px;display:flex}.card h2 small,label small{color:var(--dim);margin-left:4px;font-weight:400}.card-toggle{text-align:left;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;flex-wrap:wrap;flex:1;align-items:baseline;gap:2px;padding:2px 0;display:flex}.card-toggle:before{content:"▾";width:14px;color:var(--dim);transition:transform .15s;display:inline-block}.card.collapsed .card-toggle:before{transform:rotate(-90deg)}.card.collapsed h2{margin-bottom:0}.card.collapsed>:not(h2){display:none!important}.card-pin,.card-grip{color:var(--dim);background:0 0;border:0;border-radius:4px}.card-pin{cursor:pointer;padding:2px 4px}.card-pin[aria-pressed=true]{color:var(--accent)}.card-grip{opacity:.5;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;align-items:center;padding:3px 2px;display:flex}.card-grip:hover,.card-grip:focus-visible{opacity:1;color:var(--text)}.card-grip:active{cursor:grabbing}.card.dragging{opacity:.35}.card-float{cursor:pointer;color:var(--dim);background:0 0;border:0;border-radius:4px;padding:2px 4px;display:none}.card-float[aria-pressed=true]{color:var(--accent)}.card-float:hover{color:var(--text)}@media (width>=821px) and (pointer:fine){.card-float{display:block}.card.floating{z-index:30;resize:horizontal;border-color:#33415a;min-width:220px;max-width:100vw;max-height:100vh;position:fixed;overflow:auto;box-shadow:0 10px 30px #000c}.card.floating .card-pin{display:none}.card.floating.moving{opacity:.9}}.drop-marker{background:var(--accent);border-radius:2px;flex:none;height:3px;margin:-6px 4px}.panel-foot{justify-content:center;display:flex}.panel-foot button{color:var(--dim);border:1px solid var(--line);font:inherit;cursor:pointer;background:0 0;border-radius:5px;padding:4px 10px;font-size:11px}.panel-foot button:hover{color:var(--text)}.card p{color:var(--dim);margin:4px 0}.card p b{color:var(--text)}canvas#eye,canvas#brain{aspect-ratio:1.6;background:#000;border-radius:4px;width:100%;display:block}canvas#brain{aspect-ratio:1}.meter{margin-bottom:7px}.meter label{margin-bottom:2px;display:block}.bar{background:var(--line);border-radius:4px;flex:1;height:8px;position:relative;overflow:hidden}.bar span{background:var(--accent);width:0;height:100%;transition:width 80ms linear;display:block}.bar.left span{margin-left:auto}.lr{gap:2px;display:flex}#gf{background:var(--warn)}.mv{align-items:center;gap:8px;margin-bottom:8px;display:flex}.mv input{flex:1}#stims{flex-direction:column;gap:4px;display:flex}.stim{text-align:left;color:var(--text);border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;background:#0e131b;border-radius:5px;grid-template-columns:22px 64px 1fr;align-items:center;gap:6px;padding:4px 6px;display:grid}.stim small{color:var(--dim);font-size:11px}.stim kbd{background:var(--line);text-align:center;border-radius:3px;padding:1px 0;font:11px ui-monospace,monospace}.stim.on{border-color:var(--accent);background:#10322d}@media (width<=820px){body{flex-direction:column;overflow:auto}#stage{flex:none;height:62dvh}#panel{border-left:0;width:100%}#brainstats,#hint{display:none}#toolbar{flex-wrap:wrap;gap:6px;bottom:10px;left:8px;right:92px}#links{gap:6px;bottom:10px;right:8px}#links a{padding:7px 9px}#links .label{display:none}#toolbar button{padding:7px 10px}#title{max-width:60%}#title h1{font-size:15px}#title p{display:none}#score{gap:4px 10px;max-width:45%}#score b{font-size:15px}}@media (height<=520px) and (orientation:landscape){#panel{width:260px}#brainstats,#hint,#title p{display:none}#toolbar{flex-wrap:wrap;gap:6px;bottom:10px;right:92px}#links .label{display:none}}button{touch-action:manipulation}.stim{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none}#loadTrack{max-width:80vw}.stat{font:11px/1.35 ui-monospace,monospace}.note{font-size:11px}.toggle{width:100%;color:var(--text);border:1px solid var(--line);cursor:pointer;background:#0e131b;border-radius:5px;margin:4px 0;padding:5px}#wantL,#wantR{background:#6fdc7a}input[type=range]{appearance:none;cursor:pointer;--fill:50%;background:0 0;height:18px}input[type=range]:focus-visible{outline:none}input[type=range]::-webkit-slider-runnable-track{border:1px solid var(--line);background:linear-gradient(to right, var(--accent) 0 var(--fill), #0b1016 var(--fill) 100%);border-radius:3px;height:6px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--text);border:2px solid var(--accent);border-radius:50%;width:14px;height:14px;margin-top:-5px;transition:box-shadow .12s;box-shadow:0 0 0 3px #5fe0c822}input[type=range]:hover::-webkit-slider-thumb{box-shadow:0 0 0 5px #5fe0c840}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px #5fe0c840}input[type=range]::-moz-range-track{border:1px solid var(--line);background:#0b1016;border-radius:3px;height:6px}input[type=range]::-moz-range-progress{background:var(--accent);border-radius:3px;height:6px}input[type=range]::-moz-range-thumb{background:var(--text);border:2px solid var(--accent);border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 3px #5fe0c822}input[type=range]:hover::-moz-range-thumb{box-shadow:0 0 0 5px #5fe0c840}input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 5px #5fe0c840}.mv label{font-weight:600}#mvLabel{text-align:right;min-width:46px;color:var(--accent);font:12px ui-monospace,monospace}
