*{margin:0;padding:0;box-sizing:border-box}:root{color-scheme:dark}html,body,#root{min-height:100dvh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a0f;color:#e0e0e0}img{display:block;max-width:100%}button{font:inherit}.container{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}.card{width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.live-badge{font-size:.7rem;font-weight:700;letter-spacing:.16em;padding:.35rem .9rem;border-radius:999px;background:#333;color:#666;transition:all .3s ease}.live-badge[data-active=true]{background:#1a0000;color:#f33;box-shadow:0 0 12px #f336;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.title{font-size:clamp(2.2rem,6vw,3rem);font-weight:700;letter-spacing:-.03em;color:#fff;line-height:1}.subtitle{font-size:.9rem;color:#666;letter-spacing:.14em;text-transform:uppercase}.now-playing{width:100%;margin-top:10px;display:flex;align-items:center;gap:14px;padding:12px;border:1px solid rgba(255,255,255,.06);border-radius:16px;background:#ffffff05}.cover{width:84px;height:84px;object-fit:cover;border-radius:12px;flex-shrink:0;background:#ffffff0a}.cover-placeholder{background:linear-gradient(135deg,#ffffff0d,#ffffff05)}.meta{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px;text-align:left}.track-title,.track-artist,.track-album{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-title{font-size:1rem;font-weight:600;color:#fff}.track-artist{font-size:.95rem;color:#d0d0d0}.track-album{font-size:.9rem;color:#8c8c95}.play-btn{margin-top:12px;width:88px;height:88px;border-radius:999px;border:2px solid #333;background:transparent;color:#e0e0e0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s ease,border-color .2s ease,color .2s ease,background .2s ease}.play-btn:hover:not(:disabled){border-color:#555;color:#fff;background:#ffffff0d}.play-btn:active:not(:disabled){transform:scale(.96)}.play-btn:disabled{opacity:.6;cursor:wait}@media(max-width:420px){.card{max-width:100%}.now-playing{gap:12px;padding:10px}.cover{width:72px;height:72px}}.progress-block{margin-top:10px;width:100%;display:flex;flex-direction:column;gap:6px}.progress-bar{width:100%;height:6px;border-radius:999px;overflow:hidden;background:#ffffff14}.progress-fill{display:block;height:100%;border-radius:999px;background:#e0e0e0;transition:width .8s linear}.progress-times{width:100%;display:flex;justify-content:space-between;font-size:12px;color:#8c8c95}