Как сделать, чтоб фон popup'a был зафиксирован, но сам пуп мог скроллиться?

height: 300px; //какую-то высоту меньшую, чем контент в нем
overflow: scroll; //разрешаем скрол

<div class="modal-wrapper">
    <div class="modal">content</div>
  </div>

.modal-wrapper {
    position: fixed;
    z-index: 99999;
    top: 0; left: 0; right: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
    background-color: rgba(0, 0, 0, .5);
  }
  .modal {
    width: 500px;
    max-width: 100vw;
    background-color: #fff;
  }