:root{color-scheme:dark;--accent:#36e873;--accent-soft:rgba(54,232,115,.25);--glass:rgba(17,24,20,.55);--line:rgba(255,255,255,.18);--text:#fff;--muted:rgba(255,255,255,.68);font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif}
*{box-sizing:border-box}html{min-height:100%;background:#050806}body{min-height:100vh;margin:0;overflow-x:hidden;color:var(--text);background:radial-gradient(circle at 50% 10%,var(--accent-soft),transparent 42rem),linear-gradient(145deg,#050806,#0a110d 58%,#030504)}button,input{font:inherit}
.ambient-cover{position:fixed;inset:-5%;z-index:-4;background-position:center;background-size:cover;filter:blur(70px) saturate(1.35);opacity:.24;transform:scale(1.12)}body::before{content:"";position:fixed;inset:0;z-index:-3;background:linear-gradient(180deg,rgba(2,5,3,.46),rgba(2,5,3,.84)),radial-gradient(circle at center,transparent,rgba(0,0,0,.5))}.aurora{position:fixed;z-index:-2;width:min(58vw,46rem);aspect-ratio:1;border-radius:50%;background:var(--accent);filter:blur(110px);opacity:.14;animation:float 12s ease-in-out infinite alternate}.aurora-one{top:-25%;right:-12%}.aurora-two{bottom:-35%;left:-15%;animation-delay:-5s;opacity:.1}@keyframes float{to{transform:translate3d(-4vw,5vh,0) scale(1.08)}}
.play-header{display:flex;align-items:center;width:min(48rem,calc(100% - 2rem));margin:auto;padding:calc(1rem + env(safe-area-inset-top)) 0 1rem}.brand{display:flex;align-items:center;gap:.65rem;color:inherit;text-decoration:none;font-weight:800;letter-spacing:-.02em}.brand img{width:2.25rem;height:2.25rem;border-radius:.72rem;object-fit:contain}
.glass-panel,.glass-button{border:1px solid var(--line);background:var(--glass);box-shadow:0 24px 80px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(32px) saturate(1.35);-webkit-backdrop-filter:blur(32px) saturate(1.35)}.glass-button{min-height:2.75rem;padding:0 1rem;border-radius:999px;color:var(--text);text-decoration:none;cursor:pointer}.glass-button:hover{background:rgba(255,255,255,.13)}
.player-shell{display:grid;grid-template-columns:minmax(0,48rem);gap:1rem;justify-content:center;width:min(48rem,calc(100% - 2rem));margin:auto;padding:.5rem 0 calc(2rem + env(safe-area-inset-bottom))}.player-card,.lyrics-card{border-radius:2.2rem}.player-card{display:grid;gap:1.25rem;padding:clamp(.85rem,3vw,1.6rem)}.artwork-wrap{position:relative;isolation:isolate;width:100%;aspect-ratio:1}.artwork-wrap img{display:block;width:100%;height:100%;object-fit:contain;border-radius:1.55rem;background:rgba(0,0,0,.34);box-shadow:0 28px 75px rgba(0,0,0,.45)}.playing-ring{position:absolute;inset:-.35rem;z-index:-1;border:2px solid transparent;border-radius:1.8rem;transition:.35s ease}.is-playing .playing-ring{border-color:var(--accent);box-shadow:0 0 32px var(--accent-soft)}
.song-copy{text-align:center}.eyebrow{margin:0 0 .35rem;color:var(--accent);font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.song-copy h1{margin:0;font-size:clamp(1.55rem,4.5vw,2.6rem);line-height:1.05;letter-spacing:-.045em}.status{min-height:1.25em;margin:.5rem 0 0;color:var(--muted);font-size:.8rem}.timeline input,.secondary-controls input{width:100%;accent-color:var(--accent)}.time-row{display:flex;justify-content:space-between;margin-top:.35rem;color:var(--muted);font-size:.72rem}.controls{display:flex;align-items:center;justify-content:center;gap:1.35rem}.control-button,.play-button{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:#fff;background:rgba(255,255,255,.08);cursor:pointer}.control-button{width:3rem;height:3rem}.play-button{width:4.65rem;height:4.65rem;color:#061008;background:linear-gradient(145deg,var(--accent),#b6ffd0);font-size:1.35rem;box-shadow:0 14px 40px var(--accent-soft);transition:transform .2s ease}.play-button:hover{transform:scale(1.04)}.play-button:disabled,.control-button:disabled{cursor:wait;opacity:.5}.secondary-controls{display:grid;grid-template-columns:auto minmax(5rem,1fr) auto;gap:.7rem;align-items:center}.secondary-controls .glass-button{font-size:.78rem}.explore-link{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;white-space:nowrap}.explore-link img{width:1.35rem;height:1.35rem;border-radius:.38rem;object-fit:contain}
.lyrics-card{padding:1rem;overflow:hidden}.lyrics-heading{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.4rem .5rem 1rem;border:0;color:inherit;background:transparent;text-align:left;cursor:pointer}.lyrics-heading small,.lyrics-heading strong{display:block}.lyrics-heading small{color:var(--accent);font-size:.65rem;letter-spacing:.15em}.lyrics-heading strong{margin-top:.15rem;font-size:1.2rem}.lyrics{display:grid;gap:.35rem;max-height:38rem;overflow:auto;padding:.5rem;scrollbar-width:thin;scrollbar-color:var(--accent-soft) transparent}.lyric-line{margin:0;padding:.5rem .65rem;border:0;border-radius:.8rem;color:rgba(255,255,255,.46);background:transparent;font-size:clamp(1rem,2vw,1.35rem);font-weight:650;line-height:1.4;text-align:left;transition:.25s ease}.lyric-line[data-time]{cursor:pointer}.lyric-line.active{color:#fff;background:rgba(255,255,255,.08);text-shadow:0 0 22px var(--accent)}.lyrics-card.collapsed .lyrics{display:none}.toast{position:fixed;left:50%;bottom:calc(1.5rem + env(safe-area-inset-bottom));z-index:10;padding:.7rem 1rem;border:1px solid var(--line);border-radius:999px;color:#fff;background:rgba(8,13,10,.86);backdrop-filter:blur(20px);opacity:0;transform:translate(-50%,1rem);transition:.25s ease;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:520px){.play-header,.player-shell{width:min(100% - 1rem,48rem)}.play-header{padding-bottom:.5rem}.player-card,.lyrics-card{border-radius:1.65rem}.player-card{gap:1rem;padding:.65rem}.artwork-wrap img{border-radius:1.2rem}.secondary-controls{grid-template-columns:auto 1fr}.explore-link{grid-column:1/-1}.lyrics-card{padding:.8rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}@media(prefers-reduced-transparency:reduce){.glass-panel,.glass-button{background:rgba(13,20,16,.94);backdrop-filter:none;-webkit-backdrop-filter:none}.ambient-cover,.aurora{opacity:.08}}
.playback-row{display:grid;grid-template-columns:2.75rem minmax(0,1fr);gap:.8rem;align-items:start}.compact-play-button{display:grid;width:2.75rem;height:2.75rem;margin-top:-.7rem;place-items:center;border:1px solid var(--line);border-radius:50%;color:#061008;background:linear-gradient(145deg,var(--accent),#b6ffd0);font-size:.95rem;box-shadow:0 10px 28px var(--accent-soft);cursor:pointer}.compact-play-button:disabled{cursor:wait;opacity:.5}.timeline{min-width:0}.volume-control{display:grid;grid-template-columns:1.5rem minmax(0,1fr) 1.8rem;gap:.75rem;align-items:center}.volume-control input{width:100%;accent-color:var(--accent)}.speaker-icon{width:1.5rem;height:1.5rem;fill:currentColor;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--muted)}.speaker-high{width:1.8rem;height:1.8rem;fill:currentColor}.speaker-high path:not(:first-child){fill:none}
.is-ios-mobile .volume-control{display:none}