/* 히트맵(trafficHeat) — 미니맵 위 연속 열. 색은 원본 대시보드의 네 색 그라데이션 그대로(파랑 → 연두 → 노랑 → 빨강) */
.th-layer { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.th-hit { position: absolute; inset: 0; cursor: crosshair; }
/* 값 툴팁 — 흰 면(값을 나른다). 가리킨 자리 위에 뜬다 */
.th-tip {
  position: absolute; z-index: 4; pointer-events: none; white-space: nowrap;
  transform: translate(-50%, calc(-100% - 10px));
  padding: 4px 8px; font-size: 13px; line-height: 1.4; color: var(--text);
  background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-4); box-shadow: var(--shadow-sm);
}
/* 범례 — 구역 히트맵(.hm-legend)과 같은 자리 · 글자. 단계 칩 대신 연속 띠 */
.th-legend {
  display: flex; align-items: center; justify-content: center; gap: var(--spacing-8);
  font-size: var(--chart-label-size); line-height: 1.4; color: var(--text-sub);
}
.th-ramp { width: 160px; height: 12px; border-radius: 2px; }
.th[aria-busy="true"] .pl-canvas { opacity: .6; }