Style tooling surfaces within shared shell

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

@@ -3,7 +3,7 @@
 <PageTitle>API Surface</PageTitle>
 
 <div class="api-grid">
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Reference data</h2>
         <p class="panel-copy"><code>GET /api/reference-data</code></p>
         <pre class="code-block">{
@@ -28,7 +28,7 @@
 }</pre>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Attack lookup</h2>
         <p class="panel-copy"><code>POST /api/lookup/attack</code></p>
         <pre class="code-block">{
@@ -39,7 +39,7 @@
 }</pre>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Critical lookup</h2>
         <p class="panel-copy"><code>POST /api/lookup/critical</code></p>
         <pre class="code-block">{
@@ -51,7 +51,7 @@
         <p class="panel-copy">Response now includes table metadata, roll-band bounds, raw imported cell text, parse status, and parsed JSON alongside the gameplay description.</p>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Cell editor load</h2>
         <p class="panel-copy"><code>GET /api/tables/critical/{slug}/cells/{resultId}</code></p>
         <pre class="code-block">{
@@ -80,13 +80,13 @@
         <p class="panel-copy">Use this to retrieve the full editable result graph for one critical-table cell, including nested branches, normalized effects, and review notes for unresolved quick-parse tokens.</p>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Cell source image</h2>
         <p class="panel-copy"><code>GET /api/tables/critical/{slug}/cells/{resultId}/source-image</code></p>
         <p class="panel-copy">Streams the importer-generated PNG crop for the current critical cell. Returns <code>404</code> when the row has no stored crop or the artifact is missing.</p>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Cell re-parse</h2>
         <p class="panel-copy"><code>POST /api/tables/critical/{slug}/cells/{resultId}/reparse</code></p>
         <pre class="code-block">{
@@ -108,7 +108,7 @@
         <p class="panel-copy">Re-runs the shared single-cell parser, merges the generated result with the current override state, and returns the refreshed editor payload without saving changes. Unknown or partially parsed tokens are surfaced explicitly in the returned review data.</p>
     </section>
 
-    <section class="panel">
+    <section class="panel tooling-surface">
         <h2 class="panel-title">Cell editor save</h2>
         <p class="panel-copy"><code>PUT /api/tables/critical/{slug}/cells/{resultId}</code></p>
         <pre class="code-block">{

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

@@ -7,7 +7,7 @@
 
 <PageTitle>Diagnostics</PageTitle>
 
-<section class="panel diagnostics-page">
+<section class="panel diagnostics-page tooling-surface">
     <header class="diagnostics-page-header">
         <div>
             <h2 class="panel-title">Critical Cell Diagnostics</h2>

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

@@ -2,7 +2,7 @@
 
 <PageTitle>Tools</PageTitle>
 
-<section class="panel">
+<section class="panel tooling-surface">
     <h1 class="panel-title">Tools</h1>
     <p class="panel-copy">Diagnostics and API documentation move under this destination in later phases. The landing page is in place now so the shell can navigate with the target destination model.</p>
 

src/RolemasterDb.App/Components/Shell/ShellPrimaryNav.razor

@@ -11,7 +11,7 @@
         <span class="shell-primary-nav-label">Curation</span>
     </NavLink>
 
-    <NavLink class="shell-primary-nav-link" href="tools">
+    <NavLink class="shell-primary-nav-link is-tools-link" href="tools">
         <span class="shell-primary-nav-label">Tools</span>
     </NavLink>
 </div>

src/RolemasterDb.App/Components/Shell/ShellPrimaryNav.razor.css

@@ -31,6 +31,20 @@
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
 }
 
+.shell-primary-nav-link.is-tools-link {
+    color: color-mix(in srgb, var(--info-3) 42%, var(--text-secondary));
+}
+
+.shell-primary-nav-link.is-tools-link:hover {
+    background: color-mix(in srgb, var(--surface-tooling) 86%, transparent);
+    border-color: color-mix(in srgb, var(--info-2) 35%, var(--border-default));
+}
+
+.shell-primary-nav-link.is-tools-link.active {
+    background: color-mix(in srgb, var(--surface-tooling) 92%, var(--surface-2));
+    border-color: color-mix(in srgb, var(--info-2) 46%, var(--border-default));
+}
+
 .shell-primary-nav-label {
     font-size: 0.92rem;
     line-height: 1;