diff --git a/shaarli-pro/css/custom_views.css b/shaarli-pro/css/custom_views.css
index e97c697..1acf61e 100644
--- a/shaarli-pro/css/custom_views.css
+++ b/shaarli-pro/css/custom_views.css
@@ -28,7 +28,7 @@
 /* --- TODO VIEW --- */
 body.view-todo .content-container {
     padding: 2rem;
-    background-color: var(--bg-body);
+    background-color: transparent;
     min-height: 100vh;
     /* Adjust for header */
 }
@@ -143,7 +143,7 @@ body.view-todo #linklist {
 body.view-notes .content-container,
 body.view-archive .content-container {
     padding: 2rem;
-    background-color: var(--bg-body);
+    background-color: transparent;
     min-height: 100vh;
 }
 
@@ -382,7 +382,7 @@ body.view-archive .content-container {
 
 /* Ensure archive view uses same background as notes view */
 body.view-archive .content-container {
-    background-color: var(--bg-body) !important;
+    background-color: transparent !important;
 }
 
 /* Archive Title */
diff --git a/shaarli-pro/css/style.css b/shaarli-pro/css/style.css
index 060ac84..2179a9a 100644
--- a/shaarli-pro/css/style.css
+++ b/shaarli-pro/css/style.css
@@ -4611,13 +4611,32 @@ table {
 }
 
 [data-theme="dark"] {
-    --tile-bg: var(--surface-variant, var(--bg-card));
-    --tile-bg-hover: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 82%, var(--primary) 18%);
-    --tile-border: color-mix(in srgb, var(--outline-variant, var(--border)) 70%, var(--text-main) 30%);
+    /* Tint surfaces with theme primary so each theme (DEFAULT, GITHUB,
+       NAVY_ELEGANCE, DRACULA, ...) is visually distinct even though all
+       dark themes share very similar navy/charcoal neutrals. */
+    --tile-bg: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 86%, var(--primary) 14%);
+    --tile-bg-hover: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 70%, var(--primary) 30%);
+    --tile-border: color-mix(in srgb, var(--outline-variant, var(--border)) 55%, var(--primary) 45%);
     --tile-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
     --tile-shadow-hover: 0 8px 20px rgba(0, 0, 0, 0.55);
 }
 
+[data-theme="light"] {
+    --tile-bg: color-mix(in srgb, var(--bg-card) 94%, var(--primary) 6%);
+    --tile-bg-hover: color-mix(in srgb, var(--bg-card) 86%, var(--primary) 14%);
+    --tile-border: color-mix(in srgb, var(--border) 65%, var(--primary) 35%);
+    --tile-shadow: var(--shadow-sm);
+    --tile-shadow-hover: var(--shadow-md);
+}
+
+/* Theme-tinted page background for Notes / Tâches / Archive views
+   (was pure --bg-body = near-black and felt disconnected from the theme). */
+body.view-notes,
+body.view-todo,
+body.view-archive {
+    background-color: color-mix(in srgb, var(--bg-body) 92%, var(--primary) 8%);
+}
+
 /* Grid & list cards */
 .link-outer {
     background: var(--tile-bg);