/* GAME BN television layout: the 100-result road is the primary surface.
 * Confirmed digits are never inferred; vacant cells are visibly blank. */
.tv{padding:clamp(10px,1.05vw,21px);gap:clamp(7px,.85vh,12px)}
.tv>header{min-height:44px;flex:0 0 auto}
.tv .logo{font-size:clamp(23px,2.1vw,38px);line-height:1}
.tv .logo small{font-size:10px;margin-top:4px}
.tv .topright{font-size:clamp(11px,.9vw,15px)}
.tv .topright #signal{padding:7px 12px}
.tv .topright .back{padding:6px 12px}
.tv .hero{padding:2px 0;min-height:58px}
.tv .hero .eyebrow{font-size:10px}
.tv .hero h1{font-size:clamp(27px,2.7vw,52px);margin:1px 0}
.tv .hero #round-status{font-size:clamp(12px,1.05vw,18px)}
.tv .hero .last{gap:4px}
.tv .hero .last small{font-size:clamp(11px,.8vw,14px)}
.tv .hero .last strong{font-size:clamp(15px,1.35vw,25px)}
.tv .alert{font-size:12px;line-height:1.35}
.tv .alert:empty{display:none}

/* Roughly 78% of content width is reserved for historical statistics. */
.tv>.stats-layout{
 display:grid;grid-template-columns:minmax(0,3.65fr) minmax(235px,1fr);
 gap:clamp(9px,.85vw,16px);align-items:stretch;
 height:clamp(390px,57vh,690px);min-height:0;
 order:0;
}
.stats-layout .history{
 order:0;display:flex;flex-direction:column;min-width:0;min-height:0;
 padding:clamp(10px,1.1vw,19px);border-radius:15px;
 background:#142b44;border:2px solid #456b89;
}
.stats-layout .hist-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;justify-content:space-between}
.stats-layout .hist-head h2{margin:1px 0 0;font-size:clamp(23px,2.1vw,40px)}
.stats-layout .hist-head .eyebrow{font-size:10px}
.stats-layout .hist-head .stats{gap:6px}
.stats-layout .hist-head .stats span{font-size:clamp(11px,.8vw,16px);border-radius:8px;padding:6px 10px}
.stats-layout .road{
 flex:1;min-height:0;max-height:none;overflow:auto;
 display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
 grid-template-rows:repeat(10,minmax(0,1fr));
 gap:clamp(3px,.37vw,8px);align-content:stretch;
 padding:2px 3px 3px;
}
.stats-layout .road .chip{
 min-height:0;min-width:0;padding:3px;
 border-radius:8px;border-width:2px;
 position:relative;
 display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
 line-height:1.05;
}
.stats-layout .road .chip b{font-size:clamp(17px,2.1vw,40px);font-weight:900;line-height:1.08}
.stats-layout .road .chip .chip-round{position:absolute;top:3px;left:5px;font-size:clamp(8px,.67vw,13px);font-weight:700;opacity:.83}
.stats-layout .road .chip .chip-side{font-size:clamp(8px,.65vw,12px)}
.stats-layout .road .chip-empty{background:#0d253c;border:1px dashed #375169;box-shadow:none!important;color:#506a82;opacity:.53}
.stats-layout .road .chip-empty span{font-size:clamp(12px,1.1vw,22px);line-height:1}
.stats-layout .road .chip:first-child:not(.chip-empty){box-shadow:0 0 0 2px #ffe29a;z-index:1}

/* Small name columns: scrolling names do not expand the TV canvas. */
.stats-layout .duo{
 display:grid;grid-template-columns:minmax(0,1fr);
 grid-template-rows:auto repeat(2,minmax(0,1fr));
 gap:10px;min-width:0;min-height:0;
}
.stats-layout .name-title{
 margin:0;padding:0 2px;
 font-size:clamp(16px,1.15vw,23px);line-height:1.15;
 display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;
}
.stats-layout .name-title small{font-size:clamp(10px,.75vw,13px);font-weight:500;color:#aec3d6}
.stats-layout .duo .panel{min-height:0;min-width:0;border-width:1px;border-radius:12px;overflow:hidden}
.stats-layout .duo .panel-head{padding:9px 12px;gap:8px;flex:0 0 auto}
.stats-layout .duo .panel-head h2{font-size:clamp(23px,1.8vw,34px);line-height:1}
.stats-layout .duo .panel-head h2 small{font-size:.37em;margin-top:3px}
.stats-layout .duo .panel-head strong{font-size:clamp(11px,.86vw,16px)}
.stats-layout .duo .panel>p{display:none}
.stats-layout .duo .people{
 flex:1;min-height:0;overflow-y:auto;
 padding:9px 11px;display:flex;flex-direction:column;gap:5px;
 scrollbar-color:#496078 transparent;
}
.stats-layout .duo .people .person{font-size:clamp(12px,.85vw,16px);padding:8px 10px;flex:0 0 auto}
.stats-layout .duo .people .empty{font-size:12px;line-height:1.4;margin:0;opacity:.85}

.tv>.frequency{order:1;padding:clamp(9px,1vw,16px)}
.tv>.frequency .frequency-head h2{font-size:clamp(18px,1.5vw,28px);margin:2px 0}
.tv>.frequency .frequency-head p{font-size:11px;margin:2px 0 5px}
.tv>.frequency .eyebrow{font-size:9px}
.tv>.frequency .frequency-controls button{min-height:34px;padding:6px 11px;font-size:13px}
.tv>.frequency .frequency-chart{height:clamp(110px,15vh,185px);margin-top:4px}
.tv>footer{order:2;font-size:11px}

@media(min-width:1200px) and (max-height:840px){
 .tv>.stats-layout{height:clamp(380px,57vh,530px)}
 .stats-layout .road .chip-side{display:none}
 .tv>.frequency .frequency-chart{height:clamp(100px,12vh,140px)}
 .stats-layout .road .chip b{font-size:clamp(17px,1.85vw,30px)}
 .stats-layout .hist-head{margin-bottom:5px}
}
/* On 16:9 televisions, the entire statistics region fits on the first screen. */
@media(min-width:951px){
 .tv>.stats-layout{height:clamp(370px,52vh,580px)}
 .tv>.frequency .frequency-head .eyebrow,
 .tv>.frequency .frequency-head p{display:none}
 .tv>.frequency .frequency-head{align-items:center;gap:10px}
 .tv>.frequency .frequency-chart{height:clamp(74px,9vh,108px)}
 .tv>.frequency .frequency-note{font-size:11px}
 .tv>.frequency{padding:9px 14px}
}
@media(min-width:951px) and (min-height:1000px){
 .tv>.stats-layout{height:clamp(520px,55vh,650px)}
 .tv>.frequency .frequency-chart{height:clamp(90px,10vh,130px)}
}
@media(max-width:950px){
 .tv>.stats-layout{grid-template-columns:minmax(0,2fr) minmax(180px,.85fr);height:clamp(390px,55vh,640px)}
 .stats-layout .road .chip-side{display:none}
 .stats-layout .road .chip .chip-round{font-size:9px;left:3px;top:3px}
}
@media(max-width:680px){
 .tv>.stats-layout{grid-template-columns:minmax(0,1fr);height:auto;gap:10px}
 .stats-layout .history{height:clamp(450px,70vh,700px)}
 .stats-layout .road{grid-template-columns:repeat(10,minmax(0,1fr));gap:3px}
 .stats-layout .road .chip b{font-size:clamp(13px,3vw,25px)}
 .stats-layout .road .chip .chip-round{font-size:8px;top:2px;left:2px}
 .stats-layout .road .chip-side{display:none}
 .stats-layout .duo{grid-template-columns:1fr 1fr;grid-template-rows:auto minmax(105px,190px);height:auto}
 .stats-layout .name-title{grid-column:1/-1}
 .stats-layout .duo .panel-head{padding:7px 9px}
 .stats-layout .duo .panel-head h2{font-size:21px}
 .stats-layout .duo .panel-head strong{font-size:11px}
 .stats-layout .duo .people{padding:6px}
 .stats-layout .duo .people .person{font-size:12px}
}