/* โหมดจอทีวี/โปรเจกเตอร์: สรุปเหรียญรางวัล */
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  display: flex; flex-direction: column; overflow: hidden;
  font-family: 'Noto Sans Thai', sans-serif; color: #f2f4fb;
  background: radial-gradient(circle at 85% 0%, rgba(212, 160, 23, .25), transparent 40%), linear-gradient(160deg, #0b1433, #142356 60%, #1b2f6b);
}
.tv-head { display: flex; align-items: center; gap: 2vw; padding: 1.6vh 2.5vw; border-bottom: 2px solid rgba(212, 160, 23, .5); }
.tv-logo { width: 6vh; height: 6vh; }
.tv-title h1 { font-family: 'Prompt', sans-serif; font-size: 4.2vh; margin: 0; color: #f6d365; }
.tv-title p { margin: 0; font-size: 2vh; opacity: .85; }
.tv-meta { margin-left: auto; text-align: right; min-width: 22vw; }
.tv-clock { font-family: 'Prompt', sans-serif; font-size: 4vh; font-weight: 700; }
.tv-progress { font-size: 2vh; opacity: .9; }
.tv-bar { height: .9vh; background: rgba(255, 255, 255, .15); border-radius: 1vh; margin-top: .6vh; overflow: hidden; }
.tv-bar div { height: 100%; width: 0; background: linear-gradient(90deg, #d4a017, #f6d365); transition: width 1s; }
.tv-fs { background: transparent; border: 1px solid rgba(255, 255, 255, .3); color: #fff; border-radius: 1vh; padding: .8vh 1vw; font-size: 2.2vh; cursor: pointer; }

.tv-body { flex: 1; overflow-y: auto; padding: 0 2.5vw; scrollbar-width: none; }
.tv-body::-webkit-scrollbar { display: none; }
.tv-table { width: 100%; border-collapse: separate; border-spacing: 0 .7vh; font-size: 3.1vh; }
.tv-table thead th { position: sticky; top: 0; z-index: 1; padding: 1.4vh 1vw; text-align: left; font-family: 'Prompt', sans-serif; font-weight: 600; background: #0f1a40; color: #c9d3f5; }
.tv-table td { padding: 1.2vh 1vw; background: rgba(255, 255, 255, .06); }
.tv-table td:first-child { border-radius: 1.2vh 0 0 1.2vh; }
.tv-table td:last-child { border-radius: 0 1.2vh 1.2vh 0; }
.tv-table .c { text-align: center; }
.tv-table td.gold, .tv-table th.gold { color: #f6d365; font-weight: 700; }
.tv-table td.silver, .tv-table th.silver { color: #dfe3ea; }
.tv-table td.bronze, .tv-table th.bronze { color: #e0a370; }
.tv-table .muted { opacity: .6; padding: 6vh; }
.rk { display: inline-flex; align-items: center; justify-content: center; width: 5vh; height: 5vh; border-radius: 50%; background: rgba(255, 255, 255, .12); font-weight: 700; }
.top1 td { background: rgba(212, 160, 23, .22); }
.top1 .rk { background: linear-gradient(135deg, #ffe680, #d4a017); color: #222; }
.top2 .rk { background: linear-gradient(135deg, #f2f2f2, #a8a9ad); color: #222; }
.top3 .rk { background: linear-gradient(135deg, #f0b88a, #b87333); color: #222; }
.top td { font-weight: 600; }

.tv-ticker { display: flex; align-items: center; gap: 1vw; padding: 1.2vh 2.5vw; background: #d4a017; color: #1b1b1b; font-size: 2.4vh; font-weight: 600; overflow: hidden; }
.tv-ticker-label { white-space: nowrap; }
.tv-ticker-track { flex: 1; overflow: hidden; white-space: nowrap; }
.tv-ticker-track > div { display: inline-block; padding-left: 100%; animation: ticker 45s linear infinite; }
.tv-ticker-track span { margin: 0 .6vw; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .tv-ticker-track > div { animation: none; padding-left: 0; } }