:root{--red:#ef3b2d;--yellow:#ffd33d;--blue:#2f7df6;--navy:#1b1f3b;--navy2:#262b52;--ink:#141018;--white:#fffdf6;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--navy);height:100%;color:var(--white);overscroll-behavior:none;margin:0;font-family:Nunito,system-ui,sans-serif;overflow:hidden}body{touch-action:none;-webkit-user-select:none;user-select:none}#app{position:fixed;inset:0}#gl{width:100%;height:100%;display:block;position:absolute;inset:0}#layer{position:absolute;inset:0}#tags,#pops{pointer-events:none;position:absolute;inset:0;overflow:hidden}#vignette{pointer-events:none;opacity:0;background:radial-gradient(#ff282800 55%,#ff1e1e8c 100%);transition:opacity .25s;position:absolute;inset:0}#vignette.on{opacity:1;transition:none}[hidden]{display:none!important}button{font:inherit;color:inherit;cursor:pointer}.btn{letter-spacing:.04em;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);box-shadow:0 5px 0 var(--ink);border-radius:14px;min-width:160px;padding:10px 22px 6px;font-family:Luckiest Guy,Arial Black,Impact,sans-serif;font-size:22px;transition:transform 60ms,box-shadow 60ms}.btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(4px)}.btn.big{background:var(--red);color:var(--white);text-shadow:0 2px 0 var(--ink);font-size:28px}.btn.ghost{background:var(--white)}.btn:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.screen{padding:calc(16px + var(--safe-t)) calc(16px + var(--safe-r)) calc(16px + var(--safe-b)) calc(16px + var(--safe-l));justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.panel{background:var(--navy);border:4px solid var(--ink);box-shadow:0 8px 0 var(--ink), 0 20px 50px #0006;border-radius:22px;width:100%;max-width:640px;max-height:100%;padding:18px 20px 22px;overflow:auto}.panel.small{text-align:center;max-width:360px}h2{letter-spacing:.03em;color:var(--yellow);text-shadow:0 3px 0 var(--ink);margin:0 0 10px;font-family:Luckiest Guy,Arial Black,Impact,sans-serif;font-size:32px;font-weight:400}.menu{flex-direction:column;align-items:center;gap:14px;display:flex}.menu.row{flex-flow:wrap;justify-content:center}#title{padding-top:calc(5vh + var(--safe-t));background:linear-gradient(#1b1f3b8c,#1b1f3b00 45% 70%,#1b1f3b99);flex-direction:column;justify-content:flex-start}.title-wrap{flex-direction:column;align-items:center;width:100%;height:100%;display:flex}.logo{text-align:center;letter-spacing:.02em;margin:0;font-family:Luckiest Guy,Arial Black,Impact,sans-serif;font-weight:400;line-height:.88}.logo span{-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);transform-origin:50% 100%;animation:1.6s ease-in-out infinite wobble;display:block}.logo .l1{color:var(--yellow);font-size:clamp(44px,11vw,96px)}.logo .l2{color:var(--red);font-size:clamp(56px,15vw,132px);animation-delay:-.5s}@keyframes wobble{0%,to{transform:rotate(-3deg)scaleY(1)}50%{transform:rotate(3deg)scaleY(1.06)}}.tag{text-shadow:0 2px 4px #0009;text-align:center;margin:8px 0 0;font-size:clamp(14px,3.6vw,18px);font-weight:800}.title-wrap .menu{margin-top:auto;margin-bottom:4vh}#select,#result{justify-content:flex-start}.select-panel{flex-direction:column;gap:10px;max-width:560px;display:flex}.result-panel{margin-left:2vw}@media (aspect-ratio<=4/5){#select,#result{justify-content:center;align-items:flex-end}.select-panel{gap:7px;max-height:60%;padding:12px 12px 14px}.select-panel h2{font-size:20px}.select-panel .roster{grid-template-columns:repeat(6,1fr);gap:5px}.select-panel .card{aspect-ratio:.82;border-radius:9px}.select-panel .card .nm{padding-bottom:3px;font-size:8.5px}.select-panel .sel-info{padding:7px 10px}.select-panel .sel-name b{font-size:21px}.select-panel .quote{margin-bottom:4px;font-size:13px}.select-panel .stats{grid-template-columns:auto 1fr auto 1fr;font-size:11px}.result-panel{margin-left:0}}.select-head{justify-content:space-between;align-items:center;display:flex}.select-head h2{margin:0;font-size:28px}.x{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:50%;width:40px;height:40px;padding:0;font-size:26px;line-height:1}.roster{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.card{aspect-ratio:.8;border:3px solid var(--ink);background:var(--navy2);border-radius:12px;flex-direction:column;justify-content:flex-end;align-items:center;padding:0;display:flex;position:relative;overflow:hidden}.card .swatch{border:2px solid var(--ink);border-radius:40% 40% 6px 6px;width:34%;position:absolute;top:10%;bottom:26%;left:50%;transform:translate(-50%)}.card .nm{text-align:center;padding:0 2px 5px;font-size:11px;font-weight:900;line-height:1.05;position:relative}.card.on{border-color:var(--yellow);box-shadow:0 0 0 3px var(--yellow)}.card.locked{filter:grayscale()brightness(.5)}.card.locked:after{content:"?";color:var(--white);justify-content:center;align-items:center;font-family:Luckiest Guy,sans-serif;font-size:40px;display:flex;position:absolute;inset:0}.sel-info{background:var(--navy2);border-radius:14px;padding:10px 12px}.sel-name{flex-wrap:wrap;align-items:baseline;gap:10px;display:flex}.sel-name b{color:var(--yellow);letter-spacing:.03em;font-family:Luckiest Guy,sans-serif;font-size:26px;font-weight:400}.sel-name span{opacity:.8;font-weight:800}.quote{opacity:.9;margin:2px 0 8px;font-style:italic;font-weight:700}.stats{grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:4px 10px;font-size:13px;font-weight:800;display:grid}.stats i{background:#ffffff26;border-radius:5px;height:9px;display:block;overflow:hidden}.stats i s{background:var(--yellow);height:100%;display:block}.ffa-opts{align-items:center;gap:10px;font-weight:900;display:flex}.seg{gap:6px;display:flex}.seg button{border:3px solid var(--ink);background:var(--white);width:40px;height:36px;color:var(--ink);border-radius:10px;font-weight:900}.seg button.on{background:var(--yellow)}#goBtn{align-self:center}.intro-card{text-align:center;animation:.4s cubic-bezier(.2,1.6,.4,1) slam}.eyebrow{letter-spacing:.08em;background:var(--red);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);border-radius:10px;padding:4px 14px 0;font-family:Luckiest Guy,sans-serif;font-size:24px}.intro-card h2{-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;margin:16px 0 10px;font-size:clamp(40px,10vw,76px)}.vs{flex-direction:column;align-items:center;gap:6px;display:flex}.vs div{border:3px solid var(--ink);background:#1b1f3bd9;border-radius:12px;max-width:520px;padding:6px 14px}.vs b{letter-spacing:.03em;font-family:Luckiest Guy,sans-serif;font-size:24px;font-weight:400}.vs em{opacity:.9;font-size:14px;font-weight:700;display:block}@keyframes slam{0%{opacity:0;transform:scale(2.2)}to{opacity:1;transform:scale(1)}}.result-panel{text-align:center;max-width:520px}.result-panel h2{font-size:52px}#resSub{margin:0 0 12px;font-size:17px;font-weight:800}.res-stats{flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:16px;display:flex}.res-stats div{background:var(--navy2);border-radius:12px;padding:6px 12px;font-size:13px;font-weight:800}.res-stats b{color:var(--yellow);font-family:Luckiest Guy,sans-serif;font-size:26px;font-weight:400;display:block}.help-panel p{font-weight:700;line-height:1.4}.moves{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;display:grid}.moves div{background:var(--navy2);border-radius:12px;padding:8px 10px;font-size:14px;font-weight:700}.moves b{color:var(--yellow);letter-spacing:.03em;font-family:Luckiest Guy,sans-serif;font-size:20px;font-weight:400;display:block}.keys{border-collapse:collapse;width:100%;font-size:13px;font-weight:700}.keys th{text-align:left;color:var(--yellow)}.keys td,.keys th{border-bottom:1px solid #ffffff1f;padding:4px 6px}#hud{pointer-events:none;position:absolute;inset:0}.me{left:calc(12px + var(--safe-l));top:calc(10px + var(--safe-t));border:3px solid var(--ink);background:#1b1f3bd1;border-radius:14px;align-items:center;gap:8px;width:min(300px,46vw);padding:6px 10px;display:flex;position:absolute}.chip{border:2px solid var(--ink);border-radius:40% 40% 4px 4px;flex:none;width:26px;height:34px}.me-col{flex:1;min-width:0}.me-row{justify-content:space-between;font-size:14px;font-weight:900;display:flex}.me-row b{letter-spacing:.03em;white-space:nowrap;text-overflow:ellipsis;font-family:Luckiest Guy,sans-serif;font-size:16px;font-weight:400;overflow:hidden}.bar{border:2px solid var(--ink);background:#00000073;border-radius:7px;height:12px;overflow:hidden}.bar i{background:#5be37d;width:100%;height:100%;transition:width .15s;display:block}.bar i.mid{background:var(--yellow)}.bar i.low{background:var(--red);animation:.5s steps(2,end) infinite blink}@keyframes blink{50%{opacity:.55}}.hud-right{right:calc(12px + var(--safe-r));top:calc(10px + var(--safe-t));align-items:center;gap:8px;display:flex;position:absolute}.round{border:3px solid var(--ink);background:#1b1f3bd1;border-radius:10px;padding:4px 8px;font-size:13px;font-weight:900}.timer{color:var(--yellow);text-shadow:0 3px 0 var(--ink);text-align:center;min-width:42px;padding-top:4px;font-family:Luckiest Guy,sans-serif;font-size:30px;line-height:1}.timer.low{color:var(--red)}#pauseBtn{pointer-events:auto;border:3px solid var(--ink);background:var(--white);width:42px;height:42px;color:var(--ink);border-radius:12px;justify-content:center;align-items:center;padding:0;display:flex}#pauseBtn svg{fill:var(--ink)}#boss{left:50%;top:calc(64px + var(--safe-t));text-align:center;width:min(460px,70vw);position:absolute;transform:translate(-50%)}#boss b{letter-spacing:.04em;color:var(--yellow);text-shadow:0 2px 0 var(--ink);font-family:Luckiest Guy,sans-serif;font-size:18px;font-weight:400}#boss .bar{height:14px}#boss .bar i{background:#b56cff}#hint{left:50%;bottom:calc(14px + var(--safe-b));white-space:nowrap;background:#1b1f3bbf;border-radius:10px;padding:6px 12px;font-size:14px;font-weight:800;transition:opacity .6s;position:absolute;transform:translate(-50%)}#hint:empty{display:none}#banner{text-align:center;color:var(--yellow);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);font-family:Luckiest Guy,sans-serif;font-size:clamp(48px,14vw,120px);animation:.35s cubic-bezier(.2,1.6,.4,1) slam;position:absolute;top:34%;left:0;right:0}#banner.small{color:#ffb3f2;font-size:clamp(30px,8vw,64px)}.etag{text-align:center;text-shadow:0 1px 2px #000;white-space:nowrap;width:92px;font-size:11px;font-weight:900;position:absolute;transform:translate(-50%,-100%)}.etag .bar{border-width:1.5px;height:7px;margin-top:2px}.etag.target{color:var(--yellow);font-size:12px}.etag.target:before{content:"▼";color:var(--yellow);margin-bottom:1px;font-size:12px;line-height:1;display:block}.pop{transform:translate(-50%, -50%) rotate(var(--r)) scale(var(--s));color:var(--yellow);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:0 3px 0 var(--ink);white-space:nowrap;font-family:Luckiest Guy,sans-serif;font-size:34px;animation:.9s ease-out forwards pop;position:absolute}.pop.red{color:#ff6b5e}.pop.green{color:#7dffb0}.pop.pink{color:#ffb3f2}.pop.blue{color:#8fd0ff}@keyframes pop{0%{transform:translate(-50%, -50%) rotate(var(--r)) scale(calc(var(--s) * .3));opacity:0}15%{transform:translate(-50%, -60%) rotate(var(--r)) scale(calc(var(--s) * 1.25));opacity:1}30%{transform:translate(-50%, -65%) rotate(var(--r)) scale(var(--s))}to{transform:translate(-50%, -140%) rotate(var(--r)) scale(var(--s));opacity:0}}#stick{pointer-events:none;background:#ffffff1f;border:3px solid #ffffff73;border-radius:50%;width:116px;height:116px;margin:-58px 0 0 -58px;position:absolute;top:0;left:0}#knob{border:3px solid var(--ink);background:#ffffffb3;border-radius:50%;width:52px;height:52px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#pad{right:calc(10px + var(--safe-r));bottom:calc(12px + var(--safe-b));pointer-events:none;width:230px;height:210px;position:absolute}.act{pointer-events:auto;border:3px solid var(--ink);color:var(--ink);width:70px;height:70px;box-shadow:0 4px 0 var(--ink);touch-action:none;background:#fffdf6e0;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex;position:absolute}.act b{letter-spacing:.03em;padding-top:3px;font-family:Luckiest Guy,sans-serif;font-size:17px;font-weight:400;line-height:1}.act small{opacity:.7;font-size:10px;font-weight:900}.act.on{box-shadow:0 1px 0 var(--ink);filter:brightness(.85);transform:translateY(3px)}.act.big{width:96px;height:96px;color:var(--white);background:#ef3b2deb;bottom:0;right:0}.act.big b{text-shadow:0 2px 0 var(--ink);font-size:24px}#btnWhip{background:#ffd33deb;bottom:6px;right:108px}#btnGust{background:#8fd0ffeb;bottom:108px;right:14px}#btnDuck{width:60px;height:60px;bottom:96px;right:104px}#btnDuck b{font-size:14px}#muteBtn{left:calc(12px + var(--safe-l));top:calc(12px + var(--safe-t));border:3px solid var(--ink);background:var(--white);width:44px;height:44px;color:var(--ink);z-index:5;border-radius:12px;padding:0;font-size:20px;position:absolute}#muteBtn.in-fight{top:calc(10px + var(--safe-t));left:auto;right:calc(64px + var(--safe-r));width:42px;height:42px}#loading{color:var(--yellow);background:var(--navy);z-index:10;justify-content:center;align-items:center;font-family:Luckiest Guy,sans-serif;font-size:34px;display:flex;position:absolute;inset:0}@media (width<=560px){.roster{grid-template-columns:repeat(4,1fr)}.btn{min-width:140px;font-size:19px}.btn.big{font-size:24px}.stats{grid-template-columns:auto 1fr}.moves{grid-template-columns:1fr}.result-panel h2{font-size:42px}#hint{display:none}}@media (height<=460px){.logo .l1{font-size:46px}.logo .l2{font-size:64px}.title-wrap .menu{flex-flow:wrap;justify-content:center;margin-bottom:1vh}.roster{grid-template-columns:repeat(12,1fr)}.card{aspect-ratio:.7}.sel-info .stats{display:none}#pad{transform-origin:100% 100%;transform:scale(.85)}#boss{top:calc(8px + var(--safe-t))}}