/* ZoltarSearch 2.5 — Market bands (Storage). Every colour is a site token, so light/dark and the module accent follow the page. */
.market-bands { margin: 0; }
.zb { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 18px 12px; display: grid; gap: 14px; box-shadow: var(--shadow); }
.zb-head { display: flex; gap: 14px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.zb-title { min-width: 0; max-width: 72ch; display: grid; gap: 4px; }
.zb-title h2 { font-size: 22px; }
.zb-ctl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* level 0 — the strip */
.zb-strip { display: grid; gap: 6px; padding: 8px 6px 4px; }
.zb-axis { position: relative; height: 16px; font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-3); }
.zb-axis span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.zb-axis span.last { transform: translateX(-100%); }
.zb-axis span.first { transform: none; }
.zb a.btn { text-decoration: none; }
.zb-axis.in { height: 18px; }
.zb-axis.in i.bar { position: absolute; top: 14px; width: 1px; height: 4px; background: var(--good); }
.zb-axis.in i.bar.c { background: var(--bad); }
.zb-track { position: relative; height: 62px; border-radius: 10px; background: var(--surface-2); overflow: visible; }
.zb-zone { position: absolute; top: 0; bottom: 0; }
.zb-zone.buy { background: color-mix(in srgb, var(--good) 14%, transparent); border-radius: 10px 0 0 10px; }
.zb-zone.fyi { background: color-mix(in srgb, var(--warn) 8%, transparent); }
.zb-whisker { position: absolute; top: 30px; height: 2px; background: var(--line-2); border-radius: 2px; }
.zb-iqr { position: absolute; top: 22px; height: 18px; background: var(--accent); opacity: .85; border-radius: 4px; box-shadow: 0 0 0 2px var(--surface-2); }
.zb-mid { position: absolute; top: 16px; width: 0; }
.zb-mid i { position: absolute; left: -2px; top: 0; width: 4px; height: 30px; background: var(--ink); border-radius: 2px; box-shadow: 0 0 0 2px var(--surface); }
.zb-mid b { position: absolute; left: 50%; transform: translateX(-50%); top: -14px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: var(--ink); white-space: nowrap; }
.zb-bar { position: absolute; top: 0; bottom: 0; width: 0; border-left: 2px dashed var(--good); }
.zb-bar b { position: absolute; left: 4px; bottom: 3px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: var(--good); white-space: nowrap; }
.zb-bar.ceil { border-left-color: var(--bad); }
.zb-bar.ceil b { color: var(--bad); left: auto; right: 4px; }
.zb-retail { position: absolute; top: 50px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid var(--ink-3); transform: translateX(-5px); }
.zb-own { position: absolute; top: 6px; width: 9px; height: 9px; background: var(--warn); transform: translateX(-50%) rotate(45deg); border-radius: 1px; box-shadow: 0 0 0 2px var(--surface); }
.zb-empty { position: absolute; inset: 0; display: grid; place-items: center; font-size: 12.5px; color: var(--unknown); }
.zb-legend, .zb-sleg { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 11.5px; color: var(--ink-3); }
.zb-legend span, .zb-sleg span { display: inline-flex; align-items: center; gap: 6px; }
.zb-legend i.k { display: inline-block; width: 14px; height: 8px; border-radius: 2px; background: var(--line-2); }
.zb-legend i.k.iqr { background: var(--accent); }
.zb-legend i.k.mid { width: 3px; height: 12px; background: var(--ink); }
.zb-legend i.k.own { width: 8px; height: 8px; background: var(--warn); transform: rotate(45deg); border-radius: 1px; }
.zb-legend i.k.ret { width: 0; height: 0; background: none; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid var(--ink-3); }
.zb-legend i.k.zone { background: color-mix(in srgb, var(--good) 22%, transparent); }
.zb-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.zb-stat { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 12px; display: grid; gap: 2px; min-width: 0; }
.zb-stat .v { font-family: var(--font-display); font-size: 24px; font-weight: 500; letter-spacing: -.02em; line-height: 1.05; font-variant-numeric: tabular-nums; }
.zb-stat .l { font-size: 12px; color: var(--ink-3); }
.zb-stat .s { font-size: 11.5px; color: var(--ink-2); }
.zb-stat.unknown .v { color: var(--unknown); }
.zb-stat.accent { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); background: color-mix(in srgb, var(--accent) 9%, var(--surface-2)); }
.zb-stat.good { border-color: color-mix(in srgb, var(--good) 50%, var(--line)); }
.zb-stat.good .v { color: var(--good); }

