feat(design-system): define restrained radius and shape system

[dev-susa]

Summary

Implements DS-008: Define a restrained radius and shape system (#395)

Replaces the broken radius scale (which relied on an undefined --radius base variable) with explicit, absolute values that work correctly across all components.

Changes

• ✅ Defined explicit radius tokens: sm (4px), md (6px), lg (8px), xl (12px), and full
• ✅ Documented component-to-radius mapping for each token size
• ✅ Removed broken calc() expressions that relied on undefined --radius base
• ✅ All existing Tailwind utilities (rounded-sm, rounded-md, etc.) now resolve correctly
• ✅ No production components unintentionally forced to square corners

Component-to-Radius Mapping

• sm (4px): buttons, inputs, badges, tabs
• md (6px): dropdowns, selects, chips
• lg (8px): cards, panels, modals, popovers
• xl (12px): large cards, feature panels, section containers
• full: pills, avatar badges, status indicators (fully rounded)

Testing

• ✅ Skeleton component tests pass (verify radius tokens work correctly)
• ✅ Build succeeds without errors
• ✅ CSS tokens properly defined in Tailwind v4 @theme block

Acceptance Criteria

• The scale defines sm, md, lg, xl, and full
• Component-to-radius mapping is documented
• Existing Tailwind radius utilities resolve from the scale
• No production component is unintentionally forced to square corners

Closes #395

[vercel]

@dev-susa is attempting to deploy a commit to the Ijai's projects Team on Vercel.

A member of the Team first needs to authorize it.

[drips-wave]

@dev-susa Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits