Update setup banner: navigate to settings#ai & Dyad Pro option (#1361)

<!-- This is an auto-generated description by cubic. -->

## Summary by cubic
Updated the setup banner to navigate to Settings and auto-scroll to the
AI Providers section, and added a Dyad Pro setup option to streamline
onboarding.

- **New Features**
  - Added “Setup Dyad Pro” card with logo; opens Dyad Pro signup.
- “Other providers” now jumps to Settings → Provider section with smooth
scroll.
  - OpenRouter setup card updated with new teal styling.

- **Refactors**
- Introduced useScrollAndNavigateTo hook to navigate, scroll, and set
active section.
- Centralized active section state via activeSettingsSectionAtom (used
by SettingsList).
  - SetupProviderCard supports a new “dyad” variant styling.

<!-- End of auto-generated description by cubic. -->

src/hooks/useScrollAndNavigateTo.ts

@@ -0,0 +1,49 @@
+import { useCallback } from "react";
+import { useNavigate } from "@tanstack/react-router";
+import { useSetAtom } from "jotai";
+import { activeSettingsSectionAtom } from "@/atoms/viewAtoms";
+
+type ScrollOptions = {
+  behavior?: ScrollBehavior;
+  block?: ScrollLogicalPosition;
+  inline?: ScrollLogicalPosition;
+  onScrolled?: (id: string, element: HTMLElement) => void;
+};
+
+/**
+ * Returns an async function that navigates to the given route, then scrolls the element with the provided id into view.
+ */
+export function useScrollAndNavigateTo(
+  to: string = "/settings",
+  options?: ScrollOptions,
+) {
+  const navigate = useNavigate();
+  const setActiveSection = useSetAtom(activeSettingsSectionAtom);
+
+  return useCallback(
+    async (id: string) => {
+      await navigate({ to });
+      const element = document.getElementById(id);
+      if (element) {
+        element.scrollIntoView({
+          behavior: options?.behavior ?? "smooth",
+          block: options?.block ?? "start",
+          inline: options?.inline,
+        });
+        setActiveSection(id);
+        options?.onScrolled?.(id, element);
+        return true;
+      }
+      return false;
+    },
+    [
+      navigate,
+      to,
+      options?.behavior,
+      options?.block,
+      options?.inline,
+      options?.onScrolled,
+      setActiveSection,
+    ],
+  );
+}