diff --git a/public/router.js b/public/router.js
index 435514a..89078d9 100644
--- a/public/router.js
+++ b/public/router.js
@@ -321,6 +321,11 @@ function updateNav(path) {
 
   // Bottom-Nav zur aktiven Seite scrollen
   scrollNavToActive();
+
+  // Modul-Akzentfarbe auf :root setzen — wird von Nav-CSS gelesen
+  const route  = ROUTES.find(r => r.path === path);
+  const accent = route?.module ? getCSSToken(`--module-${route.module}`) : '';
+  document.documentElement.style.setProperty('--active-module-accent', accent || '');
 }
 
 function renderError(container, err) {
diff --git a/public/styles/layout.css b/public/styles/layout.css
index 78c7655..a5f047a 100644
--- a/public/styles/layout.css
+++ b/public/styles/layout.css
@@ -192,7 +192,7 @@
 
 /* ── Nav-Item: Aktiv ── */
 .nav-item[aria-current="page"] {
-  color: var(--color-accent);
+  color: var(--active-module-accent, var(--color-accent));
 }
 
 .nav-item__icon {
@@ -384,9 +384,9 @@
 
   /* ── Aktiv: Hintergrund-Highlight + Akzent-Indikator ── */
   .nav-sidebar .nav-item[aria-current="page"] {
-    color: var(--color-accent);
+    color: var(--active-module-accent, var(--color-accent));
     font-weight: var(--font-weight-semibold);
-    background-color: var(--color-accent-light);
+    background-color: color-mix(in srgb, var(--active-module-accent, var(--color-accent)) 12%, transparent);
   }
 
   /* Akzentstreifen links */
@@ -398,7 +398,7 @@
     bottom: 6px;
     width: 3px;
     border-radius: 0 var(--radius-full) var(--radius-full) 0;
-    background: var(--color-accent);
+    background: var(--active-module-accent, var(--color-accent));
   }
 
   /* Active-Press auf Desktop */