/* The same compact account layout works for email and every social provider. */
.auth-page[data-auth-mode="register"] .auth-page__main { padding-block: var(--space-2) var(--space-6); }
.auth-page[data-auth-mode="register"] .auth-card { padding: var(--space-4); }
.auth-page[data-auth-mode="register"] .auth-page__back { margin-bottom: var(--space-2); }
.auth-page[data-auth-mode="register"] .auth-form { gap: var(--space-2); margin-top: var(--space-4); }
.auth-page[data-auth-mode="register"] .auth-form__grid { gap: var(--space-2); }
.auth-page[data-auth-mode="register"] .auth-page__switch { margin-top: var(--space-2); }
@media (min-width: 641px) {
  .auth-page[data-auth-mode="login"] .auth-page__main { padding-block: var(--space-4); }
  .auth-page[data-auth-mode="login"] .auth-card { padding: var(--space-6); }
  .auth-page[data-auth-mode="login"] .auth-page__back { margin-bottom: var(--space-4); }
  .auth-page[data-auth-mode="login"] .auth-card h1 { font-size: clamp(2rem, 4vw, 3.25rem); }
  .auth-page[data-auth-mode="login"] .auth-form { margin-top: var(--space-5); }
  .auth-page[data-auth-mode="login"] .auth-page__switch { margin-top: var(--space-4); }
  .auth-page[data-auth-mode="register"] .auth-card { padding: var(--space-6); }
  .auth-page[data-auth-mode="register"] .auth-page__main { padding-block: var(--space-4); }
  .auth-page[data-auth-mode="register"] .auth-card h1 { font-size: clamp(2rem, 5vw, 3.25rem); }
}

.auth-page [hidden], #authReferralOther[hidden] { display: none !important; }

.auth-page .oauth-stack { margin-block: 1.25rem .75rem; gap: 1rem; }
.oauth-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .5rem; }
.auth-page .oauth-button { display: grid; justify-items: center; align-content: center; gap: .2rem; min-width: 0; min-height: 94px; padding: .65rem .25rem; border: 1px solid #dbe3ee; border-radius: 14px; background: #fff; color: #182944; text-align: center; text-decoration: none; line-height: 1.35; transition: background-color .15s, border-color .15s; }
.oauth-button[aria-disabled="false"] { cursor: pointer; }
.oauth-button[aria-disabled="false"]:hover { border-color: #7c9eca; background: #f5f8ff; }
.oauth-button[aria-disabled="false"]:focus-visible { outline: 3px solid #3168c5; outline-offset: 3px; }
.oauth-button[aria-disabled="true"] { cursor: default; background: #f8fafd; border-color: #e6ebf2; }
.oauth-button[aria-disabled="true"] .oauth-mark { opacity: .65; }
.oauth-mark { display: flex; width: 25px; height: 25px; align-items: center; justify-content: center; }
.oauth-mark svg { width: 23px; height: 23px; }
.oauth-mark__facebook { width: 23px; height: 23px; border-radius: 50%; background: #1877f2; color: #fff; font: 800 25px/29px Arial, sans-serif; overflow: hidden; }
.oauth-mark__naver { color: #03a85a; font: 900 23px/1 Arial, sans-serif; }
.oauth-name { font-size: .8rem; font-weight: 750; max-width: 100%; }
.oauth-state { max-width: 100%; color: #617089; font-size: .67rem; overflow-wrap: anywhere; }
.oauth-button[data-state="ready"] .oauth-state { color: #2855a0; }
.auth-referral { display: grid; gap: .65rem; margin-top: 1.15rem; padding-top: 1rem; border-top: 1px solid #e6ebf2; }
.auth-referral .field { gap: .4rem; }
.auth-referral label { font-size: .85rem; }
.auth-referral select { width: 100%; min-width: 0; }
.auth-referral .password-hint { font-size: .75rem; line-height: 1.5; }
.auth-page .auth-divider { font-size: .8rem; text-align: center; }
.auth-page[data-auth-mode] .auth-form { margin-top: 1rem; }
.auth-completion-back { display: inline-flex; margin-top: 1.25rem; }

@media (max-width: 480px) {
  .oauth-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .auth-page .oauth-button { min-height: 84px; padding-inline: .15rem; }
  .oauth-name { font-size: .75rem; }
  .oauth-state { font-size: .625rem; }
  .auth-page .auth-card { min-width: 0; }
  .auth-page .auth-page__lead { font-size: .98rem; }
}