*,:before,:after{box-sizing:border-box}html,body{overscroll-behavior:none;background:#f7f7f7;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:none}#app{position:fixed;inset:0}#app>canvas{outline:none;width:100%;height:100%;display:block;position:absolute;inset:0}#hud{pointer-events:none;position:absolute;inset:0}.hud{--hud-u:3px;--hud-s:2px;--hud-b:2px;--hud-ink:#535353;--hud-wash:#f7f7f78c;--hud-margin:max(12px, calc(var(--hud-u) * 5));--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);pointer-events:none;color:var(--hud-ink);-webkit-user-select:none;user-select:none;position:absolute;inset:0;overflow:hidden}.hud canvas{image-rendering:pixelated;image-rendering:crisp-edges;flex:none;display:block}.hud-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.hud-score{z-index:1;top:calc(var(--safe-top) + var(--hud-margin));right:calc(var(--safe-right) + var(--hud-margin));position:absolute}.hud-bar{z-index:1;top:calc(var(--safe-top) + var(--hud-margin) - 10px);left:calc(var(--safe-left) + var(--hud-margin) - 10px);align-items:center;gap:2px;display:flex;position:absolute}.hud-btn{pointer-events:auto;justify-content:center;align-items:center;gap:calc(var(--hud-s) * 3);min-width:44px;min-height:44px;color:inherit;cursor:pointer;opacity:.85;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:0 0;border:0;border-radius:6px;margin:0;padding:0 10px;transition:opacity .12s;display:flex}.hud-btn:hover{opacity:1}.hud-btn:active{transform:translateY(1px)}.hud-btn:focus{outline:none}.hud-btn:focus-visible{outline:2px dashed var(--hud-ink);outline-offset:-2px;opacity:1}.hud-btn-pause{display:none}.hud[data-touch=true][data-phase=playing] .hud-btn-pause,.hud[data-touch=true][data-phase=paused] .hud-btn-pause{display:flex}.hud-panel{left:calc(var(--safe-left) + 8px);right:calc(var(--safe-right) + 8px);flex-direction:column;align-items:center;display:none;position:absolute}.hud[data-phase=title] .hud-title,.hud[data-phase=crashed] .hud-over,.hud[data-phase=paused] .hud-paused{display:flex}.hud-title{gap:calc(var(--hud-u) * 5);top:64%}.hud-press{animation:1.8s ease-in-out infinite hud-breathe}.hud-legend{justify-content:center;align-items:center;gap:calc(var(--hud-s) * 3) calc(var(--hud-s) * 5);opacity:.85;flex-wrap:wrap;display:none}.hud[data-touch=false] .hud-legend-desktop,.hud[data-touch=true] .hud-legend-touch{display:flex}.hud-over{gap:calc(var(--hud-u) * 6);top:22%}.hud-new-high{visibility:hidden;margin-bottom:calc(var(--hud-u) * -1)}.hud[data-new-high=true] .hud-new-high{visibility:visible;animation:.5s step-end 4 hud-flash}.hud-over .hud-hint{opacity:0;transition:opacity .25s}.hud[data-can-restart=true] .hud-over .hud-hint{opacity:.85}.hud-paused{justify-content:center;gap:calc(var(--hud-u) * 5);background:var(--hud-wash);inset:0}.hud-paused .hud-hint{opacity:.85}.hud-fps{left:calc(var(--safe-left) + var(--hud-margin));bottom:calc(var(--safe-bottom) + var(--hud-margin));opacity:.8;display:none;position:absolute}.hud[data-fps=true] .hud-fps{display:block}@media (max-width:559px){.hud-legend{flex-direction:column}.hud .hud-sep{display:none}.hud-btn-camera{position:relative}.hud-btn-camera .hud-btn-label{display:none;position:absolute;top:100%;left:10px}.hud[data-label-peek=true] .hud-btn-camera .hud-btn-label{display:block}}@media (max-width:559px) and (max-resolution:1.49x){.hud-bar{top:calc(var(--safe-top) + var(--hud-margin) + var(--hud-u) * 9)}}@keyframes hud-breathe{0%,to{opacity:1}50%{opacity:.3}}@keyframes hud-flash{50%{opacity:0}}@media (prefers-reduced-motion:reduce){.hud-press,.hud[data-new-high=true] .hud-new-high{animation:none}}
