:root{color-scheme:dark;--bg:#111113;--surface:#1b1b1e;--line:#2c2c30;--text:#f5f5f6;--muted:#a3a3ae;--mint:#c7f5d9;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0;padding-bottom:160px}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:5px}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}a{color:inherit;text-decoration:none}button{color:inherit}button:hover{filter:brightness(1.15)}[hidden]{display:none!important}.muted{color:var(--muted);font-size:14px}.site-header{height:100px;display:flex;align-items:center;justify-content:space-between;max-width:1600px;padding:0 56px;margin:auto}.brand{display:inline-flex;gap:12px;align-items:center;font-size:23px;font-weight:650;letter-spacing:-.7px}.brand svg{width:32px;height:32px;color:var(--mint)}.cache-settings{position:relative;z-index:3}.cache-settings summary{display:flex;align-items:center;gap:9px;cursor:pointer;list-style:none;color:var(--muted);font-size:13px;min-height:44px}.cache-settings summary::-webkit-details-marker{display:none}.cache-settings summary svg{width:19px;height:19px}.cache-popover{position:absolute;right:0;top:48px;width:310px;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 20px 70px #0007;font-size:14px;line-height:1.7}.cache-popover p{color:var(--muted);font-size:13px}.secondary{padding:10px 14px;min-height:44px;background:#303035;border:1px solid #424247;border-radius:8px}.message{text-align:center;max-width:500px;margin:140px auto;padding:30px}.message h1{font-size:25px;letter-spacing:-.7px}.message p{color:var(--muted);line-height:1.8}.loading-wave{font-size:50px;color:var(--mint);letter-spacing:7px}.album-hero{display:grid;grid-template-columns:334px minmax(0,1fr);align-items:center;gap:58px;max-width:1104px;margin:16px auto 52px;padding:0 0}.cover-wrap{aspect-ratio:1;width:100%;border-radius:7px;overflow:hidden;background:var(--surface);box-shadow:0 12px 40px #0005}.cover-wrap img{width:100%;height:100%;object-fit:cover}.cover-placeholder{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(ellipse at 15% 20%,#2d3c35,transparent 70%),#1c2020}.cover-placeholder svg{height:90px;width:90px;color:#8bad98;stroke-width:1}.album-info{min-width:0}.eyebrow{font-size:11px;font-weight:600;letter-spacing:3px;color:var(--mint);margin:0 0 14px}.album-info h1{font-size:clamp(36px,4.2vw,62px);line-height:1.08;letter-spacing:-2.3px;margin:0 0 15px;overflow-wrap:anywhere}.artist{font-size:20px;margin:0 0 16px;color:#c2c2c9}.description{font-size:14px;line-height:1.7;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;max-width:520px;margin:0 0 14px}.album-info .muted{margin:0 0 26px}.primary{display:inline-flex;align-items:center;gap:10px;border-radius:8px;background:var(--mint);color:#142019;min-height:46px;padding:12px 23px;font-size:14px;font-weight:650}.primary svg{width:17px;height:17px;fill:currentColor;stroke-width:0}.track-heading{display:flex;justify-content:space-between;align-items:center;margin:0 56px 13px;color:var(--muted);font-size:11px;letter-spacing:2px}.track-heading span+span{letter-spacing:0;font-size:12px}.tracks{list-style:none;margin:0 56px;padding:0;border-top:1px solid var(--line)}.track{border-bottom:1px solid #242428;border-radius:7px}.track button{width:100%;display:flex;align-items:center;text-align:left;min-height:80px;padding:16px 22px;background:transparent;border-radius:7px;gap:22px}.track button:hover{background:#ffffff05}.track.active button{background:#1d1d21}.track-number{width:20px;flex:none;font-size:14px;color:#8b8b97;font-variant-numeric:tabular-nums;text-align:center}.track.active .track-number{color:var(--mint)}.track-number svg{width:15px;height:15px;fill:currentColor;stroke:currentColor}.track-meta{min-width:0;flex:1}.track-title{display:block;font-size:16px;font-weight:550;letter-spacing:-.2px;overflow-wrap:anywhere}.track.active .track-title{color:var(--mint)}.track-artist{display:block;margin-top:7px;color:var(--muted);font-size:12px}.track-duration{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px}.cache-dot{color:var(--mint);font-size:10px}.player{position:fixed;bottom:0;left:0;right:0;z-index:2;min-height:138px;background:#19191deb;backdrop-filter:blur(22px);border-top:1px solid var(--line);display:grid;grid-template-columns:1fr minmax(300px,580px) 1fr;align-items:center;gap:30px;padding:20px 56px max(20px,env(safe-area-inset-bottom))}.now-playing{display:flex;align-items:center;gap:15px;min-width:0}.now-playing img,.mini-placeholder{width:64px;height:64px;border-radius:5px;object-fit:cover;flex:none}.mini-placeholder{background:#2a2d2c;display:grid;place-items:center;color:var(--mint);font-size:28px}.now-playing strong{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}.now-playing span{display:block;font-size:12px;color:var(--muted);margin-top:8px}.transport{width:100%}.transport-buttons{display:flex;align-items:center;justify-content:center;gap:22px;margin-bottom:14px}.icon-button{background:none;display:grid;place-items:center;width:44px;height:44px;color:#dadade;padding:9px}.icon-button svg{width:21px;height:21px;fill:currentColor;stroke-width:1.5}.play-toggle{width:42px;height:42px;background:var(--mint);color:#142019;display:grid;place-items:center;border-radius:50%}.play-toggle svg{width:24px;height:24px;fill:currentColor;stroke-width:0}.timeline{display:flex;align-items:center;gap:12px;width:100%;font-variant-numeric:tabular-nums;font-size:11px;color:var(--muted)}.timeline span{width:32px;flex:none}.timeline span:last-child{text-align:right}input[type=range]{accent-color:var(--mint);height:4px;width:100%;cursor:pointer;margin:8px 0;min-width:0}.volume-control{display:flex;align-items:center;justify-content:flex-end;gap:6px}.volume-control input{max-width:90px}.error{color:#ffb6b6;margin:24px 56px;line-height:1.6}
@media(min-width:1600px){main{max-width:1600px;margin:auto}}@media(max-width:1200px){.album-hero{margin:20px 56px 44px;grid-template-columns:280px minmax(0,1fr);gap:38px}.player{grid-template-columns:1fr 1.5fr;gap:22px}.volume-control{display:none}.now-playing strong{max-width:180px}}
@media(max-width:700px){body{padding-bottom:172px}.site-header{height:82px;padding:0 24px}.brand{font-size:21px}.cache-settings summary span{display:none}.cache-popover{width:280px}.album-hero{display:flex;flex-direction:column;align-items:stretch;margin:10px 24px 36px;gap:26px}.cover-wrap{max-width:360px;align-self:center}.album-info h1{font-size:38px;letter-spacing:-1.3px}.eyebrow{margin-bottom:10px}.artist{font-size:18px;margin-bottom:12px}.album-info .muted{margin-bottom:20px}.description{font-size:13px}.primary{padding:12px 22px;min-height:46px}.track-heading{margin:0 24px 12px}.tracks{margin:0 16px}.track button{min-height:76px;padding:14px 12px;gap:14px}.track-title{font-size:15px}.track-artist{font-size:12px}.player{display:flex;flex-wrap:wrap;gap:0;padding:12px 24px max(15px,env(safe-area-inset-bottom));min-height:148px}.now-playing{width:calc(100% - 60px);gap:12px;align-self:flex-start}.now-playing img,.mini-placeholder{width:42px;height:42px}.now-playing strong{max-width:calc(100vw - 160px);font-size:13px}.now-playing span{margin-top:5px;font-size:11px}.transport{width:100%;display:contents}.transport-buttons{position:absolute;right:22px;top:11px;gap:0;margin:0}.transport-buttons .icon-button{display:none}.play-toggle{height:42px;width:42px}.timeline{width:100%;margin-top:13px}.error{margin:20px 24px}.message{margin-top:90px}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s,filter .15s}.loading-wave{animation:pulse 1.2s infinite alternate}@keyframes pulse{to{opacity:.3}}}

