webui: fix white screen routing/base and add mobile responsive sidebar

webui/src/components/Layout.tsx

@@ -3,15 +3,20 @@ import { Outlet, useLocation } from 'react-router-dom';
 import { motion, AnimatePresence } from 'motion/react';
 import Header from './Header';
 import Sidebar from './Sidebar';
+import { useAppContext } from '../context/AppContext';
 
 const Layout: React.FC = () => {
   const location = useLocation();
+  const { sidebarOpen, setSidebarOpen } = useAppContext();
 
   return (
     <div className="flex flex-col h-screen bg-zinc-950 text-zinc-50 overflow-hidden font-sans">
       <Header />
       <div className="flex flex-1 min-h-0">
         <Sidebar />
+        {sidebarOpen && (
+          <button className="fixed inset-0 top-16 bg-black/40 z-30 md:hidden" onClick={() => setSidebarOpen(false)} aria-label="close sidebar" />
+        )}
         <main className="flex-1 flex flex-col min-w-0 relative bg-zinc-950/50">
           <AnimatePresence mode="wait">
             <motion.div