Как сделать эффект наведения с псевдоэлементом в виде неровного полукруга?

li:after {
content: '';
display: block;
position: relative;
transform: translateY(70%);
background-color: #fff;
z-index: 99;
width: 76px;
height: 23px;
border-radius: 50% 50% 0 0 / 100% 100% 0 0;
box-shadow: -9px 0px 6px rgba(64, 100, 108, 0.41);}

Нужно сделать так, чтобы при наведении появлялся такой элемент, как на дизайне. Полукруг сделать получилось, но как вытянуть края этого полукруга?