diff --git a/webui/src/App.jsx b/webui/src/App.jsx
index 9e7207d..9967d3e 100644
--- a/webui/src/App.jsx
+++ b/webui/src/App.jsx
@@ -42,6 +42,8 @@ import Login from './pages/Login';
 import AccountSettings from './pages/AccountSettings';
 import PeerDashboard from './pages/PeerDashboard';
 import MyServices from './pages/MyServices';
+import Setup from './pages/Setup';
+import SetupGuard from './components/SetupGuard';
 
 function PendingRestartBanner({ pending, onApply, onCancel }) {
   const [confirming, setConfirming] = useState(false);
@@ -264,7 +266,9 @@ function AppCore() {
 
   return (
     <Router>
+      <SetupGuard>
       <Routes>
+        <Route path="/setup" element={<Setup />} />
         <Route path="/login" element={<Login />} />
         <Route path="*" element={
           <ConfigProvider>
@@ -350,6 +354,7 @@ function AppCore() {
           </ConfigProvider>
         } />
       </Routes>
+      </SetupGuard>
     </Router>
   );
 }
diff --git a/webui/src/services/api.js b/webui/src/services/api.js
index 96bc43f..444c19b 100644
--- a/webui/src/services/api.js
+++ b/webui/src/services/api.js
@@ -311,6 +311,13 @@ export const logsAPI = {
   setVerbosity: (levels) => api.put('/api/logs/verbosity', levels),
 };
 
+// Setup Wizard API
+export const setupAPI = {
+  getStatus: () => api.get('/api/setup/status'),
+  validate: (step, data) => api.post('/api/setup/validate', { step, data }),
+  complete: (payload) => api.post('/api/setup/complete', payload),
+};
+
 // Container Management API
 export const containerAPI = {
   // Containers