@font-face{font-family:Joystix;src:url(/assets/joystix.ttf) format("truetype");font-display:block}@font-face{font-family:Unifont;src:url(/assets/unifont.ttf) format("truetype");font-display:block}:root{color-scheme:dark;background:#131116;font-family:Joystix,monospace}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{display:flex;flex-direction:column;background:#131116;touch-action:none;height:100dvh}#play-area{flex:1;min-height:0;width:100%;display:grid;place-items:center}#stage{--game-ratio:1.777777778;position:relative;width:min(100%,calc(var(--play-area-height,100dvh)*var(--game-ratio)));aspect-ratio:var(--game-ratio);transform:translateY(var(--stage-offset,0px))}#game{display:block;width:100%;height:100%;outline:none;image-rendering:pixelated;cursor:default}#loading{position:absolute;inset:0;display:grid;place-content:center;text-align:center;font-size:clamp(24px,6vw,48px);gap:24px;background:#131116;color:#eceee9}#loading span{font-size:10px}[hidden]{display:none!important}.mobile body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#orientation-gate{position:fixed;inset:0;z-index:10;display:none;place-items:center;text-align:center;background:#131116;color:#eceee9;padding:24px max(24px,env(safe-area-inset-right)) 24px max(24px,env(safe-area-inset-left))}@media(any-pointer:coarse)and (orientation:landscape),(max-width:900px)and (orientation:landscape){#orientation-gate{display:grid}#play-area,#touch{display:none!important}}#orientation-gate h1{font-size:16px;margin:24px 0 16px;line-height:1.5}#orientation-gate p{font-size:10px;line-height:1.6;margin:0;color:#eceee9b0}.portrait-phone{position:relative;display:block;width:34px;height:58px;border:2px solid currentColor;border-radius:6px;margin:auto}.portrait-phone:after{content:"";position:absolute;bottom:5px;left:50%;width:9px;height:2px;background:currentColor;transform:translate(-50%)}#touch{flex:none;width:100%;max-width:780px;align-self:center;padding:12px 22px 16px;color:#eceee9;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#touch button{font-family:inherit;border:2px solid #eceee9;background:#131116;color:#eceee9;touch-action:none;cursor:pointer;-webkit-tap-highlight-color:transparent}#touch button:focus-visible{outline:2px solid #a6de57;outline-offset:4px}#touch button.is-held{background:#eceee9;color:#131116}#touch button:disabled{opacity:.35;cursor:default}.touch-toolbar{display:flex;justify-content:center;gap:10px;margin-bottom:14px;min-height:36px}.touch-action{border-radius:6px;min-width:76px;min-height:36px;padding:8px 12px;font-size:9px}.touch-main{display:flex;align-items:center;justify-content:space-between;padding:0 6px}.touch-stick-wrap{display:grid;justify-items:center;gap:9px;font-size:8px}#touch-stick{position:relative;width:112px;height:112px;border-radius:50%;background:#1d1a22}.stick-direction{position:absolute;width:0;height:0;border:5px solid transparent;pointer-events:none}.stick-up{top:8px;left:50%;border-top:0;border-bottom-color:#eceee966;transform:translate(-50%)}.stick-down{bottom:8px;left:50%;border-bottom:0;border-top-color:#eceee966;transform:translate(-50%)}.stick-left{left:8px;top:50%;border-left:0;border-right-color:#eceee966;transform:translateY(-50%)}.stick-right{right:8px;top:50%;border-right:0;border-left-color:#eceee966;transform:translateY(-50%)}#touch-stick-thumb{position:absolute;left:50%;top:50%;width:44px;height:44px;border-radius:50%;border:2px solid #eceee9;background:#131116;transform:translate(calc(-50% + var(--stick-x,0px)),calc(-50% + var(--stick-y,0px)));pointer-events:none}#touch-stick.is-held{background:#1d1a22}#touch-stick.is-held #touch-stick-thumb{background:#eceee9}#touch-primary{width:96px;height:96px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-size:10px}.jump-icon{position:relative;width:3px;height:26px;background:currentColor;margin-top:4px}.jump-icon:before{content:"";position:absolute;top:0;left:50%;width:13px;height:13px;border-top:3px solid currentColor;border-left:3px solid currentColor;transform:translate(-50%) rotate(45deg)}
