/* Compact profile, confined to the left-hand trail selection. */
.landing-page .trail-editorial-left {
  min-width:0;
}
.landing-page .landing-elevation {
  margin-top:22px;
  padding:12px 16px 10px;
  background:#f0e9db;
  border-top:2px solid #ba8b4f;
}
.landing-page .elevation-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}
.landing-page .elevation-heading .eyebrow {
  font-size:.61rem;
  letter-spacing:.1em;
  margin:0;
  white-space:nowrap;
}
.landing-page .elevation-heading .eyebrow::before {
  width:14px;
  margin-right:7px;
}
.landing-page .elevation-trail {
  font-size:.67rem;
  line-height:1.5;
  color:#606551;
  margin:3px 0 12px;
}
.landing-page .elevation-readout {
  font-variant-numeric:tabular-nums;
  font-size:.65rem;
  color:#75522d;
  text-align:right;
  white-space:nowrap;
}
.landing-page .elevation-chart {
  position:relative;
  padding-left:39px;
}
.landing-page .elevation-surface {
  position:relative;
  height:105px;
  touch-action:pan-y;
  cursor:crosshair;
  background:repeating-linear-gradient(to bottom,#bcae942b 0,#bcae942b 1px,transparent 1px,transparent calc(50% - .5px));
  border-bottom:1px solid #bcae9466;
}
.landing-page .elevation-surface>svg {
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}
.landing-page .elevation-line {
  fill:none;
  stroke:#a5743d;
  stroke-width:1.7;
  vector-effect:non-scaling-stroke;
  stroke-linejoin:round;
}
.landing-page .elevation-fill {
  fill:#bc935133;
}
.landing-page .elevation-y-axis {
  position:absolute;
  inset:0 auto 0 0;
  width:32px;
  color:#606551;
  font-size:.56rem;
}
.landing-page .elevation-y-axis span {
  position:absolute;
  right:0;
  transform:translateY(-50%);
}
.landing-page .elevation-high {
  top:0;
}
.landing-page .elevation-middle {
  top:50%;
}
.landing-page .elevation-low {
  top:100%;
}
.landing-page .elevation-x-axis {
  display:flex;
  justify-content:space-between;
  padding:3px 0 0 39px;
  color:#606551;
  font-size:.57rem;
  line-height:1.5;
  font-variant-numeric:tabular-nums;
}
.landing-page .elevation-cursor {
  position:absolute;
  top:0;
  bottom:0;
  width:0;
  border-left:1px solid #75522d90;
  pointer-events:none;
}
.landing-page .elevation-dot {
  position:absolute;
  left:-.5px;
  width:9px;
  height:9px;
  border:2px solid #f8f4e9;
  background:#825b31;
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.landing-page .elevation-controls {
  padding-left:39px;
  margin-top:2px;
}
.landing-page .elevation-range {
  display:block;
  width:100%;
  height:18px;
  margin:0;
  accent-color:#95692f;
  cursor:ew-resize;
}
.landing-page .elevation-range:focus-visible {
  outline:2px solid #8b5c24;
  outline-offset:3px;
}
.landing-page .elevation-footer {
  margin-top:5px;
  padding-top:4px;
  border-top:1px solid #ded5c3;
}
.landing-page .elevation-note,.landing-page .elevation-status {
  font-size:.57rem;
  line-height:1.5;
  color:#606551;
}
.landing-page .elevation-sources {
  font-size:.56rem;
  line-height:1.5;
  margin-top:2px;
  display:flex;
  flex-wrap:wrap;
  gap:2px 10px;
}
.landing-page .elevation-sources a {
  text-decoration:underline;
  text-underline-offset:2px;
}
.landing-page .landing-elevation [hidden] {
  display:none;
}
@media(max-width:740px) {
  .landing-page .landing-elevation {
    margin-top:20px;
    padding:11px 12px 9px;
  }
  .landing-page .elevation-surface {
    height:105px;
  }
  .landing-page .elevation-heading .eyebrow {
    font-size:.56rem;
    letter-spacing:.06em;
  }
  .landing-page .elevation-heading .eyebrow::before {
    display:none;
  }
  .landing-page .elevation-readout {
    font-size:.61rem;
  }
  .landing-page .elevation-note {
    font-size:.59rem;
  }
}
/* Keep the compact layout readable, including the narrowest phone viewport. */
.landing-page .elevation-heading {
  flex-wrap:wrap;
  gap:2px 8px;
}
.landing-page .elevation-heading .eyebrow {
  font-size:11px;
}
.landing-page .elevation-readout {
  font-size:12px;
  flex:1 0 auto;
}
.landing-page .elevation-trail {
  font-size:12px;
  margin-bottom:7px;
}
.landing-page .elevation-y-axis,.landing-page .elevation-x-axis {
  font-size:10px;
}
.landing-page .elevation-note,.landing-page .elevation-status,.landing-page .elevation-sources {
  font-size:11px;
  line-height:1.4;
}
@media(max-width:740px) {
  .landing-page .elevation-heading .eyebrow {
    font-size:10px;
  }
  .landing-page .elevation-range {
    height:24px;
  }
}