fix(frontend): theme-aware footer navbar colors

- Add --color-nav-bg and --color-nav-active CSS variables
- Dark: semi-transparent purple-dark tone (rgba 52,50,73 / 0.45 bg)
- Light: light semi-transparent background, accent-tinted active highlight
- Footer background and active nav item now use variables instead of
  hardcoded dark values

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/app.css

@@ -12,6 +12,8 @@
   --color-info: #4DC7ED;
   --color-warning: #F5E872;
   --color-tag-default: #444455;
+  --color-nav-bg: rgba(0, 0, 0, 0.45);
+  --color-nav-active: rgba(52, 50, 73, 0.72);
 
   --font-sans: 'Epilogue', sans-serif;
 }
@@ -25,6 +27,8 @@
   --color-text-primary: #111118;
   --color-text-muted: #555566;
   --color-tag-default: #ccccdd;
+  --color-nav-bg: rgba(240, 240, 245, 0.85);
+  --color-nav-active: rgba(90, 87, 143, 0.22);
 }
 
 @font-face {

frontend/src/routes/+layout.svelte

@@ -95,7 +95,7 @@
 		justify-content: space-between;
 		align-items: center;
 		padding: 10px;
-		background-color: rgba(0, 0, 0, 0.45);
+		background-color: var(--color-nav-bg);
 		backdrop-filter: blur(8px);
 		-webkit-backdrop-filter: blur(8px);
 		z-index: 100;
@@ -115,7 +115,7 @@
 
 	.nav:hover,
 	.nav.curr {
-		background-color: #343249;
+		background-color: var(--color-nav-active);
 		color: var(--color-text-primary);
 	}