/* PC 층: public/shared/user-map.css 위에 얹는 넓은 화면 배치
 * 머리와 바닥글 사이를 지도가 채우고, 모바일 하단 시트는 오른쪽 옆 패널이 됩니다. 문서는 스크롤되지 않고 패널만 스크롤합니다. */
body.pc {
  height: 100dvh;
  min-height: 0;
}

body.pc .pc-main {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  max-width: none;
  min-height: 0;
  padding: 0;
}

.map {
  --map-panel: clamp(400px, 30vw, 520px);
  position: relative;
  inset: auto;
  flex: 1 1 0;
  min-height: 0;
  max-width: none;
}

/* 지도 면은 패널 왼쪽만. user-map.js 는 하단 시트 306px · 위 줄 120px 을 뺀 영역의 가운데에 보기를 맞추므로
 * (높이 - 306 + 120) / 2 가 실제 가운데가 되도록 면을 아래로 186px 더 늘립니다(넘친 만큼은 .map 이 잘라 냄). */
.map__stage {
  inset: 0 var(--map-panel) -186px 0;
}

.map-top {
  top: var(--space-3);
  right: calc(var(--map-panel) + var(--space-3));
  left: var(--space-3);
}

.map-zoom {
  right: calc(var(--map-panel) + var(--space-3));
  bottom: 72px;
}

.map-gps {
  right: calc(var(--map-panel) + var(--space-3));
  bottom: var(--space-5);
}

.map-sheet {
  top: 0;
  left: auto;
  width: var(--map-panel);
  height: auto;
  padding: var(--space-5) var(--space-4) 0;
  border-left: 1px solid var(--color-border-default);
  border-radius: 0;
  box-shadow: none;
}

.map-sheet__grab {
  display: none;
}

.map-sheet__body {
  padding-bottom: var(--space-5);
  scrollbar-width: thin;
}

.map-sum__v {
  font-variant-numeric: tabular-nums;
}

/* 위치 권한 시트는 가운데 대화상자로 */
.map-ov {
  align-items: center;
}

.map-ov__sheet {
  max-width: 460px;
  padding: var(--space-5);
  border-radius: var(--radius-lg);
}

.map-ov__later {
  margin-inline: var(--space-2);
}