Hooks must follow two fundamental rules:

1. Only call Hooks at the top level

   • Do not call Hooks inside loops, conditions, or nested functions.
   • Always use them at the top level of your React function.

2. Only call Hooks from React functions

   • You can call Hooks from:
     • React function components
     • Custom Hooks
   • Don't call Hooks from regular JavaScript functions or outside of components.

Following these rules ensures that React can track Hook calls correctly between renders.

---