diff --git a/js/events.js b/js/events.js
index d660f6b..b46bd9d 100644
--- a/js/events.js
+++ b/js/events.js
@@ -2249,6 +2249,34 @@ export function initializeTrackInteractions(player, api, mainContent, contextMen
                 return;
             }
 
+            const libraryTracksContainer = card.closest('#library-tracks-container');
+            if (libraryTracksContainer && card.dataset.trackId) {
+                if (
+                    e.target.closest('.like-btn') ||
+                    e.target.closest('.card-play-btn') ||
+                    e.target.closest('.card-menu-btn')
+                ) {
+                    return;
+                }
+                e.preventDefault();
+                const clickedTrackId = card.dataset.trackId;
+                const clickedTrack = trackDataStore.get(card);
+                if (!clickedTrack) return;
+                const allTrackElements = Array.from(
+                    libraryTracksContainer.querySelectorAll('.card[data-track-id]')
+                );
+                const trackList = allTrackElements.map((el) => trackDataStore.get(el)).filter(Boolean);
+                if (trackList.length === 0) return;
+                const startIndex = trackList.findIndex((t) => t.id == clickedTrackId);
+                player.setQueue(trackList, startIndex);
+                if (ui.currentPage === 'artist' && ui.currentArtistId) {
+                    player.setArtistPopularTracksContext(ui.currentArtistId, trackList, trackList.length, true);
+                }
+                document.getElementById('shuffle-btn').classList.remove('active');
+                player.playTrackFromQueue();
+                return;
+            }
+
             const href = card.dataset.href;
             if (href) {
                 // Allow native links inside card to work if any exist
diff --git a/js/ui.js b/js/ui.js
index 10fa97a..2f19747 100644
--- a/js/ui.js
+++ b/js/ui.js
@@ -1959,7 +1959,7 @@ export class UIRenderer {
 
             if (visiblePlaylists.length) {
                 myPlaylistsContainer.insertAdjacentHTML(
-                    'afterbegin',
+                    'beforeend',
                     visiblePlaylists.map((p) => this.createUserPlaylistCardHTML(p)).join('')
                 );
                 visiblePlaylists.forEach((playlist) => {
diff --git a/styles.css b/styles.css
index 60522dc..fcf503b 100644
--- a/styles.css
+++ b/styles.css
@@ -6047,6 +6047,10 @@ img[src=''] {
     margin-bottom: var(--spacing-lg);
 }
 
+#page-library #my-playlists-container .library-create-dashed-card {
+    order: 1;
+}
+
 #page-library .library-create-dashed-card {
     display: block;
     width: 100%;