Split Tables page into focused components

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

@@ -0,0 +1,26 @@
+@if (LegendEntries.Count > 0)
+{
+    <div class="critical-legend">
+        <div class="critical-legend-header">
+            <h4>Reading help</h4>
+            <p class="muted">These symbols show the effects attached to a result at a glance.</p>
+        </div>
+        <div class="legend-grid">
+            @foreach (var entry in LegendEntries)
+            {
+                <div class="legend-item" title="@entry.Tooltip">
+                    <span class="legend-symbol">@entry.Symbol</span>
+                    <div>
+                        <strong>@entry.Label</strong>
+                        <span class="muted">@entry.Description</span>
+                    </div>
+                </div>
+            }
+        </div>
+    </div>
+}
+
+@code {
+    [Parameter]
+    public IReadOnlyList<CriticalTableLegendEntry> LegendEntries { get; set; } = Array.Empty<CriticalTableLegendEntry>();
+}