From 351ed70c6d1723ea1e72a38305f005c87a989e56 Mon Sep 17 00:00:00 2001
From: Jukka Lampikoski <jukka@lampikoski.com>
Date: Tue, 10 Mar 2026 17:24:47 +0200
Subject: [PATCH] ui: move theme color to nav tab bar, white header

Header is now white with neutral text colors.
Nav tab bar uses primary-color background with white text.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 style.css | 25 ++++++++++++-------------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/style.css b/style.css
index a5ab53d..50ea43b 100644
--- a/style.css
+++ b/style.css
@@ -135,15 +135,14 @@ body {
 /* Header */
 header {
     background: #fff;
-    color: var(--primary-color);
+    color: #333;
     padding: 1rem 2rem;
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;
     gap: 0.5rem;
-    box-shadow: 0 1px 6px rgba(0,0,0,0.1);
-    border-bottom: 2px solid var(--primary-color);
+    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
     position: sticky;
     top: 0;
     z-index: 100;
@@ -158,19 +157,19 @@ header {
 .brand-icon {
     font-size: 1.8rem;
     line-height: 1;
-    color: var(--primary-color);
+    color: #333;
 }
 
 .header-left h1 {
     font-size: 1.3rem;
     letter-spacing: -0.3px;
-    color: var(--primary-color);
+    color: #222;
 }
 
 .subtitle {
     font-size: 0.8rem;
     opacity: 0.6;
-    color: #555;
+    color: #666;
 }
 
 .header-right {
@@ -985,8 +984,7 @@ span.empty {
 .tab-bar {
     display: flex;
     gap: 0;
-    background: #fff;
-    border-bottom: 2px solid #e5e7eb;
+    background: var(--primary-color);
     padding: 0 2rem;
     position: sticky;
     top: 56px;
@@ -1000,19 +998,20 @@ span.empty {
     border-bottom: 3px solid transparent;
     font-size: 0.88rem;
     font-weight: 600;
-    color: #888;
+    color: rgba(255,255,255,0.7);
     cursor: pointer;
     transition: all 0.2s;
-    margin-bottom: -2px;
 }
 
 .tab:hover {
-    color: var(--primary-color);
+    color: #fff;
+    background: rgba(255,255,255,0.1);
 }
 
 .tab.active {
-    color: var(--primary-color);
-    border-bottom-color: var(--primary-color);
+    color: #fff;
+    border-bottom-color: #fff;
+    background: rgba(255,255,255,0.1);
 }
 
 .tab-content {