/* Goc Nho layout: time follows text; receipts have their own bottom-right row. */
.message-receipt{display:inline-flex;align-items:center;justify-content:flex-end;gap:.25em;max-width:100%;vertical-align:middle;white-space:nowrap;line-height:inherit}
.message-receipt>svg{display:block;flex:0 0 .8rem;width:.8rem;height:.8rem;margin:0;vertical-align:initial}
.message-outbox-column{max-width:88%}
#dm-messages-list .dm-message-row{align-items:flex-end;margin-bottom:.75rem}
#dm-messages-list .dm-message-avatar{margin-top:0}
#dm-messages-list .dm-message-column{max-width:min(82%,34rem)}
#dm-messages-list .dm-message-row .dm-message-column .dm-message-content-wrap{margin-bottom:0}
#dm-messages-list .dm-message-row .dm-message-column .dm-message-bubble{box-sizing:border-box;width:fit-content;max-width:100%;padding:.5rem .65rem;border:1px solid var(--border-color);border-radius:6px 17px 17px 17px;box-shadow:none;font-size:1rem;font-weight:400;line-height:1.5}
#dm-messages-list .dm-message-row.is-me .dm-message-column .dm-message-bubble{min-width:min(9rem,100%);border-radius:17px 6px 17px 17px}
#dm-messages-list .dm-message-row .dm-message-column .dm-message-bubble.has-message-tools{min-width:6rem}
#dm-messages-list .dm-message-footer.is-inline,
.dm-quick-chat-messages .dm-message-footer.is-inline,
#stranger-messages-list .dm-message-footer.is-inline{display:contents;position:static;white-space:normal;color:inherit;font-size:.67rem;font-weight:400;line-height:1.45}
#dm-messages-list .dm-message-footer.is-inline .dm-message-time,
.dm-quick-chat-messages .dm-message-footer.is-inline .dm-message-time,
#stranger-messages-list .dm-message-time{display:inline;margin:0 0 0 .4rem;white-space:nowrap;font-size:.67rem;line-height:1.45;font-weight:400;color:inherit;opacity:1;vertical-align:baseline}
#dm-messages-list .dm-message-state,
.dm-quick-chat-messages .dm-message-state,
#stranger-messages-list .dm-message-state{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.3rem;min-width:0;min-height:1rem;margin-top:.2rem;color:inherit;white-space:normal;font-size:.67rem;line-height:1.45;font-weight:400}
#dm-messages-list .dm-message-footer.is-inline .dm-message-read,
.dm-quick-chat-messages .dm-message-read,
#stranger-messages-list .dm-message-read{display:inline-flex;align-items:center;max-width:100%;font-size:inherit;line-height:inherit;color:inherit;opacity:1;vertical-align:middle}
#dm-messages-list .dm-message-footer.is-inline .dm-message-delete-link{padding:0;font:inherit;line-height:inherit}
#dm-messages-list .dm-message-media-meta{margin-top:.2rem;line-height:1.45}
.dm-quick-chat-messages .dm-quick-message,
.dm-quick-chat-messages .message-outbox-row .dm-message-bubble{box-sizing:border-box;max-width:87%;padding:.5rem .65rem;border:1px solid var(--border-color);border-radius:6px 17px 17px 17px;box-shadow:none;font-size:.9375rem;font-weight:400;line-height:1.5}
.dm-quick-chat-messages .message-outbox-row .dm-message-column{max-width:87%}
.dm-quick-chat-messages .message-outbox-row .dm-message-bubble{max-width:100%}
.dm-quick-chat-messages .dm-quick-message.is-me,
.dm-quick-chat-messages .message-outbox-row .dm-message-bubble{min-width:min(9rem,100%);border-radius:17px 6px 17px 17px;background:var(--accent-gradient);color:var(--accent-on,#ffffff)}
.dm-quick-chat-messages .dm-quick-message>span{white-space:pre-wrap}
#dm-messages-list .dm-typing-row{align-items:center}
#dm-messages-list .dm-typing-row .dm-message-column .dm-typing-bubble,
.dm-quick-chat-messages .dm-typing-row .dm-typing-bubble{display:flex;align-items:center;justify-content:center;width:fit-content;min-width:3rem;min-height:2rem;padding:.35rem .65rem;border-radius:6px 17px 17px 17px;font-size:1.15rem;font-weight:800;line-height:1;letter-spacing:.12em}
.dm-quick-chat-messages .dm-typing-avatar{display:none}
.dm-quick-chat-messages .dm-typing-row .dm-message-column{max-width:87%}
#stranger-messages-list .dm-message-row .dm-message-bubble{padding:.5rem .65rem;border:1px solid var(--border-color);border-radius:6px 17px 17px 17px;box-shadow:none;font-weight:400;line-height:1.5}
#stranger-messages-list .dm-message-row.is-me .dm-message-bubble{min-width:min(9rem,100%);border-radius:17px 6px 17px 17px}

/* Portaled reaction picker: above the composer, within the visible chat. */
.dm-reaction-picker.dm-reaction-tray {
  position: fixed;
  inset: auto;
  z-index: 10000;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px;
  box-sizing: border-box;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 8px;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-surface);
  color: var(--text-main);
  box-shadow: 0 8px 28px rgb(0 0 0 / .22);
  transform: none;
}
.dm-reaction-picker.dm-reaction-tray .reaction-item-btn {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 6px;
  cursor: pointer;
  touch-action: manipulation;
}
.dm-reaction-picker.dm-reaction-tray .reaction-item-btn:focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: -2px;
  transform: none;
}
.dm-reaction-picker.dm-reaction-tray .dm-reaction-option-image {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
@media (prefers-reduced-motion: reduce) {
  .dm-reaction-picker.dm-reaction-tray .reaction-item-btn { transition: none; transform: none; }
}