fix: Improve focus style consistency

[dcalhoun]

Proposed Changes

• Prefer focus-visible styles over focusable to satisfy prior design guidance.
• Remove unnecessary styles from seemingly non-focusable li element.

Testing Instructions

Verify keyboard focus styles

1. Interact with the site navigation, starting/stopping sites using a keyboard.
2. Verify focus styles work as expected while using a keyboard.

Verify pointer/cursor styles

1. Interact with the site navigation, starting/stopping sites using a
   pointer/cursor/keyboard.
2. Verify the focus styles do not linger after no longer hovering.

Before	After
before.mov	after.mov

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[dcalhoun]

The focus styles applied to the li element did not appear to have an impact, as the element is not focusable. The child button is the element focused when moving focus with the keyboard, which has its own focus styles with an outline.

[dcalhoun]

👋🏻 @SiobhyB I hope I provided clear explanation for my rationale in the descriptions, but please let me know if I could provide more context or if you have a different perspective on this subject. Thanks! 🙇🏻

[wojtekn]

Thanks for the cleanup. The code change looks good, and the focus behavior seems better now.

[SiobhyB]

@dcalhoun, I tested and this looks good to me, too! Thanks for cleaning up and outlining your reasoning 🙌