/* Reżyserka (propozycje/tv-ramka, koncepcja A): telewizor na ekranach bez sali na cały ekran (Odprawa, zasady, mostek przed pytaniem, koniec).
   Z lewej sala w ramce mini TV z telefonu (wTv: .tvp .tvbox, ramka ui/ramka-tv2.webp), z prawej kolumna paneli, na dole 12 kamer kabin (.kkam z pulpitu telefonu).
   Wszystko w jednostkach --u (1vmin na telewizorze), więc 1920x1080 i 1280x720 wyglądają tak samo. */
body.tv .rz{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) calc(64*var(--u));grid-template-rows:minmax(0,1fr) auto;gap:calc(2*var(--u)) calc(2.6*var(--u))}

/* telewizor: największa ramka, jaka się zmieści (proporcje 1320:802), bez rozciągania */
body.tv .rz-tv{min-width:0;min-height:0;container-type:size;display:flex;align-items:center;justify-content:center}
body.tv .rz .tsc-pokoj.tvp{flex:none;width:100%;height:100%;margin:0;display:flex;align-items:center;justify-content:center;background:none;border:0;overflow:visible}
body.tv .rz .tvp .tvbox{width:min(100cqw,calc(100cqh * 1.6459));height:auto;max-width:none;aspect-ratio:1320/802}

/* kolumna paneli: równe odstępy, ta sama szerokość wszystkiego */
body.tv .rz-kol{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;justify-content:safe center;gap:calc(1.6*var(--u))}
body.tv .rz-kol>*{flex:none;margin-left:0;margin-right:0}
body.tv .rz-kol .say{margin-left:calc(5.6*var(--u))}
body.tv .rz-kol .say p{font-size:calc(2.6*var(--u));line-height:1.3}
body.tv .rz-kol .say b{font-size:calc(1.9*var(--u))}
body.tv .rz-lb{font-family:var(--display);font-size:calc(1.9*var(--u));letter-spacing:.08em;color:var(--muted)}
body.tv .rz-lb.y{color:var(--yellow)}

