Hide app scrollbars

frontend/src/App.vue

@@ -70,7 +70,7 @@
         <!-- Browse/Search page (left panel) -->
         <main
           ref="browsePanelRef"
-          class="main-content page-slider-panel"
+          class="main-content page-slider-panel scrollbar-hidden"
           data-nav-scope="browse"
           @scroll.passive="handlePanelScroll('browse')"
         >
@@ -165,7 +165,7 @@
         <!-- Detail page (right panel) -->
         <main
           ref="detailPanelRef"
-          class="main-content page-slider-panel page-slider-detail-panel"
+          class="main-content page-slider-panel page-slider-detail-panel scrollbar-hidden"
           data-nav-scope="detail"
           @scroll.passive="handlePanelScroll('detail')"
         >

frontend/src/components/Header.vue

@@ -109,7 +109,7 @@
           <div class="settings-header-spacer"></div>
         </div>
 
-        <div class="settings-content">
+        <div class="settings-content scrollbar-hidden">
           <section class="settings-section">
             <h2 class="settings-section-title">Media Roots</h2>
             <p class="settings-section-desc">Folders scanned and indexed by MediaHive.</p>

frontend/src/components/MediaDetail.vue

@@ -1479,20 +1479,14 @@ html:not(.mouse-active) .cast-card.nav-focused::after {
   overflow-x: auto;
   padding-bottom: 8px;
   scroll-behavior: smooth;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
 }
 
 .showreel-images::-webkit-scrollbar {
-  height: 6px;
-}
-
-.showreel-images::-webkit-scrollbar-track {
-  background: rgba(255, 255, 255, 0.05);
-  border-radius: 3px;
-}
-
-.showreel-images::-webkit-scrollbar-thumb {
-  background: rgba(255, 255, 255, 0.2);
-  border-radius: 3px;
+  width: 0;
+  height: 0;
+  display: none;
 }
 
 .showreel-image {

frontend/src/styles/main.css

@@ -61,6 +61,17 @@ html:not(.pointer-visible) * {
   overflow: hidden;
 }
 
+.scrollbar-hidden {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+.scrollbar-hidden::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
+}
+
 /* Scrollbar styling */
 ::-webkit-scrollbar {
   width: 8px;
@@ -525,6 +536,14 @@ html.mouse-active .media-card:hover .media-card-info {
   justify-content: center;
   padding: 40px 20px;
   overflow-y: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+.modal-overlay::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
 
 .modal-content {