:root{--bg: #1a1b1e;--panel: #232428;--panel-2: #2b2d31;--text: #e7e9ea;--muted: #9aa0a6;--accent: #5865f2;--danger: #ed4245;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:14px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app{display:grid;grid-template-columns:1fr minmax(240px,320px);height:100%}.stage{position:relative;display:flex;flex-direction:column;background:#000;min-width:0}video{flex:1;width:100%;min-height:0;background:#000;object-fit:contain}video.hidden{visibility:hidden;position:absolute}.placeholder,.gate,.fetching{position:absolute;top:0;right:0;bottom:52px;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:20px}.placeholder h1{margin:0;font-size:20px;font-weight:600}.placeholder p,.fetching p{margin:0;color:var(--muted)}.gate{background:#000000a6}.gate button{padding:12px 22px;font-size:15px;font-weight:600;border:0;border-radius:8px;background:var(--accent);color:#fff;cursor:pointer}.spinner{width:30px;height:30px;border:3px solid var(--panel-2);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:3s}}.controls{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--panel)}.icon{border:0;background:transparent;color:var(--text);font-size:17px;line-height:1;padding:6px 8px;border-radius:6px;cursor:pointer}.icon:hover{background:var(--panel-2)}.time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px;min-width:42px;text-align:center}.seek{flex:1;accent-color:var(--accent);min-width:0}.side{display:flex;flex-direction:column;gap:12px;padding:14px;background:var(--panel);border-left:1px solid #000;min-height:0}.add{display:flex;gap:8px}.add input{flex:1;min-width:0;padding:9px 10px;border-radius:7px;border:1px solid transparent;background:var(--panel-2);color:var(--text)}.add input:focus{outline:none;border-color:var(--accent)}.add button{padding:9px 14px;border:0;border-radius:7px;background:var(--accent);color:#fff;font-weight:600;cursor:pointer}.error{margin:0;color:var(--danger);font-size:12px}.queue{list-style:none;margin:0;padding:0;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:6px}.item{display:flex;gap:9px;align-items:center;padding:7px;border-radius:8px;background:var(--panel-2)}.item.current{outline:1px solid var(--accent)}.item.failed .item-meta{color:var(--danger)}.thumb{width:52px;height:30px;flex:none;border-radius:4px;background:#000 center / cover no-repeat}.item-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.item-title{all:unset;cursor:pointer;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item-title:hover{text-decoration:underline}.item-meta{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress{height:3px;border-radius:2px;background:#000;overflow:hidden}.progress div{height:100%;background:var(--accent);transition:width .3s linear}.item-remove{all:unset;cursor:pointer;color:var(--muted);padding:2px 5px;border-radius:4px}.item-remove:hover{color:var(--danger)}.watchers{display:flex;align-items:center;gap:8px}.label{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.users{display:flex;flex-wrap:wrap;gap:4px}.avatar{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:600;color:#fff}@media(max-width:720px){#app{grid-template-columns:1fr;grid-template-rows:minmax(0,45%) 1fr}.side{border-left:0;border-top:1px solid #000}}