/* search */
.zb-search { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.zb-sbox { flex: 1 1 320px; display: flex; align-items: center; gap: 8px; background: var(--surface-2); border: 1px solid var(--line-2); border-radius: 999px; padding: 6px 12px; }
.zb-sbox:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.zb-sbox .ic { color: var(--ink-3); font-size: 16px; }
.zb-sbox input { flex: 1; border: 0; background: transparent; font-size: 14px; min-width: 0; outline: none; }
.zb-more { margin-left: auto; }

/* exact-item card */
.zb-card { border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line)); background: linear-gradient(180deg, var(--accent-soft), var(--surface) 55%); border-radius: var(--radius); padding: 14px 16px; display: grid; gap: 12px; }
.zb-card-h { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.zb-card-h h3 { font-family: var(--font-display); font-size: 20px; font-weight: 500; margin: 2px 0; }
.zb-card-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.zb-card-grid { display: grid; grid-template-columns: 1.1fr 1.3fr 1fr; gap: 14px; align-items: start; }
.zb-band-read .k, .zb-spark .k, .zb-live .k { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.zb-band-read .v { font-family: var(--font-display); font-size: 34px; font-weight: 500; letter-spacing: -.02em; line-height: 1.05; }
.zb-band-read .v small { font-family: var(--font-body); font-size: 13px; color: var(--ink-3); letter-spacing: 0; }
.zb-band-read .v.unknown { color: var(--unknown); }
.zb-band-read .q { display: flex; flex-wrap: wrap; gap: 4px 12px; font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); margin-top: 4px; }
.zb-band-read .q.ret { color: var(--ink-3); }
.zb-band-read .q.own { color: var(--warn); font-family: var(--font-body); font-weight: 600; }
.zb-whatif label { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.zb-whatif .row { display: flex; align-items: center; gap: 4px; margin: 4px 0 6px; }
.zb-whatif .cur { font-family: var(--font-mono); color: var(--ink-3); }
.zb-whatif input { width: 120px; font-family: var(--font-mono); font-size: 16px; padding: 6px 8px; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); }
.zb-whatif .vd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.zb-live { display: grid; gap: 4px; }
.zb-live .li { display: grid; grid-template-columns: 80px 1.3fr 1.4fr auto; gap: 10px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--line); font-size: 13px; }
.zb-live .li b { font-family: var(--font-mono); }
.zb-svg { width: 100%; height: auto; display: block; }
.zb-tick { font-family: var(--font-mono); font-size: 10px; fill: var(--ink-3); }
.zb-buyline { stroke: var(--good); stroke-width: 1.5; stroke-dasharray: 4 3; }
.zb-buyzone { fill: color-mix(in srgb, var(--good) 10%, transparent); }
.zb-grid { stroke: var(--line); stroke-width: 1; }
.zb-dot { stroke: var(--surface); stroke-width: 2; }
.zb-dot.live { fill: var(--accent); }
.zb-dot.unv { fill: var(--surface-3); stroke: var(--ink-3); stroke-width: 1.5; }
.zb-dot.gone { fill: var(--ink-3); opacity: .55; }
.zb-sleg i.d { width: 9px; height: 9px; border-radius: 50%; display: inline-block; background: var(--line-2); }
.zb-sleg i.d.live { background: var(--accent); }
.zb-sleg i.d.unv { background: var(--surface-3); box-shadow: inset 0 0 0 1.5px var(--ink-3); }
.zb-sleg i.d.gone { background: var(--ink-3); opacity: .55; }
.zb-sleg i.d.buy { width: 14px; height: 0; border-top: 2px dashed var(--good); border-radius: 0; background: none; }
.zb-sleg i.l { width: 16px; height: 2px; display: inline-block; border-radius: 2px; }
.zb-sleg i.l.rep { background: var(--accent); }
.zb-sleg i.l.any { background: var(--ink-3); }
.zb-sleg i.z { width: 3px; height: 12px; display: inline-block; background: var(--bad); }
.zb-sleg i.z.mid { background: var(--warn); }
.zb-sleg i.z.hi { background: var(--ink-3); }

