body{background:#111311;font-family:Arial,Helvetica,sans-serif}.eyebrow{font-size:10px;letter-spacing:2px;color:#8b9385;font-weight:600}.screen{background:radial-gradient(ellipse at center,#242922,#080a08 75%)}.guide,dialog{background:#1a1e19}dialog{border:1px solid #ffffff20;box-shadow:0 24px 100px #0009}dialog::backdrop{background:#090b09bd;backdrop-filter:blur(8px)}.test-pattern{width:100px;height:68px;border-radius:4px;background:linear-gradient(90deg,#ccc 14%,#bac185 14% 28%,#8eafad 28% 42%,#85a780 42% 56%,#a58caa 56% 70%,#aa8079 70% 84%,#7d88a2 84%);opacity:.6}.live-label{font-family:monospace;font-size:11px;display:flex;align-items:center;gap:7px;color:#bec5b8}.live-label span{width:6px;height:6px;background:#bef264;border-radius:50%}.channel{display:flex;width:100%;text-align:left;padding:14px 12px;gap:14px;align-items:center;border-radius:5px}.channel:hover{background:#ffffff07}.channel.active{background:#bef26415;color:#d9f99d}.channel-number{font-family:monospace;font-size:11px;color:#737e6c;min-width:24px}.channel-icon{width:38px;height:38px;background:#ffffff08;display:grid;place-items:center;font-size:12px;font-weight:bold;border:1px solid #ffffff0b;border-radius:5px}.filter{font-size:11px;color:#939d8d;padding:5px 8px;border-radius:4px}.filter.active{background:#ffffff0c;color:#e7e5e4}button{cursor:pointer}button:focus-visible{outline:2px solid #bef264;outline-offset:2px}[hidden]{display:none!important}
/* Touch-friendly transport controls keep the native media controls available. */
.tv-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid #ffffff10}.tv-controls button,.tv-controls select{min-height:42px;border:1px solid #ffffff12;background:#1a1e19;color:#c7cec0;border-radius:6px;padding:8px 12px;font-size:12px}.tv-controls button:hover{border-color:#bef26470}.tv-controls .live-button{color:#bef264;margin-right:auto}.tv-controls .behind{color:#fbbf24}.screen:fullscreen{border:0;border-radius:0;background:#000;display:flex;align-items:center;justify-content:center}.screen:fullscreen video{width:100%;height:100%;object-fit:contain}body{padding-bottom:env(safe-area-inset-bottom)}header{padding-top:max(24px,env(safe-area-inset-top))}@media(max-width:640px){main{padding:20px 14px!important}header{padding-left:16px!important;padding-right:16px!important}h1{font-size:26px!important}.tv-controls{gap:6px}.tv-controls button,.tv-controls select{padding:8px 10px;font-size:11px}.channel{min-height:64px}#channels{max-height:48vh}.screen{position:relative}.guide{margin-bottom:20px}}@media(display-mode:standalone){header{user-select:none}}
/* Cinematic live-only transport: no timeline, timestamps or pause affordance. */
.screen{background:#080908;isolation:isolate}.screen video{object-fit:contain}.player-heading{position:absolute;inset:0 0 auto;display:flex;align-items:center;gap:12px;padding:24px;background:linear-gradient(#000b,transparent);pointer-events:none;transition:opacity .25s}.on-air{background:#c92732;color:#fff;font-size:9px;letter-spacing:1.5px;font-weight:bold;padding:4px 7px;border-radius:3px}#player-name{font-size:16px;font-weight:600;color:white}.screen .tv-controls{position:absolute;inset:auto 0 0;margin:0;border:0;padding:36px 20px 16px;gap:12px;flex-wrap:nowrap;background:linear-gradient(transparent,#000e);z-index:3;transition:opacity .25s}.screen .tv-controls button,.screen .tv-controls select{background:transparent;border:0;border-radius:4px;color:#fff;min-height:44px;font-size:13px;padding:8px}.screen .tv-controls button:hover{background:#ffffff18}.screen #previous,.screen #next{font-size:32px;line-height:1;min-width:34px}.screen .tv-controls svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.screen #mute.muted{color:#a5a5a5}.screen #volume{width:70px;accent-color:#fff;min-width:0}.screen .tv-controls .live-button{color:#fff;font-size:11px;letter-spacing:1px;margin-right:auto;white-space:nowrap}.screen .tv-controls .live-button.behind{color:#fbbf24}.screen #quality{max-width:118px;font-size:12px}.screen #quality option{background:#181818;color:#fff}.player-loading{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-size:11px;letter-spacing:2px;background:#000b;padding:12px 18px;border-radius:6px;pointer-events:none}.player-loading:before{content:'';display:block;width:24px;height:24px;border:2px solid #ffffff30;border-top-color:#fff;border-radius:50%;margin:0 auto 12px;animation:tv-spin 1s linear infinite}.start-watch{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);padding:14px 22px;border-radius:5px;background:#fff;color:#111;font-size:14px;font-weight:bold;z-index:4}.controls-hidden .tv-controls,.controls-hidden .player-heading{opacity:0;pointer-events:none}.screen:focus-within .tv-controls,.screen:focus-within .player-heading{opacity:1;pointer-events:auto}.screen:fullscreen .tv-controls{padding-bottom:max(22px,env(safe-area-inset-bottom))}.screen:fullscreen .player-heading{padding-top:max(24px,env(safe-area-inset-top))}@keyframes tv-spin{to{transform:rotate(360deg)}}@media(max-width:640px){.player-heading{padding:12px}#player-name{font-size:12px}.screen .tv-controls{gap:3px;padding:30px 8px 6px}.screen .tv-controls button{padding:5px;min-height:40px}.screen #volume{display:none}.screen #quality{max-width:100px;font-size:10px}.screen #pip{display:none}.screen #previous,.screen #next{font-size:26px;min-width:26px}.screen .tv-controls svg{width:20px;height:20px}.screen .live-button{font-size:9px!important}.start-watch{padding:10px 16px;font-size:12px}.player-loading{top:42%;font-size:9px;padding:8px 12px}.player-loading:before{width:18px;height:18px;margin-bottom:6px}}@media(prefers-reduced-motion:reduce){.player-loading:before{animation:none}.screen .tv-controls,.player-heading{transition:none}}
.creator-watermark{position:absolute;right:18px;bottom:78px;width:96px;max-height:44px;object-fit:contain;opacity:.55;pointer-events:none;user-select:none;z-index:2;filter:drop-shadow(0 1px 3px #0009)}.creator-credit{display:flex;justify-content:center;align-items:center;gap:8px;padding:28px 0 12px;font-size:12px;color:#798174}.creator-credit a{color:#acb4a5;text-decoration:none}.creator-credit a:hover{color:#bef264}.creator-credit a:focus-visible{outline:2px solid #bef264;outline-offset:4px}.screen:fullscreen .creator-watermark{right:28px;bottom:90px;width:120px}@media(max-width:640px){.creator-watermark{width:66px;max-height:30px;right:12px;bottom:62px}.creator-credit{flex-wrap:wrap;font-size:11px}}
/* Slim, dark scrollbars for the page, channel guide and other scrollable areas. */
html{scrollbar-gutter:stable}*{scrollbar-width:thin;scrollbar-color:#58634f #141713}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:#141713;border-radius:8px}::-webkit-scrollbar-thumb{background:#58634f;border:2px solid #141713;border-radius:8px}::-webkit-scrollbar-thumb:hover{background:#8ca176}::-webkit-scrollbar-thumb:active{background:#bef264}::-webkit-scrollbar-corner{background:#141713}#channels{scrollbar-gutter:stable;overscroll-behavior:contain}@media(forced-colors:active){*{scrollbar-color:auto}}
.beta-badge{display:inline-flex;align-items:center;padding:4px 7px;border:1px solid #bef26435;border-radius:4px;background:#bef2640d;color:#bef264;font-size:9px;font-weight:700;letter-spacing:1.3px;line-height:1;white-space:nowrap}
.screen .creator-watermark{right:10px;bottom:8px;opacity:.3;z-index:1}.screen:fullscreen .creator-watermark{right:14px;bottom:max(10px,env(safe-area-inset-bottom));opacity:.3}@media(max-width:640px){.screen .creator-watermark{right:8px;bottom:6px}}
/* The same guide moves into the player on compact screens and fullscreen. */
#guide-drawer{position:absolute;inset:0;z-index:10}#guide-backdrop{position:absolute;inset:0;width:100%;height:100%;background:#0008;cursor:pointer}#guide-slot{position:absolute;right:0;top:0;bottom:0;width:min(360px,88%);animation:guide-in .2s ease-out}#guide-slot .guide{height:100%;display:flex;flex-direction:column;margin:0;border-radius:0;border:0;border-left:1px solid #ffffff15;background:#171b17}#guide-slot .guide>div:first-child{flex-shrink:0;padding:16px}#guide-slot #channels{flex:1;min-height:0;max-height:none!important;overflow:auto}#guide-close{min-width:40px;min-height:40px;border-radius:5px;color:#d9e1d3}#guide-close:hover{background:#ffffff12}.guide-open .tv-controls{opacity:1;pointer-events:none}body.guide-open,body.tv-fullscreen{overflow:hidden}.screen.window-fullscreen{position:fixed!important;inset:0!important;width:100vw;height:100dvh;aspect-ratio:auto;border:0;border-radius:0;z-index:100;background:#000}.window-fullscreen video{width:100%;height:100%;object-fit:contain}.window-fullscreen .tv-controls{padding-bottom:max(16px,env(safe-area-inset-bottom))}.screen:fullscreen #guide-drawer,.window-fullscreen #guide-drawer{position:absolute}.screen:fullscreen #guide-slot,.window-fullscreen #guide-slot{padding-top:env(safe-area-inset-top);background:#171b17}@keyframes guide-in{from{transform:translateX(100%)}to{transform:translateX(0)}}@media(max-width:1023px){#guide-drawer{position:fixed;z-index:110}#guide-slot{width:min(360px,88vw);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);background:#171b17}main>div:first-child h1{font-size:22px!important}main>div:first-child{margin-bottom:16px!important}.creator-credit{padding-top:16px}.screen .tv-controls #guide-toggle{font-size:11px;white-space:nowrap}}@media(max-width:640px){.screen .tv-controls{gap:2px}.screen .tv-controls #guide-toggle{padding:6px;font-size:10px}#guide-slot .channel{min-height:60px}}@media(prefers-reduced-motion:reduce){#guide-slot{animation:none}}
.screen .creator-watermark{bottom:18px;opacity:.6}.screen:fullscreen .creator-watermark{bottom:max(20px,env(safe-area-inset-bottom));opacity:.6}@media(max-width:640px){.screen .creator-watermark{bottom:14px}}
.screen .tv-controls #pip{display:inline-flex;align-items:center;white-space:nowrap;font-size:11px}@media(max-width:640px){.screen .tv-controls #pip{font-size:9px;padding:4px}}
.screen.controls-hidden:focus-within .tv-controls,.screen.controls-hidden:focus-within .player-heading{opacity:0;pointer-events:none}.screen.controls-hidden{cursor:none}
.screen .tv-controls #cast-tv,.screen .tv-controls #airplay{font-size:11px;white-space:nowrap}@media(max-width:640px){.screen .tv-controls #cast-tv,.screen .tv-controls #airplay{font-size:9px;padding:4px}.screen .tv-controls{overflow-x:auto}}
.player-settings{position:relative;flex-shrink:0}.screen .tv-controls #settings-toggle{font-size:23px;min-width:40px}.screen .tv-controls #settings-panel{position:absolute;right:0;bottom:calc(100% + 8px);width:170px;padding:6px;background:#181c18f5;border:1px solid #ffffff24;border-radius:8px;box-shadow:0 6px 24px #0008;z-index:6}.screen .tv-controls #settings-panel button{display:block;width:100%;text-align:left;font-size:13px;padding:10px 12px}.screen .tv-controls{overflow:visible}@media(max-width:640px){.screen .tv-controls #settings-toggle{font-size:21px;min-width:34px}.screen .tv-controls #settings-panel{width:150px}}
