:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{color:#fff;background:#0d0f12;width:100%;height:100%;font-family:Outfit,Inter,Segoe UI,sans-serif;overflow:hidden}#app{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.game-canvas{background:#0f1319;max-width:100%;max-height:100%;display:block;box-shadow:0 10px 30px #0009}.hud{pointer-events:none;z-index:10;flex-direction:column;justify-content:space-between;padding:20px;display:flex;position:absolute;inset:0}.hud__top{justify-content:space-between;width:100%;display:flex}.hud__score-container{flex-direction:column;display:flex}.hud__label{text-transform:uppercase;letter-spacing:2px;color:#fff6;font-size:11px}.hud__score{color:#39ff14;text-shadow:0 0 10px #39ff144d;font-size:28px;font-weight:700}.hud__best-container{flex-direction:column;align-items:flex-end;display:flex}.hud__best{color:gold;text-shadow:0 0 10px #ffd7004d;font-size:28px;font-weight:700}.hud__lives{background:#0006;border:1px solid #ffffff1a;border-radius:20px;align-self:flex-start;align-items:center;gap:8px;margin-top:10px;padding:6px 12px;display:flex}.hud__life-dot{background:#39ff14;border-radius:50%;width:12px;height:12px;transition:opacity .3s,transform .3s;box-shadow:0 0 8px #39ff14}.hud__life-dot.lost{opacity:.15;box-shadow:none;transform:scale(.8)}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;pointer-events:auto;background:#0d0f12d9;flex-direction:column;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:absolute;inset:0}.overlay.hidden{opacity:0;pointer-events:none}.overlay__card{text-align:center;background:linear-gradient(135deg,#161a22 0%,#0f1217 100%);border:1px solid #ffffff14;border-radius:24px;flex-direction:column;align-items:center;width:90%;max-width:420px;padding:40px;display:flex;box-shadow:0 20px 50px #00000080}.overlay__title{letter-spacing:2px;background:linear-gradient(90deg,#39ff14,#00f0ff);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 8px #39ff1433);-webkit-background-clip:text;margin-bottom:8px;font-size:36px;font-weight:800}.overlay__subtitle{color:#fff9;margin-bottom:24px;font-size:14px;line-height:1.5}.overlay__stats{background:#ffffff08;border:1px solid #ffffff0d;border-radius:16px;justify-content:space-around;width:100%;margin-bottom:28px;padding:16px;display:flex}.overlay__stat{flex-direction:column;align-items:center;display:flex}.overlay__stat-val{color:#fff;font-size:22px;font-weight:700}.overlay__stat-val.primary{color:#39ff14}.overlay__stat-val.secondary{color:gold}.overlay__button{color:#0d0f12;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#39ff14;border:none;border-radius:12px;padding:14px 32px;font-size:16px;font-weight:700;transition:transform .15s,box-shadow .15s;box-shadow:0 8px 20px #39ff144d}.overlay__button:hover{transform:translateY(-2px);box-shadow:0 12px 24px #39ff1473}.overlay__button:active{transform:translateY(1px)}.overlay__instructions{color:#fff6;margin-top:24px;font-size:12px;line-height:1.6}.mobile-controls{z-index:25;pointer-events:auto;grid-template-areas:".up.""left.right"".down.";gap:10px;display:none;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.mobile-btn{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:#ffffff1a;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:24px;transition:background .1s,transform .1s;display:flex}.mobile-btn:active{background:#39ff1466;border-color:#39ff14;transform:scale(.9)}.mobile-btn--up{grid-area:up}.mobile-btn--left{grid-area:left}.mobile-btn--right{grid-area:right}.mobile-btn--down{grid-area:down}@media (width<=768px),(pointer:coarse){.mobile-controls{display:grid}}.countdown{pointer-events:none;z-index:30;letter-spacing:6px;color:#39ff14;text-shadow:0 0 18px #39ff14a6,0 6px 26px #0009;opacity:0;justify-content:center;align-items:center;font-family:inherit;font-size:clamp(84px,22vw,150px);font-weight:800;display:flex;position:absolute;inset:0}.countdown.is-shown{animation:.75s ease-out countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1.12)}40%{transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}