Text offset in y direction

[Huber1]

When i am using SvgPicture.file() for the following svg, it doesn't render the text in the correct location. Like you can see it is offset in y-direction

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Ebene_1" viewBox="0 0 1000 500" xml:space="preserve"><script xmlns=""/> 
<rect fill="#C79514" width="1000" height="500"/> 
<text text-anchor="middle" x="50%" y="50%" dy=".35em" font-family="Arial, sans-serif" font-weight="bold" font-size="425px" fill="#ffffff">21</text> 
<style xmlns="" class="darkreader darkreader--fallback">html, body, body :not(iframe) {
    background-color: #232425 !important;
    border-color: #777067 !important;
    color: #dddcd9 !important;
}</style></svg>

Location: https://www.mvv-muenchen.de/fileadmin/lines/02021.svg

The Text is not, as expected centered vertically and horizontally, but only centered horizontally

Is it a coincidence that the bottom line of the text is centered?

The Image is not cropped. I put it inside a Center on a blank screen to make sure it is completely visible