Add shell accessibility landmarks

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

@@ -1,4 +1,6 @@
 <div class="app-shell">
+    <a class="skip-link" href="#app-main">Skip to main content</a>
+
     <header class="app-shell-header">
         <div class="app-shell-bar">
             <div class="app-shell-brand-block">
@@ -18,7 +20,7 @@
                 }
             </div>
 
-            <div class="app-shell-header-nav">
+            <nav class="app-shell-header-nav" aria-label="Primary">
                 @if (PrimaryNavContent is null)
                 {
                     <ShellPrimaryNav />
@@ -27,7 +29,7 @@
                 {
                     @PrimaryNavContent
                 }
-            </div>
+            </nav>
 
             <div class="app-shell-header-omnibox">
                 @if (OmniboxContent is not null)
@@ -43,9 +45,9 @@
 
         @if (ShortcutContent is not null)
         {
-            <div class="app-shell-shortcuts">
+            <nav class="app-shell-shortcuts" aria-label="Pinned and recent shortcuts">
                 @ShortcutContent
-            </div>
+            </nav>
         }
     </header>
 

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

@@ -4,6 +4,24 @@
     flex-direction: column;
 }
 
+.skip-link {
+    position: absolute;
+    left: 1rem;
+    top: -3rem;
+    z-index: 80;
+    padding: 0.75rem 1rem;
+    border-radius: 999px;
+    background: var(--accent-5);
+    color: var(--text-on-accent);
+    text-decoration: none;
+    box-shadow: var(--shadow-1);
+    transition: top 140ms ease;
+}
+
+.skip-link:focus {
+    top: 1rem;
+}
+
 .app-shell-header {
     position: sticky;
     top: 0;