fix: eliminate flash on skip, refresh home on nav

- renderQueue: in-place active-class update when queue unchanged — no DOM rebuild, no image reload
- updatePlayerUI: update img.src directly instead of replacing innerHTML
- _syncNpDirect: same img.src update for now-playing cover
- navigate('home'): always reloads home data so new albums appear without restart

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

src/main.js

@@ -11,7 +11,7 @@ import {
   npToggleStar, updateMediaSession,
 } from './player.js';
 import {
-  navigate, _navGoBack, _navLoad, loadHomeData, onLocalSearch, onMobileSearch,
+  navigate, _navGoBack, _navLoad, onLocalSearch, onMobileSearch,
   onGlobalSearch, s_goArtist, s_goAlbum, playerBarGoArtist, playerBarGoAlbum,
   searchSimilarArtist, searchAndPreview, loadItunesAlbum, expandArtistBio,
   loadRandom,
@@ -81,7 +81,6 @@ async function startApp() {
   } else {
     navigate('home');
   }
-  loadHomeData();
   initNotifBell();
   _restoreLastPlayed();
   if(localStorage.getItem('ns_radio')==='1') { S.radioMode=true; _applyRadioBtn(); }

src/player.js

@@ -37,7 +37,9 @@ export function updatePlayerUI(s) {
   document.getElementById('player-album-name').textContent = s.album || '';
   const art = document.getElementById('player-art');
   const cv = coverUrl(s.coverArt, 100);
-  art.innerHTML = cv ? `<img src="${cv}" style="width:100%;height:100%;object-fit:cover">` : '<div class="no-art">♪</div>';
+  const existingImg = art.querySelector('img');
+  if (cv && existingImg) existingImg.src = cv;
+  else art.innerHTML = cv ? `<img src="${cv}" style="width:100%;height:100%;object-fit:cover">` : '<div class="no-art">♪</div>';
   updateStarBtn();
   document.title = `${s.title} — NovaSonic`;
   updateMediaSession(s);
@@ -60,7 +62,11 @@ export function _syncNpDirect(s) {
   const cv = coverUrl(s.coverArt, 400);
   const cover = document.getElementById('np-cover');
   const bg    = document.getElementById('np-bg');
-  if(cover) cover.innerHTML = cv ? `<img src="${cv}" style="width:100%;height:100%;object-fit:cover">` : '<div class="no-art">♪</div>';
+  if (cover) {
+    const existingImg = cover.querySelector('img');
+    if (cv && existingImg) existingImg.src = cv;
+    else if (cover) cover.innerHTML = cv ? `<img src="${cv}" style="width:100%;height:100%;object-fit:cover">` : '<div class="no-art">♪</div>';
+  }
   if(bg) bg.style.backgroundImage = cv ? `url('${cv}')` : 'none';
   const t = document.getElementById('np-title'); if(t) t.textContent = s.title || '—';
   const an = document.getElementById('np-artist-name');
@@ -285,8 +291,21 @@ export function npToggleStar() {
 }
 
 // ─── QUEUE PANEL ───
+let _renderedQueueKey = '';
+
 export function renderQueue() {
   const el = document.getElementById('queue-list');
+  if (!el) return;
+  const queueKey = S.queue.map(s => s.id).join(',');
+
+  if (queueKey === _renderedQueueKey && el.children.length === S.queue.length) {
+    // Queue unchanged — only update active class in-place (no image reload)
+    el.querySelectorAll('.queue-item').forEach((item, i) => item.classList.toggle('active', i === S.qIdx));
+    el.querySelector('.active')?.scrollIntoView({ block: 'nearest' });
+    return;
+  }
+
+  _renderedQueueKey = queueKey;
   el.innerHTML = '';
   if (!S.queue.length) { el.innerHTML = '<div class="empty-state" style="padding:40px 16px"><div class="icon">🎵</div><p>Leer</p></div>'; return; }
   S.queue.forEach((s, i) => {

src/views.js

@@ -36,6 +36,7 @@ export function navigate(page, data=null) {
   if(['discover','new-releases','recommendations','random','spotify-importer'].includes(page)) switchNavMode('discover');
   else if(['home','artists','albums','starred','playlists'].includes(page)) switchNavMode('library');
 
+  if(page==='home')    loadHomeData();
   if(page==='artists' && !document.getElementById('artists-grid').children.length) loadArtists();
   if(page==='albums'  && !document.getElementById('albums-grid').children.length)  loadAlbums();
   if(page==='starred')       loadStarred();