diff --git a/apps/renderer/src/components/ChatView.tsx b/apps/renderer/src/components/ChatView.tsx
index 985f7aefd3db7d65897ea7c7fb799f355dc45370..96483ea70e142f6caea464a2259ce6579a034dd5 100644
--- a/apps/renderer/src/components/ChatView.tsx
+++ b/apps/renderer/src/components/ChatView.tsx
@@ -113,6 +113,7 @@ export default function ChatView() {
   const [isModelMenuOpen, setIsModelMenuOpen] = useState(false);
   const [selectedEffort, setSelectedEffort] =
     useState<string>(DEFAULT_REASONING);
+  const [isSwitchingRuntimeMode, setIsSwitchingRuntimeMode] = useState(false);
   const [respondingRequestIds, setRespondingRequestIds] = useState<string[]>(
     [],
   );
@@ -210,6 +211,35 @@ export default function ChatView() {
           sandboxMode: "workspace-write",
         } as const);
 
+  const handleRuntimeModeChange = async (
+    mode: "approval-required" | "full-access",
+  ) => {
+    if (mode === state.runtimeMode) return;
+    dispatch({ type: "SET_RUNTIME_MODE", mode });
+    if (!api) return;
+
+    const sessionIds = state.threads
+      .map((t) => t.session)
+      .filter(
+        (s): s is NonNullable<typeof s> =>
+          s !== null && s.status !== "closed",
+      )
+      .map((s) => s.sessionId);
+
+    if (sessionIds.length === 0) return;
+
+    setIsSwitchingRuntimeMode(true);
+    try {
+      await Promise.all(
+        sessionIds.map((id) =>
+          api.providers.stopSession({ sessionId: id }).catch(() => undefined),
+        ),
+      );
+    } finally {
+      setIsSwitchingRuntimeMode(false);
+    }
+  };
+
   // Auto-scroll on new messages
   const messageCount = activeThread?.messages.length ?? 0;
   const workLogCount = workLogEntries.length;
