diff --git a/src/features/providers/hooks/useCredentials.ts b/src/features/providers/hooks/useCredentials.ts
index 8b7c73b8..739e200f 100644
--- a/src/features/providers/hooks/useCredentials.ts
+++ b/src/features/providers/hooks/useCredentials.ts
@@ -5,7 +5,6 @@ import {
   deleteProviderConfig,
   type ProviderStatus,
   checkAllProviderStatus,
-  restartApp,
 } from "@/features/providers/api/credentials";
 import type { ProviderFieldValue } from "@/shared/types/providers";
 
@@ -17,7 +16,6 @@ interface UseCredentialsReturn {
   getConfig: (providerId: string) => Promise<ProviderFieldValue[]>;
   save: (key: string, value: string) => Promise<void>;
   remove: (providerId: string) => Promise<void>;
-  restart: () => Promise<void>;
   completeNativeSetup: () => Promise<void>;
 }
 
@@ -77,10 +75,6 @@ export function useCredentials(): UseCredentialsReturn {
     [refreshStatuses],
   );
 
-  const restart = useCallback(async () => {
-    await restartApp();
-  }, []);
-
   const completeNativeSetup = useCallback(async () => {
     await refreshStatuses();
     setNeedsRestart(true);
@@ -94,7 +88,6 @@ export function useCredentials(): UseCredentialsReturn {
     getConfig,
     save,
     remove,
-    restart,
     completeNativeSetup,
   };
 }
diff --git a/src/features/settings/ui/AgentProviderCard.tsx b/src/features/settings/ui/AgentProviderCard.tsx
index d4df5e03..866b31f9 100644
--- a/src/features/settings/ui/AgentProviderCard.tsx
+++ b/src/features/settings/ui/AgentProviderCard.tsx
@@ -5,6 +5,7 @@ import { Button } from "@/shared/ui/button";
 import { Spinner } from "@/shared/ui/spinner";
 import { getProviderIcon } from "@/shared/ui/icons/ProviderIcons";
 import { IconCheck, IconAlertTriangle, IconPlus } from "@tabler/icons-react";
+import { Tooltip, TooltipTrigger, TooltipContent } from "@/shared/ui/tooltip";
 import {
   checkAgentInstalled,
   checkAgentAuth,
@@ -25,9 +26,13 @@ const MAX_OUTPUT_LINES = 50;
 
 interface AgentProviderCardProps {
   provider: ProviderDisplayInfo;
+  onScrollToModels?: () => void;
 }
 
-export function AgentProviderCard({ provider }: AgentProviderCardProps) {
+export function AgentProviderCard({
+  provider,
+  onScrollToModels,
+}: AgentProviderCardProps) {
   const { t } = useTranslation(["settings", "common"]);
   const [setupPhase, setSetupPhase] = useState<SetupPhase>("idle");
   const [setupOutput, setSetupOutput] = useState<OutputLine[]>([]);
@@ -41,7 +46,9 @@ export function AgentProviderCard({ provider }: AgentProviderCardProps) {
   const unlistenRef = useRef<(() => void) | null>(null);
 
   const icon = getProviderIcon(provider.id, "size-6");
-  const isBuiltIn = provider.status === "built_in";
+  const isBuiltIn =
+    provider.status === "built_in" || provider.status === "needs_model";
+  const needsModelProvider = provider.status === "needs_model";
   const isActive = setupPhase !== "idle";
   const hasInstallCommand = !!provider.installCommand;
   const hasAuthCommand = !!provider.authCommand;
@@ -224,7 +231,7 @@ export function AgentProviderCard({ provider }: AgentProviderCardProps) {
   if (provider.showOnlyWhenInstalled && isInstalled !== true) return null;
 
   const isReady =
-    isBuiltIn ||
+    (isBuiltIn && !needsModelProvider) ||
     (isInstalled === true && !hasAuthCommand) ||
     (isInstalled === true && isAuthenticated === true);
   const needsAuth =
@@ -232,6 +239,28 @@ export function AgentProviderCard({ provider }: AgentProviderCardProps) {
   const needsInstall = isInstalled === false && hasInstallCommand;
 
   function renderStatusIndicator() {
+    if (needsModelProvider && onScrollToModels) {
+      return (
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <Button
+              type="button"
+              variant="ghost"
+              size="icon-xs"
+              onClick={onScrollToModels}
+              className="flex-shrink-0 text-muted-foreground"
+              aria-label={t("providers.agents.connectModelLabel")}
+            >
+              <IconPlus className="size-4" />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent side="left" showArrow={false}>
+            {t("providers.agents.connectModelTooltip")}
+          </TooltipContent>
+        </Tooltip>
+      );
+    }
+
     if (isBuiltIn || isReady) {
       return (
         <div className="flex h-6 flex-shrink-0 items-center">
diff --git a/src/features/settings/ui/ModelProviderRow.tsx b/src/features/settings/ui/ModelProviderRow.tsx
index 7a6751db..2ecdaa04 100644
--- a/src/features/settings/ui/ModelProviderRow.tsx
+++ b/src/features/settings/ui/ModelProviderRow.tsx
@@ -64,7 +64,6 @@ export function ModelProviderRow({
   const [setupOutput, setSetupOutput] = useState<SetupOutputLine[]>([]);
   const [setupError, setSetupError] = useState("");
   const [showSavedState, setShowSavedState] = useState(false);
-  const [preserveSetupLayout, setPreserveSetupLayout] = useState(false);
   const setupLineCounter = useRef(0);
   const hasLoadedConfig = useRef(false);
   const shouldRestorePanelFocus = useRef(false);
@@ -156,7 +155,6 @@ export function ModelProviderRow({
     setEditingKey(null);
     setError("");
     setShowSavedState(false);
-    setPreserveSetupLayout(false);
 
     const unlisten = await onModelSetupOutput(provider.id, appendSetupOutput);
 
@@ -179,7 +177,6 @@ export function ModelProviderRow({
     setExpanded((current) => {
       if (current) {
         setShowSavedState(false);
-        setPreserveSetupLayout(false);
       }
       return !current;
     });
@@ -275,7 +272,6 @@ export function ModelProviderRow({
       }
       await loadConfig();
       setShowSavedState(true);
-      setPreserveSetupLayout(true);
     } catch (nextError) {
       setError(
         nextError instanceof Error ? nextError.message : "Failed to save",
@@ -291,7 +287,6 @@ export function ModelProviderRow({
       setEditingKey(null);
       setError("");
       setShowSavedState(false);
-      setPreserveSetupLayout(false);
     } catch (nextError) {
       setError(
         nextError instanceof Error ? nextError.message : "Failed to remove",
@@ -378,7 +373,7 @@ export function ModelProviderRow({
       );
     }
 
-    if (hasFields && isConnected && !preserveSetupLayout) {
+    if (hasFields && isConnected) {
       return (
         <ConnectedFieldsPanel
           panelRef={panelRef}
diff --git a/src/features/settings/ui/ProvidersSettings.tsx b/src/features/settings/ui/ProvidersSettings.tsx
index 38d34ca5..0a3d66b7 100644
--- a/src/features/settings/ui/ProvidersSettings.tsx
+++ b/src/features/settings/ui/ProvidersSettings.tsx
@@ -1,9 +1,9 @@
-import { useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Button } from "@/shared/ui/button";
 import { Separator } from "@/shared/ui/separator";
 import { Skeleton } from "@/shared/ui/skeleton";
-import { IconChevronDown, IconRefresh } from "@tabler/icons-react";
+import { IconChevronDown } from "@tabler/icons-react";
 import {
   getAgentProviders,
   getModelProviders,
@@ -20,8 +20,10 @@ import type {
 function resolveStatus(
   entry: ProviderCatalogEntry,
   configuredIds: Set<string>,
+  hasModelProvider: boolean,
 ): ProviderSetupStatus {
-  if (entry.id === "goose") return "built_in";
+  if (entry.id === "goose")
+    return hasModelProvider ? "built_in" : "needs_model";
   if (entry.category === "agent") return "not_installed";
   if (configuredIds.has(entry.id)) return "connected";
   return "not_configured";
@@ -30,18 +32,38 @@ function resolveStatus(
 function toDisplayInfo(
   entries: ProviderCatalogEntry[],
   configuredIds: Set<string>,
+  hasModelProvider: boolean,
 ): ProviderDisplayInfo[] {
   return entries.map((entry) => ({
     ...entry,
-    status: resolveStatus(entry, configuredIds),
+    status: resolveStatus(entry, configuredIds, hasModelProvider),
   }));
 }
 
-export function ProvidersSettings() {
+interface ProvidersSettingsProps {
+  scrollContainerRef?: React.RefObject<HTMLElement | null>;
+  onNeedsRestart?: () => void;
+}
+
+export function ProvidersSettings({
+  scrollContainerRef,
+  onNeedsRestart,
+}: ProvidersSettingsProps) {
   const { t } = useTranslation(["settings", "common"]);
   const [showAllModels, setShowAllModels] = useState(false);
   const [modelOrder, setModelOrder] = useState<string[] | null>(null);
 
+  const modelsSectionRef = useRef<HTMLElement>(null);
+  const scrollRafRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    return () => {
+      if (scrollRafRef.current !== null) {
+        cancelAnimationFrame(scrollRafRef.current);
+      }
+    };
+  }, []);
+
   const {
     configuredIds,
     loading,
@@ -50,18 +72,75 @@ export function ProvidersSettings() {
     getConfig,
     save,
     remove,
-    restart,
     completeNativeSetup,
   } = useCredentials();
 
+  useEffect(() => {
+    if (needsRestart) onNeedsRestart?.();
+  }, [needsRestart, onNeedsRestart]);
+
+  const modelProviderIds = useMemo(
+    () => new Set(getModelProviders().map((m) => m.id)),
+    [],
+  );
+
+  const hasModelProvider = useMemo(
+    () => [...configuredIds].some((id) => modelProviderIds.has(id)),
+    [configuredIds, modelProviderIds],
+  );
+
+  const scrollToModels = useCallback(() => {
+    const target = modelsSectionRef.current;
+    if (!target) return;
+
+    if (scrollRafRef.current !== null) {
+      cancelAnimationFrame(scrollRafRef.current);
+      scrollRafRef.current = null;
+    }
+
+    const scrollEl = scrollContainerRef?.current;
+    if (!scrollEl) {
+      target.scrollIntoView({ behavior: "smooth" });
+      return;
+    }
+
+    const targetTop =
+      target.getBoundingClientRect().top -
+      scrollEl.getBoundingClientRect().top +
+      scrollEl.scrollTop -
+      16;
+    const start = scrollEl.scrollTop;
+    const distance = targetTop - start;
+    const duration = 500;
+    let startTime: number | null = null;
+
+    function easeInOut(p: number) {
+      return p < 0.5 ? 4 * p * p * p : 1 - (-2 * p + 2) ** 3 / 2;
+    }
+
+    const step = (timestamp: number) => {
+      if (!startTime) startTime = timestamp;
+      const elapsed = timestamp - startTime;
+      const progress = Math.min(elapsed / duration, 1);
+      scrollEl.scrollTop = start + distance * easeInOut(progress);
+      if (progress < 1) {
+        scrollRafRef.current = requestAnimationFrame(step);
+      } else {
+        scrollRafRef.current = null;
+      }
+    };
+
+    scrollRafRef.current = requestAnimationFrame(step);
+  }, [scrollContainerRef]);
+
   const agents = useMemo(
-    () => toDisplayInfo(getAgentProviders(), configuredIds),
-    [configuredIds],
+    () => toDisplayInfo(getAgentProviders(), configuredIds, hasModelProvider),
+    [configuredIds, hasModelProvider],
   );
 
   const allModels = useMemo(
-    () => toDisplayInfo(getModelProviders(), configuredIds),
-    [configuredIds],
+    () => toDisplayInfo(getModelProviders(), configuredIds, hasModelProvider),
+    [configuredIds, hasModelProvider],
   );
 
   const sortedModels = useMemo(() => {
@@ -138,16 +217,6 @@ export function ProvidersSettings() {
         {t("providers.description")}
       </p>
 
-      {needsRestart && (
-        <div className="mt-3 flex items-center gap-3 rounded-lg border border-accent bg-background-accent/30 px-3 py-2.5">
-          <p className="flex-1 text-sm">{t("providers.restartMessage")}</p>
-          <Button type="button" size="sm" onClick={() => void restart()}>
-            <IconRefresh className="size-3.5" />
-            {t("providers.restartButton")}
-          </Button>
-        </div>
-      )}
-
       <Separator className="my-4" />
 
       <section>
@@ -162,14 +231,20 @@ export function ProvidersSettings() {
 
         <div className="grid grid-cols-2 gap-3">
           {agents.map((agent) => (
-            <AgentProviderCard key={agent.id} provider={agent} />
+            <AgentProviderCard
+              key={agent.id}
+              provider={agent}
+              onScrollToModels={
+                agent.id === "goose" ? scrollToModels : undefined
+              }
+            />
           ))}
         </div>
       </section>
 
       <Separator className="my-6" />
 
-      <section>
+      <section ref={modelsSectionRef} className="scroll-mt-4">
         <div className="mb-3">
           <h4 className="text-sm font-semibold">
             {t("providers.models.title")}
diff --git a/src/features/settings/ui/SettingsModal.tsx b/src/features/settings/ui/SettingsModal.tsx
index 0a9f447a..f501dc07 100644
--- a/src/features/settings/ui/SettingsModal.tsx
+++ b/src/features/settings/ui/SettingsModal.tsx
@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, useCallback, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { cn } from "@/shared/lib/cn";
 import { type LocalePreference, useLocale } from "@/shared/i18n";
@@ -78,6 +78,15 @@ export function SettingsModal({
   const [deletingProject, setDeletingProject] = useState<ProjectInfo | null>(
     null,
   );
+  const contentScrollRef = useRef<HTMLDivElement>(null);
+  const [showRestartCard, setShowRestartCard] = useState(false);
+  const [restartCardVisible, setRestartCardVisible] = useState(false);
+  const restartDismissedRef = useRef(false);
+
+  const handleNeedsRestart = useCallback(() => {
+    if (restartDismissedRef.current) return;
+    setShowRestartCard(true);
+  }, []);
 
   // Trigger entrance animations after mount
   useEffect(() => {
@@ -124,7 +133,20 @@ export function SettingsModal({
     }
   };
 
-  // Content transition on section change
+  useEffect(() => {
+    if (!showRestartCard) return;
+    const timer = setTimeout(() => setRestartCardVisible(true), 50);
+    return () => clearTimeout(timer);
+  }, [showRestartCard]);
+
+  useEffect(() => {
+    if (activeSection !== "providers" && showRestartCard) {
+      setRestartCardVisible(false);
+      setShowRestartCard(false);
+      restartDismissedRef.current = true;
+    }
+  }, [activeSection, showRestartCard]);
+
   // biome-ignore lint/correctness/useExhaustiveDependencies: activeSection triggers the transition effect intentionally
   useEffect(() => {
     setIsTransitioning(true);
@@ -152,263 +174,292 @@ export function SettingsModal({
       {/* biome-ignore lint/a11y/useKeyWithClickEvents: stopPropagation on inner container is not a meaningful interaction */}
       {/* biome-ignore lint/a11y/noStaticElementInteractions: click handler only prevents backdrop dismiss propagation */}
       <div
-        className={cn(
-          "flex h-[600px] w-full max-w-3xl overflow-hidden rounded-xl border bg-background shadow-modal transition-all duration-500 ease-out",
-          isLoaded ? "opacity-100 scale-100" : "opacity-0 scale-95",
-          isTransitioning ? "scale-[0.98]" : "scale-100",
-        )}
+        className="flex w-full max-w-3xl flex-col gap-2"
         onClick={(e) => e.stopPropagation()}
       >
-        {/* Sidebar */}
         <div
           className={cn(
-            "flex w-44 flex-col border-r bg-muted/50 transition-all duration-700 ease-out",
-            isLoaded ? "opacity-100 translate-x-0" : "opacity-0 -translate-x-2",
+            "flex h-[600px] w-full overflow-hidden rounded-xl border bg-background shadow-modal transition-all duration-500 ease-out",
+            isLoaded ? "opacity-100 scale-100" : "opacity-0 scale-95",
+            isTransitioning ? "scale-[0.98]" : "scale-100",
           )}
         >
+          {/* Sidebar */}
           <div
             className={cn(
-              "px-4 py-4 transition-all duration-500 ease-out",
+              "flex w-44 flex-col border-r bg-muted/50 transition-all duration-700 ease-out",
               isLoaded
                 ? "opacity-100 translate-x-0"
                 : "opacity-0 -translate-x-2",
             )}
           >
-            <h2 className="text-sm font-semibold">{t("title")}</h2>
+            <div
+              className={cn(
+                "px-4 py-4 transition-all duration-500 ease-out",
+                isLoaded
+                  ? "opacity-100 translate-x-0"
+                  : "opacity-0 -translate-x-2",
+              )}
+            >
+              <h2 className="text-sm font-semibold">{t("title")}</h2>
+            </div>
+            <nav className="flex flex-col gap-1 px-2">
+              {navItems.map((item, index) => (
+                <Button
+                  type="button"
+                  variant="ghost"
+                  size="sm"
+                  key={item.id}
+                  onClick={() => setActiveSection(item.id)}
+                  className={cn(
+                    "w-full justify-start rounded-lg px-3 py-2 transition-all duration-600 ease-out",
+                    activeSection === item.id
+                      ? "bg-background text-foreground shadow-sm hover:bg-background"
+                      : "text-muted-foreground hover:bg-accent/50 hover:text-foreground duration-300",
+                    isLoaded
+                      ? "opacity-100 translate-x-0"
+                      : "opacity-0 translate-x-4",
+                  )}
+                  style={{
+                    transitionDelay: isLoaded ? "0ms" : `${index * 40 + 300}ms`,
+                  }}
+                >
+                  <item.icon className="size-4" />
+                  {item.label}
+                </Button>
+              ))}
+            </nav>
           </div>
-          <nav className="flex flex-col gap-1 px-2">
-            {navItems.map((item, index) => (
-              <Button
-                type="button"
-                variant="ghost"
-                size="sm"
-                key={item.id}
-                onClick={() => setActiveSection(item.id)}
-                className={cn(
-                  "w-full justify-start rounded-lg px-3 py-2 transition-all duration-600 ease-out",
-                  activeSection === item.id
-                    ? "bg-background text-foreground shadow-sm hover:bg-background"
-                    : "text-muted-foreground hover:bg-accent/50 hover:text-foreground duration-300",
-                  isLoaded
-                    ? "opacity-100 translate-x-0"
-                    : "opacity-0 translate-x-4",
-                )}
-                style={{
-                  transitionDelay: isLoaded ? "0ms" : `${index * 40 + 300}ms`,
-                }}
-              >
-                <item.icon className="size-4" />
-                {item.label}
-              </Button>
-            ))}
-          </nav>
-        </div>
-
-        {/* Content */}
-        <div className="relative flex-1 overflow-y-auto">
-          <Button
-            type="button"
-            variant="ghost"
-            size="icon-xs"
-            onClick={onClose}
-            aria-label={t("common:actions.close")}
-            className="absolute right-4 top-4 z-10 rounded-md text-muted-foreground hover:text-foreground"
-          >
-            <X className="size-4" />
-          </Button>
 
+          {/* Content */}
           <div
-            className={cn(
-              "px-6 py-4 transition-all duration-400 ease-out",
-              isTransitioning
-                ? "opacity-0 translate-y-2"
-                : "opacity-100 translate-y-0",
-            )}
+            ref={contentScrollRef}
+            className="relative flex-1 overflow-y-auto"
           >
+            <Button
+              type="button"
+              variant="ghost"
+              size="icon-xs"
+              onClick={onClose}
+              aria-label={t("common:actions.close")}
+              className="absolute right-4 top-4 z-10 rounded-md text-muted-foreground hover:text-foreground"
+            >
+              <X className="size-4" />
+            </Button>
+
             <div
               className={cn(
-                "transition-all duration-600 ease-out",
-                isLoaded
-                  ? "opacity-100 translate-y-0"
-                  : "opacity-0 translate-y-4",
+                "px-6 py-4 transition-all duration-400 ease-out",
+                isTransitioning
+                  ? "opacity-0 translate-y-2"
+                  : "opacity-100 translate-y-0",
               )}
-              style={{
-                transitionDelay: isLoaded ? "400ms" : "0ms",
-              }}
             >
-              {activeSection === "appearance" && <AppearanceSettings />}
-              {activeSection === "providers" && <ProvidersSettings />}
-              {activeSection === "doctor" && <DoctorSettings />}
-              {activeSection === "general" && (
-                <div className="space-y-6">
-                  <div>
-                    <h3 className="text-lg font-semibold font-display tracking-tight">
-                      {t("general.title")}
-                    </h3>
-                    <p className="mt-1 text-sm text-muted-foreground">
-                      {t("general.description")}
-                    </p>
-                  </div>
-
-                  <div className="space-y-3">
+              <div
+                className={cn(
+                  "transition-all duration-600 ease-out",
+                  isLoaded
+                    ? "opacity-100 translate-y-0"
+                    : "opacity-0 translate-y-4",
+                )}
+                style={{
+                  transitionDelay: isLoaded ? "400ms" : "0ms",
+                }}
+              >
+                {activeSection === "appearance" && <AppearanceSettings />}
+                {activeSection === "providers" && (
+                  <ProvidersSettings
+                    scrollContainerRef={contentScrollRef}
+                    onNeedsRestart={handleNeedsRestart}
+                  />
+                )}
+                {activeSection === "doctor" && <DoctorSettings />}
+                {activeSection === "general" && (
+                  <div className="space-y-6">
                     <div>
-                      <h4 className="text-sm font-semibold">
-                        {t("general.language.label")}
-                      </h4>
-                      <p className="mt-1 text-xs text-muted-foreground">
-                        {t("general.language.description")}
+                      <h3 className="text-lg font-semibold font-display tracking-tight">
+                        {t("general.title")}
+                      </h3>
+                      <p className="mt-1 text-sm text-muted-foreground">
+                        {t("general.description")}
                       </p>
                     </div>
-                    <Select
-                      value={preference}
-                      onValueChange={(value) =>
-                        void setLocalePreference(value as LocalePreference)
-                      }
-                    >
-                      <SelectTrigger className="w-full max-w-sm">
-                        <SelectValue />
-                      </SelectTrigger>
-                      <SelectContent>
-                        <SelectItem value="system">
-                          {t("general.language.system", {
-                            language: systemLocaleLabel,
-                          })}
-                        </SelectItem>
-                        <SelectItem value="en">
-                          {t("general.language.english")}
-                        </SelectItem>
-                        <SelectItem value="es">
-                          {t("general.language.spanish")}
-                        </SelectItem>
-                      </SelectContent>
-                    </Select>
-                  </div>
-                </div>
-              )}
-              {activeSection === "projects" && (
-                <div className="space-y-6">
-                  <div>
-                    <h3 className="text-lg font-semibold font-display tracking-tight">
-                      {t("projects.title")}
-                    </h3>
-                    <p className="mt-1 text-sm text-muted-foreground">
-                      {t("projects.description")}
-                    </p>
-                  </div>
 
-                  {/* Archived Projects */}
-                  <div className="space-y-3">
-                    <h3 className="text-sm font-semibold">
-                      {t("projects.sectionTitle")}
-                    </h3>
-                    {!loadingArchived && archivedProjects.length === 0 && (
-                      <p className="text-xs text-muted-foreground">
-                        {t("projects.empty")}
-                      </p>
-                    )}
-                    {archivedProjects.map((project) => (
-                      <div
-                        key={project.id}
-                        className="flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2"
+                    <div className="space-y-3">
+                      <div>
+                        <h4 className="text-sm font-semibold">
+                          {t("general.language.label")}
+                        </h4>
+                        <p className="mt-1 text-xs text-muted-foreground">
+                          {t("general.language.description")}
+                        </p>
+                      </div>
+                      <Select
+                        value={preference}
+                        onValueChange={(value) =>
+                          void setLocalePreference(value as LocalePreference)
+                        }
                       >
-                        <div className="flex items-center gap-2 min-w-0">
-                          <span
-                            className="inline-block w-2 h-2 rounded-full flex-shrink-0"
-                            style={{ backgroundColor: project.color }}
-                          />
-                          <span className="text-sm truncate">
-                            {project.name}
-                          </span>
+                        <SelectTrigger className="w-full max-w-sm">
+                          <SelectValue />
+                        </SelectTrigger>
+                        <SelectContent>
+                          <SelectItem value="system">
+                            {t("general.language.system", {
+                              language: systemLocaleLabel,
+                            })}
+                          </SelectItem>
+                          <SelectItem value="en">
+                            {t("general.language.english")}
+                          </SelectItem>
+                          <SelectItem value="es">
+                            {t("general.language.spanish")}
+                          </SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </div>
+                  </div>
+                )}
+                {activeSection === "projects" && (
+                  <div className="space-y-6">
+                    <div>
+                      <h3 className="text-lg font-semibold font-display tracking-tight">
+                        {t("projects.title")}
+                      </h3>
+                      <p className="mt-1 text-sm text-muted-foreground">
+                        {t("projects.description")}
+                      </p>
+                    </div>
+
+                    {/* Archived Projects */}
+                    <div className="space-y-3">
+                      <h3 className="text-sm font-semibold">
+                        {t("projects.sectionTitle")}
+                      </h3>
+                      {!loadingArchived && archivedProjects.length === 0 && (
+                        <p className="text-xs text-muted-foreground">
+                          {t("projects.empty")}
+                        </p>
+                      )}
+                      {archivedProjects.map((project) => (
+                        <div
+                          key={project.id}
+                          className="flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2"
+                        >
+                          <div className="flex items-center gap-2 min-w-0">
+                            <span
+                              className="inline-block w-2 h-2 rounded-full flex-shrink-0"
+                              style={{ backgroundColor: project.color }}
+                            />
+                            <span className="text-sm truncate">
+                              {project.name}
+                            </span>
+                          </div>
+                          <div className="flex items-center gap-1.5 flex-shrink-0">
+                            <Button
+                              type="button"
+                              variant="outline"
+                              size="xs"
+                              onClick={() => handleRestoreProject(project.id)}
+                            >
+                              {t("common:actions.restore")}
+                            </Button>
+                            <Button
+                              type="button"
+                              variant="ghost"
+                              size="xs"
+                              onClick={() => setDeletingProject(project)}
+                              className="text-destructive hover:text-destructive hover:bg-destructive/10"
+                            >
+                              {t("common:actions.delete")}
+                            </Button>
+                          </div>
                         </div>
-                        <div className="flex items-center gap-1.5 flex-shrink-0">
+                      ))}
+                    </div>
+                  </div>
+                )}
+                {activeSection === "chats" && (
+                  <div className="space-y-6">
+                    <div>
+                      <h3 className="text-lg font-semibold font-display tracking-tight">
+                        {t("chats.title")}
+                      </h3>
+                      <p className="mt-1 text-sm text-muted-foreground">
+                        {t("chats.description")}
+                      </p>
+                    </div>
+
+                    <div className="space-y-3">
+                      <h3 className="text-sm font-semibold">
+                        {t("chats.sectionTitle")}
+                      </h3>
+                      {!loadingArchivedChats && archivedChats.length === 0 && (
+                        <p className="text-xs text-muted-foreground">
+                          {t("chats.empty")}
+                        </p>
+                      )}
+                      {archivedChats.map((session) => (
+                        <div
+                          key={session.id}
+                          className="flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2"
+                        >
+                          <div className="min-w-0">
+                            <div className="truncate text-sm">
+                              {getDisplaySessionTitle(
+                                session.title,
+                                t("common:session.defaultTitle"),
+                              )}
+                            </div>
+                            <p className="truncate text-xs text-muted-foreground">
+                              {session.projectId
+                                ? t("chats.types.project")
+                                : t("chats.types.standalone")}
+                            </p>
+                          </div>
                           <Button
                             type="button"
                             variant="outline"
                             size="xs"
-                            onClick={() => handleRestoreProject(project.id)}
+                            onClick={() => handleRestoreChat(session.id)}
+                            className="flex-shrink-0"
                           >
                             {t("common:actions.restore")}
                           </Button>
-                          <Button
-                            type="button"
-                            variant="ghost"
-                            size="xs"
-                            onClick={() => setDeletingProject(project)}
-                            className="text-destructive hover:text-destructive hover:bg-destructive/10"
-                          >
-                            {t("common:actions.delete")}
-                          </Button>
                         </div>
-                      </div>
-                    ))}
+                      ))}
+                    </div>
                   </div>
-                </div>
-              )}
-              {activeSection === "chats" && (
-                <div className="space-y-6">
+                )}
+                {activeSection === "about" && (
                   <div>
                     <h3 className="text-lg font-semibold font-display tracking-tight">
-                      {t("chats.title")}
+                      {t("about.title")}
                     </h3>
                     <p className="mt-1 text-sm text-muted-foreground">
-                      {t("chats.description")}
+                      {t("about.description")}
                     </p>
                   </div>
-
-                  <div className="space-y-3">
-                    <h3 className="text-sm font-semibold">
-                      {t("chats.sectionTitle")}
-                    </h3>
-                    {!loadingArchivedChats && archivedChats.length === 0 && (
-                      <p className="text-xs text-muted-foreground">
-                        {t("chats.empty")}
-                      </p>
-                    )}
-                    {archivedChats.map((session) => (
-                      <div
-                        key={session.id}
-                        className="flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2"
-                      >
-                        <div className="min-w-0">
-                          <div className="truncate text-sm">
-                            {getDisplaySessionTitle(
-                              session.title,
-                              t("common:session.defaultTitle"),
-                            )}
-                          </div>
-                          <p className="truncate text-xs text-muted-foreground">
-                            {session.projectId
-                              ? t("chats.types.project")
-                              : t("chats.types.standalone")}
-                          </p>
-                        </div>
-                        <Button
-                          type="button"
-                          variant="outline"
-                          size="xs"
-                          onClick={() => handleRestoreChat(session.id)}
-                          className="flex-shrink-0"
-                        >
-                          {t("common:actions.restore")}
-                        </Button>
-                      </div>
-                    ))}
-                  </div>
-                </div>
-              )}
-              {activeSection === "about" && (
-                <div>
-                  <h3 className="text-lg font-semibold font-display tracking-tight">
-                    {t("about.title")}
-                  </h3>
-                  <p className="mt-1 text-sm text-muted-foreground">
-                    {t("about.description")}
-                  </p>
-                </div>
-              )}
+                )}
+              </div>
             </div>
           </div>
         </div>
+
+        {showRestartCard && (
+          <div
+            className={cn(
+              "flex w-full items-center rounded-2xl border bg-background px-4 py-2.5 shadow-modal transition-all duration-300 ease-out",
+              restartCardVisible
+                ? "opacity-100 translate-y-0"
+                : "opacity-0 translate-y-2",
+            )}
+          >
+            <p className="text-sm text-muted-foreground">
+              {t("providers.restartMessage")}
+            </p>
+          </div>
+        )}
       </div>
 
       <AlertDialog
diff --git a/src/shared/i18n/locales/en/settings.json b/src/shared/i18n/locales/en/settings.json
index 85a66483..6c344062 100644
--- a/src/shared/i18n/locales/en/settings.json
+++ b/src/shared/i18n/locales/en/settings.json
@@ -95,16 +95,18 @@
   },
   "providers": {
     "agents": {
-      "description": "Agents handle your requests using their own tools and models",
+      "connectModelLabel": "Connect a model provider for Goose",
+      "connectModelTooltip": "Connect a model provider",
+      "description": "Each agent handles your requests differently. External agents bring their own models. Goose uses the model providers below.",
       "installLabel": "Install {{name}}",
       "signIn": "Sign in",
       "signInLabel": "Sign in to {{name}}",
-      "title": "Agents"
+      "title": "Agent Providers"
     },
-    "description": "Connect agents and AI models to use with Goose",
+    "description": "Connect an agent to get started. Goose uses the model providers below; other agents bring their own.",
     "disconnect": "Disconnect",
     "models": {
-      "description": "AI models that power Goose. Expand a provider to review what it needs. Connect signs in with an existing account, while Set up saves API keys or other provider settings.",
+      "description": "Connect a model provider to power the Goose agent. You need at least one connected to use Goose.",
       "notSet": "Not set",
       "setup": {
         "connected": {
@@ -128,9 +130,8 @@
           "oauthTerminal": "Run `goose configure` in your terminal to finish sign-in."
         }
       },
-      "title": "Models"
+      "title": "Model Providers"
     },
-    "restartButton": "Restart now",
     "restartMessage": "Restart to apply credential changes.",
     "saved": "Saved",
     "showFewer": "Show fewer",
diff --git a/src/shared/i18n/locales/es/settings.json b/src/shared/i18n/locales/es/settings.json
index 8d325d6b..c08d1c6c 100644
--- a/src/shared/i18n/locales/es/settings.json
+++ b/src/shared/i18n/locales/es/settings.json
@@ -95,16 +95,18 @@
   },
   "providers": {
     "agents": {
-      "description": "Los agentes manejan tus solicitudes usando sus propias herramientas y modelos",
+      "connectModelLabel": "Conectar un proveedor de modelos para Goose",
+      "connectModelTooltip": "Conectar un proveedor de modelos",
+      "description": "Cada agente maneja tus solicitudes de manera diferente. Los agentes externos traen sus propios modelos. Goose usa los proveedores de modelos de abajo.",
       "installLabel": "Instalar {{name}}",
       "signIn": "Iniciar sesión",
       "signInLabel": "Iniciar sesión en {{name}}",
-      "title": "Agentes"
+      "title": "Proveedores de agentes"
     },
-    "description": "Conecta agentes y modelos de IA para usar con Goose",
+    "description": "Conecta un agente para comenzar. Goose usa los proveedores de modelos de abajo; otros agentes traen los suyos.",
     "disconnect": "Desconectar",
     "models": {
-      "description": "Modelos de IA que alimentan a Goose. Expande un proveedor para revisar lo que necesita. Conectar inicia sesión con una cuenta existente, mientras que Configurar guarda claves API u otros ajustes del proveedor.",
+      "description": "Conecta un proveedor de modelos para alimentar al agente Goose. Necesitas al menos uno conectado para usar Goose.",
       "notSet": "No configurado",
       "setup": {
         "connected": {
@@ -128,9 +130,8 @@
           "oauthTerminal": "Ejecuta `goose configure` en tu terminal para terminar de iniciar sesión."
         }
       },
-      "title": "Modelos"
+      "title": "Proveedores de modelos"
     },
-    "restartButton": "Reiniciar ahora",
     "restartMessage": "Reinicia para aplicar los cambios de credenciales.",
     "saved": "Guardado",
     "showFewer": "Mostrar menos",
diff --git a/src/shared/types/providers.ts b/src/shared/types/providers.ts
index 1c11da26..2e7ef5a5 100644
--- a/src/shared/types/providers.ts
+++ b/src/shared/types/providers.ts
@@ -50,6 +50,7 @@ export interface ProviderCatalogEntry {
 export type ProviderSetupStatus =
   | "built_in"
   | "connected"
+  | "needs_model"
   | "not_installed"
   | "not_configured"
   | "installing"
diff --git a/src/shared/ui/tooltip.tsx b/src/shared/ui/tooltip.tsx
index c85599d6..e92fe347 100644
--- a/src/shared/ui/tooltip.tsx
+++ b/src/shared/ui/tooltip.tsx
@@ -35,9 +35,12 @@ function TooltipTrigger({
 function TooltipContent({
   className,
   sideOffset = 0,
+  showArrow = true,
   children,
   ...props
-}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
+}: React.ComponentProps<typeof TooltipPrimitive.Content> & {
+  showArrow?: boolean;
+}) {
   return (
     <TooltipPrimitive.Portal>
       <TooltipPrimitive.Content
@@ -50,7 +53,9 @@ function TooltipContent({
         {...props}
       >
         {children}
-        <TooltipPrimitive.Arrow className="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
+        {showArrow && (
+          <TooltipPrimitive.Arrow className="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
+        )}
       </TooltipPrimitive.Content>
     </TooltipPrimitive.Portal>
   );