/* 정보 수준·부서 수와 관계없이 같은 기본 핀. 반응 테두리만 색을 사용한다. */
.level-dot { border:2px solid #435c56; background:#fff; }
.level-dot.visited { background:#d4d4d4; border-color:var(--reaction,#777); }
.map-pin { color:#34483f; }
.map-pin .pin-dot {
  width:26px;
  height:26px;
  background:#fff;
  border:3px solid #435c56;
  box-shadow:0 0 0 3px #fff,0 0 0 4px #3f494377,0 3px 8px #20202055;
}
.map-pin.visit-unknown .pin-dot { background:#f0f0f0; border-color:#777; color:#555; }
.map-pin.visited .pin-dot { background:#d1d1d1; border:4px solid var(--reaction,#777); color:#333; font-size:15px; }
.map-pin.visited.reaction-none .pin-dot { border:4px solid #d1d1d1; }
.map-pin.visited .pin-label { color:#626262; background:#fffffff5; font-weight:600; }
.map-pin.selected .pin-dot { box-shadow:0 0 0 3px #fff,0 0 0 5px #282b33,0 3px 8px #20202055; }
.map-pin.selected .pin-label, .map-pin:hover .pin-label { background:#353139; color:#fff; }
.address-flag { position:absolute; top:-6px; left:48px; width:16px; height:16px; display:grid; place-items:center; border:1px solid #806229; border-radius:50%; font-size:11px; font-weight:800; color:#4f3a10; background:#fff2b8; }
.map-legend { max-width:440px; gap:10px; }
.map-legend .level-dot { width:12px; height:12px; }
@media(max-width:760px) {
  .map-legend { gap:7px; max-width:335px; padding:8px 10px; }
  .map-controls { bottom:108px; }
}