React Review Audit

Fix the following React Review diagnostics in my codebase.

## Warnings (36)

1. [warning] design-no-default-tailwind-palette — src/components/ImagePreview.tsx:21
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

2. [warning] design-no-default-tailwind-palette — src/components/ImagePreview.tsx:26
   bg-gray-100 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

3. [warning] design-no-redundant-size-axes — src/components/ImagePreview.tsx:33
   w-5 h-5 → use the shorthand size-5 (Tailwind v3.4+)

4. [warning] design-no-space-on-flex-children — src/components/LoadingSpinner.tsx:6
   space-y-3 on a flex/grid parent — use gap-y-3 instead. Per-sibling margins phantom-gap on conditional render and don't mirror in RTL

5. [warning] design-no-redundant-size-axes — src/components/LoadingSpinner.tsx:7
   w-10 h-10 → use the shorthand size-10 (Tailwind v3.4+)

6. [warning] design-no-default-tailwind-palette — src/components/LoadingSpinner.tsx:7
   border-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

7. [warning] design-no-default-tailwind-palette — src/components/LoadingSpinner.tsx:8
   text-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

8. [warning] design-no-three-period-ellipsis — src/components/LoadingSpinner.tsx:8
   Three-period ellipsis ("...") in JSX text — use the actual ellipsis character "…" (or `…`)

9. [warning] design-no-space-on-flex-children — src/components/ErrorDisplay.tsx:11
   space-y-3 on a flex/grid parent — use gap-y-3 instead. Per-sibling margins phantom-gap on conditional render and don't mirror in RTL

10. [warning] design-no-redundant-size-axes — src/components/ErrorDisplay.tsx:12
   w-10 h-10 → use the shorthand size-10 (Tailwind v3.4+)

11. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:64
   from-indigo-100 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

12. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:64
   via-indigo-50 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

13. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:64
   to-indigo-100 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

14. [warning] design-no-bold-heading — src/components/ImageUpload.tsx:67
   font-bold on <h1> crushes counter shapes at display sizes — use font-semibold (600) or font-medium (500)

15. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:67
   text-indigo-800 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

16. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:73
   border-indigo-300 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

17. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:73
   border-indigo-500 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

18. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:79
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

19. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:79
   ring-indigo-500 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

20. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:84
   bg-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

21. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:84
   bg-indigo-700 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

22. [warning] design-no-redundant-size-axes — src/components/ImageUpload.tsx:93
   w-12 h-12 → use the shorthand size-12 (Tailwind v3.4+)

23. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:93
   border-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

24. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:94
   text-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

25. [warning] design-no-three-period-ellipsis — src/components/ImageUpload.tsx:94
   Three-period ellipsis ("...") in JSX text — use the actual ellipsis character "…" (or `&hellip;`)

26. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:108
   bg-indigo-50 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

27. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:108
   border-indigo-200 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

28. [warning] design-no-bold-heading — src/components/ImageUpload.tsx:109
   font-bold on <h2> crushes counter shapes at display sizes — use font-semibold (600) or font-medium (500)

29. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:109
   text-indigo-800 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

30. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:112
   text-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

31. [warning] design-no-default-tailwind-palette — src/components/ImageUpload.tsx:119
   text-indigo-700 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

32. [warning] design-no-space-on-flex-children — src/components/DropZone.tsx:30
   space-y-6 on a flex/grid parent — use gap-y-6 instead. Per-sibling margins phantom-gap on conditional render and don't mirror in RTL

33. [warning] design-no-default-tailwind-palette — src/components/DropZone.tsx:37
   text-gray-700 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

34. [warning] design-no-default-tailwind-palette — src/components/DropZone.tsx:40
   text-gray-500 reads as the Tailwind template default — use zinc (true neutral), neutral (warmer), or stone (warmest)

35. [warning] design-no-default-tailwind-palette — src/components/DropZone.tsx:53
   bg-indigo-600 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone

36. [warning] design-no-default-tailwind-palette — src/components/DropZone.tsx:53
   bg-indigo-700 reads as the Tailwind template default — use your project's brand color or zinc/neutral/stone