/* ===== Màn hình khán giả (xemdiem.php) — vừa khít 1 màn hình, co giãn theo chiều cao ===== */
body.tv{height:100vh;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;font-size:clamp(12px,1.55vh,18px)}
body.tv > *{position:relative;z-index:2}

/* ---- đầu trang ---- */
.tv-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:2vw;padding:1.6vh 2.4vw;
  background:linear-gradient(180deg,rgba(2,18,58,.92),rgba(2,18,58,.6));border-bottom:1px solid var(--line2);box-shadow:0 4px 24px rgba(0,10,40,.45)}
.tv-brand{display:flex;align-items:center;gap:1vw}
.tv-brand .orb-hero-logo{width:11vh;height:11vh}
.tv-brand .org{font-size:1.9vh;font-weight:800;letter-spacing:2px;white-space:nowrap}
.tv-brand .dept{font-size:1.6vh;font-weight:800;letter-spacing:1.5px;margin-top:.6vh;white-space:nowrap}
.tv-title{text-align:center;min-width:0}
.tv-title h1{margin:0;font-size:4.2vh;text-transform:uppercase;letter-spacing:.3vh;text-shadow:none;white-space:nowrap}
.tv-title .cup-e{display:inline-block;filter:drop-shadow(0 3px 0 #6b4200) drop-shadow(0 0 8px rgba(255,210,74,.7))}
.tv-sub{margin-top:.9vh;display:flex;gap:.8vh;justify-content:center;align-items:center;flex-wrap:wrap;color:#cfe6ff;font-size:1.5vh}
.tv-sub .chip{font-size:1.4vh}
.tv-right{display:flex;align-items:center;gap:1vw}
.tv-right .cd{min-width:17vh;padding:.8vh 1.6vh}
.tv-right .cd-t{font-size:4.4vh}
.tv-right .cd small,.tv-right .cd-sub{font-size:1.2vh}
.tv-tools{display:flex;flex-direction:column;gap:.8vh}
.tv-btn{width:4.6vh;height:4.6vh;display:grid;place-items:center;border-radius:1vh;border:1px solid var(--line2);background:rgba(76,195,255,.12);
  color:#fff;font-size:2.2vh;cursor:pointer;text-decoration:none!important}
.tv-btn:hover{background:rgba(76,195,255,.3)}

/* ---- thân ---- */
.tv-main{display:grid;grid-template-rows:auto 1fr;gap:2vh;padding:2.2vh 3vw 1.6vh;min-height:0}

/* Top 3 */
.tv-podium{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:2vw;align-items:end;max-width:1500px;width:100%;margin:0 auto}
.tv-pod{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.7vh;padding:2vh 1.4vw 1.8vh;border-radius:2vh;
  background:linear-gradient(180deg,rgba(255,255,255,.07),var(--panel));border:1px solid var(--line2);border-top-width:4px;min-width:0;transition:transform .3s}
.tv-pod.p1{padding-top:3vh;border-color:#ffd24a;border-top-color:#ffe680;background:linear-gradient(180deg,rgba(255,210,74,.18),var(--panel) 70%);
  box-shadow:0 0 4vh rgba(255,210,74,.35)}
.tv-pod.p2{border-color:#c9d6e6;border-top-color:#fff}
.tv-pod.p3{border-color:#e0904a;border-top-color:#ffb870}
.tv-pod .rk-lb{font-weight:800;letter-spacing:.3vh;font-size:2vh}
.tv-pod.p1 .rk-lb{color:#ffd24a;font-size:2.5vh;text-shadow:0 0 1.2vh rgba(255,210,74,.7)}
.tv-pod.p2 .rk-lb{color:#e9f1fb}
.tv-pod.p3 .rk-lb{color:#ffa45c}
.tv-pod .av.xl{width:9vh;height:9vh;font-size:4vh}
.tv-pod.p1 .av.xl{width:11vh;height:11vh;font-size:5vh}
.tv-pod .medal-b{width:3vh;height:3vh;font-size:1.5vh}
.tv-pod .nm{font-size:2.6vh;color:#fff;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-pod.p1 .nm{font-size:3.2vh}
.tv-pod .pts b{font-size:6vh;font-weight:800;line-height:1;color:#fff;text-shadow:0 0 2vh rgba(143,230,255,.6)}
.tv-pod.p1 .pts b{font-size:8vh;color:#ffd24a;text-shadow:0 0 2.4vh rgba(255,210,74,.8)}
.tv-pod .pts small{display:block;font-size:1.4vh;color:var(--mut)}
.tv-pod .meta{font-size:1.4vh;color:#cfe6ff}
.tv-pod.empty{opacity:.45}
.tv-pod.empty .av{background:#1a2a44;box-shadow:none}
.tv-cup{position:absolute;right:1.6vw;top:2vh;width:8vh;height:8.4vh;background:url(img/cup.webp) center/contain no-repeat;
  filter:drop-shadow(0 0 .8vh rgba(255,210,74,.9)) drop-shadow(0 .4vh .3vh rgba(0,0,0,.5));animation:cupfloat 2.4s ease-in-out infinite}
.tv-pod.up,.tv-row.up{animation:tvUp 1.6s ease-out}
@keyframes tvUp{0%{box-shadow:0 0 0 .4vh #2ee59d,0 0 5vh #2ee59d;transform:scale(1.03)}100%{}}

/* Danh sách hạng 4+ */
.tv-list{display:flex;flex-direction:column;min-height:0;max-width:1500px;width:100%;margin:0 auto;padding:1.6vh 1.8vw;border-radius:2vh;
  background:var(--panel);border:1px solid var(--line2)}
.tv-list-h{display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:2vh;color:#fff;margin-bottom:1.2vh}
.tv-list-h #pageInfo{font-size:1.5vh;color:var(--mut);font-weight:400}
.tv-rows{flex:1;display:grid;grid-auto-flow:column;grid-template-rows:repeat(5,1fr);grid-template-columns:1fr 1fr;column-gap:3vw;row-gap:1vh;min-height:0}
.tv-row{display:grid;grid-template-columns:5vh 5vh minmax(0,1.2fr) 1fr 7vh;align-items:center;gap:1.2vh;padding:0 1.4vh;border-radius:1.2vh;
  background:rgba(1,12,40,.55);border:1px solid var(--line);min-height:0}
.tv-row.empty{background:transparent;border-style:dashed;opacity:.35}
.tv-row .rk{font-size:2.4vh;font-weight:800;color:#cfe6ff;text-align:center}
.tv-row .av.md{width:4.4vh;height:4.4vh;font-size:2vh}
.tv-row .nm{font-size:2.2vh;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-row .bar{height:1.3vh;background:rgba(1,12,40,.8);border-radius:1vh;overflow:hidden}
.tv-row .bar i{display:block;height:100%;border-radius:1vh;background:linear-gradient(90deg,#4cc3ff,#fff);box-shadow:0 0 1.2vh rgba(143,230,255,.7);transition:width .8s}
.tv-row .sc{font-size:2.8vh;font-weight:800;text-align:right;color:#fff}

/* ---- dải tin chạy ---- */
.tv-ticker{display:flex;align-items:center;gap:1.2vw;padding:1vh 2vw;background:linear-gradient(90deg,#03245f,#0a4cb8,#03245f);border-top:1px solid var(--line2)}
.tk-lb{flex:none;font-weight:800;color:#ffd24a;font-size:1.6vh;letter-spacing:.2vh}
.tk-view{flex:1;overflow:hidden;min-width:0}
.tk-track{display:inline-flex;gap:4vw;white-space:nowrap;animation:tkRun 40s linear infinite}
@keyframes tkRun{to{transform:translateX(-50%)}}
.tk-item{display:inline-flex;align-items:center;gap:.6vw;font-size:1.7vh;color:#fff}
.tk-item time{color:#b9d4f5;font-size:1.4vh}
.tk-time{flex:none;font-weight:800;font-size:2vh;color:#fff;font-variant-numeric:tabular-nums}

/* ---- màn hình nhỏ (điện thoại): cho cuộn bình thường ---- */
@media (max-width:900px),(max-height:520px){
  body.tv{height:auto;overflow:auto;display:block;font-size:14px}
  .tv-head{grid-template-columns:1fr;justify-items:center;gap:12px;padding:14px}
  .tv-brand .orb-hero-logo{width:70px;height:70px}
  .tv-brand .org,.tv-brand .dept{font-size:12px}
  .tv-title h1{font-size:20px;white-space:normal}
  .tv-sub,.tv-sub .chip{font-size:11px}
  .tv-right .cd-t{font-size:28px}.tv-right .cd small,.tv-right .cd-sub{font-size:10px}
  .tv-tools{flex-direction:row}.tv-btn{width:36px;height:36px;font-size:16px}
  .tv-main{padding:14px 12px}
  .tv-podium{grid-template-columns:1fr;gap:10px}
  .tv-podium .p1{order:-1}
  .tv-pod .av.xl,.tv-pod.p1 .av.xl{width:56px;height:56px;font-size:24px}
  .tv-pod .rk-lb,.tv-pod.p1 .rk-lb{font-size:14px}
  .tv-pod .nm,.tv-pod.p1 .nm{font-size:17px}
  .tv-pod .pts b{font-size:34px}.tv-pod.p1 .pts b{font-size:42px}
  .tv-pod .pts small,.tv-pod .meta{font-size:11px}
  .tv-cup{width:46px;height:48px}
  .tv-list-h{font-size:14px}.tv-list-h #pageInfo{font-size:11px}
  .tv-rows{display:flex;flex-direction:column;gap:8px}
  .tv-row{grid-template-columns:28px 32px minmax(0,1fr) 44px;height:46px;padding:0 10px;gap:8px}
  .tv-row .bar{display:none}
  .tv-row .rk{font-size:15px}.tv-row .av.md{width:30px;height:30px;font-size:13px}
  .tv-row .nm{font-size:14px}.tv-row .sc{font-size:18px}
  .tv-row.empty{display:none}
  .tv-ticker{position:sticky;bottom:0}
  .tk-lb{display:none}.tk-item{font-size:12px}.tk-time{font-size:13px}
}

/* sửa: không cho dải tin chạy kéo giãn trang */
body.tv{grid-template-columns:minmax(0,1fr)}
.tv-head,.tv-main,.tv-ticker{min-width:0}
.tv-head{grid-template-columns:auto minmax(0,1fr) auto}
/* cúp đặt bên phải ảnh đại diện, không đè nhãn HẠNG 1 */
.tv-pod.p1 .tv-cup{top:auto;bottom:auto;right:auto;position:absolute;left:calc(50% + 7vh);top:6.5vh}
@media (max-width:900px),(max-height:520px){.tv-pod.p1 .tv-cup{left:calc(50% + 36px);top:34px}}
body.tv #sndToggle{bottom:6.4vh;left:1vw}
@media (max-width:900px),(max-height:520px){body.tv #sndToggle{bottom:56px}}
@media (max-width:900px),(max-height:520px){
  .tv-head{grid-template-columns:minmax(0,1fr)}
  .tv-title h1{font-size:20px}
  .tv-right{justify-content:center}
}
@media (max-width:900px),(max-height:520px){.tv-pod.p1 .tv-cup{top:62px;left:calc(50% + 40px)}}
.tk-dev{flex:none;display:flex;align-items:center;gap:.5vw;padding-left:1.2vw;border-left:1px solid rgba(143,230,255,.4)}
.tk-dev .f-lb{font-size:1.2vh}
.tk-dev .f-nm{font-size:1.9vh}
@media (max-width:900px),(max-height:520px){.tk-dev .f-lb{display:none}.tk-dev .f-nm{font-size:13px}}
.tk-song{flex:none;font-size:1.5vh;color:#ffe9a8;padding:0 1vw;border-left:1px solid rgba(143,230,255,.4);animation:pulse 2s infinite}
@media (max-width:900px),(max-height:520px){.tk-song{display:none}}

/* ===== Băng trạng thái cuộc thi ===== */
.tv-main{position:relative}
.tv-main > .tv-state{position:absolute;left:50%;top:1.2vh;transform:translateX(-50%);z-index:5;padding:.9vh 2.6vw;border-radius:999px;font-weight:800;font-size:clamp(14px,1.6vw,30px);letter-spacing:.12em;white-space:nowrap;color:#fff;
  text-shadow:0 2px 0 rgba(0,0,0,.45),0 0 18px currentColor;box-shadow:0 10px 30px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.35);animation:stPulse 2.2s ease-in-out infinite}
.tv-state.wait{background:linear-gradient(180deg,#1f6fff,#0b3a9e);border:2px solid #7fb2ff}
.tv-state.pause{background:linear-gradient(180deg,#e08a00,#8a4c00);border:2px solid #ffc864}
.tv-state.over{background:linear-gradient(180deg,#e0b43a,#8a6200);border:2px solid #ffe38a;color:#fffbe6}
@keyframes stPulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.045)}}

/* ===== Đếm ngược khổng lồ 10 giây cuối ===== */
body.tv > .tv-big{position:fixed;inset:0;z-index:60;display:grid;place-items:center;pointer-events:none;background:radial-gradient(circle at center,rgba(0,20,60,.55),rgba(0,0,0,.25) 60%,transparent 80%)}
.tv-big b{font-size:34vh;line-height:1;font-weight:800;color:#fff;
  text-shadow:0 .02em 0 #9cc4ff,0 .04em 0 #5a8fe0,0 .06em 0 #2c5bb0,0 .08em 0 #173a7a,0 .12em .1em rgba(0,0,0,.6),0 0 .3em #2f7bff;animation:bigPop 1s ease-out both}
.tv-big.hot b{color:#ffe9e9;text-shadow:0 .02em 0 #ffb0b0,0 .04em 0 #e06060,0 .06em 0 #b02c2c,0 .08em 0 #7a1717,0 .12em .1em rgba(0,0,0,.6),0 0 .35em #ff3030}
.tv-big.end b{font-size:18vh;color:#fff6d0;text-shadow:0 .03em 0 #f0c040,0 .06em 0 #b08000,0 .09em 0 #6a4a00,0 .14em .1em rgba(0,0,0,.6),0 0 .35em #ffc400;animation:bigEnd 3.4s ease-out both}
@keyframes bigPop{0%{transform:scale(1.8);opacity:0}25%{transform:scale(1);opacity:1}80%{opacity:1}100%{transform:scale(.85);opacity:.15}}
@keyframes bigEnd{0%{transform:scale(2.2);opacity:0}15%{transform:scale(1);opacity:1}85%{opacity:1}100%{opacity:0}}

/* ===== Gợi ý bật âm thanh ===== */
body.tv > .tv-unlock{position:fixed;left:50%;bottom:7vh;transform:translateX(-50%);z-index:50;padding:10px 22px;border-radius:999px;background:rgba(6,24,60,.92);border:1px solid #3d7dff;color:#dfeaff;font-weight:700;font-size:clamp(12px,1vw,18px);box-shadow:0 0 24px rgba(47,123,255,.5);animation:unl 1.6s ease-in-out infinite;transition:opacity .5s}
.tv-unlock.gone{opacity:0;pointer-events:none}
@keyframes unl{50%{box-shadow:0 0 6px rgba(47,123,255,.2)}}
.tv-big[hidden],.tv-state[hidden]{display:none!important}
.tv-unlock.gone{opacity:0;pointer-events:none}
.tv-main.has-state{padding-top:7.2vh}
.tv-main > .tv-state{top:1vh}
body.tv > .tv-unlock{left:auto;right:1vw;bottom:6.6vh;transform:none;max-width:9.5vw;border-radius:14px;text-align:center;line-height:1.35;white-space:normal}
@media (max-width:900px),(max-height:520px){body.tv > .tv-unlock{max-width:none;left:12px;right:12px;bottom:64px}}

/* ===== Hàng đầu: bảng "giải đúng nhiều nhất" | bục Top 3 | bảng "trả lời nhanh nhất" ===== */
.tv-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.3fr) minmax(0,1fr);gap:1.4vw;align-items:stretch;width:100%}
.tv-top .tv-podium{max-width:none}
.tv-side{display:flex;flex-direction:column;min-width:0;padding:1.4vh 1vw;border-radius:2vh;background:var(--panel);border:1px solid var(--line2);box-shadow:inset 0 0 3vh rgba(47,123,255,.08)}
.tv-side .sd-h{font-weight:800;font-size:1.8vh;letter-spacing:.15vh;margin-bottom:1vh;padding-bottom:.8vh;border-bottom:1px solid var(--line)}
.sd-ok .sd-h{color:#2ee59d;text-shadow:0 0 1vh rgba(46,229,157,.5)}
.sd-fast .sd-h{color:#ffd24a;text-shadow:0 0 1vh rgba(255,210,74,.5)}
.tv-side .sd-b{flex:1;display:grid;grid-template-rows:repeat(5,1fr);gap:.7vh;min-height:0}
.sd-it{display:grid;grid-template-columns:2.6vh 3.6vh minmax(0,1fr) auto;align-items:center;gap:.7vw;padding:0 .8vw;border-radius:1vh;background:rgba(1,12,40,.55);border:1px solid var(--line);min-height:0}
.sd-it:first-child{border-color:rgba(255,210,74,.55);background:linear-gradient(90deg,rgba(255,210,74,.14),rgba(1,12,40,.55))}
.sd-n{font-weight:800;font-size:1.8vh;color:#9fb6d9;text-align:center}
.sd-it .av.sm{width:3.4vh;height:3.4vh;font-size:1.5vh}
.sd-nm{position:relative;font-size:1.75vh;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-bottom:.5vh}
.sd-nm small{display:block;font-size:1.3vh;font-weight:400;color:#9fc4ee;overflow:hidden;text-overflow:ellipsis}
.sd-nm i{position:absolute;left:0;bottom:0;height:.45vh;border-radius:.3vh;background:linear-gradient(90deg,#1f8f6a,#2ee59d);box-shadow:0 0 .8vh rgba(46,229,157,.6);transition:width .8s}
.sd-it > b{font-size:2.4vh;font-weight:800;color:#2ee59d;white-space:nowrap}
.sd-it > b small{font-size:1.2vh;color:#8fb3a3;font-weight:400}
.sd-it > b.sd-t{font-size:1.9vh;color:#ffd24a}
.sd-empty{grid-row:1/-1;display:grid;place-items:center;text-align:center;color:var(--mut);font-size:1.6vh;opacity:.7}
/* số câu đúng / giải đầu tiên trên từng hàng xếp hạng */
.tv-row{grid-template-columns:5vh 5vh minmax(0,1.2fr) auto minmax(0,.8fr) 7vh}
.tv-row .stc{display:flex;gap:.6vw;white-space:nowrap}
.tv-row .stc b{font-size:1.7vh;padding:.3vh .6vw;border-radius:1vh;font-weight:700}
.tv-row .stc .c-ok{color:#2ee59d;background:rgba(46,229,157,.1);border:1px solid rgba(46,229,157,.35)}
.tv-row .stc .c-f{color:#ffd24a;background:rgba(255,210,74,.1);border:1px solid rgba(255,210,74,.4)}
.tv-row.empty .stc{display:none}
@media (max-width:1100px){.tv-top{grid-template-columns:minmax(0,1fr)}.tv-side{display:none}}
/* nút nhạc/âm thanh tự ẩn khi không di chuột; ô nhắc bật âm thanh nằm ngang giữa, gọn */
body.tv #musicToggle,body.tv #sndToggle{transition:opacity .5s}
body.tv.tv-idle #musicToggle,body.tv.tv-idle #sndToggle{opacity:0;pointer-events:none}
body.tv > .tv-unlock{left:50%;right:auto;transform:translateX(-50%);bottom:8vh;max-width:none;white-space:nowrap;border-radius:999px;padding:1vh 2vw;font-size:1.8vh}
@media (max-width:900px),(max-height:520px){body.tv > .tv-unlock{white-space:normal;width:calc(100% - 24px);text-align:center;font-size:13px}}

/* ===== Giải đúng sớm nhất ===== */
.sd-it .sd-q{font-weight:800;font-size:1.6vh;color:#061430;background:linear-gradient(180deg,#ffe38a,#e0a81f);border-radius:.8vh;text-align:center;padding:.3vh 0;box-shadow:0 0 1vh rgba(255,210,74,.45)}
.sd-fast .sd-it{grid-template-columns:3.4vh 3.6vh minmax(0,1fr) auto}
.sd-fast .sd-it:first-child{border-color:#ffd24a;box-shadow:0 0 1.6vh rgba(255,210,74,.35)}
.sd-it.new{animation:sdNew 2.4s ease-out}
@keyframes sdNew{0%{transform:translateX(3vw);opacity:0;box-shadow:0 0 0 .4vh #ffd24a,0 0 4vh #ffd24a}25%{transform:none;opacity:1}100%{}}
body.tv > .first-banner{position:fixed;left:50%;top:15vh;z-index:55;transform:translate(-50%,-3vh) scale(.9);opacity:0;pointer-events:none;
  padding:1.4vh 3vw;border-radius:999px;font-size:2.6vh;font-weight:800;color:#fff8dc;white-space:nowrap;
  background:linear-gradient(180deg,#e0a81f,#8a5a00);border:2px solid #ffe38a;box-shadow:0 0 5vh rgba(255,210,74,.6),0 1vh 3vh rgba(0,0,0,.5);
  text-shadow:0 .2vh 0 rgba(0,0,0,.4);transition:opacity .4s,transform .4s}
body.tv > .first-banner b{color:#fff;text-shadow:0 0 1.2vh #fff3b0}
body.tv > .first-banner small{font-weight:600;font-size:1.8vh;opacity:.9}
body.tv > .first-banner.on{opacity:1;transform:translate(-50%,0) scale(1);animation:fbPulse 1.2s ease-in-out 3}
@keyframes fbPulse{50%{box-shadow:0 0 9vh rgba(255,210,74,.95),0 1vh 3vh rgba(0,0,0,.5)}}
@media (max-width:900px),(max-height:520px){body.tv > .first-banner{font-size:15px;white-space:normal;width:calc(100% - 24px);text-align:center;top:90px}}

/* 2 bảng phụ đưa xuống hàng dưới, hai bên bảng xếp hạng (bục Top 3 giữ nguyên hàng trên) */
.tv-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.9fr) minmax(0,1fr);gap:1.2vw;min-height:0;width:100%}
.tv-bottom .tv-list{max-width:none;margin:0}
.tv-bottom .tv-side{min-height:0}
.tv-bottom .tv-rows{column-gap:1.6vw}
.tv-bottom .tv-row{grid-template-columns:4.4vh 4.6vh minmax(0,1.3fr) auto minmax(0,.6fr) 6vh;gap:1vh}
@media (max-width:1100px){.tv-bottom{grid-template-columns:minmax(0,1fr)}.tv-bottom .tv-side{display:none}}
.tv-bottom{grid-template-columns:minmax(0,1.2fr) minmax(0,2.6fr) minmax(0,1.2fr)}
.tv-bottom .tv-row{grid-template-columns:4.2vh 4.4vh minmax(0,1fr) auto 6.4vh}
.tv-bottom .tv-row .bar{display:none}
.tv-bottom .tv-row .nm{font-size:2vh}
.tv-bottom .tv-row .stc{gap:.4vw}
.tv-bottom .tv-row .stc b{font-size:1.55vh;padding:.25vh .45vw}
.tv-bottom .sd-it{gap:.5vw;padding:0 .6vw}
.tv-bottom .sd-nm{font-size:1.7vh}
.tv-bottom{grid-template-columns:minmax(0,1fr) minmax(0,3fr) minmax(0,1fr);gap:1vw}
.tv-bottom .tv-list{padding:1.4vh 1.2vw}
.tv-bottom .tv-row{grid-template-columns:3.6vh 4.2vh minmax(0,1fr) auto 6vh;gap:.8vh;padding:0 1vh}
.tv-bottom .tv-row .av.md{width:3.8vh;height:3.8vh;font-size:1.7vh}
.tv-bottom .tv-row .stc .c-f{display:none}
.tv-bottom .tv-row .nm{font-size:1.9vh}
.tv-bottom .tv-row .sc{font-size:2.5vh}
/* nút Nhạc / Âm thanh nằm gọn trong thanh đáy */
.tk-ctl{flex:none;display:flex;gap:.5vw;padding-left:1vw;border-left:1px solid rgba(143,230,255,.4)}
body.tv .tk-ctl #musicToggle,body.tv .tk-ctl #sndToggle{position:static;inset:auto;margin:0;opacity:1!important;pointer-events:auto!important;
  font-size:1.35vh;padding:.35vh .7vw;border-radius:.8vh;white-space:nowrap;box-shadow:none}
@media (max-width:900px),(max-height:520px){body.tv .tk-ctl #musicToggle,body.tv .tk-ctl #sndToggle{font-size:11px;padding:3px 6px}}
/* chỉ hiện biểu tượng 🎵 / 🔊 (chữ bị cắt), gạch chéo khi tắt */
body.tv .tk-ctl #musicToggle,body.tv .tk-ctl #sndToggle{width:3.6vh;height:3vh;padding:0;overflow:hidden;text-indent:0;font-size:1.6vh;line-height:3vh;text-align:left;padding-left:.8vh;position:relative}
body.tv .tk-ctl .off::after{content:"";position:absolute;left:.5vh;right:.5vh;top:50%;height:2px;background:#ff5a5a;transform:rotate(-35deg)}
.tv-bottom{grid-template-columns:minmax(0,1.1fr) minmax(0,3fr) minmax(0,1.1fr)}
.sd-fast .sd-it > b.sd-t{font-size:1.7vh}
.tk-song{max-width:19vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-ticker .tk-view{min-width:30vw}
/* ô nhắc bật âm thanh: đặt vào khoảng trống bên trái bục Top 3 */
body.tv > .tv-unlock{left:3vw;right:auto;top:24vh;bottom:auto;transform:none;width:17vw;white-space:normal;text-align:center;border-radius:2vh;padding:1.6vh 1vw;font-size:1.9vh;line-height:1.5}
@media (max-width:900px),(max-height:520px){body.tv > .tv-unlock{left:12px;right:12px;top:auto;bottom:64px;width:auto;font-size:13px}}
.sd-fast .sd-it{grid-template-columns:3.6vh 3.6vh minmax(0,1fr)}
.sd-fast .sd-nm{font-size:1.85vh}
.sd-fast .sd-nm small{color:#ffe08a;font-size:1.35vh}
.sd-fast .sd-nm small{color:#cfe0f7;font-size:1.4vh}
.sd-fast .sd-nm small b{color:#ffd24a;font-weight:800}

/* ==========================================================
   BỐ CỤC CHUẨN LƯỚI (màn ≥ 1101px): 3 cột thẳng hàng trên – dưới
   [Hạng 2 | Hạng 1 (băng ngang) | Hạng 3]
   [Giải đúng nhiều nhất | Xếp hạng các đội | Giải đúng đầu tiên]
   ========================================================== */
@media (min-width:1101px){
  .tv-main{--cols:minmax(0,1.1fr) minmax(0,3fr) minmax(0,1.1fr);--gap:1.2vw;gap:1.8vh}
  .tv-main .tv-podium{grid-template-columns:var(--cols);gap:var(--gap);max-width:none;width:100%;align-items:stretch;height:27vh}
  .tv-bottom{grid-template-columns:var(--cols);gap:var(--gap)}
  .tv-main .tv-pod{justify-content:center;padding:1.6vh 1vw;gap:.5vh;border-radius:2vh}
  .tv-main .tv-pod .av.xl{width:7.5vh;height:7.5vh;font-size:3.4vh}
  .tv-main .tv-pod .nm{font-size:2.3vh}
  .tv-main .tv-pod .pts b{font-size:5vh}
  .tv-main .tv-pod .meta{font-size:1.3vh}
  /* Hạng 1: băng vinh danh nằm ngang */
  .tv-main .tv-pod.p1{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-rows:auto auto auto;
    grid-template-areas:"cup av lb pts" "cup av nm pts" "cup av meta pts";align-items:center;column-gap:2vw;row-gap:.6vh;
    text-align:left;padding:1.8vh 3vw;
    background:radial-gradient(120% 140% at 50% 0%,rgba(255,210,74,.22),transparent 60%),linear-gradient(180deg,rgba(255,210,74,.10),var(--panel) 80%)}
  .tv-main .tv-pod.p1 .rk-lb{grid-area:lb;align-self:end;font-size:2.4vh;letter-spacing:.5vh}
  .tv-main .tv-pod.p1 .tv-cup{grid-area:cup;position:relative;left:auto;top:auto;right:auto;bottom:auto;width:14vh;height:15vh}
  .tv-main .tv-pod.p1 .avw,.tv-main .tv-pod.p1 > .av{grid-area:av}
  .tv-main .tv-pod.p1 .av.xl{width:12vh;height:12vh;font-size:5.4vh}
  .tv-main .tv-pod.p1 .nm{grid-area:nm;font-size:4.2vh;max-width:100%}
  .tv-main .tv-pod.p1 .meta{grid-area:meta;align-self:start;font-size:1.5vh}
  .tv-main .tv-pod.p1 .pts{grid-area:pts;text-align:center;padding-left:2vw;border-left:1px solid rgba(255,210,74,.35)}
  .tv-main .tv-pod.p1 .pts b{font-size:10vh}
  .tv-main .tv-pod.p1 .pts small{font-size:1.6vh;letter-spacing:.4vh}
  /* chờ đội: rõ ràng, có khung nét đứt thay vì mờ cả thẻ */
  .tv-main .tv-pod.empty{opacity:1;border-style:dashed;background:rgba(3,16,44,.55);box-shadow:none}
  .tv-main .tv-pod.empty .av{background:rgba(143,230,255,.08);border:2px dashed rgba(143,230,255,.35);color:#8fb3d9}
  .tv-main .tv-pod.empty .nm{color:#8fa6c8;font-weight:600}
  .tv-main .tv-pod.empty .pts{color:#4d6a92;font-size:3vh}
  .tv-main .tv-pod.p1.empty .rk-lb{color:#ffd24a}
  .tv-main .tv-pod.p1.empty::before{content:"";grid-area:cup;width:14vh;height:15vh;background:url(img/cup.webp) center/contain no-repeat;opacity:.35;filter:grayscale(.3)}
  /* 3 thẻ cùng chiều cao với hàng dưới: căn đều */
  .tv-bottom .tv-side,.tv-bottom .tv-list{border-radius:2vh}
}
/* bảng phụ khi chưa có dữ liệu: biểu tượng lớn mờ + chữ */
.sd-empty{gap:1vh;align-content:center}
.sd-ok .sd-empty::before{content:"✅";font-size:5vh;opacity:.25;filter:grayscale(.4)}
.sd-fast .sd-empty::before{content:"🥇";font-size:5vh;opacity:.3;filter:grayscale(.3)}
/* ô nhắc bật âm thanh: viên nhỏ nằm trên mép dưới thanh tiêu đề, giữa màn hình */
body.tv > .tv-unlock{left:50%;right:auto;top:calc(15.6vh - 2.2vh);bottom:auto;transform:translateX(-50%);width:auto;white-space:nowrap;
  border-radius:999px;padding:.8vh 1.6vw;font-size:1.6vh;line-height:1.3;z-index:40}
@media (max-width:900px),(max-height:520px){body.tv > .tv-unlock{left:12px;right:12px;top:auto;bottom:64px;transform:none;white-space:normal;text-align:center;font-size:13px}}
@media (min-width:1101px){
  body.tv .tv-main #podium{grid-template-columns:var(--cols);gap:var(--gap);max-width:none;width:100%;margin:0;align-items:stretch;height:27vh}
}
@media (min-width:1101px){.sd-fast .sd-it{grid-template-columns:3.4vh 3.4vh minmax(0,1fr);gap:.45vw}.sd-fast .sd-it .av.sm{width:3.2vh;height:3.2vh}.sd-fast .sd-nm small{font-size:1.32vh}}
@media (min-width:1101px){.tv-main.has-state{padding-top:8.2vh}}

/* Bục vinh quang NHỎ GỌN: 3 thẻ đứng, hẹp, đặt giữa (theo yêu cầu) */
@media (min-width:1101px){
  body.tv .tv-main #podium{grid-template-columns:1fr 1.15fr 1fr;gap:1.2vw;max-width:46vw;margin:0 auto;height:27vh;align-items:end}
  .tv-main .tv-pod,.tv-main .tv-pod.p1{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    gap:.35vh;padding:1.2vh .8vw;height:88%}
  .tv-main .tv-pod.p1{height:100%;padding-top:1.4vh;background:linear-gradient(180deg,rgba(255,210,74,.16),var(--panel) 75%)}
  .tv-main .tv-pod .rk-lb,.tv-main .tv-pod.p1 .rk-lb{font-size:1.6vh;letter-spacing:.25vh;align-self:center}
  .tv-main .tv-pod .av.xl{width:6vh;height:6vh;font-size:2.8vh}
  .tv-main .tv-pod.p1 .av.xl{width:7.5vh;height:7.5vh;font-size:3.4vh}
  .tv-main .tv-pod .nm{font-size:1.9vh}
  .tv-main .tv-pod.p1 .nm{font-size:2.3vh}
  .tv-main .tv-pod .pts,.tv-main .tv-pod.p1 .pts{padding:0;border:0;text-align:center}
  .tv-main .tv-pod .pts b{font-size:3.8vh}
  .tv-main .tv-pod.p1 .pts b{font-size:5vh}
  .tv-main .tv-pod .pts small,.tv-main .tv-pod.p1 .pts small{font-size:1.1vh;letter-spacing:0}
  .tv-main .tv-pod .meta,.tv-main .tv-pod.p1 .meta{font-size:1.1vh;align-self:center}
  .tv-main .tv-pod.p1 .tv-cup{position:absolute;left:calc(50% + 4.6vh);top:3.4vh;width:5vh;height:5.4vh}
  .tv-main .tv-pod.p1.empty::before{display:none}
}
@media (min-width:1101px){.tv-main .tv-pod.p1 .tv-cup{top:auto;bottom:auto;left:calc(50% + 5vh);top:4.8vh}}
/* bục bậc thang: Hạng 1 cao nhất, Hạng 2 thấp hơn, Hạng 3 thấp nhất — cùng đường đáy */
@media (min-width:1101px){
  body.tv .tv-main #podium{align-items:end}
  .tv-main .tv-pod.p1{height:100%}
  .tv-main .tv-pod.p2{height:80%}
  .tv-main .tv-pod.p3{height:72%}
  .tv-main .tv-pod.p2,.tv-main .tv-pod.p3{gap:.2vh;padding:1vh .7vw}
  .tv-main .tv-pod.p2 .av.xl,.tv-main .tv-pod.p3 .av.xl{width:5vh;height:5vh;font-size:2.3vh}
  .tv-main .tv-pod.p2 .pts b,.tv-main .tv-pod.p3 .pts b{font-size:3.3vh}
  .tv-main .tv-pod.p3 .meta{display:none}
}

[hidden]{display:none!important}

/* ===== Màn hình trình chiếu: ĐÓNG BĂNG ===== */
body.tv.tv-frozen #podium,body.tv.tv-frozen .tv-bottom{display:none!important}
.tv-freeze{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1.4vh;
  grid-row:1 / span 2;min-height:0;border-radius:2.4vh;padding:4vh 4vw;overflow:hidden;
  background:radial-gradient(ellipse at 50% 35%,rgba(160,235,255,.28),rgba(20,80,160,.22) 45%,rgba(4,16,44,.85) 80%);
  border:2px solid rgba(160,235,255,.55);box-shadow:0 0 6vh rgba(120,220,255,.35),inset 0 0 8vh rgba(160,235,255,.18)}
.fz-ice{position:absolute;inset:0;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(115deg,transparent 0 3vh,rgba(255,255,255,.06) 3vh 3.3vh),repeating-linear-gradient(35deg,transparent 0 5vh,rgba(255,255,255,.05) 5vh 5.3vh)}
.fz-ic{font-size:14vh;line-height:1;filter:drop-shadow(0 0 3vh rgba(160,235,255,1));animation:frzPulse 2.6s ease-in-out infinite}
.fz-t{margin:0;font-size:6vh;font-weight:800;letter-spacing:.6vh;color:#f2fcff;
  text-shadow:0 .4vh 0 #7cc9ee,0 .8vh 0 #3a8fc4,0 1.2vh 0 #1d5a8c,0 2vh 2vh rgba(0,0,0,.5),0 0 4vh rgba(160,235,255,.9)}
.fz-s{margin:0;font-size:2.4vh;color:#cdeeff}
.fz-teams{display:flex;flex-wrap:wrap;justify-content:center;gap:1vh 1.2vw;margin-top:2vh;max-width:80vw}
.fz-tm{display:inline-flex;align-items:center;gap:.6vw;padding:.8vh 1.2vw;border-radius:999px;font-size:1.9vh;font-weight:700;color:#fff;
  background:rgba(4,20,56,.7);border:1px solid rgba(160,235,255,.35)}
.fz-tm .av.sm{width:3vh;height:3vh;font-size:1.4vh}
.fz-chip{color:#bfefff;border-color:rgba(160,235,255,.6)!important;animation:frzPulse 2.4s ease-in-out infinite}
@keyframes frzPulse{50%{transform:scale(1.06)}}