.grid{pointer-events:none}.grid path{fill:none;stroke:var(--line);stroke-width:.9;stroke-linecap:round;stroke-linejoin:round}.grid .frame{stroke-width:1.5}.guide{fill:var(--line-strong);opacity:.3;transform-box:fill-box;transform-origin:center;transition:opacity .2s ease}.cell.filled .guide,.cell.pending .guide{opacity:0}.cell-hit{fill:transparent;stroke:transparent;transition:fill .15s ease}.cell .mark path{stroke-width:2.4}.mark.pending{opacity:.6}.cell.last[data-mark=X] .cell-hit{fill:color-mix(in srgb,var(--x) 24%,var(--board))}.cell.last[data-mark=O] .cell-hit{fill:color-mix(in srgb,var(--o) 24%,var(--board))}#board[data-tap=place] .cell:not(.filled){cursor:pointer}@media(hover:hover){#board[data-tap=place] .cell:not(.filled):not(.pending):hover .cell-hit{fill:color-mix(in srgb,var(--turn-soft) 80%,transparent)}}#board[data-tap=zoom]{cursor:zoom-in}.cell.pending .cell-hit{fill:var(--turn-soft);stroke:var(--turn);stroke-width:.8;stroke-dasharray:2 2}.cell:focus-visible .cell-hit{stroke:var(--focus);stroke-width:1.8;stroke-dasharray:none}.win-line{fill:none;stroke-width:3.4;stroke-linecap:round}#board.over .cell:not(.win) .mark{opacity:.3}#board.over.drawn .cell .mark{opacity:.5}#btn-back:not(.cancel) .icon-cancel,#btn-back.cancel .icon-zoom-out,#btn-confirm:not(.again) .icon-again,#btn-confirm.again .icon-confirm{display:none}.sheet-text .note strong.x{color:var(--x)}.sheet-text .note strong.o{color:var(--o)}.sheet .toggle+.sheet-text{margin-top:10px}