@tryvitris/website-harness 0.0.0-stage → 0.1.0-beta.6

package/design-system/compositions/v2/sundial-goods/study.json

@@ -0,0 +1,247 @@
+{
+  "id": "sundial-goods",
+  "revision": 1,
+  "title": "Sundial Goods / colour campaign",
+  "primaryFamily": "campaign",
+  "assetMinimum": "none",
+  "fitSignals": [
+    "collection",
+    "comparison",
+    "type-content",
+    "real-copy",
+    "action",
+    "sparse-media"
+  ],
+  "visitorTasks": [
+    "shop-collection",
+    "compare-options"
+  ],
+  "organizingIdea": "A cropped-looking but fully readable type field meets a bold product illustration; colour choices become broad navigable fields and the interior exposes product facts before options.",
+  "brief": {
+    "fictional": true,
+    "facts": {
+      "name": "Sundial Goods",
+      "offer": "Fictional everyday cotton carry bags",
+      "product": "Daily Carry",
+      "variants": [
+        "Brick",
+        "Ink",
+        "Leaf"
+      ],
+      "dimensions": "38 × 42 cm",
+      "material": "Cotton in invented brief",
+      "price": "24 teaching units",
+      "restriction": "No actual stock, certifications or purchasing system",
+      "contact": "sundial@example.test"
+    },
+    "factsHash": "f1744ebac1d86003c54b90fae9b16d779784b6ae6b8ceb83fa1bfbbbb2560325",
+    "mediaHash": "4f53cda18c2baa0c0354bb5f9a3ecbe5ed12ab4d8e11ba873c2f11161202b945"
+  },
+  "provenance": {
+    "content": "Original fictional Vitris teaching brief and authored copy; operational details, dimensions and offers are invented and must never populate customer inventories.",
+    "media": "Original inline SVG illustrations authored for this release; no external photographs, branding or type assets.",
+    "rights": "Original Vitris teaching material; factual adaptation required for customer use."
+  },
+  "storyboard": {
+    "homepage": [
+      "campaign type/object",
+      "wide colour choices",
+      "everyday-use explanation"
+    ],
+    "interior": [
+      "product illustration/facts",
+      "colour comparison",
+      "adaptation boundary"
+    ],
+    "mobile": "Campaign type precedes object; colour choices form two columns then explicit product detail options stack with their labels."
+  },
+  "designDecisions": "A cropped-looking but fully readable type field meets a bold product illustration; colour choices become broad navigable fields and the interior exposes product facts before options.",
+  "lessonIds": [
+    "cmp-image-art-direction",
+    "cmp-comparison",
+    "cmp-narrative-continuity"
+  ],
+  "referenceIds": [
+    "baggu",
+    "good-weird"
+  ],
+  "sourcePath": "sundial-goods",
+  "homepage": "/",
+  "interior": "/detail",
+  "status": "compiled and automated/assistant visually reviewed; human preference pending",
+  "humanPreference": null,
+  "renderEvidence": [
+    {
+      "route": "/",
+      "viewport": {
+        "width": 1440,
+        "height": 900
+      },
+      "capturedAt": "2026-10-05T18:23:47.935Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/sundial-goods-home-1440.png",
+        "sha256": "488b00a962aaec743b8a47defacf057f9ae876e2abb7a47f60d9b21d9ad61621"
+      },
+      "compiledHash": "04eca1d4a1e6fb09c2505cbf53da9342f2665750ce07bb89f40155062f245c8b",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/detail",
+            "/detail#options",
+            "/detail",
+            "/detail#options",
+            "/detail#options",
+            "/detail#options",
+            "/detail"
+          ]
+        },
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:25:17.945223+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views visually inspected in contact sheet. Bold campaign, object illustration and broad colour choice fields give different density from conventional product cards. Narrow campaign type precedes object and swatches; product detail reverses emphasis toward object then facts. Comparison labels remain readable. Teaching stock/prices are explicit, no checkout. Loop and Sundial share a wide two-column opening, justified by poster interpretation versus merchandise comparison; later sequences, navigation and actions differ. Further batch will add non-split openings."
+      }
+    },
+    {
+      "route": "/",
+      "viewport": {
+        "width": 390,
+        "height": 844
+      },
+      "capturedAt": "2026-10-05T18:23:49.127Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/sundial-goods-home-390.png",
+        "sha256": "e3e3719e6ef3cd4613a7b6afe983c546c4ba09060c16116f6b105a5307392e0d"
+      },
+      "compiledHash": "04eca1d4a1e6fb09c2505cbf53da9342f2665750ce07bb89f40155062f245c8b",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/detail",
+            "/detail#options",
+            "/detail",
+            "/detail#options",
+            "/detail#options",
+            "/detail#options",
+            "/detail"
+          ]
+        },
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:25:17.945223+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views visually inspected in contact sheet. Bold campaign, object illustration and broad colour choice fields give different density from conventional product cards. Narrow campaign type precedes object and swatches; product detail reverses emphasis toward object then facts. Comparison labels remain readable. Teaching stock/prices are explicit, no checkout. Loop and Sundial share a wide two-column opening, justified by poster interpretation versus merchandise comparison; later sequences, navigation and actions differ. Further batch will add non-split openings."
+      }
+    },
+    {
+      "route": "/detail",
+      "viewport": {
+        "width": 1440,
+        "height": 900
+      },
+      "capturedAt": "2026-10-05T18:23:50.700Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/sundial-goods-interior-1440.png",
+        "sha256": "19e5e51acd93edadf369a4b64436b89b3a26904740d7fb5c4d09eb7b10194348"
+      },
+      "compiledHash": "8fa0c46a3333314b7ee302dfaecbdaa4fd630eaac2676bf274beafdcc06007a9",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/"
+          ]
+        },
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:25:17.945223+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views visually inspected in contact sheet. Bold campaign, object illustration and broad colour choice fields give different density from conventional product cards. Narrow campaign type precedes object and swatches; product detail reverses emphasis toward object then facts. Comparison labels remain readable. Teaching stock/prices are explicit, no checkout. Loop and Sundial share a wide two-column opening, justified by poster interpretation versus merchandise comparison; later sequences, navigation and actions differ. Further batch will add non-split openings."
+      }
+    },
+    {
+      "route": "/detail",
+      "viewport": {
+        "width": 390,
+        "height": 844
+      },
+      "capturedAt": "2026-10-05T18:23:51.806Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/sundial-goods-interior-390.png",
+        "sha256": "0479f0d3d4d18416dab6113db6685c61319e88eb2b13d6cf775547c1a96dea0c"
+      },
+      "compiledHash": "8fa0c46a3333314b7ee302dfaecbdaa4fd630eaac2676bf274beafdcc06007a9",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/"
+          ]
+        },
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:25:17.945223+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views visually inspected in contact sheet. Bold campaign, object illustration and broad colour choice fields give different density from conventional product cards. Narrow campaign type precedes object and swatches; product detail reverses emphasis toward object then facts. Comparison labels remain readable. Teaching stock/prices are explicit, no checkout. Loop and Sundial share a wide two-column opening, justified by poster interpretation versus merchandise comparison; later sequences, navigation and actions differ. Further batch will add non-split openings."
+      }
+    }
+  ]
+}

