.social-auth-stage{width:100%;max-width:500px;margin:auto;display:grid;justify-items:center;gap:12px}
.social-auth-logo{display:block;width:50px;height:50px}
.social-auth-logo img{display:block;width:100%;height:100%}
.social-auth-card{width:100%;max-width:500px;margin:0}
.social-auth-actions{display:grid;grid-template-columns:1fr;gap:12px;margin:8px 0 16px}
.social-auth-button{position:relative;height:52px;padding:0 12px 0 42px;border:1px solid rgba(8,8,8,.11);border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.76);color:#111;font-size:15px;font-weight:800;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.06);transition:transform .18s,border-color .18s,box-shadow .18s,background .18s}
.social-auth-button:hover{transform:translateY(-1px);border-color:rgba(8,8,8,.3);background:#fff;box-shadow:0 14px 34px rgba(0,0,0,.1)}
.social-auth-button:focus-visible{outline:3px solid #17171726;outline-offset:3px}
.social-auth-button svg{position:absolute;left:16px;width:20px;height:20px}
.social-auth-card .auth-note{margin-top:24px}

.auth-divider {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 22px 0 18px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.auth-divider::before,
.auth-divider::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid var(--line);
}
.auth-divider:not(:empty)::before {
  margin-right: 1em;
}
.auth-divider:not(:empty)::after {
  margin-left: 1em;
}

@media(max-width:480px){
  .social-auth-actions{grid-template-columns:1fr}
  .social-auth-button{font-size:14px}
}