feat(m02-cf): 단가산출 다이어그램 출력 상자 판(OutputPanel) · 원가 합계 칸(Summary)

출력 상자의 받은 값 · 비용 종류 · 단위 · 이름 판, 원가 합계(노무비 · 재료비 · 경비 · 계) · 출력 상자별 줄 · 값 출력 · 빈 받는 자리 · 오류 · 예시값.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EauA2ATmqNRbeV48s9CcBr

M02_MasterTemplete/CostFlow/M02_CF_OutputPanel.css

@@ -0,0 +1,85 @@
+.m01-cfout__title {
+  color: var(--color-text-body);
+  font-size: var(--text-body);
+}
+
+.m01-cfout__body {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: var(--spacing-16);
+  margin: var(--spacing-8) 0;
+}
+
+.m01-cfout__got {
+  min-width: 220px;
+  color: var(--color-text-body);
+}
+
+.m01-cfout__got dl {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  gap: var(--spacing-4) var(--spacing-8);
+  margin: var(--spacing-4) 0 0;
+  font-size: var(--text-body-sm);
+}
+
+.m01-cfout__got dt {
+  color: var(--color-text-secondary);
+}
+
+.m01-cfout__got dd {
+  margin: 0;
+}
+
+.m01-cfout__num {
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+}
+
+.m01-cfout__fields {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  gap: var(--spacing-8) var(--spacing-16);
+}
+
+.m01-cfout__field {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-4);
+  color: var(--color-text-secondary);
+  font-size: var(--text-body-sm);
+}
+
+.m01-cfout__input {
+  box-sizing: border-box;
+  width: 160px;
+  max-width: 100%;
+  height: var(--control-height-sm);
+  padding: 3px 6px;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  background: var(--color-canvas);
+  color: var(--color-text-body);
+  font: inherit;
+  font-size: var(--text-body-sm);
+}
+
+.m01-cfout__warn {
+  margin: var(--spacing-4) 0 0;
+  color: var(--color-danger);
+  font-size: var(--text-body-sm);
+}
+
+.m01-cfout__muted {
+  margin: 0;
+  color: var(--color-text-muted);
+  font-size: var(--text-caption);
+}
+
+.m01-cfout__msg {
+  margin: var(--spacing-4) 0 0;
+  color: var(--color-danger);
+  font-size: var(--text-caption);
+}