@contractspec/bundle.library 3.7.6 → 3.8.2

package/dist/components/docs/integrations/index.js

@@ -1,9 +1,7 @@
 // @bun
-// src/components/docs/integrations/IntegrationsOverviewPage.tsx
-import Link from "@contractspec/lib.ui-link";
-import { ChevronRight } from "lucide-react";
+// src/components/docs/integrations/IntegrationsCircuitBreakersPage.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
-function IntegrationsOverviewPage() {
+function IntegrationsCircuitBreakersPage() {
   return /* @__PURE__ */ jsxs("div", {
     className: "space-y-8",
     children: [
@@ -11,726 +9,12 @@ function IntegrationsOverviewPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx("h1", {
-            className: "text-4xl font-bold",
-            children: "Integrations"
-          }),
-          /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground",
-            children: "ContractSpec provides first-class integration support through a spec-first architecture. Integrations are defined globally, connected per-tenant, and bound to apps through typed specifications, ensuring type-safe, policy-enforced access to external services."
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Spec-first architecture"
-          }),
-          /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground",
-            children: "Integrations in ContractSpec follow a three-layer model:"
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsxs("div", {
-                className: "card-subtle p-4",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "mb-2 font-semibold",
-                    children: "1. IntegrationSpec (Global)"
-                  }),
-                  /* @__PURE__ */ jsx("p", {
-                    className: "text-muted-foreground text-sm",
-                    children: "Defines what an integration provides: capabilities, configuration schema, secrets, webhooks, and requirements."
-                  }),
-                  /* @__PURE__ */ jsx(Link, {
-                    href: "/docs/integrations/spec-model",
-                    className: "mt-2 inline-block text-sm text-violet-400 hover:text-violet-300",
-                    children: "Learn more \u2192"
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "card-subtle p-4",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "mb-2 font-semibold",
-                    children: "2. IntegrationConnection (Per-Tenant)"
-                  }),
-                  /* @__PURE__ */ jsx("p", {
-                    className: "text-muted-foreground text-sm",
-                    children: "A tenant's configured connection with credentials, environment (sandbox/production), and health status."
-                  }),
-                  /* @__PURE__ */ jsx(Link, {
-                    href: "/docs/architecture/integration-binding",
-                    className: "mt-2 inline-block text-sm text-violet-400 hover:text-violet-300",
-                    children: "Learn more \u2192"
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "card-subtle p-4",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "mb-2 font-semibold",
-                    children: "3. AppIntegrationBinding (Per-App)"
-                  }),
-                  /* @__PURE__ */ jsx("p", {
-                    className: "text-muted-foreground text-sm",
-                    children: "Maps tenant connections to app capabilities and workflows, defining which operations can use which integrations."
-                  }),
-                  /* @__PURE__ */ jsx(Link, {
-                    href: "/docs/architecture/integration-binding",
-                    className: "mt-2 inline-block text-sm text-violet-400 hover:text-violet-300",
-                    children: "Learn more \u2192"
-                  })
-                ]
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Integration categories"
-          }),
-          /* @__PURE__ */ jsx("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx("pre", {
-              children: `type IntegrationCategory =
-  | "payments"      // Stripe
-  | "open-banking"  // Powens
-  | "email"         // Postmark, Resend, Gmail
-  | "calendar"      // Google Calendar
-  | "sms"           // Twilio
-  | "messaging"     // Slack, GitHub, WhatsApp
-  | "health"        // Whoop, Oura, Strava, Fitbit
-  | "ai-llm"        // OpenAI, Mistral
-  | "ai-voice-tts"  // ElevenLabs
-  | "ai-voice-stt"  // OpenAI Whisper, Mistral Voxtral
-  | "ai-voice-conversational" // OpenAI Realtime, Mistral Voice
-  | "ai-image"      // OpenAI Image, Fal
-  | "vector-db"     // Qdrant
-  | "database"      // Supabase Postgres
-  | "storage"       // S3-compatible
-  | "meeting-recorder" // Fireflies, tl;dv
-  | "project-management" // Linear, Jira, Notion
-  | "accounting"    // Coming soon
-  | "crm"           // Coming soon
-  | "helpdesk"      // Coming soon
-  | "custom";       // User-defined`
-            })
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Available integrations"
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            className: "space-y-6",
-            children: [
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Payments"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/stripe",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "Stripe"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "Payment processing, subscriptions, and invoicing"
-                        })
-                      ]
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Open Banking"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/powens",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "Powens (Read-Only)"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "Account, transaction, and balance synchronisation via Powens with tenant-owned credentials."
-                        })
-                      ]
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Email"
-                  }),
-                  /* @__PURE__ */ jsxs("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: [
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/postmark",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Postmark"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Transactional email delivery with high deliverability"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/resend",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Resend"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Modern email API for developers"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/gmail",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Gmail API"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Inbound email processing and thread management"
-                          })
-                        ]
-                      })
-                    ]
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Calendar & Scheduling"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/google-calendar",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "Google Calendar"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "Event scheduling and calendar management"
-                        })
-                      ]
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "AI & Machine Learning"
-                  }),
-                  /* @__PURE__ */ jsxs("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: [
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/openai",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "OpenAI"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "LLMs, embeddings, and Whisper speech-to-text"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/mistral",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Mistral"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "LLMs, embeddings, Voxtral STT, and conversational voice"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/elevenlabs",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "ElevenLabs"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Text-to-speech and voice synthesis"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/qdrant",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Qdrant"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Vector database for semantic search and RAG"
-                          })
-                        ]
-                      })
-                    ]
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Storage"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/s3",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "S3-Compatible Storage"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "Object storage (AWS S3, Scaleway, MinIO, etc.)"
-                        })
-                      ]
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "SMS"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/twilio",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "Twilio"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "SMS notifications and transactional messaging"
-                        })
-                      ]
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Messaging channels"
-                  }),
-                  /* @__PURE__ */ jsxs("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: [
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/slack",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "Slack"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Signed event ingestion and outbox-backed replies"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/github",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "GitHub"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Issue and PR comment workflows with webhook verification"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/whatsapp-meta",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "WhatsApp Meta"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Primary WhatsApp Business API transport for inbound and outbound"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs(Link, {
-                        href: "/docs/integrations/whatsapp-twilio",
-                        className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                        children: [
-                          /* @__PURE__ */ jsx("h4", {
-                            className: "font-bold transition-colors group-hover:text-violet-400",
-                            children: "WhatsApp Twilio"
-                          }),
-                          /* @__PURE__ */ jsx("p", {
-                            className: "text-muted-foreground mt-1 text-sm",
-                            children: "Fallback WhatsApp route with Twilio signature validation"
-                          })
-                        ]
-                      })
-                    ]
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "space-y-3",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Health & wearables"
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "grid gap-4 md:grid-cols-2",
-                    children: /* @__PURE__ */ jsxs(Link, {
-                      href: "/docs/integrations/health-routing",
-                      className: "card-subtle group p-4 transition-colors hover:border-violet-500/50",
-                      children: [
-                        /* @__PURE__ */ jsx("h4", {
-                          className: "font-bold transition-colors group-hover:text-violet-400",
-                          children: "Health routing strategy"
-                        }),
-                        /* @__PURE__ */ jsx("p", {
-                          className: "text-muted-foreground mt-1 text-sm",
-                          children: "Official vs aggregator transport order, unofficial gating, and OAuth refresh config"
-                        })
-                      ]
-                    })
-                  })
-                ]
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "How integrations work"
-          }),
-          /* @__PURE__ */ jsxs("p", {
-            className: "text-muted-foreground",
-            children: [
-              "ContractSpec integrations are implemented as",
-              " ",
-              /* @__PURE__ */ jsx(Link, {
-                href: "/docs/specs/capabilities",
-                className: "text-violet-400 hover:text-violet-300",
-                children: "capability providers"
-              }),
-              ". This means:"
-            ]
-          }),
-          /* @__PURE__ */ jsxs("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
-            children: [
-              /* @__PURE__ */ jsxs("li", {
-                children: [
-                  /* @__PURE__ */ jsx("strong", {
-                    children: "Type safety"
-                  }),
-                  " \u2013 All API calls are type-checked by TypeScript and validated at runtime via Zod"
-                ]
-              }),
-              /* @__PURE__ */ jsxs("li", {
-                children: [
-                  /* @__PURE__ */ jsx("strong", {
-                    children: "Policy enforcement"
-                  }),
-                  " \u2013 Access to external services is governed by your",
-                  " ",
-                  /* @__PURE__ */ jsx(Link, {
-                    href: "/docs/specs/policy",
-                    className: "text-violet-400 hover:text-violet-300",
-                    children: "PolicySpecs"
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("li", {
-                children: [
-                  /* @__PURE__ */ jsx("strong", {
-                    children: "Audit logging"
-                  }),
-                  " \u2013 All integration calls are automatically logged"
-                ]
-              }),
-              /* @__PURE__ */ jsxs("li", {
-                children: [
-                  /* @__PURE__ */ jsx("strong", {
-                    children: "Error handling"
-                  }),
-                  " \u2013 Built-in retries and fallback strategies"
-                ]
-              }),
-              /* @__PURE__ */ jsxs("li", {
-                children: [
-                  /* @__PURE__ */ jsx("strong", {
-                    children: "Environment-based config"
-                  }),
-                  " \u2013 API keys and secrets are managed through environment variables"
-                ]
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Secret management"
-          }),
-          /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground",
-            children: "Secrets are resolved through a layered secret provider manager. It checks lightweight environment overrides first, then falls back to a managed vault (Google Cloud Secret Manager) for production."
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            className: "grid gap-4 md:grid-cols-2",
-            children: [
-              /* @__PURE__ */ jsxs("div", {
-                className: "card-subtle p-4",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "Environment variables"
-                  }),
-                  /* @__PURE__ */ jsxs("p", {
-                    className: "text-muted-foreground mt-2 text-sm",
-                    children: [
-                      "Perfect for local development and secure staging overrides. Use the ",
-                      /* @__PURE__ */ jsx("code", {
-                        children: "env://"
-                      }),
-                      " scheme or append ",
-                      /* @__PURE__ */ jsx("code", {
-                        children: "?env="
-                      }),
-                      " to another reference to map an explicit variable."
-                    ]
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "bg-background/60 border-border mt-3 overflow-auto rounded-lg border p-3 font-mono text-xs",
-                    children: /* @__PURE__ */ jsx("pre", {
-                      className: "whitespace-pre-wrap",
-                      children: `# Override a production secret locally
-CONTRACTSPEC__SECRET__STRIPE=sk_test_123
-
-# Reference
-env://CONTRACTSPEC__SECRET__STRIPE`
-                    })
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                className: "card-subtle p-4",
-                children: [
-                  /* @__PURE__ */ jsx("h3", {
-                    className: "text-xl font-semibold",
-                    children: "GCP Secret Manager"
-                  }),
-                  /* @__PURE__ */ jsxs("p", {
-                    className: "text-muted-foreground mt-2 text-sm",
-                    children: [
-                      "Used in production to store versioned credentials with rotation support. References follow the",
-                      " ",
-                      /* @__PURE__ */ jsx("code", {
-                        children: "gcp://projects/.../secrets/.../versions/latest"
-                      }),
-                      " ",
-                      "format."
-                    ]
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    className: "bg-background/60 border-border mt-3 overflow-auto rounded-lg border p-3 font-mono text-xs",
-                    children: /* @__PURE__ */ jsx("pre", {
-                      className: "whitespace-pre-wrap",
-                      children: `# Production reference
-gcp://projects/tenant/secrets/stripe-secret-key/versions/latest`
-                    })
-                  })
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground text-sm",
-            children: "The secret manager chooses the first provider that can resolve a reference, so local environment variables can override the managed vault without changing blueprints or tenant configs."
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Configuration"
-          }),
-          /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground",
-            children: "Integrations are configured through environment variables and secret references. Here's a typical setup:"
-          }),
-          /* @__PURE__ */ jsx("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx("pre", {
-              children: `# .env
-STRIPE_SECRET_KEY=sk_test_...
-STRIPE_WEBHOOK_SECRET=whsec_...
-
-POSTMARK_API_TOKEN=...
-POSTMARK_FROM_EMAIL=noreply@example.com
-
-OPENAI_API_KEY=sk-...
-OPENAI_ORGANIZATION=org-...
-
-MISTRAL_API_KEY=...
-
-QDRANT_URL=https://...
-QDRANT_API_KEY=...
-
-S3_ENDPOINT=https://s3.fr-par.scw.cloud
-S3_ACCESS_KEY_ID=...
-S3_SECRET_ACCESS_KEY=...
-S3_BUCKET=my-bucket
-S3_REGION=fr-par
-
-# Secret references
-STRIPE_SECRET_REF=gcp://projects/tenant/secrets/stripe-secret-key/versions/latest
-STRIPE_SECRET_OVERRIDE=env://STRIPE_SECRET_KEY`
-            })
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Integration categories"
+            className: "font-bold text-4xl",
+            children: "Integration Circuit Breakers"
           }),
           /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground",
-            children: "ContractSpec supports the following integration categories:"
-          }),
-          /* @__PURE__ */ jsx("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx("pre", {
-              children: `type IntegrationCategory =
-  | "payments"        // Stripe, PayPal, etc.
-  | "open-banking"    // Powens and open banking providers
-  | "email"           // Postmark, Resend, Gmail
-  | "calendar"        // Google Calendar, Outlook
-  | "sms"             // Twilio, MessageBird
-  | "messaging"       // Slack, GitHub, WhatsApp
-  | "health"          // Whoop, Oura, Strava, Fitbit
-  | "ai-llm"          // OpenAI, Anthropic, Cohere, Mistral
-  | "ai-voice-tts"    // ElevenLabs, Google TTS
-  | "ai-voice-stt"    // OpenAI Whisper, Google STT, Mistral Voxtral
-  | "ai-voice-conversational" // OpenAI Realtime, Mistral Voice
-  | "ai-image"        // OpenAI Image, Fal
-  | "vector-db"       // Qdrant, Pinecone, Weaviate
-  | "database"        // Supabase, Postgres
-  | "storage"         // S3, GCS, Azure Blob
-  | "meeting-recorder" // Fireflies, tl;dv, Granola
-  | "project-management" // Linear, Jira, Notion
-  | "accounting"      // QuickBooks, Xero (coming soon)
-  | "crm"             // Salesforce, HubSpot (coming soon)
-  | "helpdesk"        // Zendesk, Intercom (coming soon)
-  | "custom";         // Your own integrations`
-            })
+            className: "text-lg text-muted-foreground",
+            children: "External APIs are the most common source of instability. Wrap every integration call in a circuit breaker to protect your system."
           })
         ]
       }),
