*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#101010;color:#f3f3f3;font:15px Inter,system-ui,sans-serif}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #58a6ff;outline-offset:4px}.topbar{position:sticky;top:0;z-index:2;background:#101010ed;backdrop-filter:blur(14px);display:flex;align-items:center;gap:28px;padding:18px 24px}.brand{border:0;background:none;display:flex;align-items:center;gap:10px;font-weight:650;white-space:nowrap}.brand b{color:#a1a1a1;font-weight:450}.brand-icon{background:#e3293e;color:white;width:35px;height:25px;display:grid;place-items:center;border-radius:8px;font-size:14px}.search{display:flex;border:1px solid #343434;border-radius:32px;overflow:hidden;max-width:850px;flex:1;margin:auto;height:50px}.search:focus-within{border-color:#4c91cf}.search input{background:transparent;border:0;outline:none;color:#eee;width:100%;min-width:0;padding:0 20px;font-size:17px}.search button{border:0;border-left:1px solid #343434;background:#2a2a2a;width:75px;flex-shrink:0}.search svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2}.session{font-size:13px;color:#c5d9ec;border:1px solid #214e77;background:#14283c;padding:12px 16px;border-radius:25px;white-space:nowrap}.session i{display:inline-block;width:7px;height:7px;background:#52bd93;border-radius:50%;margin-right:7px}main{padding:18px 24px 80px}.section-heading,.queue-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}h2{font-size:18px;font-weight:550;margin:0}.quiet{border:0;background:none;color:#aaa;padding:8px}#notice{color:#aaa;font-size:13px;min-height:19px;margin:0 0 16px}.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 22px}.card{min-width:0}.thumbnail{position:relative;display:block;border:0;padding:0;width:100%;background:#242424;border-radius:12px;overflow:hidden;aspect-ratio:16/9}.thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .2s}.thumbnail:hover img{transform:scale(1.04)}.duration{position:absolute;bottom:8px;right:8px;background:#000c;border-radius:4px;padding:2px 5px;font-size:12px;font-weight:600}.card h3{font-size:15px;line-height:1.45;margin:11px 0 5px;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card p{margin:3px 0;color:#999;font-size:13px}.card-actions{display:flex;gap:8px;margin-top:9px}.card-actions button{background:#242424;border:1px solid #333;border-radius:16px;padding:5px 12px;font-size:12px}.card-actions button:hover{background:#363636}.selected-mark{position:absolute;inset:0;display:grid;place-items:center;background:#0006}.selected-mark span{background:#3cbd71;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;font-size:24px}main.watching{display:grid;grid-template-columns:minmax(300px,38%) minmax(0,1fr);gap:36px}main.watching .grid{grid-template-columns:repeat(3,minmax(0,1fr))}.screen{aspect-ratio:16/9;min-height:200px;background:#000;border-radius:14px;overflow:hidden}.screen iframe{width:100%;height:100%}.watch-info{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}h1{font-size:18px;margin:0;line-height:1.4}#video-author{font-size:13px;color:#aaa;margin:5px 0}.live-badge{font-size:9px;letter-spacing:1px;color:#79c6a2;border:1px solid #254d39;border-radius:4px;padding:5px}.transport{display:flex;flex-wrap:wrap;gap:8px}.transport button,.seek-row button{border:1px solid #3a3a3a;background:#242424;border-radius:8px;padding:9px 12px}#play{background:#ededed;color:#141414}.seek-row{display:flex;align-items:center;gap:9px;color:#aaa;font-size:12px;margin:12px 0 24px}.seek-row input{width:75px;background:#1d1d1d;border:1px solid #393939;border-radius:6px;color:white;padding:6px}.queue-heading span{color:#999;font-size:12px}.queue{display:flex;flex-direction:column;gap:8px;max-height:320px;overflow:auto}.queue-item{display:flex;gap:12px;align-items:center;background:#1b1b1b;padding:10px;border-radius:9px}.queue-item.active{background:#2b2b2b}.queue-item>button:first-child{border:0;background:none;text-align:left;display:flex;gap:12px;align-items:center;flex:1;min-width:0}.queue-item img{width:110px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}.queue-item strong{font-size:13px;display:block}.queue-item small{display:block;color:#aaa;margin-top:5px}.remove{border:0;background:none;color:#999;padding:8px}.hint{font-size:11px;color:#777;line-height:1.6}.empty{text-align:center;padding:65px 20px;color:#777}.empty>span{font-size:55px;color:#444}.empty h3{color:#bbb}.empty p{font-size:14px}footer{position:fixed;bottom:0;left:0;right:0;z-index:3;background:#101010ef;border-top:1px solid #202020;padding:10px 24px;display:flex;justify-content:space-between;color:#666;font-size:11px}footer a{color:#777;text-decoration:none;margin-left:16px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(min-width:1900px){.grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:1200px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.session{display:none}main.watching .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.topbar{padding:12px;gap:12px;flex-wrap:wrap}.brand{font-size:13px}.search{height:42px;max-width:none;flex-basis:100%;order:2}.search input{font-size:14px}main{padding:12px 12px 70px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}main.watching{display:block}#watch{margin-bottom:28px}footer{padding:10px 12px}footer>span{display:none}}
.screen:fullscreen,.screen.expanded{width:100%;height:100%;aspect-ratio:auto;border-radius:0;background:#000}.screen.expanded{position:fixed;inset:0;z-index:100}.screen:fullscreen iframe,.screen.expanded iframe{width:100%;height:100%}#exit-fullscreen{display:none;position:absolute;top:14px;right:14px;z-index:2;background:#171717dd;border:1px solid #555;border-radius:8px;padding:9px 14px;color:#fff}.screen:fullscreen #exit-fullscreen,.screen.expanded #exit-fullscreen{display:block}
