CSS-прокрутка только на части веб-сайта – Flexbox, боковая панель ⇐ CSS

[Anonymous]

Работаем над CMS/редактором форматированного текста, а сейчас просто воссоздаем макет, который использует Wix.
На данный момент выглядит так: базовый макет и с развернутой боковой панелью следующим образом: Расширенная боковая панель
Модель Flexbox
Использование гибкости вместо абсолютного на боковой панели, так как я хочу, чтобы редактор сжимался при каждом расширении боковой панели.
Синий — это контейнер, красный и зеленый — дочерние элементы. Красное положение: закреплено, как и панель инструментов в зеленом контейнере.
Все работает, закрепленная панель инструментов внутри зеленого контейнера редактора остается там, где должна быть, но боковая панель в красном прокручивается. долой текст редактора:
При прокрутке
В гибкой модели это имеет смысл: когда зеленый цвет растет, растет и красный.
Желаемый результат
В идеале мне бы хотелось, чтобы полоса прокрутки была только в окне редактора, а любая прокрутка влияла бы только на нее (желтым цветом).
Я попробовал задать красная боковая панель с максимальной высотой (100vh - заголовок), которая работает, но ее легко сломать, например, всякий раз, когда горизонтальная полоса прокрутки появляется и исчезает.
Также попробовал старое переполнение: скрыто в теле и переполнение: авто в редакторе, но не смог снова запустить прокрутку, пока не удалил overflow: скрыто из тела.

Подробнее здесь: https://stackoverflow.com/questions/782 ... ox-sidebar