diff --git a/web/app/tv-guide.css b/web/app/tv-guide.css
index 8c7f905dc..76a3f12ae 100644
--- a/web/app/tv-guide.css
+++ b/web/app/tv-guide.css
@@ -1,4 +1,5 @@
 /* TV workspace: shared charcoal surfaces, independent selected/focused states. */
+.app-shell:has(.player-overlay:not(.player-docked)) > :is(.sidebar, .mobile-header, .mobile-bottom-nav) { visibility: hidden; pointer-events: none; }
 .player-overlay.player-docked { z-index: 40; border-radius: 4px; overflow: hidden; background: #080808; }
 .player-overlay.player-docked > .player-top, .player-overlay.player-docked > .player-controls,
 .player-overlay.player-docked > .player-panel { display: none; }
diff --git a/web/components/shell/AppShell.tsx b/web/components/shell/AppShell.tsx
index 3cc16b148..4d5e0cdef 100644
--- a/web/components/shell/AppShell.tsx
+++ b/web/components/shell/AppShell.tsx
@@ -30,7 +30,7 @@ const ACCENTS: Record<string, string> = {
 };
 
 export function AppShell() {
-  const { view, section, settings, selected, activeStream } = useApp();
+  const { view, section, settings, selected, activeStream, activeChannel } = useApp();
   const [mounted, setMounted] = useState(false);
 
   useEffect(() => {
@@ -88,7 +88,7 @@ export function AppShell() {
       className={`app-shell ${settings.oledBlack ? "oled" : ""} ${settings.spoilerBlur ? "spoiler-blur" : ""}`}
       style={{ ["--accent" as string]: accent }}
     >
-      {!activeStream && <TopNav />}
+      {(!activeStream || (section === "tv" && activeChannel)) && <TopNav />}
 
       <section className="content">
         {selected ? (