desic-okx-agent 0.3.2 → 0.3.3

package/dist/report/compare-script.js

@@ -1,109 +1,355 @@
-/**
- * Hover readout for the comparison overlay.
- *
- * Shows every curve's value at one instant, which is the question an overlay
- * raises and a static image cannot answer: two lines crossing tells you they
- * crossed, not by how much.
- *
- * Same constraints as the single-run script — one IIFE, no network, no storage,
- * data read from a `data-series` attribute — so the report stays a self-contained
- * file that sends nothing.
- */
+/** Interactive controller for the self-contained comparison observatory. */
 export const COMPARE_SCRIPT = String.raw `
 (function () {
   var chart = document.getElementById("compare-chart");
-  if (!chart) return;
+  var themeToggle = document.querySelector("[data-theme-toggle]");
+  if (themeToggle) {
+    var systemDark = matchMedia("(prefers-color-scheme: dark)").matches;
+    themeToggle.setAttribute("aria-pressed", systemDark ? "true" : "false");
+    themeToggle.addEventListener("click", function () {
+      var explicit = document.body.getAttribute("data-theme");
+      var dark = explicit ? explicit === "dark" : matchMedia("(prefers-color-scheme: dark)").matches;
+      document.body.setAttribute("data-theme", dark ? "light" : "dark");
+      themeToggle.setAttribute("aria-pressed", dark ? "false" : "true");
+    });
+  }
 
+  var progress = document.querySelector(".compare-progress");
+  var progressFrame = 0;
+  addEventListener("scroll", function () {
+    if (progressFrame) return;
+    progressFrame = requestAnimationFrame(function () {
+      var maximum = Math.max(1, document.documentElement.scrollHeight - innerHeight);
+      if (progress) progress.style.transform = "scaleX(" + Math.min(1, scrollY / maximum) + ")";
+      progressFrame = 0;
+    });
+  }, { passive: true });
+
+  if (!chart) return;
   var payload;
   try {
     payload = JSON.parse(chart.getAttribute("data-series") || "");
   } catch (error) {
     return;
   }
-  if (!payload || !payload.series || !payload.series.length) return;
+  if (!payload || !Array.isArray(payload.series) || payload.series.length === 0) return;
 
   var svg = chart.querySelector("svg");
-  var tooltip = chart.querySelector(".tooltip");
-  var crosshair = chart.querySelector(".crosshair");
-  if (!svg || !tooltip) return;
+  var tooltip = chart.querySelector(".compare-tooltip");
+  var crosshair = chart.querySelector(".compare-crosshair");
+  if (!svg || !tooltip || !crosshair) return;
 
-  var span = payload.endMs - payload.startMs || 1;
+  var reduced = matchMedia("(prefers-reduced-motion: reduce)").matches;
+  var fullStart = payload.startMs;
+  var fullEnd = payload.endMs;
+  var fullDuration = Math.max(1, fullEnd - fullStart);
+  var currentStart = fullStart;
+  var currentEnd = fullEnd;
+  var active = payload.series.map(function () { return true; });
+  var viewWidth = payload.width;
+  var viewHeight = payload.height;
+  var animation = new WeakMap();
+  var minimumGap = fullDuration;
+  payload.series.forEach(function (series) {
+    for (var index = 1; index < series.t.length; index += 1) {
+      var gap = series.t[index] - series.t[index - 1];
+      if (gap > 0) minimumGap = Math.min(minimumGap, gap);
+    }
+  });
+
+  function escapeText(value) {
+    return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\"/g, "&quot;").replace(/'/g, "&#39;");
+  }
 
   function formatTime(ms) {
     return new Date(ms).toISOString().slice(0, 16).replace("T", " ");
   }
 
-  // Nearest sample at or before the cursor's time, by binary search: a linear scan
-  // per mouse move is visibly slow once six series carry 900 points each.
+  function signed(value) {
+    return (value > 0 ? "+" : "") + value.toFixed(2) + "%";
+  }
+
+  function tone(element, value) {
+    element.classList.remove("positive", "negative", "neutral");
+    element.classList.add(value > 0 ? "positive" : value < 0 ? "negative" : "neutral");
+  }
+
+  function xForTime(timeMs) {
+    return ((timeMs - fullStart) / fullDuration) * viewWidth;
+  }
+
+  function yFor(value) {
+    return viewHeight - ((value - payload.minimum) / Math.max(0.0001, payload.maximum - payload.minimum)) * viewHeight;
+  }
+
   function sampleAt(series, timeMs) {
     var times = series.t;
-    if (timeMs < times[0] || timeMs > times[times.length - 1]) return null;
+    if (!times.length || timeMs < times[0] || timeMs > times[times.length - 1]) return null;
     var low = 0;
     var high = times.length - 1;
     while (low < high) {
-      var mid = (low + high + 1) >> 1;
-      if (times[mid] <= timeMs) low = mid;
-      else high = mid - 1;
+      var middle = (low + high + 1) >> 1;
+      if (times[middle] <= timeMs) low = middle;
+      else high = middle - 1;
+    }
+    return { index: low, time: times[low], value: series.v[low] };
+  }
+
+  function samplesInWindow(series, startTime, endTime) {
+    var values = [];
+    var start = sampleAt(series, Math.max(startTime, series.t[0]));
+    if (start) values.push(start.value);
+    for (var index = 0; index < series.t.length; index += 1) {
+      if (series.t[index] < startTime) continue;
+      if (series.t[index] > endTime) break;
+      values.push(series.v[index]);
+    }
+    var end = sampleAt(series, Math.min(endTime, series.t[series.t.length - 1]));
+    if (end) values.push(end.value);
+    return values;
+  }
+
+  function animateViewBox(target, immediate) {
+    var prior = animation.get(svg);
+    if (prior) cancelAnimationFrame(prior);
+    if (immediate || reduced) {
+      svg.setAttribute("viewBox", target.join(" "));
+      sizeMarkers();
+      return;
+    }
+    var from = (svg.getAttribute("viewBox") || target.join(" ")).split(/\s+/).map(Number);
+    var started = performance.now();
+    function frame(now) {
+      var progress = Math.min(1, (now - started) / 260);
+      var eased = 1 - Math.pow(1 - progress, 4);
+      var values = target.map(function (value, index) { return from[index] + (value - from[index]) * eased; });
+      svg.setAttribute("viewBox", values.join(" "));
+      sizeMarkers();
+      if (progress < 1) animation.set(svg, requestAnimationFrame(frame));
+      else animation.delete(svg);
+    }
+    animation.set(svg, requestAnimationFrame(frame));
+  }
+
+  function sizeMarkers() {
+    var bounds = svg.getBoundingClientRect();
+    if (bounds.width <= 0 || bounds.height <= 0) return;
+    var box = (svg.getAttribute("viewBox") || "0 0 1000 320").split(/\s+/).map(Number);
+    chart.querySelectorAll("[data-marker-radius]").forEach(function (marker) {
+      var radius = Number(marker.getAttribute("data-marker-radius")) || 4;
+      marker.setAttribute("rx", Math.max(0.001, (radius * box[2]) / bounds.width));
+      marker.setAttribute("ry", Math.max(0.001, (radius * box[3]) / bounds.height));
+    });
+  }
+
+  function updateWindowStrip() {
+    payload.series.forEach(function (series, index) {
+      var panel = document.querySelector('[data-window-series="' + index + '"]');
+      if (!panel) return;
+      panel.classList.toggle("is-hidden", !active[index]);
+      var start = sampleAt(series, Math.max(currentStart, series.t[0]));
+      var end = sampleAt(series, Math.min(currentEnd, series.t[series.t.length - 1]));
+      var output = panel.querySelector("[data-window-return]");
+      var value = panel.querySelector("[data-window-value]");
+      if (!start || !end || end.time < currentStart || start.time > currentEnd) {
+        output.textContent = "-";
+        value.textContent = "-";
+        tone(output, 0);
+        return;
+      }
+      var change = start.value !== 0 ? (end.value / start.value - 1) * 100 : 0;
+      output.textContent = signed(change);
+      value.textContent = end.value.toFixed(2);
+      tone(output, change);
+    });
+    var period = document.getElementById("compare-window-period");
+    if (period) period.textContent = formatTime(currentStart) + " → " + formatTime(currentEnd);
+  }
+
+  function setRange(startTime, endTime, source, immediate) {
+    var duration = Math.max(minimumGap * 8, Math.min(fullDuration, endTime - startTime));
+    startTime = Math.max(fullStart, Math.min(fullEnd - duration, startTime));
+    endTime = startTime + duration;
+    currentStart = startTime;
+    currentEnd = endTime;
+
+    var localMinimum = Infinity;
+    var localMaximum = -Infinity;
+    payload.series.forEach(function (series, index) {
+      if (!active[index]) return;
+      samplesInWindow(series, currentStart, currentEnd).forEach(function (value) {
+        localMinimum = Math.min(localMinimum, value);
+        localMaximum = Math.max(localMaximum, value);
+      });
+    });
+    if (!Number.isFinite(localMinimum) || !Number.isFinite(localMaximum)) {
+      localMinimum = payload.minimum;
+      localMaximum = payload.maximum;
     }
-    return { time: times[low], value: series.v[low] };
+    var centre = (localMinimum + localMaximum) / 2;
+    var visibleRange = Math.max(4, (localMaximum - localMinimum) * 1.3);
+    var visibleMaximum = centre + visibleRange / 2;
+    var visibleMinimum = centre - visibleRange / 2;
+    var xStart = xForTime(currentStart);
+    var xEnd = xForTime(currentEnd);
+    var yTop = yFor(visibleMaximum);
+    var yBottom = yFor(visibleMinimum);
+    animateViewBox([xStart, yTop, Math.max(0.001, xEnd - xStart), Math.max(0.001, yBottom - yTop)], immediate);
+
+    var maximumLabel = chart.querySelector("[data-axis-maximum]");
+    var minimumLabel = chart.querySelector("[data-axis-minimum]");
+    if (maximumLabel) maximumLabel.textContent = visibleMaximum.toFixed(1);
+    if (minimumLabel) minimumLabel.textContent = visibleMinimum.toFixed(1);
+    document.querySelectorAll("[data-compare-range]").forEach(function (button) {
+      button.setAttribute("aria-pressed", button === source ? "true" : "false");
+    });
+    updateWindowStrip();
+    hide();
   }
 
   function show(clientX) {
     var box = svg.getBoundingClientRect();
     if (box.width <= 0) return;
-    var ratio = Math.min(1, Math.max(0, (clientX - box.left) / box.width));
-    var timeMs = payload.startMs + ratio * span;
-
-    var rows = '<div class="row head"><span>' + payload.labels.time + "</span><b>" + formatTime(timeMs) + "</b></div>";
-    for (var index = 0; index < payload.series.length; index += 1) {
-      var series = payload.series[index];
+    var ratio = Math.max(0, Math.min(1, (clientX - box.left) / box.width));
+    var timeMs = currentStart + ratio * (currentEnd - currentStart);
+    var rows = '<div class="row head"><span>' + escapeText(payload.labels.time) + "</span><b>" + formatTime(timeMs) + "</b></div>";
+    payload.series.forEach(function (series, index) {
+      var marker = chart.querySelector('[data-series-marker="' + index + '"]');
+      if (!active[index]) {
+        if (marker) marker.setAttribute("hidden", "");
+        return;
+      }
       var sample = sampleAt(series, timeMs);
-      // A run whose window does not cover this instant shows a dash rather than
-      // its nearest endpoint, which would imply data it does not have.
-      var reading = sample === null ? "-" : sample.value.toFixed(2);
-      rows +=
-        '<div class="row"><span><i class="swatch" style="background:' +
-        series.colour +
-        '"></i>' +
-        series.label +
-        "</span><b>" +
-        reading +
-        "</b></div>";
-    }
+      rows += '<div class="row"><span><i class="swatch" style="background:' + series.colour + '"></i>' + escapeText(series.label) + "</span><b>" + (sample ? sample.value.toFixed(2) : "-") + "</b></div>";
+      if (marker) {
+        if (sample) {
+          marker.setAttribute("cx", xForTime(sample.time));
+          marker.setAttribute("cy", yFor(sample.value));
+          marker.removeAttribute("hidden");
+        } else marker.setAttribute("hidden", "");
+      }
+    });
     tooltip.innerHTML = rows;
     tooltip.hidden = false;
-
-    // Flip the tooltip to the other side near the right edge so it stays on screen.
-    var offset = ratio > 0.6 ? 12 : box.width * ratio + 18;
-    if (ratio > 0.6) {
-      tooltip.style.left = "auto";
-      tooltip.style.right = offset + "px";
-    } else {
-      tooltip.style.right = "auto";
-      tooltip.style.left = offset + "px";
-    }
-
-    if (crosshair) {
-      var viewBox = svg.viewBox.baseVal;
-      crosshair.setAttribute("x1", String(ratio * viewBox.width));
-      crosshair.setAttribute("x2", String(ratio * viewBox.width));
-      crosshair.hidden = false;
-    }
+    tooltip.style.left = ratio > 0.62 ? "auto" : box.width * ratio + 18 + "px";
+    tooltip.style.right = ratio > 0.62 ? 14 + "px" : "auto";
+    var x = xForTime(timeMs);
+    crosshair.setAttribute("x1", x);
+    crosshair.setAttribute("x2", x);
+    crosshair.removeAttribute("hidden");
+    sizeMarkers();
   }
 
   function hide() {
     tooltip.hidden = true;
-    if (crosshair) crosshair.hidden = true;
+    crosshair.setAttribute("hidden", "");
+    chart.querySelectorAll("[data-series-marker]").forEach(function (marker) { marker.setAttribute("hidden", ""); });
   }
 
-  chart.addEventListener("mousemove", function (event) {
-    show(event.clientX);
+  document.querySelectorAll("[data-series-toggle]").forEach(function (button) {
+    button.addEventListener("click", function () {
+      var index = Number(button.getAttribute("data-series-toggle"));
+      if (active[index] && active.filter(Boolean).length === 1) return;
+      active[index] = !active[index];
+      button.setAttribute("aria-pressed", active[index] ? "true" : "false");
+      button.classList.toggle("is-muted", !active[index]);
+      var path = chart.querySelector('[data-series-path="' + index + '"]');
+      if (path) path.classList.toggle("is-hidden", !active[index]);
+      setRange(currentStart, currentEnd, document.querySelector('[data-compare-range][aria-pressed="true"]'), true);
+    });
+  });
+
+  document.querySelectorAll("[data-compare-range]").forEach(function (button) {
+    button.addEventListener("click", function () {
+      var value = button.getAttribute("data-compare-range");
+      var start = value === "all" ? fullStart : Math.max(fullStart, fullEnd - Number(value) * 86400000);
+      setRange(start, fullEnd, button, false);
+    });
+  });
+
+  var pendingWheelDelta = 0;
+  var pendingWheelX = 0;
+  var wheelFrame = 0;
+  chart.addEventListener("wheel", function (event) {
+    if (!event.deltaY) return;
+    event.preventDefault();
+    var delta = event.deltaY;
+    if (event.deltaMode === 1) delta *= 16;
+    else if (event.deltaMode === 2) delta *= Math.max(1, svg.getBoundingClientRect().height);
+    pendingWheelDelta += delta;
+    pendingWheelX = event.clientX;
+    if (wheelFrame) return;
+    wheelFrame = requestAnimationFrame(function () {
+      var bounded = Math.max(-80, Math.min(80, pendingWheelDelta));
+      pendingWheelDelta = 0;
+      wheelFrame = 0;
+      var factor = Math.exp(bounded * 0.0015);
+      var duration = currentEnd - currentStart;
+      var targetDuration = Math.max(minimumGap * 8, Math.min(fullDuration, duration * factor));
+      var bounds = svg.getBoundingClientRect();
+      var ratio = Math.max(0, Math.min(1, (pendingWheelX - bounds.left) / Math.max(1, bounds.width)));
+      var anchor = currentStart + ratio * duration;
+      setRange(anchor - ratio * targetDuration, anchor + (1 - ratio) * targetDuration, null, false);
+    });
+  }, { passive: false });
+
+  var drag = null;
+  chart.addEventListener("pointerdown", function (event) {
+    if (event.pointerType !== "mouse" || event.button !== 0) return;
+    drag = { id: event.pointerId, x: event.clientX, start: currentStart, end: currentEnd };
+    chart.classList.add("is-dragging");
+    chart.setPointerCapture(event.pointerId);
+    hide();
+    event.preventDefault();
+  });
+  chart.addEventListener("pointermove", function (event) {
+    if (!drag || event.pointerId !== drag.id) return;
+    var bounds = svg.getBoundingClientRect();
+    var duration = drag.end - drag.start;
+    var shift = ((drag.x - event.clientX) / Math.max(1, bounds.width)) * duration;
+    setRange(drag.start + shift, drag.end + shift, null, true);
+  });
+  function endDrag(event) {
+    if (!drag || (typeof event.pointerId === "number" && event.pointerId !== drag.id)) return;
+    var id = drag.id;
+    drag = null;
+    chart.classList.remove("is-dragging");
+    if (chart.hasPointerCapture(id)) chart.releasePointerCapture(id);
+  }
+  chart.addEventListener("pointerup", endDrag);
+  chart.addEventListener("pointercancel", endDrag);
+  chart.addEventListener("dblclick", function () {
+    setRange(fullStart, fullEnd, document.querySelector('[data-compare-range="all"]'), false);
   });
-  chart.addEventListener("mouseleave", hide);
+
+  chart.addEventListener("mousemove", function (event) { if (!drag) show(event.clientX); });
+  chart.addEventListener("mouseleave", function () { if (!drag) hide(); });
+  chart.addEventListener("touchstart", function (event) {
+    if (event.touches && event.touches.length) show(event.touches[0].clientX);
+  }, { passive: true });
   chart.addEventListener("touchmove", function (event) {
     if (event.touches && event.touches.length) show(event.touches[0].clientX);
-  });
+  }, { passive: true });
   chart.addEventListener("touchend", hide);
+
+  var cursorTime = fullStart;
+  chart.setAttribute("tabindex", "0");
+  chart.addEventListener("keydown", function (event) {
+    var step = event.shiftKey ? Math.max(minimumGap, (currentEnd - currentStart) / 20) : minimumGap;
+    if (event.key === "ArrowRight") cursorTime = Math.min(currentEnd, Math.max(currentStart, cursorTime) + step);
+    else if (event.key === "ArrowLeft") cursorTime = Math.max(currentStart, Math.min(currentEnd, cursorTime) - step);
+    else if (event.key === "Home") cursorTime = currentStart;
+    else if (event.key === "End") cursorTime = currentEnd;
+    else if (event.key === "Escape") { hide(); return; }
+    else return;
+    event.preventDefault();
+    var bounds = svg.getBoundingClientRect();
+    show(bounds.left + ((cursorTime - currentStart) / Math.max(1, currentEnd - currentStart)) * bounds.width);
+  });
+  chart.addEventListener("blur", hide);
+
+  addEventListener("resize", sizeMarkers, { passive: true });
+  setRange(fullStart, fullEnd, document.querySelector('[data-compare-range="all"]'), true);
 })();
 `;
 //# sourceMappingURL=compare-script.js.map

