.tictactoe-board{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:10px;width:100%;max-width:400px;aspect-ratio:1/1;margin:0 auto}.tictactoe-cell{background-color:#f0f0f0;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:clamp(2rem,8vw,5rem);font-weight:700;cursor:pointer;transition:all .2s;aspect-ratio:1/1;box-shadow:0 2px 5px rgba(0,0,0,.1);width:100%;height:0;padding-bottom:100%;position:relative}.tictactoe-cell:before{content:attr(data-content);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:1}.tictactoe-cell.x:before{content:"X"}.tictactoe-cell.o:before{content:"O"}.tictactoe-cell:hover{background-color:#e0e0e0}.tictactoe-cell.x{color:#e74c3c}.tictactoe-cell.o{color:#3498db}.game-result-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.7);backdrop-filter:blur(3px);border-radius:8px;z-index:10}.result-container{background-color:white;padding:2rem;border-radius:8px;text-align:center;box-shadow:0 4px 6px rgba(0,0,0,.1);max-width:90%}.result-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem;color:#333}@media (max-width:640px){.tictactoe-board{grid-gap:8px}.tictactoe-cell{border-radius:6px}.result-container{padding:1.5rem}.result-title{font-size:1.25rem}}.dark .tictactoe-cell{background-color:#2a303c;color:#f0f0f0}.dark .tictactoe-cell:hover{background-color:#374151}.dark .tictactoe-cell.x{color:#f87171}.dark .tictactoe-cell.o{color:#60a5fa}.dark .result-container{background-color:#2a303c;color:white}.dark .result-title{color:white}