
.guide-app{position:relative;z-index:1;height:100vh;display:flex;flex-direction:column;overflow:hidden}
.guide-head{flex-shrink:0}
.guide-head h1{margin-right:.8rem;font-size:1.1rem;letter-spacing:.04em}
.guide-head h1 span{color:var(--accent2)}
.grid-row.featured .grid-channel{border-left:3px solid var(--accent2);background:rgba(76,201,240,.08)}
@media(max-width:768px){
.guide-head{flex-wrap:wrap}
.listings-toolbar{flex-wrap:wrap;gap:.35rem}
.guide-preview{width:160px;height:90px}
.grid-channel{min-width:140px}
.epg-filters button,.cat-tab{padding:.3rem .45rem;font-size:.65rem}
}
@media(pointer:coarse){
.program-block,.grid-channel{min-height:48px}
.nav a,.nav button,.back-btn,.cat-tab,.epg-filters button{min-height:44px;min-width:44px}
}
@media(hover:none) and (pointer:coarse){
.guide-head h1{font-size:1.25rem}
.grid-channel{min-height:72px}
.ch-info b{font-size:.82rem}
}
/* Smart TV / large screen */
@media(min-width:1280px){
.guide-head h1{font-size:1.5rem}
.grid-channel{min-height:76px}
.ch-info b{font-size:.85rem}
.cat-tab,.epg-filters button{font-size:.85rem;padding:.5rem 1rem}
}
.program-block:focus-visible,.grid-channel:focus-visible,.cat-tab:focus-visible,.back-btn:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.unmute-btn,.nav button{background:var(--card);border:1px solid var(--border);color:var(--text);padding:.35rem .65rem;border-radius:8px;cursor:pointer;font-size:.78rem}
.nav button.on{border-color:var(--accent2);color:var(--accent2)}
.now-playing{flex:1;display:flex;align-items:center;gap:.6rem;font-size:.78rem;min-width:0;overflow:hidden}
.np-label{background:var(--accent);padding:2px 8px;border-radius:4px;font-size:.6rem;font-weight:700}
.np-title{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.np-show{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.listings-toolbar{display:flex;align-items:center;gap:.6rem;padding:.45rem 1rem;background:rgba(0,0,0,.55);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap}
.tb-date{font-size:.78rem;white-space:nowrap}
.tb-date strong{color:var(--accent2)}
#guide-search{flex:1;min-width:140px;max-width:280px;background:var(--card);border:1px solid var(--border);color:var(--text);padding:.4rem .7rem;border-radius:8px;font-size:.78rem}
.search-hint{font-size:.68rem;color:var(--accent2);min-width:120px}
.epg-filters{display:flex;gap:3px}
.epg-filters button{background:var(--card);border:1px solid var(--border);color:var(--muted);padding:3px 8px;border-radius:6px;cursor:pointer;font-size:.65rem}
.epg-filters button.on{border-color:var(--accent2);color:var(--text)}
.tb-count{color:var(--muted);font-size:.65rem}
.scroll-speed{display:flex;gap:2px;margin-left:auto}
.scroll-speed button{background:var(--card);border:1px solid var(--border);color:var(--muted);padding:3px 8px;border-radius:6px;cursor:pointer;font-size:.62rem}
.scroll-speed button.on{border-color:var(--accent2);color:var(--text)}
.category-tabs{display:flex;gap:4px;padding:.4rem 1rem;background:rgba(0,0,0,.4);border-bottom:1px solid var(--border);overflow-x:auto;flex-shrink:0}
.category-tabs::-webkit-scrollbar{height:4px}
.cat-tab{flex-shrink:0;background:var(--card);border:1px solid var(--border);color:var(--muted);padding:.35rem .85rem;border-radius:20px;cursor:pointer;font-size:.72rem;font-weight:600;transition:all .15s}
.cat-tab:hover,.cat-tab.on{border-color:var(--accent2);color:var(--text);background:rgba(76,201,240,.12)}
.cat-tab.on{box-shadow:0 0 0 1px var(--accent2)}
.listings-section{flex:1;min-height:0;display:flex;flex-direction:column;background:#0a0a12}
.guide-preview{display:flex;gap:.75rem;padding:.5rem 1rem;background:linear-gradient(180deg,rgba(20,20,32,.95),rgba(10,10,18,.9));border-bottom:1px solid var(--border);flex-shrink:0;align-items:center}
.guide-preview.hidden{display:none}
.gp-video{position:relative;width:200px;max-width:32vw;height:112px;max-height:18vh;flex-shrink:0;background:#000;border-radius:8px;overflow:hidden;border:2px solid var(--accent)}
.gp-video .fit-video{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;background:#000}
.fit-video{object-fit:contain!important;object-position:center center;background:#000}
.gp-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.7);color:var(--accent2);font-size:.6rem;text-align:center;padding:.4rem;pointer-events:none}
.gp-info{min-width:0;flex:1}
.gp-label{font-size:.58rem;color:var(--accent);font-weight:700;letter-spacing:.05em}
.gp-channel{font-size:.95rem;font-weight:700;margin-top:.15rem}
.gp-show{font-size:.72rem;color:var(--muted);margin-top:.2rem}
.grid-header-row{display:flex;flex-shrink:0;background:#12121f;border-bottom:2px solid var(--accent);z-index:20}
.grid-corner{width:200px;flex-shrink:0;padding:.5rem .75rem;font-size:.7rem;font-weight:700;color:var(--accent);border-right:1px solid var(--border)}
.grid-times-wrap{overflow:hidden;flex:1}
.grid-times{display:flex;will-change:transform}
.time-slot{flex:0 0 148px;width:148px;padding:.45rem;font-size:.67rem;font-weight:600;color:var(--accent2);border-right:1px solid var(--border);text-align:center}
.vertical-viewport{flex:1;overflow:hidden;position:relative}
.vertical-track{display:flex;flex-direction:column;animation:scrollUp var(--scroll-duration,3600s) linear infinite}
.vertical-track.scrolling{animation-play-state:running}
@keyframes scrollUp{0%{transform:translateY(0)}100%{transform:translateY(calc(-1 * var(--scroll-h,800px)))}}
.grid-pane{flex-shrink:0}
.listings-scroll-h{overflow-x:auto;overflow-y:hidden;position:relative}
.grid-body{position:relative;min-width:max-content}
.now-line{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);box-shadow:0 0 6px var(--accent);z-index:12;pointer-events:none}
.grid-row{display:flex}
.grid-row.active .grid-channel{background:rgba(255,61,90,.18);border-left:3px solid var(--accent)}
.grid-channel{width:200px;flex-shrink:0;display:flex;align-items:center;gap:.4rem;padding:.4rem .55rem;background:#14141f;border-bottom:1px solid var(--border);border-right:1px solid var(--border);cursor:pointer;min-height:68px}
.grid-channel:hover{background:rgba(76,201,240,.1)}
.ch-num{font-size:.6rem;color:var(--muted);font-weight:700;min-width:26px}
.grid-channel img,.ch-icon{width:34px;height:34px;object-fit:contain;border-radius:4px;background:#222}
.ch-info{min-width:0;flex:1}
.ch-info b{display:block;font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ch-info small{font-size:.57rem;color:var(--muted)}
.grid-timeline{position:relative;height:68px;border-bottom:1px solid var(--border);background:rgba(0,0,0,.22);flex:1}
.program-block{position:absolute;top:3px;bottom:3px;background:linear-gradient(135deg,rgba(38,38,58,.95),rgba(26,26,40,.95));border:1px solid var(--border);border-radius:5px;padding:.28rem .4rem;overflow:hidden;cursor:pointer}
.program-block:hover{border-color:var(--accent2);z-index:5}
.program-block.on-now{border-color:var(--accent);background:linear-gradient(135deg,rgba(255,61,90,.22),rgba(38,38,58,.95))}
.pb-title{font-size:.68rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-sub{font-size:.56rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-meta{display:flex;gap:3px;margin-top:2px;flex-wrap:wrap}
.pb-meta span{font-size:.52rem;color:var(--muted)}
.pb-rating{border:1px solid var(--border);padding:0 2px;border-radius:2px}
.pb-badge{font-size:.46rem;padding:1px 3px;border-radius:3px;font-weight:700}
.pb-badge.live{background:var(--accent);color:#fff}
.pb-badge.new{background:#2ecc71;color:#000}
.pb-badge.repeat{background:#555;color:#ccc}
.pb-badge.adult{background:#c41e5a;color:#fff}
.no-results{padding:2rem;text-align:center;color:var(--muted);font-size:.85rem}
body.fs-open{overflow:hidden}
.fullscreen-stage{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;z-index:100000;background:#000;flex-direction:column;overflow:hidden;box-sizing:border-box;pointer-events:auto}
.fullscreen-stage.show{display:flex}
.fs-bar{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:.55rem 1rem;background:rgba(0,0,0,.95);border-bottom:1px solid var(--border);position:relative;z-index:3}
.fs-bar span{font-weight:700;color:var(--accent2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50vw}
.fs-actions{display:flex;gap:.35rem;flex-shrink:0}
.fs-bar button,.fs-controls .back-btn{background:var(--card);border:1px solid var(--border);color:var(--text);padding:.4rem .75rem;border-radius:8px;cursor:pointer;font-size:.72rem;pointer-events:auto}
.fs-bar .live-btn{background:var(--accent);border-color:var(--accent)}
.fs-bar .back-btn,.fs-controls .back-btn{background:var(--accent2);color:#000;font-weight:700;border-color:var(--accent2)}
.fs-player-box{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#000;padding:0}
.fs-player-box .fit-video{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;object-position:center}
#fs-v{max-width:min(100vw,100%);max-height:100%}
.fs-overlay{position:absolute;inset:0;pointer-events:none;display:flex;align-items:center;justify-content:center;color:var(--accent2);font-size:.85rem;background:rgba(0,0,0,.4)}
.fs-controls{flex-shrink:0;display:flex;gap:.5rem;padding:.55rem 1rem;background:rgba(0,0,0,.85);justify-content:center;border-top:1px solid var(--border)}
.fs-controls button{background:var(--card);border:1px solid var(--border);color:var(--text);padding:.45rem .9rem;border-radius:8px;cursor:pointer;font-size:.75rem}
.cast-btn{background:var(--card);border:1px solid var(--border);color:var(--accent2);padding:.35rem .65rem;border-radius:8px;cursor:pointer;font-size:.68rem;font-weight:700}
.cast-btn.ready{border-color:var(--accent2);box-shadow:0 0 0 1px rgba(255,200,80,.25)}
.guide-head .cast-btn{min-height:36px}
@media (max-width:600px){.guide-head .cast-btn{padding:.3rem .45rem;font-size:.62rem}}
