diff --git a/admin/backend/api/v1/settings/__init__.py b/admin/backend/api/v1/settings/__init__.py
index d35d302b8..5a23df47d 100644
--- a/admin/backend/api/v1/settings/__init__.py
+++ b/admin/backend/api/v1/settings/__init__.py
@@ -83,6 +83,7 @@ def build_settings_response(config: BenchConfig, bench_root: Path | None = None)
             "default_branch": config.default_branch,
             "db_type": config.db_type,
             "allow_developer_mode": config.allow_developer_mode,
+            "onboarding": config.onboarding,
         },
         "mariadb": {
             "host": config.mariadb.host,
diff --git a/admin/backend/api/v1/settings/config.py b/admin/backend/api/v1/settings/config.py
index b51f69478..cb78f73a6 100644
--- a/admin/backend/api/v1/settings/config.py
+++ b/admin/backend/api/v1/settings/config.py
@@ -4,6 +4,7 @@
 
 from pilot.config import BenchConfig, FirewallRule, S3Config, WafCondition, WafRule, WorkerGroup
 from pilot.config.alert_limit import RESOURCE_LIMIT_FIELDS
+from pilot.config.bench import ONBOARDING_STATES
 from pilot.config.llm import LLMConfig
 from pilot.config.mail import MailConfig
 from pilot.core.alerts import check_mail_credentials
@@ -39,7 +40,8 @@ def __init__(self, config: BenchConfig, data: dict, mail: MailConfig | None = No
     def apply(self) -> str | None:
         if error := self.get_group_type_error():
             return error
-        self._apply_bench()
+        if error := self._apply_bench():
+            return error
         self._apply_lite_mode()
         self._apply_letsencrypt()
         self._apply_workers()
@@ -66,7 +68,7 @@ def get_group_type_error(self) -> str | None:
                 return f"{name} must be {'a list' if expected is list else 'an object'}."
         return None
 
-    def _apply_bench(self) -> None:
+    def _apply_bench(self) -> str | None:
         bench = self.data.get("bench") or {}
         if "http_port" in bench:
             self.config.http_port = int(bench["http_port"])
@@ -76,6 +78,11 @@ def _apply_bench(self) -> None:
             self.config.default_branch = str(bench["default_branch"]).strip()
         if "allow_developer_mode" in bench:
             self.config.allow_developer_mode = bool(bench["allow_developer_mode"])
+        if "onboarding" in bench:
+            if bench["onboarding"] not in ONBOARDING_STATES:
+                return f"bench.onboarding must be one of: {', '.join(repr(state) for state in ONBOARDING_STATES)}"
+            self.config.onboarding = bench["onboarding"]
+        return None
 
     def _apply_lite_mode(self) -> None:
         lite_mode = self.data.get("lite_mode") or {}
diff --git a/admin/backend/api/v1/types/settings.py b/admin/backend/api/v1/types/settings.py
index 3e7e23a97..ed984f2a5 100644
--- a/admin/backend/api/v1/types/settings.py
+++ b/admin/backend/api/v1/types/settings.py
@@ -111,6 +111,7 @@ class GeneralSettings(TypedDict):
     default_branch: str
     db_type: str
     allow_developer_mode: bool
+    onboarding: str
 
 
 class MariaDBSettings(TypedDict):
diff --git a/admin/frontend/dashboard/e2e/global-setup.ts b/admin/frontend/dashboard/e2e/global-setup.ts
index c0db8f0f9..85407052e 100644
--- a/admin/frontend/dashboard/e2e/global-setup.ts
+++ b/admin/frontend/dashboard/e2e/global-setup.ts
@@ -9,6 +9,11 @@ const globalSetup = async (config) => {
   })
   await expect(res).toBeOK()
 
+  const onboarding = await context.patch('/api/v1/settings', {
+    data: { bench: { onboarding: 'dismissed' } },
+  })
+  await expect(onboarding).toBeOK()
+
   await context.storageState({ path: storageState })
   await context.dispose()
 }
diff --git a/admin/frontend/dashboard/e2e/onboarding.spec.ts b/admin/frontend/dashboard/e2e/onboarding.spec.ts
new file mode 100644
index 000000000..ff45221ad
--- /dev/null
+++ b/admin/frontend/dashboard/e2e/onboarding.spec.ts
@@ -0,0 +1,80 @@
+import { expect, type Page, test } from '@playwright/test'
+
+const mockBench = async (page: Page, onboarding: string) => {
+  const updates: object[] = []
+  const created: object[] = []
+
+  await page.route('**/api/v1/**', async (route) => {
+    const request = route.request()
+    const path = new URL(request.url()).pathname.replace('/api/v1/', '')
+    const method = request.method()
+
+    if (path === 'settings' && method === 'PATCH') updates.push(request.postDataJSON())
+    if (path === 'sites' && method === 'POST') created.push(request.postDataJSON())
+
+    const responses: Record<string, object> = {
+      bootstrap: { mode: 'ready', enabled: true },
+      'auth/session': { authenticated: true },
+      settings: {
+        bench: { onboarding },
+        s3: {},
+        s3_providers: [{ value: 'aws', label: 'AWS', regions: ['us-east-1'] }],
+      },
+      'git/connection': { connected: false, central: { available: false } },
+      sites: method === 'POST' ? { task_id: 'onboarding-task' } : [],
+      'sites/wildcard-domains': { domains: [] },
+      apps: [],
+      'marketplace/apps': [],
+      notifications: { data: [], meta: { unread: 0, next_cursor: null } },
+    }
+
+    await route.fulfill({ json: responses[path] ?? {} })
+  })
+
+  return { updates, created }
+}
+
+test('Opens on a fresh bench', async ({ page }) => {
+  await mockBench(page, '')
+  await page.goto('/sites')
+
+  await expect(page.getByRole('dialog').getByRole('heading', { name: 'Connect your GitHub' })).toBeVisible()
+})
+
+test('Skips to the site step and opens its task', async ({ page }) => {
+  const { updates, created } = await mockBench(page, '')
+  await page.goto('/sites')
+
+  const dialog = page.getByRole('dialog')
+  await dialog.getByRole('button', { name: 'Skip' }).click()
+  await expect(dialog.getByRole('heading', { name: 'Where should backups go?' })).toBeVisible()
+
+  await dialog.getByRole('button', { name: 'Skip' }).click()
+  await dialog.getByLabel('Site name').fill('first.localhost')
+  await dialog.getByRole('button', { name: 'Create site' }).click()
+
+  await expect(page).toHaveURL(/\/insights\/tasks\/onboarding-task$/)
+  await expect(dialog).toBeHidden()
+  expect(created).toEqual([{ name: 'first.localhost', apps: [] }])
+  expect(updates).toContainEqual({ bench: { onboarding: 'minimized' } })
+})
+
+test('Stays in the sidebar once minimized', async ({ page }) => {
+  await mockBench(page, 'minimized')
+  await page.goto('/sites')
+
+  await expect(page.getByRole('button', { name: 'Get started' })).toBeVisible()
+  await expect(page.getByRole('dialog')).toHaveCount(0)
+})
+
+test('Stays hidden once dismissed', async ({ page }) => {
+  await mockBench(page, 'dismissed')
+
+  const settingsLoaded = page.waitForResponse('**/api/v1/settings')
+  await page.goto('/sites')
+  await settingsLoaded
+
+  await expect(page.getByRole('navigation', { name: 'Main' })).toBeVisible()
+  await expect(page.getByRole('button', { name: 'Get started' })).toHaveCount(0)
+  await expect(page.getByRole('dialog')).toHaveCount(0)
+})
diff --git a/admin/frontend/dashboard/src/components/common/CircularProgress.vue b/admin/frontend/dashboard/src/components/common/CircularProgress.vue
new file mode 100644
index 000000000..5e1f14f1d
--- /dev/null
+++ b/admin/frontend/dashboard/src/components/common/CircularProgress.vue
@@ -0,0 +1,25 @@
+<script setup lang="ts">
+defineProps<{ value: number }>()
+</script>
+
+<template>
+  <svg
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke-width="2"
+    class="size-4 -rotate-90"
+    aria-hidden="true"
+  >
+    <circle cx="8" cy="8" r="6" class="stroke-current text-ink-gray-3" />
+
+    <circle
+      cx="8"
+      cy="8"
+      r="6"
+      pathLength="100"
+      stroke-linecap="round"
+      :stroke-dasharray="`${value} 100`"
+      class="stroke-current text-ink-gray-8 transition-[stroke-dasharray] duration-500"
+    />
+  </svg>
+</template>
diff --git a/admin/frontend/dashboard/src/components/common/TerminalOutput.vue b/admin/frontend/dashboard/src/components/common/TerminalOutput.vue
index 4ed1a8419..e22181e1a 100644
--- a/admin/frontend/dashboard/src/components/common/TerminalOutput.vue
+++ b/admin/frontend/dashboard/src/components/common/TerminalOutput.vue
@@ -36,13 +36,13 @@ defineExpose({ scrollToBottom })
 <template>
   <div
     ref="el"
-    class="terminal select-text font-mono text-sm leading-[1.6]"
+    class="terminal select-text bg-surface-gray-1 text-ink-gray-8 font-mono text-sm leading-[1.6]"
     :class="{ 'terminal--fill': fill }"
     :style="fill ? '' : `max-height:${maxHeight}`"
   >
-    <div v-if="!lines.length" class="terminal__empty">{{ emptyText }}</div>
-    <div v-for="(line, index) in lines" :key="index" class="terminal__row">
-      <span v-if="lineNumbers" class="terminal__lineno">{{ index + 1 }}</span>
+    <div v-if="!lines.length" class="terminal__empty text-ink-gray-5">{{ emptyText }}</div>
+    <div v-for="(line, index) in lines" :key="index" class="terminal__row hover:bg-surface-gray-2">
+      <span v-if="lineNumbers" class="terminal__lineno text-ink-gray-4">{{ index + 1 }}</span>
       <span
         class="terminal__text"
         :class="{ 'terminal__text--pad': !lineNumbers }"
@@ -50,26 +50,16 @@ defineExpose({ scrollToBottom })
       />
     </div>
 
-    <div v-if="streaming" class="terminal__cursor">█</div>
+    <div v-if="streaming" class="terminal__cursor text-ink-green-6">█</div>
   </div>
 </template>
 
 <style scoped>
 .terminal {
-  --terminal-bg: #1e1e2e;
-  --terminal-fg: #cdd6f4;
-  --terminal-muted: #585b70;
-  --terminal-lineno: #45475a;
-  --terminal-cursor: #a6e3a1;
   overflow: auto;
   border-radius: 0.5rem;
   min-height: 120px;
   padding: 0.75rem 0;
-  background: var(--terminal-bg);
-  color: var(--terminal-fg);
-}
-.terminal ::selection {
-  background: rgb(255 255 255 / 0.25);
 }
 .terminal--fill {
   flex: 1;
@@ -77,14 +67,10 @@ defineExpose({ scrollToBottom })
 }
 .terminal__empty {
   padding: 0.25rem 1rem;
-  color: var(--terminal-muted);
 }
 .terminal__row {
   display: flex;
 }
