/* ── DM CARD ───────────────────────────── */
.dm-card {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 8px; border-radius: 4px;
  cursor: pointer;
  transition: background var(--transition);
}
.dm-card:hover  { background: var(--bg-hover); }
.dm-card.active { background: var(--bg-hover); }
.dm-avatar-wrap { position: relative; flex-shrink: 0; }
.dm-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--accent);
  display: block;
  object-fit: cover;
}
.dm-status {
  width: 10px; height: 10px;
  border-radius: 50%;
  border: 2px solid var(--bg-sidebar);
  position: absolute; right: -1px; bottom: -1px;
}
.dm-name { font-size: 0.88rem; color: var(--text-muted); }
.dm-card:hover .dm-name,
.dm-card.active .dm-name { color: var(--text); }