package/dist/report/compare-script.js.map

@@ -1 +1 @@
-{"version":3,"file":"compare-script.js","sourceRoot":"","sources":["../../src/report/compare-script.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgGvC,CAAC"}
+{"version":3,"file":"compare-script.js","sourceRoot":"","sources":["../../src/report/compare-script.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgWvC,CAAC"}

package/dist/report/html.d.ts

@@ -51,4 +51,4 @@ export declare function escapeAttribute(value: string): string;
  * second copy: the two documents should not drift apart visually, and a duplicated
  * sheet is exactly how that happens.
  */
-export declare const COMPARE_STYLES = "\n:root{--bg:#0f1116;--panel:#171a21;--line:#242833;--text:#e6e8ee;--dim:#8b90a0;--up:#3fb950;--down:#f2777a;--accent:#4f9cf9}\n@media(prefers-color-scheme:light){:root{--bg:#f7f8fa;--panel:#fff;--line:#e3e6ec;--text:#1a1d24;--dim:#6b7280;--up:#1a7f37;--down:#c9372c}}\n*{box-sizing:border-box}\nbody{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 -apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,\"Helvetica Neue\",\"PingFang SC\",\"Microsoft YaHei\",sans-serif}\nmain{max-width:1080px;margin:0 auto;padding:32px 24px 64px}\nheader{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--line)}\nh1{margin:0;font-size:26px;font-weight:600;letter-spacing:-.01em}\n.sub{margin:4px 0 0;color:var(--dim);font-size:13px}\n.headline{text-align:right}\n.headline .value{display:block;font-size:34px;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums}\n.headline .label{color:var(--dim);font-size:12px;text-transform:uppercase;letter-spacing:.08em}\n.up{color:var(--up)}.down{color:var(--down)}.flat{color:var(--dim)}\n.facts{display:flex;gap:28px;flex-wrap:wrap;margin:20px 0 8px;color:var(--dim);font-size:13px}\n.facts span{display:block;text-transform:uppercase;letter-spacing:.06em;font-size:11px}\n.facts strong{color:var(--text);font-weight:550;font-variant-numeric:tabular-nums}\n.warnings{margin:20px 0 0;padding:12px 16px;border-left:3px solid var(--down);background:color-mix(in srgb,var(--down) 8%,transparent);border-radius:0 6px 6px 0}\n.warnings p{margin:4px 0;font-size:13px}\nsection{margin-top:32px}\nh2{margin:0 0 14px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}\nh2 .count{color:var(--dim);font-weight:400}\ndl{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;margin:0;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}\ndl>div{background:var(--panel);padding:12px 14px}\ndt{color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.06em}\ndd{margin:3px 0 0;font-size:16px;font-weight:550;font-variant-numeric:tabular-nums}\n.chart{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:flex;gap:10px;align-items:stretch}\n.chart.drawdown{margin-top:8px;border-radius:8px}\n.chart svg{flex:1;height:240px;width:100%;display:block}\n.chart.drawdown svg{height:80px}\n.axis{display:flex;flex-direction:column;justify-content:space-between;color:var(--dim);font-size:11px;font-variant-numeric:tabular-nums;min-width:62px;text-align:right}\n.range{margin:8px 0 0;color:var(--dim);font-size:12px}\n.chart{position:relative}\n.chart svg{cursor:crosshair}\n.chart:focus-visible{outline:2px solid var(--accent);outline-offset:2px}\n.baseline{stroke:var(--dim);stroke-width:1;stroke-dasharray:3 4;opacity:.5;vector-effect:non-scaling-stroke}\n.crosshair{stroke:var(--dim);stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}\n.marker{fill:var(--accent);stroke:var(--panel);stroke-width:1.5;pointer-events:none}\n.tooltip{position:absolute;top:10px;pointer-events:none;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-size:12px;min-width:180px;box-shadow:0 4px 16px rgba(0,0,0,.28);z-index:2}\n.tooltip .row{display:flex;justify-content:space-between;gap:14px;padding:1px 0}\n.tooltip .row span{color:var(--dim)}\n.tooltip .row b{font-weight:550;font-variant-numeric:tabular-nums}\n.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:8px}\ntable{width:100%;border-collapse:collapse;font-size:13px}\nth,td{padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}\nth{background:var(--panel);color:var(--dim);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;position:sticky;top:0}\ntbody tr:last-child td{border-bottom:none}\ntd.n{text-align:right;font-variant-numeric:tabular-nums}\ntr.up td:nth-child(5),tr.up td:nth-child(6){color:var(--up)}\ntr.down td:nth-child(5),tr.down td:nth-child(6){color:var(--down)}\n.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}\ntd.dim{color:var(--dim)}\n.scroll.tall{max-height:520px;overflow-y:auto}\n.histogram{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px}\n.bin{display:flex;align-items:center;gap:10px;padding:3px 0}\n.bin .range{min-width:132px;color:var(--dim);text-align:right;flex-shrink:0}\n.bin .track{flex:1;height:12px;background:color-mix(in srgb,var(--line) 60%,transparent);border-radius:3px;overflow:hidden}\n.bin .fill{display:block;height:100%;border-radius:3px}\n.bin .fill.up{background:var(--up)}\n.bin .fill.down{background:var(--down)}\n.bin>.count{min-width:44px;text-align:right;color:var(--dim);font-size:12px;font-variant-numeric:tabular-nums;flex-shrink:0}\n.empty{color:var(--dim);font-size:13px}\nfooter{margin-top:40px;padding-top:16px;border-top:1px solid var(--line);color:var(--dim);font-size:12px}\nfooter p{margin:4px 0}\n\n.legend{display:flex;gap:20px;flex-wrap:wrap;margin:20px 0 0;font-size:13px}\n.legend div{display:flex;align-items:center;gap:7px}\n.legend i,th i{display:inline-block;width:10px;height:10px;border-radius:2px;flex-shrink:0}\nth i{margin-right:6px;vertical-align:middle}\ntable.matrix th[scope=row]{background:var(--panel);color:var(--dim);text-transform:none;letter-spacing:0;font-size:12px;font-weight:500;text-align:left;position:sticky;left:0}\ntable.matrix thead th{text-align:right}\ntable.matrix thead th span.dim{display:block;font-weight:400;text-transform:none;letter-spacing:0;font-size:10px}\ntd.best{color:var(--up);font-weight:600}\n.chart .tooltip .swatch{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px}\n.chart .tooltip .row.head{border-bottom:1px solid var(--line);margin-bottom:3px;padding-bottom:3px}\n";
+export declare const COMPARE_STYLES: string;