---
description: Focuses on rules and best practices for mobile-first design and responsive typography using tailwind.
globs: **/*.{tsx,jsx}
---
- Always design and implement for mobile screens first, then scale up to larger screens.
- Use Tailwind's responsive prefixes (sm:, md:, lg:, xl:) to adjust layouts for different screen sizes.
- Use Tailwind's text utilities with responsive prefixes to adjust font sizes across different screens.
- Consider using a fluid typography system for seamless scaling.