formlab-mcp 0.6.49 → 0.6.51

package/vendor/theoretical-params.js

@@ -0,0 +1,1559 @@
+// ============================================================
+// THEORETICAL PARAMETERS
+// ============================================================
+// Computed scalar values that hang off a Formulation (and inherit
+// onto its Batches). Each parameter has a formula like
+//   SUM(row.amount * ing.solids) / SUM(row.amount)
+// that iterates the composition rows and pulls properties from the
+// ingredient library. Answers the recurring "calculate NV/OHV/PVC/VOC
+// before lab production" ask from coatings/resins/specialty-chem
+// shops (Allnex, Morgan, BASF all flagged it).
+//
+// Architecture:
+//   - Parameters live on Formulation (template) and inherit to Batch
+//   - Batches can override the formula list (mirrors Procedure pattern)
+//   - Formula language: SUM/AVG/MIN/MAX/COUNT with optional WHERE,
+//     plus row.* (composition row fields) and ing.* (ingredient lib)
+//   - Fresh small parser (~120 lines) — separate from the DOE Matrix
+//     computed-column engine, which only does [Col]/[Other] arithmetic
+
+// ---- Formula language ----
+//
+// Aggregations: SUM, AVG, MEAN, MIN, MAX, COUNT
+//   SUM(expr)                           — over all composition rows
+//   SUM(expr WHERE cond)                — over filtered rows
+//   COUNT()                             — count all rows
+//   COUNT(WHERE cond)                   — count filtered rows
+//
+// Row references (only valid inside aggregation bodies):
+//   row.amount, row.weight              — the row's numeric amount
+//   row.unit, row.role                  — string fields
+//   ing.density, ing.mw, ing.cost,      — standard ingredient fields
+//   ing.purity,                          — % active (technical/impure actives)
+//     ing.grade, ing.supplier, ing.function, ing.state, ing.name
+//     (ing.function is multi-valued: `ing.function == 'Binder'` matches
+//      any of its pipe-separated labels, case-insensitively)
+//   ing.solids, ing['NV %'], ing.X      — any custom field by name
+//
+// Outside aggregations: arithmetic only (+ - * / parens, numbers,
+// constants PI/E). Bare row./ing. outside an aggregation throws.
+//
+// Cross-parameter references:
+//   [Param Name]                        — another parameter's computed value
+//     e.g. [Total cost] / [Total weight]
+//   Resolved in dependency order before compile (see _tpEvaluateAll);
+//   cycles and unknown names yield a readable ERR, not a crash.
+
+// Compile a user-typed formula to a JS function that takes the
+// aggregation helpers and returns the scalar result. Throws on parse
+// errors. The compiled function is reusable across re-evaluations
+// (closure over the same composition data).
+function _tpCompile(formula) {
+  let src = String(formula || '').trim();
+  if (!src) throw new Error('Empty formula');
+
+  // 1. Rewrite aggregation calls into (condFn, exprFn) form.
+  //    Iterate because inner aggregations may appear after outer rewrite.
+  src = _tpRewriteAggs(src);
+
+  // 2. Sanitize: whitelist characters to keep eval safe. The compiled
+  //    function only has SUM/AVG/MIN/MAX/COUNT in scope (no globals,
+  //    no this, no Function/eval/import), and arrow fns inside
+  //    aggregations capture `r` as the iteration variable.
+  if (!/^[a-zA-Z0-9_\[\]\.\s+\-*/(),<>=!&|?:%'"]+$/.test(src)) {
+    throw new Error('Formula contains disallowed characters. Allowed: letters, digits, _ [ ] . ( ) , + - * / < > = ! & | ? : % \' "');
+  }
+
+  // 3. Only the formula language's own names may survive the rewrite (17m).
+  //    The character check alone let `SUM.constructor('…')()` or
+  //    `ing['constructor']['constructor']('…')()` through — every character is
+  //    allowed — and new Function runs in the page's global scope. A parameter
+  //    is shared data: in a Pro workspace one editor's formula runs in every
+  //    member's browser, so it could read their session and send it anywhere.
+  //    Same defence smart-search has had since 2026-05-31: strip string
+  //    literals (they are data), then every identifier left must be one of
+  //    ours, and a `[` may only follow `r.ing` (the custom-field lookup, which
+  //    answers own fields only — _tpIngredientView).
+  _tpCheckNames(src);
+
+  // 4. Compile via Function so we can pass in our aggregation helpers
+  //    as locals. Any syntax error surfaces with a meaningful message.
+  try {
+    // eslint-disable-next-line no-new-func
+    return new Function('SUM', 'AVG', 'MEAN', 'MIN', 'MAX', 'COUNT', 'PI', 'E', '_tpNum', '_tpHas',
+      `"use strict"; return (${src});`);
+  } catch (e) {
+    throw new Error(`Parse error: ${e.message}`);
+  }
+}
+
+const _TP_SAFE_NAMES = new Set([
+  'SUM', 'AVG', 'MEAN', 'MIN', 'MAX', 'COUNT', 'PI', 'E', '_tpNum', '_tpHas',
+  'r', 'ing', 'amount', 'unit', 'role', 'null', 'true', 'false', 'undefined',
+  'NaN', 'Infinity',   // an unknown [Param] is substituted as (NaN)
+]);
+function _tpCheckNames(src) {
+  const noStr = String(src).replace(/"(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'/g, '""');
+  // Numbers first (1e3, 2.5E-2) so their exponent isn't read as a name.
+  const noNum = noStr.replace(/\b\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b|\.\d+(?:[eE][+-]?\d+)?\b/g, '0');
+  for (const id of (noNum.match(/[A-Za-z_$][A-Za-z0-9_$]*/g) || [])) {
+    if (!_TP_SAFE_NAMES.has(id)) {
+      throw new Error(`"${id}" isn't part of the formula language. Use SUM / AVG / MIN / MAX / COUNT, row.amount, ing.<field> or ing['Field name'], numbers and [Other parameter].`);
+    }
+  }
+  // Nothing in the language calls the result of a lookup or a bracket: the
+  // only calls are SUM( … ) and the like, by name. `ing['x'](…)` or `(…)(…)`
+  // can only be an attempt to call something.
+  const called = (noNum.match(/[A-Za-z_$][A-Za-z0-9_$]*(?=\s*\()/g) || []).filter(n => !/^(SUM|AVG|MEAN|MIN|MAX|COUNT|_tpNum|_tpHas)$/.test(n));
+  if (called.length || /[\])]\s*\(/.test(noStr)) {
+    throw new Error("A value can't be called like a function — only SUM / AVG / MIN / MAX / COUNT take parentheses.");
+  }
+  for (let i = noStr.indexOf('['); i >= 0; i = noStr.indexOf('[', i + 1)) {
+    if (!/\br\s*\.\s*ing\s*$/.test(noStr.slice(0, i))) {
+      throw new Error("Square brackets are only for a field name: ing['Field name'] (and [Other parameter]).");
+    }
+  }
+}
+
+// Walk the source string, find each AGG(...) call (with balanced
+// parens), split on WHERE, and replace with AGG(condFn, exprFn).
+// Restart from the start after every rewrite so nested aggs get
+// handled correctly (they'll be the bodies of outer mappers).
+function _tpRewriteAggs(src) {
+  const aggs = ['SUM', 'AVG', 'MEAN', 'MIN', 'MAX', 'COUNT'];
+  for (let pass = 0; pass < 50; pass++) {
+    let earliest = -1, earliestAgg = '', earliestMatchLen = 0;
+    for (const agg of aggs) {
+      // Scan ALL occurrences of this agg and pick the earliest one
+      // that hasn't been rewritten yet (afterOpen not `r =>`/`null`).
+      // A naive single re.exec() would stop at the first occurrence
+      // even if that one was already rewritten, masking later SUMs.
+      const re = new RegExp(`\\b${agg}\\s*\\(`, 'gi');
+      let m;
+      while ((m = re.exec(src)) !== null) {
+        const afterOpen = src.slice(m.index + m[0].length).replace(/^\s*/, '');
+        // Rewritten aggs start with `null,` (no cond) or `(r =>` (cond
+        // present). Detect both so the pass loop doesn't double-rewrite
+        // already-processed aggs into nested garbage.
+        if (afterOpen.startsWith('null') || afterOpen.startsWith('(r =>') || afterOpen.startsWith('r =>')) continue;
+        if (earliest < 0 || m.index < earliest) {
+          earliest = m.index;
+          earliestAgg = agg.toUpperCase();
+          earliestMatchLen = m[0].length;
+        }
+        break; // we only need the first un-rewritten match per agg name
+      }
+    }
+    if (earliest < 0) return src;
+
+    const openIdx = earliest + earliestMatchLen - 1;
+    let depth = 1, j = openIdx + 1;
+    while (j < src.length && depth > 0) {
+      if (src[j] === '(') depth++;
+      else if (src[j] === ')') depth--;
+      if (depth === 0) break;
+      j++;
+    }
+    if (depth !== 0) throw new Error(`Unmatched paren in ${earliestAgg}(...)`);
+    const inside = src.slice(openIdx + 1, j);
+
+    // Split on top-level WHERE (not inside nested parens). Simple scan.
+    let whereIdx = -1;
+    {
+      let d = 0;
+      const re = /\bWHERE\b/gi;
+      let m;
+      while ((m = re.exec(inside)) !== null) {
+        // Count parens up to this point
+        let depthAt = 0;
+        for (let k = 0; k < m.index; k++) {
+          if (inside[k] === '(') depthAt++;
+          else if (inside[k] === ')') depthAt--;
+        }
+        if (depthAt === 0) { whereIdx = m.index; d = m[0].length; break; }
+      }
+      if (whereIdx >= 0) {
+        var exprPart = inside.slice(0, whereIdx).trim();
+        var condPart = inside.slice(whereIdx + d).trim();
+      } else {
+        var exprPart = inside.trim();
+        var condPart = '';
+      }
+    }
+
+    const exprBody = exprPart || (earliestAgg === 'COUNT' ? '1' : '0');
+    const exprFn = `(r => (${_tpTransformRefs(exprBody)}))`;
+    const condFn = condPart ? `(r => (${_tpTransformRefs(condPart)}))` : 'null';
+    const replacement = `${earliestAgg}(${condFn}, ${exprFn})`;
+    src = src.slice(0, earliest) + replacement + src.slice(j + 1);
+  }
+  throw new Error('Formula too complex (>50 aggregation rewrites)');
+}
+
+// Transform `row.X` and `ing.X` accessors into the iteration variable
+// (`r`) shape used inside arrow-fn bodies. Order matters: handle the
+// bracketed `ing['Name']` form before the dotted form, and the dotted
+// form before bare `ing`.
+function _tpTransformRefs(expr) {
+  let s = String(expr);
+  // ing.['Name'] → r.ing['Name']  (defensive — some users may type the dot)
+  s = s.replace(/\bing\s*\.\s*\[/g, "r.ing[");
+  // ing['Name'] → r.ing['Name']
+  s = s.replace(/\bing\s*\[/g, "r.ing[");
+  // ing.identifier → r.ing['identifier']  (bracket-quote so custom field
+  // names with non-identifier chars work via the dotted shortcut)
+  s = s.replace(/\bing\s*\.\s*([A-Za-z_][A-Za-z0-9_]*)/g, "r.ing['$1']");
+  // bare `ing` (rare; e.g. `ing != null`) → r.ing
+  s = s.replace(/\bing\b(?!\s*[\.\[])/g, 'r.ing');
+
+  // row.weight → r.amount (alias)
+  s = s.replace(/\brow\s*\.\s*weight\b/g, 'r.amount');
+  // row.identifier → r.identifier
+  s = s.replace(/\brow\s*\.\s*([A-Za-z_][A-Za-z0-9_]*)/g, 'r.$1');
+  // bare `row` → r
+  s = s.replace(/\brow\b(?!\s*\.)/g, 'r');
+
+  // Numeric-guard relational comparisons against a number literal: wrap the
+  // field-ref operand in _tpNum() so a MISSING field (null in the ingredient
+  // view) becomes NaN and fails every < <= > >= test, instead of coercing to 0
+  // and slipping through — e.g. `WHERE ing.purity < 100` must skip rows that
+  // have no purity, not count them. == / != and pure value arithmetic
+  // (SUM(row.amount * ing.density)) are deliberately left alone.
+  const REF = "(r\\.ing\\[[^\\]]*\\]|r\\.[A-Za-z_][A-Za-z0-9_]*)";
+  const NUM = "(-?\\d+(?:\\.\\d+)?)";
+  s = s.replace(new RegExp(REF + "\\s*(<=|>=|<|>)\\s*" + NUM, "g"), "_tpNum($1)$2$3");
+  s = s.replace(new RegExp(NUM + "\\s*(<=|>=|<|>)\\s*" + REF, "g"), "$1$2_tpNum($3)");
+
+  // Multi-valued label fields: `ing.function` is pipe-joined ('Film Former|
+  // Binder') so plain string equality against one label never matches. Rewrite
+  // `ing.function == 'Binder'` (either operand order, == / != / === / !==) into
+  // _tpHas(field, 'Binder'), which matches ANY of the pipe-separated labels,
+  // trimmed and case-insensitively (labels are vocabulary, not case-sensitive
+  // data). Single-valued fields keep exact equality (2026-09-13).
+  const MV  = "(r\\.ing\\['(?:function|tags)'\\])";
+  const LIT = "('(?:[^'\\\\]|\\\\.)*'|\"(?:[^\"\\\\]|\\\\.)*\")";
+  const OP  = "\\s*(===|!==|==|!=)\\s*";
+  const has = (neg, f, l) => (neg ? '!' : '') + '_tpHas(' + f + ',' + l + ')';
+  s = s.replace(new RegExp(MV + OP + LIT, "g"), (_, f, op, l) => has(op[0] === '!', f, l));
+  s = s.replace(new RegExp(LIT + OP + MV, "g"), (_, l, op, f) => has(op[0] === '!', f, l));
+  return s;
+}
+
+// Evaluate a compiled formula against a row set. Aggregation helpers
+// are passed in fresh on each call so they close over the right rows.
+function _tpEvaluate(formula, rows) {
+  const fn = _tpCompile(formula);
+  const safe = (rows || []).filter(Boolean);
+  const filteredFor = (cf) => {
+    if (!cf) return safe;
+    return safe.filter(r => { try { return !!cf(r); } catch { return false; } });
+  };
+  const mapNumeric = (subset, ef) => {
+    const out = [];
+    for (const r of subset) {
+      let v;
+      try { v = ef(r); } catch { continue; }
+      if (typeof v === 'number' && Number.isFinite(v)) out.push(v);
+    }
+    return out;
+  };
+  const SUM   = (cf, ef) => mapNumeric(filteredFor(cf), ef).reduce((a, b) => a + b, 0);
+  const AVG   = (cf, ef) => { const a = mapNumeric(filteredFor(cf), ef); return a.length ? a.reduce((x, y) => x + y, 0) / a.length : NaN; };
+  const MIN   = (cf, ef) => { const a = mapNumeric(filteredFor(cf), ef); return a.length ? Math.min(...a) : NaN; };
+  const MAX   = (cf, ef) => { const a = mapNumeric(filteredFor(cf), ef); return a.length ? Math.max(...a) : NaN; };
+  const COUNT = (cf)     => filteredFor(cf).length;
+  // Numeric coercion for guarded relational comparisons (see _tpTransformRefs):
+  // non-numbers → NaN so a missing field never satisfies < <= > >=.
+  const _tpNum = (x) => (typeof x === 'number' ? x : (x == null || x === '' ? NaN : Number(x)));
+  // Any-of match for pipe-joined label fields (see _tpTransformRefs).
+  const _tpHas = (field, lit) => {
+    const want = String(lit == null ? '' : lit).trim().toLowerCase();
+    const vals = Array.isArray(field) ? field : String(field == null ? '' : field).split('|');
+    return vals.some(v => String(v).trim().toLowerCase() === want);
+  };
+  return fn(SUM, AVG, AVG, MIN, MAX, COUNT, Math.PI, Math.E, _tpNum, _tpHas);
+}
+
+// Same evaluation as _tpEvaluate but records a per-aggregate breakdown (each
+// SUM/AVG/MIN/MAX/COUNT call, the rows it spanned, and each row's value) so the
+// "Show calculation" panel can show HOW a computed parameter got its number —
+// the same transparency the Fox-Tg / density panels give. Returns
+// { value, trace:[{op, terms:[{label,value}], result}] }.
+function _tpTrace(formula, rows) {
+  let fn;
+  try { fn = _tpCompile(formula); } catch (_) { return { value: NaN, trace: [] }; }
+  const safe = (rows || []).filter(Boolean);
+  const trace = [];
+  const rowLabel = r => (r && r.ing && !r.ing._isSubFormula && (r.ing.name || r.ing.uid))
+    || (r && r.ing && r.ing._isSubFormula ? (r._subName || '(sub-formula)') : '(row)');
+  const filteredFor = cf => { if (!cf) return safe; return safe.filter(r => { try { return !!cf(r); } catch { return false; } }); };
+  const collect = (op, cf, ef) => {
+    const subset = filteredFor(cf);
+    const terms = subset.map(r => { let v; try { v = ef(r); } catch { v = undefined; } return { idx: safe.indexOf(r), label: rowLabel(r), value: (typeof v === 'number' && Number.isFinite(v)) ? v : null }; });
+    return { op, terms };
+  };
+  const nums = c => c.terms.map(t => t.value).filter(v => v != null);
+  const SUM = (cf, ef) => { const c = collect('SUM', cf, ef); const res = nums(c).reduce((a, b) => a + b, 0); trace.push({ ...c, result: res }); return res; };
+  const AVG = (cf, ef) => { const c = collect('AVG', cf, ef); const a = nums(c); const res = a.length ? a.reduce((x, y) => x + y, 0) / a.length : NaN; trace.push({ ...c, result: res }); return res; };
+  const MIN = (cf, ef) => { const c = collect('MIN', cf, ef); const a = nums(c); const res = a.length ? Math.min(...a) : NaN; trace.push({ ...c, result: res }); return res; };
+  const MAX = (cf, ef) => { const c = collect('MAX', cf, ef); const a = nums(c); const res = a.length ? Math.max(...a) : NaN; trace.push({ ...c, result: res }); return res; };
+  const COUNT = (cf) => { const subset = filteredFor(cf); trace.push({ op: 'COUNT', terms: subset.map(r => ({ idx: safe.indexOf(r), label: rowLabel(r), value: 1 })), result: subset.length }); return subset.length; };
+  const _tpNum = x => (typeof x === 'number' ? x : (x == null || x === '' ? NaN : Number(x)));
+  let value = NaN;
+  try { value = fn(SUM, AVG, AVG, MIN, MAX, COUNT, Math.PI, Math.E, _tpNum); } catch (_) {}
+  return { value, trace };
+}
+
+// ---- Cross-parameter references ----
+//
+// A formula may reference another parameter's computed value by name in
+// square brackets, e.g.
+//   [Total cost] / [Total weight]
+// This is distinct from the `ing['Custom Field']` accessor: an ingredient
+// field access is always preceded by the `ing` token (with or without a
+// dot), so a bare `[Name]` not preceded by `ing` is a parameter reference.
+// References are resolved to numeric literals BEFORE compilation, so the
+// downstream parser/evaluator is unchanged.
+
+// Scan a raw formula for parameter references. Returns
+// [{ name, start, end }] where start/end index the `[` and `]`.
+// Skips `ing[...]` / `ing.[...]` ingredient-field accesses.
+function _tpScanParamRefs(formula) {
+  const s = String(formula || '');
+  const refs = [];
+  for (let i = 0; i < s.length; i++) {
+    if (s[i] !== '[') continue;
+    // An ingredient access has `ing` (optionally `ing.`) immediately before
+    // the bracket — skip those; everything else is a parameter reference.
+    if (/(^|[^A-Za-z0-9_])ing\s*\.?\s*$/.test(s.slice(0, i))) continue;
+    const close = s.indexOf(']', i + 1);
+    if (close < 0) break; // unterminated — let the compiler surface it
+    const name = s.slice(i + 1, close).trim().replace(/^['"]|['"]$/g, '').trim();
+    refs.push({ name, start: i, end: close });
+    i = close;
+  }
+  return refs;
+}
+
+// Replace each `[Param Name]` with its numeric value from valueMap (keyed
+// by lowercased name). Unknown refs become NaN so the result reads ERR
+// rather than silently computing against 0. Wrapped in parens to preserve
+// arithmetic precedence (e.g. negative values).
+function _tpSubstituteParamRefs(formula, valueMap) {
+  const refs = _tpScanParamRefs(formula);
+  if (!refs.length) return formula;
+  const s = String(formula || '');
+  let out = '', cursor = 0;
+  for (const r of refs) {
+    out += s.slice(cursor, r.start);
+    const v = valueMap[r.name.toLowerCase()];
+    out += '(' + (Number.isFinite(v) ? v : 'NaN') + ')';
+    cursor = r.end + 1;
+  }
+  return out + s.slice(cursor);
+}
+
+// Evaluate a whole list of parameters together, resolving cross-references
+// in dependency order. Returns a map { [paramId]: { value, error, name } }.
+// Dependency cycles, unknown references, and non-numeric dependencies each
+// yield a readable error on the affected parameter (mirroring the per-cell
+// ERR rendering) without throwing.
+function _tpEvaluateAll(params, rows) {
+  const list = (params || []).filter(p => p && p.id);
+  const byName = {};
+  list.forEach(p => { if (p.name) byName[String(p.name).trim().toLowerCase()] = p; });
+
+  const results = {};         // paramId -> { value, error, name }
+  const visiting = {};        // paramId -> true while on the resolution stack
+
+  function resolve(p) {
+    if (results[p.id]) return results[p.id];
+    if (visiting[p.id]) {
+      return (results[p.id] = { value: null, error: 'Circular reference', name: p.name });
+    }
+    visiting[p.id] = true;
+
+    const valueMap = {};
+    let depError = '';
+    for (const ref of _tpScanParamRefs(p.formula)) {
+      const key = ref.name.toLowerCase();
+      const dep = byName[key];
+      if (!dep) { depError = depError || `Unknown parameter [${ref.name}]`; continue; }
+      if (dep.id === p.id) { depError = depError || 'Circular reference'; continue; }
+      const dr = resolve(dep);
+      if (dr.error) { depError = depError || `[${ref.name}] → ${dr.error}`; continue; }
+      if (!Number.isFinite(dr.value)) { depError = depError || `[${ref.name}] is not a number`; continue; }
+      valueMap[key] = dr.value;
+    }
+
+    let res;
+    if (depError) {
+      res = { value: null, error: depError, name: p.name };
+    } else {
+      try {
+        const substituted = _tpSubstituteParamRefs(p.formula, valueMap);
+        res = { value: _tpEvaluate(substituted, rows), error: '', name: p.name };
+      } catch (e) {
+        res = { value: null, error: e.message || 'eval error', name: p.name };
+      }
+    }
+    delete visiting[p.id];
+    return (results[p.id] = res);
+  }
+
+  list.forEach(resolve);
+  return results;
+}
+
+// Build the row set the evaluator iterates. Sub-formula rows are
+// included (so `SUM(row.amount)` is correct) but their `ing` is empty
+// (so chemistry-aware aggregations naturally skip them). Custom
+// ingredient fields are flattened into `ing.{name}` alongside the
+// standard fields, with numeric coercion when the string parses.
+function _tpBuildRows(composition) {
+  const rows = [];
+  (composition || []).forEach(c => {
+    if (!c) return;
+    const amount = parseFloat(c.amount);
+    const base = {
+      amount: Number.isFinite(amount) ? amount : 0,
+      unit: c.unit || '',
+      role: c.role || '',
+      // As typed on the composition row — the "Show calc" table shows it next
+      // to the wt% the expressions actually see. Never read by the math.
+      _entered: { amount: c.amount, unit: c.unit || '' },
+    };
+    if (c.ingredientId) {
+      const ing = db.ingredients.find(i => i.id === c.ingredientId);
+      // _cfUnits: each custom field's unit label (lower-case name → unit). The
+      // math never reads it; _tpMissingInputs uses it to flag mixed units.
+      const _cfUnits = {};
+      ((ing && ing.customFields) || []).forEach(f => { if (f && f.name && f.unit) _cfUnits[String(f.name).trim().toLowerCase()] = String(f.unit).trim(); });
+      rows.push({ ...base, ing: _tpIngredientView(ing), _srcIng: ing || null, _cfUnits });
+    } else if (c.formulationId) {
+      // Sub-formula row: amount/role still meaningful, but no ing.* props.
+      // For chemistry-aware aggregations (NV, OHV, PVC), treat as opaque
+      // — the user can either flatten the recipe or attach the relevant
+      // properties to the sub-formula's parent representation later.
+      const sub = db.formulations.find(g => g.id === c.formulationId);
+      rows.push({ ...base, ing: { _isSubFormula: true }, _srcSub: c.formulationId, _subName: (sub && sub.name) || 'sub-formula' });
+    }
+  });
+  // ABSOLUTE rows (a batch's as-prepared composition: 215.9 g water, 6.6 mL
+  // sucrose…) are put on the SAME basis the formula's expressions were written
+  // for — wt% of the total logged mass, summing to 100 — before any expression
+  // sees them. Theoretical parameters are intensive (g/100 g, kcal/100 g,
+  // USD/kg), and every stock expression assumes Σ row.amount = 100, so raw
+  // grams (or worse, raw mL) reported the shake's protein as 16.8 "g/100 g" on
+  // a 250 mL batch (2026-09-13). Volume rows convert via the ROW's own density
+  // (sub-formula: its planning density) — never the formula's. Percent rows,
+  // and any set where one absolute row can't resolve, are left untouched.
+  const isM = u => (typeof isMassUnit === 'function') && isMassUnit(u);
+  const isV = u => (typeof isVolUnit === 'function') && isVolUnit(u);
+  const abs = rows.filter(r => isM(r.unit) || isV(r.unit));
+  if (abs.length && typeof massToKg === 'function' && typeof volToL === 'function') {
+    const grams = abs.map(r => {
+      if (isM(r.unit)) { const f = massToKg(r.unit); return (f != null) ? r.amount * f * 1000 : null; }
+      const L = volToL(r.unit);
+      let d = null;
+      if (r._srcIng && typeof _densityToKgPerL === 'function') d = _densityToKgPerL(r._srcIng.density, r._srcIng.densityUnit);
+      else if (r._srcSub && typeof _rolledUpDensity === 'function') { const sub = db.formulations.find(g => g.id === r._srcSub); d = sub ? _rolledUpDensity(sub) : null; }
+      return (L != null && d != null && isFinite(d) && d > 0) ? r.amount * L * d * 1000 : null;
+    });
+    const total = grams.reduce((a, g) => a + (g || 0), 0);
+    if (grams.every(g => g != null && isFinite(g)) && total > 0) {
+      abs.forEach((r, i) => { r.amount = (grams[i] / total) * 100; r.unit = 'wt%'; });
+    }
+  }
+  rows.forEach(r => { delete r._srcIng; delete r._srcSub; });
+  return rows;
+}
+
+// Project an ingredient onto the flat `ing.X` namespace the formula
+// language uses. Standard fields are exposed under their canonical
+// names; custom fields are merged in by name with numeric coercion
+// when the value parses as a number.
+//
+// Lookups are case-insensitive: a formula written `ing.Solids` resolves
+// to the same field as `ing.solids` and `ing['SOLIDS']`. This matches
+// the expectation set by Excel cell references, ChemDraw / RDKit
+// property names, and pretty much every spreadsheet-like tool a lab
+// user has touched. Case-sensitivity here was producing silent zeros
+// on harmless typos and was the wrong default.
+function _tpIngredientView(ing) {
+  if (!ing) return { _missing: true };
+  const out = {
+    uid: ing.uid || '',
+    name: ing.name || '',
+    chemicalName: ing.chemicalName || '',
+    chemical: ing.chemicalName || '',   // alias: the column reads "Chemical Name"
+    cas: ing.cas || '',
+    grade: ing.grade || '',
+    supplier: ing.supplier || '',
+    catalog: ing.catalog || '',
+    state: ing.state || '',
+    function: ing.function || '',
+    storage: ing.storage || '',
+    // Tier 1 expansion fields — flatten nested sub-objects so the
+    // predicate language can reach them without dotted access:
+    //   class == 'sequence' AND sequence contains 'KTTKS'
+    //   taxon contains 'Centella' OR taxonId == 13954
+    class: ing.ingredientClass || '',
+    inchiKey: ing.inchiKey || '',
+    sequence: ing.sequence?.raw || '',
+    sequenceType: ing.sequence?.type || '',
+    taxon: ing.taxon?.scientificName || '',
+    taxonId: ing.taxon?.ncbiId != null ? Number(ing.taxon.ncbiId) : null,
+  };
+  // Numeric standard fields — coerce defensively
+  const num = (v) => {
+    const n = typeof v === 'number' ? v : (v != null && !isNaN(parseFloat(v)) ? parseFloat(v) : null);
+    return n;
+  };
+  out.density = num(ing.density);
+  out.mw      = num(ing.mw);
+  out.cost    = num(ing.cost && typeof ing.cost === 'object' ? ing.cost.value : ing.cost);
+  out.purity  = num(ing.purity);   // % active — filterable (purity < 90) + usable in theo formulas (ing.purity)
+  out.stock   = num(ing.stockOnHand);        // on-hand — filterable (stock < 100) [also on the Inventory view]
+  out.reorder = num(ing.reorderThreshold);   // reorder point — filterable (stock <= reorder)
+  out.tg      = (typeof _ingTg === 'function') ? _ingTg(ing) : num(ing.tg);   // glass transition °C (any class) — filterable (tg < 50) + usable in theo formulas (ing.tg)
+  out.hlb     = (typeof _ingHlb === 'function') ? _ingHlb(ing) : num(ing.surfactantDetails ? ing.surfactantDetails.hlb : ing.hlb);   // HLB (surfactants) — filterable (hlb < 10) + usable in theo formulas (ing.hlb), e.g. Blend HLB preset
+  (ing.customFields || []).forEach(cf => {
+    if (!cf || !cf.name) return;
+    const raw = cf.value;
+    const n = num(raw);
+    if (cf.name === '__proto__') return;   // would set the prototype, not a field
+    out[cf.name] = (n !== null && raw !== null && raw !== '') ? n : raw;
+  });
+  // Wrap in a Proxy that does case-insensitive property reads. Bracket
+  // form `ing['Solids']` and dotted form `ing.Solids` both flow through
+  // here, so a single hook covers every access path the formula language
+  // emits. Iteration (Object.keys, JSON.stringify) still sees the
+  // original-cased keys — only get/has are normalized.
+  const lowerIndex = {};
+  Object.keys(out).forEach(k => { lowerIndex[k.toLowerCase()] = k; });
+  // OWN fields only (17m): `prop in target` also answered for what every object
+  // inherits, so ing['constructor'] handed a formula the Object constructor —
+  // and from there Function, i.e. any code. A field is data; nothing else is
+  // reachable through ing.
+  const own = (o, k) => Object.prototype.hasOwnProperty.call(o, k);
+  return new Proxy(out, {
+    get(target, prop) {
+      if (typeof prop !== 'string') return undefined;
+      if (own(target, prop)) return target[prop];
+      const canon = own(lowerIndex, prop.toLowerCase()) ? lowerIndex[prop.toLowerCase()] : null;
+      return canon != null ? target[canon] : undefined;
+    },
+    has(target, prop) {
+      if (typeof prop !== 'string') return false;
+      return own(target, prop) || own(lowerIndex, prop.toLowerCase());
+    },
+  });
+}
+
+// Resolve the effective parameter list for a batch. Batches inherit
+// from formula unless overridden. Mirrors the Procedure pattern
+// (batch.stepsOverride wins when present).
+function _tpEffectiveParams(entityType, entity) {
+  if (!entity) return [];
+  if (entityType === 'batch') {
+    if (Array.isArray(entity.theoreticalParamsOverride)) return entity.theoreticalParamsOverride;
+    const f = db.formulations.find(x => x.id === entity.formulationId);
+    return (f && Array.isArray(f.theoreticalParameters)) ? f.theoreticalParameters : [];
+  }
+  // formulation
+  return Array.isArray(entity.theoreticalParameters) ? entity.theoreticalParameters : [];
+}
+
+// Resolve the composition rows for evaluation. For a batch with a
+// non-empty actualComposition, that's the source of truth (the actual
+// mix the lab made); otherwise fall back to the parent formula's
+// proposal. For a formulation, always its own composition.
+function _tpEffectiveComposition(entityType, entity) {
+  if (entityType === 'batch') {
+    if (Array.isArray(entity.actualComposition) && entity.actualComposition.length) {
+      return { source: 'actual', rows: entity.actualComposition };
+    }
+    const f = db.formulations.find(x => x.id === entity.formulationId);
+    return { source: 'proposal', rows: f ? (f.composition || []) : [] };
+  }
+  return { source: 'proposal', rows: entity.composition || [] };
+}
+
+// ---- CRUD ----
+function addTheoreticalParam(entityType, entityId, paramData) {
+  if (entityType === 'formulation') {
+    const f = db.formulations.find(x => x.id === entityId);
+    if (!f) return null;
+    const list = Array.isArray(f.theoreticalParameters) ? [...f.theoreticalParameters] : [];
+    list.push({ id: uid(), ...paramData });
+    updateFormulation(f.id, { theoreticalParameters: list });
+    return list[list.length - 1];
+  }
+  if (entityType === 'batch') {
+    const b = getBatch(entityId);
+    if (!b) return null;
+    const list = Array.isArray(b.theoreticalParamsOverride)
+      ? [...b.theoreticalParamsOverride]
+      : [..._tpEffectiveParams('batch', b)]; // start the override from inherited list
+    list.push({ id: uid(), ...paramData });
+    updateBatch(b.id, { theoreticalParamsOverride: list });
+    return list[list.length - 1];
+  }
+  return null;
+}
+
+function updateTheoreticalParam(entityType, entityId, paramId, paramData) {
+  if (entityType === 'formulation') {
+    const f = db.formulations.find(x => x.id === entityId);
+    if (!f) return null;
+    const list = (f.theoreticalParameters || []).map(p =>
+      p.id === paramId ? { ...p, ...paramData } : p);
+    updateFormulation(f.id, { theoreticalParameters: list });
+    return list.find(p => p.id === paramId);
+  }
+  if (entityType === 'batch') {
+    const b = getBatch(entityId);
+    if (!b) return null;
+    const base = Array.isArray(b.theoreticalParamsOverride)
+      ? b.theoreticalParamsOverride
+      : _tpEffectiveParams('batch', b);
+    const list = base.map(p => p.id === paramId ? { ...p, ...paramData } : p);
+    updateBatch(b.id, { theoreticalParamsOverride: list });
+    return list.find(p => p.id === paramId);
+  }
+  return null;
+}
+
+function deleteTheoreticalParam(entityType, entityId, paramId) {
+  if (entityType === 'formulation') {
+    const f = db.formulations.find(x => x.id === entityId);
+    if (!f) return;
+    const list = (f.theoreticalParameters || []).filter(p => p.id !== paramId);
+    updateFormulation(f.id, { theoreticalParameters: list });
+    return;
+  }
+  if (entityType === 'batch') {
+    const b = getBatch(entityId);
+    if (!b) return;
+    const base = Array.isArray(b.theoreticalParamsOverride)
+      ? b.theoreticalParamsOverride
+      : _tpEffectiveParams('batch', b);
+    const list = base.filter(p => p.id !== paramId);
+    updateBatch(b.id, { theoreticalParamsOverride: list });
+  }
+}
+
+// Modal-based confirm wrapper for the per-row delete button (replaces an
+// inline confirm() in the onclick, which the embedded webview suppresses).
+function confirmDeleteTheoreticalParam(entityType, entityId, pId, pName) {
+  confirmDataAction({
+    title: 'Delete parameter',
+    message: `Delete parameter "${esc(pName || '')}"?`,
+    confirmLabel: 'Delete',
+    danger: true,
+    onConfirm: () => {
+      deleteTheoreticalParam(entityType, entityId, pId);
+      if (entityType === 'batch') renderBatchDetail(entityId);
+      else renderFormulationDetail(entityId);
+    }
+  });
+}
+
+function resetBatchTheoreticalParams(batchId, _confirmed) {
+  if (!_confirmed) { confirmDataAction({ title: 'Reset parameters', message: "Discard this batch's parameter overrides and inherit the formula's parameters again?", confirmLabel: 'Reset', danger: true, onConfirm: () => resetBatchTheoreticalParams(batchId, true) }); return; }
+  const b = getBatch(batchId);
+  if (!b) return;
+  // Use direct write to clear the field (updateBatch merges, doesn't delete)
+  const i = db.batches.findIndex(x => x.id === batchId);
+  if (i >= 0) {
+    const next = { ...db.batches[i] };
+    delete next.theoreticalParamsOverride;
+    if (typeof now === 'function') next.updatedAt = now();
+    db.batches[i] = next;
+    saveDB();
+    if (typeof _proHook === 'function') _proHook('batch', 'update', db.batches[i]);
+    if (typeof _audit === 'function') _audit('update', 'batch', batchId, 'Reset theoretical parameters to formula default');
+  }
+  if (typeof renderBatchDetail === 'function') renderBatchDetail(batchId);
+}
+
+// ---- Card render ----
+//
+// Used in two contexts:
+//   entityType='formulation' → standalone tab content in formulation detail
+//   entityType='batch'       → card on batch detail (with inherit/override
+//                              chrome and "compute against actual" indicator)
+// Toggle a param's "Show calculation" expand row.
+function _tpToggleCalc(id) {
+  const el = document.getElementById('tp-calc-' + id);
+  if (el) el.style.display = (el.style.display === 'none' || !el.style.display) ? 'table-row' : 'none';
+}
+
+// The expandable "how this number was computed" panel for one parameter
+// (rebuilt 17k — Jun, 2026-10-06: "the calculation table is a bit hard to
+// understand and read"). One table, a row per composition row:
+//   Ingredient · As entered · wt% (what row.amount is, after grams / mL are
+//   put on a per-100 basis) · each ing.X the formula reads, with its unit ·
+//   one column per aggregate (A, B, …) with that row's term
+// then a totals row, and the result spelled out: A / B = 883.45 / 100 = 8.83.
+// A row with no value for a field says "not counted" in that column; a row a
+// WHERE filters out shows a dot. [Param] references are listed with their value.
+const _TP_AGG_RE = /\b(SUM|AVG|MEAN|MIN|MAX|COUNT)\s*\(/gi;
+// Top-level aggregate calls in a formula, left to right: [{ start, end, text }].
+function _tpAggSpans(formula) {
+  const s = String(formula || '');
+  const out = [];
+  let i = 0;
+  while (i < s.length) {
+    _TP_AGG_RE.lastIndex = i;
+    const m = _TP_AGG_RE.exec(s);
+    if (!m) break;
+    let depth = 0, j = m.index + m[0].length - 1;
+    for (; j < s.length; j++) {
+      if (s[j] === '(') depth++;
+      else if (s[j] === ')' && --depth === 0) break;
+    }
+    if (j >= s.length) break;
+    out.push({ start: m.index, end: j + 1, text: s.slice(m.index, j + 1) });
+    i = j + 1;
+  }
+  return out;
+}
+function _tpReplaceSpans(formula, spans, repl) {
+  let out = '', cur = 0;
+  spans.forEach((sp, k) => { out += formula.slice(cur, sp.start) + repl(k); cur = sp.end; });
+  return out + formula.slice(cur);
+}
+function _tpCalcHtml(p, evalRows, valueMap) {
+  const formula = String(p.formula || '');
+  const refs = (typeof _tpScanParamRefs === 'function') ? _tpScanParamRefs(formula) : [];
+  const seenRef = new Set();
+  const refBits = [];
+  refs.forEach(rf => {
+    const k = rf.name.toLowerCase();
+    if (seenRef.has(k)) return; seenRef.add(k);
+    const v = valueMap[k];
+    refBits.push(`<code>[${esc(rf.name)}]</code> = <strong>${Number.isFinite(v) ? _tpFmtValue(v) : '<span style="color:var(--danger)">ERR</span>'}</strong>`);
+  });
+  const substituted = (typeof _tpSubstituteParamRefs === 'function') ? _tpSubstituteParamRefs(formula, valueMap) : formula;
+  let t = { value: NaN, trace: [] };
+  try { t = _tpTrace(substituted, evalRows); } catch (_) {}
+  const aggs = (t.trace || []);
+  const L = k => String.fromCharCode(65 + k);   // A, B, C…
+  const mono = 'font-family:ui-monospace,monospace';
+  const num = v => (v == null || !Number.isFinite(v)) ? '' : _tpFmtValue(v);
+
+  // The result line: the formula with each aggregate named, then its numbers.
+  const spansOrig = _tpAggSpans(formula), spansSub = _tpAggSpans(substituted);
+  let resultHtml = '';
+  if (Number.isFinite(t.value)) {
+    const unit = p.unit ? ` <span style="color:var(--text-muted)">${esc(p.unit)}</span>` : '';
+    if (aggs.length && spansOrig.length === aggs.length && spansSub.length === aggs.length) {
+      const sym = _tpReplaceSpans(formula, spansOrig, L).replace(/\s+/g, ' ').trim();
+      const nums = _tpReplaceSpans(substituted, spansSub, k => num(aggs[k].result)).replace(/\s+/g, ' ').trim();
+      resultHtml = `<div style="${mono};font-size:12.5px;margin-top:8px;color:#0f172a">Value = ${esc(sym)}${sym === nums ? '' : ` = ${esc(nums)}`} = <strong>${esc(_tpFmtValue(t.value))}</strong>${unit}</div>`;
+    } else if (!aggs.length && refs.length) {
+      const nums = substituted.replace(/\((-?[\d.e+-]+)\)/gi, (m, v) => _tpFmtValue(+v)).replace(/\s+/g, ' ').trim();
+      resultHtml = `<div style="${mono};font-size:12.5px;margin-top:8px;color:#0f172a">Value = ${esc(formula.replace(/\s+/g, ' ').trim())} = ${esc(nums)} = <strong>${esc(_tpFmtValue(t.value))}</strong>${unit}</div>`;
+    } else {
+      resultHtml = `<div style="font-size:12.5px;margin-top:8px">Value = <strong>${esc(_tpFmtValue(t.value))}</strong>${unit}</div>`;
+    }
+  }
+
+  // The table: only when the formula aggregates over rows.
+  let tableHtml = '';
+  if (aggs.length && aggs.length <= 6 && aggs.every(a => (a.terms || []).every(tm => Number.isInteger(tm.idx)))) {
+    const usesAmount = /\brow\.amount\b/.test(formula);
+    // "As entered" only says something when a row was typed in g / mL / …;
+    // rows already in % are the wt% column itself.
+    const showEntered = (evalRows || []).some(r => r && r._entered && !/^(wt%|%|w\/w%?)$/i.test(String(r._entered.unit || '').trim()));
+    const fields = [...new Set(_tpFieldRefs(formula))].filter(f => !_TP_TEXT_FIELDS.has(f)).slice(0, 4);
+    const units = {};
+    fields.forEach(f => { const r = (evalRows || []).find(x => x && x._cfUnits && x._cfUnits[f]); units[f] = r ? r._cfUnits[f] : ''; });
+    const byAgg = aggs.map(a => { const m = new Map(); (a.terms || []).forEach(tm => m.set(tm.idx, tm.value)); return m; });
+    const th = (txt, title, right) => `<th${title ? ` title="${esc(title)}"` : ''} style="text-align:${right ? 'right' : 'left'};padding:4px 10px;font-size:10.5px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #cbd5e1;white-space:nowrap">${txt}</th>`;
+    const td = (html, extra) => `<td style="padding:4px 10px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;${extra || ''}">${html}</td>`;
+    const muted = 'color:#94a3b8';
+    const head = th('Ingredient') + (showEntered ? th('As entered', 'Amount and unit as typed on the composition row', true) : '')
+      + (usesAmount ? th('wt%', 'row.amount — grams, kg and mL are put on a per-100 basis (volume through each ingredient\'s density) before the formula runs', true) : '')
+      + fields.map(f => th(esc(f) + (units[f] ? ` <span style="text-transform:none;font-weight:400">(${esc(units[f])})</span>` : ''), 'ing.' + f + ' — the bare number; the unit is a label only', true)).join('')
+      + aggs.map((a, k) => th(`<span style="${mono};text-transform:none;color:#1e40af">${L(k)}</span>`, (spansOrig[k] && spansOrig[k].text) || a.op, true)).join('');
+    // Banded rows (Jun, 2026-10-06): white / slate-100 on the panel's slate-50,
+    // so a row reads across a wide table without a ruler.
+    let band = 0;
+    const body = (evalRows || []).map((r, i) => {
+      if (!r) return '';
+      const bg = (band++ % 2) ? '#f1f5f9' : '#ffffff';
+      const isSub = r.ing && r.ing._isSubFormula;
+      const name = isSub ? `${esc(r._subName || 'sub-formula')} <span style="${muted}">(sub-formula)</span>` : esc((r.ing && (r.ing.name || r.ing.uid)) || '(row)');
+      const e = r._entered || {};
+      const entered = (e.amount != null && e.amount !== '') ? `${esc(String(e.amount))} ${esc(e.unit || '')}` : '';
+      const cells = [];
+      cells.push(`<td style="padding:4px 10px;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis" title="${esc((r.ing && r.ing.name) || r._subName || '')}">${name}</td>`);
+      if (showEntered) cells.push(td(entered, muted));
+      if (usesAmount) cells.push(td(num(r.amount)));
+      fields.forEach(f => {
+        const v = isSub ? undefined : (r.ing && r.ing[f]);
+        cells.push(typeof v === 'number' && Number.isFinite(v) ? td(num(v)) : td('missing', 'color:#b45309;font-style:italic'));
+      });
+      byAgg.forEach((m, k) => {
+        if (!m.has(i)) { cells.push(td('·', muted + `" title="Left out by the WHERE in ${L(k)}`)); return; }
+        const v = m.get(i);
+        cells.push(v == null ? td('not counted', 'color:#b45309;font-style:italic') : td(num(v)));
+      });
+      return `<tr class="tp-calc-row" style="background:${bg}">${cells.join('')}</tr>`;
+    }).join('');
+    const nLead = 1 + (showEntered ? 1 : 0) + (usesAmount ? 1 : 0) + fields.length;
+    const opWord = { SUM: 'Sum', AVG: 'Average', MIN: 'Min', MAX: 'Max', COUNT: 'Count' };
+    const foot = `<tr style="border-top:1px solid #cbd5e1">
+      <td colspan="${nLead}" style="padding:5px 10px;font-weight:600">Total</td>
+      ${aggs.map((a, k) => td(`<span style="${muted};font-weight:400">${opWord[a.op] || a.op}</span> <strong>${num(a.result)}</strong>`)).join('')}
+    </tr>`;
+    const legend = aggs.map((a, k) => `<span style="white-space:nowrap"><span style="${mono};color:#1e40af;font-weight:600">${L(k)}</span> = <code style="${mono}">${esc((spansOrig[k] && spansOrig[k].text) || a.op)}</code></span>`).join(' &nbsp;·&nbsp; ');
+    tableHtml = `<div style="font-size:11.5px;color:#475569;margin:2px 0 6px;line-height:1.7">${legend}</div>
+      <table style="border-collapse:collapse;font-size:12px;min-width:60%"><thead><tr>${head}</tr></thead><tbody>${body}</tbody><tfoot>${foot}</tfoot></table>`;
+  } else if (aggs.length) {
+    // Many aggregates, or rows we can't line up: the plain per-aggregate lists.
+    tableHtml = aggs.filter(a => a.terms && a.terms.length).map((a, k) => `<div style="margin-top:8px">
+        <div style="font-size:11px;color:var(--text-muted);margin-bottom:3px">${L(k)} · ${a.op} over ${a.terms.length} row${a.terms.length === 1 ? '' : 's'} = <strong>${num(a.result)}</strong></div>
+        <table style="font-size:11.5px;border-collapse:collapse">${a.terms.map(term => `<tr><td style="padding:1px 12px 1px 0;white-space:nowrap">${esc(term.label)}</td><td style="text-align:right;font-variant-numeric:tabular-nums">${term.value == null ? 'not counted' : num(term.value)}</td></tr>`).join('')}</table>
+      </div>`).join('');
+  }
+  return `<div style="padding:12px 14px;background:#f8fafc;border-top:1px solid #e2e8f0;font-size:12px;color:var(--text);overflow-x:auto">
+    ${refBits.length ? `<div style="font-size:11.5px;color:var(--text-muted);margin-bottom:6px">References: ${refBits.join(' &nbsp;·&nbsp; ')}</div>` : ''}
+    ${tableHtml || (refBits.length ? '' : '<div style="color:var(--text-muted);font-size:11px">Value comes straight from the expression (no row aggregation).</div>')}
+    ${resultHtml}
+  </div>`;
+}
+
+// Ingredient values a parameter needs that some rows don't have (17d). A row
+// whose ing.X is missing or not a number drops out of SUM / AVG / MIN / MAX
+// without a word, so an energy figure read low with nothing to say why (one
+// missing ing.fat drops that row's protein and carbs too). Fields read inside
+// a WHERE are skipped: there a missing value is the filter's job (Blend HLB
+// counts only the rows that carry an HLB). Sub-formula rows carry no ing.*
+// values at all and are reported on their own. Rows with amount 0 add nothing
+// either way and are left out.
+const _TP_TEXT_FIELDS = new Set(['uid', 'name', 'chemicalname', 'chemical', 'cas', 'grade', 'supplier', 'catalog', 'state', 'function', 'storage', 'class', 'inchikey', 'sequence', 'sequencetype', 'taxon']);
+function _tpFieldRefs(str) {
+  const out = [];
+  const s = String(str || '');
+  s.replace(/\bing\.([A-Za-z_$][\w$]*)/g, (m, n) => { out.push(n.toLowerCase()); return m; });
+  s.replace(/\bing\[\s*(['"])(.*?)\1\s*\]/g, (m, q, n) => { out.push(String(n).toLowerCase()); return m; });
+  return out;
+}
+function _tpMissingInputs(formula, rows) {
+  const guarded = new Set();
+  const outside = String(formula || '').replace(/\bWHERE\b[^)]*/gi, m => { _tpFieldRefs(m).forEach(f => guarded.add(f)); return ' '; });
+  const fields = [...new Set(_tpFieldRefs(outside))].filter(f => !guarded.has(f) && !_TP_TEXT_FIELDS.has(f));
+  const res = { fields: [], subs: [], ingredients: [], mixed: [] };
+  if (!fields.length) return res;
+  const byField = {};
+  const names = new Set();
+  const unitsBy = {};   // field → { unit: [ingredient names] }, rows that have a value
+  (rows || []).forEach(r => {
+    if (!r || !r.ing || !(r.amount > 0 || r.amount < 0)) return;
+    if (r.ing._isSubFormula) { res.subs.push(r._subName || 'sub-formula'); return; }
+    const nm = r.ing._missing ? '(deleted ingredient)' : (r.ing.name || '(unnamed)');
+    fields.forEach(f => {
+      const v = r.ing._missing ? undefined : r.ing[f];
+      if (typeof v === 'number' && Number.isFinite(v)) {
+        const u = r._cfUnits && r._cfUnits[f];
+        if (u) ((unitsBy[f] = unitsBy[f] || {})[u] = unitsBy[f][u] || []).push(nm);
+        return;
+      }
+      (byField[f] = byField[f] || []).push(nm);
+      names.add(nm);
+    });
+  });
+  res.fields = fields.filter(f => byField[f]).map(f => ({ field: f, names: byField[f] }));
+  // Mixed units: the sum reads bare numbers, so 500 mg/100g of sodium next to
+  // 0.4 g/100g is off by 1000× without a word. Flag a field whose ingredients
+  // carry two or more different unit labels; rows with no unit are not counted
+  // (most workspaces never set one, and that is not a conflict).
+  res.mixed = fields.filter(f => unitsBy[f] && Object.keys(unitsBy[f]).length > 1)
+    .map(f => ({ field: f, units: Object.entries(unitsBy[f]).sort((a, b) => b[1].length - a[1].length).map(([unit, names]) => ({ unit, names })) }));
+  res.ingredients = [...names];
+  return res;
+}
+// One short line for the table (and its tooltip), '' when nothing is missing.
+function _tpMissingNote(miss) {
+  if (!miss) return null;
+  const parts = [], tips = [];
+  if (miss.ingredients.length) {
+    const n = miss.ingredients.length;
+    parts.push(`${n} ingredient${n === 1 ? '' : 's'} missing ${miss.fields.map(x => x.field).join(', ')}`);
+    miss.fields.forEach(x => tips.push(`No ${x.field}: ${x.names.join(', ')}`));
+    tips.push('Those rows are not counted. Enter 0 where an ingredient truly has none.');
+  }
+  (miss.mixed || []).forEach(m => {
+    parts.push(`${m.field} in mixed units (${m.units.map(u => `${u.unit} ×${u.names.length}`).join(', ')})`);
+    tips.push(`${m.field} — ` + m.units.map(u => `${u.unit}: ${u.names.join(', ')}`).join('; ') + '. The sum reads the bare numbers, so convert them to one unit.');
+  });
+  if (miss.subs.length) {
+    const n = miss.subs.length;
+    parts.push(`${n} sub-formula row${n === 1 ? '' : 's'} not counted`);
+    tips.push(`Sub-formulas carry no ingredient values here: ${miss.subs.join(', ')}. Flatten the recipe, or account for them in the formula.`);
+  }
+  return parts.length ? { text: parts.join(' · '), tip: tips.join('\n') } : null;
+}
+
+function renderTheoreticalParamsHtml(entityType, entity) {
+  const params = _tpEffectiveParams(entityType, entity);
+  const { source, rows } = _tpEffectiveComposition(entityType, entity);
+  const evalRows = _tpBuildRows(rows);
+  const isBatch = entityType === 'batch';
+  const isOverride = isBatch && Array.isArray(entity.theoreticalParamsOverride);
+
+  const headerNote = isBatch
+    ? (isOverride
+        ? `<span class="badge badge-blue" style="margin-left:8px;font-size:11px" title="This batch has its own parameter list; won't change when the formula's params are edited">Override</span>`
+        : `<span style="margin-left:8px;font-size:11px;color:var(--text-muted)" title="Inheriting the formula's parameter list">inheriting from formula</span>`)
+    : '';
+  const compSourceChip = isBatch
+    ? `<span style="font-size:11px;color:var(--text-muted)" title="${source === 'actual' ? 'Evaluated against the batch as-prepared composition' : 'Evaluated against the formula proposal; no batch actual logged yet'}">computed on <strong>${source === 'actual' ? 'actual' : 'proposal'}</strong></span>`
+    : '';
+
+  const actions = [];
+  actions.push(`<button class="btn btn-primary btn-sm" onclick="openTheoreticalParamModal('${entityType}','${entity.id}')">+ Add parameter</button>`);
+  if (typeof _tpPresetCatalog === 'function' && _tpPresetCatalog().length) {
+    actions.push(`<button class="btn btn-secondary btn-sm" onclick="openTheoreticalParamPresets('${entityType}','${entity.id}')" title="Pick from a catalog of common industry parameters (NV, OHV, PVC, VOC, energy, protein, …)">▤ Preset…</button>`);
+  }
+  if (isBatch && isOverride) {
+    actions.push(`<button class="btn btn-secondary btn-sm" onclick="resetBatchTheoreticalParams('${entity.id}')" title="Discard the override and inherit the formula's parameter list again"><span class="fl-ar fl-undo"></span> Reset to formula</button>`);
+  }
+
+  const emptyState = !params.length
+    ? `<div style="text-align:center;color:var(--text-muted);padding:24px;font-size:13px;line-height:1.55">
+        No theoretical parameters yet. Create a custom parameter or pick one from the
+        preset catalog to start tracking values.
+      </div>`
+    : '';
+
+  // Evaluate the whole list together so `[Param Name]` cross-references
+  // resolve in dependency order (with cycle detection).
+  const evalAll = _tpEvaluateAll(params, evalRows);
+  // Name → resolved value, for the "Show calculation" panel's [Param] references.
+  const _tpValueMap = {};
+  params.forEach(p => { const r = evalAll[p.id]; if (p.name && r && !r.error && Number.isFinite(r.value)) _tpValueMap[String(p.name).trim().toLowerCase()] = r.value; });
+
+  const rowsHtml = params.map(p => {
+    const r = evalAll[p.id] || { value: null, error: '' };
+    const value = r.error ? null : r.value;
+    const errorText = r.error || '';
+    const valueStr = errorText
+      ? `<span style="color:var(--danger)" title="${esc(errorText)}">ERR</span>`
+      : (Number.isFinite(value) ? _tpFmtValue(value) : '—');
+
+    // Pass/fail vs. spec, if defined
+    const pfBadge = (!errorText && Number.isFinite(value)) ? _tpSpecBadgeHtml(value, p.spec) : '';
+
+    const miss = (!errorText && Number.isFinite(value)) ? _tpMissingNote(_tpMissingInputs(p.formula, evalRows)) : null;
+    const missHtml = miss ? `<div class="tp-miss" title="${esc(miss.tip)}" style="margin-top:3px;font-size:11px;font-weight:400;color:#b45309;cursor:help">⚠ ${esc(miss.text)}</div>` : '';
+
+    const formulaPreview = (p.formula || '').length > 80
+      ? esc(p.formula.slice(0, 80)) + '…'
+      : esc(p.formula || '');
+
+    return `<tr style="border-bottom:1px solid #f1f5f9">
+      <td style="padding:8px 12px;font-weight:500;color:#0f172a">${esc(p.name || '—')}${p.pinned ? ` <span class="fl-pin" title="Pinned to the summary" role="img" aria-label="pinned" style="width:.8em;height:.8em;color:var(--primary);margin-left:3px"></span>` : ''}${missHtml}</td>
+      <td style="padding:8px 12px;text-align:right;font-variant-numeric:tabular-nums">
+        <strong>${valueStr}</strong>${p.unit ? ` <span translate="no" style="font-size:11px;color:#94a3b8">${esc(p.unit)}</span>` : ''}
+      </td>
+      <td style="padding:8px 12px;text-align:center">${pfBadge}</td>
+      <td style="padding:8px 12px;font-family:ui-monospace,monospace;font-size:11px;color:#475569" title="${esc(p.formula || '')}">
+        <span>${formulaPreview}</span>
+        ${(!errorText && Number.isFinite(value)) ? `<button onclick="_tpToggleCalc('${p.id}')" title="Show how this value was calculated" style="margin-left:8px;font-family:inherit;font-size:10px;padding:1px 7px;background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;border-radius:9999px;cursor:pointer;white-space:nowrap">Show calc</button>` : ''}
+      </td>
+      <td style="padding:8px 12px;text-align:right;white-space:nowrap">
+        <button class="btn btn-secondary btn-sm btn-icon" onclick="openTheoreticalParamModal('${entityType}','${entity.id}','${p.id}')" title="Edit">${typeof ICON !== 'undefined' && ICON.edit ? ICON.edit : '✎'}</button>
+        <button class="btn btn-danger btn-sm btn-icon" onclick="confirmDeleteTheoreticalParam('${entityType}','${entity.id}','${p.id}','${escJsAttr(p.name||'')}')"><span class="fl-cross" aria-hidden="true"></span></button>
+      </td>
+    </tr>
+    ${(!errorText && Number.isFinite(value)) ? `<tr id="tp-calc-${p.id}" style="display:none"><td colspan="5" style="padding:0">${_tpCalcHtml(p, evalRows, _tpValueMap)}</td></tr>` : ''}`;
+  }).join('');
+
+  const tableHtml = params.length ? `
+    <div style="overflow-x:auto">
+      <table style="width:100%;border-collapse:collapse;font-size:13px">
+        <thead>
+          <tr style="background:#f8fafc;border-bottom:2px solid var(--border)">
+            <th style="text-align:left;padding:8px 12px;font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.05em">Parameter</th>
+            <th style="text-align:right;padding:8px 12px;font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.05em">Value</th>
+            <th style="text-align:center;padding:8px 12px;font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.05em" title="Pass/fail vs. spec, when a spec is defined">Result</th>
+            <th style="text-align:left;padding:8px 12px;font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.05em">Formula</th>
+            <th></th>
+          </tr>
+        </thead>
+        <tbody>${rowsHtml}</tbody>
+      </table>
+    </div>` : '';
+
+  return `<div class="card" style="margin-bottom:16px">
+    <div class="card-header">
+      <h2>ƒx Theoretical Parameters ${headerNote}<button class="ai-help-btn" onclick="_aiAskInline('What are theoretical parameters in FormLab and how do I add or edit one?')" title="Ask AI to explain theoretical parameters">✦ Explain</button></h2>
+      <div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end">
+        ${compSourceChip}
+        ${actions.join('')}
+      </div>
+    </div>
+    <div class="card-body" style="padding:${params.length ? '0' : '14px'}">
+      ${emptyState}
+      ${tableHtml}
+    </div>
+  </div>`;
+}
+
+// Compact read-only chips for parameters the user pinned (param.pinned),
+// for the formulation / batch summary bars. Each chip shows name: value unit
+// with a green/red tint when a spec is defined and the value is out of range.
+// Returns '' when nothing is pinned, so callers can append unconditionally.
+function _tpPinnedChipsHtml(entityType, entity) {
+  if (!entity) return '';
+  const allParams = _tpEffectiveParams(entityType, entity);
+  const params = allParams.filter(p => p && p.pinned);
+  if (!params.length) return '';
+  const { rows } = _tpEffectiveComposition(entityType, entity);
+  // Evaluate ALL params — not just the pinned subset — so a pinned parameter
+  // that cross-references a NON-pinned sibling (e.g. "P:B ratio = [Pigment
+  // loading] / [Binder]") still resolves. Evaluating only the pinned set left
+  // those refs undefined → a spurious ERR chip even though the Params table
+  // (which evaluates everything) showed a valid value.
+  const chipRows = _tpBuildRows(rows);
+  const evalAll = _tpEvaluateAll(allParams, chipRows);
+  const chips = params.map(p => {
+    const r = evalAll[p.id] || { value: null, error: '' };
+    const valueStr = r.error
+      ? 'ERR'
+      : (Number.isFinite(r.value) ? _tpFmtValue(r.value) : '—');
+    // Spec tint (matches the table's pass/fail badge colours)
+    let bg = '#f1f5f9', fg = '#334155', bd = '#e2e8f0';
+    if (!r.error && Number.isFinite(r.value) && p.spec) {
+      const okMin = p.spec.min == null || r.value >= p.spec.min;
+      const okMax = p.spec.max == null || r.value <= p.spec.max;
+      if (okMin && okMax) { bg = '#dcfce7'; fg = '#15803d'; bd = '#bbf7d0'; }
+      else                { bg = '#fee2e2'; fg = '#b91c1c'; bd = '#fecaca'; }
+    } else if (r.error) { fg = '#b91c1c'; }
+    const miss = (!r.error && Number.isFinite(r.value)) ? _tpMissingNote(_tpMissingInputs(p.formula, chipRows)) : null;
+    const title = r.error ? r.error : ((p.description || `${p.name}${p.unit ? ' (' + p.unit + ')' : ''}`) + (miss ? '\n⚠ ' + miss.text + '\n' + miss.tip : ''));
+    return `<span title="${esc(title)}" style="display:inline-flex;align-items:baseline;gap:5px;padding:3px 9px;border-radius:9999px;background:${bg};border:1px solid ${bd};font-size:11.5px;line-height:1.4;white-space:nowrap">
+      <span style="color:#64748b">${esc(p.name)}</span>
+      <strong style="color:${fg};font-variant-numeric:tabular-nums">${esc(valueStr)}</strong>${miss ? '<span style="color:#b45309" aria-label="some ingredient values missing">⚠</span>' : ''}${p.unit ? `<span translate="no" style="color:#94a3b8;font-size:10.5px">${esc(p.unit)}</span>` : ''}
+    </span>`;
+  }).join('');
+  return `<div class="tp-pinned-chips" style="display:flex;flex-wrap:wrap;gap:6px;align-items:center" title="Pinned theoretical parameters">
+    <span style="font-size:11px;color:#94a3b8" aria-hidden="true">ƒx</span>${chips}
+  </div>`;
+}
+
+// Number formatting that mirrors the rest of the testing/stability UI
+function _tpFmtValue(v) {
+  if (!Number.isFinite(v)) return '—';
+  const a = Math.abs(v);
+  if (a === 0)    return '0';
+  // Large values: readable thousands-separated, or compact k/M/B for very big —
+  // never scientific notation (a cost figure read as "6.28e+4", which looks broken).
+  if (a >= 1e9)   return (v / 1e9).toFixed(2).replace(/\.?0+$/, '') + 'B';
+  if (a >= 1e6)   return (v / 1e6).toFixed(2).replace(/\.?0+$/, '') + 'M';
+  if (a >= 10000) return Math.round(v).toLocaleString('en-US');
+  if (a >= 100)   return v.toFixed(1);
+  if (a >= 1)     return v.toFixed(2);
+  if (a >= 0.01)  return v.toFixed(3);
+  return v.toPrecision(2);
+}
+
+// Pass/fail pill for a computed value against a { min, max } spec (either
+// bound optional). '' when there's no spec to judge against. Shared by the
+// saved params table and the modal's live preview — the preview passes the
+// spec fields' CURRENT (possibly unsaved) values instead of p.spec, so
+// editing Spec min/max updates the color immediately, same as editing the
+// formula already did (Jun, 2026-09-22).
+function _tpSpecBadgeHtml(value, spec) {
+  if (!Number.isFinite(value) || !spec || (spec.min == null && spec.max == null)) return '';
+  const okMin = spec.min == null || value >= spec.min;
+  const okMax = spec.max == null || value <= spec.max;
+  const pass = okMin && okMax;
+  const min = spec.min != null ? _tpFmtValue(spec.min) : '–∞';
+  const max = spec.max != null ? _tpFmtValue(spec.max) : '+∞';
+  return pass
+    ? `<span style="display:inline-block;padding:1px 7px;border-radius:9999px;background:#dcfce7;color:#15803d;font-size:11px;font-weight:500" title="Within spec ${min}..${max}"><span class="fl-check" aria-hidden="true"></span></span>`
+    : `<span style="display:inline-block;padding:1px 7px;border-radius:9999px;background:#fee2e2;color:#b91c1c;font-size:11px;font-weight:500" title="Outside spec ${min}..${max}"><span class="fl-cross" aria-hidden="true"></span></span>`;
+}
+
+// ---- Modal ----
+//
+// Add/edit a single parameter. Live preview at the bottom shows the
+// computed value against the current composition AND lists the rows
+// used + any ingredients that are missing a referenced field. Helps
+// the user debug their formula before saving.
+// ---- Formula builder palette (click-to-insert) -------------------------
+// Non-programmer aid for the theoretical-parameter editor: instead of
+// memorizing the row.* / ing.* vocabulary, users click a chip and the token
+// drops into the formula at the cursor. The ingredient chips are built from
+// the ACTUAL composition, so only fields that exist on these ingredients
+// (standard + custom, and only when populated) are offered.
+function _tpInsert(token) {
+  const ta = document.getElementById('tp-formula');
+  if (!ta || !token) return;
+  const start = ta.selectionStart ?? ta.value.length;
+  const end   = ta.selectionEnd ?? ta.value.length;
+  const before = ta.value.slice(0, start);
+  const after  = ta.value.slice(end);
+  // Auto-space so a clicked token doesn't fuse onto the previous one.
+  const needsSpace = before.length > 0 && !/[\s(*/+\-,]$/.test(before);
+  const ins = (needsSpace ? ' ' : '') + token;
+  ta.value = before + ins + after;
+  // Caret lands INSIDE a trailing "()" (an aggregation) so the next click
+  // fills its argument; otherwise just after the inserted token.
+  const caret = token.endsWith('()') ? start + ins.length - 1 : start + ins.length;
+  ta.focus();
+  ta.setSelectionRange(caret, caret);
+  ta.dispatchEvent(new Event('input', { bubbles: true }));   // fires oninput → live preview
+}
+function _tpInsertFromEl(el) { if (el) _tpInsert(el.getAttribute('data-tok') || ''); }
+
+// Build the click-to-insert palette for THIS entity's fields.
+function _tpFieldPaletteHtml(evalRows, params, currentParamId) {
+  const chip = (tok, label, title) =>
+    `<button type="button" class="tp-chip" data-tok="${esc(tok)}" onclick="_tpInsertFromEl(this)" title="${esc(title || tok)}">${esc(label || tok)}</button>`;
+  const group = (label, chips) => chips
+    ? `<div class="tp-palette-group"><span class="tp-palette-label">${esc(label)}</span>${chips}</div>` : '';
+
+  // Aggregations — the wrapper a row/ing field must sit inside.
+  const aggs = ['SUM', 'AVG', 'MIN', 'MAX', 'COUNT']
+    .map(a => chip(`${a}()`, `${a}()`, `${a} across all ingredient rows`)).join('')
+    + chip('WHERE', 'WHERE', 'Keep only some rows, e.g. SUM(row.amount) WHERE ing.purity > 0');
+
+  // Row fields — always available.
+  const rowChips = [
+    ['row.amount', 'the amount / weight of the row'],
+    ['row.role', 'the row’s role (text — use in WHERE)'],
+    ['row.unit', 'the row’s unit (text — use in WHERE)'],
+  ].map(([t, d]) => chip(t, t, d)).join('');
+
+  // Ingredient fields — ONLY those populated on ≥1 ingredient in this recipe.
+  const seen = new Map();  // fieldName -> { count, sample, numeric }
+  (evalRows || []).forEach(r => {
+    const ing = r.ing; if (!ing || ing._isSubFormula) return;
+    Object.keys(ing).forEach(k => {
+      const val = ing[k];
+      if (val == null || val === '' || k === 'uid') return;
+      const e = seen.get(k) || { count: 0, sample: val, numeric: typeof val === 'number' };
+      e.count++; seen.set(k, e);
+    });
+  });
+  // Token form: bare identifiers use ing.x; names with spaces/symbols use ing['x'].
+  const tokenFor = (name) => /^[A-Za-z_][A-Za-z0-9_]*$/.test(name) ? `ing.${name}` : `ing['${String(name).replace(/'/g, "\\'")}']`;
+  const entries = [...seen.entries()];
+  const fieldChip = ([name, e]) => chip(tokenFor(name), tokenFor(name),
+    `${e.numeric ? 'number' : 'text'} · e.g. ${String(e.sample).slice(0, 18)} · on ${e.count} ingredient${e.count === 1 ? '' : 's'}`);
+  const numChips = entries.filter(([, e]) => e.numeric).sort((a, b) => b[1].count - a[1].count).map(fieldChip).join('');
+  const txtChips = entries.filter(([, e]) => !e.numeric).sort((a, b) => b[1].count - a[1].count).slice(0, 10).map(fieldChip).join('');
+
+  // Other parameters — referenceable by [Name].
+  const paramChips = (params || [])
+    .filter(pp => pp.id !== currentParamId && pp.name)
+    .map(pp => chip(`[${pp.name}]`, `[${pp.name}]`, 'Use this parameter’s computed value')).join('');
+
+  const numNote = `<span style="font-size:11px;color:#b45309">No numeric fields on these ingredients yet — add values like density, or a custom field such as “solids”, on the Ingredients page to use them here.</span>`;
+
+  return `
+    <div style="margin-top:6px;padding:9px 11px;background:#f8fafc;border:1px solid var(--border);border-radius:6px">
+      <div style="font-size:11.5px;color:var(--text-muted);margin-bottom:7px;line-height:1.55">
+        <strong style="color:var(--text)">Click to build.</strong> A formula runs across every ingredient row, so wrap fields in an aggregation like <code>SUM()</code> or <code>AVG()</code>. Try: click <code>AVG()</code>, then (cursor inside the brackets) click <code>ing.density</code>.
+      </div>
+      ${group('Aggregations', aggs)}
+      ${group('Row fields', rowChips)}
+      ${group('Ingredient numbers', numChips || numNote)}
+      ${group('Ingredient text', txtChips)}
+      ${group('Other parameters', paramChips)}
+    </div>`;
+}
+
+function openTheoreticalParamModal(entityType, entityId, paramId) {
+  const entity = entityType === 'batch'
+    ? getBatch(entityId)
+    : db.formulations.find(x => x.id === entityId);
+  if (!entity) return;
+  const params = _tpEffectiveParams(entityType, entity);
+  const p = paramId ? params.find(x => x.id === paramId) : null;
+  const { rows: compRows } = _tpEffectiveComposition(entityType, entity);
+  const evalRows = _tpBuildRows(compRows);
+
+  const initialName    = p?.name || '';
+  const initialFormula = p?.formula || '';
+  const initialUnit    = p?.unit || '';
+  const initialSpecMin = p?.spec?.min != null ? String(p.spec.min) : '';
+  const initialSpecMax = p?.spec?.max != null ? String(p.spec.max) : '';
+  const initialDesc    = p?.description || '';
+  const initialPinned  = !!p?.pinned;
+
+  showModal(`${p ? 'Edit' : 'Add'} Theoretical Parameter`, `
+    <div class="form-grid">
+      <div class="form-group span-2">
+        <label>Name *</label>
+        <input id="tp-name" value="${esc(initialName)}" placeholder="e.g. Non-Volatiles" />
+      </div>
+      <div class="form-group span-2">
+        <label>Formula *</label>
+        <textarea id="tp-formula" style="min-height:60px;font-family:ui-monospace,monospace;font-size:13px"
+                  placeholder="AVG(ing.density)   —  or click the chips below to build one"
+                  oninput="_tpRefreshPreview('${entityType}','${entityId}')">${esc(initialFormula)}</textarea>
+        ${_tpFieldPaletteHtml(evalRows, params, p?.id)}
+      </div>
+      <div class="form-group">
+        <label>Live preview</label>
+        <div id="tp-preview" class="tp-preview-card"></div>
+      </div>
+      <div class="form-group">
+        <label>Unit</label>
+        <input id="tp-unit" value="${esc(initialUnit)}" placeholder="%, mg KOH/g, g/L, kcal/100g, …" />
+      </div>
+      <div class="form-group">
+        <label>Spec min <span style="font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0">(optional)</span></label>
+        <input id="tp-spec-min" type="number" step="any" value="${esc(initialSpecMin)}" oninput="_tpRefreshPreview('${entityType}','${entityId}')" />
+      </div>
+      <div class="form-group">
+        <label>Spec max <span style="font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0">(optional)</span></label>
+        <input id="tp-spec-max" type="number" step="any" value="${esc(initialSpecMax)}" oninput="_tpRefreshPreview('${entityType}','${entityId}')" />
+      </div>
+      <div class="form-group span-2">
+        <label>Description <span style="font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0">(optional; shown on hover)</span></label>
+        <input id="tp-desc" value="${esc(initialDesc)}" placeholder="What this parameter represents and why it matters" />
+      </div>
+      <div class="form-group span-2">
+        <label style="display:flex;align-items:flex-start;gap:8px;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:500">
+          <input id="tp-pinned" type="checkbox" ${initialPinned ? 'checked' : ''} style="width:auto;margin:0" />
+          Pin to summary<br><span style="font-weight:400;color:var(--text-muted)">Shows this value as a chip on the formula &amp; batch summary, not just the parameters tab</span>
+        </label>
+      </div>
+    </div>
+  `, () => {
+    const name = (v('tp-name') || '').trim();
+    if (!name) { toast('Name is required.'); return false; }
+    const formula = (v('tp-formula') || '').trim();
+    if (!formula) { toast('Formula is required.'); return false; }
+    // Compile-check before save — surface parse errors at the modal. Resolve
+    // `[Param Name]` cross-references to a placeholder number FIRST (the live
+    // preview does the same with real values), otherwise a valid cross-ref like
+    // `[Total weight] / COUNT()` is parsed as raw JS — `[Total weight]` reads as
+    // an array literal → "Unexpected identifier 'weight'". This is a syntax
+    // check only; real ref resolution (unknown name / cycle → ERR) happens at
+    // eval time in _tpEvaluateAll, so we don't block saving a forward-reference.
+    const checkSrc = (typeof _tpSubstituteParamRefs === 'function')
+      ? _tpSubstituteParamRefs(formula, {})   // unknown refs → (NaN); fine for a parse check
+      : formula;
+    try { _tpCompile(checkSrc); } catch (e) { toast(`Formula error: ${e.message}`); return false; }
+    const data = {
+      name,
+      formula,
+      unit: (v('tp-unit') || '').trim(),
+      description: (v('tp-desc') || '').trim(),
+      pinned: !!document.getElementById('tp-pinned')?.checked,
+      spec: null,
+    };
+    const sMin = v('tp-spec-min'); const sMax = v('tp-spec-max');
+    const minNum = sMin === '' ? null : parseFloat(sMin);
+    const maxNum = sMax === '' ? null : parseFloat(sMax);
+    if (minNum != null || maxNum != null) {
+      data.spec = { min: Number.isFinite(minNum) ? minNum : null, max: Number.isFinite(maxNum) ? maxNum : null };
+    }
+    if (p) updateTheoreticalParam(entityType, entityId, p.id, data);
+    else   addTheoreticalParam(entityType, entityId, data);
+    if (entityType === 'batch') renderBatchDetail(entityId);
+    else renderFormulationDetail(entityId);
+  });
+
+  // A touch wider than the default modal — the formula, click-to-build palette
+  // and the result card breathe better with the extra room (chips wrap less).
+  document.querySelector('#modal-backdrop > .modal')?.classList.add('tp-modal-wide');
+  // Fire an initial preview render
+  setTimeout(() => _tpRefreshPreview(entityType, entityId), 0);
+}
+
+// Render the live preview underneath the formula textarea.
+function _tpRefreshPreview(entityType, entityId) {
+  const wrap = document.getElementById('tp-preview');
+  if (!wrap) return;
+  const formula = (document.getElementById('tp-formula')?.value || '').trim();
+  wrap.classList.remove('tp-preview-error');
+  if (!formula) {
+    wrap.innerHTML = '<span style="color:var(--text-muted)">Build or type a formula above — its computed value appears here as you go.</span>';
+    return;
+  }
+  const entity = entityType === 'batch' ? getBatch(entityId) : db.formulations.find(x => x.id === entityId);
+  if (!entity) { wrap.innerHTML = '<span style="color:var(--danger)">Entity not found.</span>'; return; }
+  const { source, rows } = _tpEffectiveComposition(entityType, entity);
+  const evalRows = _tpBuildRows(rows);
+  const ingMissingFields = new Set();
+  // Detect refs to ing.X / ing['X'] so we can warn when the row's ingredient lacks them
+  const referencedIngFields = new Set();
+  const re = /\bing\s*(?:\.\s*([A-Za-z_][A-Za-z0-9_]*)|\[\s*['"]([^'"]+)['"]\s*\])/g;
+  let m;
+  while ((m = re.exec(formula)) !== null) referencedIngFields.add(m[1] || m[2]);
+  evalRows.forEach(r => {
+    referencedIngFields.forEach(field => {
+      if (r.ing && r.ing[field] == null && !r.ing._isSubFormula) {
+        ingMissingFields.add(`${r.ing.name || '?'}: ${field}`);
+      }
+    });
+  });
+  // Resolve `[Param Name]` cross-references against the entity's other
+  // parameters so the live preview matches what the saved table will show.
+  const otherParams = _tpEffectiveParams(entityType, entity);
+  const otherResults = _tpEvaluateAll(otherParams, evalRows);
+  const paramValueMap = {};
+  const knownParamNames = new Set();
+  otherParams.forEach(p => {
+    const nm = String(p.name || '').trim().toLowerCase();
+    if (!nm) return;
+    knownParamNames.add(nm);
+    const r = otherResults[p.id];
+    if (r && Number.isFinite(r.value)) paramValueMap[nm] = r.value;
+  });
+  const unknownRefs = _tpScanParamRefs(formula)
+    .map(r => r.name)
+    .filter(n => !knownParamNames.has(n.toLowerCase()));
+
+  let result;
+  try {
+    result = _tpEvaluate(_tpSubstituteParamRefs(formula, paramValueMap), evalRows);
+  } catch (e) {
+    wrap.classList.add('tp-preview-error');
+    wrap.innerHTML = `<div style="color:var(--danger);font-size:12.5px"><strong>Can’t compute yet:</strong> ${esc(e.message)}</div>`;
+    return;
+  }
+  const valueStr = Number.isFinite(result) ? _tpFmtValue(result) : (result == null ? '—' : String(result));
+  const unit = (document.getElementById('tp-unit')?.value || '').trim();
+  const sourceChip = entityType === 'batch'
+    ? `<span style="color:var(--text-muted);font-size:11px;margin-left:6px">on ${source === 'actual' ? 'actual composition' : 'formula proposal'}</span>`
+    : '';
+  // Judged against the Spec min/max fields' CURRENT values, not a saved
+  // p.spec — so editing them updates this color before the row is saved,
+  // the same live behavior the formula field already had.
+  const specMinRaw = document.getElementById('tp-spec-min')?.value;
+  const specMaxRaw = document.getElementById('tp-spec-max')?.value;
+  const liveSpec = {
+    min: specMinRaw !== '' && specMinRaw != null ? parseFloat(specMinRaw) : null,
+    max: specMaxRaw !== '' && specMaxRaw != null ? parseFloat(specMaxRaw) : null,
+  };
+  const pfBadge = _tpSpecBadgeHtml(result, liveSpec);
+  const missingHtml = ingMissingFields.size
+    ? `<div style="margin-top:6px;color:#d97706;font-size:11.5px"><strong><span class="fl-warn" aria-hidden="true"></span> ${ingMissingFields.size} missing field${ingMissingFields.size===1?'':'s'}:</strong> ${[...ingMissingFields].slice(0, 4).map(esc).join(', ')}${ingMissingFields.size > 4 ? '…' : ''}</div>`
+    : '';
+  const unknownRefHtml = unknownRefs.length
+    ? `<div style="margin-top:6px;color:#d97706;font-size:11.5px"><strong><span class="fl-warn" aria-hidden="true"></span> Unknown parameter${unknownRefs.length===1?'':'s'}:</strong> ${unknownRefs.slice(0, 4).map(n => esc('[' + n + ']')).join(', ')}${unknownRefs.length > 4 ? '…' : ''} — check the name matches another parameter exactly.</div>`
+    : '';
+  wrap.innerHTML = `
+    <div style="display:flex;align-items:baseline;gap:8px;flex-wrap:wrap">
+      <span style="font-size:15px;color:#94a3b8;font-weight:600" aria-hidden="true">=</span>
+      <span style="font-size:28px;line-height:1.1;font-weight:700;color:var(--primary);font-variant-numeric:tabular-nums">${esc(valueStr)}</span>
+      ${unit ? `<span translate="no" style="font-size:14px;color:var(--text-muted);font-weight:500">${esc(unit)}</span>` : ''}
+      ${pfBadge}
+      ${sourceChip}
+    </div>
+    <div style="margin-top:5px;color:var(--text-muted);font-size:11.5px">Evaluated over ${evalRows.length} composition row${evalRows.length===1?'':'s'}.</div>
+    ${missingHtml}
+    ${unknownRefHtml}
+  `;
+}
+
+// ---- Preset catalog ----
+//
+// Industry-standard parameters users can one-click add. Drawn from the
+// Allnex/Morgan/BASF gap analyses + common coatings practice. Each
+// preset is the same shape as a stored parameter; click to add to the
+// current formulation/batch.
+function _tpPresetCatalog() {
+  return [
+    // ---- Coatings ----
+    {
+      group: 'Coatings',
+      name: 'Non-Volatiles (NV)',
+      unit: '%',
+      formula: "SUM(row.amount * ing.solids) / SUM(row.amount)",
+      description: 'Weighted average of ingredient solids %, weighted by row amount. Needs ing.solids (custom field, 0–100).',
+    },
+    {
+      group: 'Coatings',
+      name: 'Hydroxylic Value (OHV)',
+      unit: 'mg KOH/g',
+      formula: "56100 * SUM(row.amount * ing['OH mol']) / SUM(row.amount)",
+      description: 'OHV = 56100 × Σ(weight × mol OH) / total weight. Needs ing[\"OH mol\"] (mol OH per gram).',
+    },
+    {
+      group: 'Coatings',
+      name: 'Acid Value (AV)',
+      unit: 'mg KOH/g',
+      formula: "56100 * SUM(row.amount * ing['acid mol']) / SUM(row.amount)",
+      description: 'AV = 56100 × Σ(weight × mol acid) / total weight. Needs ing[\"acid mol\"] (mol COOH per gram).',
+    },
+    {
+      group: 'Coatings',
+      name: 'Pigment Volume Concentration (PVC)',
+      unit: '%',
+      formula: "100 * SUM(row.amount / ing.density WHERE ing.class == 'Pigment') / SUM(row.amount / ing.density WHERE ing.density)",
+      description: 'PVC = pigment volume / total non-volatile volume. Needs ing.density and ing.class on each row.',
+    },
+    {
+      group: 'Coatings',
+      name: 'VOC (g/L)',
+      unit: 'g/L',
+      formula: "1000 * SUM(row.amount WHERE ing.class == 'Solvent') / SUM(row.amount / ing.density WHERE ing.density)",
+      description: 'Volatile-organic-compound load per litre of paint. Needs ing.class and ing.density.',
+    },
+    {
+      group: 'Coatings',
+      name: 'Solids by Weight',
+      unit: '%',
+      formula: "100 * SUM(row.amount * ing.solids) / (100 * SUM(row.amount))",
+      description: 'Same as NV but rescaled to 0–100 if ing.solids is stored as fraction (0–1).',
+    },
+    // ---- Surfactants / emulsions ----
+    {
+      group: 'Surfactants',
+      name: 'Blend HLB',
+      unit: '',
+      formula: "SUM(row.amount * ing.hlb WHERE ing.hlb) / SUM(row.amount WHERE ing.hlb)",
+      description: 'Weight-average HLB of the emulsifier blend (only rows that carry an HLB count). Match it to the oil phase\'s required HLB. Needs ing.hlb (Surfactant details, 0–20).',
+    },
+    // ---- Food & nutrition ----
+    // Per 100 g of product: Σ(row wt% × ingredient value per 100 g) / Σ(row wt%).
+    // Dividing by SUM(row.amount), not 100, keeps it right when the rows don't
+    // add up to exactly 100 (grams are converted to wt% before this runs).
+    {
+      group: 'Food & nutrition',
+      name: 'Energy',
+      unit: 'kcal/100g',
+      formula: 'SUM(row.amount * (4 * ing.protein + 4 * ing.carb + 9 * ing.fat)) / SUM(row.amount)',
+      description: 'Energy from the general Atwater factors: 4 kcal/g protein, 4 kcal/g carbohydrate, 9 kcal/g fat. Needs ing.protein, ing.carb and ing.fat (g/100g). An ingredient missing any one of the three adds nothing at all, so fill all three.',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Energy (kJ)',
+      unit: 'kJ/100g',
+      formula: 'SUM(row.amount * (17 * ing.protein + 17 * ing.carb + 37 * ing.fat)) / SUM(row.amount)',
+      description: 'Energy in kilojoules: 17 kJ/g protein, 17 kJ/g carbohydrate, 37 kJ/g fat. Needs ing.protein, ing.carb and ing.fat (g/100g).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Protein',
+      unit: 'g/100g',
+      formula: 'SUM(row.amount * ing.protein) / SUM(row.amount)',
+      description: 'Protein per 100 g of product. Needs ing.protein (g/100g).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Total fat',
+      unit: 'g/100g',
+      formula: 'SUM(row.amount * ing.fat) / SUM(row.amount)',
+      description: 'Fat per 100 g of product. Needs ing.fat (g/100g).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Carbohydrate',
+      unit: 'g/100g',
+      formula: 'SUM(row.amount * ing.carb) / SUM(row.amount)',
+      description: 'Carbohydrate per 100 g of product. Needs ing.carb (g/100g).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Total sugars',
+      unit: 'g/100g',
+      formula: 'SUM(row.amount * ing.sugar) / SUM(row.amount)',
+      description: 'Sugars per 100 g of product. Needs ing.sugar (g/100g).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Sodium',
+      unit: 'mg/100g',
+      formula: 'SUM(row.amount * ing.sodium) / SUM(row.amount)',
+      description: 'Sodium per 100 g of product. Needs ing.sodium in mg/100g (table salt is about 39,300).',
+    },
+    {
+      group: 'Food & nutrition',
+      name: 'Salt',
+      unit: 'g/100g',
+      formula: '2.5 * SUM(row.amount * ing.sodium) / SUM(row.amount) / 1000',
+      description: 'Salt equivalent as on EU labels: sodium × 2.5, in g/100g. Needs ing.sodium in mg/100g.',
+    },
+    // ---- General ----
+    {
+      group: 'General',
+      name: 'Total Weight',
+      unit: 'g',
+      formula: 'SUM(row.amount)',
+      description: 'Total mass of all composition rows (assumes amounts are in the same unit).',
+    },
+    {
+      group: 'General',
+      name: 'Cost / kg',
+      unit: '$/kg',
+      formula: 'SUM(row.amount * ing.cost) / SUM(row.amount)',
+      description: 'Weighted-average cost per kg. Needs ing.cost (priced in the ingredient\'s own cost unit — typically $/kg).',
+    },
+    {
+      group: 'General',
+      name: 'Ingredient count',
+      unit: '',
+      formula: 'COUNT()',
+      description: 'How many composition rows this formula has.',
+    },
+    {
+      group: 'General',
+      name: 'Resin count',
+      unit: '',
+      formula: "COUNT(WHERE ing.class == 'Resin')",
+      description: 'How many rows are classified as resin (needs ing.class).',
+    },
+  ];
+}
+
+// Picker modal — group by category, click to add.
+function openTheoreticalParamPresets(entityType, entityId) {
+  const presets = _tpPresetCatalog();
+  const groups = {};
+  presets.forEach(p => { (groups[p.group || 'Other'] = groups[p.group || 'Other'] || []).push(p); });
+  const presetsJson = JSON.stringify(presets).replace(/'/g, '&#39;');
+  const html = Object.entries(groups).map(([g, items]) => `
+    <div style="margin-bottom:14px">
+      <div style="font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px">${esc(g)}</div>
+      <div style="display:flex;flex-direction:column;gap:6px">
+        ${items.map((p, idx) => {
+          const globalIdx = presets.indexOf(p);
+          return `<button type="button" class="btn btn-secondary" style="display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:10px 14px;width:100%;gap:4px;white-space:normal;line-height:1.4"
+            onclick="_tpAddPresetByIndex('${entityType}','${entityId}',${globalIdx})">
+            <div style="font-weight:600;font-size:13.5px">${esc(p.name)}${p.unit ? ` <span style="font-weight:400;color:var(--text-muted)">(${esc(p.unit)})</span>` : ''}</div>
+            <div style="font-family:ui-monospace,monospace;font-size:11px;color:#475569;word-break:break-all">${esc(p.formula)}</div>
+            ${p.description ? `<div style="font-size:11.5px;color:var(--text-muted)">${esc(p.description)}</div>` : ''}
+          </button>`;
+        }).join('')}
+      </div>
+    </div>
+  `).join('');
+  showModal('Pick a preset', `
+    <div style="margin-bottom:10px;font-size:12.5px;color:var(--text-muted)">
+      Click a preset to add it to this ${entityType === 'batch' ? 'batch' : 'formula'}. You can edit the formula afterwards.
+    </div>
+    ${html}
+  `, () => false); // No submit — buttons close+add directly
+}
+
+function _tpAddPresetByIndex(entityType, entityId, idx) {
+  const presets = _tpPresetCatalog();
+  const p = presets[idx];
+  if (!p) return;
+  addTheoreticalParam(entityType, entityId, {
+    name: p.name,
+    formula: p.formula,
+    unit: p.unit || '',
+    description: p.description || '',
+    spec: null,
+  });
+  // Close the preset modal and re-render the detail page
+  if (typeof closeModal === 'function') closeModal();
+  else document.querySelector('.modal-backdrop')?.remove();
+  if (entityType === 'batch') renderBatchDetail(entityId);
+  else renderFormulationDetail(entityId);
+}