.context-panel[data-mode="dialogue"] { position: relative; grid-template-rows: minmax(0, 1fr); }
.context-panel[data-mode="dialogue"] .panel-body { grid-row: 1; min-block-size: 0; padding: 0; overflow: hidden; }
.context-panel[data-mode="dialogue"] .panel-toggle { display: none; }
.context-panel[data-mode="dialogue"] .panel-header { position: absolute; inset-block-start: var(--space-3); inset-inline-end: var(--space-3); z-index: 1; min-block-size: 0; padding: 0; border: 0; }
.context-panel[data-mode="dialogue"] .panel-header > div { display: none; }
.character-chat { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; min-block-size: 0; block-size: 100%; background: var(--surface-000); }
.chat-profile { padding: var(--space-4); padding-inline-end: calc(var(--target-min) + var(--space-6)); background: var(--neutral-050); border-block-end: var(--line-thin) solid var(--neutral-350); }
.chat-profile-copy { display: grid; gap: var(--space-1); }
.chat-profile-copy h2 { margin: 0; font-size: var(--type-20); line-height: var(--leading-tight); }
.chat-profile-copy span { color: var(--ink-600); font-size: var(--type-14); font-weight: 700; }
.chat-profile-copy p { margin: var(--space-2) 0 0; color: var(--ink-600); line-height: var(--leading-body); word-break: keep-all; }
.thread-rail { display: grid; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-block-end: var(--line-thin) solid var(--neutral-350); }
.thread-rail-header, .thread-actions, .composer-actions { display: flex; align-items: center; gap: var(--space-2); }
.thread-rail-header { justify-content: space-between; flex-wrap: wrap; }
.thread-rail h3 { margin: 0; font-size: var(--type-16); }
.thread-actions { flex-wrap: wrap; }
.thread-actions button { min-block-size: var(--target-min); }
.quiet-action { padding-inline: var(--space-3); color: var(--status-error-700); background: var(--surface-000); border: var(--line-thin) solid var(--neutral-350); border-radius: var(--radius-sm); font-weight: 700; cursor: pointer; }
.thread-list { display: flex; gap: var(--space-2); min-inline-size: 0; padding-block-end: var(--space-1); overflow-x: auto; scroll-snap-type: inline mandatory; }
.thread-button { min-inline-size: min(13rem, 80%); padding: var(--space-2) var(--space-3); text-align: start; background: var(--surface-000); border: var(--line-thin) solid var(--neutral-350); border-radius: var(--radius-sm); scroll-snap-align: start; cursor: pointer; }
.thread-button[aria-current="true"] { background: var(--company-accent-100); border-color: var(--company-accent-600); }
.thread-button[aria-current="true"] small { color: var(--ink-900); }
.thread-button strong, .thread-button small { display: block; word-break: keep-all; }
.thread-button small { margin-block-start: var(--space-1); color: var(--ink-600); line-height: var(--leading-body); }
.chat-timeline { display: flex; flex-direction: column; gap: var(--space-3); min-block-size: 0; padding: var(--space-4); overflow-y: auto; overscroll-behavior: contain; background: var(--neutral-050); }
.chat-message { align-self: flex-start; max-inline-size: 88%; padding: var(--space-3); background: var(--surface-000); border: var(--line-thin) solid var(--neutral-350); border-radius: var(--radius-md); }
.chat-message[data-outgoing="true"] { align-self: flex-end; color: var(--ink-900); background: var(--company-accent-100); border-color: var(--company-accent-600); }
.chat-message[data-outgoing="true"] .message-meta, .chat-message[data-outgoing="true"] .message-delivery { color: var(--ink-900); }
.message-meta { display: flex; justify-content: space-between; gap: var(--space-3); color: var(--ink-600); font-size: var(--type-12); }
.message-body { margin: var(--space-2) 0; line-height: var(--leading-body); white-space: pre-wrap; word-break: keep-all; overflow-wrap: break-word; }
.message-delivery { display: block; color: var(--ink-600); text-align: end; }
.chat-working, .chat-empty { margin: 0; padding: var(--space-3); color: var(--ink-600); background: var(--status-warning-100); border-inline-start: var(--line-focus) solid var(--presence-away); line-height: var(--leading-body); word-break: keep-all; }
.chat-composer { display: grid; gap: var(--space-2); padding: var(--space-3) var(--space-4) var(--space-4); background: var(--surface-000); border-block-start: var(--line-thin) solid var(--neutral-350); }
.chat-composer label { font-weight: 700; }
.chat-composer textarea { inline-size: 100%; min-block-size: calc(var(--control-tall) + var(--space-4)); padding: var(--space-3); resize: vertical; color: var(--ink-900); background: var(--surface-000); border: var(--line-thin) solid var(--glass-500); border-radius: var(--radius-sm); line-height: var(--leading-body); }
.composer-actions { justify-content: flex-end; flex-wrap: wrap; }
.chat-status { min-block-size: calc(var(--space-5) + var(--space-1)); margin: 0; color: var(--ink-600); line-height: var(--leading-body); word-break: keep-all; }
.chat-status[data-kind="error"], .chat-status[data-kind="oversized"], .chat-status[data-kind="unauthorized"] { color: var(--status-error-700); }
.chat-status[data-kind="success"] { color: var(--company-accent-600); }
.chat-status[data-kind="reconnecting"], .chat-status[data-kind="offline"], .chat-status[data-kind="timeout"] { padding: var(--space-2); background: var(--status-warning-100); }

/* 직원 업무 모니터 — 지금 무엇을 하는지 화면처럼 보여준다. */
.chat-monitor { display: grid; gap: var(--space-1); padding: var(--space-3) var(--space-4); background: var(--neutral-050); border-block-end: var(--line-thin) solid var(--neutral-350); }
.chat-monitor-screen { padding: var(--space-3); background: var(--navy-950); border: var(--line-world) solid var(--navy-850); border-radius: var(--radius-sm); box-shadow: var(--shadow-hard); }
.chat-monitor-screen p { margin: 0; color: var(--company-accent-100); font-size: var(--type-14); font-weight: 700; line-height: var(--leading-body); word-break: keep-all; }
.chat-monitor > small { color: var(--ink-600); font-weight: 700; }
