/* V Shape · Broker Move Heatmap (Phase 1) · below hero chart
 * Usa --ih-vs-z (mesmo zoom do desk OPT7) — sem isso os blocos ficam ~½ do resto. */

#ih-panel-vshape-reversal .ih-vs-heat {
  background: rgba(4, 6, 10, 0.92);
  border: 1px solid rgba(40, 52, 64, 0.9);
  display: flex;
  flex-direction: column;
  gap: calc(8px * var(--ih-vs-z, 1));
  min-height: calc(200px * var(--ih-vs-z, 1));
  padding: calc(10px * var(--ih-vs-z, 1)) calc(12px * var(--ih-vs-z, 1)) calc(12px * var(--ih-vs-z, 1));
}

#ih-panel-vshape-reversal .ih-vs-heat__meta {
  color: #6a7888;
  font-family: var(--font-bloomberg, "IBM Plex Mono", monospace);
  font-size: calc(12px * var(--ih-vs-z, 1));
  letter-spacing: 0.06em;
  padding: 0 2px calc(6px * var(--ih-vs-z, 1));
}

#ih-panel-vshape-reversal .ih-vs-heat__grid {
  display: grid;
  gap: calc(4px * var(--ih-vs-z, 1));
  grid-template-columns: repeat(auto-fill, minmax(calc(108px * var(--ih-vs-z, 1)), 1fr));
  max-height: min(52vh, calc(480px * var(--ih-vs-z, 1)));
  overflow: auto;
}

#ih-panel-vshape-reversal .ih-vs-heat__cell {
  appearance: none;
  background: rgba(255, 255, 255, 0.05);
  border: 0;
  border-radius: 0;
  color: #e8edf2;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: calc(4px * var(--ih-vs-z, 1));
  font: inherit;
  justify-content: center;
  min-height: calc(58px * var(--ih-vs-z, 1));
  padding: calc(10px * var(--ih-vs-z, 1)) calc(8px * var(--ih-vs-z, 1));
  text-align: center;
}

#ih-panel-vshape-reversal .ih-vs-heat__cell:hover,
#ih-panel-vshape-reversal .ih-vs-heat__cell:focus-visible {
  outline: 1px solid rgba(74, 143, 160, 0.65);
  outline-offset: -1px;
  z-index: 1;
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--flat {
  background: rgba(80, 90, 100, 0.28);
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--up {
  background: rgba(116, 222, 198, 0.22);
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--hot-up {
  background: rgba(116, 222, 198, 0.42);
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--dn {
  background: rgba(224, 122, 95, 0.22);
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--hot-dn {
  background: rgba(232, 56, 56, 0.4);
}

#ih-panel-vshape-reversal .ih-vs-heat__sym {
  color: rgba(232, 237, 242, 0.92);
  display: block;
  font-family: var(--font-bloomberg, "IBM Plex Mono", monospace);
  font-size: calc(13px * var(--ih-vs-z, 1));
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#ih-panel-vshape-reversal .ih-vs-heat__chg {
  color: #fff;
  display: block;
  font-family: var(--font-bloomberg, "IBM Plex Mono", monospace);
  font-size: calc(15px * var(--ih-vs-z, 1));
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.1;
}

#ih-panel-vshape-reversal .ih-vs-heat__cell--flat .ih-vs-heat__chg {
  color: #9aa6b4;
}
