.character-select{background:#000;padding:max(8px,env(safe-area-inset-top)) 7px max(8px,env(safe-area-inset-bottom));isolation:isolate}
.character-select:before,.character-select:after,.character-roster:before,.character-roster:after,.character-card:before,.character-card:after{display:none!important;content:none!important}
.character-roster{z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:0;width:100%;height:100%;max-height:none;position:relative}
.character-card,.character-card:first-child,.character-card:nth-child(2),.character-card:nth-child(3),.character-card:nth-child(4),.character-card:nth-child(5),.character-card:nth-child(6),.character-card:nth-child(7),.character-card:nth-child(8){--float-delay:0s;--float-shift:0px;--portrait-scale:.94;--portrait-x:0px;--portrait-y:0px;position:relative;inset:auto;top:auto;right:auto;bottom:auto;left:auto;width:100%;height:100%;min-width:0;min-height:0;padding:0;overflow:visible;background:transparent;border:0;border-radius:0;filter:none;transform:none;box-shadow:none}
.character-card:nth-child(1){grid-column:1;grid-row:1/span 2;--float-delay:-.4s;--float-shift:-2px}.character-card:nth-child(2){grid-column:1;grid-row:3/span 2;--float-delay:-1.1s;--float-shift:3px}.character-card:nth-child(3){grid-column:1;grid-row:5/span 2;--float-delay:-.7s;--float-shift:-3px}.character-card:nth-child(4){grid-column:2;grid-row:1/span 3;--float-delay:-1.5s;--float-shift:2px}.character-card:nth-child(5){grid-column:2;grid-row:4/span 3;--float-delay:-.2s;--float-shift:-2px}.character-card:nth-child(6){grid-column:3;grid-row:1/span 2;--float-delay:-1.25s;--float-shift:3px}.character-card:nth-child(7){grid-column:3;grid-row:3/span 2;--float-delay:-.55s;--float-shift:-3px}.character-card:nth-child(8){grid-column:3;grid-row:5/span 2;--float-delay:-1.7s;--float-shift:2px}
.character-card:nth-child(1){--portrait-scale:1.06;--portrait-y:17px}.character-card:nth-child(2){--portrait-scale:1.38;--portrait-x:11px}.character-card:nth-child(4){--portrait-scale:1.1;--portrait-x:-8px;--portrait-y:11px}.character-card:nth-child(5){--portrait-y:-43px}.character-card:nth-child(7){--portrait-x:-13px}.character-card:nth-child(8){--portrait-scale:1.18;--portrait-x:-11px}
.character-card img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;filter:grayscale(.12) brightness(.78) contrast(1.08) drop-shadow(0 12px 14px #000);transform:translate(var(--portrait-x),calc(var(--float-shift) + var(--portrait-y))) scale(var(--portrait-scale));transform-origin:center;animation:character-float 3.2s ease-in-out var(--float-delay) infinite;transition:filter .18s ease,transform .2s cubic-bezier(.2,.8,.2,1),opacity .18s ease}
.character-card:is(:hover,:focus-visible,.previewing){z-index:8;filter:none;transform:none;outline:0;box-shadow:none}.character-card:is(:hover,:focus-visible,.previewing) img,.character-card:active img{animation-play-state:paused;filter:grayscale(0) brightness(1.08) contrast(1.04) drop-shadow(0 17px 18px #000) drop-shadow(0 0 10px var(--character-accent));transform:translate(var(--portrait-x),calc(var(--portrait-y) - 4px)) scale(calc(var(--portrait-scale) + .1))}
@keyframes character-float{0%,to{transform:translate(var(--portrait-x),calc(var(--float-shift) + var(--portrait-y) - 3px)) scale(var(--portrait-scale))}50%{transform:translate(var(--portrait-x),calc(var(--float-shift) + var(--portrait-y) + 4px)) scale(calc(var(--portrait-scale) + .02))}}
.selection-smoke{z-index:1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.selection-smoke-puff{--puff-size:90px;width:var(--puff-size);height:var(--puff-size);position:absolute;left:var(--puff-x);top:var(--puff-y);border-radius:46% 54% 62% 38%;opacity:0;background:radial-gradient(circle at 38% 40%,#ffffff20 0 9%,#a8a8a814 24%,#5555550d 46%,#0000 70%);filter:blur(8px);transform:translate(-50%,-50%) scale(.3);animation:selection-smoke-drift 1.35s ease-out forwards;mix-blend-mode:screen}@keyframes selection-smoke-drift{12%{opacity:.9}to{opacity:0;transform:translate(calc(-50% + var(--drift-x)),calc(-50% - 70px)) scale(2.2) rotate(var(--smoke-rotate))}}
@media(prefers-reduced-motion:reduce){.selection-smoke{display:none}.character-card img{animation:none;transition:none}}
.arena-defeat{grid-auto-flow:row;align-content:center;gap:18px}.arena-defeat-score{color:#fff;text-align:center;filter:drop-shadow(0 3px 5px #000);font:800 clamp(26px,8vw,48px)/1 "Segoe UI Emoji","Apple Color Emoji",system-ui,sans-serif;letter-spacing:.02em}.arena-defeat button{justify-self:center}
