diff --git a/.github/workflows/default.yaml b/.github/workflows/default.yaml
index ba03d00..819e0fd 100644
--- a/.github/workflows/default.yaml
+++ b/.github/workflows/default.yaml
@@ -70,6 +70,6 @@ jobs:
 
       - name: 🚀 Deploy Changed Files via rclone
         run: |
-          rclone sync --update --progress --stats-one-line ./dist/ sftp-remote:${REMOTE_DIR} --transfers 4
+          rclone sync --update -v --progress --stats 5s --stats-one-line ./dist/ sftp-remote:${REMOTE_DIR} --transfers 4
         env:
           REMOTE_DIR: ${{ vars.REMOTE_DIR }}
diff --git a/src/components/Nav.astro b/src/components/Nav.astro
index 2bb1a58..0f820f4 100644
--- a/src/components/Nav.astro
+++ b/src/components/Nav.astro
@@ -30,15 +30,13 @@ const paths = [
 ];
 ---
 
-<ul class="flex my-4 h-12 bg-dark">
+<ul class="flex my-4 h-12">
   <li><a href="#main-content" class="skip-link">Skip to main content</a></li>
   <li
-    class="border-none bg-transparent my-2 mr-4 logo grid place-content-center"
-  >
+    class="border-none bg-transparent my-2 mr-4 logo grid place-content-center">
     <a
       href={translatePath("/")}
-      class="text-neutral h-9 flex items-center justify-center lowercase"
-    >
+      class="text-neutral h-9 flex items-center justify-center lowercase">
       <Logo />
     </a>
   </li>
@@ -50,13 +48,11 @@ const paths = [
           ${isActive(link) ? "bg-light underline" : "bg"}
           ${i === 0 ? "rounded-bl-md border-l-1" : "border-l-1"}
           ${i === paths.length - 1 ? "rounded-tr-md !border-r-1" : ""}
-        `}
-      >
+        `}>
         <a
           class="text-neutral w-full h-full flex items-center justify-center lowercase"
           href={link}
-          data-astro-prefetch
-        >
+          data-astro-prefetch>
           {text}
         </a>
       </li>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 30227f2..015d488 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -75,31 +75,10 @@ import "./global.css";
         max-width: 600px;
         margin: 0 auto;
       }
-
-      .dark header::after {
-        content: "";
-        position: absolute;
-        width: 10px;
-        height: 10px;
-        color: red;
-        background: url("data:image/svg+xml,%3Csvg viewBox='0 0 249 249' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M248.5 0H0V249C0.268799 111.435 111.423 0 248.5 0Z' fill='%2316161e'/%3E%3C/svg%3E");
-      }
-
-      .dark header::before {
-        content: "";
-        position: absolute;
-        width: 10px;
-        height: 10px;
-        right: 0px;
-        bottom: -10px;
-        transform: rotate(90deg);
-        color: red;
-        background: url("data:image/svg+xml,%3Csvg viewBox='0 0 249 249' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M248.5 0H0V249C0.268799 111.435 111.423 0 248.5 0Z' fill='%2316161e'/%3E%3C/svg%3E");
-      }
     </style>
   </head>
-  <body class="bg-dark text-neutral p-2 flex flex-col gap-4">
-    <header class="sticky top-0 z-2 bg-dark">
+  <body class="text-neutral p-2 flex flex-col gap-4">
+    <header class="sticky top-0 z-2">
       <Nav />
     </header>
     <main id="main-content" class="flex flex-col gap-4">
@@ -142,6 +121,8 @@ import "./global.css";
           const hash = img.getAttribute("data-thumbhash");
           if (!hash) return;
 
+          if (img.complete || parent.complete) return;
+
           // its only browser, why you have to be mad
           const decodedString = window.atob(hash);
 
@@ -158,7 +139,6 @@ import "./global.css";
           parent.style.background = `url(${dataURL})`;
           parent.style.backgroundSize = "cover";
 
-          if (img.complete || parent.complete) return;
           let count = 0;
           const interval = setInterval(() => {
             count++;
diff --git a/src/layouts/global.css b/src/layouts/global.css
index 796ff22..9097c90 100644
--- a/src/layouts/global.css
+++ b/src/layouts/global.css
@@ -98,3 +98,15 @@ picture.thumb-loading::before {
     transform: rotate(360deg);
   }
 }
+
+.dark header::before {
+  content: "";
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  right: 0px;
+  bottom: -10px;
+  transform: rotate(90deg);
+  color: red;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 249 249' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M248.5 0H0V249C0.268799 111.435 111.423 0 248.5 0Z' fill='%2316161e'/%3E%3C/svg%3E");
+}
diff --git a/src/layouts/theme.css b/src/layouts/theme.css
index b7d17dc..bb03c89 100644
--- a/src/layouts/theme.css
+++ b/src/layouts/theme.css
@@ -17,21 +17,21 @@
 }
 
 body {
-  --background-dark: var(--neutral-800);
+  --background-dark: var(--neutral-000);
   --background: var(--neutral-000);
   --background-light: var(--neutral-400);
   --outline: var(--neutral-300);
   --text: var(--neutral-800);
   --text-light: black;
 
-  background-color: var(--neutral-100);
-  transition: background-color 0.1s;
+  transition: background-color 0.2s;
   color: var(--text);
   font-family: "Nunito Sans", sans-serif;
-  background-color: var(--background-dark);
+  background-color: var(--neutral-000);
 }
 
 .dark body {
+  background-color: var(--neutral-800);
   --background-dark: var(--neutral-800);
   --background: var(--neutral-500);
   --background-light: var(--neutral-400);
@@ -42,3 +42,8 @@ body {
   --text: var(--neutral-100);
   --text-light: white;
 }
+
+header {
+  background-color: var(--background-dark);
+  transition: background-color 0.2s;
+}
