@font-face{font-family:Patrick Hand;src:url(/assets/patrick-hand-latin-B7HHA2Vw.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Bangers;src:url(/assets/bangers-latin-DeHY8Ncq.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--paper:#fbf7ea;--paper-2:#f1ead3;--ink:#1b2a5e;--ink-soft:#44507f;--accent:#1f4fd1;--on-accent:#fff;--danger:#b82a26;--ok:#17734a;--gold:#8a6a00;--focus:#1f4fd1;--shadow:#1b2a5e38;--table:#e7dfc8;--font:"Patrick Hand", "Comic Sans MS", "Segoe Print", cursive, sans-serif;--display:"Bangers", "Impact", "Comic Sans MS", cursive;--text-scale:1;--touch-size:1;--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);font-family:var(--font);color:var(--ink);--cursor-pencil:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 21l1.5-5L16 4.5l3.5 3.5L8 19.5z' fill='%23f2c94c' stroke='%231b2a5e' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M3 21l1.5-5 3.5 3.5z' fill='%231b2a5e'/%3E%3Cpath d='M16 4.5l1.8-1.8a1.5 1.5 0 012.1 0l1.4 1.4a1.5 1.5 0 010 2.1L19.5 8z' fill='%23e5579a' stroke='%231b2a5e' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") 3 21;--cursor-pen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 21l2-6 4 4z' fill='%231b2a5e'/%3E%3Cpath d='M5 15L17 3l4 4L9 19z' fill='%231f4fd1' stroke='%231b2a5e' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M14 6l4 4' stroke='%23fff' stroke-width='1.4'/%3E%3C/svg%3E") 3 21}*{box-sizing:border-box}[hidden]{display:none!important}html{font-size:calc(16px * var(--text-scale));cursor:var(--cursor-pencil), auto}html,body{background:var(--table);overscroll-behavior:none;touch-action:none;-webkit-tap-highlight-color:transparent;height:100%;margin:0;overflow:hidden}button,select,summary,label.check,.swatch,[role=button],[role=tab],a{cursor:var(--cursor-pen), pointer}input[type=text],input[type=number]{cursor:text}#game{position:fixed;inset:0}#game canvas{touch-action:none;display:block}#ui{pointer-events:none;z-index:10;position:fixed;inset:0}#ui>*{pointer-events:none}.skip{z-index:100;background:var(--paper);border:2.5px solid var(--ink);pointer-events:auto;border-radius:8px;padding:6px 12px;position:fixed;top:-60px;left:8px}.skip:focus{top:8px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@keyframes draw-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes wobble{0%{border-radius:8px 14px 9px 13px}50%{border-radius:13px 9px 14px 8px}}.card{pointer-events:auto;background:var(--paper);border:2.5px solid var(--ink);box-shadow:5px 6px 0 var(--shadow);background-image:repeating-linear-gradient(#0000 0 1.65rem,#1f4fd112 1.65rem 1.72rem);border-radius:6px 14px 8px 12px;gap:.75rem;max-height:calc(100dvh - 24px);padding:1.2rem 1.4rem;animation:.14s ease-out draw-in;display:grid;overflow:auto}.card>*{min-width:0}.card h1,.card h2,.card h3{margin:0}.card h1{font-family:var(--display);letter-spacing:1px;text-align:center;font-size:2.5rem;font-weight:400;line-height:1}.card h2{border-bottom:2px solid var(--ink);padding-bottom:2px;font-size:1.25rem;font-weight:400}.card p{margin:0}.sub{text-align:center;color:var(--ink-soft)}.hint{color:var(--ink-soft);font-size:.85rem}.error{min-height:1.3em;color:var(--danger);text-align:center}.screen{padding:max(12px, var(--safe-top)) max(12px, var(--safe-right)) max(12px, var(--safe-bottom)) max(12px, var(--safe-left));align-items:center;display:grid;position:absolute;inset:0}.screen.left{justify-items:start}.screen.center{justify-items:center}.screen .card.main{width:min(94vw,26rem)}.logo{font-family:var(--display);letter-spacing:2px;text-align:center;color:var(--ink);margin:0;font-size:3.1rem;font-weight:400;line-height:1;position:relative}.logo .wobble{display:inline-block}.logo .wobble:nth-child(odd){animation:.5s step-end infinite logo-a}.logo .wobble:nth-child(2n){animation:.5s step-end infinite logo-b}@keyframes logo-a{0%{transform:translateY(0)rotate(-1.5deg)}33%{transform:translateY(1px)rotate(1deg)}66%{transform:translateY(-1px)rotate(-.5deg)}}@keyframes logo-b{0%{transform:translateY(1px)rotate(1deg)}33%{transform:translateY(-1px)rotate(-1.5deg)}66%{transform:translateY(0)rotate(1deg)}}.logo:after{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'%3E%3Cpath d='M0 3 Q5 0 10 3 T20 3 T30 3 T40 3' fill='none' stroke='%231f4fd1' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") 50%/40px 6px repeat-x;height:6px;margin:2px 10% 0;display:block}label,.field{gap:4px;font-size:.95rem;display:grid}label.check{align-items:center;gap:8px;display:flex}input[type=text],input[type=number],select{font:inherit;border:2px solid var(--ink);background:var(--paper-2);color:var(--ink);border-radius:5px 9px 6px 8px;min-width:0;padding:6px 10px;font-size:1rem}input[type=checkbox]{appearance:none;border:2px solid var(--ink);background:var(--paper-2);border-radius:4px 7px 5px 6px;flex:none;place-content:center;width:1.3rem;height:1.3rem;margin:0;display:inline-grid}input[type=checkbox]:after{content:"";border-left:3px solid var(--accent);border-bottom:3px solid var(--accent);width:.7rem;height:.35rem;margin-top:-.15rem;transform:rotate(-48deg)scale(0)}input[type=checkbox]:checked:after{transform:rotate(-48deg)scale(1)}input[type=range]{accent-color:var(--accent);width:100%}input:disabled,select:disabled,button:disabled{opacity:.55}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.row{flex-wrap:wrap;align-items:center;gap:8px;min-width:0;display:flex}.row.nowrap{flex-wrap:nowrap}.row>.grow{flex:1;min-width:0}input.code{text-transform:uppercase;letter-spacing:3px}.btn{font:inherit;border:2.5px solid var(--ink);background:var(--accent);color:var(--on-accent);box-shadow:2px 3px 0 var(--shadow);border-radius:8px 14px 9px 13px;min-height:2.5rem;padding:.45em 1em;font-size:1.1rem}.btn.secondary{background:var(--paper-2);color:var(--ink)}.btn.small{min-height:2rem;padding:.2em .7em;font-size:.9rem}.btn.block{width:100%}.btn:hover:not(:disabled){animation:.167s step-end infinite wobble}.btn:active:not(:disabled){box-shadow:none;transform:translate(2px,2px)}.link{font:inherit;color:var(--ink-soft);-webkit-text-decoration:underline wavy var(--ink-soft) 1px;text-decoration:underline wavy var(--ink-soft) 1px;text-underline-offset:3px;background:0 0;border:0;padding:2px 6px}.link:hover{color:var(--ink)}.swatches{flex-wrap:wrap;gap:6px;display:flex}.swatch{border:2.5px solid var(--ink);border-radius:50%;place-items:center;width:2rem;height:2rem;padding:0;display:grid;position:relative}.swatch.on{outline:3px solid var(--ink);outline-offset:2px}.swatch svg{width:62%;height:62%}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{font:inherit;border:2px solid var(--ink);background:var(--paper-2);color:var(--ink);border-radius:6px 11px 7px 10px;padding:.2em .7em;font-size:.95rem}.chip.on{background:var(--ink);color:var(--paper)}.hats{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.hats .chip{text-align:center;padding:.3em .2em;font-size:.85rem}.panel{pointer-events:auto;top:max(8px, var(--safe-top));left:max(8px, var(--safe-left));bottom:max(8px, var(--safe-bottom));z-index:6;grid-template-rows:minmax(0,1fr);width:min(21rem,100vw - 16px);display:grid;position:absolute}.panel.collapsed{bottom:auto}.panel.collapsed .card{height:auto}.panel .card{background-color:#fbf7eaf5;align-content:start;gap:.6rem;height:100%;padding:.8rem .9rem}.lobby-title{align-items:center;gap:6px;display:flex}.lobby-title .code{font-family:var(--display);letter-spacing:4px;flex:1;font-size:2rem;line-height:1}.players{gap:4px;margin:0;padding:0;list-style:none;display:grid}.players li{align-items:center;gap:6px;min-width:0;display:flex}.players li.me .pname{-webkit-text-decoration:underline wavy var(--ink-soft) 1px;text-decoration:underline wavy var(--ink-soft) 1px;text-underline-offset:3px;font-weight:700}.players .pname{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.players .dot{border:2px solid var(--ink);border-radius:50%;flex:none;width:1.1rem;height:1.1rem}.players .ok{color:var(--ok);font-weight:700}.players .warn{color:var(--danger)}.players .ping{color:var(--ink-soft);text-align:right;min-width:2.6rem;font-size:.75rem}.settings{gap:.4rem;display:grid}.settings summary{margin-bottom:4px;font-size:1.1rem}.checks{gap:2px;font-size:.9rem;display:grid}.emotes{flex-wrap:wrap;gap:4px;display:flex}.emotes .btn{min-width:2rem;padding:.1em .5em}.rooms{gap:6px;display:grid}.room{border:2px dashed var(--ink-soft);border-radius:5px 9px 6px 8px;grid-template-columns:1fr auto;align-items:center;gap:2px 8px;padding:6px 8px;display:grid}.room .meta{color:var(--ink-soft);grid-column:1;font-size:.85rem}.room .btn{grid-area:1/2/3}.status{color:var(--ink-soft)}.hud{-webkit-user-select:none;user-select:none;font-size:1rem;position:absolute;inset:0}.hud-top{top:max(8px, var(--safe-top));border:2.5px solid var(--ink);box-shadow:3px 4px 0 var(--shadow);white-space:nowrap;background:#fbf7eaf0;border-radius:6px 12px 8px 10px;padding:3px 16px;font-size:1.1rem;position:absolute;left:50%;transform:translate(-50%)}.hud-top .big{font-family:var(--display);letter-spacing:1px;font-size:1.5rem}.hud-top .timer.sudden{color:var(--danger);font-family:var(--display);animation:.9s steps(2,end) infinite pulse}@keyframes pulse{50%{opacity:.55}}.hud-mode{top:calc(max(8px, var(--safe-top)) + 2.9rem);white-space:nowrap;background:#fbf7ead9;border-radius:8px;padding:1px 12px;font-size:.95rem;position:absolute;left:50%;transform:translate(-50%)}.hud-mode:empty{display:none}.margin{left:0;top:calc(max(8px, var(--safe-top)) + 3.6rem);width:10.5rem;max-width:36vw;padding:6px 8px 8px calc(var(--safe-left) + 14px);border:2.5px solid var(--ink);background-color:#fbf7eaeb;background-image:linear-gradient(90deg, transparent calc(var(--safe-left) + 9px), #d6322e8c calc(var(--safe-left) + 9px) calc(var(--safe-left) + 11px), transparent calc(var(--safe-left) + 11px));border-left:0;border-radius:0 12px 12px 0;gap:6px;display:grid;position:absolute}.srow{gap:1px;display:grid}.srow .sname{text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;overflow:hidden}.tally{height:1.6rem;display:block;overflow:visible}html[data-touch=on] .hud-self{left:50%;transform:translate(-50%)}.hud-self{left:max(10px, var(--safe-left));bottom:max(10px, var(--safe-bottom));border:2.5px solid var(--ink);box-shadow:3px 4px 0 var(--shadow);background:#fbf7eaf0;border-radius:6px 10px 7px 9px;align-items:center;gap:8px;padding:4px 10px;display:flex;position:absolute}.hpbar{align-items:flex-end;gap:2px;height:1.1rem;display:inline-flex}.hpbar i{border:1.5px solid var(--ink);background:var(--paper-2);border-radius:2px;width:5px;height:100%}.hpbar i.on{background:var(--ok)}.hpbar.mid i.on{background:#c46a0b}.hpbar.low i.on{background:var(--danger)}.hud-banner{text-align:center;max-width:94vw;position:absolute;top:26%;left:50%;transform:translate(-50%)}.hud-banner .bt{font-family:var(--display);color:var(--ink);-webkit-text-stroke:3px var(--paper);paint-order:stroke fill;text-shadow:3px 4px 0 var(--shadow);font-size:clamp(2.8rem,9vw,5.5rem);line-height:1;animation:.45s ease-out both write}.hud-banner .bs{color:var(--ink);-webkit-text-stroke:2px var(--paper);paint-order:stroke fill;font-size:1.5rem}@keyframes write{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -6px 0 0)}}.feed{top:calc(max(8px, var(--safe-top)) + 3.4rem);right:max(8px, var(--safe-right));justify-items:end;gap:3px;max-width:min(19rem,40vw);display:grid;position:absolute}.feed div{border-left:4px solid var(--ink);background:#fbf7eaed;border-radius:4px;padding:2px 8px;font-size:.85rem;animation:.14s ease-out draw-in}.stats{right:max(8px, var(--safe-right));bottom:max(6px, var(--safe-bottom));color:var(--ink-soft);background:#fbf7eacc;border-radius:6px;padding:0 6px;font-size:.8rem;position:absolute}.toast{bottom:max(16px, var(--safe-bottom));background:var(--ink);color:var(--paper);border-radius:8px 14px 9px 13px;padding:6px 16px;animation:.14s ease-out draw-in;position:absolute;left:50%;transform:translate(-50%)}.pausebtn{top:max(8px, var(--safe-top));right:max(8px, var(--safe-right));pointer-events:auto;position:absolute}.scrim{pointer-events:auto;background:#e7dfc8b3;place-items:center;padding:12px;display:grid;position:absolute;inset:0;overflow:auto}.card.wide{width:min(94vw,40rem)}.card.narrow{width:min(94vw,26rem)}.steps{justify-content:center;align-items:flex-end;gap:4px;min-height:8rem;display:flex}.step{border:2.5px solid var(--ink);text-align:center;background:var(--paper-2);border-bottom:0;border-radius:6px 10px 0 0;align-content:start;gap:2px;width:6.4rem;padding:4px 4px 0;display:grid}.step.first{background:#f2e4a8;height:7.2rem}.step.second{height:5.4rem}.step.third{height:4.2rem}.step .who{text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;overflow:hidden}.step .n{font-family:var(--display);font-size:1.8rem;line-height:1}table.table{border-collapse:collapse;width:100%;font-size:.85rem}table.table th,table.table td{text-align:left;border-bottom:1px solid #1b2a5e40;padding:2px 6px}.tabs{border-bottom:2px solid var(--ink);flex-wrap:wrap;gap:4px;padding-bottom:4px;display:flex}.tabs [role=tab]{font:inherit;border:2px solid var(--ink);background:var(--paper-2);color:var(--ink);border-radius:6px 11px 0 0;padding:.25em .8em;font-size:1rem}.tabs [role=tab][aria-selected=true]{background:var(--ink);color:var(--paper)}.optrow{grid-template-columns:minmax(7rem,1fr) minmax(0,1.4fr);align-items:center;gap:10px;display:grid}.keys{grid-template-columns:1fr auto auto;align-items:center;gap:6px 8px;display:grid}.keycap{min-width:4.2rem;font:inherit;border:2px solid var(--ink);background:var(--paper-2);color:var(--ink);border-bottom-width:4px;border-radius:7px;padding:.2em .6em}.keycap.listening{background:var(--ink);color:var(--paper)}.notebook{pointer-events:auto;z-index:6;top:max(8px, var(--safe-top));right:max(8px, var(--safe-right));width:min(19rem,46vw);max-height:calc(100dvh - 90px);position:absolute}.notebook .card{gap:.3rem;max-height:calc(100dvh - 90px);padding:.6rem .8rem}.notebook .card[hidden]{display:none}.notebook.compact{right:auto;left:max(8px, var(--safe-left));gap:6px;width:min(22rem,58vw);display:grid}.notebook-toggle{border:2.5px solid var(--ink);background:var(--paper);width:100%;min-height:2.6rem;color:var(--ink);font:inherit;text-align:left;border-radius:12px 16px 13px 17px;align-items:baseline;gap:.5rem;padding:.3rem .7rem;font-size:.95rem;display:flex}.notebook-toggle span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.goals{gap:2px;margin:0;padding:0;font-size:.95rem;list-style:none;display:grid}.goals li{align-items:flex-start;gap:6px;display:flex}.goals .box{border:2px solid var(--ink);border-radius:4px 7px 5px 6px;flex:none;place-items:center;width:1.1rem;height:1.1rem;margin-top:1px;display:grid}.goals li.done{color:var(--ink-soft)}.goals li.done .txt{-webkit-text-decoration:line-through wavy var(--ink-soft) 1px;text-decoration:line-through wavy var(--ink-soft) 1px}.goals .box svg{width:120%;height:120%;stroke:var(--ok)}.bottomleft{left:max(10px, var(--safe-left));bottom:max(10px, var(--safe-bottom));pointer-events:auto;position:absolute}.spinner{border:3px solid var(--ink);vertical-align:-3px;border-right-color:#0000;border-radius:50%;width:1.2rem;height:1.2rem;animation:.9s steps(8,end) infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.touch{pointer-events:none;touch-action:none;-webkit-user-select:none;user-select:none;position:absolute;inset:0}.touch>*{pointer-events:auto}.stickzone{bottom:max(14px, var(--safe-bottom));left:max(18px, var(--safe-left));width:calc(10rem * var(--touch-size));height:calc(10rem * var(--touch-size));background:#fbf7ea59;border:2.5px dashed #1b2a5e80;border-radius:50%;position:absolute}.stickzone.swap{left:auto;right:max(18px, var(--safe-right))}.stickzone .knob{width:calc(4rem * var(--touch-size));height:calc(4rem * var(--touch-size));margin:calc(-2rem * var(--touch-size)) 0 0 calc(-2rem * var(--touch-size));border:2.5px solid var(--ink);background:#fbf7eacc;border-radius:50%;position:absolute;top:50%;left:50%}.tbtns{bottom:max(14px, var(--safe-bottom));right:max(18px, var(--safe-right));width:calc(14rem * var(--touch-size));height:calc(10rem * var(--touch-size));position:absolute}.tbtns.swap{right:auto;left:max(18px, var(--safe-left))}.tbtn{width:calc(4.6rem * var(--touch-size));height:calc(4.6rem * var(--touch-size));border:2.5px solid var(--ink);color:var(--ink);font:inherit;font-size:calc(1rem * var(--touch-size));background:#fbf7ea8c;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute}.tbtn.down{color:#fff;background:#1f4fd18c}.tbtn.jump{right:0;bottom:calc(2.4rem * var(--touch-size));width:calc(5.4rem * var(--touch-size));height:calc(5.4rem * var(--touch-size))}.tbtn.attack{right:calc(5.4rem * var(--touch-size));bottom:0}.tbtn.block{right:calc(8.6rem * var(--touch-size));bottom:calc(5.2rem * var(--touch-size))}.tbtn.pickup{right:calc(1.4rem * var(--touch-size));bottom:calc(7.8rem * var(--touch-size));width:calc(3.8rem * var(--touch-size));height:calc(3.8rem * var(--touch-size))}.tsmall{top:max(8px, var(--safe-top));right:max(8px, var(--safe-right));gap:6px;display:flex;position:absolute}.tsmall .btn{min-width:2.6rem}.rotate{background:var(--paper);text-align:center;pointer-events:auto;z-index:50;place-items:center;padding:24px;font-size:1.4rem;display:none;position:absolute;inset:0}@media (orientation:portrait){html[data-touch=on][data-playing=on] .rotate{display:grid}}#netgraph{pointer-events:none;z-index:30;background:#0a0e1ed1;border-radius:6px;position:fixed;top:8px;right:8px}#tuning{color:#dfe6ff;z-index:30;background:#0a0e1ee0;border-radius:6px;width:300px;max-height:60vh;padding:8px;font:12px/1.3 ui-monospace,monospace;position:fixed;bottom:8px;right:8px;overflow:auto}#tuning label{grid-template-columns:1fr 52px;gap:2px 6px;margin-bottom:5px;display:grid}#tuning input[type=range]{grid-column:1/3;width:100%}#tuning button{font:inherit;margin:0 4px 6px 0;padding:1px 6px}@media (max-width:700px){.card h1{font-size:2rem}.logo{font-size:2.4rem}.margin{width:8rem}}@media (max-height:460px){.card{gap:.45rem;padding:.6rem .8rem}.logo{font-size:2rem}.hud-banner{top:18%}}html[data-motion=reduced] *,html[data-motion=reduced] :before,html[data-motion=reduced] :after{transition:none!important;animation:none!important}