.utt{--accent:#6aa8f0}.utt-board{display:flex;align-items:center;justify-content:center;position:relative;padding:14px}.ut-big{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:min(68vh,100%,540px);aspect-ratio:1}.ut-board{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:6px;border:1px solid rgba(106,168,240,.22);border-radius:12px;background:rgba(14,20,34,.55);transition:box-shadow .2s,border-color .2s}.ut-board.act{border-color:var(--accent);box-shadow:0 0 14px #6aa8f059,0 0 0 1px var(--accent) inset}.ut-board.wx,.ut-board.wo,.ut-board.wd{opacity:.92}.ut-cell{appearance:none;border:0;border-radius:7px;background:rgba(28,38,58,.7);cursor:pointer;aspect-ratio:1;display:grid;place-items:center;padding:0;touch-action:manipulation;transition:background .12s}.ut-cell:not(:disabled):hover{background:rgba(106,168,240,.25)}.ut-cell.ok{background:rgba(106,168,240,.12)}.ut-cell:disabled{cursor:default}.ut-cell.last{outline:2px solid rgba(255,216,138,.75)}.ut-cell span{font:800 clamp(13px,3.4vmin,24px)/1 var(--font-mono)}.ut-cell .x{color:#6ae0b8}.ut-cell .o{color:#f0a06a}.ut-bigmark{position:absolute;inset:0;display:grid;place-items:center;border-radius:12px;font:800 clamp(40px,11vmin,86px)/1 var(--font-mono);background:rgba(6,10,18,.55);backdrop-filter:blur(1px)}.ut-bigmark.x{color:#6ae0b8}.ut-bigmark.o{color:#f0a06a}.ut-board.wd:after{content:"–";position:absolute;inset:0;display:grid;place-items:center;font:800 60px/1 monospace;color:#dfe9ff59;background:rgba(6,10,18,.45);border-radius:12px}.ut-over[hidden]{display:none}.ut-over{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:rgba(6,10,18,.78);backdrop-filter:blur(4px);border-radius:16px;z-index:5;pointer-events:none}.ut-over b{font:800 64px/1 var(--font-mono);color:var(--accent)}.ut-over span{font:700 16px/1.4 var(--font-sans);color:#dfe9ff}#turn.tx{color:#6ae0b8}#turn.to{color:#f0a06a}