:root{color-scheme:light dark;--bg:#0d1218;--panel:#131a22;--panel2:#0b1016;--text:#d9e2ec;--muted:#8e9bad;--line:#2a3645;--accent:#7db7ff;--good:#65c39a;--warn:#e6b85c;--bad:#e18b6d}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text)}body{font:13px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.shell{max-width:980px;margin:0 auto;padding:14px}.head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:10px}.kicker{font-weight:800;letter-spacing:.05em;color:var(--accent);font-size:12px}.desc{color:var(--muted);max-width:72ch;margin-top:3px}.status{white-space:nowrap;color:var(--muted);font-size:11px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#7e8792;margin-right:6px}.dot.ok{background:var(--good)}.dot.bad{background:var(--bad)}.stage{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:10px}canvas{display:block;width:100%;height:auto;border-radius:7px;background:var(--panel2);touch-action:none}.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-top:10px}label{display:grid;gap:4px;color:var(--muted);font-size:11px}input[type=range]{width:150px;accent-color:var(--accent)}select,button{font:inherit;border:1px solid var(--line);border-radius:6px;background:var(--panel2);color:var(--text);padding:6px 8px}button{color:var(--accent);font-weight:700;cursor:pointer}button:hover{border-color:var(--accent)}.readout{margin-left:auto;display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}.pill{border:1px solid var(--line);background:var(--panel2);border-radius:999px;padding:5px 8px;color:var(--muted);font-size:11px}.pill strong{color:var(--text)}.hint{margin-top:8px;color:var(--muted);font-size:11px}@media(prefers-color-scheme:light){:root{--bg:#fafbfc;--panel:#fff;--panel2:#f5f7fa;--text:#263244;--muted:#68758a;--line:#d6dde7;--accent:#2567b2;--good:#16825d;--warn:#9a6a00;--bad:#b34f32}}@media(min-width:761px) and (min-height:900px){html,body{min-height:100%}body{display:flex;align-items:center}.shell{width:100%;max-width:1200px}}@media(max-width:650px){.shell{padding:9px}.head{display:block}.status{margin-top:6px}.readout{margin-left:0;justify-content:flex-start}input[type=range]{width:125px}}

html[data-ramwise-fullscreen],html[data-ramwise-fullscreen] body{height:100%;min-height:0;overflow:hidden}
html[data-ramwise-fullscreen] body{display:block;align-items:initial}
html[data-ramwise-fullscreen] .shell{display:flex;flex-direction:column;width:100%;max-width:none;height:100%;min-height:0;padding:10px}
html[data-ramwise-fullscreen] .head{flex:0 0 auto;margin-bottom:8px}
html[data-ramwise-fullscreen] .stage{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}
html[data-ramwise-fullscreen] canvas{flex:1 1 0;width:100%;height:100%;min-height:0;object-fit:contain;object-position:center}
html[data-ramwise-fullscreen] .controls,html[data-ramwise-fullscreen] .hint{flex:0 0 auto}