package/design-system/compositions/v2/sundial-goods/theme/defaults.json

@@ -0,0 +1,16 @@
+{
+  "colorBg": "#fff3d4",
+  "colorText": "#442517",
+  "colorMuted": "#684535",
+  "colorAccent": "#b83225",
+  "colorAccentText": "#fff3d4",
+  "colorSurface": "#fff3d4",
+  "colorSurface2": "#f7dab4",
+  "colorBorder": "#a87757",
+  "colorFocus": "#1839b8",
+  "fontBody": "ui-sans-serif, system-ui, sans-serif",
+  "fontDisplay": "ui-sans-serif, system-ui, sans-serif",
+  "radius": "0px",
+  "radiusLg": "0px",
+  "maxWidth": "1180px"
+}

package/design-system/compositions/v2/thread-mender/components/study-thread-mender/styles.css

@@ -0,0 +1,2 @@
+.c-study-thread-mender{color:var(--color-text);font-family:var(--font-body);overflow-wrap:anywhere}.c-study-thread-mender h1,.c-study-thread-mender h2,.c-study-thread-mender h3{font-family:var(--font-display);color:inherit}.c-study-thread-mender p,.c-study-thread-mender li{line-height:1.6}.c-study-thread-mender a{color:inherit;text-underline-offset:.2em}.c-study-thread-mender a:focus-visible,.c-study-thread-mender summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}.c-study-thread-mender img,.c-study-thread-mender svg{max-width:100%;height:auto}.c-study-thread-mender table{border-collapse:collapse;width:100%}.c-study-thread-mender th,.c-study-thread-mender td{text-align:left;padding:.8rem;border-bottom:1px solid var(--color-border)}.c-study-thread-mender .teaching{font-size:.85rem;line-height:1.5}.c-study-thread-mender nav a{display:inline-flex;align-items:center;min-height:44px}
+.c-study-thread-mender .label-top{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:2rem 5%;border-bottom:3px dashed var(--color-border)}.c-study-thread-mender .label-top>a:first-child{font:700 1.5rem/1 Georgia,serif;text-decoration:none}.c-study-thread-mender .label-top p{margin:0}.c-study-thread-mender .process-opening{text-align:center;padding:4rem 5%}.c-study-thread-mender .process-opening>p{font-size:.85rem;text-transform:uppercase;letter-spacing:.1em}.c-study-thread-mender h1{font:400 clamp(2.6rem,4.5vw,4.6rem)/1.15 Georgia,serif;max-width:25ch;margin:1.5rem auto 2rem}.c-study-thread-mender svg{width:100%;display:block}.c-study-thread-mender nav{display:flex;justify-content:space-around;gap:1rem;flex-wrap:wrap}.c-study-thread-mender .process-opening nav{max-width:70rem;margin:0 auto}.c-study-thread-mender .repair-scope{display:grid;grid-template-columns:1fr 1.2fr;gap:6rem;padding:2rem 12% 4rem}.c-study-thread-mender .repair-scope h2{font-size:1.5rem}.c-study-thread-mender ul{padding-left:1.5rem}.c-study-thread-mender li{margin:.8rem 0}.c-study-thread-mender .note{padding:2rem;background:var(--color-surface-2);border:2px dashed var(--color-border);transform:rotate(-1deg)}.c-study-thread-mender .note p{max-width:40ch}.c-study-thread-mender footer{padding:2rem 5%;border-top:3px dashed var(--color-border)}.c-study-thread-mender .repair-top{justify-content:space-between;padding:1rem 5%}.c-study-thread-mender .repair-title{text-align:center;padding:3rem 5% 0}.c-study-thread-mender .steps{max-width:65rem;margin:0 auto;padding:2rem}.c-study-thread-mender .steps section{position:relative;padding:2rem 2rem 2rem 7rem;border-bottom:2px dashed var(--color-border)}.c-study-thread-mender .step{position:absolute;left:1rem;top:2rem;font:2.5rem Georgia,serif;color:var(--color-accent)}.c-study-thread-mender .steps p{max-width:55ch}.c-study-thread-mender .steps h2{font-size:1.8rem}.c-study-thread-mender .first-note{max-width:60rem;background:var(--color-surface-2);padding:2rem;margin:2rem auto 4rem;border:2px dashed var(--color-border)}.c-study-thread-mender .first-note p{max-width:55ch}@media(max-width:700px){.c-study-thread-mender .label-top{display:grid;grid-template-columns:1fr 1fr;padding:1.2rem;gap:1rem}.c-study-thread-mender .label-top p{font-size:.85rem}.c-study-thread-mender .label-top>a:last-child{grid-column:1/3}.c-study-thread-mender .process-opening{padding:2rem 1.2rem}.c-study-thread-mender h1{font-size:2.4rem}.c-study-thread-mender .process-opening nav{display:grid;justify-content:start;text-align:left;gap:.3rem}.c-study-thread-mender .repair-scope{display:block;padding:1rem 1.2rem 2rem}.c-study-thread-mender .note{margin-top:2rem;padding:1.5rem;transform:none}.c-study-thread-mender .repair-title{padding:2rem 1.2rem 0}.c-study-thread-mender .repair-top{padding:1rem 1.2rem;justify-content:space-between;gap:1rem}.c-study-thread-mender .steps{padding:1rem 1.2rem}.c-study-thread-mender .steps section{padding:2rem 0 2rem 3.5rem}.c-study-thread-mender .step{left:0;font-size:2rem}.c-study-thread-mender .steps h2{font-size:1.5rem}.c-study-thread-mender .first-note{margin:1rem 1.2rem 2rem;padding:1.5rem}.c-study-thread-mender footer{padding:2rem 1.2rem}}

