如何使用css重新创建tex的上下括号

<span class="tex-formula">(x + y)</span>

.tex-formula {
  position: relative;
}

.tex-formula::before {
  content: "";
  position: absolute;
  top: -0.5em;
  left: -0.2em;
  width: 0.4em;
  height: 1em;
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-radius: 50% 50% 0 0;
}

.tex-formula::after {
  content: "";
  position: absolute;
  bottom: -0.5em;
  left: -0.2em;
  width: 0.4em;
  height: 1em;
  border-bottom: 1px solid black;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-radius: 0 0 50% 50%;
}