/* Preserve the established desktop/mobile layout; make country navigation unmistakable. */
.country-tabs{padding:5px;gap:6px;border-radius:11px;border-color:#426058;background:#111d23}
.country-tabs a{min-height:44px;min-width:126px;padding:10px 16px;font-size:15px;font-weight:600;color:#c0ced2;border:1px solid transparent;border-radius:7px}
.country-tabs a[aria-current=true]{color:#b7f3df;background:#214238;border-color:#5b9b85}
.country-code{display:none}
.topbar{height:76px;flex-basis:76px}
@media(max-width:900px) and (orientation:portrait){body:not(.tv-mode) .topbar{height:108px;flex-basis:108px;grid-template-rows:47px 53px}body:not(.tv-mode) .country-tabs{padding:3px;gap:3px}body:not(.tv-mode) .country-tabs a{min-width:0;min-height:44px;padding:8px 4px;font-size:14px;font-weight:600}body:not(.tv-mode) .country-code{display:none}}
@media(display-mode:standalone){.topbar{height:calc(76px + env(safe-area-inset-top));flex-basis:calc(76px + env(safe-area-inset-top))}}
@media(display-mode:standalone) and (max-width:900px) and (orientation:portrait){body:not(.tv-mode) .topbar{height:calc(108px + env(safe-area-inset-top));flex-basis:calc(108px + env(safe-area-inset-top))}}
/* A TV is a viewing surface. Its browser appears only on demand. */
body.tv-mode{background:#080d11;color:#edf2f5}
.tv-mode .topbar{position:absolute;inset:0 0 auto;z-index:125;height:88px;padding:0 4vw;background:#0b1117;border:0;transition:transform .18s ease,opacity .18s ease}
.tv-mode .brand-text{font-size:27px}.tv-mode .brand-text>span{font-size:14px}
.tv-mode .country-tabs a{font-size:20px;min-height:48px;min-width:140px}
.tv-mode .topbar-actions>[data-action=install],.tv-mode .topbar-actions>[data-action=schedule],.tv-mode .mobile-menu-button{display:none}
.tv-mode .top-tv-button{font-size:15px;min-height:46px}.tv-mode .topbar-actions .icon-button{width:46px;height:46px}
.tv-mode .workspace{position:absolute;inset:0;display:block;padding:0!important}
.tv-mode .player-panel{position:absolute;inset:0;display:block;border:0;border-radius:0;background:#000}
.tv-mode .video-stage{position:absolute;inset:0;width:100%;height:100%;min-height:0;padding:0;border-radius:0}
.tv-mode .video-stage video{object-fit:contain}
.tv-mode .stage-backdrop{opacity:.38}.tv-mode .stage-brand,.tv-mode .stage-caption,.tv-mode .stage-preview{display:none!important}
.tv-mode .player-placeholder{inset:88px 460px 100px 4vw;text-align:center;padding:25px;transform:none;width:auto;max-width:none;display:flex;flex-direction:column;justify-content:center;align-items:center}
.tv-mode .player-placeholder h2{font-size:30px}.tv-mode .player-placeholder p{font-size:18px}.tv-mode .player-state-label{font-size:13px}
.tv-mode .player-details{position:absolute;left:4vw;right:4vw;bottom:3vh;height:82px;padding:14px 22px;z-index:122;background:#101b24f2;border:1px solid #31464f;border-radius:12px;transition:opacity .18s ease,transform .18s ease}
.tv-mode .player-details h2{font-size:23px}.tv-mode .player-details p{font-size:14px}.tv-mode .player-site-mark{display:none}
.tv-mode .player-controls .icon-button{width:49px;height:49px}.tv-mode .player-controls svg{width:24px;height:24px}
.tv-mode .directory{position:absolute;right:4vw;top:110px;bottom:calc(3vh + 102px);width:390px;z-index:121;padding:20px;background:#101a23f5;border:1px solid #30444e;border-radius:14px;grid-template-rows:32px 44px 40px minmax(0,1fr);gap:12px;transition:opacity .18s ease,transform .18s ease}
.tv-mode .directory-heading h1{font-size:21px}.tv-mode .search-box input{font-size:16px}.tv-mode .search-box{height:44px}
.tv-mode .library-tabs{gap:14px}.tv-mode .library-tabs button{font-size:14px;min-height:40px}.tv-mode .library-tabs button>span{display:none}
.tv-mode .channel-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px;counter-reset:tv-channel}
.tv-mode .channel-card{counter-increment:tv-channel}.tv-mode .channel-art{padding-top:72%;border-radius:11px;border-width:2px;background:#17252f}
.tv-mode .channel-logo{width:65%;height:65%;max-width:84px;max-height:84px}
.tv-mode .channel-name{font-size:18px;line-height:1.35;white-space:normal;display:block;overflow-wrap:anywhere;min-height:48px}
.tv-mode .channel-info{padding-top:9px;min-height:54px}.tv-mode .channel-info>div{min-width:0}
.tv-mode .favorite-button{width:27px;height:34px;opacity:0}.tv-mode .favorite-button svg{width:18px;height:18px}.tv-mode .channel-card:focus-within .favorite-button,.tv-mode .favorite-button.is-saved{opacity:1}
.tv-mode .channel-status,.tv-mode .directory-bottom,.tv-mode .card-play,.tv-mode .statusbar,.tv-mode .mobile-bottom-nav{display:none!important}
.tv-mode .channel-art:before{content:counter(tv-channel,decimal-leading-zero);position:absolute;top:8px;left:10px;font-size:12px;color:#b3c4ca;z-index:2}
.tv-mode .channel-art:focus-visible,.tv-mode .channel-art:focus{outline:4px solid #a7f0d3;outline-offset:3px;background:#29453e;box-shadow:0 0 0 6px #172a26}
.tv-mode .channel-card.is-selected .channel-art{border-color:#8fe1c4;background:#203c35}
.tv-mode .fullscreen-browser,.tv-mode .fullscreen-wake{display:none!important}
.tv-mode.tv-watching .directory,.tv-mode.tv-watching .topbar,.tv-mode.tv-watching .player-details{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px)}
.tv-mode.tv-watching .topbar{transform:translateY(-20px)}
.tv-mode.tv-watching .player-placeholder{inset:90px 8vw 100px}
.tv-mode .utility-dialog{font-size:18px;width:560px}.tv-mode .utility-dialog h2{font-size:25px}.tv-mode .utility-dialog button,.tv-mode .utility-dialog label{min-height:48px;font-size:18px}
@media(min-width:1800px){.tv-mode .directory{width:440px;padding:24px}.tv-mode .player-placeholder{right:520px}.tv-mode .channel-name{font-size:22px}.tv-mode .channel-logo{max-width:100px;max-height:100px}.tv-mode .directory-heading h1{font-size:24px}.tv-mode .library-tabs button{font-size:16px}}
@media(max-height:720px){.tv-mode .topbar{height:74px}.tv-mode .directory{top:86px;bottom:98px;gap:8px;padding:14px;width:350px}.tv-mode .player-details{height:66px;bottom:18px}.tv-mode .channel-name{font-size:17px;min-height:42px}.tv-mode .player-controls .icon-button{height:43px;width:43px}}
@media(max-width:900px){.tv-mode .country-tabs a{min-width:0;padding:8px 10px;font-size:15px}.tv-mode .directory{right:3vw;width:340px}.tv-mode .topbar{padding:0 3vw}.tv-mode .player-placeholder{right:380px}.tv-mode .brand-text{font-size:22px}}
@media(max-width:650px){.tv-mode .directory{width:min(92vw,350px);right:4vw;top:92px}.tv-mode .topbar{height:80px;grid-template-columns:auto 1fr auto;gap:10px}.tv-mode .brand-text{font-size:16px}.tv-mode .brand-symbol{display:none}.tv-mode .topbar-actions [data-action=settings]{display:none}.tv-mode .top-tv-button span{display:none}.tv-mode .country-tabs a{font-size:12px;padding:5px}.tv-mode .player-placeholder{inset:90px 20px 100px}.tv-mode .player-details h2{font-size:15px}}
/* Large phones rotate too. The same player and remote overlay are retained. */
body.touch-landscape:not(.tv-mode) .topbar,body.touch-landscape:not(.tv-mode) .directory,body.touch-landscape:not(.tv-mode) .statusbar,body.touch-landscape:not(.tv-mode) .mobile-bottom-nav{display:none!important}
body.touch-landscape:not(.tv-mode) .workspace{display:block;padding:0}
body.touch-landscape:not(.tv-mode) .player-panel{position:fixed;inset:0;display:block;border:0;border-radius:0;z-index:90}
body.touch-landscape:not(.tv-mode) .video-stage{position:absolute;inset:0;width:100%;height:100%;padding:0;min-height:0}
body.touch-landscape:not(.tv-mode) .stage-caption,body.touch-landscape:not(.tv-mode) .stage-preview{display:none}
body.touch-landscape:not(.tv-mode) .player-details{position:absolute;inset:auto 10px 8px;height:54px;z-index:100;background:#101b24ee;border:1px solid #2e434b;border-radius:9px}
body.touch-landscape:not(.tv-mode) .player-details h2{font-size:13px}
body.touch-landscape:not(.tv-mode) .fullscreen-browser{left:10px;right:10px;bottom:76px}
body.touch-landscape:not(.tv-mode) .player-controls .icon-button{width:36px;height:36px}
body.touch-landscape:not(.tv-mode).player-expanded .player-panel.controls-hidden .player-details{opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.tv-mode .directory,.tv-mode .topbar,.tv-mode .player-details{transition:none}}

/* v37: four compact TV cards across, keeping readable names and remote focus. */
.tv-mode .directory{width:min(660px,53vw);padding:20px}
.tv-mode .channel-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:17px 12px}
.tv-mode .channel-art{padding-top:78%;border-radius:9px}
.tv-mode .channel-logo{width:60%;height:60%;max-width:64px;max-height:64px}
.tv-mode .channel-name{font-size:15px;line-height:1.3;min-height:40px;max-height:40px;overflow:hidden}
.tv-mode .channel-info{padding-top:8px;min-height:45px}
.tv-mode .channel-info>div{flex:1}
.tv-mode .favorite-button{position:absolute;right:2px;top:4px;width:24px;height:24px;background:#102129dc;border-radius:5px}
.tv-mode .channel-info{position:relative;padding-right:0}.tv-mode .favorite-button:not(:focus){visibility:hidden}.tv-mode .channel-card:focus-within .favorite-button{visibility:visible}
.tv-mode .player-placeholder{right:calc(min(660px,53vw) + 7vw)}
@media(min-width:1800px){.tv-mode .directory{width:760px;padding:24px}.tv-mode .channel-name{font-size:18px;min-height:47px;max-height:47px}.tv-mode .channel-logo{max-width:72px;max-height:72px}.tv-mode .player-placeholder{right:calc(760px + 7vw)}}
@media(max-height:720px) and (min-width:901px){.tv-mode .directory{width:min(620px,54vw);padding:14px}.tv-mode .channel-name{font-size:14px;min-height:37px;max-height:37px}.tv-mode .channel-grid{gap:14px 10px}}
@media(max-width:900px){.tv-mode .directory{width:min(600px,64vw);padding:14px}.tv-mode .channel-grid{gap:12px 9px}.tv-mode .channel-name{font-size:13px;min-height:34px;max-height:34px}.tv-mode .player-placeholder{right:calc(64vw + 6vw)}.tv-mode .topbar .football-button{display:none}}
@media(max-width:650px){.tv-mode .directory{width:92vw}.tv-mode .player-placeholder{inset:90px 20px 100px}.tv-mode .channel-name{font-size:12px}.tv-mode .channel-grid{gap:12px 8px}}
@media(max-width:420px){.topbar .football-button{display:none}}
.menu-list>a{display:flex;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid var(--line,#293b45);font-size:14px;color:inherit;text-decoration:none}.menu-list>a>svg:first-child{width:18px;height:18px}.menu-list>a>svg:last-child{margin-left:auto;width:16px;height:16px}@media(max-width:900px) and (orientation:portrait){body:not(.tv-mode) .country-tabs a{font-size:13px}}