@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&family=Rajdhani:wght@500;600&display=swap";:root{--neon-gold: #ffd766;--neon-blue: #7fd4ff;--neon-purple: #9d7bff;--neon-pink: #ff6ee0;--bg: #05030f;--font-display: "Orbitron", "Segoe UI", sans-serif;--font-body: "Rajdhani", "Segoe UI", sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:var(--font-body);touch-action:none;-webkit-user-select:none;user-select:none}#game{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair}#hud{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:12px clamp(10px,3vw,28px);pointer-events:none;z-index:5}.hud-group{min-width:90px}.hud-group.center{text-align:center;flex:1;padding:0 8px}.hud-group.right{text-align:right}.hud-label{font-size:clamp(9px,1.4vw,12px);letter-spacing:.25em;color:#c8d2ff99;font-weight:600}.hud-value{font-family:var(--font-display);font-size:clamp(18px,3.4vw,30px);font-weight:700;color:#fff;text-shadow:0 0 12px var(--neon-gold),0 0 32px rgba(255,215,102,.5)}.hud-value.shots{text-shadow:0 0 12px var(--neon-blue),0 0 32px rgba(127,212,255,.5)}.hud-combo{font-family:var(--font-display);font-size:clamp(10px,1.6vw,14px);color:var(--neon-pink);text-shadow:0 0 10px var(--neon-pink);min-height:1.2em}.hud-level{font-family:var(--font-display);font-size:clamp(12px,2vw,17px);font-weight:700;letter-spacing:.3em;color:#dce1ffe6;text-shadow:0 0 14px var(--neon-purple);margin-bottom:6px}#hud-progress{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.chip{font-size:clamp(9px,1.4vw,12px);font-weight:600;letter-spacing:.08em;padding:2px 10px;border-radius:999px;border:1px solid hsla(var(--hue),90%,65%,.65);color:hsl(var(--hue),95%,78%);background:hsla(var(--hue),80%,40%,.12);text-shadow:0 0 8px hsla(var(--hue),90%,60%,.9)}.chip.done{background:hsla(var(--hue),90%,55%,.3);border-color:hsl(var(--hue),95%,75%);box-shadow:0 0 12px hsla(var(--hue),90%,60%,.7)}.hud-btns{margin-top:6px;pointer-events:auto}.iconbtn{background:#1e194199;border:1px solid rgba(157,123,255,.5);color:#cfd4ff;width:38px;height:38px;border-radius:10px;font-size:18px;cursor:pointer;margin-left:6px;transition:all .15s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.iconbtn:hover{border-color:var(--neon-purple);box-shadow:0 0 14px #9d7bff99;color:#fff}#banner{position:fixed;top:22%;left:50%;transform:translate(-50%,-50%) scale(.85);text-align:center;pointer-events:none;opacity:0;transition:opacity .35s,transform .35s;z-index:6}#banner.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.banner-main{font-family:var(--font-display);font-size:clamp(22px,5vw,46px);font-weight:900;color:#fff;text-shadow:0 0 18px var(--neon-gold),0 0 60px rgba(255,215,102,.8);letter-spacing:.06em}.banner-sub{font-family:var(--font-display);font-size:clamp(12px,2vw,18px);letter-spacing:.4em;color:#d2dcffd9;text-shadow:0 0 12px var(--neon-blue);margin-top:4px}#banner.celebrate .banner-main{animation:bannerPulse .5s ease-in-out infinite alternate}@keyframes bannerPulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.banner-main.powerup-multiball{text-shadow:0 0 18px #64ff8c,0 0 60px #64ff8c}.banner-main.powerup-magnet{text-shadow:0 0 18px #ff6ee0,0 0 60px #ff6ee0}.banner-main.powerup-slowmo{text-shadow:0 0 18px #6ea8ff,0 0 60px #6ea8ff}.banner-main.powerup-nova{text-shadow:0 0 18px #ffb347,0 0 60px #ffb347}.banner-main.freeball{text-shadow:0 0 18px var(--neon-purple),0 0 60px var(--neon-purple)}#popups{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:6}.popup{position:absolute;font-family:var(--font-display);font-size:15px;font-weight:700;color:#ffe9a8;text-shadow:0 0 10px rgba(255,215,102,.9);transform:translate(-50%,-50%);animation:popupRise 1.2s ease-out forwards}.popup.big{font-size:22px;color:#fff;text-shadow:0 0 14px var(--neon-blue),0 0 40px var(--neon-blue)}@keyframes popupRise{0%{opacity:0;margin-top:0;transform:translate(-50%,-50%) scale(.6)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}30%{transform:translate(-50%,-50%) scale(1)}to{opacity:0;margin-top:-60px}}#flash{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 45%,#fff,#fff0c8b3);opacity:0;pointer-events:none;z-index:7}#overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#0a061e8c,#04020ee0);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .4s;z-index:10}#overlay.visible{opacity:1;pointer-events:auto}#overlay-box{text-align:center;padding:40px clamp(20px,6vw,70px);max-width:640px;border-radius:24px;border:1px solid rgba(157,123,255,.35);background:linear-gradient(160deg,#1c1440bf,#0a061ed9);box-shadow:0 0 60px #6446dc59,inset 0 0 80px #5032be1f}.title{font-family:var(--font-display);font-size:clamp(38px,9vw,72px);font-weight:900;letter-spacing:.12em;background:linear-gradient(180deg,#fff,#ffd766 55%,#ff9d5c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px rgba(255,215,102,.55));animation:titleGlow 3s ease-in-out infinite alternate}.title.small{font-size:clamp(28px,6vw,52px)}@keyframes titleGlow{0%{filter:drop-shadow(0 0 16px rgba(255,215,102,.4))}to{filter:drop-shadow(0 0 34px rgba(255,160,90,.75))}}.tagline{font-size:clamp(15px,2.4vw,20px);font-weight:600;letter-spacing:.14em;color:var(--neon-blue);text-shadow:0 0 12px rgba(127,212,255,.7);margin:10px 0 18px}.help{font-size:clamp(13px,2vw,16px);line-height:1.7;color:#cdd4f5d9;margin-bottom:26px}.win-h,.lose-h{font-family:var(--font-display);font-size:clamp(24px,5vw,40px);font-weight:900;letter-spacing:.1em}.win-h{color:#fff;text-shadow:0 0 20px var(--neon-gold),0 0 60px rgba(255,215,102,.6)}.lose-h{color:#ffb0c8;text-shadow:0 0 20px rgba(255,110,160,.8)}.stars-row{font-size:clamp(22px,5vw,36px);color:var(--neon-gold);text-shadow:0 0 18px var(--neon-gold);letter-spacing:.4em;margin:12px 0;animation:bannerPulse .8s ease-in-out infinite alternate}.stars-row.big{font-size:clamp(28px,6vw,44px)}.scoreline{font-size:clamp(15px,2.4vw,20px);color:#dce2ffeb;margin:6px 0;letter-spacing:.06em}.scoreline b{color:var(--neon-gold);text-shadow:0 0 10px rgba(255,215,102,.8)}.scoreline.small{font-size:clamp(12px,1.8vw,15px);color:#c8d0f5b3}.btnrow{display:flex;gap:14px;justify-content:center;margin-top:22px;flex-wrap:wrap}.btn{font-family:var(--font-display);font-size:clamp(13px,2vw,17px);font-weight:700;letter-spacing:.14em;padding:14px 34px;border-radius:14px;border:1px solid rgba(157,123,255,.6);background:#32266e80;color:#dfe3ff;cursor:pointer;transition:all .18s;margin-top:8px}.btn:hover{border-color:#cfc0ff;box-shadow:0 0 22px #9d7bff8c;transform:translateY(-2px)}.btn.primary{border-color:#ffd766cc;background:linear-gradient(160deg,#ffb03c52,#c85a1e4d);color:#fff;text-shadow:0 0 10px rgba(255,215,102,.8)}.btn.primary:hover{box-shadow:0 0 28px #ffbe5a99}#version{position:fixed;bottom:6px;right:10px;font-size:10px;color:#a0aadc59;z-index:4;pointer-events:none}@media(max-width:640px){.hud-group.center{order:3;flex-basis:100%;margin-top:6px}#hud{flex-wrap:wrap}}#rotate-hint{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;background:#05030ff0;color:#ffd766;align-items:center;justify-content:center;flex-direction:column;gap:1rem;font-weight:800;font-family:var(--font-display)}#rotate-hint.show{display:flex}#rotate-hint .phone{width:72px;height:42px;border:3px solid #ffd766;border-radius:8px;animation:tip-phone-port 1.4s ease-in-out infinite}@keyframes tip-phone-port{0%,to{transform:rotate(0)}40%,60%{transform:rotate(-90deg)}}