/* ============================================================
   chart panel — CHART LEVEL MAP (the centerpiece)
   scoped classes prefixed .ch- ; colors from tokens only
   ============================================================ */

.ch-panel{min-width:0}

/* ---- header ---- */
.ch-head{flex-wrap:wrap;row-gap:6px}
.ch-symwrap{display:flex;flex-direction:column;line-height:1.05;padding-left:4px;
  border-left:1px solid var(--border);margin-left:2px}
.ch-sym{font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--text)}
.ch-exch{font-size:9.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3)}
.ch-name{font-size:11.5px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ch-lifecycle{margin-left:auto;display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}
/* dim the non-active lifecycle pills so ARMED reads as the live state */
.ch-lifecycle .pill{opacity:.42;filter:saturate(.5)}
.ch-lifecycle .ch-lc-active{opacity:1;filter:none;
  box-shadow:0 0 0 1.5px var(--amber),0 2px 6px var(--amber-tint)}

/* ---- OHLC readout line ---- */
.ch-ohlc{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:8px 14px;border-bottom:1px solid var(--border);
  background:var(--surface-2);font-size:12px}
.ch-ohlc-item{display:inline-flex;align-items:baseline;gap:5px}
.ch-ohlc-k{font-size:10px;font-weight:700;color:var(--text-3);letter-spacing:.04em}
.ch-ohlc-v{font-weight:600;color:var(--text);font-family:var(--mono);font-size:11.5px}
.ch-ohlc-chg{font-weight:700;font-family:var(--mono);font-size:11.5px}
.ch-ohlc-last{margin-left:auto;font-size:11px}
.ch-ohlc-last b{color:var(--text-2);font-family:var(--mono)}

/* ---- body / canvas ---- */
.ch-bodywrap{display:flex;flex-direction:column;padding:0;overflow:hidden}
.ch-canvas{flex:1;min-height:240px;padding:6px 6px 0;
  background:
    linear-gradient(180deg,var(--surface) 0%,var(--surface-2) 100%);
  display:flex}
.ch-svg{width:100%;height:100%;display:block}

/* ---- candles ---- */
.ch-body.ch-up,.ch-wick.ch-up{fill:var(--up);stroke:var(--up)}
.ch-body.ch-down,.ch-wick.ch-down{fill:var(--down);stroke:var(--down)}
rect.ch-body{stroke:none}
rect.ch-body.ch-up{fill:var(--up)}
rect.ch-body.ch-down{fill:var(--down)}
.ch-wick{stroke-width:1}
.ch-wick.ch-up{stroke:var(--up)}
.ch-wick.ch-down{stroke:var(--down)}

/* ---- volume strip ---- */
.ch-vol{opacity:.5}
.ch-vol.ch-up{fill:var(--up)}
.ch-vol.ch-down{fill:var(--down)}

/* ---- grid ---- */
.ch-grid{stroke:var(--border);stroke-width:1;opacity:.7}

/* ---- entry zone shaded band ---- */
.ch-zone{fill:var(--brand);opacity:.07}

/* ---- level lines ---- */
.ch-lvl{stroke-width:1.4;fill:none}
.ch-dash{stroke-dasharray:5 4}
.ch-lvl-target{stroke:var(--up);opacity:.85}
.ch-lvl-invalid{stroke:var(--down);opacity:.85}
.ch-lvl-entry{stroke:var(--brand);stroke-width:1.8;opacity:.95}
.ch-lvl-entryedge{stroke:var(--brand);stroke-width:1;opacity:.45;stroke-dasharray:2 3}

/* ---- right-edge tags ---- */
.ch-tag rect{stroke-width:1}
.ch-tag-lbl{font-size:8.5px;font-weight:700;font-family:var(--font);
  letter-spacing:.02em;dominant-baseline:middle}
.ch-tag-val{font-size:9px;font-weight:700;font-family:var(--mono);dominant-baseline:middle}

.ch-tag-target rect{fill:var(--up-tint);stroke:var(--up)}
.ch-tag-target .ch-tag-lbl,.ch-tag-target .ch-tag-val{fill:var(--up)}

.ch-tag-invalid rect{fill:var(--down-tint);stroke:var(--down)}
.ch-tag-invalid .ch-tag-lbl,.ch-tag-invalid .ch-tag-val{fill:var(--down)}

.ch-tag-entry rect{fill:var(--brand-tint);stroke:var(--brand);stroke-opacity:.6}
.ch-tag-entry .ch-tag-lbl,.ch-tag-entry .ch-tag-val{fill:var(--brand-dark)}

.ch-tag-entrymid rect{fill:var(--brand);stroke:var(--brand-dark)}
.ch-tag-entrymid .ch-tag-lbl,.ch-tag-entrymid .ch-tag-val{fill:#fff}

/* ---- timeframe bar ---- */
.ch-tfbar{display:flex;gap:5px;padding:9px 12px;border-top:1px solid var(--border);
  background:var(--surface);flex-shrink:0}
.ch-tf{min-width:34px;font-variant-numeric:tabular-nums}
.ch-tf.btn--ghost{border:1px solid var(--border)}

/* ---- foot legend ---- */
.ch-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ch-foot span{display:inline-flex;align-items:center;gap:6px}
.ch-key{width:14px;height:0;border-top-width:2px;border-top-style:solid;display:inline-block}
.ch-key-entry{border-top-color:var(--brand)}
.ch-key-target{border-top-color:var(--up);border-top-style:dashed}
.ch-key-invalid{border-top-color:var(--down);border-top-style:dashed}