.spotlight-stage { text-align: center; gap: 14px; }
.spotlight-stage h2 { font-size: 1.9rem; line-height: 1.15; margin: 1.25rem 0; }
.spotlight-stage .show-progress { flex-wrap: wrap; gap: .75rem; }
.spotlight-secret { background: linear-gradient(130deg,#eef0ff,#fffcf0); border: 1px solid #dfe1ff; border-radius: 24px; padding: 1.5rem; margin: 1.25rem 0; }
.spotlight-secret small { display: block; color: #4c50ac; font-weight: 800; }
.spotlight-secret strong { display: block; font-size: 2.5rem; line-height: 1.2; overflow-wrap: anywhere; color: #4144a9; margin-top: .75rem; }
.spotlight-points { padding: 1rem; color: #4144a9; background: #eef0ff; border-radius: 16px; font-weight: 800; margin: 1rem 0; }
.spotlight-matchup { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 1.5rem 0; }
.spotlight-pair { border: 1px solid #e0e3f6; border-radius: 20px; padding: 1rem; background: #fff; min-width: 0; }
.spotlight-pair.is-active { border-color: #8588f4; background: #f5f5ff; }
.spotlight-pair h3 { font-size: 1rem; margin: 0 0 .75rem; overflow-wrap: anywhere; }
.spotlight-pair>div { display: flex; gap: .75rem; }
.spotlight-pair p { flex: 1; margin: 0; min-width: 0; }
.spotlight-pair small,.spotlight-pair strong { display: block; overflow-wrap: anywhere; }
.spotlight-badge { display: inline-block; font-weight: 800; color: #4548ac; background: #eef0ff; border-radius: 30px; padding: .5rem .85rem; font-size: .8rem; }
.spotlight-badge.is-gold { background: #fff2bd; color: #67520c; }
.spotlight-badge img { vertical-align: middle; object-fit: contain; }
.spotlight-award { font-size: 3rem; font-weight: 900; color: #4144a9; }
.spotlight-award small { display: block; font-size: .9rem; }
.spotlight-streak { font-weight: 800; font-size: .9rem; }
.spotlight-streak span { display: flex; justify-content: center; gap: 6px; margin-top: 10px; }
.spotlight-streak i { display: block; width: 35px; height: 7px; border-radius: 5px; background: #e6e7f5; }
.spotlight-streak i.filled { background: #7a7eef; }
.spotlight-buzzer { border: 1px solid #d4c36f; border-radius: 12px; padding: .8rem; background: #fff9de; color: #655116; }
.spotlight-recovery { text-align: left; margin-top: 1rem; border-top: 1px solid #e1e4f5; padding-top: 1rem; }
.spotlight-recovery form { margin: 1rem 0; }
.spotlight-own-team { font-size: .85rem; color: #58677e; font-weight: 800; }
.spotlight-student { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 20px; padding: 24px 16px; }
.spotlight-wordmark { font-size: 23px; font-weight: 900; background: white; border-radius: 40px; padding: 16px 28px; box-shadow: 0 10px 28px #2530450b; }
.show-host-stage:has(.spotlight-stage) .spotlight-secret { margin: .25rem 0; padding: 1rem; }
.show-host-stage:has(.spotlight-stage) .spotlight-stage h2 { margin: .5rem 0; }
.show-host-stage:has(.spotlight-stage) .spotlight-matchup { margin: .5rem 0; }
.show-projector .spotlight-stage { width: min(100%,1000px); }
.show-projector:has(.spotlight-stage) .projector-topbar strong { color: #4548ac; }
.spotlight-victory { animation: spotlight-arrive .35s ease-out; }
@keyframes spotlight-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media(max-width:600px) { .spotlight-matchup { grid-template-columns: 1fr; } .spotlight-stage h2 { font-size: 1.75rem; } .spotlight-secret { padding: 1.25rem .75rem; } .spotlight-secret strong { font-size: 2rem; } .spotlight-stage .show-judging { display: grid; grid-template-columns: 1fr; } }
@media(prefers-reduced-motion:reduce) { .spotlight-victory { animation:none; } }
