:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#0f0f0f,#1a1a2e,#16213e);color:#fff;min-height:100vh;overflow:hidden}#root{min-height:100vh;display:flex;align-items:center;justify-content:center;width:100vw}.app{display:flex;gap:2rem;padding:1rem;max-width:1400px;width:100%;height:100vh;align-items:center;justify-content:center}.game-area{display:flex;flex-direction:column;align-items:center;gap:1rem}.game-board-container{position:relative;background:#0000004d;border:2px solid #333;border-radius:8px;padding:8px;box-shadow:0 0 20px #00ffff4d;transition:transform .1s ease-out}.game-board{display:grid;grid-template-columns:repeat(10,40px);grid-template-rows:repeat(20,40px);gap:1px;background:#000;border:2px solid #222;position:relative}.cell{width:40px;height:40px;transition:all .1s ease;position:relative}.cell.empty{background:#14141ecc;border:1px solid rgba(60,60,80,.3)}.cell.ghost{border:1px solid rgba(255,255,255,.2);background:#ffffff1a!important}.side-panel{display:flex;flex-direction:column;gap:1.5rem;min-width:200px}.next-piece{background:#0000004d;border:2px solid #333;border-radius:8px;padding:1rem;text-align:center}.next-piece h3{margin-bottom:.5rem;color:#0ff;font-size:1.1rem;text-transform:uppercase;letter-spacing:1px}.preview-board{display:grid;grid-template-columns:repeat(4,35px);grid-template-rows:repeat(4,35px);gap:1px;justify-content:center;background:#000;border:1px solid #222;padding:4px}.preview-board .cell{width:35px;height:35px}.scoreboard{background:#0000004d;border:2px solid #333;border-radius:8px;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.score-item{display:flex;justify-content:space-between;align-items:center;padding:.25rem 0;border-bottom:1px solid rgba(255,255,255,.1)}.score-item:last-child{border-bottom:none}.score-item .label{color:#aaa;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.score-item .value{color:#0ff;font-weight:700;font-size:1.1rem}.game-controls{background:#0000004d;border:2px solid #333;border-radius:8px;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.control-button{padding:.75rem 1rem;border:none;border-radius:4px;background:linear-gradient(145deg,#333,#222);color:#fff;font-size:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000004d}.control-button:hover{background:linear-gradient(145deg,#444,#333);transform:translateY(-1px);box-shadow:0 4px 8px #0006}.control-button:active{transform:translateY(0);box-shadow:0 1px 2px #0000004d}.control-button.primary{background:linear-gradient(145deg,#0ff,#08c);color:#000;font-weight:700}.control-button.primary:hover{background:linear-gradient(145deg,#3ff,#0ad)}.controls-help{margin-top:.5rem}.controls-help h4{color:#0ff;margin-bottom:.5rem;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.control-item{display:flex;justify-content:space-between;padding:.2rem 0;font-size:.8rem;color:#ccc}.control-item span:first-child{font-family:monospace;background:#ffffff1a;padding:2px 6px;border-radius:3px;font-size:.7rem}.game-over-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-in}.game-over-content{background:linear-gradient(145deg,#333,#222);border:2px solid #555;border-radius:12px;padding:2rem;text-align:center;box-shadow:0 10px 30px #00000080;animation:slideIn .3s ease-out}.game-over-content h2{color:#f66;margin-bottom:1rem;font-size:2rem;text-shadow:0 0 10px rgba(255,102,102,.5)}.game-over-content p{color:#ccc;margin-bottom:1.5rem;font-size:1.1rem}.pause-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:999}.pause-content{background:#000c;border:2px solid #00ffff;border-radius:8px;padding:2rem;text-align:center;box-shadow:0 0 20px #00ffff4d}.pause-content h2{color:#0ff;margin-bottom:.5rem;font-size:2rem;text-shadow:0 0 10px rgba(0,255,255,.5)}.pause-content p{color:#ccc;font-size:1rem}.particle-system{position:absolute;inset:0;pointer-events:none;z-index:10}.particle{position:absolute;pointer-events:none;z-index:10}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.app{flex-direction:column;gap:1rem;padding:.5rem;height:auto;min-height:100vh}.game-board{grid-template-columns:repeat(10,30px);grid-template-rows:repeat(20,30px)}.cell{width:30px;height:30px}.preview-board{grid-template-columns:repeat(4,25px);grid-template-rows:repeat(4,25px)}.preview-board .cell{width:25px;height:25px}.side-panel{min-width:250px;width:100%;max-width:300px}}.cell:not(.empty):not(.ghost){animation:cellGlow 2s ease-in-out infinite alternate}@keyframes cellGlow{0%{box-shadow:inset 2px 2px 4px #ffffff4d,inset -2px -2px 4px #0000004d}to{box-shadow:inset 2px 2px 4px #fff6,inset -2px -2px 4px #0003,0 0 8px #ffffff1a}}.mobile-controls{display:none;position:fixed;bottom:0;left:0;right:0;background:#000000e6;padding:1rem;z-index:1000;border-top:2px solid #333}.mobile-controls-top{display:flex;justify-content:space-between;margin-bottom:1rem}.mobile-controls-main{display:flex;justify-content:space-between;align-items:center;gap:1rem}.mobile-controls-left,.mobile-controls-right{flex:1;display:flex;justify-content:center}.mobile-controls-center{flex:1;display:flex;flex-direction:column;gap:.5rem;align-items:center}.mobile-btn{background:linear-gradient(145deg,#333,#222);border:2px solid #555;border-radius:12px;color:#fff;font-size:1.5rem;padding:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 8px #0000004d;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;min-width:60px;min-height:60px;display:flex;align-items:center;justify-content:center}.mobile-btn:active{background:linear-gradient(145deg,#444,#333);transform:scale(.95);box-shadow:0 2px 4px #0006}.mobile-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.mobile-btn.pause-btn{background:linear-gradient(145deg,#666,#444);font-size:1.2rem;min-width:50px;min-height:50px}.mobile-btn.rotate-btn{background:linear-gradient(145deg,#0ff,#08c);color:#000;font-weight:700}.mobile-btn.move-btn{background:linear-gradient(145deg,#4a4a4a,#2a2a2a);font-size:2rem;min-width:70px;min-height:70px}.mobile-btn.drop-btn{background:linear-gradient(145deg,#ff6b6b,#d63031);font-size:1.2rem;min-width:80px;min-height:50px}.mobile-btn.hard-drop{background:linear-gradient(145deg,#e17055,#d63031);font-weight:700}.touch-hint{position:absolute;top:10px;left:50%;transform:translate(-50%);background:#000c;color:#0ff;padding:.5rem 1rem;border-radius:20px;font-size:.8rem;text-align:center;z-index:100;animation:fadeInOut 4s ease-in-out}@keyframes fadeInOut{0%,to{opacity:0}50%{opacity:1}}@media (max-width: 768px){body{overflow:hidden;position:fixed;width:100%;height:100%}.app{flex-direction:column;gap:.5rem;padding:.5rem;height:100vh;max-height:100vh;overflow:hidden;padding-bottom:200px}.game-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0}.game-board-container{touch-action:none;user-select:none;-webkit-user-select:none}.game-board{grid-template-columns:repeat(10,28px);grid-template-rows:repeat(20,28px)}.cell{width:28px;height:28px}.side-panel{flex-direction:row;justify-content:space-around;min-width:100%;gap:1rem;flex-wrap:wrap}.next-piece,.scoreboard,.game-controls{flex:1;min-width:150px;max-width:200px}.preview-board{grid-template-columns:repeat(4,22px);grid-template-rows:repeat(4,22px)}.preview-board .cell{width:22px;height:22px}.controls-help{display:none}.mobile-controls{display:block}.game-over-overlay,.pause-overlay{padding:1rem}.game-over-content,.pause-content{padding:1.5rem;max-width:90vw}.game-over-content h2,.pause-content h2{font-size:1.5rem}}@media (max-width: 480px){.game-board{grid-template-columns:repeat(10,25px);grid-template-rows:repeat(20,25px)}.cell{width:25px;height:25px}.side-panel{flex-direction:column;gap:.5rem}.next-piece,.scoreboard,.game-controls{min-width:100%;max-width:100%}.mobile-btn{font-size:1.2rem;padding:.8rem;min-width:50px;min-height:50px}.mobile-btn.move-btn{font-size:1.5rem;min-width:60px;min-height:60px}}@media (max-width: 768px) and (orientation: landscape){.app{flex-direction:row;padding-bottom:0;padding-right:200px}.game-area{flex:2}.side-panel{flex:1;flex-direction:column;max-width:180px;gap:.5rem}.mobile-controls{position:fixed;right:0;bottom:0;top:0;width:200px;height:100vh;padding:1rem .5rem;display:flex;flex-direction:column;justify-content:center}.mobile-controls-main{flex-direction:column;gap:1rem}.mobile-controls-left,.mobile-controls-right,.mobile-controls-center{flex:none}}