:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#0c101a;color:#eef0f8}*{box-sizing:border-box}body{margin:0}#app{max-width:1600px;margin:auto;padding:28px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.brand{font-size:24px;font-weight:900;letter-spacing:.18em;color:#c5acff}.eyebrow{font-size:10px;letter-spacing:.22em;color:#a9afc2}main{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px}.stage{min-width:0}video{display:block;background:#030508;width:100%;aspect-ratio:16/9;border:1px solid #303448;border-radius:18px}h1{font-size:28px;letter-spacing:-.03em;margin-bottom:8px}p{font-size:14px;color:#a9afc2;line-height:1.6}h2{font-size:15px;margin-top:0;letter-spacing:.05em}.channels{display:grid;gap:10px;max-height:77vh;overflow:auto;padding:2px}button{display:grid;gap:8px;cursor:pointer;text-align:left;padding:16px;background:#151b2a;border:1px solid #2b3246;border-radius:12px;color:inherit;font:inherit;transition:background .15s}button:hover{background:#252c40}button.selected{border-color:#b99bff;background:#2a2340}button:focus-visible{outline:2px solid #d5c3ff;outline-offset:2px}button strong{font-size:14px}button span{font-size:12px;color:#d4c9ea}button small{font-size:11px;color:#929cb5}@media(max-width:800px){#app{padding:16px}main{grid-template-columns:1fr}.channels{max-height:none;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.eyebrow{display:none}h1{font-size:23px}}