diff --git a/apps/mark/src-tauri/src/lib.rs b/apps/mark/src-tauri/src/lib.rs
index 9c9f99cd..495c5074 100644
--- a/apps/mark/src-tauri/src/lib.rs
+++ b/apps/mark/src-tauri/src/lib.rs
@@ -2103,6 +2103,14 @@ pub fn run() {
                     ..Default::default()
                 };
 
+                let settings_item = MenuItem::with_id(
+                    handle,
+                    "settings",
+                    "Preferences…",
+                    true,
+                    Some("CmdOrCtrl+,"),
+                )?;
+
                 let app_menu = Submenu::with_items(
                     handle,
                     "Mark",
@@ -2114,6 +2122,8 @@ pub fn run() {
                             Some(about_metadata),
                         )?,
                         &PredefinedMenuItem::separator(handle)?,
+                        &settings_item,
+                        &PredefinedMenuItem::separator(handle)?,
                         &PredefinedMenuItem::services(handle, None)?,
                         &PredefinedMenuItem::separator(handle)?,
                         &PredefinedMenuItem::hide(handle, None)?,
@@ -2165,27 +2175,9 @@ pub fn run() {
                     ],
                 )?;
 
-                let doctor_item =
-                    MenuItem::with_id(handle, "doctor", "Health Check…", true, None::<&str>)?;
-
-                let help_menu = Submenu::with_id_and_items(
-                    handle,
-                    tauri::menu::HELP_SUBMENU_ID,
-                    "Help",
-                    true,
-                    &[&doctor_item],
-                )?;
-
                 let menu = Menu::with_items(
                     handle,
-                    &[
-                        &app_menu,
-                        &file_menu,
-                        &edit_menu,
-                        &view_menu,
-                        &window_menu,
-                        &help_menu,
-                    ],
+                    &[&app_menu, &file_menu, &edit_menu, &view_menu, &window_menu],
                 )?;
 
                 app.set_menu(menu)?;
