.om-settings{display:flex;flex-wrap:wrap;gap:8px}
.om-ai{display:flex;flex-wrap:wrap;gap:8px}
.om-status{margin:16px 0 10px;text-align:center;font-weight:700}
.om-status[data-color="black"]::before,.om-status[data-color="white"]::before{content:'';display:inline-block;width:14px;height:14px;margin-right:8px;border-radius:50%;vertical-align:-2px;box-shadow:0 0 0 1px #0004}
.om-status[data-color="black"]::before{background:#1d2226}
.om-status[data-color="white"]::before{background:#fff}
.om-board{--wood:#e3b874;position:relative;width:min(100%,600px);aspect-ratio:1;margin:0 auto;border-radius:10px;background:var(--wood);box-shadow:inset 0 0 0 1px #0002}
.om-lines{position:absolute;inset:0;width:100%;height:100%;stroke:#5b4325;stroke-width:.04;fill:#5b4325}
.om-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(15,minmax(0,1fr));grid-template-rows:repeat(15,minmax(0,1fr))}
.om-cell{position:relative;display:grid;place-items:center;padding:0;background:none;touch-action:manipulation}
.om-cell:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:50%}
.om-stone{display:grid;place-items:center;width:86%;height:86%;border-radius:50%;font:700 clamp(7px,1.6vw,11px) var(--mono);box-shadow:0 1px 2px #0006}
.om-stone.black{background:radial-gradient(circle at 35% 30%,#555,#111 70%);color:#fff}
.om-stone.white{background:radial-gradient(circle at 35% 30%,#fff,#d8d8d2 75%);color:#222}
.om-cell.last .om-stone::after{content:'';position:absolute;width:22%;height:22%;border-radius:50%;background:var(--accent)}
.om-cell.win .om-stone{box-shadow:0 0 0 3px var(--accent),0 1px 2px #0006}
/* Hover and touch previews show a translucent stone of the colour to move. */
.om-cell.next-black:hover::before,.om-cell.next-white:hover::before,.om-cell.preview::before{content:'';width:80%;height:80%;border-radius:50%;opacity:.45}
.om-cell.next-black:hover::before,.om-cell.next-black.preview::before{background:#111}
.om-cell.next-white:hover::before,.om-cell.next-white.preview::before{background:#fff}
.om-cell.preview::before{opacity:.7}
.om-cell.forbidden::before{content:'×';color:#b0302a;font:700 clamp(12px,3vw,20px) var(--mono);opacity:.8}
.om-grid.busy .om-cell{cursor:default}
.om-message{text-align:center}
.om-tools{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px;margin-top:14px}
.om-check{margin-top:0}
.om-record{margin:10px 0 0;text-align:center;font-size:13px;color:var(--muted)}
@media(hover:none){.om-cell.next-black:hover::before,.om-cell.next-white:hover::before{content:none}}