@kontourai/survey 8.0.0 → 8.1.1

package/dist/src/review-workbench/vendor/kontourai-ui/tokens/themes.css

@@ -1,7 +1,39 @@
+/* Product themes. Each theme sets its brand (identity) and, beside it, the
+   action and focus roles. The roles hold their own values rather than aliasing
+   the brand, so a later brand override cannot break primary actions or focus.
+   Every scope that sets --k-action also sets --k-action-contrast: a theme
+   nested under another theme's scope would otherwise inherit that scope's text
+   color onto its own fill.
+
+   Every scope that sets --k-focus also redeclares --k-focus-ring, and every
+   scope that sets a status hue redeclares its soft fill: a var()-derived token
+   resolves where it is declared, so without this a scope below the root would
+   inherit the root's value (issue 78). check:tokens enforces both.
+
+   Each light block matches three placements of the theme class and
+   data-theme="light": on one element, the theme class below the light
+   attribute, and the light attribute below the theme class. The last is
+   wrapped in :where() so it weighs the same as the bare [data-theme="light"]
+   block in tokens.css (which it follows, so it wins there) and less than a
+   theme class sitting on the light element itself: a nested theme keeps its
+   own identity.
+
+   Scoping rule (ui#80, ui#84; DESIGN.md "Theme and mode scoping"): the
+   nearest data-theme picks the mode and the nearest theme class picks the
+   product. The :where(:not(...)) tails enforce "nearest" without changing a
+   selector's weight: the class-below-attribute form stops at a nearer
+   data-theme="dark", and the attribute-below-class form stops at a nearer
+   (or its own) other theme class. Weights are unchanged, so an override
+   declared later with these selectors still wins. */
+
 .theme-survey {
   --k-bg: #06080b;
   --k-brand: #5ce0c6;
-  --k-text-faint: #6f8095;
+  --k-action: #5ce0c6;
+  --k-action-contrast: #06080b;
+  --k-focus: #5ce0c6;
+  --k-text-faint: #78889b;
+  --k-focus-ring: var(--k-focus);
 }
 
 .theme-console {
@@ -13,6 +45,9 @@
   --k-radius-overlay: 0;
   --k-brand: #c9ff4a;
   --k-brand-contrast: #11120f;
+  --k-action: #c9ff4a;
+  --k-action-contrast: #11120f;
+  --k-focus: #c9ff4a;
   --k-bg: #11120f;
   --k-panel: #191b16;
   --k-panel-raised: #20231e;
@@ -20,30 +55,81 @@
   --k-line-strong: #8ea36e;
   --k-text: #f2f0e8;
   --k-text-muted: #a6ab9c;
-  --k-text-faint: #747a6c;
+  --k-text-faint: #858b7e;
   --k-positive: #a6d37b;
   --k-caution: #e8c15f;
   --k-negative: #ee776f;
   --k-active: #84d8c8;
+  --k-status-contrast: #11120f;
+  --k-focus-ring: var(--k-focus);
+  --k-positive-soft: color-mix(in oklab, var(--k-positive) 14%, transparent);
+  --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
+  --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
+  --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
 }
 
+/* Flow dark: the brand is the accent lightened (OKLCH hue within 0.3°, same chroma)
+   just enough to read as text at 4.5:1 on bg, panel and raised panel; the
+   action and focus keep the accent, which clears their 3:1 and dark-text
+   pairs. */
 .theme-flow {
-  --k-brand: #2f88a6;
+  --k-brand: #3890ae;
+  --k-action: #2f88a6;
+  --k-action-contrast: #06080b;
+  --k-focus: #2f88a6;
+  --k-focus-ring: var(--k-focus);
 }
 
 .theme-surface {
   --k-brand: #14a37a;
+  --k-action: #14a37a;
+  --k-action-contrast: #06080b;
+  --k-focus: #14a37a;
+  --k-focus-ring: var(--k-focus);
 }
 
+/* Station: the draft accent, adjusted per mode only where WCAG AA needs it.
+   Dark: the accent carries white text as a fill but is too dark to read as
+   text on the dark panel, so the focus ring is the accent lightened to clear
+   contrast, and the brand is lightened a little further (OKLCH hue within 0.1°) to
+   read as text at 4.5:1 on bg, panel and raised panel; the action keeps the
+   draft accent. */
+.theme-station {
+  --k-brand: #966aff;
+  --k-action: #7c3aed;
+  --k-action-contrast: #ffffff;
+  --k-focus: #9364ff;
+  --k-focus-ring: var(--k-focus);
+}
+
+/* Survey light: the brand is the accent darkened (same OKLCH hue and chroma) just enough
+   to read as text at 4.5:1 on the light canvas; the action and focus keep the
+   accent. */
 [data-theme="light"].theme-survey,
