.account-login-page { min-height: 100vh; display: flex; flex-direction: column; }
.account-login { width: 100%; max-width: 1200px; flex: 1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 80px; align-items: center; padding-top: 48px; padding-bottom: 40px; }
.account-login > * { min-width: 0; }
.account-login-art { display: flex; align-items: center; justify-content: center; }
.account-login-beaver { display: block; width: 100%; max-width: 600px; height: auto; }
.account-login-panel { width: 100%; max-width: 420px; justify-self: end; display: flex; flex-direction: column; align-items: center; }
.account-login-panel > h1 { text-align: center; }
.account-login-logo { display: block; width: 100%; max-width: 360px; height: auto; margin: 0 auto 24px; }
.account-login-card, .account-login-panel > .note { width: 100%; max-width: 360px; text-align: left; }
.account-login-card form { width: 100%; max-width: 320px; margin: 0 auto; }
.account-login-card .input { padding: 6px 8px; min-height: 36px; }
.account-login-footer { width: 100%; padding: 0 16px 24px; text-align: center; }
@media (max-width: 760px) {
  .account-login { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 28px; }
  .account-login-beaver { max-width: 320px; }
  .account-login-panel { justify-self: center; }
  .account-login-logo { max-width: 300px; }
  .account-login-card, .account-login-panel > .note { max-width: 300px; }
}