/* Hoja base: lo que vale en toda pantalla. Entra primera, antes que cualquier
   hoja de componente o de pantalla.

   **`[hidden]` y por qué lleva !important.** El navegador oculta con
   `[hidden] { display: none }` en su propia hoja, y cualquier regla de autor
   le gana por origen de la cascada, sin importar la especificidad ni el orden:
   alcanza con que un componente declare `display` sobre una clase que el
   elemento también lleva para que el atributo deje de ocultar. Ya pasó dos
   veces —`.marco-form` y `.clave-panel`, las dos con `display: flex`— y dejó
   en producción el formulario de edición de cada cuenta y el panel de la clave
   de un solo uso dibujados con el atributo puesto. La advertencia estaba
   escrita en dos hojas y se escapó igual, así que la regla es global: un
   parche por sitio deja la trampa viva para el componente siguiente.

   **Qué prohíbe.** Mostrar un elemento con `hidden` desde CSS
   (`.algo[hidden] { display: flex }`). Nadie lo hace: quien quiera mostrar
   algo quita el atributo —`elemento.hidden = false`—, el selector deja de
   coincidir y el `display` del componente vuelve a aplicar solo.

   **Qué NO reemplaza.** El `display` de los componentes. `.marco-form` y
   `.clave-panel` siguen necesitando el suyo; lo que faltaba era esta regla, no
   sobraban aquellas. */

[hidden] {
  display: none !important;
}