====Log in flow====
| {F5243494 layout=center, width=200} | {F5243499 layout=center, width=200} | {F5243502 layout=center, width=200}
|Log in form | Reset password form | 2FA varification
**Log in with CAPTCHA**
//After the system sends an error requesting a CAPTCHA security check (due to number of invalid log in attempts) the CAPTCHA element will be added after the UN/PW fields, the 'log in' button will move below the CAPTCHA element and the focus will be placed on the PW field.//
| {F5659346 layout=center, width=200} | {F5659348 layout=center, width=200} | {F5659347 layout=center, width=200}
|Failed login | Failed login with CAPTCHA and CAPTCHA system alert | Failed login with CAPTCHA and CAPTCHA system alert + keyboard
====Create account flow====
| {F5905179 layout=center, width=200} | {F5905184 layout=center, width=200}
| Create account form | Form validation example
====Dynamic text styles and colors====
|**Section** | **Type style** | **Color** |
| Form title | Headline | #54595D |
| Form description text | Subhead | #000 |
| Label | Caption | #72777D |
| Placeholder text | Body | #EAECF0
| Form validation progressive | Caption | #00af89
| Form validation destructive | Caption | #d33 |
| Form validation warning | Caption | #fc3 |
-----
Checklist to help me track progress...
- [x] Move progressive buttons out of nav bar
- [x] Update title labels and placeholder text
- [x] Update captcha box styling adding border and side buttons
- [x] Move invalid password alert inline if we can detect error type
- [x] Make password alert and placeholder dots red on invalid password
- [x] Move account creation username exists alert inline if we can detect error type
- [x] Make username alert and placeholder dots red on username exists
- [ ] Move confirm pwd alert inline
- [ ] Make confirm pwd alert placeholder dots yellow on confirm pwd error