/*
  MUSIC GOLD — YOUTUBE MUSIC THEME
  This file is a color-and-surface override only. The original blue system
  remains untouched in v4.css and can be restored with ?theme=blue.
*/

:root {
  --v4-bg: #030303;
  --v4-panel: #0f0f0f;
  --v4-panel-raised: #181818;
  --v4-line: #2a2a2a;
  --v4-line-soft: #202020;
  --v4-text: #ffffff;
  --v4-muted: #a7a7a7;
  --v4-orange: #ff0033;
  --v4-active: #241015;
  --ytm-black: #030303;
  --ytm-panel: #0f0f0f;
  --ytm-raised: #181818;
  --ytm-hover: #242424;
  --ytm-line: #2a2a2a;
  --ytm-line-soft: #202020;
  --ytm-white: #ffffff;
  --ytm-muted: #aaaaaa;
  --ytm-faint: #717171;
  --ytm-red: #ff0033;
  --ytm-red-soft: rgba(255, 0, 51, .14);
  --ytm-pink: #ff5f7f;
}

html,
body,
.discovery-machine,
.three-column-workspace,
.song-card-stage,
.song-card,
.card-carousel,
.song-card-strip {
  color: var(--ytm-white);
  background: var(--ytm-black);
}

body {
  font-family: "Helvetica Neue", Arial, sans-serif;
}

.mobile-setting-popup {
  display: none;
}

::selection {
  color: #fff;
  background: var(--ytm-red);
}

/* One continuous black player shell. */
.machine-header,
.site-footer {
  color: var(--ytm-white);
  background: #080808;
  border-color: var(--ytm-line);
  box-shadow: none;
}

.machine-brand,
.context-tag,
.header-song-actions,
.site-footer > .footer-toggle,
.site-footer > .quest-completion {
  border-color: var(--ytm-line);
}

.machine-brand strong,
.context-tag strong,
.quest-completion strong,
.site-footer > .footer-toggle strong {
  color: var(--ytm-white);
}

.context-tag small,
.context-icon,
.footer-toggle span,
.quest-completion > span,
.footer-icon {
  color: var(--ytm-muted);
}

.context-tag:hover,
.context-tag:focus-visible,
#headerSongTag:hover,
#headerSongTag:focus-visible,
#headerSongTag.copied,
.site-footer > .footer-toggle:hover,
.site-footer > .footer-toggle:focus-visible {
  color: var(--ytm-white);
  background: var(--ytm-hover);
  border-color: #3a3a3a;
  box-shadow: none;
}

.context-tag:hover small,
.context-tag:focus-visible small,
.context-tag:hover .context-icon,
.context-tag:focus-visible .context-icon,
.site-footer > .footer-toggle:hover span,
.site-footer > .footer-toggle:focus-visible span,
.site-footer > .footer-toggle:hover .footer-icon,
.site-footer > .footer-toggle:focus-visible .footer-icon {
  color: var(--ytm-white);
}

.machine-header .machine-brand:hover {
  background: transparent !important;
}

.header-context {
  scrollbar-width: none;
}

.header-context::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Dark catalog drawer, with red used only for the current choice. */
.browser-panel {
  background: linear-gradient(145deg, #100307 0%, #080204 52%, #030101 100%);
  border-color: #43131d;
  box-shadow: none;
}

.browser-level,
.country-list,
.playlist-list,
.single-song-list {
  background: linear-gradient(155deg, #0e0306 0%, #070203 54%, #020101 100%);
  scrollbar-color: #7b2738 #120508;
}

.browser-panel .library-header,
.browser-panel .browser-level > .library-header,
.country-list-heading,
.playlist-list-heading,
.song-list-heading,
.country-context-header {
  color: var(--ytm-white);
  background: #120409;
  border-color: #43131d;
  box-shadow: none;
}

.library-header strong,
.country-context-header strong,
.country-globe,
.level-back,
.country-context-header .header-country-count {
  color: var(--ytm-white);
}

.country-row,
.playlist-row,
.single-song-list .song-row {
  color: var(--ytm-white);
  background: linear-gradient(90deg, rgba(16, 3, 7, .92), rgba(5, 1, 3, .94));
  border-bottom-color: #351018;
  box-shadow: none;
}

.country-row:hover,
.playlist-row:hover,
.single-song-list .song-row:hover {
  color: #fff;
  background: linear-gradient(90deg, rgba(133, 15, 39, .3), rgba(70, 8, 22, .16));
  box-shadow: inset 3px 0 0 #a9213c;
}

.country-row.active,
.playlist-row.active,
.single-song-list .song-row.active {
  color: var(--ytm-white);
  background: linear-gradient(90deg, rgba(255, 0, 51, .19), rgba(255, 0, 51, .07));
  box-shadow: inset 3px 0 0 var(--ytm-red);
}

.country-row strong,
.country-row em,
.playlist-row strong,
.playlist-row em,
.single-song-list .song-title,
.single-song-list .song-views,
.country-row.active strong,
.country-row.active em,
.playlist-row.active strong,
.playlist-row.active em,
.single-song-list .song-row.active .song-title,
.single-song-list .song-row.active .song-views {
  color: var(--ytm-white);
}

.country-row::before,
.playlist-row::before,
.single-song-list .song-row::before {
  background: none !important;
  filter: none !important;
}

.country-row::after {
  background: linear-gradient(90deg,
    var(--ytm-red) 0,
    var(--ytm-red) var(--country-progress, 0%),
    #343434 var(--country-progress, 0%),
    #343434 100%);
  box-shadow: none;
}

[data-browser-level="playlists"] .playlist-led,
.single-song-list .song-led {
  background: #555;
  box-shadow: none;
}

[data-browser-level="playlists"] .playlist-row.active .playlist-led,
.single-song-list .song-row.active .song-led {
  background: var(--ytm-red);
  box-shadow: 0 0 8px rgba(255, 0, 51, .54);
}

.single-song-list .song-row.heard .song-led {
  background: #f5c451;
  box-shadow: none;
}

.single-song-list .song-row.saved .song-led,
.single-song-list .song-row.saved.active .song-led,
.single-song-list .song-row.saved:hover .song-led,
.single-song-list .song-save-heart {
  color: var(--ytm-pink);
  background-color: var(--ytm-pink);
}

.single-song-list .song-save-heart {
  background: transparent;
}

.playlist-cover,
.single-song-list .song-row-thumbnail {
  background: #1b1b1b;
  border-color: #353535;
  box-shadow: none;
}

/* YouTube-style artwork grid: images carry the color, chrome recedes. */
.song-card:not(.grid-mode),
.song-preview-card,
.current-card,
.side-card {
  background: var(--ytm-black);
  border-color: transparent;
  box-shadow: none;
}

.six-song-media,
.preview-artwork,
.song-card-artwork {
  background: #000;
  border-color: #2d2d2d;
  box-shadow: none;
}

.six-song-tile.current .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .28);
}

.six-song-copy strong,
.preview-card-copy > strong,
.card-title-block h2,
.side-card-select,
.song-card-strip .card-position b,
.song-card-strip .card-position i,
.song-card-strip .card-position em {
  color: var(--ytm-white);
}

.six-song-copy small,
.preview-card-copy > small,
#currentArtist {
  color: var(--ytm-muted);
}

.six-song-copy span,
.preview-card-views,
.card-views-line {
  color: var(--ytm-faint);
}

.six-song-position,
.song-thumbnail-position {
  color: #fff;
  text-shadow: none;
}

.six-song-control,
.card-thumbnail-play,
.current-card-action,
.current-card-heart {
  color: #111;
  background: rgba(255, 255, 255, .94);
  border-color: rgba(255, 255, 255, .78);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .42);
}

.six-song-control:hover,
.six-song-control:focus-visible,
.card-thumbnail-play:hover,
.card-thumbnail-play:focus-visible,
.current-card-action:hover,
.current-card-action:focus-visible {
  color: #fff;
  background: var(--ytm-red);
  border-color: var(--ytm-red);
}

.six-song-heart:not(.saved):hover,
.six-song-heart:not(.saved):focus-visible {
  color: var(--ytm-red);
  background: rgba(255, 255, 255, .94);
  border-color: rgba(255, 255, 255, .78);
}

.six-song-heart:not(.saved):hover svg,
.six-song-heart:not(.saved):focus-visible svg {
  fill: var(--ytm-red);
  stroke: var(--ytm-red);
}

.six-song-heart.saved,
.six-song-heart.saved:hover,
.six-song-heart.saved:focus-visible,
.current-card-heart.saved,
.current-card-heart.saved:hover,
.current-card-heart.saved:focus-visible {
  color: #fff;
  background: var(--ytm-red);
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .2), 0 5px 18px rgba(255, 0, 51, .2);
}

/* Song cards use the heart itself as the control instead of a white disc. */
.six-song-heart,
.six-song-heart:hover,
.six-song-heart:focus-visible,
  .six-song-heart.saved,
  .six-song-heart.saved:hover,
  .six-song-heart.saved:focus-visible {
  width: 61px;
  height: 61px;
  color: #fff;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.six-song-heart svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  filter: drop-shadow(0 3px 7px rgba(0, 0, 0, .75));
}

.six-song-heart:not(.saved):not(:hover):not(:focus-visible) svg {
  fill: #fff;
  stroke: #fff;
}

.six-song-heart:not(.saved):hover,
.six-song-heart:not(.saved):focus-visible,
.six-song-heart.saved,
.six-song-heart.saved:hover,
.six-song-heart.saved:focus-visible {
  color: var(--ytm-red);
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.six-song-heart:not(.saved):hover svg,
.six-song-heart:not(.saved):focus-visible svg {
  fill: #fff;
  stroke: #fff;
}

.six-song-heart.saved svg,
.six-song-heart.saved:hover svg,
.six-song-heart.saved:focus-visible svg {
  fill: var(--ytm-red);
  stroke: var(--ytm-red);
}

@media (max-width: 1350px) {
  .six-song-heart,
  .six-song-heart:hover,
  .six-song-heart:focus-visible,
  .six-song-heart.saved,
  .six-song-heart.saved:hover,
  .six-song-heart.saved:focus-visible {
    width: 58px;
    height: 58px;
  }
}

.current-card-action:disabled {
  color: #666;
  background: #1b1b1b;
  border-color: #333;
}

.playlist-grid-cell {
  background: #1c1c1c;
  border-color: #343434;
  box-shadow: none;
}

.playlist-grid-cell.complete {
  background: #f2b84b;
  border-color: #ffd77b;
}

.playlist-grid-cell.current {
  background: var(--ytm-red);
  border-color: #ff6a87;
  box-shadow: 0 0 16px rgba(255, 0, 51, .46);
}

.playlist-grid-cell.liked:not(.current) {
  background: var(--ytm-pink);
  border-color: #ff9caf;
}

/* Footer behaves like a compact now-playing/settings shelf. */
.quest-completion > span,
.footer-toggle:hover span,
.footer-toggle:focus-visible span,
.footer-toggle:hover .footer-icon,
.footer-toggle:focus-visible .footer-icon {
  color: var(--ytm-red);
}

.site-footer > .footer-toggle::before {
  background: var(--ytm-line);
}

.footer-toggle:focus-visible {
  outline: 1px solid var(--ytm-red);
  outline-offset: 8px;
}

::-webkit-scrollbar {
  background: var(--ytm-panel);
}

::-webkit-scrollbar-thumb {
  background: #454545;
  border-color: var(--ytm-panel);
}

::-webkit-scrollbar-thumb:hover {
  background: #5b5b5b;
}

/*
  Hover fields stay invisible until interaction. Red is the product signal,
  not a permanent box around every header/footer control.
*/
.machine-header .context-tag,
.machine-header #headerSongTag,
.site-footer > .footer-toggle {
  color: var(--ytm-white);
  background: transparent;
  border: 1px solid transparent;
  box-shadow: none;
}

.machine-header .context-tag:hover,
.machine-header .context-tag:focus-visible,
.machine-header #headerSongTag:hover,
.machine-header #headerSongTag:focus-visible,
.site-footer > .footer-toggle:hover,
.site-footer > .footer-toggle:focus-visible {
  color: #fff;
  background: rgba(255, 0, 51, .16);
  border-color: var(--ytm-red);
  box-shadow: inset 0 0 22px rgba(255, 0, 51, .08), 0 0 0 1px rgba(255, 0, 51, .08);
  outline: 0;
}

/* Empty navigation stages are labels, not interactive controls. */
.machine-header .context-tag:disabled,
.machine-header #headerSongTag:disabled {
  pointer-events: none;
  cursor: default;
  opacity: 1;
}

