fix(dashboard): SessionDetailPage tab bar scrollable on mobile (#3400) (#3406)

- Add overflow-x-auto + scrollbar-none to tab bar container
- Add .scrollbar-none CSS utility (webkit + firefox + IE)
- Add aria-label to tablist for a11y

At 375px viewport, 6 tabs (600px needed) now scroll horizontally
instead of being clipped. Hidden scrollbar keeps it clean.

All 1300 tests pass. TypeScript strict clean.

Author: OneStepAt4time

dashboard/src/index.css

@@ -1124,3 +1124,13 @@ main[id="main-content"] {
   box-shadow:
     0 40px 80px -15px rgba(0, 0, 0, 0.9);
 }
+
+
+/* Hide scrollbar but keep scroll functionality — for mobile tab bars */
+.scrollbar-none {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+.scrollbar-none::-webkit-scrollbar {
+  display: none;
+}

dashboard/src/pages/SessionDetailPage.tsx

@@ -598,7 +598,7 @@ export default function SessionDetailPage() {
             userRole="observer"
           />
 
-          <div className="relative flex gap-2 py-1" role="tablist">
+          <div className="relative flex gap-2 py-1 overflow-x-auto scrollbar-none" role="tablist" aria-label="Session detail tabs">
             {TABS.map((tab) => (
               <button type="button"
                 key={tab.id}