style(base): slim the body-grid horizontal scrollbar

The browser-default-thick scrollbar at the bottom of an inline-embed's
bodyGrid was visually competing with the table content. Drop it to an
8px thumb with a transparent track in WebKit and `scrollbar-width:
thin` in Firefox. Tokens picked from the Mantine theme so dark mode
inverts cleanly.

apps/client/src/features/base/styles/grid.module.css

@@ -80,6 +80,34 @@
   /* Bottom-padding so the AddRowButton keeps clear of the horizontal
    * scrollbar that lives on this element. */
   padding-bottom: 6px;
+  /* Slim down the horizontal scrollbar — the browser default is too
+   * heavy for an inline embed sitting in a document and competes
+   * visually with the table content. Firefox honors scrollbar-width;
+   * Chrome/Safari/Edge style the WebKit pseudo-elements. */
+  scrollbar-width: thin;
+}
+
+.bodyGrid::-webkit-scrollbar {
+  height: 8px;
+}
+
+.bodyGrid::-webkit-scrollbar-thumb {
+  background-color: light-dark(
+    var(--mantine-color-gray-4),
+    var(--mantine-color-dark-4)
+  );
+  border-radius: 4px;
+}
+
+.bodyGrid::-webkit-scrollbar-thumb:hover {
+  background-color: light-dark(
+    var(--mantine-color-gray-5),
+    var(--mantine-color-dark-3)
+  );
+}
+
+.bodyGrid::-webkit-scrollbar-track {
+  background-color: transparent;
 }
 
 .headerRow {