@font-face{font-display:swap;font-family:"Press Start 2P";font-style:normal;font-weight:400;src:url(../fonts/press-start-2p-v15-latin-regular.woff2) format("woff2"),url(../fonts/press-start-2p-v15-latin-regular.ttf) format("truetype")}:root{--grid-size: 20px;--grid-gap: 2px;--background-color: #000;--grid-color: #1a1a1a;--tetromino-color: #00ff00;--last-placed-color: #00ff00;--border-color: #00ff00;--text-color: #00ff00}*{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:hidden;overscroll-behavior:none;-webkit-overflow-scrolling:touch}body{font-family:"Press Start 2P",cursive;background-color:var(--background-color);color:var(--text-color);display:flex;justify-content:flex-end;align-items:flex-end;height:100%;text-shadow:0 0 5px rgba(0,255,0,.5);padding:10px;box-sizing:border-box}.game-container{padding:10px;border-radius:8px;position:relative;width:100%;max-width:100%;margin:0 auto;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;overflow:hidden}.pause-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--background-color);display:none;flex-direction:column;justify-content:center;align-items:center;z-index:10;border-radius:10px}#start-overlay{background-color:var( --background-color );border-radius:10px;position:absolute;top:0;left:0;width:100%;height:100%;display:none;justify-content:center;align-items:center;text-align:center;z-index:10}.instructions{text-align:left;margin-bottom:20px;max-width:300px;margin-left:auto;margin-right:auto}.instructions p{font-size:.7em;margin-bottom:8px;text-align:center}.instructions ul+p{margin-top:32px}.instructions ul{list-style-type:disc;padding-left:20px}.instructions li{font-size:.7em;margin-bottom:4px}.instruction-set{width:100%}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:none;justify-content:center;align-items:center;text-align:center;z-index:10;border-radius:10px}#confirm-restart-overlay .overlay-content h2{margin-bottom:25px}#confirm-restart-overlay .button-container{display:flex;justify-content:center;gap:15px}.overlay-content{padding:20px;background-color:var(--grid-color);border:2px solid var(--border-color);border-radius:8px}.overlay h2{font-size:1.6em;color:var(--tetromino-color);margin-bottom:20px;text-shadow:0 0 10px rgba(0,255,0,.8)}.overlay p{font-size:1.2em;margin-bottom:20px}.overlay .instructions p{font-size:.7em;margin-bottom:8px}.overlay-button{background-color:var(--grid-color);color:var(--text-color);border:2px solid var(--border-color);padding:10px 20px;font-family:inherit;font-size:1em;cursor:pointer;transition:all .2s;text-transform:uppercase}.overlay-button:hover{background-color:var(--tetromino-color);color:var(--background-color)}.pause-text{margin-bottom:20px;font-size:2em;color:var(--tetromino-color);text-shadow:0 0 10px rgba(0,255,0,.8);animation:pulse 1.5s infinite}#restart-from-pause-button{margin-top:10px}@keyframes pulse{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}h1{font-size:1.6em;margin-bottom:10px;text-transform:uppercase;letter-spacing:2px}.score-container{display:flex;justify-content:space-around;margin-bottom:10px}.button-container{display:flex;justify-content:center;gap:10px;margin-bottom:10px}.score,.high-score{font-size:1.2em}.toggle-button{background-color:var(--grid-color);color:var(--text-color);border:2px solid var(--border-color);padding:8px 16px;font-family:inherit;font-size:1em;cursor:pointer;transition:all .2s}.toggle-button:hover{background-color:var(--tetromino-color);color:var(--background-color)}.game-grid{display:grid;grid-template-columns:repeat(10,var(--grid-size));gap:var(--grid-gap)}.cell{width:var(--grid-size);height:var(--grid-size);background-color:var(--grid-color);border:1px solid var(--border-color)}.tetromino{box-shadow:inset 0 0 10px #00000080}.tetromino.type-0{background-color:#ff0}.tetromino.type-1{background-color:#0ff}.tetromino.type-2{background-color:purple}.tetromino.type-3{background-color:#ff7f00}.tetromino.type-4{background-color:#00f}.tetromino.type-5{background-color:red}.tetromino.type-6{background-color:#0f0}.ghost-piece{border:2px dashed var(--tetromino-color);box-sizing:border-box}.cell.line-clear-flash{animation:line-clear-flash 1.2s ease-in-out}@keyframes line-clear-flash{0%{background-color:inherit;transform:scale(1);box-shadow:none}8.33%{background-color:#fff!important;transform:scale(1.1);box-shadow:0 0 15px #fff}16.66%{background-color:inherit;transform:scale(1);box-shadow:none}25%{background-color:#fff!important;transform:scale(1.1);box-shadow:0 0 15px #fff}33.33%{background-color:inherit;transform:scale(1);box-shadow:none}41.66%{background-color:#fff!important;transform:scale(1.1);box-shadow:0 0 15px #fff}50%,to{background-color:inherit;transform:scale(1);box-shadow:none}}.invisible{opacity:.8;filter:brightness(.7)}.last-placed{background-color:var(--last-placed-color);opacity:.7}.game-content{display:flex;flex-direction:column;align-items:center;gap:10px;flex:0 0 auto}.game-area{display:flex;justify-content:center;width:100%}.game-grid-wrapper{position:relative}.gesture-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;z-index:5;pointer-events:auto}.top-stats{display:flex;justify-content:center;gap:8px;margin-bottom:5px}.stat-box{background-color:var(--grid-color);border:1px solid var(--border-color);border-radius:3px;padding:4px 6px;text-align:center;min-width:50px}.stat-box h3{font-size:.5em;margin:0 0 2px;color:var(--text-color);text-transform:uppercase}.stat-box span{font-size:.7em;color:var(--tetromino-color);display:block}.game-body{display:flex;justify-content:center;align-items:start;gap:8px;width:100%}.side-box{background-color:var(--grid-color);border:1px solid var(--border-color);border-radius:3px;padding:4px;text-align:center;width:calc(var(--grid-size) * 2.5);height:calc(var(--grid-size) * 2.5);min-width:0;overflow:hidden;display:flex;flex-direction:column;justify-content:center;flex-shrink:0}.side-box h3{font-size:calc(var(--grid-size) * .3);margin:calc(var(--grid-size) * .1) 0 4px 0;color:var(--text-color);text-transform:uppercase}.side-box span{font-size:calc(var(--grid-size) * .4);color:var(--tetromino-color);display:block}.piece-preview-grid{display:grid;grid-template-columns:repeat(4,calc(var(--grid-size) * .4));grid-template-rows:repeat(4,calc(var(--grid-size) * .4));gap:2px;margin:0 auto;border:none;width:calc(var(--grid-size) * 1.8);height:calc(var(--grid-size) * 1.8)}.piece-preview-grid .cell{width:calc(var(--grid-size) * .4);height:calc(var(--grid-size) * .4);background-color:transparent;border:none}.piece-preview-grid .tetromino{box-shadow:inset 0 0 5px #0000004d}.piece-preview-grid .cell.tetromino.type-0{background-color:#ff0}.piece-preview-grid .cell.tetromino.type-1{background-color:#0ff}.piece-preview-grid .cell.tetromino.type-2{background-color:purple}.piece-preview-grid .cell.tetromino.type-3{background-color:#ff7f00}.piece-preview-grid .cell.tetromino.type-4{background-color:#00f}.piece-preview-grid .cell.tetromino.type-5{background-color:red}.piece-preview-grid .cell.tetromino.type-6{background-color:#0f0}.game-header{text-align:center}.game-header h1{font-size:1.5em}.button-container{gap:5px;margin-bottom:5px}.toggle-button{padding:4px 8px;font-size:.8em}.stat-item{text-align:center;padding:10px;background-color:#000;border:1px solid var(--border-color);border-radius:5px}.stat-item h3{font-size:.9em;margin-bottom:8px;color:var(--text-color);text-transform:uppercase}#next-piece-container{display:flex;flex-direction:column;align-items:center}.stat-item span{font-size:1.2em;color:var(--tetromino-color);display:block}.next-piece-grid{display:grid;grid-template-columns:repeat(4,var(--grid-size));grid-template-rows:repeat(4,var(--grid-size));gap:var(--grid-gap);margin:0 auto;border:none}.next-piece-grid .cell{width:var(--grid-size);height:var(--grid-size);background-color:transparent;border:none}.next-piece-grid .tetromino{box-shadow:inset 0 0 5px #0000004d}.next-piece-grid .cell.tetromino.type-0{background-color:#ff0}.next-piece-grid .cell.tetromino.type-1{background-color:#0ff}.next-piece-grid .cell.tetromino.type-2{background-color:purple}.next-piece-grid .cell.tetromino.type-3{background-color:#ff7f00}.next-piece-grid .cell.tetromino.type-4{background-color:#00f}.next-piece-grid .cell.tetromino.type-5{background-color:red}.next-piece-grid .cell.tetromino.type-6{background-color:#0f0}#sound-toggle.sound-enabled{background-color:#0f0;color:#000}#sound-toggle:hover{background-color:#0f0!important;color:#000!important}#sound-toggle.sound-enabled:hover{background-color:var(--grid-color)!important;color:var(--text-color)!important}