/* Arena — fight-night scoreboard. Beveled plate, LED clock, jersey numbers. */
.theme-arena .vote-panel {
  width: min(500px, 92vw);
  padding: 16px 16px 12px;
  border-radius: 2px;
  border: 3px solid color-mix(in srgb, var(--vs-accent) 75%, #111);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0 18px, transparent 18px),
    repeating-linear-gradient(
      90deg,
      transparent 0 22px,
      rgba(0, 0, 0, 0.22) 22px 23px
    ),
    linear-gradient(180deg, color-mix(in srgb, var(--vs-panel) 88%, #000), var(--vs-panel));
  box-shadow:
    0 0 0 1px #000,
    0 0 0 5px color-mix(in srgb, var(--vs-accent) 35%, #000),
    0 18px 40px rgba(0, 0, 0, 0.6);
}

.theme-arena .vote-header {
  align-items: center;
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 4px double color-mix(in srgb, var(--vs-accent) 70%, transparent);
}

.theme-arena .vote-question {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 1.05rem;
  text-shadow: 0 2px 0 #000;
}

.theme-arena .vote-timer {
  min-width: 72px;
  padding: 6px 10px;
  text-align: center;
  font-size: 1.45rem;
  letter-spacing: 0.12em;
  color: var(--vs-accent);
  background: #050505;
  border: 2px solid var(--vs-accent);
  box-shadow: inset 0 0 14px color-mix(in srgb, var(--vs-accent) 45%, transparent);
}

.theme-arena .vote-options {
  gap: 8px;
}

.theme-arena .vote-option {
  border-radius: 0;
  border: 2px solid rgba(0, 0, 0, 0.45);
  clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%, 0 10px);
  background: color-mix(in srgb, var(--vs-panel) 55%, #000);
}

.theme-arena .vote-option-index {
  width: 32px;
  height: 32px;
  border-radius: 2px;
  font-size: 1.05rem;
  background: linear-gradient(180deg, var(--vs-accent), var(--vs-bar-fill));
  color: #111;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.35);
}

.theme-arena .vote-option-bar {
  opacity: 0.5;
  background: linear-gradient(90deg, var(--vs-bar-fill), transparent);
}

.theme-arena .vote-option-label {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
}

.theme-arena .vote-footer {
  border-top: 2px solid rgba(255, 255, 255, 0.08);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.7rem;
}

.theme-arena .vote-panel.results .vote-option.winner {
  box-shadow:
    0 0 0 2px var(--vs-accent),
    0 0 28px color-mix(in srgb, var(--vs-bar-fill) 55%, transparent);
}

.theme-arena .vote-panel.revealing .vote-option.winner {
  animation: arenaSlam 0.72s cubic-bezier(0.22, 1.45, 0.36, 1) both;
}

.theme-arena .vote-panel.revealing .vote-option.winner::after {
  content: '';
  pointer-events: none;
  position: absolute;
  inset: -8px;
  background: radial-gradient(circle, color-mix(in srgb, var(--vs-accent) 70%, transparent), transparent 62%);
  animation: arenaBurst 0.7s ease-out both;
}

@keyframes arenaSlam {
  0% { transform: scale(0.82) translateY(18px); filter: brightness(2.2); }
  58% { transform: scale(1.07) translateY(-6px); filter: brightness(1.15); }
  100% { transform: scale(1) translateY(0); filter: brightness(1); }
}

@keyframes arenaBurst {
  0% { opacity: 0.95; transform: scale(0.4); }
  100% { opacity: 0; transform: scale(1.35); }
}