@@ -2302,10 +2294,10 @@ pub fn run() {
             Ok(())
         })
         .on_menu_event(|app, event| {
-            if event.id() == "doctor" {
-                // Emit an event to the frontend to open the doctor modal.
-                if let Err(e) = app.emit("menu:doctor", ()) {
-                    log::warn!("Failed to emit menu:doctor event: {e}");
+            if event.id() == "settings" {
+                // Emit an event to the frontend to open the settings page.
+                if let Err(e) = app.emit("menu:settings", ()) {
+                    log::warn!("Failed to emit menu:settings event: {e}");
                 }
             }
         })
diff --git a/apps/mark/src/App.svelte b/apps/mark/src/App.svelte
index c1239908..fc19659c 100644
--- a/apps/mark/src/App.svelte
+++ b/apps/mark/src/App.svelte
@@ -13,13 +13,12 @@
   import ProjectHome from './lib/features/projects/ProjectHome.svelte';
   import ProjectsList from './lib/features/projects/ProjectsList.svelte';
   import SessionLauncher from './lib/features/sessions/SessionLauncher.svelte';
-  import DoctorModal from './lib/features/doctor/DoctorModal.svelte';
-  import ActionsPreferencesModal from './lib/features/settings/ActionsPreferencesModal.svelte';
+  import SettingsPage from './lib/features/settings/SettingsPage.svelte';
   import ToastHost from './lib/shared/ToastHost.svelte';
   import { preferences, initPreferences } from './lib/features/settings/preferences.svelte';
   import { refreshProviders } from './lib/features/agents/agent.svelte';
   import { refreshSqAvailability } from './lib/features/settings/sq.svelte';
-  import { navigation, initNavigation } from './lib/navigation.svelte';
+  import { navigation, initNavigation, openSettings } from './lib/navigation.svelte';
   import { projectStateStore } from './lib/stores/projectState.svelte';
   import { prStateStore } from './lib/stores/prState.svelte';
   import { sessionRegistry } from './lib/stores/sessionRegistry.svelte';
@@ -27,14 +26,11 @@
   import type { StoreIncompatibility } from './lib/types';
 
   let showSessionLab = $state(false);
-  let showDoctor = $state(false);
-  let showActionsPreferences = $state(false);
-  let unlistenDoctor: UnlistenFn | undefined;
+  let unlistenSettings: UnlistenFn | undefined;
   let unlistenSessionStatus: UnlistenFn | undefined;
   let storeIncompat = $state<StoreIncompatibility | null>(null);
   let resetting = $state(false);
   let storeError = $state<string | null>(null);
-  let onOpenActionsPreferences: (() => void) | null = null;
 
   // Konami code: ↑↑↓↓←→←→BA
   const konamiSequence = [
@@ -72,23 +68,19 @@
 
   function handleGlobalShortcut(e: KeyboardEvent) {
     if (shouldIgnoreGlobalShortcut(e.target)) return;
-    if (e.key === ';') {
+    if ((e.metaKey || e.ctrlKey) && e.key === ',') {
       e.preventDefault();
-      showActionsPreferences = true;
+      openSettings();
     }
   }
 
   onMount(async () => {
     document.addEventListener('keydown', handleKonamiKey);
     document.addEventListener('keydown', handleGlobalShortcut);
-    onOpenActionsPreferences = () => {
-      showActionsPreferences = true;
-    };
-    window.addEventListener('mark:open-actions-preferences', onOpenActionsPreferences);
-
-    // Listen for the Help → Health Check… menu item.
-    unlistenDoctor = await listen('menu:doctor', () => {
-      showDoctor = true;
+
+    // Listen for the app menu Preferences item.
+    unlistenSettings = await listen('menu:settings', () => {
+      openSettings();
     });
 
     // Listen for session status changes globally to handle spinner cleanup
@@ -210,11 +202,7 @@
   onDestroy(() => {
     document.removeEventListener('keydown', handleKonamiKey);
     document.removeEventListener('keydown', handleGlobalShortcut);
-    if (onOpenActionsPreferences) {
-      window.removeEventListener('mark:open-actions-preferences', onOpenActionsPreferences);
-      onOpenActionsPreferences = null;
-    }
-    unlistenDoctor?.();
+    unlistenSettings?.();
     unlistenSessionStatus?.();
   });
 
@@ -293,6 +281,8 @@
           <div class="error-state">
             <p>{storeError}</p>
           </div>
+        {:else if navigation.activeView === 'settings'}
+          <SettingsPage />
         {:else if navigation.selectedProjectId}
           <ProjectHome selectedProjectId={navigation.selectedProjectId} />
         {:else}
@@ -306,14 +296,6 @@
     <SessionLauncher onClose={() => (showSessionLab = false)} />
   {/if}
 
-  {#if showDoctor}
-    <DoctorModal onClose={() => (showDoctor = false)} />
-  {/if}
-
-  {#if showActionsPreferences}
-    <ActionsPreferencesModal onClose={() => (showActionsPreferences = false)} />
-  {/if}
-
   <ToastHost />
 {/if}
 
diff --git a/apps/mark/src/lib/TopBar.svelte b/apps/mark/src/lib/TopBar.svelte
index 3860f990..503d8816 100644
--- a/apps/mark/src/lib/TopBar.svelte
+++ b/apps/mark/src/lib/TopBar.svelte
@@ -9,6 +9,7 @@
   import { Palette, PanelLeftClose, PanelLeftOpen, Plus, SlidersHorizontal } from 'lucide-svelte';
   import { getCurrentWindow } from '@tauri-apps/api/window';
   import ThemeSelectorModal from './features/settings/ThemeSelectorModal.svelte';
+  import { navigation, openSettings } from './navigation.svelte';
   import {
     hydrateProjectsSidebarState,
     projectsSidebarState,
@@ -59,7 +60,10 @@
     <button
       class="icon-btn"
       onclick={() => window.dispatchEvent(new CustomEvent('mark:new-project'))}
-      title="New project (⌘N)"
+      disabled={navigation.activeView === 'settings'}
+      title={navigation.activeView === 'settings'
+        ? 'Unavailable while viewing settings'
+        : 'New project (⌘N)'}
     >
       <Plus size={14} />
     </button>
@@ -72,11 +76,7 @@
       <Palette size={14} />
     </button>
 
-    <button
-      class="icon-btn"
-      onclick={() => window.dispatchEvent(new CustomEvent('mark:open-actions-preferences'))}
-      title="Actions preferences (;)"
-    >
+    <button class="icon-btn" onclick={() => openSettings()} title="Settings (⌘,)">
       <SlidersHorizontal size={14} />
     </button>
 
diff --git a/apps/mark/src/lib/features/doctor/DoctorModal.svelte b/apps/mark/src/lib/features/doctor/DoctorModal.svelte
index 41c1744f..5add1586 100644
--- a/apps/mark/src/lib/features/doctor/DoctorModal.svelte
+++ b/apps/mark/src/lib/features/doctor/DoctorModal.svelte
@@ -1,7 +1,7 @@
 <!--
   DoctorModal.svelte — Health Check modal.
 
-  Opened via Help → Health Check menu item.
+  Opened from the Settings "Health Check" section.
   Runs all checks on mount and displays results with optional fix buttons.
 -->
 <script lang="ts">
diff --git a/apps/mark/src/lib/features/doctor/doctor.svelte.ts b/apps/mark/src/lib/features/doctor/doctor.svelte.ts
index b972a93e..456dc748 100644
--- a/apps/mark/src/lib/features/doctor/doctor.svelte.ts
+++ b/apps/mark/src/lib/features/doctor/doctor.svelte.ts
@@ -1,5 +1,5 @@
 /**
- * doctor.svelte.ts — Reactive state for the system health-check modal.
+ * doctor.svelte.ts — Reactive state for the system health-check UI.
  *
  * Exposes `doctorState` (report + loading flag) and an action helper
  * that calls the Tauri `run_doctor` command.
diff --git a/apps/mark/src/lib/features/settings/ActionsPreferencesModal.svelte b/apps/mark/src/lib/features/settings/ActionsPreferencesModal.svelte
index ab16f793..8c24a21e 100644
--- a/apps/mark/src/lib/features/settings/ActionsPreferencesModal.svelte
+++ b/apps/mark/src/lib/features/settings/ActionsPreferencesModal.svelte
@@ -1,25 +1,7 @@
 <script lang="ts">
-  import { onMount } from 'svelte';
-  import {
-    X,
-    Play,
-    Hammer,
-    FlaskConical,
-    Wand2,
-    CheckCircle,
-    Zap,
-    Plus,
-    Trash2,
-    Save,
-    Pencil,
-    Code2,
-  } from 'lucide-svelte';
-  import Spinner from '../../shared/Spinner.svelte';
-  import RepoLabel from '../../shared/RepoLabel.svelte';
+  import { X } from 'lucide-svelte';
   import { createBackdropDismissHandlers } from '../../shared/backdropDismiss';
-  import type { ActionContext, ProjectAction } from '../../commands';
-  import * as commands from '../../commands';
-  import { detectRepoActions, type SuggestedAction, type ActionType } from '../actions/actions';
+  import ActionsSettingsPanel from './ActionsSettingsPanel.svelte';
 
   interface Props {
     onClose: () => void;
@@ -27,245 +9,11 @@
 
   let { onClose }: Props = $props();
 
-  let contexts = $state<ActionContext[]>([]);
-  let selectedContextId = $state<string | null>(null);
-  let loadingContexts = $state(false);
-
-  let actions = $state<ProjectAction[]>([]);
-  let loadingActions = $state(false);
-  let detecting = $state(false);
-  let editingAction = $state<ProjectAction | null>(null);
-  let editForm = $state({
-    name: '',
-    command: '',
-    actionType: 'run' as ActionType,
-    autoCommit: false,
-  });
-
-  let selectedContext = $derived(contexts.find((c) => c.id === selectedContextId) ?? null);
-
-  onMount(async () => {
-    await loadContexts();
-  });
-
-  async function loadContexts() {
-    loadingContexts = true;
-    try {
-      contexts = await commands.listActionContexts();
-      if (!selectedContextId && contexts.length > 0) {
-        selectedContextId = contexts[0].id;
-      } else if (selectedContextId && !contexts.some((c) => c.id === selectedContextId)) {
-        selectedContextId = contexts.length > 0 ? contexts[0].id : null;
-      }
-      await loadActions();
-    } catch (e) {
-      console.error('Failed to load action contexts:', e);
-    } finally {
-      loadingContexts = false;
-    }
-  }
-
-  async function loadActions() {
-    if (!selectedContext) {
-      actions = [];
-      return;
-    }
-    loadingActions = true;
-    try {
-      actions = await commands.listRepoActions(
-        selectedContext.githubRepo,
-        selectedContext.subpath ?? undefined
-      );
-    } catch (e) {
-      console.error('Failed to load actions:', e);
-      actions = [];
-    } finally {
-      loadingActions = false;
-    }
-  }
-
-  $effect(() => {
-    // Refresh action list when selected context changes.
-    selectedContextId;
-    loadActions();
-  });
-
-  async function detectActions() {
-    if (!selectedContext) return;
-
-    detecting = true;
-    try {
-      const suggested = await detectRepoActions(
-        selectedContext.githubRepo,
-        selectedContext.subpath ?? undefined
-      );
-
-      const existingCommands = new Set(actions.map((a) => a.command));
-      let nextSortOrder = Math.max(...actions.map((a) => a.sortOrder), 0) + 1;
-
-      let actionsAdded = false;
-      for (const suggestion of suggested) {
-        if (existingCommands.has(suggestion.command)) continue;
-        const newAction = await commands.createRepoAction(
-          selectedContext.githubRepo,
-          selectedContext.subpath ?? undefined,
-          suggestion.name,
-          suggestion.command,
-          suggestion.actionType,
-          nextSortOrder++,
-          suggestion.autoCommit
-        );
-        actions = [...actions, newAction];
-        actionsAdded = true;
-      }
-
-      if (actionsAdded) {
-        window.dispatchEvent(new CustomEvent('project-actions-changed'));
-      }
-
-      contexts = await commands.listActionContexts();
-    } catch (e) {
-      console.error('Failed to detect actions:', e);
-    } finally {
-      detecting = false;
-    }
-  }
-
-  function startAddAction() {
-    editForm = { name: '', command: '', actionType: 'run', autoCommit: false };
-    editingAction = {} as ProjectAction;
-  }
-
-  function startEditAction(action: ProjectAction) {
-    editForm = {
-      name: action.name,
-      command: action.command,
-      actionType: action.actionType as ActionType,
-      autoCommit: action.autoCommit,
-    };
-    editingAction = action;
-  }
-
-  function cancelEdit() {
-    editingAction = null;
-  }
-
-  async function saveAction() {
-    if (!selectedContext || !editForm.name || !editForm.command) return;
-
-    try {
-      if (!editingAction?.id) {
-        const nextSortOrder = Math.max(...actions.map((a) => a.sortOrder), 0) + 1;
-        const newAction = await commands.createRepoAction(
-          selectedContext.githubRepo,
-          selectedContext.subpath ?? undefined,
-          editForm.name,
-          editForm.command,
-          editForm.actionType,
-          nextSortOrder,
-          editForm.autoCommit
-        );
-        actions = [...actions, newAction];
-      } else {
-        const actionId = editingAction.id;
-        await commands.updateProjectAction(
-          actionId,
-          editForm.name,
-          editForm.command,
-          editForm.actionType,
-          editingAction.sortOrder,
-          editForm.autoCommit
-        );
-        actions = actions.map((a) =>
-          a.id === actionId
-            ? {
-                ...a,
-                name: editForm.name,
-                command: editForm.command,
-                actionType: editForm.actionType,
-                autoCommit: editForm.autoCommit,
-              }
-            : a
-        );
-      }
-
-      editingAction = null;
-      window.dispatchEvent(new CustomEvent('project-actions-changed'));
-    } catch (e) {
-      console.error('Failed to save action:', e);
-    }
-  }
-
-  async function deleteAction(actionId: string) {
-    try {
-      await commands.deleteProjectAction(actionId);
-      actions = actions.filter((a) => a.id !== actionId);
-      window.dispatchEvent(new CustomEvent('project-actions-changed'));
-    } catch (e) {
-      console.error('Failed to delete action:', e);
-    }
-  }
-
-  function getActionIcon(actionType: string) {
-    switch (actionType) {
-      case 'prerun':
-        return Zap;
-      case 'build':
-        return Hammer;
-      case 'test':
-        return FlaskConical;
-      case 'format':
-        return Wand2;
-      case 'check':
-        return CheckCircle;
-      case 'run':
-        return Play;
-      case 'cleanUp':
-        return Trash2;
-      default:
-        return Play;
-    }
-  }
-
-  let sortedContexts = $derived.by(() => {
-    return [...contexts].sort((a, b) => {
-      const aDisplay = a.subpath ? `${a.githubRepo}/${a.subpath}` : a.githubRepo;
-      const bDisplay = b.subpath ? `${b.githubRepo}/${b.subpath}` : b.githubRepo;
-      return aDisplay.localeCompare(bDisplay);
-    });
-  });
   const backdropDismiss = createBackdropDismissHandlers({
     onDismiss: () => onClose(),
-    canDismiss: () => !editingAction,
   });
-
-  let groupedActions = $derived.by(() => {
-    const groups: Record<string, ProjectAction[]> = {
-      prerun: [],
-      run: [],
-      build: [],
-      test: [],
-      format: [],
-      check: [],
-      cleanUp: [],
-    };
-    for (const action of actions) {
-      const type = action.actionType;
-      if (groups[type]) groups[type].push(action);
-    }
-    return groups;
-  });
-
-  function handleKeydown(event: KeyboardEvent) {
-    if (event.key === 'Escape' && !editingAction) {
-      onClose();
-      event.preventDefault();
-    }
-  }
 </script>
 
-<svelte:window onkeydown={handleKeydown} />
-
 <div
   class="modal-backdrop"
   role="dialog"
@@ -273,135 +21,19 @@
   tabindex="-1"
   onpointerdown={backdropDismiss.handlePointerDown}
   onclick={backdropDismiss.handleClick}
-  onkeydown={(e) => e.key === 'Escape' && !editingAction && onClose()}
+  onkeydown={(e) => e.key === 'Escape' && onClose()}
 >
   <div class="modal">
     <header class="modal-header">
-      <h2>
-        <Play size={16} />
-        Actions Preferences
-      </h2>
+      <h2>Actions Preferences</h2>
       <button class="close-btn" onclick={onClose}>
         <X size={16} />
       </button>
     </header>
 
     <div class="modal-body">
-      <aside class="sidebar">
-        <div class="sidebar-title">Repos</div>
-        {#if loadingContexts}
-          <div class="loading-side"><Spinner size={14} /> Loading...</div>
-        {:else if contexts.length === 0}
-          <div class="empty-side">No repo contexts yet</div>
-        {:else}
-          <div class="context-list">
-            {#each sortedContexts as context (context.id)}
-              <button
-                class="context-item"
-                class:selected={context.id === selectedContextId}
-                onclick={() => (selectedContextId = context.id)}
-              >
-                <RepoLabel githubRepo={context.githubRepo} subpath={context.subpath} />
-              </button>
-            {/each}
-          </div>
-        {/if}
-      </aside>
-
-      <section class="main-panel">
-        {#if !selectedContext}
-          <div class="empty-main">Select a repo context to configure actions</div>
-        {:else}
-          <div class="actions-header">
-            <button class="secondary-btn" onclick={detectActions} disabled={detecting}>
-              {#if detecting}
-                <Spinner size={14} />
-              {:else}
-                <Zap size={14} />
-              {/if}
-              Detect Actions
-            </button>
-            <button class="primary-btn" onclick={startAddAction}>
-              <Plus size={14} />
-              Add Action
-            </button>
-          </div>
-
-          {#if loadingActions}
-            <div class="loading-state">
-              <Spinner size={24} />
-              <span>Loading...</span>
-            </div>
-          {:else if actions.length === 0}
-            <div class="empty-state">
-              <Play size={32} />
-              <p>No actions configured</p>
-              <p class="empty-hint">Click "Detect Actions" or add one manually</p>
-            </div>
-          {:else}
-            <div class="actions-list">
-              {#each Object.entries(groupedActions) as [type, typeActions]}
-                {#if typeActions.length > 0}
-                  <div class="action-group">
-                    <div class="group-header">{type}</div>
-                    {#each typeActions as action (action.id)}
-                      {@const Icon = getActionIcon(action.actionType)}
-                      <div class="action-row">
-                        <div class="action-main">
-                          <Icon size={14} />
-                          <div class="action-details">
-                            <div class="action-name">{action.name}</div>
-                            <div class="action-command">
-                              <Code2 size={12} />
-                              {action.command}
-                            </div>
-                          </div>
-                        </div>
-                        <div class="action-buttons">
-                          <button class="icon-btn" onclick={() => startEditAction(action)}>
-                            <Pencil size={13} />
-                          </button>
-                          <button class="icon-btn danger" onclick={() => deleteAction(action.id)}>
-                            <Trash2 size={13} />
-                          </button>
-                        </div>
-                      </div>
-                    {/each}
-                  </div>
-                {/if}
-              {/each}
-            </div>
-          {/if}
-        {/if}
-      </section>
+      <ActionsSettingsPanel />
     </div>
-
-    {#if editingAction}
-      <div class="editor">
-        <input bind:value={editForm.name} placeholder="Action name" />
-        <input bind:value={editForm.command} placeholder="Command" />
-        <select bind:value={editForm.actionType}>
-          <option value="run">run</option>
-          <option value="prerun">prerun</option>
-          <option value="build">build</option>
-          <option value="test">test</option>
-          <option value="format">format</option>
-          <option value="check">check</option>
-          <option value="cleanUp">cleanUp</option>
-        </select>
-        <label class="checkbox-row">
-          <input type="checkbox" bind:checked={editForm.autoCommit} />
-          Auto-commit
-        </label>
-        <div class="editor-buttons">
-          <button class="secondary-btn" onclick={cancelEdit}>Cancel</button>
-          <button class="primary-btn" onclick={saveAction}>
-            <Save size={14} />
-            Save
-          </button>
-        </div>
-      </div>
-    {/if}
   </div>
 </div>
 
@@ -417,7 +49,7 @@
   }
 
   .modal {
-    width: min(1100px, 94vw);
+    width: min(1160px, 94vw);
     max-height: 88vh;
     background: var(--bg-chrome);
     border: 1px solid var(--border-muted);
@@ -438,15 +70,11 @@
 
   .modal-header h2 {
     margin: 0;
-    display: flex;
-    align-items: center;
-    gap: 8px;
     font-size: var(--size-md);
     font-weight: 600;
   }
 
-  .close-btn,
-  .icon-btn {
+  .close-btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -459,222 +87,15 @@
     cursor: pointer;
   }
 
-  .close-btn:hover,
-  .icon-btn:hover {
+  .close-btn:hover {
     background: var(--bg-hover);
     color: var(--text-primary);
   }
 
-  .icon-btn.danger:hover {
-    color: var(--ui-danger);
-  }
-
   .modal-body {
-    display: grid;
-    grid-template-columns: 260px 1fr;
-    min-height: 460px;
-    overflow: hidden;
-  }
-
-  .sidebar {
-    border-right: 1px solid var(--border-subtle);
-    padding: 10px;
-    overflow-y: auto;
-  }
-
-  .sidebar-title {
-    font-size: var(--size-xs);
-    color: var(--text-muted);
-    text-transform: uppercase;
-    letter-spacing: 0.06em;
-    margin: 4px 6px 10px;
-  }
-
-  .context-list {
-    display: flex;
-    flex-direction: column;
-    gap: 4px;
-  }
-
-  .context-item {
-    text-align: left;
-    padding: 8px 10px;
-    border: 1px solid transparent;
-    border-radius: 8px;
-    background: transparent;
-    color: var(--text-primary);
-    cursor: pointer;
-    font-size: var(--size-sm);
-  }
-
-  .context-item:hover {
-    background: var(--bg-hover);
-  }
-
-  .context-item.selected {
-    background: var(--bg-primary);
-    border-color: var(--border-muted);
-  }
-
-  .loading-side,
-  .empty-side,
-  .empty-main,
-  .loading-state,
-  .empty-state {
-    color: var(--text-muted);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 8px;
-  }
-
-  .main-panel {
+    min-height: 0;
+    flex: 1;
     padding: 14px;
-    overflow-y: auto;
-  }
-
-  .actions-header {
-    display: flex;
-    justify-content: flex-end;
-    gap: 8px;
-    margin-bottom: 12px;
-  }
-
-  .primary-btn,
-  .secondary-btn {
-    border: 1px solid var(--border-muted);
-    border-radius: 8px;
-    padding: 7px 10px;
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    font-size: var(--size-sm);
-    cursor: pointer;
-  }
-
-  .primary-btn {
-    background: var(--ui-accent);
-    border-color: var(--ui-accent);
-    color: white;
-  }
-
-  .secondary-btn {
-    background: var(--bg-primary);
-    color: var(--text-primary);
-  }
-
-  .primary-btn:disabled,
-  .secondary-btn:disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-  }
-
-  .actions-list {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-  }
-
-  .action-group {
-    border: 1px solid var(--border-subtle);
-    border-radius: 10px;
     overflow: hidden;
   }
-
-  .group-header {
-    background: var(--bg-primary);
-    color: var(--text-muted);
-    font-size: var(--size-xs);
-    text-transform: uppercase;
-    letter-spacing: 0.06em;
-    padding: 8px 10px;
-  }
-
-  .action-row {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 8px;
-    padding: 10px;
-    border-top: 1px solid var(--border-subtle);
-  }
-
-  .action-main {
-    display: flex;
-    gap: 8px;
-    align-items: flex-start;
-  }
-
-  .action-name {
-    font-size: var(--size-sm);
-    font-weight: 600;
-  }
-
-  .action-command {
-    display: flex;
-    align-items: center;
-    gap: 4px;
-    color: var(--text-muted);
-    font-family: 'SF Mono', Menlo, Monaco, monospace;
-    font-size: var(--size-xs);
-    margin-top: 3px;
-  }
-
-  .action-buttons {
-    display: flex;
-    gap: 4px;
-  }
-
-  .editor {
-    border-top: 1px solid var(--border-subtle);
-    padding: 12px;
-    display: grid;
-    grid-template-columns: 1fr 1fr auto auto;
-    gap: 8px;
-    align-items: center;
-  }
-
-  .editor input,
-  .editor select {
-    padding: 8px 10px;
-    border-radius: 8px;
-    border: 1px solid var(--border-muted);
-    background: var(--bg-primary);
-    color: var(--text-primary);
-    min-width: 0;
-  }
-
-  .checkbox-row {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    color: var(--text-muted);
-    font-size: var(--size-sm);
-  }
-
-  .editor-buttons {
-    display: inline-flex;
-    gap: 8px;
-    justify-self: end;
-  }
-
-  @media (max-width: 900px) {
-    .modal-body {
-      grid-template-columns: 1fr;
-    }
-
-    .sidebar {
-      border-right: none;
-      border-bottom: 1px solid var(--border-subtle);
-      max-height: 160px;
-    }
-
-    .editor {
-      grid-template-columns: 1fr;
-    }
-
-    .editor-buttons {
-      justify-self: stretch;
-    }
-  }
 </style>
diff --git a/apps/mark/src/lib/features/settings/ActionsSettingsPanel.svelte b/apps/mark/src/lib/features/settings/ActionsSettingsPanel.svelte
new file mode 100644
index 00000000..55b46ad3
--- /dev/null
+++ b/apps/mark/src/lib/features/settings/ActionsSettingsPanel.svelte
@@ -0,0 +1,642 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import {
+    Play,
+    Hammer,
+    FlaskConical,
+    Wand2,
+    CheckCircle,
+    Zap,
+    Plus,
+    Trash2,
+    Save,
+    Pencil,
+    Code2,
+  } from 'lucide-svelte';
+  import Spinner from '../../shared/Spinner.svelte';
+  import RepoLabel from '../../shared/RepoLabel.svelte';
+  import type { ActionContext, ProjectAction } from '../../commands';
+  import * as commands from '../../commands';
+  import { detectRepoActions, type ActionType } from '../actions/actions';
+
+  let contexts = $state<ActionContext[]>([]);
+  let selectedContextId = $state<string | null>(null);
+  let loadingContexts = $state(false);
+
+  let actions = $state<ProjectAction[]>([]);
+  let loadingActions = $state(false);
+  let detecting = $state(false);
+  let editingAction = $state<ProjectAction | null>(null);
+  let editForm = $state({
+    name: '',
+    command: '',
+    actionType: 'run' as ActionType,
+    autoCommit: false,
+  });
+
+  let selectedContext = $derived(contexts.find((c) => c.id === selectedContextId) ?? null);
+
+  onMount(async () => {
+    await loadContexts();
+  });
+
+  async function loadContexts() {
+    loadingContexts = true;
+    try {
+      contexts = await commands.listActionContexts();
+      if (!selectedContextId && contexts.length > 0) {
+        selectedContextId = contexts[0].id;
+      } else if (selectedContextId && !contexts.some((c) => c.id === selectedContextId)) {
+        selectedContextId = contexts.length > 0 ? contexts[0].id : null;
+      }
+      await loadActions();
+    } catch (e) {
+      console.error('Failed to load action contexts:', e);
+    } finally {
+      loadingContexts = false;
+    }
+  }
+
+  async function loadActions() {
+    if (!selectedContext) {
+      actions = [];
+      return;
+    }
+    loadingActions = true;
+    try {
+      actions = await commands.listRepoActions(
+        selectedContext.githubRepo,
+        selectedContext.subpath ?? undefined
+      );
+    } catch (e) {
+      console.error('Failed to load actions:', e);
+      actions = [];
+    } finally {
+      loadingActions = false;
+    }
+  }
+
+  $effect(() => {
+    selectedContextId;
+    loadActions();
+  });
+
+  async function detectActions() {
+    if (!selectedContext) return;
+
+    detecting = true;
+    try {
+      const suggested = await detectRepoActions(
+        selectedContext.githubRepo,
+        selectedContext.subpath ?? undefined
+      );
+
+      const existingCommands = new Set(actions.map((a) => a.command));
+      let nextSortOrder = Math.max(...actions.map((a) => a.sortOrder), 0) + 1;
+
+      let actionsAdded = false;
+      for (const suggestion of suggested) {
+        if (existingCommands.has(suggestion.command)) continue;
+        const newAction = await commands.createRepoAction(
+          selectedContext.githubRepo,
+          selectedContext.subpath ?? undefined,
+          suggestion.name,
+          suggestion.command,
+          suggestion.actionType,
+          nextSortOrder++,
+          suggestion.autoCommit
+        );
+        actions = [...actions, newAction];
+        actionsAdded = true;
+      }
+
+      if (actionsAdded) {
+        window.dispatchEvent(new CustomEvent('project-actions-changed'));
+      }
+
+      contexts = await commands.listActionContexts();
+    } catch (e) {
+      console.error('Failed to detect actions:', e);
+    } finally {
+      detecting = false;
+    }
+  }
+
+  function startAddAction() {
+    editForm = { name: '', command: '', actionType: 'run', autoCommit: false };
+    editingAction = {} as ProjectAction;
+  }
+
+  function startEditAction(action: ProjectAction) {
+    editForm = {
+      name: action.name,
+      command: action.command,
+      actionType: action.actionType as ActionType,
+      autoCommit: action.autoCommit,
+    };
+    editingAction = action;
+  }
+
+  function cancelEdit() {
+    editingAction = null;
+  }
+
+  async function saveAction() {
+    if (!selectedContext || !editForm.name || !editForm.command) return;
+
+    try {
+      if (!editingAction?.id) {
+        const nextSortOrder = Math.max(...actions.map((a) => a.sortOrder), 0) + 1;
+        const newAction = await commands.createRepoAction(
+          selectedContext.githubRepo,
+          selectedContext.subpath ?? undefined,
+          editForm.name,
+          editForm.command,
+          editForm.actionType,
+          nextSortOrder,
+          editForm.autoCommit
+        );
+        actions = [...actions, newAction];
+      } else {
+        const actionId = editingAction.id;
+        await commands.updateProjectAction(
+          actionId,
+          editForm.name,
+          editForm.command,
+          editForm.actionType,
+          editingAction.sortOrder,
+          editForm.autoCommit
+        );
+        actions = actions.map((a) =>
+          a.id === actionId
+            ? {
+                ...a,
+                name: editForm.name,
+                command: editForm.command,
+                actionType: editForm.actionType,
+                autoCommit: editForm.autoCommit,
+              }
+            : a
+        );
+      }
+
+      editingAction = null;
+      window.dispatchEvent(new CustomEvent('project-actions-changed'));
+    } catch (e) {
+      console.error('Failed to save action:', e);
+    }
+  }
+
+  async function deleteAction(actionId: string) {
+    try {
+      await commands.deleteProjectAction(actionId);
+      actions = actions.filter((a) => a.id !== actionId);
+      window.dispatchEvent(new CustomEvent('project-actions-changed'));
+    } catch (e) {
+      console.error('Failed to delete action:', e);
+    }
+  }
+
+  function getActionIcon(actionType: string) {
+    switch (actionType) {
+      case 'prerun':
+        return Zap;
+      case 'build':
+        return Hammer;
+      case 'test':
+        return FlaskConical;
+      case 'format':
+        return Wand2;
+      case 'check':
+        return CheckCircle;
+      case 'run':
+        return Play;
+      case 'cleanUp':
+        return Trash2;
+      default:
+        return Play;
+    }
+  }
+
+  let sortedContexts = $derived.by(() => {
+    return [...contexts].sort((a, b) => {
+      const aDisplay = a.subpath ? `${a.githubRepo}/${a.subpath}` : a.githubRepo;
+      const bDisplay = b.subpath ? `${b.githubRepo}/${b.subpath}` : b.githubRepo;
+      return aDisplay.localeCompare(bDisplay);
+    });
+  });
+
+  let groupedActions = $derived.by(() => {
+    const groups: Record<string, ProjectAction[]> = {
+      prerun: [],
+      run: [],
+      build: [],
+      test: [],
+      format: [],
+      check: [],
+      cleanUp: [],
+    };
+    for (const action of actions) {
+      const type = action.actionType;
+      if (groups[type]) groups[type].push(action);
+    }
+    return groups;
+  });
+</script>
+
+<div class="actions-settings-panel">
+  <div class="panel-intro">
+    <h2>
+      <Play size={16} />
+      Actions
+    </h2>
+    <p>Configure per-repository action commands used across your projects.</p>
+  </div>
+
+  <div class="panel-body">
+    <aside class="sidebar">
+      <div class="sidebar-title">Repos</div>
+      {#if loadingContexts}
+        <div class="loading-side"><Spinner size={14} /> Loading...</div>
+      {:else if contexts.length === 0}
+        <div class="empty-side">No repo contexts yet</div>
+      {:else}
+        <div class="context-list">
+          {#each sortedContexts as context (context.id)}
+            <button
+              class="context-item"
+              class:selected={context.id === selectedContextId}
+              onclick={() => (selectedContextId = context.id)}
+            >
+              <RepoLabel githubRepo={context.githubRepo} subpath={context.subpath} />
+            </button>
+          {/each}
+        </div>
+      {/if}
+    </aside>
+
+    <section class="main-panel">
+      {#if !selectedContext}
+        <div class="empty-main">Select a repo context to configure actions</div>
+      {:else}
+        <div class="actions-header">
+          <button class="secondary-btn" onclick={detectActions} disabled={detecting}>
+            {#if detecting}
+              <Spinner size={14} />
+            {:else}
+              <Zap size={14} />
+            {/if}
+            Detect Actions
+          </button>
+          <button class="primary-btn" onclick={startAddAction}>
+            <Plus size={14} />
+            Add Action
+          </button>
+        </div>
+
+        {#if loadingActions}
+          <div class="loading-state">
+            <Spinner size={24} />
+            <span>Loading...</span>
+          </div>
+        {:else if actions.length === 0}
+          <div class="empty-state">
+            <Play size={32} />
+            <p>No actions configured</p>
+            <p class="empty-hint">Click "Detect Actions" or add one manually</p>
+          </div>
+        {:else}
+          <div class="actions-list">
+            {#each Object.entries(groupedActions) as [type, typeActions]}
+              {#if typeActions.length > 0}
+                <div class="action-group">
+                  <div class="group-header">{type}</div>
+                  {#each typeActions as action (action.id)}
+                    {@const Icon = getActionIcon(action.actionType)}
+                    <div class="action-row">
+                      <div class="action-main">
+                        <Icon size={14} />
+                        <div class="action-details">
+                          <div class="action-name">{action.name}</div>
+                          <div class="action-command">
+                            <Code2 size={12} />
+                            {action.command}
+                          </div>
+                        </div>
+                      </div>
+                      <div class="action-buttons">
+                        <button class="icon-btn" onclick={() => startEditAction(action)}>
+                          <Pencil size={13} />
+                        </button>
+                        <button class="icon-btn danger" onclick={() => deleteAction(action.id)}>
+                          <Trash2 size={13} />
+                        </button>
+                      </div>
+                    </div>
+                  {/each}
+                </div>
+              {/if}
+            {/each}
+          </div>
+        {/if}
+      {/if}
+    </section>
+  </div>
+
+  {#if editingAction}
+    <div class="editor">
+      <input bind:value={editForm.name} placeholder="Action name" />
+      <input bind:value={editForm.command} placeholder="Command" />
+      <select bind:value={editForm.actionType}>
+        <option value="run">run</option>
+        <option value="prerun">prerun</option>
+        <option value="build">build</option>
+        <option value="test">test</option>
+        <option value="format">format</option>
+        <option value="check">check</option>
+        <option value="cleanUp">cleanUp</option>
+      </select>
+      <label class="checkbox-row">
+        <input type="checkbox" bind:checked={editForm.autoCommit} />
+        Auto-commit
+      </label>
+      <div class="editor-buttons">
+        <button class="secondary-btn" onclick={cancelEdit}>Cancel</button>
+        <button class="primary-btn" onclick={saveAction}>
+          <Save size={14} />
+          Save
+        </button>
+      </div>
+    </div>
+  {/if}
+</div>
+
+<style>
+  .actions-settings-panel {
+    height: 100%;
+    min-height: 0;
+    display: flex;
+    flex-direction: column;
+    border: 1px solid var(--border-subtle);
+    border-radius: 12px;
+    overflow: hidden;
+    background: var(--bg-chrome);
+  }
+
+  .panel-intro {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    padding: 12px 14px;
+    border-bottom: 1px solid var(--border-subtle);
+  }
+
+  .panel-intro h2 {
+    margin: 0;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: var(--size-md);
+    font-weight: 600;
+  }
+
+  .panel-intro p {
+    margin: 0;
+    font-size: var(--size-sm);
+    color: var(--text-muted);
+  }
+
+  .icon-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    border: none;
+    border-radius: 6px;
+    background: transparent;
+    color: var(--text-muted);
+    cursor: pointer;
+  }
+
+  .icon-btn:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+  }
+
+  .icon-btn.danger:hover {
+    color: var(--ui-danger);
+  }
+
+  .panel-body {
+    display: grid;
+    grid-template-columns: 260px 1fr;
+    flex: 1;
+    min-height: 0;
+    overflow: hidden;
+  }
+
+  .sidebar {
+    border-right: 1px solid var(--border-subtle);
+    padding: 10px;
+    overflow-y: auto;
+    min-height: 0;
+  }
+
+  .sidebar-title {
+    font-size: var(--size-xs);
+    color: var(--text-muted);
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    margin: 4px 6px 10px;
+  }
+
+  .context-list {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+  }
+
+  .context-item {
+    text-align: left;
+    padding: 8px 10px;
+    border: 1px solid transparent;
+    border-radius: 8px;
+    background: transparent;
+    color: var(--text-primary);
+    cursor: pointer;
+    font-size: var(--size-sm);
+  }
+
+  .context-item:hover {
+    background: var(--bg-hover);
+  }
+
+  .context-item.selected {
+    background: var(--bg-primary);
+    border-color: var(--border-muted);
+  }
+
+  .loading-side,
+  .empty-side,
+  .empty-main,
+  .loading-state,
+  .empty-state {
+    color: var(--text-muted);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+  }
+
+  .main-panel {
+    padding: 14px;
+    overflow-y: auto;
+    min-height: 0;
+  }
+
+  .actions-header {
+    display: flex;
+    justify-content: flex-end;
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+
+  .primary-btn,
+  .secondary-btn {
+    border: 1px solid var(--border-muted);
+    border-radius: 8px;
+    padding: 7px 10px;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    font-size: var(--size-sm);
+    cursor: pointer;
+  }
+
+  .primary-btn {
+    background: var(--ui-accent);
+    border-color: var(--ui-accent);
+    color: white;
+  }
+
+  .secondary-btn {
+    background: var(--bg-primary);
+    color: var(--text-primary);
+  }
+
+  .primary-btn:disabled,
+  .secondary-btn:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  .actions-list {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .action-group {
+    border: 1px solid var(--border-subtle);
+    border-radius: 10px;
+    overflow: hidden;
+  }
+
+  .group-header {
+    background: var(--bg-primary);
+    color: var(--text-muted);
+    font-size: var(--size-xs);
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    padding: 8px 10px;
+  }
+
+  .action-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    padding: 10px;
+    border-top: 1px solid var(--border-subtle);
+  }
+
+  .action-main {
+    display: flex;
+    gap: 8px;
+    align-items: flex-start;
+  }
+
+  .action-name {
+    font-size: var(--size-sm);
+    font-weight: 600;
+  }
+
+  .action-command {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: var(--text-muted);
+    font-family: 'SF Mono', Menlo, Monaco, monospace;
+    font-size: var(--size-xs);
+    margin-top: 3px;
+  }
+
+  .action-buttons {
+    display: flex;
+    gap: 4px;
+  }
+
+  .editor {
+    border-top: 1px solid var(--border-subtle);
+    padding: 12px;
+    display: grid;
+    grid-template-columns: 1fr 1fr auto auto;
+    gap: 8px;
+    align-items: center;
+  }
+
+  .editor input,
+  .editor select {
+    padding: 8px 10px;
+    border-radius: 8px;
+    border: 1px solid var(--border-muted);
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    min-width: 0;
+  }
+
+  .checkbox-row {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    color: var(--text-muted);
+    font-size: var(--size-sm);
+  }
+
+  .editor-buttons {
+    display: inline-flex;
+    gap: 8px;
+    justify-self: end;
+  }
+
+  @media (max-width: 900px) {
+    .panel-body {
+      grid-template-columns: 1fr;
+    }
+
+    .sidebar {
+      border-right: none;
+      border-bottom: 1px solid var(--border-subtle);
+      max-height: 160px;
+    }
+
+    .editor {
+      grid-template-columns: 1fr;
+    }
+
+    .editor-buttons {
+      justify-self: stretch;
+    }
+  }
+</style>
diff --git a/apps/mark/src/lib/features/settings/DoctorSettingsPanel.svelte b/apps/mark/src/lib/features/settings/DoctorSettingsPanel.svelte
new file mode 100644
index 00000000..68aff7ea
--- /dev/null
+++ b/apps/mark/src/lib/features/settings/DoctorSettingsPanel.svelte
@@ -0,0 +1,195 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import { RefreshCw, Stethoscope } from 'lucide-svelte';
+  import Spinner from '../../shared/Spinner.svelte';
+  import DoctorCheckRow from '../doctor/DoctorCheckRow.svelte';
+  import { doctorState, runChecks } from '../doctor/doctor.svelte';
+
+  onMount(() => {
+    void runChecks();
+  });
+
+  /** Tool checks (non-agent). */
+  const toolChecks = $derived(
+    doctorState.report?.checks.filter((c) => !c.id.startsWith('ai-agent-')) ?? []
+  );
+
+  /** Agent checks. */
+  const agentChecks = $derived(
+    doctorState.report?.checks.filter((c) => c.id.startsWith('ai-agent-')) ?? []
+  );
+</script>
+
+<div class="doctor-settings-panel">
+  <div class="panel-intro">
+    <div class="intro-copy">
+      <h2>
+        <Stethoscope size={16} />
+        Doctor
+      </h2>
+      <p>Verify required tools and agent availability for Mark.</p>
+    </div>
+
+    <button class="refresh-btn" disabled={doctorState.loading} onclick={runChecks}>
+      {#if doctorState.loading}
+        <Spinner size={14} />
+      {:else}
+        <RefreshCw size={14} />
+      {/if}
+      Re-run
+    </button>
+  </div>
+
+  <div class="panel-body">
+    {#if doctorState.loading}
+      <div class="loading-state">
+        <Spinner size={24} />
+        <span>Running checks...</span>
+      </div>
+    {:else if doctorState.report}
+      <div class="section">
+        <h3 class="section-label">Tools</h3>
+        <div class="checks-list">
+          {#each toolChecks as check (check.id)}
+            <DoctorCheckRow {check} onFixed={runChecks} />
+          {/each}
+        </div>
+      </div>
+
+      {#if agentChecks.length > 0}
+        <div class="section">
+          <h3 class="section-label">Agents</h3>
+          <div class="checks-list">
+            {#each agentChecks as check (check.id)}
+              <DoctorCheckRow {check} onFixed={runChecks} />
+            {/each}
+          </div>
+        </div>
+      {/if}
+    {:else}
+      <div class="empty-state">No checks are available yet.</div>
+    {/if}
+  </div>
+</div>
+
+<style>
+  .doctor-settings-panel {
+    height: 100%;
+    min-height: 0;
+    display: flex;
+    flex-direction: column;
+    border: 1px solid var(--border-subtle);
+    border-radius: 12px;
+    overflow: hidden;
+    background: var(--bg-chrome);
+  }
+
+  .panel-intro {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    padding: 12px 14px;
+    border-bottom: 1px solid var(--border-subtle);
+  }
+
+  .intro-copy {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    min-width: 0;
+  }
+
+  .panel-intro h2 {
+    margin: 0;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: var(--size-md);
+    font-weight: 600;
+  }
+
+  .panel-intro p {
+    margin: 0;
+    font-size: var(--size-sm);
+    color: var(--text-muted);
+  }
+
+  .panel-body {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    padding: 14px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .section {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .section-label {
+    margin: 0;
+    font-size: var(--size-xs);
+    font-weight: 600;
+    color: var(--text-faint);
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+  }
+
+  .checks-list {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .loading-state,
+  .empty-state {
+    color: var(--text-muted);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    min-height: 160px;
+    font-size: var(--size-sm);
+  }
+
+  .refresh-btn {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 8px 12px;
+    border: 1px solid var(--border-muted);
+    border-radius: 8px;
+    background: transparent;
+    color: var(--text-muted);
+    font-size: var(--size-sm);
+    cursor: pointer;
+    flex-shrink: 0;
+    transition:
+      color 0.1s,
+      border-color 0.1s,
+      background-color 0.1s;
+  }
+
+  .refresh-btn:hover:not(:disabled) {
+    color: var(--text-primary);
+    border-color: var(--border-emphasis);
+    background: color-mix(in srgb, var(--bg-hover) 45%, transparent);
+  }
+
+  .refresh-btn:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  @media (max-width: 920px) {
+    .panel-intro {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+  }
+</style>
diff --git a/apps/mark/src/lib/features/settings/SettingsPage.svelte b/apps/mark/src/lib/features/settings/SettingsPage.svelte
new file mode 100644
index 00000000..8f7d14a5
--- /dev/null
+++ b/apps/mark/src/lib/features/settings/SettingsPage.svelte
@@ -0,0 +1,274 @@
+<script lang="ts">
+  import { ArrowLeft, Play, Stethoscope } from 'lucide-svelte';
+  import { closeSettings, navigation } from '../../navigation.svelte';
+  import ActionsSettingsPanel from './ActionsSettingsPanel.svelte';
+  import DoctorSettingsPanel from './DoctorSettingsPanel.svelte';
+
+  function handleBack() {
+    closeSettings();
+  }
+</script>
+
+<div class="settings-page">
+  <header class="settings-header">
+    <button class="back-btn" onclick={handleBack} title="Back to workspace">
+      <ArrowLeft size={14} />
+      Back
+    </button>
+    <div class="header-text">
+      <h1>Settings</h1>
+    </div>
+  </header>
+
+  <div class="settings-body">
+    <aside class="settings-nav" aria-label="Settings sections">
+      <div class="settings-nav-header">
+        <span class="settings-nav-title">Sections</span>
+      </div>
+
+      <div class="settings-nav-list">
+        <button
+          class="nav-item"
+          class:active={navigation.settingsSection === 'actions'}
+          onclick={() => (navigation.settingsSection = 'actions')}
+        >
+          <div class="nav-main">
+            <Play size={14} />
+            <div class="nav-text">
+              <span class="nav-name">Actions</span>
+              <span class="nav-meta">Providers, prompts, and defaults</span>
+            </div>
+          </div>
+        </button>
+        <button
+          class="nav-item"
+          class:active={navigation.settingsSection === 'doctor'}
+          onclick={() => (navigation.settingsSection = 'doctor')}
+        >
+          <div class="nav-main">
+            <Stethoscope size={14} />
+            <div class="nav-text">
+              <span class="nav-name">Doctor</span>
+              <span class="nav-meta">Environment checks and setup</span>
+            </div>
+          </div>
+        </button>
+      </div>
+    </aside>
+
+    <section class="settings-content">
+      {#if navigation.settingsSection === 'actions'}
+        <ActionsSettingsPanel />
+      {:else}
+        <DoctorSettingsPanel />
+      {/if}
+    </section>
+  </div>
+</div>
+
+<style>
+  .settings-page {
+    flex: 1;
+    min-height: 0;
+    display: flex;
+    flex-direction: column;
+    background: var(--bg-primary);
+  }
+
+  .settings-header {
+    display: flex;
+    align-items: center;
+    gap: 14px;
+    padding: 14px 16px;
+    border-bottom: 1px solid color-mix(in srgb, var(--border-subtle) 60%, transparent);
+    background: color-mix(in srgb, var(--bg-chrome) 82%, transparent);
+  }
+
+  .back-btn {
+    border: 1px solid transparent;
+    border-radius: 8px;
+    background: transparent;
+    color: var(--text-muted);
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 9px;
+    cursor: pointer;
+    flex-shrink: 0;
+    font-size: var(--size-sm);
+    transition:
+      color 0.12s ease,
+      background-color 0.12s ease,
+      border-color 0.12s ease;
+  }
+
+  .back-btn:hover {
+    color: var(--text-primary);
+    background: var(--bg-hover);
+    border-color: color-mix(in srgb, var(--border-subtle) 60%, transparent);
+  }
+
+  .header-text {
+    min-width: 0;
+  }
+
+  .header-text h1 {
+    margin: 0;
+    font-size: calc(var(--size-xl) * 1.1);
+    line-height: 1.2;
+  }
+
+  .settings-body {
+    flex: 1;
+    min-height: 0;
+    display: grid;
+    grid-template-columns: 220px 1fr;
+    overflow: hidden;
+  }
+
+  .settings-nav {
+    border-right: 1px solid color-mix(in srgb, var(--border-subtle) 60%, transparent);
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+    background: color-mix(in srgb, var(--bg-chrome) 75%, transparent);
+  }
+
+  .settings-nav-header {
+    padding: 14px 12px 8px;
+  }
+
+  .settings-nav-title {
+    display: inline-block;
+    font-size: calc(var(--size-xs) - 1px);
+    font-weight: 600;
+    color: var(--text-faint);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+  }
+
+  .settings-nav-list {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    padding: 0 8px 10px;
+    overflow: auto;
+  }
+
+  .nav-item {
+    border: none;
+    border-radius: 8px;
+    background: transparent;
+    color: var(--text-primary);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    padding: 8px 10px;
+    cursor: pointer;
+    text-align: left;
+    font-size: var(--size-sm);
+    transition: all 0.15s ease;
+  }
+
+  .nav-item:focus-visible {
+    outline: 2px solid var(--ui-accent);
+    outline-offset: -1px;
+  }
+
+  .nav-item:hover {
+    background: var(--ui-selection);
+  }
+
+  .nav-item.active {
+    background: var(--bg-hover);
+  }
+
+  .nav-main {
+    display: flex;
+    align-items: flex-start;
+    gap: 10px;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .nav-main :global(svg) {
+    flex-shrink: 0;
+    width: 16px;
+    color: inherit;
+    stroke: currentColor;
+  }
+
+  .nav-text {
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+  }
+
+  .nav-name {
+    font-size: var(--size-sm);
+    font-weight: 600;
+    color: inherit;
+    line-height: 1.2;
+  }
+
+  .nav-meta {
+    font-size: calc(var(--size-xs) - 1px);
+    color: var(--text-faint);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .nav-item.active .nav-meta {
+    color: var(--text-muted);
+  }
+
+  .settings-content {
+    min-height: 0;
+    padding: 14px;
+    overflow: hidden;
+  }
+
+  @media (max-width: 920px) {
+    .settings-header {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+
+    .settings-body {
+      grid-template-columns: 1fr;
+      grid-template-rows: auto 1fr;
+    }
+
+    .settings-nav {
+      border-right: 0;
+      border-bottom: 1px solid color-mix(in srgb, var(--border-subtle) 60%, transparent);
+      background: color-mix(in srgb, var(--bg-chrome) 65%, transparent);
+    }
+
+    .settings-nav-header {
+      display: none;
+    }
+
+    .settings-nav-list {
+      flex-direction: row;
+      align-items: center;
+      padding: 8px;
+      gap: 6px;
+      overflow-x: auto;
+    }
+
+    .nav-item {
+      width: auto;
+      min-width: max-content;
+      padding: 8px 12px;
+    }
+
+    .nav-meta {
+      display: none;
+    }
+  }
+</style>
diff --git a/apps/mark/src/lib/navigation.svelte.ts b/apps/mark/src/lib/navigation.svelte.ts
index f48b0901..ac9b7e5e 100644
--- a/apps/mark/src/lib/navigation.svelte.ts
+++ b/apps/mark/src/lib/navigation.svelte.ts
@@ -2,8 +2,10 @@
  * Lightweight client-side navigation state.
  *
  * Controls which view is shown in the main content area:
- * - `selectedProjectId === null` → ProjectsList (landing page)
- * - `selectedProjectId === <id>` → ProjectHome filtered to that project
+ * - `activeView === 'settings'` → Settings page
+ * - `activeView === 'workspace'` + `selectedProjectId === null` → ProjectsList (landing page)
+ * - `activeView === 'workspace'` + `selectedProjectId === <id>` → ProjectHome filtered to that project
+ * - `settingsSection` selects which settings panel is shown
  *
  * The last viewed project is persisted so the user returns to it on relaunch.
  */
@@ -14,10 +16,18 @@ import { projectStateStore } from './stores/projectState.svelte';
 
 const LAST_PROJECT_STORE_KEY = 'last-viewed-project';
 
+export type SettingsSection = 'actions' | 'doctor';
+
 export const navigation = $state({
+  activeView: 'workspace' as 'workspace' | 'settings',
   selectedProjectId: null as string | null,
+  settingsSection: 'actions' as SettingsSection,
 });
 
+function showWorkspaceView(): void {
+  navigation.activeView = 'workspace';
+}
+
 /**
  * Persist the current navigation target.
  * Saves `null` for the home screen or the project ID.
@@ -55,6 +65,7 @@ export async function initNavigation(): Promise<void> {
 
 /** Navigate to a specific project's detail view. */
 export function selectProject(projectId: string): void {
+  showWorkspaceView();
   navigation.selectedProjectId = projectId;
   persistLastProject(projectId);
   // Mark the project as read when navigating to it, but only if it's not already read
@@ -65,6 +76,7 @@ export function selectProject(projectId: string): void {
 
 /** Navigate to a project and scroll to a specific branch card. */
 export function selectProjectAndBranch(projectId: string, branchId: string): void {
+  showWorkspaceView();
   const alreadyOnProject = navigation.selectedProjectId === projectId;
   navigation.selectedProjectId = projectId;
   persistLastProject(projectId);
@@ -85,6 +97,18 @@ export function selectProjectAndBranch(projectId: string, branchId: string): voi
 
 /** Navigate back to the projects list (landing page). */
 export function goHome(): void {
+  showWorkspaceView();
   navigation.selectedProjectId = null;
   persistLastProject(null);
 }
+
+/** Show the dedicated settings view and select a settings section. */
+export function openSettings(section: SettingsSection = 'actions'): void {
+  navigation.settingsSection = section;
+  navigation.activeView = 'settings';
+}
+
+/** Return from settings to the workspace view (project or home). */
+export function closeSettings(): void {
+  showWorkspaceView();
+}