diff --git a/src/lib/cards/node/NodeListCard.svelte b/src/lib/cards/node/NodeListCard.svelte
index 1abb2a1..e5648dc 100644
--- a/src/lib/cards/node/NodeListCard.svelte
+++ b/src/lib/cards/node/NodeListCard.svelte
@@ -17,10 +17,21 @@
 
 </script>
 
+<style>
+	:global(.node-list-card) {
+		position: relative;
+		z-index: 0;
+	}
+
+	:global(.node-list-card:has([data-popup-open='true'])) {
+		z-index: 60;
+	}
+</style>
+
 <AccordionItem
 	{open}
 	bind:id={node.id}
-	class="backdrop-blur-xl backdrop-brightness-100 bg-white/25 dark:bg-white/5 rounded-md"
+	class="node-list-card backdrop-blur-xl backdrop-brightness-100 bg-white/25 dark:bg-white/5 rounded-md"
 	padding="py-4 px-4"
 	regionControl="!rounded-none"
 >
diff --git a/src/lib/parts/NodeTagsIcon.svelte b/src/lib/parts/NodeTagsIcon.svelte
index 42cf10e..9be8a30 100644
--- a/src/lib/parts/NodeTagsIcon.svelte
+++ b/src/lib/parts/NodeTagsIcon.svelte
@@ -9,16 +9,25 @@
 		id: string;
 	};
 	let { tags, id }: NodeTagsIconProps = $props();
+	let popupOpen = $state(false);
 
 	const popupHover = $derived<PopupSettings>({
 		event: 'hover',
 		target: `tags-popup-${id}`,
 		placement: 'bottom',
-	});
+		state: ({ state }) => {
+			popupOpen = state;
+		},
+	};
 </script>
 
 {#if tags.length > 0}
-	<span class="inline-flex items-center" use:popup={popupHover} data-testid="node-tags-icon">
+	<span
+		class="inline-flex items-center"
+		use:popup={popupHover}
+		data-testid="node-tags-icon"
+		data-popup-open={popupOpen}
+	>
 		<RawMdiTag class="text-warning-500 dark:text-warning-400 cursor-help" />
 	</span>
 	<div class="card p-3 variant-filled-surface shadow-xl z-50" data-popup="tags-popup-{id}">