RAX7

при ресайзе придется все пересчитывать

Открой девтулзы и скопируй весь css который применяется к нужным тебе элементам

.block {
   width: 250px;
   height: 400px;
   background: yellow;
   display: flex;
   flex-direction: column;
   padding-bottom: 100px;
 }

 .t_block {
   width: 100%;
   min-height: 50px;
   background: #1E90FF;
 }

 .back {
   width: 100%;
   flex: 1;
   background: #a6e22a;
   overflow-y: scroll;
 }

Как адаптивно сверстать блок с вырезом-полукругом? SVG-маска?

Наверное только так:

Держи, вроде похоже получилось

Делаешь канвас поверх всей страницы, считаешь координаты нужного элемента и рисуешь линию на этом канвасе до координат курсора.

Вариант без backdrop-filter

В ms edge не работает сочетание свойств transition и min-height: calc()

https://css-tricks.com/cascading-svg-fill-color/

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" display="none">
  <symbol id="menu-white" viewBox="0 0 42 42">
    <circle cx="20" cy="20" r="19" stroke="white" stroke-width="2"/>
    <circle cx="19.5" cy="10.5" r="2.5" fill="currentColor"/>
    <circle cx="19.5" cy="19.5" r="2.5" fill="currentColor"/>
    <circle cx="19.5" cy="28.5" r="2.5" fill="currentColor"/>
  </symbol>
</svg>

<svg class="ico" width="42" height="42"><use xlink:href="#menu-white"/></svg>

$color-white: #fff;

.ico {
  color: $color-white;
}