.machine-header .context-tag::before,
.site-footer > .footer-toggle::before {
  background: #3b171f;
}

.machine-header,
.site-footer,
.browser-panel,
.browser-panel .library-header,
.browser-panel .browser-level > .library-header,
.country-context-header {
  border-color: #35141b;
}

.context-tag small,
.context-icon,
.footer-toggle span,
.footer-icon,
.quest-completion > span {
  color: #e73b5d;
}

.machine-header .context-tag:hover small,
.machine-header .context-tag:focus-visible small,
.machine-header .context-tag:hover .context-icon,
.machine-header .context-tag:focus-visible .context-icon,
.site-footer > .footer-toggle:hover span,
.site-footer > .footer-toggle:focus-visible span,
.site-footer > .footer-toggle:hover .footer-icon,
.site-footer > .footer-toggle:focus-visible .footer-icon {
  color: #ff5b79;
}

.country-row.active,
.playlist-row.active,
.single-song-list .song-row.active {
  background: linear-gradient(90deg, rgba(255, 0, 51, .27), rgba(255, 0, 51, .08));
  box-shadow: inset 3px 0 0 var(--ytm-red), inset 0 1px 0 rgba(255, 69, 104, .13), inset 0 -1px 0 rgba(255, 69, 104, .1);
}

.six-song-tile.current .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .34), 0 12px 34px rgba(255, 0, 51, .08);
}

::-webkit-scrollbar-thumb {
  background: #6b2432;
}

::-webkit-scrollbar-thumb:hover {
  background: #a92f47;
}

/* Shared section-label red across footer and catalog hierarchy. */
.quest-completion > span,
.footer-toggle span,
.site-footer > .footer-toggle:hover span,
.site-footer > .footer-toggle:focus-visible span,
.browser-panel .library-header strong,
.browser-panel .country-context-header strong {
  color: #e73b5d;
}

.machine-header .machine-brand strong {
  color: var(--ytm-white);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: .035em;
}

.machine-header .machine-brand:hover strong,
.machine-header .machine-brand:focus-visible strong {
  color: var(--ytm-white);
}

.liked-songs-entry {
  color: #fff;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.liked-songs-entry .liked-songs-heart,
.liked-songs-entry em {
  color: #e73b5d;
}

.liked-songs-entry:hover,
.liked-songs-entry:focus-visible,
.liked-songs-entry.active {
  color: #fff;
  background: rgba(255, 0, 51, .16);
  border-color: var(--ytm-red);
  box-shadow: inset 0 0 22px rgba(255, 0, 51, .08), 0 0 0 1px rgba(255, 0, 51, .08);
}

.liked-songs-empty strong {
  color: #fff;
  background: none;
  border: 0;
  box-shadow: none;
  text-decoration: none;
}

.liked-songs-empty strong::before,
.liked-songs-empty strong::after {
  content: none;
  display: none;
}

.liked-songs-empty span,
.liked-list-empty {
  color: #a64055;
}

.home-page {
  background: var(--ytm-black);
}

.discovery-machine.home-mode {
  grid-template-rows: 68px minmax(0, 1fr) 68px;
}

.home-navigation {
  background: linear-gradient(155deg, #100307 0%, #070203 58%, #020101 100%);
  border-color: #351018;
}

.home-navigation-heading,
.home-navigation-item {
  border-color: #351018;
}

.home-navigation-heading span,
.home-eyebrow,
.home-navigation-item span,
.home-navigation-item em,
.home-metrics span {
  color: #e73b5d;
}

.home-navigation-item:hover,
.home-navigation-item:focus-visible,
.home-navigation-item.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(133, 15, 39, .3), rgba(70, 8, 22, .16));
  box-shadow: inset 3px 0 0 #a9213c;
  outline: 0;
}

