diff --git a/src/RolemasterDb.App/Components/App.razor b/src/RolemasterDb.App/Components/App.razor
index 68ba608..4d83862 100644
--- a/src/RolemasterDb.App/Components/App.razor
+++ b/src/RolemasterDb.App/Components/App.razor
@@ -6,6 +6,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <base href="/" />
     <ResourcePreloader />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Domine:wght@400&family=Figtree:wght@400;500&display=swap" />
     <link rel="stylesheet" href="@Assets["lib/bootstrap/dist/css/bootstrap.min.css"]" />
     <link rel="stylesheet" href="@Assets["app.css"]" />
     <link rel="stylesheet" href="@Assets["RolemasterDb.App.styles.css"]" />
diff --git a/src/RolemasterDb.App/Components/Layout/MainLayout.razor b/src/RolemasterDb.App/Components/Layout/MainLayout.razor
index fb7095e..a246542 100644
--- a/src/RolemasterDb.App/Components/Layout/MainLayout.razor
+++ b/src/RolemasterDb.App/Components/Layout/MainLayout.razor
@@ -9,7 +9,7 @@
         <div class="top-row">
             <div>
                 <span class="eyebrow">Starter stack</span>
-                <strong>.NET 10 + Blazor + Minimal API + EF Core + SQLite</strong>
+                <span class="top-row-title">.NET 10 + Blazor + Minimal API + EF Core + SQLite</span>
             </div>
             <span class="status-pill">Seeded for attack and critical lookups</span>
         </div>
diff --git a/src/RolemasterDb.App/Components/Layout/NavMenu.razor.css b/src/RolemasterDb.App/Components/Layout/NavMenu.razor.css
index 8f41bc6..3ae3f1a 100644
--- a/src/RolemasterDb.App/Components/Layout/NavMenu.razor.css
+++ b/src/RolemasterDb.App/Components/Layout/NavMenu.razor.css
@@ -22,7 +22,7 @@
 
 .navbar-brand {
     font-size: 1.45rem;
-    font-family: Cambria, Georgia, serif;
+    font-family: "Figtree", "Segoe UI", sans-serif;
     letter-spacing: 0.04em;
     color: #fff1d2;
     text-decoration: none;
@@ -71,6 +71,7 @@
 }
 
 .nav-item ::deep .nav-link {
+    font-family: "Figtree", "Segoe UI", sans-serif;
     color: #f3ddbc;
     background: none;
     border: none;
diff --git a/src/RolemasterDb.App/Components/Pages/Home.razor b/src/RolemasterDb.App/Components/Pages/Home.razor
index 25bccd5..6139ee2 100644
--- a/src/RolemasterDb.App/Components/Pages/Home.razor
+++ b/src/RolemasterDb.App/Components/Pages/Home.razor
@@ -187,7 +187,7 @@ else
                 @foreach (var attackTable in referenceData.AttackTables)
                 {
                     <div class="table-list-item">
-                        <strong>@attackTable.Label</strong>
+                        <span class="table-list-title">@attackTable.Label</span>
                         <span class="muted">Attack table key: <code>@attackTable.Key</code></span>
                     </div>
                 }
diff --git a/src/RolemasterDb.App/Components/Shared/CriticalTableReferenceCard.razor b/src/RolemasterDb.App/Components/Shared/CriticalTableReferenceCard.razor
index 0765313..3e85e54 100644
--- a/src/RolemasterDb.App/Components/Shared/CriticalTableReferenceCard.razor
+++ b/src/RolemasterDb.App/Components/Shared/CriticalTableReferenceCard.razor
@@ -1,5 +1,5 @@
 <div class="table-list-item">
-    <strong>@Table.Label</strong>
+    <span class="table-list-title">@Table.Label</span>
     <div class="detail-grid">
         <div class="detail-item">
             <span class="detail-label">Key</span>
diff --git a/src/RolemasterDb.App/wwwroot/app.css b/src/RolemasterDb.App/wwwroot/app.css
index 82d6226..9da9c2a 100644
--- a/src/RolemasterDb.App/wwwroot/app.css
+++ b/src/RolemasterDb.App/wwwroot/app.css
@@ -8,6 +8,8 @@
     --panel: rgba(255, 250, 240, 0.82);
     --line: rgba(111, 87, 59, 0.18);
     --shadow: 0 18px 40px rgba(41, 22, 11, 0.12);
+    --font-body: "Domine", Georgia, serif;
+    --font-heading: "Figtree", "Segoe UI", sans-serif;
 }
 
 html, body {
@@ -16,13 +18,48 @@ html, body {
         radial-gradient(circle at top, rgba(240, 223, 185, 0.55), transparent 28%),
         linear-gradient(180deg, #eadbc0 0%, #f4ecda 38%, #e2d3b7 100%);
     color: var(--ink);
-    font-family: Georgia, "Palatino Linotype", serif;
+    font-family: var(--font-body);
+    font-weight: 400;
 }
 
 body {
     margin: 0;
 }
 
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+label,
+button,
+summary,
+th,
+.eyebrow,
+.panel-title,
+.page-title,
+.detail-label,
+.branch-condition,
+.critical-branch-condition,
+.effect-stack h5,
+.tag,
+.stat-pill,
+.status-pill,
+.chip,
+.affix-badge,
+.table-list-title,
+.top-row-title,
+.legend-label {
+    font-family: var(--font-heading);
+    font-weight: 400;
+}
+
+strong,
+b {
+    font-weight: 400;
+}
+
 a, .btn-link {
     color: var(--accent);
 }
@@ -42,7 +79,7 @@ textarea {
     font-size: clamp(2.2rem, 4vw, 3.5rem);
     line-height: 0.95;
     margin: 0;
-    font-family: Cambria, Georgia, serif;
+    font-family: var(--font-heading);
 }
 
 .lede {
@@ -243,7 +280,6 @@ textarea {
 
 .branch-condition {
     font-size: 0.82rem;
-    font-weight: 700;
     letter-spacing: 0.06em;
     text-transform: uppercase;
     color: #75562f;
@@ -263,7 +299,6 @@ textarea {
 
 .critical-cell-description {
     margin: 0;
-    font-weight: 600;
     color: #2c1a10;
 }
 
@@ -286,7 +321,6 @@ textarea {
     font-size: 0.75rem;
     letter-spacing: 0.05em;
     text-transform: uppercase;
-    font-weight: 700;
     color: #6b4c29;
 }
 
@@ -365,7 +399,7 @@ textarea {
 }
 
 .affix-badge-value {
-    font-weight: 700;
+    letter-spacing: 0.04em;
 }
 
 .affix-badge-fallback {
@@ -388,9 +422,10 @@ textarea {
     border: 1px solid rgba(127, 96, 55, 0.12);
 }
 
-.table-list-item strong {
+.table-list-title {
     display: block;
     margin-bottom: 0.6rem;
+    color: var(--ink);
 }
 
 .chip-row {
@@ -420,7 +455,6 @@ textarea {
 .details-block summary {
     cursor: pointer;
     color: var(--accent);
-    font-weight: 600;
     margin-bottom: 0.6rem;
 }
 
@@ -496,7 +530,6 @@ textarea {
 
 .critical-table th {
     background: rgba(238, 223, 193, 0.45);
-    font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 0.04em;
 }