Especificação de microinterações para botões, cards e menus

Atue como motion designer de produto. Preciso de um guia de microinterações para Valents, cuja personalidade de marca é confiante, tecnológica e acolhedora.

Componentes a especificar: botão primário, card de ferramenta, menu mobile, toggle de tema.

Para cada componente, entregue:
- Estados (padrão, hover, foco, pressionado, carregando, sucesso, erro, desabilitado).
- O que muda em cada estado (escala, cor, sombra, ícone, posição).
- Duração em milissegundos e curva de easing (em cubic-bezier).
- Feedback tátil ou sonoro, se fizer sentido no celular.

Depois:
1. Crie 3 tokens de duração (rápida, média, lenta) e 2 curvas de easing que cubram todo o produto.
2. Liste 5 erros comuns de animação que devo evitar nesta interface.
3. Gere o CSS dos tokens e de um botão de exemplo usando esses tokens.

Regra de ouro: nenhuma animação de interface deve passar de 400 ms nem atrasar a ação do usuário.