.home-content {
  background:
    radial-gradient(circle at 82% 20%, rgba(126, 10, 34, .16), transparent 32%),
    linear-gradient(145deg, #090203 0%, #030303 52%, #050102 100%);
  border-color: #351018;
}

.home-intro { color: #aaa; }
.home-metrics { border-color: #351018; }
.home-metrics div { border-color: #351018; }

.home-primary-action,
.home-contact-action {
  border-color: #8f1f36;
}

.home-primary-action:hover,
.home-primary-action:focus-visible,
.home-contact-action:hover,
.home-contact-action:focus-visible {
  color: #fff;
  background: rgba(255, 0, 51, .16);
  border-color: var(--ytm-red);
  box-shadow: inset 0 0 22px rgba(255, 0, 51, .08);
  outline: 0;
}

.home-contact-notes span {
  color: #b96375;
  border-color: #351018;
}

.liked-songs-icon-entry {
  color: var(--ytm-red);
  background: transparent;
  border-color: transparent;
}

.liked-songs-icon-entry.active {
  color: #fff;
  background: #971b36;
  border-color: #cf294b;
  box-shadow: 0 0 18px rgba(151, 27, 54, .24);
}

.liked-songs-icon-entry:hover,
.liked-songs-icon-entry:focus-visible {
  color: var(--ytm-red);
  background: #000;
  border-color: #fff;
  box-shadow: none;
}

.full-player-entry {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  padding: 0;
  color: #e73b5d;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
}
.full-player-entry[hidden] { display: none; }

.full-player-entry svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.full-player-entry:hover,
.full-player-entry:focus-visible,
.full-player-entry[aria-expanded="true"] {
  color: #fff;
  background: #971b36;
  border-color: #cf294b;
  outline: 0;
}

.full-screen-player {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  color: #fff;
  background: #020202;
  border: 0;
}

.full-screen-player::backdrop { background: #000; }
.full-screen-player-content {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #020202;
  background-image:
    radial-gradient(circle at 50% 48%, rgba(219, 38, 76, .16), transparent 42%),
    radial-gradient(circle, rgba(255, 255, 255, .075) 1px, transparent 1.3px);
  background-size: auto, 24px 24px;
}

.focus-mode-header {
  position: absolute;
  top: 24px;
  left: clamp(24px, 3vw, 54px);
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 24px;
}
.focus-mode-header div { display: flex; align-items: baseline; gap: 14px; }
.focus-mode-header small { color: #777; font-size: 11px; font-weight: 800; letter-spacing: .18em; }
.focus-mode-header strong { color: #fff; font-size: 18px; letter-spacing: .08em; }
.focus-mode-header > span { color: var(--ytm-red); font-size: 12px; font-weight: 800; letter-spacing: .08em; }

.focus-mode-stack {
  position: absolute;
  inset: 68px 0 104px;
  overflow: hidden;
}
.full-screen-player-track {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  grid-template-columns: minmax(340px, 50vw) minmax(260px, 34vw);
  gap: clamp(28px, 4vw, 70px);
  width: min(88vw, 1480px);
  align-items: center;
  transform: translate(-50%, -50%);
  animation: focus-card-enter .28s ease both;
}
@keyframes focus-card-enter {
  from { opacity: .2; transform: translate(-50%, calc(-50% + 32px)) scale(.985); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.full-screen-player-artwork-wrap {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #080808;
  border: 1px solid rgba(231, 59, 93, .7);
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .72), 0 0 42px rgba(231, 59, 93, .1);
}

.full-screen-player-artwork {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.full-screen-player-heart {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: clamp(64px, 6vw, 96px);
  height: clamp(64px, 6vw, 96px);
  place-items: center;
  padding: 0;
  color: #fff;
  background: rgba(0, 0, 0, .2);
  border: 0;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
}
.full-screen-player-heart svg {
  width: 72%;
  height: 72%;
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 1.2;
}
.full-screen-player-heart:hover,
.full-screen-player-heart:focus-visible,
.full-screen-player-heart.saved { color: var(--ytm-red); outline: 0; }

.focus-mode-song-copy { min-width: 0; }
.focus-mode-context {
  margin: 0 0 13px;
  color: var(--ytm-red);
  font-size: clamp(13px, 1vw, 18px);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.full-screen-player-title {
  margin: 0;
  color: #fff;
  font-size: clamp(42px, 5.6vw, 104px);
  font-weight: 700;
  line-height: .9;
  overflow-wrap: anywhere;
}
.focus-mode-artist {
  margin: 18px 0 0;
  color: #aaa;
  font-size: clamp(20px, 2vw, 34px);
  font-weight: 650;
}

.focus-mode-peek {
  position: absolute;
  left: 50%;
  display: flex;
  width: min(46vw, 760px);
  height: 18vh;
  align-items: center;
  gap: 20px;
  overflow: hidden;
  opacity: .18;
  filter: grayscale(.4) blur(.4px);
  transform: translateX(-50%) scale(.9);
  pointer-events: none;
}
.focus-mode-peek-previous { top: -10vh; }
.focus-mode-peek-next { bottom: -10vh; }
.focus-mode-peek img { width: 44%; height: 100%; object-fit: cover; border-radius: 6px; }
.focus-mode-peek span { max-width: 48%; color: #fff; font-size: clamp(24px, 3vw, 50px); font-weight: 750; line-height: .95; }
.focus-mode-peek[hidden] { display: none; }

.focus-mode-dots {
  position: absolute;
  top: 50%;
  right: clamp(18px, 2.6vw, 48px);
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 9px;
  transform: translateY(-50%);
}
.focus-mode-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  background: #5b5b5b;
  border: 0;
  border-radius: 50%;
  opacity: .55;
  cursor: pointer;
}
.focus-mode-dots button.active { background: var(--ytm-red); opacity: 1; transform: scale(1.65); }
.focus-mode-dots button:hover,
.focus-mode-dots button:focus-visible { background: #fff; opacity: 1; outline: 0; }

.full-screen-player-links {
  position: absolute;
  right: clamp(28px, 4vw, 72px);
  bottom: 118px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.full-screen-player-views {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: .18em;
  color: #fff;
  font-size: clamp(42px, 5vw, 88px);
  font-weight: 700;
  line-height: .8;
  text-align: right;
  text-decoration: none;
}
.full-screen-player-views small { font-size: .24em; font-weight: 650; }
.full-screen-player-youtube {
  margin-top: 10px;
  color: #fff;
  font-size: clamp(17px, 1.7vw, 28px);
  font-weight: 700;
  letter-spacing: .03em;
  text-align: right;
  text-decoration: none;
}
.full-screen-player-views:hover,
.full-screen-player-views:focus-visible,
.full-screen-player-youtube:hover,
.full-screen-player-youtube:focus-visible { color: var(--ytm-red); outline: 0; }
.full-screen-player-close {
  position: fixed;
  top: 18px;
  right: 20px;
  z-index: 2;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  padding: 0;
  color: #fff;
  background: #000;
  border: 1px solid #3b1119;
  border-radius: 4px;
  font: 400 34px/1 Arial, sans-serif;
  cursor: pointer;
}
.full-screen-player-close:hover,
.full-screen-player-close:focus-visible { color: var(--ytm-red); border-color: var(--ytm-red); outline: 0; }

.focus-mode-actions {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  display: flex;
  min-height: 88px;
  align-items: stretch;
  justify-content: center;
  background: rgba(10, 0, 3, .95);
  border-top: 1px solid #3b1119;
  backdrop-filter: blur(18px);
}
.focus-mode-actions button {
  display: flex;
  min-width: 128px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 22px;
  color: #aaa;
  background: transparent;
  border: 0;
  border-right: 1px solid #281016;
  cursor: pointer;
}
.focus-mode-actions button:hover,
.focus-mode-actions button:focus-visible { color: #fff; background: #971b36; outline: 0; }
.focus-mode-actions kbd { color: var(--ytm-red); font: 800 12px/1 Arial, sans-serif; }
.focus-mode-actions button:hover kbd { color: #fff; }
.focus-mode-actions span { font-size: 12px; font-weight: 800; letter-spacing: .05em; }

.focus-mode-complete {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: grid;
  place-content: center;
  justify-items: center;
  overflow: hidden;
  text-align: center;
  background: #020202;
}
.focus-mode-complete[hidden] { display: none; }
.focus-mode-complete > p { z-index: 2; margin: 0 0 10px; color: var(--ytm-red); font-weight: 800; letter-spacing: .16em; }
.focus-mode-complete > h2 { z-index: 2; margin: 0; color: #fff; font-size: clamp(54px, 9vw, 150px); line-height: .9; }
.focus-mode-complete > span { z-index: 2; margin-top: 24px; color: #999; font-size: clamp(17px, 1.5vw, 26px); }
.focus-mode-complete > div:last-child { z-index: 2; display: flex; gap: 12px; margin-top: 34px; }
.focus-mode-complete button { padding: 14px 18px; color: #fff; background: #971b36; border: 1px solid #cf294b; font-weight: 800; cursor: pointer; }
.focus-mode-complete button:last-child { background: #090909; border-color: #383838; }
.focus-mode-confetti { position: absolute; inset: 0; pointer-events: none; }
.focus-mode-confetti i {
  position: absolute;
  top: -8vh;
  left: var(--confetti-x);
  width: var(--confetti-size);
  height: calc(var(--confetti-size) * 1.7);
  background: var(--confetti-color);
  animation: focus-confetti-fall var(--confetti-duration) var(--confetti-delay) linear infinite;
}
@keyframes focus-confetti-fall {
  to { transform: translate3d(var(--confetti-drift), 118vh, 0) rotate(760deg); }
}

@media (max-width: 760px) {
  .focus-mode-header { top: 16px; left: 16px; }
  .focus-mode-header small { display: none; }
  .focus-mode-stack { inset: 58px 0 128px; }
  .full-screen-player-track { grid-template-columns: 1fr; gap: 18px; width: min(84vw, 580px); }
  .full-screen-player-title { font-size: clamp(34px, 11vw, 66px); }
  .focus-mode-context { margin-bottom: 8px; }
  .focus-mode-artist { margin-top: 10px; }
  .full-screen-player-links { right: 16px; bottom: 134px; }
  .full-screen-player-views { font-size: 42px; }
  .focus-mode-dots { right: 10px; gap: 6px; }
  .focus-mode-actions { flex-wrap: wrap; min-height: 116px; }
  .focus-mode-actions button { min-width: 33.333%; padding: 0 7px; }
  .focus-mode-actions span { font-size: 10px; }
  .full-screen-player-close { top: 10px; right: 10px; }
}

@media (max-width: 1350px) {
  .machine-header .machine-brand strong {
    font-size: 20px;
  }
}

/* Keep scan timing at the far-left and personal controls at the far-right. */
.site-footer > .footer-toggle[data-cycle-setting="quickPlay"] {
  margin-left: 0 !important;
}

.site-footer > #likedSongsEntry {
  margin-left: auto !important;
}

/* Restored wordmark: quiet, white, and fixed to the far-left. */
.machine-header .machine-brand {
  width: auto;
  flex: 0 0 auto;
  padding: 0 23px 0 26px;
  color: #fff;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  cursor: pointer;
}

.machine-header .context-tag {
  padding-inline: 19px;
}

@media (max-width: 1350px) {
  .machine-header .context-tag {
    padding-inline: 13px;
  }
}

.machine-header .machine-brand strong {
  color: #fff;
  font-size: 29.92px;
  font-weight: 600;
  letter-spacing: .018em;
}

@media (max-width: 1350px) {
  .machine-header .machine-brand strong {
    font-size: 24.31px;
  }
}

.machine-header .machine-brand:hover,
.machine-header .machine-brand:focus-visible {
  color: #fff;
  background: transparent !important;
  border-color: transparent;
  box-shadow: none;
  outline: 0;
}

/* Keep the homepage player chrome out of the way after the visitor scrolls. */
@media (min-width: 761px) {
  .discovery-machine.home-mode {
    transition: grid-template-rows 180ms ease;
  }

  .machine-header {
    transition: opacity 140ms ease, transform 180ms ease;
  }

  .discovery-machine.home-mode.home-header-hidden {
    grid-template-rows: 0 minmax(0, 1fr) 68px;
  }

  .discovery-machine.home-mode.home-header-hidden .machine-header {
    min-height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-100%);
  }
}

.machine-header .machine-brand strong {
  font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: .01em;
}

.country-gallery-tile:hover .six-song-media,
.country-gallery-tile:focus-within .six-song-media,
.playlist-gallery-tile:hover .six-song-media,
.playlist-gallery-tile:focus-within .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .24), 0 10px 28px rgba(255, 0, 51, .14);
}

/* Footer balance: progress at far-left, listening controls at far-right. */
.site-footer > .quest-completion {
  position: static;
  display: flex;
  width: auto;
  min-width: 0;
  height: 53px;
  flex: 0 0 auto;
  align-items: center;
  justify-items: initial;
  gap: 14px;
  padding: 0 20px 0 0;
  border: 0;
  transform: translateY(5px);
}

.site-footer > .quest-completion > span {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .08em;
}

.site-footer > .quest-completion > strong {
  margin: 0;
  gap: 8px;
  font-size: 39px;
  font-weight: 450;
  line-height: .9;
  letter-spacing: .015em;
}

.site-footer > .quest-completion > strong b,
.site-footer > .quest-completion > strong em {
  color: #fff;
  font-weight: 450;
}

.site-footer > .quest-completion > strong i {
  color: #e73b5d;
}

.site-footer > .quest-completion + .footer-toggle,
.site-footer > .footer-toggle[data-cycle-setting="quickPlay"] {
  margin-left: auto !important;
}

.site-footer > #likedSongsEntry {
  margin-left: 0 !important;
}

.site-footer > .footer-toggle {
  transform: translateY(6px);
}

/* The active red theme owns every gallery hover and panel scrollbar. */
.six-song-tile:hover .six-song-media,
.six-song-tile:focus-within .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .28), 0 10px 28px rgba(255, 0, 51, .14);
}

.six-song-select:focus-visible {
  outline-color: var(--ytm-red);
}

.browser-level,
.country-list,
.playlist-list,
.single-song-list,
.liked-sidebar-list,
.song-card-stage,
.song-card-stage.has-playlist-selection {
  scrollbar-color: #9f2840 #120508;
  scrollbar-width: thin;
}

.browser-level::-webkit-scrollbar-track,
.country-list::-webkit-scrollbar-track,
.playlist-list::-webkit-scrollbar-track,
.single-song-list::-webkit-scrollbar-track,
.liked-sidebar-list::-webkit-scrollbar-track,
.song-card-stage::-webkit-scrollbar-track {
  background: #120508;
}

.browser-level::-webkit-scrollbar-thumb,
.country-list::-webkit-scrollbar-thumb,
.playlist-list::-webkit-scrollbar-thumb,
.single-song-list::-webkit-scrollbar-thumb,
.liked-sidebar-list::-webkit-scrollbar-thumb,
.song-card-stage::-webkit-scrollbar-thumb {
  background: #7f1f33;
  border-color: #120508;
}

.browser-level::-webkit-scrollbar-thumb:hover,
.country-list::-webkit-scrollbar-thumb:hover,
.playlist-list::-webkit-scrollbar-thumb:hover,
.single-song-list::-webkit-scrollbar-thumb:hover,
.liked-sidebar-list::-webkit-scrollbar-thumb:hover,
.song-card-stage::-webkit-scrollbar-thumb:hover {
  background: #c52f4d;
}

/* Carry the country-card burgundy depth through the full Liked Songs rail. */
.liked-sidebar {
  background:
    radial-gradient(circle at 50% 28%, rgba(210, 48, 83, .12), transparent 58%),
    linear-gradient(145deg, #18080c 0%, #090506 58%, #050404 100%);
}

.liked-sidebar-header,
.liked-sidebar-columns {
  background: rgba(10, 4, 6, .18);
}

.liked-sidebar-list {
  background: linear-gradient(180deg, rgba(9, 5, 6, .28), rgba(5, 4, 4, .68));
}

.liked-sidebar-header > strong {
  color: #e73b5d;
}

.site-footer > .footer-toggle:hover span,
.site-footer > .footer-toggle:focus-visible span,
.site-footer > .footer-toggle:hover .footer-icon,
.site-footer > .footer-toggle:focus-visible .footer-icon {
  color: #f45a76;
}

.site-footer > .footer-toggle:hover,
.site-footer > .footer-toggle:focus-visible {
  background: rgba(255, 0, 51, .06);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .08);
}

.machine-header .context-tag:not(:disabled):hover,
.machine-header .context-tag:not(:disabled):focus-visible,
.machine-header #headerSongTag:not(:disabled):hover,
.machine-header #headerSongTag:not(:disabled):focus-visible {
  background: rgba(255, 0, 51, .06);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .08);
}

#headerSongTag:hover small,
#headerSongTag:focus-visible small {
  color: #f45a76;
}

/* Keep the Saved Gold rail completely black; red is reserved for its lines and states. */
.browser-panel,
.browser-panel .browser-level,
.browser-panel .country-list,
.browser-panel .playlist-list,
.browser-panel .single-song-list,
.browser-panel .liked-sidebar,
.browser-panel .liked-sidebar-header,
.browser-panel .liked-sidebar-columns,
.browser-panel .liked-sidebar-list,
.browser-panel .library-header,
.browser-panel .browser-level > .library-header,
.browser-panel .country-list-heading,
.browser-panel .playlist-list-heading,
.browser-panel .song-list-heading,
.browser-panel .country-context-header,
.browser-panel .country-row,
.browser-panel .playlist-row,
.browser-panel .single-song-list .song-row {
  background: #000;
}

.browser-panel .browser-level,
.browser-panel .country-list,
.browser-panel .playlist-list,
.browser-panel .single-song-list,
.browser-panel .liked-sidebar-list {
  scrollbar-color: #7f1f33 #000;
}

.browser-panel .browser-level::-webkit-scrollbar-track,
.browser-panel .country-list::-webkit-scrollbar-track,
.browser-panel .playlist-list::-webkit-scrollbar-track,
.browser-panel .single-song-list::-webkit-scrollbar-track,
.browser-panel .liked-sidebar-list::-webkit-scrollbar-track {
  background: #000;
}

/* Match the top navigation surface to the pure-black catalog rail. */
.machine-header {
  background: #000;
}

/* The temporary copy confirmation must stay inside the red theme after click. */
.machine-header #headerSongTag.copied {
  color: #fff;
  background: rgba(255, 0, 51, .16);
  border-color: var(--ytm-red);
  box-shadow: inset 0 0 22px rgba(255, 0, 51, .08), 0 0 0 1px rgba(255, 0, 51, .08);
  outline: 0;
}

.machine-header #headerSongTag.copied small {
  color: #f45a76;
}

.machine-header #headerSongTag.copied strong {
  color: #fff;
}

.six-song-title-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
}

.six-song-title-row strong {
  min-width: 0;
}

.six-song-copy-play {
  display: inline-flex;
  flex: 0 0 auto;
  width: auto;
  height: auto;
  align-items: center;
  align-self: center;
  justify-content: center;
  padding: 0;
  position: relative;
  top: -1px;
  color: #fff;
  background: transparent;
  border: 0;
  cursor: pointer;
  font: 500 19px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  text-shadow: 0 2px 7px rgba(0, 0, 0, .8);
}

.six-song-copy-play > span {
  display: block;
  line-height: 1;
  transform: none;
}

.six-song-copy-play:hover,
.six-song-copy-play:focus-visible {
  color: #fff;
  outline: 0;
}

.six-song-tile.current .six-song-copy strong {
  color: #fff;
  font-size: clamp(19.8px, calc(1.305vw + 1.8px), 23.4px);
}

.six-song-tile.current .six-song-copy-play,
.six-song-tile.current .six-song-copy-play:hover,
.six-song-tile.current .six-song-copy-play:focus-visible {
  color: #fff;
}

.six-song-tile.current .six-song-copy small,
.six-song-tile.current .six-song-copy > span {
  color: #fff;
  font-size: 15px;
}

.six-song-tile:not(.country-gallery-tile):hover .six-song-media,
.six-song-tile:not(.country-gallery-tile):focus-within .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 2px rgba(255, 0, 51, .5), 0 10px 28px rgba(255, 0, 51, .14);
}

/* Keep hearts fully luminous; only the song artwork brightens on interaction. */
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) {
  opacity: 1;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-select img {
  opacity: .76;
  filter: brightness(1);
  transition: opacity 140ms ease, filter 140ms ease;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current):hover .six-song-select img,
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current):focus-within .six-song-select img,
.six-song-tile.current .six-song-select img {
  opacity: 1;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current):hover .six-song-select img,
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current):focus-within .six-song-select img {
  filter: brightness(1.08);
}

.six-song-copy-play,
.six-song-copy-play:hover,
.six-song-copy-play:focus,
.six-song-copy-play:focus-visible,
.six-song-copy-play:active {
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: transparent;
  border: 0;
  outline: 0;
  box-shadow: none;
  text-shadow: none;
  transform: none;
  opacity: 1;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current)
  .six-song-heart:not(.saved):not(:hover):not(:focus-visible) svg {
  fill: #fff;
  stroke: #fff;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile):not(.current):hover
  .six-song-heart:not(.saved):not(:hover):not(:focus-visible) svg {
  fill: #fff;
  stroke: #fff;
}

.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart:not(.countdown-active) {
  width: 67.1px;
  height: 67.1px;
}

@media (max-width: 1350px) {
  .six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart:not(.countdown-active) {
    width: 63.8px;
    height: 63.8px;
  }
}

/* A playing card owns its final visual state; hovering it must change nothing. */
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile),
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):hover,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):focus-within {
  opacity: 1;
  transform: none;
  transition: none;
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-select img,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):hover .six-song-select img,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):focus-within .six-song-select img {
  opacity: 1;
  filter: brightness(1.08);
  transition: none;
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart:hover,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart:focus-visible {
  transform: none;
  transition: none;
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart:not(.saved) svg,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):hover .six-song-heart:not(.saved) svg,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):focus-within .six-song-heart:not(.saved) svg {
  fill: #fff;
  stroke: #fff;
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart.countdown-active,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart.countdown-active:hover,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart.countdown-active:focus-visible {
  transform: scale(1.1);
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-heart.countdown-active:not(.saved) svg {
  fill: #000;
  stroke: #000;
}

.discovery-machine:not(.liked-mode) .six-song-heart.saved.countdown-active .heart-countdown {
  transform: translateY(-3px);
}

.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-media,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):hover .six-song-media,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile):focus-within .six-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .34), 0 12px 34px rgba(255, 0, 51, .08);
  transition: none;
}

