Error Part 1

An email field that rejects its input, 4s loop that plays by itself, on a 470×260 stage with a dark #13131C background. Times are seconds from the loop start. Error red = #FF4D6A. Font: Segoe UI / Inter / system sans-serif. Fades and color changes without a named easing are linear.
- Field: 387×82px, radius 17px, horizontally centered, its center 21px above the stage center. Fill #1B1A2C, 2.6px border in white at 13%. Label "Email" (23px semibold, #A9A7C4) starts exactly at the field's left x, baseline 15px above the field.
- 0.1–0.3s: the border fades to violet #6E5BFF (3px) = focused.
- 0.3–1.5s: "name@mail" is typed one letter at a time, one letter every 0.133s (the last one lands at 1.5s): 29px, #ECEBF6, 19px left padding, vertically centered in the field. A violet caret (2.6px wide, half the field's height, vertically centered) sits 2.6px after the text; it shows from 0.1s, is solid while typing, and otherwise blinks (0.42s on / 0.42s off) until 2.2s.
- 2.2s: error. Within 0.08s the border turns red, the fill darkens toward #301422, a red glow appears (rgba(255,77,106,0.55), blur 26px), the label turns red and the caret disappears. The field (with its text) shakes sideways: x = 14px · sin(2π·9·t) · e^(−6t), t = seconds since 2.2, stopping after 0.8s. The label and the message below do not shake.
- 2.22–2.45s: a message row slides down 13px into place and fades in (ease-out), text baseline 32px below the field's bottom. A red circle (13px radius, its left edge on the field's left edge, its center 8px above the baseline) with a white "!" (a rounded bar plus a dot, about 1.2× the radius tall), then "Enter a valid email" (24px semibold, red) starting 19px right of the circle's center.
- 3.5–3.8s: the red state, glow and message fade out (the label goes back to grey and the border passes back through violet). 3.6–3.9s: the violet border and the typed text fade out, so the loop restarts with an empty grey field.