package/design-system/compositions/v2/thread-mender/components/study-thread-mender/template.html

@@ -0,0 +1 @@
+<div class="c-study-thread-mender"><slot></slot></div>

package/design-system/compositions/v2/thread-mender/pages/detail/index.html

@@ -0,0 +1,5 @@
+---
+title: Thread Mender / drawn process Detail
+description: A winding thread connects three practical stages; the drawing is navigation support and the interior turns each stage into readable guidance.
+---
+<study-thread-mender><nav class="repair-top" aria-label="Repair process"><a href="/">← Thread Mender</a><a href="mailto:thread@example.test">Describe a repair</a></nav><div class="repair-title"><p>Practical repair guide / fictional service</p><h1>From a loose seam<br>to an agreed repair.</h1><svg viewBox="0 0 1100 270" role="img" aria-label="Original repair process drawing: notice, agree and mend joined by a winding thread"><path d="M65 135C220 15 280 245 460 125S745 40 1010 140" fill="none" stroke="#a23848" stroke-width="7" stroke-dasharray="13 5"/><g fill="#fff7ea" stroke="#453b2d" stroke-width="3"><circle cx="175" cy="120" r="85"/><circle cx="550" cy="135" r="85"/><circle cx="925" cy="135" r="85"/></g><g fill="#453b2d" font-family="Georgia,serif" font-size="27" text-anchor="middle"><text x="175" y="130">NOTICE</text><text x="550" y="145">AGREE</text><text x="925" y="145">MEND</text></g><path d="M125 167L215 181M142 185L192 162" stroke="#a23848" stroke-width="5"/><path d="M890 180L960 192" stroke="#a23848" stroke-width="5"/></svg></div><div class="steps"><section id="notice"><span class="step">01</span><h2>Notice the concern.</h2><p>Identify the area and describe what you can see. A clear photograph and a short description can help begin the conversation, but do not establish repair suitability.</p></section><section id="agree"><span class="step">02</span><h2>Agree the scope.</h2><p>Discuss the proposed repair before work begins. Hems, small tears and loose seams are the fictional service scope; materials and damage may limit what is suitable.</p></section><section id="mend"><span class="step">03</span><h2>Mend &amp; return.</h2><p>The agreed area is repaired and the garment is returned by arrangement. No promise of invisible restoration or guaranteed durability is supplied in this teaching brief.</p></section></div><aside class="first-note"><h2>For the first conversation</h2><p>Name the garment, the affected area and the concern. A real service needs verified location, turnaround, pricing and contact details.</p><a href="mailto:thread@example.test">Describe a repair →</a></aside><footer><a href="/">Back to Thread Mender</a><p class="teaching">Original fictional Vitris teaching study. Names, offers, events and specifications are invented; no real customer evidence is supplied.</p></footer></study-thread-mender>