@@ -738,73 +22,14 @@ STRIPE_SECRET_OVERRIDE=env://STRIPE_SECRET_KEY`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
-            children: "Custom integrations"
-          }),
-          /* @__PURE__ */ jsxs("p", {
-            className: "text-muted-foreground",
-            children: [
-              "You can create custom integrations by implementing a capability provider. See the",
-              " ",
-              /* @__PURE__ */ jsx(Link, {
-                href: "/docs/advanced/custom-providers",
-                className: "text-violet-400 hover:text-violet-300",
-                children: "Custom Providers"
-              }),
-              " ",
-              "guide for details."
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx("div", {
-        className: "flex items-center gap-4 pt-4",
-        children: /* @__PURE__ */ jsxs(Link, {
-          href: "/docs/integrations/stripe",
-          className: "btn-primary",
-          children: [
-            "Get Started with Stripe ",
-            /* @__PURE__ */ jsx(ChevronRight, {
-              size: 16
-            })
-          ]
-        })
-      })
-    ]
-  });
-}
-
-// src/components/docs/integrations/IntegrationsCircuitBreakersPage.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function IntegrationsCircuitBreakersPage() {
-  return /* @__PURE__ */ jsxs2("div", {
-    className: "space-y-8",
-    children: [
-      /* @__PURE__ */ jsxs2("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx2("h1", {
-            className: "text-4xl font-bold",
-            children: "Integration Circuit Breakers"
-          }),
-          /* @__PURE__ */ jsx2("p", {
-            className: "text-muted-foreground text-lg",
-            children: "External APIs are the most common source of instability. Wrap every integration call in a circuit breaker to protect your system."
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs2("div", {
-        className: "space-y-4",
-        children: [
-          /* @__PURE__ */ jsx2("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Pattern"
           }),
-          /* @__PURE__ */ jsx2("p", {
+          /* @__PURE__ */ jsx("p", {
             children: "Create a dedicated circuit breaker instance for each external service. This ensures that a failure in Stripe doesn't trigger the circuit breaker for Twilio."
           }),
-          /* @__PURE__ */ jsx2("pre", {
-            className: "bg-muted rounded-lg border p-4 text-sm",
+          /* @__PURE__ */ jsx("pre", {
+            className: "rounded-lg border bg-muted p-4 text-sm",
             children: `// integrations/stripe.ts
 import { CircuitBreaker } from '@contractspec/lib.resilience/circuit-breaker';
 
@@ -824,52 +49,52 @@ export async function createCharge(amount: number) {
 }
 
 // src/components/docs/integrations/IntegrationsElevenLabsPage.tsx
-import Link2 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight2 } from "lucide-react";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import Link from "@contractspec/lib.ui-link";
+import { ChevronRight } from "lucide-react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function IntegrationsElevenLabsPage() {
-  return /* @__PURE__ */ jsxs3("div", {
+  return /* @__PURE__ */ jsxs2("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx3("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx2("h1", {
+            className: "font-bold text-4xl",
             children: "ElevenLabs"
           }),
-          /* @__PURE__ */ jsx3("p", {
+          /* @__PURE__ */ jsx2("p", {
             className: "text-muted-foreground",
             children: "ElevenLabs provides state-of-the-art text-to-speech and voice cloning technology. Create natural-sounding voiceovers, audiobooks, and voice assistants."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx2("h2", {
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
-          /* @__PURE__ */ jsx3("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx3("pre", {
+          /* @__PURE__ */ jsx2("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx2("pre", {
               children: `# .env
 ELEVENLABS_API_KEY=...`
             })
           })
         ]
       }),
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx2("h2", {
+            className: "font-bold text-2xl",
             children: "Text-to-Speech"
           }),
-          /* @__PURE__ */ jsx3("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx3("pre", {
+          /* @__PURE__ */ jsx2("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx2("pre", {
               children: `capabilityId: elevenlabs-tts
 provider:
   type: elevenlabs
@@ -894,46 +119,46 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx2("h2", {
+            className: "font-bold text-2xl",
             children: "Use cases"
           }),
-          /* @__PURE__ */ jsxs3("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs2("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx3("li", {
+              /* @__PURE__ */ jsx2("li", {
                 children: "Generate voiceovers for videos"
               }),
-              /* @__PURE__ */ jsx3("li", {
+              /* @__PURE__ */ jsx2("li", {
                 children: "Create audio versions of articles"
               }),
-              /* @__PURE__ */ jsx3("li", {
+              /* @__PURE__ */ jsx2("li", {
                 children: "Build voice assistants"
               }),
-              /* @__PURE__ */ jsx3("li", {
+              /* @__PURE__ */ jsx2("li", {
                 children: "Produce audiobooks"
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx3(Link2, {
+          /* @__PURE__ */ jsx2(Link, {
             href: "/docs/integrations/mistral",
             className: "btn-ghost",
             children: "Previous: Mistral"
           }),
-          /* @__PURE__ */ jsxs3(Link2, {
+          /* @__PURE__ */ jsxs2(Link, {
             href: "/docs/integrations/qdrant",
             className: "btn-primary",
             children: [
               "Next: Qdrant ",
-              /* @__PURE__ */ jsx3(ChevronRight2, {
+              /* @__PURE__ */ jsx2(ChevronRight, {
                 size: 16
               })
             ]
@@ -945,36 +170,36 @@ outputs:
 }
 
 // src/components/docs/integrations/IntegrationsGithubPage.tsx
-import Link3 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight3 } from "lucide-react";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import Link2 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight2 } from "lucide-react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function IntegrationsGithubPage() {
-  return /* @__PURE__ */ jsxs4("div", {
+  return /* @__PURE__ */ jsxs3("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx4("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx3("h1", {
+            className: "font-bold text-4xl",
             children: "GitHub Messaging"
           }),
-          /* @__PURE__ */ jsx4("p", {
+          /* @__PURE__ */ jsx3("p", {
             className: "text-muted-foreground",
             children: "Use GitHub issue and pull request comments as an AI-native messaging channel with webhook verification, policy checks, and reliable outbound dispatch."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
             children: "Required secrets and config"
           }),
-          /* @__PURE__ */ jsx4("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx4("pre", {
+          /* @__PURE__ */ jsx3("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx3("pre", {
               children: `// secret payload
 {
   "token": "ghp_...",
@@ -991,56 +216,56 @@ function IntegrationsGithubPage() {
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
             children: "Webhook ingress"
           }),
-          /* @__PURE__ */ jsxs4("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs3("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsxs4("li", {
+              /* @__PURE__ */ jsxs3("li", {
                 children: [
                   "Inbound GitHub events are accepted on",
                   " ",
-                  /* @__PURE__ */ jsx4("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                  /* @__PURE__ */ jsx3("code", {
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "/webhooks/github/events"
                   }),
                   "."
                 ]
               }),
-              /* @__PURE__ */ jsxs4("li", {
+              /* @__PURE__ */ jsxs3("li", {
                 children: [
                   "Signatures are checked using",
                   " ",
-                  /* @__PURE__ */ jsx4("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                  /* @__PURE__ */ jsx3("code", {
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "x-hub-signature-256"
                   }),
                   " ",
                   "and the configured webhook secret."
                 ]
               }),
-              /* @__PURE__ */ jsx4("li", {
+              /* @__PURE__ */ jsx3("li", {
                 children: "Current normalization focuses on issue comment workflows and durable comment dispatch."
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
             children: "Workspace mapping"
           }),
-          /* @__PURE__ */ jsx4("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx4("pre", {
+          /* @__PURE__ */ jsx3("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx3("pre", {
               children: `CHANNEL_WORKSPACE_MAP_GITHUB={"lssm-tech/contractspec":"workspace-acme"}
 
 # Optional dev fallback (off by default)
@@ -1049,43 +274,43 @@ CHANNEL_ALLOW_UNMAPPED_WORKSPACE=0`
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
-          /* @__PURE__ */ jsxs4("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs3("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx4("li", {
+              /* @__PURE__ */ jsx3("li", {
                 children: "Use a least-privileged token scoped for comment operations."
               }),
-              /* @__PURE__ */ jsx4("li", {
+              /* @__PURE__ */ jsx3("li", {
                 children: "Route repositories explicitly with workspace maps in multi-tenant environments."
               }),
-              /* @__PURE__ */ jsx4("li", {
+              /* @__PURE__ */ jsx3("li", {
                 children: "Keep dispatch endpoints protected with token or bearer auth."
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx4(Link3, {
+          /* @__PURE__ */ jsx3(Link2, {
             href: "/docs/integrations/slack",
             className: "btn-ghost",
             children: "Previous: Slack Messaging"
           }),
-          /* @__PURE__ */ jsxs4(Link3, {
+          /* @__PURE__ */ jsxs3(Link2, {
             href: "/docs/integrations/whatsapp-meta",
             className: "btn-primary",
             children: [
               "Next: WhatsApp Meta ",
-              /* @__PURE__ */ jsx4(ChevronRight3, {
+              /* @__PURE__ */ jsx3(ChevronRight2, {
                 size: 16
               })
             ]
@@ -1097,40 +322,40 @@ CHANNEL_ALLOW_UNMAPPED_WORKSPACE=0`
 }
 
 // src/components/docs/integrations/IntegrationsGmailPage.tsx
-import Link4 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight4 } from "lucide-react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import Link3 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight3 } from "lucide-react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function IntegrationsGmailPage() {
-  return /* @__PURE__ */ jsxs5("div", {
+  return /* @__PURE__ */ jsxs4("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx5("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx4("h1", {
+            className: "font-bold text-4xl",
             children: "Gmail API"
           }),
-          /* @__PURE__ */ jsx5("p", {
+          /* @__PURE__ */ jsx4("p", {
             className: "text-muted-foreground",
             children: "The Gmail API integration allows you to read inbound emails, manage threads, and build email-based workflows. Perfect for support tickets, email parsing, and automated responses."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx4("h2", {
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
-          /* @__PURE__ */ jsx5("p", {
+          /* @__PURE__ */ jsx4("p", {
             className: "text-muted-foreground",
             children: "Configure OAuth 2.0 credentials in Google Cloud Console:"
           }),
-          /* @__PURE__ */ jsx5("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx5("pre", {
+          /* @__PURE__ */ jsx4("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx4("pre", {
               children: `# .env
 GOOGLE_CLIENT_ID=...
 GOOGLE_CLIENT_SECRET=...
@@ -1139,16 +364,16 @@ GOOGLE_REDIRECT_URI=https://your-app.com/auth/google/callback`
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx4("h2", {
+            className: "font-bold text-2xl",
             children: "Reading emails"
           }),
-          /* @__PURE__ */ jsx5("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx5("pre", {
+          /* @__PURE__ */ jsx4("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx4("pre", {
               children: `capabilityId: gmail-list-messages
 provider:
   type: gmail
@@ -1175,46 +400,46 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx4("h2", {
+            className: "font-bold text-2xl",
             children: "Use cases"
           }),
-          /* @__PURE__ */ jsxs5("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs4("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx5("li", {
+              /* @__PURE__ */ jsx4("li", {
                 children: "Parse support emails and create tickets"
               }),
-              /* @__PURE__ */ jsx5("li", {
+              /* @__PURE__ */ jsx4("li", {
                 children: "Extract attachments and process them"
               }),
-              /* @__PURE__ */ jsx5("li", {
+              /* @__PURE__ */ jsx4("li", {
                 children: "Build email-to-task workflows"
               }),
-              /* @__PURE__ */ jsx5("li", {
+              /* @__PURE__ */ jsx4("li", {
                 children: "Monitor specific email threads"
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx5(Link4, {
+          /* @__PURE__ */ jsx4(Link3, {
             href: "/docs/integrations/resend",
             className: "btn-ghost",
             children: "Previous: Resend"
           }),
-          /* @__PURE__ */ jsxs5(Link4, {
+          /* @__PURE__ */ jsxs4(Link3, {
             href: "/docs/integrations/google-calendar",
             className: "btn-primary",
             children: [
               "Next: Google Calendar ",
-              /* @__PURE__ */ jsx5(ChevronRight4, {
+              /* @__PURE__ */ jsx4(ChevronRight3, {
                 size: 16
               })
             ]
@@ -1226,36 +451,36 @@ outputs:
 }
 
 // src/components/docs/integrations/IntegrationsGoogleCalendarPage.tsx
-import Link5 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight5 } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import Link4 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight4 } from "lucide-react";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function IntegrationsGoogleCalendarPage() {
-  return /* @__PURE__ */ jsxs6("div", {
+  return /* @__PURE__ */ jsxs5("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs5("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx6("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx5("h1", {
+            className: "font-bold text-4xl",
             children: "Google Calendar"
           }),
-          /* @__PURE__ */ jsx6("p", {
+          /* @__PURE__ */ jsx5("p", {
             className: "text-muted-foreground",
             children: "Integrate Google Calendar to schedule appointments, manage availability, and sync events with your application."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs5("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx6("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx5("h2", {
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
-          /* @__PURE__ */ jsx6("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx6("pre", {
+          /* @__PURE__ */ jsx5("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx5("pre", {
               children: `# .env
 GOOGLE_CLIENT_ID=...
 GOOGLE_CLIENT_SECRET=...
@@ -1264,16 +489,16 @@ GOOGLE_CALENDAR_ID=primary`
           })
         ]
       }),
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs5("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx6("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx5("h2", {
+            className: "font-bold text-2xl",
             children: "Creating events"
           }),
-          /* @__PURE__ */ jsx6("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx6("pre", {
+          /* @__PURE__ */ jsx5("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx5("pre", {
               children: `capabilityId: calendar-create-event
 provider:
   type: google-calendar
@@ -1303,20 +528,20 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs5("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx6(Link5, {
+          /* @__PURE__ */ jsx5(Link4, {
             href: "/docs/integrations/gmail",
             className: "btn-ghost",
             children: "Previous: Gmail API"
           }),
-          /* @__PURE__ */ jsxs6(Link5, {
+          /* @__PURE__ */ jsxs5(Link4, {
             href: "/docs/integrations/openai",
             className: "btn-primary",
             children: [
               "Next: OpenAI ",
-              /* @__PURE__ */ jsx6(ChevronRight5, {
+              /* @__PURE__ */ jsx5(ChevronRight4, {
                 size: 16
               })
             ]
@@ -1328,35 +553,35 @@ outputs:
 }
 
 // src/components/docs/integrations/IntegrationsHealthRoutingPage.tsx
-import Link6 from "@contractspec/lib.ui-link";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import Link5 from "@contractspec/lib.ui-link";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function IntegrationsHealthRoutingPage() {
-  return /* @__PURE__ */ jsxs7("div", {
+  return /* @__PURE__ */ jsxs6("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx7("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx6("h1", {
+            className: "font-bold text-4xl",
             children: "Health Routing Strategy"
           }),
-          /* @__PURE__ */ jsx7("p", {
+          /* @__PURE__ */ jsx6("p", {
             className: "text-muted-foreground",
             children: "Health integrations resolve providers through deterministic transport strategy order with explicit capability gating and unofficial-route controls."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx7("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx6("h2", {
+            className: "font-bold text-2xl",
             children: "Connection config fields"
           }),
-          /* @__PURE__ */ jsx7("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx7("pre", {
+          /* @__PURE__ */ jsx6("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx6("pre", {
               children: `{
   "defaultTransport": "official-api",
   "strategyOrder": [
@@ -1376,16 +601,16 @@ function IntegrationsHealthRoutingPage() {
           })
         ]
       }),
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx7("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx6("h2", {
+            className: "font-bold text-2xl",
             children: "Secret payload fields"
           }),
-          /* @__PURE__ */ jsx7("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx7("pre", {
+          /* @__PURE__ */ jsx6("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx6("pre", {
               children: `{
   "apiKey": "...",
   "accessToken": "...",
@@ -1400,47 +625,47 @@ function IntegrationsHealthRoutingPage() {
           })
         ]
       }),
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx7("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx6("h2", {
+            className: "font-bold text-2xl",
             children: "Routing behavior"
           }),
-          /* @__PURE__ */ jsxs7("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs6("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx7("li", {
+              /* @__PURE__ */ jsx6("li", {
                 children: "Unsupported strategies are skipped per provider capability matrix."
               }),
-              /* @__PURE__ */ jsx7("li", {
+              /* @__PURE__ */ jsx6("li", {
                 children: "Missing credentials fail closed and fall through only when a later strategy is valid."
               }),
-              /* @__PURE__ */ jsxs7("li", {
+              /* @__PURE__ */ jsxs6("li", {
                 children: [
                   "Unofficial routes are disabled unless",
-                  /* @__PURE__ */ jsx7("code", {
-                    className: "bg-background/50 ml-1 rounded px-2 py-1",
+                  /* @__PURE__ */ jsx6("code", {
+                    className: "ml-1 rounded bg-background/50 px-2 py-1",
                     children: "allowUnofficial"
                   }),
                   "is true."
                 ]
               }),
-              /* @__PURE__ */ jsxs7("li", {
+              /* @__PURE__ */ jsxs6("li", {
                 children: [
                   "When",
-                  /* @__PURE__ */ jsx7("code", {
-                    className: "bg-background/50 ml-1 rounded px-2 py-1",
+                  /* @__PURE__ */ jsx6("code", {
+                    className: "ml-1 rounded bg-background/50 px-2 py-1",
                     children: "unofficialAllowList"
                   }),
                   "is set, only listed provider keys can route unofficially."
                 ]
               }),
-              /* @__PURE__ */ jsxs7("li", {
+              /* @__PURE__ */ jsxs6("li", {
                 children: [
                   "OAuth refresh uses",
-                  /* @__PURE__ */ jsx7("code", {
-                    className: "bg-background/50 ml-1 rounded px-2 py-1",
+                  /* @__PURE__ */ jsx6("code", {
+                    className: "ml-1 rounded bg-background/50 px-2 py-1",
                     children: "oauthTokenUrl"
                   }),
                   "with refresh/client credentials when APIs return 401."
@@ -1450,38 +675,38 @@ function IntegrationsHealthRoutingPage() {
           })
         ]
       }),
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx7("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx6("h2", {
+            className: "font-bold text-2xl",
             children: "Provider guidance"
           }),
-          /* @__PURE__ */ jsxs7("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs6("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx7("li", {
+              /* @__PURE__ */ jsx6("li", {
                 children: "Use official APIs when available (Whoop, Oura, Strava, Fitbit)."
               }),
-              /* @__PURE__ */ jsx7("li", {
+              /* @__PURE__ */ jsx6("li", {
                 children: "Use aggregator routing for providers without stable official APIs (Garmin, MyFitnessPal, Eight Sleep, Peloton)."
               }),
-              /* @__PURE__ */ jsx7("li", {
+              /* @__PURE__ */ jsx6("li", {
                 children: "Keep unofficial automation opt-in and auditable for production."
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx7(Link6, {
+          /* @__PURE__ */ jsx6(Link5, {
             href: "/docs/integrations/whatsapp-twilio",
             className: "btn-ghost",
             children: "Previous: WhatsApp Twilio"
           }),
-          /* @__PURE__ */ jsx7(Link6, {
+          /* @__PURE__ */ jsx6(Link5, {
             href: "/docs/integrations",
             className: "btn-primary",
             children: "Back to Integrations"
@@ -1493,52 +718,52 @@ function IntegrationsHealthRoutingPage() {
 }
 
 // src/components/docs/integrations/IntegrationsMistralPage.tsx
-import Link7 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight6 } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import Link6 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight5 } from "lucide-react";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function IntegrationsMistralPage() {
-  return /* @__PURE__ */ jsxs8("div", {
+  return /* @__PURE__ */ jsxs7("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx7("h1", {
+            className: "font-bold text-4xl",
             children: "Mistral"
           }),
-          /* @__PURE__ */ jsx8("p", {
+          /* @__PURE__ */ jsx7("p", {
             className: "text-muted-foreground",
             children: "Integrate Mistral models for chat, reasoning, embeddings, speech-to-text, and conversational voice workflows. ContractSpec ships first-class Mistral support across contracts, provider runtime wiring, and CLI provider selection."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
-          /* @__PURE__ */ jsx8("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx8("pre", {
+          /* @__PURE__ */ jsx7("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx7("pre", {
               children: `# .env
 MISTRAL_API_KEY=...`
             })
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Chat and reasoning"
           }),
-          /* @__PURE__ */ jsx8("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx8("pre", {
+          /* @__PURE__ */ jsx7("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx7("pre", {
               children: `capabilityId: mistral-chat
 provider:
   type: mistral
@@ -1563,16 +788,16 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Embeddings"
           }),
-          /* @__PURE__ */ jsx8("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx8("pre", {
+          /* @__PURE__ */ jsx7("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx7("pre", {
               children: `capabilityId: mistral-embeddings
 provider:
   type: mistral
@@ -1594,16 +819,16 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Speech-to-Text (Voxtral)"
           }),
-          /* @__PURE__ */ jsx8("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx8("pre", {
+          /* @__PURE__ */ jsx7("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx7("pre", {
               children: `capabilityId: mistral-stt
 provider:
   type: mistral
@@ -1629,59 +854,59 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Conversational voice sessions"
           }),
-          /* @__PURE__ */ jsx8("p", {
+          /* @__PURE__ */ jsx7("p", {
             className: "text-muted-foreground",
             children: "Use the conversational provider for session-based realtime voice flows (turn handling, events, and interruption-safe streaming)."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx7("h2", {
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
-          /* @__PURE__ */ jsxs8("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs7("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx8("li", {
+              /* @__PURE__ */ jsx7("li", {
                 children: "Choose model families by workload: coding, reasoning, or speech"
               }),
-              /* @__PURE__ */ jsx8("li", {
+              /* @__PURE__ */ jsx7("li", {
                 children: "Persist session IDs for conversational continuity across turns"
               }),
-              /* @__PURE__ */ jsx8("li", {
+              /* @__PURE__ */ jsx7("li", {
                 children: "Capture token and latency telemetry for provider-level tuning"
               }),
-              /* @__PURE__ */ jsx8("li", {
+              /* @__PURE__ */ jsx7("li", {
                 children: "Set explicit fallbacks for network and rate-limit failures"
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx8(Link7, {
+          /* @__PURE__ */ jsx7(Link6, {
             href: "/docs/integrations/openai",
             className: "btn-ghost",
             children: "Previous: OpenAI"
           }),
-          /* @__PURE__ */ jsxs8(Link7, {
+          /* @__PURE__ */ jsxs7(Link6, {
             href: "/docs/integrations/elevenlabs",
             className: "btn-primary",
             children: [
               "Next: ElevenLabs ",
-              /* @__PURE__ */ jsx8(ChevronRight6, {
+              /* @__PURE__ */ jsx7(ChevronRight5, {
                 size: 16
               })
             ]
@@ -1693,36 +918,36 @@ outputs:
 }
 
 // src/components/docs/integrations/IntegrationsOpenAIPage.tsx
-import Link8 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight7 } from "lucide-react";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import Link7 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight6 } from "lucide-react";
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function IntegrationsOpenAIPage() {
-  return /* @__PURE__ */ jsxs9("div", {
+  return /* @__PURE__ */ jsxs8("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx8("h1", {
+            className: "font-bold text-4xl",
             children: "OpenAI"
           }),
-          /* @__PURE__ */ jsx9("p", {
+          /* @__PURE__ */ jsx8("p", {
             className: "text-muted-foreground",
             children: "Integrate OpenAI's powerful AI models for chat completion, embeddings, and speech-to-text. Build intelligent features with GPT-4, generate embeddings for semantic search, and transcribe audio with Whisper."
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx8("h2", {
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
-          /* @__PURE__ */ jsx9("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx9("pre", {
+          /* @__PURE__ */ jsx8("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx8("pre", {
               children: `# .env
 OPENAI_API_KEY=sk-...
 OPENAI_ORGANIZATION=org-...`
@@ -1730,16 +955,16 @@ OPENAI_ORGANIZATION=org-...`
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx8("h2", {
+            className: "font-bold text-2xl",
             children: "Chat completions"
           }),
-          /* @__PURE__ */ jsx9("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx9("pre", {
+          /* @__PURE__ */ jsx8("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx8("pre", {
               children: `capabilityId: openai-chat
 provider:
   type: openai
@@ -1770,16 +995,16 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx8("h2", {
+            className: "font-bold text-2xl",
             children: "Embeddings"
           }),
-          /* @__PURE__ */ jsx9("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx9("pre", {
+          /* @__PURE__ */ jsx8("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx8("pre", {
               children: `capabilityId: openai-embeddings
 provider:
   type: openai
@@ -1801,16 +1026,16 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx8("h2", {
+            className: "font-bold text-2xl",
             children: "Whisper (Speech-to-Text)"
           }),
-          /* @__PURE__ */ jsx9("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
-            children: /* @__PURE__ */ jsx9("pre", {
+          /* @__PURE__ */ jsx8("div", {
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
+            children: /* @__PURE__ */ jsx8("pre", {
               children: `capabilityId: openai-transcribe
 provider:
   type: openai
@@ -1832,49 +1057,49 @@ outputs:
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "space-y-4",
         children: [
-          /* @__PURE__ */ jsx9("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx8("h2", {
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
-          /* @__PURE__ */ jsxs9("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+          /* @__PURE__ */ jsxs8("ul", {
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
-              /* @__PURE__ */ jsx9("li", {
+              /* @__PURE__ */ jsx8("li", {
                 children: "Use streaming for real-time chat responses"
               }),
-              /* @__PURE__ */ jsx9("li", {
+              /* @__PURE__ */ jsx8("li", {
                 children: "Cache embeddings to reduce API costs"
               }),
-              /* @__PURE__ */ jsx9("li", {
+              /* @__PURE__ */ jsx8("li", {
                 children: "Implement rate limiting to avoid quota issues"
               }),
-              /* @__PURE__ */ jsx9("li", {
+              /* @__PURE__ */ jsx8("li", {
                 children: "Store conversation history for context"
               }),
-              /* @__PURE__ */ jsx9("li", {
+              /* @__PURE__ */ jsx8("li", {
                 children: "Monitor token usage and costs"
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsx9(Link8, {
+          /* @__PURE__ */ jsx8(Link7, {
             href: "/docs/integrations/google-calendar",
             className: "btn-ghost",
             children: "Previous: Google Calendar"
           }),
-          /* @__PURE__ */ jsxs9(Link8, {
+          /* @__PURE__ */ jsxs8(Link7, {
             href: "/docs/integrations/mistral",
             className: "btn-primary",
             children: [
               "Next: Mistral ",
-              /* @__PURE__ */ jsx9(ChevronRight7, {
+              /* @__PURE__ */ jsx8(ChevronRight6, {
                 size: 16
               })
             ]
@@ -1885,9 +1110,167 @@ outputs:
   });
 }
 
+// src/components/docs/integrations/IntegrationsOverviewPage.tsx
+import Link8 from "@contractspec/lib.ui-link";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+var groups = [
+  {
+    title: "Models and voice",
+    items: [
+      { title: "OpenAI", href: "/docs/integrations/openai" },
+      { title: "Mistral", href: "/docs/integrations/mistral" },
+      { title: "ElevenLabs", href: "/docs/integrations/elevenlabs" }
+    ]
+  },
+  {
+    title: "Messaging and product operations",
+    items: [
+      { title: "GitHub", href: "/docs/integrations/github" },
+      { title: "Slack", href: "/docs/integrations/slack" },
+      { title: "Twilio", href: "/docs/integrations/twilio" },
+      { title: "Postmark", href: "/docs/integrations/postmark" }
+    ]
+  },
+  {
+    title: "Data, storage, and retrieval",
+    items: [
+      { title: "Qdrant", href: "/docs/integrations/qdrant" },
+      { title: "S3 storage", href: "/docs/integrations/s3" },
+      { title: "Gmail", href: "/docs/integrations/gmail" },
+      { title: "Google Calendar", href: "/docs/integrations/google-calendar" }
+    ]
+  },
+  {
+    title: "Payments and external workflows",
+    items: [
+      { title: "Stripe", href: "/docs/integrations/stripe" },
+      { title: "Powens", href: "/docs/integrations/powens" },
+      {
+        title: "Circuit breakers",
+        href: "/docs/integrations/circuit-breakers"
+      },
+      {
+        title: "Health routing",
+        href: "/docs/integrations/health-routing"
+      }
+    ]
+  }
+];
+function IntegrationsOverviewPage() {
+  return /* @__PURE__ */ jsxs9("div", {
+    className: "space-y-10",
+    children: [
+      /* @__PURE__ */ jsxs9("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsx9("p", {
+            className: "editorial-kicker",
+            children: "Integrations"
+          }),
+          /* @__PURE__ */ jsx9("h1", {
+            className: "font-serif text-4xl tracking-[-0.04em] md:text-5xl",
+            children: "Integrations stay explicit: spec what a provider offers, then bind it per tenant and per app."
+          }),
+          /* @__PURE__ */ jsx9("p", {
+            className: "max-w-3xl text-lg text-muted-foreground leading-8",
+            children: "The integration model keeps provider behavior out of ad hoc glue code. Define the capability contract first, configure the provider connection explicitly, then bind the integration into app workflows and runtime surfaces with clear ownership."
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs9("div", {
+        className: "editorial-proof-strip",
+        children: [
+          /* @__PURE__ */ jsxs9("div", {
+            className: "editorial-stat",
+            children: [
+              /* @__PURE__ */ jsx9("span", {
+                className: "editorial-label",
+                children: "Binding model"
+              }),
+              /* @__PURE__ */ jsx9("span", {
+                className: "editorial-stat-value",
+                children: "Integration spec \u2192 tenant connection \u2192 app binding"
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsx9("p", {
+            className: "max-w-2xl text-muted-foreground text-sm leading-7",
+            children: "That separation is what makes reuse, tenant isolation, and provider swaps practical without rewriting every surface."
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx9("section", {
+        className: "editorial-panel space-y-5",
+        children: /* @__PURE__ */ jsxs9("div", {
+          className: "space-y-2",
+          children: [
+            /* @__PURE__ */ jsx9("h2", {
+              className: "font-serif text-3xl tracking-[-0.03em]",
+              children: "Start with the model, then pick a provider"
+            }),
+            /* @__PURE__ */ jsxs9("div", {
+              className: "grid gap-4 md:grid-cols-2",
+              children: [
+                /* @__PURE__ */ jsxs9(Link8, {
+                  href: "/docs/integrations/spec-model",
+                  className: "docs-footer-link",
+                  children: [
+                    /* @__PURE__ */ jsx9("h3", {
+                      className: "font-semibold text-lg",
+                      children: "Integration spec model"
+                    }),
+                    /* @__PURE__ */ jsx9("p", {
+                      className: "text-muted-foreground text-sm leading-7",
+                      children: "Define what the provider offers, what configuration it needs, and how the runtime should treat it."
+                    })
+                  ]
+                }),
+                /* @__PURE__ */ jsxs9(Link8, {
+                  href: "/docs/architecture/integration-binding",
+                  className: "docs-footer-link",
+                  children: [
+                    /* @__PURE__ */ jsx9("h3", {
+                      className: "font-semibold text-lg",
+                      children: "Integration binding"
+                    }),
+                    /* @__PURE__ */ jsx9("p", {
+                      className: "text-muted-foreground text-sm leading-7",
+                      children: "Understand how tenant connections get mapped into concrete app surfaces and workflows."
+                    })
+                  ]
+                })
+              ]
+            })
+          ]
+        })
+      }),
+      /* @__PURE__ */ jsx9("div", {
+        className: "grid gap-5 md:grid-cols-2",
+        children: groups.map((group) => /* @__PURE__ */ jsxs9("section", {
+          className: "editorial-panel space-y-4",
+          children: [
+            /* @__PURE__ */ jsx9("h2", {
+              className: "font-serif text-2xl tracking-[-0.03em]",
+              children: group.title
+            }),
+            /* @__PURE__ */ jsx9("div", {
+              className: "space-y-3",
+              children: group.items.map((item) => /* @__PURE__ */ jsx9(Link8, {
+                href: item.href,
+                className: "docs-chip-link",
+                children: item.title
+              }, item.href))
+            })
+          ]
+        }, group.title))
+      })
+    ]
+  });
+}
+
 // src/components/docs/integrations/IntegrationsPostmarkPage.tsx
 import Link9 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight8 } from "lucide-react";
+import { ChevronRight as ChevronRight7 } from "lucide-react";
 import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function IntegrationsPostmarkPage() {
   return /* @__PURE__ */ jsxs10("div", {
@@ -1897,7 +1280,7 @@ function IntegrationsPostmarkPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Postmark"
           }),
           /* @__PURE__ */ jsx10("p", {
@@ -1910,7 +1293,7 @@ function IntegrationsPostmarkPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx10("p", {
@@ -1918,7 +1301,7 @@ function IntegrationsPostmarkPage() {
             children: "Add your Postmark credentials to your environment variables:"
           }),
           /* @__PURE__ */ jsx10("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx10("pre", {
               children: `# .env
 POSTMARK_API_TOKEN=...
@@ -1947,11 +1330,11 @@ POSTMARK_FROM_NAME="Your App Name"`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Sending emails"
           }),
           /* @__PURE__ */ jsx10("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx10("pre", {
               children: `capabilityId: send-email
 provider:
@@ -1990,7 +1373,7 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Using templates"
           }),
           /* @__PURE__ */ jsx10("p", {
@@ -1998,7 +1381,7 @@ outputs:
             children: "Postmark templates allow you to design emails in their dashboard and populate them with data:"
           }),
           /* @__PURE__ */ jsx10("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx10("pre", {
               children: `capabilityId: send-welcome-email
 provider:
@@ -2024,7 +1407,7 @@ config:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Webhooks"
           }),
           /* @__PURE__ */ jsx10("p", {
@@ -2032,7 +1415,7 @@ config:
             children: "Postmark can notify your app about delivery, bounces, and opens:"
           }),
           /* @__PURE__ */ jsx10("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx10("pre", {
               children: `https://your-app.com/api/webhooks/postmark`
             })
@@ -2042,7 +1425,7 @@ config:
             children: "ContractSpec automatically processes these webhook events:"
           }),
           /* @__PURE__ */ jsxs10("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs10("li", {
                 children: [
@@ -2092,11 +1475,11 @@ config:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx10("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs10("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx10("li", {
                 children: "Use templates for consistent branding"
@@ -2133,7 +1516,7 @@ config:
             className: "btn-primary",
             children: [
               "Next: Resend ",
-              /* @__PURE__ */ jsx10(ChevronRight8, {
+              /* @__PURE__ */ jsx10(ChevronRight7, {
                 size: 16
               })
             ]
@@ -2146,7 +1529,7 @@ config:
 
 // src/components/docs/integrations/IntegrationsPowensPage.tsx
 import Link10 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight9 } from "lucide-react";
+import { ChevronRight as ChevronRight8 } from "lucide-react";
 import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function IntegrationsPowensPage() {
   return /* @__PURE__ */ jsxs11("div", {
@@ -2156,7 +1539,7 @@ function IntegrationsPowensPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Powens Open Banking"
           }),
           /* @__PURE__ */ jsx11("p", {
@@ -2169,7 +1552,7 @@ function IntegrationsPowensPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx11("p", {
@@ -2177,7 +1560,7 @@ function IntegrationsPowensPage() {
             children: "Create a Powens BYOK project, then store the credentials in your secret manager. The ContractSpec integration expects the following fields:"
           }),
           /* @__PURE__ */ jsx11("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx11("pre", {
               children: `{
   "clientId": "powens-client-id",
@@ -2192,7 +1575,7 @@ function IntegrationsPowensPage() {
             children: "Configure non-secret settings on the integration connection:"
           }),
           /* @__PURE__ */ jsx11("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx11("pre", {
               children: `environment: sandbox | production
 baseUrl?: https://api-sandbox.powens.com/v2
@@ -2222,11 +1605,11 @@ pollingIntervalMs?: 300000`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Capabilities"
           }),
           /* @__PURE__ */ jsx11("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx11("pre", {
               children: `capabilityId: openbanking.accounts.read
 provider:
@@ -2284,14 +1667,14 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Primary workflows"
           }),
           /* @__PURE__ */ jsxs11("div", {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx11("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Account sync"
               }),
               /* @__PURE__ */ jsxs11("p", {
@@ -2300,7 +1683,7 @@ outputs:
                   "The workflow",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "pfo.workflow.sync-openbanking-accounts"
                   }),
                   " ",
@@ -2313,14 +1696,14 @@ outputs:
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx11("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Transaction sync"
               }),
               /* @__PURE__ */ jsxs11("p", {
                 className: "text-muted-foreground",
                 children: [
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "pfo.workflow.sync-openbanking-transactions"
                   }),
                   " ",
@@ -2333,14 +1716,14 @@ outputs:
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx11("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Balance refresh"
               }),
               /* @__PURE__ */ jsxs11("p", {
                 className: "text-muted-foreground",
                 children: [
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "pfo.workflow.refresh-openbanking-balances"
                   }),
                   " ",
@@ -2353,14 +1736,14 @@ outputs:
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx11("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Derived financial overview"
               }),
               /* @__PURE__ */ jsxs11("p", {
                 className: "text-muted-foreground",
                 children: [
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "pfo.workflow.generate-openbanking-overview"
                   }),
                   " ",
@@ -2379,25 +1762,25 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Telemetry & guardrails"
           }),
           /* @__PURE__ */ jsxs11("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs11("li", {
                 children: [
                   "Telemetry events such as",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "openbanking.accounts.synced"
                   }),
                   " ",
                   "and",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "openbanking.transactions.synced"
                   }),
                   " ",
@@ -2409,7 +1792,7 @@ outputs:
                   "Guard helpers ensure the",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "primaryOpenBanking"
                   }),
                   " ",
@@ -2421,7 +1804,7 @@ outputs:
                   "PII fields (IBAN, counterparty names, descriptions) are redacted via",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "redactOpenBankingTelemetryPayload"
                   }),
                   " ",
@@ -2436,11 +1819,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx11("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs11("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx11("li", {
                 children: "Use BYOK credentials per tenant to avoid cross-tenant exposure."
@@ -2459,7 +1842,7 @@ outputs:
                   "Monitor telemetry for",
                   " ",
                   /* @__PURE__ */ jsx11("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "openbanking.*.sync_failed"
                   }),
                   " ",
@@ -2483,7 +1866,7 @@ outputs:
             className: "btn-primary",
             children: [
               "Next: Stripe ",
-              /* @__PURE__ */ jsx11(ChevronRight9, {
+              /* @__PURE__ */ jsx11(ChevronRight8, {
                 size: 16
               })
             ]
@@ -2496,7 +1879,7 @@ outputs:
 
 // src/components/docs/integrations/IntegrationsQdrantPage.tsx
 import Link11 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight10 } from "lucide-react";
+import { ChevronRight as ChevronRight9 } from "lucide-react";
 import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 function IntegrationsQdrantPage() {
   return /* @__PURE__ */ jsxs12("div", {
@@ -2506,7 +1889,7 @@ function IntegrationsQdrantPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx12("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Qdrant"
           }),
           /* @__PURE__ */ jsx12("p", {
@@ -2519,11 +1902,11 @@ function IntegrationsQdrantPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx12("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx12("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx12("pre", {
               children: `# .env
 QDRANT_URL=https://...
@@ -2537,11 +1920,11 @@ QDRANT_COLLECTION=documents`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx12("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Storing vectors"
           }),
           /* @__PURE__ */ jsx12("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx12("pre", {
               children: `capabilityId: qdrant-upsert
 provider:
@@ -2571,11 +1954,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx12("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Semantic search"
           }),
           /* @__PURE__ */ jsx12("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx12("pre", {
               children: `capabilityId: qdrant-search
 provider:
@@ -2610,11 +1993,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx12("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "RAG workflow example"
           }),
           /* @__PURE__ */ jsx12("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx12("pre", {
               children: `workflowId: rag-query
 version: '1.0.0'.0.0
@@ -2659,7 +2042,7 @@ steps:
             className: "btn-primary",
             children: [
               "Next: S3 Storage ",
-              /* @__PURE__ */ jsx12(ChevronRight10, {
+              /* @__PURE__ */ jsx12(ChevronRight9, {
                 size: 16
               })
             ]
@@ -2672,7 +2055,7 @@ steps:
 
 // src/components/docs/integrations/IntegrationsResendPage.tsx
 import Link12 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight11 } from "lucide-react";
+import { ChevronRight as ChevronRight10 } from "lucide-react";
 import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 function IntegrationsResendPage() {
   return /* @__PURE__ */ jsxs13("div", {
@@ -2682,7 +2065,7 @@ function IntegrationsResendPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx13("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Resend"
           }),
           /* @__PURE__ */ jsx13("p", {
@@ -2695,11 +2078,11 @@ function IntegrationsResendPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx13("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx13("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx13("pre", {
               children: `# .env
 RESEND_API_KEY=re_...
@@ -2712,11 +2095,11 @@ RESEND_FROM_EMAIL=onboarding@resend.dev`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx13("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Sending emails"
           }),
           /* @__PURE__ */ jsx13("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx13("pre", {
               children: `capabilityId: resend-send-email
 provider:
@@ -2748,11 +2131,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx13("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs13("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx13("li", {
                 children: "Use React Email for type-safe templates"
@@ -2780,7 +2163,7 @@ outputs:
             className: "btn-primary",
             children: [
               "Next: Gmail API ",
-              /* @__PURE__ */ jsx13(ChevronRight11, {
+              /* @__PURE__ */ jsx13(ChevronRight10, {
                 size: 16
               })
             ]
@@ -2793,7 +2176,7 @@ outputs:
 
 // src/components/docs/integrations/IntegrationsS3Page.tsx
 import Link13 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight12 } from "lucide-react";
+import { ChevronRight as ChevronRight11 } from "lucide-react";
 import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 function IntegrationsS3Page() {
   return /* @__PURE__ */ jsxs14("div", {
@@ -2803,7 +2186,7 @@ function IntegrationsS3Page() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx14("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "S3-Compatible Storage"
           }),
           /* @__PURE__ */ jsx14("p", {
@@ -2816,11 +2199,11 @@ function IntegrationsS3Page() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx14("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx14("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx14("pre", {
               children: `# .env
 S3_ENDPOINT=https://s3.fr-par.scw.cloud
@@ -2836,11 +2219,11 @@ S3_REGION=fr-par`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx14("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Uploading files"
           }),
           /* @__PURE__ */ jsx14("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx14("pre", {
               children: `capabilityId: s3-upload
 provider:
@@ -2873,11 +2256,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx14("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Generating presigned URLs"
           }),
           /* @__PURE__ */ jsx14("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx14("pre", {
               children: `capabilityId: s3-presigned-url
 provider:
@@ -2903,11 +2286,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx14("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs14("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx14("li", {
                 children: "Use presigned URLs for secure, temporary access"
@@ -2941,7 +2324,7 @@ outputs:
             className: "btn-primary",
             children: [
               "Next: Twilio ",
-              /* @__PURE__ */ jsx14(ChevronRight12, {
+              /* @__PURE__ */ jsx14(ChevronRight11, {
                 size: 16
               })
             ]
@@ -2954,7 +2337,7 @@ outputs:
 
 // src/components/docs/integrations/IntegrationsSlackPage.tsx
 import Link14 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight13 } from "lucide-react";
+import { ChevronRight as ChevronRight12 } from "lucide-react";
 import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 function IntegrationsSlackPage() {
   return /* @__PURE__ */ jsxs15("div", {
@@ -2964,7 +2347,7 @@ function IntegrationsSlackPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx15("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Slack Messaging"
           }),
           /* @__PURE__ */ jsx15("p", {
@@ -2977,11 +2360,11 @@ function IntegrationsSlackPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx15("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Required secrets and config"
           }),
           /* @__PURE__ */ jsx15("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx15("pre", {
               children: `// secret payload
 {
@@ -3002,18 +2385,18 @@ function IntegrationsSlackPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx15("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Webhook ingress"
           }),
           /* @__PURE__ */ jsxs15("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs15("li", {
                 children: [
                   "Inbound events are accepted on",
                   " ",
                   /* @__PURE__ */ jsx15("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "/webhooks/slack/events"
                   }),
                   "."
@@ -3023,7 +2406,7 @@ function IntegrationsSlackPage() {
                 children: [
                   "Requests are validated with Slack signatures (",
                   /* @__PURE__ */ jsx15("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "x-slack-signature"
                   }),
                   " ",
@@ -3041,11 +2424,11 @@ function IntegrationsSlackPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx15("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Workspace routing and dispatch"
           }),
           /* @__PURE__ */ jsx15("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx15("pre", {
               children: `# Workspace mapping (recommended)
 CHANNEL_WORKSPACE_MAP_SLACK={"T123":"workspace-acme"}
@@ -3064,11 +2447,11 @@ CHANNEL_DISPATCH_RUN_ON_START=1`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx15("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs15("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx15("li", {
                 children: "Keep bot tokens and signing secrets in a managed secret provider."
@@ -3099,7 +2482,7 @@ CHANNEL_DISPATCH_RUN_ON_START=1`
             className: "btn-primary",
             children: [
               "Next: GitHub Messaging ",
-              /* @__PURE__ */ jsx15(ChevronRight13, {
+              /* @__PURE__ */ jsx15(ChevronRight12, {
                 size: 16
               })
             ]
@@ -3112,7 +2495,7 @@ CHANNEL_DISPATCH_RUN_ON_START=1`
 
 // src/components/docs/integrations/IntegrationsSpecModelPage.tsx
 import Link15 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight14 } from "lucide-react";
+import { ChevronRight as ChevronRight13 } from "lucide-react";
 import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 function IntegrationsSpecModelPage() {
   return /* @__PURE__ */ jsxs16("div", {
@@ -3122,7 +2505,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Integration Spec Model"
           }),
           /* @__PURE__ */ jsx16("p", {
@@ -3135,7 +2518,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "IntegrationSpec"
           }),
           /* @__PURE__ */ jsxs16("p", {
@@ -3149,7 +2532,7 @@ function IntegrationsSpecModelPage() {
             ]
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `type IntegrationSpec = {
   id: string;
@@ -3213,11 +2596,11 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Example: Stripe IntegrationSpec"
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `{
   id: "stripe",
@@ -3293,7 +2676,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "IntegrationConnection"
           }),
           /* @__PURE__ */ jsxs16("p", {
@@ -3307,7 +2690,7 @@ function IntegrationsSpecModelPage() {
             ]
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `type IntegrationConnection = {
   id: string;
@@ -3342,11 +2725,11 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Example: Stripe IntegrationConnection"
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `// Production connection
 {
@@ -3391,7 +2774,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Example: Messaging IntegrationConnection"
           }),
           /* @__PURE__ */ jsx16("p", {
@@ -3399,7 +2782,7 @@ function IntegrationsSpecModelPage() {
             children: "Messaging providers use the same spec + connection model, then route inbound events through the channel runtime for signature validation, idempotent ingestion, policy decisions, and outbox-backed dispatch."
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `{
   id: "conn_slack_acme_prod",
@@ -3427,7 +2810,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Health transport strategy config"
           }),
           /* @__PURE__ */ jsx16("p", {
@@ -3435,7 +2818,7 @@ function IntegrationsSpecModelPage() {
             children: "Health providers support deterministic transport routing and explicit unofficial gating in connection config."
           }),
           /* @__PURE__ */ jsx16("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx16("pre", {
               children: `{
   "defaultTransport": "official-api",
@@ -3463,7 +2846,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Health checks"
           }),
           /* @__PURE__ */ jsx16("p", {
@@ -3471,7 +2854,7 @@ function IntegrationsSpecModelPage() {
             children: "IntegrationConnections are periodically health-checked to ensure they remain valid:"
           }),
           /* @__PURE__ */ jsxs16("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs16("li", {
                 children: [
@@ -3517,7 +2900,7 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Secret management"
           }),
           /* @__PURE__ */ jsx16("p", {
@@ -3525,7 +2908,7 @@ function IntegrationsSpecModelPage() {
             children: "Secrets (API keys, tokens) are never stored in plaintext:"
           }),
           /* @__PURE__ */ jsxs16("ol", {
-            className: "text-muted-foreground list-inside list-decimal space-y-2",
+            className: "list-inside list-decimal space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx16("li", {
                 children: "User provides secrets through secure UI or API"
@@ -3550,11 +2933,11 @@ function IntegrationsSpecModelPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx16("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs16("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx16("li", {
                 children: "Always maintain separate sandbox and production connections"
@@ -3591,7 +2974,7 @@ function IntegrationsSpecModelPage() {
             className: "btn-primary",
             children: [
               "Integration Binding ",
-              /* @__PURE__ */ jsx16(ChevronRight14, {
+              /* @__PURE__ */ jsx16(ChevronRight13, {
                 size: 16
               })
             ]
@@ -3604,7 +2987,7 @@ function IntegrationsSpecModelPage() {
 
 // src/components/docs/integrations/IntegrationsStripePage.tsx
 import Link16 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight15 } from "lucide-react";
+import { ChevronRight as ChevronRight14 } from "lucide-react";
 import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
 function IntegrationsStripePage() {
   return /* @__PURE__ */ jsxs17("div", {
@@ -3614,7 +2997,7 @@ function IntegrationsStripePage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Stripe"
           }),
           /* @__PURE__ */ jsx17("p", {
@@ -3627,7 +3010,7 @@ function IntegrationsStripePage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx17("p", {
@@ -3635,7 +3018,7 @@ function IntegrationsStripePage() {
             children: "Add your Stripe credentials to your environment variables:"
           }),
           /* @__PURE__ */ jsx17("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx17("pre", {
               children: `# .env
 STRIPE_SECRET_KEY=sk_test_...
@@ -3664,18 +3047,18 @@ STRIPE_WEBHOOK_SECRET=whsec_...`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Available capabilities"
           }),
           /* @__PURE__ */ jsxs17("div", {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx17("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Payment Intents"
               }),
               /* @__PURE__ */ jsx17("div", {
-                className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+                className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
                 children: /* @__PURE__ */ jsx17("pre", {
                   children: `capabilityId: stripe-create-payment-intent
 provider:
@@ -3711,11 +3094,11 @@ outputs:
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx17("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Customers"
               }),
               /* @__PURE__ */ jsx17("div", {
-                className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+                className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
                 children: /* @__PURE__ */ jsx17("pre", {
                   children: `capabilityId: stripe-create-customer
 provider:
@@ -3745,11 +3128,11 @@ outputs:
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx17("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Subscriptions"
               }),
               /* @__PURE__ */ jsx17("div", {
-                className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+                className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
                 children: /* @__PURE__ */ jsx17("pre", {
                   children: `capabilityId: stripe-create-subscription
 provider:
@@ -3782,7 +3165,7 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Webhooks"
           }),
           /* @__PURE__ */ jsx17("p", {
@@ -3790,7 +3173,7 @@ outputs:
             children: "ContractSpec automatically handles Stripe webhooks. Configure your webhook endpoint in the Stripe Dashboard:"
           }),
           /* @__PURE__ */ jsx17("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx17("pre", {
               children: `https://your-app.com/api/webhooks/stripe`
             })
@@ -3800,35 +3183,35 @@ outputs:
             children: "Subscribe to these events:"
           }),
           /* @__PURE__ */ jsxs17("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx17("li", {
                 children: /* @__PURE__ */ jsx17("code", {
-                  className: "bg-background/50 rounded px-2 py-1",
+                  className: "rounded bg-background/50 px-2 py-1",
                   children: "payment_intent.succeeded"
                 })
               }),
               /* @__PURE__ */ jsx17("li", {
                 children: /* @__PURE__ */ jsx17("code", {
-                  className: "bg-background/50 rounded px-2 py-1",
+                  className: "rounded bg-background/50 px-2 py-1",
                   children: "payment_intent.payment_failed"
                 })
               }),
               /* @__PURE__ */ jsx17("li", {
                 children: /* @__PURE__ */ jsx17("code", {
-                  className: "bg-background/50 rounded px-2 py-1",
+                  className: "rounded bg-background/50 px-2 py-1",
                   children: "customer.subscription.created"
                 })
               }),
               /* @__PURE__ */ jsx17("li", {
                 children: /* @__PURE__ */ jsx17("code", {
-                  className: "bg-background/50 rounded px-2 py-1",
+                  className: "rounded bg-background/50 px-2 py-1",
                   children: "customer.subscription.updated"
                 })
               }),
               /* @__PURE__ */ jsx17("li", {
                 children: /* @__PURE__ */ jsx17("code", {
-                  className: "bg-background/50 rounded px-2 py-1",
+                  className: "rounded bg-background/50 px-2 py-1",
                   children: "customer.subscription.deleted"
                 })
               })
@@ -3840,7 +3223,7 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Example workflow"
           }),
           /* @__PURE__ */ jsx17("p", {
@@ -3848,7 +3231,7 @@ outputs:
             children: "Here's a complete payment workflow using Stripe:"
           }),
           /* @__PURE__ */ jsx17("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx17("pre", {
               children: `workflowId: process-payment
 version: '1.0.0'.0.0
@@ -3895,7 +3278,7 @@ steps:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Testing"
           }),
           /* @__PURE__ */ jsx17("p", {
@@ -3903,7 +3286,7 @@ steps:
             children: "Use Stripe's test cards for development:"
           }),
           /* @__PURE__ */ jsx17("div", {
-            className: "border-border/50 overflow-x-auto rounded-lg border",
+            className: "overflow-x-auto rounded-lg border border-border/50",
             children: /* @__PURE__ */ jsxs17("table", {
               className: "w-full text-left text-sm",
               children: [
@@ -3924,7 +3307,7 @@ steps:
                   })
                 }),
                 /* @__PURE__ */ jsxs17("tbody", {
-                  className: "divide-border/50 divide-y",
+                  className: "divide-y divide-border/50",
                   children: [
                     /* @__PURE__ */ jsxs17("tr", {
                       children: [
@@ -3973,11 +3356,11 @@ steps:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx17("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs17("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx17("li", {
                 children: "Always use test mode during development"
@@ -4014,7 +3397,7 @@ steps:
             className: "btn-primary",
             children: [
               "Next: Postmark ",
-              /* @__PURE__ */ jsx17(ChevronRight15, {
+              /* @__PURE__ */ jsx17(ChevronRight14, {
                 size: 16
               })
             ]
@@ -4036,7 +3419,7 @@ function IntegrationsTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx18("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Twilio"
           }),
           /* @__PURE__ */ jsx18("p", {
@@ -4049,11 +3432,11 @@ function IntegrationsTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx18("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Setup"
           }),
           /* @__PURE__ */ jsx18("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx18("pre", {
               children: `# .env
 TWILIO_ACCOUNT_SID=...
@@ -4067,11 +3450,11 @@ TWILIO_PHONE_NUMBER=+1234567890`
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx18("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Sending SMS"
           }),
           /* @__PURE__ */ jsx18("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx18("pre", {
               children: `capabilityId: twilio-send-sms
 provider:
@@ -4099,11 +3482,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx18("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Use cases"
           }),
           /* @__PURE__ */ jsxs18("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx18("li", {
                 children: "Order confirmations and shipping updates"
@@ -4125,11 +3508,11 @@ outputs:
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx18("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs18("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx18("li", {
                 children: "Always use E.164 format for phone numbers (+1234567890)"
@@ -4171,7 +3554,7 @@ outputs:
 
 // src/components/docs/integrations/IntegrationsWhatsappMetaPage.tsx
 import Link18 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight16 } from "lucide-react";
+import { ChevronRight as ChevronRight15 } from "lucide-react";
 import { jsx as jsx19, jsxs as jsxs19 } from "react/jsx-runtime";
 function IntegrationsWhatsappMetaPage() {
   return /* @__PURE__ */ jsxs19("div", {
@@ -4181,7 +3564,7 @@ function IntegrationsWhatsappMetaPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx19("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "WhatsApp Meta"
           }),
           /* @__PURE__ */ jsx19("p", {
@@ -4194,11 +3577,11 @@ function IntegrationsWhatsappMetaPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx19("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Required secrets and config"
           }),
           /* @__PURE__ */ jsx19("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx19("pre", {
               children: `// secret payload
 {
@@ -4220,18 +3603,18 @@ function IntegrationsWhatsappMetaPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx19("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Webhook endpoints"
           }),
           /* @__PURE__ */ jsxs19("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs19("li", {
                 children: [
                   "Verification challenge:",
                   " ",
                   /* @__PURE__ */ jsx19("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "GET /webhooks/whatsapp/meta"
                   })
                 ]
@@ -4241,7 +3624,7 @@ function IntegrationsWhatsappMetaPage() {
                   "Inbound messages:",
                   " ",
                   /* @__PURE__ */ jsx19("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "POST /webhooks/whatsapp/meta"
                   })
                 ]
@@ -4251,7 +3634,7 @@ function IntegrationsWhatsappMetaPage() {
                   "Signatures are validated with",
                   " ",
                   /* @__PURE__ */ jsx19("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "x-hub-signature-256"
                   }),
                   "."
@@ -4265,11 +3648,11 @@ function IntegrationsWhatsappMetaPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx19("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Workspace mapping"
           }),
           /* @__PURE__ */ jsx19("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx19("pre", {
               children: `CHANNEL_WORKSPACE_MAP_WHATSAPP_META={"120000000001":"workspace-acme"}`
             })
@@ -4280,11 +3663,11 @@ function IntegrationsWhatsappMetaPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx19("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs19("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx19("li", {
                 children: "Keep verify and app secrets separate from access tokens."
@@ -4312,7 +3695,7 @@ function IntegrationsWhatsappMetaPage() {
             className: "btn-primary",
             children: [
               "Next: WhatsApp Twilio ",
-              /* @__PURE__ */ jsx19(ChevronRight16, {
+              /* @__PURE__ */ jsx19(ChevronRight15, {
                 size: 16
               })
             ]
@@ -4325,7 +3708,7 @@ function IntegrationsWhatsappMetaPage() {
 
 // src/components/docs/integrations/IntegrationsWhatsappTwilioPage.tsx
 import Link19 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight17 } from "lucide-react";
+import { ChevronRight as ChevronRight16 } from "lucide-react";
 import { jsx as jsx20, jsxs as jsxs20 } from "react/jsx-runtime";
 function IntegrationsWhatsappTwilioPage() {
   return /* @__PURE__ */ jsxs20("div", {
@@ -4335,7 +3718,7 @@ function IntegrationsWhatsappTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx20("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "WhatsApp Twilio"
           }),
           /* @__PURE__ */ jsx20("p", {
@@ -4348,11 +3731,11 @@ function IntegrationsWhatsappTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx20("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Required secrets and config"
           }),
           /* @__PURE__ */ jsx20("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx20("pre", {
               children: `// secret payload
 {
@@ -4372,18 +3755,18 @@ function IntegrationsWhatsappTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx20("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Webhook ingress"
           }),
           /* @__PURE__ */ jsxs20("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxs20("li", {
                 children: [
                   "Inbound Twilio form payloads are accepted on",
                   " ",
                   /* @__PURE__ */ jsx20("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "/webhooks/whatsapp/twilio"
                   }),
                   "."
@@ -4394,7 +3777,7 @@ function IntegrationsWhatsappTwilioPage() {
                   "Signatures are validated with",
                   " ",
                   /* @__PURE__ */ jsx20("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "x-twilio-signature"
                   }),
                   " ",
@@ -4406,7 +3789,7 @@ function IntegrationsWhatsappTwilioPage() {
                   "For deterministic verification, set the exact public webhook URL in",
                   " ",
                   /* @__PURE__ */ jsx20("code", {
-                    className: "bg-background/50 rounded px-2 py-1",
+                    className: "rounded bg-background/50 px-2 py-1",
                     children: "WHATSAPP_TWILIO_WEBHOOK_URL"
                   }),
                   "."
@@ -4420,11 +3803,11 @@ function IntegrationsWhatsappTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx20("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Workspace mapping"
           }),
           /* @__PURE__ */ jsx20("div", {
-            className: "bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm",
+            className: "overflow-x-auto rounded-lg border border-border bg-background/50 p-4 font-mono text-muted-foreground text-sm",
             children: /* @__PURE__ */ jsx20("pre", {
               children: `CHANNEL_WORKSPACE_MAP_WHATSAPP_TWILIO={"AC123":"workspace-acme"}`
             })
@@ -4435,11 +3818,11 @@ function IntegrationsWhatsappTwilioPage() {
         className: "space-y-4",
         children: [
           /* @__PURE__ */ jsx20("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Best practices"
           }),
           /* @__PURE__ */ jsxs20("ul", {
-            className: "text-muted-foreground list-inside list-disc space-y-2",
+            className: "list-inside list-disc space-y-2 text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx20("li", {
                 children: "Use Twilio as fallback when Meta WhatsApp is your primary route."
@@ -4451,7 +3834,7 @@ function IntegrationsWhatsappTwilioPage() {
                 children: [
                   "Protect internal dispatch endpoints with",
                   /* @__PURE__ */ jsx20("code", {
-                    className: "bg-background/50 ml-1 rounded px-2 py-1",
+                    className: "ml-1 rounded bg-background/50 px-2 py-1",
                     children: "CHANNEL_DISPATCH_TOKEN"
                   }),
                   "."
@@ -4474,7 +3857,7 @@ function IntegrationsWhatsappTwilioPage() {
             className: "btn-primary",
             children: [
               "Next: Health Routing ",
-              /* @__PURE__ */ jsx20(ChevronRight17, {
+              /* @__PURE__ */ jsx20(ChevronRight16, {
                 size: 16
               })
             ]