header{pointer-events:none;justify-content:space-between;align-items:start;gap:20px;display:flex;position:absolute;inset:26px 30px auto}header a{pointer-events:auto;background:#fff6e9;border:2px solid #251a39;border-radius:6px;padding:10px 14px;box-shadow:3px 3px #251a39}#panel a,header a{color:inherit;text-underline-offset:3px}.eyebrow{letter-spacing:.15em;font-size:11px;font-weight:800}header h1{letter-spacing:-.04em;margin:7px 0;font-size:clamp(20px,2.5vw,32px)}#panel{background:#fff6e9ee;border:2px solid #251a39;border-radius:9px;width:258px;max-height:calc(100% - 170px);padding:18px;position:absolute;top:116px;left:30px;overflow-y:auto;box-shadow:5px 5px #251a39}.panel-title{justify-content:space-between;align-items:center;gap:8px;display:flex}#backend{white-space:nowrap;background:#c5ebc8;border:1px solid #251a39;border-radius:20px;padding:4px 7px;font-size:10px;font-weight:800}#panel p{font-size:12px;line-height:1.6}#panel label{justify-content:space-between;align-items:center;gap:10px;margin:12px 0;font-size:12px;display:flex}#panel select,#panel button{font:inherit;color:inherit;background:#fffaf3;border:1px solid #675876;border-radius:4px;padding:6px}#panel select{max-width:140px}.checks{border-block:1px solid #d6c9ce;margin:15px 0;padding:1px 0}#panel .checks label{justify-content:start;gap:7px}#panel input{accent-color:#7a569a}#stage:not(.playing) .play-only{display:none}#panel .tuning{grid-template-columns:1fr auto;gap:5px;display:grid}#panel .tuning input{grid-column:1/-1;width:100%;margin:0}#panel .tuning output{font-variant-numeric:tabular-nums}#control-help{font-size:11px;line-height:1.5}#camera-defaults{width:100%;font-size:12px}.buttons{gap:8px;display:flex}#panel button{cursor:pointer;flex:1}#panel button:hover,#panel a:hover,header a:hover{background:#e9ddf4}#panel details{margin-top:14px;font-size:11px}#panel summary{cursor:pointer}#panel nav{gap:8px;margin-top:10px;display:grid}footer{pointer-events:none;justify-content:space-between;gap:16px;font-size:11px;display:flex;position:absolute;inset:auto 30px 20px}footer span{background:#fff6e9cc;border-radius:4px;padding:5px 9px}#respawn{width:100%;font-size:12px}#sound{width:100%;margin-top:8px;font-size:12px}#sound[aria-pressed=true]{background:#c5ebc8}@media (max-width:700px){header{inset:16px 16px auto}header h1{max-width:210px;font-size:20px}header a{max-width:105px;padding:7px;font-size:11px}.eyebrow{font-size:8px}#panel{width:auto;max-height:50%;padding:10px 12px;inset:auto 12px 43px}.panel-title{grid-column:1/-1}#panel p,#panel details details{display:none}#panel label:has(#output){display:none}#panel label{margin:7px 0;font-size:11px}.checks{flex-wrap:wrap;grid-column:1/-1;gap:12px;margin:5px 0;display:flex}.buttons{align-items:center}footer{font-size:9px;inset:auto 12px 10px}#stats{display:none}#stage.playing #panel{width:220px;max-height:45%;top:110px;bottom:auto;right:auto}#stage.playing #instructions{max-width:95%}}#panel{color:#251a39;font:400 16px system-ui,sans-serif}#close-settings,#recheck-scale{width:100%;font-size:12px}@media (max-width:700px){#panel #render-size{margin:4px 0;font-size:10px;display:block}}@font-face{font-family:Bangers;src:url(./Bangers-Regular-DN579fIx.ttf)format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Comic Neue;src:url(./ComicNeue-Bold-nXe1ztkF.ttf)format("truetype");font-weight:700;font-display:swap}@font-face{font-family:Comic Neue;src:url(./ComicNeue-BoldItalic-dEerQN03.ttf)format("truetype");font-weight:700;font-style:italic;font-display:swap}:root{--ink:#15101f;--paper:#fff6dc;--sun:#ffd92e;--pop:#ff2d6f;--sky:#27b4ff;--stage:#2a78d8;--font-display:"Bangers", Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;--font-body:"Comic Neue", "Comic Sans MS", "Chalkboard SE", "Trebuchet MS", sans-serif;--edge:16px}[hidden]{display:none!important}*,:before,:after{box-sizing:border-box}html,body{height:100%}body{background:var(--stage);color:var(--ink);font:700 16px/1.35 var(--font-body);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;overflow:hidden}#stage{background:var(--stage);width:100%;height:100%;position:relative;overflow:hidden}#view{touch-action:none;cursor:grab;outline:none;width:100%;height:100%;display:block;position:absolute;inset:0}#view.drag{cursor:grabbing}button{font:inherit;color:inherit}button:focus-visible{outline:3px solid var(--sky);outline-offset:3px}kbd{font:400 .82em/1 var(--font-display);letter-spacing:1px;background:var(--ink);color:var(--paper);border-radius:4px;margin-right:6px;padding:3px 7px 2px}#film i{pointer-events:none;background-color:var(--ink);background-image:repeating-linear-gradient(90deg, transparent 0 20px, var(--paper) 20px 38px, transparent 38px 58px);background-position:0;background-repeat:repeat-x;background-size:58px 38%;height:9%;transition:transform .5s cubic-bezier(.3,1,.4,1);position:absolute;left:0;right:0}#film i:first-child{top:0;transform:translateY(-101%)}#film i:last-child{bottom:0;transform:translateY(101%)}#film.on i{animation:1.6s linear infinite reel;transform:none}@keyframes reel{to{background-position-x:58px}}#pops{pointer-events:none;position:absolute;inset:0;overflow:hidden}.pop{white-space:nowrap;font:400 var(--s,52px)/1 var(--font-display);letter-spacing:2px;color:var(--c,var(--sun));-webkit-text-stroke:7px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--pop);animation:1s cubic-bezier(.2,.9,.3,1) forwards pop;position:absolute;transform:translate(-50%,-50%)}.pop.soft{--c:var(--paper);text-shadow:3px 3px 0 var(--sky)}@keyframes pop{0%{transform:translate(-50%, -50%) rotate(var(--r,-6deg)) scale(.2);opacity:0}16%{transform:translate(-50%, -62%) rotate(var(--r,-6deg)) scale(1.22);opacity:1}30%{transform:translate(-50%, -66%) rotate(var(--r,-6deg)) scale(1)}75%{opacity:1}to{transform:translate(-50%, -125%) rotate(var(--r,-6deg)) scale(1.04);opacity:0}}#hud>*{position:absolute}#tally{top:var(--edge);left:var(--edge);pointer-events:none;flex-wrap:wrap;gap:10px;display:flex}.chip{background:var(--sun);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font:400 26px/1 var(--font-display);letter-spacing:1px;font-variant-numeric:tabular-nums;align-items:baseline;gap:3px;padding:5px 12px 3px;display:inline-flex;transform:rotate(-2deg)}.chip+.chip{background:var(--paper);transform:rotate(1.5deg)}.chip small{letter-spacing:1.5px;text-transform:uppercase;font-size:.62em}.chip.bump{animation:.45s cubic-bezier(.3,1.8,.5,1) bump}@keyframes bump{40%{scale:1.28}}#tools{top:var(--edge);right:var(--edge);gap:8px;display:flex}#tools button{font:400 18px/1 var(--font-display);letter-spacing:1.5px;text-transform:uppercase;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;padding:7px 11px 5px}#tools button:hover{background:var(--sun)}#tools button:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}#tools button[aria-pressed=false]{text-decoration:line-through}#place{top:calc(var(--edge) + 58px);font:400 30px/1 var(--font-display);letter-spacing:2px;text-transform:uppercase;white-space:nowrap;color:var(--paper);-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;opacity:0;pointer-events:none;transition:opacity .6s;left:50%;transform:translate(-50%)}#place.on{opacity:1}#caption{left:var(--edge);bottom:calc(var(--edge) + 8px);max-width:min(430px, calc(100% - 2 * var(--edge)));background:var(--sun);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);pointer-events:none;padding:12px 16px 10px;transition:transform .55s cubic-bezier(.2,1.2,.4,1);transform:translate(-125%)rotate(-1.5deg)}#caption.on{transform:translate(0)rotate(-1.5deg)}#capTag{font:400 15px/1 var(--font-display);letter-spacing:2px;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:4px 8px 3px;display:inline-block}#capText{font:italic 700 18px/1.25 var(--font-body);text-transform:uppercase;text-wrap:balance;margin:8px 0 0}#prompt{background:var(--paper);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font:400 22px/1 var(--font-display);letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap;opacity:0;pointer-events:none;padding:8px 14px 6px;transition:opacity .2s;bottom:17%;left:50%;transform:translate(-50%)rotate(-1deg)}#prompt.on{opacity:1}#powers{right:var(--edge);bottom:var(--edge);pointer-events:none;gap:8px;display:flex}#powers span{font:400 16px/1 var(--font-display);letter-spacing:1.5px;text-transform:uppercase;background:var(--paper);border:3px solid var(--ink);padding:6px 9px 4px;transition:transform .15s,background .15s}#powers span.on{background:var(--pop);color:var(--paper);box-shadow:4px 4px 0 var(--ink);transform:translateY(-5px)rotate(-3deg)}#powers span.on kbd{background:var(--paper);color:var(--ink)}#breath{pointer-events:none;justify-items:center;gap:12px;display:grid;position:absolute;bottom:13%;left:50%;transform:translate(-50%)}#breathRing{border:4px solid var(--paper);background:color-mix(in srgb, var(--paper) 24%, transparent);width:96px;height:96px;box-shadow:0 0 0 3px var(--ink), inset 0 0 0 3px var(--ink);border-radius:50%}#breathText{font:400 24px/1 var(--font-display);letter-spacing:2px;text-transform:uppercase;color:var(--paper);-webkit-text-stroke:5px var(--ink);paint-order:stroke fill}#slate{pointer-events:none;width:min(300px,70%);animation:1.9s cubic-bezier(.2,1,.3,1) forwards slateIn;position:absolute;top:17%;left:50%;transform:translate(-50%)rotate(-3deg)}.clap{border:3px solid var(--ink);transform-origin:0 100%;background:repeating-linear-gradient(-55deg, var(--ink) 0 22px, var(--paper) 22px 44px);height:34px;animation:1.9s ease-out forwards clap}.board{background:var(--ink);color:var(--paper);border:3px solid var(--ink);gap:2px;padding:10px 16px 12px;display:grid}.board small{font:400 16px/1 var(--font-display);letter-spacing:3px;text-transform:uppercase;color:var(--sun)}.board strong{font:400 46px/1 var(--font-display);letter-spacing:3px;text-transform:uppercase}@keyframes slateIn{0%{opacity:0;translate:0 -40px}12%{opacity:1;translate:0}80%{opacity:1}to{opacity:0;translate:0 -20px}}@keyframes clap{0%,12%{rotate:-24deg}22%,to{rotate:0deg}}#help,#failure{padding:var(--edge);background:color-mix(in srgb, var(--ink) 45%, transparent);place-items:center;display:grid;position:absolute;inset:0;overflow:auto}.sheet{background:var(--paper);border:4px solid var(--ink);width:min(560px,100%);box-shadow:9px 9px 0 var(--ink);-webkit-user-select:text;user-select:text;padding:20px 22px 18px;transform:rotate(-.6deg)}.sheet h2{font:400 40px/1 var(--font-display);letter-spacing:2px;text-transform:uppercase;text-wrap:balance;margin:0 0 12px}.sheet dl{grid-template-columns:auto 1fr;gap:7px 14px;margin:0;display:grid}.sheet dt{font:400 17px/1.25 var(--font-display);letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap}.sheet dd{min-width:0;margin:0}.sheet p{max-width:60ch;margin:14px 0 0}.sheet .row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.sheet button{font:400 20px/1 var(--font-display);letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;background:var(--sun);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:8px 14px 6px}.sheet button.quiet{background:var(--paper)}.sheet button:active{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}#title{padding:var(--edge) clamp(16px, 7vw, 110px);align-content:center;justify-items:start;gap:clamp(14px,3vh,26px);transition:opacity .8s,transform .8s;display:grid;position:absolute;inset:0;overflow:hidden}#title.gone{opacity:0;pointer-events:none;transform:translate(-6%)}.burst{pointer-events:none;background:repeating-conic-gradient(color-mix(in srgb, var(--paper) 30%, transparent) 0 6deg, transparent 6deg 12deg);width:170vmax;height:170vmax;animation:140s linear infinite spin;position:absolute;top:46%;left:24%;translate:-50% -50%;-webkit-mask:radial-gradient(circle,#000 3%,#0000 44%);mask:radial-gradient(circle,#000 3%,#0000 44%)}@keyframes spin{to{rotate:360deg}}.logo{justify-items:start;gap:14px;display:grid;position:relative;transform:rotate(-5deg)}.kicker{font:italic 700 clamp(13px, 1.6vw, 18px)/1.2 var(--font-body);text-transform:uppercase;letter-spacing:1px;background:var(--sun);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:6px 12px 5px}.logo h1{font:400 clamp(62px, 13vw, 170px)/.82 var(--font-display);letter-spacing:2px;text-transform:uppercase;color:var(--sun);-webkit-text-stroke:clamp(8px, 1.4vw, 16px) var(--ink);paint-order:stroke fill;text-shadow:clamp(5px, .9vw, 11px) clamp(5px, .9vw, 11px) 0 var(--pop);margin:0}.logo h1 span{display:block}.logo h1 span+span{color:var(--paper);margin-left:.55em;font-size:.62em}#start{cursor:pointer;font:400 clamp(26px, 4.4vw, 44px)/1 var(--font-display);letter-spacing:2px;text-transform:uppercase;color:var(--paper);background:var(--pop);border:4px solid var(--ink);box-shadow:7px 7px 0 var(--ink);padding:14px 30px 11px;transition:transform .12s,box-shadow .12s;position:relative;transform:rotate(-2deg)}#start:hover{box-shadow:9px 9px 0 var(--ink);transform:rotate(-2deg)translate(-2px,-2px)}#start:active{box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)translate(4px,4px)}#start[disabled]{background:var(--paper);color:var(--ink);cursor:progress}.keys{max-width:46ch;font:700 clamp(13px, 1.5vw, 16px)/1.4 var(--font-body);background:var(--paper);border:3px solid var(--ink);margin:0;padding:8px 12px 7px;position:relative;transform:rotate(.6deg)}#touch>*{position:absolute}#stick{pointer-events:none;border:3px solid var(--ink);background:color-mix(in srgb, var(--paper) 40%, transparent);border-radius:50%;width:124px;height:124px;bottom:26px;left:22px}#knob{background:var(--sun);border:3px solid var(--ink);border-radius:50%;width:54px;height:54px;margin:-27px;position:absolute;top:50%;left:50%}#touch-controls{grid-template-columns:auto auto;place-items:end;gap:10px;display:grid;bottom:26px;right:18px}#touch-controls button{touch-action:none;width:74px;height:74px;font:400 18px/1 var(--font-display);letter-spacing:1px;text-transform:uppercase;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);border-radius:50%}#touch-controls button.on{background:var(--sun)}#touch-jump{color:var(--paper);grid-row:span 2;background:var(--pop)!important;width:96px!important;height:96px!important}#stage.touch #caption{bottom:170px}#stage.touch #powers,#stage.photo #hud,#stage.photo #touch{display:none}#tally,#tools,#powers{transition:opacity .5s}#stage.cine #tally,#stage.cine #tools,#stage.cine #powers,#stage.cine #place{opacity:0;pointer-events:none}@media (max-width:620px){#tally{flex-direction:column;align-items:flex-start;gap:6px}.chip{padding:4px 9px 2px;font-size:20px}#tools button{padding:6px 8px 4px;font-size:15px}#place{top:calc(var(--edge) + 88px);font-size:22px}#powers{display:none}#capText{font-size:15px}.sheet h2{font-size:32px}}@media (prefers-reduced-motion:reduce){.burst,#film.on i{animation:none}.pop{animation-duration:1.5s}}#stage header,#stage footer{display:none}#stage:not(.playing) header,#stage:not(.playing) footer{display:flex}#stage:not(.playing) #title,#stage:not(.playing) #film,#stage:not(.playing) #pops,#stage:not(.playing) #slate,#stage.intro #hud,#stage.intro #panel,#stage.intro #touch{display:none}#panel{z-index:8}#failure{z-index:20}#loading{display:none}#helpTitle:focus{outline:none}#interact{all:unset;cursor:pointer;pointer-events:auto}#interact:focus-visible{outline:3px solid var(--sky);outline-offset:3px}#stage.photo #panel{display:none}#stage.paused *,#stage.away *{animation-play-state:paused!important}