*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}img{max-width:100%}body{background-color:#000;font-family:Courier New,Courier,monospace;font-size:24px}.hidden{display:none!important}.mode{position:absolute;top:0;bottom:0;width:100%;background-color:#000;color:#cdcdcd;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:100}h1{font-size:60px;font-weight:700;margin-bottom:.2em}.modeSelect{width:80%;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.modeSelect input[type=radio]{display:none}.modeSelect #solo:checked~.modeSelectors>label[for=solo],.modeSelect #versus:checked~.modeSelectors>label[for=versus]{background-color:#fff9;border:2px solid #457400}.modeSelect .player[data-player=second]{height:0px;overflow:hidden;transition:height .25s ease-in}.modeSelect #versus:checked~.players .player[data-player=second]{height:33px}.modeSelect .modeSelectors{font-size:0}.modeSelect .modeSelectors>label{display:inline-block;font-size:20px;border-radius:10px;background-color:#fff3;padding:5px;cursor:pointer;transition:background-color .25s ease-in-out}.modeSelect .modeSelectors>label:first-of-type{margin-right:1em}.modeSelect .modeSelectors>label:hover{background-color:#fff9}.modeSelect .modeSelectors>label img{height:5em}.modeSelect .players{margin-top:30px;flex:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.modeSelect .player{margin-bottom:20px}.modeSelect .players label{border-radius:0;font-size:20px}.modeSelect .players input{-moz-appearance:none;appearance:none;-webkit-appearance:none;outline:none;border:none;font-family:inherit;font-weight:700;font-size:20px;padding:5px;background-color:#fff9}.modeSelect button{-moz-appearance:none;appearance:none;-webkit-appearance:none;outline:none;border:none;font-family:inherit;font-size:30px;font-weight:700;text-transform:uppercase;padding:.3em;border-radius:5px;cursor:pointer}.modeSelect button:hover{background-color:#050}.canvas{position:absolute;top:0;bottom:0;width:100%;display:flex;justify-content:center;align-items:center}.pauseOverlay{position:absolute;top:0;bottom:0;width:100%;background-color:#000c;color:#cdcdcd;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:100}.pauseOverlay h2{margin-bottom:20px}.pauseOverlay .info{width:90%;max-width:900px;text-align:center;line-height:1.5em}.pauseOverlay .info span{font-weight:700;color:#adff2f}.pauseOverlay .info p:last-child{margin-top:20px}.pauseOverlay .buttons{margin-top:20px}.pauseOverlay button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;background-color:#fff3;color:#fff;font-family:inherit;font-size:16px;font-weight:700;text-transform:uppercase;padding:.5em;cursor:pointer;transition:.25s ease-in-out}.pauseOverlay button:hover{background-color:#fff9;color:#2c2c2c}.gameOver{position:absolute;top:0;bottom:0;width:100%;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:100}.gameOver .finalResult{color:#cdcdcd;width:90%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.gameOver h2{flex:100%;text-align:center;font-size:36px;font-weight:700;text-transform:uppercase;margin-bottom:1em}.gameOver .winner{flex:100%;text-align:center;margin-bottom:.5em}.gameOver .winner span{text-transform:uppercase;font-weight:700;color:#adff2f}.gameOver .player{flex:50%;text-align:center;border:1px solid #333333;padding:5px;background-color:#4d0101}.gameOver .player .name{font-size:28px;font-weight:700;margin-bottom:.3em}.gameOver .player .score span{font-weight:700}.gameOver .winner[data-won=playerOne]~#playerOne,.gameOver .winner[data-won=playerTwo]~#playerTwo{background-color:#014d12}.gameOver .winner[data-won=draw]~#playerOne,.gameOver .winner[data-won=draw]~#playerTwo{background-color:#000}.gameOver .buttons{flex:100%;margin-top:15px;text-align:center}.gameOver button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;background-color:#fff3;color:#fff;font-family:inherit;font-size:16px;font-weight:700;text-transform:uppercase;padding:.5em;cursor:pointer;transition:.25s ease-in-out}.gameOver button:hover{background-color:#fff9;color:#2c2c2c}
