diff --git a/assets/layouts/default.vue b/assets/layouts/default.vue
index b61b5e0b..fec424b7 100644
--- a/assets/layouts/default.vue
+++ b/assets/layouts/default.vue
@@ -25,12 +25,12 @@
       </pane>
     </splitpanes>
     <label
-      class="btn btn-circle swap swap-rotate fixed bottom-8 left-4"
-      :class="{ '!-left-3': collapseNav }"
+      class="btn btn-circle swap btn-neutral swap-rotate fixed -left-12 bottom-4 w-16 transition-all hover:-left-4"
+      :class="{ '!-left-6': collapseNav }"
       v-if="!isMobile"
     >
       <input type="checkbox" v-model="collapseNav" />
-      <mdi:chevron-right class="swap-on text-secondary" />
+      <mdi:chevron-right class="swap-on" />
       <mdi:chevron-left class="swap-off" />
     </label>
   </div>
diff --git a/assets/main.css b/assets/main.css
index 772f1a25..8307653e 100644
--- a/assets/main.css
+++ b/assets/main.css
@@ -36,6 +36,7 @@
     --inc: 99% 0.171 249.5;
     --er: 64% 0.218 28.85;
     --erc: 99% 0.218 28.85;
+    --n: var(--base-lighter-color);
   }
   html[data-theme="dark"] {
     @mixin dark;
diff --git a/e2e/visual.spec.ts-snapshots/dark-homepage-1-Mobile-Chrome-linux.png b/e2e/visual.spec.ts-snapshots/dark-homepage-1-Mobile-Chrome-linux.png
index da27e556..3f2ec438 100644
Binary files a/e2e/visual.spec.ts-snapshots/dark-homepage-1-Mobile-Chrome-linux.png and b/e2e/visual.spec.ts-snapshots/dark-homepage-1-Mobile-Chrome-linux.png differ
diff --git a/e2e/visual.spec.ts-snapshots/dark-homepage-1-chromium-linux.png b/e2e/visual.spec.ts-snapshots/dark-homepage-1-chromium-linux.png
index 93a8f69f..b5afc8ed 100644
Binary files a/e2e/visual.spec.ts-snapshots/dark-homepage-1-chromium-linux.png and b/e2e/visual.spec.ts-snapshots/dark-homepage-1-chromium-linux.png differ
diff --git a/e2e/visual.spec.ts-snapshots/default-homepage-1-Mobile-Chrome-linux.png b/e2e/visual.spec.ts-snapshots/default-homepage-1-Mobile-Chrome-linux.png
index 081fb696..953e2d7d 100644
Binary files a/e2e/visual.spec.ts-snapshots/default-homepage-1-Mobile-Chrome-linux.png and b/e2e/visual.spec.ts-snapshots/default-homepage-1-Mobile-Chrome-linux.png differ
diff --git a/e2e/visual.spec.ts-snapshots/default-homepage-1-chromium-linux.png b/e2e/visual.spec.ts-snapshots/default-homepage-1-chromium-linux.png
index fc6e313c..cf6a8970 100644
Binary files a/e2e/visual.spec.ts-snapshots/default-homepage-1-chromium-linux.png and b/e2e/visual.spec.ts-snapshots/default-homepage-1-chromium-linux.png differ