/**
 * Image Marker — frontend
 *
 * The overlay sits inside the existing .unit__floorplan <figure>, which is
 * already position:relative and sized by .unit__floorplan-image. The dot
 * and sliding label are inherited from the map markers in main.css
 * (.ds-marker__dot / .ds-marker__label), so the look stays in one place.
 */

/* Marker layer overlays the floor plan figure. */
.ds-imap__layer                 { position: absolute; inset: 0; line-height: 1; z-index: 2; }

/* Anchor each marker's dot centre on its stored % coordinate. */
.ds-marker--pin                 { position: absolute; transform: translate(-50%, -50%); }

/* The label now carries text + area; add the gap and area styling. */
.ds-imap__layer .ds-marker__label      { gap: var(--S00); }
.ds-imap__layer .ds-marker__label-area { opacity: 0.6; font-variant-numeric: tabular-nums; }