Frontend improvements

src/RolemasterDb.App/Components/App.razor

@@ -8,7 +8,7 @@
     <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=Fraunces:opsz,wght@9..144,500;9..144,600&family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&display=swap"/>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Macondo&family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&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"]"/>

src/RolemasterDb.App/Components/Pages/Home.razor

@@ -16,24 +16,10 @@
 else
 {
     <div class="play-page">
-        <header class="panel play-hero">
-            <div class="play-hero-copy">
-                <p class="play-eyebrow">Play</p>
-                <h1 class="play-title">Resolve attacks fast. Open the table only when you need context.</h1>
-                <p class="play-summary">Use the attack lane for live results and the direct critical lane when you already know the exact table and severity.</p>
-            </div>
-            <div class="play-hero-meta" aria-label="Play page workflow">
-                <span class="tag">Live lookup</span>
-                <span class="tag">Fast resolution</span>
-                <span class="tag">Table deep links</span>
-            </div>
-        </header>
-
         <div class="play-layout">
             <section class="panel play-panel play-panel-primary">
                 <div class="play-panel-header">
                     <div class="play-panel-copy">
-                        <p class="play-eyebrow">Primary lane</p>
                         <h2 class="panel-title">Attack lookup</h2>
                     </div>
                 </div>
@@ -188,7 +174,6 @@ else
             <section class="panel play-panel play-panel-secondary">
                 <div class="play-panel-header">
                     <div class="play-panel-copy">
-                        <p class="play-eyebrow">Quick jump</p>
                         <h2 class="panel-title">Direct critical lookup</h2>
                     </div>
                 </div>

src/RolemasterDb.App/Components/_Imports.razor

@@ -12,7 +12,6 @@
 @using RolemasterDb.App.Components
 @using RolemasterDb.App.Components.Curation
 @using RolemasterDb.App.Components.Layout
-@using RolemasterDb.App.Components.Play
 @using RolemasterDb.App.Components.Primitives
 @using RolemasterDb.App.Components.Shell
 @using RolemasterDb.App.Components.Shared

src/RolemasterDb.App/wwwroot/app.css

@@ -52,7 +52,7 @@
     --button-secondary-text: #6a4b28;
     --button-secondary-border: rgba(127, 96, 55, 0.18);
     --control-height: 3rem;
-    --font-display: "Fraunces", Georgia, serif;
+    --font-display: "Macondo", Georgia, serif;
     --font-body: "IBM Plex Sans", "Segoe UI", sans-serif;
     --font-ui: "IBM Plex Sans", "Segoe UI", sans-serif;
     --font-mono: "IBM Plex Mono", Consolas, "Courier New", monospace;
@@ -220,7 +220,7 @@ h5,
 h6,
 .panel-title {
     font-family: var(--font-display);
-    font-weight: 500;
+    font-weight: 600;
 }
 
 label,
@@ -269,8 +269,6 @@ pre,
 }
 
 .play-page,
-.play-hero,
-.play-hero-copy,
 .play-layout,
 .play-panel,
 .play-panel-header,
@@ -287,19 +285,6 @@ pre,
     gap: 1.25rem;
 }
 
-.play-hero {
-    gap: 1.25rem;
-    background:
-        radial-gradient(circle at top right, color-mix(in srgb, var(--accent-2) 24%, transparent), transparent 36%),
-        linear-gradient(180deg, color-mix(in srgb, var(--surface-card-subtle) 92%, var(--surface-1)), var(--surface-1));
-}
-
-.play-hero-copy {
-    gap: 0.65rem;
-    max-width: 58rem;
-}
-
-.play-eyebrow,
 .play-result-eyebrow {
     margin: 0;
     color: var(--accent-strong);
@@ -324,13 +309,6 @@ pre,
     color: var(--text-secondary);
 }
 
-.play-hero-meta {
-    display: flex;
-    gap: 0.6rem;
-    flex-wrap: wrap;
-    align-items: center;
-}
-
 .play-layout {
     grid-template-columns: minmax(0, 1.7fr) minmax(19rem, 1fr);
     align-items: start;
@@ -832,6 +810,10 @@ select.input-shell {
     overflow-wrap: anywhere;
 }
 
+.critical-curation-preview-button .critical-cell-description {
+    font-size: 2.5rem;
+}
+
 .critical-branch-stack {
     display: flex;
     flex-direction: column;
@@ -958,6 +940,14 @@ select.input-shell {
     margin-top: 0.2rem;
 }
 
+.critical-curation-preview-button .affix-badge {
+    font-size: 2.5rem;
+}
+
+.critical-curation-preview-button .affix-badge-symbol {
+    font-size: 2.5rem;
+}
+
 .affix-badge-value {
     letter-spacing: 0.04em;
 }
@@ -2708,6 +2698,10 @@ select.input-shell {
     border: 1px solid rgba(127, 96, 55, 0.12);
 }
 
+.critical-curation-grid .critical-cell {
+    height: 100%;
+} 
+
 .critical-curation-legend-item {
     display: inline-flex;
     align-items: center;