/* D03 예정노선 2단계 노선분석(PLAN 530-3 · 563-1) — 평면이 본문을 채움 · 위에 도구줄 · 좌측 지형 · 그리기 · 구역 · 연도. */

.d03-plan-layout .ui-workflow-layout__main {
  height: calc(100dvh - var(--app-header-h));
  overflow: hidden;
}

.d03-plan {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.d03-plan__map {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  background: #1f2937;
}

.d03-plan__map canvas {
  display: block;
  touch-action: none;
}

.d03-plan__tools {
  position: absolute;
  top: var(--spacing-8);
  right: var(--spacing-8);
}

/* 569-2 바탕 겹 단추 — 왼쪽 위 · 급경사 범례 — 왼쪽 아래 */
.d03-plan__layers {
  position: absolute;
  top: var(--spacing-8);
  left: var(--spacing-8);
}

.d03-plan__legend {
  position: absolute;
  bottom: var(--spacing-8);
  left: var(--spacing-8);
  padding: var(--spacing-4) var(--spacing-8);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.d03-plan__hint {
  margin: 0 0 6px;
}

.d03-plan__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-8);
  align-items: flex-end;
  margin-bottom: 6px;
}

.d03-plan__row > .ui-field {
  flex: 1 1 6rem;
  margin: 0;
}

.d03-plan__draw {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.d03-plan__pieces {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.d03-plan__piece-head {
  margin: 6px 0 0;
  font-weight: 600;
  color: var(--color-text);
}

.d03-plan__piece {
  display: flex;
  gap: var(--spacing-8);
  align-items: center;
  justify-content: space-between;
}

.d03-plan__piece > .ui-text {
  margin: 0;
}

.d03-plan__piece > .ui-field {
  flex: 0 0 6.5rem;
  margin: 0;
}

/* 지형 받기 범위 미리보기 — 카카오 지도 */
.d03-plan__extent > .ui-text {
  margin: 0 0 6px;
}

/* 3D 큰 모달 — 3D 화면이 모달 몸을 꽉 채움 · 몸 스크롤 없음 */
.ui-modal--wide > .ui-modal__body.d03-plan__3d-body {
  overflow: hidden;
}

.d03-plan__3d-body > .b05-route__viewport {
  flex: 1 1 auto;
  min-height: 0;
  border-radius: var(--radius-lg);
}

.d03-plan__3d-top {
  display: flex;
  gap: var(--spacing-8);
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 6px;
}