/* Voice chat, the same in every game (shared/voice.js): who's talking (bottom left; on the right, vertically centered, in a match). */
.vc { position: fixed; left: 18px; bottom: 20px; z-index: 30; display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 8px; pointer-events: none; }
.vc[hidden] { display: none; }
/* in a match (the game sets vc-high): who's talking sits on the right edge, vertically centered, inside the HUD's margin */
body.vc-high .vc { left: auto; right: var(--hud, 18px); bottom: auto; top: 50%; transform: translateY(-50%); align-items: flex-end; }
body.vc-high .vc-talk { align-items: flex-end; }
body.vc-high .vc-who { animation-name: vcInRight; } body.vc-high .vc-who.out { transform: translateX(8px); }
@keyframes vcInRight { from { opacity: 0; transform: translateX(8px); } }
.vc-talk { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
/* who's talking: a blue sound icon and their name, no box. Talking now: large, the icon pulsing. Just stopped:
   smaller and dim, then gone. Quick transitions, since people trade the mic fast. */
.vc-who { display: inline-flex; align-items: center; gap: 10px; font: 800 21px 'JetBrains Mono', ui-monospace, monospace; color: #fff; white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .9), 0 0 10px rgba(0, 0, 0, .6); transition: font-size .12s ease-out, opacity .12s ease-out, transform .12s ease-out; animation: vcIn .12s ease-out; }
.vc-who iconify-icon { font-size: 1.3em; color: #22e6ff; filter: drop-shadow(0 0 6px rgba(34, 230, 255, .8)); }
.vc-who.live iconify-icon { animation: vcPulse .45s ease-in-out infinite alternate; }
.vc-who.recent { font-size: 15px; opacity: .55; }
.vc-who.recent iconify-icon { filter: none; }
.vc-who.out { opacity: 0; transform: translateX(-8px); }
@keyframes vcIn { from { opacity: 0; transform: translateX(-8px); } }
@keyframes vcPulse { to { transform: scale(1.18); } }