:root{--bg: #0f1116;--panel: #151820;--border: #242936;--text: #e6e6e6;--muted: #7f8796;--accent: #ffd166;--blue: #3a86ff}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{display:grid;grid-template-columns:280px 1fr;height:100%}aside{background:var(--panel);border-right:1px solid var(--border);padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}h1{font-size:20px;margin:0;letter-spacing:.06em}h1 small{display:block;font-size:11px;color:var(--muted);letter-spacing:0;font-weight:400}h2{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 0 6px}.games{display:flex;flex-direction:column;gap:4px}.games button{text-align:left;background:transparent;color:var(--text);border:1px solid transparent;border-radius:6px;padding:8px 10px;cursor:pointer}.games button:hover{border-color:var(--border)}.games button.active{background:#1f232c;border-color:var(--blue)}.games button small{display:block;color:var(--muted);font-size:11px}.field{display:flex;align-items:center;gap:8px}.field label{width:70px;color:var(--muted)}.field input[type=range]{flex:1;accent-color:var(--blue)}.field select,.field input[type=number],.field input[type=text]{width:100%;background:#1f232c;color:var(--text);border:1px solid var(--border);border-radius:4px;padding:4px 6px}.field output{width:28px;text-align:right;font-weight:600;color:var(--accent)}.dimlabel{font-size:11px;color:var(--muted);margin-top:2px}.newgame{background:var(--blue);color:#fff;border:0;border-radius:6px;padding:10px;font-weight:600;cursor:pointer}.newgame:hover{filter:brightness(1.1)}.lv0{color:#e6e6e6}.lv1{color:#3a86ff}.lv2{color:#c77dff}.row{display:flex;gap:8px;align-items:center}button.small{background:#1f232c;color:var(--text);border:1px solid var(--border);border-radius:6px;padding:6px 10px;cursor:pointer}button.small:disabled{opacity:.4;cursor:default}label.small{color:var(--muted);font-size:12px;cursor:pointer}.friends .field input[type=text]{text-transform:uppercase}.friends .code{font-size:22px;font-weight:800;letter-spacing:.2em;color:var(--accent);text-align:center;margin:6px 0}.friends .players{list-style:none;padding:0;margin:6px 0;font-size:12px}.friends .players li{padding:3px 6px;border-radius:4px;background:#1f232c;margin-bottom:3px}.friends .players li.me{border:1px solid var(--blue)}.friends .err{color:#ef476f;font-size:12px}.tutor .check{display:block;margin-bottom:8px;cursor:pointer}.tutor .check span{color:var(--muted);font-size:12px}.hintbtn{width:100%;background:#1f232c;color:#06d6a0;border:1px solid #06d6a0;border-radius:6px;padding:8px;font-weight:600;cursor:pointer}.hintbtn:disabled{opacity:.4;cursor:default}.status .hint{color:#06d6a0}.help ul{margin:0;padding-left:16px;color:var(--muted);font-size:12px}.help li+li{margin-top:3px}.help .universal{border-top:1px solid var(--border);margin-top:8px;padding-top:8px}main{position:relative;display:flex;flex-direction:column;min-width:0}.stage{flex:1;position:relative;min-height:0}.stage canvas{display:block;position:absolute;top:0;right:0;bottom:0;left:0;outline:none}.status{padding:10px 16px;border-top:1px solid var(--border);background:var(--panel);color:var(--text);display:flex;justify-content:space-between;gap:12px}.status .over{color:var(--accent);font-weight:600}.status .hint{color:var(--muted);font-size:12px}@media(max-width:720px){#app{grid-template-columns:1fr;grid-template-rows:auto 1fr}aside{border-right:0;border-bottom:1px solid var(--border);max-height:45vh}}