#ambient{filter:blur(50px)saturate(1.3)brightness(.5);opacity:0;z-index:0;background-position:50%;background-size:cover;transition:opacity 1.2s,background-image .4s;position:fixed;inset:-20%;transform:scale(1.2)}#ambient.on{opacity:.55}.top{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.wordmark{letter-spacing:.5px;color:var(--ui-text);font-size:12px;font-weight:700;line-height:1.6}.wordmark span{color:var(--ui-accent)}.status{text-transform:uppercase;letter-spacing:1px;color:var(--ui-text-muted);align-items:center;gap:7px;font-size:11px;display:flex}.dot{background:var(--ui-text-muted);border-radius:50%;width:8px;height:8px}.status.live{color:var(--ui-accent)}.status.live .dot{background:var(--ui-accent)}.cover-wrap{aspect-ratio:1;background:var(--highlight-low);border:1px solid var(--ui-edge);border-radius:12px;position:relative;overflow:hidden}#cover{object-fit:cover;width:100%;height:100%;display:block}.cover-fallback{color:var(--ui-text-muted);letter-spacing:1px;place-items:center;font-size:11px;display:grid;position:absolute;inset:0}.meta{min-height:46px;margin:18px 2px 20px}.title{color:var(--ui-text);text-overflow:ellipsis;white-space:nowrap;font-size:19px;font-weight:700;line-height:1.25;overflow:hidden}.artist{color:var(--ui-text-subtle);margin-top:3px;font-size:13px}.progress{align-items:center;gap:10px;margin-bottom:16px;display:flex}.progress.off{opacity:.5}.progress-time{color:var(--ui-text-muted);text-align:center;min-width:34px;font-size:11px}.progress-track{background:var(--ui-edge);border-radius:4px;flex:1;height:4px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--pine), var(--foam), var(--iris), var(--rose));clip-path:inset(0 calc(100% - var(--fill,0%)) 0 0);border-radius:4px;transition:clip-path 1s linear;position:absolute;inset:0}.progress-indeterminate{background:var(--pine);border-radius:4px;width:30%;animation:2.4s ease-in-out infinite progress-drift;position:absolute;top:0;bottom:0}@keyframes progress-drift{0%{left:-30%}to{left:100%}}@media (prefers-reduced-motion:reduce){.progress-indeterminate{opacity:.4;width:100%;animation:none;left:0}}.controls{align-items:center;gap:14px;display:flex}.play{background:var(--ui-accent);width:54px;height:54px;color:var(--base);cursor:pointer;border:none;border-radius:50%;flex:none;place-items:center;display:grid}.play:hover{filter:brightness(1.08)}.play:active{transform:scale(.94)}.play:disabled{background:var(--ui-edge);color:var(--ui-text-muted);cursor:not-allowed}.play svg{fill:currentColor;width:22px;height:22px}.play:focus-visible{outline:2px solid var(--ui-spark);outline-offset:3px}.vol{color:var(--ui-text-muted);flex:1;align-items:center;gap:9px;display:flex}.vol svg{fill:currentColor;flex:none;width:17px;height:17px}input[type=range]{appearance:none;background:linear-gradient(to right, var(--rose) var(--fill,80%), var(--ui-edge) var(--fill,80%));cursor:pointer;border-radius:4px;width:100%;height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--ui-text);border-radius:50%;width:14px;height:14px}input[type=range]::-moz-range-thumb{background:var(--ui-text);border:none;border-radius:50%;width:14px;height:14px}input[type=range]:focus-visible{outline:2px solid var(--ui-spark);outline-offset:4px}.card{z-index:1;background:var(--ui-panel);border:1px solid var(--ui-edge);border-radius:16px;width:100%;max-width:380px;padding:22px;position:relative}.foot{text-align:center;color:var(--ui-text-muted);margin-top:18px;font-size:11px}.foot b{color:var(--ui-spark);font-weight:500}:root{--bar-bg:#0000;--bar-tr:#19172499;--base:#191724;--surface:#1f1d2e;--overlay:#26233a;--muted:#6e6a86;--subtle:#908caa;--text:#e0def4;--love:#eb6f92;--gold:#f6c177;--rose:#ebbcba;--pine:#31748f;--foam:#9ccfd8;--iris:#c4a7e7;--highlight-low:#21202e;--highlight-med:#403d52;--highlight-high:#524f67;--battery:#90ee90;--workspace-button-inactive:#313244;--workspace-button-active:#a6adc8;--ui-bg:var(--base);--ui-panel:var(--surface);--ui-edge:var(--overlay);--ui-text:var(--text);--ui-text-muted:var(--muted);--ui-text-subtle:var(--subtle);--ui-accent:var(--love);--ui-spark:var(--gold)}*{box-sizing:border-box;margin:0;padding:0}button,input{font:inherit}html,body,#root{height:100%}:root{--font-mono:"Cascadia Code", "CaskaydiaCove Nerd Font", "CaskaydiaCove Nerd Font Mono", "Cascadia Mono", ui-monospace, Consolas, monospace}body{font-family:var(--font-mono);background:var(--ui-bg);color:var(--ui-text);min-height:100vh;overflow:hidden}#root{place-items:center;min-height:100vh;padding:24px;display:grid}