:root{--radius-sm: 8px;--radius: 12px;--radius-lg: 16px;--radius-full: 100px}*{box-sizing:border-box}html{height:100%}body{min-height:100%;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;color:#1d222b;background:radial-gradient(1000px 700px at 82% -12%,oklch(90% .05 235deg / .45),transparent 62%),radial-gradient(820px 620px at -8% 108%,oklch(90% .05 60deg / .35),transparent 58%),#e9edf3;background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}@media(prefers-color-scheme:dark){body{color:#e4e8ef;background:radial-gradient(1100px 780px at 82% -12%,oklch(30% .09 235deg / .45),transparent 62%),radial-gradient(820px 620px at -8% 108%,oklch(26% .07 210deg / .35),transparent 58%),#06080d}}::selection{background:#64c4f059}@media(prefers-color-scheme:dark){::selection{background:#328bb073}}:focus-visible{outline:2px solid oklch(70% .1 230deg);outline-offset:2px}button{font:inherit}:root{--glass-tint-subtle: oklch(1 0 0 / .12);--glass-tint-neutral: oklch(1 0 0 / .2);--glass-tint-accent: oklch(.95 .045 180 / .24);--glass-edge: oklch(1 0 0 / .72);--glass-edge-hover: oklch(.3 .015 60 / .72);--glass-shadow-color: oklch(.2 .03 255 / .18);--glass-shadow-deep: oklch(.16 .04 255 / .28);--glass-blur-soft: 10px;--glass-blur-medium: 18px;--glass-blur-strong: 28px}@media(prefers-color-scheme:dark){:root{--glass-tint-subtle: oklch(.14 .025 265 / .2);--glass-tint-neutral: oklch(.14 .025 265 / .28);--glass-tint-accent: oklch(.29 .06 180 / .32);--glass-edge: oklch(1 0 0 / .19);--glass-edge-hover: oklch(1 0 0 / .45);--glass-shadow-color: oklch(.04 .03 265 / .5);--glass-shadow-deep: oklch(.02 .02 265 / .68)}}@layer components{.glass-surface{position:relative;--glass-blur: var(--glass-blur-medium);--glass-background: var(--glass-tint-neutral);--glass-shadow: inset 0 0 0 .5px var(--glass-edge), inset 0 4px 16px oklch(0 0 0 / .1), 0 8px 24px oklch(0 0 0 / .08);background:var(--glass-background);border:1px solid transparent;box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.2);backdrop-filter:blur(var(--glass-blur)) saturate(1.2)}.glass-surface[data-glass-liquid-active=true]{backface-visibility:hidden;contain:layout style;perspective:1000px;transform:translateZ(0);will-change:backdrop-filter,transform}.liquid-glass-filter{position:absolute;inset:0;z-index:-10;width:100%;height:100%;opacity:0;pointer-events:none;transform:translateZ(0);will-change:transform}.glass-surface[data-glass-tone=subtle]{--glass-background: var(--glass-tint-subtle)}.glass-surface[data-glass-tone=accent]{--glass-background: var(--glass-tint-accent)}.glass-surface[data-glass-elevation=flat]{--glass-shadow: inset 0 0 0 .5px var(--glass-edge)}.glass-surface[data-glass-elevation=floating]{--glass-shadow: inset 0 0 0 .5px var(--glass-edge), inset 0 4px 16px oklch(0 0 0 / .1), 0 24px 60px -24px var(--glass-shadow-deep), 0 8px 24px -14px var(--glass-shadow-color)}.glass-surface[data-glass-blur=soft]{--glass-blur: var(--glass-blur-soft)}.glass-surface[data-glass-blur=strong]{--glass-blur: var(--glass-blur-strong)}.glass-surface[data-glass-radius=sm]{border-radius:var(--radius-sm)}.glass-surface[data-glass-radius=md]{border-radius:var(--radius)}.glass-surface[data-glass-radius=lg]{border-radius:var(--radius-lg)}.glass-surface[data-glass-radius=full]{border-radius:var(--radius-full)}.glass-surface[data-glass-interactive=true]{transition:transform .18s cubic-bezier(.16,1,.3,1),border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.glass-surface[data-glass-interactive=true]:hover{border-color:var(--glass-edge-hover);box-shadow:inset 0 0 0 .5px var(--glass-edge),0 18px 42px -24px var(--glass-shadow-deep),inset 0 4px 16px #0000001a;transform:translate3d(0,-1px,0)}.glass-surface[data-glass-interactive=true]:active{transform:translateZ(0) scale(.995)}@supports ((-webkit-backdrop-filter: url(#liquid-glass-support)) or (backdrop-filter: url(#liquid-glass-support))){.glass-surface[data-glass-liquid-active=true]{-webkit-backdrop-filter:blur(var(--glass-blur)) var(--glass-liquid-filter) saturate(1.2);backdrop-filter:blur(var(--glass-blur)) var(--glass-liquid-filter) saturate(1.2)}}}@media(prefers-reduced-motion:reduce){.glass-surface[data-glass-interactive=true]{transition:none}.glass-surface[data-glass-interactive=true]:hover,.glass-surface[data-glass-interactive=true]:active{transform:none}.glass-surface[data-glass-liquid-active=true][data-glass-interactive=true]:hover,.glass-surface[data-glass-liquid-active=true][data-glass-interactive=true]:active{transform:translateZ(0)}}@media(forced-colors:active){.glass-surface{background:Canvas;border:1px solid CanvasText;box-shadow:none}.glass-surface[data-glass-liquid-active=true]{-webkit-backdrop-filter:none;backdrop-filter:none;transform:none;will-change:auto}.liquid-glass-filter{display:none}}@media(prefers-reduced-transparency:reduce){.glass-surface{background:var(--surface, Canvas);-webkit-backdrop-filter:none;backdrop-filter:none}.glass-surface[data-glass-liquid-active=true]{transform:none;will-change:auto}.liquid-glass-filter{display:none}}@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){.glass-surface{background:var(--surface, Canvas)}}:root{--studio-accent: oklch(.78 .11 230);--studio-frame: 20px;--studio-ease: cubic-bezier(.34, 1.56, .64, 1);--studio-move: .4s}.station{position:fixed;inset:0;overflow:hidden}.station-rail{position:absolute;top:var(--studio-frame);left:var(--studio-frame);z-index:30;display:flex;align-items:center;gap:16px;padding:10px 18px 10px 16px}.wordmark{display:inline-flex;align-items:center;gap:10px}.wordmark svg{width:24px;height:24px;fill:currentColor}.wordmark-name{font-size:.95rem;font-weight:800;letter-spacing:.08em}.station-bug{position:absolute;top:var(--studio-frame);right:var(--studio-frame);z-index:30;display:flex;align-items:baseline;gap:10px;padding:10px 16px;max-width:min(420px,40vw)}.bug-folder{font-size:.85rem;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bug-count{font-size:.72rem;opacity:.6;white-space:nowrap;font-variant-numeric:tabular-nums}.feed-stage{position:absolute;inset:0;background:#000}.feed-stage video{display:block;width:100%;height:100%;object-fit:contain}.feed-stage.receded{cursor:none}.feed-stage.receded .lower-third{opacity:0;transform:translateY(14px);pointer-events:none}.lower-third{position:absolute;left:var(--studio-frame);right:var(--studio-frame);bottom:var(--studio-frame);z-index:25;display:flex;align-items:center;gap:8px;padding:24px 18px 12px;transition:opacity .3s cubic-bezier(.3,0,.2,1),transform .3s cubic-bezier(.3,0,.2,1)}.now-title{flex:1;min-width:0;font-size:.9rem;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lower-third .scrub{position:absolute;top:6px;left:18px;right:18px;width:calc(100% - 36px);margin:0}.timecode{flex-shrink:0;font-size:.78rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.02em;opacity:.85}.control-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;border:none;background:transparent;color:inherit;cursor:pointer;border-radius:var(--radius-full);transition:background-color .15s ease}.control-button svg{width:18px;height:18px;fill:currentColor}.control-button:hover{background:#0000001a}@media(prefers-color-scheme:dark){.control-button:hover{background:#ffffff24}}.control-toggle.active{color:var(--studio-accent)}.lower-third input[type=range]{accent-color:var(--studio-accent);cursor:pointer}.lower-third input[type=range].volume{width:84px;flex:none}.channel-sweep{position:absolute;inset:0;z-index:20;overflow:hidden;pointer-events:none}.channel-sweep:before{content:"";position:absolute;top:0;bottom:0;left:-45%;width:45%;background:linear-gradient(90deg,transparent,oklch(.85 .06 230 / .22) 42%,oklch(.98 0 0 / .3) 50%,oklch(.85 .06 230 / .22) 58%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);animation:studio-sweep .6s cubic-bezier(.3,0,.2,1) forwards}@keyframes studio-sweep{to{transform:translate(380%)}}.standby{position:absolute;inset:0;display:grid;place-items:center;padding:24px;background:radial-gradient(60% 50% at 50% 42%,oklch(.32 .05 235 / .35),transparent 70%),#000}.standby-card{width:min(540px,92vw);padding:26px 30px 24px;display:flex;flex-direction:column;gap:12px}.standby-title{margin:0;font-size:1.55rem;font-weight:800;letter-spacing:-.01em}.standby-hint{margin:0;font-size:.92rem;line-height:1.55;max-width:48ch;opacity:.75}.key-legend{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;margin-top:8px;padding-top:14px;border-top:1px solid oklch(.45 .02 250 / .25)}.key-chip{justify-self:start;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.72rem;font-weight:600;padding:2px 8px;border-radius:6px;border:1px solid oklch(.45 .02 250 / .3);font-variant-numeric:tabular-nums;white-space:nowrap}.key-action{align-self:center;font-size:.8rem;opacity:.7}@media(prefers-color-scheme:dark){.key-legend{border-top-color:#ffffff29}.key-chip{border-color:#fff3}}app-home{position:absolute;top:84px;left:var(--studio-frame);z-index:28;display:block}.queue{display:flex;flex-direction:column;width:344px;height:calc(100vh - 104px);overflow:hidden;position:relative;transition:width var(--studio-move) var(--studio-ease),height var(--studio-move) var(--studio-ease)}.queue.queue-closed{width:148px;height:46px}.station.controls-docked .queue:not(.queue-closed){height:calc(100vh - 196px)}.queue-body{width:344px;height:100%;padding:18px;display:flex;flex-direction:column;gap:12px;opacity:1;transition:opacity .2s ease}.queue-closed .queue-body{opacity:0;pointer-events:none}.queue-spine{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:none;border:none;color:inherit;font:inherit;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s ease}.queue-closed .queue-spine{opacity:1;pointer-events:auto}.spine-chevron{width:18px;height:18px;fill:currentColor}.spine-label{font-size:.85rem;font-weight:700;letter-spacing:.02em}.spine-count{font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;padding:3px 10px;border-radius:var(--radius-full);background:#4d56601a}@media(prefers-color-scheme:dark){.spine-count{background:#ffffff1a}}.queue-head{display:flex;align-items:center;gap:10px}.queue-title{margin:0;font-size:1.02rem;font-weight:700;letter-spacing:-.01em}.queue-folder{margin:0;flex:1;min-width:0;font-size:.75rem;opacity:.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-collapse{flex-shrink:0;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:inherit;cursor:pointer;border-radius:var(--radius-full)}.queue-collapse svg{width:18px;height:18px;fill:currentColor}.queue-collapse:hover{background:#00000014}@media(prefers-color-scheme:dark){.queue-collapse:hover{background:#ffffff1a}}.library-actions{display:flex;flex-wrap:wrap;gap:8px}.library-actions button{padding:7px 13px;font-size:.8rem;color:inherit}.library-actions button:disabled{opacity:.45;cursor:default;transform:none}.status{margin:0;font-size:.8rem;line-height:1.5;opacity:.7}.status.error{opacity:1;color:#d93025}@media(prefers-color-scheme:dark){.status.error{color:#f28b82}}.media-list,.programme-list{list-style-type:none;margin:0;padding:0;flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:2px;scrollbar-width:thin;scrollbar-color:oklch(.6 0 0 / .4) transparent}.programme-list::-webkit-scrollbar{width:8px}.programme-list::-webkit-scrollbar-thumb{border-radius:100px;background:#80808059}.programme-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:none;background:transparent;font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:var(--radius-sm);transition:background .15s ease}.programme-item:hover,.programme-item:focus-visible{background:#0000000f}.programme-item.active{background:#328bb024}@media(prefers-color-scheme:dark){.programme-item:hover,.programme-item:focus-visible{background:#ffffff14}.programme-item.active{background:#64c4f024}}.programme-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.9rem;font-weight:700;letter-spacing:.02em}.programme-count{font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;padding:3px 10px;border-radius:var(--radius-full);background:#4d56601a}@media(prefers-color-scheme:dark){.programme-count{background:#ffffff1a}}.programme-chevron{width:18px;height:18px;fill:currentColor;flex-shrink:0;opacity:.6}.programme-back{display:flex;align-items:center;gap:6px;width:100%;padding:8px 10px;border:none;background:transparent;font:inherit;color:inherit;cursor:pointer;border-radius:var(--radius-sm);transition:background .15s ease}.programme-back:hover,.programme-back:focus-visible{background:#0000000f}@media(prefers-color-scheme:dark){.programme-back:hover,.programme-back:focus-visible{background:#ffffff14}}.programme-back svg{width:18px;height:18px;fill:currentColor;flex-shrink:0}.programme-back span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.85rem;font-weight:700;letter-spacing:.02em}.media-list::-webkit-scrollbar{width:8px}.media-list::-webkit-scrollbar-thumb{border-radius:100px;background:#80808059}.media-item{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:none;background:transparent;font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:var(--radius-sm);transition:background .15s ease}.media-item:hover,.media-item:focus-visible{background:#0000000f}.media-item.active{background:#328bb024}@media(prefers-color-scheme:dark){.media-item:hover,.media-item:focus-visible{background:#ffffff14}.media-item.active{background:#64c4f024}}.media-item .thumbnail,.media-item .no-thumbnail{width:80px;height:45px;object-fit:cover;border-radius:6px;flex-shrink:0}.media-item .no-thumbnail{background:#80808040}.entry-details{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.entry-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.9rem}.entry-path{font-size:.72rem;opacity:.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(prefers-reduced-motion:reduce){.channel-sweep{display:none}.queue,.queue-body,.queue-spine,.lower-third{transition:none}}
