feat(web/m7-364): PlayerBar queue toggle + Up next line

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/src/lib/components/PlayerBar.svelte

@@ -2,12 +2,14 @@
   import {
     SkipBack, SkipForward, Play, Pause, Loader2,
     Shuffle, Repeat, Repeat1,
-    Volume2, Volume1, VolumeX
+    Volume2, Volume1, VolumeX,
+    ListMusic
   } from 'lucide-svelte';
   import {
     player,
     togglePlay, skipNext, skipPrev, seekTo, setVolume,
-    toggleShuffle, cycleRepeat, playQueue
+    toggleShuffle, cycleRepeat, playQueue,
+    toggleQueueDrawer
   } from '$lib/player/store.svelte';
   import { formatDuration } from '$lib/media/duration';
   import { FALLBACK_COVER } from '$lib/media/covers';
@@ -69,6 +71,12 @@
         >
           {current.artist_name}
         </a>
+        {#if player.queue.length > player.index + 1}
+          {@const nextTrack = player.queue[player.index + 1]}
+          <span class="text-text-secondary text-xs truncate block">
+            Next · {nextTrack.title} — {nextTrack.artist_name}
+          </span>
+        {/if}
       </div>
       <LikeButton entityType="track" entityId={current.id} />
       <TrackMenu track={current} direction="up" hideQueueActions />
@@ -177,6 +185,17 @@
           <Repeat size={18} strokeWidth={1.5} />
         {/if}
       </button>
+      <button
+        type="button"
+        onclick={() => toggleQueueDrawer()}
+        aria-label={player.queueDrawerOpen ? 'Close queue' : 'Open queue'}
+        aria-pressed={player.queueDrawerOpen}
+        class="flex h-9 w-9 items-center justify-center rounded-full transition-colors {player.queueDrawerOpen
+          ? 'bg-action-secondary text-action-fg'
+          : 'text-text-secondary hover:bg-surface-hover hover:text-text-primary'}"
+      >
+        <ListMusic size={20} strokeWidth={1.5} />
+      </button>
       <label class="flex items-center gap-1.5">
         <span class="sr-only">Volume</span>
         <VolumeIcon size={18} strokeWidth={1.5} class="shrink-0 text-text-secondary" />