A colophon for the system this site is built from. One token contract (v3), three identities: obsidian is the stone this site ships in five cuts, phosphor carries the editorial redesign, slate carries the shadcn heritage. Each renders every component from the same 41 variables.
Every DCYFR site stamps data-identity on its root element at build time and ships exactly one identity. The theme engine binds component styles to the 41 tokens of contract v3, a theme file supplies the values, and the registry's CI proves each of the three identities defines the full contract in both schemes. This site pins obsidian. Contract v3 gives an identity a cut axis, a colour-only sub-axis stamped as data-cut on the same root element: obsidian declares 5, the base among them. A cut overlay may re-author the accent ramp, the field group and the sheen, plus a short allow-list of hairline and muted tones; obsidian's cuts use the first three and the hairline.
The engine switches at runtime in exactly two places on this site. The cut chooser in the header moves your cut and keeps it in a cookie, so the server stamps it on the next request. The showcase below switches the identity and previews a cut, keeps nothing, and puts your own cut back when you leave.
The stone identity this site ships: one near-black ground shared by five cuts, with colour held in the accent ramp, the field and the hairline, a sheen in the rainbow cut, and an edge light in each single-hue cut in dark. The chooser in the header keeps your cut; the cut control below previews one.
Both controls restamp every token on this page live and keep nothing: every DCYFR surface pins one identity at build time, and this page and the cut chooser in the header are the only two places the engine switches at runtime. The chooser keeps your cut in a cookie; the preview above does not, so a reload serves your own cut again.
Four steps so one accent value never serves both fills and text: filled controls take -600, text on paper takes -700, and -400 is the text-safe step on dark grounds. A cut re-authors this ramp; the surfaces above stay put.
Contract v3 adds one dramatic surface: the field, with its own foreground and accent, and a sheen the engine lays over it. A cut re-authors all four. Only the rainbow cut gives the sheen a pattern, in both schemes; red, blue and green carry an edge light of their own hue in dark and none in light, and black sets it to none in both. The sheen is an image value (a gradient stack, or none) rather than a colour, and only the engine's utilities draw it.
Three engine utilities and nothing else draw the sheen. A surface wearing .field paints the field ground and shows the sheen at rest; .sheen-hover reveals it on hover and focus; .sheen-scroll widens the layer and drifts it with the element's own view timeline, a pure CSS scroll-driven animation. Under black, and under red, blue and green in light, the sheen is none and these surfaces show the field alone. The field is its own container rather than a card: a card paints its own surface, and that surface outranks the field.
Reduced motion removes animation, not information: with the preference set, the field keeps its static sheen, the hover reveal happens without a transition, and the scroll drift never attaches. Browsers without scroll timelines get the static, centred layer.
Every cut of obsidian at once, in the current scheme. Each cut re-authors only the accent ramp, the field group, the hairline and the sheen, and only the rainbow cut gives the sheen a pattern (the contract would also allow a cut its muted tones; none of these takes that); every surface and status token below is shared. Each card carries its cut's resolved variables inline, generated from the vendored theme file at sync time, so nothing here stamps data-cut: that attribute belongs to the root element alone.
Themes supply faces through three role tokens; the engine binds the roles. Every identity reads in Geist. Phosphor reserves its serif for headlines, and the swap costs nothing here because the showcase loads every identity's faces.
Radius styles interface chrome only; imagery and media stay square at the component layer. Motion ships as two duration-plus-easing fragments: snap for transform and opacity, ease for color and layout.
The registry gallery renders every published component under every identity and cut with the same live switcher, and the registry page lists what you can install.