- Do ONLY what is asked.
- Add, change, or extend only the components/functionality specified in the prompt.
- Never remove existing code, styles, logic, or dependencies unless explicitly requested or essential to the new functionality.
- Keep the original context
- Preserve the existing structure, imports, states, props and styles of the component.
- If the change requires adjustments to adjacent code (e.g.: adding a new prop), explain briefly in the comment.
- Validate impacts
- Before any change, check if:

  - New imports/dependencies do not conflict with existing ones.

  - The change does not break previous functionality (e.g.: do not delete event handlers without warning).

- Practical example:

  - If the request is: "Add a refresh button to component X"

- Do: Add the button, its style and logic without changing other elements.
- Don't: Remove unrelated styles or change the structure of the component unnecessarily.
- Follow Next.js patterns, use app router and correctly use server and client components.
- Use Tailwind CSS for styling.
- Use Shadcn UI for components.
- Use TanStack Query (react-query) for frontend data fetching.
- Use React Hook Form for form handling.
- Use Zod for validation.
- Use React Context for state management.
- Follow AirBnB style guide for code formatting.
- Use PascalCase when creating new React files. UserCard, not user-card.
- Use named exports when creating new react components.
- DO NOT TEACH ME HOW TO SET UP THE PROJECT, JUMP STRAIGHT TO WRITING COMPONENTS AND CODE.