:root{--paper: #FBFAF6;--ink: #18171C;--red: #D7262E;--red-text: #B0141C;--legal: #F6E27F;--blue: #2A5F8F;--muted: #57555E;--display: "Big Shoulders Stencil Display", "Arial Narrow", Impact, sans-serif;--body: "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;background:#e9e4da;color:var(--ink);font:16px/1.45 var(--body);-webkit-font-smoothing:antialiased}:focus-visible{outline:3px solid var(--red);outline-offset:2px}.stage{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;background:#e9e4da}.stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.stage-fallback{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;text-align:center;padding:24px;font-weight:700}.stage.ready .stage-fallback{display:none}.stage.in-menu .fight-only{display:none!important}.hud{position:absolute;pointer-events:none}.hud button,.hud input,.hud a,.hud form{pointer-events:auto}.bars{top:max(10px,env(safe-area-inset-top));left:12px;right:12px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:start}.bar{display:grid;gap:5px;min-width:0}.bar .row{display:flex;align-items:center;gap:8px;min-width:0}.bar.r .row{flex-direction:row-reverse}.bar .nm{font:800 20px/1 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--ink);background:#fff;border:2px solid var(--ink);padding:2px 8px 3px;flex:none}.bar.you .nm{background:var(--legal)}.bar.you .nm:after{content:" · you";font-size:.7em}.strip{position:relative;flex:1;height:20px;min-width:0;background:#18171c8c;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.strip i{position:absolute;top:0;bottom:0;left:0;width:100%;background-color:var(--paper);background-image:linear-gradient(90deg,#B7D2E7 1px,transparent 1px);background-size:10px 100%;border-right:3px solid var(--red);transition:width .12s}.bar.r .strip i{left:auto;right:0;border-right:0;border-left:3px solid var(--red)}.sliver{position:absolute;top:0;bottom:0;background:var(--paper);border:1px solid var(--ink);animation:sliver .9s ease-in forwards;pointer-events:none}@keyframes sliver{0%{transform:none;opacity:1}to{transform:translateY(46px) rotate(18deg);opacity:0}}.pips{display:flex;gap:6px;padding-left:3px}.bar.r .pips{justify-content:flex-end;padding:0 3px 0 0}.pips b{width:12px;height:12px;border:2px solid var(--ink);background:#fff;transform:rotate(45deg)}.pips b.on{background:var(--red)}.pips .tally{font:700 13px/1 var(--body);background:#fff;border:2px solid var(--ink);padding:2px 6px}.clock{font:800 34px/1 var(--display);background:#fff;color:var(--ink);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:4px 10px 6px;min-width:62px;text-align:center;font-variant-numeric:tabular-nums}.hbtn{font:700 14px var(--body);color:var(--ink);background:#fff;border:2px solid var(--ink);padding:7px 12px;min-height:40px;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}.hbtn:hover{background:var(--legal)}.hbtn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}.hbtn b{color:var(--blue)}.opts{top:82px;right:12px;display:flex;gap:6px}.opts .hbtn{font-size:13px;padding:5px 9px;min-height:34px;box-shadow:2px 2px 0 var(--ink)}.mbtn{display:block;width:100%;text-align:left;font:800 26px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--ink);background:#fff;border:2px solid var(--ink);padding:12px 16px;cursor:pointer;box-shadow:4px 4px 0 var(--ink)}.mbtn small{display:block;font:400 14px/1.3 var(--body);text-transform:none;letter-spacing:0;color:var(--muted);margin-top:4px}.mbtn:hover{background:var(--legal)}.mbtn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}.mbtn.red{background:var(--red);color:#fff}.mbtn.red small{color:#ffe9e9}.mbtn.red:hover{background:var(--red-text)}.banner{top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.banner div{font:800 clamp(40px,8vw,86px)/.95 var(--display);text-transform:uppercase;text-align:center;color:#fff;background:var(--red);border:3px solid #FFF;outline:2px solid var(--ink);padding:10px 26px 14px;transform:rotate(-3deg);max-width:calc(100% - 32px)}.banner small{display:block;font:700 16px var(--body);letter-spacing:.04em;margin-top:6px;text-transform:none}.rematch{left:50%;bottom:22%;transform:translate(-50%)}.rematch .mbtn{width:auto;text-align:center}.labels{top:0;right:0;bottom:0;left:0;overflow:hidden}.wlabel{position:absolute;left:0;top:0;font:800 30px/1 var(--display);text-transform:uppercase;letter-spacing:.04em;padding:2px 10px 4px;background:#fff;color:var(--ink);border:2px solid var(--ink);transform:translate(-50%,-100%) rotate(-4deg);white-space:nowrap}.wlabel.cut{background:var(--red);color:#fff}.wlabel.gold{background:var(--legal)}.pop{animation:pop 1s ease-out forwards}@keyframes pop{0%{opacity:0;margin-top:8px}12%{opacity:1;margin-top:0}70%{opacity:1}to{opacity:0;margin-top:-30px}}.aim{position:absolute;left:0;top:0;width:22px;height:22px;margin:-11px 0 0 -11px;pointer-events:none}.aim:before,.aim:after{content:"";position:absolute;background:var(--ink);box-shadow:0 0 0 1px #fff}.aim:before{left:10px;top:0;width:2px;height:22px}.aim:after{top:10px;left:0;width:22px;height:2px}.aim i{position:absolute;left:8px;top:8px;width:6px;height:6px;background:var(--red);border:1px solid #FFF;z-index:1}.status{left:12px;bottom:max(12px,env(safe-area-inset-bottom));font:700 13px var(--body);background:#fff;border:2px solid var(--ink);padding:4px 8px}.status:empty{display:none}.status.warn{background:var(--legal)}.build{position:absolute;right:8px;bottom:6px;font:700 11px var(--body);color:#18171c8c;pointer-events:none}.hud-chips{left:12px;right:12px;bottom:44px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.chip{font:700 14px var(--body);color:#fff;background:var(--ink);border:2px solid #FFF;padding:7px 12px;min-height:44px;min-width:44px;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none}.chip.cut{background:var(--red-text)}@media (hover: hover) and (pointer: fine){.hud-chips{display:none}}.menu{top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;overflow-y:auto;background:#e9e4da59}.menu .card{pointer-events:auto;width:min(520px,100%);background:var(--paper);border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:22px 22px 18px;display:grid;gap:16px;background-image:linear-gradient(rgba(42,95,143,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(42,95,143,.09) 1px,transparent 1px);background-size:22px 22px}.menu h1{font:800 clamp(56px,12vw,92px)/.9 var(--display);text-transform:uppercase;margin:0;position:relative;width:fit-content}.menu h1 .slip{display:inline-block;transform:translate(.05em,-.04em)}.menu h1:after{content:"";position:absolute;left:-3%;right:-3%;top:48%;height:3px;background:var(--red);transform:rotate(-4deg)}.menu .tag{margin:-6px 0 0;font-weight:700;color:var(--muted)}.stack{display:grid;gap:12px}.stack>.hbtn{justify-self:start}.row2{display:flex;gap:8px;flex-wrap:wrap}.soundbox{pointer-events:auto;display:grid;gap:8px;background:var(--paper);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:10px 12px;z-index:5}.soundbox label{display:grid;grid-template-columns:62px min(150px,50vw);align-items:center;gap:8px;font-weight:700;font-size:14px}.soundbox input{accent-color:var(--red);width:100%}.big{font:800 30px/1.05 var(--display);text-transform:uppercase;margin:0}.big b{color:var(--red-text);letter-spacing:.08em}.muted{color:var(--muted);margin:0}.link{display:flex;gap:8px}.link input,.join input{flex:1;min-width:0;font:700 15px var(--body);padding:8px 10px;border:2px solid var(--ink);background:#fff;color:var(--ink)}.join{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}.join label{font-weight:700;flex-basis:100%}.join input{max-width:110px;text-transform:uppercase;letter-spacing:.2em;text-align:center}.help{font-size:14px;color:var(--ink);border-top:1.5px solid rgba(24,23,28,.18);padding-top:12px;display:grid;gap:6px}.howto .mbtn,.setup .mbtn,#tBegin{text-align:center}.tname{display:flex;align-items:center;gap:10px;font-weight:700}.tname input{flex:1;min-width:0;font:700 15px var(--body);padding:6px 8px;border:2px solid var(--ink);background:#fff;color:var(--ink)}.tplayers{margin:0;padding-left:22px;display:grid;gap:4px;font-weight:700}.tplayers .me{color:var(--red-text)}.bracket{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px;align-items:center;overflow-x:auto}.bracket .col{display:grid;gap:10px}.bracket .col>b{font:800 15px/1 var(--display);text-transform:uppercase;color:var(--muted)}.bracket .m{border:2px solid var(--ink);background:#fff;font-size:13px}.bracket .m.now{box-shadow:3px 3px 0 var(--red);border-color:var(--red)}.bracket .m div{padding:3px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bracket .m div+div{border-top:1px solid rgba(24,23,28,.2)}.bracket .m .w{font-weight:700;background:var(--legal)}.bracket .m .lost{color:var(--muted);text-decoration:line-through}.bracket .m .me{color:var(--red-text)}.setup label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:700}.setup select{font:700 15px var(--body);padding:6px 8px;border:2px solid var(--ink);background:#fff;color:var(--ink);min-width:170px}.controls{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:8px 14px;align-items:baseline;font-size:15px}.controls dt{font-weight:700;white-space:nowrap}.controls dd{margin:0}.controls dd b{color:var(--red-text)}.help p{margin:0}.help em{font-style:normal;color:var(--red-text);font-weight:700}kbd{font:700 12px var(--body);border:1.5px solid rgba(24,23,28,.3);border-bottom-width:3px;padding:0 5px;border-radius:3px;background:#fff}@media (max-width: 620px){.bar .nm{font-size:13px;padding:2px 5px}.strip{height:14px}.clock{font-size:22px;min-width:44px;padding:3px 6px 4px}.opts{top:64px}.wlabel,.mbtn{font-size:22px}}@media (prefers-reduced-motion: reduce){.pop,.sliver{animation-duration:.01s}}
