:root{--bg:#0b0d10;--panel:#101318f0;--line:#2a3038;--text:#d8dde3;--muted:#8a939e;--accent:#c9383a;--ok:#5be38a}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:14px/1.4 Segoe UI,system-ui,sans-serif;overflow:hidden}canvas#game{cursor:crosshair;width:100vw;height:100vh;display:block}.overlay{background:radial-gradient(#280a0a8c,#000000eb);place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow:auto}.overlay[hidden]{display:none}.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;width:min(980px,100%);padding:24px 28px;box-shadow:0 20px 60px #0009}h1{letter-spacing:6px;color:var(--accent);text-shadow:0 0 18px #c9383a80;margin:0;font-size:40px}h1 span{color:var(--text);letter-spacing:3px;font-size:.6em}h2{text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin:18px 0 8px;font-size:13px}.tagline{color:var(--muted);margin:4px 0 12px}.row{flex-wrap:wrap;align-items:center;gap:16px;display:flex}label{color:var(--muted)}input{border:1px solid var(--line);color:var(--text);font:inherit;background:#0e1115;border-radius:4px;width:200px;margin-left:8px;padding:7px 10px}.conn{color:var(--muted);font-size:12px}.conn.ok{color:var(--ok)}.conn.ko{color:var(--accent)}.classes{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;display:grid}.cls{border:1px solid var(--line);border-left:4px solid var(--c);cursor:pointer;background:#12161b;border-radius:4px;padding:10px 12px;transition:background .15s,transform .15s}.cls:hover{background:#181d24}.cls.sel{outline:1px solid var(--c);background:#1d242d;transform:translateY(-2px)}.cls b{color:var(--c);font-size:16px}.cls .role{color:var(--muted);margin:2px 0 6px;font-size:12px}.cls ul{margin:0;padding-left:16px;font-size:12px}.cols{grid-template-columns:1fr 1fr;gap:24px;display:grid}@media (width<=700px){.cols{grid-template-columns:1fr}}.players{max-height:280px;margin:0;padding:0;list-style:none;overflow:auto}.players li{border-bottom:1px solid var(--line);justify-content:space-between;padding:5px 8px;display:flex}.players .tag{color:var(--muted);font-size:11px}.players .rdy{color:var(--ok)}.help table{border-collapse:collapse;font-size:12px}.help td{padding:2px 10px 2px 0}.help td:first-child{color:#e8c547;white-space:nowrap}.actions{gap:10px;margin-top:20px;display:flex}button{color:var(--text);border:1px solid var(--line);font:inherit;cursor:pointer;background:#1b2129;border-radius:4px;padding:10px 22px;font-weight:600}button:hover{background:#232b35}button.on{border-color:var(--ok);color:var(--ok)}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover{background:#dd4447}.hint{color:var(--muted);margin-top:10px;font-size:12px}.stats{border-collapse:collapse;width:100%;margin-top:12px}.stats th,.stats td{text-align:left;border-bottom:1px solid var(--line);padding:6px 8px}.stats th{color:var(--muted);text-transform:uppercase;font-size:12px;font-weight:500}button.small{vertical-align:middle;margin-left:8px;padding:3px 10px;font-size:11px}.keys{border-collapse:collapse;width:100%;margin-top:8px}.keys td{border-bottom:1px solid var(--line);padding:4px 8px}.keys td:first-child{color:var(--muted)}.keys button{width:150px;padding:6px 10px;font-weight:500}.keys button.wait{color:#e8c547;border-color:#e8c547}#settings{z-index:10}.cls .quota{float:right;color:var(--muted);font-size:11px}.cls.full{opacity:.4;cursor:not-allowed}
