.oc-center .oc-free #board{--W:min(100cqw,(100cqh - 40px)*172/192);width:var(--W)!important;aspect-ratio:172/192!important;display:block;box-shadow:none;overflow:visible}
#board svg{display:block}.hx{cursor:pointer}.hx polygon{stroke:#302e2b;stroke-width:.6}
.hx .ov{fill:#f6d36066}.hx.lfrom .ov{fill:#f6d36070}.hx.lto .ov{fill:#f6d360b0}.hx.sel .ov{fill:#f6d360c0}.hx.check .ov{fill:#ff3b3baa}
#board text{font-size:12px;text-anchor:middle;dominant-baseline:central;pointer-events:none}
#board text.w{fill:#fff;stroke:#000;stroke-width:.5;paint-order:stroke}#board text.b{fill:#111;stroke:#fff8;stroke-width:.3;paint-order:stroke}
.hx .td{fill:#0006;pointer-events:none}.hx .tc{fill:none;stroke:#0008;stroke-width:1.5;stroke-linejoin:round;pointer-events:none}.hx:hover polygon:first-child{filter:brightness(1.06)}

/* the shared layout pins the three panels to grid columns 1-3; on narrow screens stack them instead */
@media (max-width:900px){html body.oc-game>.oc-left,html body.oc-game>.oc-center,html body.oc-game>.oc-right{grid-area:auto}.oc-center .oc-free #board{--W:min(100cqw,(100svh - 60px)*172/192)}}
