*{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;color:#fff;overflow:hidden}body{font:700 16px/1.4 ui-monospace,Cascadia Mono,Consolas,monospace;-webkit-tap-highlight-color:transparent}#app{position:fixed;inset:0;display:flex;flex-direction:column}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}#bar{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:max(6px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) 6px max(10px,env(safe-area-inset-left));position:relative;z-index:3}.ui-btn{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 10px;color:#fff;background:#000;border:3px solid #fff;text-decoration:none;font:inherit;font-size:13px;text-transform:uppercase;cursor:pointer}.ui-btn:hover,.ui-btn:focus-visible{border-color:#ff0;color:#ff0;outline:none}.ui-btn:hover svg path,.ui-btn:focus-visible svg path{fill:#ff0}.ui-btn svg{display:block}#mute[aria-pressed=false]{border-color:#ff8c1a}#stage{flex:1 1 auto;position:relative;display:flex;align-items:center;justify-content:center;min-height:0;touch-action:none;user-select:none;-webkit-user-select:none}#stage canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges}html.touch:not(.landscape) #stage{align-items:flex-start;padding-top:6px}.loading{color:#fff;margin:0}#typebox{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;border:0;padding:0;font-size:16px;pointer-events:none;z-index:4}#typebox.active{pointer-events:auto}#touch{display:none;flex:0 0 auto;justify-content:space-between;align-items:center;padding:8px max(18px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));touch-action:none;user-select:none;-webkit-user-select:none;z-index:2}html.touch #touch{display:flex}#dpad{position:relative;width:156px;height:156px;touch-action:none}#dpad .d{position:absolute;width:52px;height:52px;border:3px solid #fff;background:#000}#dpad .up{left:52px;top:0}#dpad .down{left:52px;bottom:0}#dpad .left{left:0;top:52px}#dpad .right{right:0;top:52px}#dpad .d:after{content:"";position:absolute;inset:0;margin:auto;width:0;height:0;border:9px solid transparent}#dpad .up:after{border-bottom-color:#fff;transform:translateY(-4px)}#dpad .down:after{border-top-color:#fff;transform:translateY(4px)}#dpad .left:after{border-right-color:#fff;transform:translate(-4px)}#dpad .right:after{border-left-color:#fff;transform:translate(4px)}#dpad .d.on{background:#ff8c1a}#abtns{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;gap:12px;align-items:center}#abtns .b{width:62px;height:62px;border:3px solid #fff;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#000;color:#fff;font-size:20px}#abtns .b.big{width:76px;height:76px;border-color:#ff0;grid-column:2;grid-row:1 / span 2}#abtns .b.small{width:48px;height:48px;font-size:15px;grid-column:1;grid-row:1;justify-self:end}#abtns [data-btn=cancel]{grid-column:1;grid-row:2}#abtns .b.on{background:#ff8c1a}html.touch.landscape #touch{position:absolute;inset:auto 0 0;pointer-events:none;padding-bottom:max(10px,env(safe-area-inset-bottom))}html.touch.landscape #dpad,html.touch.landscape #abtns{pointer-events:auto;opacity:.75}#intro{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;background:#000;padding:12px;transition:opacity .35s steps(4);overflow:auto}#intro.gone{opacity:0;pointer-events:none}#intro .card{border:4px solid #fff;padding:22px 22px 16px;max-width:34rem;width:100%;text-align:center}#intro h1{margin:0;line-height:0}#intro h1 svg{max-width:72%;height:auto}#intro .soulrow{margin:12px 0 6px;line-height:0}#intro .soulrow svg{animation:beat 1.1s ease-in-out infinite}@keyframes beat{0%,to{transform:scale(.92)}15%{transform:scale(1.1)}30%{transform:scale(.97)}}#intro .headline{margin:10px 0 6px;font-size:17px}#intro .pitch{margin:0 0 16px;font-weight:400;color:#cfcfcf;font-family:system-ui,Segoe UI,sans-serif;font-size:15px}#intro .actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}#intro .ui-btn.big{border-color:#ff0;padding:8px 14px}#intro .ui-btn.big:disabled{border-color:gray;color:gray;cursor:wait}#intro .hint{margin:14px 0 0;color:gray;font-size:12px}html.js-off #play{display:none}.noscript{max-width:40rem;margin:40px auto;padding:0 16px;font-weight:400}.noscript a{color:#ff0}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
