.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 22px; }
.song-card { cursor: pointer; min-width: 0; position: relative; }
.song-card .thumb { width: 100%; height: auto; aspect-ratio: 1; font-size: 48px; border-radius: 4px; transition: filter .15s; }
.song-card:hover .thumb { filter: brightness(1.15); }
.song-card .more { position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; border-radius: 50%;
  border: 0; background: rgba(0, 0, 0, .55); color: var(--text); font-size: 16px; cursor: pointer; opacity: 0; transition: opacity .15s; }
.song-card:hover .more, .song-card .more:focus { opacity: 1; }
.song-card .more:hover { background: var(--accent); }
.song-card .s-title, .song-card .s-artist, .song-card .s-owner {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.song-card .s-title { margin-top: 8px; }
.song-card .s-artist, .song-card .s-owner { color: var(--dim); font-size: 12px; }
.discover-tabs { display: flex; gap: 8px; margin: 0 0 16px; border-bottom: 1px solid var(--line); }
.discover-tabs button { padding: 9px 14px; background: transparent; border: 0; border-bottom: 2px solid transparent;
  color: var(--dim); cursor: pointer; }
.discover-tabs button:hover { color: var(--text); }
.discover-tabs button.active { color: var(--accent); border-bottom-color: var(--accent); }
.discover-playlist-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; }
.discover-playlist-card { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0;
  padding: 18px; border: 0; border-radius: 4px; background: var(--panel); color: var(--text); text-align: left; cursor: pointer; }
.discover-playlist-card:hover { background: #333; }
.discover-playlist-icon { font-size: 32px; color: var(--accent); }
.discover-playlist-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.discover-playlist-meta, .discover-playlist-owner { color: var(--dim); font-size: 12px; }