fix(flutter): artist albums grid — 3 per row, title wraps, no overflow

AlbumCard gains optional `width` (default 140 keeps horizontal lists
unchanged) and `titleMaxLines` (default 1) so callers can let the
title wrap to a second line. Cover sizes to width - 16 instead of a
hardcoded 124, so the card scales down cleanly when a narrower cell
width is passed in.

Artist detail grid: switch to 3 columns. LayoutBuilder computes the
cell width from the available width so AlbumCard sizes to the cell
exactly (no overflow). cellH = cover + gap + 2-line title + artist
line + small fudge — tight enough that there's no visible gap below
the card, tall enough to fit a wrapped title.

flutter_client/lib/library/artist_detail_screen.dart

@@ -81,27 +81,38 @@ class ArtistDetailScreen extends ConsumerWidget {
           albums.when(
             error: (e, _) => Center(child: Text('$e', style: TextStyle(color: fs.error))),
             loading: () => const Padding(padding: EdgeInsets.all(16), child: Center(child: CircularProgressIndicator())),
-            data: (list) => GridView.builder(
+            data: (list) => LayoutBuilder(builder: (ctx, constraints) {
-              shrinkWrap: true,
+              const cols = 3;
-              physics: const NeverScrollableScrollPhysics(),
+              const sidePad = 8.0;
-              padding: const EdgeInsets.all(8),
+              const gap = 8.0;
-              // mainAxisExtent locks each cell's height to the actual
+              final cellW =
-              // AlbumCard footprint (124 cover + 8 + 14 title + 12
+                  (constraints.maxWidth - sidePad * 2 - gap * (cols - 1)) /
-              // artist + ~6 padding), instead of letting
+                      cols;
-              // childAspectRatio inflate it. Removes the visible vertical
+              // Card content: cover (cellW - 16) + 8 + title (≤2 lines
-              // gap below each card.
+              // ≈ 36) + artist line ≈ 16 + small fudge.
-              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+              final cellH = (cellW - 16) + 8 + 36 + 16 + 4;
-                crossAxisCount: 2,
+              return GridView.builder(
-                mainAxisExtent: 168,
+                shrinkWrap: true,
-                mainAxisSpacing: 8,
+                physics: const NeverScrollableScrollPhysics(),
-                crossAxisSpacing: 8,
+                padding: const EdgeInsets.fromLTRB(sidePad, 0, sidePad, 16),
-              ),
+                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-              itemCount: list.length,
+                  crossAxisCount: cols,
-              itemBuilder: (_, i) {
+                  mainAxisExtent: cellH,
-                final AlbumRef album = list[i];
+                  mainAxisSpacing: gap,
-                return AlbumCard(album: album, onTap: () => context.push('/albums/${album.id}'));
+                  crossAxisSpacing: gap,
-              },
+                ),
-            ),
+                itemCount: list.length,
+                itemBuilder: (_, i) {
+                  final AlbumRef album = list[i];
+                  return AlbumCard(
+                    album: album,
+                    width: cellW,
+                    titleMaxLines: 2,
+                    onTap: () => context.push('/albums/${album.id}'),
+                  );
+                },
+              );
+            }),
           ),
         ]),
       ),

flutter_client/lib/library/widgets/album_card.dart

@@ -6,47 +6,69 @@ import '../../shared/widgets/server_image.dart';
 import '../../theme/theme_extension.dart';
 
 class AlbumCard extends StatelessWidget {
-  const AlbumCard({required this.album, required this.onTap, super.key});
+  const AlbumCard({
+    required this.album,
+    required this.onTap,
+    this.width = 140,
+    this.titleMaxLines = 1,
+    super.key,
+  });
   final AlbumRef album;
   final VoidCallback onTap;
 
+  /// Outer width of the card. Cover is square at width - 16 (8dp
+  /// horizontal padding either side). Default suits horizontal lists;
+  /// grids should pass the cell width so the card scales down.
+  final double width;
+
+  /// Lets callers (e.g. the artist detail grid) allow the title to
+  /// wrap to a second line so it isn't truncated to a single
+  /// ellipsized character at narrower widths.
+  final int titleMaxLines;
+
   @override
   Widget build(BuildContext context) {
     final fs = Theme.of(context).extension<FabledSwordTheme>()!;
+    final coverSize = width - 16;
     return SizedBox(
-      width: 140,
+      width: width,
       child: Material(
         color: Colors.transparent,
         child: InkWell(
           onTap: onTap,
           child: Padding(
             padding: const EdgeInsets.symmetric(horizontal: 8),
-            child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
+            child: Column(
-            ClipRRect(
+              crossAxisAlignment: CrossAxisAlignment.start,
-              borderRadius: BorderRadius.circular(6),
+              mainAxisSize: MainAxisSize.min,
-              child: Container(
+              children: [
-                width: 124,
+                ClipRRect(
-                height: 124,
+                  borderRadius: BorderRadius.circular(6),
-                color: fs.slate,
+                  child: Container(
-                child: album.coverUrl.isEmpty
+                    width: coverSize,
-                    ? SvgPicture.asset('assets/svg/album-fallback.svg', fit: BoxFit.cover)
+                    height: coverSize,
-                    : ServerImage(url: album.coverUrl, fit: BoxFit.cover),
+                    color: fs.slate,
-              ),
+                    child: album.coverUrl.isEmpty
+                        ? SvgPicture.asset('assets/svg/album-fallback.svg',
+                            fit: BoxFit.cover)
+                        : ServerImage(url: album.coverUrl, fit: BoxFit.cover),
+                  ),
+                ),
+                const SizedBox(height: 8),
+                Text(
+                  album.title,
+                  maxLines: titleMaxLines,
+                  overflow: TextOverflow.ellipsis,
+                  style: TextStyle(color: fs.parchment, fontSize: 14),
+                ),
+                Text(
+                  album.artistName,
+                  maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
+                  style: TextStyle(color: fs.ash, fontSize: 12),
+                ),
+              ],
             ),
-            const SizedBox(height: 8),
-            Text(
-              album.title,
-              maxLines: 1,
-              overflow: TextOverflow.ellipsis,
-              style: TextStyle(color: fs.parchment, fontSize: 14),
-            ),
-            Text(
-              album.artistName,
-              maxLines: 1,
-              overflow: TextOverflow.ellipsis,
-              style: TextStyle(color: fs.ash, fontSize: 12),
-            ),
-          ]),
           ),
         ),
       ),