body{width:100vw;padding:10px}#app{position:relative;width:100%;max-width:500px;margin:0 auto;font-family:Courier New,Courier,monospace;font-size:2em;font-weight:700}@keyframes color{0%{background:#3cc}20%{background:#33cc36}40%{background:#b8cc33}60%{background:#fcca00}80%{background:#33cc36}to{background:#3cc}}@keyframes color2{0%{background:#fff}10%{background:#bbc676}20%{background:#b8cc33}30%{background:#b8cc33}40%{background:#fcca00}50%{background:#fcca00}60%{background:#fcca00}70%{background:#b8cc33}80%{background:#b8cc33}90%{background:#bbc676}to{background:#fff}}.board{width:100%;background-color:#fff}.winner{animation-name:color2;animation-duration:3s;animation-timing-function:.5s;animation-iteration-count:10}.grid{display:grid;grid-template-columns:repeat(9,11.11%);grid-template-rows:repeat(9,11.11%)}.cell{border:1px solid #DDD;aspect-ratio:1;justify-content:center;align-items:center}.cell:hover{background-color:#d2dbb67f;font-weight:700;cursor:pointer}.cell-content{display:flex;height:98%;justify-content:center;align-items:center;font-size:1em;border:3px solid white}.pre-selected,.pre-selected:hover{background-color:#eeeeeed0;cursor:default}.selected .cell-content{border-color:red}.marked{background-color:pink!important}.is-valid{background-color:#adff2f!important}.is-invalid{background-color:red!important}.row{display:flex;flex-direction:row;width:100%}.col{display:flex;flex-direction:column}.row-gap{margin-bottom:1em}.status-message{margin-top:2em;align-items:center;justify-content:center;text-align:center}.color-keys{position:relative}.number,.action-key,.color-key{display:flex;border:1px solid black;width:10%;aspect-ratio:1;justify-content:center;align-items:center;cursor:pointer;border-radius:4px;margin-right:1%}.spacer-key{display:flex;border:none;width:10%;aspect-ratio:1;justify-content:center;align-items:center;cursor:pointer;border-radius:4px;margin-right:1%}.new-game-row{margin-top:2.5em;min-height:75px;align-content:center;align-items:center;justify-content:center;justify-items:center;flex-grow:1}.new-game-button-container{display:flex;flex-direction:column;flex-grow:1;width:23%}.new-game-button{flex-grow:0;border:1px solid #CCC;background-color:#eee;text-align:center;border-radius:4px;padding:10px;font-size:1em;font-weight:700;justify-self:center}.new-game-button:hover{cursor:pointer;background-color:#111;color:#fff}.number:hover,.action-key:hover{background-color:#ccc}.color-key:hover{border:2px solid black}.cell-2,.cell-5,.cell-11,.cell-14,.cell-20,.cell-23,.cell-29,.cell-32,.cell-38,.cell-41,.cell-47,.cell-50,.cell-56,.cell-59,.cell-65,.cell-68,.cell-74,.cell-77{border-right:1px solid black}.cell-18,.cell-19,.cell-20,.cell-21,.cell-22,.cell-23,.cell-24,.cell-25,.cell-26,.cell-45,.cell-46,.cell-47,.cell-48,.cell-49,.cell-50,.cell-51,.cell-52,.cell-53{border-bottom:1px solid black}.level-prompt{position:absolute;height:100%;width:100%;max-width:800px;top:0;left:0;z-index:100;background-color:transparent}.level-prompt-form{margin:10px auto;width:80%;background-color:#fff;border:1px solid #CCC;border-radius:8px;padding:0 1em 1em}.level-selection .row{margin-bottom:1em}.level-selection .col{width:25%;margin-right:2em}.level-selection .label{height:98%;vertical-align:middle;font-weight:400;margin:auto 0}.level-selection .selected{font-weight:700}.level-button{margin-left:10px}@media screen and (max-width: 500px){#app{font-size:1.75em}.cell-content{font-size:.8em}}.difficulty-button[data-v-3cea6a0b]{display:grid;background:#fff;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(5,1fr);border:1px solid #CCC;border-radius:5px;height:100%}.difficulty-button[data-v-3cea6a0b]:hover{background:#9acd32}.difficulty-cell[data-v-3cea6a0b]{display:flex;aspect-ratio:1;border:1px solid #CCC}.selected[data-v-3cea6a0b]{border-color:#111;background-color:#111}