html - how to control svg viewBox by css

Question

in the example below I can control everything about svg using css - except the viewBox?
how to do this?
I tried .shadow viewBox{..} and remove the params from markup - doesn't work

.wrap{
background:gold;
width:70%;
height:54px;
position:relative;
}
.shadow{
    position:absolute;
    right:25px;
    bottom:5px;
    width:7%;
}

.shadow path{
    fill: red;
}

<div class='wrap'>
<svg class="shadow" viewBox="0 0 50 50">
<g>
<path d="M213.1,6.7c32.4-14.4-73.7,0-88.1,30.6C110.6,4.9,67.5-9.5,36.9,6.7C33.3,64.2,247.2,22.9,213.1,6.7z"/>
</g>
</svg>
</div>

question from:https://stackoverflow.com/questions/65910207/how-to-control-svg-viewbox-by-css

Answer 1

Waitting for answers