WCAG 2.2 AA audit fixes + dependent-settings gating

[jage9]

Summary

This PR bundles a WCAG 2.2 AA audit pass on the web UI together with a follow-up round of settings-panel UX improvements (dependent-control gating).

Accessibility (WCAG 2.2 AA)

• 2.5.8 Target Size (Minimum) — The progress seek slider now exposes a 24 px tall interactive hit area while still rendering a 6 px visual bar via a ::before pseudo-element. Range slider thumbs grew from 18 px to 24 px (webkit + moz). Cue marks on the progress bar were re-centred so they stay aligned in the expanded track.
• 1.4.11 Non-text Contrast — The badge border on the now-playing card was using --border (#0f3460), which only achieved 1.3:1 against the card background. A new --badge-border token (#4d7eb5) brings that to 3.76:1 on --bg-card, which passes the 3:1 minimum for UI components.
• 4.1.2 Name, Role, Value — The discovery interval input previously relied on aria-disabled="true", which does not actually block keyboard or pointer interaction. Switched to the native disabled attribute on #disc-every so the input is genuinely inert when discovery is off.
• 1.3.1 Info and Relationships — Added aria-describedby references to twenty-five settings controls that were missing them, so the existing inline help text is now programmatically associated with its field instead of being purely visual.
• <summary> / <h2> double announcement — Every <details><summary> previously wrapped its label in <h2>, which screen readers announced once as a heading and once as a disclosure widget. Removed the inner <h2> and reapplied the heading look (1.1 rem, 600 weight, uppercase, letter-spaced, dim foreground) directly via details.card > summary CSS. Section aria-labelledby references now point at the corresponding tab IDs (tab-now etc.) so each tabpanel is still labelled. The EQ group retains its label via id="eq-heading" moved onto its summary.
• Expand / collapse arrow — The ▸ / ▾ glyph in the summary ::after is now suppressed from assistive-tech speech using the CSS alt-text syntax content: "\25B8" / "". The disclosure widget already announces expanded / collapsed state, so the glyph is purely visual.
• Smaller cleanups — Removed the redundant role="main" from <main>, consolidated the duplicate .sr-only class onto .visually-hidden, and dropped the now-dead .sr-only block.

Settings UX — dependent-control gating

• The discovery Every N tracks row now collapses when Inject distant tracks is unchecked, matching the existing mood-arc-hours pattern.
• The Use flats row and its description now collapse when Key notation is not set to Musical. This required extending show-when.js to recognise a selectId=value form on data-show-when, in addition to the existing checkbox form.
• A global [hidden] { display: none !important } rule was added to app.css. Without it, .settings-row { display: flex } and .setting-desc { display: block } outranked the user-agent [hidden] { display: none } rule on specificity, so JS-set hidden attributes had no visual effect — the dependent rows stayed visible even though the JS logic was correct.
• applyShowWhen() is now called at the end of applySettingsState. Previously the delegated change listener was the only path that re-evaluated visibility, but WebSocket state pushes set select values programmatically (.value = ...), which does not fire change, so the show-when state was effectively frozen to whatever the HTML defaults were at page load.
• The stale help-text sentence referencing a Discovery button on the Now Playing tab was removed (the button was hidden a while back). The Use flats label was trimmed from "Use flats (musical mode)" to just "Use flats", and its description no longer carries the redundant "Only used when key notation is set to Musical" sentence.

Test plan

• Open the Settings tab in Firefox. Toggle Key notation between Camelot and Musical: the Use flats row and its description should show in Musical and hide in Camelot.
• Toggle Inject distant tracks off: the Every N tracks row should disappear.
• Toggle Mood arc off: the Mood arc length (hours) row should disappear.
• Toggle Enable voice liners off: the Trigger, Mix, and Library fieldsets should all collapse together.
• While key notation is set to Camelot, click another setting to force a WebSocket state push. The Use flats row should stay hidden (regression check for the new applyShowWhen() call).
• Move NVDA focus over the progress slider: it should announce role=progressbar with a meaningful aria-valuetext, and the hit target should be at least 24 px tall.
• Inspect the now-playing badges in DevTools: they should have a visible #4d7eb5 border with at least 3:1 contrast against the card background.
• Tab through the Settings panel with NVDA: every control should announce its associated description after its label.

Generated with Claude Code.