From b2c3580e17cc463bf663b6851d53e4ea09af7761 Mon Sep 17 00:00:00 2001
From: Jaime Idolpx <jaime@idolpx.com>
Date: Mon, 8 Jun 2026 18:55:32 -0400
Subject: [PATCH] feat(RealityOverridePage): persist background visibility
 state using localStorage

---
 src/app/components/RealityOverridePage.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/app/components/RealityOverridePage.tsx b/src/app/components/RealityOverridePage.tsx
index a99f34f..1d9bb0d 100644
--- a/src/app/components/RealityOverridePage.tsx
+++ b/src/app/components/RealityOverridePage.tsx
@@ -100,17 +100,19 @@ export default function RealityOverridePage({ onBack }: { onBack: () => void })
   const wsRef        = useRef<WebSocket | null>(null);
   const msgIdRef     = useRef(0);
   const fadeTimer    = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
-  const pausedRef    = useRef(false);
+  const pausedRef    = useRef(localStorage.getItem('ro-bg') === 'off');
   const lastTapRef   = useRef(0);
 
   const [wsStatus,   setWsStatus]   = useState<'connecting' | 'connected' | 'disconnected'>('connecting');
   const [currentCmd, setCurrentCmd] = useState<Msg | null>(null);
   const [history,    setHistory]    = useState<Msg[]>([]);
-  const [bgVisible,  setBgVisible]  = useState(true);
+  const [bgVisible,  setBgVisible]  = useState(() => localStorage.getItem('ro-bg') !== 'off');
 
   const toggleBg = () => {
     pausedRef.current = !pausedRef.current;
-    setBgVisible(!pausedRef.current);
+    const next = !pausedRef.current;
+    setBgVisible(next);
+    localStorage.setItem('ro-bg', next ? 'on' : 'off');
   };
 
   const handleTouchEnd = () => {