fix(linebed): scale artwork to match track-meta column height

The bottom-info song card on LineBed pairs a four-row column (title +
album + artist + quality badge) with a square artwork thumb. With the
quality badge added the column grew to ~100px while the thumb stayed
at its old 72px fixed size, breaking the visual weight balance — the
column dominated the card and the thumb read as an afterthought.

Wraps the thumb in a flex container that stretches to the column
height, then sizes the thumb to 98% of that height with aspect-ratio
1 so it stays square. The 2% breathing room reads as a deliberate
gutter rather than a flush match, and the thumb sits vertically
centered against the column instead of pinned to either edge.

The fixed 72/56 dimensions and the mobile media-query override drop
out as a side effect — the thumb now scales with the actual content
height, so the breakpoint clamp isn't needed.

cc

src/lib/components/immersive/panels/LinebedPanel.svelte

@@ -435,8 +435,10 @@
       <QualityBadgeStatic {quality} {bitDepth} {samplingRate} {format} />
     </div>
     {#if artwork}
-      <div class="artwork-thumb">
+      <div class="artwork-wrap">
-        <img src={artwork} alt={trackTitle} />
+        <div class="artwork-thumb">
+          <img src={artwork} alt={trackTitle} />
+        </div>
       </div>
     {/if}
   </div>
@@ -470,7 +472,11 @@
     bottom: 24px;
     z-index: 10;
     display: flex;
-    align-items: center;
+    /* Stretch so the artwork thumb matches the height of the track-meta
+       column (title + album + artist + quality badge). The artwork's
+       intrinsic dimensions are no longer fixed — it scales to fill the
+       column height with a 1px top/bottom margin (~98% of the column). */
+    align-items: stretch;
     gap: 12px;
   }
 
@@ -511,13 +517,23 @@
     text-overflow: ellipsis;
   }
 
+  /* Stretches to match the height of the track-meta column (3 text
+     lines + quality badge), giving the inner .artwork-thumb a parent
+     against which to size as a percentage. flex-shrink: 0 prevents
+     the wrapper from collapsing if the row runs out of horizontal
+     room. */
+  .artwork-wrap {
+    display: flex;
+    align-items: center;
+    flex-shrink: 0;
+  }
+
   .artwork-thumb {
-    width: 72px;
+    height: 98%;
-    height: 72px;
+    aspect-ratio: 1;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
-    flex-shrink: 0;
   }
 
   .artwork-thumb img {
@@ -542,10 +558,5 @@
       right: 16px;
       bottom: 16px;
     }
-
-    .artwork-thumb {
-      width: 56px;
-      height: 56px;
-    }
   }
 </style>