Проблемы с анимацией движения по звезды по элипсу CSS SVG
<div>
<svg width="793" height="345" viewBox="0 0 793 345" fill="none" xmlns="http://www.w3.org/2000/svg">
<path id="traceA" d="M758.065 67.4708C759.114 71.0877 758.144 75.5149 754.661 80.8457C751.188 86.1611 745.389 92.0946 737.374 98.5264C721.358 111.378 696.878 125.916 665.702 141.221C603.379 171.816 514.653 205.31 414.305 234.423C313.957 263.536 221.082 282.729 152.062 290.239C117.535 293.996 89.0765 294.817 68.6688 292.533C58.4558 291.389 50.3822 289.48 44.6036 286.849C38.8084 284.21 35.619 280.99 34.5696 277.373C33.5203 273.756 34.491 269.329 37.9741 263.998C41.4471 258.683 47.2454 252.749 55.2608 246.317C71.2769 233.465 95.7568 218.928 126.933 203.623C189.255 173.027 277.981 139.534 378.329 110.421C478.677 81.3073 571.552 62.1143 640.573 54.6047C675.099 50.8481 703.558 50.0265 723.966 52.3111C734.179 53.4544 742.252 55.3634 748.031 57.9947C753.826 60.6337 757.016 63.8539 758.065 67.4708Z" stroke="#EE9A4D" stroke-width="4"/>
<g>
<path d="M600.386 155.208L599.423 160.016C598.149 166.374 601.755 172.698 607.875 174.84L612.504 176.46L607.696 175.496C601.338 174.223 595.014 177.829 592.872 183.949L591.252 188.577L592.215 183.769C593.489 177.411 589.883 171.087 583.763 168.945L579.134 167.326L583.942 168.289C590.3 169.562 596.624 165.956 598.766 159.836L600.386 155.208Z" fill="#EE9A4D"/>
<animateMotion begin="0s" dur="14s" rotate="auto" repeatCount="indefinite" additive="sum">
<mpath xlinkHref={'#traceA'}/>
</animateMotion>
</g>
</svg>
</div>
При запуске звездочка ведет себя совершенно хаотично, в чем может быть проблема?