Consider updating the <Button /> component to use react-aria useButton Hook

[AshleyRedman]

After using / testing the site around different browsers & mobile browsers, the focus ring and hold-drag behaves differently.
This is unforantly the nature of different browsers as they have their own interpretation of these interactions. To tackle that, Adobe has released a great (well maintained) library called react-aria. Within, they provide a useButton hook which allows to wrap the native button (can not be a button I suppose), and the usage becomes standardised across browsers.

https://react-spectrum.adobe.com/react-aria/useButton.html

Ref: https://github.com/JiscSD/octopus/tree/main/ui/src/components/Button