:root{--jf-surface: rgba(16, 16, 20, .74);--jf-text: #f4f4f5;--jf-muted: rgba(244, 244, 245, .64);--jf-faint: rgba(244, 244, 245, .46);--jf-line: rgba(255, 255, 255, .1);--jf-track: rgba(255, 255, 255, .16);--jf-radius: 16px;--accent: #18d5e6}*{box-sizing:border-box;margin:0}html,body,#root{background:transparent;font-family:Inter,Roboto,Segoe UI,Helvetica,Arial,sans-serif;color:var(--jf-text);-webkit-font-smoothing:antialiased}.overlay{display:inline-block;width:360px;padding:14px 16px;border-radius:var(--jf-radius);background:var(--jf-surface);border:1px solid var(--jf-line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 30px #00000080;transform-origin:top left}.size-small{transform:scale(.82)}.size-medium{transform:scale(1)}.size-large{transform:scale(1.22)}.theme-neon{background:#0a0a10cc;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 20px color-mix(in srgb,var(--accent) 38%,transparent),0 10px 30px #00000080}.theme-minimal{background:#10101475;border-color:transparent;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:none;border-radius:12px}.overlay.animate,.overlay.animate .art,.overlay.animate .fill{transition:all .3s ease}.brand{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--jf-faint);margin-bottom:8px}.cta{margin-top:12px;font-size:12px;font-weight:500;color:var(--jf-text);border:1px solid color-mix(in srgb,var(--accent) 60%,transparent);background:color-mix(in srgb,var(--accent) 12%,transparent);border-radius:999px;padding:4px 11px;display:inline-block}.now,.placeholder{display:flex;align-items:center;gap:12px}.placeholder .title{color:var(--jf-text)}.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;background:var(--accent);box-shadow:0 0 10px color-mix(in srgb,var(--accent) 60%,transparent);animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}.art{width:56px;height:56px;border-radius:10px;object-fit:cover;flex-shrink:0;box-shadow:0 2px 8px #0006}.meta{flex:1;min-width:0}.title{font-weight:700;font-size:16px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.artist{font-size:13px;color:var(--jf-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.progress{margin-top:10px;display:flex;align-items:center;gap:8px}.bar{flex:1;height:5px;border-radius:999px;background:var(--jf-track);overflow:hidden}.fill{height:100%;border-radius:999px;background:var(--accent);transition:width .25s linear}.time{font-size:11px;color:var(--jf-faint);font-variant-numeric:tabular-nums;min-width:36px;text-align:right}.upnext{margin-top:12px;border-top:1px solid var(--jf-line);padding-top:10px}.upnext-label{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--jf-faint);margin-bottom:6px}.upnext-item{display:flex;align-items:center;gap:8px;font-size:13px;padding:3px 0;min-width:0}.upnext-item img{width:24px;height:24px;border-radius:5px;object-fit:cover;flex-shrink:0}.upnext-item .un-title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.upnext-item .un-artist{color:var(--jf-muted)}