.tv-page { max-width: 1640px; margin: 0 auto; }
.tv-intro { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding: 26px 0 38px; border-bottom: 1px solid #262626; }
.tv-intro h1 { font-size: clamp(34px, 4.2vw, 62px); letter-spacing: -2px; max-width: none; margin: 15px 0; }
.tv-intro p { color: #a5a5aa; margin: 0; font-size: 14px; }
.tv-stats { display: flex; flex-direction: column; text-align: right; white-space: nowrap; }
.tv-stats strong { font-size: 30px; font-weight: 500; letter-spacing: -1px; }
.tv-stats span { color: #999; font-size: 11px; }
.tv-quiet { display: inline-flex; align-items: center; justify-content: center; gap: 8px; color: #aaa; min-height: 44px; font-size: 12px; }
.tv-quiet:hover { color: #fff; }
.tv-quiet svg { width: 17px; height: 17px; }
.tv-directory { padding: 32px 0 0; }
.tv-directory-heading, .tv-directory-actions, .tv-result-line, .tv-watch-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.tv-directory-heading h2 { margin: 0; font-size: 24px; letter-spacing: -.7px; }
.tv-directory-actions { gap: 22px; }
.tv-tab { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #bdbdbd; min-height: 44px; }
.tv-tab svg { width: 18px; }
.tv-tab[aria-pressed="true"] { color: #ff343e; }
.tv-tab span { background: #252525; border-radius: 4px; padding: 1px 6px; font-size: 10px; }
.tv-search-row { display: flex; gap: 12px; margin: 22px 0 16px; }
.tv-search { display: flex; align-items: center; gap: 12px; border: 1px solid #333; border-radius: 5px; background: #101010; padding: 0 16px; flex: 1; color: #aaa; min-width: 0; }
.tv-search:focus-within { border-color: #999; }
.tv-search svg { flex-shrink: 0; width: 20px; }
.tv-search input { border: 0; outline-offset: -3px; background: none; color: #eee; width: 100%; height: 50px; font-size: 13px; padding: 0; }
.tv-filter-toggle { min-height: 50px; }
.tv-filter-toggle span { color: #ff444e; font-size: 12px; }
.tv-filters { display: flex; align-items: end; gap: 12px; padding: 18px; border: 1px solid #2c2c2c; background: #0e0e0e; border-radius: 5px; margin-bottom: 18px; }
.tv-filters > label { flex: 1; min-width: 0; color: #aaa; font-size: 11px; display: flex; flex-direction: column; gap: 7px; }
.tv-filters select, .tv-picker-toggle { width: 100%; height: 44px; padding: 0 12px; border: 1px solid #393939; border-radius: 4px; background: #171717; color: #eee; font-size: 12px; }
.tv-picker-toggle { text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-filter-picker { position: relative; }
.tv-filter-popup { position: absolute; top: calc(100% + 8px); left: 0; z-index: 10; width: 290px; max-width: calc(100vw - 50px); border: 1px solid #494949; background: #191919; border-radius: 5px; padding: 10px; box-shadow: 0 15px 40px #000b; }
.tv-filter-popup input { width: 100%; padding: 12px; color: #fff; background: #090909; border: 1px solid #444; border-radius: 3px; font-size: 12px; }
.tv-filter-options { max-height: 260px; overflow: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 2px; margin-top: 7px; }
.tv-filter-options button { flex-shrink: 0; min-height: 40px; padding: 10px; text-align: left; font-size: 12px; border-radius: 3px; }
.tv-filter-options button:hover, .tv-filter-options button[aria-pressed="true"] { background: #3c1014; color: #ff7b82; }
.tv-quick-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.tv-quick-filters button { min-height: 34px; font-size: 11px; padding: 6px 16px; background: #151515; border: 1px solid #2e2e2e; border-radius: 30px; color: #c0c0c0; }
.tv-quick-filters button:hover { border-color: #e50914; color: #fff; }
.tv-result-line { margin: 24px 0 16px; font-size: 12px; color: #bbb; }
#tv-updated { font-size: 10px; color: #808080; text-align: right; }
.tv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px 18px; }
.tv-card { border: 1px solid #252525; border-radius: 6px; overflow: hidden; position: relative; background: #0c0c0c; min-width: 0; transition: border-color .2s, transform .2s; }
.tv-card:hover { border-color: #b50911; transform: translateY(-2px); }
.tv-tile { width: 100%; aspect-ratio: 1.9; display: flex; align-items: center; justify-content: center; position: relative; background: radial-gradient(ellipse at 50% 40%, #242424, #141414); padding: 18px; }
.tv-tile:has(img.loaded) { background: #e5e5e5; }
.tv-tile:has(img.loaded[data-dark="true"]) { background: radial-gradient(ellipse at 50% 40%, #343434, #181818); }
.tv-channel-logo { position: absolute; width: auto; height: auto; max-width: 66%; max-height: 62%; object-fit: contain; opacity: 0; }
.tv-channel-logo.loaded { opacity: 1; }
.tv-monogram { font-weight: 700; font-size: clamp(16px, 1.6vw, 23px); text-align: center; color: #ddd; letter-spacing: -.5px; }
.tv-tile-play { opacity: 0; position: absolute; inset: 0; background: #0007; display: flex; justify-content: center; align-items: center; transition: opacity .2s; }
.tv-tile-play svg { width: 38px; height: 38px; border: 1px solid #fffb; border-radius: 50%; padding: 8px; color: white; }
.tv-tile:hover .tv-tile-play, .tv-tile:focus-visible .tv-tile-play { opacity: 1; }
.tv-save { position: absolute; top: 9px; right: 9px; z-index: 1; width: 34px; height: 34px; border: 1px solid #ffffff30; background: #080808b8; border-radius: 50%; display: grid; place-items: center; }
.tv-save svg { width: 17px; height: 17px; }
.tv-save.is-saved { background: #b90710; border-color: #e50914; }
.tv-save.is-saved svg { fill: currentColor; }
.tv-card-copy { padding: 15px 16px; }
.tv-card-copy h3 { margin: 0 0 6px; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-card-copy p { margin: 0; color: #a3a3a3; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-card-copy > div { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding-top: 14px; font-size: 9px; color: #999; }
.tv-card-copy > div > span { text-transform: capitalize; color: #e0e0e0; }
.tv-card-copy small { font-size: 9px; text-align: right; }
.tv-more { display: flex; margin: 32px auto; min-width: 180px; }
.tv-directory-note { max-width: 760px; color: #777; font-size: 11px; line-height: 1.8; margin: 35px 0 0; }
.tv-empty { text-align: center; padding: 60px 20px; background: #0f0f0f; border: 1px solid #282828; border-radius: 6px; }
.tv-empty p { color: #999; }
.tv-notice { padding: 12px 16px; border-left: 2px solid #e50914; color: #ccc; background: #191013; font-size: 12px; }
#tv-import { margin-bottom: 20px; }
#tv-watch { margin-top: 24px; scroll-margin-top: 100px; }
.tv-watch-heading { margin-bottom: 12px; }
.tv-screen { position: relative; isolation: isolate; width: 100%; aspect-ratio: 16 / 9; background: #000; border: 1px solid #303030; border-radius: 6px; overflow: hidden; }
.tv-screen video { width: 100%; height: 100%; display: block; object-fit: contain; background: #000; }
.tv-screen-status { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; background: radial-gradient(ellipse at center, #190709, #020202 68%); text-align: center; padding: 70px 70px 80px; }
.tv-loading-brand { display: flex; align-items: center; flex-direction: column; font-size: 56px; margin-bottom: 18px; }
.tv-loading-brand .brand-word { font-size: 56px; }
.tv-loading-brand .brand-caption { font-size: 9px; }
.tv-loading-line { width: 100px; height: 2px; background: #4a1014; overflow: hidden; position: relative; }
.tv-loading-line::after { content: ''; position: absolute; left: -50%; width: 50%; height: 100%; background: #e50914; animation: tv-loading 1.2s ease-in-out infinite; }
@keyframes tv-loading { to { left: 100%; } }
.tv-screen-status h2 { margin: 20px 0 7px; font-size: 17px; font-weight: 500; }
.tv-screen-status p { color: #999; font-size: 12px; max-width: 450px; margin: 0; }
.tv-state-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; }
.tv-state-actions .secondary, .tv-state-actions .primary { min-height: 38px; padding: 8px 16px; font-size: 11px; }
.tv-error .tv-loading-line { display: none; }
.tv-player-controls { position: absolute; inset: 0; z-index: 3; opacity: 0; transition: opacity .3s; pointer-events: none; background: linear-gradient(#0009, transparent 25%, transparent 70%, #000c); }
.tv-controls-visible .tv-player-controls, .tv-error .tv-player-controls { opacity: 1; }
.tv-player-controls button, .tv-player-controls input { pointer-events: auto; }
.tv-player-controls button { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; }
.tv-player-controls button:hover { background: #ffffff22; }
.tv-player-controls button:disabled { opacity: .25; cursor: default; }
.tv-overlay-top { position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: center; gap: 14px; padding: 22px; }
.tv-overlay-top strong { font-size: 16px; text-shadow: 0 1px 3px #000; }
.tv-overlay-top > div > span { display: block; margin-top: 4px; font-size: 10px; color: #ccc; }
.tv-watermark { margin-left: auto; color: #e50914; font-weight: 900; font-size: 21px; letter-spacing: 2px; opacity: .8; }
.tv-watermark span { color: #fff; }
.tv-channel-arrow { position: absolute; top: 50%; transform: translateY(-50%); background: #0005; backdrop-filter: blur(5px); border-radius: 5px !important; width: 46px; height: 62px; color: #fffd; }
.tv-channel-arrow svg { width: 27px; height: 27px; }
.tv-previous { left: 16px; }
.tv-next { right: 16px; }
.tv-player-bar { position: absolute; bottom: 0; left: 0; right: 0; display: flex; align-items: center; gap: 8px; padding: 14px 20px; }
.tv-player-bar #tv-volume { flex: 0 0 80px; width: 80px; min-width: 0; height: 24px; padding: 0; margin: 0; border: 0; background: transparent; accent-color: #e50914; }
.tv-live-badge { display: flex; gap: 7px; align-items: center; font-size: 10px; letter-spacing: 1.5px; padding-left: 8px; }
.tv-live-badge i { width: 6px; height: 6px; border-radius: 50%; background: #e50914; }
#tv-position { margin-left: auto; font-size: 10px; color: #ccc; }
.tv-channel-details { display: flex; align-items: start; justify-content: space-between; gap: 30px; padding: 22px 0; border-bottom: 1px solid #292929; }
.tv-channel-details h2 { margin: 0 0 6px; font-size: 24px; }
.tv-channel-details p { color: #999; font-size: 12px; margin: 5px 0; }
#tv-playback-message { max-width: 650px; color: #888; font-size: 11px; }
.tv-source-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 11px; }
.tv-source-controls label { color: #999; }
.tv-source-controls select { border: 1px solid #333; color: #ddd; min-height: 40px; border-radius: 3px; padding: 6px 10px; max-width: 240px; font-size: 11px; }
.tv-screen:fullscreen, .tv-screen:-webkit-full-screen, .tv-screen.tv-expanded { width: 100vw; height: 100vh; height: 100dvh; aspect-ratio: auto; border-radius: 0; border: 0; background: #000; }
.tv-screen.tv-expanded { position: fixed; inset: 0; z-index: 10000; }
.tv-fullscreen-open { overflow: hidden; }
@media (min-width: 1500px) { .tv-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .tv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tv-channel-details { flex-direction: column; gap: 12px; } }
@media (max-width: 600px) {
  .tv-intro { padding: 12px 0 25px; gap: 12px; align-items: start; }
  .tv-intro h1 { font-size: 35px; letter-spacing: -1.4px; line-height: 1.12; }
  .tv-intro p { font-size: 12px; max-width: 260px; }
  .tv-stats { display: none; }
  .tv-directory { padding-top: 22px; }
  .tv-directory-heading { align-items: start; }
  .tv-directory-heading h2 { font-size: 20px; }
  .tv-directory-actions { gap: 8px; }
  .tv-directory-actions .tv-quiet { font-size: 0; width: 35px; }
  .tv-tab { font-size: 10px; gap: 5px; min-height: 30px; }
  .tv-search-row { gap: 8px; margin-top: 18px; }
  .tv-search { padding: 0 10px; gap: 7px; }
  .tv-search input { font-size: 12px; height: 46px; }
  .tv-filter-toggle { min-height: 46px; padding: 10px; font-size: 11px; gap: 7px; }
  .tv-filter-toggle svg { width: 17px; }
  .tv-filters { flex-wrap: wrap; padding: 12px; }
  .tv-filters > label { flex-basis: 42%; }
  .tv-filters > label:nth-child(3) { flex-basis: 70%; }
  .tv-filters > label:nth-child(2) .tv-filter-popup { left: auto; right: 0; }
  .tv-filter-popup { width: 260px; }
  .tv-quick-filters { flex-wrap: nowrap; overflow: auto; padding-bottom: 5px; }
  .tv-quick-filters button { flex-shrink: 0; font-size: 10px; padding: 5px 13px; }
  .tv-result-line { font-size: 11px; align-items: start; margin-top: 18px; }
  #tv-updated { max-width: 130px; font-size: 9px; }
  .tv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
  .tv-card-copy { padding: 12px 10px; }
  .tv-card-copy h3 { font-size: 12px; }
  .tv-card-copy p, .tv-card-copy small, .tv-card-copy > div { font-size: 9px; }
  .tv-card-copy > div { align-items: start; padding-top: 10px; }
  .tv-save { width: 30px; height: 30px; top: 6px; right: 6px; }
  .tv-save svg { width: 14px; }
  .tv-monogram { font-size: 15px; }
  #tv-watch { scroll-margin-top: 120px; }
  .tv-screen { min-height: 230px; }
  .tv-screen-status { padding: 55px 35px 60px; }
  .tv-loading-brand, .tv-loading-brand .brand-word { font-size: 36px; margin-bottom: 10px; }
  .tv-loading-brand .brand-caption { font-size: 7px; }
  .tv-screen-status h2 { font-size: 14px; margin: 12px 0 5px; }
  .tv-screen-status p { font-size: 10px; }
  .tv-state-actions { gap: 6px; margin-top: 12px; }
  .tv-state-actions .secondary, .tv-state-actions .primary { padding: 6px 10px; font-size: 10px; min-height: 34px; }
  .tv-error .tv-loading-brand { display: none; }
  .tv-overlay-top { padding: 12px; gap: 6px; }
  .tv-overlay-top strong { font-size: 12px; }
  .tv-overlay-top > div > span { font-size: 9px; }
  .tv-watermark { font-size: 16px; }
  .tv-channel-arrow { min-width: 34px !important; width: 34px; height: 45px; }
  .tv-previous { left: 6px; }
  .tv-next { right: 6px; }
  .tv-player-bar { padding: 7px; gap: 1px; }
  .tv-player-controls button { min-width: 38px; min-height: 38px; }
  .tv-player-bar #tv-volume { flex-basis: 52px; width: 52px; }
  .tv-player-bar svg { width: 19px; }
  .tv-live-badge { font-size: 8px; padding-left: 6px; gap: 4px; }
  #tv-position { font-size: 9px; }
  .tv-channel-details h2 { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) { .tv-loading-line::after { animation: none; left: 25%; } .tv-card, .tv-player-controls { transition: none; } }

/* The watermark appears only while the player is expanded. */
.tv-watermark{display:none}.tv-screen:fullscreen .tv-watermark,.tv-screen:-webkit-full-screen .tv-watermark,.tv-screen.tv-expanded .tv-watermark{display:block}
#tv-exit-fullscreen{margin-left:auto}

/* The broadcaster owns the centre; MNO remains a small corner signature. */
.tv-loading-brand{display:flex;align-items:center;justify-content:center;margin-bottom:24px;min-height:90px}.tv-loading-brand img{display:block;object-fit:contain;max-width:min(230px,52vw);max-height:130px;width:auto;height:auto;background:transparent;filter:drop-shadow(0 2px 12px #0006)}#tv-loading-monogram{font-size:42px;font-weight:700;letter-spacing:2px;color:#eee}#tv-loading-logo[hidden],#tv-loading-monogram[hidden]{display:none}.tv-error .tv-loading-brand{display:flex}.tv-screen .tv-static-watermark{display:block;position:absolute;z-index:5;top:18px;right:20px;font-size:16px;opacity:.75;pointer-events:none;margin:0;text-shadow:0 1px 6px #000}.tv-screen.tv-expanded .tv-static-watermark,.tv-screen:fullscreen .tv-static-watermark{right:70px}.tv-waiting #tv-state-title,.tv-waiting #tv-state-message{display:none}.tv-quick-filters{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin:18px 0}.tv-quick-filters>div{display:flex;align-items:center;flex-wrap:wrap;gap:7px}.tv-quick-filters>div>span{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#777;min-width:86px}.tv-quick-filters button[aria-pressed="true"]{background:#310a0f;color:#fff;border-color:#b00914}@media(max-width:600px){.tv-quick-filters>div>span{flex:0 0 100%;margin:3px 0}.tv-loading-brand{min-height:60px;margin-bottom:18px}.tv-loading-brand img{max-height:90px;max-width:150px}.tv-screen .tv-static-watermark{top:12px;right:14px;font-size:13px}.tv-state-actions{flex-wrap:wrap}.tv-error .tv-loading-brand{display:flex}#tv-loading-monogram{font-size:30px}}

.tv-overlay-top #tv-exit-fullscreen{margin-left:auto}
.tv-seo-directory,.tv-channel-information{padding:34px 0;border-top:1px solid #292929;margin-top:30px}.tv-seo-directory>p,.tv-channel-information>p{color:#aaa;font-size:14px;line-height:1.8;max-width:900px}.tv-hub-links{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.tv-hub-links a{border:1px solid #303030;padding:9px 12px;border-radius:5px;font-size:12px;color:#ccc}.tv-hub-links a:hover{border-color:#a90b16;color:#fff}.tv-hub-links small{color:#777;margin-left:7px}.tv-seo-directory details{margin:18px 0}.tv-seo-directory summary,.tv-channel-information summary{cursor:pointer;color:#aaa;font-size:13px;padding:10px 0}.tv-native-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:24px 0}.tv-native-links>a{display:flex;align-items:center;gap:16px;padding:14px;border:1px solid #292929;background:#101010;border-radius:6px;min-width:0}.tv-native-links>a:hover{border-color:#a50914}.tv-native-links img{object-fit:contain;flex-shrink:0}.tv-native-links strong{font-size:13px;display:block;line-height:1.4}.tv-native-links small{font-size:11px;color:#888;display:block;margin-top:5px;line-height:1.5}.tv-channel-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:24px 0 32px}.tv-channel-facts dt{font-size:11px;color:#888;margin-bottom:7px}.tv-channel-facts dd{margin:0;font-size:13px;line-height:1.6}@media(max-width:850px){.tv-native-links{grid-template-columns:repeat(2,minmax(0,1fr))}.tv-channel-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:500px){.tv-native-links{grid-template-columns:1fr}.tv-channel-facts{gap:18px}.tv-channel-information{padding-top:24px}.tv-native-links>a{padding:12px}}
/* Two compact rows; the complete directory choices remain in Filters. */
.tv-quick-filters{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;overflow:visible;height:auto;max-height:none;flex-wrap:initial;flex-direction:initial;margin:18px 0;padding:0}.tv-quick-filters button{min-width:0;padding:7px 8px;white-space:normal;line-height:1.3;min-height:34px}@media(max-width:650px){.tv-quick-filters{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;overflow:visible;padding:0}.tv-quick-filters button{padding:7px 5px;font-size:10px}.tv-quick-filters .tv-secondary-shortcut{display:none}}
