html,body{overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#000;width:100%;height:100%;margin:0;padding:0;overflow:hidden}#app{width:100%;height:100%;position:fixed;inset:0}#app canvas{width:100%;height:100%;display:block}:root{--glass-bg:#ffffff24;--glass-border:#ffffff40;--glass-blur:18px;--glass-shadow:0 2px 12px #00000014;--glass-radius:16px;--text-color:#ffffffe6;--text-muted:#ffffff8c;--icon-size:24px;--button-size:64px;--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--dur-press:.14s;--dur-panel:.22s;--dur-panel-out:.15s}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--glass-radius);box-shadow:var(--glass-shadow)}.anim-scale-press:active{transition:transform var(--dur-press) var(--ease-out);transform:scale(.97)}.anim-panel-enter{transition:transform var(--dur-panel) var(--ease-out), opacity var(--dur-panel) var(--ease-out)}.anim-panel-exit{transition:transform var(--dur-panel-out) var(--ease-out), opacity var(--dur-panel-out) var(--ease-out)}.anim-popup-enter{animation:popup-bounce .38s var(--ease-out) both}@keyframes popup-bounce{0%{opacity:0;transform:scale(.85)}45%{opacity:1;transform:scale(1.08)}70%{transform:scale(.96)}to{opacity:1;transform:scale(1)}}.anim-row-stagger>*{opacity:0;transition:opacity var(--dur-panel) var(--ease-out), transform var(--dur-panel) var(--ease-out);transform:translateY(12px)}.anim-row-stagger.show>:first-child{transition-delay:0s}.anim-row-stagger.show>:nth-child(2){transition-delay:50ms}.anim-row-stagger.show>:nth-child(3){transition-delay:.1s}.anim-row-stagger.show>:nth-child(4){transition-delay:.15s}.anim-row-stagger.show>:nth-child(5){transition-delay:.2s}.anim-row-stagger.show>:nth-child(6){transition-delay:.25s}.anim-row-stagger.show>:nth-child(7){transition-delay:.3s}.anim-row-stagger.show>:nth-child(8){transition-delay:.35s}.anim-row-stagger.show>*{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.anim-scale-press:active,.anim-panel-enter,.anim-panel-exit,.anim-row-stagger>*{transition:opacity .15s var(--ease-out);transform:none}.anim-popup-enter{opacity:1;animation:none}}#hud-overlay{pointer-events:none;z-index:10;font-family:system-ui,sans-serif;position:fixed;inset:0}#hud-overlay>*{pointer-events:auto}.hud-drag-layer{touch-action:none;position:absolute;inset:0}.hud-joystick{-webkit-backdrop-filter:blur(8px);pointer-events:none;opacity:0;width:130px;height:130px;transition:opacity var(--dur-press,.14s) var(--ease-out,ease);background:#ffffff14;border:1.5px solid #ffffff2e;border-radius:50%;margin:-65px 0 0 -65px;position:fixed}.hud-joystick-thumb{background:#ffffff38;border:1px solid #ffffff59;border-radius:50%;width:48px;height:48px;margin-top:-24px;margin-left:-24px;transition:none;position:absolute;top:50%;left:50%}.anim-boss-banner{animation:4s ease-in-out forwards anim-boss-banner}@keyframes anim-boss-banner{0%{opacity:0}18%{opacity:1}78%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.anim-boss-banner{opacity:1;animation:none}}.speed-vignette{pointer-events:none;z-index:9;opacity:0;background:radial-gradient(80% 70%,#0000 45%,#00000052 80%,#0000009e 100%);transition:opacity 90ms linear;position:fixed;inset:0}.waypoint-layer{pointer-events:none;position:absolute;inset:0}.waypoint-bird{filter:drop-shadow(0 1px 2px #00000080);opacity:0;pointer-events:none;z-index:11;border-top:7px solid #0000;border-bottom:7px solid #0000;border-left:12px solid #ffffffe6;width:0;height:0;transition:opacity .2s;position:fixed;top:0;left:0}.orient-pad{bottom:calc(26px + env(safe-area-inset-bottom));pointer-events:none;grid-template-rows:repeat(2,46px);grid-template-columns:repeat(3,46px);gap:5px;display:grid;position:fixed;left:50%;transform:translate(-50%)}.orient-btn{-webkit-backdrop-filter:blur(8px);color:#ffffffd9;pointer-events:auto;-webkit-user-select:none;user-select:none;transition:transform var(--dur-press,.14s) var(--ease-out,ease);background:#ffffff17;border:1.5px solid #ffffff2e;border-radius:12px;justify-content:center;align-items:center;font-size:18px;display:flex}.orient-btn:active{background:#ffffff29;transform:scale(.9)}.orient-up{grid-area:1/2}.orient-left{grid-area:2/1}.orient-down{grid-area:2/2}.orient-right{grid-area:2/3}.compass{top:calc(14px + env(safe-area-inset-top));pointer-events:none;z-index:11;border-radius:15px;width:200px;height:30px;position:fixed;left:50%;overflow:hidden;transform:translate(-50%);-webkit-mask:linear-gradient(90deg,#0000,#000 22% 78%,#0000);mask:linear-gradient(90deg,#0000,#000 22% 78%,#0000)}.compass-mark{text-align:center;color:#ffffffe6;-webkit-user-select:none;user-select:none;margin-top:-.5em;font-size:14px;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%)}.compass-card{z-index:2;font-weight:600}.compass-gull{text-align:center;color:#ffffffd9;text-shadow:0 1px 2px #000c;-webkit-user-select:none;user-select:none;z-index:1;font-size:8px;line-height:1;position:absolute;bottom:1px;left:50%;transform:translate(-50%)}.compass-tick{color:#fff6;font-size:12px}.compass-marker{border-top:5px solid #ffffffd9;border-left:4px solid #0000;border-right:4px solid #0000;width:0;height:0;position:absolute;top:0;left:50%;transform:translate(-50%)}.hud-action-btn{width:var(--button-size,64px);height:var(--button-size,64px);-webkit-backdrop-filter:blur(8px);transition:transform var(--dur-press,.14s) var(--ease-out,ease);-webkit-user-select:none;user-select:none;background:#ffffff17;border:1.5px solid #ffffff2e;border-radius:50%;justify-content:center;align-items:center;font-size:30px;line-height:1;display:flex;position:absolute}.hud-action-btn:active{transform:scale(.92)}.hud-action-btn svg{stroke:#ffffffd9;fill:none;stroke-width:1.5px;width:28px;height:28px}.hud-btn-scream{bottom:calc(170px + env(safe-area-inset-bottom));left:calc(30px + env(safe-area-inset-left))}.hud-btn-poop{bottom:calc(80px + env(safe-area-inset-bottom));left:calc(30px + env(safe-area-inset-left))}.hud-btn-autofly{bottom:calc(80px + env(safe-area-inset-bottom));right:calc(30px + env(safe-area-inset-right))}.hud-btn-autofly svg{stroke:#ffffffd9;fill:none;stroke-width:2px;transition:stroke var(--dur-press,.14s) var(--ease-out,ease)}.hud-btn-autofly.is-active{background:#78d28c47;border-color:#96f0aacc;box-shadow:0 0 16px #78dc9673}.hud-btn-autofly.is-active svg{stroke:#e1ffe6f2}.cooldown-ring{pointer-events:none;opacity:0;transition:opacity var(--dur-press,.14s) var(--ease-out,ease);border-radius:50%;position:absolute;inset:-5px;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 calc(100% - 4px));mask:radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 calc(100% - 4px))}@media (width>=768px){.hud-btn-scream{left:calc(50px + env(safe-area-inset-left));bottom:calc(190px + env(safe-area-inset-bottom))}.hud-btn-poop{left:calc(50px + env(safe-area-inset-left));bottom:calc(100px + env(safe-area-inset-bottom))}.hud-btn-autofly{right:calc(50px + env(safe-area-inset-right));bottom:calc(100px + env(safe-area-inset-bottom))}}@media (hover:hover) and (pointer:fine){.hud-action-btn:hover{background:#ffffff24}}.tutorial-layer{z-index:50;pointer-events:auto;opacity:0;transition:opacity var(--dur-panel,.22s) var(--ease-out,ease);-webkit-tap-highlight-color:transparent;font-family:system-ui,sans-serif;position:fixed;inset:0}.tutorial-layer.is-active{opacity:1}.tutorial-spotlight{pointer-events:none;transition:left .28s var(--ease-out,ease), top .28s var(--ease-out,ease), width .28s var(--ease-out,ease), height .28s var(--ease-out,ease), border-radius .28s var(--ease-out,ease);border-radius:16px;position:fixed;box-shadow:0 0 0 9999px #0000008c}.tutorial-spotlight:after{content:"";border-radius:inherit;border:2px solid #ffffff8c;animation:1.6s ease-in-out infinite tutorial-pulse;position:absolute;inset:-2px;box-shadow:0 0 18px 3px #ffffff4d}@keyframes tutorial-pulse{0%,to{opacity:.5}50%{opacity:1}}.tutorial-bubble{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--glass-radius);max-width:min(280px,100vw - 28px);-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:var(--glass-shadow);color:var(--text-color);transition:left .28s var(--ease-out,ease), top .28s var(--ease-out,ease);padding:12px 16px;position:fixed}.tutorial-counter{letter-spacing:.04em;color:var(--text-muted);margin-bottom:4px;font-size:11px;font-weight:600}.tutorial-text{font-size:15px;line-height:1.35}.tutorial-arrow{background:var(--glass-bg);border-right:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border);width:13px;height:13px;position:absolute;bottom:-7px;transform:translate(-50%)rotate(45deg)}.tutorial-hint{top:calc(18px + env(safe-area-inset-top));color:var(--text-muted);text-shadow:0 1px 3px #0009;pointer-events:none;font-size:12px;position:fixed;left:50%;transform:translate(-50%)}.tutorial-skip{top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(8px);color:var(--text-color);font:inherit;-webkit-tap-highlight-color:transparent;cursor:pointer;background:#ffffff1f;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;position:fixed}@media (prefers-reduced-motion:reduce){.tutorial-spotlight,.tutorial-bubble{transition:none}.tutorial-spotlight:after{opacity:1;animation:none}}