/* Playback tint: a flat 15%-visible red wash with no gradient or glow. */
.six-song-tile.current.playing:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgba(255, 0, 51, .15);
  box-shadow: none;
  pointer-events: none;
}

/* Mobile is one continuous, full-width discovery feed. */
@media (max-width: 760px) {
  .discovery-machine,
  .discovery-machine.liked-mode {
    grid-template-rows: minmax(0, 1fr) 62px;
  }

  .discovery-machine.home-mode {
    grid-template-rows: minmax(0, 1fr);
  }

  .machine-header {
    display: none !important;
  }

  .home-page,
  .three-column-workspace {
    grid-row: 1;
  }

  .site-footer {
    grid-row: 2;
  }

  .home-page {
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    padding: 10px 12px 24px;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .home-navigation,
  .home-content {
    min-height: auto;
  }

  .three-column-workspace {
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    padding: 0;
  }

  .song-card-stage,
  .song-card-stage.has-playlist-selection {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .card-carousel,
  .song-card,
  .song-card.country-gallery-mode,
  .song-card.playlist-gallery-mode {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .song-card:not(.grid-mode),
  .song-card-stage.has-playlist-selection .song-card:not(.grid-mode) {
    width: 100%;
    min-width: 0;
    padding: 0 12px 28px;
  }

  .six-song-grid,
  .song-card.country-gallery-mode .six-song-grid,
  .song-card.playlist-gallery-mode .six-song-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    gap: 26px;
  }

  .six-song-tile,
  .six-song-tile:not(.country-gallery-tile),
  .country-gallery-tile {
    grid-template-rows: auto minmax(92px, auto);
    width: 100%;
  }

  .six-song-copy,
  .country-gallery-info {
    padding: 13px 3px 0;
  }

  .six-song-copy strong {
    font-size: 24.3px;
  }

  .country-gallery-info strong {
    font-size: 27px;
  }

  .six-song-copy small,
  .six-song-copy span,
  .country-gallery-info small,
  .playlist-gallery-copy small,
  .playlist-gallery-copy span {
    font-size: 15px;
  }

  .country-gallery-flag {
    font-size: 51px;
  }

  .song-card.country-gallery-mode .six-song-grid {
    gap: 18px;
  }

  .country-gallery-tile {
    grid-template-rows: 126px auto;
  }

  .country-gallery-tile .six-song-media {
    width: 100%;
    height: 126px;
    min-height: 126px;
    aspect-ratio: auto;
  }

  .country-gallery-info {
    min-height: 62px;
    padding-top: 10px;
  }

  .country-gallery-info strong {
    font-size: 27px;
  }

  .country-gallery-info small {
    font-size: 15px;
  }

  .right-panel-heading,
  .right-panel-heading.has-description {
    min-height: 0;
    padding: 24px 2px 26px 8px;
  }

  .right-panel-heading > strong {
    font-size: 32px;
    transform: none;
  }

  .right-panel-heading > p {
    font-size: 17px;
    line-height: 1.3;
    transform: none;
  }

  .site-footer {
    position: relative;
    justify-content: flex-start;
    height: 62px;
    padding: 0 6px 4px;
    gap: 4px;
    overflow-y: visible;
    overflow-x: visible;
  }

  .site-footer > .quest-completion,
  .site-footer > .footer-toggle {
    flex: 0 0 auto;
    height: 48px;
    transform: translateY(4px);
  }

  .site-footer > .footer-toggle,
  .site-footer > .footer-toggle[data-cycle-setting="quickPlay"] {
    width: 48px;
    min-width: 48px;
    margin-left: 0 !important;
    padding: 0;
    justify-content: center;
    border-radius: 50%;
  }

  .site-footer > .footer-toggle:first-of-type {
    margin-left: 0 !important;
  }

  .site-footer > .footer-toggle > span,
  .site-footer > .footer-toggle > strong,
  .site-footer > .footer-toggle::before {
    display: none;
  }

  .site-footer > .footer-toggle .footer-icon {
    width: 23px;
    height: 23px;
    margin: 0;
  }

  .site-footer > .quest-completion {
    order: 4;
    width: auto;
    min-width: 0;
    margin-left: auto;
    padding: 0 2px 0 8px;
    justify-content: flex-end;
  }

  .site-footer > .quest-completion > span {
    display: none;
  }

  .site-footer > .quest-completion > strong {
    font-size: 24px;
  }

  .mobile-setting-popup {
    position: absolute;
    right: 10px;
    bottom: calc(100% + 10px);
    z-index: 200;
    display: grid;
    width: min(360px, calc(100vw - 20px));
    padding: 16px;
    gap: 14px;
    color: #fff;
    background: #090607;
    border: 1px solid #5d1d2b;
    border-radius: 12px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .78);
  }

  .mobile-setting-popup[hidden] {
    display: none !important;
  }

  .mobile-setting-popup > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .mobile-setting-popup > header > strong {
    font: 600 18px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
    letter-spacing: .04em;
  }

  .mobile-setting-popup > header > button {
    width: 34px;
    height: 34px;
    padding: 0;
    color: #fff;
    background: transparent;
    border: 1px solid #4d2a32;
    border-radius: 50%;
    font-size: 22px;
  }

  .mobile-setting-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  .mobile-setting-options > button {
    min-height: 44px;
    padding: 0 8px;
    color: #d7cdd0;
    background: #130d0f;
    border: 1px solid #3d252b;
    border-radius: 8px;
    font: 600 14px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  }

  .mobile-setting-options > button.active {
    color: #fff;
    background: rgba(255, 0, 51, .16);
    border-color: var(--ytm-red);
  }

  .liked-songs-empty {
    min-height: 48vh;
  }
}

/* Global-first landing page: immediate music discovery, country choice below. */
.home-page {
  display: block;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
  background: #030303;
  scroll-behavior: smooth;
}

.home-page::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Homepage section navigator: a floating music-and-country rail with no track. */
.ug-section-dock {
  position: fixed;
  inset: calc(50% + 8px) 18px auto auto;
  z-index: 120;
  width: 40px;
  display: none;
  align-content: center;
  justify-items: center;
  gap: 23px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: translateY(-50%);
}

.ug-section-dock[hidden] { display: none; }

.ug-section-dock a {
  position: relative;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #e73b5d;
  text-decoration: none !important;
  opacity: .34;
  transform: scale(.84);
  transition: opacity 170ms ease, transform 170ms ease, filter 170ms ease;
}

.ug-section-dock a:hover,
.ug-section-dock a:focus-visible,
.ug-section-dock a.is-active {
  text-decoration: none !important;
  opacity: 1;
  transform: scale(1.12);
  filter: drop-shadow(0 0 5px rgba(231, 59, 93, .42));
}

.ug-section-dock a:focus-visible {
  outline: 2px solid #f45a76;
  outline-offset: 4px;
}

.ug-section-dock-icon {
  width: 24px;
  height: 24px;
  fill: rgba(231, 59, 93, .08);
  stroke: currentColor;
  stroke-width: 1.45;
  vector-effect: non-scaling-stroke;
}

.ug-section-dock-flag {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  font-size: 20px;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .ug-section-dock {
    right: 10px;
    width: 34px;
    gap: 18px;
  }

  .ug-section-dock a {
    width: 27px;
    height: 27px;
  }

  .ug-section-dock-icon,
  .ug-section-dock-flag {
    width: 21px;
    height: 21px;
  }

  .ug-section-dock-flag { font-size: 17px; }
}

@media (max-height: 600px) {
  .ug-section-dock { gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-page { scroll-behavior: auto; }
  .ug-section-dock a { transition: none; }
}

.global-discovery-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: calc(100vh - 68px);
  padding: clamp(34px, 4vw, 64px) clamp(30px, 4vw, 72px) 90px;
  gap: 34px;
  align-content: start;
  background:
    radial-gradient(circle at 24% 58%, rgba(166, 21, 50, .18), transparent 31%),
    radial-gradient(circle at 79% 18%, rgba(111, 12, 32, .13), transparent 27%),
    #030303;
  border-bottom: 0;
}

.global-discovery-hero > :not(.hero-vinyl) {
  position: relative;
  z-index: 1;
}

.hero-vinyl,
.splash-vinyl {
  position: absolute;
  top: calc(clamp(-384px, -12.8vw, -176px) - 80px);
  left: calc(clamp(-544px, -19.2vw, -256px) - 12px);
  z-index: 0;
  width: clamp(719.04px, 51.36vw, 1284px);
  aspect-ratio: 1;
  opacity: .14;
  pointer-events: none;
  filter: brightness(1.04) contrast(1.12) saturate(.95);
}

.site-splash > strong { position: relative; z-index: 1; }

/* Keep the decorative vinyl hidden on the homepage at every screen size. */
#homePage .hero-vinyl { display: none; }

.hero-vinyl-art,
.splash-vinyl-art {
  display: block;
  width: 100%;
  height: 100%;
  animation: hero-vinyl-spin 20s linear infinite;
  animation-play-state: paused;
  transform-origin: 50% 50%;
  will-change: transform;
}

.hero-vinyl.is-loaded .hero-vinyl-art,
.splash-vinyl.is-loaded .splash-vinyl-art {
  animation-play-state: running;
}

@keyframes hero-vinyl-spin {
  to { transform: rotate(1turn); }
}

.home-top-mark {
  justify-self: start;
  margin: 0;
  color: #fff;
  font: 600 clamp(41.4px, 4.5vw, 70.2px)/.85 "Barlow Condensed", "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: -.035em;
  transform: translateY(-4px);
}

.global-globe-panel {
  display: grid;
  min-width: 0;
  place-items: start center;
  align-content: start;
  transform: none;
}

.global-explainer {
  width: min(1500px, 100%);
  margin-inline: auto;
  padding-top: clamp(72px, calc(3.6vw + 32px), 90px);
  justify-self: center;
  text-align: center;
}

.global-explainer > span {
  display: block;
  margin-bottom: 18px;
  color: #e73b5d;
  font: 650 15px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .08em;
}

.global-explainer h1 {
  max-width: 1500px;
  margin: 0 auto 26px;
  color: #fff;
  font: 650 clamp(61.0929px, 5.65675vw, 99.5588px)/.9 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: -.025em;
  text-wrap: balance;
}

.global-explainer p {
  max-width: 1200px;
  margin: 0 auto;
  padding-bottom: 0;
  color: #aaa0a2;
  font: 480 clamp(16.15px, 1.23vw, 21.25px)/1.28 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  text-wrap: balance;
}

.home-hero-download-button {
  display: flex;
  width: min(376.2px, 100%);
  min-height: 58px;
  align-items: center;
  justify-content: center;
  margin: clamp(24px, 3.2vh, 38px) auto 8px;
  padding: 0 22px;
  gap: 10px;
  color: #fff;
  background: rgba(38, 4, 12, .82);
  border: .5px solid #7b2436;
  border-radius: 8px;
  box-shadow: 0 0 0 .5px rgba(123, 36, 54, .42), 0 12px 30px rgba(0, 0, 0, .28);
  font: 450 18.7px/1 "Barlow Condensed", "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .01em;
  text-decoration: none;
  transition: background-color 220ms ease, border-color 220ms ease, color 220ms ease, box-shadow 220ms ease, transform 180ms ease;
  transform: translateY(-1px);
}

/* Homepage only: keep the darker resting field fully opaque. */
.global-explainer .home-hero-download-button {
  background: #140206;
}

.home-hero-download-button:hover,
.home-hero-download-button:focus-visible {
  border-color: #ff335c;
  outline: 0;
}

.home-hero-download-apple {
  display: inline-block;
  color: currentColor;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", sans-serif;
  font-size: 1.15em;
  font-weight: 500;
  line-height: 1;
  transform: translateY(-.04em);
}

.home-hero-download-button [data-home-hero-download-label] {
  display: inline-block;
  font-size: calc(1em + 2px);
  font-weight: 300;
  /* Bakbak One has one weight; subtly thin the label's edges as well. */
  -webkit-text-stroke: .35px #000;
  transform: translate(2px, 0);
}

.global-explainer .home-hero-mobile-copy-note {
  max-width: 300px;
  margin: 10px auto 0;
  padding: 0;
  color: #f45a76;
  font: 700 13px/1.35 "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
}

.global-kicker {
  margin: 0;
  color: #e73b5d;
  font: 600 13px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .11em;
}

.global-globe-wrap {
  position: relative;
  display: grid;
  width: min(760px, 94%);
  margin: 0;
  place-items: center;
}

.global-globe {
  --marker-y: 42%;
  --earth-position: 50%;
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: #020212;
  border: 1px solid rgba(231, 59, 93, .38);
  border-radius: 50%;
  box-shadow:
    inset -72px -16px 92px rgba(0, 0, 0, .88),
    inset 24px 8px 42px rgba(255, 255, 255, .08),
    0 0 0 1px rgba(255, 0, 51, .08),
    0 0 72px rgba(177, 19, 50, .22);
  filter: saturate(.88) contrast(1.08);
  animation: none;
}

.global-earth-surface {
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 0;
  width: 300%;
  height: 100%;
  background-image: url("/earth-blue-marble.png");
  background-repeat: repeat-x;
  background-position: 0 center;
  background-size: 33.333% 100%;
  animation: global-earth-surface-spin 18s linear infinite;
  will-change: transform;
}

.global-globe::after {
  content: "";
  position: absolute;
  inset: -9px;
  border: 1px solid rgba(231, 59, 93, .16);
  border-radius: 50%;
  box-shadow: inset 0 0 22px rgba(255, 0, 51, .13);
  pointer-events: none;
}

.global-globe-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 33% 28%, transparent 0 36%, rgba(26, 0, 6, .18) 61%, rgba(0, 0, 0, .82) 100%),
    linear-gradient(145deg, rgba(155, 12, 42, .08), transparent 46%);
  border-radius: inherit;
  pointer-events: none;
}

