/* TV header: stable columns, equal controls, uncropped brand at every width. */
:root .tv-view main{grid-template-rows:58px minmax(0,1fr) 128px 42px}
:root:fullscreen .tv-view main{grid-template-rows:52px minmax(0,1fr) 128px 0}
.tv-view .tv-top{display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(90px,1fr);grid-template-areas:"brand modes room";align-items:center;gap:16px;padding:8px 22px;min-width:0;box-sizing:border-box;background:#fff;border-bottom:2px solid #ff6900;overflow:visible}
.tv-view .tv-top .brand{grid-area:brand;display:flex;flex-wrap:nowrap;align-items:center;gap:14px;min-width:0;margin:0}
.tv-view .tv-top .brand img{display:block;width:110px;height:40px;max-width:none;object-fit:contain;border-radius:0;flex:none}
.tv-view .tv-top .brand-product{display:block;flex:none;padding-left:14px;border-left:1px solid #efd4c0;font-family:"Arial Black","Trebuchet MS",sans-serif;font-size:16px;line-height:1.2;font-weight:900;letter-spacing:1px;white-space:nowrap;color:#c74e00!important;text-shadow:none;-webkit-text-stroke:0}
.tv-view .tv-top #mode-switch{grid-area:modes;display:grid;grid-template-columns:140px 200px;gap:8px;margin:0;align-items:stretch}
.tv-view .tv-top #mode-switch button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:40px;min-height:40px;min-width:0;margin:0;padding:0 12px;border:1px solid #eaded3;border-radius:24px;background:#fffaf5;color:#332b25;font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;font-size:17px;font-weight:800;line-height:1;letter-spacing:0;white-space:nowrap;text-shadow:none;-webkit-text-stroke:0;box-shadow:none}
.tv-view .tv-top #mode-switch button.selected{background:#ff6900;border-color:#ff6900;color:#fff}
.tv-view .tv-top #mode-switch button:hover{border-color:#ff6900;background:#fff0e3}
.tv-view .tv-top #mode-switch button.selected:hover{background:#e85d00;color:#fff}
.tv-view .tv-top>small{grid-area:room;justify-self:end;font-family:Arial,sans-serif;font-size:14px;line-height:1.3;font-weight:600;white-space:nowrap;color:#746253;text-align:right}
@media(max-width:680px){
 :root .tv-view main{grid-template-rows:122px minmax(0,1fr) 128px 42px}
 :root:fullscreen .tv-view main{grid-template-rows:122px minmax(0,1fr) 128px 0}
 .tv-view .tv-top{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:52px 46px;grid-template-areas:"brand room" "modes modes";gap:6px 10px;padding:7px 16px}
 .tv-view .tv-top #mode-switch{justify-self:center;grid-template-columns:140px 200px}
 .tv-view .tv-top .brand img{width:124px;height:47px}
 .tv-view .tv-top .brand-product{font-size:15px;padding-left:12px}
}
@media(max-width:420px){
 .tv-view .tv-top{padding-left:12px;padding-right:12px}
 .tv-view .tv-top .brand{gap:8px}
 .tv-view .tv-top .brand img{width:104px;height:42px}
 .tv-view .tv-top .brand-product{font-size:13px;padding-left:8px;letter-spacing:.5px}
 .tv-view .tv-top>small{font-size:12px}
 .tv-view .tv-top #mode-switch{width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
 .tv-view .tv-top #mode-switch button{font-size:15px;padding:0 8px}
}

:root:fullscreen .tv-view .tv-top{padding-top:5px;padding-bottom:5px}
@media(min-width:681px) and (max-width:840px){.tv-view .tv-top{grid-template-columns:minmax(190px,1fr) auto 60px;gap:8px;padding-left:12px;padding-right:12px}.tv-view .tv-top .brand{gap:8px}.tv-view .tv-top .brand img{width:100px;height:38px}.tv-view .tv-top .brand-product{font-size:13px;padding-left:8px}.tv-view .tv-top #mode-switch{grid-template-columns:110px 175px}.tv-view .tv-top #mode-switch button{font-size:15px}}
/* Keep listening content inside its own row, including short TV browsers. */
.tv-view #music-stage{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto auto auto auto;justify-items:center;align-items:center;align-content:stretch;gap:8px;min-height:0;overflow:auto;padding:14px;box-sizing:border-box}
.tv-view #music-stage>.eyebrow{margin:0;line-height:1.3}
.tv-view #music-stage>.album-art{height:100%;width:auto;max-height:420px;max-width:60vw;min-height:0;object-fit:contain;aspect-ratio:1}
.tv-view #music-stage>audio{display:none}
.tv-view #music-stage>h1{max-width:100%;overflow-wrap:anywhere}
@media(max-width:680px){.tv-view #music-stage{grid-template-rows:auto minmax(120px,31vh) auto auto auto auto auto}}
