*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0a0b;color:#e8e6e3;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden;height:100vh;width:100vw}.tv-controls{position:fixed;top:0;left:0;right:0;z-index:10;background:#0a0a0b;padding:1rem 3rem .75rem;display:flex;flex-direction:column;gap:.75rem}.tv-header{display:flex;align-items:center;gap:1rem}.tv-header img{height:5rem;width:auto}.tv-header h1{font-size:2rem;font-weight:700;color:#e8e6e3;text-decoration:underline;text-decoration-color:#4ebcc2;text-underline-offset:.3em;text-decoration-thickness:3px}.tv-header .subtitle{color:#888;font-size:.85rem;margin-left:.5rem}.tv-header{justify-content:space-between}.tv-header-left{display:flex;align-items:center;gap:1rem}body{spatial-navigation:activate;-webkit-spatial-navigation:activate}:fullscreen,:fullscreen *{cursor:none!important}:-webkit-full-screen,:-webkit-full-screen *{cursor:none!important}:-moz-full-screen,:-moz-full-screen *{cursor:none!important}:-ms-fullscreen,:-ms-fullscreen *{cursor:none!important}*:focus{outline:none}.fullscreen-btn{background:#4ebcc226;border:2px solid #4EBCC2;color:#4ebcc2;padding:.6rem 1.2rem;border-radius:.75rem;font-size:.95rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .2s;white-space:nowrap;flex-shrink:0}.fullscreen-btn:hover,.fullscreen-btn:focus{background:#4ebcc2;color:#0a0a0b}.fullscreen-btn svg{width:1.2rem;height:1.2rem}.search-bar input{width:100%;max-width:500px;padding:.6rem 1rem;border-radius:.75rem;border:2px solid rgba(255,255,255,.1);background:#ffffff0d;color:#e8e6e3;font-size:.9rem;outline:none;transition:border-color .2s}.search-bar input:focus{border-color:#4ebcc2}.search-bar input::placeholder{color:#555}.cat-bar{display:flex;gap:.5rem;overflow-x:auto}.cat-btn{padding:.5rem 1.25rem;border-radius:.75rem;font-size:.95rem;font-weight:500;background:#ffffff0d;color:#888;border:2px solid transparent;cursor:pointer;white-space:nowrap;transition:all .2s}.cat-btn.active{background:#4ebcc2;color:#0a0a0b}.cat-btn.focused,.cat-btn:hover,.cat-btn:focus{border-color:#4ebcc2;color:#e8e6e3}.dur-bar{display:flex;gap:.4rem;overflow-x:auto}.dur-btn{padding:.35rem .9rem;border-radius:.5rem;font-size:.8rem;font-weight:500;background:#ffffff0d;color:#666;border:2px solid transparent;cursor:pointer;white-space:nowrap;transition:all .2s}.dur-btn.active{background:#4ebcc233;color:#4ebcc2}.dur-btn.focused,.dur-btn:hover,.dur-btn:focus{border-color:#4ebcc2;color:#e8e6e3}.channel-bar{display:flex;gap:1rem;overflow-x:auto;padding-bottom:.25rem;-ms-overflow-style:none;scrollbar-width:none}.channel-bar::-webkit-scrollbar{display:none}.channel-card{display:flex;flex-direction:column;align-items:center;gap:.3rem;cursor:pointer;flex-shrink:0;border:none;background:none;padding:0}.channel-avatar{width:3.5rem;height:3.5rem;border-radius:50%;overflow:hidden;border:2px solid transparent;background:#1a1a2e;display:flex;align-items:center;justify-content:center;transition:all .2s}.channel-avatar img{width:100%;height:100%;object-fit:cover}.channel-avatar .fallback{font-size:1.1rem;font-weight:700}.channel-card .ch-name{font-size:.65rem;color:#666;max-width:4.5rem;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .2s}.channel-card.active .channel-avatar{border-color:#4ebcc2;box-shadow:0 0 10px #4ebcc24d}.channel-card.active .ch-name{color:#4ebcc2;font-weight:600}.channel-card.focused .channel-avatar,.channel-card:hover .channel-avatar,.channel-card:focus .channel-avatar{border-color:#4ebcc2}.channel-card.focused .ch-name,.channel-card:hover .ch-name,.channel-card:focus .ch-name{color:#e8e6e3}.sort-bar{display:flex;gap:.4rem}.sort-btn{padding:.35rem .9rem;border-radius:.5rem;font-size:.8rem;font-weight:500;background:#ffffff0d;color:#666;border:2px solid transparent;cursor:pointer;white-space:nowrap;transition:all .2s}.sort-btn.active{background:#4ebcc233;color:#4ebcc2}.sort-btn.focused,.sort-btn:hover,.sort-btn:focus{border-color:#4ebcc2;color:#e8e6e3}.search-bar input.focused,.search-bar input:hover{border-color:#4ebcc2;box-shadow:0 0 10px #4ebcc24d}.grid-container{position:fixed;top:22rem;left:0;right:0;bottom:0;padding:1rem 3rem 2rem;overflow-y:auto;scroll-behavior:smooth}.grid-container::-webkit-scrollbar{display:none}.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}.video-grid{align-items:start}.video-card{border-radius:1rem;overflow:hidden;background:#141416;border:3px solid transparent;transition:all .25s ease;cursor:pointer}.video-card.focused,.video-card:hover,.video-card:focus{border-color:#4ebcc2;transform:scale(1.04);box-shadow:0 0 30px #4ebcc24d}.video-card .thumb{position:relative;width:100%;height:0;padding-bottom:56.25%;background:linear-gradient(135deg,#1a1a2e,#16213e);overflow:hidden}.video-card .thumb>*{position:absolute}.video-card .thumb img{top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.video-card.focused .thumb img,.video-card:hover .thumb img,.video-card:focus .thumb img{transform:scale(1.05);transition:transform .3s}.video-card .play-icon{top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;z-index:2}.video-card.focused .play-icon,.video-card:hover .play-icon,.video-card:focus .play-icon{opacity:1}.play-icon-circle{width:3.5rem;height:3.5rem;border-radius:50%;background:#4ebcc2e6;display:flex;align-items:center;justify-content:center}.play-icon-circle svg{width:1.5rem;height:1.5rem;fill:#0a0a0b;margin-left:2px}.video-card .duration{bottom:.5rem;right:.5rem;background:#000000d9;color:#fff;font-size:.75rem;font-family:monospace;padding:.15rem .4rem;border-radius:.25rem;z-index:2}.video-card .platform-badge{top:.5rem;left:.5rem;font-size:.65rem;font-weight:600;padding:.15rem .5rem;border-radius:.3rem;z-index:2}.badge-peertube{background:#f39c1233;color:#f39c12}.badge-youtube{background:#f003;color:red}.video-card .info{padding:.75rem 1rem;height:5.5rem;overflow:hidden}.video-card .info h3{font-size:.9rem;font-weight:600;line-height:1.3;height:2.34em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-card .info .channel{font-size:.78rem;color:#aaa;margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-card .info .date{font-size:.75rem;color:#888;margin-top:.15rem}.player-overlay{position:fixed;inset:0;z-index:50;background:#000;display:none;cursor:none}.player-overlay.active{display:flex;align-items:center;justify-content:center}.player-overlay video,.player-overlay iframe{width:100%;height:100%}.seek-indicator{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:52;background:#000000d9;color:#fff;font-size:1.3rem;font-weight:700;padding:.75rem 1.5rem;border-radius:1rem;pointer-events:none;opacity:0;transition:opacity .3s;white-space:pre-line;text-align:center;max-width:80%}.seek-indicator.show{opacity:1}.tv-debug{position:fixed;bottom:0;left:0;z-index:100;background:#000000d9;color:#0f0;font-family:monospace;font-size:11px;padding:3px 8px;pointer-events:none;white-space:pre}.player-back{position:fixed;top:1.5rem;left:1.5rem;z-index:51;padding:.5rem 1rem;background:#000000b3;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:.5rem;font-size:.85rem;cursor:pointer;display:none}.player-overlay.active+.player-back{display:block}.next-overlay{position:fixed;bottom:2rem;right:2rem;z-index:52;background:#000000d9;border:1px solid rgba(78,188,194,.4);border-radius:1rem;padding:1rem 1.5rem;max-width:400px;display:none}.next-overlay.active{display:block}.next-overlay .next-label{font-size:.75rem;color:#4ebcc2;font-weight:600;margin-bottom:.3rem}.next-overlay .next-title{font-size:.9rem;color:#e8e6e3;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.next-overlay .next-cancel{margin-top:.5rem;font-size:.75rem;color:#888;cursor:pointer}.next-overlay .next-cancel:hover{color:#e8e6e3}.loading{text-align:center;padding:4rem;color:#888}.spinner{width:2.5rem;height:2.5rem;border:3px solid rgba(78,188,194,.2);border-top-color:#4ebcc2;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1200px){.video-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){.video-grid{grid-template-columns:repeat(2,1fr)}.tv-controls{padding:.75rem 1.5rem .5rem}.grid-container{padding:1rem 1.5rem 2rem}}
