feat(visualizer): add layers + fast timeframe switching

apps/visualizer/src/features/market/DlobDashboard.tsx

@@ -4,6 +4,7 @@ import type { DlobDepthBandRow } from './useDlobDepthBands';
 import type { DlobSlippageRow } from './useDlobSlippage';
 import DlobDepthBandsPanel from './DlobDepthBandsPanel';
 import DlobSlippageChart from './DlobSlippageChart';
+import Button from '../../ui/Button';
 
 function formatUsd(v: number | null | undefined): string {
   if (v == null || !Number.isFinite(v)) return '—';
@@ -39,6 +40,8 @@ export default function DlobDashboard({
   slippageRows,
   slippageConnected,
   slippageError,
+  isFullscreen,
+  onToggleFullscreen,
 }: {
   market: string;
   stats: DlobStats | null;
@@ -50,6 +53,8 @@ export default function DlobDashboard({
   slippageRows: DlobSlippageRow[];
   slippageConnected: boolean;
   slippageError: string | null;
+  isFullscreen?: boolean;
+  onToggleFullscreen?: () => void;
 }) {
   const updatedAt = stats?.updatedAt || depthBands[0]?.updatedAt || slippageRows[0]?.updatedAt || null;
 
@@ -60,6 +65,16 @@ export default function DlobDashboard({
         <div className="dlobDash__meta">
           <span className="dlobDash__market">{market}</span>
           <span className="muted">{updatedAt ? `updated ${updatedAt}` : '—'}</span>
+          {onToggleFullscreen ? (
+            <Button
+              size="sm"
+              variant={isFullscreen ? 'primary' : 'ghost'}
+              onClick={onToggleFullscreen}
+              type="button"
+            >
+              {isFullscreen ? 'Exit' : 'Fullscreen'}
+            </Button>
+          ) : null}
         </div>
       </div>