/* 대결 등장 화면의 양쪽 9명(js/asm-arena-vs.js): 내 쪽은 이름 아래, 상대 쪽은 이름 위. 판이 들어온 뒤(1.5초~) 한 명씩 솟아오른다 */
.ar-vs-team { display: grid; grid-template-columns: repeat(3, 52px); gap: 0 6px; margin: 8px 0; }
.ar-i-vs .r .ar-vs-team { justify-self: end; }
.ar-vs-seat { position: relative; z-index: 0; display: grid; place-items: end center; height: 70px; animation: arSeatIn .32s cubic-bezier(.2,.9,.3,1.3) calc(1.5s + var(--d) * 70ms) both; }
.ar-vs-seat svg { width: 48px; height: auto; filter: drop-shadow(0 2px 0 rgba(0,0,0,.5)); }
.ar-vs-seat.sp::after { content: ''; position: absolute; z-index: -1; left: 4px; right: 4px; bottom: 0; height: 6px; border-radius: 50%; background: #F5C542; box-shadow: 0 0 12px rgba(245,197,66,.95); }   /* 의장: 금빛 받침 */
.ar-vs-seat.empty::before { content: ''; width: 24px; height: 20px; margin-bottom: 4px; border: 2px dashed rgba(255,255,255,.35); border-radius: 6px 6px 2px 2px; }
@keyframes arSeatIn { from { transform: translateY(16px) scale(.6); opacity: 0; } }
.ar-vs-ttl { justify-self: start; font: 800 11px var(--body); color: #3B2208; background: linear-gradient(#FFE58A, #D9A62E); padding: 2px 7px; border-radius: 4px; }
.ar-i-vs .r .ar-vs-ttl { justify-self: end; }
@media (max-width: 420px) { .ar-vs-team { grid-template-columns: repeat(3, 40px); gap: 0 4px; } .ar-vs-seat { height: 56px; } .ar-vs-seat svg { width: 38px; } }
@media (prefers-reduced-motion: reduce) { .ar-vs-seat { animation: none; } }
