/* Layar besar Kapten Court: dipakai aplikasi (host) dan tautan publik dengan tampilan yang sama. */
.tv{position:fixed;inset:0;z-index:300;background:#041a14;color:#fff;overflow:auto;font-size:clamp(14px,1.6vw,30px);padding:0;display:block}
.tv-bg{position:fixed;inset:0;background:radial-gradient(60% 60% at 15% 10%,rgba(31,180,138,.55),transparent 60%),radial-gradient(50% 50% at 90% 85%,rgba(214,242,58,.22),transparent 60%),radial-gradient(70% 70% at 70% 0%,rgba(37,99,235,.28),transparent 60%),#041a14;animation:tvdrift 24s ease-in-out infinite alternate;z-index:0}
@keyframes tvdrift{to{transform:scale(1.08) translate(-1.5%,1%)}}
@media (prefers-reduced-motion:reduce){.tv-bg{animation:none}}
.tv-wrap{position:relative;z-index:1;min-height:100%;padding:2vw 2.6vw;display:flex;flex-direction:column;gap:1.5vw}
.tv h1{margin:0;font-family:var(--font-display,'Unbounded','Trebuchet MS',system-ui,sans-serif);font-size:2.2em;line-height:1.05;letter-spacing:-.01em}
.tv h2{margin:0;font-size:1em;letter-spacing:.14em;color:var(--ball,#d6f23a);text-transform:uppercase;font-weight:800}
.tv-head{display:flex;align-items:center;gap:1.6vw;flex-wrap:wrap}
.tv-title{flex:1;min-width:14em}
.tv-eb{font-weight:700;color:var(--ball,#d6f23a);font-size:.8em;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.3em}
.tv-modes{display:flex;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:99px;padding:.25em;backdrop-filter:blur(10px)}
.tv-modes button{border:0;background:transparent;color:rgba(255,255,255,.75);font:inherit;font-size:.72em;font-weight:700;padding:.55em 1.1em;border-radius:99px;cursor:pointer}
.tv-modes button[aria-pressed=true]{background:var(--ball,#d6f23a);color:#172100}
.tv-clock{font-size:1.9em;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.tv-qr{width:5.6em;text-align:center;background:#fff;color:#0b1c17;border-radius:.9em;padding:.4em}
.tv-qr svg{width:100%;height:auto;display:block}.tv-qr small{display:block;font-size:.5em;font-weight:800}
.tv-x{width:2.2em;height:2.2em;border-radius:99px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font-size:1.3em;cursor:pointer;backdrop-filter:blur(10px)}
.tv-sec{display:flex;align-items:center;justify-content:space-between;gap:1em;margin-bottom:.8em}
.tv-prog{font-size:.75em;font-weight:700;color:rgba(255,255,255,.8);display:grid;gap:.35em;min-width:11em}
.tv-prog i{display:block;height:.45em;border-radius:99px;background:rgba(255,255,255,.15);position:relative;overflow:hidden}
.tv-prog i::after{content:'';position:absolute;inset:0;width:var(--p);background:var(--ball,#d6f23a);border-radius:99px;transition:width .6s}
.tv-stage{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:2.2vw;align-items:start;flex:1}
@media (max-width:900px){.tv-stage{grid-template-columns:1fr}}
.tv-courts{display:grid;gap:1vw;grid-template-columns:1fr}
.tv-courts.n2,.tv-courts.n3,.tv-courts.n4,.tv-courts.n5,.tv-courts.n6{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:900px){.tv-courts.n2,.tv-courts.n3,.tv-courts.n4,.tv-courts.n5,.tv-courts.n6{grid-template-columns:1fr}}
.tv-court{background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.16);border-radius:1.3em;padding:.9em 1.1em 1em;backdrop-filter:blur(14px);box-shadow:0 1.2em 3em rgba(0,0,0,.28)}
.tv-court.done{opacity:.82}
.tv-cn{display:flex;align-items:center;gap:.6em;font-size:.72em;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ball,#d6f23a);margin-bottom:.7em}
.tv-cn i{width:.7em;height:.7em;border-radius:99px;background:#ff4d4d;box-shadow:0 0 0 0 rgba(255,77,77,.7);animation:tvpulse 1.6s infinite}
.tv-court.done .tv-cn i{background:#7ae8c4;animation:none}
.tv-cn em{margin-left:auto;font-style:normal;color:rgba(255,255,255,.7);font-size:.85em}
@keyframes tvpulse{70%{box-shadow:0 0 0 .7em rgba(255,77,77,0)}100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}}
@media (prefers-reduced-motion:reduce){.tv-cn i{animation:none}}
.tv-team{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:.45em .2em}
.tv-team+.tv-team{border-top:1px solid rgba(255,255,255,.12)}
.tv-team .n{font-size:1.15em;font-weight:700;line-height:1.25;min-width:0;overflow-wrap:anywhere}
.tv-team .s{font-size:2.6em;font-weight:800;font-variant-numeric:tabular-nums;min-width:1.5em;text-align:center;line-height:1;background:rgba(255,255,255,.1);border-radius:.4em;padding:.1em .22em}
.tv-team.win .n{color:var(--ball,#d6f23a)}.tv-team.win .s{background:var(--ball,#d6f23a);color:#172100}
.tv-court.bye{display:flex;flex-direction:column;opacity:.75}.tv-note{font-size:.8em;color:var(--ball,#d6f23a);font-weight:700}
.tv-empty{grid-column:1/-1;text-align:center;padding:4em 0;opacity:.8;display:grid;gap:.4em;font-size:1.1em}.tv-empty span{font-size:2.4em}
.tv-side,.tv-stand{display:block}
.tv-r{display:grid;grid-template-columns:2em minmax(0,1.1fr) minmax(0,1fr) auto;gap:.8em;align-items:center;padding:.5em .9em;margin-bottom:.4em;border-radius:.9em;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08)}
.tv-r .n{font-weight:800;color:var(--ball,#d6f23a)}.tv-r .nm{font-weight:700;font-size:1.05em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-r .bar{height:.5em;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}.tv-r .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent-2,#1fb48a),var(--ball,#d6f23a));border-radius:99px;transition:width .6s}
.tv-r b{font-size:1.25em;font-variant-numeric:tabular-nums}.tv-r.dim{opacity:.5}
.tv-podium{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4vw;align-items:end;margin:.4em 0 1.4vw}
.tv-pod{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.18);border-radius:1.5em;padding:1em .8em 1.1em;text-align:center;display:grid;gap:.25em;backdrop-filter:blur(14px)}
.tv-pod .md{font-size:2.6em;line-height:1}.tv-pod .pn{font-size:1.25em;overflow-wrap:anywhere}.tv-pod .pp{font-size:2.4em;font-weight:800;color:var(--ball,#d6f23a);font-variant-numeric:tabular-nums;line-height:1.1}.tv-pod .pp small{font-size:.35em;margin-left:.3em;color:rgba(255,255,255,.7)}
.tv-pod.p1{padding-top:2em;padding-bottom:1.6em;border-color:var(--ball,#d6f23a);box-shadow:0 0 3em rgba(214,242,58,.28)}
.tv-pod.p1 .pp{font-size:3.2em}
.tv-rest{display:grid;grid-template-columns:1fr 1fr;gap:0 2.2vw}.tv-rest .full{grid-column:1/-1}
@media (max-width:900px){.tv-rest{grid-template-columns:1fr}}
.tv-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(18em,1fr));gap:1.6vw}.tv-g h3{margin:0 0 .5em;color:var(--ball,#d6f23a);letter-spacing:.1em;text-transform:uppercase;font-size:.9em}
.tv-bracket{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(17em,1fr);gap:1.4vw;overflow-x:auto;padding-bottom:1em;align-items:center}
.tv-bcol{display:grid;gap:1vw;align-content:center}.tv-bcol h3{margin:0;text-align:center;color:var(--ball,#d6f23a);letter-spacing:.12em;text-transform:uppercase;font-size:.85em}
.tv-bcol .tv-team .s{font-size:1.8em}
.tv-champ{display:flex;align-items:center;gap:1em;font-size:1.3em;background:linear-gradient(135deg,var(--ball,#d6f23a),#f4ffa8);color:#172100;border-radius:1.2em;padding:.6em 1.2em;box-shadow:0 0 3em rgba(214,242,58,.35)}
.tv-champ span{font-size:2.2em}.tv-champ small{display:block;font-weight:800;letter-spacing:.15em;opacity:.7;font-size:.6em}.tv-champ b{font-size:1.5em}
.tv-clubs{display:flex;align-items:center;gap:1.2em;font-weight:800}.tv-clubs div{display:grid;text-align:center}.tv-clubs b{font-size:2em;line-height:1}.tv-clubs small{opacity:.8;font-size:.7em}.tv-clubs span{opacity:.5}


/* logo host + latar logo setengah-blend */
.tv-logo{width:3.6em;height:3.6em;border-radius:.9em;object-fit:cover;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);box-shadow:0 .5em 1.5em rgba(0,0,0,.3);flex:none}
.tv-brand{display:flex;align-items:center;gap:1.1em;flex:1;min-width:14em}
/* blur klasemen */
.tv-lockw{position:relative}
.tv-blur{filter:blur(9px);opacity:.85;user-select:none;pointer-events:none}
.tv-lockmsg{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-weight:800;font-size:1.05em;padding:1em;text-shadow:0 .1em .6em rgba(0,0,0,.7)}
.tv-eye{border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:.72em;font-weight:700;padding:.6em 1.1em;border-radius:99px;cursor:pointer;backdrop-filter:blur(10px)}
.tv-eye.on{background:var(--ball,#d6f23a);color:#172100;border-color:transparent}
body.tv-on{overflow:hidden}

/* latar layar penuh: gambar penuh (cover) + lapisan gelap yang bisa diatur host */
.tv-bg.has-bg{background:#041a14;animation:none}
.tv-bg.has-bg::before{content:'';position:absolute;inset:-5%;background:var(--tvbg) center/cover no-repeat;filter:blur(var(--tvblur,0px))}
.tv-bg.has-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,22,17,var(--tvdim,.7)),rgba(3,22,17,calc(var(--tvdim,.7) + .14)))}

.tv-sw{display:flex;align-items:center;gap:.7em;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:.72em;font-weight:700;padding:.5em .9em;border-radius:99px;cursor:pointer;backdrop-filter:blur(10px)}
.tv-sw i{width:2.6em;height:1.4em;border-radius:99px;background:rgba(255,255,255,.28);position:relative;flex:none;transition:background .15s}
.tv-sw i::after{content:'';position:absolute;top:.15em;left:.15em;width:1.1em;height:1.1em;border-radius:99px;background:#fff;transition:transform .15s}
.tv-sw[aria-checked=true] i{background:var(--ball,#d6f23a)}
.tv-sw[aria-checked=true] i::after{transform:translateX(1.2em);background:#172100}