diff --git a/app/index.html b/app/index.html
index e37e50f..a910816 100644
--- a/app/index.html
+++ b/app/index.html
@@ -196,14 +196,14 @@ body {
   font-family: var(--font-title);
   font-weight: var(--font-title-weight);
   font-size: 1.15rem;
-  color: var(--font-colour);
+  color: var(--nav-link-colour, var(--font-colour));
   line-height: 1.3;
   text-decoration: none;
   display: block;
 }
-.sidebar-sitename:hover { color: var(--accent); }
+.sidebar-sitename:hover { color: var(--nav-link-active-colour, var(--accent)); }
 
-.sidebar-description { font-size: 0.8rem; color: var(--font-colour-muted); margin-top: 0.25rem; line-height: 1.4; }
+.sidebar-description { font-size: 0.8rem; color: var(--nav-section-heading-colour, var(--font-colour-muted)); margin-top: 0.25rem; line-height: 1.4; }
 
 /* Search */
 .search-container { padding: 0.75rem 1.25rem; flex-shrink: 0; }
@@ -341,9 +341,9 @@ body {
   gap: 0.5rem;
   padding: 0.4rem 0.6rem;
   font-size: 0.8rem;
-  color: var(--font-colour-muted);
+  color: var(--nav-section-heading-colour, var(--font-colour-muted));
   background: none;
-  border: 1px solid var(--divider);
+  border: 1px solid color-mix(in srgb, var(--bg-nav) 70%, var(--nav-link-colour, var(--font-colour)));
   border-radius: 6px;
   cursor: pointer;
   font-family: var(--font-body);
@@ -351,7 +351,7 @@ body {
   width: 100%;
   justify-content: center;
 }
-.theme-toggle:hover { color: var(--font-colour); border-color: var(--font-colour-muted); }
+.theme-toggle:hover { color: var(--nav-link-colour, var(--font-colour)); border-color: var(--nav-section-heading-colour, var(--font-colour-muted)); }
 .theme-toggle svg { width: 16px; height: 16px; flex-shrink: 0; }
 
 /* ═══════════════════════════════════════════