MyFitnessPal - Sign In Screen Exploration + Grid System & Sizes

In this exploration, I was trying to enhance the UI of the Sign In Modal for MyFitnessPal web app, and convince the returning user to sign back in and start using the app again.

Let me walk you through my thought process.

Problem:
The UI of the Sign In Modal looked outdated. This can repulse the potential return user from using the app since it gives that abandoned website vibe.

Solution:
The first thing I did was to remove the Sign In with Facebook option. I've replaced it with an option to use Google instead since most of the target audience is using Google and less Facebook nowadays.

The next thing I've noticed was the lack of negative space. To fix this first, I had to get rid of the border. I've kept the white background but used a soft shadow effect to define the borders.

The overall hierarchy of the elements was a bit off to me so I changed the spacing between the input fields, and used different font sizes and weights to establish some order. Input fields & buttons were not the same lengths and that needed to be fixed so we can achieve that boxed-in look that's always more appealing.

I've replaced the button color with a branding color to attract the user's attention better. Also, I've used a solid color rather than gradients that always risk looking too flashy.

The password field now has an option to show & hide your type, which is always convenient for the user.

I've added a toggle option between Sign In and Sign Up so it's easy to switch between the two modals without a need to load a different page.

Overall branding is now more prominent than before. This should help the user to create a better bond with the brand and create trust in the long run.

Did I miss anything?
What would you do differently?

I've included the Grid System & Sizes as well. Please check the attachments. Hopefully, it will be helpful to someone in the future.