@contractspec/bundle.library 3.7.6 → 3.7.7

package/dist/node/components/docs/guides/index.js

@@ -2,16 +2,16 @@
 import Link from "@contractspec/lib.ui-link";
 import { jsx, jsxs } from "react/jsx-runtime";
 function StudioPrompt({
-  title = "Want to turn product signals into spec-first deliverables?",
-  body = "ContractSpec Studio ingests evidence from meetings, support, analytics, docs, and code, then compiles decisions into spec diffs and task packs.",
-  ctaLabel = "Try Studio",
-  href = "https://www.contractspec.studio"
+  title = "Need the operating layer on top of OSS ContractSpec?",
+  body = "ContractSpec Studio helps teams turn evidence into proposed spec changes, governed delivery loops, and execution-ready task packs while keeping the open contract system as the source of truth.",
+  ctaLabel = "See what Studio adds",
+  href = "https://www.contractspec.studio/docs"
 }) {
   return /* @__PURE__ */ jsxs("div", {
     className: "card-subtle space-y-3 p-6",
     children: [
       /* @__PURE__ */ jsx("h3", {
-        className: "text-lg font-semibold",
+        className: "font-semibold text-lg",
         children: title
       }),
       /* @__PURE__ */ jsx("p", {
@@ -40,11 +40,11 @@ function GuideCIDiffGatingPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx2("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "CI gating with deterministic diffs"
           }),
           /* @__PURE__ */ jsx2("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: "Add ContractSpec CI checks that validate specs, detect drift, and gate breaking changes before merge."
           })
         ]
@@ -53,11 +53,11 @@ function GuideCIDiffGatingPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx2("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll build"
           }),
           /* @__PURE__ */ jsxs2("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx2("li", {
                 children: "CI workflow running ContractSpec validation and drift checks."
@@ -79,7 +79,7 @@ function GuideCIDiffGatingPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx2("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Add the CI workflow"
               }),
               /* @__PURE__ */ jsx2("p", {
@@ -107,7 +107,7 @@ function GuideCIDiffGatingPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx2("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Run CI locally"
               }),
               /* @__PURE__ */ jsx2(CodeBlock, {
@@ -125,7 +125,7 @@ function GuideCIDiffGatingPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx2("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Add a diff check"
               }),
               /* @__PURE__ */ jsx2("p", {
@@ -147,7 +147,7 @@ function GuideCIDiffGatingPage() {
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx2("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Example package"
               }),
               /* @__PURE__ */ jsx2("p", {
@@ -196,7 +196,7 @@ bun run validate`
 // src/components/docs/guides/GuideContractTypesPage.tsx
 import { CodeBlock as CodeBlock2 } from "@contractspec/lib.design-system";
 import Link3 from "@contractspec/lib.ui-link";
-import { ChevronRight as ChevronRight2, Layers, Zap, Shield, Globe } from "lucide-react";
+import { ChevronRight as ChevronRight2, Globe, Layers, Shield, Zap } from "lucide-react";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var contractTypes = [
   {
@@ -236,12 +236,12 @@ function GuideContractTypesPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx3("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Contract Types Overview"
           }),
           /* @__PURE__ */ jsx3("p", {
-            className: "text-muted-foreground text-lg",
-            children: "Learn about the different contract types in ContractSpec and when to use each one for spec-first development."
+            className: "text-lg text-muted-foreground",
+            children: "Learn about the different contract types in ContractSpec and when to use each one when you are making the system boundary explicit."
           })
         ]
       }),
@@ -249,7 +249,7 @@ function GuideContractTypesPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Core Contract Types"
           }),
           /* @__PURE__ */ jsx3("div", {
@@ -273,7 +273,7 @@ function GuideContractTypesPage() {
                       children: type.description
                     }),
                     /* @__PURE__ */ jsx3("code", {
-                      className: "text-xs text-violet-400",
+                      className: "text-violet-400 text-xs",
                       children: type.factory
                     })
                   ]
@@ -290,7 +290,7 @@ function GuideContractTypesPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Operations (Commands & Queries)"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -374,7 +374,7 @@ export const GetUserQuery = defineQuery({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Events"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -433,7 +433,7 @@ export const UserDeletedEvent = defineEvent({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Capabilities"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -494,7 +494,7 @@ export const AdminUserCapability = defineCapability({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "4) Presentations"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -534,7 +534,7 @@ export const UserListPresentation = definePresentation({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "5) Additional Contract Types"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -552,7 +552,7 @@ export const UserListPresentation = definePresentation({
                         children: "Policy"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "definePolicy"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -569,7 +569,7 @@ export const UserListPresentation = definePresentation({
                         children: "Workflow"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineWorkflow"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -586,7 +586,7 @@ export const UserListPresentation = definePresentation({
                         children: "Translation"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineTranslation"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -603,7 +603,7 @@ export const UserListPresentation = definePresentation({
                         children: "Integration"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineIntegration"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -620,7 +620,7 @@ export const UserListPresentation = definePresentation({
                         children: "Form"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineFormSpec"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -637,7 +637,7 @@ export const UserListPresentation = definePresentation({
                         children: "Data View"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineDataView"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -654,7 +654,7 @@ export const UserListPresentation = definePresentation({
                         children: "Feature"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineFeature"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -671,7 +671,7 @@ export const UserListPresentation = definePresentation({
                         children: "Test"
                       }),
                       /* @__PURE__ */ jsx3("code", {
-                        className: "text-xs text-violet-400",
+                        className: "text-violet-400 text-xs",
                         children: "defineTestSpec"
                       }),
                       /* @__PURE__ */ jsx3("p", {
@@ -688,7 +688,7 @@ export const UserListPresentation = definePresentation({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "6) Registering Contracts"
               }),
               /* @__PURE__ */ jsx3("p", {
@@ -736,7 +736,7 @@ capabilityRegistry.register(UserManagementCapability);`
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx3("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Contract Type Decision Guide"
               }),
               /* @__PURE__ */ jsxs3("table", {
@@ -744,7 +744,7 @@ capabilityRegistry.register(UserManagementCapability);`
                 children: [
                   /* @__PURE__ */ jsx3("thead", {
                     children: /* @__PURE__ */ jsxs3("tr", {
-                      className: "border-b border-white/10",
+                      className: "border-white/10 border-b",
                       children: [
                         /* @__PURE__ */ jsx3("th", {
                           className: "py-2 text-left",
@@ -761,7 +761,7 @@ capabilityRegistry.register(UserManagementCapability);`
                     className: "text-muted-foreground",
                     children: [
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -776,7 +776,7 @@ capabilityRegistry.register(UserManagementCapability);`
                         ]
                       }),
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -791,7 +791,7 @@ capabilityRegistry.register(UserManagementCapability);`
                         ]
                       }),
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -806,7 +806,7 @@ capabilityRegistry.register(UserManagementCapability);`
                         ]
                       }),
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -821,7 +821,7 @@ capabilityRegistry.register(UserManagementCapability);`
                         ]
                       }),
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -836,7 +836,7 @@ capabilityRegistry.register(UserManagementCapability);`
                         ]
                       }),
                       /* @__PURE__ */ jsxs3("tr", {
-                        className: "border-b border-white/5",
+                        className: "border-white/5 border-b",
                         children: [
                           /* @__PURE__ */ jsx3("td", {
                             className: "py-2",
@@ -913,11 +913,11 @@ function GuideDocsPipelinePage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx4("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Build the docs pipeline"
           }),
           /* @__PURE__ */ jsx4("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: "Generate reference docs, chunk the index, and wire the docs pages the same way this repo does."
           })
         ]
@@ -926,11 +926,11 @@ function GuideDocsPipelinePage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll build"
           }),
           /* @__PURE__ */ jsxs4("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx4("li", {
                 children: "Generated Markdown and a chunked index manifest."
@@ -952,7 +952,7 @@ function GuideDocsPipelinePage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Generate contract docs"
               }),
               /* @__PURE__ */ jsx4(CodeBlock3, {
@@ -976,7 +976,7 @@ function GuideDocsPipelinePage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Build the docs index"
               }),
               /* @__PURE__ */ jsx4(CodeBlock3, {
@@ -1006,7 +1006,7 @@ bun docs:generate -- --version v1.0.0`
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Wire reference routes"
               }),
               /* @__PURE__ */ jsx4(CodeBlock3, {
@@ -1048,7 +1048,7 @@ export default async function Page({ params }: { params: { slug?: string[] } })
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx4("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Repo reference"
               }),
               /* @__PURE__ */ jsxs4("p", {
@@ -1107,11 +1107,11 @@ function GuideGenerateDocsClientsSchemasPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx5("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Generate docs + client schemas"
           }),
           /* @__PURE__ */ jsx5("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: "Generate docs and OpenAPI output from ContractSpec operations to power SDKs, docs sites, and tooling."
           })
         ]
@@ -1120,11 +1120,11 @@ function GuideGenerateDocsClientsSchemasPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll build"
           }),
           /* @__PURE__ */ jsxs5("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx5("li", {
                 children: "Export docs from your specs."
@@ -1146,7 +1146,7 @@ function GuideGenerateDocsClientsSchemasPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Generate docs"
               }),
               /* @__PURE__ */ jsx5("p", {
@@ -1174,7 +1174,7 @@ function GuideGenerateDocsClientsSchemasPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Export OpenAPI"
               }),
               /* @__PURE__ */ jsx5("p", {
@@ -1203,7 +1203,7 @@ function GuideGenerateDocsClientsSchemasPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Validate specs"
               }),
               /* @__PURE__ */ jsx5(CodeBlock4, {
@@ -1227,7 +1227,7 @@ function GuideGenerateDocsClientsSchemasPage() {
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx5("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Example package"
               }),
               /* @__PURE__ */ jsx5("p", {
@@ -1278,11 +1278,11 @@ contractspec openapi export --registry ./src/contracts/registry.ts --out ./gener
 import { CodeBlock as CodeBlock5 } from "@contractspec/lib.design-system";
 import Link6 from "@contractspec/lib.ui-link";
 import {
+  AlertCircle,
   ChevronRight as ChevronRight5,
   FileCode,
   Scan,
-  Settings,
-  AlertCircle
+  Settings
 } from "lucide-react";
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var supportedFrameworks = [
@@ -1330,12 +1330,12 @@ function GuideImportExistingCodebasesPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx6("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Import Existing Codebases"
           }),
           /* @__PURE__ */ jsx6("p", {
-            className: "text-muted-foreground text-lg",
-            children: "Convert your existing API endpoints into ContractSpec contracts. Auto-detect frameworks, extract schemas, and generate spec-first definitions from your code."
+            className: "text-lg text-muted-foreground",
+            children: "Convert your existing API endpoints into ContractSpec contracts. Auto-detect frameworks, extract schemas, and generate explicit contract definitions from your code."
           })
         ]
       }),
@@ -1343,11 +1343,11 @@ function GuideImportExistingCodebasesPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx6("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll learn"
           }),
           /* @__PURE__ */ jsxs6("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx6("li", {
                 children: "How to import existing API endpoints as ContractSpec contracts."
@@ -1372,7 +1372,7 @@ function GuideImportExistingCodebasesPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "Why import existing code?"
               }),
               /* @__PURE__ */ jsx6("p", {
@@ -1380,7 +1380,7 @@ function GuideImportExistingCodebasesPage() {
                 children: "Instead of writing contracts from scratch, the import command extracts endpoint patterns from your existing codebase. This gives you:"
               }),
               /* @__PURE__ */ jsxs6("ul", {
-                className: "text-muted-foreground list-disc space-y-1 pl-5 text-sm",
+                className: "list-disc space-y-1 pl-5 text-muted-foreground text-sm",
                 children: [
                   /* @__PURE__ */ jsx6("li", {
                     children: "Instant spec coverage for existing APIs"
@@ -1402,7 +1402,7 @@ function GuideImportExistingCodebasesPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "Supported frameworks"
               }),
               /* @__PURE__ */ jsx6("div", {
@@ -1426,7 +1426,7 @@ function GuideImportExistingCodebasesPage() {
                           children: fw.description
                         }),
                         /* @__PURE__ */ jsxs6("code", {
-                          className: "text-xs text-violet-400",
+                          className: "text-violet-400 text-xs",
                           children: [
                             "--framework ",
                             fw.flag
@@ -1443,7 +1443,7 @@ function GuideImportExistingCodebasesPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Quick start"
               }),
               /* @__PURE__ */ jsx6("p", {
@@ -1472,7 +1472,7 @@ contractspec import ./src --framework nestjs`
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Framework-specific patterns"
               }),
               /* @__PURE__ */ jsx6("p", {
@@ -1485,7 +1485,7 @@ contractspec import ./src --framework nestjs`
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsxs6("h3", {
-                className: "flex items-center gap-2 text-xl font-semibold",
+                className: "flex items-center gap-2 font-semibold text-xl",
                 children: [
                   /* @__PURE__ */ jsx6(Scan, {
                     size: 18,
@@ -1549,7 +1549,7 @@ export class UsersController {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsxs6("h3", {
-                className: "flex items-center gap-2 text-xl font-semibold",
+                className: "flex items-center gap-2 font-semibold text-xl",
                 children: [
                   /* @__PURE__ */ jsx6(Scan, {
                     size: 18,
@@ -1593,7 +1593,7 @@ router.post('/users', validateBody(CreateUserSchema), async (req, res) => {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsxs6("h3", {
-                className: "flex items-center gap-2 text-xl font-semibold",
+                className: "flex items-center gap-2 font-semibold text-xl",
                 children: [
                   /* @__PURE__ */ jsx6(Scan, {
                     size: 18,
@@ -1648,7 +1648,7 @@ export async function POST(request: Request) {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Understanding generated contracts"
               }),
               /* @__PURE__ */ jsx6("p", {
@@ -1726,7 +1726,7 @@ export const CreateUserCommand = defineCommand({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "4) Customizing imports"
               }),
               /* @__PURE__ */ jsxs6("div", {
@@ -1737,7 +1737,7 @@ export const CreateUserCommand = defineCommand({
                     className: "text-violet-400"
                   }),
                   /* @__PURE__ */ jsx6("h3", {
-                    className: "text-lg font-semibold",
+                    className: "font-semibold text-lg",
                     children: "Available options"
                   })
                 ]
@@ -1749,7 +1749,7 @@ export const CreateUserCommand = defineCommand({
                   children: [
                     /* @__PURE__ */ jsx6("thead", {
                       children: /* @__PURE__ */ jsxs6("tr", {
-                        className: "border-b border-white/10",
+                        className: "border-white/10 border-b",
                         children: [
                           /* @__PURE__ */ jsx6("th", {
                             className: "py-2 pr-4 text-left",
@@ -1770,7 +1770,7 @@ export const CreateUserCommand = defineCommand({
                       className: "text-muted-foreground",
                       children: [
                         /* @__PURE__ */ jsxs6("tr", {
-                          className: "border-b border-white/5",
+                          className: "border-white/5 border-b",
                           children: [
                             /* @__PURE__ */ jsx6("td", {
                               className: "py-2 pr-4",
@@ -1791,7 +1791,7 @@ export const CreateUserCommand = defineCommand({
                           ]
                         }),
                         /* @__PURE__ */ jsxs6("tr", {
-                          className: "border-b border-white/5",
+                          className: "border-white/5 border-b",
                           children: [
                             /* @__PURE__ */ jsx6("td", {
                               className: "py-2 pr-4",
@@ -1812,7 +1812,7 @@ export const CreateUserCommand = defineCommand({
                           ]
                         }),
                         /* @__PURE__ */ jsxs6("tr", {
-                          className: "border-b border-white/5",
+                          className: "border-white/5 border-b",
                           children: [
                             /* @__PURE__ */ jsx6("td", {
                               className: "py-2 pr-4",
@@ -1833,7 +1833,7 @@ export const CreateUserCommand = defineCommand({
                           ]
                         }),
                         /* @__PURE__ */ jsxs6("tr", {
-                          className: "border-b border-white/5",
+                          className: "border-white/5 border-b",
                           children: [
                             /* @__PURE__ */ jsx6("td", {
                               className: "py-2 pr-4",
@@ -1854,7 +1854,7 @@ export const CreateUserCommand = defineCommand({
                           ]
                         }),
                         /* @__PURE__ */ jsxs6("tr", {
-                          className: "border-b border-white/5",
+                          className: "border-white/5 border-b",
                           children: [
                             /* @__PURE__ */ jsx6("td", {
                               className: "py-2 pr-4",
@@ -1920,7 +1920,7 @@ contractspec import ./src --json > import-result.json`
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "5) Registering imported contracts"
               }),
               /* @__PURE__ */ jsx6("p", {
@@ -1958,11 +1958,11 @@ installOp(registry, CreateUserCommand, async (input) => {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "6) After importing"
               }),
               /* @__PURE__ */ jsxs6("ol", {
-                className: "text-muted-foreground list-decimal space-y-2 pl-5 text-sm",
+                className: "list-decimal space-y-2 pl-5 text-muted-foreground text-sm",
                 children: [
                   /* @__PURE__ */ jsxs6("li", {
                     children: [
@@ -2017,7 +2017,7 @@ installOp(registry, CreateUserCommand, async (input) => {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsxs6("h2", {
-                className: "flex items-center gap-2 text-2xl font-bold",
+                className: "flex items-center gap-2 font-bold text-2xl",
                 children: [
                   /* @__PURE__ */ jsx6(AlertCircle, {
                     size: 20,
@@ -2093,7 +2093,7 @@ installOp(registry, CreateUserCommand, async (input) => {
           }),
           /* @__PURE__ */ jsx6(StudioPrompt, {
             title: "Want evidence-driven migration priorities?",
-            body: "Studio clusters product signals into scored patterns, then proposes spec-first change cards for the highest-impact areas."
+            body: "Studio clusters product signals into scored patterns, then proposes contract changes and execution-ready work for the highest-impact areas."
           })
         ]
       }),
@@ -2134,11 +2134,11 @@ function GuideNextjsOneEndpointPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx7("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Next.js: add one endpoint"
           }),
           /* @__PURE__ */ jsx7("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: "Add ContractSpec to an existing Next.js App Router project by wiring a single operation end-to-end with validation and types."
           })
         ]
@@ -2147,11 +2147,11 @@ function GuideNextjsOneEndpointPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx7("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll build"
           }),
           /* @__PURE__ */ jsxs7("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx7("li", {
                 children: "One OperationSpec with SchemaModel validation."
@@ -2173,7 +2173,7 @@ function GuideNextjsOneEndpointPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx7("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Install core packages"
               }),
               /* @__PURE__ */ jsx7(CodeBlock6, {
@@ -2198,7 +2198,7 @@ bun add @contractspec/lib.contracts-spec @contractspec/lib.contracts-runtime-ser
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx7("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Define the operation spec"
               }),
               /* @__PURE__ */ jsxs7("p", {
@@ -2253,7 +2253,7 @@ export const HealthcheckQuery = defineQuery({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx7("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Register the operation"
               }),
               /* @__PURE__ */ jsxs7("p", {
@@ -2288,7 +2288,7 @@ installOp(registry, HealthcheckQuery, async () => ({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx7("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "4) Add the Next.js handler"
               }),
               /* @__PURE__ */ jsxs7("p", {
@@ -2330,7 +2330,7 @@ export { handler as GET, handler as POST };`
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx7("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "5) Validate the spec"
               }),
               /* @__PURE__ */ jsx7(CodeBlock6, {
@@ -2354,7 +2354,7 @@ export { handler as GET, handler as POST };`
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx7("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Example package"
               }),
               /* @__PURE__ */ jsxs7("p", {
@@ -2421,11 +2421,11 @@ function GuideSpecValidationTypingPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx8("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: "Spec-driven validation + typing"
           }),
           /* @__PURE__ */ jsx8("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: "Define a single operation with SchemaModel, generate validation, and keep your existing handler logic."
           })
         ]
@@ -2434,11 +2434,11 @@ function GuideSpecValidationTypingPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx8("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "What you'll build"
           }),
           /* @__PURE__ */ jsxs8("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: [
               /* @__PURE__ */ jsx8("li", {
                 children: "One command spec with explicit input/output models."
@@ -2460,7 +2460,7 @@ function GuideSpecValidationTypingPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx8("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "1) Define the spec"
               }),
               /* @__PURE__ */ jsxs8("p", {
@@ -2530,7 +2530,7 @@ export const ContactCreateCommand = defineCommand({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx8("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "2) Wire the handler"
               }),
               /* @__PURE__ */ jsx8("p", {
@@ -2560,7 +2560,7 @@ export const ContactCreateCommand = defineCommand({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx8("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "3) Validate"
               }),
               /* @__PURE__ */ jsx8(CodeBlock7, {
@@ -2584,7 +2584,7 @@ export const ContactCreateCommand = defineCommand({
             className: "card-subtle space-y-3 p-6",
             children: [
               /* @__PURE__ */ jsx8("h3", {
-                className: "text-lg font-semibold",
+                className: "font-semibold text-lg",
                 children: "Example package"
               }),
               /* @__PURE__ */ jsx8("p", {
@@ -2635,48 +2635,42 @@ bun run validate`
 // src/components/docs/guides/GuidesIndexPage.tsx
 import { CodeBlock as CodeBlock8 } from "@contractspec/lib.design-system";
 import Link9 from "@contractspec/lib.ui-link";
-import { ArrowRight, BookOpen, CheckCircle2 } from "lucide-react";
+import { ArrowRight, CheckCircle2, GitBranch } from "lucide-react";
 import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var guides = [
   {
-    title: "Contract types overview",
-    description: "Learn about the different contract types and when to use each one.",
-    href: "/docs/guides/contract-types",
-    time: "15 min"
-  },
-  {
-    title: "Next.js: one endpoint",
-    description: "Add ContractSpec to an existing Next.js app by wiring one operation end-to-end.",
+    title: "Adopt one endpoint in Next.js",
+    description: "Start inside a live app with one operation, one generated surface, and one clearly bounded change.",
     href: "/docs/guides/nextjs-one-endpoint",
     time: "25 min"
   },
   {
-    title: "Import existing codebases",
-    description: "Convert your existing API endpoints into ContractSpec contracts for fast onboarding.",
+    title: "Import an existing codebase",
+    description: "Stabilize what already exists instead of treating adoption as a rewrite project.",
     href: "/docs/guides/import-existing-codebases",
     time: "20 min"
   },
   {
-    title: "Spec-driven validation + typing",
-    description: "Define operations with SchemaModel, generate types, and enforce validation without rewrites.",
+    title: "Validation and typing",
+    description: "Keep runtime validation and TypeScript behavior aligned from the same source definitions.",
     href: "/docs/guides/spec-validation-and-typing",
     time: "20 min"
   },
   {
-    title: "Generate docs + client schemas",
-    description: "Export docs and OpenAPI for client SDKs and tooling from your specs.",
+    title: "Generate docs and clients",
+    description: "Publish stable docs, schemas, and client-facing artifacts from the contract layer.",
     href: "/docs/guides/generate-docs-clients-schemas",
     time: "20 min"
   },
   {
     title: "Docs pipeline",
-    description: "Wire generated docs into a reference site with a chunked index.",
+    description: "Feed generated reference material into the docs site without confusing ownership.",
     href: "/docs/guides/docs-generation-pipeline",
     time: "20 min"
   },
   {
-    title: "CI gating with deterministic diffs",
-    description: "Add ContractSpec CI checks to gate breaking changes and drift.",
+    title: "CI diff gating",
+    description: "Use deterministic checks to catch drift and risky changes before they ship.",
     href: "/docs/guides/ci-contract-diff-gating",
     time: "15 min"
   }
@@ -2688,13 +2682,17 @@ function GuidesIndexPage() {
       /* @__PURE__ */ jsxs9("div", {
         className: "space-y-3",
         children: [
+          /* @__PURE__ */ jsx9("p", {
+            className: "editorial-kicker",
+            children: "Build"
+          }),
           /* @__PURE__ */ jsx9("h1", {
-            className: "text-4xl font-bold",
-            children: "Guides"
+            className: "font-serif text-4xl tracking-[-0.04em] md:text-5xl",
+            children: "Adoption guides for teams that want to keep their code."
           }),
           /* @__PURE__ */ jsx9("p", {
-            className: "text-muted-foreground text-lg",
-            children: "Hands-on guides with commands, expected output, and CI-verified example packages."
+            className: "max-w-3xl text-lg text-muted-foreground leading-8",
+            children: "These guides assume you are introducing ContractSpec into a real code base. Start with a narrow surface, verify the generated outputs, and expand only after the contract loop feels trustworthy."
           })
         ]
       }),
@@ -2702,27 +2700,31 @@ function GuidesIndexPage() {
         className: "grid gap-4 md:grid-cols-2",
         children: guides.map((guide) => /* @__PURE__ */ jsxs9(Link9, {
           href: guide.href,
-          className: "card-subtle group space-y-3 p-6 transition-colors hover:border-violet-500/50",
+          className: "editorial-panel",
           children: [
             /* @__PURE__ */ jsxs9("div", {
-              className: "flex items-center justify-between",
+              className: "flex items-start justify-between gap-4",
               children: [
-                /* @__PURE__ */ jsx9("h2", {
-                  className: "text-xl font-semibold transition-colors group-hover:text-violet-400",
-                  children: guide.title
+                /* @__PURE__ */ jsxs9("div", {
+                  children: [
+                    /* @__PURE__ */ jsx9("h2", {
+                      className: "font-semibold text-xl",
+                      children: guide.title
+                    }),
+                    /* @__PURE__ */ jsx9("p", {
+                      className: "mt-2 text-muted-foreground text-sm leading-7",
+                      children: guide.description
+                    })
+                  ]
                 }),
                 /* @__PURE__ */ jsx9(ArrowRight, {
-                  className: "text-violet-400",
+                  className: "mt-1 shrink-0",
                   size: 18
                 })
               ]
             }),
-            /* @__PURE__ */ jsx9("p", {
-              className: "text-muted-foreground text-sm",
-              children: guide.description
-            }),
             /* @__PURE__ */ jsxs9("div", {
-              className: "text-muted-foreground flex items-center gap-2 text-xs",
+              className: "mt-4 flex items-center gap-2 text-muted-foreground text-xs",
               children: [
                 /* @__PURE__ */ jsx9(CheckCircle2, {
                   size: 14
@@ -2739,38 +2741,59 @@ function GuidesIndexPage() {
         }, guide.href))
       }),
       /* @__PURE__ */ jsxs9("div", {
-        className: "card-subtle space-y-4 p-6",
+        className: "editorial-panel space-y-4",
         children: [
           /* @__PURE__ */ jsxs9("div", {
-            className: "flex items-center gap-2 text-sm font-semibold tracking-[0.2em] text-violet-400 uppercase",
+            className: "flex items-center gap-2 font-semibold text-[color:var(--rust)] text-sm uppercase tracking-[0.2em]",
             children: [
-              /* @__PURE__ */ jsx9(BookOpen, {
+              /* @__PURE__ */ jsx9(GitBranch, {
                 size: 16
               }),
-              "How to use the guides"
+              "Working style"
             ]
           }),
           /* @__PURE__ */ jsxs9("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "editorial-list",
             children: [
-              /* @__PURE__ */ jsx9("li", {
-                children: "Run each guide in a fresh branch or sandbox workspace."
+              /* @__PURE__ */ jsxs9("li", {
+                children: [
+                  /* @__PURE__ */ jsx9("span", {
+                    className: "editorial-list-marker"
+                  }),
+                  /* @__PURE__ */ jsx9("span", {
+                    children: "Run each guide in a branch or sandboxed workspace."
+                  })
+                ]
               }),
-              /* @__PURE__ */ jsx9("li", {
-                children: "Use the linked example package to validate end-to-end."
+              /* @__PURE__ */ jsxs9("li", {
+                children: [
+                  /* @__PURE__ */ jsx9("span", {
+                    className: "editorial-list-marker"
+                  }),
+                  /* @__PURE__ */ jsx9("span", {
+                    children: "Prefer one bounded surface at a time: one endpoint, one workflow, one integration, one unsafe module."
+                  })
+                ]
               }),
-              /* @__PURE__ */ jsx9("li", {
-                children: "Keep the commands as written to match CI expectations."
+              /* @__PURE__ */ jsxs9("li", {
+                children: [
+                  /* @__PURE__ */ jsx9("span", {
+                    className: "editorial-list-marker"
+                  }),
+                  /* @__PURE__ */ jsx9("span", {
+                    children: "Use the example and reference outputs to verify what changed, not just the narrative page."
+                  })
+                ]
               })
             ]
           }),
           /* @__PURE__ */ jsx9(CodeBlock8, {
             language: "bash",
             filename: "guides-quickstart",
-            code: `# list all examples
+            code: `# list example systems
 contractspec examples list
 
-# validate example packages in this repo
+# validate the examples in this workspace
 contractspec examples validate --repo-root .`
           })
         ]