diff --git a/resources/views/videos/types/match.blade.php b/resources/views/videos/types/match.blade.php
index d219f9c..fd1f145 100644
--- a/resources/views/videos/types/match.blade.php
+++ b/resources/views/videos/types/match.blade.php
@@ -1975,9 +1975,10 @@
         /* ============================================================
            MATCH HIGHLIGHTS — fullscreen landscape drawer
            Native fullscreen renders only #ytpWrap + descendants, so JS
-           relocates the pane inside the player and it becomes a Narrow,
-           Clear (blurred-glass) right-side drawer that barely covers the
-           match. Applies at any width, only while .ytp-fullscreen is on.
+           relocates the pane inside the player. It becomes a narrow solid
+           right-side drawer, and the video (inside .ytp) is squeezed into
+           the remaining left area so nothing overlaps — both are fully
+           visible side by side. Only while .ytp-fullscreen is on.
            ============================================================ */
         .ytp-wrap.ytp-fullscreen { --hl-drawer-w: clamp(230px, 30vw, 360px); }
 
@@ -1990,11 +1991,9 @@
             width: var(--hl-drawer-w) !important;
             height: auto !important; max-height: none !important;
             margin: 0 !important; border-radius: 0 !important;
-            background: linear-gradient(to left, rgba(10, 10, 13, 0.42), rgba(10, 10, 13, 0.14));
-            -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
+            background: var(--bg-secondary, #17171b);   /* solid: the video is squeezed aside, not behind it */
             border-left: 1px solid rgba(255, 255, 255, 0.10);
             box-shadow: none;
-            text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85); /* legibility over the video */
             transform: translateX(100%);
             transition: transform 0.34s cubic-bezier(0.32, 0.72, 0, 1);
             pointer-events: none; z-index: 40;
@@ -2002,25 +2001,11 @@
         .ytp-wrap.ytp-fullscreen .events-sidebar.show { transform: translateX(0); pointer-events: auto; }
         .ytp-wrap.ytp-fullscreen .events-sidebar .hl-sheet-grab { display: none; }
 
-        /* Fallback where backdrop-filter is unsupported — firm up the fill so the
-           list stays readable over the video. */
-        @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
-            .ytp-wrap.ytp-fullscreen .events-sidebar {
-                background: linear-gradient(to left, rgba(10, 10, 13, 0.74), rgba(10, 10, 13, 0.52));
-            }
-        }
-
-        /* While the drawer is open: pull the controls into the video area so the
-           scrubber isn't hidden, keep the coach caption in the video area, and slide
-           the Highlights button to the drawer's left edge so it stays tappable. */
-        .ytp-wrap.ytp-fullscreen.hl-drawer-open .ytp-chrome-bottom,
-        .ytp-wrap.ytp-fullscreen.hl-drawer-open .ytp-gradient-bottom { right: var(--hl-drawer-w) !important; }
-        .ytp-wrap.ytp-fullscreen.hl-drawer-open .coach-note-overlay {
-            left: 16px; right: auto; transform: none; max-width: 60%;
-        }
-        .ytp-wrap.ytp-fullscreen.hl-drawer-open .match-highlights-toggle {
-            right: calc(var(--hl-drawer-w) + 10px);
-        }
+        /* Squeeze the video into the remaining left area when the drawer is open.
+           Everything else (controls, coach caption, the Highlights button) lives
+           inside .ytp, so it all moves with the video — nothing sits under the drawer. */
+        .ytp-wrap.ytp-fullscreen .ytp { transition: width 0.34s cubic-bezier(0.32, 0.72, 0, 1); }
+        .ytp-wrap.ytp-fullscreen.hl-drawer-open .ytp { width: calc(100% - var(--hl-drawer-w)); }
         @media (prefers-reduced-motion: reduce) {
             .ytp-wrap.ytp-fullscreen .events-sidebar { transition: none; }
         }