/* kod gry: wyświetlacz z pulpitu telefonu (.kzn) i skaner QR */
body.tv .rz-kod{display:flex;align-items:center;gap:calc(2.4*var(--u));padding:calc(1*var(--u)) calc(1.2*var(--u))!important}
body.tv .rz-kl{flex:1;min-width:0;display:flex;flex-direction:column;gap:calc(1.2*var(--u))}
body.tv .rz-kod .kzn{gap:calc(1*var(--u));margin:0}
body.tv .rz-kod .kzn span{flex:none;width:calc(7.4*var(--u));height:calc(9.2*var(--u));font-size:calc(6.4*var(--u));box-shadow:inset 0 0 0 calc(.3*var(--u)) #2a2410}
body.tv .rz-kod .kzn span::after{border-top-width:calc(.2*var(--u))}
body.tv .rz-sub{font-size:calc(1.7*var(--u));line-height:1.3;color:var(--muted)}
body.tv .rz-kod .qr.qsk{width:calc(18.5*var(--u));height:calc(18.5*var(--u));flex:none;border-width:calc(.4*var(--u))}

/* moduły ustawień (ikony z pulpitu telefonu), tylko do oglądania */
body.tv .rz-mods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(1.2*var(--u))}
body.tv .rz-mod{min-width:0;display:flex;flex-direction:column;align-items:center;gap:calc(.5*var(--u));padding:calc(1*var(--u)) calc(.5*var(--u)) calc(1.3*var(--u));background:#141a36;box-shadow:inset 0 0 0 calc(.3*var(--u)) #232c55,inset 0 calc(-.6*var(--u)) 0 #0d1229;text-align:center}
body.tv .rz-mod .t{font-family:var(--display);font-size:calc(1.5*var(--u));letter-spacing:.08em;color:var(--muted)}
body.tv .rz-mod img{height:calc(5.2*var(--u));width:auto;max-width:100%;object-fit:contain;image-rendering:pixelated}
body.tv .rz-mod b{font-family:var(--display);font-weight:400;font-size:calc(1.8*var(--u));letter-spacing:.04em;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
body.tv .rz-mod.on b{color:var(--mint)}
body.tv .rz-mod.y b{color:var(--yellow)}

/* taśma startu: start daje gospodarz na telefonie */
body.tv .rz-haz{padding:calc(.9*var(--u));background:repeating-linear-gradient(-45deg,#ffd23f 0 calc(1.7*var(--u)),#14110a calc(1.7*var(--u)) calc(3.4*var(--u)))}
body.tv .rz-haz span{display:block;text-align:center;font-family:var(--display);font-size:calc(2.5*var(--u));letter-spacing:.08em;color:#2a1c00;background:var(--yellow);padding:calc(1.3*var(--u)) calc(1*var(--u)) calc(1*var(--u));box-shadow:inset calc(-.4*var(--u)) calc(-.4*var(--u)) 0 rgba(0,0,0,.2),inset calc(.4*var(--u)) calc(.4*var(--u)) 0 rgba(255,255,255,.4)}

/* zasady: karta zasad w kolumnie (bez dymka Głosu: kwestia leci z głośnika, start mówi taśma), przy długich (finał) mniejszy tekst zamiast ucinania */
body.tv .rz-kol .zasb{flex:0 1 auto;min-height:0;overflow:hidden}
body.tv .rz-kol .zasb ul{font-size:calc(2.1*var(--u));line-height:1.35}
body.tv .rz-kol .zasb:has(li:nth-child(4)) ul{font-size:calc(1.8*var(--u))}

/* mostek przed pytaniem */
body.tv .rz-chwila{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(1.6*var(--u));padding:calc(4*var(--u)) calc(2*var(--u))!important;text-align:center}
body.tv .rz-chwila img{height:calc(15*var(--u));width:auto;image-rendering:pixelated}
body.tv .rz-chwila .h1{font-size:calc(4.2*var(--u));margin:0}
body.tv .rz-chwila .sub{font-size:calc(2.2*var(--u))}

/* koniec: kto ma mostek, prowadzący, tytuły w trzech kolumnach */
body.tv .rz-win{display:flex;flex-direction:column;align-items:center;gap:calc(1.2*var(--u));text-align:center;padding:calc(1.4*var(--u))!important}
body.tv .rz-win .h1{font-size:calc(3.4*var(--u));margin:0}
body.tv .rz-win .chip img{height:calc(3*var(--u));width:auto}
body.tv .rz-kol .titles.rz-tyt{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(1*var(--u));width:100%}
body.tv .rz-tyt .tyt{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:calc(1.2*var(--u));align-items:center;align-content:center;justify-items:start;text-align:left;padding:calc(.5*var(--u)) calc(.8*var(--u))!important}
body.tv .rz-tyt .tyt .m{grid-row:1 / 3;width:calc(6.4*var(--u));height:calc(6.4*var(--u))}
body.tv .rz-tyt .tyt .m .pop{width:calc(3.2*var(--u));height:calc(3.2*var(--u))}
body.tv .rz-tyt .tyt .tn{font-size:calc(1.7*var(--u));margin:0;align-self:end}
body.tv .rz-tyt .tyt .tw{font-size:calc(1.5*var(--u));line-height:1.25;align-self:start}
/* pasek u góry: nazwa ekranu jak plakietka adresu, na środku */
body.tv .rz-top .cap{margin:0 auto;font-family:var(--display);font-size:calc(2.3*var(--u));letter-spacing:.08em;color:var(--ink);background:rgba(11,15,31,.88);border:calc(.3*var(--u)) solid var(--line);padding:calc(1*var(--u)) calc(1.8*var(--u)) calc(.8*var(--u));white-space:nowrap}

/* kamery kabin: 12 w rzędzie, ta sama kamera co na pulpicie telefonu, w skali telewizora */
body.tv .rz-kamy{grid-column:1 / -1;display:flex;flex-direction:column;gap:calc(.9*var(--u))}
body.tv .rz-hh{display:flex;justify-content:space-between;align-items:baseline;padding:0 calc(.4*var(--u));font-family:var(--display);font-size:calc(1.7*var(--u));letter-spacing:.08em;color:var(--muted)}
body.tv .rz-hh .g{color:var(--mint)}
body.tv .rz-kk{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:calc(1.1*var(--u))}
body.tv .rz-kk .kkam{height:calc(15*var(--u));border-width:calc(.3*var(--u))}
body.tv .rz-kk .kkam.me{transform:none}
body.tv .rz-kk .kkam .kekr img{max-height:none;bottom:calc(3*var(--u));height:calc(100% - 4.4*var(--u))}
body.tv .rz-kk.wart .kkam .kekr img{bottom:calc(5.2*var(--u));height:calc(100% - 6.4*var(--u))}
body.tv .rz-kk .kkam .knr{left:calc(.6*var(--u));top:calc(.4*var(--u));font-size:calc(1.2*var(--u))}
body.tv .rz-kk .kkam .ktg{right:calc(.5*var(--u));top:calc(.5*var(--u));font-size:calc(1.2*var(--u));padding:calc(.3*var(--u)) calc(.4*var(--u)) calc(.15*var(--u))}
body.tv .rz-kk .kkam .rz-mj{left:calc(.5*var(--u));right:auto;font-size:calc(1.8*var(--u));padding:calc(.4*var(--u)) calc(.7*var(--u)) calc(.2*var(--u))}
body.tv .rz-kk .kkam .knk{font-size:calc(1.8*var(--u));line-height:1.2;padding:calc(.5*var(--u)) calc(.3*var(--u)) calc(.4*var(--u))}
body.tv .rz-kk .kkam .knk b{display:block;font-family:var(--display);font-weight:400;font-size:calc(1.7*var(--u));color:var(--yellow);letter-spacing:.03em}
body.tv .rz-kk .kkam .kbs{font-size:calc(1.1*var(--u))}
body.tv .rz-kk .kkam .kpak{width:calc(3.4*var(--u));height:auto}