Donut share

Draw the share of each item as a donut chart. Slices fill one after another clockwise from twelve o'clock, and the total in the middle counts up from 0. Put a legend with colour, name and percentage on the right, and when it finishes the largest slice pops out slightly. The total is [total and unit].

[paste your table here]

The first row is the header. Put CSS and JavaScript in a single HTML file and draw with canvas or SVG, without external libraries. Dark background, crisp numbers and text, and no overlapping text even at phone width. If prefers-reduced-motion is on, show the finished chart without motion.

항목별 비율을 도넛 차트로 그려 주세요. 조각은 12시 방향부터 시계 방향으로 차례로 차고, 가운데 합계는 0부터 올라가요. 오른쪽에 색, 이름, 퍼센트 범례를 두고, 가장 큰 조각은 다 그려지면 바깥으로 살짝 튀어나와요. 합계는 [합계와 단위]예요.

[여기에 표 붙여넣기]

첫 줄은 머리글이에요. HTML 파일 하나에 CSS와 JavaScript를 넣고, 외부 라이브러리 없이 canvas나 SVG로 그려 주세요. 어두운 배경에 숫자와 글자는 또렷하게, 휴대폰 폭에서도 글자가 겹치지 않게 해 주세요. prefers-reduced-motion이 켜져 있으면 움직임 없이 다 그려진 차트를 보여 주세요.