Screen Annotations — OPS-S-003 OTP Verification
Screen ID: OPS-S-003
Flow: Authentication → OTP Verification
Previous: OPS-S-002 Staff Login
Next: OPS-S-004 Role Selection
OTP Input: 4-digit code (simpler than consumer 6-digit). Each digit has its own input box. Auto-advances focus to next box on entry. Wireframe shows first two digits filled to demonstrate the interaction state.
Auto-Verify: When all 4 digits are entered, the app should automatically verify without requiring the user to tap "Verify". The button serves as a manual fallback.
Resend: Timer counts down from 60 seconds. When timer reaches 0, the text changes to a tappable "Resend" link. Maximum 3 resend attempts before showing "Contact your manager" message.
Error State: If OTP is incorrect, digit borders turn red and a brief shake animation plays. Error text appears: "Incorrect code. Please try again."
Simpler than Consumer: Staff OTP uses 4 digits instead of 6. Header is plain white with "Verify" title. No decorative elements.