Отрисовка прогрессбара на мобильных устройствах (stroke-dashoffset)

//progress-bar
function progressBar(percent) {
  $progress = $('.svg-progress__circle_load');
  $radius = $progress.attr('r');
  $circumference = 2 * Math.PI * $radius;

  $offset = $circumference - percent / 100 * $circumference;
  $progress.css('stroke-dashoffset', $offset)
  percent === 100 ? $progress.css('stroke-linecap', 'square') : false;

  $('.progress-bar__count').text(percent);
  $progress.css('stroke-dashoffset', `${$offset}`);
}
let percent = parseInt($('.progress-bar__percent[data-progress]').attr('data-progress'));
progressBar(percent);

.progress-bar {
  display: flex;
  justify-content: center;
}

.progress-bar {
  position: relative;
  margin-top: 20px;
}

.progress-bar__percent {
  color: #303030;
  font-weight: 500;
  font-size: 36px;
  line-height: 43px;
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.progress-bar .svg-progress__circle_stat {
  stroke: #eee;
  fill: transparent;
  stroke-width: 15;
}

.progress-bar .svg-progress__circle_load {
  stroke: url(#load-gradient);
  fill-opacity: 0;
  stroke-width: 15;
  stroke-dasharray: 404;
  stroke-linecap: round;
  transform-origin: center;
  transform: rotate(-90deg);
  animation: stroke 1.3s forwards;
}

@keyframes stroke {
  0% {
    stroke-dashoffset: 404;
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div class="time-personal__progress-bar progress-bar__personal progress-bar">
  <!-- <img src="./assets/images/personal/progress.png" alt="progress" class="time-personal__progress"> -->
  <span class="progress-bar__percent" data-progress="80"><span class="progress-bar__count">80</span>%</span>
  <svg class="progress-bar__svg svg-progress" xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
    <defs>
      <linearGradient id="load-gradient">
        <stop offset="11.75%" stop-color="#FFD56A" />
        <stop offset="90.12%" stop-color="#FF9900" />
      </linearGradient>
    </defs>
    <circle class="svg-progress__circle_stat" cx="50%" cy="50%" r="65" fill="url('#load-gradient')" />
    <circle class="svg-progress__circle_load" cx="50%" cy="50%" r="65" />
  </svg>
</div>