:root{--p1:#ff4a5a;--p2:#4a8aff;--gold:#ffd34a;--pink:#ff5ae0;--ink:#fff8ec;--shadow:0 3px 0 #00000059, 0 0 18px #00000059}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;background:#0b2a36;margin:0;font-family:Kanit,system-ui,sans-serif;overflow:hidden}canvas#c{width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}#hud{pointer-events:none;grid-template-columns:1fr minmax(120px,360px) 1fr;align-items:start;gap:16px;display:grid;position:fixed;top:14px;left:16px;right:16px}.panel{text-shadow:var(--shadow)}.panel.p2{text-align:right}.panel .name{letter-spacing:.04em;font-size:20px;font-weight:700}.panel.p1 .name{color:var(--p1)}.panel.p2 .name{color:var(--p2)}.panel .score{font-variant-numeric:tabular-nums;font-size:clamp(28px,4.2vw,48px);font-style:italic;font-weight:900;line-height:1}.panel .combo{height:30px;color:var(--gold);transform-origin:0;font-size:22px;font-style:italic;font-weight:900}.panel.p2 .combo{transform-origin:100%}.panel .combo.pop{animation:.25s ease-out pop}.ult{background:#00000073;border:2px solid #ffffff80;border-radius:9px;width:min(280px,38vw);height:16px;position:relative;overflow:hidden}.panel.p2 .ult{margin-left:auto}.ult .fill{background:linear-gradient(90deg, #7a3cff, var(--pink));width:0%;transition:width .2s;position:absolute;inset:0}.panel.p2 .ult .fill{left:auto;right:0}.ult-label{text-align:center;letter-spacing:.08em;opacity:.85;font-size:11px;font-weight:700;line-height:12px;position:absolute;inset:0}.ult.full{box-shadow:0 0 14px var(--pink), 0 0 30px var(--pink);border-color:#fff;animation:.5s infinite alternate glow}.ult.full .fill{background:linear-gradient(90deg,#ff5ae0,#ffd34a,#ff5ae0) 0 0/200% 100%;animation:.8s linear infinite shine}.hp{background:#0000008c;border:2px solid #fff;border-radius:4px;width:min(420px,42vw);height:22px;margin:4px 0 6px;position:relative;overflow:hidden;transform:skew(-12deg);box-shadow:0 3px #00000059}.panel.p2 .hp{margin-left:auto;transform:skew(12deg)}.hp .fill,.hp .trail{width:100%;position:absolute;top:0;bottom:0;left:0}.panel.p2 .hp .fill,.panel.p2 .hp .trail{left:auto;right:0}.hp .trail{background:#ff3a2a}.hp .fill{background:linear-gradient(#fff27a,#ffc21a 55%,#e89a00)}.hp.low .fill{background:linear-gradient(#ff9a7a,#ff4a2a);animation:.4s infinite alternate blink}body.read .hp{display:none}body.brawl .ult:after{content:"";opacity:.8;background:linear-gradient(90deg,#0000 32.5%,#fff 32.5% 33.5%,#0000 33.5% 66%,#fff 66% 67%,#0000 67%);position:absolute;inset:0}body.brawl #pips{display:none}.hits{pointer-events:none;text-shadow:0 4px #000,0 0 20px #00000080;opacity:0;font-style:italic;font-weight:900;line-height:.9;transition:opacity .3s;position:fixed;top:30%}.hits.p1{left:3vw}.hits.p2{text-align:right;right:3vw}.hits.on{opacity:1}.hits b{color:var(--gold);-webkit-text-stroke:2px #7a2a00;font-size:clamp(56px,9vw,110px);display:block}.hits.p2 b{color:#8fd4ff;-webkit-text-stroke-color:#002a7a}.hits span{letter-spacing:.1em;font-size:clamp(22px,3vw,36px)}.hits.pop b{animation:.18s ease-out pop}.popup.dmg{color:#fff;-webkit-text-stroke:1.5px #000;font-size:34px;font-style:normal;animation:.95s ease-out forwards dmg}.popup.dmg.chip{color:#c8c8c8;font-size:22px}.popup.dmg.crit{color:#ffd34a;-webkit-text-stroke:2px #7a0a00;font-size:54px}.popup.critlabel{color:#ff4a3a;-webkit-text-stroke:1px #fff;letter-spacing:.08em;font-size:24px;animation:.9s ease-out forwards rise}.popup.skill{color:#fff;-webkit-text-stroke:2px #7a3cff;text-shadow:0 0 18px #ff5ae0,0 4px #2a0a50;font-size:clamp(34px,5vw,56px)}@keyframes dmg{0%{opacity:1;transform:translate(-50%,-50%)scale(1.6)}20%{transform:translate(-50%,-190%)scale(1)}45%{transform:translate(-50%,-150%)scale(1)}to{opacity:0;transform:translate(-50%,-110%)scale(.9)}}#ult-cut .mash{width:100%;text-shadow:var(--shadow);justify-content:center;align-items:center;gap:28px;font-style:italic;font-weight:900;display:flex;position:absolute;top:105%}#ult-cut .mash span{color:var(--gold);font-size:clamp(30px,5vw,54px);animation:.12s infinite alternate beat}#ult-cut .mash b{text-align:center;min-width:2ch;font-size:clamp(36px,6vw,64px)}#ult-cut .mash b.p1{color:var(--p1)}#ult-cut .mash b.p2{color:var(--p2)}.mid{flex-direction:column;align-items:center;display:flex}.timer{text-align:center;font-variant-numeric:tabular-nums;min-width:70px;text-shadow:var(--shadow);background:#0006;border:2px solid #ffffffb3;border-radius:12px;padding:0 12px;font-size:30px;font-weight:900;line-height:1.2}.timer.low{color:#ff5a4a;border-color:#ff5a4a;animation:.3s ease-out pop}.track{background:linear-gradient(90deg,#ff4a5a59,#ffffff26 50%,#4a8aff59);border:2px solid #ffffff80;border-radius:7px;width:100%;height:14px;margin-top:10px;position:relative}.track .edge{background:#5fd2ff;width:4px;position:absolute;top:-6px;bottom:-6px;box-shadow:0 0 10px #5fd2ff}.track .edge.l{left:-2px}.track .edge.r{right:-2px}.track .dot{border:2px solid #fff;border-radius:50%;width:18px;height:18px;margin:-9px 0 0 -9px;transition:left .15s;position:absolute;top:50%}.track .dot.p1{background:var(--p1)}.track .dot.p2{background:var(--p2)}#pips{pointer-events:none;position:fixed;inset:0}.pips{gap:4px;transition:opacity .2s;display:flex;position:absolute;transform:translate(-50%,-100%)}.pips i{background:#00000059;border:2px solid #ffffffe6;border-radius:50%;width:12px;height:12px;box-shadow:0 1px 3px #00000080}.pips.p1 i.on,.pips.p2 i.on{background:#ffd34a}.pips.low i.on{background:#ff6a3a;animation:.35s infinite alternate blink}#keys{pointer-events:none;text-shadow:var(--shadow);justify-content:space-between;gap:16px;font-size:14px;display:flex;position:fixed;bottom:14px;left:16px;right:16px}#keys b{color:#222;text-align:center;min-width:22px;text-shadow:none;background:#ffffffe6;border-radius:5px;padding:0 5px;display:inline-block}#keys .p1 b{box-shadow:0 2px 0 var(--p1)}#keys .p2 b{box-shadow:0 2px 0 var(--p2)}#popups{pointer-events:none;position:fixed;inset:0;overflow:hidden}.popup{white-space:nowrap;text-shadow:var(--shadow);font-style:italic;font-weight:900;animation:.9s ease-out forwards rise;position:absolute;transform:translate(-50%,-50%)}.popup.perfect{color:var(--gold);-webkit-text-stroke:1px #7a4a00;font-size:40px}.popup.good{color:#8fe4ff;font-size:30px}.popup.miss{color:#bbb;font-size:26px}.popup.points{color:#fff;font-size:22px;animation-duration:1.1s}.popup.guard{color:#8fffb0;font-size:42px}.popup.combo{color:var(--pink);font-size:34px}#banner{text-align:center;text-shadow:0 6px #00000059,0 0 40px #ffb43cb3;pointer-events:none;font-size:clamp(56px,12vw,140px);font-style:italic;font-weight:900;line-height:1;position:fixed;top:38%;left:0;right:0}#banner.show{animation:.5s cubic-bezier(.2,1.6,.4,1) both slam}#banner.ko{color:var(--gold);-webkit-text-stroke:3px #7a2a00}#ult-cut{pointer-events:none;height:26%;position:fixed;top:30%;left:0;right:0}#ult-cut .stripe{background:repeating-linear-gradient(-60deg,#ff5ae0d9 0 28px,#7a3cffd9 28px 56px) 0 0/200% 100%;animation:.4s ease-out both stripe,.6s linear infinite scroll;position:absolute;inset:0;transform:skewY(-4deg)}#ult-cut .text{color:#fff;text-shadow:0 0 30px #ff5ae0,0 6px #4a0a50;place-items:center;font-size:clamp(64px,14vw,170px);font-style:italic;font-weight:900;animation:.45s cubic-bezier(.2,1.6,.4,1) both slam;display:grid;position:absolute;inset:0}#ult-cut .who{text-align:center;letter-spacing:.3em;width:100%;font-size:22px;font-weight:700;position:absolute;bottom:6px}.screen{text-align:center;pointer-events:none;flex-direction:column;justify-content:space-between;align-items:center;padding:4vh 16px 6vh;display:flex;position:fixed;inset:0}.screen button{pointer-events:auto}.logo{background:linear-gradient(#fff6d6 10%,#ffd34a 45%,#ff8a2a 90%);color:#0000;filter:drop-shadow(0 6px #7a2a00)drop-shadow(0 0 30px #ff8c2899);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(64px,13vw,150px);font-style:italic;font-weight:900;line-height:.95;animation:3s ease-in-out infinite float}.logo span{letter-spacing:.5em;-webkit-text-fill-color:#fff;filter:none;font-size:.22em;display:block}.pickers{justify-content:space-between;width:100%;max-width:1200px;display:flex}.picker{width:min(320px,44vw);text-shadow:var(--shadow)}.picker .tag{font-size:34px;font-style:italic;font-weight:900}.picker.p1 .tag{color:var(--p1)}.picker.p2 .tag{color:var(--p2)}.pick{justify-content:center;align-items:center;gap:10px;display:flex}.pick button{color:#fff;cursor:pointer;background:#00000059;border:2px solid #fff;border-radius:50%;width:44px;height:44px;font-size:18px}.fname{min-width:120px;font-size:clamp(26px,4vw,40px);font-weight:900}.picker .hint,.screen .hint{opacity:.85;font-size:14px}.ready{color:var(--gold);visibility:hidden;margin-top:6px;font-size:30px;font-style:italic;font-weight:900}.ready.on{visibility:visible;animation:.35s cubic-bezier(.2,1.6,.4,1) both slam}.howto{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00000059;border-radius:14px;max-width:720px;padding:12px 18px;font-size:15px;line-height:1.6}.gold{color:var(--gold)}.pink{color:var(--pink)}.loading{opacity:.8;font-size:14px}#result{background:radial-gradient(#00000026,#0000008c);justify-content:center;gap:24px}.winner{text-shadow:0 6px #00000059,0 0 40px #ffc850cc;font-size:clamp(44px,9vw,96px);font-style:italic;font-weight:900;animation:.5s cubic-bezier(.2,1.6,.4,1) both slam}.stats{border-collapse:collapse;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0006;border-radius:14px;font-size:20px;overflow:hidden}.stats th,.stats td{padding:8px 22px}.stats td{font-variant-numeric:tabular-nums;font-weight:700}.stats th.p1{color:var(--p1)}.stats th.p2{color:var(--p2)}.stats td:first-child{text-align:left;opacity:.8;font-weight:400}.stats tr.best td.win{color:var(--gold)}.fstats{text-align:left;grid-template-columns:auto 1fr;align-items:center;gap:2px 8px;width:min(220px,40vw);margin:4px auto 0;font-size:12px;display:grid}.fstats i{background:linear-gradient(90deg, var(--gold) calc(var(--n) * 20%), #fff3 0);border-radius:4px;height:8px;box-shadow:0 1px 2px #0006}.fstats em{text-align:center;color:var(--gold);grid-column:1/-1;font-style:normal}body.touch .fstats span,body.touch .fstats i{display:none}.onb{background:#1f6fd8}body.online [data-cpu],body.online [data-tutorial],body.online [data-arcade],body.online [data-online],body.guest [data-mode],body.guest [data-arena]{display:none!important}#online{z-index:5;text-align:center;width:min(440px,100vw - 32px);text-shadow:var(--shadow);background:#0f2850d9;border:2px solid #5fa8ff;border-radius:14px;padding:6px 12px;font-size:14px;position:fixed;bottom:8px;left:50%;transform:translate(-50%)}#online .ostatus{font-weight:700}#online .olink{word-break:break-all;-webkit-user-select:all;user-select:all;background:#00000059;border-radius:8px;margin:4px 0;padding:4px 8px;font-size:13px}#online .obtns{justify-content:center;gap:8px;display:flex}#online button{color:#fff;cursor:pointer;background:0 0;border:1px solid #fff;border-radius:999px;padding:4px 14px;font:400 14px Kanit,sans-serif}body.online .howto{display:none}body:not(:has(#select:not(.hidden))) #online{display:none}.wins{letter-spacing:2px;color:var(--gold);font-size:16px}.topbtns{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.tutb{color:#fff;pointer-events:auto;cursor:pointer;background:#0006;border:2px solid #fff;border-radius:999px;margin-top:6px;padding:6px 18px;font:700 18px Kanit,sans-serif}.arcb{color:#3a2200;text-shadow:none;background:linear-gradient(90deg,#d98a00,#ffcf4a)}.tutb.glow{background:#2fb36b;animation:.8s infinite alternate glow}#tutor{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;width:min(560px,100vw - 32px);text-shadow:var(--shadow);background:#0a1923b8;border:2px solid #fff9;border-radius:16px;padding:10px 16px 12px;position:fixed;top:92px;left:50%;transform:translate(-50%)}#tutor.pass{border-color:#8fffb0;box-shadow:0 0 24px #8fffb0}#tutor .tstep{opacity:.8;letter-spacing:.1em;font-size:12px}#tutor .ttitle{color:var(--gold);font-size:26px;font-style:italic;font-weight:900}#tutor .ttext{font-size:16px;line-height:1.45}#tutor .ttext b{color:#222;text-shadow:none;background:#fff;border-radius:6px;padding:0 6px;display:inline-block}#tutor button{color:#fff;cursor:pointer;background:0 0;border:1px solid #ffffffb3;border-radius:999px;padding:2px 12px;font:400 13px Kanit,sans-serif;position:absolute;top:8px;right:10px}#touch .t.hint{animation:.4s infinite alternate beat;box-shadow:0 0 22px #fff,0 0 40px #8fffb0}body.touch #tutor{padding:6px 12px 8px;top:64px}body.touch #tutor .ttitle{font-size:18px}body.touch #tutor .ttext{font-size:13px}.modeb{color:#fff;text-shadow:0 2px #0000004d;pointer-events:auto;cursor:pointer;background:linear-gradient(90deg,#7a3cff,#ff5ae0);border:2px solid #fff;border-radius:999px;margin-top:6px;padding:6px 22px;font:italic 900 20px Kanit,sans-serif}.readyb,.cpub,.result-buttons button{color:#fff;pointer-events:auto;background:#0006;border:2px solid #fff;border-radius:999px;margin:8px auto 0;padding:8px 22px;font:700 18px Kanit,sans-serif;display:none}.assistb{color:#fff;pointer-events:auto;cursor:pointer;background:#0006;border:2px solid #fff;border-radius:999px;margin:6px auto 0;padding:3px 14px;font:700 15px Kanit,sans-serif;display:block}.assistb.on{background:#2fb36b}.cpub{padding:4px 16px;font-size:15px;display:block}.cpub.on{background:#ff5ae0}.picker.p1 .readyb{background:var(--p1)}.picker.p2 .readyb{background:var(--p2)}.result-buttons{gap:12px;display:flex}.green{color:#8fffb0}body.touch{touch-action:none}body.touch .keyhint,body.touch #keys{display:none!important}body.touch .readyb,body.touch .result-buttons button{display:block}body.touch .howto{padding:8px 12px;font-size:12px;line-height:1.45}body.touch .logo{font-size:clamp(40px,11vh,90px)}body.touch #select{padding:2vh 12px 3vh}body.touch .ready{font-size:22px}#touch .pad{bottom:max(12px, env(safe-area-inset-bottom));grid-template-rows:auto auto;grid-template-columns:auto auto;align-items:end;gap:10px;display:grid;position:fixed}#touch .pad.p1{left:max(12px, env(safe-area-inset-left))}#touch .pad.p2{right:max(12px, env(safe-area-inset-right))}#touch .t{color:#fff;text-shadow:0 1px 2px #0009;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border:3px solid #ffffffe6;border-radius:50%;font:700 15px Kanit,sans-serif}#touch .t.down{filter:brightness(1.4);transform:scale(.9)}#touch .fight{grid-row:1/span 2;width:92px;height:92px;font-size:22px}#touch .combo{background:#ffc83c99;width:64px;height:64px}#touch .guard{background:#50dc8c8c;width:64px;height:64px}#touch .p1 .fight{background:#ff4a5aa6;grid-column:2}#touch .p1 .guard,#touch .p1 .combo{grid-column:1}#touch .p2 .fight{background:#4a8affa6;grid-column:1}#touch .p2 .guard,#touch .p2 .combo{grid-column:2}#touch .combo.ready,#touch .combo.sp{animation:.15s infinite alternate beat;box-shadow:0 0 20px #ffd34a,0 0 40px #ffd34a}#touch .pad.cpu{display:none}body.touch #hud .panel .name{font-size:15px}body.touch #hud .panel .score{font-size:26px}#rotate{display:none}@media (orientation:portrait){body.touch #rotate{z-index:10;background:#05141eeb;place-items:center;font-size:24px;font-weight:700;display:grid;position:fixed;inset:0}}@keyframes pop{0%{transform:scale(1.8)}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translate(-50%,-30%)scale(1.8)}15%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-160%)scale(.9)}}@keyframes slam{0%{opacity:0;transform:scale(2.6)rotate(-6deg)}to{opacity:1;transform:scale(1)rotate(-3deg)}}@keyframes glow{to{box-shadow:0 0 22px var(--pink), 0 0 50px var(--gold)}}@keyframes shine{to{background-position:200% 0}}@keyframes barflash{0%{box-shadow:0 0 40px var(--gold), 0 0 80px var(--gold)}}@keyframes blink{to{opacity:.4}}@keyframes beat{to{transform:scale(1.08)}}@keyframes float{50%{transform:translateY(-8px)}}@keyframes stripe{0%{transform:skewY(-4deg)scaleY(0)}}@keyframes scroll{to{background-position:-200% 0}}