.ml-ui.ml-login .ml-login__main { max-width: 32rem; }
.ml-ui .ml-login__lede { margin: var(--ml-space-3) 0 0; color: var(--ml-color-fg-muted); text-wrap: pretty; }
.ml-ui .ml-login__form { gap: var(--ml-space-5); }
.ml-ui .ml-login__label-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ml-space-3); }
.ml-ui .ml-login__label-row a, .ml-ui .ml-login__switch a { color: var(--ml-color-accent); text-decoration: underline; text-underline-offset: .2em; }
.ml-ui .ml-login__switch { margin: var(--ml-space-6) 0 0; color: var(--ml-color-fg-muted); text-align: center; }
.ml-ui.ml-login .auth-alert { display: flex; align-items: flex-start; gap: var(--ml-space-3); padding: var(--ml-space-3) var(--ml-space-4); border: 1px solid var(--ml-color-danger); border-radius: var(--ml-radius-control); color: var(--ml-color-danger); background: var(--ml-color-danger-bg); }
.ml-ui.ml-login .auth-alert__icon { flex: 0 0 auto; width: .5rem; height: .5rem; margin-top: .4rem; border-radius: 50%; background: currentColor; }
.ml-ui.ml-login .auth-alert strong,
.ml-ui.ml-login .auth-alert p { display: block; margin: 0; }
.ml-ui.ml-login .auth-alert p { margin-top: var(--ml-space-1); }
.ml-ui .ml-login__state { text-align: center; }
.ml-ui .ml-login__state .ml-button { width: 100%; }
.ml-ui .ml-login__state .ml-field-help { margin: 0; }