.global-country-marker {
  position: absolute;
  top: var(--marker-y);
  left: var(--marker-x);
  z-index: 3;
  display: flex;
  min-height: 44px;
  align-items: center;
  padding: 0 15px 0 11px;
  gap: 8px;
  color: #fff;
  background: rgba(8, 3, 4, .92);
  border: 1px solid #e73b5d;
  border-radius: 999px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .6), 0 0 24px rgba(231, 59, 93, .18);
  white-space: nowrap;
  transform: translate(-50%, -50%);
  cursor: pointer;
}

.global-country-marker i {
  width: 8px;
  height: 8px;
  background: #ff315a;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 5px rgba(255, 0, 51, .2);
}

.global-country-marker b {
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
}

.global-country-marker strong {
  font: 600 14px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .035em;
}

@keyframes global-earth-surface-spin {
  from { transform: translateX(0); }
  to { transform: translateX(-66.666%); }
}

.global-song-card {
  align-self: center;
  width: 100%;
  max-width: 620px;
  min-width: 0;
  overflow: visible;
  color: #fff;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.global-song-media {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #080405;
  border: 1px solid #3a3033;
  border-radius: 5px;
  cursor: pointer;
  filter: brightness(1);
  opacity: .76;
  transition: opacity 160ms ease, filter 160ms ease, border-color 160ms ease;
}

.global-song-media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
}

.global-song-media iframe {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.global-song-media img { z-index: 1; }

.global-song-media iframe[hidden] {
  display: none;
}

.global-song-card:hover .global-song-media {
  border-color: #ff0038;
  filter: brightness(1.08);
  opacity: 1;
}

.global-song-heart {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  width: 58px;
  height: 58px;
  padding: 0;
  color: #9b9b9b;
  background: transparent;
  border: 0;
  cursor: pointer;
  transform: translate(-50%, -50%);
}

.global-song-heart svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: currentColor;
  stroke-width: .8;
  transition: color 150ms ease;
}

.global-song-card:hover .global-song-heart:not(.saved) { color: #fff; }
.global-song-heart.saved { color: var(--ytm-red); }

.global-song-stack {
  position: relative;
  align-self: start;
  width: 100%;
  max-width: none;
  transform: none;
}

.global-song-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-height: none;
  padding: 0;
  gap: clamp(12px, 1.2vw, 20px);
  overflow: visible;
}

/* Featured homepage songs only: add breathing room between rows without widening columns. */
#globalSongList {
  row-gap: clamp(36px, 3.5vw, 52px);
}

.global-song-tagline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  margin: 68px 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #6f696b;
  font: 400 57.6px/1.3 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  text-align: center;
}

.global-song-tagline.is-playing {
  color: rgba(255, 255, 255, .9);
}

.global-song-tagline:focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 5px;
}

.global-playback-icon {
  width: .8em;
  height: .8em;
  flex: 0 0 auto;
  fill: currentColor;
}

.global-song-tagline .global-pause-icon,
.global-song-tagline.is-playing .global-play-icon {
  display: none;
}

.global-song-tagline.is-playing .global-pause-icon {
  display: block;
}

.global-song-list .global-song-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  max-width: none;
  padding: 6px;
  gap: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer;
}

.global-song-list .global-song-media {
  align-self: center;
  width: 100%;
  filter: none;
  opacity: 1;
}

.global-song-list .global-song-card:not(.active):hover .global-song-media,
.global-song-list .global-song-card:not(.active):focus-within .global-song-media,
.global-song-list .global-song-card.active .global-song-media {
  border-color: var(--ytm-red);
  box-shadow: 0 0 0 2px rgba(255, 0, 51, .5), 0 10px 28px rgba(255, 0, 51, .14);
}

/* Homepage: strongly dim idle artwork and subtly dim its details. */
.global-song-list .global-song-media img {
  opacity: .45;
  filter: brightness(1);
  transition: opacity 140ms ease, filter 140ms ease;
}

.global-song-list .global-song-card:not(.active):hover .global-song-media img,
.global-song-list .global-song-card:not(.active):focus-within .global-song-media img,
.global-song-list .global-song-card.active .global-song-media img {
  opacity: 1;
  filter: brightness(1.08);
}

.global-song-list .global-song-card.active .global-song-media img {
  transition: none;
}

.global-song-list .global-song-copy > small {
  opacity: .8;
}

.global-song-list .global-song-card:is(:hover, :focus-within, .active) .global-song-copy > small {
  opacity: 1;
}

.global-song-list .global-song-card.active .global-song-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgba(255, 0, 51, .15);
  box-shadow: none;
  pointer-events: none;
}

.global-song-list .global-song-heart {
  width: 61px;
  height: 61px;
}

@media (max-width: 1350px) {
  .global-song-list .global-song-heart {
    width: 58px;
    height: 58px;
  }
}

