.app{display:flex;flex-direction:column;justify-content:center}.app>.board{display:flex;flex-direction:column;gap:30px}.app>.board>.game-type{display:flex;justify-content:center;gap:30px}.app>.board>.game-type button{background-color:#f6f4f3;border:2px solid rgb(182,178,178);padding:8px 15px;border-radius:5px;cursor:pointer;font-size:16px}.app>.board>.game-type button.selected,.app>.board>.game-type button:hover{border:2px solid purple;transition:all ease-in-out .4s}.app>.board>.game-type button.disabled{border:none;cursor:no-drop}.app>.board>.container{display:flex;flex-direction:column;margin:auto;gap:5px}.app>.board>.container>.row1,.row2,.row3{display:flex;gap:5px}.app>.board>.container .boxes{background-color:#5d5dea;width:80px;height:80px;border-radius:10px;cursor:pointer;font-size:3em;outline:none;border:none;color:#000}.app>.board>.container .boxes:hover{background-color:#8a8af0}.app>.board>.container .boxes.disabled{background-color:#8a8af0}.score-container{display:flex;margin:auto;gap:20px}.score-container>.card{background-color:#88a4f0;padding:5px 25px;text-align:center;font-size:25px;font-weight:700}.score-container>.card.X{color:#ff007f}.score-container>.card.Y{color:#0fc}.btn-container{display:flex;margin:auto;gap:50px}.btn-container button{border:none;outline:none;border-radius:8px;padding:10px;font-size:1rem;cursor:pointer;color:#fff}.btn-container .undo{background-color:red}.btn-container .undo:hover{background-color:#c00}.undo.disabled{background-color:#c00;cursor:no-drop}.btn-container .newGame{background-color:green}.btn-container .newGame:hover{background-color:#004d00}
