@domandigital/craft 0.1.0

package/dist/index.js

@@ -0,0 +1,1128 @@
+// src/color/oklch.ts
+var clamp01 = (n) => n < 0 ? 0 : n > 1 ? 1 : n;
+function srgbToLinear(c) {
+  return c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+}
+function linearToSrgb(c) {
+  return c <= 31308e-7 ? c * 12.92 : 1.055 * Math.pow(c, 1 / 2.4) - 0.055;
+}
+function parseHex(hex) {
+  const raw = hex.trim().replace(/^#/, "");
+  const expanded = raw.length === 3 || raw.length === 4 ? raw.slice(0, 3).split("").map((ch) => ch + ch).join("") : raw.slice(0, 6);
+  if (!/^[0-9a-fA-F]{6}$/.test(expanded)) {
+    throw new Error(`craft: not a hex colour: ${JSON.stringify(hex)}`);
+  }
+  return {
+    r: parseInt(expanded.slice(0, 2), 16) / 255,
+    g: parseInt(expanded.slice(2, 4), 16) / 255,
+    b: parseInt(expanded.slice(4, 6), 16) / 255
+  };
+}
+function formatHex({ r, g, b }) {
+  const byte = (n) => Math.round(clamp01(n) * 255).toString(16).padStart(2, "0");
+  return `#${byte(r)}${byte(g)}${byte(b)}`;
+}
+function linearRgbToOklab(r, g, b) {
+  const l = 0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b;
+  const m = 0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b;
+  const s = 0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b;
+  const l_ = Math.cbrt(l);
+  const m_ = Math.cbrt(m);
+  const s_ = Math.cbrt(s);
+  return [
+    0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_,
+    1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_,
+    0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_
+  ];
+}
+function oklabToLinearRgb(L, A, B) {
+  const l_ = L + 0.3963377774 * A + 0.2158037573 * B;
+  const m_ = L - 0.1055613458 * A - 0.0638541728 * B;
+  const s_ = L - 0.0894841775 * A - 1.291485548 * B;
+  const l = l_ * l_ * l_;
+  const m = m_ * m_ * m_;
+  const s = s_ * s_ * s_;
+  return [
+    4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s,
+    -1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s,
+    -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s
+  ];
+}
+function oklabToXyz(L, A, B) {
+  const l_ = L + 0.3963377774 * A + 0.2158037573 * B;
+  const m_ = L - 0.1055613458 * A - 0.0638541728 * B;
+  const s_ = L - 0.0894841775 * A - 1.291485548 * B;
+  const l = l_ * l_ * l_;
+  const m = m_ * m_ * m_;
+  const s = s_ * s_ * s_;
+  return [
+    1.2270138511 * l - 0.5577999807 * m + 0.281256149 * s,
+    -0.0405801784 * l + 1.1122568696 * m - 0.0716766787 * s,
+    -0.0763812845 * l - 0.4214819784 * m + 1.5861632204 * s
+  ];
+}
+function xyzToLinearP3(x, y, z) {
+  return [
+    2.4934969119 * x - 0.9313836179 * y - 0.4027107845 * z,
+    -0.8294889696 * x + 1.7626640603 * y + 0.0236246858 * z,
+    0.0358458302 * x - 0.0761723893 * y + 0.956884524 * z
+  ];
+}
+var RAD = 180 / Math.PI;
+function hexToOklch(hex) {
+  const { r, g, b } = parseHex(hex);
+  const [L, A, B] = linearRgbToOklab(srgbToLinear(r), srgbToLinear(g), srgbToLinear(b));
+  const c = Math.sqrt(A * A + B * B);
+  const h = c < 1e-7 ? 0 : (Math.atan2(B, A) * RAD % 360 + 360) % 360;
+  return { l: L, c, h };
+}
+function toAb({ c, h }) {
+  const rad = h / RAD;
+  return [c * Math.cos(rad), c * Math.sin(rad)];
+}
+function inSrgbGamut(colour, epsilon = 1e-5) {
+  const [A, B] = toAb(colour);
+  const rgb = oklabToLinearRgb(colour.l, A, B);
+  return rgb.every((ch) => ch >= -epsilon && ch <= 1 + epsilon);
+}
+function inP3Gamut(colour, epsilon = 1e-5) {
+  const [A, B] = toAb(colour);
+  const [x, y, z] = oklabToXyz(colour.l, A, B);
+  const rgb = xyzToLinearP3(x, y, z);
+  return rgb.every((ch) => ch >= -epsilon && ch <= 1 + epsilon);
+}
+function oklchToRgb(colour) {
+  const [A, B] = toAb(colour);
+  const [r, g, b] = oklabToLinearRgb(colour.l, A, B);
+  return { r: linearToSrgb(r), g: linearToSrgb(g), b: linearToSrgb(b) };
+}
+function deltaEOk(a, b) {
+  const [aA, aB] = toAb(a);
+  const [bA, bB] = toAb(b);
+  const dL = a.l - b.l;
+  const dA = aA - bA;
+  const dB = aB - bB;
+  return Math.sqrt(dL * dL + dA * dA + dB * dB);
+}
+function deltaEOkHex(a, b) {
+  return deltaEOk(hexToOklch(a), hexToOklch(b));
+}
+
+// src/color/gamut.ts
+function oklchToHex(colour, options = {}) {
+  const gamut = options.gamut ?? "srgb";
+  return formatHex(oklchToRgb(toGamut(colour, gamut)));
+}
+function toGamut(colour, gamut = "srgb") {
+  const fits = gamut === "p3" ? inP3Gamut : inSrgbGamut;
+  if (colour.l <= 0) return { l: 0, c: 0, h: colour.h };
+  if (colour.l >= 1) return { l: 1, c: 0, h: colour.h };
+  if (fits(colour)) return colour;
+  let lo = 0;
+  let hi = colour.c;
+  for (let i = 0; i < 25 && hi - lo > 1e-6; i += 1) {
+    const mid = (lo + hi) / 2;
+    if (fits({ ...colour, c: mid })) lo = mid;
+    else hi = mid;
+  }
+  return { ...colour, c: lo };
+}
+
+// src/color/ramp.ts
+var RAMP_STEPS = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+var LIGHTNESS_CURVE = Object.freeze({
+  50: 0.971,
+  100: 0.936,
+  200: 0.885,
+  300: 0.828,
+  400: 0.746,
+  500: 0.658,
+  600: 0.586,
+  700: 0.51,
+  800: 0.432,
+  900: 0.352,
+  950: 0.253
+});
+function chromaEnvelope(lightness) {
+  return 4 * lightness * (1 - lightness);
+}
+function warpLightness(curveValue, anchorCurve, anchorActual) {
+  if (anchorCurve <= 0 || anchorCurve >= 1) return curveValue;
+  if (anchorActual <= 0 || anchorActual >= 1) return curveValue;
+  return curveValue >= anchorCurve ? anchorActual + (curveValue - anchorCurve) * (1 - anchorActual) / (1 - anchorCurve) : anchorActual * curveValue / anchorCurve;
+}
+function nearestStep(lightness) {
+  let best = RAMP_STEPS[0];
+  let bestDistance = Infinity;
+  for (const step of RAMP_STEPS) {
+    const distance = Math.abs(LIGHTNESS_CURVE[step] - lightness);
+    if (distance < bestDistance) {
+      bestDistance = distance;
+      best = step;
+    }
+  }
+  return best;
+}
+function ramp(seed, options = {}) {
+  const seedOklch = hexToOklch(seed);
+  const anchor = options.step ?? nearestStep(seedOklch.l);
+  const gamut = options.gamut ?? "srgb";
+  const anchorEnvelope = chromaEnvelope(seedOklch.l);
+  const out = {};
+  for (const step of RAMP_STEPS) {
+    if (step === anchor) {
+      out[step] = seed;
+      continue;
+    }
+    const lightness = warpLightness(LIGHTNESS_CURVE[step], LIGHTNESS_CURVE[anchor], seedOklch.l);
+    const scale = anchorEnvelope === 0 ? 0 : chromaEnvelope(lightness) / anchorEnvelope;
+    out[step] = formatHex(
+      oklchToRgb(toGamut({ l: lightness, c: seedOklch.c * scale, h: seedOklch.h }, gamut))
+    );
+  }
+  return { ramp: out, anchor, seed: seedOklch };
+}
+function hueDelta(from, to) {
+  return (to - from + 540) % 360 - 180;
+}
+function rampFromAnchors(anchors, options = {}) {
+  const gamut = options.gamut ?? "srgb";
+  const given = RAMP_STEPS.filter((step) => typeof anchors[step] === "string");
+  if (given.length === 0) {
+    throw new Error("craft: rampFromAnchors needs at least one anchor");
+  }
+  const parsed = /* @__PURE__ */ new Map();
+  for (const step of given) parsed.set(step, hexToOklch(anchors[step]));
+  const out = {};
+  for (const step of RAMP_STEPS) {
+    const supplied = anchors[step];
+    if (typeof supplied === "string") {
+      out[step] = supplied;
+      continue;
+    }
+    const below = [...given].reverse().find((s) => s < step);
+    const above = given.find((s) => s > step);
+    let colour;
+    if (below !== void 0 && above !== void 0) {
+      const lo = parsed.get(below);
+      const hi = parsed.get(above);
+      const span = LIGHTNESS_CURVE[below] - LIGHTNESS_CURVE[above];
+      const t = span === 0 ? 0.5 : (LIGHTNESS_CURVE[below] - LIGHTNESS_CURVE[step]) / span;
+      colour = {
+        // Between two anchors, lightness runs between what those anchors
+        // actually are, not what the curve wishes they were. Anchors are the
+        // shipped truth; the curve only sets spacing.
+        l: lo.l + (hi.l - lo.l) * t,
+        c: lo.c + (hi.c - lo.c) * t,
+        h: ((lo.h + hueDelta(lo.h, hi.h) * t) % 360 + 360) % 360
+      };
+    } else {
+      const nearest = below ?? above;
+      const base = parsed.get(nearest);
+      const lightness = warpLightness(
+        LIGHTNESS_CURVE[step],
+        LIGHTNESS_CURVE[nearest],
+        base.l
+      );
+      const baseEnvelope = chromaEnvelope(base.l);
+      const scale = baseEnvelope === 0 ? 0 : chromaEnvelope(lightness) / baseEnvelope;
+      colour = { l: lightness, c: base.c * scale, h: base.h };
+    }
+    out[step] = formatHex(oklchToRgb(toGamut(colour, gamut)));
+  }
+  return out;
+}
+
+// src/color/contrast.ts
+function relativeLuminance(hex) {
+  const { r, g, b } = parseHex(hex);
+  const channel = (c) => c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  return 0.2126 * channel(r) + 0.7152 * channel(g) + 0.0722 * channel(b);
+}
+function wcagContrast(a, b) {
+  const la = relativeLuminance(a);
+  const lb = relativeLuminance(b);
+  const lighter = Math.max(la, lb);
+  const darker = Math.min(la, lb);
+  return (lighter + 0.05) / (darker + 0.05);
+}
+var APCA = {
+  mainTRC: 2.4,
+  Rco: 0.2126729,
+  Gco: 0.7151522,
+  Bco: 0.072175,
+  normBG: 0.56,
+  normTXT: 0.57,
+  revTXT: 0.62,
+  revBG: 0.65,
+  blkThrs: 0.022,
+  blkClmp: 1.414,
+  scaleBoW: 1.14,
+  scaleWoB: 1.14,
+  loBoWoffset: 0.027,
+  loWoBoffset: 0.027,
+  deltaYmin: 5e-4,
+  loClip: 0.1
+};
+function apcaLuminance(hex) {
+  const { r, g, b } = parseHex(hex);
+  return APCA.Rco * Math.pow(r, APCA.mainTRC) + APCA.Gco * Math.pow(g, APCA.mainTRC) + APCA.Bco * Math.pow(b, APCA.mainTRC);
+}
+function softClamp(y) {
+  return y < APCA.blkThrs ? y + Math.pow(APCA.blkThrs - y, APCA.blkClmp) : y;
+}
+function apcaContrast(text, background) {
+  const yTxt = softClamp(apcaLuminance(text));
+  const yBg = softClamp(apcaLuminance(background));
+  if (Math.abs(yBg - yTxt) < APCA.deltaYmin) return 0;
+  let output;
+  if (yBg > yTxt) {
+    const sapc = (Math.pow(yBg, APCA.normBG) - Math.pow(yTxt, APCA.normTXT)) * APCA.scaleBoW;
+    output = sapc < APCA.loClip ? 0 : sapc - APCA.loBoWoffset;
+  } else {
+    const sapc = (Math.pow(yBg, APCA.revBG) - Math.pow(yTxt, APCA.revTXT)) * APCA.scaleWoB;
+    output = sapc > -APCA.loClip ? 0 : sapc + APCA.loWoBoffset;
+  }
+  return output * 100;
+}
+function checkPair(text, background) {
+  const wcag = wcagContrast(text, background);
+  const lc = apcaContrast(text, background);
+  return {
+    text,
+    background,
+    wcag,
+    lc,
+    passesAA: wcag >= 4.5,
+    passesAALarge: wcag >= 3,
+    passesLc60: Math.abs(lc) >= 60,
+    note: `${text} on ${background}: ${wcag.toFixed(2)}:1, Lc ${lc.toFixed(1)}`
+  };
+}
+
+// src/color/semantic.ts
+function accentFork(rampSteps, on, options = {}) {
+  const minWcag = options.minWcag ?? 4.5;
+  const minLc = options.minLc ?? 60;
+  if (on.length === 0) throw new Error("craft: accentFork needs at least one background");
+  const meanBackgroundLuminance = on.reduce((sum, bg) => sum + checkPair("#ffffff", bg).wcag, 0) / on.length;
+  const darkBackgrounds = meanBackgroundLuminance > 4.5;
+  const order = darkBackgrounds ? [...RAMP_STEPS].reverse() : [...RAMP_STEPS];
+  let best = null;
+  for (const step of order) {
+    const hex = rampSteps[step];
+    const checks = on.map((bg) => checkPair(hex, bg));
+    const clears = checks.every((c) => c.wcag >= minWcag && Math.abs(c.lc) >= minLc);
+    if (clears) {
+      return {
+        hex,
+        step,
+        checks,
+        note: checks.map((c) => c.note).join("; "),
+        degraded: false
+      };
+    }
+    const margin = Math.min(
+      ...checks.map((c) => Math.min(c.wcag / minWcag, Math.abs(c.lc) / minLc))
+    );
+    if (best === null || margin > best.margin) best = { step, checks, margin };
+  }
+  const fallback = best;
+  return {
+    hex: rampSteps[fallback.step],
+    step: fallback.step,
+    checks: fallback.checks,
+    note: `NO STEP CLEARS ${minWcag}:1 + Lc ${minLc} \u2014 closest: ${fallback.checks.map((c) => c.note).join("; ")}`,
+    degraded: true
+  };
+}
+function semantic(input) {
+  const accentRamp = typeof input.accent === "string" ? ramp(input.accent).ramp : rampFromAnchors(input.accent);
+  const surfaces = [input.bgCanvas, input.bgSurface, input.bgElevated];
+  const fork = accentFork(accentRamp, surfaces);
+  const bgBase = input.bgBase ?? input.bgCanvas;
+  const tokens = {
+    "--craft-bg-canvas": input.bgCanvas,
+    "--craft-bg-base": bgBase,
+    "--craft-bg-surface": input.bgSurface,
+    "--craft-bg-elevated": input.bgElevated,
+    "--craft-text-primary": input.textPrimary,
+    "--craft-text-secondary": input.textSecondary,
+    "--craft-text-muted": input.textMuted,
+    "--craft-text-on-accent": accentRamp[50],
+    "--craft-border-subtle": input.borderSubtle,
+    "--craft-border-strong": input.borderStrong,
+    "--craft-accent": accentRamp[500],
+    "--craft-accent-hover": accentRamp[600],
+    "--craft-accent-soft": accentRamp[900],
+    "--craft-accent-text": fork.hex,
+    "--craft-action-primary": accentRamp[500],
+    "--craft-action-primary-hover": accentRamp[600],
+    "--craft-focus-ring": fork.hex,
+    "--craft-success": input.success,
+    "--craft-warning": input.warning,
+    "--craft-danger": input.danger,
+    "--craft-info": input.info,
+    "--craft-text-on-warning": checkPair("#111111", input.warning).wcag >= 4.5 ? "#111111" : "#ffffff"
+  };
+  const notes = {
+    "--craft-accent-text": `${fork.note} (ramp step ${fork.step})`,
+    "--craft-focus-ring": `derived from accent step ${fork.step}`,
+    "--craft-text-on-warning": checkPair(
+      tokens["--craft-text-on-warning"],
+      input.warning
+    ).note
+  };
+  for (const [name, value] of Object.entries(input.overrides ?? {})) {
+    tokens[name] = value;
+    notes[name] = "override: supplied verbatim, not derived";
+  }
+  const textTokens = ["--craft-text-primary", "--craft-text-secondary", "--craft-text-muted"];
+  const checks = [];
+  for (const name of textTokens) {
+    const value = tokens[name];
+    if (!value.startsWith("#")) continue;
+    for (const surface of surfaces) {
+      if (!surface.startsWith("#")) continue;
+      checks.push(checkPair(value, surface));
+    }
+  }
+  checks.push(...fork.checks);
+  return {
+    tokens,
+    notes,
+    accentRamp,
+    report: {
+      checks,
+      failures: checks.filter((c) => !c.passesAA || !c.passesLc60),
+      accent: fork
+    }
+  };
+}
+
+// src/motion/tokens.ts
+var EASE = {
+  /** Entrances and anything arriving. Decelerates hard into place. */
+  out: "cubic-bezier(0.23, 1, 0.32, 1)",
+  /** Moves that start and end on screen: a panel resizing, a value morphing. */
+  inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+  /** Drawers and sheets — a longer settle than a dropdown wants. */
+  drawer: "cubic-bezier(0.32, 0.72, 0, 1)",
+  /** Scroll-triggered reveals. Gentler than `out`, which snaps at this length. */
+  reveal: "cubic-bezier(0.22, 0.61, 0.36, 1)"
+};
+var EASE_TUPLE = Object.freeze({
+  out: [0.23, 1, 0.32, 1],
+  inOut: [0.77, 0, 0.175, 1],
+  drawer: [0.32, 0.72, 0, 1],
+  reveal: [0.22, 0.61, 0.36, 1]
+});
+var DURATION_MS = {
+  press: 120,
+  tooltip: 150,
+  dropdown: 200,
+  modal: 300,
+  drawer: 400,
+  reveal: 500,
+  stagger: 60
+};
+var DURATION_S = Object.freeze(
+  Object.fromEntries(
+    Object.entries(DURATION_MS).map(([name, ms]) => [name, ms / 1e3])
+  )
+);
+var SPRING = Object.freeze({ damping: 0.5, stiffness: 0.2 });
+var SCALE = Object.freeze({ press: 0.97, enter: 0.95 });
+var EXIT_RATIO = 0.75;
+function exitDuration(enterMs) {
+  return Math.round(enterMs * EXIT_RATIO);
+}
+
+// src/motion/decide.ts
+var DEFAULT_MS = {
+  entrance: 200,
+  exit: 150,
+  state: 120,
+  reveal: 500,
+  signature: 700
+};
+function shouldAnimate(input) {
+  const base = input.enterMs ?? DEFAULT_MS[input.kind];
+  if (input.trigger === "keyboard") {
+    return {
+      animate: false,
+      durationMs: 0,
+      reason: "keyboard-triggered: someone navigating by keyboard is moving faster than the animation"
+    };
+  }
+  if (input.usesPerDay >= 100) {
+    return {
+      animate: false,
+      durationMs: 0,
+      reason: `${input.usesPerDay} uses/day: at this frequency motion reads as latency, not polish`
+    };
+  }
+  if (input.kind === "exit") {
+    return {
+      animate: true,
+      durationMs: Math.round(base * 0.75),
+      reason: "exit runs at 0.75x the entrance \u2014 leaving content lingering reads as lag"
+    };
+  }
+  if (input.kind === "signature") {
+    return {
+      animate: true,
+      durationMs: base,
+      reason: "signature moment: allowed once per page, must be gated and must never be the LCP element"
+    };
+  }
+  return { animate: true, durationMs: base, reason: `${input.kind} at ${base}ms` };
+}
+
+// src/type/scale.ts
+var TYPE_STEPS = [-2, -1, 0, 1, 2, 3, 4, 5];
+var round = (n) => Math.round(n * 1e4) / 1e4;
+function fluidClamp(minPx, maxPx, minViewport, maxViewport, rootPx = 16) {
+  const minRem = round(minPx / rootPx);
+  const maxRem = round(maxPx / rootPx);
+  if (maxViewport === minViewport) return `${minRem}rem`;
+  const slope = (maxPx - minPx) / (maxViewport - minViewport);
+  const interceptRem = round((minPx - slope * minViewport) / rootPx);
+  const slopeVw = round(slope * 100);
+  const preferred = interceptRem === 0 ? `${slopeVw}vw` : `${interceptRem}rem + ${slopeVw}vw`;
+  const lower = Math.min(minRem, maxRem);
+  const upper = Math.max(minRem, maxRem);
+  return `clamp(${lower}rem, ${preferred}, ${upper}rem)`;
+}
+function fluidType(options = {}) {
+  const {
+    minViewport = 360,
+    maxViewport = 1280,
+    minBase = 16,
+    maxBase = 18,
+    minRatio = 1.2,
+    maxRatio = 1.25,
+    pin = {},
+    rootPx = 16
+  } = options;
+  const tokens = {};
+  const pinned = [];
+  for (const step of TYPE_STEPS) {
+    const name = `--craft-step-${step < 0 ? `-${Math.abs(step)}` : step}`;
+    const literal = pin[step];
+    if (typeof literal === "string") {
+      tokens[name] = literal;
+      pinned.push(step);
+      continue;
+    }
+    tokens[name] = fluidClamp(
+      minBase * Math.pow(minRatio, step),
+      maxBase * Math.pow(maxRatio, step),
+      minViewport,
+      maxViewport,
+      rootPx
+    );
+  }
+  return { tokens, pinned };
+}
+
+// src/space/scale.ts
+var SPACE_STEPS = {
+  "3xs": 0.25,
+  "2xs": 0.5,
+  xs: 0.75,
+  s: 1,
+  m: 1.5,
+  l: 2,
+  xl: 3,
+  "2xl": 4,
+  "3xl": 6
+};
+var ORDER = Object.keys(SPACE_STEPS);
+function fluidSpace(options = {}) {
+  const {
+    minViewport = 360,
+    maxViewport = 1280,
+    minBase = 16,
+    maxBase = 20,
+    rootPx = 16,
+    pin = {}
+  } = options;
+  const tokens = {};
+  for (const step of ORDER) {
+    const name = `--craft-space-${step}`;
+    tokens[name] = pin[step] ?? fluidClamp(
+      minBase * SPACE_STEPS[step],
+      maxBase * SPACE_STEPS[step],
+      minViewport,
+      maxViewport,
+      rootPx
+    );
+  }
+  for (let i = 0; i < ORDER.length - 1; i += 1) {
+    const from = ORDER[i];
+    const to = ORDER[i + 1];
+    const name = `--craft-space-${from}-${to}`;
+    tokens[name] = pin[`${from}-${to}`] ?? fluidClamp(
+      minBase * SPACE_STEPS[from],
+      maxBase * SPACE_STEPS[to],
+      minViewport,
+      maxViewport,
+      rootPx
+    );
+  }
+  return tokens;
+}
+function sectionRhythm(options = {}) {
+  const { minViewport = 360, maxViewport = 1280, rootPx = 16 } = options;
+  const defaults = {
+    sm: { min: 40, max: 64 },
+    md: { min: 56, max: 96 },
+    // Matches the `clamp(5rem, 10vw, 9rem)` a client site arrived at by hand.
+    lg: { min: 80, max: 144 }
+  };
+  const tokens = {};
+  for (const size of ["sm", "md", "lg"]) {
+    const supplied = options[size];
+    if (typeof supplied === "string") {
+      tokens[`--craft-section-${size}`] = supplied;
+      continue;
+    }
+    const { min, max } = supplied ?? defaults[size];
+    tokens[`--craft-section-${size}`] = fluidClamp(min, max, minViewport, maxViewport, rootPx);
+  }
+  return tokens;
+}
+
+// src/type/features.ts
+var HOUSE_TYPE = {
+  /**
+   * Letter-spacing. Display type is set tighter because tracking that reads as
+   * neutral at 16px reads as loose at 48px; buttons and eyebrows go the other
+   * way, because short all-caps strings need air to stay countable.
+   */
+  tracking: {
+    display: "-0.01em",
+    heading: "-0.005em",
+    body: "0em",
+    button: "0.12em",
+    eyebrow: "0.24em"
+  },
+  /** Line height. Tighter as type gets larger, since the eye tracks a shorter return. */
+  leading: {
+    display: "1.05",
+    heading: "1.1",
+    subheading: "1.3",
+    body: "1.6"
+  },
+  /**
+   * Measure, in `ch`. Below ~45 the eye returns too often; above ~75 it loses
+   * the line on the way back.
+   */
+  measure: {
+    narrow: "45ch",
+    body: "65ch",
+    wide: "75ch"
+  }
+};
+function typeFeatureTokens() {
+  const tokens = {};
+  for (const [name, value] of Object.entries(HOUSE_TYPE.tracking)) {
+    tokens[`--craft-tracking-${name}`] = value;
+  }
+  for (const [name, value] of Object.entries(HOUSE_TYPE.leading)) {
+    tokens[`--craft-leading-${name}`] = value;
+  }
+  for (const [name, value] of Object.entries(HOUSE_TYPE.measure)) {
+    tokens[`--craft-measure-${name}`] = value;
+  }
+  return tokens;
+}
+
+// src/css/emit.ts
+function emitCss(tokens, options = {}) {
+  const selector = options.selector ?? ":root";
+  const indent = options.indent ?? "  ";
+  const notes = options.notes ?? {};
+  const lines = Object.entries(tokens).map(([name, value]) => {
+    const note = notes[name];
+    return `${indent}${name}: ${value};${note ? ` /* ${note} */` : ""}`;
+  });
+  return `${selector} {
+${lines.join("\n")}
+}
+`;
+}
+function motionTokens() {
+  const tokens = {};
+  for (const [name, value] of Object.entries(EASE)) {
+    tokens[`--craft-ease-${kebab(name)}`] = value;
+  }
+  for (const [name, ms] of Object.entries(DURATION_MS)) {
+    tokens[`--craft-duration-${kebab(name)}`] = `${ms}ms`;
+  }
+  tokens["--craft-exit-ratio"] = String(EXIT_RATIO);
+  tokens["--craft-scale-press"] = String(SCALE.press);
+  tokens["--craft-scale-enter"] = String(SCALE.enter);
+  tokens["--craft-spring-damping"] = String(SPRING.damping);
+  tokens["--craft-spring-stiffness"] = String(SPRING.stiffness);
+  return tokens;
+}
+function kebab(name) {
+  return name.replace(/[A-Z]/g, (ch) => `-${ch.toLowerCase()}`);
+}
+function craftTokens(input) {
+  const derived = semantic(input);
+  const tokens = {
+    ...derived.tokens,
+    ...motionTokens(),
+    ...fluidType(input.type).tokens,
+    ...typeFeatureTokens(),
+    ...fluidSpace(input.space),
+    ...sectionRhythm(input.section)
+  };
+  const header = [
+    "/* Generated by @domandigital/craft. Do not edit by hand.",
+    " * Anchors are supplied by the consuming repo; every other value is derived,",
+    " * and every contrast-sensitive pair carries its measured ratio as a comment.",
+    " */"
+  ].join("\n");
+  return {
+    css: `${header}
+${emitCss(tokens, {
+      selector: input.selector ?? ":root",
+      notes: derived.notes
+    })}`,
+    tokens,
+    report: derived.report,
+    ramps: { accent: derived.accentRamp }
+  };
+}
+
+// src/density/index.ts
+var DENSITIES = {
+  compact: { rowPx: 32, padXPx: 8, padYPx: 4, fontPx: 13 },
+  comfortable: { rowPx: 40, padXPx: 12, padYPx: 8, fontPx: 14 },
+  spacious: { rowPx: 48, padXPx: 16, padYPx: 12, fontPx: 15 }
+};
+function densityCss(options = {}) {
+  const { base = "comfortable", rootPx = 16 } = options;
+  const declare = (name, indent = "  ") => {
+    const d = DENSITIES[name];
+    return [
+      `${indent}--craft-density-row: ${d.rowPx / rootPx}rem;`,
+      `${indent}--craft-density-pad-x: ${d.padXPx / rootPx}rem;`,
+      `${indent}--craft-density-pad-y: ${d.padYPx / rootPx}rem;`,
+      `${indent}--craft-density-font: ${d.fontPx / rootPx}rem;`
+    ].join("\n");
+  };
+  const blocks = [`:root {
+${declare(base)}
+}`];
+  for (const name of Object.keys(DENSITIES)) {
+    blocks.push(`[data-density="${name}"] {
+${declare(name)}
+}`);
+  }
+  return `${blocks.join("\n\n")}
+`;
+}
+function densityTokens(name, rootPx = 16) {
+  const d = DENSITIES[name];
+  return {
+    "--craft-density-row": `${d.rowPx / rootPx}rem`,
+    "--craft-density-pad-x": `${d.padXPx / rootPx}rem`,
+    "--craft-density-pad-y": `${d.padYPx / rootPx}rem`,
+    "--craft-density-font": `${d.fontPx / rootPx}rem`
+  };
+}
+
+// src/restraint/index.ts
+var HOUSE_BUDGET = {
+  maxFontSizes: 10,
+  maxFontWeights: 3,
+  maxFontFamilies: 2,
+  maxRadii: 4,
+  maxShadows: 4,
+  accentHueClusterDeg: 15,
+  maxUiDurationMs: 300
+};
+function stripComments(css) {
+  return css.replace(/\/\*[\s\S]*?\*\//g, "");
+}
+function distinctValues(css, property) {
+  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);
+  }
+  return [...seen];
+}
+function durationsMs(css) {
+  const out = [];
+  for (const match of css.matchAll(/([\d.]+)(ms|s)\b/g)) {
+    const n = Number(match[1]);
+    if (!Number.isFinite(n)) continue;
+    out.push({ value: match[0], ms: match[2] === "s" ? n * 1e3 : n });
+  }
+  return out;
+}
+function checkRestraint(input) {
+  const budget = { ...HOUSE_BUDGET, ...input.budget };
+  const css = stripComments(input.css);
+  const violations = [];
+  const push = (rule, severity, message, found) => {
+    violations.push({ rule, severity, message, found });
+  };
+  const fontSizes = distinctValues(css, "font-size");
+  if (fontSizes.length > budget.maxFontSizes) {
+    push(
+      "font-sizes",
+      "error",
+      `${fontSizes.length} distinct font sizes, budget ${budget.maxFontSizes}. A type scale stops being a scale once nobody can name its steps.`,
+      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 allWeights = [.../* @__PURE__ */ new Set([...weights, ...namedWeights])];
+  if (allWeights.length > budget.maxFontWeights) {
+    push(
+      "font-weights",
+      "error",
+      `${allWeights.length} font weights, budget ${budget.maxFontWeights}.`,
+      allWeights
+    );
+  }
+  const families = distinctValues(css, "font-family").filter(
+    (f) => !/\bmonospace\b|\bmono\b/.test(f)
+  );
+  if (families.length > budget.maxFontFamilies) {
+    push(
+      "font-families",
+      "error",
+      `${families.length} non-mono font families, budget ${budget.maxFontFamilies}.`,
+      families
+    );
+  }
+  const radii = distinctValues(css, "border-radius").filter((r) => r !== "0" && r !== "0px");
+  if (radii.length > budget.maxRadii) {
+    push("radii", "error", `${radii.length} corner radii, budget ${budget.maxRadii}.`, radii);
+  }
+  const shadows = distinctValues(css, "box-shadow").filter((s) => s !== "none");
+  if (shadows.length > budget.maxShadows) {
+    push(
+      "shadows",
+      "error",
+      `${shadows.length} shadows, budget ${budget.maxShadows}. More than four elevations means no elevation reads as meaningful.`,
+      shadows
+    );
+  }
+  const accentHexes = [
+    ...css.matchAll(/--[a-z0-9-]*accent[a-z0-9-]*\s*:\s*(#[0-9a-fA-F]{3,8})/g)
+  ].map((m) => m[1]);
+  if (accentHexes.length > 1) {
+    const hues = accentHexes.map((hex) => {
+      try {
+        const { c, h } = hexToOklch(hex);
+        return c > 0.02 ? h : null;
+      } catch {
+        return null;
+      }
+    }).filter((h) => h !== null);
+    if (hues.length > 1) {
+      const spread = hueSpread(hues);
+      if (spread > budget.accentHueClusterDeg) {
+        push(
+          "accent-hues",
+          "error",
+          `Accent hues span ${spread.toFixed(1)}deg, budget ${budget.accentHueClusterDeg}deg. Two accents is two brands.`,
+          accentHexes
+        );
+      }
+    }
+  }
+  if (/transition\s*:\s*all\b/i.test(css)) {
+    push(
+      "transition-all",
+      "error",
+      "`transition: all` animates properties you did not choose, including layout ones that cannot be composited.",
+      ["transition: all"]
+    );
+  }
+  const easeIn = [
+    ...css.matchAll(/(?:transition|animation)[^;}]*\b(ease-in)\b(?!-out)/gi),
+    ...css.matchAll(/cubic-bezier\(\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;
+  }).filter((v) => v !== null);
+  if (easeIn.length > 0) {
+    push(
+      "ease-in",
+      "error",
+      "An ease-in curve accelerates away from the user. Exits use a decelerating curve, faster.",
+      [...new Set(easeIn)]
+    );
+  }
+  const overBudget = durationsMs(css).filter((d) => d.ms > budget.maxUiDurationMs);
+  if (overBudget.length > 0) {
+    push(
+      "duration",
+      "warning",
+      `${overBudget.length} duration(s) over ${budget.maxUiDurationMs}ms. Allowed for drawers and one gated reveal; not for UI state.`,
+      [...new Set(overBudget.map((d) => d.value))]
+    );
+  }
+  if (/scale\(\s*0\s*\)|scale3d\(\s*0\s*,\s*0/i.test(css)) {
+    push(
+      "scale-zero",
+      "error",
+      "Entering from `scale(0)` collapses the element to a point, so its text reflows during the animation.",
+      ["scale(0)"]
+    );
+  }
+  const reducedMotionAt = css.search(/@media[^{]*prefers-reduced-motion:\s*reduce/i);
+  if (reducedMotionAt === -1) {
+    if (/@keyframes|animation\s*:|transition\s*:/.test(css)) {
+      push(
+        "reduced-motion-missing",
+        "error",
+        "Motion is defined but no `prefers-reduced-motion: reduce` block exists.",
+        []
+      );
+    }
+  } else {
+    const block = css.slice(reducedMotionAt);
+    if (/animation\s*:\s*none/i.test(block)) {
+      push(
+        "reduced-motion-animation-none",
+        "error",
+        "`animation: none` under reduced motion drops the `forwards` fill, stranding a forwards-filled entrance at opacity 0 for exactly the users who asked for less motion. Collapse the duration instead.",
+        ["animation: none"]
+      );
+    }
+  }
+  const markup = input.markup ?? "";
+  if (markup.length > 0) {
+    const hasNumericCells = /data-numeric|craft-numeric/.test(markup);
+    const declaresTabular = /tabular-nums/.test(css) || /tabular-nums/.test(markup);
+    if (hasNumericCells && !declaresTabular) {
+      push(
+        "tabular-nums",
+        "error",
+        "Numeric cells are marked but nothing sets `tabular-nums`. Proportional figures in a column do not line up.",
+        []
+      );
+    }
+  }
+  return {
+    ok: violations.every((v) => v.severity !== "error"),
+    violations,
+    counts: {
+      fontSizes: fontSizes.length,
+      fontWeights: allWeights.length,
+      fontFamilies: families.length,
+      radii: radii.length,
+      shadows: shadows.length,
+      accentHexes: accentHexes.length
+    }
+  };
+}
+function hueSpread(hues) {
+  const sorted = [...hues].sort((a, b) => a - b);
+  let widestGap = 0;
+  for (let i = 0; i < sorted.length; i += 1) {
+    const next = sorted[(i + 1) % sorted.length];
+    const gap = i === sorted.length - 1 ? next + 360 - sorted[i] : next - sorted[i];
+    widestGap = Math.max(widestGap, gap);
+  }
+  return 360 - widestGap;
+}
+
+// src/css/tailwind.ts
+function stepName(step) {
+  return step < 0 ? `-${Math.abs(step)}` : String(step);
+}
+function tailwindV3Preset() {
+  const fontSize = {};
+  for (const step of TYPE_STEPS) {
+    fontSize[`step-${stepName(step)}`] = `var(--craft-step-${stepName(step)})`;
+  }
+  const spacing = {};
+  for (const step of Object.keys(SPACE_STEPS)) {
+    spacing[step] = `var(--craft-space-${step})`;
+  }
+  for (const size of ["sm", "md", "lg"]) {
+    spacing[`section-${size}`] = `var(--craft-section-${size})`;
+  }
+  const transitionTimingFunction = {};
+  for (const name of Object.keys(EASE)) {
+    const kebab2 = name.replace(/[A-Z]/g, (ch) => `-${ch.toLowerCase()}`);
+    transitionTimingFunction[kebab2] = `var(--craft-ease-${kebab2})`;
+  }
+  const transitionDuration = {};
+  for (const name of Object.keys(DURATION_MS)) {
+    transitionDuration[name] = `var(--craft-duration-${name})`;
+  }
+  const colors = {};
+  for (const token of [
+    "bg-canvas",
+    "bg-base",
+    "bg-surface",
+    "bg-elevated",
+    "text-primary",
+    "text-secondary",
+    "text-muted",
+    "text-on-accent",
+    "border-subtle",
+    "border-strong",
+    "accent",
+    "accent-hover",
+    "accent-soft",
+    "accent-text",
+    "success",
+    "warning",
+    "danger",
+    "info"
+  ]) {
+    colors[token] = `var(--craft-${token})`;
+  }
+  const letterSpacing = {};
+  for (const name of Object.keys(HOUSE_TYPE.tracking)) {
+    letterSpacing[name] = `var(--craft-tracking-${name})`;
+  }
+  const lineHeight = {};
+  for (const name of Object.keys(HOUSE_TYPE.leading)) {
+    lineHeight[name] = `var(--craft-leading-${name})`;
+  }
+  const maxWidth = {};
+  for (const name of Object.keys(HOUSE_TYPE.measure)) {
+    maxWidth[`measure-${name}`] = `var(--craft-measure-${name})`;
+  }
+  const minHeight = { row: "var(--craft-density-row)" };
+  return {
+    theme: {
+      extend: {
+        colors,
+        fontSize,
+        spacing,
+        letterSpacing,
+        lineHeight,
+        maxWidth,
+        minHeight,
+        transitionTimingFunction,
+        transitionDuration
+      }
+    }
+  };
+}
+function tailwindV4Theme() {
+  const lines = ["@theme inline {"];
+  const add = (name, value) => {
+    lines.push(`  ${name}: ${value};`);
+  };
+  for (const token of [
+    "bg-canvas",
+    "bg-base",
+    "bg-surface",
+    "bg-elevated",
+    "text-primary",
+    "text-secondary",
+    "text-muted",
+    "text-on-accent",
+    "border-subtle",
+    "border-strong",
+    "accent",
+    "accent-hover",
+    "accent-soft",
+    "accent-text",
+    "success",
+    "warning",
+    "danger",
+    "info"
+  ]) {
+    add(`--color-${token}`, `var(--craft-${token})`);
+  }
+  for (const step of TYPE_STEPS) {
+    add(`--text-step-${stepName(step)}`, `var(--craft-step-${stepName(step)})`);
+  }
+  for (const step of Object.keys(SPACE_STEPS)) {
+    add(`--spacing-${step}`, `var(--craft-space-${step})`);
+  }
+  for (const size of ["sm", "md", "lg"]) {
+    add(`--spacing-section-${size}`, `var(--craft-section-${size})`);
+  }
+  for (const name of Object.keys(EASE)) {
+    const kebab2 = name.replace(/[A-Z]/g, (ch) => `-${ch.toLowerCase()}`);
+    add(`--ease-${kebab2}`, `var(--craft-ease-${kebab2})`);
+  }
+  for (const name of Object.keys(DURATION_MS)) {
+    add(`--duration-${name}`, `var(--craft-duration-${name})`);
+  }
+  for (const name of Object.keys(HOUSE_TYPE.tracking)) {
+    add(`--tracking-${name}`, `var(--craft-tracking-${name})`);
+  }
+  for (const name of Object.keys(HOUSE_TYPE.leading)) {
+    add(`--leading-${name}`, `var(--craft-leading-${name})`);
+  }
+  lines.push("}");
+  return `${lines.join("\n")}
+`;
+}
+var DENSITY_NAMES = Object.keys(DENSITIES);
+export {
+  DENSITIES,
+  DENSITY_NAMES,
+  DURATION_MS,
+  DURATION_S,
+  EASE,
+  EASE_TUPLE,
+  EXIT_RATIO,
+  HOUSE_BUDGET,
+  HOUSE_TYPE,
+  LIGHTNESS_CURVE,
+  RAMP_STEPS,
+  SCALE,
+  SPACE_STEPS,
+  SPRING,
+  TYPE_STEPS,
+  accentFork,
+  apcaContrast,
+  checkPair,
+  checkRestraint,
+  craftTokens,
+  deltaEOk,
+  deltaEOkHex,
+  densityCss,
+  densityTokens,
+  emitCss,
+  exitDuration,
+  fluidClamp,
+  fluidSpace,
+  fluidType,
+  formatHex,
+  hexToOklch,
+  inP3Gamut,
+  inSrgbGamut,
+  motionTokens,
+  oklchToHex,
+  oklchToRgb,
+  parseHex,
+  ramp,
+  rampFromAnchors,
+  sectionRhythm,
+  semantic,
+  shouldAnimate,
+  tailwindV3Preset,
+  tailwindV4Theme,
+  toGamut,
+  typeFeatureTokens,
+  wcagContrast
+};