-.terminal__row:hover {
-  background: rgb(255 255 255 / 0.04);
-}
 .terminal__lineno {
   flex-shrink: 0;
   min-width: 3.5rem;
@@ -92,7 +78,6 @@ defineExpose({ scrollToBottom })
   padding-right: 1rem;
   text-align: right;
   user-select: none;
-  color: var(--terminal-lineno);
 }
 .terminal__text {
   flex: 1;
@@ -105,7 +90,6 @@ defineExpose({ scrollToBottom })
 }
 .terminal__cursor {
   padding: 0.25rem 1rem;
-  color: var(--terminal-cursor);
   animation: terminal-blink 1s step-start infinite;
 }
 @keyframes terminal-blink {
diff --git a/admin/frontend/dashboard/src/components/navigation/SetupChecklist.vue b/admin/frontend/dashboard/src/components/navigation/SetupChecklist.vue
new file mode 100644
index 000000000..a20d1873b
--- /dev/null
+++ b/admin/frontend/dashboard/src/components/navigation/SetupChecklist.vue
@@ -0,0 +1,567 @@
+<script setup lang="ts">
+import { computed, onMounted, reactive, ref, watch } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import {
+  Button,
+  Checkbox,
+  Dialog,
+  ErrorMessage,
+  Select,
+  SidebarCard,
+  Spinner,
+  TextInput,
+  toast,
+} from 'frappe-ui'
+
+import AppIcon from '@/components/apps/AppIcon.vue'
+import CircularProgress from '@/components/common/CircularProgress.vue'
+import SetupIllustration from '@/components/navigation/SetupIllustration.vue'
+
+import { settingsApi } from '@/api/settings'
+import { useGithubConnection } from '@/composables/settings/useGithubConnection'
+import { useObjectStorage } from '@/composables/settings/useObjectStorage'
+import { useNewSite } from '@/composables/sites/useNewSite'
+import { useSites } from '@/composables/sites/useSites'
+import { errorMessage } from '@/utils/error'
+import { openTaskDetailPage } from '@/utils/taskRoute'
+
+const route = useRoute()
+const router = useRouter()
+const { sites, load: loadSites } = useSites()
+const storage = reactive(useObjectStorage())
+const github = reactive(useGithubConnection())
+const site = reactive(useNewSite())
+
+const onboarding = ref('')
+const siteStarted = ref(false)
+const useToken = ref(false)
+const origin = window.location.origin
+
+const githubViaCloud = computed(() => github.centralAvailable && !useToken.value)
+const githubRepositories = computed(() =>
+  github.centralAccounts.flatMap((account) => account.repositories),
+)
+
+const loaded = ref(false)
+
+const githubSteps = [
+  {
+    icon: 'lucide-key-round',
+    title: 'Authorize on GitHub',
+    description: 'A GitHub window asks which repos to share.',
+  },
+  {
+    icon: 'lucide-folder-git-2',
+    title: 'Pick your app repos',
+    description: 'Only the repos that hold your Frappe apps.',
+  },
+  {
+    icon: 'lucide-undo-2',
+    title: 'Land back here',
+    description: 'Straight on to storage and your first site.',
+  },
+]
+
+const steps = computed(() => [
+  {
+    id: 'github',
+    name: 'GitHub',
+    label: 'Connect GitHub',
+    title: github.viaCentral ? 'GitHub connected' : 'Connect your GitHub',
+    description: github.viaCentral
+      ? 'Pilot can read these repos through Frappe Cloud.'
+      : 'Pilot installs your Frappe apps straight from private repos. Takes about a minute.',
+    action: githubViaCloud.value ? 'Connect GitHub' : 'Connect',
+    savingLabel: githubViaCloud.value ? 'Opening Frappe Cloud' : 'Verifying token',
+    done: github.connected,
+    saving: github.connecting || github.redirecting,
+    canSave: githubViaCloud.value || Boolean(github.token.trim()),
+    save: githubViaCloud.value
+      ? () => github.connectViaCentral(`${origin}${route.path}?github=connected`)
+      : github.connect,
+  },
+  {
+    id: 'storage',
+    name: 'Storage',
+    label: 'Connect object storage',
+    title: 'Where should backups go?',
+    description: 'Pick an S3-compatible bucket for offsite backups.',
+    action: 'Continue',
+    savingLabel: 'Connecting storage',
+    done: storage.connected,
+    saving: storage.saving,
+    canSave: storage.canSave,
+    save: storage.save,
+  },
+  {
+    id: 'site',
+    name: 'First site',
+    label: 'Create your first site',
+    title: 'Launch your first site',
+    description: 'Pick a name and apps. Pilot handles the rest.',
+    action: 'Create site',
+    savingLabel: undefined,
+    done: siteStarted.value || sites.value.length > 0,
+    saving: site.creating,
+    canSave: !site.nameError,
+    save: createSite,
+  },
+])
+
+const doneCount = computed(() => steps.value.filter((step) => step.done).length)
+
+const isVisible = computed(
+  () => loaded.value && onboarding.value !== 'dismissed' && doneCount.value < steps.value.length,
+)
+
+const progress = computed(() => (doneCount.value / steps.value.length) * 100)
+
+const isOpen = ref(false)
+const current = ref(0)
+const currentStep = computed(() => steps.value[current.value])
+
+const nodeState = (index: number) => {
+  if (steps.value[index].done) return 'done'
+  if (index === current.value) return 'current'
+
+  return 'upcoming'
+}
+
+const nodeStyles = {
+  done: {
+    classes: 'bg-surface-green-2 border-outline-green-3 text-ink-green-6',
+    icon: 'lucide-check',
+  },
+  current: {
+    classes: 'border-outline-gray-7 text-ink-gray-8',
+    icon: '',
+  },
+  upcoming: {
+    classes: 'border-dashed border-outline-gray-4 text-ink-gray-5',
+    icon: '',
+  },
+}
+
+const dialogOpen = computed({
+  get: () => isOpen.value,
+  set: (open) => {
+    if (!open) minimize()
+  },
+})
+
+const firstPending = () => {
+  const index = steps.value.findIndex((step) => !step.done)
+
+  return Math.max(0, index)
+}
+
+const open = (index = firstPending()) => {
+  current.value = index
+  isOpen.value = true
+
+  loadSites()
+}
+
+const advance = () => {
+  const index = steps.value.findIndex((step, i) => i > current.value && !step.done)
+
+  if (index === -1) minimize()
+  else current.value = index
+}
+
+const submit = async () => {
+  const step = currentStep.value
+
+  if (step.done || (await step.save())) advance()
+}
+
+const createSite = async () => {
+  const taskId = await site.create()
+
+  if (!taskId) return false
+
+  siteStarted.value = true
+  loadSites()
+  openTaskDetailPage(router, taskId)
+
+  return true
+}
+
+const saveOnboarding = async (state: string) => {
+  onboarding.value = state
+
+  try {
+    await settingsApi.update({ bench: { onboarding: state } })
+  } catch (caught) {
+    toast.error(errorMessage(caught, 'Could not save onboarding progress.'))
+  }
+}
+
+const minimize = () => {
+  isOpen.value = false
+
+  if (onboarding.value !== 'minimized') saveOnboarding('minimized')
+}
+
+const refresh = async () => {
+  if (onboarding.value === 'dismissed') return
+
+  try {
+    const [settings] = await Promise.all([
+      settingsApi.get(),
+      storage.load(),
+      github.load(),
+      loadSites(),
+    ])
+
+    onboarding.value = settings.bench.onboarding
+    loaded.value = true
+
+    const returnedFromGithub = route.query.github === 'connected'
+
+    if (returnedFromGithub) {
+      router.replace({ query: { ...route.query, github: undefined } })
+
+      if (github.viaCentral) toast.success('GitHub connected through Frappe Cloud')
+    }
+
+    if ((returnedFromGithub || !onboarding.value) && isVisible.value && !isOpen.value) open()
+  } catch (caught) {
+    loaded.value = false
+    toast.error(errorMessage(caught, 'Could not load onboarding progress.'))
+  }
+}
+
+watch(
+  () => route.name,
+  (_name, previous) => {
+    if (previous === 'Settings') refresh()
+  },
+)
+
+watch(isOpen, (opened) => {
+  if (opened) site.reset()
+})
+
+onMounted(refresh)
+</script>
+
+<template>
+  <Dialog v-model:open="dialogOpen" bare size="4xl">
+    <div class="flex">
+      <aside
+        class="max-sm:hidden flex flex-col bg-[color-mix(in_oklab,var(--surface-base)_97%,var(--ink-gray-9))] p-8 border-r w-96 shrink-0"
+      >
+        <ol aria-hidden="true" class="flex items-center gap-2">
+          <li
+            v-for="(step, index) in steps"
+            :key="step.id"
+            class="flex items-center gap-2 before:w-4 before:border-t before:transition-colors before:duration-300 first:before:hidden"
+            :class="
+              steps[index - 1]?.done
+                ? 'before:border-outline-green-5'
+                : 'before:border-dashed before:border-outline-gray-4'
+            "
+          >
+            <span
+              class="place-items-center grid border rounded-3 size-6 text-xs tabular-nums leading-none transition-colors duration-300 shrink-0"
+              :class="nodeStyles[nodeState(index)].classes"
+            >
+              <span
+                v-if="nodeStyles[nodeState(index)].icon"
+                class="size-3.5"
+                :class="nodeStyles[nodeState(index)].icon"
+              />
+              <template v-else>{{ index + 1 }}</template>
+            </span>
+
+            <span
+              class="whitespace-nowrap"
+              :class="index === current ? 'text-ink-gray-8 text-sm-medium' : 'text-ink-gray-6 text-sm'"
+            >
+              {{ step.name }}
+            </span>
+          </li>
+        </ol>
+
+        <SetupIllustration
+          :key="currentStep.id"
+          class="my-auto pt-4 fade-in"
+          :step="currentStep.id"
+        />
+      </aside>
+
+      <div class="flex flex-col flex-1 min-w-0">
+        <section class="flex flex-col flex-1 px-7 sm:px-8 pt-8 pb-2">
+          <h2 class="text-ink-gray-8 text-2xl-semibold">{{ currentStep.title }}</h2>
+          <p class="mt-2 mb-6 text-ink-gray-6 text-p-base">{{ currentStep.description }}</p>
+
+          <template v-if="currentStep.id === 'storage'">
+            <div class="gap-3 grid sm:grid-cols-2">
+              <TextInput v-model="storage.bucket" label="Bucket" placeholder="pilot-backups" />
+              <Select
+                v-model="storage.region"
+                label="Region"
+                :options="storage.regionOptions"
+                :disabled="storage.loadingRegions"
+              />
+
+              <TextInput
+                v-model="storage.endpointUrl"
+                class="sm:col-span-2"
+                label="Endpoint URL"
+                placeholder="Optional for AWS, DigitalOcean, and Hetzner"
+              />
+
+              <TextInput
+                v-model="storage.accessKey"
+                label="Access key"
+                placeholder="AKIA…"
+                autocomplete="off"
+              />
+
+              <TextInput
+                v-model="storage.secretKey"
+                label="Secret key"
+                type="password"
+                autocomplete="new-password"
+                :placeholder="storage.secretKeySet ? 'Saved, leave blank to keep' : '••••••••'"
+              />
+            </div>
+
+            <ErrorMessage class="mt-4" :message="storage.error" />
+          </template>
+
+          <template v-else-if="currentStep.id === 'github' && github.viaCentral">
+            <ul class="-mt-4 max-h-64 overflow-y-auto">
+              <li
+                v-for="repository in githubRepositories"
+                :key="repository"
+                class="flex items-center gap-2.5 h-8 text-ink-gray-8 text-base before:size-4 before:text-ink-gray-5 before:lucide-package"
+              >
+                <span class="truncate">
+                  <span class="text-ink-gray-5">{{ repository.split('/')[0] }}/</span>
+                  {{ repository.split('/')[1] }}
+                </span>
+              </li>
+            </ul>
+
+            <Button
+              class="self-start mt-2"
+              icon-left="lucide-settings-2"
+              label="Manage repositories"
+              :loading="github.redirecting"
+              @click="github.connectViaCentral(`${origin}${route.path}?github=connected`)"
+            />
+          </template>
+
+          <template v-else-if="currentStep.id === 'github'">
+            <ol v-if="githubViaCloud">
+              <li
+                v-for="item in githubSteps"
+                :key="item.title"
+                class="relative gap-x-3.5 gap-y-1 grid grid-flow-col grid-rows-[auto_auto] justify-start pb-5 last:pb-0 after:absolute after:top-9 after:-bottom-px after:left-3.5 after:w-px after:bg-surface-gray-3 last:after:hidden"
+              >
+                <span
+                  class="place-items-center grid row-span-2 self-center bg-surface-gray-1 border border-outline-gray-2 rounded-full size-7 text-ink-gray-6"
+                >
+                  <span class="size-3.5" :class="item.icon" />
+                </span>
+
+                <span class="text-ink-gray-8 text-base-medium">{{ item.title }}</span>
+                <span class="text-ink-gray-5 text-sm">{{ item.description }}</span>
+              </li>
+            </ol>
+
+            <template v-else>
+              <TextInput v-model="github.username" label="GitHub username" placeholder="octocat" />
+
+              <TextInput
+                v-model="github.token"
+                class="mt-3.5"
+                label="Personal access token"
+                type="password"
+                placeholder="ghp_…"
+                @keydown.enter="submit"
+              >
+                <template #description>
+                  Needs the <code>repo</code> scope.
+                  <a :href="github.tokenHelpUrl" target="_blank" rel="noopener" class="underline">
+                    Generate one
+                  </a>
+                </template>
+              </TextInput>
+            </template>
+
+            <ErrorMessage class="mt-4" :message="github.error" />
+
+            <Button
+              v-if="github.centralAvailable && !github.connected"
+              class="self-start mt-6"
+              :label="useToken ? 'Use Frappe Cloud instead' : 'Use a token instead'"
+              @click="useToken = !useToken"
+            />
+          </template>
+
+          <template v-else>
+            <Spinner v-if="site.loading" class="mx-auto my-16 size-5 text-ink-gray-4" />
+
+            <template v-else>
+              <TextInput
+                v-if="!site.wildcardDomains.length"
+                v-model="site.name"
+                label="Site name"
+                placeholder="mysite.localhost"
+                @keydown.enter="submit"
+              />
+
+              <div v-else class="flex items-end gap-2">
+                <TextInput
+                  v-model="site.prefix"
+                  class="flex-1"
+                  label="Site name"
+                  placeholder="mysite"
+                  @keydown.enter="submit"
+                >
+                  <template v-if="site.hasSingleDomain" #suffix>
+                    <span class="text-ink-gray-5 text-sm">{{ site.wildcardDomains[0] }}</span>
+                  </template>
+                </TextInput>
+
+                <Select
+                  v-if="!site.hasSingleDomain"
+                  v-model="site.suffix"
+                  class="w-48 shrink-0"
+                  :options="site.wildcardDomains.map((domain) => ({ label: domain, value: domain }))"
+                />
+              </div>
+
+              <template v-if="site.availableApps.length">
+                <p class="flex justify-between mt-5 mb-1.5 text-ink-gray-6 text-sm">
+                  Apps
+                  <span class="text-ink-gray-5">{{ site.selectedApps.length }} selected</span>
+                </p>
+
+                <TextInput
+                  v-model="site.appSearch"
+                  class="mb-2"
+                  placeholder="Search apps"
+                  autocomplete="off"
+                >
+                  <template #prefix>
+                    <span class="size-4 text-ink-gray-5 lucide-search" />
+                  </template>
+                </TextInput>
+
+                <p
+                  v-if="!site.filteredApps.length"
+                  class="place-items-center grid h-56 text-ink-gray-5 text-p-sm"
+                >
+                  No apps match "{{ site.appSearch }}"
+                </p>
+
+                <div
+                  v-else
+                  class="app-list content-start gap-2 grid sm:grid-cols-2 pb-6 h-56 overflow-y-auto [scrollbar-width:none]"
+                >
+                  <button
+                    v-for="app in site.filteredApps"
+                    :key="app.name"
+                    type="button"
+                    :aria-pressed="site.selectedApps.includes(app.name)"
+                    class="flex items-center gap-3 p-2 border border-outline-gray-2 aria-pressed:border-outline-gray-5 rounded-4 text-left hover:bg-surface-gray-2"
+                    @click="site.toggleApp(app.name)"
+                  >
+                    <AppIcon :name="app.name" size="md" />
+
+                    <span class="flex-1 min-w-0 text-ink-gray-8 text-base truncate">
+                      {{ app.title || app.name }}
+                    </span>
+
+                    <Checkbox
+                      :model-value="site.selectedApps.includes(app.name)"
+                      class="pointer-events-none shrink-0"
+                    />
+                  </button>
+                </div>
+              </template>
+
+              <ErrorMessage class="mt-4" :message="site.error" />
+            </template>
+          </template>
+        </section>
+
+        <footer class="flex items-center gap-2 px-7 sm:px-8 pt-4.5 pb-8">
+          <Button
+            v-if="current > 0"
+            class="mr-auto"
+            variant="ghost"
+            icon-left="lucide-arrow-left"
+            label="Back"
+            @click="current--"
+          />
+          <Button v-else class="mr-auto" variant="ghost" label="Finish later" @click="minimize" />
+
+          <Button
+            v-if="!currentStep.done && current < steps.length - 1"
+            variant="ghost"
+            label="Skip"
+            @click="advance"
+          />
+
+          <Button
+            variant="solid"
+            :label="currentStep.done ? 'Next' : currentStep.action"
+            :loading="currentStep.saving"
+            :loading-text="currentStep.savingLabel"
+            :disabled="!currentStep.done && !currentStep.canSave"
+            @click="submit"
+          />
+        </footer>
+      </div>
+    </div>
+  </Dialog>
+
+  <SidebarCard
+    v-if="isVisible && onboarding === 'minimized'"
+    dismissible
+    class="group-data-[state=collapsed]:hidden dark:!bg-surface-gray-1 mx-2 mb-2 !border-0 shadow-sm"
+    @dismiss="saveOnboarding('dismissed')"
+  >
+    <template #title>
+      <button type="button" @click="open()">Get started</button>
+    </template>
+
+    <template #prefix>
+      <CircularProgress :value="progress" />
+    </template>
+
+    <template #description>{{ doneCount }} of {{ steps.length }} done</template>
+
+    <template #actions>
+      <template v-for="(step, index) in steps" :key="step.id">
+        <p
+          v-if="step.done"
+          class="flex items-center gap-2 py-1.5 text-ink-gray-5 text-sm before:size-4 before:text-ink-green-7 before:lucide-circle-check"
+        >
+          {{ step.label }}
+        </p>
+
+        <button
+          v-else
+          type="button"
+          class="flex items-center gap-2 -mx-1.5 px-1.5 py-1.5 rounded-4 hover:bg-surface-gray-2 text-ink-gray-8 text-sm before:size-4 before:text-ink-gray-4 before:lucide-circle-dashed after:ml-auto after:size-3.5 after:text-ink-gray-4 hover:after:text-ink-gray-6 after:lucide-chevron-right"
+          @click="open(index)"
+        >
+          {{ step.label }}
+        </button>
+      </template>
+    </template>
+  </SidebarCard>
+</template>
+
+<style scoped>
+.app-list {
+  mask-image: linear-gradient(to bottom, #000 calc(100% - 1.5rem), transparent);
+}
+</style>
diff --git a/admin/frontend/dashboard/src/components/navigation/SetupIllustration.vue b/admin/frontend/dashboard/src/components/navigation/SetupIllustration.vue
new file mode 100644
index 000000000..ae0a74bb3
--- /dev/null
+++ b/admin/frontend/dashboard/src/components/navigation/SetupIllustration.vue
@@ -0,0 +1,282 @@
+<script setup lang="ts">
+defineProps<{ step: string }>()
+</script>
+
+<template>
+  <svg viewBox="0 0 320 420" class="setup-art w-full h-auto">
+    <g v-if="step === 'github'">
+      <g class="spin" style="transform-origin: 160px 196px">
+        <circle cx="160" cy="196" r="108" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="160" cy="196" r="152" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="268" cy="196" r="2.5" class="fill-ink-gray-3" />
+        <circle cx="52" cy="196" r="2.5" class="fill-ink-gray-3" />
+      </g>
+
+      <path d="M192 172 L236 128" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+      <path d="M196 214 L240 252" fill="none" stroke-dasharray="3 5" class="stroke-ink-gray-3" />
+      <path d="M126 216 L84 262" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+      <path d="M128 174 L88 136" fill="none" stroke-dasharray="3 5" class="stroke-ink-gray-3" />
+
+      <g
+        v-for="repo in [
+          { x: 226, y: 96 },
+          { x: 230, y: 240 },
+          { x: 18, y: 258 },
+          { x: 20, y: 104 },
+        ]"
+        :key="`${repo.x}-${repo.y}`"
+        :transform="`translate(${repo.x} ${repo.y})`"
+      >
+        <rect width="76" height="40" rx="8" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+
+        <rect x="8" y="9" width="22" height="22" rx="5" class="fill-surface-gray-2" />
+        <g
+          fill="none"
+          stroke-width="2.2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          transform="translate(19 20) scale(0.6) translate(-12 -12)"
+          class="stroke-ink-gray-5"
+        >
+          <path d="M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z" />
+          <path d="M12 22V12" />
+          <path d="m3.3 7 7.703 4.734a2 2 0 0 0 1.994 0L20.7 7" />
+          <path d="m7.5 4.27 9 5.15" />
+        </g>
+
+        <rect x="34" y="13" width="32" height="4" rx="2" class="fill-ink-gray-4" />
+        <rect x="34" y="22" width="22" height="4" rx="2" class="fill-surface-gray-3" />
+      </g>
+
+      <circle cx="160" cy="196" r="64" fill-opacity="0.25" class="fill-surface-gray-2" />
+      <circle cx="160" cy="196" r="46" fill-opacity="0.55" class="fill-surface-gray-2" />
+      <circle cx="160" cy="196" r="28" class="fill-surface-gray-3" />
+
+      <path
+        transform="translate(160 196) scale(1.75) translate(-8 -8)"
+        d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+        class="fill-ink-gray-7"
+      />
+    </g>
+
+    <g v-else-if="step === 'storage'">
+      <g class="spin" style="transform-origin: 160px 210px">
+        <circle cx="160" cy="210" r="120" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="160" cy="210" r="160" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="280" cy="210" r="2.5" class="fill-ink-gray-3" />
+        <circle cx="40" cy="210" r="2.5" class="fill-ink-gray-3" />
+      </g>
+
+      <circle cx="160" cy="92" r="64" fill-opacity="0.25" class="fill-surface-gray-2" />
+      <circle cx="160" cy="92" r="46" fill-opacity="0.55" class="fill-surface-gray-2" />
+      <circle cx="160" cy="92" r="28" class="fill-surface-gray-3" />
+      <g
+        fill="none"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        transform="translate(160 92) scale(1.1) translate(-12 -12)"
+        class="stroke-ink-gray-7"
+      >
+        <path d="M12 13v8" />
+        <path d="m8 17 4-4 4 4" />
+        <path d="M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" />
+      </g>
+
+      <path d="M160 176 V122" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+
+      <rect x="92" y="200" width="136" height="56" rx="10" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+      <rect x="84" y="188" width="152" height="56" rx="10" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+
+      <g>
+        <rect x="76" y="176" width="168" height="56" rx="10" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <rect x="88" y="190" width="28" height="28" rx="6" class="fill-surface-gray-2" />
+        <g
+          fill="none"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          transform="translate(102 204) scale(0.65) translate(-12 -12)"
+          class="stroke-ink-gray-5"
+        >
+          <rect x="2" y="3" width="20" height="5" rx="1" />
+          <path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8" />
+          <path d="M10 12h4" />
+        </g>
+
+        <rect x="126" y="196" width="70" height="5" rx="2.5" class="fill-ink-gray-4" />
+        <rect x="126" y="208" width="46" height="4" rx="2" class="fill-surface-gray-3" />
+        <circle cx="228" cy="204" r="4" class="fill-ink-gray-6" />
+      </g>
+
+      <path d="M62 290 C62 270 80 258 96 256" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+      <path d="M258 290 C258 270 240 258 224 256" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+
+      <g>
+        <rect x="40" y="290" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <g
+          fill="none"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          transform="translate(62 312) scale(0.75) translate(-12 -12)"
+          class="stroke-ink-gray-5"
+        >
+          <ellipse cx="12" cy="5" rx="9" ry="3" />
+          <path d="M3 5V19A9 3 0 0 0 21 19V5" />
+          <path d="M3 12A9 3 0 0 0 21 12" />
+        </g>
+      </g>
+
+      <g>
+        <rect x="236" y="290" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <g
+          fill="none"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          transform="translate(258 312) scale(0.75) translate(-12 -12)"
+          class="stroke-ink-gray-5"
+        >
+          <path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" />
+          <path d="M14 2v4a2 2 0 0 0 2 2h4" />
+        </g>
+      </g>
+    </g>
+
+    <g v-else>
+      <g class="spin" style="transform-origin: 160px 205px">
+        <circle cx="160" cy="205" r="120" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="160" cy="205" r="160" fill="none" stroke-dasharray="2 6" class="stroke-ink-gray-3" />
+        <circle cx="160" cy="85" r="2.5" class="fill-ink-gray-3" />
+        <circle cx="160" cy="325" r="2.5" class="fill-ink-gray-3" />
+      </g>
+
+      <path d="M78 98 C90 112 92 124 92 132" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+      <path d="M242 98 C230 112 228 124 228 132" fill="none" stroke-dasharray="3 5" class="stroke-ink-gray-3" />
+      <path d="M74 314 C88 300 92 292 92 282" fill="none" stroke-dasharray="3 5" class="stroke-ink-gray-3" />
+      <path d="M246 314 C232 300 228 292 228 282" fill="none" stroke-width="1.2" class="flow stroke-ink-gray-5" />
+
+      <g>
+        <rect x="44" y="58" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <path
+          d="M58 72 h16 v16 h-16 z M58 80 h16 M66 72 v16"
+          fill="none"
+          stroke-width="1.4"
+          stroke-linejoin="round"
+          class="stroke-ink-gray-5"
+        />
+      </g>
+
+      <g>
+        <rect x="232" y="58" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <circle cx="254" cy="76" r="5" fill="none" stroke-width="1.4" class="stroke-ink-gray-5" />
+        <path
+          d="M245 90 C247 84 261 84 263 90"
+          fill="none"
+          stroke-width="1.4"
+          stroke-linecap="round"
+          class="stroke-ink-gray-5"
+        />
+      </g>
+
+      <g>
+        <rect x="40" y="306" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <path
+          d="M53 320 h18 v12 h-10 l-5 4 v-4 h-3 z"
+          fill="none"
+          stroke-width="1.4"
+          stroke-linejoin="round"
+          class="stroke-ink-gray-5"
+        />
+      </g>
+
+      <g>
+        <rect x="236" y="306" width="44" height="44" rx="11" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+        <path
+          d="M249 333 l6 -8 5 5 7 -10"
+          fill="none"
+          stroke-width="1.4"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          class="stroke-ink-gray-5"
+        />
+      </g>
+
+      <rect x="52" y="132" width="216" height="150" rx="12" class="fill-surface-elevation-1 stroke-ink-gray-3" />
+      <path d="M52 158 H268" class="stroke-ink-gray-3" />
+
+      <g class="fill-ink-gray-3">
+        <circle cx="66" cy="145" r="3.5" />
+        <circle cx="78" cy="145" r="3.5" />
+        <circle cx="90" cy="145" r="3.5" />
+      </g>
+
+      <rect x="104" y="138" width="124" height="14" rx="7" class="fill-surface-gray-2" />
+      <circle cx="114" cy="145" r="2.5" class="fill-ink-gray-6" />
+      <rect x="122" y="143" width="62" height="4" rx="2" class="fill-ink-gray-4" />
+      <rect x="68" y="172" width="96" height="8" rx="4" class="fill-ink-gray-4" />
+      <rect x="68" y="186" width="140" height="5" rx="2.5" class="fill-surface-gray-3" />
+
+      <rect x="68" y="208" width="58" height="56" rx="7" class="fill-surface-gray-1 stroke-ink-gray-3" />
+      <rect x="134" y="208" width="58" height="56" rx="7" class="fill-surface-gray-1 stroke-ink-gray-3" />
+      <rect
+        x="200"
+        y="208"
+        width="52"
+        height="56"
+        rx="7"
+        fill="none"
+        stroke-dasharray="3 4"
+        class="stroke-ink-gray-3"
+      />
+
+      <rect x="76" y="218" width="26" height="5" rx="2.5" class="fill-ink-gray-4" />
+      <rect x="76" y="228" width="40" height="4" rx="2" class="fill-surface-gray-3" />
+      <rect x="142" y="218" width="34" height="5" rx="2.5" class="fill-ink-gray-4" />
+      <rect x="142" y="228" width="30" height="4" rx="2" class="fill-surface-gray-3" />
+      <path d="M226 230 v12 M220 236 h12" stroke-width="1.4" stroke-linecap="round" class="stroke-ink-gray-5" />
+      <circle cx="262" cy="134" r="4" class="fill-ink-gray-6" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+:global(:root:not([data-theme='dark']) .setup-art) {
+  --ink-gray-2: oklch(0.87 0 0);
+  --ink-gray-3: oklch(0.76 0 0);
+  --ink-gray-4: oklch(0.63 0 0);
+  --ink-gray-5: oklch(0.52 0 0);
+  --ink-gray-6: oklch(0.4 0 0);
+  --ink-gray-7: oklch(0.31 0 0);
+  --surface-gray-2: oklch(0.94 0 0);
+  --surface-gray-3: oklch(0.91 0 0);
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .flow {
+    animation: dash 2.2s linear infinite;
+  }
+
+  .spin {
+    transform-box: view-box;
+    animation: spin 80s linear infinite;
+  }
+}
+
+.flow {
+  stroke-dasharray: 3 5;
+}
+
+@keyframes dash {
+  to {
+    stroke-dashoffset: -16;
+  }
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+</style>
diff --git a/admin/frontend/dashboard/src/components/navigation/Sidebar.vue b/admin/frontend/dashboard/src/components/navigation/Sidebar.vue
index da3e07d95..ac2f94f08 100644
--- a/admin/frontend/dashboard/src/components/navigation/Sidebar.vue
+++ b/admin/frontend/dashboard/src/components/navigation/Sidebar.vue
@@ -5,6 +5,7 @@ import { Sidebar, SidebarCollapseToggle, SidebarHeader, SidebarItem, SidebarLabe
 
 import PilotLogo from '@/components/icons/Pilot.vue'
 import NotificationsPanel from '@/components/notifications/NotificationsPanel.vue'
+import SetupChecklist from '@/components/navigation/SetupChecklist.vue'
 
 import { sidebarSections } from '@/components/navigation/list'
 import { useAppMenu } from '@/components/navigation/useAppMenu'
@@ -36,7 +37,7 @@ const isActive = (to: string) => route.path === to || route.path.startsWith(`${t
 <template>
   <Sidebar
     :collapsible="!isMobile"
-    class="border-r dark:border-outline-gray-2"
+    class="group border-r"
     :class="isMobile ? '!w-full !border-r-0 mobile-sidebar bg-transparent' : ''"
   >
     <SidebarHeader
@@ -80,6 +81,8 @@ const isActive = (to: string) => route.path === to || route.path.startsWith(`${t
       </template>
     </nav>
 
+    <SetupChecklist />
+
     <SidebarCollapseToggle v-if="!isMobile" class="mt-auto mx-2 mb-2" />
   </Sidebar>
 </template>
diff --git a/admin/frontend/dashboard/src/components/settings/S3Bucket.vue b/admin/frontend/dashboard/src/components/settings/S3Bucket.vue
index 8a23e6770..ae09cc901 100644
--- a/admin/frontend/dashboard/src/components/settings/S3Bucket.vue
+++ b/admin/frontend/dashboard/src/components/settings/S3Bucket.vue
@@ -1,138 +1,31 @@
 <script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue'
-import { Alert, Button, ErrorMessage, Select, Spinner, TextInput, toast } from 'frappe-ui'
-
-import { settingsApi } from '@/api/settings'
-import type { S3ProviderOption } from '@/types/settings'
-import { errorMessage } from '@/utils/error'
-
-const loading = ref(true)
-const saving = ref(false)
-const disconnecting = ref(false)
-const error = ref('')
-const accessKey = ref('')
-const secretKey = ref('')
-const bucket = ref('')
-const provider = ref('')
-const region = ref('')
-const endpointUrl = ref('')
-const secretKeySet = ref(false)
-const providers = ref<S3ProviderOption[]>([])
-const loadingRegions = ref(false)
-
-const connected = computed(() => Boolean(accessKey.value && bucket.value && secretKeySet.value))
-const providerLabel = computed(
-  () => providers.value.find((p) => p.value === provider.value)?.label || provider.value,
-)
-const providerOptions = computed(() =>
-  providers.value.map((p) => ({ label: p.label, value: p.value })),
-)
-const regionOptions = computed(
-  () =>
-    providers.value
-      .find((p) => p.value === provider.value)
-      ?.regions.map((r) => ({ label: r, value: r })) || [],
-)
-
-// Frappe regions come from Central, so they load only when that provider is picked.
-const loadFrappeRegions = async () => {
-  const frappe = providers.value.find((p) => p.value === 'frappe')
-  if (!frappe) return
-
-  loadingRegions.value = true
-  try {
-    frappe.regions = await settingsApi.frappeStorageRegions()
-  } catch (e) {
-    error.value = errorMessage(e, 'Could not read Frappe storage regions from Central.')
-  } finally {
-    loadingRegions.value = false
-  }
-}
-
-// Also on `providers`: a reload after save replaces the list and empties Frappe's regions.
-watch([provider, providers], async ([current], [previous]) => {
-  if (previous && current !== previous) {
-    endpointUrl.value = ''
-  }
-  if (current === 'frappe') {
-    await loadFrappeRegions()
-  }
-  if (!regionOptions.value.some((o) => o.value === region.value)) {
-    region.value = regionOptions.value[0]?.value || ''
-  }
-})
-
-// Every required field, so Connect stays dead until the form could succeed.
-const canSave = computed(
-  () =>
-    Boolean(accessKey.value.trim()) &&
-    Boolean(bucket.value.trim()) &&
-    Boolean(provider.value) &&
-    Boolean(region.value) &&
-    (secretKeySet.value || Boolean(secretKey.value.trim())),
-)
-
-const load = async () => {
-  loading.value = true
-  try {
-    const data = await settingsApi.get()
-    providers.value = data.s3_providers || []
-    const s3 = data.s3 || {}
-    accessKey.value = s3.access_key || ''
-    bucket.value = s3.bucket || ''
-    provider.value = s3.provider || providers.value[0]?.value || ''
-    region.value = s3.region || ''
-    endpointUrl.value = s3.endpoint_url || ''
-    secretKeySet.value = !!s3.secret_key_set
-  } catch (e) {
-    error.value = errorMessage(e, 'Could not load settings.')
-  } finally {
-    loading.value = false
-  }
-}
-
-const save = async () => {
-  saving.value = true
-  error.value = ''
-  try {
-    await settingsApi.update({
-      s3: {
-        access_key: accessKey.value.trim(),
-        secret_key: secretKey.value.trim(),
-        bucket: bucket.value.trim(),
-        provider: provider.value,
-        region: region.value,
-        endpoint_url: endpointUrl.value.trim(),
-      },
-    })
-    secretKey.value = ''
-    toast.success('Object storage settings saved')
-    await load()
-  } catch (e) {
-    error.value = errorMessage(e, 'Could not save object storage settings.')
-  } finally {
-    saving.value = false
-  }
-}
-
-const disconnect = async () => {
-  disconnecting.value = true
-  try {
-    await settingsApi.update({ s3: { disconnect: true } })
-    accessKey.value = ''
-    secretKey.value = ''
-    bucket.value = ''
-    provider.value = providers.value[0]?.value || ''
-    region.value = ''
-    endpointUrl.value = ''
-    secretKeySet.value = false
-    toast.success('Object storage disconnected')
-  } catch (e) {
-    toast.error(errorMessage(e, 'Could not disconnect object storage.'))
-  } finally {
-    disconnecting.value = false
-  }
-}
+import { onMounted } from 'vue'
+import { Alert, Button, ErrorMessage, Select, Spinner, TextInput } from 'frappe-ui'
+
+import { useObjectStorage } from '@/composables/settings/useObjectStorage'
+
+const {
+  loading,
+  saving,
+  disconnecting,
+  error,
+  accessKey,
+  secretKey,
+  bucket,
+  provider,
+  region,
+  endpointUrl,
+  secretKeySet,
+  loadingRegions,
+  connected,
+  providerLabel,
+  providerOptions,
+  regionOptions,
+  canSave,
+  load,
+  save,
+  disconnect,
+} = useObjectStorage()
 
 onMounted(load)
 </script>
@@ -166,22 +59,12 @@ onMounted(load)
         <p class="text-ink-gray-5 text-p-sm">{{ providerLabel }} · Access key {{ accessKey }}</p>
       </div>
 
-      <Button
-        class="flex-1 sm:flex-none"
-        theme="red"
-        :loading="disconnecting"
-        @click="disconnect"
+      <Button class="flex-1 sm:flex-none" theme="red" :loading="disconnecting" @click="disconnect"
         >Disconnect</Button
       >
     </div>
 
     <div class="space-y-4">
-      <TextInput label="Bucket" v-model="bucket" placeholder="storage-bucket" />
-      <TextInput
-        label="Endpoint URL"
-        v-model="endpointUrl"
-        placeholder="Optional for AWS, DigitalOcean, and Hetzner"
-      />
       <div class="flex sm:flex-row flex-col gap-4">
         <Select label="Provider" v-model="provider" :options="providerOptions" class="w-full" />
         <Select
@@ -194,13 +77,15 @@ onMounted(load)
         />
       </div>
 
+      <TextInput label="Bucket" v-model="bucket" placeholder="storage-bucket" />
+      <TextInput
+        label="Endpoint URL"
+        v-model="endpointUrl"
+        placeholder="Optional for AWS, DigitalOcean, and Hetzner"
+      />
+
       <div class="flex sm:flex-row flex-col gap-4">
-        <TextInput
-          label="Access Key"
-          v-model="accessKey"
-          placeholder="AKIA…"
-          class="w-full"
-        />
+        <TextInput label="Access Key" v-model="accessKey" placeholder="AKIA…" class="w-full" />
         <TextInput
           label="Secret Key"
           type="password"
diff --git a/admin/frontend/dashboard/src/components/sites/Backups.vue b/admin/frontend/dashboard/src/components/sites/Backups.vue
index 619979416..f08fdb4ed 100644
--- a/admin/frontend/dashboard/src/components/sites/Backups.vue
+++ b/admin/frontend/dashboard/src/components/sites/Backups.vue
@@ -1,5 +1,14 @@
 <script setup lang="ts">
-import { Badge, Button, Dialog, Dropdown, type DropdownItem, ErrorMessage, Select } from 'frappe-ui'
+import {
+  Alert,
+  Badge,
+  Button,
+  Dialog,
+  Dropdown,
+  type DropdownItem,
+  ErrorMessage,
+  Select,
+} from 'frappe-ui'
 import { computed, onMounted, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { apiErrorMessage } from '@/api/client'
@@ -10,6 +19,7 @@ import ListSkeleton from '@/components/common/ListSkeleton.vue'
 import Table from '@/components/common/Table.vue'
 import BackupConfigDialog from '@/components/sites/BackupConfigDialog.vue'
 import RestoreBackupDialog from '@/components/sites/RestoreBackupDialog.vue'
+import { useObjectStorage } from '@/composables/settings/useObjectStorage'
 import { useSite } from '@/composables/sites/useSite'
 import type { Backup, BackupFile, BackupSchedule } from '@/types/siteBackups'
 import { cronToLabel } from '@/utils/backup'
@@ -34,6 +44,19 @@ const {
   setBackupsPageLength,
 } = useSite(props.siteName)
 
+const {
+  loading: storageLoading,
+  connected: storageConnected,
+  load: loadStorage,
+} = useObjectStorage()
+
+const storageAction = {
+  label: 'Connect storage',
+  onClick: () => {
+    router.push({ name: 'Settings', params: { section: 'general', subSection: 's3-bucket' } })
+  },
+}
+
 const pageLengths = [20, 50, 100].map((n) => ({ label: `${n} per page`, value: n }))
 
 const backingUp = ref(false)
@@ -197,10 +220,21 @@ const confirmDelete = async () => {
 onMounted(() => {
   loadBackups()
   loadConfig()
+  loadStorage()
 })
 </script>
 
 <template>
+  <Alert
+    v-if="!storageLoading && !storageConnected"
+    class="mb-4 border border-outline-gray-2"
+    theme="blue"
+    title="Backups stay on this server"
+    description="Connect object storage to keep a copy offsite."
+    :dismissible="false"
+    :primary-action="storageAction"
+  />
+
   <div class="flex sm:flex-row flex-col sm:justify-between sm:items-center gap-3 mb-4">
     <div>
       <p class="font-medium text-ink-gray-8">Automated backups</p>
diff --git a/admin/frontend/dashboard/src/components/sites/NewSiteDialog.vue b/admin/frontend/dashboard/src/components/sites/NewSiteDialog.vue
index 582a21d00..fd5c22cc0 100644
--- a/admin/frontend/dashboard/src/components/sites/NewSiteDialog.vue
+++ b/admin/frontend/dashboard/src/components/sites/NewSiteDialog.vue
@@ -1,16 +1,10 @@
 <script setup lang="ts">
-import { computed, nextTick, ref, watch } from 'vue'
+import { nextTick, ref, watch } from 'vue'
 import { Button, Checkbox, Dialog, ErrorMessage, Select, Spinner, TextInput } from 'frappe-ui'
 
 import AppIcon from '@/components/apps/AppIcon.vue'
 
-import { apiErrorMessage } from '@/api/client'
-import { appsApi } from '@/api/apps'
-import { sitesApi } from '@/api/sites'
-import { useAppRegistry } from '@/composables/apps/useAppRegistry'
-import { buildSiteAppChoices } from '@/utils/siteApps'
-import type { AppInfo } from '@/types/apps'
-import { errorMessage } from '@/utils/error'
+import { useNewSite } from '@/composables/sites/useNewSite'
 import type { SiteResource } from '@/types/sites'
 
 interface Props {
@@ -28,20 +22,23 @@ interface Emits {
 const emit = defineEmits<Emits>()
 const open = defineModel<boolean>()
 
-const { registry, load: loadRegistry } = useAppRegistry()
-const benchApps = ref<AppInfo[]>([])
-
-const newSiteName = ref('')
-const sitePrefix = ref('')
-const wildcardDomains = ref<string[]>([])
-const selectedSuffix = ref('')
-const loading = ref(false)
-const creating = ref(false)
-const error = ref('')
-
-const selectedApps = ref<string[]>([])
-
-const hasSingleDomain = computed(() => wildcardDomains.value.length === 1)
+const {
+  name: newSiteName,
+  prefix: sitePrefix,
+  wildcardDomains,
+  suffix: selectedSuffix,
+  selectedApps,
+  appSearch,
+  loading,
+  creating,
+  error,
+  hasSingleDomain,
+  availableApps,
+  filteredApps,
+  reset,
+  toggleApp,
+  create,
+} = useNewSite()
 
 // Fade only the edges that can still scroll, so a clipped row reads as "more
 // below" and the last app is never dimmed at rest.
@@ -56,92 +53,20 @@ const updateFadeEdges = () => {
   fadeEdges.value = top && bottom ? 'both' : top ? 'top' : bottom ? 'bottom' : ''
 }
 
-const availableApps = computed(() => buildSiteAppChoices(registry.value, benchApps.value))
-
 // Also `loading`: apps resolve while the spinner is still up, so the rows only
 // exist once it flips.
-watch([availableApps, loading], () => nextTick(updateFadeEdges))
-
-watch([sitePrefix, selectedSuffix], () => {
-  if (wildcardDomains.value.length && sitePrefix.value) {
-    newSiteName.value = `${sitePrefix.value.trim()}${selectedSuffix.value}`
-  } else {
-    newSiteName.value = ''
-  }
-})
+watch([filteredApps, loading], () => nextTick(updateFadeEdges))
 
 watch(open, (visible) => {
-  if (!visible) return
-  reset()
+  if (visible) reset()
 })
 
-const reset = async () => {
-  newSiteName.value = ''
-  sitePrefix.value = ''
-  error.value = ''
-  selectedApps.value = []
-  loading.value = true
-  await Promise.all([loadWildcardDomains(), loadRegistry(), loadBenchApps()])
-  loading.value = false
-}
-
-const loadBenchApps = async () => {
-  try {
-    benchApps.value = await appsApi.installed()
-  } catch {
-    benchApps.value = []
-  }
-}
-
-const toggleApp = (name: string) => {
-  const index = selectedApps.value.indexOf(name)
-  if (index === -1) selectedApps.value.push(name)
-  else selectedApps.value.splice(index, 1)
-}
-
-const loadWildcardDomains = async () => {
-  try {
-    const { domains } = await sitesApi.domains.wildcardList()
-    wildcardDomains.value = domains || []
-    selectedSuffix.value = wildcardDomains.value[0] || ''
-  } catch {
-    wildcardDomains.value = []
-  }
-}
-
-const validate = (name: string) => {
-  if (!name) return 'Site name is required.'
-  if (!/^[a-zA-Z0-9][a-zA-Z0-9\-.]*[a-zA-Z0-9]$|^[a-zA-Z0-9]$/.test(name))
-    return 'Site name must be a valid hostname.'
-  return null
-}
-
 const submit = async () => {
-  const name = newSiteName.value.trim()
-  const validationError = validate(name)
-  if (validationError) {
-    error.value = validationError
-    return
-  }
+  const taskId = await create()
+  if (!taskId) return
 
-  creating.value = true
-  error.value = ''
-  try {
-    const result = await sitesApi.create({
-      name,
-      apps: selectedApps.value,
-    })
-    if (result.task_id) {
-      open.value = false
-      emit('started', result.task_id)
-    } else {
-      error.value = apiErrorMessage(result, 'Could not create site.')
-    }
-  } catch (caught) {
-    error.value = errorMessage(caught, 'Could not create site.')
-  } finally {
-    creating.value = false
-  }
+  open.value = false
+  emit('started', taskId)
 }
 </script>
 
@@ -189,9 +114,9 @@ const submit = async () => {
 
         <p class="mt-1.5 text-ink-gray-5 text-p-sm">
           Web address:
-          <span class="font-medium text-ink-gray-7"
-            >{{ newSiteName || `mysite${selectedSuffix}` }}</span
-          >
+          <span class="font-medium text-ink-gray-7">
+            {{ newSiteName || `mysite${selectedSuffix}` }}
+          </span>
         </p>
       </div>
 
@@ -202,6 +127,16 @@ const submit = async () => {
           <span class="text-ink-gray-5 text-xs"> {{ selectedApps.length }} selected </span>
         </div>
 
+        <TextInput v-model="appSearch" class="mb-2" placeholder="Search apps" autocomplete="off">
+          <template #prefix>
+            <span class="size-4 text-ink-gray-5 lucide-search" />
+          </template>
+        </TextInput>
+
+        <p v-if="!filteredApps.length" class="py-6 text-ink-gray-5 text-p-sm text-center">
+          No apps match "{{ appSearch }}"
+        </p>
+
         <div
           ref="appList"
           :data-fade="fadeEdges"
@@ -209,7 +144,7 @@ const submit = async () => {
           @scroll.passive="updateFadeEdges"
         >
           <button
-            v-for="app in availableApps"
+            v-for="app in filteredApps"
             :key="app.name"
             type="button"
             class="flex items-center gap-3 px-2 py-2 border rounded-4 min-w-0 text-left transition-colors hover:bg-surface-alpha-gray-1"
diff --git a/admin/frontend/dashboard/src/composables/settings/useGithubConnection.ts b/admin/frontend/dashboard/src/composables/settings/useGithubConnection.ts
new file mode 100644
index 000000000..57827d738
--- /dev/null
+++ b/admin/frontend/dashboard/src/composables/settings/useGithubConnection.ts
@@ -0,0 +1,142 @@
+import { computed, ref } from 'vue'
+import { toast } from 'frappe-ui'
+
+import { apiErrorMessage, hasApiError } from '@/api/client'
+import { gitApi } from '@/api/git'
+import type { GitConnection } from '@/types/git'
+import { errorMessage } from '@/utils/error'
+
+export const useGithubConnection = () => {
+  const loading = ref(true)
+  const connecting = ref(false)
+  const verifying = ref(false)
+  const redirecting = ref(false)
+  const error = ref('')
+  const status = ref<GitConnection | null>(null)
+  const username = ref('')
+  const token = ref('')
+
+  const viaCentral = computed(() => status.value?.auth_type === 'github_app')
+  const centralAvailable = computed(() => Boolean(status.value?.central?.available))
+  const centralAccounts = computed(() => status.value?.central?.connections ?? [])
+  const connected = computed(() =>
+    Boolean(status.value?.connected && (viaCentral.value || status.value?.is_token_valid)),
+  )
+  const tokenHelpUrl = computed(
+    () =>
+      status.value?.providers?.github ||
+      'https://github.com/settings/tokens/new?scopes=repo&description=Bench+CLI',
+  )
+
+  const load = async () => {
+    loading.value = true
+
+    try {
+      status.value = await gitApi.status()
+
+      if (status.value?.username && !viaCentral.value) username.value = status.value.username
+    } finally {
+      loading.value = false
+    }
+  }
+
+  const connect = async () => {
+    if (!token.value.trim()) {
+      error.value = 'Paste a personal access token to connect.'
+
+      return false
+    }
+
+    connecting.value = true
+    error.value = ''
+
+    try {
+      const result = await gitApi.connect('github', token.value.trim(), username.value.trim())
+
+      if (hasApiError(result)) {
+        error.value = apiErrorMessage(result, 'Could not verify token.')
+
+        return false
+      }
+
+      token.value = ''
+      status.value = { ...result, central: status.value?.central }
+      toast.success(`Connected as ${result.username}`)
+
+      return true
+    } catch (e) {
+      error.value = errorMessage(e, 'Could not verify token.')
+
+      return false
+    } finally {
+      connecting.value = false
+    }
+  }
+
+  const connectViaCentral = async (returnUrl: string) => {
+    redirecting.value = true
+    error.value = ''
+
+    try {
+      const result = await gitApi.connectViaCentral(returnUrl)
+
+      if (hasApiError(result))
+        throw new Error(apiErrorMessage(result, 'Could not reach Frappe Cloud.'))
+
+      window.location.assign(result.url)
+    } catch (e) {
+      error.value = errorMessage(e, 'Could not reach Frappe Cloud.')
+      redirecting.value = false
+    }
+  }
+
+  const verifyConnection = async () => {
+    verifying.value = true
+
+    try {
+      const result = await gitApi.repos()
+
+      if (Array.isArray(result)) toast.success('GitHub connection is working')
+      else toast.error(apiErrorMessage(result, 'GitHub connection failed'))
+    } catch (e) {
+      toast.error(errorMessage(e, 'GitHub connection failed'))
+    } finally {
+      await load()
+      verifying.value = false
+    }
+  }
+
+  const disconnect = async () => {
+    const response = await gitApi.disconnect()
+
+    if (!response.ok) {
+      toast.error(apiErrorMessage(await response.json(), 'Could not disconnect GitHub.'))
+
+      return
+    }
+
+    username.value = ''
+    await load()
+  }
+
+  return {
+    loading,
+    connecting,
+    verifying,
+    redirecting,
+    error,
+    status,
+    username,
+    token,
+    connected,
+    viaCentral,
+    centralAvailable,
+    centralAccounts,
+    tokenHelpUrl,
+    load,
+    connect,
+    connectViaCentral,
+    verifyConnection,
+    disconnect,
+  }
+}
diff --git a/admin/frontend/dashboard/src/composables/settings/useObjectStorage.ts b/admin/frontend/dashboard/src/composables/settings/useObjectStorage.ts
new file mode 100644
index 000000000..7b91c6b52
--- /dev/null
+++ b/admin/frontend/dashboard/src/composables/settings/useObjectStorage.ts
@@ -0,0 +1,184 @@
+import { computed, ref, watch } from 'vue'
+import { toast } from 'frappe-ui'
+
+import { apiErrorMessage, hasApiError } from '@/api/client'
+import { settingsApi } from '@/api/settings'
+import type { S3ProviderOption } from '@/types/settings'
+import { errorMessage } from '@/utils/error'
+
+export const useObjectStorage = () => {
+  const loading = ref(true)
+  const saving = ref(false)
+  const disconnecting = ref(false)
+  const error = ref('')
+  const accessKey = ref('')
+  const secretKey = ref('')
+  const bucket = ref('')
+  const provider = ref('')
+  const region = ref('')
+  const endpointUrl = ref('')
+  const secretKeySet = ref(false)
+  const providers = ref<S3ProviderOption[]>([])
+  const loadingRegions = ref(false)
+
+  const connected = computed(() => Boolean(accessKey.value && bucket.value && secretKeySet.value))
+  const providerLabel = computed(
+    () => providers.value.find((p) => p.value === provider.value)?.label || provider.value,
+  )
+  const providerOptions = computed(() =>
+    providers.value.map((p) => ({ label: p.label, value: p.value })),
+  )
+  const regionOptions = computed(
+    () =>
+      providers.value
+        .find((p) => p.value === provider.value)
+        ?.regions.map((r) => ({ label: r, value: r })) || [],
+  )
+
+  const loadFrappeRegions = async () => {
+    const frappe = providers.value.find((p) => p.value === 'frappe')
+
+    if (!frappe) return
+
+    loadingRegions.value = true
+
+    try {
+      const regions = await settingsApi.frappeStorageRegions()
+
+      if (hasApiError(regions)) {
+        error.value = apiErrorMessage(
+          regions,
+          'Could not read Frappe storage regions from Central.',
+        )
+
+        return
+      }
+
+      frappe.regions = regions
+    } catch (e) {
+      error.value = errorMessage(e, 'Could not read Frappe storage regions from Central.')
+    } finally {
+      loadingRegions.value = false
+    }
+  }
+
+  watch([provider, providers], async ([current], [previous]) => {
+    if (previous && current !== previous) {
+      endpointUrl.value = ''
+    }
+
+    if (current === 'frappe') {
+      await loadFrappeRegions()
+    }
+
+    if (!regionOptions.value.some((o) => o.value === region.value)) {
+      region.value = regionOptions.value[0]?.value || ''
+    }
+  })
+
+  const canSave = computed(
+    () =>
+      Boolean(accessKey.value.trim()) &&
+      Boolean(bucket.value.trim()) &&
+      Boolean(provider.value) &&
+      Boolean(region.value) &&
+      (secretKeySet.value || Boolean(secretKey.value.trim())),
+  )
+
+  const load = async () => {
+    loading.value = true
+
+    try {
+      const data = await settingsApi.get()
+      const s3 = data.s3 || {}
+
+      providers.value = data.s3_providers || []
+      accessKey.value = s3.access_key || ''
+      bucket.value = s3.bucket || ''
+      provider.value = s3.provider || providers.value[0]?.value || ''
+      region.value = s3.region || ''
+      endpointUrl.value = s3.endpoint_url || ''
+      secretKeySet.value = !!s3.secret_key_set
+    } catch (e) {
+      error.value = errorMessage(e, 'Could not load settings.')
+    } finally {
+      loading.value = false
+    }
+  }
+
+  const save = async () => {
+    saving.value = true
+    error.value = ''
+
+    try {
+      await settingsApi.update({
+        s3: {
+          access_key: accessKey.value.trim(),
+          secret_key: secretKey.value.trim(),
+          bucket: bucket.value.trim(),
+          provider: provider.value,
+          region: region.value,
+          endpoint_url: endpointUrl.value.trim(),
+        },
+      })
+
+      secretKey.value = ''
+      toast.success('Object storage settings saved')
+      await load()
+
+      return true
+    } catch (e) {
+      error.value = errorMessage(e, 'Could not save object storage settings.')
+
+      return false
+    } finally {
+      saving.value = false
+    }
+  }
+
+  const disconnect = async () => {
+    disconnecting.value = true
+
+    try {
+      await settingsApi.update({ s3: { disconnect: true } })
+
+      accessKey.value = ''
+      secretKey.value = ''
+      bucket.value = ''
+      provider.value = providers.value[0]?.value || ''
+      region.value = ''
+      endpointUrl.value = ''
+      secretKeySet.value = false
+
+      toast.success('Object storage disconnected')
+    } catch (e) {
+      toast.error(errorMessage(e, 'Could not disconnect object storage.'))
+    } finally {
+      disconnecting.value = false
+    }
+  }
+
+  return {
+    loading,
+    saving,
+    disconnecting,
+    error,
+    accessKey,
+    secretKey,
+    bucket,
+    provider,
+    region,
+    endpointUrl,
+    secretKeySet,
+    providers,
+    loadingRegions,
+    connected,
+    providerLabel,
+    providerOptions,
+    regionOptions,
+    canSave,
+    load,
+    save,
+    disconnect,
+  }
+}
diff --git a/admin/frontend/dashboard/src/composables/sites/useNewSite.ts b/admin/frontend/dashboard/src/composables/sites/useNewSite.ts
new file mode 100644
index 000000000..24c0bb353
--- /dev/null
+++ b/admin/frontend/dashboard/src/composables/sites/useNewSite.ts
@@ -0,0 +1,137 @@
+import { computed, ref, watch } from 'vue'
+
+import { appsApi } from '@/api/apps'
+import { apiErrorMessage } from '@/api/client'
+import { sitesApi } from '@/api/sites'
+import { useAppRegistry } from '@/composables/apps/useAppRegistry'
+import type { AppInfo } from '@/types/apps'
+import { errorMessage } from '@/utils/error'
+import { buildSiteAppChoices } from '@/utils/siteApps'
+
+const validate = (name: string) => {
+  if (!name) return 'Site name is required.'
+  if (!/^[a-zA-Z0-9][a-zA-Z0-9\-.]*[a-zA-Z0-9]$|^[a-zA-Z0-9]$/.test(name))
+    return 'Site name must be a valid hostname.'
+  return null
+}
+
+export const useNewSite = () => {
+  const { registry, load: loadRegistry } = useAppRegistry()
+  const benchApps = ref<AppInfo[]>([])
+
+  const name = ref('')
+  const prefix = ref('')
+  const wildcardDomains = ref<string[]>([])
+  const suffix = ref('')
+  const selectedApps = ref<string[]>([])
+  const appSearch = ref('')
+  const loading = ref(false)
+  const creating = ref(false)
+  const error = ref('')
+
+  const hasSingleDomain = computed(() => wildcardDomains.value.length === 1)
+  const nameError = computed(() => validate(name.value.trim()))
+  const availableApps = computed(() => buildSiteAppChoices(registry.value, benchApps.value))
+  const frappe = computed(() => benchApps.value.find((app) => app.name === 'frappe'))
+  const filteredApps = computed(() => {
+    const query = appSearch.value.trim().toLowerCase()
+
+    if (!query) return availableApps.value
+
+    return availableApps.value.filter((app) =>
+      [app.title, app.name].some((text) => text?.toLowerCase().includes(query)),
+    )
+  })
+
+  watch([prefix, suffix], () => {
+    name.value =
+      wildcardDomains.value.length && prefix.value ? `${prefix.value.trim()}${suffix.value}` : ''
+  })
+
+  const loadBenchApps = async () => {
+    try {
+      benchApps.value = await appsApi.installed()
+    } catch {
+      benchApps.value = []
+    }
+  }
+
+  const loadWildcardDomains = async () => {
+    try {
+      const { domains } = await sitesApi.domains.wildcardList()
+
+      wildcardDomains.value = domains || []
+      suffix.value = wildcardDomains.value[0] || ''
+    } catch {
+      wildcardDomains.value = []
+    }
+  }
+
+  const reset = async () => {
+    name.value = ''
+    prefix.value = ''
+    error.value = ''
+    selectedApps.value = []
+    appSearch.value = ''
+    loading.value = true
+
+    await Promise.all([loadWildcardDomains(), loadRegistry(), loadBenchApps()])
+
+    loading.value = false
+  }
+
+  const toggleApp = (app: string) => {
+    const index = selectedApps.value.indexOf(app)
+
+    if (index === -1) selectedApps.value.push(app)
+    else selectedApps.value.splice(index, 1)
+  }
+
+  const create = async () => {
+    const siteName = name.value.trim()
+    const validationError = validate(siteName)
+
+    if (validationError) {
+      error.value = validationError
+
+      return null
+    }
+
+    creating.value = true
+    error.value = ''
+
+    try {
+      const result = await sitesApi.create({ name: siteName, apps: selectedApps.value })
+
+      if (result.task_id) return result.task_id
+
+      error.value = apiErrorMessage(result, 'Could not create site.')
+    } catch (caught) {
+      error.value = errorMessage(caught, 'Could not create site.')
+    } finally {
+      creating.value = false
+    }
+
+    return null
+  }
+
+  return {
+    name,
+    prefix,
+    wildcardDomains,
+    suffix,
+    selectedApps,
+    appSearch,
+    loading,
+    creating,
+    error,
+    hasSingleDomain,
+    nameError,
+    availableApps,
+    filteredApps,
+    frappe,
+    reset,
+    toggleApp,
+    create,
+  }
+}
diff --git a/admin/frontend/dashboard/src/index.css b/admin/frontend/dashboard/src/index.css
index ff23ec6d5..b8e791e43 100644
--- a/admin/frontend/dashboard/src/index.css
+++ b/admin/frontend/dashboard/src/index.css
@@ -133,3 +133,14 @@ body {
 .hover-scrollbar::-webkit-scrollbar-track {
   background: transparent;
 }
+
+input:autofill {
+  filter: none;
+  -webkit-text-fill-color: var(--ink-gray-8);
+  transition: background-color 600000s 0s;
+}
+
+.dialog-content,
+.dialog-content .bg-surface-elevation-1 {
+	@apply bg-surface-base;
+}
diff --git a/admin/frontend/dashboard/src/layouts/MainLayout.vue b/admin/frontend/dashboard/src/layouts/MainLayout.vue
index e50d0e023..c645c881e 100644
--- a/admin/frontend/dashboard/src/layouts/MainLayout.vue
+++ b/admin/frontend/dashboard/src/layouts/MainLayout.vue
@@ -81,7 +81,7 @@ const breadcrumbsFromRouteMeta = ({ title = '' }) => {
 <template>
   <MobileShell v-if="isMobile">
     <header
-      class="sticky top-0 z-20 flex min-h-12 flex-col justify-center border-b border-outline-gray-2 bg-surface-base px-3 md:px-4"
+      class="sticky top-0 z-20 flex min-h-12 flex-col justify-center border-b bg-surface-base px-3 md:px-4"
     >
       <div class="flex items-center justify-between">
         <div v-if="route.name == 'Home'" class="flex items-center gap-2">
@@ -111,7 +111,12 @@ const breadcrumbsFromRouteMeta = ({ title = '' }) => {
 
     <template #nav>
       <MobileNav class="!bg-surface-base">
-        <MobileNavItem label="Home" icon="lucide-house" route="/home" :active="route.name == 'Home'" />
+        <MobileNavItem
+          label="Home"
+          icon="lucide-house"
+          route="/home"
+          :active="route.name == 'Home'"
+        />
         <MobileNavItem label="Search" icon="lucide-search" @click="openSearch" />
         <NotificationsPanel mobile />
         <MobileNavItem
@@ -134,7 +139,7 @@ const breadcrumbsFromRouteMeta = ({ title = '' }) => {
     </template>
 
     <header
-      class="sticky top-0 z-20 flex min-h-12 flex-col justify-center border-b border-outline-gray-2 bg-surface-base px-3 md:px-4"
+      class="sticky top-0 z-20 flex min-h-12 flex-col justify-center border-b bg-surface-base px-3 md:px-4"
     >
       <div class="flex flex-1 items-center gap-1">
         <Breadcrumbs :items="breadcrumbs" />
diff --git a/admin/frontend/dashboard/src/utils/siteApps.test.ts b/admin/frontend/dashboard/src/utils/siteApps.test.ts
index 1eb10a0e5..20df38046 100644
--- a/admin/frontend/dashboard/src/utils/siteApps.test.ts
+++ b/admin/frontend/dashboard/src/utils/siteApps.test.ts
@@ -16,15 +16,12 @@ test('isFrappeApp only matches repos under the frappe org', () => {
   assert.equal(isFrappeApp({}), false)
 })
 
-test('keeps Frappe registry apps and drops third-party ones', () => {
+test('offers every registry app, third-party ones included', () => {
   const choices = buildSiteAppChoices(
     [frappe('erpnext'), { name: 'acme', title: 'Acme', repo: 'https://github.com/acme/acme' }],
     [],
   )
-  assert.deepEqual(
-    choices.map((a) => a.name),
-    ['erpnext'],
-  )
+  assert.deepEqual(choices.map((a) => a.name).sort(), ['acme', 'erpnext'])
 })
 
 test('never offers frappe itself, from either source', () => {
diff --git a/admin/frontend/dashboard/src/utils/siteApps.ts b/admin/frontend/dashboard/src/utils/siteApps.ts
index f242b8a64..9858d1b3b 100644
--- a/admin/frontend/dashboard/src/utils/siteApps.ts
+++ b/admin/frontend/dashboard/src/utils/siteApps.ts
@@ -11,16 +11,12 @@ export const isFrappeApp = (app: { repo?: string }) => {
   return Boolean(app.repo?.includes('github.com/frappe/'))
 }
 
-// The whole catalog is too much to scan while naming a site: Frappe's own apps
-// plus whatever is already cloned onto this bench, marketplace for the rest.
 export const buildSiteAppChoices = (
   registry: SiteAppChoice[] = [],
   benchApps: SiteAppChoice[] = [],
 ) => {
   const apps = new Map<string, SiteAppChoice>()
-  registry
-    .filter((app) => app.name !== 'frappe' && isFrappeApp(app))
-    .forEach((app) => apps.set(app.name, app))
+  registry.filter((app) => app.name !== 'frappe').forEach((app) => apps.set(app.name, app))
   benchApps
     // Bench-only apps carry no registry title, so this falls back to the folder
     // name - `insights` next to `ERPNext`. Same tidy-up the marketplace does.
diff --git a/docs/configuration.md b/docs/configuration.md
index 09caca2ca..aee996d72 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -50,6 +50,7 @@ The `[bench]` table supports:
 | `allow_developer_mode` | Allows per-site developer mode changes. |
 | `watch_apps_js`, `watch_admin_js`, `reload_python` | Development reload settings. |
 | `install_dev_extra` | Install apps' `dev` extras on a non-production bench. Defaults to true; `pilot init --no-dev` sets it to false. |
+| `onboarding` | State of the onboarding dialog: empty shows it, `minimized` shows in sidebar card only, `dismissed` hides both |
 
 Applications use `[[apps]]` entries. `branches` can list branches available to the app:
 
diff --git a/pilot/config/bench.py b/pilot/config/bench.py
index ef039fc59..34cf35631 100644
--- a/pilot/config/bench.py
+++ b/pilot/config/bench.py
@@ -83,6 +83,7 @@
 
 # Framework branches the setup wizard offers, newest/recommended first.
 FRAMEWORK_BRANCHES = ["version-16", "develop"]
+ONBOARDING_STATES = ("", "minimized", "dismissed")
 
 _DEFAULT_DATA: dict = {
     "bench": {"name": "", "python": "3.14"},
@@ -128,6 +129,7 @@ class BenchConfig:
     allow_developer_mode: bool = False
     # Whether `uv pip install -e` pulls an app's `dev` extra, such as frappe's watchdog.
     install_dev_extra: bool = True
+    onboarding: str = ""
     production: ProductionConfig = field(default_factory=ProductionConfig)
     lite_mode: LiteModeConfig = field(default_factory=LiteModeConfig)
     nginx: NginxConfig = field(default_factory=NginxConfig)
@@ -222,6 +224,7 @@ def _from_dict(
             default_branch=bench_data.get("default_branch", ""),
             allow_developer_mode=bench_data.get("allow_developer_mode", False),
             install_dev_extra=bench_data.get("install_dev_extra", True),
+            onboarding=bench_data.get("onboarding", ""),
             apps=apps,
             mariadb=common.mariadb,
             postgres=common.postgres,
@@ -540,6 +543,8 @@ def _bench_section(self) -> ConfigDict:
         }
         if self.default_branch:
             bench["default_branch"] = self.default_branch
+        if self.onboarding:
+            bench["onboarding"] = self.onboarding
         return bench
 
     def _apps_section(self) -> list[ConfigDict]:
@@ -881,6 +886,7 @@ def _workers_to_groups(value) -> list[WorkerGroup]:
     "default_branch",
     "allow_developer_mode",
     "install_dev_extra",
+    "onboarding",
 }
 # Keys older Pilot versions wrote that the parser still tolerates.
 _PRODUCTION_LEGACY = {"lightweight", "nginx", "use_companion_manager"}
diff --git a/tests/admin/backend/api/test_settings_onboarding.py b/tests/admin/backend/api/test_settings_onboarding.py
new file mode 100644
index 000000000..a06ab6944
--- /dev/null
+++ b/tests/admin/backend/api/test_settings_onboarding.py
@@ -0,0 +1,56 @@
+from __future__ import annotations
+
+from admin.backend.api.v1.settings import ConfigPatcher, build_settings_response, restart_trigger_values
+from pilot.config import BenchConfig
+from pilot.core.bench.settings import is_restart_needed
+
+
+def _config(**bench) -> BenchConfig:
+    return BenchConfig._from_dict(
+        {
+            "bench": {"name": "test-bench", "python": "3.14", **bench},
+            "apps": [{"name": "frappe", "repo": "https://github.com/frappe/frappe", "branch": "develop"}],
+            "mariadb": {"root_password": "root"},
+        }
+    )
+
+
+def test_settings_response_shows_onboarding_on_a_new_bench() -> None:
+    assert build_settings_response(_config())["bench"]["onboarding"] == ""
+
+
+def test_patcher_stores_onboarding_state() -> None:
+    config = _config()
+
+    assert ConfigPatcher(config, {"bench": {"onboarding": "minimized"}}).apply() is None
+    assert config.onboarding == "minimized"
+
+    assert ConfigPatcher(config, {"bench": {"onboarding": "dismissed"}}).apply() is None
+    assert config.onboarding == "dismissed"
+
+
+def test_patcher_rejects_unknown_onboarding_state() -> None:
+    config = _config()
+
+    error = ConfigPatcher(config, {"bench": {"onboarding": "closed"}}).apply()
+
+    assert error and "bench.onboarding" in error
+    assert config.onboarding == ""
+
+
+def test_onboarding_state_survives_a_round_trip() -> None:
+    config = _config(onboarding="dismissed")
+
+    assert BenchConfig._from_dict(config._to_toml_dict()).onboarding == "dismissed"
+
+
+def test_new_bench_does_not_write_onboarding_key() -> None:
+    assert "onboarding" not in _config()._to_toml_dict()["bench"]
+
+
+def test_changing_onboarding_does_not_restart_the_bench() -> None:
+    config = _config()
+    before = restart_trigger_values(config)
+    config.onboarding = "minimized"
+
+    assert not is_restart_needed(before, restart_trigger_values(config))
diff --git a/tests/e2e/flows/admin.py b/tests/e2e/flows/admin.py
index 68ac6efb7..fb8bb7096 100644
--- a/tests/e2e/flows/admin.py
+++ b/tests/e2e/flows/admin.py
@@ -34,6 +34,13 @@ def login(page: Page, base_url: str, password: str) -> None:
     expect(page.get_by_role("button", name="New site")).to_be_visible(timeout=30_000)
 
 
+def dismiss_onboarding(page: Page, base_url: str, password: str) -> None:
+    expect(page.request.post(f"{base_url}/api/v1/auth/session", data={"password": password})).to_be_ok()
+    res = page.request.patch(f"{base_url}/api/v1/settings", data={"bench": {"onboarding": "dismissed"}})
+    expect(res).to_be_ok()
+    page.context.clear_cookies()
+
+
 def create_site(page: Page, base_url: str, site_name: str) -> None:
     open_root(page, base_url)
     page.get_by_role("button", name="New site").click()
diff --git a/tests/e2e/specs/test_bench_lifecycle.py b/tests/e2e/specs/test_bench_lifecycle.py
index e59740866..e41a9a6c3 100644
--- a/tests/e2e/specs/test_bench_lifecycle.py
+++ b/tests/e2e/specs/test_bench_lifecycle.py
@@ -9,6 +9,7 @@
 import pytest
 from flows.admin import (
     create_site,
+    dismiss_onboarding,
     drop_site,
     installed_apps,
     login,
@@ -54,6 +55,7 @@ def test_completes_setup_wizard(bench, page):
 
 
 def test_logs_into_admin(bench, page):
+    dismiss_onboarding(page, bench.admin_url, bench.admin_password)
     login(page, bench.admin_url, bench.admin_password)