package/design-system/compositions/v2/thread-mender/pages/index.html

@@ -0,0 +1,5 @@
+---
+title: Thread Mender / drawn process Home
+description: A winding thread connects three practical stages; the drawing is navigation support and the interior turns each stage into readable guidance.
+---
+<study-thread-mender><div class="label-top"><a href="/">THREAD<br>MENDER</a><p>Clothing repairs.<br>A little care, where it is needed.</p><a href="/detail">How a repair works</a></div><section class="process-opening"><p>Start with the garment.</p><h1>A repair is a conversation<br>before it is a stitch.</h1><svg viewBox="0 0 1100 270" role="img" aria-label="Original repair process drawing: notice, agree and mend joined by a winding thread"><path d="M65 135C220 15 280 245 460 125S745 40 1010 140" fill="none" stroke="#a23848" stroke-width="7" stroke-dasharray="13 5"/><g fill="#fff7ea" stroke="#453b2d" stroke-width="3"><circle cx="175" cy="120" r="85"/><circle cx="550" cy="135" r="85"/><circle cx="925" cy="135" r="85"/></g><g fill="#453b2d" font-family="Georgia,serif" font-size="27" text-anchor="middle"><text x="175" y="130">NOTICE</text><text x="550" y="145">AGREE</text><text x="925" y="145">MEND</text></g><path d="M125 167L215 181M142 185L192 162" stroke="#a23848" stroke-width="5"/><path d="M890 180L960 192" stroke="#a23848" stroke-width="5"/></svg><nav aria-label="Repair"><a href="/detail#notice">Notice the concern</a><a href="/detail#agree">Agree the scope</a><a href="/detail#mend">Mend &amp; return</a></nav></section><section class="repair-scope"><div><h2>What we look at</h2><ul><li>Hems</li><li>Small tears</li><li>Loose seams</li></ul></div><div class="note"><h2>Bring the story with it.</h2><p>Describe what happened and how the garment is used. Suitability is assessed before a repair is agreed.</p><a href="mailto:thread@example.test">Describe a repair →</a></div></section><footer><p>Local drop-off by arrangement / fictional service</p><p class="teaching">Original fictional Vitris teaching study. Names, offers, events and specifications are invented; no real customer evidence is supplied.</p></footer></study-thread-mender>

