.rcr-route-view { margin-top: 24px; }
.rcr-controls { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.rcr-map { width: 100%; height: 450px; border-radius: 10px; overflow: hidden; }

/* Summary panel */
.rcr-summary{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  padding:10px 12px;
  border:1px solid #e5e5e5;
  border-radius:10px;
  margin: 0 0 12px;
}

/* Elevation */
.rcr-elevation { margin-top: 12px; }
.rcr-elev-title { margin: 0 0 6px; font-size: 16px; }
.rcr-elev-chart { width: 100%; border: 1px solid #e5e5e5; border-radius: 10px; padding: 8px; }
.rcr-muted { opacity: 0.75; }

/* Route list */
.rcr-route-list { display: grid; gap: 16px; }
.rcr-route-card { border: 1px solid #e5e5e5; border-radius: 10px; padding: 14px; }
.rcr-variation-list { margin: 8px 0 0 18px; }

/* Distance markers */
.rcr-distance-marker span{
  display:inline-flex;
  width:26px; height:26px;
  border-radius:50%;
  align-items:center; justify-content:center;
  background:#111; color:#fff;
  font-size:12px; font-weight:600;
  border:2px solid #fff;
  box-shadow:0 1px 4px rgba(0,0,0,.3);
}

/* Unit toggle */
.rcr-units-toggle { display:flex; gap:8px; }
.rcr-unit-btn {
  padding:6px 10px;
  border:1px solid #ccc;
  border-radius:999px;
  background:#fff;
  cursor:pointer;
}
.rcr-unit-btn.is-active { border-color:#111; font-weight:600; }