/* The cluster extends the approved identity; logo and icon assets are untouched. */
.music-cluster{position:relative;background:#060607;color:#f4f3f0;margin:0 -40px 48px;padding:32px 40px 24px;overflow:hidden;isolation:isolate}
.cluster-header{max-width:1440px;margin:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;position:relative;z-index:2}.cluster-kicker{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#a5a5a7}.cluster-header h2{font-weight:400;font-size:clamp(30px,3.5vw,48px);letter-spacing:-.045em;margin:8px 0 0}.cluster-reset{font-size:14px;color:#b8b8ba;padding:12px 0}.cluster-reset span{font-size:20px;margin-left:14px}.cluster-reset:hover{color:white}
.cluster-stage{height:clamp(410px,41vw,610px);max-width:1500px;margin:0 auto;position:relative;touch-action:pan-y;background:radial-gradient(ellipse at 50% 50%,#14151970,transparent 66%)}.cluster-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.cluster-nodes{position:absolute;inset:0}.cluster-node{position:absolute;transform:translate(-50%,-50%);border-radius:50%;padding:0;border:0;background:transparent;color:#fff;min-width:44px;min-height:44px;touch-action:pan-y}.cluster-node>img{display:none}.cluster-node>span{display:block;padding:15px;font-size:clamp(12px,1.1vw,16px);line-height:1.2;text-shadow:0 1px 10px #000,0 1px 4px #000;overflow:hidden;max-height:100%}.cluster-node:focus-visible{outline:1px solid #fff;outline-offset:10px}.cluster-hover{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:14px;pointer-events:none;color:#c4c4c8;min-height:20px;margin:0}
.cluster-context{max-width:1140px;margin:8px auto 0;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;min-height:133px}.cluster-selected h3{font-size:clamp(26px,3.2vw,43px);font-weight:400;letter-spacing:-.04em;line-height:1.08;margin:8px 0}.cluster-selected>p{font-size:16px;color:#99999e;margin:0}.cluster-connection>p{font-size:16px;color:#b9b9bd;margin:0 0 17px;line-height:1.5}.cluster-actions{display:flex;align-items:center;gap:26px}.cluster-play{background:#e9e9e7;color:#171719;border:1px solid #fff8;box-shadow:inset 0 1px 1px #fff,0 3px 12px #0006;border-radius:40px;padding:11px 24px;font-size:14px}.cluster-play span{margin-left:8px}.cluster-open,.cluster-action{font-size:14px;padding:12px 0;color:#e4e4e4}.cluster-open:hover{text-decoration:underline;text-underline-offset:5px}.cluster-status{display:block;font-size:12px;color:#999;min-height:18px;margin-top:9px}.cluster-bottom{max-width:1440px;margin:22px auto 0;border-top:1px solid #ffffff17;padding-top:17px;display:flex;justify-content:space-between;gap:25px;color:#85858b;font-size:12px;line-height:1.6}.cluster-bottom p{margin:0}.cluster-bottom details{max-width:430px}.cluster-bottom summary{cursor:pointer;text-align:right}.cluster-bottom details[open] p{margin-top:14px}.cluster-list-toggle{text-decoration:underline;text-underline-offset:4px;font-size:13px;margin-top:12px;padding:0}.cluster-demo-collection{padding:10px 0 60px}.cluster-demo-collection h3{font-size:32px;font-weight:400;letter-spacing:-.04em}.cluster-demo-entry{font-size:14px;text-decoration:underline;text-underline-offset:5px;padding:12px 0}
.cluster-simple canvas{display:none}.cluster-simple .cluster-stage{height:auto;min-height:250px;padding:35px 0}.cluster-simple .cluster-nodes{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:22px}.cluster-simple .cluster-node{position:relative!important;left:auto!important;top:auto!important;transform:none;width:150px!important;height:150px!important;background:linear-gradient(135deg,#868990,#1c1e23 35%,#060609 58%,#60636a);border:1px solid #ffffff60;box-shadow:inset 0 2px 4px #fffc,0 10px 22px #0009;display:grid;place-items:center}.cluster-simple .cluster-node>img{display:block;width:80%;height:80%;object-fit:cover;border-radius:50%}.cluster-simple .cluster-droplet{width:60px!important;height:60px!important}.cluster-simple .is-focused{outline:1px solid #fff;outline-offset:6px}.cluster-simple .cluster-hover{position:relative;margin-top:28px}
@media(max-width:900px){.music-cluster{margin-inline:-24px;padding-inline:24px}.cluster-context{gap:28px}.cluster-bottom{flex-wrap:wrap}.cluster-bottom summary{text-align:left}}
@media(max-width:600px){.music-cluster{margin-inline:-18px;padding:26px 18px 20px}.cluster-stage{height:445px;margin-inline:-8px}.cluster-header{align-items:center;gap:12px}.cluster-header h2{font-size:32px}.cluster-reset{max-width:100px;text-align:right;font-size:12px}.cluster-reset span{margin-left:5px}.cluster-context{grid-template-columns:1fr;gap:18px;margin-top:12px}.cluster-selected h3{font-size:30px}.cluster-actions{gap:24px}.cluster-connection>p{font-size:14px;margin-bottom:13px}.cluster-bottom{margin-top:14px}.cluster-node>span{font-size:12px;padding:9px}.cluster-simple .cluster-node{width:115px!important;height:115px!important}.cluster-simple .cluster-droplet{width:50px!important;height:50px!important}}

#account-view:has(.music-cluster){max-width:none;padding-top:0;padding-inline:0}
#account-view>.music-cluster{margin-inline:0;padding-inline:4.5%;margin-bottom:40px}
#account-view>.music-cluster .cluster-stage{height:clamp(420px,42vw,600px)}
#account-view:has(.music-cluster)>.current-rotation{margin-inline:0}
@media(max-width:600px){#account-view>.music-cluster{padding-inline:18px}#account-view>.music-cluster .cluster-stage{height:435px}}
/* Keep the player glass, with a restrained optical edge rather than chrome. */
.player:not(.is-expanded){box-shadow:inset 0 1px 0 #ffffff26,inset 0 -1px 0 #0009,0 12px 38px #0005}
.player #play{box-shadow:inset 0 1px 1px #ffffff65,inset 0 -2px 3px #0002,0 3px 12px #0003;background-image:linear-gradient(160deg,#ffffff18,transparent 50%,#0000000d)}
/* Extend only the dark surface across the existing page gutters. */
.music-cluster{box-shadow:0 0 0 100vmax #060607;clip-path:inset(0 -100vmax)}
.cluster-node.no-cluster-image:after{content:attr(data-title);font-size:13px;line-height:1.2;text-shadow:0 1px 6px #000;padding:12px;display:block}
.cluster-node.no-cluster-image>img{display:none}
#account-view>.music-cluster.cluster-empty .cluster-stage{height:80px;min-height:0}
.cluster-empty .cluster-reset{display:none}
/* Details stay beside their node, including while the mesh is moving. */
.cluster-hover{z-index:5;bottom:auto;right:auto;width:230px;max-width:calc(100% - 16px);box-sizing:border-box;text-align:left;padding:13px 15px;margin:0;min-height:0;border:1px solid #ffffff25;border-radius:12px;background:#131416ed;box-shadow:0 8px 28px #0007;backdrop-filter:blur(16px);color:#fff;line-height:1.35;pointer-events:none}
.cluster-hover[hidden]{display:none}.cluster-hover strong{display:block;font-size:15px;font-weight:500}.cluster-hover span{display:block;font-size:13px;color:#bbb;margin-top:4px}.cluster-hover small{display:block;font-size:12px;color:#999;margin-top:8px}
.cluster-simple .cluster-hover{position:absolute;margin:0}
@media(max-width:600px){.cluster-hover{width:185px}}
/* Lightweight, unframed information beside the artwork. */
.cluster-hover{width:max-content;max-width:230px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;color:#fff;text-shadow:0 1px 6px #000,0 2px 18px #000;line-height:1.3}
.cluster-hover strong{font-size:15px;font-weight:500}.cluster-hover span{font-size:13px;color:#fff;opacity:.72;margin-top:3px}
@media(max-width:600px){.cluster-hover{max-width:170px}}

/* Discovery is a player mode: the page underneath retains its route and scroll. */
.player-modes,.player-discovery-status{display:none}
.player-discovery[hidden]{display:none!important}
.player.is-expanded .player-modes{display:flex;position:absolute;top:24px;left:50%;transform:translateX(-50%);gap:6px;z-index:4;white-space:nowrap}
.player-modes button{font:14px/1.2 var(--body);color:#ffffff80;padding:12px 16px;border-radius:30px;transition:color .25s,background .25s}
.player-modes button[aria-pressed="true"]{background:#ffffff12;color:#fff}
.player-modes button:hover{color:white}.player-modes button:focus-visible{outline:1px solid #fff;outline-offset:3px}
.player-modes button:disabled{opacity:.5}
.player.is-expanded .player-discovery-status:not(:empty){display:block;position:absolute;top:76px;left:20px;right:20px;text-align:center;color:#ffffffb3;font-size:13px;z-index:4}
.player.is-expanded.is-discovering{display:flex;flex-direction:column;overflow:hidden}
.player.is-discovering>.player-record{display:none}
.player.is-morphing-artwork .player-discovery{pointer-events:none}
.player.is-expanded.is-discovering>.transport{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(620px,calc(100% - 40px));z-index:3}
.player.is-expanded .player-discovery{position:absolute;inset:82px 0 155px;margin:0;padding:0 3%;background:transparent;box-shadow:none;clip-path:none;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;isolation:isolate}
.player-discovery .cluster-header,.player-discovery .cluster-bottom{display:none}
.player-discovery .cluster-stage{height:auto;min-height:230px;flex:1;width:100%;max-width:1500px;margin:0 auto;background:none}
.player-discovery .cluster-context{width:min(100%,980px);height:124px;min-height:124px;gap:24px;margin:6px auto 0;flex-shrink:0;grid-template-columns:1fr auto}
.player-discovery .cluster-selected h3{font-size:clamp(20px,2.2vw,30px);margin:4px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.player-discovery .cluster-selected>p{font-size:14px;color:#ffffff99}
/* One live song header is shared with Now playing. Keep a stable caption area
   as songs change, with the same title, artist links and current-song menu. */
.player-discovery .cluster-selected{min-width:0}
.player-discovery .player-metadata{display:block;min-width:0;max-width:100%}
.player.is-expanded .player-discovery .player-song-heading{justify-content:flex-start}
.player.is-expanded .player-discovery #player-title{font-size:clamp(20px,2.2vw,28px);text-align:left;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.player.is-expanded .player-discovery #player-artist{max-width:100%;font-size:14px}
.player.is-expanded .player-discovery #player-playlist{margin:9px 0 0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-discovery .cluster-connection>p,.player-discovery .cluster-play,.player-discovery .cluster-kicker{display:none}
.player-discovery .cluster-actions{justify-content:flex-end}
/* Reserve caption space: asynchronous playback messages must not resize the
   flex stage, change its node positions, or reflow the selected album title. */
.player-discovery .cluster-status{width:240px;max-width:240px;height:36px;min-height:36px;line-height:18px;overflow-y:auto;overflow-wrap:anywhere;text-align:right}
.player-discovery.cluster-simple .cluster-stage{height:auto;min-height:260px;flex:none;padding:24px 0}
.cluster-simple .cluster-node>img{mask-image:radial-gradient(circle,black 48%,transparent 72%);-webkit-mask-image:radial-gradient(circle,black 48%,transparent 72%)}
@media(max-width:600px){
 .player.is-expanded .player-modes{top:78px;width:max-content;max-width:calc(100% - 30px)}
 .player-modes button{font-size:13px;padding:10px 12px}
 .player.is-expanded .player-discovery{inset:126px 0 155px;padding-inline:10px}
 .player-discovery .cluster-stage{min-height:clamp(230px,calc((100vw - 20px)*1.2),570px)}
 .player.is-expanded .player-discovery-status:not(:empty){top:112px}
 .player-discovery .cluster-context{grid-template-columns:1fr;gap:4px;height:160px;min-height:160px}.player-discovery .cluster-selected h3{font-size:20px}
 .player-discovery .cluster-open{font-size:12px}.player-discovery .cluster-status{width:130px;max-width:130px;font-size:11px}
 .player-discovery .cluster-context:has(.player-metadata) .cluster-connection{display:flex;align-items:center;justify-content:space-between;gap:12px}
 .player-discovery .cluster-context:has(.player-metadata) .cluster-actions{order:2;flex-shrink:0}
 .player-discovery .cluster-context:has(.player-metadata) .cluster-status{flex:1;width:auto;max-width:none;margin:0;text-align:left}
}
@media(max-height:600px){.player.is-expanded .player-discovery{bottom:132px}.player-discovery .cluster-stage{min-height:180px}.player-discovery .cluster-context{margin-top:0}.player-discovery .cluster-selected h3{font-size:20px}.player-discovery .cluster-selected>p{font-size:12px}.player.is-expanded.is-discovering>.transport{bottom:12px;gap:8px}}
@media(prefers-reduced-motion:reduce){.player-modes button{transition:none}}

/* Clear water fallback: artwork fills the droplet rather than an inset coin. */
.cluster-simple .cluster-node{background:linear-gradient(145deg,#ffffff12,#ffffff03 50%,#a8d7ff0a);border:1px solid #ffffff35;box-shadow:inset 0 1px 3px #ffffff60,0 8px 24px #0003}
.cluster-simple .cluster-node>img{width:100%;height:100%;mask-image:radial-gradient(circle,black 45%,#0009 61%,transparent 73%);-webkit-mask-image:radial-gradient(circle,black 45%,#0009 61%,transparent 73%)}

/* Personal collection layout must not depend on the optional rotation carousel. */
#account-view:has(.music-cluster)>.account-section:not(.favorite-artists-section){max-width:1300px;margin-inline:auto;border-top:0}
#account-view>.music-cluster .cluster-bottom{border-top:0}