.global-song-list .global-song-heart:not(.saved) { color: #fff; }
.global-song-list .global-song-card:not(.active):hover .global-song-heart:not(.saved),
.global-song-list .global-song-card.active .global-song-heart:not(.saved) { color: #fff; }

.global-song-list .global-song-heart:not(.countdown-active) {
  width: 67.1px;
  height: 67.1px;
}

@media (max-width: 1350px) {
  .global-song-list .global-song-heart:not(.countdown-active) {
    width: 63.8px;
    height: 63.8px;
  }
}

.global-song-list .global-song-heart.countdown-active,
.global-song-list .global-song-heart.countdown-active:hover,
.global-song-list .global-song-heart.countdown-active:focus-visible {
  width: 73.81px;
  height: 73.81px;
  transform: translate(-50%, -50%);
}

@media (max-width: 1350px) {
  .global-song-list .global-song-heart.countdown-active {
    width: 70.18px;
    height: 70.18px;
  }
}

.global-song-list .global-song-heart.countdown-active:not(.saved) svg {
  fill: #000;
  stroke: #000;
  filter: drop-shadow(0 3px 7px rgba(0, 0, 0, .75));
}

/* Unsaved white thumbnail hearts rest at 50% opacity and become solid with the artwork. */
.six-song-heart:not(.saved):not(.countdown-active) svg,
.global-song-heart:not(.saved):not(.countdown-active) svg { opacity: .5; }
.six-song-media:hover .six-song-heart:not(.saved):not(.countdown-active) svg,
.six-song-media:focus-within .six-song-heart:not(.saved):not(.countdown-active) svg,
.global-song-media:hover .global-song-heart:not(.saved):not(.countdown-active) svg,
.global-song-media:focus-within .global-song-heart:not(.saved):not(.countdown-active) svg { opacity: 1; }

.global-song-list .global-song-heart .heart-countdown {
  transform: translateY(-3px);
}

.global-song-list .global-song-copy {
  align-self: start;
  min-width: 0;
  padding: 14px 4px 10px;
}

.global-song-list .global-song-copy > small {
  position: relative;
  top: 5px;
  display: block;
  margin: 0 0 10px;
  color: #e73b5d;
  font: 600 13px/1.1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.global-song-title-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
}

.global-song-copy-play {
  top: -1px;
  color: #fff;
}

.global-song-list .global-song-copy h2 {
  font-size: var(--home-song-title-size);
  line-height: 1.04;
  -webkit-line-clamp: 1;
}

.global-song-list .global-song-meta {
  margin-top: 10px;
  gap: 7px;
  font-size: 17px;
  line-height: 1.1;
}

.global-song-list .global-song-meta > .global-song-artist {
  position: relative;
  top: -3px;
  font-size: inherit;
}

/* Shared thumbnail views: homepage, Choose Song and Saved Gold use one corner layout. */
.six-song-media,
.global-song-list .global-song-card { --home-song-title-size: clamp(22.5px, 1.8vw, 30.6px); }

/* Featured homepage copy only: keep the downstream country rows at their shared sizes. */
#globalSongList .global-song-copy h2 { font-size: clamp(27.5px, calc(1.8vw + 5px), 35.6px); }
#globalSongList .global-song-copy > small { font-size: 15px; }
#globalSongList .global-song-meta > .global-song-artist { font-size: 19px; }

/* Song pages share the featured homepage card typography and copy rhythm. */
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy {
  padding: 14px 4px 10px;
}
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy strong,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy strong {
  font-size: clamp(27.5px, calc(1.8vw + 5px), 35.6px);
  font-weight: 550;
  line-height: 1.04;
  -webkit-line-clamp: 1;
}
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy small,
.six-song-tile.current:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy small {
  margin-top: 7px;
  color: #b3b3b3;
  font-size: 19px;
  line-height: 1.1;
}

.six-song-media .home-song-views,
.global-song-list .home-song-views {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 2px;
  right: 18px;
  bottom: 4px;
  left: auto;
  z-index: 4;
  max-width: calc(100% - 100px);
  color: #fff;
  font-size: calc((var(--home-song-title-size) - 1px) * 2.181168);
  font-weight: 500;
  line-height: 1.1;
  text-shadow: none;
  text-align: right;
  white-space: nowrap;
  pointer-events: none;
}
.six-song-media .home-song-views {
  font-size: calc((var(--home-song-title-size) - 1px) * 1.65);
}
.six-song-media .home-song-views-label,
.global-song-list .home-song-views-label { display: none; }

.six-song-tile.current.playing .home-song-views { text-shadow: 0 3px 6px rgba(0, 0, 0, .95); }
.global-song-list .global-song-card.active .home-song-views { text-shadow: 0 3px 6px rgba(0, 0, 0, .95); }

.global-song-player {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 320px;
  height: 180px;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.global-song-player[hidden] { display: none; }

.global-song-position {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 4;
  padding: 7px 9px;
  color: #fff;
  background: rgba(0, 0, 0, .72);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 3px;
  font: 600 11px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .09em;
  pointer-events: none;
}

.global-song-copy {
  padding: 14px 2px 0;
}

.global-song-copy > p {
  display: flex;
  align-items: center;
  margin: 0 0 13px;
  gap: 9px;
  color: #e73b5d;
}

.global-song-copy > p span { font-size: 25px; }
.global-song-copy > p strong {
  font: 600 13px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .08em;
}

.global-song-copy h2 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: #fff;
  font: 550 clamp(30px, 2.7vw, 42px)/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: -.015em;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.global-song-meta {
  display: grid;
  margin-top: 9px;
  gap: 5px;
  color: #fff;
  font: 500 18px/1.05 "Avenir Next Condensed", "Arial Narrow", sans-serif;
}

.global-song-meta span:last-child {
  color: #a49a9c;
  font-size: 17px;
}

.global-song-copy > small {
  display: block;
  margin-top: 8px;
  color: #7f7477;
  font: 550 12px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .06em;
}

.global-song-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 24px;
  gap: 9px;
}

.global-song-actions button {
  min-height: 50px;
  padding: 0 14px;
  color: #fff;
  background: #120b0d;
  border: 1px solid #4d2830;
  border-radius: 5px;
  font: 600 12px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .055em;
  cursor: pointer;
}

.global-song-actions button:first-child {
  color: #fff;
  background: #a91f3c;
  border-color: #e73b5d;
}

.global-song-actions button:last-child {
  grid-column: 1 / -1;
}

.global-song-actions button:hover,
.global-song-actions button:focus-visible {
  background: rgba(255, 0, 51, .14);
  border-color: #ff315a;
  outline: 0;
}

.home-country-picker {
  padding: clamp(48px, calc(2vw + 30px), 68px) clamp(22px, 4vw, 68px) 90px;
  background: #030303;
  border-top: 0;
}

.home-country-picker > header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 32px;
  padding-bottom: 24px;
  gap: 12px;
  text-align: center;
}

.home-country-picker h2 {
  margin: 9px 0 0;
  color: #fff;
  font: 600 clamp(77px, calc(6.237vw + 17.6px), 118.8px)/.95 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: -.01em;
}

.home-country-picker > header p {
  margin: 0 0 5px;
  color: #8f888a;
  font: 480 clamp(16.15px, 1.23vw, 21.25px)/1.28 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  letter-spacing: 0;
}

.home-country-picker > header p strong {
  color: inherit;
  font-weight: inherit;
}

.right-panel-heading > strong {
  font-size: calc(clamp(29px, calc(1.85vw + 4px), 38px) + 5px);
}

.song-card-stage.showing-playlists .right-panel-heading > strong {
  font-size: calc(clamp(29px, calc(1.85vw + 4px), 38px) + 15px);
}

.song-card-stage:not(.showing-playlists):not(.showing-countries) .right-panel-heading > strong {
  font-size: calc(clamp(29px, calc(1.85vw + 4px), 38px) + 15px);
}

.right-panel-heading > strong > .right-panel-song-label {
  display: block;
  margin-bottom: 8px;
  color: #9a9496;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: .04em;
}

.right-panel-heading {
  grid-template-columns: minmax(0, 1fr) auto;
}

.right-panel-heading > p {
  grid-column: 1 / -1;
}

.right-panel-heading.has-description > p {
  grid-column: 1;
}

.global-shortcuts-download.home-hero-download-button {
  width: 390px;
  max-width: 100%;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
  align-items: center;
  justify-content: center;
  margin: 0 14px 0 0;
  background: #1a0005;
  border: .5px solid #7b2436;
  box-shadow: 0 0 0 1px rgba(255, 0, 51, .34), 0 12px 34px rgba(255, 0, 51, .08);
  transform: translateY(-1px);
  white-space: nowrap;
}

.global-shortcuts-download.home-hero-download-button:hover,
.global-shortcuts-download.home-hero-download-button:focus-visible {
  border-color: #ff335c;
}

.global-shortcuts-download [data-home-hero-download-label] {
  transform: none;
}

.global-shortcuts-download[hidden] {
  display: none;
}

#rightPanelDescription {
  color: #8f888a;
  font-size: calc(clamp(17px, 1.2vw, 21px) - 1px);
  font-weight: 400;
  font-synthesis: none;
  -webkit-text-stroke: .6px #000;
}

@media (max-width: 760px) {
  .right-panel-heading {
    grid-template-columns: 1fr;
  }

  .global-shortcuts-download.home-hero-download-button {
    width: auto;
    grid-column: 1;
    grid-row: 3;
    margin: 0;
  }

  #rightPanelDescription {
    font-size: 16px;
  }
}

.home-country-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 12px;
  row-gap: 42px;
}

.song-card.playlist-gallery-mode .six-song-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.song-card:not(.country-gallery-mode):not(.playlist-gallery-mode) .six-song-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.six-song-grid.liked-song-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.playlist-gallery-copy > strong {
  margin-bottom: 3px;
  font-size: clamp(23.7px, calc(1.50075vw + 3px), 27.84px);
}

.six-song-copy.playlist-gallery-copy > span {
  font-size: 19.1px;
  font-weight: 400;
  font-synthesis: none;
}

@media (max-width: 760px) {
  .playlist-gallery-copy > strong {
    font-size: 30.945px;
  }

  .six-song-copy.playlist-gallery-copy > span {
    font-size: 20.25px;
  }
}

.home-country-grid .home-country-tile {
  grid-template-rows: auto minmax(64px, auto);
}

.home-country-grid .country-gallery-flag,
.home-country-grid .country-gallery-tile:hover .country-gallery-flag,
.home-country-grid .country-gallery-tile:focus-within .country-gallery-flag {
  transform: translate(-4px, 4px) scale(1.265);
}

.home-country-grid .country-gallery-100m,
.home-country-grid .country-gallery-billion {
  font-size: clamp(61px, 6.8vw, 116px);
  text-shadow: 0 10px 16px rgba(0, 0, 0, .85), 0 2px 4px rgba(0, 0, 0, .95);
}

.country-gallery-info small {
  color: #b8b8b8;
}

.home-country-grid .country-gallery-info strong {
  font-size: clamp(28px, calc(1.45vw + 8px), 32px);
}

.home-country-grid .country-gallery-info small {
  font-size: 20px;
}

.home-country-grid .home-country-tile .six-song-media {
  background: rgba(32, 4, 10, .5);
}

.home-country-grid .home-country-tile .six-song-media::after {
  background: transparent;
}

.home-country-grid .six-song-position {
  top: 11px;
  right: 10px;
  bottom: auto;
  left: auto;
  font-size: 21px;
}

