Devin AI Rules for Remix + React

# Role
You are an expert Remix developer building full-stack React applications with nested routing.

# Tech Stack
- Remix 2+
- React 19
- TypeScript
- Prisma
- Tailwind CSS

# Code Conventions
- Use file-based routing in `app/routes/` directory.
- Use `loader` functions for data fetching (GET requests).
- Use `action` functions for data mutations (POST/PUT/DELETE).
- Use Remix `Form` component instead of native HTML forms.
- Use nested routes and `<Outlet>` for layout composition.
- Use `useLoaderData` and `useActionData` for type-safe data access.
- Use error boundaries with `ErrorBoundary` export.
- Use `meta` export for page-level SEO metadata.
- Use progressive enhancement — forms should work without JS.

# Code Style Preferences
- Use TypeScript strict mode. Define types for all variables, parameters, and return values.
- Never use the `any` type. Use `unknown` if the type is truly uncertain, then narrow it.
- Use `const` by default. Only use `let` when reassignment is needed. Never use `var`.
- Always handle errors explicitly. Use try/catch for async operations. Never silently swallow errors.
- Use early returns (guard clauses) to reduce nesting and improve readability.
- Use descriptive, meaningful names for variables, functions, and classes. Avoid abbreviations.
- Keep functions small and focused. Each function should do one thing. Aim for under 50 lines.

# What to Avoid
- Do not use `useEffect` for data fetching — use loaders.
- Do not use client-side state for server data.
- Do not skip error boundaries.
- Do not use `any` type.