.youtube-header-actions { grid-column: 3; grid-row: 1; display: flex; gap: 1px; justify-content: flex-end; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .dialog-header { grid-template-columns: 76px minmax(0,1fr) 76px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #dialog-close { grid-column: 1; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .dialog-identity { padding: 30px 20px 26px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-mode="library"] { background: #f2f2f8; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #library-panel { display: block; background: transparent; padding: 0; margin: 0 14px 24px; text-align: start; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #library-panel[hidden] { display: none; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #library-panel p { display: block; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #library-panel p::before { display: none; }
#youtube-library { width: 100%; }
/* Keep the platform visible without spending a full playlist row on its heading. */
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-mode="library"][data-view="input"] .dialog-identity { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; padding: 24px 16px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-mode="library"][data-view="input"] .dialog-art { width: 64px; height: 64px; margin: 0; flex: none; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-mode="library"][data-view="input"] .dialog-service { margin: 0; font-size: 16px; }
.youtube-connect-card { padding: 24px 16px; background: white; border-radius: 20px; text-align: center; }
.youtube-connect-card p { color: #5e5b69; font-size: 15px; line-height: 1.6; max-width: 380px; margin: 0 auto 20px; }
.youtube-connect { border: 1px solid #d6d2de; border-radius: 10px; background: white; color: #26232e; padding: 12px 22px; font-size: 15px; font-weight: 600; min-height: 46px; }
.youtube-connect:hover { background: #f7f5fc; border-color: #b7a1e8; }
.youtube-connect:disabled { opacity: .55; cursor: progress; }
#youtube-link-connect { margin-top: 15px; width: 100%; }
.youtube-playlists { display: grid; gap: 8px; }
.youtube-playlist-card { display: flex; gap: 12px; align-items: center; width: 100%; min-height: 74px; padding: 12px; border: 1px solid transparent; border-radius: 14px; background: white; color: var(--ink); text-align: start; }
.youtube-playlist-card:hover { border-color: #d5c3ff; background: #fefdff; }
.youtube-playlist-card:disabled { opacity: .6; cursor: progress; }
.youtube-playlist-cover { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 9px; background: #e9e5f2; color: #9374c6; overflow: hidden; font-size: 24px; }
.youtube-playlist-cover img { width: 100%; height: 100%; object-fit: contain; }
.youtube-playlist-info { min-width: 0; flex: 1; display: grid; grid-template-columns: max-content minmax(0,1fr); gap: 2px 0; align-content: center; }
.youtube-playlist-info strong { grid-column: 1 / -1; min-width: 0; font-size: 16px; font-weight: 650; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.youtube-playlist-info > span { min-width: 0; color: #8b8793; font-size: 13px; line-height: 1.5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.youtube-playlist-info > span:only-of-type { grid-column: 1 / -1; }
.youtube-playlist-info > span + span::before { content: '·'; margin-inline: 7px; }
.youtube-chevron { color: #b7b4bd; font-size: 24px; line-height: 1; flex: none; }
[dir="rtl"] .youtube-chevron { transform: rotate(180deg); }
.youtube-or { display: flex; gap: 16px; align-items: center; margin: 20px 0; font-size: 14px; color: #92909a; }
.youtube-or::before,.youtube-or::after { content: ''; height: 1px; flex: 1; background: #dddae4; }
.youtube-link-card { display: flex; align-items: center; gap: 12px; width: 100%; padding: 16px; border: 1px solid transparent; border-radius: 14px; background: #ebe5fa; color: #30253e; text-align: start; }
.youtube-link-card:hover { border-color: #c9b0fc; }
.youtube-link-card > svg { width: 26px; height: 26px; flex: none; color: #6f3ed6; }
.youtube-link-card > span:not(.youtube-chevron) { display: grid; gap: 3px; flex: 1; }
.youtube-link-card strong { font-size: 16px; }
.youtube-link-card span span { font-size: 13px; line-height: 1.5; color: #80778d; }
.youtube-status { padding: 15px; margin: 14px 0; border-radius: 12px; font-size: 14px; line-height: 1.6; background: #ece8f5; color: #625873; }
.youtube-retry { border: 1px solid #d1c0ee; border-radius: 8px; background: white; color: var(--accent-dark); padding: 9px 16px; margin-bottom: 16px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-view="details"] .playlist-summary { display: flex; flex-direction: column; text-align: center; gap: 12px; padding: 4px 0 6px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-view="details"] .playlist-cover { width: 88px; height: 88px; border-radius: 50%; overflow: visible; position: relative; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"])[data-view="details"] .playlist-cover > img { border-radius: 50%; overflow: hidden; background: #e9e7ef; }
.playlist-platform-badge { position: absolute; bottom: -3px; inset-inline-end: -7px; width: 46px; height: 46px; border-radius: 13px; border: 3px solid #f7f7fa; background: white; }
.playlist-platform-badge img { width: 100%; height: 100%; border-radius: 10px; }
.playlist-date { margin-top: 9px; color: #8b8793; font-size: 14px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-list { padding: 0 18px; border: 0; border-radius: 20px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-row { min-height: 88px; gap: 15px; padding-block: 17px; }
.track-art { flex: none; width: 48px; height: 48px; object-fit: contain; background: #eeebf3; border-radius: 9px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-title { font-size: 16px; font-weight: 600; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-artist { font-size: 13px; margin-top: 3px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .playlist-action-bar { background: #f7f7faf5; backdrop-filter: blur(16px); padding-bottom: max(16px,env(safe-area-inset-bottom)); }
#youtube-detail-count { text-align: center; color: #8b8793; font-size: 13px; margin-top: 8px; }
@media(max-width:600px) {
  .platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) #library-panel { margin-inline: 16px; }
  .youtube-playlist-card { gap: 10px; padding: 10px; min-height: 70px; }
  .youtube-playlist-cover { width: 44px; height: 44px; }
  .youtube-link-card { padding: 14px; gap: 10px; }
  .platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-list { padding-inline: 14px; }
  .platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-row { gap: 12px; }
  .platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .track-title { font-size: 15px; }
}
@media(prefers-reduced-motion:reduce) { .youtube-status { scroll-behavior: auto; } }

.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .playlist-info .playlist-owner,
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .playlist-info .playlist-count { display: none; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .spotify-attribution { margin-top: 7px; font-size: 12px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .spotify-attribution img { width: 17px; height: 17px; }
.platform-dialog:is([data-service="youtube"],[data-service="apple"],[data-service="spotify"],[data-service="qq"],[data-service="netease"],[data-service="kugou"],[data-service="amazon"],[data-service="soundcloud"], [data-service="tidal"], [data-service="deezer"],[data-service="pandora"],[data-service="line"],[data-service="awa"],[data-service="melon"],[data-service="genie"],[data-service="flo"],[data-service="kkbox"],[data-service="subsonic"],[data-service="jellyfin"],[data-service="plex"], [data-service="jiosaavn"],[data-service="gaana"],[data-service="joox"], [data-service="bugs"],[data-service="anghami"]) .playlist-date { margin-top: 7px; font-size: 13px; }

#apple-library { width:100%; }

/* Client handoff for Spotify collections unavailable to anonymous readers. */
.spotify-import-assist { margin: 16px 0 22px; }
.spotify-import-assist a { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 20px; border-radius: 14px; background: var(--accent); color: #fff; font-weight: 650; text-decoration: none; text-align: center; }
.spotify-import-assist a:hover { filter: brightness(.95); }

.playlist-description { margin: 7px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }

#soundcloud-link-connect { margin-top: 15px; width: 100%; }

.youtube-connect { background:var(--accent); color:white; border-color:var(--accent); min-height:54px; width:100%; font-size:17px; border-radius:14px; }
.youtube-connect:hover { background:var(--accent-dark); color:white; }

#kkbox-link-connect { margin-top:15px; width:100%; }

/* All account libraries share one full-width content column. */
#platform-dialog #library-panel { display:block; align-self:stretch; width:auto; margin:0 16px 24px; padding:0; background:transparent; }
#platform-dialog #library-panel[hidden] { display:none; }
#platform-dialog #library-panel > div { width:100%; min-width:0; margin:0; padding:0; }
#platform-dialog #library-panel .youtube-playlists { width:100%; }
#platform-dialog [data-loading="true"], #platform-dialog #library-panel [data-loading="true"] {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  min-height:112px; padding:24px 12px; margin:12px 0; background:transparent; border:0; box-shadow:none;
  color:var(--muted); text-align:center; font-size:14px; line-height:1.5;
}
#platform-dialog [data-loading="true"][hidden] { display:none; }
#platform-dialog [data-loading="true"]::before { display:none; }
.loading-spinner { position:relative; display:block; width:30px; height:30px; }
.loading-spinner i { position:absolute; left:13px; top:1px; width:3px; height:8px; border-radius:2px; background:currentColor;
  transform-origin:1.5px 14px; transform:rotate(calc(var(--segment) * 30deg)); animation:loading-fade 1.2s linear infinite;
  animation-delay:calc(var(--segment) * -.1s); }
@keyframes loading-fade { 0% {opacity:1;} 100% {opacity:.15;} }
@media(prefers-reduced-motion:reduce) { .loading-spinner i { animation:none; opacity:.65; } }
.disconnect-confirm { width:min(400px,calc(100% - 40px)); padding:28px; border:1px solid var(--line); border-radius:22px; color:var(--ink); background:white; box-shadow:0 18px 80px #17132130; }
.disconnect-confirm::backdrop { background:#24222970; }
.disconnect-confirm h2 { font-size:21px; line-height:1.4; }
.disconnect-confirm p { margin-top:12px; color:var(--muted); line-height:1.6; }
.disconnect-actions { display:flex; gap:12px; margin-top:24px; }
.disconnect-actions button { flex:1; padding:12px; border:0; border-radius:12px; font:inherit; font-weight:650; background:#f0eef4; color:var(--ink); }
#disconnect-accept { background:var(--accent); color:white; }

/* One connect action for every platform, with an accessible text title and trailing chevron. */
.youtube-connect { position:relative; padding-inline:42px; }
.youtube-connect::after { content:''; position:absolute; inset-inline-end:22px; top:50%; width:9px; height:9px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:translateY(-50%) rotate(45deg); }
[dir="rtl"] .youtube-connect::after { transform:translateY(-50%) rotate(-135deg); }

/* The native-client handoff is a focused prompt, separate from the link form. */
.client-download-dialog { width:min(440px,calc(100% - 32px)); box-sizing:border-box; padding:36px 28px 24px; border:1px solid var(--line); border-radius:26px; background:white; color:var(--ink); text-align:center; box-shadow:0 24px 90px #17132140; }
.client-download-dialog::backdrop { background:#24222980; }
.client-download-dialog > img { border-radius:16px; }
.client-download-dialog h2 { font-size:22px; line-height:1.4; margin:20px 0 12px; }
.client-download-dialog > p { color:var(--muted); line-height:1.65; margin:0; }
.client-download-dialog .spotify-import-assist { margin:24px 0 0; }
.client-download-close { position:absolute; inset-inline-end:12px; top:10px; width:40px; height:40px; border:0; background:transparent; color:var(--muted); font-size:28px; cursor:pointer; border-radius:50%; }
.client-download-close:hover { background:#f1f0f5; }

.subsonic-login label { display:grid; gap:7px; margin:16px 0; text-align:start; font-size:14px; color:var(--muted); }
.subsonic-login input { width:100%; box-sizing:border-box; font:inherit; padding:13px 14px; border:1px solid var(--line); border-radius:12px; background:#f7f7fa; color:var(--ink); }
.subsonic-login .subsonic-session-hint { font-size:13px; line-height:1.6; margin:16px 0; }
.subsonic-status:not([data-loading="true"]) { padding:14px; margin:16px 0; border-radius:12px; background:#fff1ee; color:#b42318; line-height:1.6; }

.subsonic-login { padding:16px; }
.subsonic-login label { margin:10px 0; gap:5px; }
.subsonic-login input { padding:10px 12px; }
.subsonic-login .subsonic-session-hint { margin:12px 0; }

#plex-setup select {width:100%;font:inherit;padding:12px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink);}
