/* Login and registration share one centered, scrollable canvas. */
html body .login.sgc-auth-mall-impact-v4,
html body .createNewCount.sgc-auth-mall-impact-v4 {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 480px !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  height: auto !important;
  margin-right: auto !important;
  margin-left: auto !important;
  overflow: visible !important;
}

html body .login.sgc-auth-mall-impact-v4 > .container,
html body .createNewCount.sgc-auth-mall-impact-v4 > .content {
  box-sizing: border-box !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Keep every registration field and both actions reachable in a short viewport. */
@media (max-height: 800px) {
  html body .login.sgc-auth-mall-impact-v4 > .sgc-auth-mall-brand,
  html body .createNewCount.sgc-auth-mall-impact-v4 > .sgc-auth-mall-brand {
    min-height: 204px;
    padding: calc(20px + env(safe-area-inset-top, 0px)) 24px 52px;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-logo-badge,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-logo-badge {
    width: 144px;
    height: 52px;
    margin-bottom: 14px;
    padding: 8px 12px;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-logo,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-logo {
    width: 120px;
    height: 36px;
    max-height: 36px;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-heading,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-heading {
    font-size: 29px;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-heading::after,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-heading::after {
    margin-top: 10px;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-shopping-art,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-shopping-art {
    right: 10px;
    bottom: 29px;
    transform: scale(.77);
    transform-origin: right bottom;
  }

  html body .login.sgc-auth-mall-impact-v4 > .container,
  html body .createNewCount.sgc-auth-mall-impact-v4 > .content {
    margin-top: -24px !important;
    padding: 20px 20px 22px !important;
  }

  html body .login.sgc-auth-mall-impact-v4 .signInfo > .phone,
  html body .login.sgc-auth-mall-impact-v4 .signInfo > .name {
    height: 50px !important;
    padding: 9px 14px !important;
    margin-bottom: 11px !important;
  }

  html body .createNewCount.sgc-auth-mall-impact-v4 > .content > .item {
    margin-bottom: 10px !important;
  }

  html body .createNewCount.sgc-auth-mall-impact-v4 > .content > .item > .u-input:not([aria-hidden="true"]) {
    height: 48px !important;
    padding: 9px 14px !important;
  }

  html body .login.sgc-auth-mall-impact-v4 .signBtn {
    margin-top: 20px !important;
  }

  html body .login.sgc-auth-mall-impact-v4 .signBtn .login-btn,
  html body .createNewCount.sgc-auth-mall-impact-v4 > .content > .btn1 {
    height: 46px !important;
    line-height: 46px !important;
  }

  html body .createNewCount.sgc-auth-mall-impact-v4 > .content > .btn1 {
    margin-top: 14px !important;
  }

  html body .login.sgc-auth-mall-impact-v4 .signBtn .register-link,
  html body .createNewCount.sgc-auth-mall-impact-v4 > .content > .btn2 {
    height: 44px !important;
    line-height: 42px !important;
    margin-top: 12px !important;
  }
}

@media (max-width: 360px) {
  html body .login.sgc-auth-mall-impact-v4 > .container,
  html body .createNewCount.sgc-auth-mall-impact-v4 > .content {
    width: calc(100% - 20px) !important;
  }

  html body .login.sgc-auth-mall-impact-v4 .sgc-auth-mall-shopping-art,
  html body .createNewCount.sgc-auth-mall-impact-v4 .sgc-auth-mall-shopping-art {
    transform: scale(.7);
  }
}

/* Auth-only canvas: keep both cards aligned when registration scrolls. */
body.uni-body:is(.pages-login-login, .pages-register-register) {
  height: auto !important;
}
@media (min-width: 481px) {
  html:has(> body.uni-body:is(.pages-login-login, .pages-register-register)) {
    scrollbar-gutter: stable both-edges;
  }
}
@media (max-width: 480px) {
  html:has(> body.uni-body:is(.pages-login-login, .pages-register-register)) {
    scrollbar-width: none;
  }
  html:has(> body.uni-body:is(.pages-login-login, .pages-register-register))::-webkit-scrollbar {
    display: none;
  }
}
