/* Display fits the viewport; type follows the cell's available height. */
:root{--tv-scale:1;font-size:16px;font-variant-numeric:tabular-nums}
:root[data-text-size=large]{--tv-scale:1.15}
body{background:#091827}
button,select{font:inherit;cursor:pointer}
.tv{padding:clamp(12px,1.2vw,40px);gap:clamp(8px,1vh,20px);min-width:0}
.tv>header{gap:16px;flex-wrap:wrap;min-width:0}
.tv .logo{font-size:clamp(25px,2.1vw,72px);line-height:1.15;letter-spacing:.02em}
.tv .logo small{font-size:clamp(10px,.65vw,22px);letter-spacing:.08em}
.tv .topright{gap:clamp(8px,.6vw,20px);font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale));justify-content:flex-end}
.tv .topright #signal,.tv .topright .back,.tv .demo-tag{padding:7px 10px;border-radius:8px}
.demo-tag{color:#ffe39f;border:1px solid #b88c38;font-weight:700}
.screen-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.screen-tools button,.screen-tools select,.tv .topright .back{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid #6687a1;border-radius:8px;background:#18334b;color:#eff8ff}
.screen-tools label{display:flex;align-items:center;gap:8px}
.screen-tools button:hover,.tv .back:hover{background:#2b4a65}
.tv :focus-visible{outline:3px solid #ffe39f;outline-offset:3px}
.tv ::selection{background:#ffe39f;color:#091827}
.tv .hero{padding:0;gap:16px;min-height:0;flex-wrap:wrap}
.tv .hero h1{font-size:calc(clamp(28px,2.5vw,84px)*var(--tv-scale));line-height:1.3;margin:0}
.tv .hero #round-status{font-size:calc(clamp(15px,1.1vw,34px)*var(--tv-scale));line-height:1.5;overflow-wrap:anywhere}
.tv .hero .last{gap:3px;min-width:0}
.tv .hero .last small{font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale))}
.tv .hero .last strong{font-size:calc(clamp(20px,1.6vw,52px)*var(--tv-scale));overflow-wrap:anywhere}
.tv .alert{font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale));line-height:1.4;margin:0}
.tv>.stats-layout{height:auto;min-height:0;grid-template-columns:minmax(0,3.6fr) minmax(230px,1fr);gap:clamp(10px,1vw,32px)}
.stats-layout .history{padding:clamp(10px,.8vw,28px);border-width:1px;min-height:0;min-width:0}
.stats-layout .hist-head{margin:0 0 8px;gap:8px}
.stats-layout .hist-head h2{font-size:calc(clamp(20px,1.65vw,54px)*var(--tv-scale));line-height:1.4;margin:0}
.stats-layout .hist-head .stats{gap:6px}
.stats-layout .hist-head .stats span{font-size:calc(clamp(13px,.9vw,28px)*var(--tv-scale));padding:5px 8px;line-height:1.4}
.stats-layout .road{height:100%;min-height:0;overflow:visible;gap:clamp(3px,.35vw,12px);padding:2px;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr))}
.stats-layout .road .chip{min-height:0;padding:0;border-width:1px;container-type:size;line-height:1;border-radius:6px}
.stats-layout .road .chip b{font-size:clamp(16px,1.8vw,48px);line-height:1;font-weight:800}
.stats-layout .road .chip .chip-round{font-size:clamp(8px,.65vw,18px);top:3px;left:4px;line-height:1}
.stats-layout .road .chip .chip-side{display:none}
.stats-layout .road .chip-empty span{font-size:clamp(12px,1vw,24px)}
@supports(font-size:1cqh){
 .stats-layout .road .chip b{font-size:clamp(16px,calc(82cqh*var(--tv-scale)),80px)}
 .stats-layout .road .chip .chip-round{font-size:clamp(8px,25cqh,18px)}
}
.stats-layout .name-title{font-size:calc(clamp(17px,1.2vw,38px)*var(--tv-scale));line-height:1.4}
.stats-layout .name-title small{font-size:calc(clamp(12px,.8vw,26px)*var(--tv-scale));line-height:1.4;color:#bdd2e1}
.stats-layout .duo{gap:clamp(8px,.8vh,18px);min-height:0}
.stats-layout .duo .panel-head{padding:clamp(8px,.7vw,22px);flex-wrap:wrap;gap:6px}
.stats-layout .duo .panel-head h2{font-size:calc(clamp(23px,1.7vw,54px)*var(--tv-scale));line-height:1.25}
.stats-layout .duo .panel-head h2 small{display:none}
.stats-layout .duo .panel-head strong{font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale))}
.stats-layout .duo .people{padding:clamp(8px,.7vw,22px);gap:8px;scrollbar-width:thin}
.stats-layout .duo .people .person{font-size:calc(clamp(16px,1.25vw,38px)*var(--tv-scale));line-height:1.5;white-space:normal;overflow-wrap:anywhere;overflow:visible;padding:6px 8px}
.stats-layout .duo .people .empty{font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale));line-height:1.5;color:#bdd2e1}
.tv>.frequency{padding:clamp(10px,.8vw,28px);min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:3px}
.tv>.frequency .frequency-head{align-items:center;gap:8px}
.tv>.frequency .frequency-head h2{font-size:calc(clamp(18px,1.35vw,44px)*var(--tv-scale));margin:0;line-height:1.4}
.tv>.frequency .frequency-controls button{min-height:44px;font-size:calc(clamp(14px,1vw,30px)*var(--tv-scale));padding:6px 12px}
.tv>.frequency .frequency-chart{height:auto;min-height:0;margin:0}
.tv>.frequency .frequency-note{font-size:calc(clamp(12px,.85vw,26px)*var(--tv-scale));line-height:1.4;margin:0;color:#bdd2e1}
.tv>footer{font-size:calc(clamp(12px,.8vw,24px)*var(--tv-scale));line-height:1.4;gap:8px;color:#bdd2e1}
#screen-help:empty{display:none}
@media(min-width:1100px) and (min-height:680px){
 .tv{height:100vh;height:100svh;min-height:680px;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) clamp(148px,20vh,350px) auto}
 .tv .alert:empty{display:block;min-height:0}
 .tv>.stats-layout{height:auto;min-height:240px}
 .tv .hero{flex-wrap:nowrap}
 .tv>.frequency .frequency-head p{display:none}
}
@media(max-width:1099px),(max-height:679px){
 .tv>.stats-layout{height:auto;grid-template-columns:minmax(0,1fr)}
 .stats-layout .history{height:clamp(480px,65vh,800px)}
 .stats-layout .duo{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto minmax(180px,260px)}
 .stats-layout .name-title{grid-column:1/-1}
 .tv>.frequency{height:280px}
 .tv>.frequency .frequency-head p{display:none}
 .tv>header{align-items:flex-start}
 .tv .topright{justify-content:flex-start}
}
@media(max-width:680px){
 .tv{padding:12px;gap:12px}
 .tv .topright{width:100%}
 .tv .topright #clock{margin-right:auto}
 .tv .hero{align-items:flex-start}
 .tv .hero .last{text-align:left}
 .stats-layout .hist-head{align-items:flex-start}
 .stats-layout .history{height:540px}
 .stats-layout .road{gap:3px}
 .stats-layout .road .chip .chip-round{top:2px;left:2px;font-size:8px}
 .stats-layout .road .chip b{font-size:clamp(16px,4.3vw,26px)}
 .stats-layout .duo .panel-head strong{font-size:13px}
 .tv>.frequency{height:320px}
 .tv>.frequency .frequency-note{text-align:left}
 .tv>footer{align-items:flex-start}
}