@domandigital/craft 0.2.0 → 0.4.0

package/CHANGELOG.md

@@ -1,5 +1,83 @@
 # @domandigital/craft
 
+## 0.4.0
+
+### Minor Changes
+
+- 1b2e8bf: `checkRestraint` resolves token references instead of skipping them.
+
+  The old rule skipped any value starting with `var(`, on the reasoning that a
+  token reference is the token layer doing its job rather than a new value. True
+  of a hand-written sheet. On a Tailwind v4 sheet it is close to measuring
+  nothing: `text-sm` compiles to `font-size: var(--text-sm)` and `rounded-lg` to
+  `border-radius: var(--radius-lg)`, and `shadow-[…]` emits no `box-shadow` at
+  all — it assigns `--tw-shadow` and lets one shared composite read it.
+
+  Measured on the estate this was hiding, per surface: 19 font sizes reported
+  against 28 shipped, 5 shadows against 18, 7 radii against 13. A second surface
+  reported `ok: true` on every axis and is over budget on four.
+
+  What changes:
+
+  - A value that is exactly one `var()` is resolved through the token chain to
+    the value that renders, and counted.
+  - `--tw-shadow` assignments count as shadows; Tailwind's composite plumbing
+    value does not, and neither does its `0 0 #0000` initial.
+  - `var(--tw-shadow-color, X)` is unwrapped to `X`, so the report names what a
+    reader would see.
+  - Definitions are read from the whole sheet, including ignored layers, while
+    usage is still read only from kept ones. The layer exclusion is unchanged in
+    intent and now works: a framework default nothing uses still counts for
+    nothing. Used versus unused was always the real distinction; which layer the
+    definition sat in never was.
+  - New `unresolved-token` warning for a declaration whose token is defined
+    nowhere and which carries no fallback. It applies nothing, so it is not
+    vocabulary — it is a bug, and it now says so. It found two on first contact.
+
+  **Every consumer's baseline will move**, upward, on surfaces built with a
+  utility framework. That is the correction, not a regression.
+
+## 0.3.0
+
+### Minor Changes
+
+- 2075e76: `checkRestraint` measures the surface, not the framework underneath it.
+
+  Two defects, both found by running the checker against a real compiled
+  stylesheet — `apps/portal` in the Doman Digital monorepo — rather than against
+  its own fixtures.
+
+  **It rejected `EASE.inOut`, one of its own canonical curves.** The ease-in test
+  compared only the first control point (`y1 < x1`), which is true of every
+  ease-in-_out_ as well. So the standard failed its own checker on any surface
+  that adopted the token the standard recommends. Section 7's objection to ease-in
+  is about the end of the movement — a curve that accelerates into its final
+  position reads as the interface pulling away — so the test is now the end
+  tangent: rejected when the curve covers more ground per unit time arriving than
+  it averaged. `EASE.out`, `EASE.inOut`, `EASE.drawer`, `EASE.reveal`, Tailwind's
+  default and `linear` all pass; the `ease-in` keyword's curve, the portal's old
+  `--ease-exit`, and a back-loaded custom curve are all still rejected.
+
+  **It counted the framework's reset and theme as house vocabulary.** Tailwind v4
+  alone contributes three font sizes nobody chose (`small` at 80%, `sub`/`sup` at
+  75%, `code` at 1em) and two timing functions, which was enough to report a
+  surface as over its font-size budget for values its author never wrote.
+  `@layer theme` and `@layer base` are now excluded by default via a new
+  `ignoreAtLayers` option; pass `[]` to count everything, as before.
+
+  **Its reduced-motion check read the rest of the file, not the block.** It sliced
+  from the first `@media (prefers-reduced-motion: reduce)` to the end of the sheet,
+  so every rule after that point counted as being inside it. On a real sheet that
+  meant `[data-craft-lcp] { animation: none }` — this package's own section 7 rule,
+  correctly outside any media query — was reported as a section 8 violation. The
+  scan is now brace-matched to each block's own body, and reads every such block
+  rather than only the first.
+
+  **CSS-wide keywords are no longer counted as vocabulary.** `inherit` and
+  `initial` were already excluded; `unset`, `revert` and `revert-layer` were not,
+  and `revert` appears in compiled output. A declaration that defers to the cascade
+  names no value, so it is not a step of anything.
+
 ## 0.2.0
 
 ### Minor Changes

