diff --git a/src/components/views/LibraryView.tsx b/src/components/views/LibraryView.tsx
index 49e0170e..d5d7d1be 100644
--- a/src/components/views/LibraryView.tsx
+++ b/src/components/views/LibraryView.tsx
@@ -3403,6 +3403,7 @@ function AlbumGrid({
               and clicks on top of it. */}
           <button
             type="button"
+            data-artwork-hit-target
             onClick={open}
             aria-label={t("library.open", { name: album.title })}
             className="absolute inset-0 rounded-2xl focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-emerald-500"
diff --git a/src/styles/skins/liquid.css b/src/styles/skins/liquid.css
index 832296ea..6f740c75 100644
--- a/src/styles/skins/liquid.css
+++ b/src/styles/skins/liquid.css
@@ -454,7 +454,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ) {
+  ):where(:not([data-artwork-hit-target])) {
   border-radius: 1.75rem !important;
   border: 0 !important;
   background-color: color-mix(
@@ -475,7 +475,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ):hover {
+  ):where(:not([data-artwork-hit-target])):hover {
   transform: translateY(-2px);
 }
 
@@ -1131,7 +1131,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ):not([data-immersive] *),
+  ):not([data-immersive] *):where(:not([data-artwork-hit-target])),
 :root[data-skin="liquid"][data-contrast="high"]
   [class*="sticky"]:where(
     [class*="bg-white"],
diff --git a/src/styles/skins/lounge.css b/src/styles/skins/lounge.css
index 2a7666d8..52eb6ab8 100644
--- a/src/styles/skins/lounge.css
+++ b/src/styles/skins/lounge.css
@@ -223,7 +223,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ) {
+  ):where(:not([data-artwork-hit-target])) {
   background-color: var(--lounge-glass-soft) !important;
   border-color: var(--lounge-border-soft) !important;
   box-shadow: var(--lounge-shadow);
@@ -539,7 +539,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ) {
+  ):where(:not([data-artwork-hit-target])) {
   background-color: var(--wf-contrast-surface) !important;
   /* The opaque colour alone does not get there: this skin's TopBar and
      PlayerBar each carry a `background-image` gradient, which paints
diff --git a/src/styles/skins/pulse.css b/src/styles/skins/pulse.css
index a12a36d3..ccb77963 100644
--- a/src/styles/skins/pulse.css
+++ b/src/styles/skins/pulse.css
@@ -391,7 +391,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ) {
+  ):where(:not([data-artwork-hit-target])) {
   border-radius: 1.75rem !important;
   border: 1px solid var(--pulse-rail) !important;
   background-color: var(--pulse-surface) !important;
@@ -406,7 +406,7 @@
     [class*="rounded-xl"],
     [class*="rounded-2xl"],
     [class*="rounded-3xl"]
-  ):hover {
+  ):where(:not([data-artwork-hit-target])):hover {
   border-color: var(--pulse-cyan) !important;
   box-shadow: 0 0 24px -8px rgb(var(--pulse-cyan-rgb) / 0.4);
   transform: translateY(-2px);