report(tooltip): fix tooltip positioning in devtools (#16844)

Author: lusayaa

report/assets/styles.css

@@ -1883,8 +1883,8 @@ details[open] .lh-clump-toggletext--hide { display: block;}
 */
 @media screen and (max-width: 535px) {
   .lh-tooltip {
-    min-width: 45vw;
-    padding: 3vw;
+    min-width: 45cqi;
+    padding: 3cqi;
   }
 }
 
@@ -1893,8 +1893,8 @@ details[open] .lh-clump-toggletext--hide { display: block;}
 */
 @container lh-container (max-width: 535px) {
   .lh-tooltip {
-    min-width: 45vw;
-    padding: 3vw;
+    min-width: 45cqi;
+    padding: 3cqi;
   }
 }
 
@@ -2030,6 +2030,10 @@ details[open] .lh-clump-toggletext--hide { display: block;}
   left: 6px;
 }
 
+.lh-meta__item:hover .lh-tooltip {
+  right: auto;
+  left: 6px;
+}
 /**
 * This media query is a temporary fallback for browsers that do not support `@container query`.
 * TODO: remove this media query when `@container query` is fully supported by browsers