package/design-system/compositions/v2/thread-mender/site.json

@@ -0,0 +1,7 @@
+{
+  "name": "Thread Mender / drawn process \u2014 fictional teaching study",
+  "slug": "thread-mender",
+  "motion": {
+    "strength": "off"
+  }
+}

package/design-system/compositions/v2/thread-mender/study.json

@@ -0,0 +1,253 @@
+{
+  "id": "thread-mender",
+  "revision": 1,
+  "title": "Thread Mender / drawn process",
+  "primaryFamily": "handmade",
+  "assetMinimum": "none",
+  "fitSignals": [
+    "professional-service",
+    "process",
+    "action",
+    "type-content",
+    "real-copy",
+    "sparse-media"
+  ],
+  "visitorTasks": [
+    "evaluate-service",
+    "understand-process",
+    "book-inquiry"
+  ],
+  "organizingIdea": "A winding thread connects three practical stages; the drawing is navigation support and the interior turns each stage into readable guidance.",
+  "brief": {
+    "fictional": true,
+    "facts": {
+      "name": "Thread Mender",
+      "offer": "Fictional clothing repair service",
+      "scope": [
+        "Hems",
+        "Small tears",
+        "Loose seams"
+      ],
+      "process": [
+        "Notice the damaged area",
+        "Agree the repair scope",
+        "Mend and return the garment"
+      ],
+      "restriction": "Repair suitability is assessed before agreement; no guaranteed restoration",
+      "location": "Local drop-off by arrangement, invented service",
+      "contact": "thread@example.test"
+    },
+    "factsHash": "479f3bb31e2059f7f96a90420defaf29da4774c646d732f4a27f88aef1c87e16",
+    "mediaHash": "4f53cda18c2baa0c0354bb5f9a3ecbe5ed12ab4d8e11ba873c2f11161202b945"
+  },
+  "provenance": {
+    "content": "Original fictional Vitris teaching brief and copy; no customer claims.",
+    "media": "Original inline SVG diagrams or authored text, no external images, branding or type assets.",
+    "rights": "Original Vitris teaching material; factual adaptation required for customer use."
+  },
+  "storyboard": {
+    "homepage": [
+      "drawn stage navigation",
+      "repair scope",
+      "conversation preparation"
+    ],
+    "interior": [
+      "process drawing",
+      "notice/agree/mend guidance",
+      "first conversation"
+    ],
+    "mobile": "Drawing shrinks but native stage links become a readable vertical list; decorative note rotation is removed; numbered guidance remains text, not diagram-only."
+  },
+  "designDecisions": "A winding thread connects three practical stages; the drawing is navigation support and the interior turns each stage into readable guidance.",
+  "lessonIds": [
+    "cmp-process",
+    "cmp-surfaces-motifs",
+    "cmp-contextual-action"
+  ],
+  "referenceIds": [
+    "gohar-world",
+    "on-air",
+    "bokman"
+  ],
+  "sourcePath": "thread-mender",
+  "homepage": "/",
+  "interior": "/detail",
+  "status": "compiled and automated/assistant visually reviewed; human preference pending",
+  "humanPreference": null,
+  "renderEvidence": [
+    {
+      "route": "/",
+      "viewport": {
+        "width": 1440,
+        "height": 900
+      },
+      "capturedAt": "2026-10-05T18:33:11.059Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/thread-mender-home-1440.png",
+        "sha256": "43add004a81011c425afae190434be2d55a549d84eb18c7f0ef21b1da1b1a065"
+      },
+      "compiledHash": "4b62541793499d8da86db10d13451980850972ddad416a5c712cc6464dc433da",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/detail",
+            "/detail#notice",
+            "/detail#agree",
+            "/detail#mend"
+          ]
+        },
+        "audio": [],
+        "captureGeometry": null,
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:47:03.298021+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views inspected, then inspected again after moving decorative stitches below Notice/Agree/Mend lettering. Illustrated thread/process and scope precede invitation; interior numbered process develops the service. Narrow retains native text alongside the scaled illustration; stitches no longer cross labels. Original modest SVG media and invented service scope; no actual customer outcomes."
+      }
+    },
+    {
+      "route": "/",
+      "viewport": {
+        "width": 390,
+        "height": 844
+      },
+      "capturedAt": "2026-10-05T18:33:12.119Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/thread-mender-home-390.png",
+        "sha256": "f7b6810609c0add417a5f294dfd9f52fcc78790e094bcb3d6d9f8a54a932dedb"
+      },
+      "compiledHash": "4b62541793499d8da86db10d13451980850972ddad416a5c712cc6464dc433da",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/detail",
+            "/detail#notice",
+            "/detail#agree",
+            "/detail#mend"
+          ]
+        },
+        "audio": [],
+        "captureGeometry": null,
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:47:03.298021+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views inspected, then inspected again after moving decorative stitches below Notice/Agree/Mend lettering. Illustrated thread/process and scope precede invitation; interior numbered process develops the service. Narrow retains native text alongside the scaled illustration; stitches no longer cross labels. Original modest SVG media and invented service scope; no actual customer outcomes."
+      }
+    },
+    {
+      "route": "/detail",
+      "viewport": {
+        "width": 1440,
+        "height": 900
+      },
+      "capturedAt": "2026-10-05T18:33:13.224Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/thread-mender-interior-1440.png",
+        "sha256": "656d999e665244223c6cffabced8326217d8c19373056d89d6f9075e076b4356"
+      },
+      "compiledHash": "3a53720349e95b13479f47063ebacd4544e034905f04b5ef0e2e49e58bd3ef2a",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/"
+          ]
+        },
+        "audio": [],
+        "captureGeometry": null,
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:47:03.298021+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views inspected, then inspected again after moving decorative stitches below Notice/Agree/Mend lettering. Illustrated thread/process and scope precede invitation; interior numbered process develops the service. Narrow retains native text alongside the scaled illustration; stitches no longer cross labels. Original modest SVG media and invented service scope; no actual customer outcomes."
+      }
+    },
+    {
+      "route": "/detail",
+      "viewport": {
+        "width": 390,
+        "height": 844
+      },
+      "capturedAt": "2026-10-05T18:33:14.255Z",
+      "browser": "153.0.8010.12",
+      "preview": {
+        "path": "previews/thread-mender-interior-390.png",
+        "sha256": "05d7e0fd09f607254d4ea9cdb90d049f225aed1ed127b98194ce996dbd819c46"
+      },
+      "compiledHash": "3a53720349e95b13479f47063ebacd4544e034905f04b5ef0e2e49e58bd3ef2a",
+      "automated": {
+        "errors": [],
+        "axeViolations": [],
+        "metrics": {
+          "overflow": false,
+          "h1": 1,
+          "brokenImages": [],
+          "internalLinks": [
+            "/",
+            "/"
+          ]
+        },
+        "audio": [],
+        "captureGeometry": null,
+        "firstFocus": {
+          "tag": "A",
+          "text": "Skip to content",
+          "outline": "solid",
+          "width": "2px"
+        },
+        "disclosures": []
+      },
+      "visualReview": {
+        "assessor": "assistant",
+        "reviewedAt": "2026-10-05T18:47:03.298021+00:00",
+        "scope": "desktop/mobile homepage/interior full-page contact-sheet review; batch comparison",
+        "assessment": "All four full-page views inspected, then inspected again after moving decorative stitches below Notice/Agree/Mend lettering. Illustrated thread/process and scope precede invitation; interior numbered process develops the service. Narrow retains native text alongside the scaled illustration; stitches no longer cross labels. Original modest SVG media and invented service scope; no actual customer outcomes."
+      }
+    }
+  ]
+}

