Focus-visible styles are often unclear, inconsistent, or match mouse hover styles

[microbit-robert]

Describe the bug
Focus-visible styles are often unclear, inconsistent, or match mouse hover styles. We are hoping to start a discussion on the best way to improve this situation going forward. Our initial feeling is that an outline or border of sufficient thickness and colour contrast (and perhaps offset where necessary) as a separate focus-visible style applied consistently across the app would be a suitable approach. Here are a couple of examples of where this has already been applied and works well:

Some problematic areas, or areas of inconsistency are noted below.

The download button and other buttons in the editor tools section have subtle focus-visible styles that match mouse hover styles. It is quite easy to visually lose where focus is while navigating the page using the keyboard:

The "Show data" button in the simulator is very prominent. It has no focus-visible style, but already has a thick border, so it's less clear what approach should be taken here:

Buttons in the "Version History" area use the react-common button component. The focus-visible outlines are quite thin compared with other examples and the outline position is inconsistent:

If we were to apply such changes, in some cases it's not clear what colours should be used for a focus-visible outline (i.e., brand blue or brand purple).

Do you consider one of the styles in the screenshots added above to be the 'correct' one? We would welcome your thoughts on the above and whether you think the proposed approach is sensible. Please let us know if you have any concerns or alternative options for consideration.

micro:bit version (please complete the following information):
Not hardware related

Desktop (please complete the following information):
Impacts all OS and browsers
Screen shots taken on Windows 11, Chrome version 133.0.6943.60

Additional context
N/A

@microbit-matt-hillsdon @kmcnaught

[Jaqster]

@microbit-robert - go ahead and propose something that feels consistent. Thanks so much for all your help!