package/STANDARD.md

@@ -83,7 +83,10 @@ needs. Set once on a shell via `[data-density]`, inherited below.
 - **Transform and opacity only.** Everything else cannot be composited.
 - **Exits run at 0.75× their entrance.** Arriving content is asking to be read;
   leaving content lingering reads as lag.
-- **No ease-in for UI, ever.** It accelerates away from the user.
+- **No ease-in for UI, ever.** It accelerates away from the user. The objection
+  is about the *end* of the movement, not the start, which is why ease-in-out is
+  fine: a curve is rejected when its end tangent is steeper than the diagonal,
+  meaning it covers more ground per unit time arriving than it averaged.
 - **UI durations ≤ 300ms.** Drawers and one gated reveal may exceed it.
 - **Don't animate what fires 100×/day**, and never animate a keyboard-triggered
   interaction — the user is moving faster than the animation.
@@ -96,7 +99,7 @@ needs. Set once on a shell via `[data-density]`, inherited below.
 `@media (prefers-reduced-motion: reduce)` sets `animation-duration` and
 `transition-duration` to **0.01ms** and `animation-iteration-count` to 1.
 
-**Never `animation: none`.** That drops the `forwards` fill along with the
+**Never `animation: none` inside the block.** That drops the `forwards` fill along with the
 animation, so a forwards-filled entrance never applies its end state and the
 element keeps `opacity: 0` from its base rule — permanently invisible, for
 exactly the users who asked for less motion. This shipped.
@@ -114,7 +117,34 @@ Differentiation guards pass anything that differs from its siblings, however
 ugly. What they cannot see is accumulation — eighteen font sizes, six shadows,
 four competing accents, each added reasonably, together reading as noise.
 
-*Source: measured against the estate; the budget is the observed ceiling of the surfaces that read as designed.*
+The budget counts the vocabulary a surface **chose**, and the whole difficulty
+is telling that apart from what the framework brought.
+
+The first rule drew the line at the layer: `@layer theme` and `@layer base` were
+excluded, because counting them reported a surface as over budget for values its
+author never wrote. Right about the noise, wrong about the boundary. Tailwind v4
+compiles `text-sm` to `font-size: var(--text-sm)` and `rounded-lg` to
+`border-radius: var(--radius-lg)`, so with the definitions excluded *and* token
+references skipped, a surface using `text-sm` seven hundred times reported it
+zero times. One estate measured 19 font sizes and shipped 28; 5 shadows and
+shipped 18. A count wrong in the under-reporting direction is worse than the
+over-reporting kind it replaced: the first buries real findings in noise, the
+second reports a pass.
+
+The line is **used versus unused**, which is not a property of the layer:
+
+- References are **resolved**, not skipped — through the token chain, to the
+  value that renders.
+- A definition is only ever reached from a declaration in a kept layer, so a
+  framework default nothing uses still counts for nothing.
+- `--tw-shadow` assignments count as shadows. `shadow-[…]` emits no literal
+  `box-shadow` at all; it assigns that property and lets one shared composite
+  read it.
+- A reference that resolves to nothing is **not** vocabulary. It is a
+  declaration that silently applies nothing, and it is reported as its own
+  warning.
+
+*Source: measured against the estate. The budget is the observed ceiling of the surfaces that read as designed; the resolution rule is what it took to measure them at all.*
 
 ## 10. What is deliberately not a rule
 

package/dist/index.cjs

@@ -819,16 +819,125 @@ var HOUSE_BUDGET = {
   accentHueClusterDeg: 15,
   maxUiDurationMs: 300
 };
