@inflexa-ai/harness 0.17.0 → 0.18.0

package/dist/report-render/chart.js

@@ -0,0 +1,538 @@
+/**
+ * The chart derivation of the report page.
+ *
+ * A chart block binds one whole-table artifact and a channel mapping. `deriveChartOption` turns the
+ * chart type, the encoding, and the resolved rows into one ECharts option object. The chart container
+ * markup lives beside this file, and it wraps the option that this derivation gives.
+ *
+ * The renderer computes no aggregate. Each plotted number stays traceable to one cell of the evidence
+ * artifact. A pie or a heatmap arrives one row per category or per cell, thus a repeated category or a
+ * repeated pair is a refusal and not a silent sum.
+ *
+ * The derivation is deterministic. Every object builds in one fixed key order, and the code reads no
+ * clock, no random value, and no locale. A string comparison uses the code-unit order (`<`) and never
+ * `localeCompare`, thus the same rows give the same bytes on every host.
+ */
+import { err, ok } from "neverthrow";
+import { normalizeEchartSpec } from "../tools/display/normalize-echart-spec.js";
+/**
+ * The ten-stop viridis ramp for a heatmap `visualMap`. The stops run dark to light, thus a continuous
+ * scale maps the low value to `#440154` and the high value to `#fde725`.
+ */
+const VIRIDIS = ["#440154", "#482777", "#3e4989", "#31688e", "#26828e", "#1f9e89", "#35b779", "#6ece58", "#b5de2b", "#fde725"];
+/**
+ * Derive the ECharts option for a chart block, then pass it through `normalizeEchartSpec`.
+ *
+ * The normalizer owns the bottom legend, the save action, and the axis-label discipline. Thus the
+ * derivation sets no `title`, no `legend`, no `toolbox`, and no explicit series color. The theme palette
+ * assigns the series colors by their order.
+ */
+export function deriveChartOption(block, rows, columns) {
+    return deriveRaw(block, rows, columns).map((option) => normalizeEchartSpec(option, { title: block.title }));
+}
+/** Dispatch to the per-type derivation. Each type holds one fixed rule. */
+function deriveRaw(block, rows, columns) {
+    switch (block.chartType) {
+        case "bar":
+            return deriveBar(block, rows, columns);
+        case "line":
+            return deriveLine(block, rows, columns);
+        case "scatter":
+            return deriveScatter(block, rows, columns);
+        case "histogram":
+            return deriveHistogram(block, rows, columns);
+        case "box":
+            return deriveBox(block, rows, columns);
+        case "heatmap":
+            return deriveHeatmap(block, rows, columns);
+        case "pie":
+            return derivePie(block, rows, columns);
+    }
+}
+// ── The per-type derivations ────────────────────────────────────────────────
+/** A category x axis, a value y axis, and one bar series per group with the `[x, y]` pairs. */
+function deriveBar(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const yResult = requireColumn(block, rows, columns, "y");
+    if (yResult.isErr())
+        return err(yResult.error);
+    const x = xResult.value;
+    const y = yResult.value;
+    const categories = firstAppearance(rows.map((row) => row[x]));
+    const series = groupedSeries(rows, block.encoding.group, (groupRows, name) => ({
+        type: "bar",
+        ...(name !== undefined ? { name: String(name) } : {}),
+        barGap: 0,
+        data: groupRows.map((row) => [row[x], row[y]]),
+    }));
+    return ok({
+        xAxis: { type: "category", data: categories, name: x },
+        yAxis: { type: "value", name: y },
+        series,
+    });
+}
+/** Per-column axis inference, and one line series per group whose data sorts by x. */
+function deriveLine(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const yResult = requireColumn(block, rows, columns, "y");
+    if (yResult.isErr())
+        return err(yResult.error);
+    const x = xResult.value;
+    const y = yResult.value;
+    const series = groupedSeries(rows, block.encoding.group, (groupRows, name) => ({
+        type: "line",
+        ...(name !== undefined ? { name: String(name) } : {}),
+        showSymbol: false,
+        data: sortByX(groupRows.map((row) => [row[x], row[y]])),
+    }));
+    return ok({
+        xAxis: inferAxis(rows, x),
+        yAxis: inferAxis(rows, y),
+        series,
+    });
+}
+/** The same axis inference as a line chart, with no sort and the large-render flags. */
+function deriveScatter(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const yResult = requireColumn(block, rows, columns, "y");
+    if (yResult.isErr())
+        return err(yResult.error);
+    const x = xResult.value;
+    const y = yResult.value;
+    const series = groupedSeries(rows, block.encoding.group, (groupRows, name) => ({
+        type: "scatter",
+        ...(name !== undefined ? { name: String(name) } : {}),
+        large: true,
+        largeThreshold: 2000,
+        data: groupRows.map((row) => [row[x], row[y]]),
+    }));
+    return ok({
+        xAxis: inferAxis(rows, x),
+        yAxis: inferAxis(rows, y),
+        series,
+    });
+}
+/** Equal-width bins over the global range. Each group shares the same edges. */
+function deriveHistogram(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const x = xResult.value;
+    const groupCol = block.encoding.group;
+    if (rows.length === 0) {
+        return ok({
+            xAxis: { type: "value", scale: true },
+            yAxis: { type: "value", name: "Count" },
+            series: [{ type: "bar", barWidth: "99%", data: [] }],
+        });
+    }
+    const values = numericColumn(rows, x);
+    if (values.length === 0) {
+        return err(problem(block.id, `The histogram column "${x}" holds no numeric value.`));
+    }
+    const edges = histogramEdges(values);
+    let series;
+    if (groupCol === undefined) {
+        series = [histogramSeries(values, edges, undefined)];
+    }
+    else {
+        series = [];
+        for (const name of firstAppearance(rows.map((row) => row[groupCol]))) {
+            const groupValues = numericColumn(rows.filter((row) => row[groupCol] === name), x);
+            series.push(histogramSeries(groupValues, edges, name));
+        }
+    }
+    return ok({
+        xAxis: { type: "value", scale: true },
+        yAxis: { type: "value", name: "Count" },
+        series,
+    });
+}
+/** A five-number summary per category, plus a paired scatter series for the outliers. */
+function deriveBox(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const yResult = requireColumn(block, rows, columns, "y");
+    if (yResult.isErr())
+        return err(yResult.error);
+    const x = xResult.value;
+    const y = yResult.value;
+    const categories = firstAppearance(rows.map((row) => row[x]));
+    const groups = splitGroups(rows, block.encoding.group);
+    const series = [];
+    for (const group of groups) {
+        const boxData = [];
+        const outliers = [];
+        for (let index = 0; index < categories.length; index++) {
+            const values = numericColumn(group.rows.filter((row) => row[x] === categories[index]), y);
+            // A category with fewer than five values renders as an empty box.
+            if (values.length < 5) {
+                boxData.push("-");
+                continue;
+            }
+            const summary = boxSummary(values);
+            boxData.push(summary.box);
+            for (const outlier of summary.outliers) {
+                outliers.push([index, outlier]);
+            }
+        }
+        series.push({
+            type: "boxplot",
+            ...(group.name !== undefined ? { name: String(group.name) } : {}),
+            data: boxData,
+        });
+        // The outlier scatter pairs with its box series, thus it only appears when an outlier exists.
+        if (outliers.length > 0) {
+            series.push({
+                type: "scatter",
+                ...(group.name !== undefined ? { name: String(group.name) } : {}),
+                symbolSize: 4,
+                data: outliers,
+            });
+        }
+    }
+    return ok({
+        xAxis: { type: "category", data: categories, name: x },
+        yAxis: { type: "value", name: y },
+        series,
+    });
+}
+/** A dense grid over every pair of x and y categories, with a viridis `visualMap`. */
+function deriveHeatmap(block, rows, columns) {
+    const xResult = requireColumn(block, rows, columns, "x");
+    if (xResult.isErr())
+        return err(xResult.error);
+    const yResult = requireColumn(block, rows, columns, "y");
+    if (yResult.isErr())
+        return err(yResult.error);
+    const valueResult = requireColumn(block, rows, columns, "value");
+    if (valueResult.isErr())
+        return err(valueResult.error);
+    const x = xResult.value;
+    const y = yResult.value;
+    const valueColumn = valueResult.value;
+    const xCategories = firstAppearance(rows.map((row) => row[x]));
+    const yCategories = firstAppearance(rows.map((row) => row[y]));
+    const cells = new Map();
+    for (const row of rows) {
+        const key = pairKey(row[x], row[y]);
+        if (cells.has(key)) {
+            return err(problem(block.id, `The heatmap holds the pair (${String(row[x])}, ${String(row[y])}) more than one time.`));
+        }
+        cells.set(key, toNumber(row[valueColumn]));
+    }
+    const data = [];
+    const finite = [];
+    for (let xi = 0; xi < xCategories.length; xi++) {
+        for (let yi = 0; yi < yCategories.length; yi++) {
+            const stored = cells.get(pairKey(xCategories[xi], yCategories[yi]));
+            const value = stored === undefined ? null : stored;
+            data.push([xi, yi, value]);
+            if (value !== null)
+                finite.push(value);
+        }
+    }
+    const min = finite.length > 0 ? Math.min(...finite) : 0;
+    const max = finite.length > 0 ? Math.max(...finite) : 1;
+    return ok({
+        xAxis: { type: "category", data: xCategories.map(String), name: x, splitArea: { show: true } },
+        yAxis: { type: "category", data: yCategories.map(String), name: y, splitArea: { show: true } },
+        visualMap: {
+            type: "continuous",
+            min,
+            max,
+            calculable: true,
+            orient: "horizontal",
+            left: "center",
+            bottom: 0,
+            inRange: { color: [...VIRIDIS] },
+        },
+        series: [{ type: "heatmap", data }],
+    });
+}
+/** One slice per group category, in first-appearance order. A repeated category refuses. */
+function derivePie(block, rows, columns) {
+    const groupResult = requireColumn(block, rows, columns, "group");
+    if (groupResult.isErr())
+        return err(groupResult.error);
+    const valueResult = requireColumn(block, rows, columns, "value");
+    if (valueResult.isErr())
+        return err(valueResult.error);
+    const groupColumn = groupResult.value;
+    const valueColumn = valueResult.value;
+    const seen = new Set();
+    const data = [];
+    for (const row of rows) {
+        const name = String(row[groupColumn]);
+        if (seen.has(name)) {
+            return err(problem(block.id, `The pie holds the category "${name}" more than one time.`));
+        }
+        seen.add(name);
+        const numeric = toNumber(row[valueColumn]);
+        data.push({ name, value: numeric === null ? row[valueColumn] : numeric });
+    }
+    return ok({
+        series: [{ type: "pie", radius: "55%", data }],
+    });
+}
+// ── The shared building blocks ──────────────────────────────────────────────
+/** A typed `invalid-chart-input` problem that names the block and the cause. */
+function problem(blockId, detail) {
+    return { blockId, kind: "invalid-chart-input", detail };
+}
+/**
+ * Resolve one demanded channel to its column name.
+ *
+ * A channel that the encoding omits is a refusal. A named column that no row holds is a refusal too.
+ * A zero-row chart skips the row check, thus it renders an empty container.
+ */
+function requireColumn(block, rows, columns, channel) {
+    const column = block.encoding[channel];
+    if (column === undefined) {
+        return err(problem(block.id, `The ${block.chartType} chart needs a column for the "${channel}" channel.`));
+    }
+    if (rows.length > 0 && !columnPresent(column, rows, columns)) {
+        return err(problem(block.id, `The column "${column}" is absent from every row.`));
+    }
+    return ok(column);
+}
+/** True when the column exists in the declared header, or in one row at least. */
+function columnPresent(column, rows, columns) {
+    if (columns !== undefined && columns.includes(column))
+        return true;
+    for (const row of rows) {
+        if (Object.prototype.hasOwnProperty.call(row, column))
+            return true;
+    }
+    return false;
+}
+/** Convert one cell to a finite number, or `null` when it is not numeric. */
+function toNumber(cell) {
+    if (typeof cell === "number")
+        return Number.isFinite(cell) ? cell : null;
+    if (typeof cell === "string") {
+        const trimmed = cell.trim();
+        if (trimmed === "")
+            return null;
+        const parsed = Number(trimmed);
+        return Number.isFinite(parsed) ? parsed : null;
+    }
+    return null;
+}
+/** True when the cell is a string that does not represent a finite number. */
+function isNonNumericString(cell) {
+    return typeof cell === "string" && toNumber(cell) === null;
+}
+/** The distinct values in first-appearance order. */
+function firstAppearance(values) {
+    const seen = new Set();
+    const order = [];
+    for (const value of values) {
+        if (!seen.has(value)) {
+            seen.add(value);
+            order.push(value);
+        }
+    }
+    return order;
+}
+/** The numeric cells of one column, in row order. A non-numeric cell drops. */
+function numericColumn(rows, column) {
+    const values = [];
+    for (const row of rows) {
+        const value = toNumber(row[column]);
+        if (value !== null)
+            values.push(value);
+    }
+    return values;
+}
+/**
+ * The axis for a line or a scatter column. A column with any non-numeric string cell is a category axis
+ * with its distinct values as strings. Any other column is a value axis with `scale: true`.
+ */
+function inferAxis(rows, column) {
+    if (rows.some((row) => isNonNumericString(row[column]))) {
+        return { type: "category", data: firstAppearance(rows.map((row) => row[column])).map(String), name: column };
+    }
+    return { type: "value", scale: true, name: column };
+}
+/**
+ * Build one series per group, in first-appearance order of the group values. A chart with no group
+ * column gets one series over every row.
+ */
+function groupedSeries(rows, groupCol, make) {
+    if (groupCol === undefined) {
+        return [make(rows, undefined)];
+    }
+    const series = [];
+    for (const name of firstAppearance(rows.map((row) => row[groupCol]))) {
+        series.push(make(rows.filter((row) => row[groupCol] === name), name));
+    }
+    return series;
+}
+/** The row groups in first-appearance order, or one unnamed group when there is no group column. */
+function splitGroups(rows, groupCol) {
+    if (groupCol === undefined) {
+        return [{ name: undefined, rows }];
+    }
+    return firstAppearance(rows.map((row) => row[groupCol])).map((name) => ({
+        name,
+        rows: rows.filter((row) => row[groupCol] === name),
+    }));
+}
+/** Sort `[x, y]` pairs by x. Two numbers compare numerically, and any other pair compares as text. */
+function sortByX(pairs) {
+    return [...pairs].sort((a, b) => compareCell(a[0], b[0]));
+}
+/**
+ * Compare two cells for a sort by x. Two numbers compare by their difference. Any other pair compares
+ * by the code-unit order of the string form. The comparison never calls `localeCompare`, thus the order
+ * stays the same on every host.
+ */
+function compareCell(a, b) {
+    if (typeof a === "number" && typeof b === "number") {
+        return a - b;
+    }
+    const left = String(a);
+    const right = String(b);
+    if (left < right)
+        return -1;
+    if (left > right)
+        return 1;
+    return 0;
+}
+/**
+ * A stable key for one `(x, y)` pair. The key carries the type of each cell, thus the number `1` and the
+ * string `"1"` are different pairs and a false collision is impossible.
+ */
+function pairKey(xCell, yCell) {
+    return `${typeof xCell}:${String(xCell)}${typeof yCell}:${String(yCell)}`;
+}
+// ── The histogram math ──────────────────────────────────────────────────────
+/**
+ * The bin edges over the global range. The bin count is the larger of the Sturges count and the
+ * Freedman-Diaconis count. One bin applies when the range is zero.
+ */
+function histogramEdges(values) {
+    const sorted = [...values].sort((a, b) => a - b);
+    const min = sorted[0];
+    const max = sorted[sorted.length - 1];
+    if (max === min) {
+        return [min, max];
+    }
+    const count = autoBinCount(sorted, min, max);
+    const width = (max - min) / count;
+    const edges = [];
+    for (let i = 0; i <= count; i++) {
+        edges.push(min + i * width);
+    }
+    // Pin the last edge to the exact max, thus a float drift cannot drop the top value out of the range.
+    edges[count] = max;
+    return edges;
+}
+/**
+ * The automatic bin count: `max(Sturges, Freedman-Diaconis)`. Sturges is `ceil(log2(n)) + 1`.
+ * Freedman-Diaconis derives the width `2 * IQR / n^(1/3)` and the count `ceil((max - min) / width)`. When
+ * the IQR is zero, the Sturges count applies alone.
+ */
+function autoBinCount(sorted, min, max) {
+    const n = sorted.length;
+    const sturges = Math.ceil(Math.log2(n)) + 1;
+    const iqr = quantileType7(sorted, 0.75) - quantileType7(sorted, 0.25);
+    if (iqr === 0) {
+        return Math.max(1, sturges);
+    }
+    const width = (2 * iqr) / Math.cbrt(n);
+    const fd = Math.ceil((max - min) / width);
+    return Math.max(1, sturges, fd);
+}
+/** The bin counts for the values against the edges. The max value falls in the last bin. */
+function binCounts(values, edges) {
+    const bins = edges.length - 1;
+    const counts = new Array(bins).fill(0);
+    const min = edges[0];
+    const width = (edges[bins] - min) / bins;
+    for (const value of values) {
+        let index = width === 0 ? 0 : Math.floor((value - min) / width);
+        if (index < 0)
+            index = 0;
+        if (index >= bins)
+            index = bins - 1;
+        counts[index] += 1;
+    }
+    return counts;
+}
+/** One histogram series. Each bar sits at the bin midpoint. A grouped series overlaps its siblings. */
+function histogramSeries(values, edges, name) {
+    const counts = binCounts(values, edges);
+    const data = [];
+    for (let i = 0; i < counts.length; i++) {
+        data.push([(edges[i] + edges[i + 1]) / 2, counts[i]]);
+    }
+    if (name === undefined) {
+        return { type: "bar", barWidth: "99%", data };
+    }
+    return {
+        type: "bar",
+        name: String(name),
+        barWidth: "99%",
+        barGap: "-100%",
+        itemStyle: { opacity: 0.7 },
+        data,
+    };
+}
+// ── The box math ────────────────────────────────────────────────────────────
+/**
+ * The five-number summary of one category.
+ *
+ * The quartiles are type-7 quantiles. The whiskers are the Tukey fences at `1.5 * IQR`, clamped to the
+ * nearest data value inside each fence. A value outside a fence is an outlier.
+ */
+function boxSummary(values) {
+    const sorted = [...values].sort((a, b) => a - b);
+    const q1 = quantileType7(sorted, 0.25);
+    const median = quantileType7(sorted, 0.5);
+    const q3 = quantileType7(sorted, 0.75);
+    const iqr = q3 - q1;
+    const lowerFence = q1 - 1.5 * iqr;
+    const upperFence = q3 + 1.5 * iqr;
+    let whiskerLow = q1;
+    let whiskerHigh = q3;
+    let lowSet = false;
+    const outliers = [];
+    for (const value of sorted) {
+        if (value < lowerFence || value > upperFence) {
+            outliers.push(value);
+            continue;
+        }
+        // The values arrive in ascending order. Thus the first in-fence value is the low whisker, and the
+        // last in-fence value is the high whisker.
+        if (!lowSet) {
+            whiskerLow = value;
+            lowSet = true;
+        }
+        whiskerHigh = value;
+    }
+    return { box: [whiskerLow, q1, median, q3, whiskerHigh], outliers };
+}
+/**
+ * The type-7 quantile of a sorted array. The index is `p * (n - 1)`, and the value interpolates
+ * linearly between the `floor` and the `ceil` of that index.
+ */
+function quantileType7(sorted, p) {
+    const n = sorted.length;
+    if (n === 1)
+        return sorted[0];
+    const index = p * (n - 1);
+    const low = Math.floor(index);
+    const high = Math.ceil(index);
+    if (low === high)
+        return sorted[low];
+    return sorted[low] + (index - low) * (sorted[high] - sorted[low]);
+}

