.rftk-plot {
  /* Resolve semantic aliases at the plot, so an instance can override its page theme. */
  --plot-bg: var(--color-plot-bg, #fff);
  --plot-grid: var(--color-plot-grid, #d4d0cc);
  --plot-axis-text: var(--color-plot-axis-text, #2d3e44);
  --plot-axis-line: var(--color-plot-axis-line, #8a8884);
  --surface: var(--color-surface, #fff);
  --text: var(--color-foreground, #2d3e44);
  --text-muted: var(--color-muted, #5a6f76);
  --border: var(--color-border, #c1c0bc);
  --primary: var(--color-primary, #f07828);
  --primary-soft: var(--color-primary-soft, #f078281c);
  --plot-1: var(--color-chart-1, #f07828);
  --plot-2: var(--color-chart-2, #2d8fbf);
  --plot-3: var(--color-chart-3, #d94840);
  --plot-4: var(--color-chart-4, #2ca65a);
  --plot-5: var(--color-chart-5, #8b5cc4);
  --plot-6: var(--color-chart-6, #c47a2a);
  --plot-7: var(--color-chart-7, #c44b8a);
  --plot-8: var(--color-chart-8, #3dbcac);
  position: relative;
  isolation: isolate;
  min-width: 0;
  color: var(--plot-axis-text, #2d3e44);
  font-family: var(--font-ui, "IBM Plex Serif", Georgia, serif);
  outline: none;
}
.rftk-plot:focus-visible { outline: 2px solid var(--primary, #f07828); outline-offset: -2px; }
.rftk-plot > canvas { position: absolute; display: block; inset: 0; width: 100%; height: 100%; }
.rftk-plot .rftk-plot-input { touch-action: none; cursor: crosshair; }
.rftk-plot-guides {
  position: absolute; z-index: 4; inset: 0; pointer-events: none;
}
.rftk-plot-guides[hidden] { display: none; }
.rftk-plot-guide-handle {
  appearance: none; position: absolute; width: 15px; margin: 0; padding: 0;
  border: 0; background: transparent; color: var(--rftk-guide-color, var(--primary, #f07828));
  transform: translateX(-50%); pointer-events: auto; touch-action: none; cursor: ew-resize;
}
.rftk-plot-guide-handle::before {
  content: ""; position: absolute; left: 4px; top: 0; width: 7px; height: 9px;
  border: 1px solid currentColor; border-radius: 2px; background: var(--surface, #fff);
}
.rftk-plot-region-handle::before { border-radius: 1px; background: currentColor; }
.rftk-plot-guide-handle:focus-visible { outline: none; }
.rftk-plot-guide-handle:focus-visible::before {
  box-shadow: 0 0 0 2px var(--surface, #fff),
    0 0 0 4px var(--rftk-guide-color, var(--primary, #f07828));
}
.rftk-plot-guide-handle:disabled { opacity: .45; cursor: default; }
.rftk-plot[data-mode="pan"] .rftk-plot-input { cursor: grab; }
.rftk-plot[data-dragging="true"] .rftk-plot-input { cursor: grabbing; }
.rftk-plot[data-mode="brush"] .rftk-plot-input { cursor: crosshair; }
.rftk-plot-toolbar {
  position: absolute; z-index: 5; right: 12px; top: 5px; display: flex; gap: 0;
  align-items: flex-start; max-width: calc(100% - 24px);
  padding: 3px; border: 1px solid var(--border, #c1c0bc); border-radius: 6px;
  background: var(--surface, #fff); box-shadow: var(--shadow-sm);
}
.rftk-plot-tool-items {
  display: flex; flex: 1 1 auto; flex-wrap: nowrap;
  order: 0; min-width: 0; gap: 2px; padding-right: 4px;
  border-right: 1px solid var(--border, #c1c0bc); margin-right: 4px;
  overflow-x: auto; scrollbar-width: none;
}
.rftk-plot-tool-items::-webkit-scrollbar { display: none; }
.rftk-plot-tool-items > * { flex: 0 0 auto; white-space: nowrap; }
.rftk-plot-tool-items button:focus-visible,
.rftk-plot-tool-items .rftk-plot-export-resolution:focus-visible { outline-offset: -2px; }
.rftk-plot-toolbar .rftk-plot-tools-trigger {
  display: inline-flex; flex: 0 0 auto; order: 1; align-items: center; gap: 5px;
}
.rftk-plot-tools-trigger svg {
  width: 15px; height: 15px; fill: none; stroke: currentColor;
  stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
}
.rftk-plot-export-resolution {
  align-self: center; max-width: 59px; min-height: 27px; margin-left: 3px;
  border: 1px solid var(--border, #c1c0bc); border-radius: 3px;
  padding: 3px 2px 3px 5px; background: var(--surface, #fff); color: inherit;
  font: 500 11px var(--font-mono, monospace); cursor: pointer;
}
.rftk-plot-export-resolution:focus-visible {
  outline: 2px solid var(--primary, #f07828); outline-offset: 1px;
}
.rftk-plot-toolbar .rftk-plot-copy-image { min-width: 81px; }
.rftk-plot-tool-status {
  align-self: center; padding: 4px 6px;
  color: var(--text-muted, #5a6f76); font: 10px/1.4 var(--font-mono, monospace);
}
.rftk-plot-toolbar button {
  appearance: none; border: 0; background: transparent; color: inherit; border-radius: 3px;
  padding: 5px 7px; min-width: 27px; min-height: 27px; cursor: pointer;
  font: 500 11px var(--font-mono, monospace); line-height: 1; white-space: nowrap;
}
.rftk-plot-toolbar button:hover, .rftk-plot-toolbar button[aria-pressed="true"],
.rftk-plot-toolbar .rftk-plot-tools-trigger[aria-expanded="true"] {
  color: var(--primary, #f07828); background: var(--primary-soft, #f078281c);
}
.rftk-plot-toolbar button:disabled { opacity: .35; cursor: default; }
.rftk-plot-toolbar[hidden], .rftk-plot-tool-items[hidden],
.rftk-plot-tool-status[hidden], .rftk-plot-legend[hidden] { display: none; }
.rftk-plot-hint {
  position: absolute; left: 12px; bottom: 4px; right: 12px; text-align: center;
  pointer-events: none; color: var(--text-muted, #5a6f76); font: 10px/1.3 var(--font-ui, Georgia);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rftk-plot button:focus-visible { outline: 2px solid var(--primary, #f07828); outline-offset: 1px; }
.rftk-plot-legend {
  position: absolute; z-index: 3; display: flex; flex-wrap: wrap; gap: 2px 12px;
  max-width: calc(100% - 90px); max-height: 88px; overflow: auto;
  padding: 4px 7px; border-radius: 4px; background: var(--surface, #fff);
  border: 1px solid var(--border, #c1c0bc);
}
.rftk-plot-legend button {
  display: inline-flex; align-items: center; gap: 6px; min-width: 0;
  border: 0; background: transparent; color: inherit; padding: 2px 0;
  cursor: pointer; font: inherit; font-size: 10px; line-height: 1.4; text-align: left;
}
.rftk-plot-legend button[aria-pressed="false"] { opacity: .4; text-decoration: line-through; }
.rftk-plot-swatch { display: inline-block; flex: 0 0 17px; height: 2px; border-radius: 2px; }
.rftk-plot-tooltip {
  position: absolute; z-index: 6; pointer-events: none; max-width: min(360px, 85%);
  border: 1px solid var(--border, #c1c0bc); border-radius: 5px;
  padding: 9px 12px; background: var(--surface, #fff); box-shadow: var(--shadow-md);
  color: var(--text, #2d3e44); font: 11px/1.65 var(--font-mono, monospace);
}
.rftk-plot-tooltip[hidden] { display: none; }
.rftk-plot-tooltip strong { display: block; margin-bottom: 3px; font-weight: 600; }
.rftk-plot-tooltip-row { display: flex; align-items: baseline; gap: 8px; }
.rftk-plot-tooltip-row span:last-child { margin-left: auto; white-space: nowrap; font-weight: 600; }
.rftk-plot-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}