<svg viewBox="0 0 1228 700" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="diagram-title diagram-desc">
  <title id="diagram-title">How Opportunities senses signals and prioritizes what to build</title>
  <desc id="diagram-desc">A SENSE step continuously scans the product and fans out to a fleet of specialized agents. Each agent draws on its own data sources, listed in a tile directly below it, and the agent fleet includes a coming-soon column for custom agents that plug into your own systems via MCP. All agents converge into a PRIORITIZE step that ranks opportunities and surfaces what to build next.</desc>

  <defs>
    <marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="8" markerHeight="8" orient="auto-start-reverse">
      <path d="M0,0 L10,5 L0,10 Z" fill="#13294b" />
    </marker>
  </defs>

  <!-- ============ Column geometry ============ -->
  <!-- 7 columns, tile width 144, gap 16, pitch 160.
       Left edges:  84, 244, 404, 564, 724, 884, 1044
       Centers:     156, 316, 476, 636, 796, 956, 1116
       Canvas center x = 636 (SENSE / PRIORITIZE centered on the column span). -->

  <!-- ============ 1 — SENSE node (top, centered) ============ -->
  <g>
    <circle cx="636" cy="40" r="13" fill="#1e61f0" />
    <text x="636" y="45" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="13" font-weight="600" fill="#ffffff">1</text>
    <rect x="508" y="66" width="256" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="636" y="94" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="16" font-weight="600" fill="#13294b" letter-spacing="0.6">SENSE</text>
    <text x="636" y="114" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="12" font-weight="400" fill="#6f7480">Continuously scan your product</text>
    <text x="636" y="129" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="12" font-weight="400" fill="#6f7480">for signals and gaps.</text>
  </g>

  <!-- ============ Fan-out from SENSE to each agent column ============ -->
  <!-- Vertical drop from SENSE to the distribution bus -->
  <line x1="636" y1="142" x2="636" y2="172" stroke="#13294b" stroke-width="1.5" />
  <!-- Horizontal distribution bus spanning the 7 column centers (156 .. 1116) -->
  <line x1="156" y1="172" x2="1116" y2="172" stroke="#13294b" stroke-width="1.5" />
  <!-- Drops into each agent column top (agent text block starts at y=208) -->
  <line x1="156"  y1="172" x2="156"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="316"  y1="172" x2="316"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="476"  y1="172" x2="476"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="636"  y1="172" x2="636"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="796"  y1="172" x2="796"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="956"  y1="172" x2="956"  y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />
  <line x1="1116" y1="172" x2="1116" y2="211" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />

  <!-- ============ Left eyebrow: AGENT FLEET ============ -->
  <text x="20" y="232"
        font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
        font-size="10" font-weight="600" fill="#6f7480" letter-spacing="1.2">AGENT</text>
  <text x="20" y="246"
        font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
        font-size="10" font-weight="600" fill="#6f7480" letter-spacing="1.2">FLEET</text>

  <!-- ============ Agent fleet row (text-only nodes, centered per column) ============ -->
  <!-- Title lines y=228 / y=244, desc lines y=262 / y=276. -->

  <!-- Agent 1: Session Replay Agent -->
  <g>
    <text x="156" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Session Replay</text>
    <text x="156" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Agent</text>
    <text x="156" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Finds UX friction and</text>
    <text x="156" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">journey breakdowns.</text>
  </g>

  <!-- Agent 2: Dashboard Agent -->
  <g>
    <text x="316" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Dashboard</text>
    <text x="316" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Agent</text>
    <text x="316" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Explains metric movement,</text>
    <text x="316" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">anomalies, and trends.</text>
  </g>

  <!-- Agent 3: AI Feedback Agent -->
  <g>
    <text x="476" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">AI Feedback</text>
    <text x="476" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Agent</text>
    <text x="476" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Synthesizes feedback from</text>
    <text x="476" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">users and customers.</text>
  </g>

  <!-- Agent 4: Web Vitals & Network Agent -->
  <g>
    <text x="636" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Web Vitals &amp;</text>
    <text x="636" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Network Agent</text>
    <text x="636" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Investigates performance,</text>
    <text x="636" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">latency, and errors.</text>
  </g>

  <!-- Agent 5: Competitive Analysis Agent -->
  <g>
    <text x="796" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Competitive</text>
    <text x="796" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Analysis Agent</text>
    <text x="796" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Finds market gaps,</text>
    <text x="796" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">positioning, and trends.</text>
  </g>

  <!-- Agent 6: Agent Trace Quality Agent -->
  <g>
    <text x="956" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Agent Trace</text>
    <text x="956" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#1e61f0">Quality Agent</text>
    <text x="956" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Analyzes AI traces, tool</text>
    <text x="956" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">usage, and failure modes.</text>
  </g>

  <!-- Agent 7: Custom Agents with Your MCPs (coming soon, muted) -->
  <g>
    <text x="1116" y="228" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#6f7480">Custom Agents</text>
    <text x="1116" y="244" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, sans-serif"
          font-size="12.5" font-weight="600" fill="#6f7480">with Your MCPs</text>
    <text x="1116" y="262" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">Plug in your systems and</text>
    <text x="1116" y="276" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="11" font-weight="400" fill="#6f7480">proprietary data.</text>
    <!-- COMING SOON pill -->
    <rect x="1074" y="285" width="84" height="16" rx="8" fill="#F8F9FB" stroke="#dedfe2" stroke-width="1" />
    <text x="1116" y="296" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, sans-serif"
          font-size="9" font-weight="600" fill="#6f7480" letter-spacing="0.8">COMING SOON</text>
  </g>

  <!-- ============ Vertical agent -> data-source connectors ============ -->
  <!-- Start ~8px below the agent text (y=287) and stop ~8px above each tile top (y=324) — consistent arrow-to-element gap. Column 7 starts below its COMING SOON pill (y=309). -->
  <line x1="156"  y1="287" x2="156"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="316"  y1="287" x2="316"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="476"  y1="287" x2="476"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="636"  y1="287" x2="636"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="796"  y1="287" x2="796"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="956"  y1="287" x2="956"  y2="324" stroke="#13294b" stroke-width="1.4" marker-end="url(#arrow)" />
  <line x1="1116" y1="309" x2="1116" y2="324" stroke="#6f7480" stroke-width="1.4" stroke-dasharray="4 3" marker-end="url(#arrow)" />

  <!-- ============ Left eyebrow: DATA SOURCES (centered on the tile row, center y=370) ============ -->
  <text x="20" y="366"
        font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
        font-size="10" font-weight="600" fill="#6f7480" letter-spacing="1.2">DATA</text>
  <text x="20" y="380"
        font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
        font-size="10" font-weight="600" fill="#6f7480" letter-spacing="1.2">SOURCES</text>

  <!-- ============ Data source tiles (one per column, top y=332, height 76) ============ -->
  <!-- tile width 144, left edges: 84,244,404,564,724,884,1044. body lines y=360 / y=376 / y=392. -->

  <!-- Tile 1 -->
  <g>
    <rect x="84" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="156" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Session replays,</text>
    <text x="156" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">funnels, click paths,</text>
    <text x="156" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">drop-offs</text>
  </g>

  <!-- Tile 2 -->
  <g>
    <rect x="244" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="316" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Charts, dashboards,</text>
    <text x="316" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">events, cohorts,</text>
    <text x="316" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">metrics</text>
  </g>

  <!-- Tile 3 -->
  <g>
    <rect x="404" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="476" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Feedback, support</text>
    <text x="476" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">themes, customer</text>
    <text x="476" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">comments</text>
  </g>

  <!-- Tile 4 -->
  <g>
    <rect x="564" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="636" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Web Vitals, network</text>
    <text x="636" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">signals, latency,</text>
    <text x="636" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">errors</text>
  </g>

  <!-- Tile 5 -->
  <g>
    <rect x="724" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="796" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Competitors, pricing,</text>
    <text x="796" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">reviews, market</text>
    <text x="796" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">trends</text>
  </g>

  <!-- Tile 6 -->
  <g>
    <rect x="884" y="332" width="144" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="956" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">Agent traces, tool</text>
    <text x="956" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">usage, quality</text>
    <text x="956" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#1e2024">patterns</text>
  </g>

  <!-- Tile 7 (coming soon, muted dashed) -->
  <g>
    <rect x="1044" y="332" width="144" height="76" rx="8" ry="8" fill="#F8F9FB" stroke="#dedfe2" stroke-width="1" stroke-dasharray="4 4" />
    <text x="1116" y="360" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#6f7480">Proprietary data,</text>
    <text x="1116" y="376" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#6f7480">internal tools,</text>
    <text x="1116" y="392" text-anchor="middle" font-family="'IBM Plex Sans', system-ui, sans-serif" font-size="11" font-weight="400" fill="#6f7480">workflows</text>
  </g>

  <!-- ============ Fan-in: each column converges to PRIORITIZE ============ -->
  <!-- Data tiles bottom at y=408. Drops to a collector bus at y=470, then a single line into PRIORITIZE. -->
  <line x1="156"  y1="408" x2="156"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="316"  y1="408" x2="316"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="476"  y1="408" x2="476"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="636"  y1="408" x2="636"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="796"  y1="408" x2="796"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="956"  y1="408" x2="956"  y2="470" stroke="#13294b" stroke-width="1.5" />
  <line x1="1116" y1="408" x2="1116" y2="470" stroke="#13294b" stroke-width="1.5" />
  <!-- Collector bus -->
  <line x1="156" y1="470" x2="1116" y2="470" stroke="#13294b" stroke-width="1.5" />
  <!-- Single arrow down into PRIORITIZE -->
  <line x1="636" y1="470" x2="636" y2="537" stroke="#13294b" stroke-width="1.5" marker-end="url(#arrow)" />

  <!-- ============ 2 — PRIORITIZE node (bottom, centered) ============ -->
  <g>
    <circle cx="636" cy="558" r="13" fill="#1e61f0" />
    <text x="636" y="563" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="13" font-weight="600" fill="#ffffff">2</text>
    <rect x="508" y="584" width="256" height="76" rx="8" ry="8" fill="#ffffff" stroke="#dedfe2" stroke-width="1" />
    <text x="636" y="612" text-anchor="middle"
          font-family="Gellix, 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="16" font-weight="600" fill="#13294b" letter-spacing="0.6">PRIORITIZE</text>
    <text x="636" y="632" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="12" font-weight="400" fill="#6f7480">Rank opportunities and surface</text>
    <text x="636" y="647" text-anchor="middle"
          font-family="'IBM Plex Sans', system-ui, -apple-system, Segoe UI, sans-serif"
          font-size="12" font-weight="400" fill="#6f7480">what to build next.</text>
  </g>
</svg>
