diff --git a/package.json b/package.json
index d6ca7d20..389b67ff 100644
--- a/package.json
+++ b/package.json
@@ -44,7 +44,7 @@
     "focus-trap-react": "^10.2.3",
     "fscreen": "^1.2.0",
     "fuse.js": "^7.0.0",
-    "hls.js": "^1.5.7",
+    "hls.js": "^1.5.8",
     "i18next": "^23.11.1",
     "immer": "^10.0.4",
     "jwt-decode": "^4.0.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 76453d8e..54e11a23 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -67,8 +67,8 @@ dependencies:
     specifier: ^7.0.0
     version: 7.0.0
   hls.js:
-    specifier: ^1.5.7
-    version: 1.5.7
+    specifier: ^1.5.8
+    version: 1.5.8
   i18next:
     specifier: ^23.11.1
     version: 23.11.1
@@ -2855,7 +2855,7 @@ packages:
     hasBin: true
     dependencies:
       caniuse-lite: 1.0.30001608
-      electron-to-chromium: 1.4.732
+      electron-to-chromium: 1.4.733
       node-releases: 2.0.14
       update-browserslist-db: 1.0.13(browserslist@4.23.0)
 
@@ -3361,8 +3361,8 @@ packages:
       jake: 10.8.7
     dev: true
 
-  /electron-to-chromium@1.4.732:
-    resolution: {integrity: sha512-nLrzr6UML+oqCyvseTxJ1WxLsnMSQPJCoHu+MuOuNiCp7BHEdG9AmCTw2Y9FU/wFFc/ETE0F6JVtzzPryEjecw==}
+  /electron-to-chromium@1.4.733:
+    resolution: {integrity: sha512-gUI9nhI2iBGF0OaYYLKOaOtliFMl+Bt1rY7VmEjwxOxqoYLub/D9xmduPEhbw2imE6gYkJKhIE5it+KE2ulVxQ==}
 
   /emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
@@ -4279,8 +4279,8 @@ packages:
       function-bind: 1.1.2
     dev: true
 
-  /hls.js@1.5.7:
-    resolution: {integrity: sha512-Hnyf7ojTBtXHeOW1/t6wCBJSiK1WpoKF9yg7juxldDx8u3iswrkPt2wbOA/1NiwU4j27DSIVoIEJRAhcdMef/A==}
+  /hls.js@1.5.8:
+    resolution: {integrity: sha512-hJYMPfLhWO7/7+n4f9pn6bOheCGx0WgvVz7k3ouq3Pp1bja48NN+HeCQu3XCGYzqWQF/wo7Sk6dJAyWVJD8ECA==}
     dev: false
 
   /hoist-non-react-statics@3.3.2:
diff --git a/src/pages/Discover.tsx b/src/pages/Discover.tsx
index 0ab34317..827bb28c 100644
--- a/src/pages/Discover.tsx
+++ b/src/pages/Discover.tsx
@@ -252,7 +252,7 @@ export function Discover() {
             ? `${category} Shows`
             : `${category} Movies`;
     return (
-      <div className="relative overflow-hidden rounded-xl mt-2">
+      <div className="relative overflow-hidden mt-2">
         <h2 className="text-2xl font-bold text-white sm:text-3xl md:text-2xl mx-auto pl-5">
           {displayCategory}
         </h2>
@@ -296,9 +296,8 @@ export function Discover() {
                     alt="failed to fetch :("
                     loading="lazy"
                     className="rounded-xl relative"
-                    style={{ width: "200px", height: "auto" }}
                   />
-                  <h1 className="relative pt-2 text-[14.75px] whitespace-normal break-words font-semibold text-white">
+                  <h1 className="group relative pt-2 text-[13.5px] whitespace-normal duration-[0.35s] break-words font-semibold text-white opacity-0 group-hover:opacity-100">
                     {isTVShow ? media.name : media.title}
                   </h1>
                 </Flare.Base>