#account-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:44px}
#account-google img{flex:none}
#account-code-form{display:grid;gap:10px;margin-top:12px}
#account-code-form[hidden]{display:none}
#account-code{width:100%;min-width:0}
#account-dialog .signup-consent{display:flex;align-items:flex-start;gap:10px;font:var(--form-help-text)}
#account-dialog .profile-hint{color:var(--dim);font:var(--form-help-text)}
#account-dialog [hidden]{display:none}

.btn.account-save{background:var(--action-blue);border-color:var(--action-blue);color:var(--button-ink)}

/* Keep method choices together and connect the selected option to its entry field. */
#account-methods{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#account-methods .btn{display:flex;align-items:center;justify-content:center;gap:6px;border:2px solid var(--line);color:var(--ink)}
#account-methods .btn::before{content:'';width:1em;flex:none}
#account-methods .btn[aria-pressed=true]{background:var(--action-blue);border-color:var(--action-blue);color:var(--button-ink)}
#account-methods .btn[aria-pressed=true]::before{content:'✓'}
#account-methods .btn:focus-visible{outline:2px solid var(--action-blue);outline-offset:2px}
#account-form{padding:12px;border:2px solid var(--action-blue);border-radius:var(--r-sm);background:var(--brand-soft)}
#account-form #account-email-label{font:var(--control-emphasis)}
#account-form #account-email{border-color:var(--action-blue);font:var(--trade-input-text);scroll-margin-block:12px}
#account-form #account-email:focus{outline:2px solid var(--action-blue);outline-offset:2px}
#account-message{padding:10px;border:1px solid var(--action-blue);border-radius:var(--r-sm);background:var(--brand-soft);color:var(--ink);scroll-margin-block:12px}
#account-message.account-error{border-color:var(--down);color:var(--down)}
