@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap";:root{--accent:#f6b23c;--text:#f4f6f9;--text-2:#d7dce4;--text-3:#aeb6c4;--surface:#13171f;--line:#222a36;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--text);background:#000;font-family:Inter,system-ui,sans-serif}h1,h2,p,ul,fieldset{border:0;margin:0;padding:0}ul{list-style:none}.block{display:block}.shrink-0{flex-shrink:0}.grow{flex:1 1 0}.muted{color:var(--text-3);font-size:14px}.narrow{display:none}.player{background:#000;height:100%;position:relative;overflow:hidden}.stage{position:absolute;inset:0}video{background:#000;width:100%;height:100%;position:absolute;inset:0}.shade{pointer-events:none;background:linear-gradient(#000000bf 0%,#0000 22% 62%,#000000e0 100%);position:absolute;inset:0}.bar-ui,.shade{transition:opacity .2s}[data-idle] .bar-ui,[data-idle] .shade{opacity:0;pointer-events:none}[data-idle]{cursor:none}@media (prefers-reduced-motion:reduce){.bar-ui,.shade,.spinner{transition:none;animation:none}}.ctl{color:var(--text);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;font:500 14px Inter,sans-serif;text-decoration:none;display:flex}.ctl:focus-visible,.scrub:focus-within,.volume input:focus-visible,.choice input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.round{border-radius:24px;width:48px;height:48px}.pill{border-radius:22px;gap:8px;height:44px;padding:0 14px}.round:hover,.pill:hover,.glass{background:#ffffff1a}.playbtn{border-radius:26px;width:52px;height:52px}.off{opacity:.5}.top{align-items:center;gap:16px;padding:24px 40px;display:flex;position:absolute;top:0;left:0;right:0}.titles{flex-direction:column;gap:2px;min-width:0;display:flex}.titles h1{font:700 22px Space Grotesk,sans-serif}.titles span{color:var(--text-2);font-size:14px}.bottom{flex-direction:column;gap:14px;padding:0 40px 28px;display:flex;position:absolute;bottom:0;left:0;right:0}.row{flex-wrap:wrap;align-items:center;gap:8px 6px;display:flex}.time{font-variant-numeric:tabular-nums;color:var(--text-2);font-size:15px}.livebadge{letter-spacing:.06em;background:#e5483d;border-radius:6px;padding:3px 8px;font-size:12px;font-weight:700}.volume{align-items:center;gap:10px;margin:0 8px;display:flex}.volume input{width:96px;height:4px;accent-color:var(--text)}.scrubrow{align-items:center;display:flex}.scrub{border-radius:4px;flex:1 1 0;align-items:center;height:20px;display:flex;position:relative}.scrub .bar{background:#ffffff38;border-radius:3px;height:5px;position:absolute;left:0;right:0}.scrub .buffered{background:#fff6;right:auto}.scrub .played{background:var(--accent);right:auto}.scrub .thumb{background:#fff;border-radius:8px;width:16px;height:16px;margin-left:-8px;position:absolute;box-shadow:0 0 0 4px #f6b23c59}.scrub input{opacity:0;cursor:pointer;width:100%;margin:0;position:absolute;inset:0}.preview{font-variant-numeric:tabular-nums;pointer-events:none;background:#13171feb;border:1px solid #2e3747;border-radius:6px;padding:4px 8px;font-size:13px;font-weight:600;position:absolute;bottom:26px;transform:translate(-50%)}.spinner{border:4px solid #ffffff40;border-top-color:var(--accent);pointer-events:none;border-radius:50%;width:48px;height:48px;margin:-24px;animation:.9s linear infinite spin;position:absolute;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}.loading{color:var(--text-3);place-items:center;display:grid;position:absolute;inset:0}.card{background:#13171feb;border:1px solid #2e3747;border-radius:20px;flex-direction:column;gap:18px;width:min(460px,100% - 48px);padding:28px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 24px 60px #00000080}.card h1,.card h2{font:600 26px/1.2 Space Grotesk,sans-serif}.synced{color:var(--text-3);align-items:center;gap:10px;font-size:13px;display:flex}.meter{flex-direction:column;gap:8px;display:flex}.meter .track{background:#2a3242;border-radius:2px;height:4px;overflow:hidden}.meter .track div{background:var(--accent);height:100%}.meter .ends{color:var(--text-3);justify-content:space-between;font-size:13px;display:flex}.actions{flex-wrap:wrap;gap:10px;display:flex}.primary,.secondary{border-radius:12px;height:50px;padding:0 18px;font-size:16px}.primary{background:var(--accent);color:#1a1204;flex:180px;font-weight:700}.secondary{background:#ffffff1f;flex:140px;font-weight:600}.nextcard{width:min(380px,100% - 48px);inset:auto 40px 130px auto;transform:none}.menu{background:#13171ff5;border:1px solid #2e3747;border-radius:16px;flex-direction:column;gap:16px;width:min(320px,100% - 32px);max-height:calc(100% - 220px);padding:18px;display:flex;position:absolute;bottom:110px;right:40px;overflow:auto}.drawer{border-radius:0;width:min(400px,100%);max-height:none;top:0;bottom:0;right:0}.menuhead{justify-content:space-between;align-items:center;display:flex}.menu h2,.menu legend,.upnext h2{letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:8px;font-size:12px;font-weight:700}.choice{cursor:pointer;align-items:center;gap:10px;min-height:40px;font-size:15px;display:flex}.choice input{accent-color:var(--accent)}.item{text-align:left;border-radius:10px;flex-direction:column;align-items:flex-start;gap:3px;width:100%;min-height:52px;padding:8px 12px;font-size:14px;font-weight:600}.item:hover{background:#ffffff0f}.item[aria-current]{color:var(--accent);background:#f6b23c24}.item .muted{font-size:12px;font-weight:400}@media (width<=599px){.wide{display:none}.narrow{display:flex}.player{background:#0a0c10;flex-direction:column;display:flex;overflow:auto}.stage{aspect-ratio:390/236;flex:none;position:relative;inset:auto}.shade{background:#00000073}.top{gap:0;padding:12px 8px}.top .round{background:0 0;width:44px;height:44px}.center{justify-content:center;align-items:center;gap:36px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.big{background:#ffffff2e;border-radius:32px;width:64px;height:64px}.bottom{padding:0 14px 12px}.scrubrow{font-variant-numeric:tabular-nums;gap:10px;font-size:12px}.scrubrow .round{width:32px;height:32px}.scrub .bar{height:4px}.scrub .thumb{width:14px;height:14px;box-shadow:none;margin-left:-7px}.card{background:#13171f;padding:20px;position:fixed}.card h1,.card h2{font-size:22px}.nextcard{inset:50% auto auto 50%;transform:translate(-50%,-50%)}.menu{border-radius:16px 16px 0 0;width:100%;max-height:70%;position:fixed;inset:auto 0 0}.below{flex-direction:column;gap:16px;padding:16px}.below .titles{gap:4px}.below .titles span{color:var(--text-3);font-size:13px}.status{background:var(--surface);border:1px solid var(--line);color:var(--text-2);border-radius:12px;align-items:center;gap:10px;padding:12px 14px;font-size:13px;display:flex}.status svg{color:#3dd6b5}.tools{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.tools .pill{background:var(--surface);border-radius:12px;flex-direction:column;gap:6px;height:64px;padding:0 4px;font-size:11px}.upnext{flex-direction:column;gap:6px;display:flex}}
