diff --git a/packages/renderer/src/App.svelte b/packages/renderer/src/App.svelte
index 762a6084945..fdf7d6a0e59 100644
--- a/packages/renderer/src/App.svelte
+++ b/packages/renderer/src/App.svelte
@@ -82,7 +82,7 @@ window.events?.receive('display-help', () => {
       {/if}
 
       <div
-        class="z-0 w-full h-full min-h-fit flex flex-col overflow-y-scroll"
+        class="-z-3 w-full h-full min-h-fit flex flex-col overflow-y-scroll"
         class:bg-charcoal-700="{!meta.url.startsWith('/preferences')}"
         class:bg-charcoal-800="{meta.url.startsWith('/preferences')}">
         <TaskManager />
diff --git a/packages/renderer/src/AppNavigation.svelte b/packages/renderer/src/AppNavigation.svelte
index 3a73e72e6f0..67a02a5420f 100644
--- a/packages/renderer/src/AppNavigation.svelte
+++ b/packages/renderer/src/AppNavigation.svelte
@@ -90,7 +90,7 @@ export let meta;
 
 <svelte:window />
 <nav
-  class="pf-c-nav z-0 group w-[54px] min-w-[54px] flex flex-col justify-between overflow-hidden hover:overflow-y-auto top-0"
+  class="pf-c-nav -z-1 group w-[54px] min-w-[54px] flex flex-col justify-between hover:overflow-y-none top-0"
   style="position: sticky"
   aria-label="Global">
   <ul class="pf-c-nav__list">
diff --git a/packages/renderer/src/PreferencesNavigation.svelte b/packages/renderer/src/PreferencesNavigation.svelte
index a0c1a485d7b..4b2533c2b5a 100644
--- a/packages/renderer/src/PreferencesNavigation.svelte
+++ b/packages/renderer/src/PreferencesNavigation.svelte
@@ -49,7 +49,7 @@ $: addSectionHiddenClass = (section: string): string => (sectionExpanded[section
 </script>
 
 <nav
-  class="pf-c-nav z-0 w-[250px] min-w-[200px] flex-col justify-between flex transition-all duration-500 ease-in-out shadow-nav top-0"
+  class="pf-c-nav -z-2 w-[250px] min-w-[200px] flex-col justify-between flex transition-all duration-500 ease-in-out shadow-nav top-0"
   style="background-color: rgb(39 39 42 / var(--tw-bg-opacity)); position: sticky"
   aria-label="Global">
   <div class="flex items-center">
diff --git a/packages/renderer/src/lib/ui/Tooltip.svelte b/packages/renderer/src/lib/ui/Tooltip.svelte
index fb1c600f61b..0cf9777987b 100644
--- a/packages/renderer/src/lib/ui/Tooltip.svelte
+++ b/packages/renderer/src/lib/ui/Tooltip.svelte
@@ -17,7 +17,8 @@
 }
 .tooltip.right {
   right: 0;
-  transform: translateX(100%);
+  transform: translate(100%, -50%);
+  margin-top: -10px;
   margin-right: -8px;
 }
 .tooltip.top-left {
@@ -40,7 +41,7 @@ export let bottom = false;
 export let left = false;
 </script>
 
-<div class="relative inline-block">
+<div class="relative inline-block z-[10]">
   <span class="group tooltip-slot">
     <slot />
   </span>