feat: add CreatePlaylistModal component for creating new playlists

feat: implement useKeyboard composable for keyboard controls in the player

feat: create PlaylistDetail view to display playlist information and tracks

src/views/LibraryPage.vue

@@ -19,7 +19,7 @@
           <div class="aspect-square bg-gray-300 relative overflow-hidden">
             <img v-if="track.coverUrl" :src="formatUrl(track.coverUrl)" class="w-full h-full object-cover" />
             <div class="absolute bottom-2 right-2 w-10 h-10 rounded-full flex items-center justify-center border-2 border-black opacity-0 group-hover:opacity-100 transition-opacity"
-              :class="isCurrentTrack(track) ? 'bg-white' : 'bg-noctune-yellow'">
+              :class="isCurrentTrack(track) && playerStore.isPlaying ? 'bg-white' : 'bg-noctune-yellow'">
               <svg v-if="isCurrentTrack(track) && playerStore.isPlaying" class="w-5 h-5 text-black" fill="currentColor" viewBox="0 0 24 24"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg>
               <svg v-else class="w-5 h-5 ml-0.5 text-black" fill="currentColor" viewBox="0 0 24 24"><path d="M8 5v14l11-7z"/></svg>
             </div>
@@ -37,7 +37,15 @@
         All Tracks
         <svg class="w-5 h-5 ml-2" fill="currentColor" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
       </h2>
-      <div v-if="allLoading" class="text-center py-8 text-gray-500">Loading...</div>
+      <div v-if="allLoading" class="space-y-3 p-4">
+        <div v-for="i in 5" :key="i" class="flex items-center gap-4 animate-pulse">
+          <div class="w-8 h-4 bg-gray-200 rounded" />
+          <div class="w-10 h-10 bg-gray-200 rounded-lg" />
+          <div class="h-3 bg-gray-200 rounded flex-1" />
+          <div class="h-3 bg-gray-200 rounded w-24" />
+          <div class="h-3 bg-gray-200 rounded w-20" />
+        </div>
+      </div>
       <div v-else class="bg-white rounded-2xl border-4 border-black overflow-hidden">
         <div class="bg-noctune-teal px-6 py-3 flex items-center text-black font-bold border-b-4 border-black">
           <span class="flex-1">TITLE</span>
@@ -49,6 +57,7 @@
           <div v-for="(track, index) in allTracks" :key="track._id"
             @click="playTrack(track, false, index)"
             class="px-6 py-3 flex items-center hover:bg-gray-50 transition-colors cursor-pointer"
+            :class="isCurrentTrack(track) ? 'bg-noctune-teal/10' : ''"
           >
             <div class="flex-1 flex items-center gap-3">
               <span class="text-sm text-gray-400 w-6">