.user-select{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}.level-button{font-family:'Press Start 2P',monospace;font-size:12px;background:#444;color:#fff;border:2px solid #fff;border-radius:4px;padding:4px 0;image-rendering:pixelated;box-shadow:4px 4px 0 #222;cursor:pointer;transition:all .1s}*{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;margin:0;padding:0;box-sizing:border-box;font-family:'Press Start 2P',monospace,'Microsoft YaHei',sans-serif}html,body{width:100vw;height:100vh;overflow:hidden;color:#fff;image-rendering:pixelated;display:flex;align-items:center;justify-content:center}body{background:#2a46a9 url(../img/bg.jpg);background-size:cover}.tetris-container,.tetris-player{position:relative;z-index:1;display:flex;flex-direction:column;align-items:stretch;justify-content:center}.tetris-container[data-mode='versus']{flex-direction:row;gap:14vw}.tetris-container[data-mode='versus']:before{content:':';position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%, -50%);width:2vw;font-size:2vw;margin:0;text-indent:0;text-align:center;user-select:none;overflow:hidden}.tetris-player{height:100%}.tetris-screen{display:flex;flex-direction:row;flex-wrap:nowrap;flex:1;border:3px solid #fff;box-sizing:border-box;align-items:flex-start;justify-content:center}.tetris-battle-score{position:absolute;z-index:2;top:50%;left:50%;margin:-3vw 0 0;transform:translateX(-6.5vw);width:6vw;height:6vw;line-height:6vw;text-align:center;font-size:2.4vw;color:#fff;font-family:'Press Start 2P',Arial,Helvetica,sans-serif;user-select:none;overflow:visible}.tetris-battle-score:last-child{transform:translateX(.5vw)}.tetris-battle-player{position:absolute;z-index:4;top:-0.8vw;left:0;width:6vw;font-size:1.6vw;margin:0;line-height:2vw;height:2vw;text-align:center;overflow:hidden}.tetris-battle-overlay{position:absolute;z-index:2;top:0;left:0;margin:0;width:100%;height:100%;border:3px solid #3498db;overflow:hidden}.tetris-battle-over,.tetris-battle-fly{z-index:1;width:100%;height:100%;overflow:hidden}.tetris-battle-over{position:relative;z-index:1}.tetris-battle-over:after{content:'';position:absolute;z-index:1;top:0;left:0;margin:0;width:100%;height:100%;background-color:#333;opacity:.3;overflow:hidden}.tetris-battle-title{position:relative;z-index:4;margin:12% auto 0;font-size:2.4vw;text-align:center;user-select:none;width:86%}.tetris-battle-winner{position:absolute;z-index:4;top:50%;left:50%;margin:0;transform:translate(-50%, 12vh);user-select:none;text-align:center;width:86%;overflow:hidden}.tetris-battle-actions{position:absolute;z-index:4;top:50%;left:50%;margin:0;transform:translate(-50%, 24vh);width:86%;text-align:center;color:#0afa04;overflow:hidden}.tetris-battle-fly{position:absolute;top:0;left:0}.tetris-battle-fly:last-child{z-index:2}.tetris-screen-main{position:relative;z-index:1;border-right:3px solid #ccc;image-rendering:pixelated;align-self:center;overflow:hidden}.tetris-screen-aside{flex:1;display:flex;flex-direction:column;gap:.5vh;justify-content:space-between;align-items:center;align-self:stretch;padding:1vh 0;overflow:hidden}.tetris-panel{padding:0 1vw;text-align:center;width:100%}.tetris-panel-text{font-size:1.6vh;line-height:1.4;color:#fff;text-shadow:1px 1px 0 #333;white-space:nowrap;margin:.5vh 0}.tetris-next{padding:2vh 1vh 0;display:flex;flex-direction:column;align-items:center}.tetris-next-title{color:#ff0;font-size:1.6vh;text-shadow:2px 2px 0 #333;white-space:nowrap}.tetris-next-piece{margin:0 auto;width:96%;border:none;image-rendering:pixelated;display:block;aspect-ratio:1}.tetris-hold{padding:2vh 1vh 0;display:flex;flex-direction:column;align-items:center}.tetris-hold-title{color:#ff0;font-size:1.6vh;text-shadow:2px 2px 0 #333;white-space:nowrap}.tetris-hold-piece{margin:0 auto;width:96%;border:none;image-rendering:pixelated;display:block;aspect-ratio:1}.tetris-highlight{color:#ff0}@font-face{font-family:'Press Start 2P';font-style:normal;font-weight:400;font-display:swap;src:url(../font/latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.tetris-controls{display:none;width:100%;justify-content:space-between;align-items:center;padding:6vw;box-sizing:border-box}.tetris-system-controls{display:flex;flex-direction:row;width:68vw;gap:4vw}.tetris-system-button{width:20vw;font-size:10px;text-align:center;border-radius:5px;padding:6px 0;user-select:none;cursor:pointer;transition:.1s;color:#fff;background:#333}.tetris-main-controls{display:flex;flex-direction:row;width:100%;padding-top:3vh;flex:1}.tetris-dpad{display:flex;margin-left:0;flex-direction:column;align-items:center;width:33.5vw}.tetris-dpad-mid{display:flex;align-items:center}.tetris-dpad-up,.tetris-dpad-down,.tetris-dpad-left,.tetris-dpad-right,.tetris-dpad-center{width:11.5vw;height:11.5vw;line-height:11.5vw;text-align:center;font-family:Arial,Helvetica,sans-serif;user-select:none;cursor:pointer;transition:.1s;background:#333}.tetris-dpad-up{border-radius:6px 6px 0 0}.tetris-dpad-down{border-radius:0 0 6px 6px}.tetris-dpad-left{border-radius:6px 0 0 6px}.tetris-dpad-right{border-radius:0 6px 6px 0}.tetris-dpad-center{position:relative}.tetris-dpad-center:after{content:'';position:absolute;top:50%;left:50%;width:80%;height:80%;border-radius:50%;transform:translate(-50%, -50%);box-shadow:inset 0 0 3px rgba(0,0,0,0.9)}.tetris-system-button:active,.tetris-dpad-up:active,.tetris-dpad-down:active,.tetris-dpad-left:active,.tetris-dpad-right:active{background-color:rgba(0,0,0,0.9)}.tetris-buttons{position:relative;z-index:1;margin-left:auto;width:33.5vw;height:33.5vw;gap:20px;aspect-ratio:1}.tetris-action-button{position:absolute;z-index:2;display:flex;justify-content:center;align-items:center;width:36%;height:36%;border-radius:50%;font-weight:bold;font-size:clamp(18px, 4vw, 14px);user-select:none;cursor:pointer;transition:.2s;color:#fff;box-shadow:0 4px 0 rgba(0,0,0,0.9)}.tetris-action-button:active{box-shadow:0 1px 0 rgba(0,0,0,0.9)}.tetris-button-a{bottom:0;left:50%;transform:translateX(-50%);background:#e74c3c}.tetris-button-a:active{transform:translateX(-50%) translateY(3px)}.tetris-button-b{top:50%;right:0;transform:translateY(-50%);background:#3498db}.tetris-button-b:active{transform:translateY(-50%) translateY(3px)}.tetris-button-x{top:50%;left:0;transform:translateY(-50%);background:#e74c3c}.tetris-button-x:active{transform:translateY(-50%) translateY(3px)}.tetris-button-y{top:0;left:50%;transform:translateX(-50%);background:#3498db}.tetris-button-y:active{transform:translateX(-50%) translateY(3px)}.tetris-button-a:active,.tetris-button-x:active{color:#3498db}.tetris-button-b:active,.tetris-button-y:active{color:#e74c3c}.tetris-hidden{display:none}@media screen and (max-width:320px){.tetris-container{flex-direction:column;width:100%;height:100vh;box-sizing:border-box}}@media screen and (max-width:375px){.tetris-container{flex-direction:column;width:100%;height:100vh;box-sizing:border-box}}@media screen and (max-width:480px){.tetris-container{flex-direction:column;width:100%;height:100vh;box-sizing:border-box}}@media screen and (max-width:320px){.tetris-screen{width:100%;box-sizing:border-box;flex-shrink:0}}@media screen and (max-width:375px){.tetris-screen{width:100%;box-sizing:border-box;flex-shrink:0}}@media screen and (max-width:480px){.tetris-screen{width:100%;box-sizing:border-box;flex-shrink:0}}@media screen and (max-width:320px){.tetris-main{flex:4}}@media screen and (max-width:375px){.tetris-main{flex:4}}@media screen and (max-width:480px){.tetris-main{flex:4}}@media screen and (max-width:320px){.tetris-next-piece,.tetris-hold-piece{width:72%}}@media screen and (max-width:375px){.tetris-next-piece,.tetris-hold-piece{width:72%}}@media screen and (max-width:480px){.tetris-next-piece,.tetris-hold-piece{width:72%}}@media screen and (max-width:320px){.tetris-panel.shortcuts{display:none}}@media screen and (max-width:375px){.tetris-panel.shortcuts{display:none}}@media screen and (max-width:480px){.tetris-panel.shortcuts{display:none}}@media screen and (max-width:320px){.tetris-controls{display:flex;flex-direction:column;flex:1;border:3px solid #fff;border-top:none}}@media screen and (max-width:375px){.tetris-controls{display:flex;flex-direction:column;flex:1;border:3px solid #fff;border-top:none}}@media screen and (max-width:480px){.tetris-controls{display:flex;flex-direction:column;flex:1;border:3px solid #fff;border-top:none}}/*# sourceMappingURL=tetris.css.map */