fix(tooltips): prevent hover pop-up reappearance on click (@byseif21) (monkeytypegame#6831)

### Description

tooltip pop-ups were reappearing on click when interacting with various
clickable elements (e.g., tags in results table, test result buttons,
account page actions).

Author: byseif21

frontend/src/styles/core.scss

@@ -466,3 +466,15 @@ key {
   font-size: var(--balloon-font-size);
   line-height: var(--balloon-font-size);
 }
+
+// this here to prevent tooltips from showing when an element is focused via mouse click
+// to avoid reappearing popups after clicks, WITHOUT breaking keyboard nav.
+// so shortly we show balloon tooltips on hover and keyboard focus only. not on mouse focus!
+@supports selector(:focus-visible) {
+  [aria-label][data-balloon-pos]:focus:not(:focus-visible):not(:hover)::before,
+  [aria-label][data-balloon-pos]:focus:not(:focus-visible):not(:hover)::after {
+    opacity: 0 !important;
+    visibility: hidden !important;
+    pointer-events: none !important;
+  }
+}

frontend/src/ts/pages/settings.ts

@@ -1008,7 +1008,6 @@ $(".pageSettings .section[data-config-name='funbox'] .buttons").on(
     const funbox = $(e.currentTarget).attr("data-config-value") as FunboxName;
     Funbox.toggleFunbox(funbox);
     setActiveFunboxButton();
-    $(e.currentTarget).blur();
   }
 );