package/dist/report-render/page.d.ts

@@ -0,0 +1,127 @@
+/**
+ * The page constants: the CDN pins, the inline style, the ECharts theme, and the chart bootstrap.
+ *
+ * These constants are copies. The old template pack at `templates/report-html` holds the source, and the
+ * old render path owns that directory. The renderer never reads that directory at run time, thus the
+ * output stays a pure function of its inputs. A copy that drifts is a maintenance cost, and it is the
+ * price of a page with no local asset and no template engine.
+ */
+/**
+ * The head references: the Tailwind runtime, the ECharts runtime, the two fonts, and the preconnect. Each
+ * tag carries the pinned version and, where the source pins one, the integrity hash. The bytes are exact
+ * copies, thus the page stays deterministic and the hashes stay valid.
+ */
+export declare const CDN_HEAD = "<script src=\"https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4.3.2/dist/index.global.min.js\" integrity=\"sha384-shaHAtPgz0ulP7R/YmFe0nZtC8FxdhJPi73vwJQcADVttxvHLJBJt/pjzkLSbIvL\" crossorigin=\"anonymous\"></script>\n<script src=\"https://cdn.jsdelivr.net/npm/echarts@5.5.1/dist/echarts.min.js\" integrity=\"sha384-Mx5lkUEQPM1pOJCwFtUICyX45KNojXbkWdYhkKUKsbv391mavbfoAmONbzkgYPzR\" crossorigin=\"anonymous\"></script>\n<link rel=\"preconnect\" href=\"https://cdn.jsdelivr.net\" crossorigin>\n<link href=\"https://cdn.jsdelivr.net/npm/@fontsource-variable/space-grotesk@5.1.1/index.css\" rel=\"stylesheet\" integrity=\"sha384-b3Dtcpab/ltw+oDnVHstCCa9ENEb2hKouCSRAfb8o0ROkWOb2uNWYG6+l7HGrHmG\" crossorigin=\"anonymous\">\n<link href=\"https://cdn.jsdelivr.net/npm/@fontsource-variable/ibm-plex-mono@5.1.1/index.css\" rel=\"stylesheet\">";
+/**
+ * The style rules of the page. The renderer inlines them in one `<style>` block, thus the page holds the
+ * whole design token set and every component rule with no external stylesheet.
+ */
+export declare const PAGE_CSS = "/* \u2500\u2500 Color Palette \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n:root {\n  /* Primary Scale */\n  --color-primary-50:  #f0f1fe;   /* Tag bg, CTA section bg */\n  --color-primary-100: #dde0fc;\n  --color-primary-200: #bcc2f9;   /* Badge borders, corner accent default */\n  --color-primary-300: #9ba5f5;   /* Corner button accent default */\n  --color-primary-400: #7987f0;   /* Section illustration icons */\n  --color-primary-500: #576dea;   /* Primary action, section labels, links */\n  --color-primary-600: #4458d4;   /* Button hover */\n  --color-primary-700: #3545b0;   /* Tag text on primary-50 bg */\n\n  /* Text */\n  --color-heading:        #0f172a; /* slate-900 \u2014 all headings */\n  --color-text:           #475569; /* slate-600 \u2014 body text */\n  --color-text-secondary: #64748b; /* slate-500 \u2014 captions, metadata */\n  --color-text-muted:     #94a3b8; /* slate-400 \u2014 timestamps, footnotes */\n\n  /* Surface */\n  --color-bg:             #ffffff; /* Page background (white) */\n  --color-bg-alt:         #f8fafc; /* Alternating section bg (slate-50) */\n  --color-card:           #ffffff; /* Cards (white) */\n  --color-border:         #e2e8f0; /* slate-200 \u2014 card borders, dividers */\n  --color-border-hover:   #cbd5e1; /* slate-300 \u2014 hover borders */\n\n  /* Data Visualization */\n  --color-up:   #ef4444; /* Red 500 \u2014 upregulated, positive */\n  --color-down: #576dea; /* Primary 500 \u2014 downregulated, negative */\n  --color-ns:   #94a3b8; /* Slate 400 \u2014 not significant */\n\n  /* Semantic (Tags \u2014 solid bg + colored text) */\n  --color-high-bg:    #f0fdf4;  /* green-50 */\n  --color-high-text:  #15803d;  /* green-700 */\n  --color-medium-bg:  #fffbeb;  /* amber-50 */\n  --color-medium-text:#b45309;  /* amber-700 */\n  --color-low-bg:     #fef2f2;  /* red-50 */\n  --color-low-text:   #b91c1c;  /* red-700 */\n\n  /* Stat card accent colors */\n  --color-stat-primary: #576dea;\n  --color-stat-green:   #22c55e;\n  --color-stat-red:     #ef4444;\n  --color-stat-purple:  #a78bfa;\n  --color-stat-amber:   #f59e0b;\n}\n\n/* \u2500\u2500 Typography \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\nbody {\n  font-family: 'Space Grotesk Variable', system-ui, sans-serif;\n  font-size: 16px;\n  line-height: 1.6;\n  color: var(--color-text);\n}\n\n.font-mono, code, .gene {\n  font-family: 'IBM Plex Mono Variable', ui-monospace, monospace;\n}\n\n/* Rule: Headings use font-sans (Space Grotesk), never font-mono.\n   Labels, tags, badges, data, product names always use font-mono (IBM Plex Mono). */\n\n/* \u2500\u2500 Corner Accent Cards \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.corner-accents {\n  position: relative;\n  border: 1px solid var(--color-border);\n  background: var(--color-card);\n  /* No border-radius \u2014 square corners */\n}\n.corner-accents::before,\n.corner-accents::after {\n  content: '';\n  position: absolute;\n  width: 20px;\n  height: 20px;\n  transition: all 0.3s ease;\n  pointer-events: none;\n}\n.corner-accents::before {\n  top: -1px; left: -1px;\n  border-top: 2px solid var(--color-primary-200);\n  border-left: 2px solid var(--color-primary-200);\n}\n.corner-accents::after {\n  bottom: -1px; right: -1px;\n  border-bottom: 2px solid var(--color-primary-200);\n  border-right: 2px solid var(--color-primary-200);\n}\n.corner-accents:hover::before,\n.corner-accents:hover::after {\n  width: 28px;\n  height: 28px;\n  border-color: var(--color-primary-500);\n}\n.corner-accents:hover {\n  box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.08);\n}\n\n/* \u2500\u2500 Window Chrome Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/* Exception: uses rounded-xl (only rounded component) */\n.window-chrome {\n  border-radius: 12px;\n  border: 1px solid var(--color-border);\n  background: var(--color-card);\n  box-shadow: 0 8px 30px -8px rgba(15,23,42,0.08), 0 4px 12px -4px rgba(15,23,42,0.04);\n  transition: all 0.5s ease;\n}\n.window-chrome:hover {\n  transform: translateY(-4px);\n  box-shadow: 0 25px 50px -12px rgba(15,23,42,0.18), 0 12px 24px -8px rgba(15,23,42,0.1);\n  border-color: var(--color-border-hover);\n}\n.window-chrome .chrome-dots span { transition: background-color 0.3s ease; }\n.window-chrome:hover .chrome-dots .dot-1 { background-color: #fb7185; }\n.window-chrome:hover .chrome-dots .dot-2 { background-color: #fbbf24; }\n.window-chrome:hover .chrome-dots .dot-3 { background-color: #4ade80; }\n\n/* \u2500\u2500 Terminal Card \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.terminal-card {\n  position: relative;\n  overflow: hidden;\n}\n.terminal-card .terminal-header {\n  background: #1e293b; /* slate-800 */\n}\n.terminal-card .terminal-body-dark {\n  background: #0f172a; /* slate-900 */\n  color: #e2e8f0;\n}\n.terminal-card::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  opacity: 0;\n  background: repeating-linear-gradient(\n    0deg, transparent, transparent 2px,\n    rgba(148, 163, 184, 0.03) 2px, rgba(148, 163, 184, 0.03) 4px\n  );\n  transition: opacity 0.3s ease;\n}\n.terminal-card:hover::after { opacity: 1; }\n\n/* \u2500\u2500 Block Progress Bar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/* Usage: <span class=\"block-progress\"><span class=\"filled-high\">\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588</span><span class=\"empty\">\u2591\u2591</span> <span class=\"score\">0.82</span></span> */\n.block-progress {\n  font-family: 'IBM Plex Mono Variable', ui-monospace, monospace;\n  font-size: 14px;\n}\n.block-progress .filled-high { color: var(--color-primary-500); } /* \u2265 0.8 */\n.block-progress .filled-mid  { color: #f59e0b; }                  /* \u2265 0.6 */\n.block-progress .filled-low  { color: #f43f5e; }                  /* < 0.6 */\n.block-progress .empty       { color: #e2e8f0; }\n.block-progress .score       { font-size: 12px; color: #94a3b8; margin-left: 8px; }\n\n/* \u2500\u2500 Sidebar Navigation \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/* When a sidebar is rendered (#report-sidebar), the body shifts right on lg+\n   to make room. Styling matches the corner-accent / mono-label language. */\n@media (min-width: 1024px) {\n  body:has(#report-sidebar) { padding-left: 15rem; }\n}\n.sidebar-link {\n  border-left: 2px solid transparent;\n}\n.sidebar-link.active {\n  color: var(--color-primary-500);\n  background-color: var(--color-primary-50);\n  border-left-color: var(--color-primary-500);\n  font-weight: 600;\n}\n\n/* \u2500\u2500 Insight Box \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.insight-box {\n  background: var(--color-card);\n  border: 1px solid var(--color-border);\n  /* No border-radius \u2014 uses corner-accents class */\n}\n\n/* \u2500\u2500 Section Textures \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/* Apply to <section>: combine one pattern + noise, e.g. class=\"texture-dots texture-noise\" */\n/* Textures should be felt, not seen \u2014 low opacity, faded edges */\n\n/* \u2500\u2500 Fade-In \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.fade-in {\n  opacity: 0;\n  transform: translateY(20px);\n  transition: opacity 0.7s ease-out, transform 0.7s ease-out;\n}\n.fade-in-visible {\n  opacity: 1;\n  transform: translateY(0);\n}\n/* Stagger with data-delay attribute: <div class=\"fade-in\" data-delay=\"100\"> */";
+/**
+ * The registered name of the ECharts theme. The skeleton registers the theme under this name, and the
+ * bootstrap reads the same name. One source prevents a silent mismatch between the two sites.
+ */
+export declare const ECHARTS_THEME_NAME = "inflexa";
+/**
+ * The ECharts theme as a plain object. The renderer serializes this object and registers it, thus the
+ * theme never rides a JSON file and no run-time read is necessary. The palette and the axis styles mirror
+ * the light design tokens of the page.
+ */
+export declare const ECHARTS_THEME: {
+    color: string[];
+    backgroundColor: string;
+    textStyle: {
+        fontFamily: string;
+        fontSize: number;
+        color: string;
+    };
+    title: {
+        show: boolean;
+    };
+    legend: {
+        bottom: number;
+        textStyle: {
+            fontSize: number;
+            color: string;
+        };
+        itemGap: number;
+        itemWidth: number;
+        itemHeight: number;
+    };
+    grid: {
+        left: number;
+        right: number;
+        top: number;
+        bottom: number;
+        containLabel: boolean;
+    };
+    tooltip: {
+        backgroundColor: string;
+        borderColor: string;
+        textStyle: {
+            color: string;
+            fontSize: number;
+        };
+        extraCssText: string;
+    };
+    toolbox: {
+        feature: {
+            saveAsImage: {
+                title: string;
+                pixelRatio: number;
+            };
+        };
+        iconStyle: {
+            borderColor: string;
+        };
+        right: number;
+        top: number;
+    };
+    xAxis: {
+        axisLine: {
+            lineStyle: {
+                color: string;
+            };
+        };
+        axisTick: {
+            lineStyle: {
+                color: string;
+            };
+        };
+        axisLabel: {
+            color: string;
+            fontSize: number;
+        };
+        splitLine: {
+            lineStyle: {
+                color: string;
+                type: string;
+            };
+        };
+    };
+    yAxis: {
+        axisLine: {
+            show: boolean;
+        };
+        axisTick: {
+            show: boolean;
+        };
+        axisLabel: {
+            color: string;
+            fontSize: number;
+        };
+        splitLine: {
+            lineStyle: {
+                color: string;
+                type: string;
+            };
+        };
+    };
+};
+/**
+ * The page-side script that wires each chart. It finds every chart container, reads the option JSON from
+ * the sibling `<script type="application/json">` element, and initializes ECharts with the registered
+ * theme. The skeleton registers the theme before this script runs. A resize handler keeps each chart
+ * fit to the window.
+ */
+export declare const CHART_BOOTSTRAP: string;