refactor: consolidate hardcoded colors into CSS custom properties

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

public/css/components.css

@@ -350,7 +350,7 @@ body.dark-mode .site-search-result div:first-child {
 }
 
 body.dark-mode .site-search-result div:last-child {
-    color: var(--color-text-muted-dark);
+    color: var(--color-text-secondary);
 }
 
 #search-site-button {
@@ -858,7 +858,7 @@ body.landscape .countdown-large.soon {
 }
 
 body.dark-mode .time-range {
-    color: var(--color-text-muted-dark);
+    color: var(--color-text-secondary);
 }
 
 /* Next departures (replaces time-range) */
@@ -1160,7 +1160,7 @@ body.landscape #compact-weather-bar {
     align-items: center;
     justify-content: center;
     gap: 16px;
-    background: rgba(0, 0, 0, 0.5);
+    background: var(--color-bar-bg);
     color: #ddd;
     padding: 6px 20px;
     border-radius: 4px;
@@ -1233,7 +1233,7 @@ body.landscape #news-ticker {
     left: 0;
     width: 100%;
     height: 100%;
-    background-color: #191970;
+    background-color: var(--color-daylight-night);
     background-image: var(--daylight-gradient, none);
 }
 
@@ -1470,18 +1470,6 @@ body.dark-mode .config-search-input:focus-visible {
     color: #ccc;
 }
 
-.site-search-result div:last-child {
-    color: #777;
-}
-
-body.dark-mode .site-search-result div:last-child {
-    color: #bbb;
-}
-
-body.dark-mode .time-range {
-    color: #bbb;
-}
-
 /* ========================================
    Responsive Design - Departure cards
    ======================================== */