@font-face{font-family:Anton;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/anton-vietnamese-400-normal-CkBxLiRJ.woff2) format("woff2"),url(/assets/anton-vietnamese-400-normal-2FfR1wHA.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Anton;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/anton-latin-ext-400-normal-SyiqE2Jt.woff2) format("woff2"),url(/assets/anton-latin-ext-400-normal-BMODBQc6.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Anton;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/anton-latin-400-normal-Byf51wtH.woff2) format("woff2"),url(/assets/anton-latin-400-normal-AUNGEG_V.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--corner-a: #76b900;--corner-b: #4f9bff;--ink: #f4f6fa;--muted: rgba(244, 246, 250, .62);--panel: rgba(8, 10, 16, .62);--line: rgba(255, 255, 255, .12);--display: "Anton", "Impact", "Arial Narrow", sans-serif;--ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#05060a;color:var(--ink);overflow:hidden;touch-action:none;overscroll-behavior:none;font-family:var(--ui)}#view{display:block;width:100%;height:100%;touch-action:none}button{font:inherit;color:inherit;cursor:pointer}.loading{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:radial-gradient(60% 50% at 20% 50%,rgba(118,185,0,.18),transparent 70%),radial-gradient(60% 50% at 80% 50%,rgba(79,155,255,.18),transparent 70%),#05060a;transition:opacity .8s ease,visibility .8s}.loading.is-done{opacity:0;visibility:hidden}.loading-inner{width:min(560px,86vw);text-align:center}.title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(48px,11vw,112px);line-height:.95;letter-spacing:.02em;display:flex;justify-content:center;align-items:baseline;gap:.18em;font-style:italic}.t-a{color:var(--corner-a);text-shadow:0 0 40px rgba(118,185,0,.45)}.t-b{color:var(--corner-b);text-shadow:0 0 40px rgba(79,155,255,.45)}.t-vs{font-size:.45em;color:var(--muted)}.subtitle{margin:10px 0 34px;font-family:var(--display);letter-spacing:.4em;color:var(--muted);font-size:clamp(13px,2.4vw,18px)}.progress{height:6px;border-radius:99px;background:#ffffff14;overflow:hidden}.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--corner-a),#e9f0ff 50%,var(--corner-b));transition:width .25s ease}.loading-meta{display:flex;justify-content:space-between;margin-top:12px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}.hud{position:fixed;inset:0;z-index:2;pointer-events:none;user-select:none;-webkit-user-select:none}.hud[hidden]{display:none}.top{position:absolute;top:max(16px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:18px}.side{--team: var(--corner-a);display:flex;align-items:center;gap:14px;min-width:0}.side-right{--team: var(--corner-b);flex-direction:row-reverse}.portrait{flex:none;width:72px;height:72px;border-radius:14px;overflow:hidden;border:2px solid var(--team);box-shadow:0 0 24px color-mix(in srgb,var(--team) 45%,transparent);background:#111;transform:skew(-8deg)}.side-right .portrait{transform:skew(8deg)}.portrait img{width:100%;height:100%;object-fit:cover;display:block}.meter{flex:1;min-width:0;max-width:520px}.name-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.side-right .name-row{flex-direction:row-reverse}.name{font-family:var(--display);font-size:clamp(30px,4.6vw,56px);line-height:1;font-style:italic;letter-spacing:.02em;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.5),0 0 30px color-mix(in srgb,var(--team) 60%,transparent)}.pips{display:flex;gap:6px}.pips i{width:14px;height:14px;transform:rotate(45deg);border:2px solid rgba(255,255,255,.4);background:transparent;transition:background .3s,border-color .3s,box-shadow .3s}.pips i.won{background:var(--team);border-color:var(--team);box-shadow:0 0 12px var(--team)}.health{position:relative;margin-top:8px;height:20px;background:#0000008c;border:1px solid var(--line);transform:skew(-18deg);overflow:hidden}.side-right .health{transform:skew(18deg)}.health-fill,.health-lag{position:absolute;inset:0;transform-origin:left center}.side-right .health-fill,.side-right .health-lag{transform-origin:right center}.health-lag{background:#fff;opacity:.85;transition:transform .7s ease .35s}.health-fill{background:linear-gradient(180deg,color-mix(in srgb,var(--team) 70%,#fff),var(--team) 55%,color-mix(in srgb,var(--team) 60%,#000));transition:transform .12s ease-out,filter .3s}.health.is-low .health-fill{background:linear-gradient(180deg,#ffb199,#ff3b30 55%,#8a0f0a);animation:pulse .8s ease-in-out infinite}@keyframes pulse{50%{filter:brightness(1.45)}}.side.is-hit .portrait{animation:hit .3s ease}@keyframes hit{30%{filter:brightness(2.2) saturate(.2);translate:4px 0}60%{translate:-3px 0}}.badge{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:99px;font-size:11px;letter-spacing:.04em;background:#ffc4002e;color:#ffd34d;border:1px solid rgba(255,196,0,.4)}.badge[hidden]{display:none}.center{text-align:center;padding:6px 18px 8px;background:var(--panel);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.round{font-family:var(--display);font-size:14px;letter-spacing:.3em;color:var(--muted)}.timer{font-family:var(--display);font-size:44px;line-height:1;font-variant-numeric:tabular-nums}.timer.is-low{color:#ff5a4f}.announce{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none;opacity:0}.announce.is-on{animation:slam 1.6s cubic-bezier(.2,.9,.2,1) forwards}.announce.is-hold{animation:slam-hold .5s cubic-bezier(.2,.9,.2,1) forwards}.announce-title{font-family:var(--display);font-style:italic;font-size:clamp(64px,14vw,180px);line-height:.9;letter-spacing:.02em;color:#fff;-webkit-text-stroke:2px rgba(0,0,0,.35);text-shadow:0 6px 0 rgba(0,0,0,.35),0 0 60px rgba(255,255,255,.35)}.announce.is-callout{place-content:end center;padding-bottom:24vh}.announce.is-callout .announce-title{font-size:clamp(34px,5.5vw,76px);-webkit-text-stroke:1px rgba(0,0,0,.35)}.announce-sub{margin-top:10px;font-family:var(--display);letter-spacing:.32em;font-size:clamp(14px,2.2vw,22px);color:var(--muted)}@keyframes slam{0%{opacity:0;transform:scale(2.2);filter:blur(8px)}14%{opacity:1;transform:scale(.96);filter:blur(0)}22%{transform:scale(1)}80%{opacity:1;transform:scale(1.04)}to{opacity:0;transform:scale(1.12)}}@keyframes slam-hold{0%{opacity:0;transform:scale(2.2);filter:blur(8px)}60%{opacity:1;transform:scale(.97);filter:blur(0)}to{opacity:1;transform:scale(1)}}.card{position:absolute;left:max(28px,env(safe-area-inset-left));bottom:22%;padding:14px 28px 16px 22px;border-left:6px solid var(--team, #fff);background:linear-gradient(90deg,#05060ad9,#05060a00);opacity:0;transform:translate(-40px);transition:opacity .35s ease,transform .5s cubic-bezier(.2,.9,.2,1)}.card.is-right{left:auto;right:max(28px,env(safe-area-inset-right));text-align:right;border-left:none;border-right:6px solid var(--team, #fff);background:linear-gradient(270deg,#05060ad9,#05060a00);padding:14px 22px 16px 28px;transform:translate(40px)}.card.is-on{opacity:1;transform:none}.card-nick{font-family:var(--display);letter-spacing:.3em;font-size:15px;color:var(--team, #fff)}.card-name{font-family:var(--display);font-style:italic;font-size:clamp(44px,7vw,84px);line-height:1}.skip{position:absolute;left:50%;bottom:28px;transform:translate(-50%);margin:0;font-size:13px;color:var(--muted);letter-spacing:.08em}.skip[hidden]{display:none}.toolbar{position:absolute;top:calc(max(16px,env(safe-area-inset-top)) + 104px);right:max(20px,env(safe-area-inset-right));display:flex;gap:8px;pointer-events:auto}.toolbar button,.moves button{border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:10px;padding:8px 12px;font-size:13px;transition:background .2s,border-color .2s,transform .1s}.toolbar button:hover,.moves button:hover{background:#1e222ecc;border-color:#ffffff47}.toolbar button[aria-pressed=true]{border-color:var(--corner-a);box-shadow:inset 0 0 0 1px var(--corner-a)}.controls{position:absolute;left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.moves{display:flex;gap:8px;pointer-events:auto}.moves button{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:76px;padding:10px 12px;touch-action:none}.moves button:active{transform:scale(.95);border-color:var(--corner-a)}.moves b{font-family:var(--display);font-weight:400;letter-spacing:.08em;font-size:17px}kbd{font-family:var(--ui);font-size:11px;color:var(--muted);padding:1px 6px;border:1px solid var(--line);border-radius:5px}.keys{margin:0;font-size:12px;color:var(--muted);text-align:right;max-width:330px;line-height:1.5}.stick-wrap{display:none}.stick{position:relative;width:124px;height:124px;border-radius:50%;background:var(--panel);border:1px solid var(--line);pointer-events:auto;touch-action:none}.knob{position:absolute;left:50%;top:50%;width:52px;height:52px;border-radius:50%;background:#f4f6fae6;transform:translate(-50%,-50%)}.knob.is-running{background:var(--corner-a);box-shadow:0 0 18px var(--corner-a)}@media(pointer:coarse){.stick-wrap{display:block;pointer-events:auto}.keys,kbd{display:none}.moves{display:grid;grid-template-columns:repeat(3,72px)}.moves button{min-height:56px}}@media(max-width:720px){.top{left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));gap:8px}.side{gap:6px}.portrait{width:40px;height:40px}.name{font-size:22px}.name-row{flex-wrap:wrap;gap:2px 6px}.pips i{width:9px;height:9px}.timer{font-size:30px}}.menu-btn{display:none}@media(pointer:coarse),(max-width:720px){.toolbar{top:calc(max(10px,env(safe-area-inset-top)) + 84px);right:max(12px,env(safe-area-inset-right));flex-direction:column;align-items:flex-end;gap:6px}.toolbar button{padding:7px 11px;font-size:12px}.toolbar .menu-btn{display:block;width:40px;height:36px;padding:0;font-size:18px;line-height:1}.toolbar:not(.is-open) button:not(.menu-btn){display:none}.moves{grid-template-columns:repeat(3,64px);gap:6px}.moves button{min-width:0;min-height:50px;padding:6px 4px}.moves b{font-size:15px}.stick{width:112px;height:112px}}.end{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,#0000 45%,#000000b3);pointer-events:auto;animation:fade .6s ease}.end[hidden]{display:none}.end-inner{text-align:center;transform:translateY(27vh)}.end-label{font-family:var(--display);letter-spacing:.5em;color:var(--muted)}.end-name{font-family:var(--display);font-style:italic;font-size:clamp(56px,9vw,124px);line-height:.9;color:var(--team, #fff);text-shadow:0 0 70px color-mix(in srgb,var(--team, #fff) 60%,transparent)}.end-nick{margin:6px 0 26px;font-family:var(--display);letter-spacing:.3em;color:var(--ink)}.rematch{padding:14px 40px;font-family:var(--display);font-size:22px;letter-spacing:.18em;border:none;border-radius:999px;color:#05060a;background:linear-gradient(90deg,var(--corner-a),#f4f6fa 50%,var(--corner-b));box-shadow:0 10px 40px #00000073;transition:transform .15s ease,box-shadow .15s ease}.rematch:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 14px 50px #0000008c}@keyframes fade{0%{opacity:0}}@media(prefers-reduced-motion:reduce){.announce.is-on,.announce.is-hold{animation-duration:.01s}}.select{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:#030408d1;backdrop-filter:blur(6px)}.select[hidden]{display:none}.select-inner{width:min(880px,92vw);text-align:center}.select-step{font-family:Anton,Impact,sans-serif;font-size:clamp(28px,4vw,44px);letter-spacing:.04em;margin:0 0 18px;color:#f4f6fa}.select-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}.select-tile{position:relative;display:grid;gap:4px;padding:12px;border-radius:14px;border:2px solid rgba(255,255,255,.12);background:#10121ae6;color:#f4f6fa;cursor:pointer;transition:border-color .15s,transform .15s}.select-tile:hover{border-color:var(--tile);transform:translateY(-2px)}.select-tile img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;background:#222}.select-tile b{font-family:Anton,Impact,sans-serif;font-size:24px;font-weight:400;letter-spacing:.04em;color:var(--tile)}.select-tile small{font-size:12px;opacity:.7}.select-tile[data-pick="1"],.select-tile[data-pick="2"]{border-color:var(--tile);box-shadow:0 0 0 2px var(--tile),0 0 28px color-mix(in srgb,var(--tile) 45%,transparent)}.select-tile[data-pick="1"]:after,.select-tile[data-pick="2"]:after{content:"P" attr(data-pick);position:absolute;top:8px;left:8px;padding:2px 8px;border-radius:999px;background:var(--tile);color:#05060a;font-weight:700;font-size:13px}.select-actions{display:flex;justify-content:center;gap:12px;margin-top:22px}.select-cancel{padding:10px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#f4f6fa;cursor:pointer}.select-tile:disabled{opacity:.45;cursor:default;transform:none;border-color:#ffffff1f}.select-fight:disabled{opacity:.4;cursor:default}