.account-menu { position:relative; margin-left:auto; }
.account-menu summary { cursor:pointer; min-height:44px; display:flex; align-items:center; padding:0 12px; border:1px solid #3b3b40; border-radius:10px; font-size:14px; }
.account-popover { position:absolute; z-index:30; right:0; top:52px; width:min(340px,calc(100vw - 32px)); padding:18px; background:var(--surface,#1b1b1e); border:1px solid #44444b; border-radius:14px; box-shadow:0 16px 60px #0008; }
.account-popover p { color:#b0b0b8; font-size:14px; line-height:1.5; margin:12px 0; }
.account-popover button { min-height:44px; margin-top:8px; width:100%; }
.provider-google,.provider-apple { border:1px solid #777; background:#fff; color:#1f1f1f; padding:12px 16px; border-radius:8px; font-weight:500; }
.provider-apple { background:#000; color:#fff; }
.saved-album-link { display:block; padding:12px 0; color:#c7f5d9; border-bottom:1px solid #39393f; overflow-wrap:anywhere; }
.album-account-actions { margin:0 0 24px; }
@media(max-width:600px) { .site-header { gap:8px; flex-wrap:wrap; } .account-menu summary { max-width:110px; overflow:hidden; white-space:nowrap; } .cache-settings summary span { font-size:12px; } }