¿Cuáles son las desventajas de usar el ampersand (&) en los preprocesadores?

• Empeoramiento de la legibilidad en profundidades de anidamiento.
• Complejidad en la comprensión y depuración del código con múltiples contextos dentro de los selectores.
• Conflictos potenciales al refactorizar, si no está claro a qué selector padre pertenece el ampersand.
• & puede llevar a un exceso de estilos para un elemento, haciendo que el CSS sea menos eficiente.

Ejemplo:

.parent {
  // ...
  .child {
    // ...
    &--modifier { // Contexto .parent .child--modifier
      // ...
      &-nested { // Contexto .parent .child--modifier-nested - se vuelve menos claro
        color: red;
      }
    }
  }
}

En otro ejemplo, se puede ver cómo & puede ocultar el selector real:

.btn {
  // ...
  &-primary { // Corresponde a .btn-primary
    background-color: blue;
  }
}

Al refactorizar, si se cambia el nombre de .btn, se debe recordar cambiar -primary. Usar una clase separada .btn-primary puede ser más claro y resistente a cambios.