/* 게임 공용 스타일 (게임별 스타일은 /games/<id>.css) */

/* 휴대폰 응원 → TV 떠오르는 이모지 */
.cheer { position: fixed; bottom: -4rem; z-index: 9500; pointer-events: none; display: flex; flex-direction: column; align-items: center; animation: cheerUp 3.2s cubic-bezier(0.3, 0.6, 0.4, 1) forwards; }
.cheer span { font-size: 4.5rem; filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.5)); }
.cheer small { font-size: 0.9rem; padding: 0.1em 0.6em; border-radius: 999px; background: rgba(0, 0, 0, 0.6); }
.cheer.t-white small { border: 1px solid var(--w-glow); }
.cheer.t-black small { border: 1px solid var(--gold); color: var(--gold); }
@keyframes cheerUp { 0% { transform: translateY(0) scale(0.5); opacity: 0; } 15% { opacity: 1; transform: translateY(-20vh) scale(1.1); } 100% { transform: translateY(-85vh) scale(0.9) rotate(15deg); opacity: 0; } }

.hs-float { position: fixed; bottom: -5rem; z-index: 9400; pointer-events: none; animation: hsUp 4.2s cubic-bezier(0.3, 0.6, 0.4, 1) forwards; filter: drop-shadow(0 0 14px rgba(255, 61, 154, 0.8)); }
@keyframes hsUp { 0% { transform: translateY(0) scale(0.4); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateY(-95vh) scale(1.1) rotate(-15deg); opacity: 0; } }

/* 🎵 BGM 관리 패널 (TV 관리 패널 · 운영진 폰 공용) */
.bgm-now { display: flex; align-items: center; gap: 0.7rem; padding: 0.7rem 0.9rem; border-radius: 16px; background: linear-gradient(90deg, rgba(0, 201, 255, 0.18), rgba(146, 254, 157, 0.08)); border: 1px solid rgba(0, 201, 255, 0.4); margin-bottom: 0.7rem; }
.bgm-now small { display: block; color: var(--muted); font-size: 0.75rem; }
.bgm-now b { font-family: var(--display); font-weight: 400; font-size: 1.1rem; }
.bgm-eq { display: flex; align-items: flex-end; gap: 3px; height: 1.6rem; }
.bgm-eq i { width: 5px; height: 30%; border-radius: 2px; background: #00c9ff; }
.bgm-eq.on i { animation: bgmeq 0.6s ease-in-out infinite alternate; }
.bgm-eq.on i:nth-child(2) { animation-delay: -0.2s; } .bgm-eq.on i:nth-child(3) { animation-delay: -0.4s; }
@keyframes bgmeq { from { height: 20%; } to { height: 100%; } }
.bgm-list { display: flex; flex-direction: column; gap: 0.3rem; }
.bgm-row { display: flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.5rem; border-radius: 10px; background: rgba(255, 255, 255, 0.04); }
.bgm-row.cur { background: rgba(0, 201, 255, 0.15); border: 1px solid rgba(0, 201, 255, 0.5); }

/* 호스트 공용 레이아웃 도우미 */
.g-center { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.2rem; text-align: center; }
.g-split { flex: 1; display: grid; grid-template-columns: 1fr 24rem; gap: 1rem; min-height: 0; }
.g-hint { font-size: 1.1rem; color: var(--muted); }
.g-status { display: flex; gap: 0.6rem; flex-wrap: wrap; justify-content: center; }
.answered-grid { display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: center; }
.answered-grid .avatar { transition: 0.3s; }
.answered-grid .avatar.done { transform: scale(1.1); box-shadow: 0 0 14px var(--green); border-color: var(--green); }