Sign In for Web styling issues with Google Identity

Question

I have implemented the updated Google Sign In for Web into my website however, I am unable to style to be responsive of the browser size and screen its displayed on. I have the following code right now:

<div id="g_id_onload"
  data-client_id="CLIENT_ID"
  data-context="signup"
  data-ux_mode="redirect"
  data-login_uri="signup-with-google.php">
</div>
<div class="g_id_signin mb-6"
  data-type="standard"
  data-shape="pill"
  data-theme="outline"
  data-text="signup_with"
  data-size="large"
  data-logo_alignment="center"
  data-width="400">
</div>

Firstly, I have tried adjusting the data-width attribute and it works fine when my website is viewed on a monitor or laptop screen. However, on a mobile screen, the button goes out of the container. I am unable to make it responsive.

I have tried styling it using css as per the other components of my website, however, it seems that the styling is forced by google and I'm unable to change it.

Also, there's this weird forced layout bug that I'm having when I refresh the page. The signin button appears bigger and then shrinks down on every page reload.

Any help would be appreciated. Thank you very much.