+var DEFAULT_IGNORED_LAYERS = ["theme", "base"];
 function stripComments(css) {
   return css.replace(/\/\*[\s\S]*?\*\//g, "");
 }
-function distinctValues(css, property) {
+function stripLayers(css, ignored) {
+  if (ignored.length === 0) return css;
+  const names = new Set(ignored.map((n) => n.trim().toLowerCase()));
+  let out = "";
+  let i = 0;
+  const pattern = /@layer\s+([a-zA-Z0-9_-]+)\s*\{/gi;
+  while (i < css.length) {
+    pattern.lastIndex = i;
+    const match = pattern.exec(css);
+    if (match === null) {
+      out += css.slice(i);
+      break;
+    }
+    out += css.slice(i, match.index);
+    const bodyStart = match.index + match[0].length;
+    let depth = 1;
+    let j = bodyStart;
+    while (j < css.length && depth > 0) {
+      if (css[j] === "{") depth += 1;
+      else if (css[j] === "}") depth -= 1;
+      j += 1;
+    }
+    if (!names.has(match[1].toLowerCase())) {
+      out += stripLayers(css.slice(bodyStart, j - 1), ignored);
+    }
+    i = j;
+  }
+  return out;
+}
+var CSS_WIDE_KEYWORDS = /* @__PURE__ */ new Set([
+  "inherit",
+  "initial",
+  "unset",
+  "revert",
+  "revert-layer"
+]);
+function atRuleBodies(css, prelude) {
+  const out = [];
+  const pattern = new RegExp(
+    prelude.source,
+    prelude.flags.includes("g") ? prelude.flags : `${prelude.flags}g`
+  );
+  let match;
+  while ((match = pattern.exec(css)) !== null) {
+    const start = match.index + match[0].length;
+    let depth = 1;
+    let i = start;
+    while (i < css.length && depth > 0) {
+      if (css[i] === "{") depth += 1;
+      else if (css[i] === "}") depth -= 1;
+      i += 1;
+    }
+    out.push(css.slice(start, i - 1));
+    pattern.lastIndex = i;
+  }
+  return out;
+}
+function customProperties(css) {
+  const out = /* @__PURE__ */ new Map();
+  for (const match of css.matchAll(/(--[\w-]+)\s*:\s*([^;}]+)/g)) {
+    out.set(match[1].toLowerCase(), match[2].trim().replace(/\s+/g, " "));
+  }
+  return out;
+}
+function unwrapShadowColor(value) {
+  return value.replace(
+    /var\(\s*--tw-shadow-color\s*,\s*([^)]*(?:\([^)]*\))?[^)]*)\)/g,
+    "$1"
+  );
+}
+var SINGLE_VAR = /^var\(\s*(--[\w-]+)\s*(?:,([\s\S]*))?\)$/;
+function resolveValue(value, props, depth = 0) {
+  if (depth > 8) return null;
+  const match = SINGLE_VAR.exec(value.trim());
+  if (match === null) return value.trim();
+  const target = props.get(match[1].toLowerCase());
+  if (target !== void 0 && target !== "initial")
+    return resolveValue(target, props, depth + 1);
+  const fallback = match[2]?.trim();
+  return fallback === void 0 || fallback === "" ? null : resolveValue(fallback, props, depth + 1);
+}
+function isVarOnlyList(value) {
+  const parts = value.split(",");
+  return parts.length > 1 && parts.every((part) => /^\s*var\(\s*--[\w-]+\s*\)\s*$/.test(part));
+}
+function distinctValues(css, property, props, unresolved) {
   const pattern = new RegExp(`(?:^|[;{\\s])${property}\\s*:\\s*([^;}]+)`, "gi");
   const seen = /* @__PURE__ */ new Set();
   for (const match of css.matchAll(pattern)) {
-    const value = match[1].trim().replace(/\s+/g, " ").toLowerCase();
-    if (value.startsWith("var(") || value === "inherit" || value === "initial") continue;
-    seen.add(value);
+    const raw = match[1].trim().replace(/\s+/g, " ").toLowerCase();
+    if (CSS_WIDE_KEYWORDS.has(raw)) continue;
+    const value = unwrapShadowColor(raw);
+    if (isVarOnlyList(value)) continue;
+    if (!SINGLE_VAR.test(value)) {
+      seen.add(value);
+      continue;
+    }
+    if (props === void 0) continue;
+    const resolved = resolveValue(value, props);
+    if (resolved === null) {
+      unresolved?.add(`${property}: ${value}`);
+      continue;
+    }
+    seen.add(unwrapShadowColor(resolved).toLowerCase());
+  }
+  return [...seen];
+}
+function twShadowValues(css, props) {
+  const seen = /* @__PURE__ */ new Set();
+  for (const match of css.matchAll(/--tw-shadow\s*:\s*([^;}]+)/g)) {
+    const raw = match[1].trim().replace(/\s+/g, " ").toLowerCase();
+    if (raw === "0 0 #0000" || raw === "none") continue;
+    const value = SINGLE_VAR.test(raw) ? resolveValue(raw, props) : raw;
+    if (value === null) continue;
+    seen.add(unwrapShadowColor(value).toLowerCase());
   }
   return [...seen];
 }
