feat(M02-흐름도): 상세 내용 판 - 선 규칙 LinkPanel · 알약 PillPanel · 함수 판 끝수는 모델 round 로

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01D2nUMUMTsqm93PbQtipo6c
2026-10-01 19:48:24 +09:00
parent a3730d227e
commit 022c7e086b
8 changed files with 992 additions and 167 deletions
@@ -0,0 +1,82 @@
+.m02-dflink {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-8);
+  font-size: var(--text-body);
+  color: var(--color-text-body);
+}
+
+.m02-dflink-head,
+.m02-dflink-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--spacing-8);
+}
+
+.m02-dflink-label {
+  font-weight: var(--font-weight-bold);
+}
+
+.m02-dflink-note {
+  margin: 0;
+  color: var(--color-text-muted);
+  font-size: var(--text-body-sm);
+}
+
+.m02-dflink-value {
+  padding: 2px var(--spacing-12);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-pills);
+  background: var(--color-surface-raised);
+  font-weight: var(--font-weight-medium);
+}
+
+.m02-dflink-num {
+  width: 7em;
+}
+
+.m02-dflink-warn {
+  margin: 0;
+  padding: var(--spacing-8) var(--spacing-12);
+  border-left: 4px solid var(--color-warning);
+  background: var(--color-surface-raised);
+  font-weight: var(--font-weight-medium);
+}
+
+/* 알약 판 */
+.m02-dfpill {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-8);
+  font-size: var(--text-body);
+  color: var(--color-text-body);
+}
+
+.m02-dfpill-title {
+  font-weight: var(--font-weight-bold);
+}
+
+.m02-dfpill-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-4);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.m02-dfpill-step {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-8);
+  align-items: center;
+}
+
+.m02-dfpill-rule {
+  padding: 0 var(--spacing-8);
+  border: 1px dashed var(--color-border);
+  border-radius: var(--radius-pills);
+  color: var(--color-text-secondary);
+  font-size: var(--text-body-sm);
+}