260725_1

B06_wf3_ProfileCross/B06_wf3_ProfileCross_UI_Style.css

@@ -92,6 +92,126 @@
   gap: var(--spacing-16);
 }
 
+/* ─── 변수 위치 안내 모식도 (작업 C-5) ───────────────────────────── */
+.b06-std__diagram {
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-inputs);
+  background-color: var(--color-surface);
+  padding: var(--spacing-8);
+}
+
+.b06-std__diagram-summary {
+  cursor: pointer;
+  font-size: var(--text-caption);
+  font-weight: var(--font-weight-medium);
+  color: var(--color-text-secondary);
+  user-select: none;
+}
+
+.b06-std__diagram-svg {
+  width: 100%;
+  height: auto;
+  margin-top: var(--spacing-8);
+}
+
+.b06-std__diagram-caption {
+  margin: var(--spacing-8) 0 0;
+  font-size: var(--text-caption);
+  color: var(--color-text-muted);
+}
+
+/* ─── 다른 프로젝트에서 불러오기 (작업 C-6) ───────────────────────── */
+.b06-std__loader {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-8);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-inputs);
+  background-color: var(--color-surface);
+  padding: var(--spacing-8);
+}
+
+.b06-std__loader-summary {
+  cursor: pointer;
+  font-size: var(--text-caption);
+  font-weight: var(--font-weight-medium);
+  color: var(--color-text-secondary);
+  user-select: none;
+}
+
+.b06-std__loader-status {
+  margin: 0;
+  font-size: var(--text-caption);
+  color: var(--color-text-muted);
+}
+
+.b06-std__loader-preview {
+  margin: 0;
+  padding: var(--spacing-8);
+  border-radius: var(--radius-inputs);
+  background-color: var(--color-surface-raised);
+  color: var(--color-text-body);
+  font-size: var(--text-caption);
+  white-space: pre-wrap;
+  overflow-x: auto;
+}
+
+.b06-diag__ground {
+  fill: none;
+  stroke: var(--color-text-muted);
+  stroke-width: 1;
+  stroke-dasharray: 3 2;
+}
+
+.b06-diag__road {
+  fill: none;
+  stroke: var(--color-text-body);
+  stroke-width: 2;
+}
+
+.b06-diag__center {
+  stroke: var(--color-royal-amethyst, rgb(109 40 217));
+  stroke-width: 1;
+  stroke-dasharray: 4 3;
+}
+
+.b06-diag__tick {
+  stroke: var(--color-text-secondary);
+  stroke-width: 1;
+}
+
+.b06-diag__ditch {
+  fill: color-mix(in srgb, rgb(37 99 235) 20%, transparent);
+  stroke: rgb(37 99 235);
+  stroke-width: 1;
+}
+
+.b06-diag__cut {
+  stroke: rgb(220 38 38);
+  stroke-width: 1.5;
+}
+
+.b06-diag__fill {
+  stroke: rgb(37 99 235);
+  stroke-width: 1.5;
+}
+
+.b06-diag__slope-arrow {
+  stroke: var(--color-text-secondary);
+  stroke-width: 1;
+  marker-end: none;
+}
+
+.b06-diag__label {
+  fill: var(--color-text-body);
+  font-size: 9px;
+}
+
+.b06-diag__label-sm {
+  fill: var(--color-text-secondary);
+  font-size: 8px;
+}
+
 .b06-std__group {
   display: flex;
   flex-direction: column;
@@ -340,6 +460,13 @@
   font-size: 10px;
 }
 
+/* 구조물(비정규) 측점 이름 — 종단면도 측점선 상단 표기. */
+.b06-chart__structure-label {
+  font-size: 9px;
+  font-weight: var(--font-weight-medium);
+  fill: rgb(180 83 9);
+}
+
 .b06-chart__axis-label {
   fill: var(--color-text-body);
   font-size: var(--text-caption);