/* body + tabs */
.zb-body { display: grid; gap: 10px; border-top: 1px solid var(--line); padding-top: 12px; }
.zb-tabs { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.zb-tabs [role="tab"] { border: 0; background: transparent; padding: 7px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.zb-tabs [role="tab"]:hover { background: var(--surface-2); }
.zb-tabs [role="tab"][aria-selected="true"] { background: var(--ink); color: var(--bg); }
.zb-filters { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.fchip { border: 1px solid var(--line-2); background: var(--surface); color: var(--ink-2); padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; cursor: pointer; }
.fchip[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 50%, var(--line-2)); }

/* level 1 — rows */
.zb-chart { display: grid; gap: 2px; }
.zb-row, .zb-chead { display: grid; grid-template-columns: minmax(180px, 1.2fr) minmax(220px, 3fr) minmax(150px, 1fr); gap: 12px; align-items: center; }
.zb-chead { padding: 0 8px 6px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.zb-row { padding: 6px 8px; border-radius: var(--radius-sm); cursor: pointer; min-height: 40px; }
.zb-row:hover, .zb-row:focus-visible { background: var(--surface-2); outline: none; }
.zb-row.hit { background: var(--accent-soft); }
.zb-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
.zb-name .n { font-weight: 600; font-size: 13.5px; }
.zb-name .f { font-size: 11px; color: var(--ink-3); font-family: var(--font-mono); flex-basis: 100%; }
.zb-tier { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 5px; font-size: 11px; font-weight: 800; font-family: var(--font-mono); flex: none; }
.zb-tier.tA { background: var(--good-soft); color: var(--good); }
.zb-tier.tB { background: var(--warn-soft); color: var(--warn); }
.zb-tier.tC { background: var(--bad-soft); color: var(--bad); }
.zb-tier.tu { background: var(--unknown-soft); color: var(--unknown); }
.zb-owntag { font-size: 10.5px; font-weight: 700; color: var(--warn); background: var(--warn-soft); padding: 1px 6px; border-radius: 999px; }
.zb-lane { position: relative; min-width: 0; }
.zb-lane-in { position: relative; height: 22px; border-radius: 6px; background: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 100%) no-repeat; background-size: 100% 100%; }
.zb-rw { position: absolute; top: 10px; height: 2px; background: var(--line-2); border-radius: 2px; }
.zb-rw.hist { background: repeating-linear-gradient(90deg, var(--line-2) 0 4px, transparent 4px 7px); }
.zb-ri { position: absolute; top: 5px; height: 12px; background: var(--accent); border-radius: 4px; opacity: .85; box-shadow: 0 0 0 2px var(--surface); }
.zb-row:hover .zb-ri, .zb-row.hit .zb-ri { opacity: 1; }
.zb-rm { position: absolute; top: 3px; width: 3px; height: 16px; background: var(--ink); border-radius: 2px; transform: translateX(-1px); box-shadow: 0 0 0 2px var(--surface); }
.zb-rm.hist { background: var(--ink-3); }
.zb-rb { position: absolute; top: 7px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); transform: translateX(-4px); box-shadow: 0 0 0 2px var(--surface); }
.zb-ro { position: absolute; top: 6px; width: 9px; height: 9px; background: var(--warn); transform: translateX(-50%) rotate(45deg); border-radius: 1px; box-shadow: 0 0 0 2px var(--surface); z-index: 1; }
.zb-rr { position: absolute; top: 14px; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 7px solid var(--ink-3); transform: translateX(-4px); }
.zb-val { font-family: var(--font-mono); font-size: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.zb-val b { font-size: 13.5px; }
.zb-vchip { font-family: var(--font-body); }
.zb-none { padding: 18px 10px; color: var(--ink-3); font-size: 13.5px; }

/* live-now vs lapsed */
.zb-lapsed, .zb-band-read .q .lapsed, .zb-rtip .s.lapsed, .zb-live .k.lapsed { color: var(--warn); font-style: normal; font-weight: 600; }
.zb-band-read .q .on { color: var(--good); font-weight: 700; }
.zb-band-read .v.hist { color: var(--ink-2); font-size: 22px; }
.zb-retail-off { position: absolute; right: 6px; top: 44px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; color: var(--ink-3); }
.zb-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.zb-pt.unv { fill: var(--surface); stroke: var(--ink-3); stroke-width: 1.5; }
.zb-pt.buy { stroke: var(--good); stroke-width: 2.5; fill: var(--surface); }
.zb-sleg i.d.buypt { background: var(--surface); box-shadow: inset 0 0 0 2.5px var(--good); }
.zb-chead { position: sticky; top: var(--topbar-h); background: var(--surface); z-index: 2; }

/* row readout */
.zb-chart { position: relative; }
.zb-rtip { position: absolute; z-index: 6; width: min(420px, 96%); background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--radius-sm); box-shadow: var(--shadow); padding: 9px 11px; font-size: 12.5px; display: grid; gap: 5px; pointer-events: none; }
.zb-rtip .t { font-weight: 700; display: flex; gap: 6px; align-items: center; }
.zb-rtip .g { display: flex; flex-wrap: wrap; gap: 3px 12px; font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); }
.zb-rtip .g b { color: var(--ink); }
.zb-rtip .s { color: var(--ink-2); font-size: 12px; }
.zb-rtip .s.own { color: var(--warn); font-weight: 600; }
.zb-rtip .s.muted { color: var(--ink-3); font-size: 11.5px; }

