body:has(.live-page) .site-footer{display:none}.live-page{--live-header-height:64px;height:calc(100dvh - var(--live-header-height));min-height:470px;padding:16px var(--page-gutter);grid-template-rows:minmax(0,1fr);grid-template-columns:310px minmax(0,1fr);gap:14px;width:100%;max-width:none;margin:auto;display:grid}.live-stage{grid-area:1/2;grid-template-rows:minmax(0,1fr) auto;gap:12px;min-width:0;min-height:0;display:grid}.live-video{color:#e9edf3;border:1px solid var(--line);background:#050607;border-radius:14px;width:100%;min-height:0;position:relative;overflow:hidden}.live-video .artplayer-host{width:100%;height:100%;position:absolute;inset:0}.live-placeholder{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex}.live-placeholder>svg{color:var(--accent)}.live-placeholder h2{font-size:20px;font-weight:500}.live-placeholder p{color:#abb4c0;font-size:13px}.live-player-message{text-align:center;pointer-events:none;background:#050607e8;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex;position:absolute;inset:0}.live-player-message>.spin{color:var(--accent)}.live-now{background:var(--surface);border:1px solid var(--line);border-radius:12px;align-items:center;gap:14px;min-width:0;padding:16px;display:flex}.live-now-copy{flex:1;min-width:0}.live-now-title{align-items:center;gap:10px;display:flex}.live-now h2{overflow-wrap:anywhere;font-size:16px;font-weight:600}.live-now p{color:var(--muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:5px;font-size:12px;line-height:1.6;display:-webkit-box;overflow:hidden}.live-tag{color:var(--accent);background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);white-space:nowrap;border-radius:5px;padding:3px 7px;font-size:10px}.live-reconnect{border:1px solid var(--line);background:var(--surface2);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;gap:7px;min-height:40px;padding:8px 12px;font-size:12px;display:flex}.live-reconnect:hover{color:var(--accent);border-color:var(--accent)}.live-browser{border:1px solid var(--line);background:var(--surface);border-radius:14px;flex-direction:column;grid-area:1/1;min-width:0;min-height:0;display:flex;overflow:hidden}.live-tools{border-bottom:1px solid var(--line);flex-shrink:0;padding:14px}.live-browser-heading{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.live-browser-heading h1{font-size:15px;font-weight:600}.live-browser-heading>span{color:var(--muted);font-size:11px}.live-search{border:1px solid var(--line);background:var(--surface2);color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:10px;display:flex}.live-search svg{flex-shrink:0}.live-search input{color:var(--text);background:0 0;border:0;outline:0;width:100%;min-width:0;font-size:12px}.live-search:focus-within{outline:2px solid var(--accent);outline-offset:2px}.live-directory{flex-direction:column;flex:1;min-height:0;display:flex}.live-regions{border-bottom:1px solid var(--line);flex-wrap:wrap;flex-shrink:0;gap:5px;padding:10px;display:flex}.live-region-heading{display:none}.live-regions button{color:var(--muted);background:0 0;border:0;border-radius:5px;min-height:32px;padding:7px 9px;font-size:12px}.live-regions button:hover{background:var(--surface2)}.live-regions button[data-active=true]{background:var(--accent-soft);color:var(--accent);font-weight:650}.live-channel-scroll{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;flex:1;min-height:0;padding:0 6px 6px;overflow-y:auto}.live-channel-scroll:focus-visible{outline-offset:-3px}.live-channels{flex-direction:column;gap:2px;display:flex}.live-channel{text-align:left;background:0 0;border:0;border-radius:6px;align-items:center;gap:9px;width:100%;min-height:49px;padding:8px;display:flex;position:relative}.live-channel:hover{background:var(--surface2)}.live-channel[aria-pressed=true]{background:var(--accent-soft);color:var(--accent)}.live-channel-number{text-align:right;font-variant-numeric:tabular-nums;width:24px;color:var(--muted);flex-shrink:0;font-size:10px}.live-logo{width:30px;min-width:0;height:30px;min-height:0;color:var(--muted);flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.live-logo img{object-fit:contain;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;max-height:100%;display:block}.live-now>.live-logo{border:1px solid var(--line);background:var(--surface2);border-radius:8px;width:46px;height:46px;padding:4px}.live-channel-copy{flex:1;min-width:0}.live-channel-copy strong{overflow-wrap:anywhere;font-size:12px;font-weight:500;line-height:1.5}.live-channel-icon{color:var(--accent);flex-shrink:0}.live-empty{text-align:center;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:32px 12px;font-size:13px;line-height:1.8;display:flex}@media (min-width:901px) and (max-width:1100px){.live-page{padding:12px var(--page-gutter);grid-template-columns:270px minmax(0,1fr);gap:10px}.live-now{gap:10px}.live-reconnect span{display:none}}@media (min-width:901px){.live-directory{grid-template-columns:88px minmax(0,1fr);display:grid}.live-regions{border-bottom:0;border-right:1px solid var(--line);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;background:var(--surface2);flex-flow:column;gap:0;min-height:0;padding:0;overflow-y:auto}.live-regions button{overflow-wrap:anywhere;border-radius:0;flex-shrink:0;min-height:44px;padding:11px 6px;position:relative}.live-regions button[data-active=true]{background:var(--surface);color:var(--accent)}.live-regions button[data-active=true]:after{content:"";background:var(--accent);width:3px;position:absolute;top:12px;bottom:12px;right:0}.live-channel-scroll{min-width:0;padding:0 4px 4px}.live-channel{gap:8px;padding:8px 6px}.live-channel-number{display:none}}@media (max-width:900px){.live-page{height:calc(100dvh - var(--live-header-height) - 64px - env(safe-area-inset-bottom,0px));flex-direction:column;gap:0;min-height:570px;padding:0;display:flex}.live-stage{flex-direction:column;flex-shrink:0;gap:0;display:flex;overflow:visible}.live-video{aspect-ratio:16/9;border:0;border-radius:0;flex-shrink:0;max-height:42dvh}.live-placeholder{gap:10px;padding:16px}.live-placeholder>svg{width:28px;height:28px}.live-placeholder h2{font-size:16px}.live-placeholder p{font-size:11px}.live-now{border:0;border-bottom:1px solid var(--line);border-radius:0;gap:12px;padding:12px 16px}.live-now>.live-logo{background:0 0;border:0;width:42px;height:36px;padding:0}.live-now h2{font-size:16px}.live-now p,.live-tag{display:none}.live-reconnect{background:0 0;width:36px;min-height:36px;padding:0}.live-reconnect span{display:none}.live-browser{border:0;border-radius:0;flex:1;min-height:240px}.live-tools{align-items:center;gap:14px;padding:10px 16px;display:flex}.live-browser-heading{flex-shrink:0;margin:0}.live-browser-heading h1{font-size:13px}.live-browser-heading>span{display:none}.live-search{flex:1;padding:8px 10px}.live-search input{font-size:12px}.live-directory{grid-template-columns:88px minmax(0,1fr);min-height:0;display:grid}.live-regions{border-bottom:0;border-right:1px solid var(--line);overscroll-behavior:contain;scrollbar-width:none;background:var(--surface2);flex-flow:column;gap:0;padding:0;display:flex;overflow-y:auto}.live-region-heading{color:var(--accent);text-align:center;padding:16px 8px 12px;font-size:13px;display:block}.live-region-heading:after{content:"";background:var(--accent);width:24px;height:2px;margin:10px auto 0;display:block}.live-regions button{border-radius:0;flex-shrink:0;min-height:46px;padding:12px 8px;font-size:13px;font-weight:600;position:relative}.live-regions button[data-active=true]{background:var(--surface);color:var(--accent)}.live-regions button[data-active=true]:after{content:"";background:var(--accent);width:3px;position:absolute;top:13px;bottom:13px;right:0}.live-channel-scroll{min-width:0;padding:0 8px 4px}.live-channel{gap:12px;min-height:62px;padding:10px 8px}.live-channel-number{display:none}.live-channel .live-logo{width:38px;height:34px}.live-channel-copy strong{font-size:14px;font-weight:400}.live-channel[aria-pressed=true]{background:0 0}.live-channel-icon{width:17px}}@media (max-width:360px){.live-directory{grid-template-columns:72px minmax(0,1fr)}.live-channel{gap:8px;padding-inline:4px}.live-channel .live-logo{width:30px}.live-channel-copy strong{font-size:13px}.live-tools{gap:10px;padding-inline:12px}}@media (prefers-reduced-motion:reduce){.live-page .spin{animation:none}}.live-equalizer{justify-content:center;align-items:center;gap:2px;width:18px;height:20px;display:flex}.live-equalizer i{transform-origin:50%;background:currentColor;border-radius:2px;width:2px;height:14px;display:block;transform:scaleY(.35)}.live-equalizer i:nth-child(2),.live-equalizer i:nth-child(4){height:18px;transform:scaleY(.6)}.live-equalizer i:nth-child(3){height:20px;transform:scaleY(.8)}.live-equalizer.is-playing i{animation:.85s ease-in-out infinite alternate live-equalizer-bounce}.live-equalizer.is-playing i:nth-child(2){animation-duration:.65s;animation-delay:-.35s}.live-equalizer.is-playing i:nth-child(3){animation-duration:.95s;animation-delay:-.6s}.live-equalizer.is-playing i:nth-child(4){animation-duration:.75s;animation-delay:-.15s}.live-equalizer.is-playing i:nth-child(5){animation-duration:.7s;animation-delay:-.45s}@keyframes live-equalizer-bounce{0%{transform:scaleY(.2)}to{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){.live-equalizer.is-playing i{animation:none}}.live-official-viewport{background:#050607;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.live-official-player{transform-origin:0 0;background:#050607;border:0;width:596px;max-width:none;height:596px;position:absolute;top:0;left:0}.live-channel .live-logo{width:52px;height:34px}.live-logo:has(img){background:0 0;border:0;border-radius:0;padding:0}.live-now>.live-logo:has(img){background:0 0;border:0;border-radius:0;padding:0}.live-now>.live-logo:has(img){width:64px;height:42px}.live-logo img{filter:drop-shadow(0 0 .5px #35405080)}html:not(.dark) .live-logo img[src^="/images/live/cctv-"]{filter:brightness(.52)contrast(1.2)}.dark .live-logo img{filter:drop-shadow(0 0 .5px #ffffff70)}@media (max-width:360px){.live-channel .live-logo{width:44px;height:30px}}.live-channel-group{flex-direction:column;gap:2px;min-width:0;padding-bottom:8px;display:flex;position:relative}.live-group-heading{z-index:1;background:var(--surface);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:6px;min-height:34px;margin:0 0 4px;padding:8px 6px;font-size:12px;font-weight:600;line-height:1.5;display:flex;position:sticky;top:0}.live-group-heading>span{overflow-wrap:anywhere;min-width:0}.live-group-heading small{color:var(--muted);flex-shrink:0;font-size:10px;font-weight:400}@media (max-width:900px){body:has(.live-page) .header-inner .primary-nav{display:none}body:has(.live-page) .header-inner{row-gap:0;padding-block:4px}.live-page{min-height:0}.live-video{max-height:32dvh}.live-now{gap:10px;min-height:48px;padding:4px 12px}.live-now>.live-logo:has(img){width:48px;height:30px}.live-now h2{font-size:14px}.live-reconnect{width:40px;min-height:40px}.live-browser{min-height:0}.live-tools{gap:10px;padding:5px 12px}.live-browser-heading{flex-direction:column;align-items:flex-start;gap:2px}.live-browser-heading>span{white-space:nowrap;font-size:10px;line-height:1.2;display:block}.live-search{padding:7px 10px}.live-region-heading{display:none}.live-regions button{min-height:44px;padding:10px 6px;font-size:12px}.live-channel{gap:10px;min-height:48px;padding:6px}.live-channel .live-logo{height:30px}.live-channel-copy strong{font-size:13px}.live-channel-scroll{isolation:isolate;contain:paint}.live-channels,.live-channel-group{display:block}.live-channel-group>.live-channel+.live-channel{margin-top:0}.live-channel-group{padding-bottom:0}.live-group-heading{isolation:isolate;min-height:26px;box-shadow:0 -2px 0 var(--surface);margin:0 -8px;padding:4px 14px}}@media (max-width:900px) and (max-height:500px) and (orientation:landscape){.live-page{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) minmax(280px,1fr);gap:8px;display:grid}.live-stage{grid-area:1/1;min-height:0}.live-stage .live-video{aspect-ratio:auto;flex:1;min-height:0;max-height:none}.live-browser{grid-area:1/2}}.live-official-link{pointer-events:auto;color:#fff;background:#ffffff18;border:1px solid #ffffff60;border-radius:6px;padding:10px 16px}
