feat(library): genre sliders, artist links, and navigation utils

- music landing: diverse per-genre album sliders (online counts /
  offline wide-probe fallback) and home-screen library shortcuts
- add ArtistLinks component and shared navigation/genreDiversity utils
- player/playback-mode refinements across Rust and frontend

src/routes/library/music/+page.svelte

@@ -2,6 +2,7 @@
 <script lang="ts">
   import { onMount } from "svelte";
   import { goto } from "$app/navigation";
+  import { navigateBack } from "$lib/utils/navigation";
   import { auth } from "$lib/stores/auth";
   import { currentLibrary } from "$lib/stores/library";
   import { music } from "$lib/stores/music";
@@ -86,6 +87,7 @@
   const newlyAdded = $derived($music.newlyAdded);
   const playlists = $derived($music.playlists);
   const rediscover = $derived($music.rediscover);
+  const genreRows = $derived($music.genreRows);
   const isLoading = $derived($music.isLoading);
   const hasContent = $derived(
     heroItems.length > 0 ||
@@ -106,7 +108,7 @@
     <div class="flex items-center justify-between px-4">
       <h1 class="text-3xl font-bold text-white">Music</h1>
       <button
-        onclick={() => goto("/library")}
+        onclick={() => navigateBack("/library")}
         class="p-2 rounded-lg hover:bg-white/10 transition-colors text-gray-400 hover:text-white"
         title="Back to libraries"
         aria-label="Back to libraries"
@@ -160,6 +162,16 @@
       />
     {/if}
 
+    <!-- One slider per genre -->
+    {#each genreRows as row (row.id)}
+      <Carousel
+        title={row.name}
+        items={row.items}
+        onItemClick={handleItemClick}
+        showAll={() => goto("/library/music/genres")}
+      />
+    {/each}
+
     {#if !hasContent}
       <p class="px-4 text-gray-400">Nothing here yet. Start playing some music to fill this page.</p>
     {/if}