/* Mobile text viewports and controls share no horizontal space. */
.bgm-loop-copy{display:none!important}
@keyframes bgm-text-loop{to{transform:translate3d(calc(-1 * var(--bgm-loop-distance)),0,0)}}
@media(max-width:900px){
  body.spotify-refactor .main-content .track-row:not(.playlist-track-row),
  body.spotify-refactor .main-content .track-table .track-row:not(.playlist-track-row),
  body.spotify-refactor .main-content .search-top-tracks .track-row,
  body.spotify-refactor .main-content .artist-popular .track-row,
  body.spotify-refactor .main-content .library-track-list .track-row{
    grid-template-columns:20px 44px minmax(0,1fr) 86px 28px!important;
    column-gap:8px!important;
    padding-inline:4px!important;
    min-width:0!important;
    box-sizing:border-box!important;
    transition-property:background-color,color,box-shadow!important;
  }
  body.spotify-refactor .main-content .track-row>.track-meta{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    padding-block:4px;
    row-gap:4px;
  }
  body.spotify-refactor .main-content .track-row>.track-actions{
    min-width:0!important;
    width:100%!important;
    gap:8px!important;
    justify-content:flex-end!important;
    transition-property:color,background-color!important;
  }
  body.spotify-refactor .main-content .track-row>.track-actions>.track-like-button{display:none!important}
  body.spotify-refactor .main-content .track-row>.track-actions>.queue-add{
    display:grid!important;
    flex:0 0 34px!important;
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    margin:0!important;
    transition-property:color,background-color,border-color!important;
  }
  body.spotify-refactor .main-content .track-row>.track-actions>.row-play{
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    margin:0!important;
    transition-property:color,background-color!important;
  }
  body.spotify-refactor .main-content .track-row>.track-more{
    width:28px!important;min-width:28px!important;margin:0!important;
  }
  /* These existing all-song grids also reserve space for the same two controls. */
  body.spotify-refactor .all-songs-page #all-songs .home-all-songs-scroll .track-row,
  body.spotify-refactor .home-page #all-songs .home-all-songs-scroll .track-row{
    grid-template-columns:20px 44px minmax(0,1fr) 86px 28px!important;
    column-gap:8px!important;
  }
  body.spotify-refactor .all-songs-page #all-songs .home-all-songs-scroll .track-row>.track-actions,
  body.spotify-refactor .home-page #all-songs .home-all-songs-scroll .track-row>.track-actions{
    min-width:86px!important;gap:8px!important;
  }
  /* Only the Media viewport clips and moves its inner text run. */
  body .now-player #npTitle.bgm-loop,
  body .now-player #npAlbum.bgm-loop,
  body #songDetail .bgm-loop{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    animation:none!important;
    transform:none!important;
    transition-property:color,text-shadow!important;
  }
  body .now-player #npTitle>.bgm-loop-track,
  body .now-player #npAlbum>.bgm-loop-track,
  body #songDetail .bgm-loop>.bgm-loop-track{
    display:inline-flex!important;
    align-items:baseline!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
    text-overflow:clip!important;
    animation:none!important;
    transform:translate3d(0,0,0);
    vertical-align:top;
  }
  .bgm-loop-source{display:block;flex:none;white-space:nowrap}
  body .now-player .bgm-loop.is-looping,
  body #songDetail .bgm-loop.is-looping{text-overflow:clip!important}
  body .now-player #npTitle.is-looping>.bgm-loop-track,
  body .now-player #npAlbum.is-looping>.bgm-loop-track,
  body #songDetail .bgm-loop.is-looping>.bgm-loop-track{
    animation:bgm-text-loop var(--bgm-loop-duration) linear infinite!important;
    will-change:transform;
  }
  .bgm-loop.is-looping .bgm-loop-copy{
    display:block!important;flex:none;margin-left:40px;
  }
  /* Empty DOM text keeps metadata readers unchanged; the repeat is decorative. */
  .bgm-loop-copy::before{content:attr(data-loop-copy);white-space:nowrap}
  body .now-player #npTitle.is-looping:not(.is-loop-visible)>.bgm-loop-track,
  body .now-player #npAlbum.is-looping:not(.is-loop-visible)>.bgm-loop-track,
  body #songDetail .bgm-loop.is-looping:not(.is-loop-visible)>.bgm-loop-track,
  body.bgm-loop-page-hidden :is(.now-player,#songDetail) .bgm-loop.is-looping>.bgm-loop-track{animation-play-state:paused!important}
  body #songDetail #detailTitle.bgm-loop{line-height:1.35!important}
}
@media(prefers-reduced-motion:reduce){
  body :is(.now-player,#songDetail) .bgm-loop.is-looping>.bgm-loop-track{animation:none!important;transform:none!important}
}
body.listener-reduce-motion :is(.now-player,#songDetail) .bgm-loop.is-looping>.bgm-loop-track{animation:none!important;transform:none!important}
