.wrapper {
  position: fixed;
  right: calc(50vw - 400px);
  bottom: 20px;
  z-index: 15;

  @media (width <= 850px) {
    right: 5vw;
  }

  & .menuButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    font-size: var(--font-md);
    color: var(--color-foreground);
    cursor: pointer;
    background-color: var(--color-neutral-100);
    border: 1px solid var(--color-neutral-300);
    border-radius: 50%;
    transition: 0.2s;

    &:hover {
      background-color: var(--color-neutral-200);
    }
  }

  & .menu {
    display: flex;
    flex-direction: column;
    row-gap: 4px;
    width: 240px;
    height: max-content;
    padding: 4px;
    overflow: auto;
    background-color: var(--color-neutral-100);
    border: 1px solid var(--color-neutral-300);
    border-radius: 4px;
  }
}