/* Pikchr editor — Pikchr emits no per-statement ids in its SVG, so selection is driven from the
   properties panel, not the canvas. These rules style the numbered, clickable STATEMENTS list and
   the per-line PIC input that stand in for canvas hit-testing. */

.dia-pikchr .flow-stmt-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.dia-pikchr .flow-stmt-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  width: 100%;
  padding: 5px 8px;
  text-align: left;
  background: var(--panel, #fff);
  border: 1px solid var(--border, #d7dae0);
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.dia-pikchr .flow-stmt-row:hover {
  border-color: var(--accent, #3b6ef6);
  background: rgba(59, 110, 246, 0.06);
}
.dia-pikchr .flow-stmt-n {
  flex: 0 0 auto;
  min-width: 1.4em;
  text-align: right;
  color: var(--muted, #8a909a);
  font-variant-numeric: tabular-nums;
}
.dia-pikchr .flow-stmt-t {
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
}
.dia-pikchr .flow-stmt-input {
  width: 100%;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
}