chore: Bump version to 2.3.3-beta+25

🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add MA version detection for Sendspin proxy support
2025-12-22 10:10:43 +00:00 · 2025-12-21 21:50:54 +00:00 · 2025-12-21 21:00:02 +00:00 · 2025-12-21 20:46:21 +00:00 · 2025-12-21 20:35:52 +00:00 · 2025-12-21 09:27:23 +00:00
43 changed files with 4023 additions and 1045 deletions
@@ -41,6 +41,9 @@ jobs:
      - name: Generate code (Drift database)
        run: dart run build_runner build --delete-conflicting-outputs

+      - name: Generate localizations
+        run: flutter gen-l10n
+
      - name: Generate launcher icons
        run: flutter pub run flutter_launcher_icons

@@ -0,0 +1,5 @@
+arb-dir: lib/l10n
+template-arb-file: app_en.arb
+output-localization-file: app_localizations.dart
+synthetic-package: false
+output-class: S
@@ -0,0 +1,276 @@
+{
+  "@@locale": "de",
+
+  "appTitle": "Ensemble",
+  "connecting": "Verbinde...",
+  "connected": "Verbunden",
+  "disconnected": "Getrennt",
+
+  "serverAddress": "Serveradresse",
+  "serverAddressHint": "z.B. music.example.com oder 192.168.1.100",
+  "yourName": "Dein Name",
+  "yourFirstName": "Dein Vorname",
+  "portOptional": "Port (Optional)",
+  "portHint": "z.B. 8095 oder leer lassen",
+  "portDescription": "Leer lassen bei Reverse Proxy oder Standardports. 8095 eingeben bei Direktverbindung.",
+
+  "username": "Benutzername",
+  "password": "Passwort",
+  "detectAndConnect": "Erkennen & Verbinden",
+  "connect": "Verbinden",
+  "disconnect": "Trennen",
+
+  "authServerUrlOptional": "Auth-Server URL (Optional)",
+  "authServerUrlHint": "z.B. auth.example.com (wenn abweichend vom Server)",
+  "authServerUrlDescription": "Leer lassen, wenn Authentifizierung auf demselben Server",
+  "detectedAuthType": "Erkannt: {authType}",
+  "serverRequiresAuth": "Dieser Server erfordert Authentifizierung",
+
+  "tailscaleVpnConnection": "Tailscale VPN-Verbindung",
+  "unencryptedConnection": "Unverschlusselte Verbindung",
+  "usingHttpOverTailscale": "HTTP uber Tailscale (verschlusselter Tunnel)",
+  "httpsFailedUsingHttp": "HTTPS fehlgeschlagen, verwende HTTP",
+  "httpNotEncrypted": "HTTP-Verbindung - Daten sind nicht verschlusselt",
+
+  "pleaseEnterServerAddress": "Bitte gib deine Music Assistant Serveradresse ein",
+  "pleaseEnterName": "Bitte gib deinen Namen ein",
+  "pleaseEnterValidPort": "Bitte gib eine gultige Portnummer ein (1-65535)",
+  "pleaseEnterCredentials": "Bitte gib Benutzername und Passwort ein",
+  "authFailed": "Authentifizierung fehlgeschlagen. Bitte uberprufe deine Anmeldedaten.",
+  "maLoginFailed": "Music Assistant Anmeldung fehlgeschlagen. Bitte uberprufe deine Anmeldedaten.",
+  "connectionFailed": "Verbindung zum Server fehlgeschlagen. Bitte uberprufe die Adresse und versuche es erneut.",
+  "detectingAuth": "Erkenne Authentifizierung...",
+  "cannotDetermineAuth": "Authentifizierungsanforderungen konnten nicht ermittelt werden. Bitte uberprufe die Server-URL.",
+
+  "noAuthentication": "Keine Authentifizierung",
+  "httpBasicAuth": "HTTP Basic Auth",
+  "authelia": "Authelia",
+  "musicAssistantLogin": "Music Assistant Anmeldung",
+
+  "pressBackToMinimize": "Erneut drucken zum Minimieren",
+
+  "recentlyPlayed": "Zuletzt gespielt",
+  "discoverArtists": "Kunstler entdecken",
+  "discoverAlbums": "Alben entdecken",
+  "continueListening": "Weiterhoren",
+  "discoverAudiobooks": "Horbücher entdecken",
+  "discoverSeries": "Serien entdecken",
+  "favoriteAlbums": "Lieblingsalben",
+  "favoriteArtists": "Lieblingskünstler",
+  "favoriteTracks": "Lieblingssongs",
+
+  "searchMusic": "Musik suchen...",
+  "searchForContent": "Nach Künstlern, Alben oder Songs suchen",
+  "retry": "Wiederholen",
+  "all": "Alle",
+  "artists": "Künstler",
+  "albums": "Alben",
+  "tracks": "Songs",
+  "playlists": "Wiedergabelisten",
+  "audiobooks": "Hörbücher",
+  "searchFailed": "Suche fehlgeschlagen. Bitte überprüfe deine Verbindung.",
+
+  "queue": "Warteschlange",
+  "playerQueue": "{playerName} Warteschlange",
+  "noPlayerSelected": "Kein Player ausgewählt",
+  "undo": "Rückgängig",
+  "removedItem": "{itemName} entfernt",
+
+  "settings": "Einstellungen",
+  "debugLogs": "Debug-Protokolle",
+  "themeMode": "Design",
+  "light": "Hell",
+  "dark": "Dunkel",
+  "system": "System",
+  "pullToRefresh": "Ziehe zum Aktualisieren der Bibliothek",
+  "viewDebugLogs": "Debug-Protokolle anzeigen",
+
+  "viewAllPlayers": "Alle Player anzeigen",
+  "copyLogs": "Protokolle kopieren",
+  "clearLogs": "Protokolle löschen",
+  "copyList": "Liste kopieren",
+  "close": "Schließen",
+  "allPlayersCount": "Alle Player ({count})",
+  "errorLoadingPlayers": "Fehler beim Laden der Player: {error}",
+  "logsCopied": "Protokolle in Zwischenablage kopiert",
+  "logsCleared": "Protokolle gelöscht",
+  "playerListCopied": "Playerliste in Zwischenablage kopiert!",
+  "noLogsYet": "Noch keine Protokolle",
+  "infoPlus": "Info+",
+  "warnings": "Warnungen",
+  "errors": "Fehler",
+  "showingEntries": "Zeige {filtered} von {total} Einträgen",
+  "thisDevice": "Dieses Gerät",
+  "ghostPlayer": "Geist-Player (Duplikat)",
+  "unavailableCorrupt": "Nicht verfügbar/Beschädigt",
+  "playerId": "ID: {id}",
+  "playerInfo": "Verfügbar: {available} | Anbieter: {provider}",
+  "shareBugReport": "Fehlerbericht teilen",
+  "moreOptions": "Weitere Optionen",
+
+  "failedToUpdateFavorite": "Favorit konnte nicht aktualisiert werden: {error}",
+  "noPlayersAvailable": "Keine Player verfügbar",
+  "albumAddedToQueue": "Album zur Warteschlange hinzugefügt",
+  "tracksAddedToQueue": "Songs zur Warteschlange hinzugefügt",
+  "play": "Abspielen",
+  "noPlayersFound": "Keine Player gefunden",
+
+  "startingRadio": "Starte {name} Radio",
+  "failedToStartRadio": "Radio konnte nicht gestartet werden: {error}",
+  "startingRadioOnPlayer": "Starte {name} Radio auf {playerName}",
+  "addedRadioToQueue": "{name} Radio zur Warteschlange hinzugefügt",
+  "failedToAddToQueue": "Konnte nicht zur Warteschlange hinzufügen: {error}",
+  "radio": "Radio",
+  "inLibrary": "In Bibliothek",
+  "noAlbumsFound": "Keine Alben gefunden",
+
+  "playing": "Spiele {name}",
+  "playingTrack": "Spiele Song",
+
+  "markedAsFinished": "{name} als beendet markiert",
+  "failedToMarkFinished": "Konnte nicht als beendet markieren: {error}",
+  "markedAsUnplayed": "{name} als ungespielt markiert",
+  "failedToMarkUnplayed": "Konnte nicht als ungespielt markieren: {error}",
+  "failedToPlay": "Abspielen fehlgeschlagen: {error}",
+  "markAsFinished": "Als beendet markieren",
+  "markAsUnplayed": "Als ungespielt markieren",
+  "byAuthor": "Von {author}",
+
+  "audiobookCount": "{count} Hörbuch/Hörbücher",
+  "loading": "Laden...",
+  "bookCount": "{count} Buch/Bücher",
+  "books": "Bücher",
+
+  "noFavoriteAudiobooks": "Keine Lieblingshörbücher",
+  "tapHeartAudiobook": "Tippe auf das Herz bei einem Hörbuch, um es zu Favoriten hinzuzufügen",
+  "noAudiobooks": "Keine Hörbücher",
+  "addAudiobooksHint": "Füge Hörbücher zu deiner Bibliothek hinzu, um sie hier zu sehen",
+
+  "noFavoriteArtists": "Keine Lieblingskünstler",
+  "tapHeartArtist": "Tippe auf das Herz bei einem Künstler, um ihn zu Favoriten hinzuzufügen",
+  "noFavoriteAlbums": "Keine Lieblingsalben",
+  "tapHeartAlbum": "Tippe auf das Herz bei einem Album, um es zu Favoriten hinzuzufügen",
+  "noFavoritePlaylists": "Keine Lieblings-Wiedergabelisten",
+  "tapHeartPlaylist": "Tippe auf das Herz bei einer Wiedergabeliste, um sie zu Favoriten hinzuzufügen",
+  "noFavoriteTracks": "Keine Lieblingssongs",
+  "longPressTrackHint": "Halte einen Song gedrückt und tippe auf das Herz, um ihn zu Favoriten hinzuzufügen",
+  "loadSeries": "Serien laden",
+
+  "notConnected": "Nicht mit Music Assistant verbunden",
+  "notConnectedTitle": "Nicht verbunden",
+  "connectHint": "Verbinde dich mit deinem Music Assistant Server, um Musik zu hören",
+  "configureServer": "Server konfigurieren",
+
+  "noArtistsFound": "Keine Künstler gefunden",
+  "noTracksFound": "Keine Songs gefunden",
+  "noPlaylistsFound": "Keine Wiedergabelisten gefunden",
+  "queueIsEmpty": "Warteschlange ist leer",
+  "noResultsFound": "Keine Ergebnisse gefunden",
+  "refresh": "Aktualisieren",
+
+  "debugConsole": "Debug-Konsole",
+  "copy": "Kopieren",
+  "clear": "Löschen",
+  "noLogsToCopy": "Keine Protokolle zum Kopieren",
+  "noDebugLogsYet": "Noch keine Debug-Protokolle. Versuche Authentifizierung zu erkennen.",
+  "showDebug": "Debug anzeigen",
+  "hideDebug": "Debug ausblenden",
+
+  "chapters": "Kapitel",
+  "noChapters": "Keine Kapitel",
+  "noChapterInfo": "Dieses Hörbuch hat keine Kapitelinformationen",
+
+  "errorSeeking": "Fehler beim Spulen: {error}",
+  "error": "Fehler: {error}",
+
+  "home": "Start",
+  "library": "Bibliothek",
+
+  "homeScreen": "Startbildschirm",
+  "metadataApis": "Metadaten-APIs",
+  "theme": "Design",
+  "materialYou": "Material You",
+  "adaptiveTheme": "Adaptives Design",
+
+  "language": "Sprache",
+  "english": "Englisch",
+  "german": "Deutsch",
+  "spanish": "Spanisch",
+
+  "noTracksInPlaylist": "Keine Songs in Wiedergabeliste",
+  "sortAlphabetically": "Alphabetisch sortieren",
+  "sortByYear": "Nach Jahr sortieren",
+  "sortBySeriesOrder": "Nach Serienreihenfolge sortieren",
+  "listView": "Listenansicht",
+  "gridView": "Rasteransicht",
+  "noBooksInSeries": "Keine Bücher in dieser Serie gefunden",
+  "artist": "Künstler",
+  "showRecentlyPlayedAlbums": "Kürzlich gespielte Alben anzeigen",
+  "showRandomArtists": "Zufällige Künstler zum Entdecken anzeigen",
+  "showRandomAlbums": "Zufällige Alben zum Entdecken anzeigen",
+  "showAudiobooksInProgress": "Hörbücher in Bearbeitung anzeigen",
+  "showRandomAudiobooks": "Zufällige Hörbücher zum Entdecken anzeigen",
+  "showRandomSeries": "Zufällige Hörbuchserien zum Entdecken anzeigen",
+  "showFavoriteAlbums": "Lieblingsalben anzeigen",
+  "showFavoriteArtists": "Lieblingskünstler anzeigen",
+  "showFavoriteTracks": "Lieblingssongs anzeigen",
+  "extractColorsFromArtwork": "Farben aus Album- und Künstlercover extrahieren",
+  "chooseHomeScreenRows": "Wähle welche Zeilen auf dem Startbildschirm angezeigt werden",
+  "addedToFavorites": "Zu Favoriten hinzugefügt",
+  "removedFromFavorites": "Aus Favoriten entfernt",
+  "unknown": "Unbekannt",
+  "noUpcomingTracks": "Keine weiteren Songs",
+  "showAll": "Alle anzeigen",
+  "showFavoritesOnly": "Nur Favoriten anzeigen",
+  "changeView": "Ansicht ändern",
+  "authors": "Autoren",
+  "series": "Serien",
+  "shows": "Sendungen",
+  "podcasts": "Podcasts",
+  "podcastSupportComingSoon": "Podcast-Unterstützung kommt bald",
+  "playlist": "Wiedergabeliste",
+  "connectionError": "Verbindungsfehler",
+  "twoColumnGrid": "2-Spalten-Raster",
+  "threeColumnGrid": "3-Spalten-Raster",
+  "fromProviders": "Von Anbietern",
+
+  "resume": "Fortsetzen",
+  "about": "Über",
+  "inProgress": "In Bearbeitung",
+  "narratedBy": "Gesprochen von {narrators}",
+  "unknownNarrator": "Unbekannter Sprecher",
+  "unknownAuthor": "Unbekannter Autor",
+  "loadingChapters": "Lade Kapitel...",
+  "noChapterInfoAvailable": "Keine Kapitelinformationen verfügbar",
+  "percentComplete": "{percent}% abgeschlossen",
+  "theAudioDbApiKey": "TheAudioDB API-Schlüssel",
+  "theAudioDbApiKeyHint": "\"2\" für kostenlosen Zugang oder Premium-Schlüssel",
+  "audiobookLibraries": "Hörbuch-Bibliotheken",
+  "chooseAudiobookLibraries": "Wähle welche Audiobookshelf-Bibliotheken einbezogen werden",
+  "unknownLibrary": "Unbekannte Bibliothek",
+  "noSeriesFound": "Keine Serien gefunden",
+  "ensembleBugReport": "Ensemble Fehlerbericht",
+  "byOwner": "Von {owner}",
+  "noSeriesAvailable": "Keine Serien in deiner Hörbuch-Bibliothek verfügbar.\nZiehe zum Aktualisieren.",
+  "pullToLoadSeries": "Ziehe nach unten um Serien\nvon Music Assistant zu laden",
+
+  "search": "Suche",
+  "metadataApisDescription": "Künstlerbilder werden automatisch von Deezer abgerufen. Füge unten API-Schlüssel für Künstlerbiografien und Albenbeschreibungen hinzu.",
+  "lastFmApiKey": "Last.fm API-Schlüssel",
+  "lastFmApiKeyHint": "Kostenlosen Schlüssel auf last.fm/api holen",
+  "swipeToSwitchDevice": "Wischen um Gerät zu wechseln",
+  "chapterNumber": "Kapitel {number}",
+  "pcmAudio": "PCM-Audio",
+  "playOn": "Abspielen auf...",
+  "addAlbumToQueueOn": "Album zur Warteschlange hinzufügen auf...",
+  "addToQueueOn": "Zur Warteschlange hinzufügen auf...",
+  "startRadioOn": "{name} Radio starten auf...",
+  "book": "Buch",
+  "audiobookSingular": "Hörbuch",
+  "trackCount": "{count} {count, plural, =1{Song} other{Songs}}",
+  "materialYouDescription": "Systemfarben verwenden (Android 12+)",
+  "playerStateUnavailable": "Nicht verfügbar",
+  "playerStateOff": "Aus",
+  "playerStateIdle": "Inaktiv",
+  "playerSelected": "Ausgewählt"
+}
@@ -0,0 +1,472 @@
+{
+  "@@locale": "es",
+
+  "appTitle": "Ensemble",
+  "connecting": "Conectando...",
+  "connected": "Conectado",
+  "disconnected": "Desconectado",
+  "serverAddress": "Dirección del servidor",
+  "serverAddressHint": "ej., music.example.com o 192.168.1.100",
+  "yourName": "Tu nombre",
+  "yourFirstName": "Tu nombre de pila",
+  "portOptional": "Puerto (Opcional)",
+  "portHint": "ej., 8095 o dejar en blanco",
+  "portDescription": "Dejar en blanco para proxy inverso o puertos estándar. Introduce 8095 para conexión directa.",
+  "username": "Usuario",
+  "password": "Contraseña",
+  "detectAndConnect": "Detectar y conectar",
+  "connect": "Conectar",
+  "disconnect": "Desconectar",
+  "authServerUrlOptional": "URL del servidor de autenticación (Opcional)",
+  "authServerUrlHint": "ej., auth.example.com (si es diferente del servidor)",
+  "authServerUrlDescription": "Dejar vacío si la autenticación está en el mismo servidor",
+  "detectedAuthType": "Detectado: {authType}",
+  "@detectedAuthType": {
+    "placeholders": {
+      "authType": {
+        "type": "String"
+      }
+    }
+  },
+  "serverRequiresAuth": "Este servidor requiere autenticación",
+  "tailscaleVpnConnection": "Conexión VPN Tailscale",
+  "unencryptedConnection": "Conexión sin cifrar",
+  "usingHttpOverTailscale": "Usando HTTP sobre Tailscale (túnel cifrado)",
+  "httpsFailedUsingHttp": "HTTPS falló, usando HTTP como alternativa",
+  "httpNotEncrypted": "Conexión HTTP - los datos no están cifrados",
+  "pleaseEnterServerAddress": "Por favor, introduce la dirección de tu servidor Music Assistant",
+  "pleaseEnterName": "Por favor, introduce tu nombre",
+  "pleaseEnterValidPort": "Por favor, introduce un número de puerto válido (1-65535)",
+  "pleaseEnterCredentials": "Por favor, introduce usuario y contraseña",
+  "authFailed": "Autenticación fallida. Por favor, verifica tus credenciales.",
+  "maLoginFailed": "Inicio de sesión en Music Assistant fallido. Por favor, verifica tus credenciales.",
+  "connectionFailed": "No se pudo conectar al servidor. Por favor, verifica la dirección e inténtalo de nuevo.",
+  "detectingAuth": "Detectando autenticación...",
+  "cannotDetermineAuth": "No se pueden determinar los requisitos de autenticación. Por favor, verifica la URL del servidor.",
+  "noAuthentication": "Sin autenticación",
+  "httpBasicAuth": "Autenticación HTTP Basic",
+  "authelia": "Authelia",
+  "musicAssistantLogin": "Inicio de sesión de Music Assistant",
+  "pressBackToMinimize": "Presiona atrás de nuevo para minimizar",
+  "recentlyPlayed": "Reproducido recientemente",
+  "discoverArtists": "Descubrir artistas",
+  "discoverAlbums": "Descubrir álbumes",
+  "continueListening": "Continuar escuchando",
+  "discoverAudiobooks": "Descubrir audiolibros",
+  "discoverSeries": "Descubrir series",
+  "favoriteAlbums": "Álbumes favoritos",
+  "favoriteArtists": "Artistas favoritos",
+  "favoriteTracks": "Canciones favoritas",
+  "searchMusic": "Buscar música...",
+  "searchForContent": "Buscar artistas, álbumes o canciones",
+  "retry": "Reintentar",
+  "all": "Todo",
+  "artists": "Artistas",
+  "albums": "Álbumes",
+  "tracks": "Canciones",
+  "playlists": "Listas de reproducción",
+  "audiobooks": "Audiolibros",
+  "searchFailed": "Búsqueda fallida. Por favor, verifica tu conexión.",
+  "queue": "Cola",
+  "playerQueue": "Cola de {playerName}",
+  "@playerQueue": {
+    "placeholders": {
+      "playerName": {
+        "type": "String"
+      }
+    }
+  },
+  "noPlayerSelected": "Ningún reproductor seleccionado",
+  "undo": "Deshacer",
+  "removedItem": "Eliminado {itemName}",
+  "@removedItem": {
+    "placeholders": {
+      "itemName": {
+        "type": "String"
+      }
+    }
+  },
+  "settings": "Ajustes",
+  "debugLogs": "Registros de depuración",
+  "themeMode": "Modo de tema",
+  "light": "Claro",
+  "dark": "Oscuro",
+  "system": "Sistema",
+  "pullToRefresh": "Desliza hacia abajo para actualizar la biblioteca y aplicar los cambios",
+  "viewDebugLogs": "Ver registros de depuración",
+  "viewAllPlayers": "Ver todos los reproductores",
+  "copyLogs": "Copiar registros",
+  "clearLogs": "Borrar registros",
+  "copyList": "Copiar lista",
+  "close": "Cerrar",
+  "allPlayersCount": "Todos los reproductores ({count})",
+  "@allPlayersCount": {
+    "placeholders": {
+      "count": {
+        "type": "int"
+      }
+    }
+  },
+  "errorLoadingPlayers": "Error al cargar reproductores: {error}",
+  "@errorLoadingPlayers": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "logsCopied": "Registros copiados al portapapeles",
+  "logsCleared": "Registros borrados",
+  "playerListCopied": "Lista de reproductores copiada al portapapeles",
+  "noLogsYet": "Aún no hay registros",
+  "infoPlus": "Info+",
+  "warnings": "Advertencias",
+  "errors": "Errores",
+  "showingEntries": "Mostrando {filtered} de {total} entradas",
+  "@showingEntries": {
+    "placeholders": {
+      "filtered": {
+        "type": "int"
+      },
+      "total": {
+        "type": "int"
+      }
+    }
+  },
+  "thisDevice": "Este dispositivo",
+  "ghostPlayer": "Reproductor fantasma (duplicado)",
+  "unavailableCorrupt": "No disponible/Corrupto",
+  "playerId": "ID: {id}",
+  "@playerId": {
+    "placeholders": {
+      "id": {
+        "type": "String"
+      }
+    }
+  },
+  "playerInfo": "Disponible: {available} | Proveedor: {provider}",
+  "@playerInfo": {
+    "placeholders": {
+      "available": {
+        "type": "String"
+      },
+      "provider": {
+        "type": "String"
+      }
+    }
+  },
+  "shareBugReport": "Compartir informe de errores",
+  "moreOptions": "Más opciones",
+  "failedToUpdateFavorite": "Error al actualizar favorito: {error}",
+  "@failedToUpdateFavorite": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "noPlayersAvailable": "No hay reproductores disponibles",
+  "albumAddedToQueue": "Álbum añadido a la cola",
+  "tracksAddedToQueue": "Canciones añadidas a la cola",
+  "play": "Reproducir",
+  "noPlayersFound": "No se encontraron reproductores",
+  "startingRadio": "Iniciando radio de {name}",
+  "@startingRadio": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "failedToStartRadio": "Error al iniciar radio: {error}",
+  "@failedToStartRadio": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "startingRadioOnPlayer": "Iniciando radio de {name} en {playerName}",
+  "@startingRadioOnPlayer": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      },
+      "playerName": {
+        "type": "String"
+      }
+    }
+  },
+  "addedRadioToQueue": "Radio de {name} añadida a la cola",
+  "@addedRadioToQueue": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "failedToAddToQueue": "Error al añadir a la cola: {error}",
+  "@failedToAddToQueue": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "radio": "Radio",
+  "inLibrary": "En la biblioteca",
+  "noAlbumsFound": "No se encontraron álbumes",
+  "playing": "Reproduciendo {name}",
+  "@playing": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "playingTrack": "Reproduciendo canción",
+  "markedAsFinished": "{name} marcado como terminado",
+  "@markedAsFinished": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "failedToMarkFinished": "Error al marcar como terminado: {error}",
+  "@failedToMarkFinished": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "markedAsUnplayed": "{name} marcado como no reproducido",
+  "@markedAsUnplayed": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "failedToMarkUnplayed": "Error al marcar como no reproducido: {error}",
+  "@failedToMarkUnplayed": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "failedToPlay": "Error al reproducir: {error}",
+  "@failedToPlay": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "markAsFinished": "Marcar como terminado",
+  "markAsUnplayed": "Marcar como no reproducido",
+  "byAuthor": "Por {author}",
+  "@byAuthor": {
+    "placeholders": {
+      "author": {
+        "type": "String"
+      }
+    }
+  },
+  "audiobookCount": "{count} audiolibro(s)",
+  "@audiobookCount": {
+    "placeholders": {
+      "count": {
+        "type": "int"
+      }
+    }
+  },
+  "loading": "Cargando...",
+  "bookCount": "{count} libro(s)",
+  "@bookCount": {
+    "placeholders": {
+      "count": {
+        "type": "int"
+      }
+    }
+  },
+  "books": "Libros",
+  "noFavoriteAudiobooks": "No hay audiolibros favoritos",
+  "tapHeartAudiobook": "Toca el corazón en un audiolibro para añadirlo a favoritos",
+  "noAudiobooks": "No hay audiolibros",
+  "addAudiobooksHint": "Añade audiolibros a tu biblioteca para verlos aquí",
+  "noFavoriteArtists": "No hay artistas favoritos",
+  "tapHeartArtist": "Toca el corazón en un artista para añadirlo a favoritos",
+  "noFavoriteAlbums": "No hay álbumes favoritos",
+  "tapHeartAlbum": "Toca el corazón en un álbum para añadirlo a favoritos",
+  "noFavoritePlaylists": "No hay listas de reproducción favoritas",
+  "tapHeartPlaylist": "Toca el corazón en una lista para añadirla a favoritos",
+  "noFavoriteTracks": "No hay canciones favoritas",
+  "longPressTrackHint": "Mantén presionada una canción y toca el corazón para añadirla a favoritos",
+  "loadSeries": "Cargar series",
+  "notConnected": "No conectado a Music Assistant",
+  "notConnectedTitle": "No conectado",
+  "connectHint": "Conéctate a tu servidor Music Assistant para empezar a escuchar",
+  "configureServer": "Configurar servidor",
+  "noArtistsFound": "No se encontraron artistas",
+  "noTracksFound": "No se encontraron canciones",
+  "noPlaylistsFound": "No se encontraron listas de reproducción",
+  "queueIsEmpty": "La cola está vacía",
+  "noResultsFound": "No se encontraron resultados",
+  "refresh": "Actualizar",
+  "debugConsole": "Consola de depuración",
+  "copy": "Copiar",
+  "clear": "Borrar",
+  "noLogsToCopy": "No hay registros para copiar",
+  "noDebugLogsYet": "Aún no hay registros de depuración. Intenta detectar autenticación.",
+  "showDebug": "Mostrar depuración",
+  "hideDebug": "Ocultar depuración",
+  "chapters": "Capítulos",
+  "noChapters": "Sin capítulos",
+  "noChapterInfo": "Este audiolibro no tiene información de capítulos",
+  "errorSeeking": "Error al buscar: {error}",
+  "@errorSeeking": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "error": "Error: {error}",
+  "@error": {
+    "placeholders": {
+      "error": {
+        "type": "String"
+      }
+    }
+  },
+  "home": "Inicio",
+  "library": "Biblioteca",
+  "homeScreen": "Pantalla de inicio",
+  "metadataApis": "APIs de metadatos",
+  "theme": "Tema",
+  "materialYou": "Material You",
+  "adaptiveTheme": "Tema adaptativo",
+  "language": "Idioma",
+  "english": "Inglés",
+  "german": "Alemán",
+  "spanish": "Español",
+  "noTracksInPlaylist": "No hay canciones en la lista",
+  "sortAlphabetically": "Ordenar alfabéticamente",
+  "sortByYear": "Ordenar por año",
+  "sortBySeriesOrder": "Ordenar por orden de serie",
+  "listView": "Vista de lista",
+  "gridView": "Vista de cuadrícula",
+  "noBooksInSeries": "No se encontraron libros en esta serie",
+  "artist": "Artista",
+  "showRecentlyPlayedAlbums": "Mostrar álbumes reproducidos recientemente",
+  "showRandomArtists": "Mostrar artistas aleatorios para descubrir",
+  "showRandomAlbums": "Mostrar álbumes aleatorios para descubrir",
+  "showAudiobooksInProgress": "Mostrar audiolibros en progreso",
+  "showRandomAudiobooks": "Mostrar audiolibros aleatorios para descubrir",
+  "showRandomSeries": "Mostrar series de audiolibros aleatorias para descubrir",
+  "showFavoriteAlbums": "Mostrar una fila de tus álbumes favoritos",
+  "showFavoriteArtists": "Mostrar una fila de tus artistas favoritos",
+  "showFavoriteTracks": "Mostrar una fila de tus canciones favoritas",
+  "extractColorsFromArtwork": "Extraer colores de las portadas de álbumes y artistas",
+  "chooseHomeScreenRows": "Elige qué filas mostrar en la pantalla de inicio",
+  "addedToFavorites": "Añadido a favoritos",
+  "removedFromFavorites": "Eliminado de favoritos",
+  "unknown": "Desconocido",
+  "noUpcomingTracks": "No hay canciones próximas",
+  "showAll": "Mostrar todo",
+  "showFavoritesOnly": "Mostrar solo favoritos",
+  "changeView": "Cambiar vista",
+  "authors": "Autores",
+  "series": "Series",
+  "shows": "Programas",
+  "podcasts": "Podcasts",
+  "podcastSupportComingSoon": "Soporte de podcasts próximamente",
+  "playlist": "Lista de reproducción",
+  "connectionError": "Error de conexión",
+  "twoColumnGrid": "Cuadrícula de 2 columnas",
+  "threeColumnGrid": "Cuadrícula de 3 columnas",
+  "fromProviders": "De proveedores",
+  "resume": "Continuar",
+  "about": "Acerca de",
+  "inProgress": "En progreso",
+  "narratedBy": "Narrado por {narrators}",
+  "@narratedBy": {
+    "placeholders": {
+      "narrators": {
+        "type": "String"
+      }
+    }
+  },
+  "unknownNarrator": "Narrador desconocido",
+  "unknownAuthor": "Autor desconocido",
+  "loadingChapters": "Cargando capítulos...",
+  "noChapterInfoAvailable": "No hay información de capítulos disponible",
+  "percentComplete": "{percent}% completado",
+  "@percentComplete": {
+    "placeholders": {
+      "percent": {
+        "type": "int"
+      }
+    }
+  },
+  "theAudioDbApiKey": "Clave API de TheAudioDB",
+  "theAudioDbApiKeyHint": "Usa \"2\" para nivel gratuito o clave premium",
+  "audiobookLibraries": "Bibliotecas de audiolibros",
+  "chooseAudiobookLibraries": "Elige qué bibliotecas de Audiobookshelf incluir",
+  "unknownLibrary": "Biblioteca desconocida",
+  "noSeriesFound": "No se encontraron series",
+  "ensembleBugReport": "Informe de errores de Ensemble",
+  "byOwner": "Por {owner}",
+  "@byOwner": {
+    "placeholders": {
+      "owner": {
+        "type": "String"
+      }
+    }
+  },
+  "noSeriesAvailable": "No hay series disponibles en tu biblioteca de audiolibros.\nDesliza para actualizar.",
+  "pullToLoadSeries": "Desliza hacia abajo para cargar series\ndesde Music Assistant",
+  "search": "Buscar",
+  "metadataApisDescription": "Las imágenes de artistas se obtienen automáticamente de Deezer. Añade claves API a continuación para biografías de artistas y descripciones de álbumes.",
+  "lastFmApiKey": "Clave API de Last.fm",
+  "lastFmApiKeyHint": "Obtén una clave gratuita en last.fm/api",
+  "swipeToSwitchDevice": "Desliza para cambiar de dispositivo",
+  "chapterNumber": "Capítulo {number}",
+  "@chapterNumber": {
+    "placeholders": {
+      "number": {
+        "type": "int"
+      }
+    }
+  },
+  "pcmAudio": "Audio PCM",
+  "playOn": "Reproducir en...",
+  "addAlbumToQueueOn": "Añadir álbum a la cola en...",
+  "addToQueueOn": "Añadir a la cola en...",
+  "startRadioOn": "Iniciar radio de {name} en...",
+  "@startRadioOn": {
+    "placeholders": {
+      "name": {
+        "type": "String"
+      }
+    }
+  },
+  "book": "libro",
+  "audiobookSingular": "audiolibro",
+  "trackCount": "{count} {count, plural, =1{canción} other{canciones}}",
+  "@trackCount": {
+    "placeholders": {
+      "count": {
+        "type": "int"
+      }
+    }
+  },
+  "materialYouDescription": "Usar colores del sistema (Android 12+)",
+  "playerStateUnavailable": "No disponible",
+  "playerStateOff": "Apagado",
+  "playerStateIdle": "Inactivo",
+  "playerSelected": "Seleccionado"
+}
@@ -3,6 +3,9 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:provider/provider.dart';
 import 'package:audio_service/audio_service.dart';
