style(web): command palette scrollbar visibility and styling (#1093)

* Initial plan

* Fix command palette scrollbar visibility and styling

Co-authored-by: tyler-dane <30163055+tyler-dane@users.noreply.github.com>

* style(web): remove redundant scrollbar styles

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: tyler-dane <30163055+tyler-dane@users.noreply.github.com>
Co-authored-by: Tyler Dane <tyler@switchback.tech>

Author: Copilot

packages/web/src/components/GlobalStyle/styled.ts

@@ -21,4 +21,24 @@ export const GlobalStyle = createGlobalStyle`
   :focus-visible {
     outline: none;
   }
+
+  /* Command palette scrollbar styling */
+  .command-palette .overflow-y-auto {
+    /* Always reserve scrollbar space */
+    &::-webkit-scrollbar {
+      width: 8px;
+    }
+
+    /* Show scrollbar when hovering over the command palette container */
+    &:hover::-webkit-scrollbar-thumb,
+    &:focus::-webkit-scrollbar-thumb,
+    &:active::-webkit-scrollbar-thumb {
+      background-color: ${theme.color.panel.scrollbar};
+    }
+
+    /* Even more visible on hover of the thumb itself */
+    &:hover::-webkit-scrollbar-thumb:hover {
+      background-color: ${theme.color.panel.scrollbarActive};
+    }
+  }
 `;