.ring {
  position: relative;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.ring svg {
  position: absolute;
  inset: 0;
}

.ring-fill {
  transition: stroke-dashoffset 1.1s cubic-bezier(0.22, 1, 0.36, 1),
              stroke 0.3s ease;
}

.ring-center {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  text-align: center;
}