+import 'package:flutter_localizations/flutter_localizations.dart';
+import 'l10n/app_localizations.dart';
+import 'providers/locale_provider.dart';
 import 'providers/music_assistant_provider.dart';
 import 'providers/navigation_provider.dart';
 import 'screens/home_screen.dart';
@@ -87,6 +90,7 @@ class MusicAssistantApp extends StatefulWidget {
 class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindingObserver {
  late MusicAssistantProvider _musicProvider;
  late ThemeProvider _themeProvider;
+  late LocaleProvider _localeProvider;
  final _hardwareVolumeService = HardwareVolumeService();
  StreamSubscription? _volumeUpSub;
  StreamSubscription? _volumeDownSub;
@@ -101,6 +105,7 @@ class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindi
    super.initState();
    _musicProvider = MusicAssistantProvider();
    _themeProvider = ThemeProvider();
+    _localeProvider = LocaleProvider();
    WidgetsBinding.instance.addObserver(this);
    _initHardwareVolumeControl();
    // Listen to player selection changes to toggle volume interception
@@ -197,9 +202,10 @@ class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindi
      providers: [
        ChangeNotifierProvider.value(value: _musicProvider),
        ChangeNotifierProvider.value(value: _themeProvider),
+        ChangeNotifierProvider.value(value: _localeProvider),
      ],
-      child: Consumer<ThemeProvider>(
-        builder: (context, themeProvider, _) {
+      child: Consumer2<ThemeProvider, LocaleProvider>(
+        builder: (context, themeProvider, localeProvider, _) {
          return FutureBuilder<(ColorScheme, ColorScheme)?>(
            future: themeProvider.useMaterialTheme
                ? SystemThemeHelper.getSystemColorSchemes()
@@ -228,6 +234,15 @@ class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindi
                  navigatorKey: navigationProvider.navigatorKey,
                  title: 'Ensemble',
                  debugShowCheckedModeBanner: false,
+                  // Localization
+                  localizationsDelegates: const [
+                    S.delegate,
+                    GlobalMaterialLocalizations.delegate,
+                    GlobalWidgetsLocalizations.delegate,
+                    GlobalCupertinoLocalizations.delegate,
+                  ],
+                  supportedLocales: S.supportedLocales,
+                  locale: localeProvider.locale,
                  themeMode: themeProvider.themeMode,
                  theme: AppTheme.lightTheme(colorScheme: lightColorScheme),
                  darkTheme: AppTheme.darkTheme(colorScheme: darkColorScheme),
@@ -0,0 +1,40 @@
+import 'package:flutter/material.dart';
+import '../services/settings_service.dart';
+
+class LocaleProvider extends ChangeNotifier {
+  Locale? _locale; // null = system default
+
+  LocaleProvider() {
+    _loadLocale();
+  }
+
+  Locale? get locale => _locale;
+
+  Future<void> _loadLocale() async {
+    final savedLocale = await SettingsService.getLocale();
+    if (savedLocale != null) {
+      _locale = Locale(savedLocale);
+    }
+    notifyListeners();
+  }
+
+  Future<void> setLocale(Locale? locale) async {
+    _locale = locale;
+    await SettingsService.saveLocale(locale?.languageCode);
+    notifyListeners();
+  }
+
+  /// Returns the display name for a locale
+  static String getDisplayName(String? languageCode, BuildContext context) {
+    switch (languageCode) {
+      case 'en':
+        return 'English';
+      case 'de':
+        return 'Deutsch';
+      case null:
+        return 'System';
+      default:
+        return languageCode;
+    }
+  }
+}
@@ -109,10 +109,28 @@ class MusicAssistantProvider with ChangeNotifier {
  /// Current sync status
  SyncStatus get syncStatus => SyncService.instance.status;

-  Player? get selectedPlayer => _selectedPlayer;
-  List<Player> get availablePlayers => _availablePlayers;
+  /// Selected player - loads from cache if not yet set
+  Player? get selectedPlayer {
+    if (_selectedPlayer == null && _cacheService.getCachedSelectedPlayer() != null) {
+      _selectedPlayer = _cacheService.getCachedSelectedPlayer();
+    }
+    return _selectedPlayer;
+  }
+
+  /// Available players - loads from cache for instant UI display
+  List<Player> get availablePlayers {
+    if (_availablePlayers.isEmpty && _cacheService.hasCachedPlayers) {
+      _availablePlayers = _cacheService.getCachedPlayers()!;
+      _logger.log('⚡ Loaded ${_availablePlayers.length} players from cache (lazy)');
+    }
+    return _availablePlayers;
+  }
+
  Track? get currentTrack => _currentTrack;

+  /// Whether we have cached players available (for instant UI display on app resume)
+  bool get hasCachedPlayers => _cacheService.hasCachedPlayers;
+
  /// Currently playing audiobook context (with chapters) - set when playing an audiobook
  Audiobook? get currentAudiobook => _currentAudiobook;

@@ -402,6 +420,30 @@ class MusicAssistantProvider with ChangeNotifier {
      return;
    }

+    // IMMEDIATELY load cached players for instant UI display
+    // This makes mini player and device button appear instantly on app resume
+    if (_availablePlayers.isEmpty && _cacheService.hasCachedPlayers) {
+      _availablePlayers = _cacheService.getCachedPlayers()!;
+      _selectedPlayer = _cacheService.getCachedSelectedPlayer();
+      // Also try to restore from settings if cache doesn't have selected player
+      if (_selectedPlayer == null && _availablePlayers.isNotEmpty) {
+        final lastSelectedPlayerId = await SettingsService.getLastSelectedPlayerId();
+        if (lastSelectedPlayerId != null) {
+          try {
+            _selectedPlayer = _availablePlayers.firstWhere(
+              (p) => p.playerId == lastSelectedPlayerId,
+            );
+          } catch (e) {
+            _selectedPlayer = _availablePlayers.first;
+          }
+        } else {
+          _selectedPlayer = _availablePlayers.first;
+        }
+      }
+      _logger.log('⚡ Loaded ${_availablePlayers.length} cached players instantly');
+      notifyListeners(); // Update UI immediately with cached data
+    }
+
    if (_connectionState != MAConnectionState.connected &&
        _connectionState != MAConnectionState.authenticated) {
      _logger.log('🔄 Not connected, attempting reconnect to $_serverUrl');
@@ -416,6 +458,7 @@ class MusicAssistantProvider with ChangeNotifier {
      try {
        await refreshPlayers();
        await _updatePlayerState();
+        // Note: _preloadAdjacentPlayers is already called in refreshPlayers() -> _loadAndSelectPlayers()
        _logger.log('🔄 Connection verified, players and state refreshed');
      } catch (e) {
        _logger.log('🔄 Connection verification failed, reconnecting: $e');
@@ -486,6 +529,76 @@ class MusicAssistantProvider with ChangeNotifier {
    }
  }

+  /// Parse server version into components for version comparisons
+  /// Returns null if version cannot be parsed
+  ({int major, int minor, int patch, int? beta})? _parseServerVersion() {
+    final serverInfo = _api?.serverInfo;
+    if (serverInfo == null) return null;
+
+    final versionStr = serverInfo['server_version'] as String?;
+    if (versionStr == null) return null;
+
+    // Parse version like "2.8.0b2" or "2.7.0b20" or "2.7.1"
+    // Format: MAJOR.MINOR.PATCH[bBETA]
+    final versionRegex = RegExp(r'^(\d+)\.(\d+)\.(\d+)(?:b(\d+))?');
+    final match = versionRegex.firstMatch(versionStr);
+    if (match == null) return null;
+
+    return (
+      major: int.parse(match.group(1)!),
+      minor: int.parse(match.group(2)!),
+      patch: int.parse(match.group(3)!),
+      beta: match.group(4) != null ? int.parse(match.group(4)!) : null,
+    );
+  }
+
+  /// Check if server version is >= 2.7.0b20 (uses Sendspin instead of builtin_player)
+  bool _serverUsesSendspin() {
+    final version = _parseServerVersion();
+    if (version == null) return false;
+
+    final (:major, :minor, :patch, :beta) = version;
+
+    // Compare with 2.7.0b20
+    if (major > 2) return true;
+    if (major < 2) return false;
+    // major == 2
+    if (minor > 7) return true;
+    if (minor < 7) return false;
+    // minor == 7
+    if (patch > 0) return true;
+    if (patch < 0) return false;
+    // patch == 0, so version is 2.7.0 - need beta >= 20
+    if (beta == null) return true; // 2.7.0 release is newer than 2.7.0b20
+    return beta >= 20;
+  }
+
+  /// Check if server version is >= 2.8.0 (has built-in /sendspin proxy endpoint)
+  /// The /sendspin proxy was added in MA 2.8.0 (PR #2840)
+  /// MA 2.7.x does NOT have this proxy - users must expose port 8927 directly
+  /// or manually configure reverse proxy routing to port 8927
+  bool _serverHasSendspinProxy() {
+    final version = _parseServerVersion();
+    if (version == null) return false;
+
+    final (:major, :minor, :patch, :beta) = version;
+
+    // Compare with 2.8.0
+    if (major > 2) return true;
+    if (major < 2) return false;
+    // major == 2
+    if (minor > 8) return true;
+    if (minor < 8) return false;
+    // minor == 8, any 2.8.x version has the proxy
+    return true;
+  }
+
+  /// Get the server version string for logging
+  String _getServerVersionString() {
+    final serverInfo = _api?.serverInfo;
+    return serverInfo?['server_version'] as String? ?? 'unknown';
+  }
+
  Future<void> _registerLocalPlayer() async {
    if (_api == null) return;

@@ -504,6 +617,26 @@ class MusicAssistantProvider with ChangeNotifier {

      final name = await SettingsService.getLocalPlayerName();

+      // Check if server uses Sendspin (MA 2.7.0b20+) - skip builtin_player entirely
+      if (_serverUsesSendspin()) {
+        _logger.log('📡 Server uses Sendspin (MA 2.7.0b20+), skipping builtin_player');
+        _builtinPlayerAvailable = false;
+
+        final sendspinSuccess = await _connectViaSendspin();
+        if (sendspinSuccess) {
+          _logger.log('✅ Connected via Sendspin - local player available');
+          _startReportingLocalPlayerState();
+        } else {
+          _logger.log('⚠️ Sendspin connection failed - local player unavailable');
+        }
+
+        if (_registrationInProgress != null && !_registrationInProgress!.isCompleted) {
+          _registrationInProgress!.complete();
+        }
+        _registrationInProgress = null;
+        return;
+      }
+
      final existingPlayers = await _api!.getPlayers();
      final existingPlayer = existingPlayers.where((p) => p.playerId == playerId).firstOrNull;

@@ -569,18 +702,30 @@ class MusicAssistantProvider with ChangeNotifier {
  /// Connect to Music Assistant via Sendspin protocol (MA 2.7.0b20+)
  /// This is the replacement for builtin_player when that API is not available.
  ///
-  /// Connection strategy:
-  /// 1. If server is HTTPS, try external wss://{server}/sendspin first
-  /// 2. Get local_ws_url from API and try that
-  /// 3. WebRTC fallback as last resort (requires TURN servers)
+  /// Connection strategy depends on MA version and network:
+  /// - MA 2.8.0+: Has built-in /sendspin proxy, works with any reverse proxy setup
+  /// - MA 2.7.x: NO proxy, must either:
+  ///   - Use local IP with port 8927 exposed, OR
+  ///   - Manually configure reverse proxy to route /sendspin to port 8927
  Future<bool> _connectViaSendspin() async {
    if (_api == null || _serverUrl == null) return false;

    try {
+      final serverVersion = _getServerVersionString();
+      final hasProxy = _serverHasSendspinProxy();
+      _logger.log('Sendspin: Server version $serverVersion, has proxy: $hasProxy');
+
      // Initialize Sendspin service
      _sendspinService?.dispose();
      _sendspinService = SendspinService(_serverUrl!);

+      // Set auth token for proxy authentication (MA 2.8.0+ or manually configured proxy)
+      final authToken = await SettingsService.getMaAuthToken();
+      if (authToken != null) {
+        _sendspinService!.setAuthToken(authToken);
+        _logger.log('Sendspin: Auth token set for proxy authentication');
+      }
+
      // Initialize PCM audio player for raw audio streaming
      _pcmAudioPlayer?.dispose();
      _pcmAudioPlayer = PcmAudioPlayer();
@@ -603,42 +748,59 @@ class MusicAssistantProvider with ChangeNotifier {
      _sendspinService!.onStreamEnd = _handleSendspinStreamEnd;

      final playerId = await DeviceIdService.getOrCreateDevicePlayerId();
+      _logger.log('Sendspin: Player ID: $playerId');

-      // Strategy 1: If server is HTTPS, try external wss:// first
-      final isHttps = _serverUrl!.startsWith('https://') ||
-                      (!_serverUrl!.contains('://') && !_serverUrl!.contains(':'));
+      // Parse server URL to determine connection strategy
+      final serverUri = Uri.parse(_serverUrl!.startsWith('http')
+          ? _serverUrl!
+          : 'https://$_serverUrl');
+      final isLocalIp = _isLocalNetworkHost(serverUri.host);
+      final isHttps = serverUri.scheme == 'https' ||
+                      (!_serverUrl!.contains('://') && !isLocalIp);
+
+      // Strategy 1: For local IPs, connect directly to Sendspin port 8927
+      if (isLocalIp) {
+        final localSendspinUrl = 'ws://${serverUri.host}:8927/sendspin';
+        _logger.log('Sendspin: Local network detected, trying direct connection: $localSendspinUrl');
+        final connected = await _sendspinService!.connectWithUrl(localSendspinUrl);
+        if (connected) {
+          _sendspinConnected = true;
+          _logger.log('✅ Sendspin: Connected via local network (port 8927)');
+          return true;
+        }
+        _logger.log('⚠️ Sendspin: Local connection to port 8927 failed');
+
+        // For local IPs, also try the proxy path in case user has a local reverse proxy
+        _logger.log('Sendspin: Trying local proxy fallback...');
+        final localProxyUrl = 'ws://${serverUri.host}:${serverUri.hasPort ? serverUri.port : 8095}/sendspin';
+        final proxyConnected = await _sendspinService!.connectWithUrl(localProxyUrl);
+        if (proxyConnected) {
+          _sendspinConnected = true;
+          _logger.log('✅ Sendspin: Connected via local proxy');
+          return true;
+        }
+      }
+
+      // Strategy 2: For external/HTTPS servers, use the proxy at /sendspin
+      if (isHttps || !isLocalIp) {
+        if (hasProxy) {
+          _logger.log('Sendspin: MA 2.8.0+ detected, using built-in /sendspin proxy');
+        } else {
+          _logger.log('Sendspin: MA 2.7.x detected, trying /sendspin (requires manual proxy config)');
+        }

-      if (isHttps) {
-        _logger.log('Sendspin: Server is HTTPS, trying external connection first');
        final connected = await _sendspinService!.connect();
        if (connected) {
          _sendspinConnected = true;
-          _logger.log('✅ Sendspin: Connected via external URL');
+          _logger.log('✅ Sendspin: Connected via external proxy');
          return true;
        }
-        _logger.log('⚠️ Sendspin: External connection failed, trying local URL');
+        _logger.log('⚠️ Sendspin: External proxy connection failed');
      }

-      // Strategy 2: Get local_ws_url from API and try that
-      final connectionInfo = await _api!.getSendspinConnectionInfo(playerId);
-      if (connectionInfo != null) {
-        final localWsUrl = connectionInfo['local_ws_url'] as String?;
-        if (localWsUrl != null) {
-          _logger.log('Sendspin: Trying local WebSocket URL: $localWsUrl');
-          final connected = await _sendspinService!.connectWithUrl(localWsUrl);
-          if (connected) {
-            _sendspinConnected = true;
-            _logger.log('✅ Sendspin: Connected via local URL');
-            return true;
-          }
-        }
-      }
-
-      // Strategy 3: WebRTC fallback (requires TURN servers from Nabucasa)
-      // For now, just log that we'd need WebRTC - implementing full WebRTC
-      // would require additional dependencies (flutter_webrtc)
-      _logger.log('⚠️ Sendspin: WebRTC fallback not yet implemented');
-      _logger.log('ℹ️ For external access, configure /sendspin route in your reverse proxy');
+      // All strategies failed - provide version-specific guidance
+      _logger.log('❌ Sendspin: All connection strategies failed');
+      _logSendspinTroubleshooting(isLocalIp, hasProxy, serverVersion);

      return false;
    } catch (e) {
@@ -647,6 +809,29 @@ class MusicAssistantProvider with ChangeNotifier {
    }
  }

+  /// Log troubleshooting guidance based on setup
+  void _logSendspinTroubleshooting(bool isLocalIp, bool hasProxy, String serverVersion) {
+    if (isLocalIp) {
+      _logger.log('ℹ️ LOCAL IP SETUP: Add port 8927 to your Docker compose:');
+      _logger.log('   ports:');
+      _logger.log('     - "8095:8095"');
+      _logger.log('     - "8927:8927"  # Required for Sendspin');
+    } else if (!hasProxy) {
+      // MA 2.7.x without built-in proxy
+      _logger.log('ℹ️ MA $serverVersion does not have built-in /sendspin proxy');
+      _logger.log('ℹ️ OPTIONS:');
+      _logger.log('   1. Upgrade to Music Assistant 2.8.0+ (recommended)');
+      _logger.log('   2. Or add reverse proxy config for /sendspin → port 8927');
+      _logger.log('   Traefik: PathPrefix(`/sendspin`) → service port 8927');
+      _logger.log('   Nginx: location /sendspin { proxy_pass http://ma:8927; }');
+    } else {
+      // MA 2.8.0+ but still failing
+      _logger.log('ℹ️ MA $serverVersion should have /sendspin proxy');
+      _logger.log('ℹ️ Check that your reverse proxy forwards WebSocket connections');
+      _logger.log('   Ensure Upgrade and Connection headers are passed through');
+    }
+  }
+
  /// Handle Sendspin play command
  void _handleSendspinPlay(String streamUrl, Map<String, dynamic> trackInfo) async {
    _logger.log('🎵 Sendspin: Play command received');
@@ -1044,6 +1229,13 @@ class MusicAssistantProvider with ChangeNotifier {

      if (currentMedia != null) {
        final mediaType = currentMedia['media_type'] as String?;
+
+        // Clear audiobook context when switching to music (track) playback
+        if (mediaType == 'track' && _currentAudiobook != null) {
+          _logger.log('📚 Media type changed to track - clearing audiobook context');
+          clearCurrentAudiobook();
+        }
+
        if (mediaType != 'flow_stream') {
          final durationSecs = (currentMedia['duration'] as num?)?.toInt();
          final albumName = currentMedia['album'] as String?;
@@ -1075,23 +1267,53 @@ class MusicAssistantProvider with ChangeNotifier {
            };
          }

+          // Parse artist from title if artist is missing but title contains " - "
+          var trackTitle = currentMedia['title'] as String? ?? 'Unknown Track';
+          var artistName = currentMedia['artist'] as String?;
+
+          if ((artistName == null || artistName == 'Unknown Artist') && trackTitle.contains(' - ')) {
+            final parts = trackTitle.split(' - ');
+            if (parts.length >= 2) {
+              artistName = parts[0].trim();
+              trackTitle = parts.sublist(1).join(' - ').trim();
+            }
+          }
+          artistName ??= 'Unknown Artist';
+
          final trackFromEvent = Track(
            itemId: currentMedia['queue_item_id'] as String? ?? '',
            provider: 'library',
-            name: currentMedia['title'] as String? ?? 'Unknown Track',
+            name: trackTitle,
            uri: currentMedia['uri'] as String?,
            duration: durationSecs != null ? Duration(seconds: durationSecs) : null,
-            artists: [Artist(itemId: '', provider: 'library', name: currentMedia['artist'] as String? ?? 'Unknown Artist')],
+            artists: [Artist(itemId: '', provider: 'library', name: artistName)],
            album: albumName != null ? Album(itemId: '', provider: 'library', name: albumName) : null,
            metadata: metadata,
          );
-          _cacheService.setCachedTrackForPlayer(playerId, trackFromEvent);

-          if (_selectedPlayer != null && playerId == _selectedPlayer!.playerId) {
-            _currentTrack = trackFromEvent;
+          // Only cache if we don't already have better data from queue
+          final existingTrack = _cacheService.getCachedTrackForPlayer(playerId);
+          final existingHasProperArtist = existingTrack != null &&
+              existingTrack.artistsString != 'Unknown Artist' &&
+              !existingTrack.name.contains(' - ');
+          final existingHasImage = existingTrack?.metadata?['images'] != null;
+          final newHasImage = metadata != null;
+
+          // Keep existing if it has proper artist OR has image that new one lacks
+          final keepExisting = existingHasProperArtist || (existingHasImage && !newHasImage);
+
+          if (!keepExisting) {
+            _cacheService.setCachedTrackForPlayer(playerId, trackFromEvent);
+            _logger.log('📋 Cached track for $playerName from player_updated: ${trackFromEvent.name}');
+          } else {
+            _logger.log('📋 Skipped caching for $playerName - already have better data (artist: $existingHasProperArtist, image: $existingHasImage)');
          }

-          _logger.log('📋 Cached track for $playerName from player_updated: ${trackFromEvent.name}');
+          // For selected player, _updatePlayerState() is already called above which fetches queue data
+          // Only update _currentTrack here if we don't have it yet (initial load)
+          if (_selectedPlayer != null && playerId == _selectedPlayer!.playerId && _currentTrack == null) {
+            _currentTrack = trackFromEvent;
+          }

          notifyListeners();
        }
@@ -1566,7 +1788,8 @@ class MusicAssistantProvider with ChangeNotifier {

      _availablePlayers.sort((a, b) => a.name.toLowerCase().compareTo(b.name.toLowerCase()));

-      _cacheService.updatePlayersLastFetched();
+      // Cache players for instant display on app resume
+      _cacheService.setCachedPlayers(_availablePlayers);

      _logger.log('🎛️ After filtering: ${_availablePlayers.length} players available');

@@ -1624,8 +1847,9 @@ class MusicAssistantProvider with ChangeNotifier {
        selectPlayer(playerToSelect);
      }

-      // Await preload so track data and images are ready for swipe gestures
-      await _preloadAdjacentPlayers(preloadAll: true);
+      // Preload track data and images in background for swipe gestures
+      // Don't await - UI should show immediately with cached data
+      unawaited(_preloadAdjacentPlayers(preloadAll: true));
    } catch (e) {
      ErrorHandler.logError('Load and select players', e);
    }
@@ -1634,6 +1858,8 @@ class MusicAssistantProvider with ChangeNotifier {
  void selectPlayer(Player player, {bool skipNotify = false}) async {
    _selectedPlayer = player;

+    // Cache for instant display on app resume
+    _cacheService.setCachedSelectedPlayer(player);
    SettingsService.setLastSelectedPlayerId(player.playerId);

    // Immediately set currentTrack from cache to avoid flash during player switch
@@ -1742,6 +1968,11 @@ class MusicAssistantProvider with ChangeNotifier {

    _preloadAdjacentPlayers();

+    // Immediately fetch fresh track data from queue to avoid showing stale cache
+    // This is important when resuming app after being in background - cached data
+    // from player_updated events may have incomplete artist info
+    await _updatePlayerState();
+
    if (!skipNotify) {
      notifyListeners();
    }
@@ -2823,4 +3054,25 @@ class MusicAssistantProvider with ChangeNotifier {
    _api?.dispose();
    super.dispose();
  }
+
+  // ============================================================================
+  // UTILITY METHODS
+  // ============================================================================
+
+  /// Check if a hostname is a local/private network address
+  bool _isLocalNetworkHost(String host) {
+    return host.startsWith('192.168.') ||
+        host.startsWith('10.') ||
+        host.startsWith('172.16.') ||
+        host.startsWith('172.17.') ||
+        host.startsWith('172.18.') ||
+        host.startsWith('172.19.') ||
+        host.startsWith('172.2') ||
+        host.startsWith('172.30.') ||
+        host.startsWith('172.31.') ||
+        host == 'localhost' ||
+        host.startsWith('127.') ||
+        host.endsWith('.local') ||
+        host.endsWith('.ts.net'); // Tailscale - treat as local since it's a VPN
+  }
 }
@@ -1,5 +1,6 @@
 import 'dart:async';
 import 'package:flutter/foundation.dart';
+import 'package:flutter/painting.dart';
 import '../models/media_item.dart';
 import '../models/player.dart';
 import '../services/music_assistant_api.dart';
@@ -10,6 +10,7 @@ import '../services/metadata_service.dart';
 import '../services/debug_logger.dart';
 import '../services/recently_played_service.dart';
 import '../widgets/global_player_overlay.dart';
+import '../l10n/app_localizations.dart';
 import 'artist_details_screen.dart';

 class AlbumDetailsScreen extends StatefulWidget {
@@ -17,7 +18,7 @@ class AlbumDetailsScreen extends StatefulWidget {
  final String? heroTagSuffix;

  const AlbumDetailsScreen({
-    super.key, 
+    super.key,
    required this.album,
    this.heroTagSuffix,
  });
@@ -36,7 +37,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
  int? _expandedTrackIndex;
  bool _isDescriptionExpanded = false;
  String? _albumDescription;
-  
+
  String get _heroTagSuffix => widget.heroTagSuffix != null ? '_${widget.heroTagSuffix}' : '';

  @override
@@ -171,7 +172,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Text(
-              _isFavorite ? 'Added to favorites' : 'Removed from favorites',
+              _isFavorite ? S.of(context)!.addedToFavorites : S.of(context)!.removedFromFavorites,
            ),
            duration: const Duration(seconds: 1),
          ),
@@ -182,7 +183,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to update favorite: $e'),
+            content: Text(S.of(context)!.failedToUpdateFavorite(e.toString())),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -257,7 +258,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Text(
-              !currentFavorite ? 'Added to favorites' : 'Removed from favorites',
+              !currentFavorite ? S.of(context)!.addedToFavorites : S.of(context)!.removedFromFavorites,
            ),
            duration: const Duration(seconds: 1),
          ),
@@ -268,7 +269,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to update favorite: $e'),
+            content: Text(S.of(context)!.failedToUpdateFavorite(e.toString())),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -300,7 +301,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
      // Use the selected player
      final player = maProvider.selectedPlayer;
      if (player == null) {
-        _showError('No player selected');
+        _showError(S.of(context)!.noPlayerSelected);
        return;
      }

@@ -326,7 +327,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
      // Use the selected player
      final player = maProvider.selectedPlayer;
      if (player == null) {
-        _showError('No player selected');
+        _showError(S.of(context)!.noPlayerSelected);
        return;
      }

@@ -362,14 +363,14 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
          children: [
            const SizedBox(height: 16),
            Text(
-              'Add album to queue on...',
+              S.of(context)!.addAlbumToQueueOn,
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            if (players.isEmpty)
-              const Padding(
-                padding: EdgeInsets.all(32.0),
-                child: Text('No players available'),
+              Padding(
+                padding: const EdgeInsets.all(32.0),
+                child: Text(S.of(context)!.noPlayersAvailable),
              )
            else
              Flexible(
@@ -397,9 +398,9 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
                          _logger.log('Album added to queue on ${player.name}');
                          if (mounted) {
                            ScaffoldMessenger.of(context).showSnackBar(
-                              const SnackBar(
-                                content: Text('Album added to queue'),
-                                duration: Duration(seconds: 1),
+                              SnackBar(
+                                content: Text(S.of(context)!.albumAddedToQueue),
+                                duration: const Duration(seconds: 1),
                              ),
                            );
                          }
@@ -442,14 +443,14 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
          children: [
            const SizedBox(height: 16),
            Text(
-              'Add to queue on...',
+              S.of(context)!.addToQueueOn,
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            if (players.isEmpty)
-              const Padding(
-                padding: EdgeInsets.all(32.0),
-                child: Text('No players available'),
+              Padding(
+                padding: const EdgeInsets.all(32.0),
+                child: Text(S.of(context)!.noPlayersAvailable),
              )
            else
              Flexible(
@@ -476,9 +477,9 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
                          );
                          if (mounted) {
                            ScaffoldMessenger.of(context).showSnackBar(
-                              const SnackBar(
-                                content: Text('Tracks added to queue'),
-                                duration: Duration(seconds: 1),
+                              SnackBar(
+                                content: Text(S.of(context)!.tracksAddedToQueue),
+                                duration: const Duration(seconds: 1),
                              ),
                            );
                          }
@@ -763,7 +764,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
                          child: ElevatedButton.icon(
                            onPressed: _isLoading || _tracks.isEmpty ? null : _playAlbum,
                            icon: const Icon(Icons.play_arrow_rounded),
-                            label: const Text('Play'),
+                            label: Text(S.of(context)!.play),
                            style: ElevatedButton.styleFrom(
                              backgroundColor: colorScheme.primary,
                              foregroundColor: colorScheme.onPrimary,
@@ -837,7 +838,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
                  ),
                  const SizedBox(height: 24),
                  Text(
-                    'Tracks',
+                    S.of(context)!.tracks,
                    style: textTheme.titleLarge?.copyWith(
                      color: colorScheme.onBackground,
                      fontWeight: FontWeight.bold,
@@ -858,7 +859,7 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
            SliverFillRemaining(
              child: Center(
                child: Text(
-                  'No tracks found',
+                  S.of(context)!.noTracksFound,
                  style: TextStyle(
                    color: colorScheme.onBackground.withOpacity(0.54),
                    fontSize: 16,
@@ -1089,14 +1090,14 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
          children: [
            const SizedBox(height: 16),
            Text(
-              'Play on...',
+              S.of(context)!.playOn,
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            Expanded(
              child: players.isEmpty
-                  ? const Center(
-                      child: Text('No players available'),
+                  ? Center(
+                      child: Text(S.of(context)!.noPlayersAvailable),
                    )
                  : ListView.builder(
                      padding: EdgeInsets.only(bottom: bottomPadding + 16),
@@ -12,6 +12,7 @@ import '../services/metadata_service.dart';
 import '../services/settings_service.dart';
 import '../services/debug_logger.dart';
 import '../utils/page_transitions.dart';
+import '../l10n/app_localizations.dart';

 class ArtistDetailsScreen extends StatefulWidget {
  final Artist artist;
@@ -211,7 +212,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Text(
-              _isFavorite ? 'Added to favorites' : 'Removed from favorites',
+              _isFavorite ? S.of(context)!.addedToFavorites : S.of(context)!.removedFromFavorites,
            ),
            duration: const Duration(seconds: 1),
          ),
@@ -222,7 +223,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to update favorite: $e'),
+            content: Text(S.of(context)!.failedToUpdateFavorite(e.toString())),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -236,7 +237,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {

    if (selectedPlayer == null) {
      ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(content: Text('No player selected')),
+        SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
      );
      return;
    }
@@ -246,7 +247,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Starting ${widget.artist.name} radio'),
+            content: Text(S.of(context)!.startingRadio(widget.artist.name)),
            duration: const Duration(seconds: 1),
          ),
        );
@@ -256,7 +257,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to start radio: $e'),
+            content: Text(S.of(context)!.failedToStartRadio(e.toString())),
            backgroundColor: Colors.red,
          ),
        );
@@ -282,14 +283,14 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
-              'Start ${widget.artist.name} radio on...',
+              S.of(context)!.startRadioOn(widget.artist.name),
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            if (players.isEmpty)
-              const Padding(
-                padding: EdgeInsets.all(32.0),
-                child: Text('No players available'),
+              Padding(
+                padding: const EdgeInsets.all(32.0),
+                child: Text(S.of(context)!.noPlayersAvailable),
              )
            else
              Flexible(
@@ -311,7 +312,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                          if (mounted) {
                            ScaffoldMessenger.of(context).showSnackBar(
                              SnackBar(
-                                content: Text('Starting ${widget.artist.name} radio on ${player.name}'),
+                                content: Text(S.of(context)!.startingRadioOnPlayer(widget.artist.name, player.name)),
                                duration: const Duration(seconds: 1),
                              ),
                            );
@@ -321,7 +322,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                          if (mounted) {
                            ScaffoldMessenger.of(context).showSnackBar(
                              SnackBar(
-                                content: Text('Failed to start radio: $e'),
+                                content: Text(S.of(context)!.failedToStartRadio(e.toString())),
                                backgroundColor: Colors.red,
                              ),
                            );
@@ -345,7 +346,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {

    if (selectedPlayer == null) {
      ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(content: Text('No player selected')),
+        SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
      );
      return;
    }
@@ -356,7 +357,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Added ${widget.artist.name} radio to queue'),
+            content: Text(S.of(context)!.addedRadioToQueue(widget.artist.name)),
            duration: const Duration(seconds: 1),
          ),
        );
@@ -366,7 +367,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to add to queue: $e'),
+            content: Text(S.of(context)!.failedToAddToQueue(e.toString())),
            backgroundColor: Colors.red,
          ),
        );
@@ -442,7 +443,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
      });
    }
  }
-  
+
  @override
  Widget build(BuildContext context) {
    // CRITICAL FIX: Use select() instead of watch() to reduce rebuilds
@@ -583,7 +584,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                          child: ElevatedButton.icon(
                            onPressed: _startArtistRadio,
                            icon: const Icon(Icons.radio),
-                            label: const Text('Radio'),
+                            label: Text(S.of(context)!.radio),
                            style: ElevatedButton.styleFrom(
                              backgroundColor: colorScheme.primary,
                              foregroundColor: colorScheme.onPrimary,
@@ -669,7 +670,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
            SliverFillRemaining(
              child: Center(
                child: Text(
-                  'No albums found',
+                  S.of(context)!.noAlbumsFound,
                  style: TextStyle(
                    color: colorScheme.onBackground.withOpacity(0.54),
                    fontSize: 16,
@@ -686,7 +687,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                  child: Row(
                    children: [
                      Text(
-                        'In Library',
+                        S.of(context)!.inLibrary,
                        style: textTheme.titleLarge?.copyWith(
                          color: colorScheme.onBackground,
                          fontWeight: FontWeight.bold,
@@ -700,7 +701,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                          color: colorScheme.primary,
                          size: 20,
                        ),
-                        tooltip: _sortOrder == 'alpha' ? 'Sort by year' : 'Sort alphabetically',
+                        tooltip: _sortOrder == 'alpha' ? S.of(context)!.sortByYear : S.of(context)!.sortAlphabetically,
                        onPressed: _toggleSortOrder,
                        visualDensity: VisualDensity.compact,
                        padding: EdgeInsets.zero,
@@ -718,10 +719,10 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                          size: 20,
                        ),
                        tooltip: _viewMode == 'grid2'
-                            ? '3-column grid'
+                            ? S.of(context)!.threeColumnGrid
                            : _viewMode == 'grid3'
-                                ? 'List view'
-                                : '2-column grid',
+                                ? S.of(context)!.listView
+                                : S.of(context)!.twoColumnGrid,
                        onPressed: _cycleViewMode,
                        visualDensity: VisualDensity.compact,
                        padding: EdgeInsets.zero,
@@ -742,7 +743,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                  child: Row(
                    children: [
                      Text(
-                        'From Providers',
+                        S.of(context)!.fromProviders,
                        style: textTheme.titleLarge?.copyWith(
                          color: colorScheme.onBackground,
                          fontWeight: FontWeight.bold,
@@ -757,7 +758,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                            color: colorScheme.primary,
                            size: 20,
                          ),
-                          tooltip: _sortOrder == 'alpha' ? 'Sort by year' : 'Sort alphabetically',
+                          tooltip: _sortOrder == 'alpha' ? S.of(context)!.sortByYear : S.of(context)!.sortAlphabetically,
                          onPressed: _toggleSortOrder,
                          visualDensity: VisualDensity.compact,
                          padding: EdgeInsets.zero,
@@ -774,10 +775,10 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                            size: 20,
                          ),
                          tooltip: _viewMode == 'grid2'
-                              ? '3-column grid'
+                              ? S.of(context)!.threeColumnGrid
                              : _viewMode == 'grid3'
-                                  ? 'List view'
-                                  : '2-column grid',
+                                  ? S.of(context)!.listView
+                                  : S.of(context)!.twoColumnGrid,
                          onPressed: _cycleViewMode,
                          visualDensity: VisualDensity.compact,
                          padding: EdgeInsets.zero,
@@ -12,6 +12,7 @@ import '../services/metadata_service.dart';
 import '../services/debug_logger.dart';
 import '../utils/page_transitions.dart';
 import '../constants/hero_tags.dart';
+import '../l10n/app_localizations.dart';
 import 'audiobook_detail_screen.dart';

 class AudiobookAuthorScreen extends StatefulWidget {
@@ -218,7 +219,7 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
                    ),
                    const SizedBox(height: 8),
                    Text(
-                      '${_audiobooks.length} ${_audiobooks.length == 1 ? 'audiobook' : 'audiobooks'}',
+                      S.of(context)!.audiobookCount(_audiobooks.length),
                      style: textTheme.bodyLarge?.copyWith(
                        color: colorScheme.onSurface.withOpacity(0.7),
                      ),
@@ -234,7 +235,7 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
                child: Row(
                  children: [
                    Text(
-                      'Audiobooks',
+                      S.of(context)!.audiobooks,
                      style: textTheme.titleLarge?.copyWith(
                        color: colorScheme.onSurface,
                        fontWeight: FontWeight.bold,
@@ -248,7 +249,7 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
                        color: colorScheme.primary,
                        size: 20,
                      ),
-                      tooltip: _sortOrder == 'alpha' ? 'Sort by year' : 'Sort alphabetically',
+                      tooltip: _sortOrder == 'alpha' ? S.of(context)!.sortByYear : S.of(context)!.sortAlphabetically,
                      onPressed: _toggleSortOrder,
                      visualDensity: VisualDensity.compact,
                      padding: EdgeInsets.zero,
@@ -266,10 +267,10 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
                        size: 20,
                      ),
                      tooltip: _viewMode == 'grid2'
-                          ? '3-column grid'
+                          ? S.of(context)!.threeColumnGrid
                          : _viewMode == 'grid3'
-                              ? 'List view'
-                              : '2-column grid',
+                              ? S.of(context)!.listView
+                              : S.of(context)!.twoColumnGrid,
                      onPressed: _cycleViewMode,
                      visualDensity: VisualDensity.compact,
                      padding: EdgeInsets.zero,
@@ -405,9 +406,9 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
              ),
            ),
          ),
-          if (book.narratorsString != 'Unknown Narrator')
+          if (book.narratorsString != S.of(context)!.unknownNarrator)
            Text(
-              'Narrated by ${book.narratorsString}',
+              S.of(context)!.narratedBy(book.narratorsString),
              style: textTheme.bodySmall?.copyWith(
                color: colorScheme.onSurface.withOpacity(0.6),
              ),
@@ -488,8 +489,8 @@ class _AudiobookAuthorScreenState extends State<AudiobookAuthorScreen> {
        ),
      ),
      subtitle: Text(
-        book.narratorsString != 'Unknown Narrator'
-            ? 'Narrated by ${book.narratorsString}'
+        book.narratorsString != S.of(context)!.unknownNarrator
+            ? S.of(context)!.narratedBy(book.narratorsString)
            : book.duration != null
                ? _formatDuration(book.duration!)
                : '',
@@ -10,6 +10,7 @@ import '../theme/theme_provider.dart';
 import '../services/debug_logger.dart';
 import '../services/recently_played_service.dart';
 import '../constants/hero_tags.dart';
+import '../l10n/app_localizations.dart';

 class AudiobookDetailScreen extends StatefulWidget {
  final Audiobook audiobook;
@@ -172,7 +173,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Text(
-              _isFavorite ? 'Added to favorites' : 'Removed from favorites',
+              _isFavorite ? S.of(context)!.addedToFavorites : S.of(context)!.removedFromFavorites,
            ),
            duration: const Duration(seconds: 1),
          ),
@@ -183,7 +184,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to update favorite: $e'),
+            content: Text(S.of(context)!.failedToUpdateFavorite(e.toString())),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -215,13 +216,13 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
          children: [
            const SizedBox(height: 16),
            Text(
-              'Play on...',
+              S.of(context)!.playOn,
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            Expanded(
              child: players.isEmpty
-                  ? const Center(child: Text('No players available'))
+                  ? Center(child: Text(S.of(context)!.noPlayersAvailable))
                  : ListView.builder(
                      padding: EdgeInsets.only(bottom: bottomPadding + 16),
                      itemCount: players.length,
@@ -287,7 +288,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('${_audiobook.name} marked as finished'),
+            content: Text(S.of(context)!.markedAsFinished(_audiobook.name)),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -297,7 +298,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to mark as finished: $e'),
+            content: Text(S.of(context)!.failedToMarkFinished(e.toString())),
            backgroundColor: Colors.red,
          ),
        );
@@ -338,7 +339,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('${_audiobook.name} marked as unplayed'),
+            content: Text(S.of(context)!.markedAsUnplayed(_audiobook.name)),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -348,7 +349,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to mark as unplayed: $e'),
+            content: Text(S.of(context)!.failedToMarkUnplayed(e.toString())),
            backgroundColor: Colors.red,
          ),
        );
@@ -362,7 +363,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {

    if (selectedPlayer == null) {
      ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(content: Text('No player selected')),
+        SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
      );
      return;
    }
@@ -392,7 +393,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Playing ${widget.audiobook.name}'),
+            content: Text(S.of(context)!.playing(widget.audiobook.name)),
            duration: const Duration(seconds: 1),
          ),
        );
@@ -402,7 +403,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to play: $e'),
+            content: Text(S.of(context)!.failedToPlay(e.toString())),
            backgroundColor: Colors.red,
          ),
        );
@@ -489,7 +490,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                            size: 20,
                          ),
                          const SizedBox(width: 12),
-                          const Text('Mark as Finished'),
+                          Text(S.of(context)!.markAsFinished),
                        ],
                      ),
                    ),
@@ -503,7 +504,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                            size: 20,
                          ),
                          const SizedBox(width: 12),
-                          const Text('Mark as Unplayed'),
+                          Text(S.of(context)!.markAsUnplayed),
                        ],
                      ),
                    ),
@@ -580,17 +581,17 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {

                    // Author
                    Text(
-                      'By ${book.authorsString}',
+                      S.of(context)!.byAuthor(book.authorsString),
                      style: textTheme.titleMedium?.copyWith(
                        color: colorScheme.onSurface.withOpacity(0.8),
                      ),
                    ),

                    // Narrator
-                    if (book.narratorsString != 'Unknown Narrator') ...[
+                    if (book.narratorsString != S.of(context)!.unknownNarrator) ...[
                      const SizedBox(height: 4),
                      Text(
-                        'Narrated by ${book.narratorsString}',
+                        S.of(context)!.narratedBy(book.narratorsString),
                        style: textTheme.bodyMedium?.copyWith(
                          color: colorScheme.onSurface.withOpacity(0.6),
                        ),
@@ -624,7 +625,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                          ),
                          const SizedBox(width: 4),
                          Text(
-                            '${(book.progress * 100).toInt()}% complete',
+                            S.of(context)!.percentComplete((book.progress * 100).toInt()),
                            style: textTheme.bodyMedium?.copyWith(
                              color: colorScheme.primary,
                            ),
@@ -662,7 +663,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                                startPositionMs: hasResumePosition ? book.resumePositionMs : null,
                              ),
                              icon: Icon(hasResumePosition ? Icons.play_arrow : Icons.play_arrow),
-                              label: Text(hasResumePosition ? 'Resume' : 'Play'),
+                              label: Text(hasResumePosition ? S.of(context)!.resume : S.of(context)!.play),
                              style: ElevatedButton.styleFrom(
                                backgroundColor: colorScheme.primary,
                                foregroundColor: colorScheme.onPrimary,
@@ -740,7 +741,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                    if (book.description != null && book.description!.isNotEmpty) ...[
                      const SizedBox(height: 24),
                      Text(
-                        'About',
+                        S.of(context)!.about,
                        style: textTheme.titleLarge?.copyWith(
                          color: colorScheme.onSurface,
                          fontWeight: FontWeight.bold,
@@ -771,7 +772,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                    // Chapters Header
                    const SizedBox(height: 24),
                    Text(
-                      'Chapters',
+                      S.of(context)!.chapters,
                      style: textTheme.titleLarge?.copyWith(
                        color: colorScheme.onSurface,
                        fontWeight: FontWeight.bold,
@@ -815,7 +816,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                  ),
                  const SizedBox(height: 12),
                  Text(
-                    'Loading chapters...',
+                    S.of(context)!.loadingChapters,
                    style: textTheme.bodyMedium?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.6),
                    ),
@@ -853,7 +854,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
          padding: const EdgeInsets.all(24.0),
          child: Center(
            child: Text(
-              'No chapter information available',
+              S.of(context)!.noChapterInfoAvailable,
              style: textTheme.bodyMedium?.copyWith(
                color: colorScheme.onSurface.withOpacity(0.6),
              ),
@@ -914,7 +915,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
          ),
          subtitle: isInProgress
              ? Text(
-                  'In progress',
+                  S.of(context)!.inProgress,
                  style: textTheme.bodySmall?.copyWith(
                    color: colorScheme.primary,
                  ),
@@ -972,7 +973,7 @@ class _AudiobookDetailScreenState extends State<AudiobookDetailScreen> {
                            children: [
                              const Icon(Icons.play_arrow, size: 20),
                              const SizedBox(width: 8),
-                              Text(isInProgress ? 'Resume' : 'Play'),
+                              Text(isInProgress ? S.of(context)!.resume : S.of(context)!.play),
                            ],
                          ),
                        ),
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
+import 'package:palette_generator/palette_generator.dart';
 import '../models/media_item.dart';
 import '../providers/music_assistant_provider.dart';
 import '../widgets/global_player_overlay.dart' show BottomSpacing;
@@ -10,15 +11,19 @@ import '../services/debug_logger.dart';
 import '../utils/page_transitions.dart';
 import '../constants/hero_tags.dart';
 import 'audiobook_detail_screen.dart';
+import '../l10n/app_localizations.dart';

 class AudiobookSeriesScreen extends StatefulWidget {
  final AudiobookSeries series;
  final String? heroTag;
+  /// Pre-loaded cover URLs from the library screen for smooth Hero animation
+  final List<String>? initialCovers;

  const AudiobookSeriesScreen({
    super.key,
    required this.series,
    this.heroTag,
+    this.initialCovers,
  });

  @override
@@ -35,9 +40,21 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
  String _sortOrder = 'series'; // 'series' (by series number) or 'alpha'
  String _viewMode = 'grid2'; // 'grid2', 'grid3', 'list'

+  // Extracted colors from book covers
+  List<Color> _extractedColors = [];
+
+  // Cover URLs - start with initial covers, update when books load
+  List<String> _coverUrls = [];
+
  @override
  void initState() {
    super.initState();
+    // Use initial covers immediately for smooth Hero animation
+    if (widget.initialCovers != null && widget.initialCovers!.isNotEmpty) {
+      _coverUrls = List.from(widget.initialCovers!);
+      // Start color extraction from initial covers
+      _extractColorsFromUrls(widget.initialCovers!);
+    }
    _loadViewPreferences();
    // Defer loading until after first frame to ensure UI renders first
    WidgetsBinding.instance.addPostFrameCallback((_) {
@@ -47,6 +64,42 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
    });
  }

+  /// Extract colors from cover URLs (used for initial covers)
+  Future<void> _extractColorsFromUrls(List<String> coverUrls) async {
+    final extractedColors = <Color>[];
+
+    for (final url in coverUrls.take(4)) {
+      try {
+        final palette = await PaletteGenerator.fromImageProvider(
+          CachedNetworkImageProvider(url),
+          maximumColorCount: 8,
+        );
+
+        if (palette.darkMutedColor != null) {
+          extractedColors.add(palette.darkMutedColor!.color);
+        }
+        if (palette.mutedColor != null) {
+          extractedColors.add(palette.mutedColor!.color);
+        }
+        if (palette.darkVibrantColor != null) {
+          extractedColors.add(palette.darkVibrantColor!.color);
+        }
+        if (palette.dominantColor != null) {
+          final hsl = HSLColor.fromColor(palette.dominantColor!.color);
+          extractedColors.add(hsl.withLightness((hsl.lightness * 0.4).clamp(0.1, 0.3)).toColor());
+        }
+      } catch (e) {
+        _logger.log('📚 Error extracting colors: $e');
+      }
+    }
+
+    if (extractedColors.isNotEmpty && mounted) {
+      setState(() {
+        _extractedColors = extractedColors;
+      });
+    }
+  }
+
  Future<void> _loadViewPreferences() async {
    final sortOrder = await SettingsService.getSeriesAudiobooksSortOrder();
    final viewMode = await SettingsService.getSeriesAudiobooksViewMode();
@@ -116,7 +169,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {

      if (maProvider.api == null) {
        setState(() {
-          _error = 'Not connected to Music Assistant';
+          _error = S.of(context)!.notConnected;
          _isLoading = false;
        });
        return;
@@ -132,9 +185,22 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
      }

      if (mounted) {
+        // Update cover URLs from loaded books
+        final newCovers = <String>[];
+        for (final book in books.take(9)) {
+          final imageUrl = maProvider.getImageUrl(book);
+          if (imageUrl != null) {
+            newCovers.add(imageUrl);
+          }
+        }
+
        setState(() {
          _audiobooks = books;
          _sortAudiobooks(); // Sort inside setState so UI updates
+          // Update covers if we got new ones (may have more than initial)
+          if (newCovers.isNotEmpty) {
+            _coverUrls = newCovers;
+          }
          _isLoading = false;
        });
        // Debug: Log sorted order
@@ -142,6 +208,9 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
        for (final book in _audiobooks) {
          _logger.log('  - ${book.seriesSequence ?? "null"}: ${book.name}');
        }
+
+        // Extract colors from book covers asynchronously
+        _extractCoverColors(maProvider);
      }
    } catch (e, stack) {
      _logger.log('📚 SeriesScreen error: $e');
@@ -155,11 +224,54 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
    }
  }

+  /// Extract colors from book covers for empty grid cells
+  Future<void> _extractCoverColors(MusicAssistantProvider maProvider) async {
+    final extractedColors = <Color>[];
+
+    // Extract colors from first few book covers
+    for (final book in _audiobooks.take(4)) {
+      final imageUrl = maProvider.getImageUrl(book);
+      if (imageUrl == null) continue;
+
+      try {
+        final palette = await PaletteGenerator.fromImageProvider(
+          CachedNetworkImageProvider(imageUrl),
+          maximumColorCount: 8,
+        );
+
+        // Get dark muted colors for grid squares
+        if (palette.darkMutedColor != null) {
+          extractedColors.add(palette.darkMutedColor!.color);
+        }
+        if (palette.mutedColor != null) {
+          extractedColors.add(palette.mutedColor!.color);
+        }
+        if (palette.darkVibrantColor != null) {
+          extractedColors.add(palette.darkVibrantColor!.color);
+        }
+        if (palette.dominantColor != null) {
+          // Darken the dominant color for better appearance
+          final hsl = HSLColor.fromColor(palette.dominantColor!.color);
+          extractedColors.add(hsl.withLightness((hsl.lightness * 0.4).clamp(0.1, 0.3)).toColor());
+        }
+      } catch (e) {
+        _logger.log('📚 Error extracting colors: $e');
+      }
+    }
+
+    if (extractedColors.isNotEmpty && mounted) {
+      setState(() {
+        _extractedColors = extractedColors;
+      });
+    }
+  }
+
  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;
    final maProvider = context.watch<MusicAssistantProvider>();
+    final l10n = S.of(context)!;

    return Scaffold(
      backgroundColor: colorScheme.surface,
@@ -225,8 +337,8 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                  const SizedBox(height: 8),
                  Text(
                    _isLoading
-                        ? 'Loading...'
-                        : '${_audiobooks.length} ${_audiobooks.length == 1 ? 'book' : 'books'}',
+                        ? l10n.loading
+                        : l10n.bookCount(_audiobooks.length),
                    style: textTheme.bodyLarge?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.7),
                    ),
@@ -243,7 +355,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
              child: Row(
                children: [
                  Text(
-                    'Books',
+                    l10n.books,
                    style: textTheme.titleLarge?.copyWith(
                      color: colorScheme.onSurface,
                      fontWeight: FontWeight.bold,
@@ -257,7 +369,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                      color: colorScheme.primary,
                      size: 20,
                    ),
-                    tooltip: _sortOrder == 'series' ? 'Sort alphabetically' : 'Sort by series order',
+                    tooltip: _sortOrder == 'series' ? S.of(context)!.sortAlphabetically : S.of(context)!.sortBySeriesOrder,
                    onPressed: _toggleSortOrder,
                    visualDensity: VisualDensity.compact,
                    padding: EdgeInsets.zero,
@@ -275,10 +387,10 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                      size: 20,
                    ),
                    tooltip: _viewMode == 'grid2'
-                        ? '3-column grid'
+                        ? S.of(context)!.threeColumnGrid
                        : _viewMode == 'grid3'
-                            ? 'List view'
-                            : '2-column grid',
+                            ? S.of(context)!.listView
+                            : S.of(context)!.twoColumnGrid,
                    onPressed: _cycleViewMode,
                    visualDensity: VisualDensity.compact,
                    padding: EdgeInsets.zero,
@@ -306,7 +418,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                    const SizedBox(height: 16),
                    ElevatedButton(
                      onPressed: _loadSeriesBooks,
-                      child: const Text('Retry'),
+                      child: Text(l10n.retry),
                    ),
                  ],
                ),
@@ -322,7 +434,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                        size: 48, color: colorScheme.onSurfaceVariant),
                    const SizedBox(height: 16),
                    Text(
-                      'No books found in this series',
+                      S.of(context)!.noBooksInSeries,
                      style: TextStyle(color: colorScheme.onSurfaceVariant),
                    ),
                  ],
@@ -341,9 +453,22 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
    );
  }

+  // Dark pastel colors for empty cells - muted and book-like
+  static const _emptyColors = [
+    Color(0xFF2D3436), // Dark slate
+    Color(0xFF34495E), // Dark blue-grey
+    Color(0xFF4A3728), // Dark brown
+    Color(0xFF2C3E50), // Midnight blue
+    Color(0xFF3D3D3D), // Charcoal
+    Color(0xFF4A4458), // Dark purple-grey
+    Color(0xFF3E4A47), // Dark teal-grey
+    Color(0xFF4A3F35), // Dark warm grey
+  ];
+
  Widget _buildSeriesCover(ColorScheme colorScheme, MusicAssistantProvider maProvider) {
-    // If still loading or no books, show placeholder
-    if (_isLoading || _audiobooks.isEmpty) {
+    // Use _coverUrls which may have initial covers or loaded covers
+    // Only show placeholder if we truly have no covers
+    if (_coverUrls.isEmpty) {
      return Container(
        color: colorScheme.surfaceContainerHighest,
        child: Center(
@@ -356,32 +481,23 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
      );
    }

-    // Get cover URLs from loaded books
-    final covers = <String>[];
-    for (final book in _audiobooks.take(9)) {
-      final imageUrl = maProvider.getImageUrl(book);
-      if (imageUrl != null) {
-        covers.add(imageUrl);
-      }
+    final covers = _coverUrls;
+
+    // Dynamic grid size based on number of covers (matches library screen)
+    // 1 cover = 1x1, 2-4 covers = 2x2, 5+ covers = 3x3
+    int gridSize;
+    if (covers.length == 1) {
+      gridSize = 1;
+    } else if (covers.length <= 4) {
+      gridSize = 2;
+    } else {
+      gridSize = 3;
    }

-    if (covers.isEmpty) {
-      return Container(
-        color: colorScheme.surfaceContainerHighest,
-        child: Center(
-          child: Icon(
-            Icons.collections_bookmark_rounded,
-            size: 64,
-            color: colorScheme.onSurfaceVariant.withOpacity(0.5),
-          ),
-        ),
-      );
-    }
+    // Use series ID to pick consistent colors and nested grid patterns
+    final colorSeed = widget.series.id.hashCode;

-    // Always use 3x3 grid for series detail
-    const int gridSize = 3;
-
-    // Pad covers to fill grid, using empty strings for missing slots
+    // Pad covers to fill grid
    final displayCovers = List<String?>.filled(gridSize * gridSize, null);
    for (var i = 0; i < covers.length && i < displayCovers.length; i++) {
      displayCovers[i] = covers[i];
@@ -397,12 +513,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
              final coverUrl = displayCovers[index];

              return Expanded(
-                child: Container(
-                  margin: EdgeInsets.only(
-                    right: col < gridSize - 1 ? 1 : 0,
-                    bottom: row < gridSize - 1 ? 1 : 0,
-                  ),
-                  child: coverUrl != null
+                child: coverUrl != null
                      ? CachedNetworkImage(
                          imageUrl: coverUrl,
                          fit: BoxFit.cover,
@@ -418,10 +529,62 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
                            ),
                          ),
                        )
-                      : Container(
-                          color: colorScheme.surfaceContainerHighest,
-                        ),
-                ),
+                      : _buildEmptyCell(colorSeed, index),
+              );
+            }),
+          ),
+        );
+      }),
+    );
+  }
+
+  /// Builds an empty cell with either a solid color or a nested grid
+  /// The pattern is deterministic based on series ID and cell index
+  Widget _buildEmptyCell(int colorSeed, int cellIndex) {
+    // Use extracted colors if available, otherwise fall back to static palette
+    final baseColors = _extractedColors.isNotEmpty ? _extractedColors : _emptyColors;
+    // Tone down colors - reduce saturation and darken
+    final colors = baseColors.map((c) {
+      final hsl = HSLColor.fromColor(c);
+      return hsl
+          .withSaturation((hsl.saturation * 0.5).clamp(0.05, 0.25))
+          .withLightness((hsl.lightness * 0.7).clamp(0.08, 0.20))
+          .toColor();
+    }).toList();
+
+    // Use combined seed for deterministic but varied patterns
+    final seed = colorSeed + cellIndex * 17; // Prime multiplier for better distribution
+
+    // Determine nested grid size: 1 (solid), 2 (2x2), or 3 (3x3)
+    // Distribution: ~50% solid, ~30% 2x2, ~20% 3x3
+    final sizeRoll = seed.abs() % 100;
+    int nestedSize;
+    if (sizeRoll < 50) {
+      nestedSize = 1; // Solid color
+    } else if (sizeRoll < 80) {
+      nestedSize = 2; // 2x2 grid
+    } else {
+      nestedSize = 3; // 3x3 grid
+    }
+
+    if (nestedSize == 1) {
+      // Solid color
+      final colorIndex = seed.abs() % colors.length;
+      return Container(color: colors[colorIndex]);
+    }
+
+    // Build nested grid (no margins - seamless)
+    return Column(
+      children: List.generate(nestedSize, (row) {
+        return Expanded(
+          child: Row(
+            children: List.generate(nestedSize, (col) {
+              final nestedIndex = row * nestedSize + col;
+              // Use different seed for each nested cell
+              final nestedSeed = seed + nestedIndex * 7;
+              final colorIndex = nestedSeed.abs() % colors.length;
+              return Expanded(
+                child: Container(color: colors[colorIndex]),
              );
            }),
          ),
@@ -547,7 +710,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
              ),
            ),
          ),
-          if (book.authorsString.isNotEmpty && book.authorsString != 'Unknown Author')
+          if (book.authorsString.isNotEmpty && book.authorsString != S.of(context)!.unknownAuthor)
            Text(
              book.authorsString,
              style: textTheme.bodySmall?.copyWith(
@@ -629,7 +792,7 @@ class _AudiobookSeriesScreenState extends State<AudiobookSeriesScreen> {
        ),
      ),
      subtitle: Text(
-        book.authorsString.isNotEmpty && book.authorsString != 'Unknown Author'
+        book.authorsString.isNotEmpty && book.authorsString != S.of(context)!.unknownAuthor
            ? book.authorsString
            : book.duration != null
                ? _formatDuration(book.duration!)
@@ -5,6 +5,7 @@ import 'package:share_plus/share_plus.dart';
 import '../services/debug_logger.dart';
 import '../providers/music_assistant_provider.dart';
 import '../widgets/global_player_overlay.dart';
+import '../l10n/app_localizations.dart';

 class DebugLogScreen extends StatefulWidget {
  const DebugLogScreen({super.key});
@@ -42,10 +43,10 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
  void _copyLogs() {
    Clipboard.setData(ClipboardData(text: _logger.getAllLogs()));
    ScaffoldMessenger.of(context).showSnackBar(
-      const SnackBar(
-        content: Text('Logs copied to clipboard'),
+      SnackBar(
+        content: Text(S.of(context)!.logsCopied),
        backgroundColor: Colors.green,
-        duration: Duration(seconds: 2),
+        duration: const Duration(seconds: 2),
      ),
    );
  }
@@ -58,7 +59,7 @@ class _DebugLogScreenState extends State<DebugLogScreen> {

      await Share.share(
        report,
-        subject: 'Ensemble Bug Report',
+        subject: S.of(context)!.ensembleBugReport,
      );
    } finally {
      if (mounted) {
@@ -72,9 +73,9 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
      _logger.clear();
    });
    ScaffoldMessenger.of(context).showSnackBar(
-      const SnackBar(
-        content: Text('Logs cleared'),
-        duration: Duration(seconds: 1),
+      SnackBar(
+        content: Text(S.of(context)!.logsCleared),
+        duration: const Duration(seconds: 1),
      ),
    );
  }
@@ -93,7 +94,7 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
        builder: (context) => AlertDialog(
          backgroundColor: const Color(0xFF2a2a2a),
          title: Text(
-            'All Players (${allPlayers.length})',
+            S.of(context)!.allPlayersCount(allPlayers.length),
            style: const TextStyle(color: Colors.white),
          ),
          content: SizedBox(
@@ -153,27 +154,27 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
-                          'ID: ${player.playerId}',
+                          S.of(context)!.playerId(player.playerId),
                          style: const TextStyle(color: Colors.white70, fontSize: 11),
                        ),
                        Text(
-                          'Available: ${player.available} | Provider: ${player.provider}',
+                          S.of(context)!.playerInfo(player.available.toString(), player.provider ?? 'unknown'),
                          style: const TextStyle(color: Colors.white70, fontSize: 11),
                        ),
                        if (isCurrentPlayer)
-                          const Text(
-                            '← This device',
-                            style: TextStyle(color: Colors.green, fontSize: 11, fontWeight: FontWeight.bold),
+                          Text(
+                            S.of(context)!.thisDevice,
+                            style: const TextStyle(color: Colors.green, fontSize: 11, fontWeight: FontWeight.bold),
                          ),
                        if (isGhost && !isCorrupt)
-                          const Text(
-                            '⚠️ Ghost player (duplicate)',
-                            style: TextStyle(color: Colors.red, fontSize: 11),
+                          Text(
+                            S.of(context)!.ghostPlayer,
+                            style: const TextStyle(color: Colors.red, fontSize: 11),
                          ),
                        if (isCorrupt)
-                          const Text(
-                            '⚠️ Unavailable/Corrupt',
-                            style: TextStyle(color: Colors.orange, fontSize: 11),
+                          Text(
+                            S.of(context)!.unavailableCorrupt,
+                            style: const TextStyle(color: Colors.orange, fontSize: 11),
                          ),
                      ],
                    ),
@@ -195,15 +196,15 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                if (context.mounted) {
                  Navigator.pop(context);
                  ScaffoldMessenger.of(context).showSnackBar(
-                    const SnackBar(content: Text('Player list copied to clipboard!')),
+                    SnackBar(content: Text(S.of(context)!.playerListCopied)),
                  );
                }
              },
-              child: const Text('Copy List'),
+              child: Text(S.of(context)!.copyList),
            ),
            TextButton(
              onPressed: () => Navigator.pop(context),
-              child: const Text('Close'),
+              child: Text(S.of(context)!.close),
            ),
          ],
        ),
@@ -211,7 +212,7 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
    } catch (e) {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
-          SnackBar(content: Text('Error loading players: $e')),
+          SnackBar(content: Text(S.of(context)!.errorLoadingPlayers(e.toString()))),
        );
      }
    }
@@ -229,9 +230,9 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
          onPressed: () => Navigator.pop(context),
          color: Colors.white,
        ),
-        title: const Text(
-          'Debug Logs',
-          style: TextStyle(
+        title: Text(
+          S.of(context)!.debugLogs,
+          style: const TextStyle(
            color: Colors.white,
            fontSize: 20,
            fontWeight: FontWeight.w300,
@@ -256,11 +257,11 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                  icon: const Icon(Icons.share_rounded),
                  onPressed: _shareBugReport,
                  color: Colors.white,
-                  tooltip: 'Share bug report',
+                  tooltip: S.of(context)!.shareBugReport,
                ),
          PopupMenuButton<String>(
            icon: const Icon(Icons.more_vert, color: Colors.white),
-            tooltip: 'More options',
+            tooltip: S.of(context)!.moreOptions,
            onSelected: (value) async {
              switch (value) {
                case 'show_players':
@@ -275,27 +276,27 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
              }
            },
            itemBuilder: (context) => [
-              const PopupMenuItem(
+              PopupMenuItem(
                value: 'show_players',
                child: ListTile(
-                  leading: Icon(Icons.speaker_group_rounded),
-                  title: Text('View All Players'),
+                  leading: const Icon(Icons.speaker_group_rounded),
+                  title: Text(S.of(context)!.viewAllPlayers),
                  dense: true,
                ),
              ),
-              const PopupMenuItem(
+              PopupMenuItem(
                value: 'copy_logs',
                child: ListTile(
-                  leading: Icon(Icons.copy_rounded),
-                  title: Text('Copy Logs'),
+                  leading: const Icon(Icons.copy_rounded),
+                  title: Text(S.of(context)!.copyLogs),
                  dense: true,
                ),
              ),
-              const PopupMenuItem(
+              PopupMenuItem(
                value: 'clear_logs',
                child: ListTile(
-                  leading: Icon(Icons.delete_rounded),
-                  title: Text('Clear Logs'),
+                  leading: const Icon(Icons.delete_rounded),
+                  title: Text(S.of(context)!.clearLogs),
                  dense: true,
                ),
              ),
@@ -317,20 +318,20 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                  scrollDirection: Axis.horizontal,
                  child: Row(
                    children: [
-                      _buildFilterChip('All', LogLevel.debug),
+                      _buildFilterChip(S.of(context)!.all, LogLevel.debug),
                      const SizedBox(width: 8),
-                      _buildFilterChip('Info+', LogLevel.info),
+                      _buildFilterChip(S.of(context)!.infoPlus, LogLevel.info),
                      const SizedBox(width: 8),
-                      _buildFilterChip('Warnings', LogLevel.warning),
+                      _buildFilterChip(S.of(context)!.warnings, LogLevel.warning),
                      const SizedBox(width: 8),
-                      _buildFilterChip('Errors', LogLevel.error),
+                      _buildFilterChip(S.of(context)!.errors, LogLevel.error),
                    ],
                  ),
                ),
                const SizedBox(height: 8),
                // Stats
                Text(
-                  'Showing ${_filteredEntries.length} of ${_logger.entries.length} entries',
+                  S.of(context)!.showingEntries(_filteredEntries.length, _logger.entries.length),
                  style: const TextStyle(color: Colors.white54, fontSize: 11),
                ),
              ],
@@ -338,10 +339,10 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
          ),
          Expanded(
            child: _filteredEntries.isEmpty
-                ? const Center(
+                ? Center(
                    child: Text(
-                      'No logs yet',
-                      style: TextStyle(
+                      S.of(context)!.noLogsYet,
+                      style: const TextStyle(
                        color: Colors.white54,
                        fontSize: 16,
                      ),
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:provider/provider.dart';
+import '../l10n/app_localizations.dart';
 import '../providers/navigation_provider.dart';
 import '../widgets/global_player_overlay.dart';
 import 'new_home_screen.dart';
@@ -39,7 +40,7 @@ class _HomeScreenState extends State<HomeScreen> {
    ScaffoldMessenger.of(context).clearSnackBars();
    ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
-        content: const Text('Press back again to minimize'),
+        content: Text(S.of(context)!.pressBackToMinimize),
        duration: const Duration(seconds: 2),
        behavior: SnackBarBehavior.floating,
        margin: const EdgeInsets.only(bottom: 80, left: 16, right: 16),
@@ -4,6 +4,7 @@ import '../providers/music_assistant_provider.dart';
 import '../models/media_item.dart';
 import '../widgets/album_card.dart';
 import '../widgets/common/empty_state.dart';
+import '../l10n/app_localizations.dart';

 class LibraryAlbumsScreen extends StatelessWidget {
  const LibraryAlbumsScreen({super.key});
@@ -25,7 +26,7 @@ class LibraryAlbumsScreen extends StatelessWidget {
          color: colorScheme.onBackground,
        ),
        title: Text(
-          'Albums',
+          S.of(context)!.albums,
          style: textTheme.headlineSmall?.copyWith(
            color: colorScheme.onBackground,
            fontWeight: FontWeight.w300,
@@ -54,6 +55,7 @@ class LibraryAlbumsScreen extends StatelessWidget {

    if (albums.isEmpty) {
      return EmptyState.albums(
+        context: context,
        onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
      );
    }
@@ -6,6 +6,7 @@ import '../utils/page_transitions.dart';
 import '../widgets/common/empty_state.dart';
 import '../widgets/artist_avatar.dart';
 import 'artist_details_screen.dart';
+import '../l10n/app_localizations.dart';

 class LibraryArtistsScreen extends StatelessWidget {
  const LibraryArtistsScreen({super.key});
@@ -27,7 +28,7 @@ class LibraryArtistsScreen extends StatelessWidget {
          color: colorScheme.onBackground,
        ),
        title: Text(
-          'Artists',
+          S.of(context)!.artists,
          style: textTheme.headlineSmall?.copyWith(
            color: colorScheme.onBackground,
            fontWeight: FontWeight.w300,
@@ -56,6 +57,7 @@ class LibraryArtistsScreen extends StatelessWidget {

    if (artists.isEmpty) {
      return EmptyState.artists(
+        context: context,
        onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
      );
    }
@@ -5,6 +5,7 @@ import '../providers/music_assistant_provider.dart';
 import '../models/media_item.dart';
 import '../widgets/common/empty_state.dart';
 import 'playlist_details_screen.dart';
+import '../l10n/app_localizations.dart';

 class LibraryPlaylistsScreen extends StatefulWidget {
  const LibraryPlaylistsScreen({super.key});
@@ -59,7 +60,7 @@ class _LibraryPlaylistsScreenState extends State<LibraryPlaylistsScreen> {
          color: colorScheme.onBackground,
        ),
        title: Text(
-          'Playlists',
+          S.of(context)!.playlists,
          style: textTheme.headlineSmall?.copyWith(
            color: colorScheme.onBackground,
            fontWeight: FontWeight.w300,
@@ -81,7 +82,7 @@ class _LibraryPlaylistsScreenState extends State<LibraryPlaylistsScreen> {
    }

    if (_playlists.isEmpty) {
-      return EmptyState.playlists(onRefresh: _loadPlaylists);
+      return EmptyState.playlists(context: context, onRefresh: _loadPlaylists);
    }

    return RefreshIndicator(
@@ -138,8 +139,8 @@ class _LibraryPlaylistsScreenState extends State<LibraryPlaylistsScreen> {
        ),
        subtitle: Text(
          playlist.trackCount != null
-              ? '${playlist.trackCount} tracks'
-              : playlist.owner ?? 'Playlist',
+              ? '${playlist.trackCount} ${S.of(context)!.tracks}'
+              : playlist.owner ?? S.of(context)!.playlist,
          style: textTheme.bodySmall?.copyWith(
            color: colorScheme.onSurface.withOpacity(0.7),
          ),
@@ -4,6 +4,7 @@ import 'package:cached_network_image/cached_network_image.dart';
 import '../providers/music_assistant_provider.dart';
 import '../models/media_item.dart';
 import '../widgets/common/empty_state.dart';
+import '../l10n/app_localizations.dart';

 class LibraryTracksScreen extends StatelessWidget {
  const LibraryTracksScreen({super.key});
@@ -25,7 +26,7 @@ class LibraryTracksScreen extends StatelessWidget {
          color: colorScheme.onBackground,
        ),
        title: Text(
-          'Tracks',
+          S.of(context)!.tracks,
          style: textTheme.headlineSmall?.copyWith(
            color: colorScheme.onBackground,
            fontWeight: FontWeight.w300,
@@ -48,7 +49,7 @@ class LibraryTracksScreen extends StatelessWidget {
    }

    if (provider.tracks.isEmpty) {
-      return EmptyState.tracks(onRefresh: provider.loadLibrary);
+      return EmptyState.tracks(context: context, onRefresh: provider.loadLibrary);
    }

    return ListView.builder(
@@ -129,7 +130,7 @@ class LibraryTracksScreen extends StatelessWidget {

    if (maProvider.selectedPlayer == null) {
      ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(content: Text('No player selected')),
+        SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
      );
      return;
    }
@@ -7,6 +7,7 @@ import '../services/profile_service.dart';
 import '../services/auth/auth_strategy.dart';
 import '../services/debug_logger.dart';
 import '../widgets/debug/debug_console.dart';
+import '../l10n/app_localizations.dart';
 import 'home_screen.dart';

 class LoginScreen extends StatefulWidget {
@@ -158,7 +159,7 @@ class _LoginScreenState extends State<LoginScreen> {
  Future<void> _detectAuthRequirements() async {
    if (_serverUrlController.text.trim().isEmpty) {
      setState(() {
-        _error = 'Please enter your Music Assistant server address';
+        _error = S.of(context)!.pleaseEnterServerAddress;
      });
      return;
    }
@@ -194,7 +195,7 @@ class _LoginScreenState extends State<LoginScreen> {

      if (strategy == null) {
        setState(() {
-          _error = 'Cannot determine authentication requirements. Please check server URL.';
+          _error = S.of(context)!.cannotDetermineAuth;
          _isDetectingAuth = false;
        });
        return;
@@ -230,13 +231,13 @@ class _LoginScreenState extends State<LoginScreen> {
  String _getAuthTypeName(String strategyName) {
    switch (strategyName) {
      case 'none':
-        return 'No Authentication';
+        return S.of(context)!.noAuthentication;
      case 'basic':
-        return 'HTTP Basic Auth';
+        return S.of(context)!.httpBasicAuth;
      case 'authelia':
-        return 'Authelia';
+        return S.of(context)!.authelia;
      case 'music_assistant':
-        return 'Music Assistant Login';
+        return S.of(context)!.musicAssistantLogin;
      default:
        return 'Unknown';
    }
@@ -260,7 +261,7 @@ class _LoginScreenState extends State<LoginScreen> {
  Future<void> _connect() async {
    if (_serverUrlController.text.trim().isEmpty) {
      setState(() {
-        _error = 'Please enter your Music Assistant server address';
+        _error = S.of(context)!.pleaseEnterServerAddress;
      });
      return;
    }
@@ -270,7 +271,7 @@ class _LoginScreenState extends State<LoginScreen> {
    final isMaAuth = _detectedAuthStrategy?.name == 'music_assistant';
    if (!isMaAuth && _ownerNameController.text.trim().isEmpty) {
      setState(() {
-        _error = 'Please enter your name';
+        _error = S.of(context)!.pleaseEnterName;
      });
      return;
    }
@@ -292,7 +293,7 @@ class _LoginScreenState extends State<LoginScreen> {
        portNum = int.tryParse(port);
        if (portNum == null || portNum < 1 || portNum > 65535) {
          setState(() {
-            _error = 'Please enter a valid port number (1-65535)';
+            _error = S.of(context)!.pleaseEnterValidPort;
            _isConnecting = false;
          });
          return;
@@ -324,7 +325,7 @@ class _LoginScreenState extends State<LoginScreen> {

        if (username.isEmpty || password.isEmpty) {
          setState(() {
-            _error = 'Please enter username and password';
+            _error = S.of(context)!.pleaseEnterCredentials;
            _isConnecting = false;
          });
          return;
@@ -350,7 +351,7 @@ class _LoginScreenState extends State<LoginScreen> {

        if (!success) {
          setState(() {
-            _error = 'Authentication failed. Please check your credentials.';
+            _error = S.of(context)!.authFailed;
            _isConnecting = false;
          });
          return;
@@ -384,7 +385,7 @@ class _LoginScreenState extends State<LoginScreen> {

        if (username.isEmpty || password.isEmpty) {
          setState(() {
-            _error = 'Please enter username and password';
+            _error = S.of(context)!.pleaseEnterCredentials;
            _isConnecting = false;
          });
          return;
@@ -408,7 +409,7 @@ class _LoginScreenState extends State<LoginScreen> {

          if (accessToken == null) {
            setState(() {
-              _error = 'Music Assistant login failed. Please check your credentials.';
+              _error = S.of(context)!.maLoginFailed;
              _isConnecting = false;
            });
            return;
@@ -452,7 +453,7 @@ class _LoginScreenState extends State<LoginScreen> {
        }
      } else {
        setState(() {
-          _error = 'Could not connect to server. Please check the address and try again.';
+          _error = S.of(context)!.connectionFailed;
          _isConnecting = false;
        });
      }
@@ -500,7 +501,7 @@ class _LoginScreenState extends State<LoginScreen> {

              // Server URL
              Text(
-                'Server Address',
+                S.of(context)!.serverAddress,
                style: textTheme.titleMedium?.copyWith(
                  color: colorScheme.onBackground,
                  fontWeight: FontWeight.w500,
@@ -512,7 +513,7 @@ class _LoginScreenState extends State<LoginScreen> {
                controller: _serverUrlController,
                style: TextStyle(color: colorScheme.onSurface),
                decoration: InputDecoration(
-                  hintText: 'e.g., music.example.com or 192.168.1.100',
+                  hintText: S.of(context)!.serverAddressHint,
                  hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                  filled: true,
                  fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -539,7 +540,7 @@ class _LoginScreenState extends State<LoginScreen> {
              if (_detectedAuthStrategy != null &&
                  _detectedAuthStrategy!.name != 'music_assistant') ...[
                Text(
-                  'Your Name',
+                  S.of(context)!.yourName,
                  style: textTheme.titleMedium?.copyWith(
                    color: colorScheme.onBackground,
                    fontWeight: FontWeight.w500,
@@ -551,7 +552,7 @@ class _LoginScreenState extends State<LoginScreen> {
                  controller: _ownerNameController,
                  style: TextStyle(color: colorScheme.onSurface),
                  decoration: InputDecoration(
-                    hintText: 'Your first name',
+                    hintText: S.of(context)!.yourFirstName,
                    hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                    filled: true,
                    fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -574,7 +575,7 @@ class _LoginScreenState extends State<LoginScreen> {

              // Port
              Text(
-                'Port (Optional)',
+                S.of(context)!.portOptional,
                style: textTheme.titleMedium?.copyWith(
                  color: colorScheme.onBackground,
                  fontWeight: FontWeight.w500,
@@ -582,7 +583,7 @@ class _LoginScreenState extends State<LoginScreen> {
              ),
              const SizedBox(height: 8),
              Text(
-                'Leave blank for reverse proxy or standard ports. Enter 8095 for direct connection.',
+                S.of(context)!.portDescription,
                style: TextStyle(
                  color: colorScheme.onBackground.withOpacity(0.6),
                  fontSize: 12,
@@ -594,7 +595,7 @@ class _LoginScreenState extends State<LoginScreen> {
                controller: _portController,
                style: TextStyle(color: colorScheme.onSurface),
                decoration: InputDecoration(
-                  hintText: 'e.g., 8095 or leave blank',
+                  hintText: S.of(context)!.portHint,
                  hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                  filled: true,
                  fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -639,7 +640,7 @@ class _LoginScreenState extends State<LoginScreen> {
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
-                              'Detected: $_detectedAuthType',
+                              S.of(context)!.detectedAuthType(_detectedAuthType!),
                              style: TextStyle(
                                color: needsAuth
                                    ? colorScheme.onPrimaryContainer
@@ -652,7 +653,7 @@ class _LoginScreenState extends State<LoginScreen> {
                              Padding(
                                padding: const EdgeInsets.only(top: 4),
                                child: Text(
-                                  'This server requires authentication',
+                                  S.of(context)!.serverRequiresAuth,
                                  style: TextStyle(
                                    color: colorScheme.onPrimaryContainer.withOpacity(0.7),
                                    fontSize: 12,
@@ -698,8 +699,8 @@ class _LoginScreenState extends State<LoginScreen> {
                          children: [
                            Text(
                              _isTailscaleUrl(_serverUrlController.text)
-                                  ? 'Tailscale VPN Connection'
-                                  : 'Unencrypted Connection',
+                                  ? S.of(context)!.tailscaleVpnConnection
+                                  : S.of(context)!.unencryptedConnection,
                              style: TextStyle(
                                color: _isTailscaleUrl(_serverUrlController.text)
                                    ? colorScheme.onSecondaryContainer
@@ -712,10 +713,10 @@ class _LoginScreenState extends State<LoginScreen> {
                              padding: const EdgeInsets.only(top: 4),
                              child: Text(
                                _isTailscaleUrl(_serverUrlController.text)
-                                    ? 'Using HTTP over Tailscale (encrypted tunnel)'
+                                    ? S.of(context)!.usingHttpOverTailscale
                                    : _usedHttpFallback
-                                        ? 'HTTPS failed, using HTTP fallback'
-                                        : 'HTTP connection - data is not encrypted',
+                                        ? S.of(context)!.httpsFailedUsingHttp
+                                        : S.of(context)!.httpNotEncrypted,
                                style: TextStyle(
                                  color: (_isTailscaleUrl(_serverUrlController.text)
                                      ? colorScheme.onSecondaryContainer
@@ -736,7 +737,7 @@ class _LoginScreenState extends State<LoginScreen> {
                // Auth Server URL (only for Authelia)
                if (_detectedAuthStrategy?.name == 'authelia') ...[
                  Text(
-                    'Auth Server URL (Optional)',
+                    S.of(context)!.authServerUrlOptional,
                    style: textTheme.titleMedium?.copyWith(
                      color: colorScheme.onBackground,
                      fontWeight: FontWeight.w500,
@@ -744,7 +745,7 @@ class _LoginScreenState extends State<LoginScreen> {
                  ),
                  const SizedBox(height: 8),
                  Text(
-                    'Leave empty if authentication is on the same server',
+                    S.of(context)!.authServerUrlDescription,
                    style: TextStyle(
                      color: colorScheme.onBackground.withOpacity(0.6),
                      fontSize: 12,
@@ -756,7 +757,7 @@ class _LoginScreenState extends State<LoginScreen> {
                    controller: _authServerUrlController,
                    style: TextStyle(color: colorScheme.onSurface),
                    decoration: InputDecoration(
-                      hintText: 'e.g., auth.example.com (if different from server)',
+                      hintText: S.of(context)!.authServerUrlHint,
                      hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                      filled: true,
                      fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -777,7 +778,7 @@ class _LoginScreenState extends State<LoginScreen> {
                ],

                Text(
-                  'Username',
+                  S.of(context)!.username,
                  style: textTheme.titleMedium?.copyWith(
                    color: colorScheme.onBackground,
                    fontWeight: FontWeight.w500,
@@ -790,7 +791,7 @@ class _LoginScreenState extends State<LoginScreen> {
                  focusNode: _usernameFocusNode,
                  style: TextStyle(color: colorScheme.onSurface),
                  decoration: InputDecoration(
-                    hintText: 'Username',
+                    hintText: S.of(context)!.username,
                    hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                    filled: true,
                    fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -810,7 +811,7 @@ class _LoginScreenState extends State<LoginScreen> {
                const SizedBox(height: 16),

                Text(
-                  'Password',
+                  S.of(context)!.password,
                  style: textTheme.titleMedium?.copyWith(
                    color: colorScheme.onBackground,
                    fontWeight: FontWeight.w500,
@@ -822,7 +823,7 @@ class _LoginScreenState extends State<LoginScreen> {
                  controller: _passwordController,
                  style: TextStyle(color: colorScheme.onSurface),
                  decoration: InputDecoration(
-                    hintText: 'Password',
+                    hintText: S.of(context)!.password,
                    hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                    filled: true,
                    fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -912,9 +913,9 @@ class _LoginScreenState extends State<LoginScreen> {
                            ),
                          ),
                          const SizedBox(width: 12),
-                          const Text(
-                            'Detecting authentication...',
-                            style: TextStyle(
+                          Text(
+                            S.of(context)!.detectingAuth,
+                            style: const TextStyle(
                              fontSize: 16,
                              fontWeight: FontWeight.bold,
                            ),
@@ -931,7 +932,7 @@ class _LoginScreenState extends State<LoginScreen> {
                            ),
                          )
                        : Text(
-                            _detectedAuthStrategy == null ? 'Detect & Connect' : 'Connect',
+                            _detectedAuthStrategy == null ? S.of(context)!.detectAndConnect : S.of(context)!.connect,
                            style: const TextStyle(
                              fontSize: 16,
                              fontWeight: FontWeight.bold,
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/scheduler.dart';
 import 'package:provider/provider.dart';
+import '../l10n/app_localizations.dart';
 import '../providers/music_assistant_provider.dart';
 import '../services/settings_service.dart';
 import '../services/debug_logger.dart';
@@ -38,8 +39,8 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
  bool _showContinueListeningAudiobooks = false;
  bool _showDiscoverAudiobooks = false;
  bool _showDiscoverSeries = false;
-  // Random order for favorites (generated once per session)
-  late List<int> _favoritesOrder;
+  // Row order (loaded from settings)
+  List<String> _homeRowOrder = List.from(SettingsService.defaultHomeRowOrder);

  @override
  bool get wantKeepAlive => true;
@@ -48,8 +49,6 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
-    // Generate random order for favorites rows (0, 1, 2 shuffled)
-    _favoritesOrder = [0, 1, 2]..shuffle();
    _loadSettings();
  }

@@ -77,6 +76,7 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
    final showContAudiobooks = await SettingsService.getShowContinueListeningAudiobooks();
    final showDiscAudiobooks = await SettingsService.getShowDiscoverAudiobooks();
    final showDiscSeries = await SettingsService.getShowDiscoverSeries();
+    final rowOrder = await SettingsService.getHomeRowOrder();
    if (mounted) {
      setState(() {
        _showRecentAlbums = showRecent;
@@ -88,6 +88,7 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
        _showContinueListeningAudiobooks = showContAudiobooks;
        _showDiscoverAudiobooks = showDiscAudiobooks;
        _showDiscoverSeries = showDiscSeries;
+        _homeRowOrder = rowOrder;
      });
    }
  }
@@ -179,6 +180,7 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
            // Only show disconnected state if we have no cached data at all
            if (!isConnected && !syncService.hasCache) {
              return DisconnectedState.full(
+                context: context,
                onSettings: () => Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => const SettingsScreen()),
@@ -186,43 +188,47 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
              );
            }

-            return Column(
+            return Stack(
              children: [
-                // Connecting banner when showing cached data
-                if (!isConnected && syncService.hasCache)
-                  Container(
-                    width: double.infinity,
-                    padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-                    color: colorScheme.primaryContainer.withOpacity(0.5),
-                    child: Row(
-                      mainAxisAlignment: MainAxisAlignment.center,
-                      children: [
-                        SizedBox(
-                          width: 12,
-                          height: 12,
-                          child: CircularProgressIndicator(
-                            strokeWidth: 2,
-                            color: colorScheme.primary,
+                // Main content
+                RefreshIndicator(
+                  onRefresh: _onRefresh,
+                  color: colorScheme.primary,
+                  backgroundColor: colorScheme.surface,
+                  child: _buildConnectedView(context, maProvider),
+                ),
+                // Connecting banner overlay (doesn't affect layout)
+                // Hide when we have cached players - UI is functional during background reconnect
+                if (!isConnected && syncService.hasCache && !maProvider.hasCachedPlayers)
+                  Positioned(
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    child: Container(
+                      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
+                      color: colorScheme.primaryContainer.withOpacity(0.9),
+                      child: Row(
+                        mainAxisAlignment: MainAxisAlignment.center,
+                        children: [
+                          SizedBox(
+                            width: 12,
+                            height: 12,
+                            child: CircularProgressIndicator(
+                              strokeWidth: 2,
+                              color: colorScheme.primary,
+                            ),
                          ),
-                        ),
-                        const SizedBox(width: 8),
-                        Text(
-                          'Connecting...',
-                          style: Theme.of(context).textTheme.bodySmall?.copyWith(
-                            color: colorScheme.onPrimaryContainer,
+                          const SizedBox(width: 8),
+                          Text(
+                            S.of(context)!.connecting,
+                            style: Theme.of(context).textTheme.bodySmall?.copyWith(
+                              color: colorScheme.onPrimaryContainer,
+                            ),
                          ),
-                        ),
-                      ],
+                        ],
+                      ),
                    ),
                  ),
-                Expanded(
-                  child: RefreshIndicator(
-                    onRefresh: _onRefresh,
-                    color: colorScheme.primary,
-                    backgroundColor: colorScheme.surface,
-                    child: _buildConnectedView(context, maProvider),
-                  ),
-                ),
              ],
            );
          },
@@ -242,9 +248,6 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
        final availableHeight = constraints.maxHeight - BottomSpacing.withMiniPlayer;
        final rowHeight = availableHeight / 3;

-        // Build favorites rows in random order
-        final favoritesWidgets = _buildFavoritesRows(provider, rowHeight);
-
        // Use Android 12+ stretch overscroll effect
        return NotificationListener<ScrollNotification>(
          onNotification: (notification) {
@@ -269,64 +272,7 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
              child: Column(
                key: _refreshKey,
                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  // Recently played albums (optional)
-                  if (_showRecentAlbums)
-                    AlbumRow(
-                      key: const ValueKey('recent-albums'),
-                      title: 'Recently Played',
-                      loadAlbums: () => provider.getRecentAlbumsWithCache(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Discover Artists (optional)
-                  if (_showDiscoverArtists)
-                    ArtistRow(
-                      key: const ValueKey('discover-artists'),
-                      title: 'Discover Artists',
-                      loadArtists: () => provider.getDiscoverArtistsWithCache(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Discover Albums (optional)
-                  if (_showDiscoverAlbums)
-                    AlbumRow(
-                      key: const ValueKey('discover-albums'),
-                      title: 'Discover Albums',
-                      loadAlbums: () => provider.getDiscoverAlbumsWithCache(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Continue Listening Audiobooks (optional)
-                  if (_showContinueListeningAudiobooks)
-                    AudiobookRow(
-                      key: const ValueKey('continue-listening-audiobooks'),
-                      title: 'Continue Listening',
-                      loadAudiobooks: () => provider.getInProgressAudiobooks(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Discover Audiobooks (optional)
-                  if (_showDiscoverAudiobooks)
-                    AudiobookRow(
-                      key: const ValueKey('discover-audiobooks'),
-                      title: 'Discover Audiobooks',
-                      loadAudiobooks: () => provider.getDiscoverAudiobooks(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Discover Series (optional)
-                  if (_showDiscoverSeries)
-                    SeriesRow(
-                      key: const ValueKey('discover-series'),
-                      title: 'Discover Series',
-                      loadSeries: () => provider.getDiscoverSeries(),
-                      rowHeight: rowHeight,
-                    ),
-
-                  // Favorites rows in random order
-                  ...favoritesWidgets,
-                ],
+                children: _buildOrderedRows(provider, rowHeight),
              ),
            ),
          ),
@@ -335,51 +281,98 @@ class _NewHomeScreenState extends State<NewHomeScreen> with AutomaticKeepAliveCl
    );
  }

-  /// Build favorites rows in random order (order set once per session)
-  List<Widget> _buildFavoritesRows(MusicAssistantProvider provider, double rowHeight) {
-    // Create list of enabled favorites with their order index
-    final enabledFavorites = <MapEntry<int, Widget>>[];
+  /// Build rows in the user's configured order
+  List<Widget> _buildOrderedRows(MusicAssistantProvider provider, double rowHeight) {
+    final rows = <Widget>[];

-    if (_showFavoriteAlbums) {
-      enabledFavorites.add(MapEntry(
-        _favoritesOrder[0],
-        AlbumRow(
+    for (final rowId in _homeRowOrder) {
+      final widget = _buildRowWidget(rowId, provider, rowHeight);
+      if (widget != null) {
+        rows.add(widget);
+      }
+    }
+
+    return rows;
+  }
+
+  /// Build a single row widget by ID, returns null if row is disabled
+  Widget? _buildRowWidget(String rowId, MusicAssistantProvider provider, double rowHeight) {
+    switch (rowId) {
+      case 'recent-albums':
+        if (!_showRecentAlbums) return null;
+        return AlbumRow(
+          key: const ValueKey('recent-albums'),
+          title: S.of(context)!.recentlyPlayed,
+          loadAlbums: () => provider.getRecentAlbumsWithCache(),
+          rowHeight: rowHeight,
+        );
+      case 'discover-artists':
+        if (!_showDiscoverArtists) return null;
+        return ArtistRow(
+          key: const ValueKey('discover-artists'),
+          title: S.of(context)!.discoverArtists,
+          loadArtists: () => provider.getDiscoverArtistsWithCache(),
+          rowHeight: rowHeight,
+        );
+      case 'discover-albums':
+        if (!_showDiscoverAlbums) return null;
+        return AlbumRow(
+          key: const ValueKey('discover-albums'),
+          title: S.of(context)!.discoverAlbums,
+          loadAlbums: () => provider.getDiscoverAlbumsWithCache(),
+          rowHeight: rowHeight,
+        );
+      case 'continue-listening':
+        if (!_showContinueListeningAudiobooks) return null;
+        return AudiobookRow(
+          key: const ValueKey('continue-listening'),
+          title: S.of(context)!.continueListening,
+          loadAudiobooks: () => provider.getInProgressAudiobooks(),
+          rowHeight: rowHeight,
+        );
+      case 'discover-audiobooks':
+        if (!_showDiscoverAudiobooks) return null;
+        return AudiobookRow(
+          key: const ValueKey('discover-audiobooks'),
+          title: S.of(context)!.discoverAudiobooks,
+          loadAudiobooks: () => provider.getDiscoverAudiobooks(),
+          rowHeight: rowHeight,
+        );
+      case 'discover-series':
+        if (!_showDiscoverSeries) return null;
+        return SeriesRow(
+          key: const ValueKey('discover-series'),
+          title: S.of(context)!.discoverSeries,
+          loadSeries: () => provider.getDiscoverSeries(),
+          rowHeight: rowHeight,
+        );
+      case 'favorite-albums':
+        if (!_showFavoriteAlbums) return null;
+        return AlbumRow(
          key: const ValueKey('favorite-albums'),
-          title: 'Favorite Albums',
+          title: S.of(context)!.favoriteAlbums,
          loadAlbums: () => provider.getFavoriteAlbums(),
          rowHeight: rowHeight,
-        ),
-      ));
-    }
-
-    if (_showFavoriteArtists) {
-      enabledFavorites.add(MapEntry(
-        _favoritesOrder[1],
-        ArtistRow(
+        );
+      case 'favorite-artists':
+        if (!_showFavoriteArtists) return null;
+        return ArtistRow(
          key: const ValueKey('favorite-artists'),
-          title: 'Favorite Artists',
+          title: S.of(context)!.favoriteArtists,
          loadArtists: () => provider.getFavoriteArtists(),
          rowHeight: rowHeight,
-        ),
-      ));
-    }
-
-    if (_showFavoriteTracks) {
-      enabledFavorites.add(MapEntry(
-        _favoritesOrder[2],
-        TrackRow(
+        );
+      case 'favorite-tracks':
+        if (!_showFavoriteTracks) return null;
+        return TrackRow(
          key: const ValueKey('favorite-tracks'),
-          title: 'Favorite Tracks',
+          title: S.of(context)!.favoriteTracks,
          loadTracks: () => provider.getFavoriteTracks(),
          rowHeight: rowHeight,
-        ),
-      ));
+        );
+      default:
+        return null;
    }
-
-    // Sort by the random order index
-    enabledFavorites.sort((a, b) => a.key.compareTo(b.key));
-
-    return enabledFavorites.map((e) => e.value).toList();
  }
 }

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
+import 'package:palette_generator/palette_generator.dart';
 import '../providers/music_assistant_provider.dart';
 import '../models/media_item.dart';
 import '../widgets/global_player_overlay.dart';
@@ -17,6 +18,7 @@ import '../services/settings_service.dart';
 import '../services/metadata_service.dart';
 import '../services/debug_logger.dart';
 import '../services/sync_service.dart';
+import '../l10n/app_localizations.dart';
 import 'album_details_screen.dart';
 import 'artist_details_screen.dart';
 import 'playlist_details_screen.dart';
@@ -68,6 +70,10 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  // Series book covers cache: seriesId -> list of book thumbnail URLs
  final Map<String, List<String>> _seriesBookCovers = {};
  final Set<String> _seriesCoversLoading = {};
+  // Series extracted colors cache: seriesId -> list of colors from book covers
+  final Map<String, List<Color>> _seriesExtractedColors = {};
+  // Series book counts cache: seriesId -> number of books
+  final Map<String, int> _seriesBookCounts = {};
  bool _seriesLoaded = false;

  // Restoration: Remember selected tab across app restarts
@@ -577,8 +583,12 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        if (mounted) {
          setState(() {
            _seriesBookCovers[seriesId] = covers;
+            _seriesBookCounts[seriesId] = books.length;
            _seriesCoversLoading.remove(seriesId);
          });
+
+          // Extract colors from covers asynchronously (don't block UI)
+          _extractSeriesColors(seriesId, covers);
        }
      }
    } catch (e) {
@@ -587,6 +597,47 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    }
  }

+  /// Extract dominant colors from series book covers for empty cell backgrounds
+  Future<void> _extractSeriesColors(String seriesId, List<String> coverUrls) async {
+    if (coverUrls.isEmpty) return;
+
+    final extractedColors = <Color>[];
+
+    // Extract colors from first few covers (limit to avoid too much processing)
+    for (final url in coverUrls.take(4)) {
+      try {
+        final palette = await PaletteGenerator.fromImageProvider(
+          CachedNetworkImageProvider(url),
+          maximumColorCount: 8,
+        );
+
+        // Get dark muted colors for grid squares (matches the aesthetic)
+        if (palette.darkMutedColor != null) {
+          extractedColors.add(palette.darkMutedColor!.color);
+        }
+        if (palette.mutedColor != null) {
+          extractedColors.add(palette.mutedColor!.color);
+        }
+        if (palette.darkVibrantColor != null) {
+          extractedColors.add(palette.darkVibrantColor!.color);
+        }
+        if (palette.dominantColor != null) {
+          // Darken the dominant color for better appearance
+          final hsl = HSLColor.fromColor(palette.dominantColor!.color);
+          extractedColors.add(hsl.withLightness((hsl.lightness * 0.4).clamp(0.1, 0.3)).toColor());
+        }
+      } catch (e) {
+        _logger.log('📚 Error extracting colors from $url: $e');
+      }
+    }
+
+    if (extractedColors.isNotEmpty && mounted) {
+      setState(() {
+        _seriesExtractedColors[seriesId] = extractedColors;
+      });
+    }
+  }
+
  void _toggleFavoritesMode(bool value) {
    setState(() {
      _showFavoritesOnly = value;
@@ -602,6 +653,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>

  @override
  Widget build(BuildContext context) {
+    final l10n = S.of(context)!;
+
    // Use Selector for targeted rebuilds - only rebuild when connection state changes
    return Selector<MusicAssistantProvider, bool>(
      selector: (_, provider) => provider.isConnected,
@@ -619,7 +672,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              backgroundColor: Colors.transparent,
              elevation: 0,
              title: Text(
-                'Library',
+                l10n.library,
                style: textTheme.titleLarge?.copyWith(
                  color: colorScheme.onBackground,
                  fontWeight: FontWeight.w300,
@@ -629,6 +682,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              actions: const [PlayerSelector()],
            ),
            body: DisconnectedState.withSettingsAction(
+              context: context,
              onSettings: () => Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => const SettingsScreen()),
@@ -677,7 +731,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                          indicatorWeight: 3,
                          labelStyle: const TextStyle(fontWeight: FontWeight.w600, fontSize: 14),
                          unselectedLabelStyle: const TextStyle(fontWeight: FontWeight.w400, fontSize: 14),
-                          tabs: _buildTabs(),
+                          tabs: _buildTabs(l10n),
                        ),
                      ),
                      // Favorites + Layout buttons on the right
@@ -688,7 +742,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                          size: 20,
                        ),
                        onPressed: () => _toggleFavoritesMode(!_showFavoritesOnly),
-                        tooltip: _showFavoritesOnly ? 'Show all' : 'Show favorites only',
+                        tooltip: _showFavoritesOnly ? l10n.showAll : l10n.showFavoritesOnly,
                        visualDensity: VisualDensity.compact,
                        padding: EdgeInsets.zero,
                        constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
@@ -700,7 +754,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                          size: 20,
                        ),
                        onPressed: _cycleCurrentViewMode,
-                        tooltip: 'Change view',
+                        tooltip: l10n.changeView,
                        visualDensity: VisualDensity.compact,
                        padding: EdgeInsets.zero,
                        constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
@@ -715,7 +769,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
          body: Column(
            children: [
              // Connecting banner when showing cached data
-              if (!isConnected && syncService.hasCache)
+              // Hide when we have cached players - UI is functional during background reconnect
+              if (!isConnected && syncService.hasCache && !context.read<MusicAssistantProvider>().hasCachedPlayers)
                Container(
                  width: double.infinity,
                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
@@ -733,7 +788,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                      ),
                      const SizedBox(width: 8),
                      Text(
-                        'Connecting...',
+                        l10n.connecting,
                        style: textTheme.bodySmall?.copyWith(
                          color: colorScheme.onPrimaryContainer,
                        ),
@@ -744,7 +799,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              Expanded(
                child: TabBarView(
                  controller: _tabController,
-                  children: _buildTabViews(context),
+                  children: _buildTabViews(context, l10n),
                ),
              ),
            ],
@@ -808,54 +863,53 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  }

  // ============ CONTEXTUAL TABS ============
-  List<Tab> _buildTabs() {
+  List<Tab> _buildTabs(S l10n) {
    switch (_selectedMediaType) {
      case LibraryMediaType.music:
        return [
-          const Tab(text: 'Artists'),
-          const Tab(text: 'Albums'),
-          if (_showFavoritesOnly) const Tab(text: 'Tracks'),
-          const Tab(text: 'Playlists'),
+          Tab(text: l10n.artists),
+          Tab(text: l10n.albums),
+          if (_showFavoritesOnly) Tab(text: l10n.tracks),
+          Tab(text: l10n.playlists),
        ];
      case LibraryMediaType.books:
-        return const [
-          Tab(text: 'Authors'),
-          Tab(text: 'All Books'),
-          Tab(text: 'Series'),
+        return [
+          Tab(text: l10n.authors),
+          Tab(text: l10n.books),
+          Tab(text: l10n.series),
        ];
      case LibraryMediaType.podcasts:
-        return const [
-          Tab(text: 'Shows'),
+        return [
+          Tab(text: l10n.shows),
        ];
    }
  }

-  List<Widget> _buildTabViews(BuildContext context) {
+  List<Widget> _buildTabViews(BuildContext context, S l10n) {
    switch (_selectedMediaType) {
      case LibraryMediaType.music:
        return [
-          _buildArtistsTab(context),
-          _buildAlbumsTab(context),
-          if (_showFavoritesOnly) _buildTracksTab(context),
-          _buildPlaylistsTab(context),
+          _buildArtistsTab(context, l10n),
+          _buildAlbumsTab(context, l10n),
+          if (_showFavoritesOnly) _buildTracksTab(context, l10n),
+          _buildPlaylistsTab(context, l10n),
        ];
      case LibraryMediaType.books:
        return [
-          _buildBooksAuthorsTab(context),
-          _buildAllBooksTab(context),
-          _buildSeriesTab(context),
+          _buildBooksAuthorsTab(context, l10n),
+          _buildAllBooksTab(context, l10n),
+          _buildSeriesTab(context, l10n),
        ];
      case LibraryMediaType.podcasts:
        return [
-          _buildPodcastsComingSoonTab(context),
+          _buildPodcastsComingSoonTab(context, l10n),
        ];
    }
  }

  // ============ BOOKS TABS ============
-  Widget _buildBooksAuthorsTab(BuildContext context) {
+  Widget _buildBooksAuthorsTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
-    final textTheme = Theme.of(context).textTheme;

    if (_isLoadingAudiobooks) {
      return Center(child: CircularProgressIndicator(color: colorScheme.primary));
@@ -869,15 +923,17 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    if (audiobooks.isEmpty) {
      if (_showFavoritesOnly) {
        return EmptyState.custom(
+          context: context,
          icon: Icons.favorite_border,
-          title: 'No favorite audiobooks',
-          subtitle: 'Tap the heart on an audiobook to add it to favorites',
+          title: l10n.noFavoriteAudiobooks,
+          subtitle: l10n.tapHeartAudiobook,
        );
      }
      return EmptyState.custom(
+        context: context,
        icon: MdiIcons.bookOutline,
-        title: 'No audiobooks',
-        subtitle: 'Add audiobooks to your library to see them here',
+        title: l10n.noAudiobooks,
+        subtitle: l10n.addAudiobooksHint,
        onRefresh: () => _loadAudiobooks(),
      );
    }
@@ -906,7 +962,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              itemCount: sortedAuthors.length,
              padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.withMiniPlayer),
              itemBuilder: (context, index) {
-                return _buildAuthorListTile(sortedAuthors[index], authorMap[sortedAuthors[index]]!);
+                return _buildAuthorListTile(sortedAuthors[index], authorMap[sortedAuthors[index]]!, l10n);
              },
            )
          : GridView.builder(
@@ -923,13 +979,13 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              ),
              itemCount: sortedAuthors.length,
              itemBuilder: (context, index) {
-                return _buildAuthorCard(sortedAuthors[index], authorMap[sortedAuthors[index]]!);
+                return _buildAuthorCard(sortedAuthors[index], authorMap[sortedAuthors[index]]!, l10n);
              },
            ),
    );
  }

-  Widget _buildAuthorListTile(String authorName, List<Audiobook> books) {
+  Widget _buildAuthorListTile(String authorName, List<Audiobook> books, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;
    final authorImageUrl = _authorImages[authorName];
@@ -986,7 +1042,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        overflow: TextOverflow.ellipsis,
      ),
      subtitle: Text(
-        '${books.length} ${books.length == 1 ? 'audiobook' : 'audiobooks'}',
+        '${books.length} ${books.length == 1 ? l10n.audiobookSingular : l10n.audiobooks}',
        style: textTheme.bodySmall?.copyWith(
          color: colorScheme.onSurface.withOpacity(0.6),
        ),
@@ -995,7 +1051,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

-  Widget _buildAuthorCard(String authorName, List<Audiobook> books) {
+  Widget _buildAuthorCard(String authorName, List<Audiobook> books, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;
    final authorImageUrl = _authorImages[authorName];
@@ -1182,7 +1238,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

-  Widget _buildAllBooksTab(BuildContext context) {
+  Widget _buildAllBooksTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    final maProvider = context.read<MusicAssistantProvider>();

@@ -1198,15 +1254,17 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    if (audiobooks.isEmpty) {
      if (_showFavoritesOnly) {
        return EmptyState.custom(
+          context: context,
          icon: Icons.favorite_border,
-          title: 'No favorite audiobooks',
-          subtitle: 'Tap the heart on an audiobook to add it to favorites',
+          title: l10n.noFavoriteAudiobooks,
+          subtitle: l10n.tapHeartAudiobook,
        );
      }
      return EmptyState.custom(
+        context: context,
        icon: MdiIcons.bookOutline,
-        title: 'No audiobooks',
-        subtitle: 'Add audiobooks to your library to see them here',
+        title: l10n.noAudiobooks,
+        subtitle: l10n.addAudiobooksHint,
        onRefresh: () => _loadAudiobooks(),
      );
    }
@@ -1355,7 +1413,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

-  Widget _buildSeriesTab(BuildContext context) {
+  Widget _buildSeriesTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;
    final maProvider = context.read<MusicAssistantProvider>();
@@ -1369,7 +1427,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
            CircularProgressIndicator(color: colorScheme.primary),
            const SizedBox(height: 16),
            Text(
-              'Loading series...',
+              l10n.loading,
              style: TextStyle(
                color: colorScheme.onSurface.withOpacity(0.6),
                fontSize: 14,
@@ -1402,7 +1460,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                      ),
                      const SizedBox(height: 16),
                      Text(
-                        'No Series Found',
+                        l10n.noSeriesFound,
                        style: TextStyle(
                          color: colorScheme.onSurface,
                          fontSize: 20,
@@ -1412,8 +1470,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                      const SizedBox(height: 8),
                      Text(
                        _seriesLoaded
-                            ? 'No series available from your audiobook library.\nPull to refresh.'
-                            : 'Pull down to load series\nfrom Music Assistant',
+                            ? l10n.noSeriesAvailable
+                            : l10n.pullToLoadSeries,
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          color: colorScheme.onSurface.withOpacity(0.6),
@@ -1423,7 +1481,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
                      const SizedBox(height: 24),
                      FilledButton.tonal(
                        onPressed: _loadSeries,
-                        child: const Text('Load Series'),
+                        child: Text(l10n.loadSeries),
                      ),
                    ],
                  ),
@@ -1447,7 +1505,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              itemCount: _series.length,
              padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.withMiniPlayer),
              itemBuilder: (context, index) {
-                return _buildSeriesListTile(context, _series[index], maProvider);
+                return _buildSeriesListTile(context, _series[index], maProvider, l10n);
              },
            )
          : GridView.builder(
@@ -1462,13 +1520,13 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              itemCount: _series.length,
              itemBuilder: (context, index) {
                final series = _series[index];
-                return _buildSeriesCard(context, series, maProvider, maxCoverGridSize: _seriesViewMode == 'grid3' ? 2 : 3);
+                return _buildSeriesCard(context, series, maProvider, l10n, maxCoverGridSize: _seriesViewMode == 'grid3' ? 2 : 3);
              },
            ),
    );
  }

-  Widget _buildSeriesListTile(BuildContext context, AudiobookSeries series, MusicAssistantProvider maProvider) {
+  Widget _buildSeriesListTile(BuildContext context, AudiobookSeries series, MusicAssistantProvider maProvider, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;

@@ -1481,32 +1539,36 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>

    final covers = _seriesBookCovers[series.id];
    final firstCover = covers != null && covers.isNotEmpty ? covers.first : null;
+    final heroTag = 'series_cover_${series.id}';

    return ListTile(
      contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
-      leading: ClipRRect(
-        borderRadius: BorderRadius.circular(4),
-        child: Container(
-          width: 56,
-          height: 56,
-          color: colorScheme.surfaceContainerHighest,
-          child: firstCover != null
-              ? CachedNetworkImage(
-                  imageUrl: firstCover,
-                  fit: BoxFit.cover,
-                  placeholder: (_, __) => Icon(
+      leading: Hero(
+        tag: heroTag,
+        child: ClipRRect(
+          borderRadius: BorderRadius.circular(4),
+          child: Container(
+            width: 56,
+            height: 56,
+            color: colorScheme.surfaceContainerHighest,
+            child: firstCover != null
+                ? CachedNetworkImage(
+                    imageUrl: firstCover,
+                    fit: BoxFit.cover,
+                    placeholder: (_, __) => Icon(
+                      Icons.collections_bookmark_rounded,
+                      color: colorScheme.onSurfaceVariant,
+                    ),
+                    errorWidget: (_, __, ___) => Icon(
+                      Icons.collections_bookmark_rounded,
+                      color: colorScheme.onSurfaceVariant,
+                    ),
+                  )
+                : Icon(
                    Icons.collections_bookmark_rounded,
                    color: colorScheme.onSurfaceVariant,
                  ),
-                  errorWidget: (_, __, ___) => Icon(
-                    Icons.collections_bookmark_rounded,
-                    color: colorScheme.onSurfaceVariant,
-                  ),
-                )
-              : Icon(
-                  Icons.collections_bookmark_rounded,
-                  color: colorScheme.onSurfaceVariant,
-                ),
+          ),
        ),
      ),
      title: Text(
@@ -1517,14 +1579,18 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        maxLines: 1,
        overflow: TextOverflow.ellipsis,
      ),
-      subtitle: series.bookCount != null
-          ? Text(
-              '${series.bookCount} ${series.bookCount == 1 ? 'book' : 'books'}',
-              style: textTheme.bodySmall?.copyWith(
-                color: colorScheme.onSurface.withOpacity(0.6),
-              ),
-            )
-          : null,
+      subtitle: Builder(
+        builder: (context) {
+          final count = series.bookCount ?? _seriesBookCounts[series.id];
+          if (count == null) return const SizedBox.shrink();
+          return Text(
+            '$count ${count == 1 ? l10n.book : l10n.books}',
+            style: textTheme.bodySmall?.copyWith(
+              color: colorScheme.onSurface.withOpacity(0.7),
+            ),
+          );
+        },
+      ),
      onTap: () {
        _logger.log('📚 Tapped series: ${series.name}, path: ${series.id}');
        Navigator.push(
@@ -1532,6 +1598,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
          MaterialPageRoute(
            builder: (context) => AudiobookSeriesScreen(
              series: series,
+              heroTag: heroTag,
+              initialCovers: covers,
            ),
          ),
        );
@@ -1539,7 +1607,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

-  Widget _buildSeriesCard(BuildContext context, AudiobookSeries series, MusicAssistantProvider maProvider, {int maxCoverGridSize = 3}) {
+  Widget _buildSeriesCard(BuildContext context, AudiobookSeries series, MusicAssistantProvider maProvider, S l10n, {int maxCoverGridSize = 3}) {
    final colorScheme = Theme.of(context).colorScheme;
    final textTheme = Theme.of(context).textTheme;

@@ -1553,6 +1621,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>

    // Matches books tab style - square artwork with text below
    final heroTag = 'series_cover_${series.id}';
+    final cachedCovers = _seriesBookCovers[series.id];
    return GestureDetector(
      onTap: () {
        _logger.log('📚 Tapped series: ${series.name}, path: ${series.id}');
@@ -1562,6 +1631,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
            builder: (context) => AudiobookSeriesScreen(
              series: series,
              heroTag: heroTag,
+              initialCovers: cachedCovers,
            ),
          ),
        );
@@ -1592,15 +1662,21 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
          ),
-          if (series.bookCount != null) ...[
-            const SizedBox(height: 2),
-            Text(
-              '${series.bookCount} book${series.bookCount == 1 ? '' : 's'}',
-              style: textTheme.bodySmall?.copyWith(
-                color: colorScheme.onSurface.withOpacity(0.6),
-              ),
-            ),
-          ],
+          Builder(
+            builder: (context) {
+              final count = series.bookCount ?? _seriesBookCounts[series.id];
+              if (count == null) return const SizedBox.shrink();
+              return Padding(
+                padding: const EdgeInsets.only(top: 2),
+                child: Text(
+                  '$count ${count == 1 ? l10n.book : l10n.books}',
+                  style: textTheme.bodySmall?.copyWith(
+                    color: colorScheme.onSurface.withOpacity(0.7),
+                  ),
+                ),
+              );
+            },
+          ),
        ],
      ),
    );
@@ -1626,8 +1702,9 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
      gridSize = gridSize.clamp(1, maxGridSize);
      final displayCovers = covers.take(gridSize * gridSize).toList();

-      // Dark pastel colors for empty cells - muted and book-like
-      const emptyColors = [
+      // Use extracted colors from book covers if available, otherwise fall back to static palette
+      final extractedColors = _seriesExtractedColors[series.id];
+      const fallbackColors = [
        Color(0xFF2D3436), // Dark slate
        Color(0xFF34495E), // Dark blue-grey
        Color(0xFF4A3728), // Dark brown
@@ -1637,6 +1714,9 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        Color(0xFF3E4A47), // Dark teal-grey
        Color(0xFF4A3F35), // Dark warm grey
      ];
+      final emptyColors = (extractedColors != null && extractedColors.isNotEmpty)
+          ? extractedColors
+          : fallbackColors;

      // Use series ID to pick consistent colors for this series
      final colorSeed = series.id.hashCode;
@@ -1650,12 +1730,9 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              children: List.generate(gridSize, (col) {
                final index = row * gridSize + col;
                if (index >= displayCovers.length) {
-                  // Empty cell - use dark pastel color
-                  final colorIndex = (colorSeed + index) % emptyColors.length;
+                  // Empty cell - use nested grid pattern
                  return Expanded(
-                    child: Container(
-                      color: emptyColors[colorIndex],
-                    ),
+                    child: _buildEmptyCell(colorSeed, index, emptyColors),
                  );
                }
                return Expanded(
@@ -1710,8 +1787,61 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

+  /// Builds an empty cell with either a solid color or a nested grid
+  /// The pattern is deterministic based on series ID and cell index
+  Widget _buildEmptyCell(int colorSeed, int cellIndex, List<Color> emptyColors) {
+    // Tone down colors - reduce saturation and darken
+    final colors = emptyColors.map((c) {
+      final hsl = HSLColor.fromColor(c);
+      return hsl
+          .withSaturation((hsl.saturation * 0.5).clamp(0.05, 0.25))
+          .withLightness((hsl.lightness * 0.7).clamp(0.08, 0.20))
+          .toColor();
+    }).toList();
+
+    // Use combined seed for deterministic but varied patterns
+    final seed = colorSeed + cellIndex * 17; // Prime multiplier for better distribution
+
+    // Determine nested grid size: 1 (solid), 2 (2x2), or 3 (3x3)
+    // Distribution: ~50% solid, ~30% 2x2, ~20% 3x3
+    final sizeRoll = seed.abs() % 100;
+    int nestedSize;
+    if (sizeRoll < 50) {
+      nestedSize = 1; // Solid color
+    } else if (sizeRoll < 80) {
+      nestedSize = 2; // 2x2 grid
+    } else {
+      nestedSize = 3; // 3x3 grid
+    }
+
+    if (nestedSize == 1) {
+      // Solid color
+      final colorIndex = seed.abs() % colors.length;
+      return Container(color: colors[colorIndex]);
+    }
+
+    // Build nested grid (no margins - seamless)
+    return Column(
+      children: List.generate(nestedSize, (row) {
+        return Expanded(
+          child: Row(
+            children: List.generate(nestedSize, (col) {
+              final nestedIndex = row * nestedSize + col;
+              // Use different seed for each nested cell
+              final nestedSeed = seed + nestedIndex * 7;
+              final colorIndex = nestedSeed.abs() % colors.length;
+              return Expanded(
+                child: Container(color: colors[colorIndex]),
+              );
+            }),
+          ),
+        );
+      }),
+    );
+  }
+
  // ============ PODCASTS TAB (Placeholder) ============
-  Widget _buildPodcastsComingSoonTab(BuildContext context) {
+  Widget _buildPodcastsComingSoonTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;
    return Center(
      child: Column(
@@ -1724,7 +1854,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
          ),
          const SizedBox(height: 16),
          Text(
-            'Podcasts',
+            l10n.podcasts,
            style: TextStyle(
              color: colorScheme.onSurface,
              fontSize: 20,
@@ -1733,7 +1863,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
          ),
          const SizedBox(height: 8),
          Text(
-            'Podcast support coming soon',
+            l10n.podcastSupportComingSoon,
            style: TextStyle(
              color: colorScheme.onSurface.withOpacity(0.6),
              fontSize: 14,
@@ -1745,7 +1875,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  }

  // ============ ARTISTS TAB ============
-  Widget _buildArtistsTab(BuildContext context) {
+  Widget _buildArtistsTab(BuildContext context, S l10n) {
    // Use Selector for targeted rebuilds - only rebuild when artists or loading state changes
    return Selector<MusicAssistantProvider, (List<Artist>, bool)>(
      selector: (_, provider) => (provider.artists, provider.isLoading),
@@ -1765,12 +1895,14 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        if (artists.isEmpty) {
          if (_showFavoritesOnly) {
            return EmptyState.custom(
+              context: context,
              icon: Icons.favorite_border,
-              title: 'No favorite artists',
-              subtitle: 'Tap the heart on an artist to add them to favorites',
+              title: l10n.noFavoriteArtists,
+              subtitle: l10n.tapHeartArtist,
            );
          }
          return EmptyState.artists(
+            context: context,
            onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
          );
        }
@@ -1928,7 +2060,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  }

  // ============ ALBUMS TAB ============
-  Widget _buildAlbumsTab(BuildContext context) {
+  Widget _buildAlbumsTab(BuildContext context, S l10n) {
    // Use Selector for targeted rebuilds - only rebuild when albums or loading state changes
    return Selector<MusicAssistantProvider, (List<Album>, bool)>(
      selector: (_, provider) => (provider.albums, provider.isLoading),
@@ -1948,12 +2080,14 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        if (albums.isEmpty) {
          if (_showFavoritesOnly) {
            return EmptyState.custom(
+              context: context,
              icon: Icons.favorite_border,
-              title: 'No favorite albums',
-              subtitle: 'Tap the heart on an album to add it to favorites',
+              title: l10n.noFavoriteAlbums,
+              subtitle: l10n.tapHeartAlbum,
            );
          }
          return EmptyState.albums(
+            context: context,
            onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
          );
        }
@@ -2062,7 +2196,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  }

  // ============ PLAYLISTS TAB ============
-  Widget _buildPlaylistsTab(BuildContext context) {
+  Widget _buildPlaylistsTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;

    if (_isLoadingPlaylists) {
@@ -2072,12 +2206,13 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    if (_playlists.isEmpty) {
      if (_showFavoritesOnly) {
        return EmptyState.custom(
+          context: context,
          icon: Icons.favorite_border,
-          title: 'No favorite playlists',
-          subtitle: 'Tap the heart on a playlist to add it to favorites',
+          title: l10n.noFavoritePlaylists,
+          subtitle: l10n.tapHeartPlaylist,
        );
      }
-      return EmptyState.playlists(onRefresh: () => _loadPlaylists());
+      return EmptyState.playlists(context: context, onRefresh: () => _loadPlaylists());
    }

    return RefreshIndicator(
@@ -2094,7 +2229,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.navBarOnly),
              itemBuilder: (context, index) {
                final playlist = _playlists[index];
-                return _buildPlaylistTile(context, playlist);
+                return _buildPlaylistTile(context, playlist, l10n);
              },
            )
          : GridView.builder(
@@ -2112,13 +2247,13 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
              itemCount: _playlists.length,
              itemBuilder: (context, index) {
                final playlist = _playlists[index];
-                return _buildPlaylistGridCard(context, playlist);
+                return _buildPlaylistGridCard(context, playlist, l10n);
              },
            ),
    );
  }

-  Widget _buildPlaylistTile(BuildContext context, Playlist playlist) {
+  Widget _buildPlaylistTile(BuildContext context, Playlist playlist, S l10n) {
    final provider = context.read<MusicAssistantProvider>();
    final imageUrl = provider.api?.getImageUrl(playlist, size: 128);
    final colorScheme = Theme.of(context).colorScheme;
@@ -2152,8 +2287,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
      ),
      subtitle: Text(
        playlist.trackCount != null
-            ? '${playlist.trackCount} tracks'
-            : playlist.owner ?? 'Playlist',
+            ? '${playlist.trackCount} ${l10n.tracks}'
+            : playlist.owner ?? l10n.playlist,
        style: textTheme.bodySmall?.copyWith(color: colorScheme.onSurface.withOpacity(0.7)),
        maxLines: 1,
        overflow: TextOverflow.ellipsis,
@@ -2177,7 +2312,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
    );
  }

-  Widget _buildPlaylistGridCard(BuildContext context, Playlist playlist) {
+  Widget _buildPlaylistGridCard(BuildContext context, Playlist playlist, S l10n) {
    final provider = context.read<MusicAssistantProvider>();
    final imageUrl = provider.api?.getImageUrl(playlist, size: 256);
    final colorScheme = Theme.of(context).colorScheme;
@@ -2241,8 +2376,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
          ),
          Text(
            playlist.trackCount != null
-                ? '${playlist.trackCount} tracks'
-                : playlist.owner ?? 'Playlist',
+                ? '${playlist.trackCount} ${l10n.tracks}'
+                : playlist.owner ?? l10n.playlist,
            style: textTheme.bodySmall?.copyWith(
              color: colorScheme.onSurface.withOpacity(0.7),
            ),
@@ -2255,7 +2390,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
  }

  // ============ TRACKS TAB (favorites only) ============
-  Widget _buildTracksTab(BuildContext context) {
+  Widget _buildTracksTab(BuildContext context, S l10n) {
    final colorScheme = Theme.of(context).colorScheme;

    if (_isLoadingTracks) {
@@ -2264,9 +2399,10 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>

    if (_favoriteTracks.isEmpty) {
      return EmptyState.custom(
+        context: context,
        icon: Icons.favorite_border,
-        title: 'No favorite tracks',
-        subtitle: 'Long-press a track and tap the heart to add it to favorites',
+        title: l10n.noFavoriteTracks,
+        subtitle: l10n.longPressTrackHint,
      );
    }

@@ -2352,7 +2488,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
        final player = maProvider.selectedPlayer;
        if (player == null) {
          ScaffoldMessenger.of(context).showSnackBar(
-            const SnackBar(content: Text('No player selected')),
+            SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
          );
          return;
        }
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../l10n/app_localizations.dart';
 import '../models/media_item.dart';
 import '../providers/music_assistant_provider.dart';
 import '../services/debug_logger.dart';
@@ -61,7 +62,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
      // Use the selected player
      final player = maProvider.selectedPlayer;
      if (player == null) {
-        _showError('No player selected');
+        _showError(S.of(context)!.noPlayerSelected);
        return;
      }

@@ -77,7 +78,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Playing ${widget.playlist.name}'),
+            content: Text(S.of(context)!.playing(widget.playlist.name)),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -195,7 +196,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
                    child: ElevatedButton.icon(
                      onPressed: _isLoading ? null : _playPlaylist,
                      icon: const Icon(Icons.play_arrow_rounded),
-                      label: const Text('Play'),
+                      label: Text(S.of(context)!.play),
                      style: ElevatedButton.styleFrom(
                        backgroundColor: Colors.white,
                        foregroundColor: const Color(0xFF1a1a1a),
@@ -208,9 +209,9 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
                  ),
                  const SizedBox(height: 24),
                  // Tracks header
-                  const Text(
-                    'Tracks',
-                    style: TextStyle(
+                  Text(
+                    S.of(context)!.tracks,
+                    style: const TextStyle(
                      color: Colors.white,
                      fontSize: 18,
                      fontWeight: FontWeight.bold,
@@ -230,7 +231,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
                  ? SliverFillRemaining(
                      child: Center(
                        child: Text(
-                          'No tracks in playlist',
+                          S.of(context)!.noTracksInPlaylist,
                          style: TextStyle(
                            color: Colors.grey[600],
                            fontSize: 16,
@@ -327,7 +328,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
        onPressed: () async {
          final player = maProvider.selectedPlayer;
          if (player == null) {
-            _showError('No player selected');
+            _showError(S.of(context)!.noPlayerSelected);
            return;
          }

@@ -336,9 +337,9 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
            await maProvider.playTracks(player.playerId, _tracks, startIndex: index);
            if (mounted) {
              ScaffoldMessenger.of(context).showSnackBar(
-                const SnackBar(
-                  content: Text('Playing track'),
-                  duration: Duration(seconds: 1),
+                SnackBar(
+                  content: Text(S.of(context)!.playingTrack),
+                  duration: const Duration(seconds: 1),
                ),
              );
            }
@@ -4,6 +4,7 @@ import '../providers/music_assistant_provider.dart';
 import '../models/player.dart';
 import '../services/debug_logger.dart';
 import '../widgets/common/empty_state.dart';
+import '../l10n/app_localizations.dart';

 class QueueScreen extends StatefulWidget {
  const QueueScreen({super.key});
@@ -51,7 +52,7 @@ class _QueueScreenState extends State<QueueScreen> {
        if (mounted) {
          setState(() {
            _isLoading = false;
-            _error = 'No player selected';
+            _error = S.of(context)!.noPlayerSelected;
          });
        }
      }
@@ -77,7 +78,7 @@ class _QueueScreenState extends State<QueueScreen> {
        backgroundColor: Colors.transparent,
        elevation: 0,
        title: Text(
-          player != null ? '${player.name} Queue' : 'Queue',
+          player != null ? S.of(context)!.playerQueue(player.name) : S.of(context)!.queue,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 20,
@@ -116,7 +117,7 @@ class _QueueScreenState extends State<QueueScreen> {
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: _loadQueue,
-              child: const Text('Retry'),
+              child: Text(S.of(context)!.retry),
            ),
          ],
        ),
@@ -131,7 +132,7 @@ class _QueueScreenState extends State<QueueScreen> {
            Icon(Icons.speaker_group, size: 64, color: Colors.grey[700]),
            const SizedBox(height: 16),
            Text(
-              'No player selected',
+              S.of(context)!.noPlayerSelected,
              style: TextStyle(color: Colors.grey[600], fontSize: 18),
            ),
          ],
@@ -140,7 +141,7 @@ class _QueueScreenState extends State<QueueScreen> {
    }

    if (_queue == null || _queue!.items.isEmpty) {
-      return EmptyState.queue();
+      return EmptyState.queue(context: context);
    }

    // Filter to show only current and upcoming items (not history)
@@ -148,9 +149,9 @@ class _QueueScreenState extends State<QueueScreen> {
    final upcomingItems = _queue!.items.sublist(currentIndex);

    if (upcomingItems.isEmpty) {
-      return const EmptyState(
+      return EmptyState(
        icon: Icons.queue_music,
-        message: 'No upcoming tracks',
+        message: S.of(context)!.noUpcomingTracks,
      );
    }

@@ -220,9 +221,9 @@ class _QueueScreenState extends State<QueueScreen> {

        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Removed ${item.track.name}'),
+            content: Text(S.of(context)!.removedItem(item.track.name)),
            action: SnackBarAction(
-              label: 'Undo',
+              label: S.of(context)!.undo,
              onPressed: () {
                setState(() {
                  _queue!.items.insert(index, item);
@@ -12,6 +12,7 @@ import '../widgets/common/disconnected_state.dart';
 import '../widgets/artist_avatar.dart';
 import 'album_details_screen.dart';
 import 'artist_details_screen.dart';
+import '../l10n/app_localizations.dart';

 class SearchScreen extends StatefulWidget {
  const SearchScreen({super.key});
@@ -140,7 +141,7 @@ class SearchScreenState extends State<SearchScreen> {
        setState(() {
          _isSearching = false;
          _hasSearched = true;
-          _searchError = 'Search failed. Please check your connection.';
+          _searchError = S.of(context)!.searchFailed;
        });
        if (keepFocus && _focusNode.hasFocus) {
          _focusNode.requestFocus();
@@ -166,7 +167,7 @@ class SearchScreenState extends State<SearchScreen> {
          cursorColor: colorScheme.primary,
          textInputAction: TextInputAction.search,
          decoration: InputDecoration(
-            hintText: 'Search music...',
+            hintText: S.of(context)!.searchMusic,
            hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.5)),
            border: InputBorder.none,
            suffixIcon: _searchController.text.isNotEmpty
@@ -191,7 +192,7 @@ class SearchScreenState extends State<SearchScreen> {
        ),
      ),
      body: !maProvider.isConnected
-          ? DisconnectedState.simple()
+          ? DisconnectedState.simple(context)
          : _buildSearchContent(),
    );
  }
@@ -217,7 +218,7 @@ class SearchScreenState extends State<SearchScreen> {
            ),
            const SizedBox(height: 16),
            Text(
-              'Search for artists, albums, or tracks',
+              S.of(context)!.searchForContent,
              style: TextStyle(
                color: colorScheme.onBackground.withOpacity(0.5),
                fontSize: 16,
@@ -250,7 +251,7 @@ class SearchScreenState extends State<SearchScreen> {
            const SizedBox(height: 16),
            FilledButton.tonal(
              onPressed: () => _performSearch(_searchController.text),
-              child: const Text('Retry'),
+              child: Text(S.of(context)!.retry),
            ),
          ],
        ),
@@ -264,7 +265,7 @@ class SearchScreenState extends State<SearchScreen> {
    final hasResults = artists.isNotEmpty || albums.isNotEmpty || tracks.isNotEmpty;

    if (!hasResults) {
-      return EmptyState.search();
+      return EmptyState.search(context: context);
    }

    return Column(
@@ -275,23 +276,23 @@ class SearchScreenState extends State<SearchScreen> {
          padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
          child: Row(
            children: [
-              _buildFilterChip('All', 'all'),
+              _buildFilterChip(S.of(context)!.all, 'all'),
              const SizedBox(width: 8),
              if (artists.isNotEmpty) ...[
-                _buildFilterChip('Artists', 'artists'),
+                _buildFilterChip(S.of(context)!.artists, 'artists'),
                const SizedBox(width: 8),
              ],
              if (albums.isNotEmpty) ...[
-                _buildFilterChip('Albums', 'albums'),
+                _buildFilterChip(S.of(context)!.albums, 'albums'),
                const SizedBox(width: 8),
              ],
              if (tracks.isNotEmpty) ...[
-                _buildFilterChip('Tracks', 'tracks'),
+                _buildFilterChip(S.of(context)!.tracks, 'tracks'),
              ],
            ],
          ),
        ),
-        
+
        // Results
        Expanded(
          child: Builder(
@@ -336,7 +337,7 @@ class SearchScreenState extends State<SearchScreen> {
    // Add artists section
    if ((_activeFilter == 'all' || _activeFilter == 'artists') && artists.isNotEmpty) {
      if (_activeFilter == 'all') {
-        items.add(_ListItem.header('Artists', artists.length));
+        items.add(_ListItem.header(S.of(context)!.artists, artists.length));
      }
      for (final artist in artists) {
        items.add(_ListItem.artist(artist));
@@ -347,7 +348,7 @@ class SearchScreenState extends State<SearchScreen> {
    // Add albums section
    if ((_activeFilter == 'all' || _activeFilter == 'albums') && albums.isNotEmpty) {
      if (_activeFilter == 'all') {
-        items.add(_ListItem.header('Albums', albums.length));
+        items.add(_ListItem.header(S.of(context)!.albums, albums.length));
      }
      for (final album in albums) {
        items.add(_ListItem.album(album));
@@ -358,7 +359,7 @@ class SearchScreenState extends State<SearchScreen> {
    // Add tracks section
    if ((_activeFilter == 'all' || _activeFilter == 'tracks') && tracks.isNotEmpty) {
      if (_activeFilter == 'all') {
-        items.add(_ListItem.header('Tracks', tracks.length));
+        items.add(_ListItem.header(S.of(context)!.tracks, tracks.length));
      }
      for (final track in tracks) {
        items.add(_ListItem.track(track));
@@ -428,7 +429,7 @@ class SearchScreenState extends State<SearchScreen> {
        overflow: TextOverflow.ellipsis,
      ),
      subtitle: Text(
-        'Artist',
+        S.of(context)!.artist,
        style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
      ),
        onTap: () {
@@ -556,7 +557,7 @@ class SearchScreenState extends State<SearchScreen> {

    if (maProvider.selectedPlayer == null) {
      ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(content: Text('No player selected')),
+        SnackBar(content: Text(S.of(context)!.noPlayerSelected)),
      );
      return;
    }
@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../l10n/app_localizations.dart';
+import '../providers/locale_provider.dart';
 import '../providers/music_assistant_provider.dart';
 import '../services/music_assistant_api.dart';
 import '../services/settings_service.dart';
@@ -30,6 +32,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
  bool _showContinueListeningAudiobooks = false;
  bool _showDiscoverAudiobooks = false;
  bool _showDiscoverSeries = false;
+  // Home row order
+  List<String> _homeRowOrder = List.from(SettingsService.defaultHomeRowOrder);
  // Audiobook libraries
  List<Map<String, String>> _discoveredLibraries = [];
  Map<String, bool> _libraryEnabled = {};
@@ -64,6 +68,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
    final showDiscAudiobooks = await SettingsService.getShowDiscoverAudiobooks();
    final showDiscSeries = await SettingsService.getShowDiscoverSeries();

+    // Load home row order
+    final rowOrder = await SettingsService.getHomeRowOrder();
+
    // Load audiobook library settings
    final discovered = await SettingsService.getDiscoveredAbsLibraries() ?? [];
    final enabled = await SettingsService.getEnabledAbsLibraries();
@@ -85,6 +92,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
        _showContinueListeningAudiobooks = showContinueAudiobooks;
        _showDiscoverAudiobooks = showDiscAudiobooks;
        _showDiscoverSeries = showDiscSeries;
+        _homeRowOrder = rowOrder;
        _discoveredLibraries = discovered;
        _libraryEnabled = libraryEnabled;
      });
@@ -98,6 +106,103 @@ class _SettingsScreenState extends State<SettingsScreen> {
    super.dispose();
  }

+  // Helper to get row display info
+  Map<String, String> _getRowInfo(String rowId) {
+    final s = S.of(context)!;
+    switch (rowId) {
+      case 'recent-albums':
+        return {'title': s.recentlyPlayed, 'subtitle': s.showRecentlyPlayedAlbums};
+      case 'discover-artists':
+        return {'title': s.discoverArtists, 'subtitle': s.showRandomArtists};
+      case 'discover-albums':
+        return {'title': s.discoverAlbums, 'subtitle': s.showRandomAlbums};
+      case 'continue-listening':
+        return {'title': s.continueListening, 'subtitle': s.showAudiobooksInProgress};
+      case 'discover-audiobooks':
+        return {'title': s.discoverAudiobooks, 'subtitle': s.showRandomAudiobooks};
+      case 'discover-series':
+        return {'title': s.discoverSeries, 'subtitle': s.showRandomSeries};
+      case 'favorite-albums':
+        return {'title': s.favoriteAlbums, 'subtitle': s.showFavoriteAlbums};
+      case 'favorite-artists':
+        return {'title': s.favoriteArtists, 'subtitle': s.showFavoriteArtists};
+      case 'favorite-tracks':
+        return {'title': s.favoriteTracks, 'subtitle': s.showFavoriteTracks};
+      default:
+        return {'title': rowId, 'subtitle': ''};
+    }
+  }
+
+  // Helper to get row enabled state
+  bool _getRowEnabled(String rowId) {
+    switch (rowId) {
+      case 'recent-albums':
+        return _showRecentAlbums;
+      case 'discover-artists':
+        return _showDiscoverArtists;
+      case 'discover-albums':
+        return _showDiscoverAlbums;
+      case 'continue-listening':
+        return _showContinueListeningAudiobooks;
+      case 'discover-audiobooks':
+        return _showDiscoverAudiobooks;
+      case 'discover-series':
+        return _showDiscoverSeries;
+      case 'favorite-albums':
+        return _showFavoriteAlbums;
+      case 'favorite-artists':
+        return _showFavoriteArtists;
+      case 'favorite-tracks':
+        return _showFavoriteTracks;
+      default:
+        return false;
+    }
+  }
+
+  // Helper to set row enabled state
+  void _setRowEnabled(String rowId, bool value) {
+    setState(() {
+      switch (rowId) {
+        case 'recent-albums':
+          _showRecentAlbums = value;
+          SettingsService.setShowRecentAlbums(value);
+          break;
+        case 'discover-artists':
+          _showDiscoverArtists = value;
+          SettingsService.setShowDiscoverArtists(value);
+          break;
+        case 'discover-albums':
+          _showDiscoverAlbums = value;
+          SettingsService.setShowDiscoverAlbums(value);
+          break;
+        case 'continue-listening':
+          _showContinueListeningAudiobooks = value;
+          SettingsService.setShowContinueListeningAudiobooks(value);
+          break;
+        case 'discover-audiobooks':
+          _showDiscoverAudiobooks = value;
+          SettingsService.setShowDiscoverAudiobooks(value);
+          break;
+        case 'discover-series':
+          _showDiscoverSeries = value;
+          SettingsService.setShowDiscoverSeries(value);
+          break;
+        case 'favorite-albums':
+          _showFavoriteAlbums = value;
+          SettingsService.setShowFavoriteAlbums(value);
+          break;
+        case 'favorite-artists':
+          _showFavoriteArtists = value;
+          SettingsService.setShowFavoriteArtists(value);
+          break;
+        case 'favorite-tracks':
+          _showFavoriteTracks = value;
+          SettingsService.setShowFavoriteTracks(value);
+          break;
+      }
+    });
+  }
+
  Future<void> _disconnect() async {
    final provider = context.read<MusicAssistantProvider>();
    await provider.disconnect();
@@ -131,7 +236,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
          color: colorScheme.onBackground,
        ),
        title: Text(
-          'Settings',
+          S.of(context)!.settings,
          style: textTheme.titleLarge?.copyWith(
            color: colorScheme.onBackground,
            fontWeight: FontWeight.w300,
@@ -150,7 +255,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
              );
            },
            color: colorScheme.onBackground,
-            tooltip: 'Debug Logs',
+            tooltip: S.of(context)!.debugLogs,
          ),
        ],
      ),
@@ -206,9 +311,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
              child: FilledButton.tonalIcon(
                onPressed: _disconnect,
                icon: const Icon(Icons.logout_rounded),
-                label: const Text(
-                  'Disconnect',
-                  style: TextStyle(
+                label: Text(
+                  S.of(context)!.disconnect,
+                  style: const TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                  ),
@@ -227,7 +332,7 @@ class _SettingsScreenState extends State<SettingsScreen> {

            // Theme section
            Text(
-              'Theme',
+              S.of(context)!.theme,
              style: textTheme.titleMedium?.copyWith(
                color: colorScheme.onBackground,
                fontWeight: FontWeight.bold,
@@ -238,14 +343,14 @@ class _SettingsScreenState extends State<SettingsScreen> {
            Container(
              padding: const EdgeInsets.all(16),
              decoration: BoxDecoration(
-                color: colorScheme.surfaceVariant.withOpacity(0.3),
-                borderRadius: BorderRadius.circular(12),
+                color: colorScheme.surfaceVariant.withOpacity(0.5),
+                borderRadius: BorderRadius.circular(8),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
-                    'Theme Mode',
+                    S.of(context)!.themeMode,
                    style: textTheme.bodySmall?.copyWith(
                      color: colorScheme.onSurfaceVariant,
                    ),
@@ -256,21 +361,21 @@ class _SettingsScreenState extends State<SettingsScreen> {
                      return SizedBox(
                        width: double.infinity,
                        child: SegmentedButton<ThemeMode>(
-                          segments: const [
+                          segments: [
                            ButtonSegment<ThemeMode>(
                              value: ThemeMode.light,
-                              label: Text('Light'),
-                              icon: Icon(Icons.light_mode_rounded),
+                              label: Text(S.of(context)!.light),
+                              icon: const Icon(Icons.light_mode_rounded),
                            ),
                            ButtonSegment<ThemeMode>(
                              value: ThemeMode.dark,
-                              label: Text('Dark'),
-                              icon: Icon(Icons.dark_mode_rounded),
+                              label: Text(S.of(context)!.dark),
+                              icon: const Icon(Icons.dark_mode_rounded),
                            ),
                            ButtonSegment<ThemeMode>(
                              value: ThemeMode.system,
-                              label: Text('System'),
-                              icon: Icon(Icons.auto_mode_rounded),
+                              label: Text(S.of(context)!.system),
+                              icon: const Icon(Icons.auto_mode_rounded),
                            ),
                          ],
                          selected: {themeProvider.themeMode},
@@ -282,7 +387,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
                              if (states.contains(WidgetState.selected)) {
                                return colorScheme.primaryContainer;
                              }
-                              return colorScheme.surfaceVariant.withOpacity(0.3);
+                              return colorScheme.surfaceVariant.withOpacity(0.5);
                            }),
                            foregroundColor: WidgetStateProperty.resolveWith((states) {
                              if (states.contains(WidgetState.selected)) {
@@ -291,6 +396,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
                              return colorScheme.onSurfaceVariant;
                            }),
                            side: WidgetStateProperty.all(BorderSide.none),
+                            shape: WidgetStateProperty.all(
+                              RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
+                            ),
                          ),
                        ),
                      );
@@ -302,6 +410,91 @@ class _SettingsScreenState extends State<SettingsScreen> {

            const SizedBox(height: 16),

+            // Language picker
+            Consumer<LocaleProvider>(
+              builder: (context, localeProvider, _) {
+                String getLanguageName(String? code) {
+                  switch (code) {
+                    case 'en':
+                      return 'English';
+                    case 'de':
+                      return 'Deutsch';
+                    case 'es':
+                      return 'Español';
+                    default:
+                      return S.of(context)!.system;
+                  }
+                }
+
+                return ListTile(
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
+                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
+                  tileColor: colorScheme.surfaceVariant.withOpacity(0.5),
+                  leading: Icon(Icons.language_rounded, color: colorScheme.onSurfaceVariant),
+                  title: Text(S.of(context)!.language),
+                  subtitle: Text(
+                    getLanguageName(localeProvider.locale?.languageCode),
+                    style: TextStyle(color: colorScheme.primary),
+                  ),
+                  trailing: Icon(Icons.chevron_right, color: colorScheme.onSurfaceVariant),
+                  onTap: () {
+                    showDialog(
+                      context: context,
+                      builder: (dialogContext) {
+                        return AlertDialog(
+                          title: Text(S.of(context)!.language),
+                          content: Column(
+                            mainAxisSize: MainAxisSize.min,
+                            children: [
+                              RadioListTile<String?>(
+                                title: Text(S.of(context)!.system),
+                                subtitle: const Text('Auto'),
+                                value: null,
+                                groupValue: localeProvider.locale?.languageCode,
+                                onChanged: (value) {
+                                  localeProvider.setLocale(null);
+                                  Navigator.pop(dialogContext);
+                                },
+                              ),
+                              RadioListTile<String?>(
+                                title: const Text('English'),
+                                value: 'en',
+                                groupValue: localeProvider.locale?.languageCode,
+                                onChanged: (value) {
+                                  localeProvider.setLocale(const Locale('en'));
+                                  Navigator.pop(dialogContext);
+                                },
+                              ),
+                              RadioListTile<String?>(
+                                title: const Text('Deutsch'),
+                                value: 'de',
+                                groupValue: localeProvider.locale?.languageCode,
+                                onChanged: (value) {
+                                  localeProvider.setLocale(const Locale('de'));
+                                  Navigator.pop(dialogContext);
+                                },
+                              ),
+                              RadioListTile<String?>(
+                                title: const Text('Español'),
+                                value: 'es',
+                                groupValue: localeProvider.locale?.languageCode,
+                                onChanged: (value) {
+                                  localeProvider.setLocale(const Locale('es'));
+                                  Navigator.pop(dialogContext);
+                                },
+                              ),
+                            ],
+                          ),
+                        );
+                      },
+                    );
+                  },
+                );
+              },
+            ),
+
+            const SizedBox(height: 16),
+
            Consumer<ThemeProvider>(
              builder: (context, themeProvider, _) {
                return Container(
@@ -312,11 +505,11 @@ class _SettingsScreenState extends State<SettingsScreen> {
                  ),
                  child: SwitchListTile(
                    title: Text(
-                      'Material You',
+                      S.of(context)!.materialYou,
                      style: TextStyle(color: colorScheme.onSurface),
                    ),
                    subtitle: Text(
-                      'Use system colors (Android 12+)',
+                      S.of(context)!.materialYouDescription,
                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
                    ),
                    value: themeProvider.useMaterialTheme,
@@ -342,11 +535,11 @@ class _SettingsScreenState extends State<SettingsScreen> {
                  ),
                  child: SwitchListTile(
                    title: Text(
-                      'Adaptive Theme',
+                      S.of(context)!.adaptiveTheme,
                      style: TextStyle(color: colorScheme.onSurface),
                    ),
                    subtitle: Text(
-                      'Extract colors from album and artist artwork',
+                      S.of(context)!.extractColorsFromArtwork,
                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
                    ),
                    value: themeProvider.adaptiveTheme,
@@ -364,7 +557,7 @@ class _SettingsScreenState extends State<SettingsScreen> {

            // Home Screen section
            Text(
-              'Home Screen',
+              S.of(context)!.homeScreen,
              style: textTheme.titleMedium?.copyWith(
                color: colorScheme.onBackground,
                fontWeight: FontWeight.bold,
@@ -372,235 +565,84 @@ class _SettingsScreenState extends State<SettingsScreen> {
            ),
            const SizedBox(height: 8),
            Text(
-              'Choose which rows to display on the home screen',
+              S.of(context)!.chooseHomeScreenRows,
              style: textTheme.bodySmall?.copyWith(
                color: colorScheme.onBackground.withOpacity(0.6),
              ),
            ),
            const SizedBox(height: 16),

-            // Main rows section
+            // Reorderable home rows list
            Container(
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
              decoration: BoxDecoration(
                color: colorScheme.surfaceVariant.withOpacity(0.3),
                borderRadius: BorderRadius.circular(12),
              ),
-              child: Column(
-                children: [
-                  SwitchListTile(
-                    title: Text(
-                      'Recently Played',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show recently played albums',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showRecentAlbums,
-                    onChanged: (value) {
-                      setState(() => _showRecentAlbums = value);
-                      SettingsService.setShowRecentAlbums(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Discover Artists',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show random artists to discover',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showDiscoverArtists,
-                    onChanged: (value) {
-                      setState(() => _showDiscoverArtists = value);
-                      SettingsService.setShowDiscoverArtists(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Discover Albums',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show random albums to discover',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showDiscoverAlbums,
-                    onChanged: (value) {
-                      setState(() => _showDiscoverAlbums = value);
-                      SettingsService.setShowDiscoverAlbums(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                ],
-              ),
-            ),
+              clipBehavior: Clip.antiAlias,
+              child: ReorderableListView.builder(
+                shrinkWrap: true,
+                physics: const NeverScrollableScrollPhysics(),
+                buildDefaultDragHandles: false,
+                itemCount: _homeRowOrder.length,
+                onReorder: (oldIndex, newIndex) {
+                  setState(() {
+                    if (newIndex > oldIndex) newIndex--;
+                    final item = _homeRowOrder.removeAt(oldIndex);
+                    _homeRowOrder.insert(newIndex, item);
+                  });
+                  SettingsService.setHomeRowOrder(_homeRowOrder);
+                },
+                itemBuilder: (context, index) {
+                  final rowId = _homeRowOrder[index];
+                  final rowInfo = _getRowInfo(rowId);
+                  final isEnabled = _getRowEnabled(rowId);

-            const SizedBox(height: 16),
-
-            Text(
-              'Favorites',
-              style: textTheme.bodySmall?.copyWith(
-                color: colorScheme.onBackground.withOpacity(0.6),
-              ),
-            ),
-            const SizedBox(height: 8),
-
-            // Favorites rows section
-            Container(
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-              decoration: BoxDecoration(
-                color: colorScheme.surfaceVariant.withOpacity(0.3),
-                borderRadius: BorderRadius.circular(12),
-              ),
-              child: Column(
-                children: [
-                  SwitchListTile(
-                    title: Text(
-                      'Favorite Albums',
-                      style: TextStyle(color: colorScheme.onSurface),
+                  return Container(
+                    key: ValueKey(rowId),
+                    decoration: BoxDecoration(
+                      border: index < _homeRowOrder.length - 1
+                          ? Border(bottom: BorderSide(color: colorScheme.outline.withOpacity(0.2)))
+                          : null,
                    ),
-                    subtitle: Text(
-                      'Show a row of your favorite albums',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
+                    child: Row(
+                      children: [
+                        ReorderableDragStartListener(
+                          index: index,
+                          child: Padding(
+                            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 16),
+                            child: Icon(
+                              Icons.drag_handle,
+                              color: colorScheme.onSurface.withOpacity(0.5),
+                            ),
+                          ),
+                        ),
+                        Expanded(
+                          child: SwitchListTile(
+                            title: Text(
+                              rowInfo['title']!,
+                              style: TextStyle(color: colorScheme.onSurface),
+                            ),
+                            subtitle: Text(
+                              rowInfo['subtitle']!,
+                              style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
+                            ),
+                            value: isEnabled,
+                            onChanged: (value) => _setRowEnabled(rowId, value),
+                            activeColor: colorScheme.primary,
+                            contentPadding: const EdgeInsets.only(right: 8),
+                          ),
+                        ),
+                      ],
                    ),
-                    value: _showFavoriteAlbums,
-                    onChanged: (value) {
-                      setState(() => _showFavoriteAlbums = value);
-                      SettingsService.setShowFavoriteAlbums(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Favorite Artists',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show a row of your favorite artists',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showFavoriteArtists,
-                    onChanged: (value) {
-                      setState(() => _showFavoriteArtists = value);
-                      SettingsService.setShowFavoriteArtists(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Favorite Tracks',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show a row of your favorite tracks',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showFavoriteTracks,
-                    onChanged: (value) {
-                      setState(() => _showFavoriteTracks = value);
-                      SettingsService.setShowFavoriteTracks(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                ],
-              ),
-            ),
-
-            const SizedBox(height: 16),
-
-            Text(
-              'Audiobooks',
-              style: textTheme.bodySmall?.copyWith(
-                color: colorScheme.onBackground.withOpacity(0.6),
-              ),
-            ),
-            const SizedBox(height: 8),
-
-            // Audiobook home rows section
-            Container(
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-              decoration: BoxDecoration(
-                color: colorScheme.surfaceVariant.withOpacity(0.3),
-                borderRadius: BorderRadius.circular(12),
-              ),
-              child: Column(
-                children: [
-                  SwitchListTile(
-                    title: Text(
-                      'Continue Listening',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show audiobooks in progress',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showContinueListeningAudiobooks,
-                    onChanged: (value) {
-                      setState(() => _showContinueListeningAudiobooks = value);
-                      SettingsService.setShowContinueListeningAudiobooks(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Discover Audiobooks',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show random audiobooks to discover',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showDiscoverAudiobooks,
-                    onChanged: (value) {
-                      setState(() => _showDiscoverAudiobooks = value);
-                      SettingsService.setShowDiscoverAudiobooks(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                  Divider(color: colorScheme.outline.withOpacity(0.2), height: 1),
-                  SwitchListTile(
-                    title: Text(
-                      'Discover Series',
-                      style: TextStyle(color: colorScheme.onSurface),
-                    ),
-                    subtitle: Text(
-                      'Show random audiobook series to discover',
-                      style: TextStyle(color: colorScheme.onSurface.withOpacity(0.6), fontSize: 12),
-                    ),
-                    value: _showDiscoverSeries,
-                    onChanged: (value) {
-                      setState(() => _showDiscoverSeries = value);
-                      SettingsService.setShowDiscoverSeries(value);
-                    },
-                    activeColor: colorScheme.primary,
-                    contentPadding: EdgeInsets.zero,
-                  ),
-                ],
+                  );
+                },
              ),
            ),

            const SizedBox(height: 32),

            Text(
-              'Metadata APIs (Optional)',
+              S.of(context)!.metadataApis,
              style: textTheme.titleMedium?.copyWith(
                color: colorScheme.onBackground,
                fontWeight: FontWeight.bold,
@@ -608,7 +650,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
            ),
            const SizedBox(height: 8),
            Text(
-              'Artist images are automatically fetched from Deezer. Add API keys below for artist biographies and album descriptions.',
+              S.of(context)!.metadataApisDescription,
              style: textTheme.bodySmall?.copyWith(
                color: colorScheme.onBackground.withOpacity(0.6),
              ),
@@ -619,8 +661,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
              controller: _lastFmApiKeyController,
              style: TextStyle(color: colorScheme.onSurface),
              decoration: InputDecoration(
-                labelText: 'Last.fm API Key',
-                hintText: 'Get free key at last.fm/api',
+                labelText: S.of(context)!.lastFmApiKey,
+                hintText: S.of(context)!.lastFmApiKeyHint,
                hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                filled: true,
                fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -656,8 +698,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
              controller: _audioDbApiKeyController,
              style: TextStyle(color: colorScheme.onSurface),
              decoration: InputDecoration(
-                labelText: 'TheAudioDB API Key',
-                hintText: 'Use "2" for free tier or premium key',
+                labelText: S.of(context)!.theAudioDbApiKey,
+                hintText: S.of(context)!.theAudioDbApiKeyHint,
                hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.38)),
                filled: true,
                fillColor: colorScheme.surfaceVariant.withOpacity(0.3),
@@ -692,7 +734,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
            // Audiobook Libraries section
            if (_discoveredLibraries.isNotEmpty) ...[
              Text(
-                'Audiobook Libraries',
+                S.of(context)!.audiobookLibraries,
                style: textTheme.titleMedium?.copyWith(
                  color: colorScheme.onBackground,
                  fontWeight: FontWeight.bold,
@@ -700,7 +742,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
              ),
              const SizedBox(height: 8),
              Text(
-                'Choose which Audiobookshelf libraries to include',
+                S.of(context)!.chooseAudiobookLibraries,
                style: textTheme.bodySmall?.copyWith(
                  color: colorScheme.onBackground.withOpacity(0.6),
                ),
@@ -717,7 +759,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
                    final index = entry.key;
                    final library = entry.value;
                    final path = library['path'] ?? '';
-                    final name = library['name'] ?? 'Unknown Library';
+                    final name = library['name'] ?? S.of(context)!.unknownLibrary;
                    final isEnabled = _libraryEnabled[path] ?? true;

                    return Column(
@@ -735,9 +777,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
                            await SettingsService.toggleAbsLibrary(path, value);
                            if (mounted) {
                              ScaffoldMessenger.of(context).showSnackBar(
-                                const SnackBar(
-                                  content: Text('Pull to refresh the library to apply changes'),
-                                  duration: Duration(seconds: 2),
+                                SnackBar(
+                                  content: Text(S.of(context)!.pullToRefresh),
+                                  duration: const Duration(seconds: 2),
                                ),
                              );
                            }
@@ -772,7 +814,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
                  );
                },
                icon: const Icon(Icons.bug_report_rounded),
-                label: const Text('View Debug Logs'),
+                label: Text(S.of(context)!.viewDebugLogs),
                style: FilledButton.styleFrom(
                  backgroundColor: colorScheme.surfaceVariant.withOpacity(0.5),
                  foregroundColor: colorScheme.onSurfaceVariant,
@@ -821,17 +863,19 @@ class _SettingsScreenState extends State<SettingsScreen> {
  }

  String _getStatusText(MAConnectionState state) {
+    final s = S.of(context)!;
    switch (state) {
      case MAConnectionState.connected:
      case MAConnectionState.authenticated:
-        return 'Connected';
+        return s.connected;
      case MAConnectionState.connecting:
      case MAConnectionState.authenticating:
-        return 'Connecting...';
+        return s.connecting;
      case MAConnectionState.error:
-        return 'Connection Error';
+        return s.connectionError;
      case MAConnectionState.disconnected:
-        return 'Disconnected';
+        return s.disconnected;
    }
  }
+
 }
@@ -1,4 +1,5 @@
 import 'dart:convert';
+import 'dart:io';
 import 'package:http/http.dart' as http;
 import 'auth_strategy.dart';
 import 'no_auth_strategy.dart';
@@ -86,6 +87,22 @@ class AuthManager {
    return baseUrl;
  }

+  /// Check if a hostname is a local/private IP address
+  bool _isLocalIpAddress(String host) {
+    return host.startsWith('192.168.') ||
+        host.startsWith('10.') ||
+        host.startsWith('172.16.') ||
+        host.startsWith('172.17.') ||
+        host.startsWith('172.18.') ||
+        host.startsWith('172.19.') ||
+        host.startsWith('172.2') ||
+        host.startsWith('172.30.') ||
+        host.startsWith('172.31.') ||
+        host == 'localhost' ||
+        host.startsWith('127.') ||
+        host.endsWith('.local');
+  }
+
  /// Try to detect auth strategy for a given URL
  /// Returns the strategy if successful, null if connection failed
  Future<AuthStrategy?> _tryDetectAuth(String baseUrl) async {
@@ -187,15 +204,50 @@ class AuthManager {

      _logger.log('Checking MA API at: $apiUrl');

-      // Try to get server info - this tells us if auth is required
-      // Note: The command is just 'info', not 'server/info'
-      final response = await http.post(
-        apiUrl,
-        headers: {'Content-Type': 'application/json'},
-        body: jsonEncode({
-          'command': 'info',
-        }),
-      ).timeout(const Duration(seconds: 5));
+      // Use IOClient to control redirect behavior for local IPs
+      final isLocalIp = _isLocalIpAddress(uri.host);
+      http.Response response;
+
+      if (isLocalIp) {
+        // For local IPs, don't follow redirects - handle them explicitly
+        final client = HttpClient();
+        try {
+          final request = await client.postUrl(apiUrl);
+          request.followRedirects = false;
+          request.headers.set('Content-Type', 'application/json');
+          request.write(jsonEncode({'command': 'info'}));
+          final ioResponse = await request.close().timeout(const Duration(seconds: 5));
+
+          // Check for redirect to HTTPS
+          if (ioResponse.statusCode == 308 || ioResponse.statusCode == 301 || ioResponse.statusCode == 302) {
+            final location = ioResponse.headers.value('location');
+            _logger.log('Local IP redirects to: $location');
+            if (location != null && location.startsWith('https://')) {
+              _logger.log('⚠️ Server redirects HTTP to HTTPS - this may cause certificate issues for local IP');
+              // Don't follow the redirect - it will likely fail with cert error
+              // Instead, return null to trigger fallback logic
+              client.close();
+              return null;
+            }
+          }
+
+          final body = await ioResponse.transform(utf8.decoder).join();
+          response = http.Response(body, ioResponse.statusCode);
+          client.close();
+        } catch (e) {
+          client.close();
+          rethrow;
+        }
+      } else {
+        // For non-local URLs, use standard http.post which follows redirects
+        response = await http.post(
+          apiUrl,
+          headers: {'Content-Type': 'application/json'},
+          body: jsonEncode({
+            'command': 'info',
+          }),
+        ).timeout(const Duration(seconds: 5));
+      }

      _logger.log('MA API response: ${response.statusCode}');
      _logger.log('MA API body: ${response.body}');
@@ -255,21 +307,47 @@ class AuthManager {
  /// Test if server is accessible without authentication
  Future<bool> _canConnectWithoutAuth(String serverUrl) async {
    try {
-      // Test root endpoint - Music Assistant doesn't have /api/info
-      final testUrl = serverUrl;
-      _logger.log('No-auth test URL: $testUrl');
+      final uri = Uri.parse(serverUrl);
+      _logger.log('No-auth test URL: $serverUrl');

-      final response = await http.get(
-        Uri.parse(testUrl),
-        // Don't follow redirects - we want to see if server requires auth
-      ).timeout(const Duration(seconds: 10));
+      final isLocalIp = _isLocalIpAddress(uri.host);
+      int statusCode;

-      _logger.log('No-auth status: ${response.statusCode}');
+      if (isLocalIp) {
+        // For local IPs, don't follow redirects to avoid HTTPS cert issues
+        final client = HttpClient();
+        try {
+          final request = await client.getUrl(uri);
+          request.followRedirects = false;
+          final response = await request.close().timeout(const Duration(seconds: 10));
+          statusCode = response.statusCode;
+
+          // Check for redirect to HTTPS
+          if (statusCode == 308 || statusCode == 301 || statusCode == 302) {
+            final location = response.headers.value('location');
+            if (location != null && location.startsWith('https://')) {
+              _logger.log('⚠️ Local IP redirects to HTTPS: $location');
+              client.close();
+              return false; // Can't connect - would need HTTPS which has cert issues
+            }
+          }
+          client.close();
+        } catch (e) {
+          client.close();
+          rethrow;
+        }
+      } else {
+        // For non-local URLs, use standard http.get
+        final response = await http.get(uri).timeout(const Duration(seconds: 10));
+        statusCode = response.statusCode;
+      }
+
+      _logger.log('No-auth status: $statusCode');

      // 200 = no auth required
-      // 302/307 = redirect (probably to auth)
+      // 302/307/308 = redirect (probably to auth or HTTPS)
      // 401 = auth required
-      if (response.statusCode == 200) {
+      if (statusCode == 200) {
        return true;
      }

@@ -1,4 +1,5 @@
 import '../models/media_item.dart';
+import '../models/player.dart';
 import '../services/debug_logger.dart';
 import '../constants/timings.dart';

@@ -28,6 +29,8 @@ class CacheService {
  final Map<String, DateTime> _searchCacheTime = {};

  // Player list caching
+  List<Player>? _cachedPlayers;
+  Player? _cachedSelectedPlayer;
  DateTime? _playersLastFetched;

  // Player track cache (for smooth swipe transitions)
@@ -219,6 +222,26 @@ class CacheService {
    _playersLastFetched = DateTime.now();
  }

+  /// Get cached players list
+  List<Player>? getCachedPlayers() => _cachedPlayers;
+
+  /// Set cached players list
+  void setCachedPlayers(List<Player> players) {
+    _cachedPlayers = players;
+    _playersLastFetched = DateTime.now();
+  }
+
+  /// Get cached selected player
+  Player? getCachedSelectedPlayer() => _cachedSelectedPlayer;
+
+  /// Set cached selected player
+  void setCachedSelectedPlayer(Player? player) {
+    _cachedSelectedPlayer = player;
+  }
+
+  /// Check if we have cached players (for instant UI display on app resume)
+  bool get hasCachedPlayers => _cachedPlayers != null && _cachedPlayers!.isNotEmpty;
+
  /// Get cached track for a player (used for smooth swipe transitions)
  Track? getCachedTrackForPlayer(String playerId) => _playerTrackCache[playerId];

@@ -249,6 +272,8 @@ class CacheService {
  void clearAll() {
    invalidateHomeCache();
    clearAllDetailCaches();
+    _cachedPlayers = null;
+    _cachedSelectedPlayer = null;
    _playersLastFetched = null;
  }
 }
@@ -2302,89 +2302,15 @@ class MusicAssistantAPI {
    return _eventStreams['sendspin_player']!.stream;
  }

-  /// Get Sendspin connection info for a player
-  /// Returns connection details including:
-  /// - local_ws_url: Direct WebSocket URL (e.g., ws://192.168.4.120:8927/sendspin)
-  /// - ice_servers: List of ICE/TURN servers for WebRTC fallback
-  /// - player_id: The player's ID
-  Future<Map<String, dynamic>?> getSendspinConnectionInfo(String playerId) async {
-    try {
-      _logger.log('Sendspin: Getting connection info for player $playerId');
-
-      final response = await _sendCommand(
-        'sendspin/connection_info',
-        args: {
-          'player_id': playerId,
-        },
-      );
-
-      final result = response['result'] as Map<String, dynamic>?;
-      if (result != null) {
-        _logger.log('Sendspin: Got connection info - local_ws_url: ${result['local_ws_url']}');
-        _logger.log('Sendspin: ICE servers count: ${(result['ice_servers'] as List?)?.length ?? 0}');
-      }
-
-      return result;
-    } catch (e) {
-      _logger.log('Sendspin: Error getting connection info: $e');
-      return null;
-    }
-  }
-
-  /// Send WebRTC offer to Sendspin server
-  /// Used when establishing WebRTC connection as fallback
-  Future<Map<String, dynamic>?> sendspinOffer(String playerId, String sdp) async {
-    try {
-      _logger.log('Sendspin: Sending WebRTC offer for player $playerId');
-
-      final response = await _sendCommand(
-        'sendspin/webrtc_offer',
-        args: {
-          'player_id': playerId,
-          'sdp': sdp,
-        },
-      );
-
-      return response['result'] as Map<String, dynamic>?;
-    } catch (e) {
-      _logger.log('Sendspin: Error sending WebRTC offer: $e');
-      return null;
-    }
-  }
-
-  /// Send WebRTC answer to Sendspin server
-  Future<void> sendspinAnswer(String playerId, String sdp) async {
-    try {
-      _logger.log('Sendspin: Sending WebRTC answer for player $playerId');
-
-      await _sendCommand(
-        'sendspin/webrtc_answer',
-        args: {
-          'player_id': playerId,
-          'sdp': sdp,
-        },
-      );
-    } catch (e) {
-      _logger.log('Sendspin: Error sending WebRTC answer: $e');
-      rethrow;
-    }
-  }
-
-  /// Send ICE candidate to Sendspin server
-  Future<void> sendspinIceCandidate(String playerId, Map<String, dynamic> candidate) async {
-    try {
-      await _sendCommand(
-        'sendspin/ice_candidate',
-        args: {
-          'player_id': playerId,
-          'candidate': candidate,
-        },
-      );
-    } catch (e) {
-      _logger.log('Sendspin: Error sending ICE candidate: $e');
-      // Don't rethrow - ICE candidate failures are common and non-fatal
-    }
-  }
+  // NOTE: The following Sendspin API methods were removed because they don't exist in MA:
+  // - getSendspinConnectionInfo (sendspin/connection_info)
+  // - sendspinOffer (sendspin/webrtc_offer)
+  // - sendspinAnswer (sendspin/webrtc_answer)
+  // - sendspinIceCandidate (sendspin/ice_candidate)
+  //
+  // Sendspin connection is handled directly via WebSocket to:
+  // - Local: ws://{server-ip}:8927/sendspin
+  // - External: wss://{server}/sendspin (via MA's proxy with auth)

  /// Update Sendspin player state
  /// Similar to updateBuiltinPlayerState but for Sendspin protocol
@@ -68,6 +68,7 @@ class PcmAudioPlayer {
  final List<Uint8List> _audioBuffer = [];
  bool _isFeeding = false;
  bool _isStarted = false;
+  bool _isAutoRecovering = false;  // Tracks auto-recovery from setup errors
  Completer<void>? _feedCompleter;  // Tracks when current feed operation completes

  // Error callback for operation failures
@@ -202,11 +203,32 @@ class PcmAudioPlayer {

  /// Handle incoming audio data from the stream
  void _onAudioData(Uint8List audioData) {
-    // Ignore data if in error state or if in transitional/paused state
+    // Ignore data if in error state
    if (_state == PcmPlayerState.error) return;
+
+    // Handle audio arriving during paused/transitional states
+    // This can happen when audio frames arrive before stream/start message (race condition)
+    // We need to auto-recover in this case
    if (_shouldBlockFeeding) {
-      // Silently ignore audio data when paused or transitioning
-      // This prevents buffer accumulation during pause and any race conditions
+      // If we're paused and audio is arriving, this is likely a new stream
+      // starting before the stream/start message. Queue for auto-recovery.
+      if (_state == PcmPlayerState.paused && !_isAutoRecovering) {
+        _logger.log('PcmAudioPlayer: Audio arriving while paused - initiating auto-recovery');
+        _isAutoRecovering = true;
+        _audioBuffer.add(audioData);
+
+        // Trigger async recovery
+        _autoRecoverFromPause();
+        return;
+      }
+
+      // If already recovering or in transitional state, buffer the data
+      if (_isAutoRecovering) {
+        _audioBuffer.add(audioData);
+        return;
+      }
+
+      // For other blocking states (pausing, stopping, resuming), ignore
      return;
    }

@@ -218,15 +240,44 @@ class PcmAudioPlayer {
      _startPlayback();
    }

-    // NOTE: Auto-resume from paused state has been removed to prevent race conditions.
-    // The provider should explicitly call play() when ready to resume.
-
    // Feed data if not currently feeding
    if (!_isFeeding && _isStarted) {
      _feedNextChunk();
    }
  }

+  /// Auto-recover from paused state when audio arrives unexpectedly
+  Future<void> _autoRecoverFromPause() async {
+    _logger.log('PcmAudioPlayer: Auto-recovering from pause');
+
+    try {
+      // Re-initialize the native player
+      await pcm.FlutterPcmSound.setup(
+        sampleRate: _format.sampleRate,
+        channelCount: _format.channels,
+      );
+      await pcm.FlutterPcmSound.setFeedThreshold(_feedThreshold);
+      pcm.FlutterPcmSound.setFeedCallback(_onFeedRequested);
+      await pcm.FlutterPcmSound.start();
+
+      _isStarted = true;
+      _state = PcmPlayerState.playing;
+      _startElapsedTimeTimer();
+      _logger.log('PcmAudioPlayer: Auto-recovery from pause successful');
+
+      // Start feeding buffered data
+      _isAutoRecovering = false;
+      if (_audioBuffer.isNotEmpty && !_isFeeding) {
+        _feedNextChunk();
+      }
+    } catch (e) {
+      _logger.log('PcmAudioPlayer: Auto-recovery from pause failed: $e');
+      _isAutoRecovering = false;
+      _state = PcmPlayerState.error;
+      _emitError(PcmPlayerError.resumeFailed, e.toString());
+    }
+  }
+
  /// Start audio playback
  Future<void> _startPlayback() async {
    if (_isStarted) return;
@@ -298,7 +349,41 @@ class PcmAudioPlayer {

        // Check state again before the async feed call
        if (samples.isNotEmpty && !_shouldBlockFeeding) {
-          await pcm.FlutterPcmSound.feed(pcm.PcmArrayInt16.fromList(samples));
+          try {
+            await pcm.FlutterPcmSound.feed(pcm.PcmArrayInt16.fromList(samples));
+          } catch (feedError) {
+            // Auto-recover from "must call setup first" error
+            // This happens when audio frames arrive before stream/start message
+            if (feedError.toString().contains('must call setup first') && !_isAutoRecovering) {
+              _logger.log('PcmAudioPlayer: Auto-recovering from setup error');
+              _isAutoRecovering = true;
+
+              try {
+                // Re-initialize the native player
+                await pcm.FlutterPcmSound.setup(
+                  sampleRate: _format.sampleRate,
+                  channelCount: _format.channels,
+                );
+                await pcm.FlutterPcmSound.setFeedThreshold(_feedThreshold);
+                pcm.FlutterPcmSound.setFeedCallback(_onFeedRequested);
+                await pcm.FlutterPcmSound.start();
+                _isStarted = true;
+                _state = PcmPlayerState.playing;
+                _startElapsedTimeTimer();
+                _logger.log('PcmAudioPlayer: Auto-recovery successful');
+
+                // Retry the feed with the current chunk
+                await pcm.FlutterPcmSound.feed(pcm.PcmArrayInt16.fromList(samples));
+              } catch (recoveryError) {
+                _logger.log('PcmAudioPlayer: Auto-recovery failed: $recoveryError');
+                _isAutoRecovering = false;
+                rethrow;
+              }
+              _isAutoRecovering = false;
+            } else {
+              rethrow;
+            }
+          }

          // Don't update stats if we got paused during the feed
          if (!_shouldBlockFeeding) {
@@ -84,8 +84,16 @@ class SendspinService {

  bool _isDisposed = false;

+  // Auth token for proxy authentication (MA 2.7.1+)
+  String? _authToken;
+
  SendspinService(this.serverUrl);

+  /// Set the MA auth token for proxy authentication
+  void setAuthToken(String? token) {
+    _authToken = token;
+  }
+
  /// Initialize and connect to Sendspin server
  /// Uses persistent player ID and username-based naming
  Future<bool> connect() async {
@@ -105,18 +113,18 @@ class SendspinService {
      bool connected = false;

      // Strategy 1: If server is HTTPS, try external wss:// first
+      // Use proxy auth for MA 2.7.1+ - the proxy requires authentication before hello
      if (_isHttpsServer()) {
        final externalUrl = _buildExternalSendspinUrl();
        _logger.log('Sendspin: Trying external URL: $externalUrl');
-        connected = await _tryConnect(externalUrl, timeout: const Duration(seconds: 3));
+        connected = await _tryConnect(externalUrl, timeout: const Duration(seconds: 5), useProxyAuth: true);
      }

-      // Strategy 2: If external failed or server is HTTP, try local connection
-      // Note: We would need local_ws_url from getSendspinConnectionInfo API
-      // For now, skip this step and fall back to WebRTC (handled by provider)
+      // Note: Local network connections (ws://ip:8927/sendspin) are handled
+      // by the provider calling connectWithUrl() directly, not by this method.

      if (!connected) {
-        _logger.log('Sendspin: External connection failed, WebRTC fallback needed');
+        _logger.log('Sendspin: External proxy connection failed');
        _updateState(SendspinConnectionState.error);
        return false;
      }
@@ -158,10 +166,11 @@ class SendspinService {
  }

  /// Attempt to connect to a specific WebSocket URL
-  Future<bool> _tryConnect(String url, {Duration timeout = const Duration(seconds: 5)}) async {
+  /// If useProxyAuth is true and we have an auth token, authenticate first (for MA 2.7.1+ proxy)
+  Future<bool> _tryConnect(String url, {Duration timeout = const Duration(seconds: 5), bool useProxyAuth = false}) async {
    try {
      // Connect to the base URL without query params - we send player info in hello message
-      _logger.log('Sendspin: Connecting to $url');
+      _logger.log('Sendspin: Connecting to $url${useProxyAuth ? ' (with proxy auth)' : ''}');

      // Create WebSocket connection
      final webSocket = await WebSocket.connect(url).timeout(timeout);
@@ -176,6 +185,29 @@ class SendspinService {
        onDone: _handleDone,
      );

+      // If using proxy auth (MA 2.7.1+), authenticate first
+      if (useProxyAuth && _authToken != null) {
+        _logger.log('Sendspin: Sending proxy auth with token');
+        _sendMessage({
+          'type': 'auth',
+          'token': _authToken,
+        }, allowDuringHandshake: true);
+
+        // Wait for auth_ok response
+        final authOk = await _waitForAuth().timeout(
+          const Duration(seconds: 5),
+          onTimeout: () => false,
+        );
+
+        if (!authOk) {
+          _logger.log('Sendspin: Proxy authentication failed or timed out');
+          await _channel?.sink.close();
+          _channel = null;
+          return false;
+        }
+        _logger.log('Sendspin: Proxy auth successful, proceeding with hello');
+      }
+
      // Send client/hello message immediately after connecting
      // This is required by the Sendspin protocol - server waits for this
      // Message format follows aiosendspin protocol spec
@@ -228,12 +260,18 @@ class SendspinService {

  /// Wait for server acknowledgment after connection
  Completer<bool>? _ackCompleter;
+  Completer<bool>? _authCompleter;

  Future<bool> _waitForAck() async {
    _ackCompleter = Completer<bool>();
    return _ackCompleter!.future;
  }

+  Future<bool> _waitForAuth() async {
+    _authCompleter = Completer<bool>();
+    return _authCompleter!.future;
+  }
+
  /// Handle incoming WebSocket messages
  /// WebSocket can send text frames (JSON control messages) or binary frames (PCM audio data)
  void _handleMessage(dynamic message) {
@@ -310,6 +348,14 @@ class SendspinService {
          onStreamEnd?.call();
          break;

+        case 'auth_ok':
+          // Proxy authentication successful (MA 2.7.1+)
+          _logger.log('Sendspin: Proxy authentication successful');
+          if (_authCompleter != null && !_authCompleter!.isCompleted) {
+            _authCompleter!.complete(true);
+          }
+          break;
+
        case 'ack':
        case 'connected':
        case 'registered':
@@ -15,6 +15,7 @@ class SettingsService {
  static const String _keyUseMaterialTheme = 'use_material_theme';
  static const String _keyAdaptiveTheme = 'adaptive_theme';
  static const String _keyCustomColor = 'custom_color';
+  static const String _keyLocale = 'locale';
  static const String _keyLastFmApiKey = 'lastfm_api_key';
  static const String _keyTheAudioDbApiKey = 'theaudiodb_api_key';
  static const String _keyEnableLocalPlayback = 'enable_local_playback';
@@ -30,6 +31,20 @@ class SettingsService {
  static const String _keyShowFavoriteAlbums = 'show_favorite_albums';
  static const String _keyShowFavoriteArtists = 'show_favorite_artists';
  static const String _keyShowFavoriteTracks = 'show_favorite_tracks';
+  static const String _keyHomeRowOrder = 'home_row_order'; // JSON list of row IDs
+
+  // Default row order
+  static const List<String> defaultHomeRowOrder = [
+    'recent-albums',
+    'discover-artists',
+    'discover-albums',
+    'continue-listening',
+    'discover-audiobooks',
+    'discover-series',
+    'favorite-albums',
+    'favorite-artists',
+    'favorite-tracks',
+  ];

  // View Mode Settings
  static const String _keyArtistAlbumsSortOrder = 'artist_albums_sort_order'; // 'alpha' or 'year'
@@ -251,6 +266,21 @@ class SettingsService {
    await prefs.setString(_keyCustomColor, color);
  }

+  // Locale (null = system default)
+  static Future<String?> getLocale() async {
+    final prefs = await SharedPreferences.getInstance();
+    return prefs.getString(_keyLocale);
+  }
+
+  static Future<void> saveLocale(String? locale) async {
+    final prefs = await SharedPreferences.getInstance();
+    if (locale == null) {
+      await prefs.remove(_keyLocale);
+    } else {
+      await prefs.setString(_keyLocale, locale);
+    }
+  }
+
  // Metadata API Keys
  static Future<String?> getLastFmApiKey() async {
    final prefs = await SharedPreferences.getInstance();
@@ -442,6 +472,26 @@ class SettingsService {
    await prefs.setBool(_keyShowFavoriteTracks, show);
  }

+  // Home Row Order
+  static Future<List<String>> getHomeRowOrder() async {
+    final prefs = await SharedPreferences.getInstance();
+    final json = prefs.getString(_keyHomeRowOrder);
+    if (json != null) {
+      try {
+        final List<dynamic> decoded = jsonDecode(json);
+        return decoded.cast<String>();
+      } catch (_) {
+        return List.from(defaultHomeRowOrder);
+      }
+    }
+    return List.from(defaultHomeRowOrder);
+  }
+
+  static Future<void> setHomeRowOrder(List<String> order) async {
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.setString(_keyHomeRowOrder, jsonEncode(order));
+  }
+
  // View Mode Settings - Artist Albums
  static Future<String> getArtistAlbumsSortOrder() async {
    final prefs = await SharedPreferences.getInstance();
@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import '../../l10n/app_localizations.dart';
 import '../../theme/design_tokens.dart';

 /// A reusable widget for displaying disconnected/offline state.
@@ -21,29 +22,31 @@ class DisconnectedState extends StatelessWidget {
  });

  /// Simple disconnected state without action button
-  factory DisconnectedState.simple() => const DisconnectedState(
-        title: 'Not connected to Music Assistant',
+  factory DisconnectedState.simple(BuildContext context) => DisconnectedState(
+        title: S.of(context)!.notConnected,
      );

  /// Disconnected state with settings button for navigation
  factory DisconnectedState.withSettingsAction({
+    required BuildContext context,
    required VoidCallback onSettings,
  }) =>
      DisconnectedState(
-        title: 'Not connected to Music Assistant',
-        actionLabel: 'Configure Server',
+        title: S.of(context)!.notConnected,
+        actionLabel: S.of(context)!.configureServer,
        actionIcon: Icons.settings_rounded,
        onAction: onSettings,
      );

  /// Full disconnected state with title, subtitle, and action (for home screen)
  factory DisconnectedState.full({
+    required BuildContext context,
    required VoidCallback onSettings,
  }) =>
      DisconnectedState(
-        title: 'Not Connected',
-        subtitle: 'Connect to your Music Assistant server to start listening',
-        actionLabel: 'Configure Server',
+        title: S.of(context)!.notConnectedTitle,
+        subtitle: S.of(context)!.connectHint,
+        actionLabel: S.of(context)!.configureServer,
        actionIcon: Icons.settings_rounded,
        onAction: onSettings,
        iconSize: 80,
@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import '../../l10n/app_localizations.dart';
 import '../../theme/design_tokens.dart';

 /// A reusable empty state widget for displaying when no data is available.
@@ -21,48 +22,66 @@ class EmptyState extends StatelessWidget {
  });

  /// Creates an empty state for artists
-  factory EmptyState.artists({VoidCallback? onRefresh}) => EmptyState(
-        icon: Icons.person_outline_rounded,
-        message: 'No artists found',
-        actionLabel: onRefresh != null ? 'Refresh' : null,
-        onAction: onRefresh,
-      );
+  factory EmptyState.artists({VoidCallback? onRefresh, required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.person_outline_rounded,
+      message: s.noArtistsFound,
+      actionLabel: onRefresh != null ? s.refresh : null,
+      onAction: onRefresh,
+    );
+  }

  /// Creates an empty state for albums
-  factory EmptyState.albums({VoidCallback? onRefresh}) => EmptyState(
-        icon: Icons.album_outlined,
-        message: 'No albums found',
-        actionLabel: onRefresh != null ? 'Refresh' : null,
-        onAction: onRefresh,
-      );
+  factory EmptyState.albums({VoidCallback? onRefresh, required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.album_outlined,
+      message: s.noAlbumsFound,
+      actionLabel: onRefresh != null ? s.refresh : null,
+      onAction: onRefresh,
+    );
+  }

  /// Creates an empty state for tracks
-  factory EmptyState.tracks({VoidCallback? onRefresh}) => EmptyState(
-        icon: Icons.music_note_outlined,
-        message: 'No tracks found',
-        actionLabel: onRefresh != null ? 'Refresh' : null,
-        onAction: onRefresh,
-      );
+  factory EmptyState.tracks({VoidCallback? onRefresh, required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.music_note_outlined,
+      message: s.noTracksFound,
+      actionLabel: onRefresh != null ? s.refresh : null,
+      onAction: onRefresh,
+    );
+  }

  /// Creates an empty state for playlists
-  factory EmptyState.playlists({VoidCallback? onRefresh}) => EmptyState(
-        icon: Icons.playlist_play_rounded,
-        message: 'No playlists found',
-        actionLabel: onRefresh != null ? 'Refresh' : null,
-        onAction: onRefresh,
-      );
+  factory EmptyState.playlists({VoidCallback? onRefresh, required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.playlist_play_rounded,
+      message: s.noPlaylistsFound,
+      actionLabel: onRefresh != null ? s.refresh : null,
+      onAction: onRefresh,
+    );
+  }

  /// Creates an empty state for queue
-  factory EmptyState.queue() => const EmptyState(
-        icon: Icons.queue_music,
-        message: 'Queue is empty',
-      );
+  factory EmptyState.queue({required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.queue_music,
+      message: s.queueIsEmpty,
+    );
+  }

  /// Creates an empty state for search results
-  factory EmptyState.search() => const EmptyState(
-        icon: Icons.search_off_rounded,
-        message: 'No results found',
-      );
+  factory EmptyState.search({required BuildContext context}) {
+    final s = S.of(context)!;
+    return EmptyState(
+      icon: Icons.search_off_rounded,
+      message: s.noResultsFound,
+    );
+  }

  /// Creates a custom empty state with title and subtitle
  factory EmptyState.custom({
@@ -70,12 +89,14 @@ class EmptyState extends StatelessWidget {
    required String title,
    String? subtitle,
    VoidCallback? onRefresh,
+    required BuildContext context,
  }) =>
      _CustomEmptyState(
        icon: icon,
        title: title,
        subtitle: subtitle,
        onRefresh: onRefresh,
+        context: context,
      );

  @override
@@ -126,17 +147,20 @@ class _CustomEmptyState extends EmptyState {
  final String title;
  final String? subtitle;
  final VoidCallback? onRefresh;
+  final BuildContext context;

  const _CustomEmptyState({
    required super.icon,
    required this.title,
    this.subtitle,
    this.onRefresh,
+    required this.context,
  }) : super(message: title);

  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;
+    final s = S.of(context)!;

    return Center(
      child: Padding(
@@ -175,7 +199,7 @@ class _CustomEmptyState extends EmptyState {
              ElevatedButton.icon(
                onPressed: onRefresh,
                icon: const Icon(Icons.refresh_rounded),
-                label: const Text('Refresh'),
+                label: Text(s.refresh),
                style: ElevatedButton.styleFrom(
                  backgroundColor: colorScheme.surfaceVariant,
                  foregroundColor: colorScheme.onSurfaceVariant,
@@ -10,6 +10,7 @@ import '../models/player.dart';
 import '../services/animation_debugger.dart';
 import '../theme/palette_helper.dart';
 import '../theme/theme_provider.dart';
+import '../l10n/app_localizations.dart';
 import 'animated_icon_button.dart';
 import 'global_player_overlay.dart';
 import 'volume_control.dart';
@@ -400,7 +401,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
-            content: Text('Failed to update favorite: $e'),
+            content: Text(S.of(context)!.failedToUpdateFavorite(e.toString())),
            duration: const Duration(seconds: 2),
          ),
        );
@@ -1001,7 +1002,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
    // Artist: medium weight, secondary (18px expanded, was 16px)
    // Album: light, tertiary (15px expanded, was 13px)
    final titleFontSize = _lerpDouble(16.0, 24.0, t);
-    final artistFontSize = _lerpDouble(14.0, 18.0, t); // Increased from 16 to 18
+    final artistFontSize = _lerpDouble(14.0, 18.0, t); // 14px collapsed, 18px expanded

    final collapsedTitleLeft = _collapsedArtSize + 8; // Reduced from 12 to 8 (4px less)
    final expandedTitleLeft = contentPadding;
@@ -1009,7 +1010,10 @@ class ExpandablePlayerState extends State<ExpandablePlayer>

    final collapsedTitleTop = (_collapsedHeight - 36) / 2; // Centered vertically (adjusted for increased track/artist gap)

-    final collapsedTitleWidth = screenSize.width - _collapsedArtSize - 150;
+    // Controls: 36 (prev) + 34 (play) + 36 (next) + 8 (right margin) = 114px from widget right
+    // For 8px gap: text ends at widgetWidth - 114 - 8 = widgetWidth - 122
+    // Note: collapsedWidth = screenSize.width - 24 (12px margin each side)
+    final collapsedTitleWidth = collapsedWidth - collapsedTitleLeft - 122;
    final expandedTitleWidth = screenSize.width - (contentPadding * 2);
    final titleWidth = _lerpDouble(collapsedTitleWidth, expandedTitleWidth, t);

@@ -1213,6 +1217,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                // Must have peek data to render
                if (t < 0.1 && _peekPlayer != null && (_slideOffset.abs() > 0.01 || _inTransition))
                  _buildPeekContent(
+                    context: context,
                    maProvider: maProvider,
                    peekPlayer: _peekPlayer,
                    peekImageUrl: _peekImageUrl,
@@ -1304,6 +1309,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                        ),
                        textAlign: t > 0.5 ? TextAlign.center : TextAlign.left,
                        maxLines: t > 0.5 ? 2 : 1,
+                        softWrap: t > 0.5, // false in collapsed to ensure ellipsis truncation
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
@@ -1322,7 +1328,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                      width: titleWidth,
                      child: Text(
                        maProvider.isPlayingAudiobook
-                            ? (maProvider.currentAudiobook?.authorsString ?? 'Unknown Author')
+                            ? (maProvider.currentAudiobook?.authorsString ?? S.of(context)!.unknownAuthor)
                            : currentTrack.artistsString,
                        style: TextStyle(
                          color: textColor.withOpacity(t > 0.5 ? 0.7 : 0.6),
@@ -1331,6 +1337,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                        ),
                        textAlign: t > 0.5 ? TextAlign.center : TextAlign.left,
                        maxLines: 1,
+                        softWrap: t > 0.5, // false in collapsed to ensure ellipsis truncation
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
@@ -1382,7 +1389,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                          ),
                          const SizedBox(width: 6),
                          Text(
-                            maProvider.currentAudioFormat ?? 'PCM Audio',
+                            maProvider.currentAudioFormat ?? S.of(context)!.pcmAudio,
                            style: TextStyle(
                              color: primaryColor.withOpacity(0.7),
                              fontSize: 12,
@@ -1438,7 +1445,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                                          } catch (e) {
                                            if (mounted) {
                                              ScaffoldMessenger.of(context).showSnackBar(
-                                                SnackBar(content: Text('Error seeking: $e')),
+                                                SnackBar(content: Text(S.of(context)!.errorSeeking(e.toString()))),
                                              );
                                            }
                                          } finally {
@@ -1706,6 +1713,7 @@ class ExpandablePlayerState extends State<ExpandablePlayer>

  /// Build the peek player content that slides in from the edge during drag
  Widget _buildPeekContent({
+    required BuildContext context,
    required MusicAssistantProvider maProvider,
    required dynamic peekPlayer,
    required String? peekImageUrl,
@@ -1745,8 +1753,8 @@ class ExpandablePlayerState extends State<ExpandablePlayer>

    // Check if peek player has a track - if not, show device info instead
    final hasTrack = _peekTrack != null && peekImageUrl != null;
-    final peekTrackName = hasTrack ? _peekTrack!.name : (peekPlayer?.name ?? 'Unknown');
-    final peekArtistName = hasTrack ? (_peekTrack!.artistsString ?? '') : 'Swipe to switch device';
+    final peekTrackName = hasTrack ? _peekTrack!.name : (peekPlayer?.name ?? S.of(context)!.unknown);
+    final peekArtistName = hasTrack ? (_peekTrack!.artistsString ?? '') : S.of(context)!.swipeToSwitchDevice;

    return Stack(
      children: [
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../l10n/app_localizations.dart';
 import '../providers/music_assistant_provider.dart';
 import '../providers/navigation_provider.dart';
 import '../theme/theme_provider.dart';
@@ -206,26 +207,26 @@ class _GlobalPlayerOverlayState extends State<GlobalPlayerOverlay>
                      type: BottomNavigationBarType.fixed,
                      selectedFontSize: 12,
                      unselectedFontSize: 12,
-                      items: const [
+                      items: [
                        BottomNavigationBarItem(
-                          icon: Icon(Icons.home_outlined),
-                          activeIcon: Icon(Icons.home_rounded),
-                          label: 'Home',
+                          icon: const Icon(Icons.home_outlined),
+                          activeIcon: const Icon(Icons.home_rounded),
+                          label: S.of(context)!.home,
                        ),
                        BottomNavigationBarItem(
-                          icon: Icon(Icons.library_music_outlined),
-                          activeIcon: Icon(Icons.library_music_rounded),
-                          label: 'Library',
+                          icon: const Icon(Icons.library_music_outlined),
+                          activeIcon: const Icon(Icons.library_music_rounded),
+                          label: S.of(context)!.library,
                        ),
                        BottomNavigationBarItem(
-                          icon: Icon(Icons.search_rounded),
-                          activeIcon: Icon(Icons.search_rounded),
-                          label: 'Search',
+                          icon: const Icon(Icons.search_rounded),
+                          activeIcon: const Icon(Icons.search_rounded),
+                          label: S.of(context)!.search,
                        ),
                        BottomNavigationBarItem(
-                          icon: Icon(Icons.settings_outlined),
-                          activeIcon: Icon(Icons.settings_rounded),
-                          label: 'Settings',
+                          icon: const Icon(Icons.settings_outlined),
+                          activeIcon: const Icon(Icons.settings_rounded),
+                          label: S.of(context)!.settings,
                        ),
                      ],
                    ),
@@ -3,6 +3,7 @@ import '../../providers/music_assistant_provider.dart';
 import '../../models/media_item.dart' show Audiobook, Chapter;
 import '../../theme/design_tokens.dart';
 import '../common/empty_state.dart';
+import '../../l10n/app_localizations.dart';

 /// Panel that displays audiobook chapters for navigation
 class ChaptersPanel extends StatelessWidget {
@@ -58,7 +59,7 @@ class ChaptersPanel extends StatelessWidget {
                ),
                const Spacer(),
                Text(
-                  'Chapters',
+                  S.of(context)!.chapters,
                  style: TextStyle(
                    color: textColor,
                    fontSize: 18,
@@ -75,7 +76,7 @@ class ChaptersPanel extends StatelessWidget {
          // Chapters list
          Expanded(
            child: chapters.isEmpty
-                ? _buildEmptyState()
+                ? _buildEmptyState(context)
                : _buildChaptersList(chapters, currentChapterIndex),
          ),
        ],
@@ -83,11 +84,12 @@ class ChaptersPanel extends StatelessWidget {
    );
  }

-  Widget _buildEmptyState() {
+  Widget _buildEmptyState(BuildContext context) {
    return EmptyState.custom(
+      context: context,
      icon: Icons.bookmark_outline_rounded,
-      title: 'No chapters',
-      subtitle: 'This audiobook has no chapter information',
+      title: S.of(context)!.noChapters,
+      subtitle: S.of(context)!.noChapterInfo,
    );
  }

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import '../../l10n/app_localizations.dart';
 import '../../theme/design_tokens.dart';

 /// A compact device selector bar shown when no track is playing
@@ -52,7 +53,7 @@ class DeviceSelectorBar extends StatelessWidget {
              children: [
                // Peek player content (shows when dragging)
                if (slideOffset.abs() > 0.01 && peekPlayer != null)
-                  _buildPeekContent(),
+                  _buildPeekContent(context),

                // Current player content
                Transform.translate(
@@ -84,10 +85,10 @@ class DeviceSelectorBar extends StatelessWidget {
                              ),
                              if (hasMultiplePlayers)
                                Text(
-                                  'Swipe to switch device',
+                                  S.of(context)!.swipeToSwitchDevice,
                                  style: TextStyle(
                                    color: textColor.withOpacity(0.6),
-                                    fontSize: 12,
+                                    fontSize: 14,
                                  ),
                                ),
                            ],
@@ -106,7 +107,7 @@ class DeviceSelectorBar extends StatelessWidget {
  }

  /// Build peek player content that slides in from the edge
-  Widget _buildPeekContent() {
+  Widget _buildPeekContent(BuildContext context) {
    final isFromRight = slideOffset < 0;
    final peekProgress = slideOffset.abs();

@@ -144,10 +145,10 @@ class DeviceSelectorBar extends StatelessWidget {
                  ),
                  if (hasMultiplePlayers)
                    Text(
-                      'Swipe to switch device',
+                      S.of(context)!.swipeToSwitchDevice,
                      style: TextStyle(
                        color: textColor.withOpacity(0.6),
-                        fontSize: 12,
+                        fontSize: 14,
                      ),
                    ),
                ],
@@ -70,7 +70,7 @@ class QueuePanel extends StatelessWidget {
            child: isLoading
                ? Center(child: CircularProgressIndicator(color: primaryColor))
                : queue == null || queue!.items.isEmpty
-                    ? _buildEmptyState()
+                    ? _buildEmptyState(context)
                    : _buildQueueList(),
          ),
        ],
@@ -78,8 +78,8 @@ class QueuePanel extends StatelessWidget {
    );
  }

-  Widget _buildEmptyState() {
-    return EmptyState.queue();
+  Widget _buildEmptyState(BuildContext context) {
+    return EmptyState.queue(context: context);
  }

  Widget _buildQueueList() {
@@ -4,6 +4,7 @@ import 'package:material_design_icons_flutter/material_design_icons_flutter.dart
 import 'package:provider/provider.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import '../constants/timings.dart';
+import '../l10n/app_localizations.dart';
 import '../providers/music_assistant_provider.dart';
 import 'global_player_overlay.dart'; // For isPlayerExpanded and collapsePlayer

@@ -182,7 +183,7 @@ class _PlayerSelectorSheetState extends State<_PlayerSelectorSheet> {
                      child: currentPlayers.isEmpty
                          ? Center(
                              child: Text(
-                                'No players available',
+                                S.of(context)!.noPlayersAvailable,
                                style: TextStyle(color: colorScheme.onSurface.withOpacity(0.54)),
                              ),
                            )
@@ -304,12 +305,12 @@ class _PlayerSelectorSheetState extends State<_PlayerSelectorSheet> {
                                                  Expanded(
                                                    child: Text(
                                                      !player.available
-                                                          ? 'Unavailable'
+                                                          ? S.of(context)!.playerStateUnavailable
                                                          : !isOn
-                                                              ? 'Off'
+                                                              ? S.of(context)!.playerStateOff
                                                              : hasContent && playerTrack != null
                                                                  ? playerTrack.name
-                                                                  : 'Idle',
+                                                                  : S.of(context)!.playerStateIdle,
                                                      style: TextStyle(
                                                        color: player.available
                                                            ? colorScheme.onSurfaceVariant
@@ -329,7 +330,7 @@ class _PlayerSelectorSheetState extends State<_PlayerSelectorSheet> {
                                                        borderRadius: BorderRadius.circular(4),
                                                      ),
                                                      child: Text(
-                                                        'Selected',
+                                                        S.of(context)!.playerSelected,
                                                        style: TextStyle(
                                                          color: colorScheme.primary,
                                                          fontSize: 10,
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:cached_network_image/cached_network_image.dart';
+import 'package:palette_generator/palette_generator.dart';
 import '../models/media_item.dart';
 import '../providers/music_assistant_provider.dart';
 import '../services/debug_logger.dart';
@@ -30,6 +31,10 @@ class _SeriesRowState extends State<SeriesRow> with AutomaticKeepAliveClientMixi
  // Cache for series cover images
  final Map<String, List<String>> _seriesCovers = {};
  final Set<String> _loadingCovers = {};
+  // Cache for series book counts
+  final Map<String, int> _seriesBookCounts = {};
+  // Cache for extracted colors from covers
+  final Map<String, List<Color>> _seriesExtractedColors = {};

  @override
  bool get wantKeepAlive => true;
@@ -70,7 +75,10 @@ class _SeriesRowState extends State<SeriesRow> with AutomaticKeepAliveClientMixi
        if (mounted) {
          setState(() {
            _seriesCovers[seriesId] = covers;
+            _seriesBookCounts[seriesId] = books.length;
          });
+          // Extract colors asynchronously
+          _extractSeriesColors(seriesId, covers);
        }
      }
    } finally {
@@ -78,6 +86,44 @@ class _SeriesRowState extends State<SeriesRow> with AutomaticKeepAliveClientMixi
    }
  }

+  /// Extract colors from series book covers for empty cell backgrounds
+  Future<void> _extractSeriesColors(String seriesId, List<String> covers) async {
+    if (_seriesExtractedColors.containsKey(seriesId) || covers.isEmpty) return;
+
+    final extractedColors = <Color>[];
+
+    for (final url in covers.take(4)) {
+      try {
+        final palette = await PaletteGenerator.fromImageProvider(
+          CachedNetworkImageProvider(url),
+          maximumColorCount: 8,
+        );
+
+        if (palette.darkMutedColor != null) {
+          extractedColors.add(palette.darkMutedColor!.color);
+        }
+        if (palette.mutedColor != null) {
+          extractedColors.add(palette.mutedColor!.color);
+        }
+        if (palette.darkVibrantColor != null) {
+          extractedColors.add(palette.darkVibrantColor!.color);
+        }
+        if (palette.dominantColor != null) {
+          final hsl = HSLColor.fromColor(palette.dominantColor!.color);
+          extractedColors.add(hsl.withLightness((hsl.lightness * 0.4).clamp(0.1, 0.3)).toColor());
+        }
+      } catch (e) {
+        _logger.log('📚 Error extracting colors: $e');
+      }
+    }
+
+    if (extractedColors.isNotEmpty && mounted) {
+      setState(() {
+        _seriesExtractedColors[seriesId] = extractedColors;
+      });
+    }
+  }
+
  static final _logger = DebugLogger();

  @override
@@ -165,6 +211,8 @@ class _SeriesRowState extends State<SeriesRow> with AutomaticKeepAliveClientMixi
                          child: _SeriesCard(
                            series: s,
                            covers: _seriesCovers[s.id],
+                            cachedBookCount: _seriesBookCounts[s.id],
+                            extractedColors: _seriesExtractedColors[s.id],
                            colorScheme: colorScheme,
                            textTheme: textTheme,
                          ),
@@ -187,37 +235,59 @@ class _SeriesRowState extends State<SeriesRow> with AutomaticKeepAliveClientMixi
 class _SeriesCard extends StatelessWidget {
  final AudiobookSeries series;
  final List<String>? covers;
+  final int? cachedBookCount;
+  final List<Color>? extractedColors;
  final ColorScheme colorScheme;
  final TextTheme textTheme;

+  // Fallback colors when no extracted colors available
+  static const _fallbackColors = [
+    Color(0xFF2D3436), // Dark slate
+    Color(0xFF34495E), // Dark blue-grey
+    Color(0xFF4A3728), // Dark brown
+    Color(0xFF2C3E50), // Midnight blue
+    Color(0xFF3D3D3D), // Charcoal
+    Color(0xFF4A4458), // Dark purple-grey
+    Color(0xFF3E4A47), // Dark teal-grey
+    Color(0xFF4A3F35), // Dark warm grey
+  ];
+
  const _SeriesCard({
    required this.series,
    required this.covers,
+    this.cachedBookCount,
+    this.extractedColors,
    required this.colorScheme,
    required this.textTheme,
  });

  @override
  Widget build(BuildContext context) {
+    final heroTag = 'series_cover_home_${series.id}';
+
    return GestureDetector(
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
-            builder: (context) => AudiobookSeriesScreen(series: series),
+            builder: (context) => AudiobookSeriesScreen(
+              series: series,
+              heroTag: heroTag,
+              initialCovers: covers,
+            ),
          ),
        );
      },
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
-          Expanded(
-            child: ClipRRect(
-              borderRadius: BorderRadius.circular(8),
-              child: Container(
-                width: double.infinity,
-                height: double.infinity,
-                color: colorScheme.surfaceVariant,
+          // Use AspectRatio to guarantee square cover
+          Hero(
+            tag: heroTag,
+            child: AspectRatio(
+              aspectRatio: 1,
+              child: ClipRRect(
+                borderRadius: BorderRadius.circular(8),
                child: _buildCoverGrid(),
              ),
            ),
@@ -231,15 +301,20 @@ class _SeriesCard extends StatelessWidget {
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
          ),
-          if (series.bookCount != null)
-            Text(
-              '${series.bookCount} ${series.bookCount == 1 ? 'book' : 'books'}',
-              style: textTheme.bodySmall?.copyWith(
-                color: colorScheme.onSurface.withOpacity(0.6),
-              ),
-              maxLines: 1,
-              overflow: TextOverflow.ellipsis,
-            ),
+          Builder(
+            builder: (context) {
+              final count = series.bookCount ?? cachedBookCount;
+              if (count == null) return const SizedBox.shrink();
+              return Text(
+                '$count ${count == 1 ? 'book' : 'books'}',
+                style: textTheme.bodySmall?.copyWith(
+                  color: colorScheme.onSurface.withOpacity(0.7),
+                ),
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
+              );
+            },
+          ),
        ],
      ),
    );
@@ -247,7 +322,7 @@ class _SeriesCard extends StatelessWidget {

  Widget _buildCoverGrid() {
    if (covers == null || covers!.isEmpty) {
-      // Static placeholder - no animation
+      // Static placeholder
      return Container(
        color: colorScheme.surfaceContainerHighest,
        child: Center(
@@ -270,29 +345,97 @@ class _SeriesCard extends StatelessWidget {
      gridSize = 3;
    }

-    final displayCovers = covers!.take(gridSize * gridSize).toList();
+    // Pad covers to fill grid
+    final displayCovers = List<String?>.filled(gridSize * gridSize, null);
+    for (var i = 0; i < covers!.length && i < displayCovers.length; i++) {
+      displayCovers[i] = covers![i];
+    }

-    return GridView.builder(
-      physics: const NeverScrollableScrollPhysics(),
-      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-        crossAxisCount: gridSize,
-        childAspectRatio: 1,
-        crossAxisSpacing: 1,
-        mainAxisSpacing: 1,
-      ),
-      itemCount: displayCovers.length,
-      itemBuilder: (context, index) {
-        return CachedNetworkImage(
-          imageUrl: displayCovers[index],
-          fit: BoxFit.cover,
-          placeholder: (_, __) => Container(
-            color: colorScheme.surfaceContainerHighest,
-          ),
-          errorWidget: (_, __, ___) => Container(
-            color: colorScheme.surfaceContainerHighest,
+    // Use series ID to pick consistent colors
+    final colorSeed = series.id.hashCode;
+
+    // Get colors for empty cells
+    final emptyColors = (extractedColors != null && extractedColors!.isNotEmpty)
+        ? extractedColors!
+        : _fallbackColors;
+
+    // Build grid using Column/Row (parent AspectRatio ensures square)
+    return Column(
+      children: List.generate(gridSize, (row) {
+        return Expanded(
+          child: Row(
+            children: List.generate(gridSize, (col) {
+              final index = row * gridSize + col;
+              final coverUrl = displayCovers[index];
+
+              return Expanded(
+                child: coverUrl != null
+                    ? CachedNetworkImage(
+                        imageUrl: coverUrl,
+                        fit: BoxFit.cover,
+                        placeholder: (_, __) => Container(
+                          color: colorScheme.surfaceContainerHighest,
+                        ),
+                        errorWidget: (_, __, ___) => Container(
+                          color: colorScheme.surfaceContainerHighest,
+                        ),
+                      )
+                    : _buildEmptyCell(colorSeed, index, emptyColors),
+              );
+            }),
          ),
        );
-      },
+      }),
+    );
+  }
+
+  /// Builds an empty cell with either a solid color or a nested grid
+  Widget _buildEmptyCell(int colorSeed, int cellIndex, List<Color> emptyColors) {
+    // Tone down colors
+    final colors = emptyColors.map((c) {
+      final hsl = HSLColor.fromColor(c);
+      return hsl
+          .withSaturation((hsl.saturation * 0.5).clamp(0.05, 0.25))
+          .withLightness((hsl.lightness * 0.7).clamp(0.08, 0.20))
+          .toColor();
+    }).toList();
+
+    // Use combined seed for deterministic but varied patterns
+    final seed = colorSeed + cellIndex * 17;
+
+    // Determine nested grid size: 1 (solid), 2 (2x2), or 3 (3x3)
+    // Distribution: ~50% solid, ~30% 2x2, ~20% 3x3
+    final sizeRoll = seed.abs() % 100;
+    int nestedSize;
+    if (sizeRoll < 50) {
+      nestedSize = 1;
+    } else if (sizeRoll < 80) {
+      nestedSize = 2;
+    } else {
+      nestedSize = 3;
+    }
+
+    if (nestedSize == 1) {
+      final colorIndex = seed.abs() % colors.length;
+      return Container(color: colors[colorIndex]);
+    }
+
+    // Build nested grid (seamless)
+    return Column(
+      children: List.generate(nestedSize, (row) {
+        return Expanded(
+          child: Row(
+            children: List.generate(nestedSize, (col) {
+              final nestedIndex = row * nestedSize + col;
+              final nestedSeed = seed + nestedIndex * 7;
+              final colorIndex = nestedSeed.abs() % colors.length;
+              return Expanded(
+                child: Container(color: colors[colorIndex]),
+              );
+            }),
+          ),
+        );
+      }),
    );
  }
 }
@@ -1,7 +1,7 @@
 name: ensemble
 description: A minimalistic Music Assistant client built with Flutter
 publish_to: 'none'
-version: 2.1.2-beta+18
+version: 2.3.3-beta+25

 environment:
  sdk: '>=3.0.0 <4.0.0'
@@ -9,6 +9,9 @@ environment:
 dependencies:
  flutter:
    sdk: flutter
+  flutter_localizations:
+    sdk: flutter
+  intl: ^0.19.0

  # UI
  material_design_icons_flutter: ^7.0.7296
@@ -54,6 +57,7 @@ dev_dependencies:
  drift_dev: ^2.22.1

 flutter:
+  generate: true
  uses-material-design: true

  assets: