:root{--bg:#1a1d23;--panel:#23272f;--text:#e6e2d8;--muted:#9a958a;--accent:#c9a35c;--cell-a:#b08d57;--cell-b:#8f6f43;--corner:#6e5230;--throne:#7d5f38;--target:#4f8f5a}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);justify-content:center;min-height:100vh;margin:0;font-family:Georgia,Times New Roman,serif;display:flex}#app{width:100%;max-width:640px;padding:24px 16px}h1{text-align:center;letter-spacing:.15em;color:var(--accent);font-weight:400}.panel{background:var(--panel);border:1px solid #333a44;border-radius:10px;padding:20px}button{background:var(--accent);color:#1a1d23;cursor:pointer;border:none;border-radius:6px;padding:10px 18px;font-family:inherit;font-size:15px}button:hover{filter:brightness(1.1)}button.secondary{color:var(--text);background:#3a4048}input{color:var(--text);letter-spacing:.3em;text-transform:uppercase;text-align:center;background:#171a1f;border:1px solid #3a4048;border-radius:6px;width:120px;padding:10px;font-family:inherit;font-size:18px}.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:14px 0;display:flex}.muted{color:var(--muted);text-align:center;font-size:14px}#status{text-align:center;min-height:24px;margin:10px 0;font-size:18px}#room-line{text-align:center;color:var(--muted);margin-bottom:12px;font-size:14px}#room-line button{margin-left:8px;padding:4px 10px;font-size:13px}#clocks{justify-content:space-between;min-height:34px;margin-bottom:10px;display:flex}.clock{background:var(--panel);font-variant-numeric:tabular-nums;color:var(--muted);border:1px solid #333a44;border-radius:6px;padding:6px 14px;font-size:18px}.clock.active{color:var(--text);border-color:var(--accent)}#board{aspect-ratio:1;-webkit-user-select:none;user-select:none;border:3px solid #4a3a24;border-radius:6px;grid-template-columns:repeat(9,1fr);display:grid;overflow:hidden}.cell{cursor:pointer;justify-content:center;align-items:center;display:flex;position:relative}.cell.a{background:var(--cell-a)}.cell.b{background:var(--cell-b)}.cell.corner{background:var(--corner)}.cell.throne{background:var(--throne)}.cell.corner:after,.cell.throne:after{content:"";border:2px solid #00000059;border-radius:4px;position:absolute;inset:30%}.cell.last-move{box-shadow:inset 0 0 0 3px #ffffff73}.cell.target:before{content:"";background:var(--target);opacity:.85;z-index:1;border-radius:50%;width:34%;height:34%;position:absolute}.piece{z-index:2;border-radius:50%;width:72%;height:72%;box-shadow:0 2px 4px #00000073}.piece.B{background:radial-gradient(circle at 35% 30%,#4a4a52,#141418)}.piece.W{background:radial-gradient(circle at 35% 30%,#fff,#b9b2a4)}.piece.K{border:3px solid var(--accent);background:radial-gradient(circle at 35% 30%,#fff,#cfc7b4)}.cell.selected .piece{outline:3px solid var(--accent);outline-offset:2px}.error{color:#d9707e;text-align:center;min-height:20px;font-size:14px}
