/* Matching, icon-only login buttons with visible rounded square frames. */
.login-dialog-card .social-login-grid {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
}
.social-login-button.qq,
.social-login-button.wechat {
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 60px;
  width:60px;
  height:60px;
  min-height:60px;
  padding:5px;
  margin:0;
  border:1px solid #c5d0d5;
  border-radius:16px;
  background:#fff;
  box-shadow:0 2px 5px rgb(28 57 76 / 9%);
  cursor:pointer;
  transition:transform 150ms ease,background-color 150ms ease,border-color 150ms ease,box-shadow 150ms ease;
  -webkit-tap-highlight-color:transparent;
}
/* Display the exact supplied icon as a sprite; source PNG bytes are unchanged. */
.social-login-button.qq > .qq-login-icon,
.social-login-button.wechat > .wechat-login-icon {
  position:relative;
  display:block;
  flex:0 0 48px;
  width:48px;
  height:48px;
  overflow:hidden;
  border-radius:26.5%;
  background:#fff;
  box-shadow:none;
  pointer-events:none;
}
.social-login-button.qq .qq-login-image {
  position:absolute;
  display:block;
  width:142.85714286%;
  height:159.18367347%;
  max-width:none;
  left:-24.48979592%;
  top:-26.53061224%;
  border-radius:0;
  pointer-events:none;
}
.social-login-button.wechat .wechat-login-image {
  position:absolute;
  display:block;
  width:125%;
  height:125%;
  max-width:none;
  left:-12.5%;
  top:-12.5%;
  border-radius:0;
  pointer-events:none;
}
@media (hover:hover) {
  .social-login-button.qq:hover,
  .social-login-button.wechat:hover {
    background:#f0f5f8;
    border-color:#91a8b4;
    box-shadow:0 4px 12px rgb(28 57 76 / 13%);
    transform:translateY(-2px);
  }
}
.social-login-button.qq:active,
.social-login-button.wechat:active { background:#e7eef3; transform:scale(.96); }
.social-login-button.qq:focus-visible,
.social-login-button.wechat:focus-visible { outline:2px solid #167bb9; outline-offset:3px; }
@media (prefers-reduced-motion:reduce) {
  .social-login-button.qq,.social-login-button.wechat { transition:none; }
  .social-login-button.qq:hover,.social-login-button.qq:active,
  .social-login-button.wechat:hover,.social-login-button.wechat:active { transform:none; }
}