.tetris-game-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.tetris-game-container{background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);border-radius:20px;padding:20px;box-shadow:0 20px 40px #00000080;max-width:900px;width:95%;max-height:90vh;overflow-y:auto}.tetris-game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;color:#fff}.tetris-game-header h2{margin:0;font-size:2rem;font-weight:700;background:linear-gradient(45deg,#ff6b6b,#4ecdc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-buttons{display:flex;gap:10px;align-items:center}.mobile-switch-btn{background:linear-gradient(45deg,#4ecdc4,#45b7aa);border:none;color:#fff;padding:8px 16px;border-radius:20px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0003}.mobile-switch-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000004d;background:linear-gradient(45deg,#45b7aa,#3cadcf)}.close-button{background:#ffffff1a;border:none;color:#fff;font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.close-button:hover{background:#fff3;transform:scale(1.1)}.tetris-game-content{display:flex;gap:20px;align-items:flex-start;flex-direction:column}.tetris-topbar{display:flex;justify-content:center;align-items:center;gap:16px;align-self:center}.tetris-topbar .tetris-info{display:flex;align-items:baseline;gap:16px;min-height:auto;padding:12px 16px}.tetris-topbar .tetris-info .info-item{margin-bottom:0;justify-content:flex-start;gap:6px;align-items:center}.tetris-topbar .next-piece-container{padding:8px 12px}.tetris-game-board{display:grid;grid-template-columns:repeat(10,40px);grid-template-rows:repeat(20,40px);gap:1px;background:#000;border:2px solid #4ecdc4;border-radius:8px;padding:6px;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0 auto}.tetris-cell.clearing{animation:lineBlink .18s ease-in-out alternate 2;box-shadow:0 0 8px #fff9}@keyframes lineBlink{0%{filter:brightness(1)}to{filter:brightness(2)}}@media (max-width: 768px){.tetris-game-container{max-width:100vw;width:100vw;height:100vh;border-radius:0;padding:12px}.tetris-game-content{gap:8px;align-items:stretch}.tetris-game-board{margin:0 auto;grid-template-columns:repeat(10,22px);grid-template-rows:repeat(20,22px)}.tetris-cell{width:22px;height:22px}.tetris-sidebar{flex-direction:column;width:auto}.next-piece-container,.tetris-info,.tetris-controls{flex:1}}@media (max-width: 768px){.tetris-game-content{flex-direction:column;align-items:flex-start;gap:8px;flex-wrap:nowrap}.tetris-game-board{grid-template-columns:repeat(10,20px);grid-template-rows:repeat(20,20px)}.tetris-cell{width:20px;height:20px}.tetris-sidebar{flex-direction:column;justify-content:flex-start;width:auto;min-width:120px;gap:8px}.next-piece-container,.tetris-info,.tetris-controls{flex:none;margin:0}}.tetris-cell{width:48px;height:48px;border-radius:2px}.tetris-sidebar{display:flex;flex-direction:column;gap:18px;min-width:220px}.tetris-info{background:#ffffff1a;border-radius:10px;padding:18px;color:#fff;min-height:220px}.info-item{display:flex;justify-content:space-between;margin-bottom:18px}.info-item:last-child{margin-bottom:0}.label{font-weight:700;font-size:.8rem;line-height:1}.value{color:#3cadcf;font-weight:700;font-size:1.4rem;letter-spacing:1px;font-variant-numeric:tabular-nums;line-height:1}.next-piece-container{background:#ffffff1a;border-radius:10px;padding:8px;color:#fff;text-align:center}.next-piece-container h3{margin:0 0 10px;font-size:1rem}.next-piece-grid{display:grid;grid-template-columns:repeat(4,18px);grid-template-rows:repeat(4,18px);gap:1px;justify-content:center}.next-cell{width:20px;height:20px;border-radius:2px;border:1px solid rgba(255,255,255,.1)}.tetris-controls{background:#ffffff1a;border-radius:10px;padding:10px;color:#fff}.controls-text{font-size:.9rem;line-height:1.4}.controls-text div{margin-bottom:4px}.audio-toggle,.mobile-toggle{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 12px;border-radius:15px;font-size:.8rem;cursor:pointer;transition:all .3s ease;margin-top:8px;width:100%}.audio-toggle:hover,.mobile-toggle:hover{background:#ffffff4d;transform:translateY(-1px)}.mobile-toggle{background:linear-gradient(45deg,#4ecdc4,#45b7aa);border:none;font-weight:700}.tetris-game-actions{margin-top:20px;display:flex;justify-content:center;align-items:center;gap:12px}.start-button,.restart-button,.pause-button,.resume-button{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);border:none;color:#fff;padding:12px 24px;border-radius:25px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0003}.start-button:hover,.restart-button:hover,.pause-button:hover,.resume-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.pause-button{background:linear-gradient(45deg,#ffa726,#ff8a65)}.resume-button{background:linear-gradient(45deg,#66bb6a,#4caf50)}.game-over{text-align:center;color:#fff}.game-over-text{font-size:1.5rem;font-weight:700;margin-bottom:10px;color:#333}.final-score{font-size:1.2rem;margin-bottom:15px;color:#4ecdc4}@media (max-width: 480px){.tetris-game-container{max-width:100vw;width:100vw;height:100vh;border-radius:0;padding:8px;overflow-y:auto;overflow-x:hidden}.tetris-game-header h2{font-size:1.4rem}.mobile-switch-btn{padding:6px 12px;font-size:.8rem}.close-button{width:32px;height:32px;font-size:1.2rem}.tetris-game-content{gap:6px;align-items:flex-start}.tetris-game-board{grid-template-columns:repeat(10,24px);grid-template-rows:repeat(20,24px);padding:4px}.tetris-cell{width:24px;height:24px}.tetris-sidebar{min-width:120px;gap:8px}.tetris-info,.tetris-controls,.next-piece-container{padding:8px}.controls-text{font-size:.8rem}.next-piece-grid{grid-template-columns:repeat(4,12px);grid-template-rows:repeat(4,12px)}.next-cell{width:12px;height:12px}.tetris-game-actions{gap:6px;justify-content:center}.start-button,.restart-button,.pause-button,.resume-button{padding:10px 16px;font-size:.9rem}}@media (max-width: 480px){.control-btn{width:65px;height:65px;font-size:1.6rem}.control-row{gap:15px}}
