No prefers-reduced-motion CSS support

[alexwolson]

Summary

assets/css/custom.css and _pages/feedback.md contain several CSS transitions and animations but none are wrapped in a prefers-reduced-motion media query. Users who have requested reduced motion (via OS accessibility settings) will still see all animations play.

Affected transitions

In assets/css/custom.css:

• .badge — transition: background-color 0.2s ease, color 0.2s ease (line 60)
• Card hover effects — transition: box-shadow 0.2s ease (line 121)
• Mobile menu slide — transition: transform 0.3s ease (line 382, 410)

In _pages/feedback.md:

• .fb-conditional show/hide — transition: max-height 0.3s ease, opacity 0.25s ease (line 190)
• .fb-followup show/hide — transition: max-height 0.4s ease, opacity 0.3s ease (line 227)
• Rating/pill button interactions — transition: all 0.15s ease (line 110, 162)

Fix

Wrap all non-essential transitions in a reduced-motion override at the end of the stylesheet:

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

This blanket approach is safe for this site since no animations convey essential information. Add it to the end of assets/css/custom.css. The feedback form styles in feedback.md should also get the same override in their inline <style> block.

WCAG criterion

2.3.3 Animation from Interactions (Level AAA) — while AAA, this is a straightforward improvement for users with vestibular disorders.