:root{--bg-deep: #0c0a24;--bg-panel: #171136;--bg-elev: #241a52;--violet: #7b3ff2;--violet-bright: #a855f7;--magenta: #ff2e88;--lime: #c8ff3c;--gold: #ffc24b;--frost: #4de3ff;--blaze: #ff7a2f;--terra: #5be08a;--volt: #ffe14d;--void: #b06bff;--text-hi: #f4f1ff;--text-dim: #b9aede;--font-display: "Bungee", "Space Grotesk", system-ui, sans-serif;--font-ui: "Space Grotesk", system-ui, -apple-system, sans-serif;--radius: 16px;--radius-sm: 10px;--shadow-hard: 0 6px 0 rgba(0, 0, 0, .45);--shadow-soft: 0 12px 32px rgba(0, 0, 0, .45);--edge: rgba(168, 85, 247, .32)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:var(--bg-deep);color:var(--text-hi);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{position:relative;width:100%;height:100dvh;min-height:100dvh;overflow:hidden}.screen{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden}.hidden{display:none!important}.chog-fig{line-height:0}.chog-fig svg{width:100%;height:auto;display:block}button{font-family:inherit;cursor:pointer;border:none;color:inherit}.bg-pit{background:radial-gradient(120% 80% at 50% -10%,rgba(123,63,242,.55),transparent 60%),radial-gradient(120% 90% at 50% 120%,rgba(255,46,136,.4),transparent 55%),linear-gradient(180deg,#120c2c 0%,var(--bg-deep) 55%,#0a081c 100%)}.bg-pit:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0px,rgba(255,255,255,.03) 1px,transparent 1px,transparent 3px);mix-blend-mode:overlay;opacity:.6}.display{font-family:var(--font-display);letter-spacing:.02em;line-height:1}.eyebrow{font-family:var(--font-ui);font-weight:600;letter-spacing:.28em;text-transform:uppercase;font-size:clamp(.62rem,1.6vw,.78rem);color:var(--violet-bright)}.dim{color:var(--text-dim)}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.95em 1.6em;border-radius:14px;font-family:var(--font-display);font-size:clamp(.95rem,3.2vw,1.15rem);letter-spacing:.03em;background:linear-gradient(180deg,var(--violet-bright),var(--violet));color:#fff;box-shadow:var(--shadow-hard),inset 0 2px #ffffff47;transition:transform .06s ease,box-shadow .06s ease,filter .15s ease;-webkit-user-select:none;user-select:none;touch-action:manipulation}.btn:active{transform:translateY(5px);box-shadow:0 1px #00000073,inset 0 2px #fff3}.btn--gold{background:linear-gradient(180deg,#ffdd7a,var(--gold));color:#3a2600}.btn--danger{background:linear-gradient(180deg,#ff6aa6,var(--magenta))}.btn--ghost{background:#ffffff14;box-shadow:inset 0 0 0 2px var(--edge);color:var(--text-hi)}.btn--ghost:active{transform:translateY(3px)}.btn--block{width:100%}.btn[disabled]{filter:grayscale(.6) brightness(.7);cursor:not-allowed}.panel{background:linear-gradient(180deg,var(--bg-elev),var(--bg-panel));border-radius:var(--radius);box-shadow:var(--shadow-soft),inset 0 0 0 1px var(--edge)}.title{align-items:center;justify-content:center;text-align:center;padding:clamp(1rem,4vw,2.5rem);gap:clamp(.8rem,2.5vw,1.4rem)}.title__logo{font-family:var(--font-display);font-size:clamp(2.6rem,11vw,6.5rem);line-height:.92;background:linear-gradient(180deg,#fff,#ffcf5c 55%,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 0 rgba(0,0,0,.4)) drop-shadow(0 0 26px rgba(255,122,47,.5));margin:0}.title__logo span{display:block;font-size:.42em;letter-spacing:.32em;-webkit-text-fill-color:var(--violet-bright);color:var(--violet-bright);filter:drop-shadow(0 2px 0 rgba(0,0,0,.35))}.title__tag{max-width:34ch;font-size:clamp(1rem,3.6vw,1.35rem);color:var(--text-hi);font-weight:500;margin:.2rem 0}.title__row{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center;margin-top:.6rem}.title__fighters{display:flex;gap:clamp(.2rem,2vw,1rem);justify-content:center;align-items:flex-end;height:clamp(120px,26vh,240px);margin-top:.5rem;filter:drop-shadow(0 18px 30px rgba(0,0,0,.5))}.title__fighters .chog-fig{width:clamp(78px,20vw,160px);animation:bob 3.2s ease-in-out infinite}.title__fighters .chog-fig:nth-child(2){animation-delay:-1.1s}.title__fighters .chog-fig:nth-child(3){animation-delay:-2.2s}@keyframes bob{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1deg)}}.wallet-pill{display:inline-flex;align-items:center;gap:.55em;padding:.5em 1em;border-radius:999px;background:#c8ff3c1f;box-shadow:inset 0 0 0 1.5px #c8ff3c80;color:var(--lime);font-weight:600;font-size:.92rem}.wallet-pill .dot{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime)}.select{padding:clamp(.8rem,3vw,1.8rem);gap:clamp(.6rem,2vw,1.2rem);overflow-y:auto}.select__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.select__title{font-family:var(--font-display);font-size:clamp(1.4rem,5.5vw,2.4rem);margin:0}.select__body{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(.8rem,2.5vw,1.6rem);align-items:start;min-height:0}.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(120px,22vw,168px),1fr));gap:clamp(.55rem,2vw,.95rem)}.roster__card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.7rem .55rem .85rem;border-radius:var(--radius);background:linear-gradient(180deg,var(--bg-elev),var(--bg-panel));box-shadow:inset 0 0 0 2px transparent,0 10px 22px #00000059;transition:transform .12s ease,box-shadow .15s ease;overflow:hidden}.roster__card:before{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 50% 0%,var(--tint, transparent),transparent 70%);opacity:.35}.roster__card .chog-fig{width:82%;filter:drop-shadow(0 10px 12px rgba(0,0,0,.4))}.roster__card.is-selected{transform:translateY(-4px) scale(1.02);box-shadow:inset 0 0 0 3px var(--tint, var(--violet-bright)),0 16px 30px #00000080}.roster__name{font-family:var(--font-display);font-size:clamp(.78rem,2.6vw,1rem);position:relative}.roster__traits{position:relative;font-size:clamp(.62rem,2vw,.74rem);color:var(--text-dim);letter-spacing:.04em;text-transform:uppercase}.statcard{padding:clamp(.9rem,2.5vw,1.35rem);display:flex;flex-direction:column;gap:.75rem;min-width:0}.statcard__head{display:flex;gap:.9rem;align-items:center}.statcard__head .chog-fig{width:clamp(78px,16vw,116px);flex:0 0 auto;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45))}.statcard__name{font-family:var(--font-display);font-size:clamp(1.15rem,4vw,1.7rem);margin:0}.statcard__tag{font-size:.86rem;color:var(--text-dim);margin:.15rem 0 0}.badges{display:flex;flex-wrap:wrap;gap:.4rem}.badge{display:inline-flex;align-items:center;gap:.35em;padding:.32em .72em;border-radius:999px;font-size:clamp(.66rem,2vw,.78rem);font-weight:600;letter-spacing:.03em;background:#ffffff12;box-shadow:inset 0 0 0 1.5px var(--edge)}.badge--element{background:color-mix(in srgb,var(--tint) 22%,transparent);box-shadow:inset 0 0 0 1.5px var(--tint);color:var(--tint)}.statgrid{display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1rem}.stat{display:flex;flex-direction:column;gap:.15rem;min-width:0}.stat__label{font-size:clamp(.64rem,1.9vw,.76rem);text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.stat__value{font-family:var(--font-display);font-size:clamp(1.15rem,4vw,1.65rem);color:var(--text-hi);line-height:1}.stat__bar{height:7px;border-radius:999px;background:#ffffff1a;overflow:hidden}.stat__bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--violet-bright),var(--lime))}.matchup-note{display:flex;align-items:center;gap:.6rem;padding:.65rem .85rem;border-radius:12px;background:#ffffff0d;box-shadow:inset 0 0 0 1.5px var(--edge);font-size:clamp(.78rem,2.3vw,.92rem)}.matchup-note strong{font-family:var(--font-display)}.battle{gap:0}.battle__topbar{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:clamp(.55rem,2vw,.95rem) clamp(.75rem,3vw,1.4rem);padding-top:max(clamp(.55rem,2vw,.95rem),env(safe-area-inset-top));z-index:5}.round-pill{display:inline-flex;flex-direction:column;align-items:center;padding:.35em 1em;border-radius:12px;background:linear-gradient(180deg,var(--violet-bright),var(--violet));box-shadow:var(--shadow-hard);line-height:1}.round-pill small{font-size:.6rem;letter-spacing:.22em;opacity:.85}.round-pill b{font-family:var(--font-display);font-size:clamp(1.1rem,4vw,1.55rem)}.matchup-banner{display:inline-flex;align-items:center;gap:.5em;padding:.5em 1.1em;border-radius:999px;font-family:var(--font-display);font-size:clamp(.78rem,3vw,1.15rem);letter-spacing:.04em;box-shadow:var(--shadow-hard);transition:transform .2s ease}.matchup-banner.advantage{background:linear-gradient(180deg,#7dffab,var(--terra));color:#06301c}.matchup-banner.disadvantage{background:linear-gradient(180deg,#ff8fb4,var(--magenta));color:#3a0018}.matchup-banner.neutral{background:#ffffff1f;color:var(--text-hi);box-shadow:inset 0 0 0 2px var(--edge)}.icon-btn{width:clamp(42px,11vw,50px);height:clamp(42px,11vw,50px);border-radius:12px;background:#ffffff1a;box-shadow:inset 0 0 0 2px var(--edge);font-size:1.25rem;display:inline-flex;align-items:center;justify-content:center}.icon-btn:active{transform:translateY(3px)}.hud{display:flex;gap:clamp(.5rem,2vw,1.2rem);padding:0 clamp(.75rem,3vw,1.4rem);z-index:4}.hud__side{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:.35rem}.hud__side--enemy{align-items:flex-end}.hud__name{display:flex;align-items:baseline;gap:.5em;font-family:var(--font-display);font-size:clamp(.95rem,3.4vw,1.35rem);line-height:1;min-width:0}.hud__name .lvl{font-family:var(--font-ui);font-size:.68em;color:var(--text-dim);font-weight:600}.hud__side--enemy .hud__name{flex-direction:row-reverse}.bar{position:relative;width:100%;height:clamp(16px,4.4vw,22px);border-radius:999px;background:#0000006b;box-shadow:inset 0 0 0 2px #ffffff1a;overflow:hidden}.bar__fill{position:absolute;inset:0;width:100%;transform-origin:left;border-radius:999px;transition:width .28s cubic-bezier(.2,.8,.2,1)}.hud__side--enemy .bar__fill{right:0;left:auto;transform-origin:right}.bar__fill--hp{background:linear-gradient(90deg,#48e07a,var(--lime))}.bar__fill--hp.enemy{background:linear-gradient(90deg,var(--magenta),#ff8fb4)}.bar__fill--hp.low{background:linear-gradient(90deg,var(--magenta),var(--gold))}.bar__ghost{position:absolute;inset:0;width:100%;background:#ffffff38;border-radius:999px;transition:width .5s ease}.bar__text{position:absolute;inset:0;display:flex;align-items:center;padding:0 .75em;font-size:clamp(.66rem,2.2vw,.82rem);font-weight:700;letter-spacing:.03em;color:#06120a;text-shadow:0 1px 0 rgba(255,255,255,.25)}.hud__side--enemy .bar__text{justify-content:flex-end}.bar--energy{height:clamp(10px,2.8vw,14px)}.bar__fill--energy{background:linear-gradient(90deg,var(--gold),var(--lime))}.bar__text--energy{color:#2a2200;font-size:clamp(.56rem,1.8vw,.68rem)}.combo-tag{display:inline-flex;align-items:baseline;gap:.35em;font-family:var(--font-display);font-size:clamp(.72rem,2.4vw,.95rem);color:var(--gold);opacity:0;transform:scale(.8);transition:opacity .2s ease,transform .2s ease}.combo-tag.show{opacity:1;transform:scale(1)}.combo-tag b{font-size:1.5em}.stage{position:relative;flex:1 1 auto;min-height:0;margin:clamp(.35rem,1.5vw,.8rem) clamp(.55rem,2vw,1.1rem);border-radius:22px;overflow:hidden;background:radial-gradient(90% 70% at 50% 20%,rgba(123,63,242,.5),transparent 65%),radial-gradient(120% 80% at 50% 120%,rgba(255,46,136,.42),transparent 60%),linear-gradient(180deg,#191046,#241552 58%,#2b1657);box-shadow:inset 0 0 0 2px var(--edge),var(--shadow-soft);touch-action:manipulation}.stage__floor{position:absolute;left:-10%;right:-10%;bottom:-6%;height:42%;background:radial-gradient(60% 100% at 50% 0%,rgba(255,255,255,.16),transparent 70%);border-top:2px solid rgba(255,255,255,.12)}.stage__banner{position:absolute;top:0;width:46px;height:34%;background:linear-gradient(180deg,var(--violet-bright),transparent);opacity:.22}.stage__banner.l{left:8%}.stage__banner.r{right:8%}.fighter{position:absolute;bottom:16%;width:clamp(120px,30vw,260px);display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(0 22px 22px rgba(0,0,0,.5));will-change:transform}.fighter--player{left:4%}.fighter--enemy{right:4%}.fighter .chog-fig{width:100%}.fighter .chog-fig svg{display:block}@keyframes lunge-right{0%{transform:translate(0) scale(1)}30%{transform:translate(18%) scale(1.06)}to{transform:translate(0) scale(1)}}@keyframes lunge-left{0%{transform:translate(0) scale(1)}30%{transform:translate(-18%) scale(1.06)}to{transform:translate(0) scale(1)}}@keyframes hurt-shake{0%,to{transform:translate(0)}20%{transform:translate(-9px) rotate(-2deg)}45%{transform:translate(8px) rotate(2deg)}70%{transform:translate(-5px)}}.fighter--player.anim-attack{animation:lunge-right .28s ease-out}.fighter--enemy.anim-attack{animation:lunge-left .28s ease-out}.fighter.anim-hurt{animation:hurt-shake .32s ease-out}.fighter.anim-guard .chog-fig{filter:drop-shadow(0 0 18px var(--frost)) brightness(1.05)}.fighter.guard-on .chog-fig{filter:drop-shadow(0 0 22px var(--frost)) brightness(1.08)}.shake{animation:stage-shake .28s ease-out}@keyframes stage-shake{0%,to{transform:translate(0)}25%{transform:translate(-7px,4px)}50%{transform:translate(6px,-3px)}75%{transform:translate(-4px,2px)}}.fx-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden}.fx-canvas{position:absolute;inset:0;width:100%;height:100%}.float-num{position:absolute;font-family:var(--font-display);font-size:clamp(1.35rem,5.5vw,2.6rem);transform:translate(-50%,-50%);pointer-events:none;text-shadow:0 3px 0 rgba(0,0,0,.5),0 0 18px rgba(255,255,255,.25);animation:float-up .95s cubic-bezier(.2,.8,.2,1) forwards}.float-num.crit{color:var(--gold)}.float-num.player-hit{color:var(--magenta)}.float-num.enemy-hit{color:#fff}.float-num.zone-perfect{color:var(--gold)}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-20%) scale(.6)}25%{opacity:1;transform:translate(-50%,-60%) scale(1.15)}to{opacity:0;transform:translate(-50%,-180%) scale(.95)}}.telegraph{position:absolute;top:4%;left:50%;transform:translate(-50%);padding:.45em 1.1em;border-radius:999px;font-family:var(--font-display);letter-spacing:.12em;font-size:clamp(.85rem,3.2vw,1.15rem);background:var(--magenta);color:#fff;box-shadow:0 0 26px var(--magenta);animation:danger-pulse .5s ease-in-out infinite alternate}.telegraph.heavy{background:var(--gold);color:#3a2600;box-shadow:0 0 32px var(--gold)}@keyframes danger-pulse{0%{transform:translate(-50%) scale(1)}to{transform:translate(-50%) scale(1.09)}}.actions{z-index:5;display:flex;flex-direction:column;gap:clamp(.5rem,1.8vw,.85rem);padding:clamp(.55rem,2vw,1rem) clamp(.75rem,3vw,1.4rem);padding-bottom:max(clamp(.55rem,2vw,1rem),env(safe-area-inset-bottom))}.meter-wrap{display:flex;align-items:center;gap:.75rem}.meter{position:relative;flex:1 1 auto;height:clamp(22px,6vw,30px);border-radius:999px;background:#00000073;box-shadow:inset 0 0 0 2px var(--edge);overflow:hidden}.meter__zone{position:absolute;top:0;bottom:0;border-radius:999px}.meter__zone--good{background:#c8ff3c47}.meter__zone--perfect{background:linear-gradient(90deg,rgba(255,194,75,.5),var(--gold));box-shadow:0 0 16px var(--gold)}.meter__cursor{position:absolute;top:-2px;bottom:-2px;width:5px;margin-left:-2.5px;border-radius:4px;background:#fff;box-shadow:0 0 12px #fff,0 0 22px var(--violet-bright)}.meter__label{font-family:var(--font-display);font-size:clamp(.62rem,2vw,.82rem);color:var(--text-dim);white-space:nowrap}.action-row{display:flex;gap:clamp(.5rem,2vw,.9rem);align-items:stretch}.act{position:relative;flex:1 1 0;min-width:0;padding:clamp(.85rem,3.2vw,1.15rem) .5rem;border-radius:16px;font-family:var(--font-display);font-size:clamp(1rem,4vw,1.35rem);letter-spacing:.02em;color:#fff;box-shadow:var(--shadow-hard),inset 0 2px #ffffff40;transition:transform .06s ease,box-shadow .06s ease,filter .2s ease;-webkit-user-select:none;user-select:none;touch-action:none}.act:active{transform:translateY(5px)}.act--strike{flex:2.1 1 0;background:linear-gradient(180deg,#ff7aa8,var(--magenta))}.act--guard{background:linear-gradient(180deg,#7fe6ff,var(--frost));color:#04222c}.act--guard.active{filter:brightness(1.12);box-shadow:0 0 26px var(--frost),var(--shadow-hard)}.act--over{background:linear-gradient(180deg,#6d6a86,#46436a);color:#c7c3e0;flex:1.15 1 0}.act--over.ready{background:linear-gradient(180deg,#ffe07a,var(--gold));color:#3a2600;animation:over-glow .9s ease-in-out infinite alternate}@keyframes over-glow{0%{box-shadow:var(--shadow-hard),0 0 12px #ffc24b99}to{box-shadow:var(--shadow-hard),0 0 30px #ffc24b}}.act__key{display:block;font-family:var(--font-ui);font-size:.52em;font-weight:600;letter-spacing:.18em;opacity:.72;text-transform:uppercase}.act__fill{position:absolute;left:0;right:0;bottom:0;height:100%;border-radius:16px;background:#ffffff38;transform-origin:bottom;pointer-events:none}.results{align-items:center;justify-content:center;text-align:center;padding:clamp(1rem,5vw,2.5rem);gap:clamp(.75rem,2.5vw,1.35rem)}.results__banner{font-family:var(--font-display);font-size:clamp(2.4rem,12vw,6rem);line-height:.95;margin:0}.results__banner.win{background:linear-gradient(180deg,#fff,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}.results__banner.lose{background:linear-gradient(180deg,#fff,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent}.results__sub{font-size:clamp(1rem,3.6vw,1.35rem);margin:0}.results__stats{display:flex;gap:clamp(.8rem,4vw,2.4rem);flex-wrap:wrap;justify-content:center;margin:.5rem 0}.rstat{display:flex;flex-direction:column;gap:.15rem;min-width:84px}.rstat b{font-family:var(--font-display);font-size:clamp(1.8rem,8vw,3rem);color:var(--lime);line-height:1}.rstat span{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}.overlay{position:absolute;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:#0a081cd1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:1.5rem}.overlay__title{font-family:var(--font-display);font-size:clamp(2rem,9vw,3.4rem);margin:0}.overlay__menu{display:flex;flex-direction:column;gap:.75rem;width:min(320px,80vw)}.howto{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;max-width:44ch}.howto__item{display:inline-flex;align-items:center;gap:.45em;padding:.42em .85em;border-radius:999px;background:#ffffff12;box-shadow:inset 0 0 0 1.5px var(--edge);font-size:clamp(.72rem,2.2vw,.86rem)}.howto__item b{font-family:var(--font-display);color:var(--gold)}@media(max-width:760px){.select__body{grid-template-columns:1fr}.statcard{order:-1}.fighter{width:clamp(110px,42vw,200px)}.fighter--player{left:0}.fighter--enemy{right:0}}@media(max-height:560px)and (min-width:620px){.hud__name{font-size:clamp(.85rem,2.4vw,1.1rem)}.title__fighters{height:120px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.08s!important}}