@media (max-width: 760px) {
  /*
   * Hiding the artist column below still leaves 4 visible children in DOM order
   * (index, main, duration, actions), but the old template only declared 3
   * tracks. The 4th (actions — like + more buttons) fell into an implicit
   * auto-flow row, got squeezed to ~16px wide, and doubled the row's height.
   * minmax(0, 1fr) on main is required, not just 1fr — a bare 1fr track still
   * refuses to shrink below its content's min-content width in Grid, same as
   * flex, so long titles would blow the row width back out without it.
   */
  .track-row,
  .skel-row {
    grid-template-columns: 24px minmax(0, 1fr) auto auto;
    gap: var(--space-3);
  }
  .track-row__artist,
  .skel-row .skel-text:nth-child(3) {
    display: none;
  }
  .card-grid {
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: var(--space-3);
  }
}

@media (max-width: 480px) {
  .topbar {
    gap: var(--space-2);
  }
  .search-input {
    height: 42px;
  }
  .topbar-account span:last-child {
    display: none;
  }
  .topbar-account {
    padding: 8px;
    max-width: none;
  }
}