Fix slow Iris concepts diagrams and oversized service-key screenshots

assets/css/index.css

@@ -129,7 +129,11 @@ section.prose {
 }
 
 .context-map-shape {
-  @apply fill-white stroke-redis-red-500;
+  @apply fill-white;
+  /* Red-to-grey diagonal gradient (defined in context-map.js), matching the
+     node border on the mermaid-derived diagrams elsewhere on these pages
+     (mermaid's "neo" look), not the flat brand redis-red-500. */
+  stroke: url(#context-map-border-gradient);
   stroke-width: 1;
   transition: fill 0.15s ease, stroke 0.15s ease;
 }
@@ -144,12 +148,13 @@ section.prose {
 }
 
 .context-map-node.is-hovered .context-map-shape {
-  @apply stroke-redis-red-500;
+  stroke: url(#context-map-border-gradient);
   stroke-width: 2;
 }
 
 .context-map-node.is-selected .context-map-shape {
-  @apply fill-red-50 stroke-redis-red-500;
+  @apply fill-red-50;
+  stroke: url(#context-map-border-gradient);
   stroke-width: 2;
 }
 
@@ -184,7 +189,7 @@ section.prose {
 }
 
 .context-map-node:focus-visible .context-map-shape {
-  @apply stroke-redis-red-500;
+  stroke: url(#context-map-border-gradient);
   stroke-width: 2;
 }
 

content/develop/ai/context-engine/agent-memory/overview.md

@@ -18,12 +18,7 @@ Agent Memory has two writers. Your application writes session events as they hap
 - **Summarizes** older events into a compact summary once the session passes a configured threshold, so a long conversation doesn't blow the model's context window.
 - **Extracts** long-term memories, facts and preferences worth keeping, and writes them as separate, searchable records with vector embeddings.
 
-```mermaid {width="80%"}
-graph LR
-    A["Application"] -->|"Add session event<br/>(synchronous)"| B["Session memory"]
-    B -.->|"Background<br/>extraction"| C["Long-term memory"]
-    A -->|"Search"| C
-```
+{{< image filename="images/ai/context-engine/agent-memory-writers.svg" alt="An application writes session events synchronously to session memory. Background extraction moves durable information into long-term memory, which the application can search directly." width="700" >}}
 
 Both run asynchronously, to keep session writes fast. Extraction also weighs a new memory against existing memories before writing it. Rather than rejecting anything that looks similar, it uses model judgment to decide whether a near-identical memory is a true duplicate or is meaningfully different and worth keeping too.
 

content/develop/ai/context-engine/concepts/_index.md

@@ -16,20 +16,7 @@ Redis Iris sits between your agent and your data. It's one system. Your agent as
 
 Use Redis Iris when you want agents to respond with cached answers instead of repeat model calls, recall what they've learned across turns and sessions, and act on live business data. Iris builds and maintains that infrastructure for you.
 
-```mermaid {width="90%"}
-graph TD
-    subgraph iris["Redis Iris"]
-        A["Store memories"]
-        B["Cache answers"]
-        C["Retrieve context"]
-    end
-    Agent["Agent"] <--> iris
-    A --> D[("Reach Redis or any connected database")]
-    B --> D
-    C --> D
-    style D width:320px
-    style iris fill:#ffffff
-```
+{{< image filename="images/ai/context-engine/iris-mental-model.svg" alt="An agent connects to Redis Iris, which stores memories, caches answers, and retrieves context, all backed by Redis or a connected database." width="650" >}}
 
 ## The mental model
 

content/develop/ai/context-engine/context-retriever/concepts.md

@@ -15,12 +15,7 @@ weight: 3
 
 Context Retriever gives an agent a fixed, predefined set of callable tools to use instead of direct query access. Your database, its schema, and its own access controls stay unchanged. Context Retriever sits between the agent and that database, as an added layer.
 
-```mermaid {width="60%"}
-graph TD
-    Agent["Agent"] <-->|"MCP tools"| CR["Context Retriever"]
-    CR --> D[("Database")]
-    style D width:320px
-```
+{{< image filename="images/ai/context-engine/context-retriever-layer.svg" alt="An agent calls Context Retriever through MCP tools, and Context Retriever queries the database." width="160" >}}
 
 ## Direct data access vs. governed tool-calling
 

content/develop/ai/context-engine/data-integration/_index.md

@@ -69,12 +69,7 @@ RDI pipelines run in two phases:
 - **Initial sync**: Reads a full snapshot of your source data and loads it into the target Redis database.
 - **Streaming**: Captures changes as they happen and applies them to Redis within seconds of the source change.
 
-```mermaid {width="70%"}
-flowchart LR
-    A[(Source database)] -->|Initial sync| B[(Redis)]
-    A -->|CDC stream| B
-    B --> C[Agent]
-```
+{{< image filename="images/ai/context-engine/rdi-sync-flow.svg" alt="A source database syncs to Redis through an initial sync and a continuous CDC stream. Redis serves the agent." width="500" >}}
 
 Data is transformed from relational rows into Redis hashes or JSON documents as part of the pipeline, with no coding required. You define what data to sync and how to map it using configuration, and RDI handles the rest.
 

content/develop/ai/context-engine/langcache/concepts.md

@@ -15,14 +15,7 @@ weight: 3
 
 LangCache matches an incoming prompt against stored entries by similarity, not exact text, so two prompts that are close enough are treated as the same request. This similarity match lets *What are Product A's features?* and *Tell me about Product A's capabilities* share a cached response.
 
-```mermaid {width="90%"}
-graph LR
-    A["Incoming prompt"] --> B{"Similarity above<br/>threshold?"}
-    B -->|Yes| C(["Return cached response<br/>(milliseconds)"])
-    B -->|No| D["Call the LLM"]
-    D --> E["Store prompt and response<br/>as a new cache entry"]
-    E --> F(["Return the LLM response"])
-```
+{{< image filename="images/ai/context-engine/langcache-semantic-flow.svg" alt="An incoming prompt is checked against a similarity threshold. A match returns a cached response in milliseconds. A miss calls the LLM, stores the prompt and response as a new cache entry, then returns the LLM response." width="850" >}}
 
 If you've used a traditional, exact-key cache before, similarity matching behaves differently from what you're used to. Semantic caching gives up the guarantee that a cache hit is always correct, in exchange for the ability to match paraphrased or related questions. That trade-off is what makes the cache useful for an agent. Users and agents rarely phrase the same request the same way twice. Matching by meaning, instead of exact text, turns repeat requests into fast, cache-served responses.
 

content/operate/iris/agent-memory/create-service.md

@@ -45,7 +45,7 @@ From here:
 
     After Redis Cloud creates your Agent Memory service, a window containing your Agent Memory service key will appear. Select **Copy** to copy the key to your clipboard.
 
-    {{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=80% >}}
+    {{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=40% >}}
 
     {{<warning>}}
 This is the only time the value of the user key is available. Save it to a secure location before closing the dialog box.<br/><br/>
@@ -236,7 +236,7 @@ When you are done setting the details of your Agent Memory service, select **Cre
 
 A window containing your Agent Memory service key will appear. Select **Copy** to copy the key to your clipboard.
 
-{{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=80% >}}
+{{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=40% >}}
 
 {{<warning>}}
 This is the only time the value of the user key is available. Save it to a secure location before closing the dialog box.<br/><br/>

content/operate/iris/agent-memory/view-service.md

@@ -181,13 +181,13 @@ To generate a new service key:
 
 1. Enter a new name for your API key.
 
-    {{<image filename="images/rc/agent-memory-add-api-key.png" alt="The Add API key window." >}}
+    {{<image filename="images/rc/agent-memory-add-api-key.png" alt="The Add API key window." width="37.5%" >}}
 
 1. Select **Generate key** to generate your new API key.
 
 1. The new key will appear in a dialog box. Select **Copy** to copy the key to the clipboard.
 
-    {{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=80% >}}
+    {{<image filename="images/rc/agent-memory-service-key.png" alt="The Agent Memory service key window. Use the Copy button to save the service key to the clipboard." width=40% >}}
 
     {{<warning>}}
 This is the only time the value of the user key is available. Save it to a secure location before closing the dialog box. <br/><br/>

content/operate/iris/context-retriever/view-admin-keys.md

@@ -41,13 +41,13 @@ To generate a new admin key:
 
 1. Enter a name for your admin key.
 
-    {{<image filename="images/rc/context-retriever-add-admin-key.png" alt="The Add admin key window." >}}
+    {{<image filename="images/rc/context-retriever-add-admin-key.png" alt="The Add admin key window." width="37.5%" >}}
 
 1. Select **Generate key** to generate your new admin key.
 
 1. The new key will appear in a dialog box. Select **Copy** to copy the key to the clipboard.
 
-    {{<image filename="images/rc/context-retriever-admin-key.png" alt="The Context Retriever admin key window. Use the Copy button to save the admin key to the clipboard." width=80% >}}
+    {{<image filename="images/rc/context-retriever-admin-key.png" alt="The Context Retriever admin key window. Use the Copy button to save the admin key to the clipboard." width=40% >}}
 
     {{<warning>}}
 This is the only time the value of the admin key is available. Save it to a secure location before closing the dialog box.<br/><br/>

content/operate/iris/langcache/create-service.md

@@ -47,7 +47,7 @@ From here:
 
     After Redis Cloud creates your LangCache service, a window containing your LangCache service key will appear. Select **Copy** to copy the key to your clipboard. 
 
-    {{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." >}}
+    {{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." width="37.5%" >}}
 
     {{<warning>}}
 This is the only time the value of the user key is available. Save it to a secure location before closing the dialog box.<br/><br/>
@@ -132,7 +132,7 @@ When you are done setting the details of your LangCache service, select **Create
 
 A window containing your LangCache service key will appear. Select **Copy** to copy the key to your clipboard. 
 
-{{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." >}}
+{{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." width="37.5%" >}}
 
 {{<warning>}}
 This is the only time the value of the user key is available. Save it to a secure location before closing the dialog box.<br/><br/>

content/operate/iris/langcache/view-edit-cache.md

@@ -60,7 +60,7 @@ To generate a new service key:
 
 1. The new key will appear in a dialog box. Select **Copy** to copy the key to the clipboard.
 
-    {{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." >}}
+    {{<image filename="images/rc/langcache-service-key.png" alt="The LangCache service key window. Use the Copy button to save the service key to the clipboard." width="37.5%" >}}
 
     {{<warning>}}
 After you generate a new service key, calls to the LangCache API with the old key will fail. <br/><br/>