
/* Spotify is a second source for the shared LBRank music dock. */
#rank-tab .rank-orb-card .rank-spotify-toggle {
    position: absolute !important;
    top: 57px !important;
    right: 12px !important;
    z-index: 40 !important;
    display: grid !important;
    place-items: center;
    width: 38px;
    height: 38px;
    margin: 0;
    padding: 5px;
    border-radius: 50%;
    border: 1px solid rgba(29,185,84,.45);
    background: rgba(4,14,10,.87);
    box-shadow: 0 4px 16px rgba(0,0,0,.24);
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
#rank-tab .rank-orb-card .rank-spotify-toggle svg {display:block;width:25px;height:25px}
#rank-tab .rank-orb-card .rank-spotify-toggle:focus-visible {
    outline: 2px solid #1db954;outline-offset:2px;
}
#rank-tab .rank-orb-card .rank-spotify-toggle:active {transform:scale(.95)}
@media(max-width:360px){
    #rank-tab .rank-orb-card .rank-spotify-toggle {top:53px!important;right:9px!important;width:36px;height:36px}
}
.spotify-modal[hidden],.spotify-modal-section[hidden]{display:none!important}
.spotify-modal {
    position:fixed;inset:0;z-index:2147483200;
    display:grid;place-items:center;
    padding:max(12px,env(safe-area-inset-top,0px)) 10px max(12px,env(safe-area-inset-bottom,0px));
    isolation:isolate;
}
.spotify-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,13,.88);backdrop-filter:blur(7px)}
.spotify-modal-panel {
    position:relative;box-sizing:border-box;
    display:flex;flex-direction:column;gap:13px;
    width:min(100%,540px);max-height:88vh;max-height:88dvh;
    overflow-y:auto;overscroll-behavior:contain;
    padding:17px;
    border:1px solid rgba(29,185,84,.35);
    border-radius:17px;
    background:var(--theme-secondary,#08101c);
    color:var(--theme-text,#fff);
    box-shadow:0 18px 50px rgba(0,0,0,.4);
    -webkit-overflow-scrolling:touch;
}
.spotify-modal-head,.spotify-modal-brand,.spotify-modal-footer{
    display:flex;align-items:center;gap:9px
}
.spotify-modal-head{justify-content:space-between}
.spotify-modal-brand h2{font-size:21px;margin:0;font-weight:850;color:var(--theme-text,#fff)}
.spotify-dot{width:19px;height:19px;flex:0 0 19px;background:#1db954;border-radius:50%}
.spotify-modal-close{
    display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;
    font:700 24px/1 system-ui,sans-serif;color:var(--theme-text,#fff);
    border:1px solid rgba(255,255,255,.24);border-radius:9px;background:rgba(255,255,255,.07);
}
.spotify-modal-section{display:grid;gap:9px;min-width:0}
.spotify-modal-panel label{
    color:var(--theme-text,#fff);font-size:12px;font-weight:800
}
.spotify-modal-panel input,
.spotify-modal-panel select {
    box-sizing:border-box;width:100%;min-width:0;min-height:42px;
    border:1px solid rgba(255,255,255,.24);border-radius:9px;
    padding:9px;font:500 16px/1.3 system-ui,sans-serif;
    color:var(--theme-text,#fff);background:rgba(2,8,18,.45)
}
.spotify-modal-panel button:not(.spotify-modal-close),.spotify-modal-panel a {
    padding:9px 12px;border-radius:9px;
    border:1px solid rgba(29,185,84,.38);
    background:rgba(29,185,84,.08);color:var(--theme-text,#fff);
    font:800 12px/1.3 system-ui,sans-serif;
    text-decoration:none;cursor:pointer;
}
.spotify-modal-panel .spotify-action-primary{
    background:#1db954!important;border-color:#1db954!important;color:#081509!important;
}
.spotify-modal-panel button:disabled{opacity:.45;cursor:not-allowed}
.spotify-modal-panel small,.spotify-status {
    color:var(--theme-text-muted,#b4c2d0);font-size:11px;line-height:1.5
}
.spotify-modal-panel a{color:inherit}
.spotify-modal-panel code{
    font-size:11px;overflow-wrap:anywhere;user-select:all;
    padding:9px;border:1px solid rgba(255,255,255,.12);border-radius:8px;
    color:#b9f7ce;background:rgba(0,0,0,.2)
}
.spotify-status{margin:0;min-height:30px}
.spotify-status.is-error{color:#ff939a}
.spotify-device-controls{display:grid;gap:8px}
.spotify-search-form{display:grid;gap:8px}
.spotify-search-form>div{display:grid;grid-template-columns:minmax(0,1fr) 74px;gap:7px}
.spotify-search-results{display:grid;gap:6px;max-height:225px;overflow-y:auto}
.spotify-search-result{
    display:grid;grid-template-columns:37px minmax(0,1fr) 24px;
    gap:9px;align-items:center;text-align:left;width:100%;
    min-height:53px;
}
.spotify-search-result img{width:37px;height:37px;object-fit:cover;border-radius:5px}
.spotify-search-result .spotify-song-copy{display:grid;gap:4px;min-width:0}
.spotify-search-result strong,.spotify-search-result small{
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.spotify-modal-footer{flex-wrap:wrap}
.spotify-modal-panel button:focus-visible,.spotify-modal-panel input:focus-visible,
.spotify-modal-panel select:focus-visible,.spotify-modal-panel a:focus-visible{
    outline:2px solid #1db954;outline-offset:2px
}
body.spotify-modal-open{overflow:hidden}
body > #rankMusicPlayer[data-music-source="spotify"]{
    border-top-color:rgba(29,185,84,.55)!important;
}
body > #rankMusicPlayer[data-music-source="spotify"] .rank-music-playing-dot{
    background:#1db954;box-shadow:0 0 10px rgba(29,185,84,.45)
}
body > #rankMusicPlayer[data-music-source="spotify"] .rank-music-play-pause{
    border-color:rgba(29,185,84,.6);background:rgba(29,185,84,.18)
}

.spotify-modal-panel{width:min(100%,740px);max-height:94dvh;background:#121212;color:#fff}
.spotify-now-playing{display:grid;justify-items:center;gap:12px;padding:15px;background:#1d1d1d;border-radius:16px}
#spotifyNowCover{width:min(55vw,230px);height:min(55vw,230px);object-fit:cover;border-radius:10px}
#spotifyNowCover[hidden]{display:none}
.spotify-now-meta{display:grid;gap:5px;text-align:center}
.spotify-now-meta strong{font-size:18px}.spotify-now-meta small{color:#bbb;font-size:12px}
.spotify-now-controls{display:flex;align-items:center;gap:25px}
.spotify-now-controls button{font-size:23px!important;background:transparent!important;border:0!important}
#spotifyNowPlay{background:#1db954!important;color:#000!important;width:50px;height:50px;border-radius:50%!important}
.spotify-now-progress{display:flex;align-items:center;width:100%;gap:8px;font-size:11px}
.spotify-now-progress input{flex:1}
.spotify-now-volume{display:flex;gap:10px;align-items:center;width:min(100%,300px)}
.spotify-now-volume input{flex:1}
.spotify-library h3{margin:0 0 10px}
.spotify-library-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.spotify-library-tabs .selected{background:#1db954!important;color:#111!important}
.spotify-library-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;max-height:300px;overflow-y:auto}
.spotify-library-card{display:flex!important;flex-direction:column;text-align:left;gap:5px;min-width:0;background:#252525!important}
.spotify-library-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px}
.spotify-library-card strong,.spotify-library-card small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Standalone Spotify mini player, never reuses the local MP3 player. */
.spotify-now-controls svg,.spotify-mini-control svg{width:22px;height:22px;display:block;fill:#fff}
.spotify-now-controls button{display:grid;place-items:center;min-width:42px;min-height:42px;color:#fff!important}
.spotify-mini-player[hidden]{display:none!important}
.spotify-mini-player{
 position:fixed;z-index:2147482900;left:50%;transform:translateX(-50%);
 bottom:calc(72px + env(safe-area-inset-bottom,0px));width:min(calc(100% - 24px),560px);
 min-height:62px;display:flex;align-items:center;gap:5px;padding:7px;
 box-sizing:border-box;border:1px solid #ffffff25;border-radius:13px;
 background:#202c25;color:#fff;box-shadow:0 8px 25px #0009;
}
.spotify-mini-open{flex:1;min-width:0;display:flex;align-items:center;gap:9px;border:0;background:none;color:#fff;text-align:left;padding:0;cursor:pointer}
#spotifyMiniCover{width:46px;height:46px;flex:0 0 46px;object-fit:cover;border-radius:6px}
.spotify-mini-details{min-width:0;display:grid;gap:3px}
.spotify-mini-details strong,.spotify-mini-details small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spotify-mini-details strong{font-size:12px}.spotify-mini-details small{font-size:10px;color:#ccd6cf}
.spotify-mini-control{display:grid;place-items:center;flex:0 0 32px;width:32px;height:40px;padding:3px;border:0;background:none;color:#fff;font:700 21px/1 system-ui;cursor:pointer}
.spotify-mini-close{font-size:22px;color:#ddd}
@media(max-width:390px){.spotify-mini-player{gap:2px}.spotify-mini-control{flex-basis:27px;width:27px}.spotify-mini-details strong{font-size:11px}}

/* Spotify expands directly upward from its mini-player, flush with navigation. */
body > #spotifyMiniPlayer.spotify-mini-player {
 bottom:var(--lbrank-nav-core-height,58px)!important;
 left:0!important;right:0!important;transform:none!important;
 width:100%!important;max-width:100vw!important;
 border-radius:14px 14px 0 0!important;margin:0!important;
 border-bottom:0!important;
}
body > #spotifyModal.spotify-modal{
 position:fixed!important;
 inset:0 0 var(--lbrank-nav-core-height,58px)!important;
 display:flex!important;flex-direction:column;justify-content:flex-end;align-items:center;
 padding:0!important;z-index:2147483000;
}
body > #spotifyModal.spotify-modal[hidden]{display:none!important}
#spotifyModal .spotify-modal-backdrop{
 position:absolute;inset:0;background:rgba(0,0,0,.42);backdrop-filter:blur(3px)
}
#spotifyModal .spotify-modal-panel{
 position:relative;z-index:1;flex:none;
 width:100%!important;max-width:100vw!important;
 height:min(86dvh,850px);max-height:calc(100% - 12px)!important;
 border-radius:22px 22px 0 0!important;
 border:1px solid #ffffff24;border-bottom:0;
 box-shadow:0 -18px 45px #0008;
 padding:18px max(16px,env(safe-area-inset-left,0px)) 18px;
 overflow-y:auto;overscroll-behavior:contain;
}
#spotifyModal .spotify-modal-panel:before{
 content:'';display:block;align-self:center;flex:0 0 4px;
 width:42px;background:#777;border-radius:10px;margin:-8px 0 6px;
}
#spotifyModal .spotify-modal-close{border:0;background:#292929;border-radius:50%;font-size:24px}
#spotifyModal .spotify-modal-section{gap:14px}
#spotifyModal .spotify-now-playing{background:linear-gradient(170deg,#23372b,#171717)}
#spotifyModal .spotify-library-results{max-height:none;overflow:visible}
@media(min-width:768px){
 #spotifyModal .spotify-modal-panel{max-width:760px!important;border-radius:22px 22px 0 0!important}
}

/* Official Spotify iFrame API album / playlist view inside the expandable sheet. */
#spotifyEmbeddedView[hidden],#spotifyConnected .spotify-library[hidden],#spotifySearchForm[hidden],#spotifySearchResults[hidden]{display:none!important}
.spotify-embedded-view{display:grid;gap:13px;min-width:0}
.spotify-embed-head{display:flex;align-items:center;gap:13px;min-height:40px}
.spotify-embed-head strong{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.spotify-embed-head button{display:flex;align-items:center;gap:4px;background:#242424!important;color:#fff!important;flex:none;font-size:13px!important}
.spotify-embed-head svg{width:20px;height:20px}
.spotify-embed-mount{width:100%;min-height:400px;border-radius:12px;overflow:hidden;background:#181818}
.spotify-embed-mount iframe{display:block;width:100%!important;border:0;border-radius:12px}
.spotify-embed-status{font-size:12px;color:#aaa;margin:0}
.spotify-embed-status[hidden]{display:none}

/* Spotify library -> playlist -> player navigation. */
#spotifyEmbedPlayerView[hidden],#spotifyConnected .spotify-now-playing[hidden]{display:none!important}
.spotify-embed-player-view{display:grid;gap:14px;min-width:0}
.spotify-embed-player-view .spotify-embed-head svg{width:20px;height:20px}
.spotify-embed-player-view .spotify-embed-head button{display:flex;align-items:center;gap:4px}
.spotify-embed-player-view small{color:#aaa;font-size:12px}
#spotifyModal .spotify-embed-mount{min-height:400px}

.spotify-full-heading{margin:8px 0 0;color:#fff;font-size:16px}
.spotify-full-tracks{display:grid;gap:5px}
.spotify-full-track{display:flex!important;align-items:center;gap:10px;text-align:left;background:#252525!important;padding:12px!important;min-height:53px}
.spotify-full-track-copy{display:grid;gap:3px;min-width:0}
.spotify-full-track-copy span,.spotify-full-track-copy small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.spotify-full-track-copy small{color:#aaa}
.spotify-connect-player{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spotify-now-playing-expanded{display:none!important}

/* Spotify v2: native library / album pages matching Spotify embeds, Connect controls playback. */
#spotifyEmbeddedView .spotify-embed-mount{min-height:0!important;border-radius:12px;background:linear-gradient(145deg,#294534,#171717)}
.spotify-v2-collection{display:flex;align-items:center;gap:17px;padding:20px;min-height:130px}
.spotify-v2-collection h3{font-size:clamp(18px,5vw,27px);color:#fff;margin:0}
.spotify-v2-art{width:104px;height:104px;flex:0 0 104px;object-fit:cover;border-radius:7px}
#spotifyConnected .spotify-now-playing[hidden]{display:none!important}
#spotifyConnected .spotify-device-controls[hidden],
#spotifyConnected .spotify-modal-footer[hidden],
#spotifyConnected .spotify-help[hidden]{display:none!important}
#spotifyConnected .spotify-now-playing{display:grid!important}
#spotifyConnected .spotify-now-playing[hidden]{display:none!important}
#spotifyEmbedPlayerView .spotify-now-playing{margin-top:8px}
#spotifyEmbedPlayerView .spotify-connect-player{background:#1f1f1f;border-radius:12px;padding:12px}

/* Song artwork and smooth Spotify volume control */
.spotify-full-track .spotify-track-art,.spotify-search-result .spotify-track-art{width:46px;height:46px;flex:0 0 46px;object-fit:cover;border-radius:6px;background:#303030}
.spotify-full-track .spotify-track-art[hidden],.spotify-search-result .spotify-track-art[hidden]{display:none!important}
.spotify-full-track-copy{flex:1;min-width:0}
.spotify-search-result .spotify-track-art{width:38px;height:38px;flex-basis:38px}
.spotify-now-volume input[type=range]{appearance:auto!important;-webkit-appearance:auto!important;flex:1;min-width:0;touch-action:pan-x;accent-color:#1db954;cursor:pointer;height:24px;padding:0!important;background:transparent!important;border:0!important}

/* Independent audio players: Spotify sits flush to navigation, local dock stacks above it. */
body.spotify-mini-visible.rank-music-dock-visible > #rankMusicPlayer.rank-music-component:not([hidden]){
 bottom:calc(var(--lbrank-nav-core-height,58px) + 62px)!important;
 z-index:2147482902!important;
}
body.spotify-mini-visible.rank-music-dock-visible > #spotifyMiniPlayer.spotify-mini-player:not([hidden]){
 bottom:var(--lbrank-nav-core-height,58px)!important;
 z-index:2147482901!important;
}
body.rank-music-dock-visible:not(.spotify-mini-visible) > #rankMusicPlayer.rank-music-component:not([hidden]){
 bottom:var(--lbrank-nav-core-height,58px)!important;
}

/* Clean Spotify library and playback interface. */
#spotifyConnected .spotify-device-controls,#spotifyConnected .spotify-modal-footer,#spotifyConnected .spotify-help{display:none!important}
#spotifyModal .spotify-status:empty,#spotifyModal .spotify-status:not(.is-error){display:none!important}
#spotifyModal .spotify-status.is-error{color:#ffa8a8;background:#281414;padding:8px 10px;border-radius:7px}
#spotifyModal .spotify-embed-head{gap:8px}
#spotifyModal .spotify-embed-head button{padding:5px!important;min-width:36px;min-height:36px;background:transparent!important;border:0!important;color:white!important}
#spotifyModal .spotify-embed-head button svg{width:24px;height:24px}
#spotifyModal .spotify-full-heading{display:none!important}
#spotifyModal .spotify-full-tracks{display:flex;flex-direction:column;gap:0;background:#121212}
#spotifyModal .spotify-full-track{width:100%;display:flex!important;align-items:center;gap:12px;border:0!important;border-bottom:1px solid #252525!important;border-radius:0!important;background:#121212!important;padding:10px 4px!important;min-height:64px;box-shadow:none!important;color:#fff!important}
#spotifyModal .spotify-full-track:hover,#spotifyModal .spotify-full-track:focus-visible{background:#16261c!important}
#spotifyModal .spotify-full-track:active{background:#1b3422!important}
#spotifyModal .spotify-full-track-copy span{font-size:14px;color:#fff;font-weight:650}
#spotifyModal .spotify-full-track-copy small{font-size:12px;color:#aaa}
#spotifyModal .spotify-full-track .spotify-track-art{width:45px;height:45px;flex-basis:45px;border-radius:4px}
#spotifyModal .spotify-library-results{background:#121212;gap:0}
#spotifyModal .spotify-library-card{background:#121212!important;border:0!important;border-bottom:1px solid #242424!important;border-radius:0!important;box-shadow:none!important}
#spotifyModal .spotify-library-tabs .selected{background:#1db954!important;color:#000!important}
#spotifyModal .spotify-now-playing{background:#101010!important}
#spotifyModal .spotify-now-meta{background:transparent!important}
#spotifyModal .spotify-now-meta strong{color:#1db954}

/* Header and grab handle are the gesture surface; lists continue scrolling normally. */
#spotifyModal .spotify-modal-head{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;min-height:50px}
#spotifyModal .spotify-modal-head:active{cursor:grabbing}
#spotifyModal .spotify-modal-close{display:none!important}
#spotifyModal .spotify-modal-panel{will-change:transform}

/* True, independently touchable grab handle above the scroll view. */
#spotifyModal .spotify-drag-handle{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;min-height:31px;width:100%;touch-action:none;cursor:grab;flex-shrink:0}
#spotifyModal .spotify-drag-handle span{display:block;width:42px;height:5px;border-radius:6px;background:#777}
#spotifyModal .spotify-modal-panel:before{display:none!important}
#spotifyModal .spotify-modal-head{touch-action:none}
#spotifyModal .spotify-now-volume{display:none!important}
#spotifyNowPlay svg,#spotifyMiniPlay svg{display:block;width:23px;height:23px;fill:currentColor}
#spotifyNowPlay .spotify-icon-pause,#spotifyMiniPlay .spotify-icon-pause{display:none}
#spotifyNowPlay.is-playing .spotify-icon-play,#spotifyMiniPlay.is-playing .spotify-icon-play{display:none}
#spotifyNowPlay.is-playing .spotify-icon-pause,#spotifyMiniPlay.is-playing .spotify-icon-pause{display:block}
#spotifyNowPlay{display:grid!important;place-items:center;color:#000!important}
#spotifyMiniPlay{display:grid!important;place-items:center;color:#fff!important}

/* Keep the original MP3 play button on the same right-hand vertical axis as Spotify. */
#rank-tab .rank-orb-card #rankMusicToggle{
  left:auto!important;
  right:12px!important;
  width:38px!important;
  height:38px!important;
  box-sizing:border-box!important;
}
@media(max-width:360px){
  #rank-tab .rank-orb-card #rankMusicToggle{
    right:9px!important;
    width:36px!important;
    height:36px!important;
  }
}

/* Spotify Liked Songs: unobtrusive row heart and filled green saved state */
#spotifyModal .spotify-track-row{display:flex;align-items:center;background:#121212;border-bottom:1px solid #252525;min-width:0}
#spotifyModal .spotify-track-row>.spotify-full-track,#spotifyModal .spotify-track-row>.spotify-library-card,#spotifyModal .spotify-track-row>.spotify-search-result{flex:1;min-width:0;border-bottom:0!important}
#spotifyModal .spotify-like-button{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;padding:9px!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#a3a3a3!important;box-shadow:none!important;cursor:pointer}
#spotifyModal .spotify-like-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#spotifyModal .spotify-like-button.liked{color:#1db954!important}
#spotifyModal .spotify-like-button.liked svg{fill:#1db954;stroke:#1db954}
#spotifyModal .spotify-like-button:disabled{opacity:.5}
#spotifyModal .spotify-like-button:focus-visible{outline:2px solid #1db954;outline-offset:1px}
#spotifyModal .spotify-player-like{justify-self:end}

/* Liked Songs only: one full-width, Spotify-style horizontal song per row. */
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"]{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;gap:0!important;width:100%}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-track-row{display:flex!important;flex-direction:row!important;align-items:center;width:100%;min-width:0;box-sizing:border-box}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-library-card{display:flex!important;flex:1 1 auto;flex-direction:row!important;align-items:center;text-align:left;gap:12px;width:auto;min-width:0;padding:9px 5px!important;background:transparent!important}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-library-card img{width:48px!important;height:48px!important;aspect-ratio:1!important;object-fit:cover;flex:0 0 48px}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-library-card strong{flex:1 1 auto;min-width:0;font-size:14px}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-library-card small{display:none}
#spotifyModal #spotifyLibraryResults[data-spotify-section="tracks"] .spotify-like-button{flex:0 0 42px}
