remove broken image caching, improve css

index.html

@@ -463,6 +463,8 @@
                         <ul>
                             <li>High-quality lossless audio streaming</li>
                             <li>Lyrics support with karaoke mode</li>
+                            <li>Recently Played tracking for easy history access</li>
+                            <li>Comprehensive Personal Library for favorites</li>
                             <li>Intelligent API caching for improved performance</li>
                             <li>Offline-capable Progressive Web App (PWA)</li>
                             <li>Media Session API integration for system controls</li>

styles.css

@@ -602,6 +602,10 @@ body.has-page-background .track-item:hover {
     transition: transform 0.2s ease, color 0.2s ease;
 }
 
+.like-btn:hover .heart-icon {
+    color: #ef4444;
+}
+
 .heart-icon.filled {
     color: #ef4444;
     fill: #ef4444;
@@ -3242,3 +3246,10 @@ input:checked + .slider::before {
     align-items: center;
     justify-content: center;
 }
+
+/* Show a grey box for images with no source, hiding the broken icon */
+img:not([src]), img[src=''] {
+    content: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
+    background-color: var(--muted);
+}
+

sw.js

@@ -1,6 +1,5 @@
 //sw.js
 const CACHE_NAME = 'monochrome-v4';
-const IMAGE_CACHE_NAME = 'monochrome-images-v1';
 const urlsToCache = [
     '/',
     '/index.html',
@@ -38,26 +37,6 @@ self.addEventListener('install', event => {
 self.addEventListener('fetch', event => {
     const url = new URL(event.request.url);
 
-    // Cache Images (Cache-First)
-    if (url.hostname === 'resources.tidal.com' || url.hostname === 'picsum.photos') {
-        event.respondWith(
-            caches.open(IMAGE_CACHE_NAME).then(cache => {
-                return cache.match(event.request).then(response => {
-                    return response || fetch(event.request).then(networkResponse => {
-                        if (networkResponse.ok) {
-                            cache.put(event.request, networkResponse.clone());
-                        }
-                        return networkResponse;
-                    }).catch(() => {
-                        // If fetch fails (e.g. CORS), return null/error so client handles it
-                        return new Response(null, { status: 404, statusText: 'Image fetch failed' });
-                    });
-                });
-            })
-        );
-        return;
-    }
-
     // Static Assets & App Shell (Cache-First)
     event.respondWith(
         caches.match(event.request)
@@ -72,7 +51,7 @@ self.addEventListener('fetch', event => {
 });
 
 self.addEventListener('activate', event => {
-    const cacheWhitelist = [CACHE_NAME, IMAGE_CACHE_NAME];
+    const cacheWhitelist = [CACHE_NAME];
     event.waitUntil(
         caches.keys().then(cacheNames => {
             return Promise.all(