This page is the Catalog contract with an illustrative product — not ContextHop or Five Deep. Open live catalogs →
A working Catalog — not a live product.
The working example demonstrates the Catalog Page contract with product-local status, stacked browsing, focus mode, specimen-frame proof, product paint, and cross-links. The sample product and implementation paths below are illustrative only.
Six sources make the graph readable.
The B&Co contract names Standard, Checklist, Catalog page, Product spec, Git, and Live Catalog. Building Blocks is a link and operating layer around product catalogs—not a seventh source of product truth.
How the system is governed.
What must have an opinion.
How that product’s fill is seen.
The product’s answers.
What the browser runs.
Mounted specimens and honest gaps.
Catalog chrome and specimen frame have different jobs. Catalog chrome helps people find and read the product system; the specimen frame is the isolated product render.
Responsive proof belongs inside the specimen frame.
The contract names 375 / 768 / 1280. The width control changes the specimen frame only—not the page H1, rail, search, or Catalog chrome.
Absence is part of the documentation.
Shipped
No celebratory green status chip is required. A real mount plus its connection sentence is enough.
Not yet
The section still has its job and connections. The specimen stays intentionally empty—no screenshot opacity trick or fake implementation.
Illustrative only
Quietly label demonstrations that are not real product implementation.
Uncertain
Leave unresolved product truth unresolved rather than turning documentation confidence into product fact.
Review is a separate persistence contract.
The interactive choices below use the locked review vocabulary, but this page keeps the choice only in memory for the current page session. Production persistence remains the Catalog Store contract.
No review choice stored.
Review is not stored yet. Catalog review state does not belong in Koyn, and this page does not write a local Catalog database.
The Catalog wears the product’s theme.
Catalog chrome and specimens use the product’s semantic theme values. The working sample is illustrative, but the contract remains: do not steal another product’s visual paint merely because its Catalog page is a useful example.