.explore-card-symbol{display:grid;place-items:center;width:42px;height:47px;border:2px solid #b4c4a8;border-radius:10px 10px 19px 19px;color:#698058;background:#eef3e8}
.explore-card-symbol>.icon{width:26px;height:26px}
.explore-card-symbol.visited{color:#fffefa;background:#75915f;border-color:#a2b98b}
.area-pin-icon.is-selected .area-map-symbol,.area-cluster-icon.is-selected .area-cluster,.peak-map-icon.is-selected .peak-map-symbol{outline:3px solid #244b3a;outline-offset:4px;filter:drop-shadow(0 2px 4px #244b3a44)}
@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
  html:has(.workspace.has-explore) #import-button{visibility:hidden}
  #phone-explore-carousel .phone-trail-thumbnail{background:#eff3e9}
  #phone-explore-carousel .phone-trail-elevation:before{margin-right:7px}
  #details .peak-popup{display:flex;flex-direction:column;gap:8px;padding-top:2px}
  #details .peak-popup>strong{font-family:var(--serif);font-size:24px;line-height:1.15;padding-right:32px}
  #details .peak-popup>span,#details .peak-popup>small{font-size:12px;color:var(--muted)}
  #details .peak-popup>.text-button{min-height:44px;align-self:flex-start}
}

#collection-panel-title{display:none}
@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
  #expand-collection{display:none!important}
  .workspace.phone-expanded .sidebar>.phone-sheet-handle{height:44px;min-height:44px}
  .workspace.phone-expanded .sidebar .panel-heading{position:absolute;z-index:6;top:0;right:12px;display:flex;justify-content:flex-end;width:44px;height:44px;min-height:44px;margin:0}
}

/* Area facts share one compact layout in map popups and full detail cards. */
.area-details.area-details--facts{width:100%;max-width:100%;max-height:none;overflow:visible;padding:0;font-size:11px;line-height:1.45}
.area-details--facts .area-details__kind-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:28px;margin:0 0 4px}
.area-details--facts .area-details__kind{margin:0;font-size:9px;line-height:1.4}
.area-details--facts .area-details__agencies{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex:none}
.area-details--facts .area-details__agency-logo{display:block;flex:none;width:30px;height:28px;object-fit:contain}
.area-details--facts .area-details__name{font-size:23px;line-height:1.15}
.area-details--facts .area-details__metrics{display:flex;gap:10px;margin:8px 0;padding:0;border:0}
.area-details--facts .area-details__metric{display:flex;align-items:baseline;gap:7px}
.area-details--facts .area-details__label{margin:0;font-size:10px;line-height:1.4}
.area-details--facts .area-details__value{font-size:12px;line-height:1.4}
.area-details--facts .area-details__description{margin:8px 0}
.area-details--facts .area-details__introduction{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;max-height:2.9em;overflow:hidden;margin:0;font-size:12px;line-height:1.45}
.area-details--facts .area-details__visitation{margin:8px 0 0;padding:8px 0 0}
.area-details--facts .area-details__visitation-label{margin:0 0 3px;font-size:9px;line-height:1.4}
.area-details--facts .area-details__visitation-row{gap:8px;margin:0}
.area-details--facts .area-details__rank{font-size:11px;line-height:1.4}
.area-details--facts .area-details__visits{font-size:10px;line-height:1.4}
.area-details--facts .area-details__status{margin:7px 0 0;font-size:10px}
.workspace.has-explore #hike-inspector #details{padding:14px 18px}
#details .area-details--facts .area-details__kind-row{padding-right:30px}
#details .area-details--facts .area-details__name{padding-right:26px}
@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
  .workspace.has-explore #hike-inspector{height:auto;max-height:min(340px,calc(var(--phone-viewport-height,100dvh) - var(--phone-sheet-bottom) - 12px));border-radius:20px}
  .workspace.has-explore #hike-inspector #details{padding:6px 16px 14px}
  .area-details--facts .area-details__name{font-size:22px}
}

@media(min-width:701px){
 .workspace.has-explore #hike-inspector #details{top:22px;bottom:auto;max-height:calc(100% - 240px);overflow-y:auto}
}
@media(max-width:1000px) and (max-height:500px) and (pointer:coarse){
 .workspace.has-explore #hike-inspector #details{top:auto;bottom:auto;max-height:none;overflow:visible}
}

@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
 .workspace.has-explore #hike-inspector:has(.area-details){top:auto;bottom:var(--phone-sheet-bottom);height:auto;max-height:min(290px,calc(var(--phone-viewport-height,100dvh) - var(--phone-sheet-bottom) - var(--phone-header-height,90px) - 26px))}
}
