feat(web): gapless audio handoff to fix desktop media-tile flicker

Add a second <audio> element; S.audio always points at the active one and
listeners are bound to both once (handlers guard with el !== S.audio).
preloadNext buffers the next track into the standby element, and playCurrent
hands playback over to it on skip instead of swapping the source — so the
active element never empties and Windows keeps the media tile (also makes
forward skips instant/gapless).

Safety: handoff only when the standby is buffered (readyState >= 2); falls
back to the unchanged source-swap path otherwise, if there's no second
element, or if handoff play() rejects. Web-only — the native bridge path is
untouched.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/player/player.js

@@ -276,10 +276,19 @@ function _setAudioSession() {
   try { if(navigator.audioSession) navigator.audioSession.type = 'playback'; } catch {}
 }
 
-// ─── PRELOAD — shadow Audio element actually buffers the next track ──────────
+// ─── PRELOAD — the standby audio element buffers the next track ──────────────
+// Buffering into the *standby* element (not a throwaway) lets playCurrent() hand
+// playback over to it gaplessly: the active element never empties, so the OS media
+// tile doesn't flicker on skip. Falls back to a source-swap when not preloaded.
 let _preUrl   = '';
 let _preId    = '';
-let _preAudio = null;
+
+/** The audio element that is NOT currently active (or null if there's only one). */
+function _standbyEl() {
+  const els = S._audioEls;
+  if (!els || els.length < 2) return null;
+  return els.find(e => e !== S.audio) || null;
+}
 
 function _nextIdx() {
   if(S.repeat === 'one') return S.qIdx;
@@ -294,13 +303,12 @@ function _preloadNext() {
   if(ni < 0) return;
   const next = S.queue[ni];
   if(!next || _preId === next.id) return;
+  const standby = _standbyEl();
+  if(!standby) return;
   _preId  = next.id;
   _preUrl = streamUrl(next.id);
-  // Real Audio preload — actually buffers the stream so canplay fires instantly
-  if(_preAudio) { _preAudio.src = ''; _preAudio = null; }
-  _preAudio = new Audio();
-  _preAudio.preload = 'auto';
-  _preAudio.src = _preUrl;
+  standby.src = _preUrl;          // preload="auto" → the element buffers it for a gapless handoff
+  try { standby.load(); } catch {}
   if(next.coverArt) {
     [256, 512, 1024].forEach(size => {
       const img = new Image();
@@ -311,7 +319,8 @@ function _preloadNext() {
 
 function _clearPreload() {
   _preId = ''; _preUrl = '';
-  if(_preAudio) { _preAudio.src = ''; _preAudio = null; }
+  const standby = _standbyEl();
+  if(standby) { try { standby.pause(); standby.removeAttribute('src'); standby.load(); } catch {} }
 }
 
 // ─── PLAY HISTORY (for prev-in-shuffle) ──────────────────────────────────────
@@ -397,10 +406,6 @@ export function playCurrent() {
   renderQueue();
   _scheduleScrobble(s.id, s.duration);
 
-  const src = (_preId === s.id && _preUrl) ? _preUrl : streamUrl(s.id);
-  _clearPreload();
-  S.audio.src = src;
-
   const _resetFlag = () => { if (_playGen === gen) S._trackChanging = false; };
 
   const _applySession = () => {
@@ -409,6 +414,35 @@ export function playCurrent() {
     setTimeout(_preloadNext, 2000);
   };
 
+  // ── Gapless handoff: if the standby element already buffered THIS track, switch
+  // playback to it instead of reloading the source. The active element never empties,
+  // so the OS media tile stays put (and the skip is instant). ──
+  const standby = _standbyEl();
+  if (standby && _preId === s.id && standby.readyState >= 2) {
+    const old = S.audio;
+    standby.currentTime = 0;
+    standby.volume = old.volume; standby.muted = old.muted; standby.playbackRate = old.playbackRate || 1;
+    S.audio = standby;                 // the active element is now the preloaded one
+    _preId = ''; _preUrl = '';
+    try { old.pause(); } catch {}      // 'pause' is ignored for the now-inactive element
+    _setAudioSession();
+    S.audio.play()
+      .then(() => { S._trackChanging = false; _applySession(); })
+      .catch(() => {
+        // Handoff playback failed — recover with a fresh source load on this element.
+        if (_playGen !== gen) return;
+        S.audio.src = streamUrl(s.id);
+        try { S.audio.load(); } catch {}
+        S.audio.play().then(() => { S._trackChanging = false; _applySession(); }).catch(_resetFlag);
+      });
+    return;
+  }
+
+  // ── Fallback: classic source swap on the current element (unchanged) ──
+  const src = (_preId === s.id && _preUrl) ? _preUrl : streamUrl(s.id);
+  _clearPreload();
+  S.audio.src = src;
+
   let _guardTimer = null;
   let _canplayFn  = null;