Почему развалился сайт после обновления хрома до 89 версии?
В общем, поигравшись немного с предоставленным кодом, стало понятно следующее:

Это явно проблема браузера, так что имеет смысл сообщить о ней разработчикам, написав bug report в их трекер.

При этом проблема несколько не в том месте где ожидалось: элементы страницы позиционируются правильно, а вот отрисовываются некорректно:



Здесь видно, что картинка с точки зрения браузера находится в одном месте, а по факту нарисована в другом.

Но именно это позволяет довольно просто найти дешёвый вариант обхода проблемы, без необходимости менять код. Ведь поскольку проблема связана с некорректной отрисовкой - достаточно просто заставить браузер перерисовать соответствующую область, а для этого, в свою очередь, достаточно заставить его поверить что это нужно сделать.

Я подготовил пример, демонстрирующий вариант решения. По сути он сводится к добавлению стиля, который производит визуально почти незаметное изменение стилей, которое, однако, заставляет браузер перерисовать всю область:
.chat-item__content.force-repaint .content-chat-content__message {
    opacity: 0.99;
}
Остаётся только "дёрнуть" CSS класс force-repaint на элементе контейнера - и всё сразу встаёт на место, поскольку осуществляется перерисовка. Например вот так:

function forceRepaintToFixChrome89Issue() {
    if (!navigator.appVersion.match(/\sChrome\/(89|9\d)\./)) {
        // Apply only for Chrome 89 and 90+
        return;
    }
    window.requestAnimationFrame(function () {
        const e = document.querySelector('.chat-item__content');
        if (!e) {
            return;
        }
        const fr = 'force-repaint';
        e.classList.add(fr);
        window.requestAnimationFrame(function () {
            e.classList.remove(fr);
        });
    });
}

В примере я добавил для этого кнопку, но в реальном приложении логично делать это, например, при изменении содержимого контейнера.
Эти свойства делают блок флекбоксом (display: flex;), содержимое внутри идёт от последнего ребёнка к первому, по поперечной оси  (flex-direction: column-reverse;)
Всё остальное - вендорные префиксы для кроссбраузерности. 

Какому блоку в разметке принадлежат эти свойства? Почему решили, что проблема именно в них?