<script lang="ts">
  let { size = 200 }: { size?: number } = $props();
</script>

<svg width={size} height={size * 0.6} viewBox="0 0 200 120" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
  <g fill="none" stroke-width="14" stroke-linecap="round">
    <path d="M20 110 A80 80 0 0 1 180 110" stroke="var(--c-rainbow-1)" />
    <path d="M34 110 A66 66 0 0 1 166 110" stroke="var(--c-rainbow-2)" />
    <path d="M48 110 A52 52 0 0 1 152 110" stroke="var(--c-rainbow-3)" />
    <path d="M62 110 A38 38 0 0 1 138 110" stroke="var(--c-rainbow-4)" />
    <path d="M76 110 A24 24 0 0 1 124 110" stroke="var(--c-rainbow-5)" />
    <path d="M90 110 A10 10 0 0 1 110 110" stroke="var(--c-rainbow-6)" />
  </g>
</svg>
