refactor(web): extract CardActionCluster (#375 item #8 — narrowed scope)

The MediaCard consolidation in the discovery doc would have needed
~14 props to cover the differentiating bits (wrapping element a vs
button, art-shape, art-fallback strategy, click semantics, title
align/size, subtitle count). That's a god-prop blob that's harder to
reason about than three explicit cards.

Narrowed to the actually-drifted bit: the action cluster
(LikeButton + Plus + bottom-right menu slot, including the
stopPropagation defensive wrappers). One small component covers
AlbumCard / ArtistCard / CompactTrackCard so the focus-ring and
button-styling drift can't recur.

Each card keeps its own data-fetching, art container, and wrapping
element since those have load-bearing differences. The consolidation
addresses drift, not LOC for its own sake.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

web/src/lib/components/ArtistCard.svelte

@@ -2,9 +2,9 @@
   import type { ArtistRef, TrackRef } from '$lib/api/types';
   import { api } from '$lib/api/client';
   import { playQueue, enqueueTracks } from '$lib/player/store.svelte';
-  import { Disc3, Play, Plus } from 'lucide-svelte';
-  import LikeButton from './LikeButton.svelte';
+  import { Disc3, Play } from 'lucide-svelte';
   import ArtistMenu from './ArtistMenu.svelte';
+  import CardActionCluster from './CardActionCluster.svelte';
   import { listArtistTracks } from '$lib/api/artists';
 
   let { artist }: { artist: ArtistRef } = $props();
@@ -71,21 +71,16 @@
     </div>
     <div class="mt-2 truncate text-center text-sm font-medium text-text-primary">{artist.name}</div>
   </a>
-  <div class="absolute right-2 top-2 z-10 flex gap-1">
-    <LikeButton entityType="artist" entityId={artist.id} />
-    <button
-      type="button"
-      aria-label={`Add ${artist.name} to queue`}
-      onclick={onAddToQueue}
-      disabled={queueing}
-      class="rounded-full bg-surface px-2 py-1 text-sm text-text-secondary hover:text-text-primary focus-visible:ring-2 focus-visible:ring-accent disabled:opacity-50"
-    >
-      <Plus size={16} strokeWidth={1} />
-    </button>
-  </div>
-
-  <div class="absolute right-2 bottom-2 z-10">
-    <ArtistMenu artistId={artist.id} artistName={artist.name} />
-  </div>
+  <CardActionCluster
+    likeEntityType="artist"
+    likeEntityId={artist.id}
+    onAdd={onAddToQueue}
+    addLabel={`Add ${artist.name} to queue`}
+    addDisabled={queueing}
+  >
+    {#snippet menu()}
+      <ArtistMenu artistId={artist.id} artistName={artist.name} />
+    {/snippet}
+  </CardActionCluster>
 </div>