feat(pwa-offline): Pinia store + IndexedDB; contexto para cache/eliminación; toasts; compatibilidad PWA offline

- Agrega @pinia/nuxt, idb y store central (stores/music.ts)
- Cacheo manual desde menú contextual y borrado (TrackContextMenu)
- Ícono verde para canciones cacheadas, sin auto-cache al reproducir
- Toasts de feedback (stores/toast.ts, ToastContainer)
- Fallback offline de listado a IndexedDB; fix MUSIC_DIR absoluto en preview/prod
- Ajustes PWA: navigateFallback '/', devOptions, workbox condicional
- Estilos y animación del context menu (tema light/dark, blur fuerte)
- Correcciones de sintaxis y posicionamiento exacto al cursor

components/TrackList.client.vue

@@ -30,17 +30,33 @@
           :is-playing="currentTrack?.name === track.name && isPlaying"
           :is-loading="loadingTrack === track.name"
           :has-error="failedTracks.has(track.name)"
+          :is-cached="isTrackCached(track)"
           @click="handleTrackClick(track, index)"
+          @context="handleContextFromItem"
           class="track-item-wrapper animate-fade-in-up"
         />
       </div>
+      <TrackContextMenu 
+        :visible="showMenu"
+        :x="menuX"
+        :y="menuY"
+        :track="menuTrack"
+        :is-cached="menuTrack ? isTrackCached(menuTrack) : false"
+        @close="closeMenu"
+        @cache="cacheSelected"
+        @delete="deleteSelected"
+      />
     </div>
   </div>
 </template>
 
 <script setup>
+import { ref } from 'vue'
 import { Music } from 'lucide-vue-next'
 import TrackListItem from './TrackListItem.client.vue'
+import { useMusicStore } from '~/stores/music'
+import TrackContextMenu from './TrackContextMenu.client.vue'
+import { useToastStore } from '~/stores/toast'
 
 const props = defineProps({
   tracks: {
@@ -78,6 +94,43 @@ const emit = defineEmits(['track-selected'])
 const handleTrackClick = (track, index) => {
   emit('track-selected', { track, index })
 }
+
+const musicStore = useMusicStore()
+const toast = useToastStore()
+const isTrackCached = (track) => musicStore.isCached(track.name)
+
+// Context menu state and handlers
+const showMenu = ref(false)
+const menuX = ref(0)
+const menuY = ref(0)
+const menuTrack = ref(null)
+
+const handleContextFromItem = ({ track, x, y }) => {
+  menuTrack.value = track
+  menuX.value = x
+  menuY.value = y
+  showMenu.value = true
+}
+
+const closeMenu = () => { showMenu.value = false }
+
+const cacheSelected = async () => {
+  if (!menuTrack.value) return
+  const ok = await musicStore.cacheByName(menuTrack.value.name, menuTrack.value.duration)
+  if (ok) {
+    toast.success(`Guardado offline: ${menuTrack.value.name}`)
+  } else {
+    toast.error(`No se pudo guardar: ${menuTrack.value.name}`)
+  }
+  closeMenu()
+}
+
+const deleteSelected = async () => {
+  if (!menuTrack.value) return
+  await musicStore.deleteCachedTrack(menuTrack.value.name)
+  toast.info(`Eliminado de memoria: ${menuTrack.value.name}`)
+  closeMenu()
+}
 </script>
 
 <style scoped>