Add sidebar-tab hotkey and scrollbar styles

Add styling for .current-box-list scrollbars (hide horizontal overflow, stable gutter, thin scrollbar, and custom colors for Firefox/WebKit) and refine track/thumb visuals. Introduce SIDEBAR_TAB_VIEWS constant and a new hotkey action 'switchSidebarTab' (default binding: Tab). Implement selectNextSidebarTab to rotate between 'main' and 'plugins' views and wire it into the global hotkey handler, respecting sidebar visibility and preventing default behavior when used.

Author: SunOner

frontend/src/App.css

@@ -2390,7 +2390,24 @@
   display: grid;
   gap: 4px;
   max-height: min(22svh, 220px);
-  overflow: auto;
+  overflow-x: hidden;
+  overflow-y: auto;
+  scrollbar-gutter: stable;
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 0.34) rgba(255, 255, 255, 0.04);
+}
+
+.current-box-list::-webkit-scrollbar {
+  width: 8px;
+}
+
+.current-box-list::-webkit-scrollbar-track {
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.current-box-list::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.28);
+  border: 2px solid rgba(5, 5, 5, 0.92);
 }
 
 .current-box-row {

frontend/src/App.tsx

@@ -84,6 +84,8 @@ type ViewportTool = 'draw' | 'new-box' | 'sam-click' | 'sam-box'
 type SidebarView = 'main' | 'info' | 'plugins'
 type ProjectInfoStatus = 'idle' | 'loading' | 'error'
 
+const SIDEBAR_TAB_VIEWS: readonly SidebarView[] = ['main', 'plugins']
+
 type PendingImageLoad = {
   promise: Promise<void>
   cancel: () => void
@@ -177,6 +179,13 @@ const HOTKEY_ACTIONS = [
     description: 'Go to the next image',
     defaultBindings: ['D', 'ArrowRight'],
   },
+  {
+    id: 'switchSidebarTab',
+    section: 'Navigation',
+    title: 'Switch sidebar tab',
+    description: 'Switch between Main Menu and Plugins',
+    defaultBindings: ['Tab'],
+  },
   {
     id: 'deleteSelection',
     section: 'Annotation',
@@ -2950,6 +2959,13 @@ function App() {
     }
   }
 
+  const selectNextSidebarTab = () => {
+    const currentIndex = SIDEBAR_TAB_VIEWS.indexOf(sidebarView)
+    const nextIndex =
+      currentIndex >= 0 ? (currentIndex + 1) % SIDEBAR_TAB_VIEWS.length : 0
+    selectSidebarView(SIDEBAR_TAB_VIEWS[nextIndex] ?? 'main')
+  }
+
   const openProjectInfo = () => {
     setOpenMenu(null)
     setIsSidebarVisible(true)
@@ -4295,6 +4311,16 @@ function App() {
     if (matchesHotkeyAction(event, 'nextImage')) {
       event.preventDefault()
       goNextImage()
+      return
+    }
+
+    if (matchesHotkeyAction(event, 'switchSidebarTab')) {
+      if (!isSidebarVisible) {
+        return
+      }
+
+      event.preventDefault()
+      selectNextSidebarTab()
     }
   })