@cortex-js/compute-engine 0.55.6 → 0.57.0

package/dist/compute-engine.esm.js

@@ -1,4 +1,4 @@
-/** Compute Engine 0.55.6 */
+/** Compute Engine 0.57.0 */
 
 // node_modules/complex-esm/dist/src/complex.js
 var cosh = Math.cosh || function(x) {
@@ -2240,6 +2240,7 @@ var SCALAR_TYPES = [
 ];
 var VALUE_TYPES = [
   "value",
+  "color",
   ...COLLECTION_TYPES,
   ...SCALAR_TYPES
 ];
@@ -3939,6 +3940,7 @@ var PRIMITIVE_SUBTYPES = {
   symbol: [],
   boolean: [],
   string: [],
+  color: [],
   expression: EXPRESSION_TYPES
 };
 function isPrimitiveSubtype(lhs, rhs) {
@@ -7822,9 +7824,10 @@ var _BoxedExpression = class __BoxedExpression {
       if (!materialized.isLazyCollection) return materialized.latex;
     }
     const syntax = this.engine._requireLatexSyntax();
-    return syntax.serialize(
-      this.toMathJson({ prettify: true, fractionalDigits: "auto" })
-    );
+    const json = this.toMathJson({ prettify: true, fractionalDigits: "auto" });
+    const latexOpts = this.engine.latexOptions;
+    if (Object.keys(latexOpts).length === 0) return syntax.serialize(json);
+    return syntax.serialize(json, { ...latexOpts });
   }
   /**
    * Return a LaTeX representation of this expression with custom
@@ -7835,8 +7838,15 @@ var _BoxedExpression = class __BoxedExpression {
    *
    * Numeric values are rounded to `ce.precision` significant digits
    * (via `fractionalDigits: 'auto'`).
+   *
+   * If `options.verbatim` is `true` and `verbatimLatex` is set on this
+   * expression (i.e. it was parsed with `preserveLatex: true`), return
+   * the verbatim source instead of re-serializing. Falls through to
+   * re-serialization if no verbatim is available.
    */
   toLatex(options) {
+    if (options?.verbatim === true && this.verbatimLatex !== void 0)
+      return this.verbatimLatex;
     if (this.isLazyCollection) {
       const materialized = this.evaluate({
         materialization: options?.materialization ?? true
@@ -7848,9 +7858,13 @@ var _BoxedExpression = class __BoxedExpression {
       fractionalDigits: "auto"
     });
     const syntax = this.engine._requireLatexSyntax();
-    if (!options || Object.keys(options).length === 0)
-      return syntax.serialize(json);
-    return syntax.serialize(json, options);
+    const latexOpts = this.engine.latexOptions;
+    const haveEngineOpts = Object.keys(latexOpts).length > 0;
+    const haveCallOpts = options && Object.keys(options).length > 0;
+    if (!haveEngineOpts && !haveCallOpts) return syntax.serialize(json);
+    if (!haveEngineOpts) return syntax.serialize(json, options);
+    if (!haveCallOpts) return syntax.serialize(json, { ...latexOpts });
+    return syntax.serialize(json, { ...latexOpts, ...options });
   }
   /** Called by `JSON.stringify()` when serializing to json.
    *
@@ -7894,11 +7908,13 @@ var _BoxedExpression = class __BoxedExpression {
           "number",
           "dictionary"
         ];
-      }
-      if (Array.isArray(options.shorthands))
+      } else if (Array.isArray(options.shorthands)) {
         defaultOptions.shorthands = options.shorthands;
+      }
       if (typeof options.metadata === "string" && options.metadata === "all" || options.metadata?.includes("all")) {
         defaultOptions.metadata = ["latex", "wikidata"];
+      } else if (Array.isArray(options.metadata)) {
+        defaultOptions.metadata = options.metadata;
       }
       if (options.fractionalDigits === "auto")
         defaultOptions.fractionalDigits = -this.engine.precision;
@@ -9973,6 +9989,64 @@ function parseQuantifier(kind) {
 }
 
 // src/compute-engine/latex-syntax/dictionary/definitions-core.ts
+var COMPONENT_ACCESS_HEADS = {
+  x: "First",
+  y: "Second",
+  z: "Third",
+  real: "Real",
+  re: "Real",
+  imag: "Imaginary",
+  im: "Imaginary",
+  count: "Length",
+  total: "Sum",
+  max: "Max",
+  min: "Min"
+};
+function memberHead(name) {
+  return COMPONENT_ACCESS_HEADS[name] ?? null;
+}
+function parseComponentAccess(parser, lhs) {
+  parser.skipVisualSpace();
+  if (parser.match("\\operatorname")) {
+    const name = parser.parseStringGroup();
+    if (name === null) return null;
+    const head = memberHead(name.trim());
+    if (head === null) return null;
+    return [head, lhs];
+  }
+  const tok = parser.peek;
+  if (typeof tok === "string" && tok.startsWith("\\")) {
+    const bare = tok.slice(1);
+    const head = memberHead(bare);
+    if (head !== null) {
+      parser.nextToken();
+      return [head, lhs];
+    }
+    return null;
+  }
+  if (typeof tok === "string" && /^[a-zA-Z]$/.test(tok)) {
+    const head = memberHead(tok);
+    if (head === null) return null;
+    parser.nextToken();
+    return [head, lhs];
+  }
+  return null;
+}
+function parseWhenRestriction(parser, lhs, close) {
+  parser.addBoundary(close);
+  parser.skipVisualSpace();
+  const cond = parser.parseExpression({ minPrec: 0 });
+  if (cond === null) {
+    parser.removeBoundary();
+    return null;
+  }
+  parser.skipVisualSpace();
+  if (!parser.matchBoundary()) {
+    parser.removeBoundary();
+    return null;
+  }
+  return ["When", lhs, cond];
+}
 function parseSequence(parser, terminator, lhs, prec, sep) {
   if (terminator && terminator.minPrec >= prec) return null;
   const result = lhs ? [lhs] : ["Nothing"];
@@ -10444,6 +10518,15 @@ var DEFINITIONS_CORE = [
     }
   },
   { name: "LatexTokens", serialize: serializeLatexTokens },
+  // Component-access postfix: expr.member  (C3)
+  // The '.' trigger is consumed before the parse function is called.
+  // Precedence 850 > 810 (At/indexing) so .x chains tightly.
+  {
+    kind: "postfix",
+    precedence: 850,
+    latexTrigger: ["."],
+    parse: parseComponentAccess
+  },
   {
     name: "At",
     kind: "postfix",
@@ -10464,6 +10547,29 @@ var DEFINITIONS_CORE = [
     latexTrigger: ["\\left", "\\lbrack"],
     parse: parseAt("\\right", "\\rbrack")
   },
+  // When-restriction: `expr\left\{cond\right\}` → `When(expr, cond)` (D3)
+  {
+    name: "When",
+    kind: "postfix",
+    precedence: 800,
+    latexTrigger: ["\\left", "\\{"],
+    parse: (parser, lhs) => parseWhenRestriction(parser, lhs, ["\\right", "\\}"]),
+    serialize: (serializer, expr2) => {
+      const e = operand(expr2, 1);
+      const cond = operand(expr2, 2);
+      if (!e || !cond) return "";
+      const clauses = operator(cond) === "And" ? operands(cond) ?? [] : [cond];
+      const inner = clauses.map((c) => `\\left\\{${serializer.serialize(c)}\\right\\}`).join("");
+      return `${serializer.serialize(e)}${inner}`;
+    }
+  },
+  // When-restriction: bare `expr\{cond\}` → `When(expr, cond)`
+  {
+    kind: "postfix",
+    precedence: 800,
+    latexTrigger: ["\\{"],
+    parse: (parser, lhs) => parseWhenRestriction(parser, lhs, ["\\}"])
+  },
   {
     kind: "postfix",
     latexTrigger: ["_"],
@@ -10546,6 +10652,29 @@ var DEFINITIONS_CORE = [
       return "";
     }
   },
+  // Additional triggers for Range: `...`, `\ldots`, and `\dots` are
+  // equivalent to `..` when used as infix operators (e.g. `[1...9]`).
+  // No `name` field here — names must be unique per the dictionary rules;
+  // the first Range entry owns the name. When there is no LHS the symbol
+  // entries near the top of the file still fire (ContinuationPlaceholder).
+  {
+    latexTrigger: [".", ".", "."],
+    kind: "infix",
+    precedence: 800,
+    parse: parseRange
+  },
+  {
+    latexTrigger: ["\\ldots"],
+    kind: "infix",
+    precedence: 800,
+    parse: parseRange
+  },
+  {
+    latexTrigger: ["\\dots"],
+    kind: "infix",
+    precedence: 800,
+    parse: parseRange
+  },
   {
     latexTrigger: [";"],
     kind: "infix",
@@ -10730,13 +10859,24 @@ var DEFINITIONS_CORE = [
       const args = operands(expr2);
       if (!args || args.length < 2) return "";
       const body = args[0];
-      const indexing = args[1];
-      if (operator(indexing) === "Element") {
-        const index = operand(indexing, 1);
-        const range2 = operand(indexing, 2);
-        if (operator(range2) === "Range") {
-          const lo = operand(range2, 1);
-          const hi = operand(range2, 2);
+      const elements = args.slice(1);
+      const allElements = elements.every((e) => operator(e) === "Element");
+      if (!allElements) {
+        return joinLatex([
+          "\\operatorname{Loop}(",
+          serializer.serialize(body),
+          ", ",
+          serializer.serialize(elements[0]),
+          ")"
+        ]);
+      }
+      if (elements.length === 1) {
+        const elem = elements[0];
+        const index = operand(elem, 1);
+        const coll = operand(elem, 2);
+        if (operator(coll) === "Range") {
+          const lo = operand(coll, 1);
+          const hi = operand(coll, 2);
           return joinLatex([
             "\\text{for }",
             serializer.serialize(index),
@@ -10748,13 +10888,27 @@ var DEFINITIONS_CORE = [
             serializer.serialize(body)
           ]);
         }
+        return joinLatex([
+          serializer.serialize(body),
+          " \\operatorname{for} ",
+          serializer.serialize(index),
+          " = ",
+          serializer.serialize(coll)
+        ]);
       }
+      const bindings = elements.map((elem) => {
+        const name = operand(elem, 1);
+        const coll = operand(elem, 2);
+        return joinLatex([
+          serializer.serialize(name),
+          " = ",
+          serializer.serialize(coll)
+        ]);
+      }).join(", ");
       return joinLatex([
-        "\\operatorname{Loop}(",
         serializer.serialize(body),
-        ", ",
-        serializer.serialize(indexing),
-        ")"
+        " \\operatorname{for} ",
+        bindings
       ]);
     }
   },
@@ -10787,6 +10941,18 @@ var DEFINITIONS_CORE = [
     precedence: 245,
     parse: (parser, until) => parseForExpression(parser, until)
   },
+  // \operatorname{for} as postfix infix (list comprehension):
+  //   `body \operatorname{for} x = L_1, y = L_2`
+  // Precedence 19 — just below comma (20) so the body is allowed to use
+  // any operator (including comma sequencing) up to the keyword, and the
+  // bindings can be comma-separated below us.
+  {
+    symbolTrigger: "for",
+    kind: "infix",
+    associativity: "none",
+    precedence: 19,
+    parse: (parser, lhs, until) => parseForComprehension(parser, lhs, until)
+  },
   // \operatorname{break}
   {
     symbolTrigger: "break",
@@ -10991,7 +11157,10 @@ var DEFINITIONS_CORE = [
       if (!sym2 || !parser.getSymbolType(sym2).matches("function")) return null;
       parser.addBoundary([")"]);
       const expr2 = parser.parseExpression(until);
-      if (!parser.matchBoundary()) return null;
+      if (!parser.matchBoundary()) {
+        parser.removeBoundary();
+        return null;
+      }
       if (!parser.match("<}>")) return null;
       return ["Derivative", lhs, expr2];
     }
@@ -11432,7 +11601,12 @@ function parseBrackets(parser, body) {
   if (isEmptySequence(body)) return ["List"];
   const h = operator(body);
   if (h === "Range" || h === "Linspace") return body;
-  if (h === "Sequence") return ["List", ...operands(body)];
+  if (h === "Sequence") {
+    const elems = operands(body);
+    const inferred = tryInferRangeFromElements(elems, parser);
+    if (inferred) return inferred;
+    return ["List", ...elems];
+  }
   if (h === "Delimiter") {
     const delim = stringValue(operand(body, 2)) ?? "...";
     if (delim === ";" || delim === ".;.") {
@@ -11445,12 +11619,37 @@ function parseBrackets(parser, body) {
     }
     if (delim === "," || delim === ".,.") {
       body = operand(body, 1);
-      if (operator(body) === "Sequence") return ["List", ...operands(body)];
+      if (operator(body) === "Sequence") {
+        const elems = operands(body);
+        const inferred = tryInferRangeFromElements(elems, parser);
+        if (inferred) return inferred;
+        return ["List", ...elems];
+      }
       return ["List", body ?? "Nothing"];
     }
   }
   return ["List", body];
 }
+function tryInferRangeFromElements(elems, parser) {
+  if (elems.length < 4) return null;
+  const penultimate = elems[elems.length - 2];
+  if (symbol(penultimate) !== "ContinuationPlaceholder") return null;
+  const samples = elems.slice(0, -2);
+  const endExpr = elems[elems.length - 1];
+  if (samples.length < 2) return null;
+  const sampleNums = samples.map(machineValue);
+  if (sampleNums.some((n) => n === null)) return null;
+  const nums = sampleNums;
+  const step = nums[nums.length - 1] - nums[nums.length - 2];
+  const tol = parser.options.tolerance;
+  if (Math.abs(step) < tol)
+    return parser.error("degenerate-range-step", parser.index);
+  for (let i = 1; i < nums.length; i++) {
+    if (Math.abs(nums[i] - nums[i - 1] - step) > tol)
+      return parser.error("inconsistent-range-samples", parser.index);
+  }
+  return ["Range", nums[0], endExpr, step];
+}
 function serializeList(serializer, expr2) {
   if (nops(expr2) > 1 && operands(expr2).every((x) => {
     const op = operator(x);
@@ -11702,6 +11901,35 @@ function parseForExpression(parser, until) {
     ["Element", index, ["Range", lower, upper]]
   ];
 }
+function parseForComprehension(parser, lhs, until) {
+  const bindingTerminator = {
+    minPrec: 21,
+    // Above comma (20) and ; (19), so `x = L_1` is captured whole
+    condition: (p) => {
+      if (until?.condition?.(p)) return true;
+      const saved = p.index;
+      p.skipVisualSpace();
+      const isComma = p.peek === ",";
+      p.index = saved;
+      return isComma;
+    }
+  };
+  const elements = [];
+  do {
+    parser.skipVisualSpace();
+    const binding = parser.parseExpression(bindingTerminator);
+    if (binding === null) break;
+    const op = operator(binding);
+    if (op !== "Equal" && op !== "Assign") return null;
+    const name = operand(binding, 1);
+    const list = operand(binding, 2);
+    if (!name || !list) return null;
+    elements.push(["Element", name, list]);
+    parser.skipVisualSpace();
+  } while (parser.match(","));
+  if (elements.length === 0) return null;
+  return ["Loop", lhs, ...elements];
+}
 function parseWhereExpression(parser, lhs, until) {
   const bindingTerminator = {
     minPrec: 21,
@@ -13620,6 +13848,8 @@ var DEFINITIONS_ARITHMETIC = [
     precedence: DIVISION_PRECEDENCE,
     parse: "Mod"
   },
+  // Function-style alias: `\operatorname{mod}(a, b)`
+  { latexTrigger: "\\operatorname{mod}", parse: "Mod" },
   {
     latexTrigger: "\\pmod",
     kind: "prefix",
@@ -13860,6 +14090,13 @@ var DEFINITIONS_ARITHMETIC = [
       const rhs = serializer.wrap(operand(expr2, 2), ADDITION_PRECEDENCE + 3);
       return joinLatex([lhs, "-", rhs]);
     }
+  },
+  // Euclidean distance between two points (tuples of numbers).
+  {
+    name: "Distance",
+    latexTrigger: ["\\operatorname{distance}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{distance}" + serializer.wrapArguments(expr2)
   }
 ];
 function getIndexAssignment(expr2, upper) {
@@ -15284,7 +15521,9 @@ var DEFINITIONS_STATISTICS = [
       if (!expr2 || !symbol(expr2)) return null;
       return ["Mean", expr2];
     }
-  }
+  },
+  // Function-style alias: `\operatorname{var}(...)`
+  { latexTrigger: "\\operatorname{var}", parse: "Variance" }
 ];
 
 // src/compute-engine/numerics/unit-data.ts
@@ -16385,7 +16624,7 @@ var DEFINITIONS_OTHERS = [
         36: "\\qquad"
       }[v] ?? "";
     }
-  }
+  },
   // if (
   //   [
   //     '\\!',
@@ -16409,6 +16648,121 @@ var DEFINITIONS_OTHERS = [
   //     name: '',
   //     trigger: '\\check',
   // },
+  // ---------------------------------------------------------------------------
+  // Function-style aliases for collection / random operators that some
+  // notations write in lowercase (e.g. `\operatorname{shuffle}(L)`).
+  // The capitalized library entries already exist; these are pure parse
+  // aliases so the lowercase names don't land in `unsupported-operator`.
+  // ---------------------------------------------------------------------------
+  { latexTrigger: "\\operatorname{random}", parse: "Random" },
+  { latexTrigger: "\\operatorname{shuffle}", parse: "Shuffle" },
+  { latexTrigger: "\\operatorname{repeat}", parse: "Repeat" },
+  { latexTrigger: "\\operatorname{join}", parse: "Join" },
+  // ---------------------------------------------------------------------------
+  // Geometric primitive heads. Registered as known typed heads so consumers
+  // can branch on the operator name; CE itself doesn't render them. The
+  // library entries (with no evaluator) live in `library/core.ts`.
+  // ---------------------------------------------------------------------------
+  {
+    name: "Triangle",
+    latexTrigger: ["\\operatorname{triangle}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{triangle}" + serializer.wrapArguments(expr2)
+  },
+  // Desmos's geometric `vector(p1, p2)` — a directed segment between two
+  // points. Routed to a dedicated head (not the existing column-vector
+  // `Vector`, which has a narrower `(number+) -> vector` signature).
+  {
+    name: "GeometricVector",
+    latexTrigger: ["\\operatorname{vector}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{vector}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Sphere",
+    latexTrigger: ["\\operatorname{sphere}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{sphere}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Segment",
+    latexTrigger: ["\\operatorname{segment}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{segment}" + serializer.wrapArguments(expr2)
+  }
+];
+
+// src/compute-engine/latex-syntax/dictionary/definitions-colors.ts
+var DEFINITIONS_COLORS = [
+  // Color constructors (one per colorspace, preserves space on evaluation)
+  {
+    name: "Rgb",
+    latexTrigger: ["\\operatorname{rgb}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{rgb}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Hsv",
+    latexTrigger: ["\\operatorname{hsv}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{hsv}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Hsl",
+    latexTrigger: ["\\operatorname{hsl}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{hsl}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Oklab",
+    latexTrigger: ["\\operatorname{oklab}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{oklab}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "Oklch",
+    latexTrigger: ["\\operatorname{oklch}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{oklch}" + serializer.wrapArguments(expr2)
+  },
+  // Conversion functions (color → color in the named space)
+  {
+    name: "AsRgb",
+    latexTrigger: ["\\operatorname{asRgb}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{asRgb}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "AsHsv",
+    latexTrigger: ["\\operatorname{asHsv}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{asHsv}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "AsHsl",
+    latexTrigger: ["\\operatorname{asHsl}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{asHsl}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "AsOklab",
+    latexTrigger: ["\\operatorname{asOklab}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{asOklab}" + serializer.wrapArguments(expr2)
+  },
+  {
+    name: "AsOklch",
+    latexTrigger: ["\\operatorname{asOklch}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{asOklch}" + serializer.wrapArguments(expr2)
+  },
+  // Perceptual difference (returns a scalar in [0, ~1])
+  {
+    name: "ColorDelta",
+    latexTrigger: ["\\operatorname{colorDelta}"],
+    kind: "function",
+    serialize: (serializer, expr2) => "\\operatorname{colorDelta}" + serializer.wrapArguments(expr2)
+  }
 ];
 
 // src/compute-engine/latex-syntax/dictionary/default-dictionary.ts
@@ -16439,7 +16793,8 @@ var LATEX_DICTIONARY = [
   ...DEFINITIONS_STATISTICS,
   ...DEFINITIONS_UNITS,
   ...DEFINITIONS_OTHERS,
-  ...DEFINITIONS_PHYSICS
+  ...DEFINITIONS_PHYSICS,
+  ...DEFINITIONS_COLORS
 ];
 
 // src/math-json/symbols.ts
@@ -16604,6 +16959,17 @@ function addEntry(result, entry, onError) {
     } else if (Array.isArray(openTrigger) && openTrigger.length > 0) {
       openTokens.push(openTrigger[0]);
     }
+    const closeTrigger = indexedEntry.closeTrigger;
+    const closeTokens = /* @__PURE__ */ new Set();
+    if (typeof closeTrigger === "string") {
+      const variants = DELIMITER_SHORTHAND[closeTrigger];
+      if (variants) for (const v of variants) closeTokens.add(v);
+      else closeTokens.add(closeTrigger);
+      if (closeTrigger === "||") closeTokens.add("|");
+    } else if (Array.isArray(closeTrigger) && closeTrigger.length > 0) {
+      closeTokens.add(closeTrigger[0]);
+    }
+    indexedEntry.closeTokens = closeTokens;
     for (const token of openTokens) {
       const existing = result.matchfixByOpen.get(token);
       if (existing) {
@@ -16795,11 +17161,7 @@ function makeSerializeHandler(entry, latexTrigger, idTrigger) {
       if (style === "scaled")
         return joinLatex([`\\left${openDelim}`, inner, `\\right${closeDelim}`]);
       if (style === "big")
-        return joinLatex([
-          `\\Bigl${openDelim}`,
-          inner,
-          `\\Bigr${closeDelim}`
-        ]);
+        return joinLatex([`\\Bigl${openDelim}`, inner, `\\Bigr${closeDelim}`]);
       return joinLatex([openDelim, inner, closeDelim]);
     };
   }
@@ -18150,7 +18512,7 @@ var _Parser = class __Parser {
     }
     if (this.match("\\hskip") || this.match("\\kern")) {
       this.skipSpace();
-      this.match("-") || this.match("+");
+      if (!this.match("-")) this.match("+");
       while (/^[\d.]$/.test(this.peek)) this.nextToken();
       for (const unit of [
         "pt",
@@ -18664,6 +19026,19 @@ var _Parser = class __Parser {
     }
     for (const def of defs) {
       this.index = start;
+      if (def.closeTokens.size > 0) {
+        let found = false;
+        const tokens = this._tokens;
+        for (let i = start; i < tokens.length; i++) {
+          if (def.closeTokens.has(tokens[i])) {
+            found = true;
+            break;
+          }
+        }
+        if (!found) continue;
+      }
+      if (typeof def.openTrigger === "string" && def.openTrigger === "." && !OPEN_DELIMITER_PREFIX[currentToken])
+        continue;
       const matched = this.matchDelimiter(def.openTrigger, def.closeTrigger);
       if (!matched) continue;
       const bodyStart = this.index;
@@ -19326,6 +19701,19 @@ var _Parser = class __Parser {
       } while (postfix !== null);
     }
     if (result !== null) result = this.parseSupsub(result);
+    if (result !== null) {
+      let postfix = null;
+      let index = this.index;
+      do {
+        postfix = this.parsePostfixOperator(result, until);
+        result = postfix ?? result;
+        if (this.index === index && postfix !== null) {
+          console.assert(this.index !== index, "No token consumed");
+          break;
+        }
+        index = this.index;
+      } while (postfix !== null);
+    }
     if (result === null) {
       result = this.options.parseUnexpectedToken?.(null, this) ?? null;
       if (result === null && this.peek.startsWith("\\")) {
@@ -19834,6 +20222,28 @@ function toDecimalNumber(wholePart, fractionalPart, exp3) {
 }
 
 // src/compute-engine/latex-syntax/serializer.ts
+var DOT_NOTATION_MAP = {
+  First: ".x",
+  Second: ".y",
+  Third: ".z",
+  Real: ".\\operatorname{real}",
+  Imaginary: ".\\operatorname{imag}",
+  Length: ".\\operatorname{count}",
+  Sum: ".\\operatorname{total}",
+  Max: ".\\max",
+  Min: ".\\min"
+};
+function trySerializeDotNotation(serializer, expr2) {
+  if (!serializer.options.dotNotation) return null;
+  const ops = operands(expr2);
+  if (!ops || ops.length !== 1) return null;
+  const head = operator(expr2);
+  if (!head) return null;
+  const suffix = DOT_NOTATION_MAP[head];
+  if (suffix === void 0) return null;
+  const lhs = serializer.wrap(ops[0], 810);
+  return `${lhs}${suffix}`;
+}
 var ACCENT_MODIFIERS = {
   deg: (s) => `${s}\\degree`,
   prime: (s) => `${s}^{\\prime}`,
@@ -19877,6 +20287,7 @@ var Serializer5 = class {
   constructor(dictionary, options) {
     this.dictionary = dictionary;
     this.options = {
+      dotNotation: false,
       dmsFormat: false,
       angleNormalization: "none",
       ...options
@@ -19975,6 +20386,8 @@ var Serializer5 = class {
     return def?.serialize?.(this, expr2) ?? serializeSymbol2(symbol(expr2)) ?? "";
   }
   serializeFunction(expr2, def) {
+    const dotResult = trySerializeDotNotation(this, expr2);
+    if (dotResult !== null) return dotResult;
     if (def?.serialize) return def.serialize(this, expr2);
     const h = operator(expr2);
     return serializeSymbol2(h, "auto") + this.wrapArguments(expr2);
@@ -20217,6 +20630,8 @@ function defaultParseOptions(opts) {
     preserveLatex: opts.preserveLatex ?? false,
     quantifierScope: opts.quantifierScope ?? "tight",
     timeDerivativeVariable: opts.timeDerivativeVariable ?? "t",
+    // Standalone mode has no engine; use the same default as ComputeEngine
+    tolerance: 1e-7,
     // Callbacks -- standalone mode has no engine, so these are stubs
     getSymbolType: (_id) => BoxedType.unknown,
     hasSubscriptEvaluate: (_id) => false,
@@ -20249,6 +20664,7 @@ function defaultSerializeOptions(opts) {
     invisiblePlus: "",
     multiply: "\\times",
     missingSymbol: "\\blacksquare",
+    dotNotation: false,
     dmsFormat: false,
     angleNormalization: "none",
     // Style callbacks -- use same defaults as the engine
@@ -27219,7 +27635,11 @@ var COLLECTIONS_LIBRARY = {
   //
   Range: {
     complexity: 8200,
-    signature: "(number, number?, step: number?) -> indexed_collection<integer>",
+    signature: "(number, number?, step: number?) -> indexed_collection<number>",
+    type: (ops) => {
+      const allInt = ops.every((op) => op.isInteger);
+      return allInt ? parseType("indexed_collection<integer>") : parseType("indexed_collection<number>");
+    },
     canonical: (ops, { engine: ce }) => {
       if (ops.length === 0) return null;
       if (ops.length === 1) return ce._fn("Range", [ce.One, ops[0].canonical]);
@@ -27243,19 +27663,26 @@ var COLLECTIONS_LIBRARY = {
         const [lower, upper, step] = range(expr2);
         if (step === 0) return 0;
         if (!isFinite(lower) || !isFinite(upper)) return Infinity;
-        return 1 + Math.max(0, Math.floor((upper - lower) / step));
+        return Math.max(0, Math.floor((upper - lower) / step) + 1);
       },
       contains: (expr2, target) => {
-        if (!target.type.matches("integer")) return false;
         const t = target.re;
+        if (!isFinite(t)) return false;
         const [lower, upper, step] = range(expr2);
         if (step === 0) return false;
-        if (step > 0) return t >= lower && t <= upper;
-        return t <= lower && t >= upper;
+        if (step > 0) {
+          if (t < lower || t > upper) return false;
+        } else {
+          if (t > lower || t < upper) return false;
+        }
+        const k = (t - lower) / step;
+        const tol = expr2.engine.tolerance;
+        const kRounded = Math.round(k);
+        return kRounded >= 0 && Math.abs(k - kRounded) < tol;
       },
       iterator: (expr2) => {
         const [lower, upper, step] = range(expr2);
-        const maxCount = step === 0 ? 0 : Math.floor((upper - lower) / step) + 1;
+        const maxCount = step === 0 ? 0 : Math.max(0, Math.floor((upper - lower) / step) + 1);
         let index = 1;
         return {
           next: () => {
@@ -27273,7 +27700,9 @@ var COLLECTIONS_LIBRARY = {
       at: (expr2, index) => {
         if (typeof index !== "number") return void 0;
         const [lower, upper, step] = range(expr2);
-        if (index < 1 || index > 1 + (upper - lower) / step) return void 0;
+        if (step === 0) return void 0;
+        const maxCount = Math.max(0, Math.floor((upper - lower) / step) + 1);
+        if (index < 1 || index > maxCount) return void 0;
         return expr2.engine.number(lower + step * (index - 1));
       },
       indexWhere: void 0,
@@ -27298,7 +27727,13 @@ var COLLECTIONS_LIBRARY = {
         if (step > 0) return lower <= upper ? "positive" : "negative";
         return lower >= upper ? "positive" : "negative";
       },
-      elttype: (_expr) => "finite_integer"
+      elttype: (expr2) => {
+        if (!isFunction2(expr2)) return "finite_integer";
+        for (let i = 1; i <= expr2.nops; i++) {
+          if (!expr2[`op${i}`].isInteger) return "finite_real";
+        }
+        return "finite_integer";
+      }
     }
   },
   Interval: {
@@ -27896,15 +28331,45 @@ var COLLECTIONS_LIBRARY = {
   },
   First: {
     complexity: 8200,
-    signature: "(collection) -> any",
+    signature: "(any) -> any",
     type: ([xs]) => xs.operatorDefinition?.collection?.elttype?.(xs) ?? "any",
-    evaluate: ([xs], { engine: ce }) => xs.at(1) ?? ce.Nothing
+    evaluate: ([xs], { engine: ce }) => {
+      if (!xs.isCollection)
+        return ce.error([
+          "incompatible-type",
+          `'collection'`,
+          xs.type.toString()
+        ]);
+      return xs.at(1) ?? ce.Nothing;
+    }
   },
   Second: {
     complexity: 8200,
-    signature: "(collection) -> any",
+    signature: "(any) -> any",
+    type: ([xs]) => xs.operatorDefinition?.collection?.elttype?.(xs) ?? "any",
+    evaluate: ([xs], { engine: ce }) => {
+      if (!xs.isCollection)
+        return ce.error([
+          "incompatible-type",
+          `'collection'`,
+          xs.type.toString()
+        ]);
+      return xs.at(2) ?? ce.Nothing;
+    }
+  },
+  Third: {
+    complexity: 8200,
+    signature: "(any) -> any",
     type: ([xs]) => xs.operatorDefinition?.collection?.elttype?.(xs) ?? "any",
-    evaluate: ([xs], { engine: ce }) => xs.at(2) ?? ce.Nothing
+    evaluate: ([xs], { engine: ce }) => {
+      if (!xs.isCollection)
+        return ce.error([
+          "incompatible-type",
+          `'collection'`,
+          xs.type.toString()
+        ]);
+      return xs.at(3) ?? ce.Nothing;
+    }
   },
   Last: {
     complexity: 8200,
@@ -28883,17 +29348,14 @@ function range(expr2) {
   if (!isFunction2(expr2)) return [1, 0, 0];
   if (expr2.nops === 0) return [1, 0, 0];
   let op1 = expr2.op1.re;
-  if (!isFinite(op1)) op1 = 1;
-  else op1 = Math.round(op1);
+  if (!isFinite(op1) && !op1) op1 = 1;
   if (expr2.nops === 1) return [1, op1, 1];
   let op2 = expr2.op2.re;
   if (!isFinite(op2) && !op2) op2 = 1;
-  else if (isFinite(op2)) op2 = Math.round(op2);
-  if (expr2.nops === 2) return [op1, op2, op2 > op1 ? 1 : -1];
+  if (expr2.nops === 2) return [op1, op2, op2 >= op1 ? 1 : -1];
   let op3 = expr2.op3.re;
-  if (!isFinite(op3)) op3 = 1;
-  else op3 = Math.abs(Math.round(op3));
-  return [op1, op2, op1 < op2 ? op3 : -op3];
+  if (!isFinite(op3) && !op3) op3 = 1;
+  return [op1, op2, op3];
 }
 function rangeLast(r) {
   const [lower, upper, step] = r;
@@ -32226,6 +32688,29 @@ var ARITHMETIC_LIBRARY = [
       signature: "(value*) -> number | list",
       evaluate: (xs, { engine }) => evaluateMinMax(engine, xs, "Infimum")
     },
+    Distance: {
+      description: "Euclidean distance between two points (tuples of numbers).",
+      complexity: 6e3,
+      signature: "(tuple, tuple) -> number",
+      evaluate: ([a, b], { engine: ce }) => {
+        if (!isFunction2(a) || !isFunction2(b))
+          return ce.error("incompatible-type");
+        if (a.operator !== "Tuple" || b.operator !== "Tuple")
+          return ce.error("incompatible-type");
+        if (a.ops.length !== b.ops.length || a.ops.length === 0)
+          return ce.error("incompatible-type");
+        let sumSq = 0;
+        for (let i = 0; i < a.ops.length; i++) {
+          const ai = a.ops[i].re;
+          const bi = b.ops[i].re;
+          if (!Number.isFinite(ai) || !Number.isFinite(bi))
+            return ce.error("expected-value");
+          const d = ai - bi;
+          sumSq += d * d;
+        }
+        return ce.number(Math.sqrt(sumSq));
+      }
+    },
     Product: {
       description: "`Product(f, a, b)` computes the product of `f` from `a` to `b`",
       wikidata: "Q901718",
@@ -32758,16 +33243,11 @@ function boxRule(ce, rule, options) {
     );
   let condFn;
   if (typeof condition === "string") {
-    const latex = asLatexString(condition);
-    if (latex) {
-      const condPattern = ce.parse(latex, {
-        form: options?.canonical ? "canonical" : "raw"
-      }) ?? ce.expr("Nothing");
-      condFn = (x, _ce) => {
-        const evaluated = condPattern.subs(x).evaluate();
-        return isSymbol2(evaluated, "True");
-      };
-    }
+    const condPattern = ce.parse(condition) ?? ce.expr("Nothing");
+    condFn = (x, _ce) => {
+      const evaluated = condPattern.subs(x).evaluate();
+      return isSymbol2(evaluated, "True");
+    };
   } else {
     if (condition !== void 0 && typeof condition !== "function")
       throw new Error(
@@ -32869,6 +33349,15 @@ ${e.message}
 function applyRule(rule, expr2, substitution, options) {
   if (!rule) return null;
   let canonical2 = options?.canonical ?? (expr2.isCanonical || expr2.isStructural);
+  let { match: match2, replace: replace2, condition, id, onMatch, onBeforeMatch } = rule;
+  const because = id ?? "";
+  const ce = expr2.engine;
+  if (canonical2 && match2) {
+    const awc = getWildcards(match2);
+    const canonicalMatch = match2.canonical;
+    const bwc = getWildcards(canonicalMatch);
+    if (!awc.every((x) => bwc.includes(x))) return null;
+  }
   let operandsMatched = false;
   if (isFunction2(expr2) && options?.recursive) {
     const newOps = expr2.ops.map((op) => {
@@ -32880,20 +33369,11 @@ function applyRule(rule, expr2, substitution, options) {
     if (operandsMatched) {
       if (!canonical2 && options?.canonical === void 0 && newOps.every((x) => x.isCanonical))
         canonical2 = true;
-      expr2 = expr2.engine.function(expr2.operator, newOps, {
+      expr2 = ce.function(expr2.operator, newOps, {
         form: canonical2 ? "canonical" : "raw"
       });
     }
   }
-  let { match: match2, replace: replace2, condition, id, onMatch, onBeforeMatch } = rule;
-  const because = id ?? "";
-  if (canonical2 && match2) {
-    const awc = getWildcards(match2);
-    const canonicalMatch = match2.canonical;
-    const bwc = getWildcards(canonicalMatch);
-    if (!awc.every((x) => bwc.includes(x)))
-      return operandsMatched ? { value: expr2, because } : null;
-  }
   const useVariations = rule.useVariations ?? options?.useVariations ?? false;
   const matchPermutations = options?.matchPermutations ?? true;
   onBeforeMatch?.(rule, expr2);
@@ -32912,7 +33392,7 @@ function applyRule(rule, expr2, substitution, options) {
       ...sub2
     };
     try {
-      if (!condition(conditionSub, expr2.engine))
+      if (!condition(conditionSub, ce))
         return operandsMatched ? { value: expr2, because } : null;
     } catch (e) {
       console.error(
@@ -32927,7 +33407,8 @@ function applyRule(rule, expr2, substitution, options) {
   if (!canonical2 && options?.canonical === void 0 && replace2 instanceof _BoxedExpression && replace2.isCanonical)
     canonical2 = true;
   const result = typeof replace2 === "function" ? replace2(expr2, sub2) : replace2.subs(sub2, { canonical: canonical2 });
-  if (!result) return null;
+  if (!result)
+    return operandsMatched ? { value: canonical2 ? expr2.canonical : expr2, because } : null;
   onMatch?.(rule, expr2, result);
   if (isRuleStep(result))
     return canonical2 ? { ...result, value: result.value.canonical } : result;
@@ -38501,6 +38982,40 @@ function rgbToHsl(r, g, b) {
   else h = ((r - g) / d + 4) / 6;
   return { h: h * 360, s, l };
 }
+function hsvToRgb(h, s, v) {
+  h = (h % 360 + 360) % 360;
+  s = Math.max(0, Math.min(1, s));
+  v = Math.max(0, Math.min(1, v));
+  const c = v * s;
+  const x = c * (1 - Math.abs(h / 60 % 2 - 1));
+  const m = v - c;
+  let r = 0, g = 0, b = 0;
+  if (h < 60) [r, g, b] = [c, x, 0];
+  else if (h < 120) [r, g, b] = [x, c, 0];
+  else if (h < 180) [r, g, b] = [0, c, x];
+  else if (h < 240) [r, g, b] = [0, x, c];
+  else if (h < 300) [r, g, b] = [x, 0, c];
+  else [r, g, b] = [c, 0, x];
+  return { r: (r + m) * 255, g: (g + m) * 255, b: (b + m) * 255 };
+}
+function rgbToHsv(r, g, b) {
+  r /= 255;
+  g /= 255;
+  b /= 255;
+  const max2 = Math.max(r, g, b);
+  const min2 = Math.min(r, g, b);
+  const d = max2 - min2;
+  let h = 0;
+  if (d > 0) {
+    if (max2 === r) h = (g - b) / d % 6;
+    else if (max2 === g) h = (b - r) / d + 2;
+    else h = (r - g) / d + 4;
+    h *= 60;
+    if (h < 0) h += 360;
+  }
+  const s = max2 === 0 ? 0 : d / max2;
+  return { h, s, v: max2 };
+}
 function parseHexColor(s) {
   const hex = s.startsWith("#") ? s.substring(1) : s;
   let r, g, b;
@@ -38525,6 +39040,12 @@ function parseHexColor(s) {
   if (alpha !== void 0) result.alpha = alpha;
   return result;
 }
+function asOklch(color) {
+  if (typeof color === "string") return rgbToOklch(parseHexColor(color));
+  if ("C" in color) return color;
+  if ("a" in color && "b" in color) return oklabToOklch(color);
+  return rgbToOklch(color);
+}
 function asRgb(color) {
   if (typeof color === "number") {
     return {
@@ -38956,6 +39477,13 @@ var NAMED_COLORS = {
 };
 function parseColor(s, darkMode) {
   const str = s.trim().toLowerCase();
+  const opacityMatch = str.match(/^(.+?)\s*\/\s*(\d+(?:\.\d+)?)%?\s*$/);
+  if (opacityMatch) {
+    const base = parseColor(opacityMatch[1].trim(), darkMode);
+    const opacity = Math.max(0, Math.min(100, parseFloat(opacityMatch[2])));
+    const alpha = Math.round(opacity / 100 * 255);
+    return base & 4294967040 | alpha;
+  }
   if (str.startsWith("#")) {
     const hex = str.substring(1);
     let r, g, b, a = 255;
@@ -39088,14 +39616,6 @@ function parseColor(s, darkMode) {
   console.warn(`parseColor: unrecognized color "${s}"`);
   return 0;
 }
-function parseColorToRgb01(s, darkMode) {
-  const color = parseColor(s, darkMode);
-  return [
-    (color >>> 24 & 255) / 255,
-    (color >>> 16 & 255) / 255,
-    (color >>> 8 & 255) / 255
-  ];
-}
 function apca(bgColor, fgColor) {
   const bgRgb = asRgb(bgColor);
   const fgRgb = asRgb(fgColor);
@@ -39154,6 +39674,12 @@ function contrastingColor(arg) {
   const contrast2 = Math.abs(apca(fg2, bg));
   return contrast1 >= contrast2 ? asColorNumber(fg1) : asColorNumber(fg2);
 }
+function oklabDeltaE(a, b) {
+  const dL = a.L - b.L;
+  const da = a.a - b.a;
+  const db = a.b - b.b;
+  return Math.sqrt(dL * dL + da * da + db * db);
+}
 function lerpOklch(c1, c2, f) {
   const L = c1.L + (c2.L - c1.L) * f;
   const C = c1.C + (c2.C - c1.C) * f;
@@ -41915,14 +42441,30 @@ var SEQUENTIAL_PALETTES = {
 };
 
 // src/compute-engine/library/colors.ts
-function colorNumberToTuple(ce, color) {
-  const r = (color >>> 24 & 255) / 255;
-  const g = (color >>> 16 & 255) / 255;
-  const b = (color >>> 8 & 255) / 255;
-  const a = (color & 255) / 255;
-  if (Math.abs(a - 1) < 1e-4)
-    return ce.tuple(ce.number(r), ce.number(g), ce.number(b));
-  return ce.tuple(ce.number(r), ce.number(g), ce.number(b), ce.number(a));
+function normalizeAlpha(a) {
+  if (a === void 0) return void 0;
+  if (!Number.isFinite(a)) return void 0;
+  if (Math.abs(a - 1) < 1e-9) return void 0;
+  return a;
+}
+function normalizeColorHead(ce, expr2) {
+  if (!isFunction2(expr2) || !expr2.ops || expr2.ops.length < 4) return expr2;
+  const alphaExpr = expr2.ops[3];
+  if (!isNumber(alphaExpr)) return expr2;
+  if (normalizeAlpha(alphaExpr.re) === void 0) {
+    return ce.function(expr2.operator, [expr2.ops[0], expr2.ops[1], expr2.ops[2]]);
+  }
+  return expr2;
+}
+function colorNumberToOklch(ce, color) {
+  const r = color >>> 24 & 255;
+  const g = color >>> 16 & 255;
+  const b = color >>> 8 & 255;
+  const a = normalizeAlpha((color & 255) / 255);
+  const c = rgbToOklch({ r, g, b });
+  const args = [ce.number(c.L), ce.number(c.C), ce.number(c.H)];
+  if (a !== void 0) args.push(ce.number(a));
+  return ce.function("Oklch", args);
 }
 var ALL_PALETTES = {
   ...SEQUENTIAL_PALETTES,
@@ -41933,45 +42475,139 @@ function samplePalette(ce, palette, t) {
   t = Math.max(0, Math.min(1, t));
   const n = palette.length;
   if (n === 0) return ce.error("expected-value");
-  if (n === 1) return colorNumberToTuple(ce, parseColor(palette[0]));
+  if (n === 1) return colorNumberToOklch(ce, parseColor(palette[0]));
   const pos = t * (n - 1);
   const i = Math.floor(pos);
   const frac = pos - i;
-  if (i >= n - 1) return colorNumberToTuple(ce, parseColor(palette[n - 1]));
-  if (frac < 1e-9) return colorNumberToTuple(ce, parseColor(palette[i]));
-  const rgb = interpolateOklch(palette[i], palette[i + 1], frac);
-  const r = rgb.r / 255;
-  const g = rgb.g / 255;
-  const b = rgb.b / 255;
-  return ce.tuple(ce.number(r), ce.number(g), ce.number(b));
+  if (i >= n - 1) return colorNumberToOklch(ce, parseColor(palette[n - 1]));
+  if (frac < 1e-9) return colorNumberToOklch(ce, parseColor(palette[i]));
+  return oklchToExpr(
+    ce,
+    asOklch(interpolateOklch(palette[i], palette[i + 1], frac))
+  );
+}
+var COLOR_OPERATORS = /* @__PURE__ */ new Set(["Rgb", "Hsv", "Hsl", "Oklab", "Oklch"]);
+function readColorExpr(arg) {
+  if (!isFunction2(arg)) return null;
+  if (!COLOR_OPERATORS.has(arg.operator)) return null;
+  if (!arg.ops || arg.ops.length < 3) return null;
+  const c0 = arg.ops[0].re;
+  const c1 = arg.ops[1].re;
+  const c2 = arg.ops[2].re;
+  if (!Number.isFinite(c0) || !Number.isFinite(c1) || !Number.isFinite(c2))
+    return null;
+  const alpha = arg.ops.length >= 4 ? normalizeAlpha(arg.ops[3].re) : void 0;
+  return { space: arg.operator, c0, c1, c2, alpha };
+}
+function colorExprToRgb(arg) {
+  const c = readColorExpr(arg);
+  if (!c) return null;
+  const withAlpha = (rgb) => c.alpha !== void 0 ? { ...rgb, alpha: c.alpha } : rgb;
+  switch (c.space) {
+    case "Rgb":
+      return withAlpha({ r: c.c0 * 255, g: c.c1 * 255, b: c.c2 * 255 });
+    case "Hsv":
+      return withAlpha(hsvToRgb(c.c0, c.c1, c.c2));
+    case "Hsl":
+      return withAlpha(hslToRgb(c.c0, c.c1, c.c2));
+    case "Oklab":
+      return withAlpha(oklabToRgb({ L: c.c0, a: c.c1, b: c.c2 }));
+    case "Oklch":
+      return withAlpha(oklchToRgb({ L: c.c0, C: c.c1, H: c.c2 }));
+  }
+  return null;
+}
+function colorExprToOklch(arg) {
+  const c = readColorExpr(arg);
+  if (!c) return null;
+  switch (c.space) {
+    case "Oklch":
+      return asOklch({ L: c.c0, C: c.c1, H: c.c2, alpha: c.alpha });
+    case "Oklab":
+      return asOklch({ L: c.c0, a: c.c1, b: c.c2, alpha: c.alpha });
+    case "Rgb":
+      return asOklch({
+        r: c.c0 * 255,
+        g: c.c1 * 255,
+        b: c.c2 * 255,
+        alpha: c.alpha
+      });
+    case "Hsv": {
+      const rgb = hsvToRgb(c.c0, c.c1, c.c2);
+      return asOklch({ ...rgb, alpha: c.alpha });
+    }
+    case "Hsl": {
+      const rgb = hslToRgb(c.c0, c.c1, c.c2);
+      return asOklch({ r: rgb.r, g: rgb.g, b: rgb.b, alpha: c.alpha });
+    }
+  }
+  return null;
+}
+function toOklch(ce, arg) {
+  const direct = colorExprToOklch(arg);
+  if (direct) return direct;
+  const rgb = extractRgb(ce, arg);
+  return rgb ? asOklch(rgb) : null;
+}
+function lerpOklchColor(a, b, t) {
+  const L = a.L + (b.L - a.L) * t;
+  const C = a.C + (b.C - a.C) * t;
+  const aAchromatic = a.C < 1e-6;
+  const bAchromatic = b.C < 1e-6;
+  let H;
+  if (aAchromatic && bAchromatic) H = a.H;
+  else if (aAchromatic) H = b.H;
+  else if (bAchromatic) H = a.H;
+  else {
+    let dH = b.H - a.H;
+    if (dH > 180) dH -= 360;
+    if (dH < -180) dH += 360;
+    H = a.H + dH * t;
+    if (H < 0) H += 360;
+    if (H >= 360) H -= 360;
+  }
+  const alphaA = a.alpha ?? 1;
+  const alphaB = b.alpha ?? 1;
+  return { L, C, H, alpha: normalizeAlpha(alphaA + (alphaB - alphaA) * t) };
+}
+function oklchToExpr(ce, c) {
+  const args = [ce.number(c.L), ce.number(c.C), ce.number(c.H)];
+  if (c.alpha !== void 0) args.push(ce.number(c.alpha));
+  return ce.function("Oklch", args);
 }
 function extractRgb(ce, arg) {
   if (isString(arg)) {
     const s = arg.string;
     if (!s) return void 0;
     const color = parseColor(s);
-    return {
+    const rgb = {
       r: color >>> 24 & 255,
       g: color >>> 16 & 255,
-      b: color >>> 8 & 255,
-      alpha: (color & 255) / 255
+      b: color >>> 8 & 255
     };
+    const alpha = normalizeAlpha((color & 255) / 255);
+    if (alpha !== void 0) rgb.alpha = alpha;
+    return rgb;
   }
+  const fromTyped = colorExprToRgb(arg);
+  if (fromTyped) return fromTyped;
   if (arg.operator === "Tuple" && arg.ops && arg.ops.length >= 3) {
     const rgb = {
       r: arg.ops[0].re * 255,
       g: arg.ops[1].re * 255,
       b: arg.ops[2].re * 255
     };
-    if (arg.ops.length >= 4) rgb.alpha = arg.ops[3].re;
+    if (arg.ops.length >= 4) {
+      const alpha = normalizeAlpha(arg.ops[3].re);
+      if (alpha !== void 0) rgb.alpha = alpha;
+    }
     return rgb;
   }
   return void 0;
 }
 function componentsTuple(ce, components, alpha) {
   const args = components.map((v) => ce.number(v));
-  if (alpha !== void 0 && Math.abs(alpha - 1) > 1e-4)
-    args.push(ce.number(alpha));
+  if (alpha !== void 0) args.push(ce.number(alpha));
   return ce.tuple(...args);
 }
 function rgbToHex(rgb) {
@@ -41979,7 +42615,7 @@ function rgbToHex(rgb) {
   const g = Math.round(Math.max(0, Math.min(255, rgb.g)));
   const b = Math.round(Math.max(0, Math.min(255, rgb.b)));
   const hex = `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b.toString(16).padStart(2, "0")}`;
-  if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4) {
+  if (rgb.alpha !== void 0) {
     const a = Math.round(Math.max(0, Math.min(255, rgb.alpha * 255)));
     return hex + a.toString(16).padStart(2, "0");
   }
@@ -41987,22 +42623,29 @@ function rgbToHex(rgb) {
 }
 var COLORS_LIBRARY = {
   Color: {
-    description: "Convert a color string to a canonical sRGB tuple",
+    description: "Parse a CSS-style color string to an Oklch color",
     complexity: 8e3,
-    signature: "(string) -> tuple",
+    signature: "(string) -> color",
     evaluate: (ops, { engine: ce }) => {
       const input = isString(ops[0]) ? ops[0].string : void 0;
       if (!input) return ce.error("incompatible-type");
       const color = parseColor(input);
       if (color === 0 && input.trim().toLowerCase() !== "transparent")
         return ce.error("incompatible-type");
-      return colorNumberToTuple(ce, color);
+      const r = color >>> 24 & 255;
+      const g = color >>> 16 & 255;
+      const b = color >>> 8 & 255;
+      const a = normalizeAlpha((color & 255) / 255);
+      const c = rgbToOklch({ r, g, b });
+      const args = [ce.number(c.L), ce.number(c.C), ce.number(c.H)];
+      if (a !== void 0) args.push(ce.number(a));
+      return ce.function("Oklch", args);
     }
   },
   ColorToString: {
     description: "Convert a color to a string in the specified format",
     complexity: 8e3,
-    signature: "(any, string?) -> string",
+    signature: "(color | string | tuple, string?) -> string",
     evaluate: (ops, { engine: ce }) => {
       const rgb = extractRgb(ce, ops[0]);
       if (!rgb) return ce.error("incompatible-type");
@@ -42014,7 +42657,7 @@ var COLORS_LIBRARY = {
           const r = Math.round(rgb.r);
           const g = Math.round(rgb.g);
           const b = Math.round(rgb.b);
-          if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
+          if (rgb.alpha !== void 0)
             return ce.string(`rgb(${r} ${g} ${b} / ${rgb.alpha})`);
           return ce.string(`rgb(${r} ${g} ${b})`);
         }
@@ -42023,17 +42666,17 @@ var COLORS_LIBRARY = {
           const h = Math.round(hsl.h * 10) / 10;
           const s = Math.round(hsl.s * 1e3) / 10;
           const l = Math.round(hsl.l * 1e3) / 10;
-          if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
+          if (rgb.alpha !== void 0)
             return ce.string(`hsl(${h} ${s}% ${l}% / ${rgb.alpha})`);
           return ce.string(`hsl(${h} ${s}% ${l}%)`);
         }
         case "oklch": {
-          const c = rgbToOklch(rgb);
+          const c = colorExprToOklch(ops[0]) ?? asOklch(rgb);
           const L = Math.round(c.L * 1e3) / 1e3;
           const C = Math.round(c.C * 1e3) / 1e3;
           const H = Math.round(c.H * 10) / 10;
-          if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
-            return ce.string(`oklch(${L} ${C} ${H} / ${rgb.alpha})`);
+          if (c.alpha !== void 0)
+            return ce.string(`oklch(${L} ${C} ${H} / ${c.alpha})`);
           return ce.string(`oklch(${L} ${C} ${H})`);
         }
         default:
@@ -42044,60 +42687,44 @@ var COLORS_LIBRARY = {
   ColorMix: {
     description: "Mix two colors in OKLCh space",
     complexity: 8e3,
-    signature: "(any, any, number?) -> tuple",
+    signature: "(color | string | tuple, color | string | tuple, number?) -> color",
     evaluate: (ops, { engine: ce }) => {
-      const rgb1 = extractRgb(ce, ops[0]);
-      const rgb2 = extractRgb(ce, ops[1]);
-      if (!rgb1 || !rgb2) return ce.error("incompatible-type");
       let ratio = 0.5;
       if (ops.length >= 3 && ops[2] !== void 0) {
         ratio = ops[2].re;
         if (!Number.isFinite(ratio)) return ce.error("expected-value");
         ratio = Math.max(0, Math.min(1, ratio));
       }
-      const c1 = rgbToOklch(rgb1);
-      const c2 = rgbToOklch(rgb2);
-      const mixed = oklchToRgb(lerpOklch(c1, c2, ratio));
-      const r = mixed.r / 255;
-      const g = mixed.g / 255;
-      const b = mixed.b / 255;
-      const a1 = rgb1.alpha ?? 1;
-      const a2 = rgb2.alpha ?? 1;
-      const alpha = a1 + (a2 - a1) * ratio;
-      if (Math.abs(alpha - 1) > 1e-4)
-        return ce.tuple(
-          ce.number(r),
-          ce.number(g),
-          ce.number(b),
-          ce.number(alpha)
-        );
-      return ce.tuple(ce.number(r), ce.number(g), ce.number(b));
+      const oklch1 = toOklch(ce, ops[0]);
+      const oklch2 = toOklch(ce, ops[1]);
+      if (!oklch1 || !oklch2) return ce.error("incompatible-type");
+      return oklchToExpr(ce, lerpOklchColor(oklch1, oklch2, ratio));
     }
   },
   Colormap: {
     description: "Sample colors from a named palette",
     complexity: 8e3,
-    signature: "(string, number?) -> any",
+    signature: "(string, number?) -> color | list<color>",
     evaluate: (ops, { engine: ce }) => {
       const name = isString(ops[0]) ? ops[0].string : void 0;
       if (!name) return ce.error("incompatible-type");
       const palette = ALL_PALETTES[name];
       if (!palette) return ce.error("expected-value", name);
       if (ops.length < 2 || ops[1] === void 0) {
-        const tuples = palette.map(
-          (hex) => colorNumberToTuple(ce, parseColor(hex))
+        const colors = palette.map(
+          (hex) => colorNumberToOklch(ce, parseColor(hex))
         );
-        return ce.function("List", tuples);
+        return ce.function("List", colors);
       }
       const val = ops[1].re;
       if (!Number.isFinite(val)) return ce.error("expected-value");
       if (Number.isInteger(val) && val >= 2) {
         const n = val;
-        const tuples = [];
+        const colors = [];
         for (let i = 0; i < n; i++) {
-          tuples.push(samplePalette(ce, palette, i / (n - 1)));
+          colors.push(samplePalette(ce, palette, i / (n - 1)));
         }
-        return ce.function("List", tuples);
+        return ce.function("List", colors);
       }
       return samplePalette(ce, palette, val);
     }
@@ -42105,12 +42732,25 @@ var COLORS_LIBRARY = {
   ColorToColorspace: {
     description: "Convert a color to components in a target color space",
     complexity: 8e3,
-    signature: "(any, string) -> tuple",
+    signature: "(color | string | tuple, string) -> tuple",
     evaluate: (ops, { engine: ce }) => {
-      const rgb = extractRgb(ce, ops[0]);
-      if (!rgb) return ce.error("incompatible-type");
       const space = isString(ops[1]) ? ops[1].string?.toLowerCase() : void 0;
       if (!space) return ce.error("incompatible-type");
+      if (space === "oklch" || space === "oklab" || space === "lab") {
+        const oklch2 = colorExprToOklch(ops[0]);
+        if (oklch2) {
+          if (space === "oklch")
+            return componentsTuple(
+              ce,
+              [oklch2.L, oklch2.C, oklch2.H],
+              oklch2.alpha
+            );
+          const lab = oklchToOklab(oklch2);
+          return componentsTuple(ce, [lab.L, lab.a, lab.b], lab.alpha);
+        }
+      }
+      const rgb = extractRgb(ce, ops[0]);
+      if (!rgb) return ce.error("incompatible-type");
       const alpha = rgb.alpha;
       switch (space) {
         case "rgb":
@@ -42140,17 +42780,27 @@ var COLORS_LIBRARY = {
   ColorFromColorspace: {
     description: "Convert color space components to a canonical sRGB tuple",
     complexity: 8e3,
-    signature: "(tuple, string) -> tuple",
+    signature: "(color | tuple, string) -> tuple",
     evaluate: (ops, { engine: ce }) => {
-      const tuple = ops[0];
-      if (!isFunction2(tuple) || tuple.operator !== "Tuple" || tuple.ops.length < 3)
-        return ce.error("incompatible-type");
-      const c0 = tuple.ops[0].re;
-      const c1 = tuple.ops[1].re;
-      const c2 = tuple.ops[2].re;
-      const alpha = tuple.ops.length >= 4 ? tuple.ops[3].re : void 0;
       const space = isString(ops[1]) ? ops[1].string?.toLowerCase() : void 0;
       if (!space) return ce.error("incompatible-type");
+      let c0, c1, c2;
+      let alpha;
+      const arg = ops[0];
+      const typed = readColorExpr(arg);
+      if (typed) {
+        c0 = typed.c0;
+        c1 = typed.c1;
+        c2 = typed.c2;
+        alpha = typed.alpha;
+      } else if (isFunction2(arg) && arg.operator === "Tuple" && arg.ops.length >= 3) {
+        c0 = arg.ops[0].re;
+        c1 = arg.ops[1].re;
+        c2 = arg.ops[2].re;
+        alpha = arg.ops.length >= 4 ? arg.ops[3].re : void 0;
+      } else {
+        return ce.error("incompatible-type");
+      }
       let rgb;
       switch (space) {
         case "rgb":
@@ -42186,7 +42836,7 @@ var COLORS_LIBRARY = {
   ColorContrast: {
     description: "APCA contrast ratio between two colors",
     complexity: 8e3,
-    signature: "(any, any) -> number",
+    signature: "(color | string | tuple, color | string | tuple) -> number",
     evaluate: (ops, { engine: ce }) => {
       const bgRgb = extractRgb(ce, ops[0]);
       const fgRgb = extractRgb(ce, ops[1]);
@@ -42197,19 +42847,186 @@ var COLORS_LIBRARY = {
   ContrastingColor: {
     description: "Choose the foreground color with better APCA contrast against a background",
     complexity: 8e3,
-    signature: "(any, any?, any?) -> tuple",
+    signature: "(color | string | tuple, (color | string | tuple)?, (color | string | tuple)?) -> color",
     evaluate: (ops, { engine: ce }) => {
       const bgRgb = extractRgb(ce, ops[0]);
       if (!bgRgb) return ce.error("incompatible-type");
+      let packed;
       if (ops.length >= 3 && ops[1] !== void 0 && ops[2] !== void 0) {
         const fg1 = extractRgb(ce, ops[1]);
         const fg2 = extractRgb(ce, ops[2]);
         if (!fg1 || !fg2) return ce.error("incompatible-type");
-        const result2 = contrastingColor({ bg: bgRgb, fg1, fg2 });
-        return colorNumberToTuple(ce, result2);
+        packed = contrastingColor({ bg: bgRgb, fg1, fg2 });
+      } else {
+        packed = contrastingColor(bgRgb);
+      }
+      const r = (packed >>> 24 & 255) / 255;
+      const g = (packed >>> 16 & 255) / 255;
+      const b = (packed >>> 8 & 255) / 255;
+      const alpha = normalizeAlpha((packed & 255) / 255);
+      const args = [ce.number(r), ce.number(g), ce.number(b)];
+      if (alpha !== void 0) args.push(ce.number(alpha));
+      return ce.function("Rgb", args);
+    }
+  },
+  // ---------------------------------------------------------------------------
+  // Color constructors. Each preserves its colorspace on evaluation; the
+  // operator name is the discriminator. Components are interpreted per
+  // colorspace conventions (Rgb channels 0-1, Hsv/Hsl hue in degrees with
+  // sat/value 0-1, Oklab/Oklch L 0-1 with standard a/b/C/H ranges). The
+  // optional 4th argument is alpha in [0, 1]. No clamping at evaluation time.
+  // ---------------------------------------------------------------------------
+  Rgb: {
+    description: "sRGB color (channels 0-1, optional alpha 0-1)",
+    complexity: 8e3,
+    signature: "(number, number, number, number?) -> color"
+  },
+  Hsv: {
+    description: "HSV color (hue degrees, saturation/value 0-1, optional alpha)",
+    complexity: 8e3,
+    signature: "(number, number, number, number?) -> color"
+  },
+  Hsl: {
+    description: "HSL color (hue degrees, saturation/lightness 0-1, optional alpha)",
+    complexity: 8e3,
+    signature: "(number, number, number, number?) -> color"
+  },
+  Oklab: {
+    description: "OKLab color (L 0-1, a/b ~ -0.4..0.4, optional alpha)",
+    complexity: 8e3,
+    signature: "(number, number, number, number?) -> color"
+  },
+  Oklch: {
+    description: "OKLCh color (L 0-1, C 0-~0.4, hue degrees, optional alpha)",
+    complexity: 8e3,
+    signature: "(number, number, number, number?) -> color"
+  },
+  // ---------------------------------------------------------------------------
+  // Color-space conversions. Each accepts any of the five color heads and
+  // returns the same color in the named space. If the input is already in
+  // the target space, returns the input unchanged.
+  // ---------------------------------------------------------------------------
+  AsRgb: {
+    description: "Convert any color to sRGB (channels 0-1)",
+    complexity: 8e3,
+    signature: "(color) -> color",
+    evaluate: (ops, { engine: ce }) => {
+      const arg = ops[0];
+      if (isFunction2(arg) && arg.operator === "Rgb")
+        return normalizeColorHead(ce, arg);
+      const rgb = colorExprToRgb(arg);
+      if (!rgb) return ce.error("incompatible-type");
+      const args = [
+        ce.number(rgb.r / 255),
+        ce.number(rgb.g / 255),
+        ce.number(rgb.b / 255)
+      ];
+      if (rgb.alpha !== void 0) args.push(ce.number(rgb.alpha));
+      return ce.function("Rgb", args);
+    }
+  },
+  AsHsv: {
+    description: "Convert any color to HSV (hue degrees, s/v 0-1)",
+    complexity: 8e3,
+    signature: "(color) -> color",
+    evaluate: (ops, { engine: ce }) => {
+      const arg = ops[0];
+      if (isFunction2(arg) && arg.operator === "Hsv")
+        return normalizeColorHead(ce, arg);
+      const rgb = colorExprToRgb(arg);
+      if (!rgb) return ce.error("incompatible-type");
+      const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);
+      const args = [ce.number(hsv.h), ce.number(hsv.s), ce.number(hsv.v)];
+      if (rgb.alpha !== void 0) args.push(ce.number(rgb.alpha));
+      return ce.function("Hsv", args);
+    }
+  },
+  AsHsl: {
+    description: "Convert any color to HSL (hue degrees, s/l 0-1)",
+    complexity: 8e3,
+    signature: "(color) -> color",
+    evaluate: (ops, { engine: ce }) => {
+      const arg = ops[0];
+      if (isFunction2(arg) && arg.operator === "Hsl")
+        return normalizeColorHead(ce, arg);
+      const rgb = colorExprToRgb(arg);
+      if (!rgb) return ce.error("incompatible-type");
+      const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
+      const args = [ce.number(hsl.h), ce.number(hsl.s), ce.number(hsl.l)];
+      if (rgb.alpha !== void 0) args.push(ce.number(rgb.alpha));
+      return ce.function("Hsl", args);
+    }
+  },
+  AsOklab: {
+    description: "Convert any color to OKLab",
+    complexity: 8e3,
+    signature: "(color) -> color",
+    evaluate: (ops, { engine: ce }) => {
+      const arg = ops[0];
+      if (isFunction2(arg) && arg.operator === "Oklab")
+        return normalizeColorHead(ce, arg);
+      if (isFunction2(arg) && arg.operator === "Oklch") {
+        const c = readColorExpr(arg);
+        if (!c) return ce.error("incompatible-type");
+        const lab2 = oklchToOklab({ L: c.c0, C: c.c1, H: c.c2, alpha: c.alpha });
+        const args2 = [ce.number(lab2.L), ce.number(lab2.a), ce.number(lab2.b)];
+        if (lab2.alpha !== void 0) args2.push(ce.number(lab2.alpha));
+        return ce.function("Oklab", args2);
+      }
+      const rgb = colorExprToRgb(arg);
+      if (!rgb) return ce.error("incompatible-type");
+      const lab = rgbToOklab(rgb);
+      const args = [ce.number(lab.L), ce.number(lab.a), ce.number(lab.b)];
+      if (rgb.alpha !== void 0) args.push(ce.number(rgb.alpha));
+      return ce.function("Oklab", args);
+    }
+  },
+  AsOklch: {
+    description: "Convert any color to OKLCh",
+    complexity: 8e3,
+    signature: "(color) -> color",
+    evaluate: (ops, { engine: ce }) => {
+      const arg = ops[0];
+      if (isFunction2(arg) && arg.operator === "Oklch")
+        return normalizeColorHead(ce, arg);
+      if (isFunction2(arg) && arg.operator === "Oklab") {
+        const c2 = readColorExpr(arg);
+        if (!c2) return ce.error("incompatible-type");
+        const oklch2 = oklabToOklch({
+          L: c2.c0,
+          a: c2.c1,
+          b: c2.c2,
+          alpha: c2.alpha
+        });
+        const args2 = [
+          ce.number(oklch2.L),
+          ce.number(oklch2.C),
+          ce.number(oklch2.H)
+        ];
+        if (oklch2.alpha !== void 0) args2.push(ce.number(oklch2.alpha));
+        return ce.function("Oklch", args2);
       }
-      const result = contrastingColor(bgRgb);
-      return colorNumberToTuple(ce, result);
+      const rgb = colorExprToRgb(arg);
+      if (!rgb) return ce.error("incompatible-type");
+      const c = rgbToOklch(rgb);
+      const args = [ce.number(c.L), ce.number(c.C), ce.number(c.H)];
+      if (rgb.alpha !== void 0) args.push(ce.number(rgb.alpha));
+      return ce.function("Oklch", args);
+    }
+  },
+  // ---------------------------------------------------------------------------
+  // Perceptual difference. Returns ΔE_OK (Euclidean distance in OKLab),
+  // an approximately perceptually uniform scalar.
+  // ---------------------------------------------------------------------------
+  ColorDelta: {
+    description: "Perceptual color difference (\u0394E_OK) between two colors",
+    complexity: 8e3,
+    signature: "(color | string | tuple, color | string | tuple) -> number",
+    evaluate: (ops, { engine: ce }) => {
+      const a = toOklch(ce, ops[0]);
+      const b = toOklch(ce, ops[1]);
+      if (!a || !b) return ce.error("incompatible-type");
+      return ce.number(oklabDeltaE(oklchToOklab(a), oklchToOklab(b)));
     }
   }
 };
@@ -42268,12 +43085,42 @@ var CONTROL_STRUCTURES_LIBRARY = [
       }
     },
     Loop: {
-      description: "Evaluate a body expression over elements of a collection.",
+      description: "Evaluate a body expression in nested iteration over Element clauses. Later clauses see earlier bindings; independent clauses produce a Cartesian product.",
+      lazy: true,
+      signature: "(body:expression, iterators:expression*) -> any",
+      type: ([body]) => {
+        if (!body) return "nothing";
+        return parseType(`indexed_collection<${String(body.type)}>`);
+      },
+      canonical: canonicalLoop,
+      evaluate: (ops, { engine: ce }) => run(runLoop(ops[0], ops.slice(1), ce), ce._timeRemaining),
+      evaluateAsync: async (ops, { engine: ce, signal }) => runAsync(runLoop(ops[0], ops.slice(1), ce), ce._timeRemaining, signal)
+    },
+    When: {
+      description: "Conditional value: returns expr when cond holds, undefined otherwise.",
       lazy: true,
-      signature: "(body:expression, collection:expression) -> any",
-      type: ([body]) => body.type,
-      evaluate: ([body, collection], { engine: ce }) => run(runLoop(body, collection, ce), ce._timeRemaining),
-      evaluateAsync: async ([body, collection], { engine: ce, signal }) => runAsync(runLoop(body, collection, ce), ce._timeRemaining, signal)
+      signature: "(expression, boolean) -> any",
+      type: ([expr2]) => expr2.type,
+      canonical: (args, { engine: ce }) => {
+        if (args.length !== 2) return null;
+        const [expr2, cond] = args;
+        if (isFunction2(expr2, "When")) {
+          const inner = expr2.op1.canonical;
+          const innerCond = expr2.op2.canonical;
+          return ce._fn("When", [
+            inner,
+            ce._fn("And", [innerCond, cond.canonical])
+          ]);
+        }
+        return ce._fn("When", [expr2.canonical, cond.canonical]);
+      },
+      evaluate: ([expr2, cond], { engine: ce }) => {
+        const c = cond.evaluate();
+        const cs = sym(c);
+        if (cs === "True") return expr2.evaluate();
+        if (cs === "False") return ce.symbol("Undefined");
+        return ce._fn("When", [expr2, c]);
+      }
     },
     Which: {
       description: "Return the value for the first condition that is true.",
@@ -42333,9 +43180,141 @@ function canonicalBlock(ops, options) {
   );
   return result;
 }
-function* runLoop(body, collection, ce) {
+function canonicalLoop(ops, options) {
+  const { engine: ce, scope } = options;
+  if (ops.length === 0) return null;
+  if (ops.length === 1) {
+    return ce._fn("Loop", [ops[0].canonical]);
+  }
+  const body = ops[0];
+  const iterators = ops.slice(1);
+  const allElement = iterators.every((it) => it.operator === "Element");
+  if (!allElement) {
+    return ce._fn(
+      "Loop",
+      ops.map((op) => op.canonical)
+    );
+  }
+  const loopScope = scope ?? {
+    parent: ce.context.lexicalScope,
+    bindings: /* @__PURE__ */ new Map()
+  };
+  loopScope.noAutoDeclare = true;
+  ce.pushScope(loopScope);
+  let canonicalIterators;
+  let canonicalBody;
+  try {
+    canonicalIterators = iterators.map((it) => {
+      if (!isFunction2(it, "Element")) {
+        return ce._fn("Element", [
+          ce.error("missing").canonical,
+          ce.error("missing").canonical
+        ]);
+      }
+      const indexExpr = it.ops[0];
+      const collExpr = it.ops[1];
+      if (!indexExpr || !collExpr) {
+        return ce._fn("Element", [
+          (indexExpr ?? ce.error("missing")).canonical,
+          (collExpr ?? ce.error("missing")).canonical
+        ]);
+      }
+      if (isSymbol2(indexExpr) && indexExpr.symbol !== "Nothing") {
+        if (!ce.context.lexicalScope.bindings.has(indexExpr.symbol))
+          ce.declare(indexExpr.symbol, "unknown");
+      }
+      return ce._fn("Element", [indexExpr.canonical, collExpr.canonical]);
+    });
+    canonicalBody = body.canonical;
+  } finally {
+    ce.popScope();
+    loopScope.noAutoDeclare = false;
+  }
+  return ce._fn("Loop", [canonicalBody, ...canonicalIterators], {
+    scope: loopScope
+  });
+}
+function* runLoop(body, elements, ce) {
   body ??= ce.Nothing;
   if (sym(body) === "Nothing") return body;
+  if (elements.length === 0) {
+    const result = body.evaluate();
+    yield result;
+    return result;
+  }
+  if (elements.length === 1 && elements[0].operator !== "Element") {
+    return yield* runLoopLegacy(body, elements[0], ce);
+  }
+  const results = [];
+  const state = { stopped: false, broke: false, count: 0 };
+  const freshScope = {
+    parent: ce.context.lexicalScope,
+    bindings: /* @__PURE__ */ new Map()
+  };
+  ce._pushEvalContext(freshScope);
+  try {
+    for (const elem of elements) {
+      if (!isFunction2(elem, "Element")) continue;
+      const idx = elem.ops[0];
+      if (idx && isSymbol2(idx) && idx.symbol !== "Nothing") {
+        if (!freshScope.bindings.has(idx.symbol))
+          ce.declare(idx.symbol, "unknown");
+      }
+    }
+    yield* runLoopNested(body, elements, 0, ce, results, state);
+  } finally {
+    ce._popEvalContext();
+  }
+  if (state.stopped && state.value !== void 0) {
+    if (!state.broke) return state.value;
+    return state.value;
+  }
+  return ce.function("List", results);
+}
+function* runLoopNested(body, elements, index, ce, results, state) {
+  if (state.stopped) return;
+  if (index === elements.length) {
+    const result = body.evaluate();
+    state.count += 1;
+    if (state.count > ce.iterationLimit)
+      throw new CancellationError({ cause: "iteration-limit-exceeded" });
+    if (isFunction2(result, "Break")) {
+      state.stopped = true;
+      state.broke = true;
+      state.value = result.op1;
+      return;
+    }
+    if (result.operator === "Return") {
+      state.stopped = true;
+      state.value = result;
+      return;
+    }
+    results.push(result);
+    yield result;
+    return;
+  }
+  const elem = elements[index];
+  if (!isFunction2(elem, "Element")) {
+    return;
+  }
+  const indexExpr = elem.ops[0];
+  const collExpr = elem.ops[1];
+  if (!indexExpr || !isSymbol2(indexExpr) || !collExpr) {
+    return;
+  }
+  const name = indexExpr.symbol;
+  const collection = collExpr.evaluate();
+  if (!collection?.isCollection) {
+    return;
+  }
+  const skipAssign = name === "Nothing";
+  for (const value of collection.each()) {
+    if (!skipAssign) ce.assign(name, value);
+    yield* runLoopNested(body, elements, index + 1, ce, results, state);
+    if (state.stopped) return;
+  }
+}
+function* runLoopLegacy(body, collection, ce) {
   if (collection?.isCollection) {
     let result = void 0;
     const fn = applicable(body);
@@ -44689,6 +45668,34 @@ var CORE_LIBRARY = [
       signature: "() -> expression",
       evaluate: (_ops, { engine }) => engine.expr(randomExpression())
     }
+  },
+  // ---------------------------------------------------------------------------
+  // Opaque typed heads — registered so the names are in the standard set
+  // (consumers can branch on the operator name); CE itself does not evaluate
+  // them. Geometric primitives `Triangle`/`Sphere`/`Segment` and the action
+  // arrow `To` (`a \to b`).
+  // ---------------------------------------------------------------------------
+  {
+    Triangle: {
+      description: "Triangle primitive \u2014 opaque typed head.",
+      signature: "(any+) -> expression"
+    },
+    GeometricVector: {
+      description: "Geometric vector (directed segment between two points) \u2014 opaque typed head. Distinct from the column-vector `Vector` operator.",
+      signature: "(any, any) -> expression"
+    },
+    Sphere: {
+      description: "Sphere primitive \u2014 opaque typed head.",
+      signature: "(any+) -> expression"
+    },
+    Segment: {
+      description: "Segment primitive \u2014 opaque typed head.",
+      signature: "(any+) -> expression"
+    },
+    To: {
+      description: "Action arrow / mapping (`a \\to b`) \u2014 opaque typed head.",
+      signature: "(any, any) -> nothing"
+    }
   }
 ];
 
@@ -51825,6 +52832,7 @@ function orderConvexHull(points) {
 
 // src/compute-engine/boxed-expression/cache.ts
 function cachedValue(v, generation, fn) {
+  if (v.generation === generation && v.value !== null) return v.value;
   v.generation = generation;
   v.value = fn();
   return v.value;
@@ -53602,6 +54610,12 @@ function _setProduct(fn) {
 function _escapeJsonString(s) {
   return s;
 }
+function _serializeLatexMetadata(ce, expr2) {
+  const syntax = ce.latexSyntax;
+  const opts = ce.latexOptions;
+  if (Object.keys(opts).length === 0) return syntax.serialize(expr2);
+  return syntax.serialize(expr2, { ...opts });
+}
 function serializeSubtract(ce, a, b, options, metadata) {
   if (isNumber(a) && a.isNegative) {
     const v = a.numericValue;
@@ -53906,7 +54920,7 @@ function serializeJsonFunction(ce, name, args, options, metadata) {
   ];
   const md = { ...metadata ?? {} };
   if (options.metadata.includes("latex") && ce.latexSyntax) {
-    md.latex = _escapeJsonString(md.latex ?? ce.latexSyntax.serialize(fn));
+    md.latex = _escapeJsonString(md.latex ?? _serializeLatexMetadata(ce, fn));
   } else md.latex = "";
   if (!options.metadata.includes("wikidata")) md.wikidata = "";
   if (!md.latex && !md.wikidata && options.shorthands.includes("function"))
@@ -53931,7 +54945,7 @@ function serializeJsonSymbol(ce, sym2, options, metadata) {
   }
   metadata = { ...metadata };
   if (options.metadata.includes("latex") && ce.latexSyntax) {
-    metadata.latex = metadata.latex ?? ce.latexSyntax.serialize(sym2);
+    metadata.latex = metadata.latex ?? _serializeLatexMetadata(ce, sym2);
     if (metadata.latex !== void 0)
       metadata.latex = _escapeJsonString(metadata.latex);
   } else metadata.latex = void 0;
@@ -54093,7 +55107,7 @@ function serializeJsonNumber(ce, value, options, metadata) {
       }
     }
     if (options.metadata.includes("latex") && ce.latexSyntax)
-      metadata.latex = metadata.latex ?? ce.latexSyntax.serialize(result2 ?? { num });
+      metadata.latex = metadata.latex ?? _serializeLatexMetadata(ce, result2 ?? { num });
     if (result2) {
       if (metadata.latex !== void 0)
         return { sym: result2, latex: metadata.latex };
@@ -54109,7 +55123,7 @@ function serializeJsonNumber(ce, value, options, metadata) {
     if (value.isNaN()) {
       num = "NaN";
       if (options.metadata.includes("latex") && ce.latexSyntax)
-        metadata.latex = metadata.latex ?? ce.latexSyntax.serialize({ num });
+        metadata.latex = metadata.latex ?? _serializeLatexMetadata(ce, { num });
       return metadata.latex !== void 0 ? { num, latex: metadata.latex } : { num };
     }
     return serializeJsonFunction(
@@ -54143,7 +55157,7 @@ function serializeJsonNumber(ce, value, options, metadata) {
       value = Number(value);
     } else {
       if (options.metadata.includes("latex") && ce.latexSyntax)
-        metadata.latex = metadata.latex ?? ce.latexSyntax.serialize({
+        metadata.latex = metadata.latex ?? _serializeLatexMetadata(ce, {
           num: value.toString()
         });
       if (metadata.latex !== void 0)
@@ -54157,7 +55171,7 @@ function serializeJsonNumber(ce, value, options, metadata) {
     result = value > 0 ? "PositiveInfinity" : "NegativeInfinity";
   else num = serializeRepeatingDecimals(value.toString(), options);
   if (options.metadata.includes("latex") && ce.latexSyntax)
-    metadata.latex = metadata.latex ?? ce.latexSyntax.serialize({ num });
+    metadata.latex = metadata.latex ?? _serializeLatexMetadata(ce, { num });
   if (result) {
     if (metadata.latex !== void 0)
       return { sym: result, latex: metadata.latex };
@@ -54383,6 +55397,23 @@ var BaseCompiler = class _BaseCompiler {
       };
       return compilePair(0);
     }
+    if (h === "When") {
+      if (args.length !== 2)
+        throw new Error("When: expected exactly 2 arguments (expr, cond)");
+      const fn2 = target.functions?.(h);
+      if (fn2) {
+        if (typeof fn2 === "function") {
+          return fn2(args, (expr2) => _BaseCompiler.compile(expr2, target), target);
+        }
+        return `${fn2}(${args.map((x) => _BaseCompiler.compile(x, target)).join(", ")})`;
+      }
+      if (isSymbol2(args[1], "True"))
+        return `(${_BaseCompiler.compile(args[0], target)})`;
+      if (isSymbol2(args[1], "False")) return "NaN";
+      const val = _BaseCompiler.compile(args[0], target);
+      const cond = _BaseCompiler.compile(args[1], target);
+      return `((${cond}) ? (${val}) : NaN)`;
+    }
     if (h === "Block") {
       return _BaseCompiler.compileBlock(args, target);
     }
@@ -54457,17 +55488,91 @@ var BaseCompiler = class _BaseCompiler {
     )}${target.ws("\n")}})()`;
   }
   /**
-   * Compile a Loop expression with Element(index, Range(lo, hi)) indexing.
-   * Generates: (() => { for (let i = lo; i <= hi; i++) { body } })()
+   * Compile a Loop expression.
+   *
+   * Two forms are supported:
+   *
+   * 1. **Imperative / single-Element form** (existing behaviour):
+   *    `Loop(body, Element(i, Range(lo, hi)))`
+   *    Generates a raw `for (let i = lo; i <= hi; i++) { body }` loop wrapped
+   *    in an IIFE.  The loop counter is always a plain number.  For targets
+   *    that wrap numeric values (e.g. interval-js uses `_IA.point()`),
+   *    references to the loop index inside the body are re-wrapped via
+   *    `target.number`.  `break` / `continue` / `return` are preserved.
+   *
+   * 2. **Comprehension / variadic-Element form** (new):
+   *    `Loop(body, Element(x, coll1), Element(y, coll2), …)`
+   *    When two or more `Element` clauses are present — or when the single
+   *    Element's collection is not a `Range` — the loop is compiled as a
+   *    comprehension that collects results into an array.  Each clause
+   *    produces a `for (const name of collection)` loop, nested
+   *    outermost-to-innermost, and the innermost body pushes into `result`.
+   *
+   *    Example output (JS):
+   *    ```js
+   *    (() => { const result = [];
+   *      for (const x of [1,2]) { for (const y of [3,4]) { result.push(body); } }
+   *      return result; })()
+   *    ```
    *
-   * The loop counter is always a raw number. For targets that wrap numeric
-   * values (e.g. interval-js wraps with `_IA.point()`), references to the
-   * loop index inside the body are wrapped via `target.number`.
+   *    GLSL: multi-Element comprehension is not trivially representable in
+   *    GLSL (no dynamic arrays, no push).  A compile-time error is thrown.
+   *    TODO(E3-GLSL): support GLSL multi-Element via a pre-declared fixed-size
+   *    array or by unrolling when bounds are known at compile time.
    */
   static compileForLoop(args, target) {
     if (!args[0]) throw new Error("Loop: no body");
     if (!args[1]) throw new Error("Loop: no indexing set");
-    const indexing = args[1];
+    const body = args[0];
+    const elements = args.slice(1);
+    const useComprehension = elements.length > 1 || elements.length === 1 && isFunction2(elements[0], "Element") && !_BaseCompiler.isLegacyCompatibleRange(elements[0].ops[1]);
+    if (useComprehension) {
+      const lang = target.language ?? "";
+      if (lang === "glsl" || lang === "wgsl") {
+        throw new Error(
+          `${lang.toUpperCase()}: multi-Element Loop comprehension is not yet supported. TODO(E3-GLSL): unroll or use a fixed-size array.`
+        );
+      }
+      const narrowedElements = [];
+      for (let i = 0; i < elements.length; i++) {
+        const elem = elements[i];
+        if (!isFunction2(elem, "Element"))
+          throw new Error(
+            `Loop: argument ${i + 1} must be an Element clause, got ${elem.operator ?? "?"}`
+          );
+        if (!isSymbol2(elem.ops[0]))
+          throw new Error(
+            `Loop: Element index (argument ${i + 1}) must be a symbol`
+          );
+        narrowedElements.push(elem);
+      }
+      const loopVarSet = new Set(
+        narrowedElements.map(
+          (e) => e.ops[0].symbol
+        )
+      );
+      const needsWrap2 = target.number(0) !== "0";
+      const bodyTarget2 = needsWrap2 ? {
+        ...target,
+        var: (id) => loopVarSet.has(id) ? target.number(0).replace("0", id) : target.var(id)
+      } : target;
+      const bodyCode = _BaseCompiler.compile(body, bodyTarget2);
+      let inner = `result.push(${bodyCode});`;
+      for (let i = narrowedElements.length - 1; i >= 0; i--) {
+        const elem = narrowedElements[i];
+        const name = elem.ops[0].symbol;
+        const collExpr = elem.ops[1];
+        let collection;
+        if (isFunction2(collExpr, "Range")) {
+          collection = _BaseCompiler.compileRangeIterable(collExpr, bodyTarget2);
+        } else {
+          collection = _BaseCompiler.compile(collExpr, bodyTarget2);
+        }
+        inner = `for (const ${name} of ${collection}) { ${inner} }`;
+      }
+      return `(() => { const result = []; ${inner} return result; })()`;
+    }
+    const indexing = elements[0];
     if (!isFunction2(indexing, "Element"))
       throw new Error("Loop: expected Element(index, Range(lo, hi))");
     const indexExpr = indexing.ops[0];
@@ -54485,13 +55590,72 @@ var BaseCompiler = class _BaseCompiler {
       ...target,
       var: (id) => id === index ? needsWrap ? target.number(0).replace("0", index) : index : target.var(id)
     };
-    const bodyStmts = _BaseCompiler.compileLoopBody(args[0], bodyTarget);
+    const bodyStmts = _BaseCompiler.compileLoopBody(body, bodyTarget);
     return `(() => {${target.ws(
       "\n"
     )}for (let ${index} = ${lower}; ${index} <= ${upper}; ${index}++) {${target.ws(
       "\n"
     )}${bodyStmts}${target.ws("\n")}}${target.ws("\n")}})()`;
   }
+  /**
+   * Returns `true` when the given collection expression is a `Range` whose
+   * runtime semantics match the legacy imperative for-loop shape
+   * `for (let i = lo; i <= hi; i++)`.
+   *
+   * Concretely: integer-ascending bounds and step omitted-or-1. When bounds
+   * are not statically numeric we accept the Range (the historical
+   * behaviour) — runtime mismatch in the descending-unknown-bounds case is
+   * left as a known limitation; callers can force the iterable path by
+   * supplying an explicit step.
+   */
+  static isLegacyCompatibleRange(coll) {
+    if (!isFunction2(coll, "Range")) return false;
+    if (coll.ops.length >= 3) {
+      const stepExpr = coll.ops[2];
+      if (!isNumber(stepExpr) || stepExpr.re !== 1) return false;
+    }
+    const lo = coll.ops[0];
+    const hi = coll.ops[1];
+    if (isNumber(lo) && !Number.isInteger(lo.re)) return false;
+    if (isNumber(hi) && !Number.isInteger(hi.re)) return false;
+    if (isNumber(lo) && isNumber(hi) && lo.re > hi.re) return false;
+    return true;
+  }
+  /**
+   * Compile a `Range(lo, hi)` or `Range(lo, hi, step)` expression into a JS
+   * iterable expression. Mirrors the runtime semantics in
+   * `library/collections.ts` Range:
+   *     count    = step === 0 ? 0 : max(0, floor((hi - lo) / step) + 1)
+   *     element  = lo + step * k          (0-indexed)
+   * Default step is 1 when omitted. Bounds and step may be fractional.
+   *
+   * Only used from the comprehension path in `compileForLoop`.
+   * Caller must have already verified `isFunction(rangeExpr, 'Range')`.
+   */
+  static compileRangeIterable(rangeExpr, target) {
+    const loExpr = rangeExpr.ops[0];
+    const hiExpr = rangeExpr.ops[1];
+    const stepExpr = rangeExpr.ops[2];
+    if (isNumber(loExpr) && isNumber(hiExpr) && (stepExpr === void 0 || isNumber(stepExpr))) {
+      const lo2 = loExpr.re;
+      const hi2 = hiExpr.re;
+      const step2 = stepExpr === void 0 ? hi2 >= lo2 ? 1 : -1 : stepExpr.re;
+      if (step2 === 0) return "[]";
+      const len = Math.max(0, Math.floor((hi2 - lo2) / step2) + 1);
+      if (step2 === 1) {
+        if (lo2 === 0) return `Array.from({length:${len}},(_,k)=>k)`;
+        return `Array.from({length:${len}},(_,k)=>${lo2}+k)`;
+      }
+      return `Array.from({length:${len}},(_,k)=>${lo2}+(${step2})*k)`;
+    }
+    const lo = _BaseCompiler.compile(loExpr, target);
+    const hi = _BaseCompiler.compile(hiExpr, target);
+    if (stepExpr === void 0) {
+      return `((_lo,_hi)=>{const _st=_hi>=_lo?1:-1;return Array.from({length:Math.max(0,Math.floor((_hi-_lo)/_st)+1)},(_,k)=>_lo+_st*k);})(${lo},${hi})`;
+    }
+    const step = _BaseCompiler.compile(stepExpr, target);
+    return `((_lo,_hi,_st)=>_st===0?[]:Array.from({length:Math.max(0,Math.floor((_hi-_lo)/_st)+1)},(_,k)=>_lo+_st*k))(${lo},${hi},${step})`;
+  }
   /**
    * Compile a loop body expression as statements (not wrapped in IIFE).
    * Handles Break, Continue, Return as statements, and If as if-else when
@@ -54922,8 +56086,7 @@ function compile(expr2, options) {
         ce.pushScope();
         try {
           if (vars && typeof vars === "object") {
-            for (const [k, v] of Object.entries(vars))
-              ce.assign(k, v);
+            for (const [k, v] of Object.entries(vars)) ce.assign(k, v);
           }
           return expr2.evaluate().re;
         } finally {
@@ -60153,8 +61316,7 @@ function tryGetComplexParts(expr2, compile3) {
         return { re: null, im: formatFloat(iScale) };
       }
       const compiledFactors = remaining.map((r) => compile3(r));
-      if (iScale !== 1)
-        compiledFactors.unshift(formatFloat(iScale));
+      if (iScale !== 1) compiledFactors.unshift(formatFloat(iScale));
       const imCode = foldTerms(compiledFactors, "1.0", "*");
       return { re: null, im: imCode };
     }
@@ -60758,39 +61920,130 @@ var JAVASCRIPT_FUNCTIONS = {
     if (args.length >= 2)
       return `_SYS.colormap(${compile3(args[0])}, ${compile3(args[1])})`;
     return `_SYS.colormap(${compile3(args[0])})`;
+  },
+  // -----------------------------------------------------------------------
+  // Color constructor heads. All compile to OKLCh arrays at runtime — the
+  // canonical color representation in this target. The constructors take
+  // their own colorspace's components and convert internally.
+  // (Mirrors the GPU target's design: color values are vec3 OKLCh.)
+  // -----------------------------------------------------------------------
+  Rgb: (args, compile3) => {
+    if (args.length < 3) throw new Error("Rgb: need 3 components");
+    return `_SYS.rgb(${args.map(compile3).join(", ")})`;
+  },
+  Hsv: (args, compile3) => {
+    if (args.length < 3) throw new Error("Hsv: need 3 components");
+    return `_SYS.hsv(${args.map(compile3).join(", ")})`;
+  },
+  Hsl: (args, compile3) => {
+    if (args.length < 3) throw new Error("Hsl: need 3 components");
+    return `_SYS.hsl(${args.map(compile3).join(", ")})`;
+  },
+  Oklab: (args, compile3) => {
+    if (args.length < 3) throw new Error("Oklab: need 3 components");
+    return `_SYS.oklab(${args.map(compile3).join(", ")})`;
+  },
+  Oklch: (args, compile3) => {
+    if (args.length < 3) throw new Error("Oklch: need 3 components");
+    return `_SYS.oklch(${args.map(compile3).join(", ")})`;
+  },
+  // -----------------------------------------------------------------------
+  // As* converters. Compile-time output convention matches the engine and
+  // the GPU target: each returns components in the named space as a 3- or
+  // 4-element array. `AsRgb` uses 0-1 sRGB channels (consistent across all
+  // layers). `AsOklch` is the identity (canonical form).
+  // -----------------------------------------------------------------------
+  AsRgb: ([c], compile3) => {
+    if (c === null) throw new Error("AsRgb: no argument");
+    return `_SYS.asRgb(${compile3(c)})`;
+  },
+  AsHsv: ([c], compile3) => {
+    if (c === null) throw new Error("AsHsv: no argument");
+    return `_SYS.asHsv(${compile3(c)})`;
+  },
+  AsHsl: ([c], compile3) => {
+    if (c === null) throw new Error("AsHsl: no argument");
+    return `_SYS.asHsl(${compile3(c)})`;
+  },
+  AsOklab: ([c], compile3) => {
+    if (c === null) throw new Error("AsOklab: no argument");
+    return `_SYS.asOklab(${compile3(c)})`;
+  },
+  AsOklch: ([c], compile3) => {
+    if (c === null) throw new Error("AsOklch: no argument");
+    return compile3(c);
+  },
+  // Perceptual color difference (ΔE_OK).
+  ColorDelta: ([a, b], compile3) => {
+    if (a === null || b === null)
+      throw new Error("ColorDelta: need two colors");
+    return `_SYS.colorDelta(${compile3(a)}, ${compile3(b)})`;
+  },
+  // Euclidean distance between two tuples (any positive dimension).
+  // The GPU target maps `Distance` to the GLSL/WGSL `distance()` builtin
+  // (vec-only); this JS handler works on plain arrays of any length.
+  Distance: ([a, b], compile3) => {
+    if (a === null || b === null) throw new Error("Distance: need two points");
+    return `_SYS.distance(${compile3(a)}, ${compile3(b)})`;
   }
 };
 function toRI(c) {
   return { re: c.re, im: c.im };
 }
+function normalizeAlpha2(a) {
+  if (a === void 0) return void 0;
+  if (!Number.isFinite(a)) return void 0;
+  if (Math.abs(a - 1) < 1e-9) return void 0;
+  return a;
+}
 function toRgb255(input) {
   if (typeof input === "string") {
     const c = parseColor(input);
-    return {
+    const rgb2 = {
       r: c >>> 24 & 255,
       g: c >>> 16 & 255,
-      b: c >>> 8 & 255,
-      alpha: (c & 255) / 255
+      b: c >>> 8 & 255
     };
+    const alpha = normalizeAlpha2((c & 255) / 255);
+    if (alpha !== void 0) rgb2.alpha = alpha;
+    return rgb2;
+  }
+  const rgb = oklchToRgb({ L: input[0], C: input[1], H: input[2] });
+  if (input.length >= 4) {
+    const alpha = normalizeAlpha2(input[3]);
+    if (alpha !== void 0) rgb.alpha = alpha;
   }
-  const rgb = {
-    r: input[0] * 255,
-    g: input[1] * 255,
-    b: input[2] * 255
-  };
-  if (input.length >= 4) rgb.alpha = input[3];
   return rgb;
 }
-function packedToArray(c) {
-  const r = (c >>> 24 & 255) / 255;
-  const g = (c >>> 16 & 255) / 255;
-  const b = (c >>> 8 & 255) / 255;
-  const a = (c & 255) / 255;
-  return Math.abs(a - 1) < 1e-4 ? [r, g, b] : [r, g, b, a];
+function toOklch2(input) {
+  if (typeof input === "string") {
+    const c = parseColor(input);
+    const r = c >>> 24 & 255;
+    const g = c >>> 16 & 255;
+    const b = c >>> 8 & 255;
+    const oklch2 = rgbToOklch({ r, g, b });
+    const alpha = normalizeAlpha2((c & 255) / 255);
+    if (alpha !== void 0) oklch2.alpha = alpha;
+    return oklch2;
+  }
+  return {
+    L: input[0],
+    C: input[1],
+    H: input[2],
+    alpha: input.length >= 4 ? normalizeAlpha2(input[3]) : void 0
+  };
+}
+function packedToOklch(c) {
+  const r = c >>> 24 & 255;
+  const g = c >>> 16 & 255;
+  const b = c >>> 8 & 255;
+  const oklch2 = rgbToOklch({ r, g, b });
+  const alpha = normalizeAlpha2((c & 255) / 255);
+  return alpha !== void 0 ? [oklch2.L, oklch2.C, oklch2.H, alpha] : [oklch2.L, oklch2.C, oklch2.H];
 }
 var colorHelpers = {
   color(input) {
-    return packedToArray(parseColor(input));
+    return packedToOklch(parseColor(input));
   },
   colorToString(input, format) {
     const rgb = toRgb255(input);
@@ -60801,7 +62054,7 @@ var colorHelpers = {
         const g = Math.round(Math.max(0, Math.min(255, rgb.g)));
         const b = Math.round(Math.max(0, Math.min(255, rgb.b)));
         let hex = `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b.toString(16).padStart(2, "0")}`;
-        if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4) {
+        if (rgb.alpha !== void 0) {
           const a = Math.round(Math.max(0, Math.min(255, rgb.alpha * 255)));
           hex += a.toString(16).padStart(2, "0");
         }
@@ -60811,7 +62064,7 @@ var colorHelpers = {
         const r = Math.round(rgb.r);
         const g = Math.round(rgb.g);
         const b = Math.round(rgb.b);
-        if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
+        if (rgb.alpha !== void 0)
           return `rgb(${r} ${g} ${b} / ${rgb.alpha})`;
         return `rgb(${r} ${g} ${b})`;
       }
@@ -60820,7 +62073,7 @@ var colorHelpers = {
         const h = Math.round(hsl.h * 10) / 10;
         const s = Math.round(hsl.s * 1e3) / 10;
         const l = Math.round(hsl.l * 1e3) / 10;
-        if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
+        if (rgb.alpha !== void 0)
           return `hsl(${h} ${s}% ${l}% / ${rgb.alpha})`;
         return `hsl(${h} ${s}% ${l}%)`;
       }
@@ -60829,7 +62082,7 @@ var colorHelpers = {
         const L = Math.round(c.L * 1e3) / 1e3;
         const C = Math.round(c.C * 1e3) / 1e3;
         const H = Math.round(c.H * 10) / 10;
-        if (rgb.alpha !== void 0 && Math.abs(rgb.alpha - 1) > 1e-4)
+        if (rgb.alpha !== void 0)
           return `oklch(${L} ${C} ${H} / ${rgb.alpha})`;
         return `oklch(${L} ${C} ${H})`;
       }
@@ -60838,29 +62091,29 @@ var colorHelpers = {
     }
   },
   colorMix(input1, input2, ratio = 0.5) {
-    const rgb1 = toRgb255(input1);
-    const rgb2 = toRgb255(input2);
+    const c1 = toOklch2(input1);
+    const c2 = toOklch2(input2);
     ratio = Math.max(0, Math.min(1, ratio));
-    const c1 = rgbToOklch(rgb1);
-    const c2 = rgbToOklch(rgb2);
-    let dh = c2.H - c1.H;
-    if (dh > 180) dh -= 360;
-    if (dh < -180) dh += 360;
-    let H = c1.H + dh * ratio;
-    if (H < 0) H += 360;
-    if (H >= 360) H -= 360;
-    const mixed = oklchToRgb({
-      L: c1.L + (c2.L - c1.L) * ratio,
-      C: c1.C + (c2.C - c1.C) * ratio,
-      H
-    });
-    const r = mixed.r / 255;
-    const g = mixed.g / 255;
-    const b = mixed.b / 255;
-    const a1 = rgb1.alpha ?? 1;
-    const a2 = rgb2.alpha ?? 1;
-    const alpha = a1 + (a2 - a1) * ratio;
-    return Math.abs(alpha - 1) > 1e-4 ? [r, g, b, alpha] : [r, g, b];
+    const c1Achromatic = c1.C < 1e-6;
+    const c2Achromatic = c2.C < 1e-6;
+    let H;
+    if (c1Achromatic && c2Achromatic) H = c1.H;
+    else if (c1Achromatic) H = c2.H;
+    else if (c2Achromatic) H = c1.H;
+    else {
+      let dh = c2.H - c1.H;
+      if (dh > 180) dh -= 360;
+      if (dh < -180) dh += 360;
+      H = c1.H + dh * ratio;
+      if (H < 0) H += 360;
+      if (H >= 360) H -= 360;
+    }
+    const L = c1.L + (c2.L - c1.L) * ratio;
+    const C = c1.C + (c2.C - c1.C) * ratio;
+    const a1 = c1.alpha ?? 1;
+    const a2 = c2.alpha ?? 1;
+    const alpha = normalizeAlpha2(a1 + (a2 - a1) * ratio);
+    return alpha !== void 0 ? [L, C, H, alpha] : [L, C, H];
   },
   colorContrast(bg, fg) {
     return apca(toRgb255(bg), toRgb255(fg));
@@ -60868,11 +62121,11 @@ var colorHelpers = {
   contrastingColor(bg, fg1, fg2) {
     const bgRgb = toRgb255(bg);
     if (fg1 !== void 0 && fg2 !== void 0) {
-      return packedToArray(
+      return packedToOklch(
         contrastingColor({ bg: bgRgb, fg1: toRgb255(fg1), fg2: toRgb255(fg2) })
       );
     }
-    return packedToArray(contrastingColor(bgRgb));
+    return packedToOklch(contrastingColor(bgRgb));
   },
   colorToColorspace(input, space) {
     const rgb = toRgb255(input);
@@ -60901,7 +62154,7 @@ var colorHelpers = {
       default:
         throw new Error(`Unknown color space: ${space}`);
     }
-    if (alpha !== void 0 && Math.abs(alpha - 1) > 1e-4) result.push(alpha);
+    if (alpha !== void 0) result.push(alpha);
     return result;
   },
   colormap(name, arg) {
@@ -60913,7 +62166,7 @@ var colorHelpers = {
     const palette = allPalettes[name];
     if (!palette) throw new Error(`Unknown palette: ${name}`);
     const colors = palette.map(
-      (hex) => parseColorToRgb01(hex)
+      (hex) => packedToOklch(parseColor(hex))
     );
     if (arg === void 0) return colors;
     if (Number.isInteger(arg) && arg >= 2) {
@@ -60937,62 +62190,128 @@ var colorHelpers = {
     const frac = pos - i;
     if (frac === 0 || i >= colors.length - 1)
       return [...colors[Math.min(i, colors.length - 1)]];
-    const rgb1 = {
-      r: colors[i][0] * 255,
-      g: colors[i][1] * 255,
-      b: colors[i][2] * 255
-    };
-    const rgb2 = {
-      r: colors[i + 1][0] * 255,
-      g: colors[i + 1][1] * 255,
-      b: colors[i + 1][2] * 255
-    };
-    const c1 = rgbToOklch(rgb1);
-    const c2 = rgbToOklch(rgb2);
-    let dh = c2.H - c1.H;
-    if (dh > 180) dh -= 360;
-    if (dh < -180) dh += 360;
-    let H = c1.H + dh * frac;
-    if (H < 0) H += 360;
-    if (H >= 360) H -= 360;
-    const mixed = oklchToRgb({
-      L: c1.L + (c2.L - c1.L) * frac,
-      C: c1.C + (c2.C - c1.C) * frac,
-      H
-    });
-    return [mixed.r / 255, mixed.g / 255, mixed.b / 255];
+    const [L1, C1, H1] = colors[i];
+    const [L2, C2, H2] = colors[i + 1];
+    const c1Achromatic = C1 < 1e-6;
+    const c2Achromatic = C2 < 1e-6;
+    let H;
+    if (c1Achromatic && c2Achromatic) H = H1;
+    else if (c1Achromatic) H = H2;
+    else if (c2Achromatic) H = H1;
+    else {
+      let dh = H2 - H1;
+      if (dh > 180) dh -= 360;
+      if (dh < -180) dh += 360;
+      H = H1 + dh * frac;
+      if (H < 0) H += 360;
+      if (H >= 360) H -= 360;
+    }
+    return [L1 + (L2 - L1) * frac, C1 + (C2 - C1) * frac, H];
   },
   colorFromColorspace(components, space) {
     const c0 = components[0];
     const c1 = components[1];
     const c2 = components[2];
     const alpha = components.length >= 4 ? components[3] : void 0;
-    let result;
+    let oklch2;
     switch (space.toLowerCase()) {
       case "rgb":
-        result = [c0, c1, c2];
+        oklch2 = rgbToOklch({ r: c0 * 255, g: c1 * 255, b: c2 * 255 });
         break;
       case "hsl": {
-        const r = hslToRgb(c0, c1, c2);
-        result = [r.r / 255, r.g / 255, r.b / 255];
+        const rgb = hslToRgb(c0, c1, c2);
+        oklch2 = rgbToOklch(rgb);
         break;
       }
-      case "oklch": {
-        const r = oklchToRgb({ L: c0, C: c1, H: c2 });
-        result = [r.r / 255, r.g / 255, r.b / 255];
+      case "oklch":
+        oklch2 = { L: c0, C: c1, H: c2 };
         break;
-      }
       case "oklab":
-      case "lab": {
-        const r = oklabToRgb({ L: c0, a: c1, b: c2 });
-        result = [r.r / 255, r.g / 255, r.b / 255];
+      case "lab":
+        oklch2 = oklabToOklch({ L: c0, a: c1, b: c2 });
         break;
-      }
       default:
         throw new Error(`Unknown color space: ${space}`);
     }
-    if (alpha !== void 0 && Math.abs(alpha - 1) > 1e-4) result.push(alpha);
-    return result;
+    return alpha !== void 0 ? [oklch2.L, oklch2.C, oklch2.H, alpha] : [oklch2.L, oklch2.C, oklch2.H];
+  },
+  // -----------------------------------------------------------------------
+  // Color constructors. Each accepts components in its colorspace's natural
+  // units and returns the canonical OKLCh array `[L, C, H]` (or with alpha).
+  // -----------------------------------------------------------------------
+  rgb(r, g, b, alpha) {
+    const c = rgbToOklch({ r: r * 255, g: g * 255, b: b * 255 });
+    const a = normalizeAlpha2(alpha);
+    return a !== void 0 ? [c.L, c.C, c.H, a] : [c.L, c.C, c.H];
+  },
+  hsv(h, s, v, alpha) {
+    const rgb = hsvToRgb(h, s, v);
+    const c = rgbToOklch(rgb);
+    const a = normalizeAlpha2(alpha);
+    return a !== void 0 ? [c.L, c.C, c.H, a] : [c.L, c.C, c.H];
+  },
+  hsl(h, s, l, alpha) {
+    const rgb = hslToRgb(h, s, l);
+    const c = rgbToOklch({ r: rgb.r, g: rgb.g, b: rgb.b });
+    const a = normalizeAlpha2(alpha);
+    return a !== void 0 ? [c.L, c.C, c.H, a] : [c.L, c.C, c.H];
+  },
+  oklab(L, a, b, alpha) {
+    const c = oklabToOklch({ L, a, b });
+    const al = normalizeAlpha2(alpha);
+    return al !== void 0 ? [c.L, c.C, c.H, al] : [c.L, c.C, c.H];
+  },
+  oklch(L, C, H, alpha) {
+    const a = normalizeAlpha2(alpha);
+    return a !== void 0 ? [L, C, H, a] : [L, C, H];
+  },
+  // -----------------------------------------------------------------------
+  // As* converters. Inputs are anything `toOklch` accepts (string, packed
+  // int, or OKLCh array). Outputs are 3- or 4-element arrays in the named
+  // space. sRGB-based outputs (asRgb/asHsv/asHsl) use 0-1 channels for
+  // consistency with the GPU target's shader convention.
+  // -----------------------------------------------------------------------
+  asRgb(input) {
+    const rgb = toRgb255(input);
+    const r = rgb.r / 255;
+    const g = rgb.g / 255;
+    const b = rgb.b / 255;
+    return rgb.alpha !== void 0 ? [r, g, b, rgb.alpha] : [r, g, b];
+  },
+  asHsv(input) {
+    const rgb = toRgb255(input);
+    const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);
+    return rgb.alpha !== void 0 ? [hsv.h, hsv.s, hsv.v, rgb.alpha] : [hsv.h, hsv.s, hsv.v];
+  },
+  asHsl(input) {
+    const rgb = toRgb255(input);
+    const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
+    return rgb.alpha !== void 0 ? [hsl.h, hsl.s, hsl.l, rgb.alpha] : [hsl.h, hsl.s, hsl.l];
+  },
+  asOklab(input) {
+    const c = toOklch2(input);
+    const lab = oklchToOklab({ L: c.L, C: c.C, H: c.H });
+    return c.alpha !== void 0 ? [lab.L, lab.a, lab.b, c.alpha] : [lab.L, lab.a, lab.b];
+  },
+  // asOklch is identity — handled at compile time as a pass-through
+  // Perceptual color difference (ΔE_OK).
+  colorDelta(a, b) {
+    const labA = oklchToOklab(toOklch2(a));
+    const labB = oklchToOklab(toOklch2(b));
+    return oklabDeltaE(labA, labB);
+  },
+  // Euclidean distance between two tuples. Plain numeric — not a color
+  // operation despite living in the same helpers block.
+  distance(a, b) {
+    if (!Array.isArray(a) || !Array.isArray(b))
+      throw new Error("Distance: expected two arrays");
+    if (a.length !== b.length) throw new Error("Distance: dimension mismatch");
+    let sumSq = 0;
+    for (let i = 0; i < a.length; i++) {
+      const d = a[i] - b[i];
+      sumSq += d * d;
+    }
+    return Math.sqrt(sumSq);
   }
 };
 var SYS_HELPERS = {
@@ -61431,6 +62750,13 @@ var GPU_OPERATORS = {
 function gpuVec2(target) {
   return target?.language === "wgsl" ? "vec2f" : "vec2";
 }
+function gpuVec3(target) {
+  return target?.language === "wgsl" ? "vec3f" : "vec3";
+}
+function readStringLiteral(expr2) {
+  if (!isString(expr2)) return null;
+  return expr2.string?.toLowerCase() ?? null;
+}
 function compileIntArg(expr2, compile3, target) {
   const c = tryGetConstant(expr2);
   if (c !== void 0 && Number.isInteger(c)) return c.toString();
@@ -61489,7 +62815,7 @@ function compileGPUSumProduct(kind, args, _compile2, target) {
     `for (${indexDecl} = ${lowerStr}; ${index} <= ${upperStr}; ${index}++) {`,
     `  ${acc} ${op}= ${body};`,
     `}`,
-    `return ${acc}`
+    `return ${acc};`
   ];
   return lines.join("\n");
 }
@@ -61543,8 +62869,7 @@ var GPU_FUNCTIONS = {
       const iScale = isSymbol2(iFactor, "ImaginaryUnit") ? 1 : iFactor.im;
       const realFactors = args.filter((_, i) => i !== iIndex);
       const v2 = gpuVec2(target);
-      if (realFactors.length === 0)
-        return `${v2}(0.0, ${formatFloat(iScale)})`;
+      if (realFactors.length === 0) return `${v2}(0.0, ${formatFloat(iScale)})`;
       const factors = realFactors.map((f) => compile3(f));
       if (iScale !== 1) factors.unshift(formatFloat(iScale));
       const imCode = foldTerms(factors, "1.0", "*");
@@ -61597,8 +62922,7 @@ var GPU_FUNCTIONS = {
     if (isNumber(x) && x.im !== 0) {
       return `${gpuVec2(target)}(${formatFloat(-x.re)}, ${formatFloat(-x.im)})`;
     }
-    if (isSymbol2(x, "ImaginaryUnit"))
-      return `${gpuVec2(target)}(0.0, -1.0)`;
+    if (isSymbol2(x, "ImaginaryUnit")) return `${gpuVec2(target)}(0.0, -1.0)`;
     return `(-${compile3(x)})`;
   },
   // Standard math functions with complex dispatch
@@ -61971,17 +63295,127 @@ var GPU_FUNCTIONS = {
     }
     const isWGSL = target?.language === "wgsl";
     const v3 = isWGSL ? "vec3f" : "vec3";
-    return `((_gpu_apca(${bg}, ${v3}(0.0)) > 50.0) ? ${v3}(0.0) : ${v3}(1.0))`;
+    const black = `${v3}(0.0)`;
+    const white = `${v3}(1.0, 0.0, 0.0)`;
+    return `((_gpu_apca(${bg}, ${black}) > 50.0) ? ${black} : ${white})`;
   },
   ColorToColorspace: ([color, space], compile3) => {
     if (color === null || space === null)
       throw new Error("ColorToColorspace: need color and space");
-    return `_gpu_srgb_to_oklab(${compile3(color)})`;
+    const spaceName = readStringLiteral(space);
+    if (spaceName === null)
+      throw new Error("ColorToColorspace: space must be a string literal");
+    const c = compile3(color);
+    switch (spaceName) {
+      case "oklch":
+        return c;
+      case "oklab":
+      case "lab":
+        return `_gpu_oklch_to_oklab(${c})`;
+      case "rgb":
+        return `_gpu_oklch_to_srgb(${c})`;
+      case "hsl":
+        return `_gpu_rgb_to_hsl(_gpu_oklch_to_srgb(${c}))`;
+      case "hsv":
+        return `_gpu_rgb_to_hsv(_gpu_oklch_to_srgb(${c}))`;
+      default:
+        throw new Error(
+          `ColorToColorspace: unsupported space "${spaceName}" on GPU target`
+        );
+    }
   },
   ColorFromColorspace: ([components, space], compile3) => {
     if (components === null || space === null)
       throw new Error("ColorFromColorspace: need components and space");
-    return `_gpu_oklab_to_srgb(${compile3(components)})`;
+    const spaceName = readStringLiteral(space);
+    if (spaceName === null)
+      throw new Error("ColorFromColorspace: space must be a string literal");
+    const c = compile3(components);
+    switch (spaceName) {
+      case "oklch":
+        return c;
+      case "oklab":
+      case "lab":
+        return `_gpu_oklab_to_oklch(${c})`;
+      case "rgb":
+        return `_gpu_srgb_to_oklch(${c})`;
+      case "hsl":
+        return `_gpu_srgb_to_oklch(_gpu_hsl_to_rgb(${c}))`;
+      case "hsv":
+        return `_gpu_srgb_to_oklch(_gpu_hsv_to_rgb(${c}))`;
+      default:
+        throw new Error(
+          `ColorFromColorspace: unsupported space "${spaceName}" on GPU target`
+        );
+    }
+  },
+  // ---------------------------------------------------------------------------
+  // Color literals. Each typed head compiles to a canonical OKLCh vec3.
+  // Alpha (4th argument) is dropped — GPU color values are vec3 only. Pass
+  // alpha as a separate uniform if it's needed at the framebuffer boundary.
+  // ---------------------------------------------------------------------------
+  Color: ([s], _compile2, target) => {
+    if (s === null) throw new Error("Color: no argument");
+    const str = readStringLiteral(s);
+    if (str === null)
+      throw new Error("Color: argument must be a string literal on GPU target");
+    const packed = parseColor(str);
+    if (packed === 0 && str.trim().toLowerCase() !== "transparent")
+      throw new Error(`Color: invalid color string "${str}"`);
+    const r = packed >>> 24 & 255;
+    const g = packed >>> 16 & 255;
+    const b = packed >>> 8 & 255;
+    const oklch2 = rgbToOklch({ r, g, b });
+    return `${gpuVec3(target)}(${formatFloat(oklch2.L)}, ${formatFloat(oklch2.C)}, ${formatFloat(oklch2.H)})`;
+  },
+  Rgb: (args, compile3, target) => {
+    if (args.length < 3) throw new Error("Rgb: need 3 components");
+    const v3 = gpuVec3(target);
+    return `_gpu_srgb_to_oklch(${v3}(${compile3(args[0])}, ${compile3(args[1])}, ${compile3(args[2])}))`;
+  },
+  Hsv: (args, compile3, target) => {
+    if (args.length < 3) throw new Error("Hsv: need 3 components");
+    const v3 = gpuVec3(target);
+    return `_gpu_srgb_to_oklch(_gpu_hsv_to_rgb(${v3}(${compile3(args[0])}, ${compile3(args[1])}, ${compile3(args[2])})))`;
+  },
+  Hsl: (args, compile3, target) => {
+    if (args.length < 3) throw new Error("Hsl: need 3 components");
+    const v3 = gpuVec3(target);
+    return `_gpu_srgb_to_oklch(_gpu_hsl_to_rgb(${v3}(${compile3(args[0])}, ${compile3(args[1])}, ${compile3(args[2])})))`;
+  },
+  Oklab: (args, compile3, target) => {
+    if (args.length < 3) throw new Error("Oklab: need 3 components");
+    const v3 = gpuVec3(target);
+    return `_gpu_oklab_to_oklch(${v3}(${compile3(args[0])}, ${compile3(args[1])}, ${compile3(args[2])}))`;
+  },
+  Oklch: (args, compile3, target) => {
+    if (args.length < 3) throw new Error("Oklch: need 3 components");
+    const v3 = gpuVec3(target);
+    return `${v3}(${compile3(args[0])}, ${compile3(args[1])}, ${compile3(args[2])})`;
+  },
+  // ---------------------------------------------------------------------------
+  // As* operators. AsOklch is identity (canonical). The other As* return
+  // components in the named space, equivalent to ColorToColorspace(c, 'x').
+  // ---------------------------------------------------------------------------
+  AsOklch: ([c], compile3) => {
+    if (c === null) throw new Error("AsOklch: no argument");
+    return compile3(c);
+  },
+  AsOklab: ([c], compile3) => {
+    if (c === null) throw new Error("AsOklab: no argument");
+    return `_gpu_oklch_to_oklab(${compile3(c)})`;
+  },
+  AsRgb: ([c], compile3) => {
+    if (c === null) throw new Error("AsRgb: no argument");
+    return `_gpu_oklch_to_srgb(${compile3(c)})`;
+  },
+  AsHsv: ([c], compile3) => {
+    if (c === null) throw new Error("AsHsv: no argument");
+    return `_gpu_rgb_to_hsv(_gpu_oklch_to_srgb(${compile3(c)}))`;
+  },
+  AsHsl: ([c], compile3) => {
+    if (c === null) throw new Error("AsHsl: no argument");
+    return `_gpu_rgb_to_hsl(_gpu_oklch_to_srgb(${compile3(c)}))`;
   },
   // Fractal functions
   Mandelbrot: ([c, maxIter], compile3, target) => {
@@ -62674,28 +64108,124 @@ vec3 _gpu_oklab_to_srgb(vec3 lab) {
 
 vec3 _gpu_oklab_to_oklch(vec3 lab) {
   float C = length(lab.yz);
-  float H = atan(lab.z, lab.y);
+  float H = atan(lab.z, lab.y) * (180.0 / 3.14159265359);
+  if (H < 0.0) H += 360.0;
   return vec3(lab.x, C, H);
 }
 
 vec3 _gpu_oklch_to_oklab(vec3 lch) {
-  return vec3(lch.x, lch.y * cos(lch.z), lch.y * sin(lch.z));
+  float h_rad = lch.z * (3.14159265359 / 180.0);
+  return vec3(lch.x, lch.y * cos(h_rad), lch.y * sin(h_rad));
+}
+
+vec3 _gpu_srgb_to_oklch(vec3 rgb) {
+  return _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb));
+}
+
+vec3 _gpu_oklch_to_srgb(vec3 lch) {
+  return _gpu_oklab_to_srgb(_gpu_oklch_to_oklab(lch));
+}
+
+// HSL conversion. Hue in degrees, saturation/lightness in 0-1.
+vec3 _gpu_hsl_to_rgb(vec3 hsl) {
+  float h = hsl.x;
+  float s = hsl.y;
+  float l = hsl.z;
+  float c = (1.0 - abs(2.0 * l - 1.0)) * s;
+  float h6 = h / 60.0;
+  float x = c * (1.0 - abs(mod(h6, 2.0) - 1.0));
+  float r = 0.0;
+  float g = 0.0;
+  float b = 0.0;
+  if (h6 < 1.0)      { r = c; g = x; b = 0.0; }
+  else if (h6 < 2.0) { r = x; g = c; b = 0.0; }
+  else if (h6 < 3.0) { r = 0.0; g = c; b = x; }
+  else if (h6 < 4.0) { r = 0.0; g = x; b = c; }
+  else if (h6 < 5.0) { r = x; g = 0.0; b = c; }
+  else               { r = c; g = 0.0; b = x; }
+  float m = l - c / 2.0;
+  return vec3(r + m, g + m, b + m);
+}
+
+vec3 _gpu_rgb_to_hsl(vec3 rgb) {
+  float maxc = max(max(rgb.x, rgb.y), rgb.z);
+  float minc = min(min(rgb.x, rgb.y), rgb.z);
+  float l = (maxc + minc) / 2.0;
+  float d = maxc - minc;
+  if (d < 1e-6) return vec3(0.0, 0.0, l);
+  float s = d / (1.0 - abs(2.0 * l - 1.0));
+  float h;
+  if (maxc == rgb.x)      h = mod((rgb.y - rgb.z) / d, 6.0);
+  else if (maxc == rgb.y) h = (rgb.z - rgb.x) / d + 2.0;
+  else                    h = (rgb.x - rgb.y) / d + 4.0;
+  h *= 60.0;
+  if (h < 0.0) h += 360.0;
+  return vec3(h, s, l);
+}
+
+// HSV conversion. Hue in degrees, saturation/value in 0-1.
+vec3 _gpu_hsv_to_rgb(vec3 hsv) {
+  float h = hsv.x;
+  float s = hsv.y;
+  float v = hsv.z;
+  float c = v * s;
+  float h6 = h / 60.0;
+  float x = c * (1.0 - abs(mod(h6, 2.0) - 1.0));
+  float r = 0.0;
+  float g = 0.0;
+  float b = 0.0;
+  if (h6 < 1.0)      { r = c; g = x; b = 0.0; }
+  else if (h6 < 2.0) { r = x; g = c; b = 0.0; }
+  else if (h6 < 3.0) { r = 0.0; g = c; b = x; }
+  else if (h6 < 4.0) { r = 0.0; g = x; b = c; }
+  else if (h6 < 5.0) { r = x; g = 0.0; b = c; }
+  else               { r = c; g = 0.0; b = x; }
+  float m = v - c;
+  return vec3(r + m, g + m, b + m);
 }
 
-vec3 _gpu_color_mix(vec3 rgb1, vec3 rgb2, float t) {
-  vec3 lch1 = _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb1));
-  vec3 lch2 = _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb2));
+vec3 _gpu_rgb_to_hsv(vec3 rgb) {
+  float maxc = max(max(rgb.x, rgb.y), rgb.z);
+  float minc = min(min(rgb.x, rgb.y), rgb.z);
+  float v = maxc;
+  float d = maxc - minc;
+  if (d < 1e-6) return vec3(0.0, 0.0, v);
+  float s = (maxc < 1e-6) ? 0.0 : d / maxc;
+  float h;
+  if (maxc == rgb.x)      h = mod((rgb.y - rgb.z) / d, 6.0);
+  else if (maxc == rgb.y) h = (rgb.z - rgb.x) / d + 2.0;
+  else                    h = (rgb.x - rgb.y) / d + 4.0;
+  h *= 60.0;
+  if (h < 0.0) h += 360.0;
+  return vec3(h, s, v);
+}
+
+vec3 _gpu_color_mix(vec3 lch1, vec3 lch2, float t) {
   float L = mix(lch1.x, lch2.x, t);
   float C = mix(lch1.y, lch2.y, t);
-  float dh = lch2.z - lch1.z;
-  const float PI = 3.14159265359;
-  if (dh > PI) dh -= 2.0 * PI;
-  if (dh < -PI) dh += 2.0 * PI;
-  float H = lch1.z + dh * t;
-  return _gpu_oklab_to_srgb(_gpu_oklch_to_oklab(vec3(L, C, H)));
+  bool a1 = lch1.y < 1e-6;
+  bool a2 = lch2.y < 1e-6;
+  float H;
+  if (a1 && a2) {
+    H = lch1.z;
+  } else if (a1) {
+    H = lch2.z;
+  } else if (a2) {
+    H = lch1.z;
+  } else {
+    float dh = lch2.z - lch1.z;
+    if (dh > 180.0) dh -= 360.0;
+    if (dh < -180.0) dh += 360.0;
+    H = lch1.z + dh * t;
+    if (H < 0.0) H += 360.0;
+    if (H >= 360.0) H -= 360.0;
+  }
+  return vec3(L, C, H);
 }
 
-float _gpu_apca(vec3 bg, vec3 fg) {
+float _gpu_apca(vec3 lch_bg, vec3 lch_fg) {
+  vec3 bg = _gpu_oklch_to_srgb(lch_bg);
+  vec3 fg = _gpu_oklch_to_srgb(lch_fg);
   float bgR = _gpu_srgb_to_linear(bg.x);
   float bgG = _gpu_srgb_to_linear(bg.y);
   float bgB = _gpu_srgb_to_linear(bg.z);
@@ -62706,9 +64236,7 @@ float _gpu_apca(vec3 bg, vec3 fg) {
   float fgY = 0.2126729 * fgR + 0.7151522 * fgG + 0.0721750 * fgB;
   float bgC = pow(bgY, 0.56);
   float fgC = pow(fgY, 0.57);
-  float contrast = (bgC > fgC)
-    ? (bgC - fgC) * 1.14
-    : (bgC - fgC) * 1.14;
+  float contrast = (bgC - fgC) * 1.14;
   return contrast * 100.0;
 }
 `;
@@ -62752,28 +64280,133 @@ fn _gpu_oklab_to_srgb(lab: vec3f) -> vec3f {
 
 fn _gpu_oklab_to_oklch(lab: vec3f) -> vec3f {
   let C = length(lab.yz);
-  let H = atan2(lab.z, lab.y);
+  var H = atan2(lab.z, lab.y) * (180.0 / 3.14159265359);
+  if (H < 0.0) { H = H + 360.0; }
   return vec3f(lab.x, C, H);
 }
 
 fn _gpu_oklch_to_oklab(lch: vec3f) -> vec3f {
-  return vec3f(lch.x, lch.y * cos(lch.z), lch.y * sin(lch.z));
+  let h_rad = lch.z * (3.14159265359 / 180.0);
+  return vec3f(lch.x, lch.y * cos(h_rad), lch.y * sin(h_rad));
+}
+
+fn _gpu_srgb_to_oklch(rgb: vec3f) -> vec3f {
+  return _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb));
+}
+
+fn _gpu_oklch_to_srgb(lch: vec3f) -> vec3f {
+  return _gpu_oklab_to_srgb(_gpu_oklch_to_oklab(lch));
+}
+
+fn _gpu_hsl_to_rgb(hsl: vec3f) -> vec3f {
+  let h = hsl.x;
+  let s = hsl.y;
+  let l = hsl.z;
+  let c = (1.0 - abs(2.0 * l - 1.0)) * s;
+  let h6 = h / 60.0;
+  let x = c * (1.0 - abs((h6 - 2.0 * floor(h6 / 2.0)) - 1.0));
+  var r: f32 = 0.0;
+  var g: f32 = 0.0;
+  var b: f32 = 0.0;
+  if (h6 < 1.0)      { r = c; g = x; b = 0.0; }
+  else if (h6 < 2.0) { r = x; g = c; b = 0.0; }
+  else if (h6 < 3.0) { r = 0.0; g = c; b = x; }
+  else if (h6 < 4.0) { r = 0.0; g = x; b = c; }
+  else if (h6 < 5.0) { r = x; g = 0.0; b = c; }
+  else               { r = c; g = 0.0; b = x; }
+  let m = l - c / 2.0;
+  return vec3f(r + m, g + m, b + m);
+}
+
+fn _gpu_rgb_to_hsl(rgb: vec3f) -> vec3f {
+  let maxc = max(max(rgb.x, rgb.y), rgb.z);
+  let minc = min(min(rgb.x, rgb.y), rgb.z);
+  let l = (maxc + minc) / 2.0;
+  let d = maxc - minc;
+  if (d < 1e-6) { return vec3f(0.0, 0.0, l); }
+  let s = d / (1.0 - abs(2.0 * l - 1.0));
+  var h: f32;
+  if (maxc == rgb.x) {
+    let v = (rgb.y - rgb.z) / d;
+    h = v - 6.0 * floor(v / 6.0);
+  } else if (maxc == rgb.y) {
+    h = (rgb.z - rgb.x) / d + 2.0;
+  } else {
+    h = (rgb.x - rgb.y) / d + 4.0;
+  }
+  h = h * 60.0;
+  if (h < 0.0) { h = h + 360.0; }
+  return vec3f(h, s, l);
+}
+
+fn _gpu_hsv_to_rgb(hsv: vec3f) -> vec3f {
+  let h = hsv.x;
+  let s = hsv.y;
+  let v = hsv.z;
+  let c = v * s;
+  let h6 = h / 60.0;
+  let x = c * (1.0 - abs((h6 - 2.0 * floor(h6 / 2.0)) - 1.0));
+  var r: f32 = 0.0;
+  var g: f32 = 0.0;
+  var b: f32 = 0.0;
+  if (h6 < 1.0)      { r = c; g = x; b = 0.0; }
+  else if (h6 < 2.0) { r = x; g = c; b = 0.0; }
+  else if (h6 < 3.0) { r = 0.0; g = c; b = x; }
+  else if (h6 < 4.0) { r = 0.0; g = x; b = c; }
+  else if (h6 < 5.0) { r = x; g = 0.0; b = c; }
+  else               { r = c; g = 0.0; b = x; }
+  let m = v - c;
+  return vec3f(r + m, g + m, b + m);
 }
 
-fn _gpu_color_mix(rgb1: vec3f, rgb2: vec3f, t: f32) -> vec3f {
-  let lch1 = _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb1));
-  let lch2 = _gpu_oklab_to_oklch(_gpu_srgb_to_oklab(rgb2));
+fn _gpu_rgb_to_hsv(rgb: vec3f) -> vec3f {
+  let maxc = max(max(rgb.x, rgb.y), rgb.z);
+  let minc = min(min(rgb.x, rgb.y), rgb.z);
+  let v = maxc;
+  let d = maxc - minc;
+  if (d < 1e-6) { return vec3f(0.0, 0.0, v); }
+  var s: f32 = 0.0;
+  if (maxc >= 1e-6) { s = d / maxc; }
+  var h: f32;
+  if (maxc == rgb.x) {
+    let q = (rgb.y - rgb.z) / d;
+    h = q - 6.0 * floor(q / 6.0);
+  } else if (maxc == rgb.y) {
+    h = (rgb.z - rgb.x) / d + 2.0;
+  } else {
+    h = (rgb.x - rgb.y) / d + 4.0;
+  }
+  h = h * 60.0;
+  if (h < 0.0) { h = h + 360.0; }
+  return vec3f(h, s, v);
+}
+
+fn _gpu_color_mix(lch1: vec3f, lch2: vec3f, t: f32) -> vec3f {
   let L = mix(lch1.x, lch2.x, t);
   let C = mix(lch1.y, lch2.y, t);
-  let PI = 3.14159265359;
-  var dh = lch2.z - lch1.z;
-  if (dh > PI) { dh -= 2.0 * PI; }
-  if (dh < -PI) { dh += 2.0 * PI; }
-  let H = lch1.z + dh * t;
-  return _gpu_oklab_to_srgb(_gpu_oklch_to_oklab(vec3f(L, C, H)));
+  let a1 = lch1.y < 1e-6;
+  let a2 = lch2.y < 1e-6;
+  var H: f32;
+  if (a1 && a2) {
+    H = lch1.z;
+  } else if (a1) {
+    H = lch2.z;
+  } else if (a2) {
+    H = lch1.z;
+  } else {
+    var dh = lch2.z - lch1.z;
+    if (dh > 180.0) { dh = dh - 360.0; }
+    if (dh < -180.0) { dh = dh + 360.0; }
+    H = lch1.z + dh * t;
+    if (H < 0.0) { H = H + 360.0; }
+    if (H >= 360.0) { H = H - 360.0; }
+  }
+  return vec3f(L, C, H);
 }
 
-fn _gpu_apca(bg: vec3f, fg: vec3f) -> f32 {
+fn _gpu_apca(lch_bg: vec3f, lch_fg: vec3f) -> f32 {
+  let bg = _gpu_oklch_to_srgb(lch_bg);
+  let fg = _gpu_oklch_to_srgb(lch_fg);
   let bgR = _gpu_srgb_to_linear(bg.x);
   let bgG = _gpu_srgb_to_linear(bg.y);
   let bgB = _gpu_srgb_to_linear(bg.z);
@@ -63061,7 +64694,7 @@ var GPUShaderTarget = class {
         if (stmts.length === 0) return "";
         const last = stmts.length - 1;
         stmts[last] = `return ${stmts[last]}`;
-        return stmts.join(";\n");
+        return stmts.join(";\n") + ";";
       },
       ...options
     };
@@ -63160,7 +64793,7 @@ var GLSLTarget = class extends GPUShaderTarget {
     if (body.includes("\n")) {
       const indented = body.split("\n").map((l) => `  ${l}`).join("\n");
       return `${returnType} ${functionName}(${params}) {
-${indented};
+${indented}
 }`;
     }
     return `${returnType} ${functionName}(${params}) {
@@ -63271,7 +64904,7 @@ var WGSLTarget = class extends GPUShaderTarget {
       return `fn ${functionName}(${params}) -> ${toWGSLType(
         returnType
       )} {
-${indented};
+${indented}
 }`;
     }
     return `fn ${functionName}(${params}) -> ${toWGSLType(returnType)} {
@@ -67678,6 +69311,7 @@ var ComputeEngine = class _ComputeEngine {
     this.pushScope(void 0, "global");
     this._compilationTargets.registerDefaults();
     if (options?.latexSyntax) this._latexSyntax = options.latexSyntax;
+    if (options?.latexOptions) this._latexOptions = { ...options.latexOptions };
     hidePrivateProperties(this);
   }
   toJSON() {
@@ -68092,6 +69726,15 @@ var ComputeEngine = class _ComputeEngine {
   lookupDefinition(id) {
     return lookupDefinition(this, id);
   }
+  operatorInfo(head) {
+    const def = this.lookupDefinition(head);
+    if (!def || !isOperatorDef(def)) return void 0;
+    const op = def.operator;
+    return {
+      kind: op.evaluate || op.collection ? "function" : "opaque",
+      signature: op.signature
+    };
+  }
   /**
    * Associate a new definition to a symbol in the current context.
    *
@@ -68338,6 +69981,29 @@ var ComputeEngine = class _ComputeEngine {
       );
     return this._latexSyntax;
   }
+  /** @internal Engine-wide LaTeX parse/serialize options (e.g. decimalSeparator).
+   *  Merged into every `parse()` and `toLatex()` call between the LatexSyntax
+   *  instance defaults and any per-call overrides. */
+  _latexOptions = {};
+  /** Engine-wide LaTeX parse/serialize options.
+   *
+   * These options are merged into every `parse()` and `toLatex()` call.
+   * Precedence (most-specific wins):
+   *   1. LatexSyntax instance defaults (set at its construction)
+   *   2. `ce.latexOptions` (this property)
+   *   3. Per-call options passed to `ce.parse()` / `expr.toLatex()`
+   *
+   * Assigning replaces the whole bag. Use spread to merge:
+   * ```ts
+   * ce.latexOptions = { ...ce.latexOptions, decimalSeparator: '{,}' };
+   * ```
+   */
+  get latexOptions() {
+    return this._latexOptions;
+  }
+  set latexOptions(options) {
+    this._latexOptions = { ...options };
+  }
   parse(latex, options) {
     if (latex === null || latex === void 0) return null;
     if (typeof latex !== "string")
@@ -68345,7 +70011,6 @@ var ComputeEngine = class _ComputeEngine {
     const syntax = this._requireLatexSyntax();
     const { form, ...parseOpts } = options ?? {};
     const result = syntax.parse(latex, {
-      decimalSeparator: ".",
       getSymbolType: (id) => {
         const def = this.lookupDefinition(id);
         if (!def) return BoxedType.unknown;
@@ -68357,6 +70022,8 @@ var ComputeEngine = class _ComputeEngine {
         const def = this.lookupDefinition(id);
         return !!(isValueDef(def) && def.value.subscriptEvaluate);
       },
+      tolerance: this.tolerance,
+      ...this._latexOptions,
       ...parseOpts
     });
     if (result === null) return null;
@@ -68520,14 +70187,14 @@ var ComputeEngine = class _ComputeEngine {
 _setDefaultEngineFactory(() => new ComputeEngine());
 
 // src/compute-engine.ts
-var version = "0.55.6";
+var version = "0.57.0";
 ComputeEngine._latexSyntaxFactory = () => new LatexSyntax();
 _setDefaultEngineFactory(
   () => new ComputeEngine({ latexSyntax: new LatexSyntax() })
 );
 globalThis[/* @__PURE__ */ Symbol.for("io.cortexjs.compute-engine")] = {
   ComputeEngine: ComputeEngine.prototype.constructor,
-  version: "0.55.6"
+  version: "0.57.0"
 };
 export {
   DEFINITIONS_ALGEBRA as ALGEBRA_DICTIONARY,