:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100vh;height:100dvh;background:#08080c;color:#fafafa;overflow:hidden;touch-action:manipulation}.app{height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;-webkit-user-select:none;user-select:none;padding:.5rem;position:relative}.game-title{font-size:1.4rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff2daa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0}.game-container{display:flex;gap:.75rem;align-items:flex-start}.board-wrapper{position:relative;border:2px solid rgba(255,255,255,.12);border-radius:.5rem;background:#ffffff05;padding:3px;box-shadow:0 0 60px #7b2ff71f,inset 0 0 40px #0009;flex-shrink:0}.board{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(20,1fr);gap:1px;width:250px;height:500px}.cell{position:relative;border-radius:2px;background:#ffffff04;transition:background .05s}.cell.filled{border-radius:3px;box-shadow:inset 1px 1px 2px #ffffff59,inset -1px -1px 2px #00000059}.cell.filled:before{content:"";position:absolute;top:12%;left:12%;width:38%;height:38%;background:#fff3;border-radius:2px 0 0}.cell.filled:after{content:"";position:absolute;bottom:12%;right:12%;width:38%;height:38%;background:#00000040;border-radius:0 0 2px}.cell.ghost{border:1px solid rgba(255,255,255,.12);background:#ffffff08}@keyframes lineClear{0%{background:#fff;transform:scaleY(1);opacity:1}40%{background:#fff;opacity:1}to{background:transparent;transform:scaleY(0);opacity:0}}.cell.clearing{animation:lineClear .3s ease-out forwards}.side-panel{display:flex;flex-direction:column;gap:.5rem;min-width:120px}.panel-box{border:1px solid rgba(255,255,255,.08);border-radius:.5rem;padding:.5rem;background:#ffffff05}.panel-label{font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:#ffffff59;margin-bottom:.2rem;text-align:center}.panel-value{font-size:1.2rem;font-weight:700;font-variant-numeric:tabular-nums;text-align:center}.mini-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:2px;width:64px;height:64px;margin:.3rem auto 0}.mini-cell{border-radius:2px}.mini-cell.filled{border-radius:3px;box-shadow:inset 1px 1px 2px #ffffff4d,inset -1px -1px 2px #0000004d}.level-bar{width:100%;height:3px;background:#ffffff14;border-radius:2px;overflow:hidden;margin-top:.2rem}.level-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,#00d4ff,#7b2ff7);transition:width .3s}.controls-hint{font-size:.6rem;color:#ffffff40;line-height:1.9;text-align:center}.controls-hint kbd{display:inline-block;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:3px;padding:.05em .35em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.55rem}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#08080cd9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:.5rem;gap:.5rem;z-index:10;padding:1rem}.overlay-title{font-size:1.4rem;font-weight:700;letter-spacing:.08em}.overlay-sub{font-size:.8rem;color:#ffffff80;text-align:center;line-height:1.6}.overlay-stats{display:flex;gap:1.5rem;margin:.3rem 0}.overlay-stat{text-align:center}.overlay-stat-val{font-size:1.3rem;font-weight:700;font-variant-numeric:tabular-nums}.overlay-stat-label{font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:#ffffff59}.overlay-highscore{font-size:.7rem;color:#ffd700b3;font-weight:600}.overlay-btn{margin-top:.4rem;padding:.6rem 2rem;border:1px solid rgba(255,255,255,.2);border-radius:.4rem;background:linear-gradient(135deg,#00d4ff26,#7b2ff726);color:#fafafa;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .15s;letter-spacing:.06em}.overlay-btn:hover,.overlay-btn:active{background:linear-gradient(135deg,#00d4ff40,#7b2ff740);border-color:#ffffff4d;transform:scale(1.03)}@keyframes scorePopup{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-40px) scale(1.2)}}.score-popup{position:absolute;top:40%;left:50%;transform:translate(-50%);font-size:1.5rem;font-weight:800;color:#fff;text-shadow:0 0 20px rgba(0,212,255,.8),0 0 40px rgba(123,47,247,.5);pointer-events:none;z-index:5;animation:scorePopup .8s ease-out forwards}.touch-controls{display:none;width:100%;max-width:340px;gap:.4rem;padding:.15rem 0}.touch-row{display:flex;justify-content:center;gap:.4rem}.touch-btn{display:flex;align-items:center;justify-content:center;width:68px;height:56px;border:1px solid rgba(255,255,255,.12);border-radius:.5rem;background:#ffffff0d;color:#ffffffa6;font-size:1.3rem;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:background .08s}.touch-btn:active{background:#ffffff29;border-color:#ffffff40}.touch-btn.wide{width:130px;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600}.touch-btn.drop-btn{width:100px;font-size:.65rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600}.stats-row{display:none;gap:.4rem;width:100%;max-width:340px}.stats-row .panel-box{flex:1;text-align:center;padding:.4rem}.stats-row .panel-value{font-size:1rem}@media(max-width:600px){.app{justify-content:flex-start;padding-top:.3rem;gap:.35rem}.game-title{font-size:1.1rem}.game-container{flex-direction:column;align-items:center;gap:.4rem}.board{width:min(88vw,300px);height:min(176vw,600px)}.side-panel{display:none}.touch-controls{display:flex;flex-direction:column;align-items:center}.stats-row{display:flex}}@media(max-width:380px){.board{width:82vw;height:164vw}.touch-btn{width:58px;height:50px;font-size:1.1rem}.touch-btn.wide{width:115px;font-size:.6rem}.touch-btn.drop-btn{width:90px}}@media(max-height:640px){.app{gap:.15rem;padding-top:.15rem}.board{height:min(72vh,400px);width:calc(min(72vh,400px)/2)}.touch-btn{height:44px}}
