docs(ai-agents): wire up router screenshots

Use the Ask AI gif, add light/dark variants for the picker and settings
toggle, and drop the routing-instructions image (the settings screenshot
already shows it).

Author: tatianainama

guides/ai-agents/ai-router.mdx

@@ -16,9 +16,8 @@ The router compares each agent's description, instructions, data access, and ver
   The router only chooses **between agents the user can already access**. It never widens an agent's data access or bypasses permissions — it only changes *which* of the user's available agents answers a given question.
 </Note>
 
-{/* TODO: add screenshot of the "Ask AI" router landing page (hero input + "Finding the right agent…" state) */}
 <Frame>
-  <img src="/images/guides/ai-agents/ai-router-ask-ai.png" alt="Ask AI router landing page" />
+  <img src="/images/guides/ai-agents/ai-router-ask-ai.gif" alt="Ask AI router landing page" />
 </Frame>
 
 ## When the router runs
@@ -27,9 +26,9 @@ The router needs **at least two agents you can access** in a project. With a sin
 
 When the router is confident, it routes your question straight to the best agent and starts the conversation. When it isn't, it shows a short picker with the recommended agent highlighted so you can choose.
 
-{/* TODO: add screenshot of the "Which agent should answer?" picker with the Recommended badge */}
 <Frame>
-  <img src="/images/guides/ai-agents/ai-router-picker.png" alt="Picker showing candidate agents" />
+  <img className="block dark:hidden" src="/images/guides/ai-agents/ai-router-picker.png" alt="Picker showing candidate agents" />
+  <img className="hidden dark:block" src="/images/guides/ai-agents/ai-router-picker-dark.png" alt="Picker showing candidate agents" />
 </Frame>
 
 If you've set a [default agent](/guides/ai-agents/using-ai-agents#faqs), it opens first even when the router is enabled. Pick **Auto** from the agent dropdown to let the router decide instead.
@@ -55,9 +54,9 @@ The router is configured at the **organization level** and requires **Organizati
   </Step>
 </Steps>
 
-{/* TODO: add screenshot of the Ask AI → General settings page showing the "Enable AI features for users" and "AI Router" toggles */}
 <Frame>
-  <img src="/images/guides/ai-agents/ai-router-settings-toggle.png" alt="AI Router toggle in Ask AI general settings" />
+  <img className="block dark:hidden" src="/images/guides/ai-agents/ai-router-settings-toggle.png" alt="AI Router toggle in Ask AI general settings" />
+  <img className="hidden dark:block" src="/images/guides/ai-agents/ai-router-settings-toggle-dark.png" alt="AI Router toggle in Ask AI general settings" />
 </Frame>
 
 ## Routing instructions
@@ -76,11 +75,6 @@ By default the router decides on its own, but you can give it **routing instruct
   </Step>
 </Steps>
 
-{/* TODO: add screenshot of the Routing instructions editor with an @-tagged agent */}
-<Frame>
-  <img src="/images/guides/ai-agents/ai-router-instructions.png" alt="Routing instructions editor" />
-</Frame>
-
 A few things to keep in mind:
 
 - **Rules are advisory.** They guide the router's choice but **never override an agent's access restrictions**. A rule can only point to agents the user can already access.