v3: denser dump cards in the two-column profile view

The dump card is proportioned for the 860px feed; in a ~400px profile
column the title wrapped four lines deep, the meta row stacked, every
category chip took a line of its own and the vote button floated in the
middle of the resulting void. Re-proportion it for the column — smaller
thumb, title clamped to two lines, no teaser, meta and chips sharing the
line under the title — scoped to the width where the columns split.

Also stop the playlist card's inner from clipping its own hover: it
inherits overflow:hidden from the rule it shares with the dump card,
which needs it for the collapse animation. A playlist card never
collapses and its height is set by its 80px square thumb, so the clip
shaved the corners off the scaled thumb and sliced its lift shadow into
a hard-edged slab against the card border.

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

src/App.css

@@ -2002,6 +2002,100 @@ body.has-player .chat-fab {
   }
 }
 
+/* ── Dense dump cards in the two-column profile view ──
+   The default card is proportioned for the 860px feed. Dropped into a ~400px
+   column it falls apart: the title wraps four lines deep, the meta row stacks,
+   every category chip takes a line of its own and the vote button floats in
+   the middle of the resulting void. Below is the same card re-proportioned for
+   the column — smaller thumb, title clamped to two lines, no teaser, and meta
+   plus chips sharing the line under the title. Scoped to the width where the
+   columns actually split; narrower than that the feed is full-width again and
+   the regular (then the phone) layout applies. */
+@media (min-width: 900px) {
+  .profile-columns .dump-feed {
+    padding: 0.75rem 0 0;
+    gap: 0.5rem;
+  }
+
+  /* preview | body | vote, all top-aligned so the count sits on the title
+     line instead of drifting to the card's vertical middle. */
+  .profile-columns .dump-card-inner {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    align-items: start;
+    gap: 0.55rem;
+    padding: 0.5rem 0.6rem;
+  }
+
+  .profile-columns .dump-card-preview {
+    grid-area: 1 / 1;
+    width: 88px;
+    height: 50px;
+  }
+
+  .profile-columns .dump-card-vote {
+    grid-area: 1 / 3;
+    align-self: start;
+  }
+
+  /* Row layout with a full-width title: the title takes a line to itself, then
+     meta and chips flow onto the next one and only wrap when they must. */
+  .profile-columns .dump-card-body {
+    grid-area: 1 / 2;
+    margin-left: 0;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: baseline;
+    gap: 0.15rem 0.45rem;
+  }
+
+  .profile-columns .dump-card-title {
+    flex: 1 0 100%;
+    font-size: 0.9rem;
+    line-height: 1.3;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+    overflow: hidden;
+  }
+
+  /* The teaser is the first thing to go, the same call the phone layout makes. */
+  .profile-columns .dump-card-comment {
+    display: none;
+  }
+
+  .profile-columns .dump-card-meta,
+  .profile-columns .dump-card-categories {
+    margin-top: 0;
+  }
+
+  .profile-columns .dump-card-meta {
+    gap: 0.4rem;
+    /* Keeps "3 weeks ago" and "1 comment" on one line each. */
+    white-space: nowrap;
+  }
+
+  .profile-columns .dump-card-date,
+  .profile-columns .dump-card-comment-count {
+    font-size: 0.72rem;
+  }
+
+  .profile-columns .dump-card-categories {
+    gap: 0.25rem;
+  }
+
+  .profile-columns .dump-card-category-chip {
+    padding: 0.05rem 0.4rem;
+    font-size: 0.68rem;
+  }
+
+  .profile-columns .vote-btn {
+    padding: 0.15rem 0.45rem;
+    font-size: 0.78rem;
+  }
+}
+
 .profile-section ul {
   list-style: none;
   margin: 0;
@@ -3289,6 +3383,17 @@ body.has-player .chat-fab {
   cursor: pointer;
 }
 
+/* The `overflow: hidden` above is there for the dump card's collapse animation
+   (grid-template-rows: 0fr). A playlist card never collapses, and its height is
+   set by the 80px square thumb itself — so the clip had nothing to spare on
+   hover: it shaved the corners off the scaled thumb and sliced its drop shadow
+   into a hard-edged slab against the card border. Nothing else in the card
+   needs the clip (the thumb and the description clamp carry their own), so the
+   lift is simply allowed to render. */
+.playlist-card-inner {
+  overflow: visible;
+}
+
 /* Desktop: wrapper is transparent — preview and vote become direct flex items of dump-card-inner */
 .dump-card-left {
   display: contents;