package/design-system/compositions/v2/thread-mender/theme/defaults.json

@@ -0,0 +1,16 @@
+{
+  "colorBg": "#fff7ea",
+  "colorText": "#453b2d",
+  "colorMuted": "#6c5843",
+  "colorAccent": "#a23848",
+  "colorAccentText": "#ffffff",
+  "colorSurface": "#fff7ea",
+  "colorSurface2": "#f3e3ca",
+  "colorBorder": "#a27c59",
+  "colorFocus": "#173eb1",
+  "fontBody": "ui-sans-serif, system-ui, sans-serif",
+  "fontDisplay": "Georgia,serif",
+  "radius": "0px",
+  "radiusLg": "0px",
+  "maxWidth": "1180px"
+}

package/design-system/knowledge/v1/README.md

@@ -0,0 +1,8 @@
+# Design knowledge v1
+
+Transferable lessons for generation when the user does not supply references. This pack is not a labeled human-preference dataset.
+
+- `catalog.json` holds the lesson records. `manifest.json` pins their hash and the demonstration hashes.
+- Demonstrations under `demonstrations/` are original synthetic HTML. Each page says so. They are not customer sites and not calibrated quality labels.
+- Inspected notes inside lessons cite files in `design-system/calibration/v1`. Those captures include a theme-marketplace banner that is capture chrome. Do not copy demo people, phone numbers, or claims into a client site.
+- Selection is deterministic from assets, visitor jobs, and constraints. Industry labels alone do not select a lesson. Mandatory accessibility, user-constraint, and asset-feasibility obligations are injected with the stage packet and are not dropped by ranking.