*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#000;font-family:system-ui,sans-serif}#app{position:fixed;top:0;right:0;bottom:0;left:0;display:block;width:100vw;height:100vh}#hud,#menu,#results{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;color:#fff}#hud{z-index:1}#menu{z-index:2}#results{z-index:3}.hud-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;font-family:system-ui,sans-serif;transition:opacity .2s ease}.hud-root.is-hidden{opacity:0}.hud-top{position:absolute;top:20px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.hud-timer,.hud-score,.hud-hoops{font-weight:800;font-size:clamp(20px,4vw,32px);color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.85),0 0 12px rgba(0,0,0,.5);letter-spacing:.02em}.hud-timer{min-width:3ch;text-align:center}.hud-timer.is-low{color:#ff3b30}.hud-score{color:#f97316}.hud-hoops{color:#fff}.hud-charge{position:absolute;bottom:28px;left:50%;transform:translate(-50%);width:min(280px,60vw);height:10px;border-radius:6px;background:#00000080;border:2px solid rgba(249,115,22,.7);overflow:hidden}.hud-charge-fill{height:100%;width:0%;background:#f97316;transition:width .05s linear}.hud-charge-zone{position:absolute;top:0;bottom:0;left:0;width:0%;background:#22c55e8c;border-left:1px solid rgba(34,197,94,.9);border-right:1px solid rgba(34,197,94,.9);pointer-events:none;display:none;z-index:1}.hud-charge-zone.is-visible{display:block}.hud-message{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%) scale(.9);font-weight:800;font-size:clamp(28px,6vw,56px);color:#f97316;text-shadow:0 3px 6px rgba(0,0,0,.9),0 0 20px rgba(0,0,0,.6);opacity:0;transition:opacity .15s ease,transform .15s ease;text-align:center;white-space:nowrap}.hud-message.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.hud-popups{position:absolute;top:60px;right:20px;display:flex;flex-direction:column-reverse;align-items:flex-end;gap:4px;pointer-events:none}.hud-popup{font-weight:800;font-size:24px;color:#f97316;text-shadow:0 2px 4px rgba(0,0,0,.85);animation:hud-popup-rise 1.1s ease-out forwards}.hud-popup.is-negative{color:#ff3b30}@keyframes hud-popup-rise{0%{opacity:0;transform:translateY(0)}15%{opacity:1}to{opacity:0;transform:translateY(-40px)}}.overlay-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.panel{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;background:#000000b8;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:auto;text-align:center}.panel.is-hidden{display:none}.panel-title{font-weight:800;font-size:clamp(28px,6vw,48px);color:#f97316;text-shadow:0 3px 6px rgba(0,0,0,.9);margin:0}.results-stars{display:flex;gap:8px;font-size:clamp(28px,6vw,44px);line-height:1}.star{color:#ffffff4d;text-shadow:0 2px 4px rgba(0,0,0,.8)}.star.is-filled{color:#f97316;text-shadow:0 2px 6px rgba(249,115,22,.6),0 2px 4px rgba(0,0,0,.8)}.results-time{font-weight:800;font-size:clamp(18px,3vw,24px);color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.8)}.results-breakdown{font-weight:600;font-size:clamp(14px,2.5vw,18px);color:#eee;text-shadow:0 2px 4px rgba(0,0,0,.8);display:flex;flex-direction:column;gap:4px}.results-score{font-weight:800;font-size:clamp(32px,7vw,56px);color:#f97316;text-shadow:0 3px 6px rgba(0,0,0,.9)}.panel-actions{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:8px}.btn{font-family:system-ui,sans-serif;font-weight:800;font-size:clamp(14px,2.5vw,18px);padding:12px 28px;border-radius:8px;border:2px solid #f97316;background:transparent;color:#fff;cursor:pointer;text-shadow:0 1px 3px rgba(0,0,0,.8);transition:background .15s ease,transform .1s ease}.btn:hover{background:#f9731633;transform:translateY(-1px)}.btn-primary{background:#f97316;color:#000}.btn-primary:hover{background:#fb923c}@media(max-width:480px){.hud-top{top:12px;left:12px;right:12px}.hud-popups{top:48px;right:12px}.panel{padding:16px;gap:12px}}.menu-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.menu-root.is-hidden{display:none}.menu-panel{position:absolute;top:0;right:0;bottom:0;left:0;overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:24px;padding:32px 20px 48px;background:#000000c7;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:auto;text-align:center}.menu-title{font-weight:800;font-size:clamp(28px,6vw,48px);color:#f97316;text-shadow:0 3px 6px rgba(0,0,0,.9);margin:0}.menu-subtitle{font-weight:600;font-size:clamp(14px,2.5vw,18px);color:#eee;text-shadow:0 2px 4px rgba(0,0,0,.8);margin-top:-12px}.level-grid{width:100%;max-width:960px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.level-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;border-radius:10px;border:2px solid rgba(249,115,22,.5);background:#14141499;color:#fff;font-family:system-ui,sans-serif;cursor:pointer;transition:background .15s ease,transform .1s ease,border-color .15s ease;text-align:center}.level-card:hover,.level-card:focus-visible{background:#f973162e;border-color:#f97316;transform:translateY(-2px)}.level-card-name{font-weight:800;font-size:clamp(16px,3vw,20px);text-shadow:0 2px 4px rgba(0,0,0,.8)}.difficulty-dots{display:flex;gap:4px}.difficulty-dots .dot{width:8px;height:8px;border-radius:50%;background:#ffffff40}.difficulty-dots .dot.is-filled{background:#f97316}.level-stars{font-size:clamp(16px,3vw,20px);color:#f97316;letter-spacing:.05em}.level-time,.level-score{font-size:13px;color:#ccc}.level-play-btn{margin-top:4px;font-weight:800;font-size:13px;padding:6px 18px;border-radius:6px;border:2px solid #f97316;background:#f97316;color:#000}.menu-controls{width:100%;max-width:640px;color:#eee}.menu-controls-title{font-weight:800;font-size:clamp(16px,3vw,20px);color:#f97316;text-shadow:0 2px 4px rgba(0,0,0,.8);margin-bottom:8px}.menu-controls-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px 16px;font-size:13px;text-align:left}.menu-error{color:#ff8a80;font-size:14px;grid-column:1 / -1}.menu-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#000000c7;color:#f97316;font-weight:800;font-size:clamp(20px,4vw,28px);pointer-events:auto}.menu-loading.is-hidden{display:none}.nick-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#000000d9;pointer-events:auto;z-index:1}.nick-overlay.is-hidden{display:none}.nick-panel{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:10px;border:2px solid #f97316;background:#0a0a0af2;width:min(320px,90vw)}.nick-title{font-weight:800;font-size:20px;color:#f97316;margin:0}.nick-input{font-family:system-ui,sans-serif;font-size:16px;padding:10px 12px;border-radius:6px;border:2px solid rgba(249,115,22,.6);background:#111;color:#fff}.nick-error{color:#ff6b5e;font-size:13px;min-height:16px}@media(max-width:400px){.menu-panel{padding:20px 12px 32px;gap:16px}.level-grid,.menu-controls-list{grid-template-columns:1fr}}