@font-face{font-family:Geist Pixel;src:url(/experiments/pookiefly/fonts/GeistPixel-Square.woff2)format("woff2");font-weight:100 900;font-display:swap}:root{--ink:#fff;--dim:#999;--accent:#cdc6e2;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;font-synthesis:none;touch-action:none;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:#000;margin:0;font:400 16px/1.5 Geist Pixel,ui-monospace,monospace;overflow:hidden}body.flying{cursor:none}#field{width:100%;height:100%;position:fixed;inset:0}#title{text-align:center;flex-direction:column;align-items:center;gap:10px;padding:0 16px;display:flex;position:fixed;top:50vh;left:0;right:0}#title h1{color:var(--accent)}#title h1 span{animation:.8s cubic-bezier(.2,.8,.2,1.15) both letter;display:inline-block}#title p,#title button,#sound{animation:.8s ease-out both appear}#title p{animation-delay:3.2s}#title button{animation-delay:3.45s}#sound{animation-delay:3.7s}@keyframes letter{0%{opacity:0;filter:blur(8px);transform:translateY(.45em)}}@keyframes appear{0%{opacity:0;transform:translateY(10px)}}@media (prefers-reduced-motion:reduce){#title h1 span,#title p,#title button,#sound{animation:none}}#title p{color:#ccc;text-wrap:balance;max-width:30em;margin:0 0 14px;font-size:clamp(15px,2vw,18px)}h1{font-variant-numeric:tabular-nums;margin:0;font-size:clamp(52px,9vw,96px);font-weight:600;line-height:1.05}button{border:1px solid var(--ink);background:var(--ink);color:#000;cursor:pointer;border-radius:9999px;padding:14px 44px;font:500 16px/1 Geist Pixel,ui-monospace,monospace;transition:background .15s,color .15s}button:focus-visible{color:var(--ink);background:#000;outline:none}#hud{pointer-events:none}#height{top:max(18px, env(safe-area-inset-top));font-variant-numeric:tabular-nums;background:#000000b8;padding:2px 16px;font-size:38px;font-weight:600;line-height:1.2;position:fixed;left:50%;transform:translate(-50%)}#best{top:calc(max(18px, env(safe-area-inset-top)) + 52px);color:var(--dim);background:#000000b8;padding:0 10px;font-size:13px;position:fixed;left:50%;transform:translate(-50%)}#energy{left:50%;bottom:max(24px, env(safe-area-inset-bottom));background:#333;outline:6px solid #000000b8;width:min(380px,100vw - 48px);height:8px;position:fixed;transform:translate(-50%)}#energyFill{background:var(--ink);transform-origin:0;width:100%;height:100%;display:block}#energyText{left:50%;bottom:calc(max(24px, env(safe-area-inset-bottom)) + 14px);background:#000000b8;padding:0 8px;font-size:13px;font-weight:500;position:fixed;transform:translate(-50%)}#tideWarning{left:50%;bottom:calc(max(24px, env(safe-area-inset-bottom)) + 38px);color:#000;background:#fff;padding:2px 12px;font-size:14px;font-weight:600;position:fixed;transform:translate(-50%)}#pops{pointer-events:none;position:fixed;inset:0;overflow:hidden}.pop{white-space:nowrap;text-shadow:0 0 10px #000;font-size:18px;font-weight:600;animation:.9s ease-out both rise;position:absolute;transform:translate(-50%,-50%)}.pop.big{color:#cdc6e2;font-size:34px}.pop.huge{font-size:clamp(44px,8vw,84px);animation-duration:1.3s}#ending{text-align:center;background:#000c;flex-direction:column;justify-content:center;align-items:center;padding:16px;animation:.25s both arrive;display:flex;position:fixed;inset:0}#record{margin:8px 0 4px;font-size:18px;font-weight:500}#stats{color:var(--dim);font-variant-numeric:tabular-nums;margin:0 0 28px;font-size:14px}#hint{white-space:nowrap;pointer-events:none;background:#000000c7;margin:0;padding:6px 16px;font-size:18px;font-weight:500;position:fixed;top:34%;left:50%;transform:translate(-50%)}#sound{right:16px;bottom:max(16px, env(safe-area-inset-bottom));color:var(--dim);background:#000;border-color:#444;padding:9px 14px;font-size:13px;position:fixed}@keyframes rise{to{opacity:0;transform:translate(-50%,-190%)}}@keyframes arrive{0%{opacity:0}}@media (hover:hover){button:hover{color:var(--ink);background:#000;outline:none}}@media (max-height:480px){#title{gap:2px;top:46vh}#title h1{font-size:40px}#title p{margin-bottom:8px;font-size:13px}#title button{padding:10px 34px}}
