feat: make hover tooltips accessible on touch devices

[sheikhwasimuddin]

Summary

This PR makes tooltip-based information (like Distribution, Playstyle badges, and Language tier) accessible on mobile devices by adding touch support, while preserving the existing pure-CSS hover behavior for desktop users.

Changes

• Updated the Tip component (ScoutReport.tsx) to maintain an isOpen state for touch/click events.
• Added event listeners for outside touches and the Escape key to cleanly dismiss the tooltip.
• Made the tooltip fully keyboard accessible (Space/Enter to toggle) by adding tabIndex={0} and a subtle focus ring (focus-visible:ring-2).
• Preserved the existing group-hover/tip:block class so desktop hover behavior remains untouched.

How to test

1. Open the app on a mobile device (or use browser dev tools mobile emulation).
2. Tap on any badge (e.g. Polyglot, Language tier) or the Distribution text. The tooltip should appear.
3. Tap outside the tooltip; it should disappear.
4. On desktop, hover over the same elements to ensure standard hover behavior still works perfectly.
5. Use the Tab key to focus a tooltip, and press Enter or Space to toggle it.

Before

After