music: pool single-album artists into shared rows

An artist with one album got a heading and one cover on a row that fits
five, and a library is mostly single-album artists. Consecutive singles
share one grid, in place, so the page stays in artist order.

Each pooled cover keeps its artist's name above it in the same type as
a section heading. Dropping it was the first version and it was wrong:
scrolling then alternates between artists written large and small.

Measured on the probe's fixture: 4208px to 1895px, and a walk of the
page reaches all 21 covers instead of 9.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

1 files changed, 24 insertions, 0 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css
index 2bf0b18..5ef04b0 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/style.css
+++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css
@@ -5044,6 +5044,12 @@ h2 .gn-owner, h3 .gn-owner { font-size: 0.55em; }
   max-height: calc(100vh - 16px);
   overflow-x: hidden;
   overflow-y: auto;
+  /* Wheeling past the last track must not carry on into the page behind: that
+     scroll is a real page scroll, and a page scroll closes this menu on
+     purpose (menu.js). Without this, reaching the end of a long tracklist
+     dismisses the menu, which is the same symptom the scroll handler was just
+     fixed for, arriving by a different door. */
+  overscroll-behavior: contain;
   padding: 4px 0;
   background: var(--bg-surface);
   border: 1px solid var(--border);
@@ -5192,3 +5198,21 @@ h2 .gn-owner, h3 .gn-owner { font-size: 0.55em; }
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+/* A run of single-album artists, pooled into one grid so five of them fill one
+   row instead of spending five (music-app.js `albumSections`).
+
+   Each cell keeps its artist's name above the cover, in the same type as a
+   multi-album artist's heading. Dropping it — the first version of this — made
+   scrolling alternate between artists written large and artists written small,
+   which is a worse problem than the whitespace it saved. */
+.music-artist-pool { margin-bottom: 22px; }
+.music-pool-cell { display: flex; flex-direction: column; min-width: 0; }
+/* One line, clipped. A cell is about 170px wide, and a heading that wrapped to
+   two lines would push its own cover below the others on its row — the grid
+   stretches the cell, it does not align what is inside it. */
+.music-pool-heading {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}