Polish header sizing + refined Inter kicker tags

- Header logo sized up to read clearly (54px desktop / 46px mobile, bars to match).
- Self-host Inter (variable, latin) — no external font calls — and use it for
  the category tags as uppercase Light (300) kickers with tight tracking, for a
  clean, polished label feel.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/lib/components/Header.svelte

@@ -34,10 +34,10 @@
     /* a whisper of warmth under the bar */
     box-shadow: 0 1px 0 rgba(40, 38, 28, 0.02);
   }
-  .bar { display: flex; align-items: center; justify-content: space-between; height: 64px; }
+  .bar { display: flex; align-items: center; justify-content: space-between; height: 78px; }
 
   .brand { display: inline-flex; align-items: center; }
-  .logo { height: 34px; width: auto; display: block; }
+  .logo { height: 54px; width: auto; display: block; }
 
   .utils { display: flex; gap: 6px; }
   .utils button {
@@ -52,8 +52,8 @@
 
   /* On phones the utilities live in the bottom tab bar ("You") instead. */
   @media (max-width: 720px) {
-    .bar { height: 58px; justify-content: center; }
+    .bar { height: 66px; justify-content: center; }
     .utils { display: none; }
-    .logo { height: 29px; }
+    .logo { height: 46px; }
   }
 </style>