Make tables legend an on-demand surface

docs/tables_frontend_overhaul_implementation_plan.md

@@ -69,6 +69,7 @@ It is intentionally implementation-focused:
 | 2026-03-21 | P3.6 | Completed | Removed the always-visible cell button stack from resting cells, leaving status-only hints by default and limiting compact edit/curation buttons to the currently selected cell. |
 | 2026-03-21 | P3.7 | Completed | Added a dedicated desktop inspector column that reads from the shared selected-cell state and keeps the selected result readable beside the grid. |
 | 2026-03-21 | P3.8 | Completed | Reused the inspector body inside a mobile bottom sheet with its own backdrop and close affordance so touch users keep the same selection-driven inspector model as desktop. |
+| 2026-03-21 | P3.9 | Completed | Pulled legend/help out of the always-on canvas component and turned it into an explicitly toggled secondary surface controlled from the context bar. |
 
 ### Lessons Learned
 
@@ -107,6 +108,7 @@ It is intentionally implementation-focused:
 - Resting-cell quietness should be enforced structurally, not only visually. Showing actions only for the selected cell prevents future CSS regressions from reintroducing button clutter across the whole grid.
 - The inspector should be its own sibling surface in the page layout, not nested inside the table shell. That keeps the content reusable for both desktop and the later mobile sheet without coupling it to canvas markup.
 - The inspector content itself should be shared independently of its container. Once the body is separated from the desktop column chrome, the mobile bottom sheet can reuse it with almost no behavioral drift.
+- Help content should not stay embedded in the canvas component once the grid becomes the main task surface. Moving legend rendering back to the page host makes it easier to demote, reposition, or merge with future help surfaces.
 
 ## Target Outcomes
 
@@ -475,7 +477,7 @@ Build the shared interaction infrastructure needed by multiple destinations befo
 | `P3.6` | Completed | Resting cells now show only status hints; compact edit/curation buttons appear only for the selected cell. |
 | `P3.7` | Completed | Desktop now has a dedicated inspector column driven by the shared selected-cell state instead of forcing result reading back into the grid alone. |
 | `P3.8` | Completed | Mobile now uses a bottom-sheet inspector that reuses the same selected-cell content as the desktop inspector column. |
-| `P3.9` | Pending | Move legend/help to an on-demand secondary surface. |
+| `P3.9` | Completed | Legend/help is now on-demand and controlled from the context bar instead of always rendering below the canvas. |
 | `P3.10` | Pending | Hide maintenance and developer noise in default reference mode. |
 | `P3.11` | Pending | Preserve editor and curation entry points through the inspector. |
 | `P3.12` | Pending | Normalize click/tap/keyboard selection and close the phase with a hardening pass. |

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

@@ -63,6 +63,8 @@
                             RollJumpValue="rollJumpValue"
                             DensityMode="densityMode"
                             OnTogglePin="TogglePinnedTableAsync"
+                            IsLegendOpen="isLegendOpen"
+                            OnToggleLegend="ToggleLegend"
                             OnModeChanged="UpdateReferenceModeAsync"
                             OnGroupChanged="UpdateSelectedGroupAsync"
                             OnColumnChanged="UpdateSelectedColumnAsync"
@@ -80,6 +82,11 @@
                             OnSelectCell="SelectCell"
                             OnOpenCuration="OpenCellCurationAsync"
                             OnOpenEditor="OpenCellEditorAsync" />
+
+                        @if (isLegendOpen)
+                        {
+                            <TablesLegend LegendEntries="@(detail.Legend ?? Array.Empty<CriticalTableLegendEntry>())" />
+                        }
                     </div>
                 }
             </div>
@@ -167,6 +174,7 @@
     private string rollJumpValue = string.Empty;
     private string densityMode = TablesDensityMode.Comfortable;
     private TablesCellSelection? selectedCell;
+    private bool isLegendOpen;
     private bool hasResolvedStoredTableSelection;
     private CriticalTableReference? SelectedTableReference =>
         referenceData?.CriticalTables.FirstOrDefault(item => string.Equals(item.Key, selectedTableSlug, StringComparison.OrdinalIgnoreCase));
@@ -708,6 +716,12 @@
         return Task.CompletedTask;
     }
 
+    private Task ToggleLegend()
+    {
+        isLegendOpen = !isLegendOpen;
+        return Task.CompletedTask;
+    }
+
     private void NormalizeViewStateForCurrentDetail()
     {
         referenceMode = NormalizeMode(referenceMode);

src/RolemasterDb.App/Components/Tables/TablesContextBar.razor

@@ -8,6 +8,9 @@
             <button type="button" class="btn btn-link" @onclick="() => OnTogglePin.InvokeAsync()">
                 @(IsPinned ? "Unpin table" : "Pin table")
             </button>
+            <button type="button" class="btn btn-link" @onclick="() => OnToggleLegend.InvokeAsync()">
+                @(IsLegendOpen ? "Hide help" : "Reading help")
+            </button>
             <p class="table-browser-edit-hint">Use the inspector to inspect, curate, or edit the selected result.</p>
         </div>
     </div>
@@ -143,6 +146,12 @@
     [Parameter]
     public EventCallback OnTogglePin { get; set; }
 
+    [Parameter]
+    public bool IsLegendOpen { get; set; }
+
+    [Parameter]
+    public EventCallback OnToggleLegend { get; set; }
+
     [Parameter]
     public EventCallback<string> OnModeChanged { get; set; }