/* Synthetic Hearts — hard alignment fix.
   Character stays left, user always hugs the right edge of the central chat column. */
@media (min-width:761px){
  .chat-messages .message-row{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:none !important;
    display:flex !important;
    flex-wrap:wrap !important;
  }

  .chat-messages .message-row.from-character{
    justify-content:flex-start !important;
  }

  .chat-messages .message-row.from-user{
    justify-content:flex-end !important;
  }

  .chat-messages .message-row.from-character > div:not(.message-avatar){
    margin-left:0 !important;
    margin-right:auto !important;
    max-width:50% !important;
  }

  .chat-messages .message-row.from-user > div:not(.message-avatar){
    margin-left:auto !important;
    margin-right:0 !important;
    max-width:50% !important;
  }

  .chat-messages .message-row.from-user .message-bubble{
    margin-left:auto !important;
    margin-right:0 !important;
  }

  .chat-messages .message-row.from-user time{
    margin-left:auto !important;
    margin-right:0 !important;
    text-align:right !important;
  }

  .chat-messages .message-row.from-character .message-bubble,
  .chat-messages .message-row.from-character time{
    margin-left:0 !important;
    margin-right:auto !important;
    text-align:left !important;
  }
}