:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0d0d0f;color:#f2f2f2}main{max-width:640px;margin:0 auto;padding:2rem 1.25rem 4rem}.now-playing{display:flex;gap:1.25rem;align-items:center;background:linear-gradient(160deg,#1a1a1f,#17171b);border:1px solid #232327;border-radius:16px;padding:1.25rem;margin-bottom:2rem;transition:border-color .3s ease}.now-playing.is-playing{border-color:rgba(29,185,84,.35)}.now-playing .meta{min-width:0;flex:1 1}.cover{width:96px;height:96px;border-radius:10px;object-fit:cover;flex-shrink:0;box-shadow:0 6px 20px rgba(0,0,0,.35)}.cover.placeholder{background:#232327}.now-playing .meta .title{font-weight:600;font-size:1.1rem}.now-playing .meta .artist,.now-playing .meta .title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-playing .meta .artist{color:#a0a0a8;font-size:.9rem}.badge-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.15rem}.badge{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#1db954}.offline{font-size:.7rem;color:#e0a030}.eq{display:inline-flex;align-items:flex-end;gap:2px;height:10px;opacity:.3}.eq span{width:2px;height:3px;background:#1db954;border-radius:1px}.now-playing.is-playing .eq{opacity:1}.now-playing.is-playing .eq span{animation:eq-bounce .9s ease-in-out infinite}.now-playing.is-playing .eq span:first-child{animation-delay:-.6s}.now-playing.is-playing .eq span:nth-child(2){animation-delay:-.3s}@keyframes eq-bounce{0%,to{height:3px}50%{height:10px}}.progress{margin-top:.6rem}.progress-bar{height:3px;background:#2a2a2f;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:#1db954;border-radius:2px;transition:width .9s linear}.progress-time{display:flex;justify-content:space-between;font-size:.68rem;color:#6a6a72;margin-top:.3rem}.skeleton,.skeleton-text{background:linear-gradient(90deg,#1c1c20 25%,#232327 37%,#1c1c20 63%);background-size:400% 100%;animation:skeleton-shine 1.4s ease infinite;border-radius:6px}.skeleton-text{display:inline-block;height:.9em;width:55%;vertical-align:middle}.skeleton-text.short{width:35%}@keyframes skeleton-shine{0%{background-position:100% 50%}to{background-position:0 50%}}h2{font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;color:#a0a0a8;margin-bottom:.75rem}.history-item{display:flex;gap:.75rem;align-items:center;padding:.5rem 0;border-bottom:1px solid #232327}.history-item img{width:40px;height:40px;border-radius:4px;object-fit:cover}.history-item .title{font-size:.9rem}.history-item .artist{font-size:.8rem;color:#a0a0a8}.history-item .time{margin-left:auto;font-size:.75rem;color:#6a6a72;white-space:nowrap}.load-more{display:block;width:100%;margin-top:1.25rem;padding:.65rem;background:#17171b;border:1px solid #232327;border-radius:10px;color:#f2f2f2;font-size:.85rem;cursor:pointer;transition:background .2s ease}.load-more:hover:not(:disabled){background:#1f1f24}.load-more:disabled{opacity:.6;cursor:default}