/* 단체 게임 안내 페이지 공용
 * 2026-10-24 고도화 R7-7 — 페이지마다 <style>에 똑같이 복사돼 있던 규칙을 한 벌로. 페이지 <style>은 이 파일 뒤라 같은 이름을 다시 쓰면 페이지 값이 이긴다.
 * 쓰는 페이지: viewer-liar · viewer-mafia · viewer-drawphone · viewer-defuse */
.panel { background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; margin-bottom: 14px; }
.panel-title { font-size: 0.95rem; font-weight: 700; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.panel-desc { font-size: 0.8rem; color: var(--text-dim); margin-bottom: 10px; line-height: 1.7; }
.flow { font-size: 0.85rem; line-height: 1.9; }
.flow li { list-style: none; padding: 5px 0; border-bottom: 1px dashed var(--border-dim); }
.flow li:last-child { border-bottom: none; }
.flow b { color: var(--brand); }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(130px, 100%), 1fr)); gap: 8px; }
.stat-box { background: var(--bg-deep); border: 1px solid var(--border-dim); border-radius: var(--radius); padding: 10px 12px; min-width: 0; }
.stat-box .l { font-size: 0.74rem; color: var(--text-dim); display: flex; align-items: center; gap: 5px; }
.stat-box .v { font-size: 1.1rem; font-weight: 800; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.go-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 12px 0 10px; }
.go-row .btn { padding: 10px 22px; }
.rank { display: flex; align-items: baseline; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--bg-elev); font-size: 0.85rem; }
.rank:last-child { border-bottom: none; }
.rank .n { color: var(--text-dim); width: 26px; flex-shrink: 0; }
.rank .who { flex: 1; min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.rank .c { color: var(--text-sub); font-variant-numeric: tabular-nums; text-align: right; }
@media (max-width: 640px) {
    .rank { flex-wrap: wrap; row-gap: 2px; }
    .rank .c { flex-basis: 100%; padding-left: 34px; text-align: left; font-size: 0.8rem; }
}