/* Create account.
 *
 * Borrows the account screen's grid and field furniture so the form
 * looks the same wherever it is dropped. Only what is particular to
 * this form is here. */

.dsa-signup,
.dsa-signup *{ box-sizing:border-box; min-width:0 }

.dsa-signup{ max-width:100%; overflow-wrap:anywhere }

.dsa-signup .dsf-field{ margin:0 }

/* Room under it as well as over it. It sat against the Create
   account button, which read as a label on the button rather than a
   question of its own. */
.dsa-signup .dsa-sms{ margin:16px 0 26px }
.dsa-signup .dsa-sms label{ display:flex; align-items:center; gap:10px;
  font-size:.85rem; opacity:.8; line-height:1.4 }
.dsa-signup .dsa-sms input{ width:auto }

.dsa-fault{ display:block; font-size:.78rem; line-height:1.3;
  color:var(--ds-bad,#e5484d); min-height:0 }
.dsa-fault:empty{ display:none }

.dsf-field.is-wrong input{ border-color:var(--ds-bad,#e5484d) }

.dsa-hope{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }

.dsa-go.is-sending{ opacity:.6; pointer-events:none }

.dsa-said{ margin:16px 0 0; font-size:.9rem; line-height:1.45 }
.dsa-said:empty{ display:none }
.dsa-said.is-good{ padding:12px 16px; border-radius:5px;
  background:color-mix(in srgb, var(--ds-good,#3fbf6a) 16%, transparent);
  border:1px solid color-mix(in srgb, var(--ds-good,#3fbf6a) 42%, transparent) }
.dsa-said.is-bad{ color:var(--ds-bad,#e5484d) }

.dsa-signup.is-in p{ margin:0 0 12px }