fix: better fonts for header

css/styles.css

@@ -1,3 +1,16 @@
+/* ==========================================================================
+   Font Definitions
+   ========================================================================== */
+
+@font-face {
+  font-family: "Outline";
+  src: url("../fonts/Outline-Regular.woff2") format("woff2"),
+    url("../fonts/Outline-Regular.woff") format("woff");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
 /* ==========================================================================
    CSS Reset & Normalize (Modern Best Practices)
    Based on normalize.css v8.0.1 + modern resets
@@ -180,7 +193,7 @@ table {
   --color-warning: #f59e0b;
 
   /* Typography */
-  --font-family-base: "Outfit", system-ui, -apple-system, BlinkMacSystemFont,
+  --font-family-base: "Outline", system-ui, -apple-system, BlinkMacSystemFont,
     "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
     sans-serif;
   --font-family-heading: var(--font-family-base);
@@ -199,8 +212,9 @@ table {
   --font-weight-bold: 700;
 
   --line-height-tight: 1.25;
-  --line-height-normal: 1.5;
+  --line-height-normal: 1.5; /* 24px at 16px base */
   --line-height-relaxed: 1.75;
+  --line-height-24: 24px;
 
   /* Spacing */
   --spacing-xs: 0.25rem; /* 4px */
@@ -268,8 +282,8 @@ top-bar .icon-button svg {
 
 top-bar .logo {
   font-family: var(--font-family-base);
-  font-size: 1.25rem;
-  font-weight: 700;
+  font-size: var(--font-size-xl);
+  font-weight: var(--font-weight-bold);
   color: #ffffff;
   text-decoration: none;
 }