Vertically aligning div inside an inline-block

Question

So I have two elements in my page: center and neighbor.

center is centered horizontally in my page, with neighbor sitting to the left of it.

center is a div that can contain elements of an arbitrary height that I can't personally control. neighbor is a div that can contain one or more <a> elements (also not something that I can change) that I need to display horizontally as a row.

Here's my code so far:

.page {
  text-align: center;
}

.wrapper {
  font-size: 32px;
  display: inline-block;
  position: relative;
}

.neighbor {
  position: absolute;
  right: 100%;
  top: 0%;
  margin-right: 10px;
  display: flex;
}

<div class="page">
  <div class="wrapper">
    <div class="center">foo<br>bar<br>oof</div>
    <div class="neighbor">
      <a>first&nbsp;</a>
      <a>second</a>
    </div>
  </div>
</div>

Now, my problem is that I want to vertically center neighbor relative to center's height. I tried several aligning attributes such as align-items, vertical-align, justify-content, but none of them helped.

So, is there any way to align neighbor the way I wanted to?