fix(web): smooth the sidebar nav hover nudge

[vineethkrishnan]

The bug

The sidebar nav links carry hover:translate-x-0.5, and .row-interactive already declared transition: transform 0.2s, so the CSS read as correct. It was not.

Tailwind v4 compiles translate-* to the standalone translate property, not to transform. Verified against the pinned 4.3.2 CLI:

.hover\:translate-x-0\.5 {
  --tw-translate-x: calc(var(--spacing) * 0.5);
  translate: var(--tw-translate-x) var(--tw-translate-y);
}

Nothing was transitioning the property that actually changes, so the nudge snapped instantly. hover:text-foreground snapped too, since color was never in the transition list either.

The fix

All four of transform, translate, scale and rotate are now listed, on the shared a, button, input, ... base rule as well as on .row-interactive, so the same latent bug cannot resurface the next time a hover:scale-* or hover:rotate-* is added elsewhere in the app.

ItemList.tsx:315 was already smooth and is untouched: it uses Tailwind's own transition-transform utility, which does expand to transform, translate, scale, rotate.

Hover polish

Three changes that make the menu hover read better:

• Asymmetric timing - 0.14s arriving, 0.22s settling back. Responsive rather than twitchy.
• :focus-visible reveals the brand bar, so keyboard users get the same affordance the pointer already had.
• prefers-reduced-motion drops the nudge entirely. The existing global rule only zeroed the transition duration, which left the row still jolting sideways. The brand bar and background now carry the hover state on their own. No !important needed: the custom rules are unlayered and Tailwind's utilities sit in @layer utilities.

Verification

• npm run build clean, 219/219 unit tests passing
• Confirmed the emitted transition declaration and the reduced-motion rule in the minified production CSS, not just in source

Not visually confirmed in a browser.