feat(web/m7-377): CompactTrackCard gains like + queue + kebab overlays

web/src/lib/components/CompactTrackCard.svelte

@@ -1,7 +1,10 @@
 <script lang="ts">
   import type { TrackRef } from '$lib/api/types';
-  import { playQueue } from '$lib/player/store.svelte';
+  import { playQueue, enqueueTrack } from '$lib/player/store.svelte';
   import { FALLBACK_COVER } from '$lib/media/covers';
+  import { Plus } from 'lucide-svelte';
+  import LikeButton from './LikeButton.svelte';
+  import TrackMenu from './TrackMenu.svelte';
 
   let {
     track,
@@ -22,23 +25,45 @@
   function onClick() {
     playQueue(sectionTracks, index);
   }
+
+  function onAddToQueue(e: MouseEvent) {
+    e.preventDefault();
+    e.stopPropagation();
+    enqueueTrack(track);
+  }
 </script>
 
-<button
-  type="button"
-  aria-label={`Play ${track.title}`}
-  onclick={onClick}
-  class="card group block w-36 rounded text-left focus-visible:ring-2 focus-visible:ring-accent"
->
-  <div class="aspect-square w-full overflow-hidden rounded-md bg-surface-hover">
-    <img
-      src={coverUrl}
-      alt=""
-      class="h-full w-full object-cover transition-transform group-hover:scale-[1.03]"
-      loading="lazy"
-      onerror={onImgError}
-    />
+<div class="card relative w-36">
+  <button
+    type="button"
+    aria-label={`Play ${track.title}`}
+    onclick={onClick}
+    class="group block w-full rounded text-left focus-visible:ring-2 focus-visible:ring-accent"
+  >
+    <div class="aspect-square w-full overflow-hidden rounded-md bg-surface-hover">
+      <img
+        src={coverUrl}
+        alt=""
+        class="h-full w-full object-cover transition-transform group-hover:scale-[1.03]"
+        loading="lazy"
+        onerror={onImgError}
+      />
+    </div>
+    <div class="mt-2 truncate text-xs font-medium text-text-primary">{track.title}</div>
+    <div class="truncate text-xs text-text-secondary">{track.artist_name}</div>
+  </button>
+  <div class="absolute right-2 top-2 z-10 flex gap-1" onclick={(e) => e.stopPropagation()}>
+    <LikeButton entityType="track" entityId={track.id} />
+    <button
+      type="button"
+      aria-label={`Add ${track.title} to queue`}
+      onclick={onAddToQueue}
+      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"
+    >
+      <Plus size={16} strokeWidth={1} />
+    </button>
   </div>
-  <div class="mt-2 truncate text-xs font-medium text-text-primary">{track.title}</div>
-  <div class="truncate text-xs text-text-secondary">{track.artist_name}</div>
-</button>
+  <div class="absolute right-2 bottom-2 z-10">
+    <TrackMenu {track} />
+  </div>
+</div>