The text inside the circle from ProgressBar.js won't center correctly inside my CSS Grid cell

Question

Full working code here.

https://codepen.io/chen-luke/pen/gOweWKE

My CSS grid is made up of two columns

    .grid-template-areas:
        "n