# Automated Password Reset Flow A two-section flowchart tracing the full user journey for a web application password reset: the initial request phase (forgot password → email check → token generation) and the reset-form phase (link click → new password entry → token/password validation). Demonstrates multi-exit decision diamonds, a three-column branching layout, a loop-back path, and a cross-section separator arrow. ## Key Patterns Used - **Three-column layout**: Left column (error/terminal branches at cx=115), center column (main happy path at cx=340), right column (expired-token branch at cx=552) — allows side branches to live at the same y-level as center nodes without overlap - **Decision diamonds with ``**: Each decision uses a `` wrapper containing a `` and centered ``; the diamond points are computed as `cx±hw, cy±hh` (hw=100, hh=28) - **Pill-shaped terminals**: Start and end nodes use `rx=22` on their `` to signal entry/exit points; all mid-flow process nodes use `rx=8` - **Three-branch decision paths**: Each diamond has a "Yes" branch (down, short ``) and a "No" branch (`` going horizontal then vertical to a side column) - **Loop-back path**: Mismatch error node loops back to the password-entry node via a routing corridor at x=215 — a 5-px gap between the left column (right edge x=210) and center column (left edge x=220); the path exits the bottom of the error node, drops below it, travels right to x=215, then goes up to the target node's center y, then right 5 px into the node's left edge - **Section separator**: A dashed horizontal `` at y=452 splits the two phases; the connecting arrow crosses it with a faded label ("user receives email") to preserve flow continuity - **Italic annotation**: The exact UX copy for the generic message ("If that email exists…") is shown as a faded italic `ts` text block below the left-branch terminal node - **Legend row**: Five inline swatches (gray, purple, teal, red, amber diamond) at the bottom explain the color-to-role mapping ## Diagram ```xml Section 1 — Forgot password request User: "Forgot password" Enter email address Email in system? No Yes Generic message shown Email sent if found Request handled "If that email exists, a reset link has been sent." Generate unique token Time-limited, cryptographic Store token + user ID Send reset link via email user receives email Section 2 — Password reset form User clicks reset link Enter new password ×2 Confirm both passwords match Token expired? Yes No Token expired Show expiry error End — request again Passwords match? No Yes Password mismatch Passwords do not match retry Reset password Invalidate used token Password reset complete Legend — User action System process Email / success Error state Decision ``` ## Custom CSS Add these classes to the hosting page `