/* 대화 말풍선 — 내 공간과 운영 화면 공통. Crest: 본문 Body 2 · 이름·시각 Caption 1 */
.chat-box { display: grid; gap: var(--space-12); max-height: 60vh; overflow-y: auto; padding: var(--space-4) var(--space-2) var(--space-8); }
.cm { display: grid; gap: var(--space-4); max-width: 82%; }
.cm.mine { justify-self: end; justify-items: end; }
.cm.theirs { justify-self: start; }
.cm-who { font-size: 12px; line-height: 16px; color: var(--label-alternative); font-weight: 600; }
.cm-body { font-size: 15px; line-height: 22px; padding: var(--space-8) var(--space-12); border-radius: var(--radius-16); white-space: pre-wrap; overflow-wrap: anywhere; }
.cm.mine .cm-body { background: var(--primary-normal); color: var(--static-white); border-bottom-right-radius: var(--radius-5); }
.cm.theirs .cm-body { background: var(--background-normal); color: var(--label-normal); box-shadow: inset 0 0 0 1px var(--line-normal-neutral); border-bottom-left-radius: var(--radius-5); }
.cm-at { font-size: 11px; line-height: 14px; color: var(--label-assistive); }
.cm-empty { font-size: 14px; color: var(--label-alternative); text-align: center; padding: var(--space-24) var(--space-8); }
.chat-form { display: grid; grid-template-columns: 1fr auto; gap: var(--space-8); margin-top: var(--space-12); align-items: end; }
.chat-form textarea { min-height: 48px; max-height: 200px; }
.chat-note { font-size: 12px; line-height: 16px; color: var(--label-alternative); margin-top: var(--space-8); }