/* 기본(오리지널) 차트 — MetaOrder exchange-terminal terminal.css .ochart-* 와 같은 값 */
.ochart {
  --oc-bg: #000000; --oc-panel2: #1f1f1f; --oc-border: #222222; --oc-text: #ffffff; --oc-dim: #bfbfbf;
  --oc-up: #f6465d; --oc-down: #20c997;
  display: flex; flex-direction: column; flex: 1; min-height: 0; background: var(--oc-bg); color: var(--oc-text);
}
.ochart .mono { font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-variant-numeric: tabular-nums; }
.ochart-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 10px; border-bottom: 1px solid var(--oc-border); flex-shrink: 0;
}
.ochart-itv { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.ochart-itv::-webkit-scrollbar { display: none; }
.ochart-itv button {
  font: inherit; background: none; border: 0; cursor: pointer;
  padding: 5px 11px; border-radius: 999px; font-size: 13px; color: var(--oc-dim); white-space: nowrap; flex-shrink: 0;
}
.ochart-itv button.on { background: var(--oc-panel2); color: var(--oc-text); font-weight: 600; }
.ochart-stage { position: relative; flex: 1; min-height: 0; }
.ochart-canvas { position: absolute; inset: 0; }
.ochart-legend {
  position: absolute; left: 10px; top: 6px; right: 70px; z-index: 2; pointer-events: none;
  font-size: 11px; line-height: 1.6; display: flex; flex-direction: column;
}
.ochart-legend .dim, .ochart-vlegend .dim { color: var(--oc-dim); }
.ochart-legend b { font-weight: 500; }
.ochart-vlegend {
  position: absolute; left: 10px; bottom: calc(14% + 6px); z-index: 2; pointer-events: none; font-size: 11px;
}
.ochart-empty {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: var(--oc-dim); font-size: 13px; pointer-events: none;
}