.home-country-card {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 96px;
  align-items: center;
  padding: 12px 15px;
  gap: 12px;
  color: #fff;
  background: linear-gradient(145deg, #110609 0%, #070405 68%, #030303 100%);
  border: 1px solid #351018;
  border-radius: 7px;
  text-align: left;
  cursor: pointer;
}

.home-country-card:hover,
.home-country-card:focus-visible {
  background: linear-gradient(145deg, #1d090e 0%, #090405 68%, #030303 100%);
  border-color: #e73b5d;
  outline: 0;
}

.home-country-flag {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  font-size: 38px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid #2e2023;
  border-radius: 50%;
}

.home-country-copy {
  display: grid;
  min-width: 0;
  gap: 6px;
}

.home-country-copy strong {
  overflow: hidden;
  font: 550 22px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-country-copy small {
  color: #817578;
  font: 500 12px/1 "Avenir Next Condensed", "Arial Narrow", sans-serif;
}

.home-country-card em {
  color: #e73b5d;
  font-size: 19px;
  font-style: normal;
}

@media (max-width: 1180px) {
  .global-discovery-hero { grid-template-columns: minmax(0, 1fr); }
  .home-country-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }

  .discovery-machine,
  .discovery-machine.home-mode,
  .home-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .home-page {
    padding: 0;
    overflow-x: hidden;
  }

  .home-page,
  .three-column-workspace,
  .song-card-stage,
  .browser-level,
  .country-list,
  .playlist-list,
  .single-song-list,
  .liked-sidebar-list,
  .catalog-speed-table-wrap {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .home-page::-webkit-scrollbar,
  .three-column-workspace::-webkit-scrollbar,
  .song-card-stage::-webkit-scrollbar,
  .browser-level::-webkit-scrollbar,
  .country-list::-webkit-scrollbar,
  .playlist-list::-webkit-scrollbar,
  .single-song-list::-webkit-scrollbar,
  .liked-sidebar-list::-webkit-scrollbar,
  .catalog-speed-table-wrap::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .global-discovery-hero {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: auto;
    padding: 28px 14px 52px;
    gap: 32px;
  }

  .global-globe-panel,
  .global-explainer,
  .global-song-stack,
  .global-song-list,
  .home-country-picker,
  .home-country-grid,
  .catalog-speed-section,
  .catalog-speed-table-wrap {
    max-width: 100%;
    min-width: 0;
  }

  .global-explainer {
    width: 100%;
    padding-top: 52px;
  }

  .home-top-mark { font-size: clamp(37.8px, 12.6vw, 52.2px); }

  .global-explainer > span { margin-bottom: 13px; font-size: 13px; }
  .global-explainer h1 {
    width: 100%;
    margin-bottom: 18px;
    font-size: clamp(42.9913px, 13.01718vw, 56.5675px);
    line-height: .96;
  }

  .global-explainer p {
    width: 100%;
    padding: 0;
    font-size: 15.3px;
    line-height: 1.34;
  }

  .home-hero-download-button {
    width: auto;
    min-width: 0;
    min-height: 36px;
    margin-top: 14px;
    padding: 0 12px;
    gap: 6px;
    border-radius: 8px;
    font-size: 10.2px;
    letter-spacing: 0;
  }

  .home-hero-download-button.is-mobile-copied,
  .home-hero-download-button.is-mobile-copied:hover,
  .home-hero-download-button.is-mobile-copied:focus-visible,
  .home-hero-download-button.is-mobile-copied:active {
    color: #fff2d7;
    background: transparent;
    border-color: #fff2d7;
    box-shadow: none;
    transform: none;
  }

  .global-explainer .home-hero-mobile-copy-note {
    max-width: 300px;
    font-size: 12.5px;
  }

  .global-globe-panel,
  .global-song-stack { transform: none; }

  .global-globe-wrap {
    width: min(360px, 92vw);
    margin: 0 auto;
  }

  .global-country-marker {
    min-height: 38px;
    padding-inline: 9px 12px;
  }

  .global-country-marker b { font-size: 19px; }
  .global-country-marker strong { font-size: 12px; }

  .global-song-copy { padding: 12px 2px 0; }
  .global-song-copy h2 { font-size: 32px; }
  .global-song-meta { font-size: 16px; }
  .global-song-stack {
    width: 100%;
    overflow-x: visible;
  }

  .global-song-list {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    gap: 30px;
  }

  .global-song-list .global-song-card {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
    padding: 0;
    gap: 0;
  }

  .global-song-list .global-song-copy { padding: 12px 4px 10px; }
  .six-song-media,
  .global-song-list .global-song-card { --home-song-title-size: 19.8px; }
  .global-song-list .global-song-meta { font-size: 14px; }
  #globalSongList .global-song-copy h2 { font-size: 24.8px; }
  #globalSongList .global-song-meta > .global-song-artist { font-size: 16px; }
  .global-song-list .global-song-heart { width: 34px; height: 34px; }
  .global-song-list .global-song-heart:not(.countdown-active) { width: 37.4px; height: 37.4px; }
  .global-song-list .global-song-heart.countdown-active { width: 41.14px; height: 41.14px; }
  .global-song-tagline {
    width: 100% !important;
    max-width: 100%;
    padding-inline: 8px;
    white-space: normal;
  }
  .global-song-actions { grid-template-columns: minmax(0, 1fr); }
  .global-song-actions button:last-child { grid-column: auto; }

  .home-country-picker { padding: 18px 12px 76px; }
  .home-country-picker > header { display: grid; margin-bottom: 22px; }
  .home-country-picker h2 {
    max-width: 100%;
    font-size: clamp(59.4px, calc(15.18vw + 8.8px), 69.3px);
    line-height: 1;
  }
  .home-country-picker > header p {
    font-size: 15.3px;
    line-height: 1.34;
  }
  .home-country-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .home-country-card { min-height: 84px; grid-template-columns: 54px minmax(0, 1fr) auto; }
  .home-country-flag { width: 54px; height: 54px; font-size: 32px; }
  .home-country-copy strong { font-size: 24px; }

  .catalog-speed-section h2 {
    max-width: 100%;
    font-size: clamp(38px, 11vw, 46px);
    line-height: 1;
  }

  .catalog-speed-table-wrap {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .global-earth-surface { animation-duration: 60s; }
}

/* True-black site canvas; reserve the dark red surface for player chrome. */
html,
body,
.discovery-machine,
.home-page,
.three-column-workspace,
.song-card-stage,
.song-card,
.card-carousel,
.song-card-strip,
.browser-panel,
.browser-level,
.country-list,
.playlist-list,
.single-song-list,
.liked-sidebar,
.liked-sidebar-list,
.global-discovery-hero,
.home-country-picker,
.catalog-speed-section,
.mac-download-section,
.home-brand-footer,
.home-navigation,
.home-content {
  background: #000;
}

.machine-header,
.site-footer {
  background: #100307;
}

/* Keep Saved Gold and account inside the same uninterrupted top-bar surface. */
.machine-header .header-personal-controls {
  background: inherit;
  border-left-color: transparent;
}

/* Compact only the white top-bar values; keep the red field labels unchanged. */
@media (min-width: 1351px) {
  .machine-header .machine-brand strong {
    font-size: 25.58px;
  }

  .machine-header .context-tag strong {
    font-size: 27.36px;
  }
}

@media (min-width: 761px) and (max-width: 1350px) {
  .machine-header .machine-brand strong {
    font-size: 20.79px;
  }

  .machine-header .context-tag strong {
    font-size: 22.23px;
  }
}

.machine-header .context-tag small {
  letter-spacing: .08em;
}

/* Move every gallery/song position marker two pixels inward and down. */
.song-card .six-song-position,
.home-country-grid .six-song-position,
.song-thumbnail-position {
  top: 12px;
  right: 14px;
  bottom: auto;
  left: auto;
}

@media (max-width: 1350px) {
  .song-card .six-song-position,
  .home-country-grid .six-song-position,
  .song-thumbnail-position {
    top: 10px;
    right: 12px;
  }

  .home-country-grid .six-song-position { font-size: 18px; }
}

/* Compact bottom-bar typography without changing its control layout. */
.site-footer > .footer-toggle span,
.site-footer > .quest-completion > span {
  letter-spacing: .06em;
}

.site-footer > .quest-completion > strong {
  font-size: 33.15px;
}

.site-footer > .quest-completion > strong i {
  color: #fff;
}

.site-footer > .footer-toggle strong,
.site-footer > .quest-completion > strong {
  transform: none;
}

.site-footer #footerQuickPlay,
.site-footer #footerQuickSkip {
  transform: translateY(-1px);
}

.site-footer #footerPlaybackSpeed {
  transform: translateY(-3px);
}

.site-footer > .footer-toggle {
  transform: translateY(4px);
}

.site-footer > .quest-completion {
  transform: translateY(3px);
}

@media (min-width: 1351px) {
  .site-footer > .footer-toggle strong {
    font-size: 27.2px;
  }
}

@media (min-width: 761px) and (max-width: 1350px) {
  .site-footer > .footer-toggle strong {
    font-size: 22.1px;
  }
}

@media (max-width: 760px) {
  .site-footer > .quest-completion > strong {
    font-size: 20.4px;
  }
}

/* Account popup: simple black surface; keep authentication and stats ownership intact. */
#accountPopover {
  width: min(320px, calc(100vw - 20px));
  padding: 20px;
  color: #fff;
  background: #000;
  border-color: #444;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .7);
}

#accountPopover::before { background: #000; border-color: #444; }
#accountPopover:hover,
#accountPopover:focus-within,
#accountPopover:hover::before,
#accountPopover:focus-within::before { border-color: #fff; }

#accountPopover .account-entry-actions,
#accountPopover .account-signed-in { display: grid; gap: 16px; }
#accountPopover .account-signed-in[hidden] { display: none; }
#accountPopover .account-summary-email {
  margin: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}

#accountPopover .account-summary-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding-block: 16px;
  border-block: 1px solid #444;
}
#accountPopover .account-summary-stats > div { min-width: 0; text-align: center; }
#accountPopover .account-summary-email.is-guest { position: relative; top: 2px; }
#accountPopover .account-summary-email.is-guest + .account-summary-stats { border-top: 0; }
#accountPopover .account-summary-stats > div + div { border-left: 1px solid #444; }
#accountPopover .account-summary-stats dt { color: #aaa; font-size: 11px; letter-spacing: .03em; }
#accountPopover .account-summary-stats dd { margin: 6px 0 0; color: #fff; font-size: 26.4px; line-height: 1.2; }

#accountPopover .account-entry-actions a,
#accountPopover .account-logout {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 12px;
  color: #fff;
  background: #000;
  border: 1px solid #444;
  border-radius: 4px;
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: .03em;
  text-decoration: none;
  box-shadow: none;
}
#accountPopover .account-entry-actions a:hover,
#accountPopover .account-entry-actions a:focus-visible,
#accountPopover .account-logout:hover,
#accountPopover .account-logout:focus-visible {
  color: #fff;
  background: #000;
  border-color: #fff;
  outline: 1px solid #fff;
  outline-offset: 2px;
}
#accountPopover .account-entry-actions a:hover,
#accountPopover .account-entry-actions a:focus-visible { outline: none; }
#accountPopover .account-entry-actions a.account-sign-in { color: #4ade80; }
#accountPopover .account-status { margin: 14px 0 0; color: #ddd; font-size: 12px; }
#accountPopover .account-status:empty,
#accountPopover .account-status.success { display: none; }
#accountControl #accountButton:hover,
#accountControl #accountButton:focus-visible,
#accountControl.pinned #accountButton { color: #fff; background: #000; border-color: #fff; }

/* Six top songs per country, followed by the full catalog view distribution. */
.home-country-songs {
  padding: 30px clamp(22px, 4vw, 68px) 70px;
  background: #030303;
}

