body{color:#fff;touch-action:none;-webkit-touch-callout:none;user-select:none;background:#031921;margin:0;padding:0;font-family:HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;font-weight:300;overflow:hidden}#game{touch-action:none;flex-direction:column;width:100%;height:100%;display:flex;position:absolute}#game canvas{object-fit:contain;image-rendering:-moz-crisp-edges;image-rendering:-webkit-crisp-edges;image-rendering:pixelated;image-rendering:crisp-edges;height:100%}#controller{touch-action:none;opacity:.8;width:100%;height:210px;display:none;position:fixed;bottom:0}#controller_dpad{width:184px;height:184px;position:absolute;bottom:20px;left:0}#controller_dpad:before{content:"";background:radial-gradient(#5c5c5c 0%,#555 59%,#5c5c5c 60%);width:48px;height:48px;display:block;position:absolute;top:68px;left:68px}#controller_left{background:radial-gradient(#666 0%,#5c5c5c 80%);border-top-left-radius:4px;border-bottom-left-radius:4px;width:48px;height:48px;position:absolute;top:68px;left:20px}#controller_right{background:radial-gradient(#666 0%,#5c5c5c 80%);border-top-right-radius:4px;border-bottom-right-radius:4px;width:48px;height:48px;position:absolute;top:68px;left:116px}#controller_up{background:radial-gradient(#666 0%,#5c5c5c 80%);border-top-left-radius:4px;border-top-right-radius:4px;width:48px;height:48px;position:absolute;top:20px;left:68px}#controller_down{background:radial-gradient(#666 0%,#5c5c5c 80%);border-bottom-right-radius:4px;border-bottom-left-radius:4px;width:48px;height:48px;position:absolute;top:116px;left:68px}#controller_a{position:absolute;bottom:110px;right:20px}#controller_b{position:absolute;bottom:80px;right:100px}.roundBtn{color:#440f1f;background:radial-gradient(#ab1465 0%,#8b1e57 100%);border-radius:64px;justify-content:center;align-items:center;width:64px;height:64px;font-size:32px;font-weight:700;line-height:64px;display:flex;box-shadow:0 4px 5px #0003}.capsuleBtn{color:#111;text-transform:uppercase;background:radial-gradient(#666 0%,#555 100%);border-radius:40px;justify-content:center;align-items:center;width:64px;height:32px;font-size:10px;font-weight:700;line-height:40px;display:flex;box-shadow:0 4px 5px #0003}#controller_start{position:absolute;bottom:20px;right:15px}#controller_select{position:absolute;bottom:20px;right:100px}.btnPressed{opacity:.5}.spinner{background-color:#031921;border:10px solid #306850;border-top-color:#88c070;border-radius:100%;width:50px;height:50px;margin:0 auto;animation:.8s linear infinite rotation}@-webkit-keyframes rotation{0%{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(360deg)}}@-moz-keyframes rotation{0%{-moz-transform:rotate(0)}to{-moz-transform:rotate(360deg)}}@-o-keyframes rotation{0%{-o-transform:rotate(0)}to{-o-transform:rotate(360deg)}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media only screen and (width<=640px){#game canvas{border:0;border-radius:0;width:100%;max-width:512px;margin-top:0}}@media only screen and (device-width<=812px) and (orientation:portrait){body{margin:0}#game{touch-action:none;width:100%;position:fixed}#game canvas{margin:0;display:block;width:100%!important;height:auto!important}}@media only screen and (device-width<=320px) and (orientation:portrait){#controller_dpad{bottom:-5px;left:-5px}#controller_a{bottom:95px;right:5px}#controller_b{right:80px}#controller_start{right:5px}#controller_select{right:80px}}@media only screen and (width<=500px) and (height<=400px){#controller{display:none}}@media only screen and (device-width<=300px) and (orientation:landscape){html,body{height:100%}body{justify-content:center;align-items:center;display:flex}#game:after{content:"PLEASE ROTATE ↻";color:#fff;font-size:24px;font-weight:700}#game canvas{max-width:480px;display:none}#controller{display:none}}@media only screen and (width>=300px) and (orientation:landscape){#controller{opacity:.5;bottom:50%;transform:translateY(50%)}}