ui_perfection

• Typography: Use defined font stacks (Inter/Roboto). No default Times New Roman.
• Spacing: Use standard Tailwind spacing (e.g. p-4, m-6). Avoid magic numbers.
• Colors: Use the project's color palette (e.g. bg-primary-500). Avoid raw hex codes unless absolutely necessary for specific branding.
• Interaction:

- All interactive elements must have :hover and :active states.

- Transitions should be smooth (transition-all duration-200).

• Mobile-First: Design for mobile base styles first, then add md:, lg: modifiers.
• Touch Targets: Buttons must be at least 44x44px usable area.
• No Overflow: Check for horizontal scrollbars on mobile.

• Alt Text: Images must have alt attributes.
• Contrast: Text color must pass WCAG AA contrast ratio against background.
• Forms: Inputs must have associated labels (visible or aria-label).
• Keyboard: All interactive elements must be reachable via Tab.

• [ ] Is it responsive on mobile (320px+)?
• [ ] Are hover states present?
• [ ] Are transitions smooth?
• [ ] Do images have alt text?
• [ ] Does it look "Premium"? (Subjective check - ask yourself: "Would Apple/Linear ship this?")