:root{--bg-color:#0a0a1a;--text-color:#e0e0ff;--neon-green:#00ffc8;--neon-pink:#f06;--font-main:"Orbitron", sans-serif;--font-text:"Inter", sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-text);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#app{flex-direction:column;width:100%;height:100%;display:flex;position:relative}.screen{-webkit-backdrop-filter:blur(8px);z-index:10;text-align:center;background:#0a0a1ae6;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;transition:opacity .3s;display:flex;position:absolute;top:0;left:0}.screen.hidden{opacity:0;pointer-events:none}.title{font-family:var(--font-main);color:#fff;text-transform:uppercase;text-shadow:0 0 10px var(--neon-green), 0 0 20px var(--neon-green);letter-spacing:2px;margin-bottom:10px;font-size:clamp(3rem,10vw,4rem);font-weight:800}.subtitle{color:#ffffffb3;margin-bottom:40px;font-size:1.1rem}.score-display{font-family:var(--font-main);color:var(--neon-pink);text-shadow:0 0 8px #ff006680;margin-bottom:40px;font-size:1.5rem}.btn{color:var(--neon-green);font-family:var(--font-main);text-transform:uppercase;border:2px solid var(--neon-green);cursor:pointer;background:0 0;border-radius:30px;width:80%;max-width:300px;margin-bottom:15px;padding:15px 40px;font-size:1.2rem;font-weight:600;transition:all .2s;box-shadow:0 0 10px #00ffc833,inset 0 0 10px #00ffc81a}.btn:active{background:#00ffc81a;transform:scale(.95);box-shadow:0 0 20px #00ffc866,inset 0 0 20px #00ffc833}.btn-secondary{color:#fffc;box-shadow:none;border-color:#ffffff4d}.btn-secondary:active{box-shadow:none;background:#ffffff1a}.game-over-title{color:var(--neon-pink);text-shadow:0 0 10px var(--neon-pink), 0 0 20px var(--neon-pink)}.pippa-text{font-family:var(--font-text);color:#fc0;text-shadow:0 0 10px #fc09;letter-spacing:1px;margin-top:0;margin-bottom:30px;font-size:1.3rem;font-weight:700;animation:2s infinite pulsePippa}@keyframes pulsePippa{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.leaderboard{text-align:left;background:#ffffff0d;border-radius:15px;width:100%;max-width:300px;margin-bottom:30px;padding:15px}.leaderboard h3{font-family:var(--font-main);color:#ffffff80;text-transform:uppercase;text-align:center;margin-bottom:10px;font-size:1rem}.leaderboard-item{border-bottom:1px solid #ffffff1a;justify-content:space-between;padding:8px 0;font-size:.9rem;display:flex}.leaderboard-item:last-child{border-bottom:none}.leaderboard-score{font-family:var(--font-main);color:var(--neon-green);font-weight:600}.leaderboard-date{color:#fff6}#hud{z-index:5;flex-shrink:0;justify-content:space-between;align-items:center;width:100%;padding:15px 20px;display:flex}.hud-item{flex-direction:column;display:flex}.hud-label{color:#ffffff80;text-transform:uppercase;letter-spacing:1px;font-size:.7rem}.hud-value{font-family:var(--font-main);color:#fff;font-size:1.5rem;font-weight:700}.hud-score .hud-value{color:var(--neon-green);text-shadow:0 0 5px #00ffc880}#game-container{flex:1;justify-content:center;align-items:center;width:100%;min-width:0;min-height:0;display:flex;position:relative}canvas{object-fit:contain;width:100%;height:100%;display:block}#dpad-container{z-index:5;flex-shrink:0;justify-content:center;align-items:center;width:100%;padding:10px 0 20px;display:flex}#dpad-container.hidden{display:none}#dpad{opacity:.8;grid-template-rows:1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr;gap:6px;width:240px;max-width:35vh;height:240px;max-height:35vh;transition:opacity .3s;display:grid}#dpad:active,#dpad:focus-within{opacity:1}.dpad-btn{color:var(--neon-green);background:#00ffc826;border:2px solid #00ffc866;border-radius:10px;justify-content:center;align-items:center;font-size:1.5rem;display:flex;box-shadow:0 0 10px #00ffc833}.dpad-up{grid-area:1/2}.dpad-left{grid-area:2/1}.dpad-right{grid-area:2/3}.dpad-down{grid-area:3/2}.dpad-active{border-color:var(--neon-green);background:#00ffc84d;box-shadow:0 0 10px #00ffc880}@media (width>=768px){#dpad-container{display:none}}