diff --git a/src/App.css b/src/App.css
index e786887..420340e 100644
--- a/src/App.css
+++ b/src/App.css
@@ -26,6 +26,10 @@
     background: #0a0a0a;
 }
 
+.page-loader--transparent {
+    background: transparent;
+}
+
 .page-loader__tree {
     transform-origin: center bottom;
     animation: tree-sway 1.8s ease-in-out infinite alternate;
diff --git a/src/components/PageLoader.tsx b/src/components/PageLoader.tsx
index 48f3bf1..3428fe6 100644
--- a/src/components/PageLoader.tsx
+++ b/src/components/PageLoader.tsx
@@ -1,6 +1,6 @@
-export function PageLoader() {
+export function PageLoader({ transparent }: { transparent?: boolean }) {
   return (
-    <div className="page-loader" role="status" aria-label="Loading">
+    <div className={`page-loader${transparent ? ' page-loader--transparent' : ''}`} role="status" aria-label="Loading">
       <svg
         className="page-loader__tree"
         viewBox="0 0 60 90"
diff --git a/src/pages/HistoryPage.tsx b/src/pages/HistoryPage.tsx
index 18bc6a6..530b021 100644
--- a/src/pages/HistoryPage.tsx
+++ b/src/pages/HistoryPage.tsx
@@ -270,7 +270,7 @@ export default function HistoryPage() {
           </h3>
 
           {loadingEntries ? (
-            <PageLoader />
+            <PageLoader transparent />
           ) : (
             <div className="entries-list">
               {selectedDateEntries.length === 0 ? (