-[data-theme="light"] .theme-survey {
-  --k-brand: #16806f;
+[data-theme="light"] .theme-survey:where(:not([data-theme="dark"], [data-theme="light"] [data-theme="dark"] *)),
+:where(.theme-survey) [data-theme="light"]:where(:not(.theme-console, .theme-flow, .theme-surface, .theme-station, .theme-survey :is(.theme-console, .theme-flow, .theme-surface, .theme-station) *)) {
+  --k-bg: #f5f4ef;
+  --k-text-faint: #6a707b;
+  --k-brand: #107e6d;
+  --k-action: #16806f;
+  --k-action-contrast: #ffffff;
+  --k-focus: #16806f;
+  --k-focus-ring: var(--k-focus);
 }
 
+/* Console light: the brand is the lime darkened (OKLCH hue within 0.1°) just enough
+   to read as text at 4.5:1 on bg, panel and raised panel, and it keeps white
+   brand-contrast text (5.1:1; dark text would be 3.7:1). The action and focus
+   keep the brighter lime with dark text. */
 [data-theme="light"].theme-console,
-[data-theme="light"] .theme-console {
-  --k-brand: #6c9400;
+[data-theme="light"] .theme-console:where(:not([data-theme="dark"], [data-theme="light"] [data-theme="dark"] *)),
+:where(.theme-console) [data-theme="light"]:where(:not(.theme-survey, .theme-flow, .theme-surface, .theme-station, .theme-console :is(.theme-survey, .theme-flow, .theme-surface, .theme-station) *)) {
+  --k-brand: #577800;
   --k-brand-contrast: #ffffff;
+  --k-action: #6c9400;
+  --k-action-contrast: #11120f;
+  --k-focus: #6c9400;
+  --k-focus-ring: var(--k-focus);
   --k-bg: #f3f5eb;
   --k-panel: #fbfcf7;
   --k-panel-raised: #eef2e6;
@@ -51,19 +137,112 @@
   --k-line-strong: #8fa36f;
   --k-text: #1e2319;
   --k-text-muted: #596250;
-  --k-text-faint: #77816d;
+  --k-text-faint: #68705f;
   --k-positive: #2f7d32;
   --k-caution: #8a6500;
   --k-negative: #b93a36;
   --k-active: #247f75;
+  --k-status-contrast: #ffffff;
+  --k-positive-soft: color-mix(in oklab, var(--k-positive) 14%, transparent);
+  --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
+  --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
+  --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
 }
 
 [data-theme="light"].theme-flow,
-[data-theme="light"] .theme-flow {
+[data-theme="light"] .theme-flow:where(:not([data-theme="dark"], [data-theme="light"] [data-theme="dark"] *)),
+:where(.theme-flow) [data-theme="light"]:where(:not(.theme-survey, .theme-console, .theme-surface, .theme-station, .theme-flow :is(.theme-survey, .theme-console, .theme-surface, .theme-station) *)) {
   --k-brand: #1f6f88;
+  --k-action: #1f6f88;
+  --k-action-contrast: #ffffff;
+  --k-focus: #1f6f88;
+  --k-focus-ring: var(--k-focus);
 }
 
 [data-theme="light"].theme-surface,
-[data-theme="light"] .theme-surface {
+[data-theme="light"] .theme-surface:where(:not([data-theme="dark"], [data-theme="light"] [data-theme="dark"] *)),
+:where(.theme-surface) [data-theme="light"]:where(:not(.theme-survey, .theme-console, .theme-flow, .theme-station, .theme-surface :is(.theme-survey, .theme-console, .theme-flow, .theme-station) *)) {
   --k-brand: #0f6b52;
+  --k-action: #0f6b52;
+  --k-action-contrast: #ffffff;
+  --k-focus: #0f6b52;
+  --k-focus-ring: var(--k-focus);
+}
+
+[data-theme="light"].theme-station,
+[data-theme="light"] .theme-station:where(:not([data-theme="dark"], [data-theme="light"] [data-theme="dark"] *)),
+:where(.theme-station) [data-theme="light"]:where(:not(.theme-survey, .theme-console, .theme-flow, .theme-surface, .theme-station :is(.theme-survey, .theme-console, .theme-flow, .theme-surface) *)) {
+  --k-brand: #7c3aed;
+  --k-action: #7c3aed;
+  --k-action-contrast: #ffffff;
+  --k-focus: #7c3aed;
+  --k-focus-ring: var(--k-focus);
+}
+
+
+/* Dark islands (ui#80): a data-theme="dark" element below a light element
+   takes its nearest theme's dark values. tokens.css resets it to the default
+   dark contract first; each block below repeats its theme's mode-dependent
+   base values (check:contrast fails if one drifts) and, like the light
+   blocks, yields to a nearer theme class. Without a light ancestor nothing
+   needs resetting, so these blocks do not match and the element inherits. */
+
+[data-theme="dark"]:where(.theme-survey *):where([data-theme="light"] *):where(:not(.theme-console, .theme-flow, .theme-surface, .theme-station, .theme-survey :is(.theme-console, .theme-flow, .theme-surface, .theme-station) *)) {
+  --k-bg: #06080b;
+  --k-brand: #5ce0c6;
+  --k-action: #5ce0c6;
+  --k-action-contrast: #06080b;
+  --k-focus: #5ce0c6;
+  --k-text-faint: #78889b;
+  --k-focus-ring: var(--k-focus);
+}
+
+[data-theme="dark"]:where(.theme-console *):where([data-theme="light"] *):where(:not(.theme-survey, .theme-flow, .theme-surface, .theme-station, .theme-console :is(.theme-survey, .theme-flow, .theme-surface, .theme-station) *)) {
+  --k-brand: #c9ff4a;
+  --k-brand-contrast: #11120f;
+  --k-action: #c9ff4a;
+  --k-action-contrast: #11120f;
+  --k-focus: #c9ff4a;
+  --k-bg: #11120f;
+  --k-panel: #191b16;
+  --k-panel-raised: #20231e;
+  --k-line: #3a4035;
+  --k-line-strong: #8ea36e;
+  --k-text: #f2f0e8;
+  --k-text-muted: #a6ab9c;
+  --k-text-faint: #858b7e;
+  --k-positive: #a6d37b;
+  --k-caution: #e8c15f;
+  --k-negative: #ee776f;
+  --k-active: #84d8c8;
+  --k-status-contrast: #11120f;
+  --k-focus-ring: var(--k-focus);
+  --k-positive-soft: color-mix(in oklab, var(--k-positive) 14%, transparent);
+  --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
+  --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
+  --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
+}
+
+[data-theme="dark"]:where(.theme-flow *):where([data-theme="light"] *):where(:not(.theme-survey, .theme-console, .theme-surface, .theme-station, .theme-flow :is(.theme-survey, .theme-console, .theme-surface, .theme-station) *)) {
+  --k-brand: #3890ae;
+  --k-action: #2f88a6;
+  --k-action-contrast: #06080b;
+  --k-focus: #2f88a6;
+  --k-focus-ring: var(--k-focus);
+}
+
+[data-theme="dark"]:where(.theme-surface *):where([data-theme="light"] *):where(:not(.theme-survey, .theme-console, .theme-flow, .theme-station, .theme-surface :is(.theme-survey, .theme-console, .theme-flow, .theme-station) *)) {
+  --k-brand: #14a37a;
+  --k-action: #14a37a;
+  --k-action-contrast: #06080b;
+  --k-focus: #14a37a;
+  --k-focus-ring: var(--k-focus);
+}
+
+[data-theme="dark"]:where(.theme-station *):where([data-theme="light"] *):where(:not(.theme-survey, .theme-console, .theme-flow, .theme-surface, .theme-station :is(.theme-survey, .theme-console, .theme-flow, .theme-surface) *)) {
+  --k-brand: #966aff;
+  --k-action: #7c3aed;
+  --k-action-contrast: #ffffff;
+  --k-focus: #9364ff;
+  --k-focus-ring: var(--k-focus);
 }

package/dist/src/review-workbench/vendor/kontourai-ui/tokens/tokens.css

@@ -19,12 +19,23 @@
   /* text */
   --k-text: #eef3f8;
   --k-text-muted: #aebccb;
-  --k-text-faint: #72869b;
+  --k-text-faint: #75889d;
 
-  /* brand */
+  /* brand — the product identity slot (eyebrows, accents, the progress sweep).
+     A product theme or a white-label deployment may override it; nothing
+     interactive reads it, so a brand that fails contrast cannot break a
+     button or a focus ring. */
   --k-brand: #5ce0c6;
   --k-brand-contrast: #06080b;
 
+  /* interaction roles — primary actions and keyboard focus. They hold their
+     own values instead of var(--k-brand): an alias would make every brand
+     override repaint buttons whether or not the new color can carry text.
+     Each theme and mode sets its action and focus beside its brand. */
+  --k-action: #5ce0c6;
+  --k-action-contrast: #06080b;
+  --k-focus: #5ce0c6;
+
   /* semantic status scale */
   --k-positive: #34d399;
   --k-caution: #f3b14b;
@@ -35,6 +46,51 @@
   --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
   --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
   --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
+  /* Text on a filled status tone (tone badges, status-toned buttons). Its own
+     role so a white-label --k-brand-contrast cannot recolor status text. */
+  --k-status-contrast: #06080b;
+
+  /* trust states — Surface's claim statuses (TRUST_STATUSES, in Surface's
+     order), shown as presentation states: separate from the five status
+     tones and from the product accents. Each state has its own ink (label,
+     glyph, border), fill (the chip's own background, so its text pair does
+     not depend on the container) and line style (the non-color cue borders
+     and chart strokes reuse). Values are literal, never aliases: an alias
+     declared here resolves here, so a light or themed scope would inherit
+     this scope's hue (ui#78). */
+  --k-trust-unknown: #a2acb7;
+  --k-trust-unknown-fill: #252d39;
+  --k-trust-unknown-line: dotted;
+  --k-trust-proposed: #87b1fd;
+  --k-trust-proposed-fill: #222d42;
+  --k-trust-proposed-line: dashed;
+  --k-trust-assumed: #c4a4fe;
+  --k-trust-assumed-fill: #2a2c43;
+  --k-trust-assumed-line: dashed;
+  --k-trust-verified: #50d492;
+  --k-trust-verified-fill: #1a3233;
+  --k-trust-verified-line: solid;
+  --k-trust-stale: #f6b84d;
+  --k-trust-stale-fill: #312e2a;
+  --k-trust-stale-line: dotted;
+  --k-trust-disputed: #ec81c0;
+  --k-trust-disputed-fill: #30273a;
+  --k-trust-disputed-line: double;
+  --k-trust-superseded: #6bc8d3;
+  --k-trust-superseded-fill: #1e313d;
+  --k-trust-superseded-line: dotted;
+  --k-trust-rejected: #f66d67;
+  --k-trust-rejected-fill: #31242d;
+  --k-trust-rejected-line: solid;
+  --k-trust-revoked: #fdc2a2;
+  --k-trust-revoked-fill: #323036;
+  --k-trust-revoked-line: dotted;
+
+  /* trust basis — the line after a trust-state chip. Caveat facets
+     (Model-derived, not evaluated, cited only, contradicts, failed) are
+     underlined with a dashed line in the text's own color: a line-style cue,
+     never a hue. Names no color, so it inherits the rated muted text. */
+  --k-basis-caveat-decoration: underline dashed 1px;
 
   /* spacing */
   --k-space-1: 4px;
@@ -85,8 +141,11 @@
   --k-tracking-wide: 0.08em;
 
   /* focus — one ring contract so every interactive primitive (controls,
-     buttons, links) shows the same keyboard-focus affordance. */
-  --k-focus-ring: var(--k-brand);
+     buttons, links) shows the same keyboard-focus affordance. The ring color
+     is the --k-focus role; --k-focus-ring is kept as a compatibility alias for
+     consumer styles. Primitives read --k-focus directly, so an override of
+     --k-focus on any element reaches them. */
+  --k-focus-ring: var(--k-focus);
   --k-focus-ring-width: 2px;
   --k-focus-ring-offset: 2px;
 
@@ -102,6 +161,63 @@
   --k-z-toast: 1400;
 }
 
+/* The dark contract again, for a data-theme="dark" element below a light
+   element (ui#80). It sets exactly the tokens the light block sets, with the
+   :root values; check:contrast fails if either drifts. Mode-independent
+   tokens (spacing, type, radii, fonts) are not reset, so a theme's own values
+   for them survive a mode switch. With no light ancestor there is nothing to
+   reset, so it does not match and a dark element simply inherits. */
+[data-theme="dark"]:where([data-theme="light"] *) {
+  color-scheme: dark;
+  --k-bg: #0a0e13;
+  --k-panel: #111824;
+  --k-panel-raised: #16202d;
+  --k-line: rgba(150, 180, 210, 0.12);
+  --k-line-strong: rgba(150, 180, 210, 0.22);
+  --k-shadow: 0 26px 60px -42px rgba(0, 0, 0, 0.95);
+  --k-elevation-overlay:
+    0 1px 2px rgba(0, 0, 0, 0.35),
+    0 12px 32px rgba(0, 0, 0, 0.45),
+    0 24px 56px rgba(0, 0, 0, 0.4);
+  --k-text: #eef3f8;
+  --k-text-muted: #aebccb;
+  --k-text-faint: #75889d;
+  --k-brand: #5ce0c6;
+  --k-brand-contrast: #06080b;
+  --k-action: #5ce0c6;
+  --k-action-contrast: #06080b;
+  --k-focus: #5ce0c6;
+  --k-positive: #34d399;
+  --k-caution: #f3b14b;
+  --k-negative: #ff6f6f;
+  --k-neutral: #6f8095;
+  --k-active: #7aa2ff;
+  --k-status-contrast: #06080b;
+  --k-trust-unknown: #a2acb7;
+  --k-trust-unknown-fill: #252d39;
+  --k-trust-proposed: #87b1fd;
+  --k-trust-proposed-fill: #222d42;
+  --k-trust-assumed: #c4a4fe;
+  --k-trust-assumed-fill: #2a2c43;
+  --k-trust-verified: #50d492;
+  --k-trust-verified-fill: #1a3233;
+  --k-trust-stale: #f6b84d;
+  --k-trust-stale-fill: #312e2a;
+  --k-trust-disputed: #ec81c0;
+  --k-trust-disputed-fill: #30273a;
+  --k-trust-superseded: #6bc8d3;
+  --k-trust-superseded-fill: #1e313d;
+  --k-trust-rejected: #f66d67;
+  --k-trust-rejected-fill: #31242d;
+  --k-trust-revoked: #fdc2a2;
+  --k-trust-revoked-fill: #323036;
+  --k-focus-ring: var(--k-focus);
+  --k-positive-soft: color-mix(in oklab, var(--k-positive) 14%, transparent);
+  --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
+  --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
+  --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
+}
+
 [data-theme="light"] {
   color-scheme: light;
   --k-bg: #f5f4ef;
@@ -116,16 +232,51 @@
     0 18px 48px rgba(0, 0, 0, 0.08);
   --k-text: #202124;
   --k-text-muted: #5b626b;
-  --k-text-faint: #707782;
+  --k-text-faint: #6a707b;
   /* The dark-mode brand (#5ce0c6) is too light to carry white text or read as
      text on the light canvas (~1.6:1). Darken it for light mode: #0e7c64 holds
      the teal hue while clearing WCAG AA both as a button fill (white text,
      5.1:1) and as text on --k-bg (4.7:1). */
   --k-brand: #0e7c64;
   --k-brand-contrast: #ffffff;
+  --k-action: #0e7c64;
+  --k-action-contrast: #ffffff;
+  --k-focus: #0e7c64;
   --k-positive: #168257;
   --k-caution: #8a5a00;
   --k-negative: #c83b3b;
   --k-neutral: #5f6975;
   --k-active: #3f6fd6;
+  --k-status-contrast: #ffffff;
+
+  /* Light trust inks are dark enough that each label clears AA on its own
+     tinted fill; check:contrast rates every pair. */
+  --k-trust-unknown: #535c66;
+  --k-trust-unknown-fill: #eeeff0;
+  --k-trust-proposed: #2855ad;
+  --k-trust-proposed-fill: #eaeef7;
+  --k-trust-assumed: #6938a7;
+  --k-trust-assumed-fill: #f0ebf6;
+  --k-trust-verified: #006d42;
+  --k-trust-verified-fill: #e6f0ec;
+  --k-trust-stale: #855a00;
+  --k-trust-stale-fill: #f3efe6;
+  --k-trust-disputed: #94296f;
+  --k-trust-disputed-fill: #f4eaf1;
+  --k-trust-superseded: #016770;
+  --k-trust-superseded-fill: #e6f0f1;
+  --k-trust-rejected: #a12628;
+  --k-trust-rejected-fill: #f6e9ea;
+  --k-trust-revoked: #713408;
+  --k-trust-revoked-fill: #f1ebe6;
+
+  /* Tokens derived with var() resolve on the element that declares them and
+     are inherited as computed values, so each scope that changes an input
+     redeclares them. Without this, data-theme on a descendant of <html> would
+     keep the dark default's ring and soft fills. */
+  --k-focus-ring: var(--k-focus);
+  --k-positive-soft: color-mix(in oklab, var(--k-positive) 14%, transparent);
+  --k-caution-soft: color-mix(in oklab, var(--k-caution) 14%, transparent);
+  --k-negative-soft: color-mix(in oklab, var(--k-negative) 14%, transparent);
+  --k-active-soft: color-mix(in oklab, var(--k-active) 14%, transparent);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kontourai/survey",
-  "version": "8.0.0",
+  "version": "8.1.1",
   "description": "Producer-side source, extraction, candidate, and review contracts for projecting verified claims into Surface.",
   "license": "Apache-2.0",
   "type": "module",
@@ -35,7 +35,11 @@
     "./example-data/public-field-review": "./dist/example-data/public-field-review.js",
     "./example-data/corrected-document-candidates": "./dist/example-data/corrected-document-candidates.js",
     "./example-data/public-directory-review-resource": "./dist/example-data/public-directory-review-resource.js",
-    "./example-data/regulated-document-review-resource": "./dist/example-data/regulated-document-review-resource.js"
+    "./example-data/regulated-document-review-resource": "./dist/example-data/regulated-document-review-resource.js",
+    "./review-console": {
+      "types": "./dist/src/console/review-console-server.d.ts",
+      "default": "./dist/src/console/review-console-server.js"
+    }
   },
   "files": [
     "bin/",
@@ -53,7 +57,7 @@
     "test:package-smoke": "npm run build && node --test dist/tests/package-smoke/*.test.js",
     "test:browser": "playwright test",
     "test:browser:concurrent": "npm run build && node scripts/test-playwright-concurrency.mjs",
-    "verify": "npm run check:content-boundary && npm run check:decisions && npm run typecheck && npm test && npm run test:package-smoke && npm run check:review-workbench-assets && npm run check:review-workbench && npm run test:browser && npm run test:browser:concurrent",
+    "verify": "npm run check:ui-token-drift && npm run check:content-boundary && npm run check:decisions && npm run typecheck && npm test && npm run test:package-smoke && npm run check:review-workbench && npm run test:browser && npm run test:browser:concurrent",
     "check:content-boundary": "node --test tests/content-boundary-script.test.cjs && node scripts/check-content-boundary.cjs",
     "check:decisions": "node scripts/check-decisions.cjs check",
     "check:guards": "node scripts/check-guards.mjs",
@@ -65,9 +69,11 @@
     "check:review-workbench:static": "npm run build && node scripts/check-review-workbench.cjs",
     "setup:repo-hooks": "node scripts/setup-repo-hooks.cjs",
     "validate:repo-hooks": "node scripts/validate-repo-hooks.cjs",
-    "docs:build": "npm run build --silent && node scripts/docs-site/build.ts",
-    "docs:check": "npm run docs:build && node scripts/docs-site/check-links.ts",
+    "docs:build": "npx -y github:kontourai/docs-kit#efe0bfe4ad247861ef661c907f6354d6167fa3be docs-kit build",
+    "docs:check": "npx -y github:kontourai/docs-kit#efe0bfe4ad247861ef661c907f6354d6167fa3be docs-kit check",
+    "docs:demo": "npm run build && node scripts/build-demo.mjs",
     "check:generated-css": "node scripts/copy-review-workbench-package-assets.cjs --check",
+    "check:ui-token-drift": "npm run check:generated-css && npm run check:review-workbench-assets",
     "workflow:sidecar": "flow-agents-workflow-sidecar",
     "workflow:validate-artifacts": "flow-agents-validate-artifacts"
   },
@@ -86,11 +92,10 @@
   },
   "devDependencies": {
     "@kontourai/flow-agents": "5.10.0",
-    "@kontourai/traverse": "^0.25.0",
-    "@kontourai/ui": "^1.1.0",
+    "@kontourai/traverse": "^3.0.1",
+    "@kontourai/ui": "^1.18.0",
     "@playwright/test": "^1.62.0",
     "@types/node": "^26.1.2",
-    "marked": "^18.0.7",
     "typescript": "^7.0.2"
   },
   "engines": {