.kx-canvas {
  transform-origin: center center;
  transition: transform 0.12s ease;
  max-width: 100%;
  max-height: 100%;
  cursor: grab;
  touch-action: none; /* 포인터 드래그 이동 — 브라우저 제스처 가로채기 방지 */
}
.kx-canvas.is-panning {
  transition: none; /* 드래그 중 지연 제거 */
  cursor: grabbing;
}
.kx-canvas__svg {
  width: min(900px, 100%);
  height: auto;
  max-height: 100%;
  display: block;
}

.kx-canvas__hall {
  fill: var(--color-canvas-bg);
  stroke: #4b5b78;
  stroke-width: 0.6;
}

/* 실측 홀 도면(JPG) 언더레이 — 다크 서피스 위 블루프린트 톤, 상호작용 통과 */
.kx-canvas__drawing {
  opacity: 0.55;
  filter: saturate(0.55);
  pointer-events: none;
}

.kx-canvas__pillars circle {
  fill: rgba(122, 92, 60, 0.55);
  stroke: #a8875f;
  stroke-width: 0.2;
}

/* 장애물(V63 실측): 벽/계단/엘리베이터=차단 톤, 문=접근 클리어 톤 */
.kx-canvas__obstacles rect {
  fill: rgba(122, 92, 60, 0.35);
  stroke: #8a7355;
  stroke-width: 0.12;
}
.kx-canvas__obstacles rect.is-door {
  fill: rgba(64, 145, 108, 0.3);
  stroke: #40916c;
}
.kx-canvas__obstacles rect.is-stair,
.kx-canvas__obstacles rect.is-elevator {
  fill: rgba(122, 92, 60, 0.55);
}

/* 트렌치 실데이터(V61/V65 공급 포인트) 도트 */
.kx-canvas__trench-points circle {
  fill: rgba(96, 165, 250, 0.55);
  stroke: #60a5fa;
  stroke-width: 0.12;
}

.kx-canvas__trench line {
  stroke: var(--color-canvas-line);
  stroke-width: 0.15;
  stroke-dasharray: 1 1;
}

.kx-canvas__booth polygon {
  fill: rgba(0, 102, 179, 0.72);
  stroke: #7cb2e0;
  stroke-width: 0.15;
  transition: fill 0.12s ease;
  cursor: pointer;
}
.kx-canvas__booth.is-premium polygon {
  fill: rgba(0, 102, 179, 0.5);
  stroke-width: 0.3;
}
.kx-canvas__booth:hover polygon {
  fill: rgba(0, 102, 179, 0.9);
}
.kx-canvas__booth.is-selected polygon {
  fill: rgba(0, 102, 179, 0.95);
  stroke: var(--color-white);
  stroke-width: 0.4;
}
.kx-canvas__booth:focus {
  outline: none;
}
.kx-canvas__booth:focus polygon {
  stroke: var(--color-ai-accent);
  stroke-width: 0.4;
}
.kx-canvas__booth-label {
  fill: rgba(255, 255, 255, 0.92);
  font-size: 1px;
  font-family: var(--font-mono);
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

.kx-canvas__ruler line {
  stroke: #5b6b88;
  stroke-width: 0.1;
}
.kx-canvas__ruler text {
  fill: #8a9bb8;
  font-size: 1.4px;
}
