/* Invite-code gate (screens/login.js). Owner: WP2. Same composition as the Upload screen:
   a flush #1f1f1f panel with one centred column. */
.screen-login { background: var(--c-panel); }
.screen-login .login-wrap { flex: 1; display: grid; place-items: center; padding: 48px 32px; }
.screen-login .login-form { width: 100%; max-width: 420px; display: flex; flex-direction: column; gap: 16px; }
.screen-login .login-kicker { font-size: var(--fs-s); line-height: 16px; color: var(--c-muted); }
.screen-login .login-kicker + .display { margin-top: -8px; }
.screen-login .login-field { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.screen-login .login-label { font-size: var(--fs-s); line-height: 16px; color: var(--c-muted); }
.screen-login .login-field .field { letter-spacing: 0.04em; }
.screen-login .login-error { margin-top: -6px; padding-left: 10px; box-shadow: inset 2px 0 0 var(--c-ink); font-size: var(--fs-m); line-height: 18px; color: var(--c-ink); user-select: text; -webkit-user-select: text; }
.screen-login .login-foot { margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--c-field); font-size: var(--fs-m); line-height: 20px; color: var(--c-muted); }
@media (max-width: 599.98px) {
  .screen-login .login-wrap { place-items: start center; padding: 32px var(--gutter); }
}
.login-logo { width: 96px; height: 96px; margin-bottom: 8px; }

/* Accounts (screens/login.js, waitlist.js, moved.js share this composition). */
.screen-login .login-note { padding-left: 10px; box-shadow: inset 2px 0 0 var(--c-muted); font-size: var(--fs-m); line-height: 18px; color: var(--c-ink); }
.screen-login .login-discord[aria-disabled="true"] { pointer-events: none; }
.screen-login .login-field .field::placeholder { color: var(--c-disabled); letter-spacing: 0.04em; }
.screen-login .login-who { margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--c-field); display: flex; align-items: center; gap: 8px; min-width: 0; font-size: var(--fs-m); line-height: 20px; color: var(--c-muted); }
.screen-login .login-who-text { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.screen-login .login-who-name { color: var(--c-ink); font-weight: 600; }
.screen-login .login-face { flex: none; display: inline-flex; }