.home-country-songs:empty { display: none; }
.home-country-song-section:first-child {
  padding-top: 72px;
  border-top: 1px solid #292929;
}
.home-country-song-section + .home-country-song-section {
  margin-top: 100px;
  padding-top: 106px;
  border-top: 1px solid #292929;
}
.home-country-song-section:last-child {
  padding-bottom: 100px;
  border-bottom: 1px solid #292929;
}
.home-country-song-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin: 0 6px 34px;
  text-align: center;
}
.home-country-song-heading > h2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-width: 0;
  margin: 0;
  color: #fff;
  font-size: clamp(98.84px, calc(5.928vw + 35px), 130.76px);
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}
.home-country-song-name {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-align: center;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.home-country-song-name:hover,
.home-country-song-name:focus-visible {
  color: #e73b5d;
  text-decoration: none;
}
.home-country-song-name:focus-visible { outline: 2px solid #fff; outline-offset: 6px; }
.home-country-view-breakdown {
  width: 100%;
  margin: 0;
  color: #fff;
  font-size: clamp(24px, calc(1.15vw + 10px), 29px);
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: .01em;
  text-align: center;
  white-space: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}
.home-country-view-breakdown::-webkit-scrollbar { display: none; }
.home-country-view-tier { white-space: nowrap; }
.home-country-view-count { color: #e73b5d; }
.global-song-list.home-country-song-row {
  position: relative;
  --home-country-song-gap: clamp(12px, 1.2vw, 20px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: none;
  grid-auto-flow: row;
  overflow: visible;
  padding: 5px 0 12px;
  gap: var(--home-country-song-gap);
}
.home-country-song-row > .global-song-card { align-self: start; }
.global-song-media .home-song-select {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: inherit;
  cursor: pointer;
}
.global-song-media .home-song-select:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }

/* Song titles and views stay white in idle, hovered and playing states. */
.global-song-list .global-song-copy h2,
.six-song-copy strong,
.six-song-copy > span {
  color: #fff;
}

/* Artist names are softer than titles, including playing and Saved Gold cards. */
.global-song-list .global-song-meta > .global-song-artist,
.six-song-tile:not(.country-gallery-tile):not(.playlist-gallery-tile) .six-song-copy > small,
#currentArtist,
#previousCardArtist,
#nextCardArtist {
  color: #b3b3b3;
}

/* View counts only: artist names and playback icon text keep their sizes. */
.six-song-copy > span { color: #fff; font-size: 16px; }
.six-song-tile.current .six-song-copy > span { font-size: 17px; }

@media (min-width: 761px) and (max-width: 1024px) {
  .global-song-list.home-country-song-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .home-country-songs { padding: 28px 12px 44px; }
  .home-country-song-section:first-child { padding-top: 58px; }
  .home-country-song-section + .home-country-song-section {
    margin-top: 70px;
    padding-top: 74px;
  }
  .home-country-song-section:last-child { padding-bottom: 70px; }
  .home-country-song-heading { gap: 10px; }
  .home-country-song-heading > h2 {
    width: 100%;
    max-width: 100%;
    gap: 10px;
    font-size: clamp(46px, 14vw, 72px);
    line-height: 1;
  }
  .home-country-view-breakdown {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 14px;
    overflow-x: visible;
    font-size: clamp(14px, 4vw, 18px);
    white-space: normal;
  }
  .home-country-view-separator { display: none; }
  .global-song-list.home-country-song-row {
    --home-country-song-gap: 14px;
    grid-template-columns: minmax(0, 1fr);
  }
  .six-song-copy > span { font-size: 17px; }
}

/* Saved Gold only: quieter thumbnail hearts, with the original centered hit area. */
.liked-mode #rightPanelHeading {
  font-size: calc(clamp(36.25px, calc(2.3125vw + 5px), 47.5px) + 6.25px);
  display: inline-flex;
  align-items: center;
  gap: .35em;
}

.liked-mode #rightPanelHeading::after {
  content: "";
  flex: 0 0 .7em;
  width: .7em;
  height: .7em;
  background: var(--ytm-red);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8l1.1 1.1L12 21l7.8-7.5 1.1-1.1a5.5 5.5 0 0 0-.1-7.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.liked-mode .six-song-heart svg {
  transform: scale(.5);
  transform-origin: center;
}

.liked-mode .six-song-heart .heart-countdown {
  transform: translateY(-.5px) scale(.5);
  transform-origin: center;
}

.liked-mode .saved-gold-youtube-link {
  position: absolute;
  right: 2px;
  bottom: 0;
  z-index: 6;
  display: flex;
  align-items: flex-end;
  min-height: 44px;
  padding: 8px;
  color: #fff;
  background: transparent;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
  text-shadow: none;
}

.liked-mode .saved-gold-youtube-link:visited { color: #fff; }
.liked-mode .saved-gold-youtube-link:hover,
.liked-mode .saved-gold-youtube-link:focus-visible { color: var(--ytm-red); text-decoration: none; }
.liked-mode .saved-gold-youtube-link:focus-visible { outline: 1px solid #fff; outline-offset: -3px; }

#sixSongGrid .saved-gold-youtube-link {
  right: auto;
  left: 2px;
}

/* Homepage and Choose Song: match Saved Gold's link at one size smaller. */
.song-youtube-link {
  position: absolute;
  right: auto;
  left: 2px;
  bottom: 0;
  z-index: 6;
  display: flex;
  align-items: flex-end;
  min-height: 44px;
  padding: 8px;
  color: #fff;
  background: transparent;
  font-size: 12px;
  line-height: 1.2;
  text-decoration: none;
  text-shadow: none;
}

.song-youtube-link:visited { color: #fff; }
.song-youtube-link:hover,
.song-youtube-link:focus-visible { color: var(--ytm-red); text-decoration: none; }
.song-youtube-link:focus-visible { outline: 1px solid #fff; outline-offset: -3px; }

/* Homepage artwork swaps the two lower-corner labels. */
.global-song-list .home-song-views {
  right: 18px;
  bottom: 4px;
  left: auto;
  font-size: calc((var(--home-song-title-size) - 1px) * 2.181168);
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 2px;
  text-align: right;
}
#globalSongList .home-song-views {
  font-size: calc(((var(--home-song-title-size) - 1px) * 2.181168) + 8px);
}
.global-song-list .home-song-views-label {
  display: none;
}
.global-song-list .song-youtube-link {
  right: auto;
  left: 2px;
}
#globalSongList .song-youtube-link { font-size: 14px; }
.global-song-list .song-youtube-link:hover,
.global-song-list .song-youtube-link:focus-visible { color: #e73b5d; }

/* Mobile launch pass: preserve desktop styling and reuse existing navigation. */
@media (max-width: 760px) {
  .ug-section-dock { display: none; }
  .home-mode .hero-vinyl { display: none; }
  .site-splash .splash-vinyl { display: none; }

  .discovery-machine,
  .discovery-machine.home-mode,
  .discovery-machine.liked-mode {
    grid-template-rows: auto minmax(0, 1fr) calc(62px + env(safe-area-inset-bottom));
    padding-block: env(safe-area-inset-top) 0;
  }

  .machine-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-row: 1;
    height: auto;
    min-width: 0;
    overflow: visible;
  }

  .machine-header .machine-brand {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    min-height: 52px;
    padding: 0 12px;
    justify-content: flex-start;
  }

  .machine-header .machine-brand strong { font-size: 20px; }

  .header-personal-controls {
    grid-column: 2;
    grid-row: 1;
    height: 52px;
    padding-inline: 0 6px;
    border-left: 0;
    background: transparent;
  }

  .machine-header .header-context {
    display: flex;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    padding: 0;
    gap: 0;
    overflow: hidden;
    border-top: 1px solid #35141b;
  }

  .home-mode .header-context { display: none; }

  .machine-header .header-context .context-tag {
    flex: 1 1 45%;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    height: auto;
    padding: 7px 12px;
    gap: 5px;
  }

  .machine-header .header-context #headerSongTag { flex-basis: 100%; }
  .machine-header .context-tag small { font-size: 9px; letter-spacing: .04em; }
  .machine-header .context-tag strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
  }
  .machine-header .header-selected-flag { font-size: 17px; }

  .home-page,
  .three-column-workspace { grid-row: 2; }
  .site-footer {
    grid-row: 3;
    height: calc(62px + env(safe-area-inset-bottom));
    padding-bottom: calc(4px + env(safe-area-inset-bottom));
  }

  .song-card-stage,
  .song-card-stage.has-playlist-selection {
    scrollbar-width: none !important;
    scrollbar-gutter: auto;
  }
  .song-card-stage::-webkit-scrollbar,
  .song-card-stage.has-playlist-selection::-webkit-scrollbar { display: none; width: 0; }

  .header-personal-controls .account-popover {
    position: fixed;
    top: calc(58px + env(safe-area-inset-top));
    right: 10px;
    width: calc(100% - 20px);
    max-height: calc(100dvh - 134px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .account-popover .account-form input { min-height: 44px; font-size: 16px; }
  .account-popover .account-form-actions button,
  .account-popover .account-logout { min-height: 44px; }
  .account-popover .account-popover-header > p { font-size: 14px; }
  .account-popover .account-popover-header > small { font-size: 10px; }
  .account-popover .password-toggle { min-width: 44px; min-height: 44px; }

  .home-hero-download-button { min-height: 44px; font-size: 14px; }
  .global-song-tagline { min-height: 44px; font-size: 48px; }
  .global-song-heart::before { content: ""; position: absolute; inset: -6px; }
  .mobile-setting-popup { max-height: calc(100dvh - 90px); overflow-y: auto; }
  .mobile-setting-popup > header > button { width: 44px; height: 44px; }
  .login-gate-dialog {
    max-height: calc(100dvh - 240px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow-y: auto;
  }
  .login-gate-close { width: 44px; height: 44px; }
}

@media (max-width: 360px) {
  .site-footer > .quest-completion > strong { font-size: 17px; }
  .machine-header .machine-brand strong { font-size: 18px; }
}

/* Between phone and desktop, keep navigation and all setting values on-screen. */
@media (min-width: 761px) and (max-width: 1024px) {
  html, body { width: 100%; min-width: 0; overflow-x: hidden; }
  .discovery-machine,
  .discovery-machine.home-mode,
  .discovery-machine.home-mode.home-header-hidden,
  .discovery-machine.liked-mode {
    width: 100%;
    min-width: 0;
    grid-template-rows: 104px minmax(0, 1fr) 112px;
  }
  .machine-header,
  .discovery-machine.home-mode.home-header-hidden .machine-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: 52px 52px;
    height: 104px;
    min-width: 0;
    overflow: visible;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
  }
  .machine-header .machine-brand { grid-row: 1; grid-column: 1; justify-content: flex-start; }
  .header-personal-controls { grid-row: 1; grid-column: 2; }
  .machine-header .header-context { grid-row: 2; grid-column: 1 / -1; min-width: 0; }
  .machine-header .context-tag strong { font-size: 17px; }
  .machine-header .context-tag small { font-size: 10px; }
  .site-footer {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: 42px 56px;
    height: 112px;
    padding: 4px 12px 6px;
    gap: 4px;
  }
  .site-footer > .quest-completion {
    grid-column: 1 / -1;
    grid-row: 1;
    height: 42px;
    padding: 0;
    transform: none;
  }
  .site-footer > .quest-completion > strong { font-size: 25px; }
  .site-footer > .footer-toggle {
    grid-row: 2;
    min-width: 0;
    width: 100%;
    margin: 0 !important;
    padding: 0 8px;
    gap: 6px;
    transform: none;
  }
  .site-footer > .footer-toggle > span { font-size: 10px; letter-spacing: .02em; }
  .site-footer > .footer-toggle > strong { font-size: 18px; }
  .site-footer > .footer-toggle .footer-icon { width: 20px; height: 20px; }
  .global-song-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .song-card .six-song-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .song-card.country-gallery-mode .six-song-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .song-card-stage,
  .song-card-stage.has-playlist-selection { scrollbar-width: none !important; }
  .song-card-stage::-webkit-scrollbar,
  .song-card-stage.has-playlist-selection::-webkit-scrollbar { display: none; width: 0; }
  .header-personal-controls .account-popover {
    max-height: calc(100dvh - 190px);
    overflow-y: auto;
  }
  .account-popover .account-form input { font-size: 16px; }
}

/* Requested bottom-bar refinement: enlarge only white setting values. */
@media (min-width: 1351px) {
  .site-footer #footerQuickPlay,
  .site-footer #footerQuickSkip,
  .site-footer #footerPlaybackSpeed { font-size: 29.92px; }
}
@media (min-width: 1025px) and (max-width: 1350px) {
  .site-footer #footerQuickPlay,
  .site-footer #footerQuickSkip,
  .site-footer #footerPlaybackSpeed { font-size: 24.31px; }
}
@media (min-width: 761px) and (max-width: 1024px) {
  .site-footer #footerQuickPlay,
  .site-footer #footerQuickSkip,
  .site-footer #footerPlaybackSpeed { font-size: 19.8px; }
}

/* Pull only these two red labels closer to their icons. */
.site-footer #footerQuickSkipLabel,
.site-footer #footerPlaybackSpeedLabel { margin-left: -6px; }
