fix(webapp): inset the focus ring so it is not clipped

The shared focus-custom outline sat just outside the border box (offset 0),
so it was clipped by any ancestor with overflow hidden/auto (scroll areas,
the side menu grid) and covered by adjacent elements' backgrounds. Draw it
1px inside instead so the full ring is always visible. Applies everywhere
focus-custom is used.

Author: samejr

apps/webapp/tailwind.config.js

@@ -289,7 +289,10 @@ module.exports = {
       },
       focusStyles: {
         outline: "1px solid",
-        outlineOffset: "0px",
+        // Inset the ring so it is painted inside the element's box. At offset 0 the outline sits
+        // just outside the border edge and gets clipped by any ancestor with overflow hidden/auto
+        // (scroll areas, the side menu grid) or covered by an adjacent element's background.
+        outlineOffset: "-1px",
         outlineColor: textLink,
         borderRadius: "3px",
       },