Change styling

src/app/globals.css

@@ -44,6 +44,8 @@
   --radius-2xl: calc(var(--radius) + 8px);
   --radius-3xl: calc(var(--radius) + 12px);
   --radius-4xl: calc(var(--radius) + 16px);
+  --color-hover: var(--hover);
+  --color-hover-foreground: var(--hover-foreground);
 }
 
 /* :root {
@@ -148,6 +150,9 @@
   --input: oklch(0.90 0.02 85);
   --ring: oklch(0.55 0.07 260);              /* ties to primary */
 
+  --hover: oklch(0.94 0.015 255); /* subtle cool lift */
+  --hover-foreground: var(--foreground);
+
   /* charts can stay, or we can harmonize later */
   --chart-1: oklch(0.646 0.222 41.116);
   --chart-2: oklch(0.6 0.118 184.704);
@@ -168,7 +173,7 @@
 
 .dark {
   /* Inky navy background (clearly not neutral) */
-  --background: oklch(21.393% 0.06154 260.121);
+  --background: oklch(0.12 0.035 255);
   --foreground: oklch(0.95 0.012 85);
 
   /* Surfaces */
@@ -194,6 +199,9 @@
   --border: oklch(0.40 0.03 255 / 55%);
   --input: oklch(0.40 0.03 255 / 65%);
   --ring: oklch(0.65 0.10 255);
+
+  --hover: oklch(28.783% 0.03139 250.817);
+  --hover-foreground: var(--foreground);
 }
 
 .markdown {

src/components/global/TopNav.tsx

@@ -61,7 +61,7 @@ export default function TopNav() {
                   key={href}
                   href={href}
                   onClick={() => setOpen(false)}
-                  className="block px-4 py-2 rounded-md hover:bg-muted text-sm font-medium transition-colors"
+                  className="block px-4 py-2 rounded-md hover:bg-hover focus-visible:bg-hover text-sm font-medium transition-colors"
                 >
                   {label}
                 </Link>