.ttt-status{font-size:1.25rem;font-weight:600}.ttt-board{grid-template-columns:repeat(var(--ttt-size,3), var(--ttt-cell-size,100px));grid-template-rows:repeat(var(--ttt-size,3), var(--ttt-cell-size,100px));background:var(--surface-border);border-radius:8px;gap:8px;width:fit-content;margin:0 auto;padding:8px;display:grid}.ttt-cell{width:100%;height:100%;color:inherit;background:var(--surface-soft);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;border:0;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:3.5rem;font-weight:800;transition:background .15s,transform .1s;display:flex;box-shadow:inset 2px 2px 4px #ffffff1a,inset -2px -2px 4px #0000004d}.ttt-board--large{--ttt-cell-size:64px;gap:6px}.ttt-board--large .ttt-cell{font-size:2.2rem}.ttt-cell:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}.ttt-cell:disabled{cursor:default}.ttt-cell:hover:not(.revealed){background:var(--surface-hover)}.ttt-cell:active:not(.revealed){transform:scale(.95)}.ttt-cell.revealed{cursor:default;background:#0f172a8c;box-shadow:inset 1px 1px 3px #00000080}.ttt-cell.x{color:var(--accent-color);text-shadow:0 0 10px #3b82f666}.ttt-cell.o{color:#ef4444;text-shadow:0 0 10px #ef444466}@media (width<=640px){.ttt-status{font-size:1.1rem}.ttt-board{--ttt-cell-size:80px;gap:5px}.ttt-board--large{--ttt-cell-size:min(11vw, 46px);gap:4px}.ttt-cell{font-size:2.5rem}.ttt-board--large .ttt-cell{font-size:1.6rem}}