/* Canopy height legend, on top of the app's tokens in web/style.css. */
.canopy-legend { font-size: 13px; color: var(--ink); }
.canopy-legend-title { color: var(--soft); font-size: 12.5px; margin-bottom: 6px; }
.canopy-legend-bar { height: 12px; border-radius: 999px; border: 1px solid var(--rule); }
.canopy-legend-ticks { position: relative; height: 18px; margin: 0 6px; font-size: 11.5px; color: var(--soft); }
.canopy-legend-ticks span { position: absolute; top: 3px; transform: translateX(-50%); white-space: nowrap; }
.canopy-legend-ticks span:last-child { transform: translateX(-80%); }
.canopy-at { font-weight: 600; min-height: 20px; }
.canopy-warn { color: var(--amber); font-size: 12.5px; }