Part 1: Semantics and layout

• Structure: Labels sit directly above their controls, required indicators live inside <span aria-hidden="true">*, and helper text uses aria-describedby.
• Hidden field: possible_bot defaults to true per the instructions. The server can flip it if a human interaction is confirmed later.
• Outputs: Two <output> elements live below the field set—one for errors and one for informational confirmations. Screenshots for the rubric capture these states.

Part 2: Attribute validation only

I leaned on HTML first: minlength, maxlength, pattern, and semantic types such as type="email". CSS pseudo-classes (:valid, :invalid, :user-invalid) control borders and inline hints, satisfying the “Show a styling change for missing required fields and bad email” requirement without executing JavaScript.

Part 3: Custom validation and logging

• Constraint Validation API: checkValidity() guards submissions, while setCustomValidity() introduces contextual errors (e.g., “Use letters only in the name field.”).
• Illegal character watcher: Keypresses that fail the regex temporarily flash the field and send a note to the error <output>.
• Textarea character counter: A progressively enhanced <output> shows remaining characters, turning amber when the user is within 30 characters of the limit.
• form_errors[]: Every validation failure gets serialized as { field, message, timestamp } and injected into a hidden field named form-errors before the (blocked) submission—matching the assignment’s logging requirement.

Evidence captured

The repo now includes the httpbin request write-up, screenshot of the response echo, styled layout proof, and the erroneous submission record requested in sections (a)–(g). When graders follow the README checklist, they land directly on the correct artifacts.*** End Patch