feat(a11y): give the context menu a keyboard, and the app a voice

The context menu was the only route to Play, Add to Queue, Play Next,
Add to Playlist, Favourite and Track Details, and it opened on
right-click alone: the panel had no role=menu, so its six menuitems were
orphaned, nothing moved focus into it, and nothing handled arrows or
Escape (a11y.3). Phase 1 deferred this deliberately so it would land
with the dialogs, as one focus-management implementation.

MenuKeyboard is that model. It is standalone rather than part of
ContextMenuController because playlist-view renders a menu without the
controller, and the only thing worse than a menu with no keyboard model
is two menus with two of them. Shift+F10 and the ContextMenu key open it
from a focused row, anchored to that row, and focus returns there.

Three lists had no focused row to open it from, so they gained a roving
tab stop (utils/roving-rows.ts, written once rather than three times).
track-list keeps its own: it predates this, carries selection semantics
the other three do not have, and is pinned by its own tests.

Also the ARIA tail this is one story with: aria-sort on the column
headers (role=columnheader arrived in Phase 1 without it), listbox and
option on the four selectable grids — aria-selected on role=button is
invalid and was being dropped, so the state the whole ctrl/shift
interaction exists to produce was invisible — and live regions on the
four async surfaces that changed in silence.

Two things a reproduction taught that reading could not: the
wa-dropdown-items have not set their role when the host's updateComplete
resolves, so querying by role then finds nothing and the menu opens
without taking focus; and focus() on a popup that has not positioned
itself is a silent no-op.

frontend/src/components/explore-view/explore-view.ts

@@ -2,6 +2,7 @@ import { LitElement, html, css, nothing } from 'lit';
 import { customElement, state, query as litQuery } from 'lit/decorators.js';
 import '@components/page-header/page-header';
 import { designTokens } from '../../styles/tokens.css';
+import { srOnly } from '../../styles/sr-only.css';
 import { SearchLocal, SearchLyrics, GetThumbnail, GetThumbnails, GetArtistImageURL, RecordSearchClick } from '@go/explore/Service';
 import { libraryStore } from '../../store/library-store';
 import { exploreCache, ARTIST_IMAGE_CACHE_LIMIT } from '../../store/explore-cache';
@@ -156,6 +157,7 @@ export class ExploreView extends ViewLifecycleMixin(LitElement) {
 
     static override styles = [
         designTokens,
+        srOnly,
         exploreLinkStyles,
         css`
             :host {
@@ -1319,6 +1321,9 @@ export class ExploreView extends ViewLifecycleMixin(LitElement) {
     override render() {
         return html`
             <page-header heading="Explore"></page-header>
+            <div class="sr-only" role="status" aria-live="polite">
+                ${this.liveStatus()}
+            </div>
             ${this.renderSearchInput()}
             ${this.loading
                 ? html`<div class="loading-indicator">Searching\u2026</div>`
@@ -1333,6 +1338,26 @@ export class ExploreView extends ViewLifecycleMixin(LitElement) {
         `;
     }
 
+    /** "Searching…" and the error block were both silent (a11y.12). */
+    private liveStatus(): string {
+        if (this.error) return this.error;
+
+        if (this.loading) return 'Searching…';
+
+        const results = this.results;
+
+        if (!results) return '';
+
+        const count =
+            (results.artists?.length ?? 0)
+            + (results.releaseGroups?.length ?? 0)
+            + (results.recordings?.length ?? 0);
+
+        return count === 0
+            ? 'No results.'
+            : `${count} result${count === 1 ? '' : 's'}.`;
+    }
+
     private renderSearchInput() {
         const placeholder =
             this.searchMode === 'lyrics'