/* level 2 — history */
.zb-hist { position: relative; display: grid; gap: 8px; }
.zb-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.zb-line.rep { stroke: var(--accent); }
.zb-line.any { stroke: var(--ink-3); stroke-dasharray: 3 3; }
.zb-pt { fill: var(--accent); stroke: var(--surface); stroke-width: 2; }
.zb-pt.buy { fill: var(--good); }
.zb-pt.on { r: 6; }
.zb-cross { stroke: var(--ink-2); stroke-width: 1; }
.zb-tip { position: absolute; top: 12px; width: 290px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--radius-sm); box-shadow: var(--shadow); padding: 9px 11px; font-size: 12.5px; display: grid; gap: 3px; pointer-events: none; z-index: 5; }
.zb-tip .t { font-weight: 700; display: flex; gap: 6px; align-items: center; }
.zb-tip .v { color: var(--ink-2); font-size: 12px; margin-top: 3px; }
.zb-table td.mono { font-family: var(--font-mono); font-size: 12px; white-space: nowrap; }
.zb-table tr.buy td { background: color-mix(in srgb, var(--good) 8%, transparent); }
.zb-runs summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--ink-2); }

/* level 3 — rule */
.zb-rule { display: grid; gap: 12px; }
.zb-rule-h { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.zb-ceil { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px; display: grid; gap: 8px; }
.zb-ceil .k { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.zb-ceil .cr { display: grid; grid-template-columns: 180px 1fr; gap: 10px; align-items: center; }
.zb-ceil .cl { font-size: 12px; color: var(--ink-3); text-align: right; line-height: 1.2; }
.zb-ceil .cl b { display: block; color: var(--ink); font-weight: 600; }
.zb-ceil .ct { position: relative; height: 22px; background: var(--surface); border-radius: 4px; }
.zb-ceil .cb { position: absolute; left: 0; top: 0; bottom: 0; background: var(--accent); border-radius: 0 4px 4px 0; display: flex; align-items: center; justify-content: flex-end; padding-right: 6px; }
.zb-ceil .cb span { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--accent-ink); }
.zb-ceil .cz { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--bad); }
.zb-ceil .cz.mid { background: var(--warn); }
.zb-ceil .cz.hi { background: var(--ink-3); }
.zb-px { width: 92px; font-family: var(--font-mono); font-size: 12.5px; padding: 3px 6px; border: 1px solid var(--line-2); border-radius: 6px; background: var(--surface); text-align: right; }
.zb-rtable td.ttl { font-weight: 600; white-space: nowrap; }

/* level 4 — learnings */
.zb-learn { display: grid; gap: 10px; }
.zb-lgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.zb-tiers { display: grid; gap: 8px; padding-top: 6px; }
.zb-tiers .tr { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start; }
.zb-traps { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px; padding-top: 6px; }
.zb-traps .trap { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 9px 11px; display: grid; gap: 4px; }
.zb-notes { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: var(--ink-2); display: grid; gap: 6px; }
.zb-foot { padding-top: 4px; border-top: 1px solid var(--line); }

/* card chip + drawer block */
.chip.zb-chip { background: var(--accent-soft); color: var(--accent); }
.chip.zb-chip i { width: 12px; height: 6px; border-radius: 2px; background: currentColor; opacity: .8; }
.zb-dblock { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 12px; display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px; margin: 8px 0 4px; align-items: start; }
.zb-dblock h4 { grid-column: 1 / -1; margin: 0; font-size: 12px; letter-spacing: .02em; text-transform: uppercase; color: var(--ink-3); }
.zb-dblock .btn { grid-column: 1 / -1; justify-self: start; }

@media (max-width: 900px) {
  .zb { padding: 14px 12px 10px; }
  .zb-row, .zb-chead { grid-template-columns: 1fr; gap: 4px; }
  .zb-chead .zb-name, .zb-chead .zb-val { display: none; }
  .zb-card-grid { grid-template-columns: 1fr; }
  .zb-live .li { grid-template-columns: 70px 1fr; }
  .zb-live .li span:nth-child(3), .zb-live .li span:nth-child(4) { grid-column: 2; }
  .zb-lgrid { grid-template-columns: 1fr; }
  .zb-ceil .cr { grid-template-columns: 110px 1fr; }
  .zb-dblock { grid-template-columns: 1fr; }
  .zb-filters { margin-left: 0; }
  .zb-tip { width: min(290px, 92vw); }
  .zb-mid b { font-size: 11px; }
  .zb-bar b { display: none; }
  .zb-own { top: 42px; }
  .zb-retail { top: 52px; }
  .zb-more { flex-basis: 100%; margin-left: 0; justify-content: center; }
  .zb-foot { padding-bottom: 56px; }
}