/* Apple Music page layouts: Home, Search, Browse pages, Radio, artist,
   album, Liked Songs and playlists. Pairs with apple.js. */

.am-title, body[data-view] .intro h1 { font: 800 34px/1.1 var(--font-display) !important; letter-spacing: -.035em !important; color: #fff; }
.intro .eyebrow, #view-subtitle { display: none !important; }
.intro { margin: 6px 0 18px !important; }
body[data-view="home"] #view-title { font-size: 0 !important; }
body[data-view="home"] #view-title::before { content: "Home"; font: 800 34px/1.1 var(--font-display); letter-spacing: -.035em; }
body[data-view="search"] #view-title { font-size: 0 !important; }
body[data-view="search"] #view-title::before { content: "Search"; font: 800 34px/1.1 var(--font-display); letter-spacing: -.035em; }
body[data-view="library"] #view-title { font-size: 0 !important; }
body[data-view="library"] #view-title::before { content: "Library"; font: 800 34px/1.1 var(--font-display); letter-spacing: -.035em; }
body[data-view="history"] #view-title { font-size: 0 !important; }
body[data-view="history"] #view-title::before { content: "Recently Played"; font: 800 34px/1.1 var(--font-display); letter-spacing: -.035em; }
#view-title span { display: none; }

.am-h2, .section-title h2, .am-section > h2 { display: flex; align-items: center; gap: 4px; margin: 0 0 12px; font: 700 21px/1.2 var(--font-display) !important; letter-spacing: -.025em; color: #fff; }
.am-chev { width: 18px; height: 18px; color: rgba(255,255,255,.5); }
.am-h2-row { display: flex; align-items: baseline; justify-content: space-between; }
.am-section { margin: 0 0 34px; }
.shelf-sub, .section-title p, .section-title > span:not(.am-chev) { display: none !important; }
.section-title { margin-bottom: 12px !important; border: 0 !important; padding: 0 !important; }
.section-title .small-link { font-size: 14px; }

/* ── Shelves: horizontal, snapping, like the Music app ── */
.am-shelf, .shelf-row, .artist-strip {
  display: grid !important; grid-auto-flow: column; grid-auto-columns: clamp(140px, 15vw, 196px);
  gap: 16px !important; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  padding-bottom: 6px; scrollbar-width: none;
}
.am-shelf::-webkit-scrollbar, .shelf-row::-webkit-scrollbar, .artist-strip::-webkit-scrollbar { display: none; }
.am-shelf > *, .shelf-row > *, .artist-strip > * { scroll-snap-align: start; }
.am-tile { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 0; border: 0; background: none; color: #fff; text-align: left; cursor: pointer; }
.am-tile img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; background: #1c1c1e; margin-bottom: 6px; transition: transform .4s var(--spring), filter .25s; }
.am-tile:hover img { filter: brightness(1.08); }
.am-tile:active img { transform: scale(.97); }
.am-tile strong { font-size: 13.5px; font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-tile small { font-size: 12.5px; color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-shelf.round .am-tile { align-items: center; text-align: center; }
.am-shelf.round .am-tile img, .am-artist img { border-radius: 50%; }

/* ── Song rows ── */
.am-song-grid { display: grid; grid-auto-flow: column; grid-template-rows: repeat(4, auto); grid-auto-columns: minmax(300px, calc((100% - 32px) / 3)); column-gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.am-song-grid::-webkit-scrollbar { display: none; }
.am-song-grid .am-song { scroll-snap-align: start; }
.am-song {
  position: relative; display: flex; align-items: center; gap: 12px; min-width: 0;
  padding: 7px 6px; border-radius: 10px; cursor: pointer; color: #fff;
  transition: background .2s;
}
.am-song:hover { background: rgba(255,255,255,.06); }
.am-song::after { content: ""; position: absolute; left: 64px; right: 6px; bottom: 0; height: .5px; background: rgba(255,255,255,.09); }
.am-song img { width: 48px; height: 48px; flex-shrink: 0; border-radius: 7px; object-fit: cover; background: #1c1c1e; }
.am-num { width: 22px; flex-shrink: 0; text-align: center; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.55); font-variant-numeric: tabular-nums; }
.am-song-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.am-song-text strong { font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-song-text small { font-size: 13px; color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-song.playing .am-song-text strong, .am-song.playing .am-num { color: var(--am); }
.am-song-time { font-size: 13px; color: rgba(255,255,255,.45); font-variant-numeric: tabular-nums; }
.am-more { width: 32px; height: 32px; display: grid; place-items: center; flex-shrink: 0; border: 0; border-radius: 50%; background: none; color: rgba(255,255,255,.7); }
.am-more svg { width: 18px; height: 18px; }
.am-more:hover { background: rgba(255,255,255,.1); }
.am-song-grid .am-song-time { display: none; }
.am-list .am-song::after { left: 66px; }

.am-actions { display: flex; gap: 10px; margin: 18px 0 26px; }
.am-actions .green-button, .am-actions .outline-button { min-width: 150px; min-height: 44px; font-size: 15px; }
.am-actions .outline-button { color: var(--am); }
.am-actions .outline-button svg { color: var(--am); }
.am-foot { margin: 14px 6px 30px; font-size: 13px; color: rgba(255,255,255,.5); }
.am-loading { padding: 40px 0; color: rgba(255,255,255,.55); }
.am-kicker { margin: 0 0 4px; font-size: 11px; font-weight: 650; letter-spacing: .08em; color: rgba(255,255,255,.65); }

.am-back {
  display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%;
  color: #fff; background: rgba(255,255,255,.14);
  -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  transition: transform .45s var(--spring), background .2s;
}
.am-back svg { width: 20px; height: 20px; }
.am-back:hover { background: rgba(255,255,255,.22); }
.am-back:active { transform: scale(.9); }

/* ── Browse pages ── */
.am-page-head {
  position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  min-height: 210px; margin: 0 0 4px; padding: 18px 26px 24px; border-radius: 26px; overflow: hidden;
  background: var(--g1);
}
.am-page-head h1 { margin: 0; font: 800 clamp(34px, 4vw, 52px)/1 var(--font-display); letter-spacing: -.04em; color: #fff; }
.am-detail { position: relative; display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: end; margin: 6px 0 8px; }
.am-detail-art { width: 260px; aspect-ratio: 1; border-radius: 14px; object-fit: cover; }
.am-detail-info h1 { margin: 0; font: 800 clamp(26px, 3vw, 40px)/1.1 var(--font-display); letter-spacing: -.035em; }
.am-detail-by { margin: 6px 0 0; font-size: 20px; color: var(--am); font-weight: 500; }
.am-detail-meta { margin: 8px 0 0; font-size: 13px; color: rgba(255,255,255,.55); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.am-back-float { position: absolute; left: -6px; top: -6px; z-index: 2; }
.am-detail .am-back-float { position: static; grid-column: 1 / -1; margin-bottom: -10px; }

/* ── Search ── */
#search-discovery { margin-top: 4px; }
.am-categories { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.am-category {
  position: relative; overflow: hidden; aspect-ratio: 16 / 10;
  display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 2px;
  padding: 14px 16px; border: 0; border-radius: 16px; color: #fff; text-align: left;
  background: var(--g1);
  transition: transform .45s var(--spring), filter .2s;
}
.am-category::after { content: ""; position: absolute; right: -18%; top: -30%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: rgba(255, 255, 255, 0.15); }
.am-category strong { position: relative; z-index: 1; font: 700 19px/1.15 var(--font-display); letter-spacing: -.02em; }
.am-category small { position: relative; z-index: 1; font-size: 12px; color: rgba(255,255,255,.8); }
.am-category:hover { filter: brightness(1.08); }
.am-category:active { transform: scale(.96); }
.am-recent { display: flex; flex-direction: column; }
.am-recent button { display: flex; align-items: center; gap: 12px; padding: 12px 4px; border: 0; border-bottom: .5px solid rgba(255,255,255,.1); background: none; color: #fff; font-size: 16px; text-align: left; }
.am-recent button svg:first-child { width: 18px; height: 18px; color: rgba(255,255,255,.5); }
.am-recent button span { flex: 1; }
#search-tabs { margin: 6px 0 18px; }
.search-artist-strip { display: grid !important; grid-auto-flow: column; grid-auto-columns: 140px; gap: 16px; overflow-x: auto; scrollbar-width: none; }
.search-artist-strip img { border-radius: 50% !important; }
.top-result { border: 0 !important; border-radius: 20px !important; background: rgba(255,255,255,.07) !important; }
.top-result .circle-button { background: var(--am) !important; color: #fff !important; }

/* ── Radio ── */
#radio-content .radio-hero { display: none !important; }
#am-radio .am-title { margin: 6px 0 18px; }
.am-feature { grid-auto-columns: clamp(260px, 30vw, 380px) !important; margin-bottom: 34px; }
.am-station-hero {
  position: relative; overflow: hidden; aspect-ratio: 4 / 3;
  display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 4px;
  padding: 18px 20px; border: 0; border-radius: 22px; color: #fff; text-align: left;
  background: var(--g1);
  transition: transform .45s var(--spring), filter .2s;
}
.am-station-hero::before { content: ""; position: absolute; right: 18px; top: 18px; width: 56px; height: 56px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); }
.am-station-hero strong { font: 800 26px/1.05 var(--font-display); letter-spacing: -.03em; }
.am-station-hero small { font-size: 13px; color: rgba(255,255,255,.85); }
.am-station-hero .am-live { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 7px 14px; border-radius: 999px; background: rgba(255,255,255,.95); color: #000; font-size: 13px; font-weight: 650; }
.am-station-hero .am-live svg { width: 14px; height: 14px; color: var(--am); }
.am-station-hero:hover { filter: brightness(1.06); }
.am-station-hero:active { transform: scale(.97); }
.am-station-art { position: relative; display: block; aspect-ratio: 1; border-radius: 50%; overflow: hidden; margin-bottom: 8px; background: #fa2d48; }
.am-station-art img { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border-radius: 0; object-fit: cover; filter: saturate(1.1); }
.am-station-art > span { position: absolute; right: 8%; bottom: 8%; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--am); color: #fff; }
.am-station-art > span svg { width: 17px; height: 17px; }
.am-station-tile { text-align: center; align-items: center; }
.am-your-station { margin-top: 8px; }
#radio-content .radio-tuning { padding: 0 !important; margin-bottom: 18px; background: none !important; }
#radio-content .radio-tuning h2 { display: none; }
#radio-content .radio-tuning > div:first-child p { margin: 0 0 10px; color: rgba(255,255,255,.55); font-size: 13.5px; }

/* ── Home ── */
body[data-view="home"] #home-hero, #personal-home { display: none !important; }
#home-feed { display: flex; flex-direction: column; }
#home-feed > section:has(#mix-grid) { order: -1; }
#mix-grid { display: grid !important; grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: clamp(220px, 24vw, 300px); gap: 16px !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 6px; }
#mix-grid::-webkit-scrollbar { display: none; }
.am-mix-card { scroll-snap-align: start; padding: 0; border: 0; background: none; text-align: left; }
.am-mix-card > h3, .am-mix-card > p { display: none; }
.am-mix-art {
  position: relative; display: flex !important; flex-direction: column; justify-content: flex-end; gap: 4px;
  aspect-ratio: 3 / 4 !important; padding: 18px !important; overflow: hidden; border-radius: 18px !important;
  background: var(--mix-a) !important;
  transition: transform .45s var(--spring);
}
.am-mix-art img { position: absolute; inset: 0 0 auto; width: 100%; height: 70% !important; object-fit: cover; -webkit-mask-image: linear-gradient(180deg, #000 50%, transparent); mask-image: linear-gradient(180deg, #000 50%, transparent); opacity: 1 !important; filter: none !important; }
.am-mix-art > span:first-of-type { position: absolute; top: 14px; left: 16px; z-index: 1; font-size: 11px !important; font-weight: 700; letter-spacing: .04em; color: rgba(255,255,255,.95) !important; }
.am-mix-art strong { position: relative; z-index: 1; font: 800 26px/1.05 var(--font-display) !important; letter-spacing: -.03em; color: #fff; }
.am-mix-art small { position: relative; z-index: 1; font-size: 12.5px !important; line-height: 1.35; color: rgba(255,255,255,.8) !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.am-mix-play { position: absolute !important; right: 14px; bottom: 14px; z-index: 2; width: 38px !important; height: 38px !important; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.95) !important; color: #000 !important; opacity: 0; transform: scale(.8); transition: opacity .2s, transform .4s var(--spring); }
.am-mix-play svg { width: 16px; height: 16px; }
.am-mix-card:hover .am-mix-play { opacity: 1; }
.am-mix-card:active .am-mix-art { transform: scale(.97); }
.am-card { scroll-snap-align: start; border: 0 !important; background: none !important; padding: 0 !important; }
.am-card-art { border-radius: 10px !important; overflow: hidden; }
.am-card h3 { margin-top: 8px !important; font-size: 13.5px !important; font-weight: 550 !important; }
.am-card p { font-size: 12.5px !important; color: rgba(255,255,255,.55) !important; }
.artist-card img { border-radius: 50% !important; }
#home-tracks .track-row .track-index { display: none; }
.shelf-tag { display: none !important; }

/* ── Artist page ── */
#artist-content { display: flex; flex-direction: column; }
#artist-content[hidden] { display: none; }
#artist-content .artist-back { display: none; }
#artist-content .artist-hero {
  order: 0; position: relative; display: flex !important; align-items: flex-end; justify-content: space-between;
  min-height: clamp(280px, 46vh, 460px); margin: -34px -34px 26px; padding: 28px 34px !important;
  border: 0 !important; border-radius: 0 !important; background: #000 !important; overflow: hidden;
}
#artist-content .artist-hero > img { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; border-radius: 0 !important; object-fit: cover; object-position: center 25%; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
#artist-content .artist-hero > div { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; }
#artist-content .artist-hero .eyebrow, #artist-description { display: none !important; }
#artist-name { margin: 0 !important; font: 800 clamp(34px, 5vw, 64px)/1 var(--font-display) !important; letter-spacing: -.04em; }
#artist-play { order: 2; width: 54px !important; min-width: 0 !important; height: 54px !important; min-height: 0 !important; padding: 0 !important; border-radius: 50% !important; background: var(--am) !important; color: #fff !important; flex-shrink: 0; }
#artist-play svg { width: 22px !important; height: 22px !important; color: #fff !important; margin-left: 2px; }
#am-artist-top { order: 1; }
#artist-albums-section { order: 2; }
#artist-albums { display: grid !important; grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: clamp(140px, 15vw, 196px); gap: 16px !important; overflow-x: auto; scrollbar-width: none; }
#artist-albums-section .section-title > span { display: none; }
#artist-content .artist-list-heading { order: 3; margin-top: 10px !important; }
#artist-content .catalogue-note { display: none; }
#artist-status { order: 3; }
#artist-tracks { order: 4; }
#artist-more { order: 5; align-self: center; margin: 16px 0; }
#artist-content .artist-list-heading #artist-count { display: none; }

/* Track rows (artist "All Songs", album, liked, playlists): Music app list. */
.track-row { display: flex !important; align-items: center; gap: 12px !important; min-height: 60px; padding: 6px 8px !important; border: 0 !important; border-radius: 10px !important; background: none !important; }
.track-row .track-art { width: 46px !important; height: 46px !important; border-radius: 7px !important; }
.track-row .track-main { flex: 1; min-width: 0; }
.track-row .track-title { font-size: 15px !important; font-weight: 500 !important; color: #fff !important; }
.track-row .artist-link { font-size: 13px !important; color: rgba(255,255,255,.55) !important; }
.track-row .track-time { font-size: 13px; color: rgba(255,255,255,.45); }
.track-row .track-index { width: 22px; text-align: center; font-size: 14px; color: rgba(255,255,255,.5); }
.track-row:not(:has(.track-index:not(:empty))) .track-index { display: none; }
#artist-tracks .track-index, #search-results .track-index, body[data-view="liked"] .track-index, body[data-view="playlist"] .track-index, body[data-view="history"] .track-index { display: none; }
.song-list-label { display: none !important; }

/* ── Album page ── */
#album-content .artist-back { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0 !important; margin-bottom: 14px; border-radius: 50%; background: rgba(255,255,255,.14); color: transparent !important; font-size: 0 !important; position: relative; }
#album-content .artist-back::before { content: ""; width: 10px; height: 10px; border-left: 2.4px solid #fff; border-bottom: 2.4px solid #fff; transform: translateX(2px) rotate(45deg); border-radius: 1px; }
#album-content .album-hero { display: grid !important; grid-template-columns: 260px 1fr; gap: 32px; align-items: end; padding: 0 !important; margin: 0 0 10px; border: 0 !important; background: none !important; min-height: 0 !important; }
#album-image { width: 260px !important; height: 260px !important; border-radius: 14px !important; object-fit: cover; }
#album-content .album-hero .eyebrow { display: none; }
#album-title { margin: 0 !important; font: 800 clamp(26px, 3vw, 40px)/1.1 var(--font-display) !important; letter-spacing: -.035em; }
#album-artist { margin-top: 6px; font-size: 20px !important; font-weight: 500; color: var(--am) !important; }
#album-meta { margin: 6px 0 0 !important; font-size: 13px; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .03em; }
#album-tracks .track-art { display: none !important; }
#album-tracks .track-index { display: block; }
#album-tracks .track-row { min-height: 48px; }
#album-tracks .track-row .artist-link { display: none; }

/* ── Liked Songs & playlists: the Music app's playlist header ── */
.collection-hero { display: grid !important; grid-template-columns: 260px 1fr; gap: 32px; align-items: end !important; min-height: 0 !important; padding: 0 !important; margin: 0 0 6px; background: none !important; border-radius: 0 !important; }
.collection-hero > .collection-art, .collection-hero > .liked-emblem { width: 260px !important; height: 260px !important; }
.collection-hero .eyebrow { display: none; }
.collection-hero h1 { margin: 0 !important; font: 800 clamp(28px, 3vw, 40px)/1.1 var(--font-display) !important; letter-spacing: -.035em; }
.collection-hero > div > p:not(.eyebrow) { margin-top: 6px; font-size: 15px !important; color: rgba(255,255,255,.6) !important; }
.collection-hero small { margin-top: 10px !important; font-size: 13px !important; color: rgba(255,255,255,.5) !important; }
#collection-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 16px 0 18px !important; }
#collection-tools .green-button, #collection-tools .outline-button { min-width: 150px; min-height: 44px; font-size: 15px; }
#collection-tools .outline-button { color: var(--am); }
#results-content > .results-heading { display: none !important; }

/* ═══════════════════════════════ Phone ═══════════════════════════════ */
@media (max-width: 720px) {
  .am-title, body[data-view] .intro h1, body[data-view] #view-title::before { font-size: 30px !important; }
  .am-shelf, .shelf-row, .artist-strip, #artist-albums { grid-auto-columns: 42vw !important; gap: 12px !important; margin: 0 -16px; padding: 0 16px 6px; scroll-padding: 0 16px; }
  #mix-grid { grid-auto-columns: 64vw; margin: 0 -16px; padding: 0 16px 6px; scroll-padding: 0 16px; gap: 12px !important; }
  .am-song-grid { grid-auto-columns: 86vw; margin: 0 -16px; padding: 0 16px; scroll-padding: 0 16px; column-gap: 14px; }
  .am-categories { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .am-category strong { font-size: 16px; }
  .am-feature { grid-auto-columns: 82vw !important; }
  .am-page-head { min-height: 170px; margin: 0 -16px 4px; border-radius: 0 0 22px 22px; padding: 14px 18px 20px; }
  .am-detail, #album-content .album-hero, .collection-hero { grid-template-columns: 1fr !important; justify-items: center; text-align: center; gap: 16px; }
  .am-detail-art, #album-image, .collection-hero > .collection-art, .collection-hero > .liked-emblem { width: min(64vw, 260px) !important; height: min(64vw, 260px) !important; }
  .am-detail .am-actions, #album-content .am-actions { justify-content: center; }
  .am-actions .green-button, .am-actions .outline-button, #collection-tools .green-button, #collection-tools .outline-button { flex: 1; min-width: 0; }
  .collection-hero > div { display: flex; flex-direction: column; align-items: center; }
  #collection-tools { justify-content: center; }
  #collection-tools > :not(.green-button):not(.outline-button) { flex-basis: 100%; }
  #artist-content .artist-hero { margin: -6px -16px 22px; padding: 20px 16px !important; min-height: 58vh; }
  #artist-name { font-size: 36px !important; }
  #album-content .artist-back { position: absolute; }
  .am-song-time { display: none; }
}

/* ── Song context menu (menu.js) ── */
.am-menu {
  position: fixed; inset: auto; margin: 0; padding: 6px; width: 264px; max-height: min(560px, 86vh); overflow-y: auto;
  border: 0; border-radius: 18px; color: #fff;
  background: rgba(38, 38, 42, .72);
  -webkit-backdrop-filter: blur(40px) saturate(190%); backdrop-filter: blur(40px) saturate(190%);
  opacity: 0; transform: scale(.85);
  transition: opacity .18s, transform .32s var(--spring), overlay .3s allow-discrete, display .3s allow-discrete;
}
.am-menu:popover-open { opacity: 1; transform: scale(1); }
@starting-style { .am-menu:popover-open { opacity: 0; transform: scale(.85); } }
.am-menu::backdrop { background: transparent; }
.am-menu-head { display: flex; align-items: center; gap: 10px; padding: 8px 8px 10px; }
.am-menu-head img { width: 42px; height: 42px; border-radius: 7px; object-fit: cover; background: #2c2c2e; }
.am-menu-head div { min-width: 0; display: flex; flex-direction: column; }
.am-menu-head strong { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-menu-head small { font-size: 12.5px; color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-menu-group { padding: 4px 0; border-top: .5px solid rgba(255,255,255,.12); }
.am-menu-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 9px 10px; border: 0; border-radius: 10px; background: none; color: #fff; font-size: 14.5px; text-align: left; cursor: pointer; }
.am-menu-item svg { width: 19px; height: 19px; flex-shrink: 0; color: #fff; }
.am-menu-item:hover, .am-menu-item:focus-visible { background: rgba(255,255,255,.12); outline: none; }
.am-menu-item.on svg { color: var(--am); }
.am-menu-item.danger, .am-menu-item.danger svg { color: #ff453a; }
.am-menu-back { color: var(--am); }
.am-menu.sheet {
  left: 8px; right: 8px; top: auto; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); width: auto; max-height: 80dvh;
  border-radius: 26px; padding: 8px; transform: translateY(110%); transform-origin: bottom center;
}
.am-menu.sheet:popover-open { transform: translateY(0); }
@starting-style { .am-menu.sheet:popover-open { transform: translateY(110%); } }
.am-menu.sheet::backdrop { background: rgba(0,0,0,.35); }
.am-menu.sheet .am-menu-item { padding: 13px 12px; font-size: 16px; }

/* ── Downloads (downloads.js) ── */
.dl-art { background: #5e5ce6 !important; color: #fff; }
.dl-art svg { width: 18px; height: 18px; }
.dl-library-card { display: flex; align-items: center; gap: 14px; width: 100%; margin: 0 0 22px; padding: 14px 16px; border: 0; border-radius: 18px; background: rgba(255,255,255,.07); color: #fff; text-align: left; transition: background .2s, transform .4s var(--spring); }
.dl-library-card:hover { background: rgba(255,255,255,.1); }
.dl-library-card:active { transform: scale(.98); }
.dl-library-card > svg { width: 42px; height: 42px; padding: 9px; border-radius: 10px; background: #5e5ce6; }
.dl-library-card span:not(.dl-chev) { flex: 1; display: flex; flex-direction: column; }
.dl-library-card strong { font-size: 17px; font-weight: 600; }
.dl-library-card small { font-size: 13px; color: rgba(255,255,255,.55); }
.dl-chev { font-size: 26px; color: rgba(255,255,255,.4); }
.dl-emblem { background: #7d7bff !important; }
.dl-emblem svg { width: 96px !important; height: 96px !important; fill: none !important; color: #fff; }
.dl-tools { display: flex; gap: 10px; margin: 18px 0 18px; }
.dl-tools button { min-width: 150px; min-height: 44px; font-size: 15px; }
.dl-tools .outline-button { color: var(--am); }
.dl-restore { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 18px; padding: 14px 16px; border-radius: 18px; background: rgba(94,92,230,.18); }
.dl-restore div { display: flex; flex-direction: column; gap: 2px; }
.dl-restore strong { font-size: 15px; }
.dl-restore small { font-size: 13px; color: rgba(255,255,255,.65); }
.dl-restore .green-button { flex-shrink: 0; }
.dl-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 20px !important; text-align: center; }
.dl-empty svg { width: 48px; height: 48px; color: rgba(255,255,255,.45); }
.dl-empty h3 { margin: 6px 0 0; font-size: 20px; }
.dl-empty p { margin: 0; max-width: 380px; color: rgba(255,255,255,.55); font-size: 14px; }
.dl-row { cursor: pointer; }
.dl-button { min-width: 44px !important; padding: 0 14px !important; }
.dl-button svg { width: 20px !important; height: 20px !important; color: var(--am); }
/* A small downloaded mark beside the title; a ring fills while it downloads. */
.is-downloaded .track-title::after, .is-downloaded .am-song-text strong::after {
  content: ""; display: inline-block; width: 13px; height: 13px; margin-left: 7px; vertical-align: -1px; border-radius: 50%;
  background: rgba(255,255,255,.5) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 6v10m-4-4 4 4 4-4' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/9px no-repeat;
}
.is-downloading .track-title::after, .is-downloading .am-song-text strong::after {
  content: ""; display: inline-block; width: 13px; height: 13px; margin-left: 7px; vertical-align: -1px; border-radius: 50%;
  background: conic-gradient(var(--am) var(--dl, 0%), rgba(255,255,255,.2) 0);
  -webkit-mask: radial-gradient(circle, transparent 3.5px, #000 4px); mask: radial-gradient(circle, transparent 3.5px, #000 4px);
}
@media (max-width: 720px) {
  .dl-tools button { flex: 1; min-width: 0; }
  .dl-restore { flex-direction: column; align-items: stretch; }
  .dl-hero { justify-items: center; text-align: center; }
}
.am-station-tile .am-station-art { width: 100%; }

/* ── Page tint: album, artist, playlist and genre pages glow in their artwork's colour ── */
#page-glow {
  position: fixed; inset: 0 0 auto 0; height: 78vh; z-index: -1; pointer-events: none;
  background:
    color-mix(in srgb, var(--page-tint, #000) 35%, transparent);
  opacity: 0; transition: opacity .7s var(--smooth);
}
#page-glow.on { opacity: 1; }
.main-shell, main { background: transparent !important; }

/* ── Library, as in the Music app ── */
#library-content > :not(#am-library) { display: none !important; }
#library-content .dl-library-card { display: none !important; }
.am-lib-list { display: flex; flex-direction: column; margin: 0 0 30px; border-radius: 18px; overflow: hidden; background: rgba(255,255,255,.06); -webkit-backdrop-filter: blur(24px) saturate(160%); backdrop-filter: blur(24px) saturate(160%); }
.am-lib-list button { position: relative; display: flex; align-items: center; gap: 14px; padding: 13px 16px; border: 0; background: none; color: #fff; font-size: 17px; text-align: left; transition: background .2s; }
.am-lib-list button + button::before { content: ""; position: absolute; top: 0; left: 56px; right: 0; height: .5px; background: rgba(255,255,255,.1); }
.am-lib-list button:hover { background: rgba(255,255,255,.06); }
.am-lib-list button:active { background: rgba(255,255,255,.1); }
.am-lib-ico { display: grid; place-items: center; width: 26px; color: var(--am); }
.am-lib-ico svg { width: 24px; height: 24px; }
.am-lib-label { flex: 1; }
.am-lib-list .am-chev { color: rgba(255,255,255,.35); }
.am-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 22px 18px; }
.am-tile-art { display: grid; place-items: center; width: 100%; aspect-ratio: 1; margin-bottom: 6px; border-radius: 10px; color: #fff; }
.am-tile-art svg { width: 42%; height: 42%; }
.am-tile-liked { background: #ff8094; }
.am-tile-liked svg { fill: currentColor; }
.am-tile-plain { background: #48484a; color: rgba(255,255,255,.7); }
.am-tile-new { background: rgba(255,255,255,.08); color: var(--am); }
.am-lib-head { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin: 0 0 18px; }
.am-empty { padding: 30px 0; color: rgba(255,255,255,.55); font-size: 15px; }
.am-artist-list { display: flex; flex-direction: column; }
.am-artist-row { position: relative; display: flex; align-items: center; gap: 14px; padding: 8px 4px; border: 0; background: none; color: #fff; font-size: 17px; text-align: left; border-radius: 12px; }
.am-artist-row:hover { background: rgba(255,255,255,.06); }
.am-artist-row img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: #2c2c2e; }
.am-artist-row span { flex: 1; }
.am-artist-row + .am-artist-row::before { content: ""; position: absolute; top: 0; left: 70px; right: 0; height: .5px; background: rgba(255,255,255,.1); }

/* ── Browse tiles carry an album cover, tilted into the corner ── */
.am-category { isolation: isolate; }
.am-category::after { z-index: 0; }
.am-category strong, .am-category small { z-index: 2; max-width: 62%; }
.am-cat-art {
  position: absolute; right: -6%; bottom: -10%; z-index: 1; width: 52%; aspect-ratio: 1; object-fit: cover;
  border-radius: 8px; transform: rotate(22deg);
  transition: transform .5s var(--spring);
}

/* ── Song rows: ⋯ instead of a heart on every line, bars on the playing song ── */
.track-row [data-save] { display: none !important; }
.track-row .add-track, .track-row [data-options] { display: grid !important; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: rgba(255,255,255,.7); background: none !important; }
.track-row .add-track:hover { background: rgba(255,255,255,.1) !important; }
.track-row.playing .track-title { color: var(--am) !important; }
.eq { display: inline-flex; align-items: flex-end; gap: 2px; width: 14px; height: 12px; }
.eq b { flex: 1; height: 100%; border-radius: 1px; background: var(--am); transform-origin: bottom; animation: eq-bar 0.9s ease-in-out infinite alternate; }
.eq b:nth-child(2) { animation-delay: -.3s; }
.eq b:nth-child(3) { animation-delay: -.6s; }
body:not(.is-playing) .eq b { animation-play-state: paused; }
.track-row.playing .track-index { display: inline-flex !important; justify-content: center; }

@media (max-width: 720px) {
  .am-grid { grid-template-columns: repeat(2, 1fr); gap: 18px 14px; }
  .am-lib-list button { font-size: 17px; padding: 14px 14px; }
}

/* Radio is the station page only; the old tuning block is gone. */
#radio-content > :not(#am-radio), .am-your-station { display: none !important; }

/* ── Search results: artists as round cards ── */
.search-artist-strip { grid-auto-columns: 128px !important; margin-bottom: 26px !important; }
.search-artist-chip { display: flex !important; flex-direction: column; align-items: center; gap: 8px; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; color: #fff; text-align: center; }
.search-artist-chip img { width: 120px !important; height: 120px !important; border-radius: 50% !important; object-fit: cover; background: #2c2c2e; transition: transform .45s var(--spring); }
.search-artist-chip span { max-width: 120px; font-size: 13.5px; font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-artist-chip span::before, .search-artist-chip span::after { content: none !important; }
#search-tabs { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; background: rgba(118,118,128,.22); }
#search-tabs button { min-height: 32px; padding: 0 16px; border: 0 !important; border-radius: 999px !important; background: none !important; color: rgba(255,255,255,.75); font-weight: 600; font-size: 13px; }
#search-tabs button[aria-pressed="true"] { background: rgba(255,255,255,.22) !important; color: #fff; }
#search-spotlight .section-title h2 { font-size: 21px !important; }

/* ── Dialogs (create playlist, versions, anything else): Apple glass sheets ── */
#dialog[open] { width: min(440px, calc(100vw - 32px)); padding: 26px 24px 22px !important; }
#dialog .dialog-close { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.12) !important; color: rgba(255,255,255,.8); border: 0; }
#dialog .dialog-close svg { width: 14px; height: 14px; }
#dialog .dialog-kicker { display: block; margin-bottom: 6px; font-size: 11px; font-weight: 650; letter-spacing: .06em; color: rgba(255,255,255,.5) !important; }
#dialog h2 { margin: 0 0 10px; font: 700 22px/1.2 var(--font-display); letter-spacing: -.025em; }
#dialog p { color: rgba(255,255,255,.65); font-size: 14px; line-height: 1.45; }
#dialog label { display: block; margin: 10px 0 6px; font-size: 13px; color: rgba(255,255,255,.6); }
#dialog input, #dialog select, #dialog textarea { width: 100%; height: 44px; padding: 0 14px; border: 0 !important; border-radius: 12px; background: rgba(118,118,128,.24) !important; color: #fff; font-size: 16px; outline: none; }
#dialog form .dark-button, #dialog form .green-button { width: 100%; margin-top: 16px; background: var(--am) !important; color: #fff !important; }
#dialog form .dark-button svg { color: #fff !important; }
#dialog .dialog-option, #dialog .version-option {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  margin: 0; padding: 11px 10px; border: 0 !important; border-radius: 12px; background: none !important;
  color: #fff; font-size: 15px; text-align: left;
}
#dialog .dialog-option:hover, #dialog .version-option:hover { background: rgba(255,255,255,.08) !important; }
#dialog .dialog-option svg, #dialog .version-option > svg { width: 18px; height: 18px; color: rgba(255,255,255,.7); }
#dialog .version-option img { width: 52px; height: 40px; border-radius: 8px; object-fit: cover; }
#dialog .version-option span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
#dialog .version-option strong { font-size: 14px; font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#dialog .version-option small { font-size: 12.5px; color: rgba(255,255,255,.55); }
#dialog .dialog-art { width: 100%; border-radius: 14px; margin: 6px 0 14px; }
@media (max-width: 720px) {
  #dialog[open] { width: 100vw; max-width: 100vw; margin: auto 0 0; border-radius: 28px 28px 0 0 !important; padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* Playlist ⋯ and the delete confirmation */
#playlist-more { display: none; min-width: 44px !important; padding: 0 !important; }
body[data-view="playlist"] #playlist-more { display: inline-flex; }
#playlist-more svg { width: 20px; height: 20px; color: var(--am); }
#rename-playlist { display: none !important; }
.am-confirm { display: flex; gap: 10px; margin-top: 18px; }
.am-confirm button { flex: 1; min-height: 44px; }
.am-confirm .am-danger { background: #ff453a !important; color: #fff !important; }

/* ── Feedback banner (menu.js toast) ── */
#toast { display: none !important; }
#am-hud {
  position: fixed; inset: calc(14px + env(safe-area-inset-top, 0px)) 0 auto; margin: 0 auto; width: max-content; max-width: calc(100vw - 32px);
  display: flex; align-items: center; gap: 10px; padding: 11px 18px 11px 12px;
  border: 0; border-radius: 999px; color: #fff; font: 600 14.5px/1.25 var(--font-text);
  background: rgba(44, 44, 48, .72);
  -webkit-backdrop-filter: blur(30px) saturate(190%); backdrop-filter: blur(30px) saturate(190%);
  overflow: visible;
}
#am-hud.pop { animation: hud-in .5s var(--spring); }
#am-hud.out { opacity: 0; transform: translateY(-14px) scale(.96); transition: opacity .25s, transform .25s; }
@keyframes hud-in { from { opacity: 0; transform: translateY(-22px) scale(.9); } }
.am-hud-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,.14); color: var(--am); flex-shrink: 0; }
.am-hud-icon svg { width: 17px; height: 17px; }
.am-menu-item.tapped { background: rgba(255,255,255,.2) !important; transform: scale(.98); transition: transform .12s; }

/* ── Search field, Apple Music style ── */
#search-form.search-box {
  position: relative !important; inset: auto !important; display: flex !important; align-items: center; gap: 7px;
  width: auto !important; height: 36px !important; padding: 0 10px !important; margin: 0;
  border: 0 !important; border-radius: 10px !important;
  background: rgba(118,118,128,.24) !important; background-image: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
#search-form svg { width: 16px; height: 16px; flex-shrink: 0; color: rgba(235,235,245,.6); }
#search-form input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0 !important; background: none !important; color: #fff; font-size: 15px; outline: none; }
#search-form input::placeholder { color: rgba(235,235,245,.6); }
#search-form input::-webkit-search-cancel-button { filter: invert(1) opacity(.6); }
#search-form kbd { display: none !important; }
.am-search-cancel { display: none; border: 0; background: none; color: var(--am); font-size: 16px; padding: 0 0 0 6px; white-space: nowrap; }
.sidebar #search-form { margin: -6px 2px 18px; height: 32px !important; border-radius: 9px !important; }
.sidebar #search-form input { font-size: 13.5px; }
@media (min-width: 721px) {
  .topbar { display: none !important; }
  main { padding-top: 26px !important; }
}
@media (max-width: 720px) {
  .topbar #search-form { display: none !important; }
  body.search-in-page .topbar { height: 60px !important; align-items: center !important; padding-top: 0 !important; }
  body.search-in-page .topbar .mobile-brand { visibility: visible !important; }
  main > #search-form { margin: -6px 0 22px !important; height: 38px !important; }
  main > #search-form:focus-within { margin-right: 0 !important; }
  main > #search-form:focus-within .am-search-cancel { display: block; position: absolute; right: -70px; }
  main > #search-form:focus-within { width: calc(100% - 70px) !important; transition: width .3s var(--smooth); }
}

/* Search results: artist circles in one tidy row */
.search-artist-strip { grid-template-columns: none !important; grid-auto-flow: column !important; }
.search-artist-chip { width: 120px; min-width: 0; }

/* Collection tools: Play and Shuffle side by side, round Download and ⋯ */
#collection-tools .dl-button, #collection-tools #playlist-more { min-width: 44px !important; width: 44px; height: 44px; min-height: 44px !important; padding: 0 !important; border-radius: 50% !important; justify-content: center; }
#collection-tools .dl-button span { display: none; }
@media (max-width: 720px) {
  #collection-tools { display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; }
  #collection-tools .inline-search, #collection-tools select, #collection-tools > label { display: none !important; }
  #collection-tools .green-button, #collection-tools > .outline-button:not(.dl-button):not(#playlist-more) { flex: 1 1 0 !important; min-width: 0 !important; }
  body:not([data-view="playlist"]) #collection-tools #playlist-more { display: none !important; }
}
.cover-button .mix-play, .cover-card .mix-play { display: none !important; }
#artist-status { font-size: 13px; color: rgba(255,255,255,.5); margin: 4px 0 10px; }

/* ── Section titles: Apple's chevron instead of separate "See all" links ── */
.section-title { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 2px !important; }
.section-title > div { display: contents; }
.section-title .small-link {
  order: 2; display: inline-grid !important; place-items: center; width: 24px; height: 24px; padding: 0 !important; margin: 0 !important;
  font-size: 0 !important; color: transparent !important; border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%238e8e93' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat !important;
}
.section-title .small-link > * { display: none !important; }
.section-title .small-link:hover { background-color: rgba(255,255,255,.08) !important; }
#refresh-releases, #random-discover { display: none !important; }

/* ── Cards: no stickers; play buttons only on hover with a mouse ── */
.am-card .am-card-badge, .am-card [class*="badge"], .am-card .new-badge, .shelf-row .am-new, .am-card-new { display: none !important; }
@media (hover: none), (max-width: 720px) { .am-card-play, .am-mix-play { display: none !important; } }
@media (hover: hover) and (min-width: 721px) {
  .am-card-play { opacity: 0; transform: scale(.85); transition: opacity .2s, transform .35s var(--spring); }
  .am-card:hover .am-card-play { opacity: 1; }
}

/* ── Album page buttons: two equal halves, small round download ── */
#album-content .am-actions { width: 100%; max-width: 420px; }
#album-content .am-actions .green-button, #album-content .am-actions #album-shuffle { flex: 1 1 0; min-width: 0; }
#album-content .am-actions .dl-button { flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px !important; padding: 0 !important; border-radius: 50% !important; }
.am-badge { display: none !important; }

/* Settings: account as one Apple row */
#account-dialog .account-identity { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; text-align: left !important; gap: 12px; }
#account-dialog .account-identity > div { display: flex; flex-direction: column; align-items: flex-start !important; text-align: left !important; background: none !important; border: 0 !important; padding: 0 !important; }
#account-dialog .account-identity > div::before, #account-dialog .account-identity > div::after { content: none !important; }
#account-dialog .account-identity .outline-button { flex-shrink: 0; background: none !important; color: var(--am) !important; padding: 0 4px !important; min-height: 0 !important; font-size: 16px !important; }
#account-dialog .settings-name-row .outline-button { background: none !important; color: var(--am) !important; min-height: 0 !important; padding: 0 6px !important; }
#account-dialog .settings-name-row .name-field { flex-direction: row !important; align-items: center; }
#am-hud:not(:popover-open) { display: none !important; }

/* Sign in: the brand's red glow instead of the old green */
.auth-visual { background: #050506 !important; }
.auth-visual::before, .auth-visual::after { background: rgba(0, 0, 0, 0.41) !important; }
.auth-mini-brand svg, .auth-logo .brand-mark { color: #ff375f !important; }
.auth-people span { background: #a1a1a6 !important; color: #fff !important; }
input[type=checkbox][role=switch], input[type=checkbox][role=switch]:checked { background-image: none !important; }
input[type=checkbox][role=switch]:checked { background-color: #34c759 !important; }
.live-dot { background: var(--am) !important; }

/* ═══════════════ Phone: Music app navigation and headers ═══════════════ */
#am-nav { display: none; }
@media (max-width: 720px) {
  .topbar { display: none !important; }
  main { padding-top: calc(14px + env(safe-area-inset-top, 0px)) !important; }
  #am-nav {
    display: flex; justify-content: space-between; align-items: center;
    position: fixed; z-index: 45; top: calc(10px + env(safe-area-inset-top, 0px)); left: 14px; right: 14px; height: 44px;
    pointer-events: none;
  }
  #am-nav > * { pointer-events: auto; }
  .am-nav-back {
    display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: #fff;
    background: rgba(40,40,44,.5); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  }
  .am-nav-back svg { width: 22px; height: 22px; }
  .am-nav-back:active { transform: scale(.9); }
  body.am-root .am-nav-back { visibility: hidden; }
  #am-nav #profile-mobile { display: grid !important; margin-left: auto; }
  body:not(.am-root) #am-nav #profile-mobile { display: none !important; }
  body.am-root #am-nav { top: calc(16px + env(safe-area-inset-top, 0px)); }
  /* Root pages: large title on the avatar's line */
  body.am-root .intro, body.am-root #am-radio .am-title { padding-right: 52px; }
  body:not(.am-root) main { padding-top: calc(64px + env(safe-area-inset-top, 0px)) !important; }
  body[data-view="artist"] main { padding-top: 0 !important; }
  /* Inline back buttons give way to the floating one */
  .am-back[data-am-back], #album-content .artist-back, .am-lib-head .am-back, .am-detail .am-back-float { display: none !important; }
  .am-page-head { padding-top: 64px; margin-top: calc(-64px - env(safe-area-inset-top, 0px)); }

  /* Album, playlist, Liked, genre, Downloaded: ⟲ shuffle · ▶ Play · ⬇ */
  #collection-tools, #album-content .am-actions, .am-detail .am-actions, .dl-tools, #am-page > .am-actions {
    display: flex !important; justify-content: center !important; align-items: center; gap: 14px !important; width: 100%; max-width: none;
  }
  #collection-tools .green-button, #album-content .am-actions .green-button, .am-detail .am-actions .green-button, .dl-tools .green-button, #am-page > .am-actions .green-button {
    order: 2; flex: 0 0 auto !important; min-width: 128px !important; height: 46px; padding: 0 26px !important;
    background: #fff !important; color: #000 !important; font-size: 17px !important;
  }
  #collection-tools .green-button svg, #album-content .am-actions .green-button svg, .am-detail .am-actions .green-button svg, .dl-tools .green-button svg, #am-page > .am-actions .green-button svg { color: #000 !important; }
  #collection-shuffle, #album-shuffle, [data-am-shuffle-list], [data-dl-shuffle] {
    order: 1; flex: 0 0 46px !important; width: 46px !important; min-width: 46px !important; height: 46px; padding: 0 !important; border-radius: 50% !important;
    font-size: 0 !important; gap: 0 !important; justify-content: center;
    background: rgba(255,255,255,.14) !important; color: #fff !important;
  }
  #collection-shuffle svg, #album-shuffle svg, [data-am-shuffle-list] svg, [data-dl-shuffle] svg { width: 20px !important; height: 20px !important; color: #fff !important; }
  #collection-tools .dl-button, #album-content .am-actions .dl-button, #collection-tools #playlist-more {
    order: 3; flex: 0 0 46px !important; width: 46px !important; height: 46px !important; background: rgba(255,255,255,.14) !important;
  }
  #collection-tools .dl-button svg, #album-content .am-actions .dl-button svg, #playlist-more svg { color: #fff !important; }
  body[data-view="playlist"] #collection-tools .dl-button { display: none !important; }

  /* Artist: name centred on the photo, white play below */
  #artist-content .artist-hero { min-height: 72vh !important; margin-top: 0 !important; padding-bottom: 22px !important; }
  #artist-content .artist-hero > div { flex-direction: column; justify-content: flex-end; align-items: center !important; gap: 16px; text-align: center; }
  #artist-name { font-size: 34px !important; text-align: center; }
  #artist-play { order: 2; width: 56px !important; height: 56px !important; background: #fff !important; }
  #artist-play svg { color: #000 !important; }
}
@media (max-width: 720px) {
  #artist-content .artist-hero { flex-direction: column !important; justify-content: flex-end !important; align-items: stretch !important; }
  #collection-tools #collection-shuffle, #album-content #album-shuffle, #am-page [data-am-shuffle-list], #downloads-content [data-dl-shuffle] {
    flex: 0 0 46px !important; width: 46px !important; min-width: 46px !important; max-width: 46px; font-size: 0 !important;
  }
  #collection-tools #collection-shuffle svg { margin: 0 !important; }
}