:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#e8edf4;background:#0a0d12;color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 0%,#182231 0,#0a0d12 42%)}main{width:min(1180px,94vw);margin:38px auto}.topbar{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.eyebrow{font:700 11px/1.2 ui-monospace,monospace;letter-spacing:.18em;color:#8ea2bb}h1{font-size:clamp(34px,6vw,64px);line-height:.9;margin:8px 0 0;letter-spacing:-.055em}h2{margin-top:0}.panel{background:rgba(15,20,28,.88);border:1px solid #273241;border-radius:18px;box-shadow:0 20px 60px #0007}.pill{font-size:13px;border:1px solid #344152;padding:8px 12px;border-radius:999px}.online{color:#94f5b0;border-color:#285d39}.offline{color:#ff9d9d}.lobby{max-width:500px;padding:26px}label{display:grid;gap:8px;font-size:13px;color:#aeb9c8}input,button{border:1px solid #344152;border-radius:11px;background:#111821;color:#eef3fa;font:inherit;padding:12px 14px}input:focus{outline:2px solid #5c95ff55;border-color:#5c95ff}button{cursor:pointer;font-weight:700}button:hover{border-color:#6a7b91}.primary{background:#e8edf4;color:#0a0d12;border-color:#e8edf4}.actions{margin:15px 0}.actions button{width:100%}.joinrow{display:grid;grid-template-columns:1fr auto;gap:8px}.joinrow input{text-transform:uppercase;letter-spacing:.18em}.hint{font-size:12px;line-height:1.5;color:#76869a}.error{color:#ff9090;min-height:18px;font-size:13px}.hidden{display:none!important}.game{display:grid;grid-template-columns:285px 1fr;gap:18px}.sidebar{padding:18px;height:max-content}.roomhead{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding-bottom:15px;border-bottom:1px solid #25303e;font-family:ui-monospace,monospace}.roomhead span{font-size:10px;color:#74859b}.roomhead strong{letter-spacing:.12em}.roomhead button{padding:6px 9px;font-size:11px}.player{display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:center;padding:15px 2px;border-bottom:1px solid #202a36}.player i{display:block;width:20px;height:20px;border-radius:50%}.player.black i{background:#050608;border:1px solid #3b4149}.player.white i{background:#f1f3f5;border:1px solid #fff}.player small{display:block;color:#718197;font-size:9px;letter-spacing:.15em}.player b{font-size:14px}.player span{width:7px;height:7px;border-radius:50%;background:#3c4652}.player span.on{background:#62d983;box-shadow:0 0 9px #62d983}.status{font-weight:750;font-size:17px;line-height:1.35;padding:20px 2px}.meta{display:flex;justify-content:space-between;color:#8392a5;font-size:12px;padding-bottom:14px}.sidebar>button{width:100%;margin-top:8px}.boardwrap{display:flex;padding:16px;min-width:0}canvas{width:100%;height:auto;aspect-ratio:1;display:block;border-radius:12px;background:#c99451;touch-action:manipulation}@media(max-width:780px){main{margin:20px auto}.game{grid-template-columns:1fr}.sidebar{order:2}.boardwrap{order:1;padding:8px}.topbar{align-items:center}}