@@ -843,12 +952,18 @@ function durationsMs(css) {
 }
 function checkRestraint(input) {
   const budget = { ...HOUSE_BUDGET, ...input.budget };
-  const css = stripComments(input.css);
+  const whole = stripComments(input.css);
+  const props = customProperties(whole);
+  const css = stripLayers(
+    whole,
+    input.ignoreAtLayers ?? DEFAULT_IGNORED_LAYERS
+  );
+  const unresolved = /* @__PURE__ */ new Set();
   const violations = [];
   const push = (rule, severity, message, found) => {
     violations.push({ rule, severity, message, found });
   };
-  const fontSizes = distinctValues(css, "font-size");
+  const fontSizes = distinctValues(css, "font-size", props, unresolved);
   if (fontSizes.length > budget.maxFontSizes) {
     push(
       "font-sizes",
@@ -857,10 +972,15 @@ function checkRestraint(input) {
       fontSizes
     );
   }
-  const weights = distinctValues(css, "font-weight").filter((w) => w !== "normal" && w !== "bold");
-  const namedWeights = distinctValues(css, "font-weight").filter(
-    (w) => w === "normal" || w === "bold"
+  const weights = distinctValues(css, "font-weight", props, unresolved).filter(
+    (w) => w !== "normal" && w !== "bold"
   );
+  const namedWeights = distinctValues(
+    css,
+    "font-weight",
+    props,
+    unresolved
+  ).filter((w) => w === "normal" || w === "bold");
   const allWeights = [.../* @__PURE__ */ new Set([...weights, ...namedWeights])];
   if (allWeights.length > budget.maxFontWeights) {
     push(
@@ -870,7 +990,7 @@ function checkRestraint(input) {
       allWeights
     );
   }
-  const families = distinctValues(css, "font-family").filter(
+  const families = distinctValues(css, "font-family", props, unresolved).filter(
     (f) => !/\bmonospace\b|\bmono\b/.test(f)
   );
   if (families.length > budget.maxFontFamilies) {
@@ -881,11 +1001,23 @@ function checkRestraint(input) {
       families
     );
   }
-  const radii = distinctValues(css, "border-radius").filter((r) => r !== "0" && r !== "0px");
+  const radii = distinctValues(css, "border-radius", props, unresolved).filter(
+    (r) => r !== "0" && r !== "0px"
+  );
   if (radii.length > budget.maxRadii) {
-    push("radii", "error", `${radii.length} corner radii, budget ${budget.maxRadii}.`, radii);
+    push(
+      "radii",
+      "error",
+      `${radii.length} corner radii, budget ${budget.maxRadii}.`,
+      radii
+    );
   }
-  const shadows = distinctValues(css, "box-shadow").filter((s) => s !== "none");
+  const shadows = [
+    .../* @__PURE__ */ new Set([
+      ...distinctValues(css, "box-shadow", props, unresolved),
+      ...twShadowValues(css, props)
+    ])
+  ].filter((s) => s !== "none");
   if (shadows.length > budget.maxShadows) {
     push(
       "shadows",
@@ -894,6 +1026,14 @@ function checkRestraint(input) {
       shadows
     );
   }
+  if (unresolved.size > 0) {
+    push(
+      "unresolved-token",
+      "warning",
+      `${unresolved.size} declaration(s) reference a custom property that is never defined and carry no fallback. Each one applies nothing.`,
+      [...unresolved].sort()
+    );
+  }
   const accentHexes = [
     ...css.matchAll(/--[a-z0-9-]*accent[a-z0-9-]*\s*:\s*(#[0-9a-fA-F]{3,8})/g)
   ].map((m) => m[1]);
@@ -928,12 +1068,14 @@ function checkRestraint(input) {
   }
   const easeIn = [
     ...css.matchAll(/(?:transition|animation)[^;}]*\b(ease-in)\b(?!-out)/gi),
-    ...css.matchAll(/cubic-bezier\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,/gi)
+    ...css.matchAll(
+      /cubic-bezier\(\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*\)/gi
+    )
   ].map((m) => {
     if (m[1] === "ease-in") return "ease-in";
-    const x1 = Number(m[1]);
-    const y1 = Number(m[2]);
-    return Number.isFinite(x1) && Number.isFinite(y1) && y1 < x1 ? m[0] : null;
+    const p = [m[1], m[2], m[3], m[4]].map(Number);
+    if (!p.every((n) => Number.isFinite(n))) return null;
+    return acceleratesIntoTheEnd(p[0], p[1], p[2], p[3]) ? m[0] : null;
   }).filter((v) => v !== null);
   if (easeIn.length > 0) {
     push(
@@ -943,7 +1085,9 @@ function checkRestraint(input) {
       [...new Set(easeIn)]
     );
   }
-  const overBudget = durationsMs(css).filter((d) => d.ms > budget.maxUiDurationMs);
+  const overBudget = durationsMs(css).filter(
+    (d) => d.ms > budget.maxUiDurationMs
+  );
   if (overBudget.length > 0) {
     push(
       "duration",
@@ -960,8 +1104,11 @@ function checkRestraint(input) {
       ["scale(0)"]
     );
   }
-  const reducedMotionAt = css.search(/@media[^{]*prefers-reduced-motion:\s*reduce/i);
-  if (reducedMotionAt === -1) {
+  const reducedMotionBlocks = atRuleBodies(
+    css,
+    /@media[^{]*prefers-reduced-motion:\s*reduce[^{]*\{/gi
+  );
+  if (reducedMotionBlocks.length === 0) {
     if (/@keyframes|animation\s*:|transition\s*:/.test(css)) {
       push(
         "reduced-motion-missing",
@@ -971,7 +1118,7 @@ function checkRestraint(input) {
       );
     }
   } else {
-    const block = css.slice(reducedMotionAt);
+    const block = reducedMotionBlocks.join("\n");
     if (/animation\s*:\s*none/i.test(block)) {
       push(
         "reduced-motion-animation-none",
@@ -1007,6 +1154,17 @@ function checkRestraint(input) {
     }
   };
 }
+function acceleratesIntoTheEnd(x1, y1, x2, y2) {
+  const EPSILON = 1e-6;
+  let dx = 1 - x2;
+  let dy = 1 - y2;
+  if (Math.abs(dx) < EPSILON && Math.abs(dy) < EPSILON) {
+    dx = 1 - x1;
+    dy = 1 - y1;
+  }
+  if (Math.abs(dx) < EPSILON) return Math.abs(dy) > EPSILON;
+  return dy / dx > 1 + EPSILON;
+}
 function hueSpread(hues) {
   const sorted = [...hues].sort((a, b) => a - b);
   let widestGap = 0;

package/dist/index.d.cts

@@ -631,6 +631,24 @@ interface CheckRestraintInput {
     /** Concatenated markup or component source, for class-level rules. */
     markup?: string;
     budget?: Partial<RestraintBudget>;
+    /**
+     * Cascade layers to exclude before counting, by name.
+     *
+     * A restraint budget measures the vocabulary a surface *chose*. A compiled
+     * stylesheet also carries the framework's reset and theme, and counting those
+     * makes the report wrong in the one direction that matters: it reports a
+     * surface as over budget for values its author never wrote, so the real
+     * findings get triaged away with the noise. Measured on this estate, Tailwind
+     * v4 contributes three font sizes nobody chose (`small` at 80%, `sub`/`sup` at
+     * 75%) and two timing functions (`--default-transition-timing-function`,
+     * `--animate-pulse`) from `@layer theme` and `@layer base` alone.
+     *
+     * The default is those two names, which is the convention every layered
+     * framework follows and the one Tailwind enforces. A rule placed in the reset
+     * layer is a reset by the author's own declaration; put it outside the layer
+     * to have it counted as vocabulary. Pass `[]` to count everything.
+     */
+    ignoreAtLayers?: string[];
 }
 /**
  * Check a stylesheet against the restraint budget.

package/dist/index.d.ts

@@ -631,6 +631,24 @@ interface CheckRestraintInput {
     /** Concatenated markup or component source, for class-level rules. */
     markup?: string;
     budget?: Partial<RestraintBudget>;
+    /**
+     * Cascade layers to exclude before counting, by name.
+     *
+     * A restraint budget measures the vocabulary a surface *chose*. A compiled
+     * stylesheet also carries the framework's reset and theme, and counting those
+     * makes the report wrong in the one direction that matters: it reports a
+     * surface as over budget for values its author never wrote, so the real
+     * findings get triaged away with the noise. Measured on this estate, Tailwind
+     * v4 contributes three font sizes nobody chose (`small` at 80%, `sub`/`sup` at
+     * 75%) and two timing functions (`--default-transition-timing-function`,
+     * `--animate-pulse`) from `@layer theme` and `@layer base` alone.
+     *
+     * The default is those two names, which is the convention every layered
+     * framework follows and the one Tailwind enforces. A rule placed in the reset
+     * layer is a reset by the author's own declaration; put it outside the layer
+     * to have it counted as vocabulary. Pass `[]` to count everything.
+     */
+    ignoreAtLayers?: string[];
 }
 /**
  * Check a stylesheet against the restraint budget.

package/dist/index.js

@@ -747,16 +747,125 @@ var HOUSE_BUDGET = {
   accentHueClusterDeg: 15,
   maxUiDurationMs: 300
 };
+var DEFAULT_IGNORED_LAYERS = ["theme", "base"];
 function stripComments(css) {
   return css.replace(/\/\*[\s\S]*?\*\//g, "");
 }
-function distinctValues(css, property) {
+function stripLayers(css, ignored) {
+  if (ignored.length === 0) return css;
+  const names = new Set(ignored.map((n) => n.trim().toLowerCase()));
+  let out = "";
+  let i = 0;
+  const pattern = /@layer\s+([a-zA-Z0-9_-]+)\s*\{/gi;
+  while (i < css.length) {
+    pattern.lastIndex = i;
+    const match = pattern.exec(css);
+    if (match === null) {
+      out += css.slice(i);
+      break;
+    }
+    out += css.slice(i, match.index);
+    const bodyStart = match.index + match[0].length;
+    let depth = 1;
+    let j = bodyStart;
+    while (j < css.length && depth > 0) {
+      if (css[j] === "{") depth += 1;
+      else if (css[j] === "}") depth -= 1;
+      j += 1;
+    }
+    if (!names.has(match[1].toLowerCase())) {
+      out += stripLayers(css.slice(bodyStart, j - 1), ignored);
+    }
+    i = j;
+  }
+  return out;
+}
+var CSS_WIDE_KEYWORDS = /* @__PURE__ */ new Set([
+  "inherit",
+  "initial",
+  "unset",
+  "revert",
+  "revert-layer"
+]);
+function atRuleBodies(css, prelude) {
+  const out = [];
+  const pattern = new RegExp(
+    prelude.source,
+    prelude.flags.includes("g") ? prelude.flags : `${prelude.flags}g`
+  );
+  let match;
+  while ((match = pattern.exec(css)) !== null) {
+    const start = match.index + match[0].length;
+    let depth = 1;
+    let i = start;
+    while (i < css.length && depth > 0) {
+      if (css[i] === "{") depth += 1;
+      else if (css[i] === "}") depth -= 1;
+      i += 1;
+    }
+    out.push(css.slice(start, i - 1));
+    pattern.lastIndex = i;
+  }
+  return out;
+}
+function customProperties(css) {
+  const out = /* @__PURE__ */ new Map();
+  for (const match of css.matchAll(/(--[\w-]+)\s*:\s*([^;}]+)/g)) {
+    out.set(match[1].toLowerCase(), match[2].trim().replace(/\s+/g, " "));
+  }
+  return out;
+}
+function unwrapShadowColor(value) {
+  return value.replace(
+    /var\(\s*--tw-shadow-color\s*,\s*([^)]*(?:\([^)]*\))?[^)]*)\)/g,
+    "$1"
+  );
+}
+var SINGLE_VAR = /^var\(\s*(--[\w-]+)\s*(?:,([\s\S]*))?\)$/;
+function resolveValue(value, props, depth = 0) {
+  if (depth > 8) return null;
+  const match = SINGLE_VAR.exec(value.trim());
+  if (match === null) return value.trim();
+  const target = props.get(match[1].toLowerCase());
+  if (target !== void 0 && target !== "initial")
+    return resolveValue(target, props, depth + 1);
+  const fallback = match[2]?.trim();
+  return fallback === void 0 || fallback === "" ? null : resolveValue(fallback, props, depth + 1);
+}
+function isVarOnlyList(value) {
+  const parts = value.split(",");
+  return parts.length > 1 && parts.every((part) => /^\s*var\(\s*--[\w-]+\s*\)\s*$/.test(part));
+}
+function distinctValues(css, property, props, unresolved) {
   const pattern = new RegExp(`(?:^|[;{\\s])${property}\\s*:\\s*([^;}]+)`, "gi");
   const seen = /* @__PURE__ */ new Set();
   for (const match of css.matchAll(pattern)) {
-    const value = match[1].trim().replace(/\s+/g, " ").toLowerCase();
-    if (value.startsWith("var(") || value === "inherit" || value === "initial") continue;
-    seen.add(value);
+    const raw = match[1].trim().replace(/\s+/g, " ").toLowerCase();
+    if (CSS_WIDE_KEYWORDS.has(raw)) continue;
+    const value = unwrapShadowColor(raw);
+    if (isVarOnlyList(value)) continue;
+    if (!SINGLE_VAR.test(value)) {
+      seen.add(value);
+      continue;
+    }
+    if (props === void 0) continue;
+    const resolved = resolveValue(value, props);
+    if (resolved === null) {
+      unresolved?.add(`${property}: ${value}`);
+      continue;
+    }
+    seen.add(unwrapShadowColor(resolved).toLowerCase());
+  }
+  return [...seen];
+}
+function twShadowValues(css, props) {
+  const seen = /* @__PURE__ */ new Set();
+  for (const match of css.matchAll(/--tw-shadow\s*:\s*([^;}]+)/g)) {
+    const raw = match[1].trim().replace(/\s+/g, " ").toLowerCase();
+    if (raw === "0 0 #0000" || raw === "none") continue;
+    const value = SINGLE_VAR.test(raw) ? resolveValue(raw, props) : raw;
+    if (value === null) continue;
+    seen.add(unwrapShadowColor(value).toLowerCase());
   }
   return [...seen];
 }
@@ -771,12 +880,18 @@ function durationsMs(css) {
 }
 function checkRestraint(input) {
   const budget = { ...HOUSE_BUDGET, ...input.budget };
-  const css = stripComments(input.css);
+  const whole = stripComments(input.css);
+  const props = customProperties(whole);
+  const css = stripLayers(
+    whole,
+    input.ignoreAtLayers ?? DEFAULT_IGNORED_LAYERS
+  );
+  const unresolved = /* @__PURE__ */ new Set();
   const violations = [];
   const push = (rule, severity, message, found) => {
     violations.push({ rule, severity, message, found });
   };
-  const fontSizes = distinctValues(css, "font-size");
+  const fontSizes = distinctValues(css, "font-size", props, unresolved);
   if (fontSizes.length > budget.maxFontSizes) {
     push(
       "font-sizes",
@@ -785,10 +900,15 @@ function checkRestraint(input) {
       fontSizes
     );
   }
-  const weights = distinctValues(css, "font-weight").filter((w) => w !== "normal" && w !== "bold");
-  const namedWeights = distinctValues(css, "font-weight").filter(
-    (w) => w === "normal" || w === "bold"
+  const weights = distinctValues(css, "font-weight", props, unresolved).filter(
+    (w) => w !== "normal" && w !== "bold"
   );
+  const namedWeights = distinctValues(
+    css,
+    "font-weight",
+    props,
+    unresolved
+  ).filter((w) => w === "normal" || w === "bold");
   const allWeights = [.../* @__PURE__ */ new Set([...weights, ...namedWeights])];
   if (allWeights.length > budget.maxFontWeights) {
     push(
@@ -798,7 +918,7 @@ function checkRestraint(input) {
       allWeights
     );
   }
-  const families = distinctValues(css, "font-family").filter(
+  const families = distinctValues(css, "font-family", props, unresolved).filter(
     (f) => !/\bmonospace\b|\bmono\b/.test(f)
   );
   if (families.length > budget.maxFontFamilies) {
@@ -809,11 +929,23 @@ function checkRestraint(input) {
       families
     );
   }
-  const radii = distinctValues(css, "border-radius").filter((r) => r !== "0" && r !== "0px");
+  const radii = distinctValues(css, "border-radius", props, unresolved).filter(
+    (r) => r !== "0" && r !== "0px"
+  );
   if (radii.length > budget.maxRadii) {
-    push("radii", "error", `${radii.length} corner radii, budget ${budget.maxRadii}.`, radii);
+    push(
+      "radii",
+      "error",
+      `${radii.length} corner radii, budget ${budget.maxRadii}.`,
+      radii
+    );
   }
-  const shadows = distinctValues(css, "box-shadow").filter((s) => s !== "none");
+  const shadows = [
+    .../* @__PURE__ */ new Set([
+      ...distinctValues(css, "box-shadow", props, unresolved),
+      ...twShadowValues(css, props)
+    ])
+  ].filter((s) => s !== "none");
   if (shadows.length > budget.maxShadows) {
     push(
       "shadows",
@@ -822,6 +954,14 @@ function checkRestraint(input) {
       shadows
     );
   }
+  if (unresolved.size > 0) {
+    push(
+      "unresolved-token",
+      "warning",
+      `${unresolved.size} declaration(s) reference a custom property that is never defined and carry no fallback. Each one applies nothing.`,
+      [...unresolved].sort()
+    );
+  }
   const accentHexes = [
     ...css.matchAll(/--[a-z0-9-]*accent[a-z0-9-]*\s*:\s*(#[0-9a-fA-F]{3,8})/g)
   ].map((m) => m[1]);
@@ -856,12 +996,14 @@ function checkRestraint(input) {
   }
   const easeIn = [
     ...css.matchAll(/(?:transition|animation)[^;}]*\b(ease-in)\b(?!-out)/gi),
-    ...css.matchAll(/cubic-bezier\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,/gi)
+    ...css.matchAll(
+      /cubic-bezier\(\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*\)/gi
+    )
   ].map((m) => {
     if (m[1] === "ease-in") return "ease-in";
-    const x1 = Number(m[1]);
-    const y1 = Number(m[2]);
-    return Number.isFinite(x1) && Number.isFinite(y1) && y1 < x1 ? m[0] : null;
+    const p = [m[1], m[2], m[3], m[4]].map(Number);
+    if (!p.every((n) => Number.isFinite(n))) return null;
+    return acceleratesIntoTheEnd(p[0], p[1], p[2], p[3]) ? m[0] : null;
   }).filter((v) => v !== null);
   if (easeIn.length > 0) {
     push(
@@ -871,7 +1013,9 @@ function checkRestraint(input) {
       [...new Set(easeIn)]
     );
   }
-  const overBudget = durationsMs(css).filter((d) => d.ms > budget.maxUiDurationMs);
+  const overBudget = durationsMs(css).filter(
+    (d) => d.ms > budget.maxUiDurationMs
+  );
   if (overBudget.length > 0) {
     push(
       "duration",
@@ -888,8 +1032,11 @@ function checkRestraint(input) {
       ["scale(0)"]
     );
   }
-  const reducedMotionAt = css.search(/@media[^{]*prefers-reduced-motion:\s*reduce/i);
-  if (reducedMotionAt === -1) {
+  const reducedMotionBlocks = atRuleBodies(
+    css,
+    /@media[^{]*prefers-reduced-motion:\s*reduce[^{]*\{/gi
+  );
+  if (reducedMotionBlocks.length === 0) {
     if (/@keyframes|animation\s*:|transition\s*:/.test(css)) {
       push(
         "reduced-motion-missing",
@@ -899,7 +1046,7 @@ function checkRestraint(input) {
       );
     }
   } else {
-    const block = css.slice(reducedMotionAt);
+    const block = reducedMotionBlocks.join("\n");
     if (/animation\s*:\s*none/i.test(block)) {
       push(
         "reduced-motion-animation-none",
@@ -935,6 +1082,17 @@ function checkRestraint(input) {
     }
   };
 }
+function acceleratesIntoTheEnd(x1, y1, x2, y2) {
+  const EPSILON = 1e-6;
+  let dx = 1 - x2;
+  let dy = 1 - y2;
+  if (Math.abs(dx) < EPSILON && Math.abs(dy) < EPSILON) {
+    dx = 1 - x1;
+    dy = 1 - y1;
+  }
+  if (Math.abs(dx) < EPSILON) return Math.abs(dy) > EPSILON;
+  return dy / dx > 1 + EPSILON;
+}
 function hueSpread(hues) {
   const sorted = [...hues].sort((a, b) => a - b);
   let widestGap = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domandigital/craft",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "private": false,
   "description": "The Doman Digital house craft standard as numbers: OKLCh colour ramps that snap to existing anchors, derived semantic tokens with measured WCAG and APCA contrast, one shared motion vocabulary for CSS and JS, and a base stylesheet. Zero dependencies.",
   "license": "Apache-2.0",