/* v11.1 – Nhân viên nào trả lời đoạn nào: nhãn tên + màu riêng, vạch chia khi đổi người */
.app.v9 .msg.out.by-staff { box-shadow: inset -4px 0 0 var(--sc); padding-right: 14px; }
.who-label { align-self: flex-end; display: flex; align-items: center; gap: 6px; margin: 8px 2px 1px 0; font-size: 12px; color: var(--muted); }
.who-label i, .who-div i, .who-chip i { font-style: normal; width: 20px; height: 20px; border-radius: 50%; background: var(--sc); color: #fff; font-size: 9.5px; font-weight: 700; display: inline-grid; place-items: center; flex: 0 0 20px; }
.who-label b { color: var(--sc); font-weight: 700; }
.who-label span { opacity: .8; }
.who-div { align-self: stretch; display: flex; align-items: center; gap: 10px; margin: 14px 0 4px; font-size: 12px; color: var(--sc); font-weight: 600; }
.who-div::before, .who-div::after { content: ''; flex: 1; border-top: 1px dashed color-mix(in srgb, var(--sc) 50%, transparent); }
.who-div span { display: inline-flex; align-items: center; gap: 6px; background: var(--panel, #fff); border: 1px solid color-mix(in srgb, var(--sc) 40%, transparent); border-radius: 14px; padding: 2px 10px 2px 3px; white-space: nowrap; }
.who-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 14px; background: var(--panel); border-bottom: 1px solid var(--line); }
.who-bar[hidden] { display: none; }
.who-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid color-mix(in srgb, var(--sc, #999) 45%, transparent); background: color-mix(in srgb, var(--sc, #999) 10%, transparent); color: var(--text); border-radius: 16px; padding: 3px 10px 3px 3px; font: inherit; font-size: 12.5px; cursor: pointer; }
.who-chip b { color: var(--muted); font-weight: 600; }
.who-chip.on { background: var(--sc); color: #fff; } .who-chip.on b { color: #ffffffcc; }
.who-chip.clear { padding: 3px 10px; border-color: var(--line); background: transparent; }
#messages.who-focus .msg.out:not(.who-match), #messages.who-focus .who-label:not(.who-match), #messages.who-focus .msg.in, #messages.who-focus .who-div { opacity: .28; }
@media (max-width: 760px) {
  .who-label { font-size: 11px; margin-top: 6px; } .who-label i { width: 16px; height: 16px; flex-basis: 16px; font-size: 8px; }
  .who-div { font-size: 11px; } .who-bar { padding: 5px 8px; overflow-x: auto; flex-wrap: nowrap; }
}
@media (prefers-color-scheme: dark) { .who-div span { background: #242526; } }