@@ -775,6 +805,83 @@ export default function ChatView() {
                     />
                   </svg>
                 </label>
+
+                {/* Divider */}
+                <div className="mx-0.5 h-4 w-px bg-white/[0.08]" />
+
+                {/* Runtime mode toggle */}
+                <button
+                  type="button"
+                  className="inline-flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 text-[13px] text-[#a0a0a0]/70 transition-colors duration-150 hover:bg-white/[0.06] hover:text-[#d0d0d0]"
+                  disabled={isSwitchingRuntimeMode}
+                  onClick={() =>
+                    void handleRuntimeModeChange(
+                      state.runtimeMode === "full-access"
+                        ? "approval-required"
+                        : "full-access",
+                    )
+                  }
+                  title={
+                    state.runtimeMode === "full-access"
+                      ? "Full access — click to require approvals"
+                      : "Approval required — click for full access"
+                  }
+                >
+                  {state.runtimeMode === "full-access" ? (
+                    <svg
+                      width="14"
+                      height="14"
+                      viewBox="0 0 14 14"
+                      fill="none"
+                      aria-hidden="true"
+                    >
+                      <rect
+                        x="2"
+                        y="5.5"
+                        width="10"
+                        height="7"
+                        rx="1.5"
+                        stroke="currentColor"
+                        strokeWidth="1.3"
+                      />
+                      <path
+                        d="M9.5 5.5V4a2.5 2.5 0 0 0-5 0"
+                        stroke="currentColor"
+                        strokeWidth="1.3"
+                        strokeLinecap="round"
+                      />
+                    </svg>
+                  ) : (
+                    <svg
+                      width="14"
+                      height="14"
+                      viewBox="0 0 14 14"
+                      fill="none"
+                      aria-hidden="true"
+                    >
+                      <rect
+                        x="2"
+                        y="5.5"
+                        width="10"
+                        height="7"
+                        rx="1.5"
+                        stroke="currentColor"
+                        strokeWidth="1.3"
+                      />
+                      <path
+                        d="M4.5 5.5V4a2.5 2.5 0 0 1 5 0v1.5"
+                        stroke="currentColor"
+                        strokeWidth="1.3"
+                        strokeLinecap="round"
+                      />
+                    </svg>
+                  )}
+                  <span>
+                    {state.runtimeMode === "full-access"
+                      ? "Full access"
+                      : "Supervised"}
+                  </span>
+                </button>
               </div>
 
               {/* Right side: send / stop button */}
diff --git a/apps/renderer/src/components/Sidebar.tsx b/apps/renderer/src/components/Sidebar.tsx
index 0cdaa14b4a5b6a2869fb647d309f2f58fe029c68..c00da63e544efa41ae221903d6d1a3d995248359 100644
--- a/apps/renderer/src/components/Sidebar.tsx
+++ b/apps/renderer/src/components/Sidebar.tsx
@@ -4,6 +4,7 @@ import { readNativeApi } from "../session-logic";
 import { useStore } from "../store";
 import type { Project } from "../types";
 
+
 function formatRelativeTime(iso: string): string {
   const diff = Date.now() - new Date(iso).getTime();
   const minutes = Math.floor(diff / 60_000);
@@ -28,7 +29,6 @@ export default function Sidebar() {
   const [addingProject, setAddingProject] = useState(false);
   const [newCwd, setNewCwd] = useState("");
   const [isPickingFolder, setIsPickingFolder] = useState(false);
-  const [isSwitchingRuntimeMode, setIsSwitchingRuntimeMode] = useState(false);
 
   const handleAddProject = () => {
     const cwd = newCwd.trim();
@@ -80,43 +80,6 @@ export default function Sidebar() {
     }
   };
 
-  const handleRuntimeModeChange = useCallback(
-    async (mode: "approval-required" | "full-access") => {
-      if (mode === state.runtimeMode) return;
-
-      dispatch({
-        type: "SET_RUNTIME_MODE",
-        mode,
-      });
-
-      if (!api) return;
-
-      const sessionIds = state.threads
-        .map((thread) => thread.session)
-        .filter(
-          (session): session is NonNullable<typeof session> =>
-            session !== null && session.status !== "closed",
-        )
-        .map((session) => session.sessionId);
-
-      if (sessionIds.length === 0) {
-        return;
-      }
-
-      setIsSwitchingRuntimeMode(true);
-      try {
-        await Promise.all(
-          sessionIds.map((sessionId) =>
-            api.providers.stopSession({ sessionId }).catch(() => undefined),
-          ),
-        );
-      } finally {
-        setIsSwitchingRuntimeMode(false);
-      }
-    },
-    [api, dispatch, state.runtimeMode, state.threads],
-  );
-
   useEffect(() => {
     const onWindowKeyDown = (event: KeyboardEvent) => {
       const isNewThreadShortcut =
@@ -189,43 +152,6 @@ export default function Sidebar() {
         </button>
       </div>
 
-      <div className="px-3 pb-3">
-        <div className="rounded-lg border border-white/[0.08] bg-white/[0.03] p-2">
-          <p className="px-1 text-[10px] font-medium uppercase tracking-[0.08em] text-[#a0a0a0]/60">
-            Runtime mode
-          </p>
-          <p className="px-1 pt-0.5 pb-2 text-[10px] text-[#a0a0a0]/45">
-            Switching restarts live sessions.
-          </p>
-          <div className="grid grid-cols-2 gap-1">
-            <button
-              type="button"
-              className={`rounded-md px-2 py-1.5 text-[11px] transition-colors duration-150 ${
-                state.runtimeMode === "approval-required"
-                  ? "bg-white/12 text-white"
-                  : "text-[#a0a0a0]/70 hover:bg-white/[0.06]"
-              }`}
-              disabled={isSwitchingRuntimeMode}
-              onClick={() => void handleRuntimeModeChange("approval-required")}
-            >
-              Approval required
-            </button>
-            <button
-              type="button"
-              className={`rounded-md px-2 py-1.5 text-[11px] transition-colors duration-150 ${
-                state.runtimeMode === "full-access"
-                  ? "bg-white/12 text-white"
-                  : "text-[#a0a0a0]/70 hover:bg-white/[0.06]"
-              }`}
-              disabled={isSwitchingRuntimeMode}
-              onClick={() => void handleRuntimeModeChange("full-access")}
-            >
-              Full access
-            </button>
-          </div>
-        </div>
-      </div>
-
       {/* Project list */}
       <nav className="flex-1 overflow-y-auto px-2">
         {state.projects.map((project) => {