#map {
  border: 1px solid #ccc;
  border-radius: 4px;
}

#overlapModal {
  display: none;
  border-radius: 8px;
  box-sizing: border-box;
}
#overlapModal h3 {
  margin-top: 0;
}
#overlapModal div:hover {
  background-color: #eee;
}

.rank-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 0.85rem;
  font-weight: bold;
  color: white;
  margin-left: 8px;
}

.rank-legend {
  background-color: #FFD700;
  color: black;
}

.rank-expert {
  background-color: #C0C0C0;
  color: black;
}

.rank-pilgrim {
  background-color: #1E90FF;
}

.rank-beginner {
  background-color: #32CD32;
}

.rank-badge i {
  margin-right: 4px;
}