feat: add OTP Input Component (#1200)

[Pcmhacker-piro]

Closes #1200

Pull Request Description

Adds a one-time password input component in submissions/examples/otp-input/ with 6 digit boxes, auto-focus, backspace/paste/arrow key support, and animated states (pulse on empty, pop on fill, shake on error, staggered success reveal).

---

Type of Change

• 🧩 New component

---

Submission Checklist

• All changes are inside submissions/examples/otp-input/
• Includes demo.html — self-contained, opens in browser with no server
• Includes style.css — raw CSS for the proposed feature
• Includes README.md — what it does, how to use it, why it fits EaseMotion CSS
• No changes to core/
• No changes to components/
• One feature per PR (no bundled unrelated changes)

---

Feature Description

What does this add?

A row of 6 individual digit input boxes for OTP/verification codes with auto-focus, backspace-to-previous, paste filling, arrow key navigation, and animated visual states.

How does a developer use it?

<div class="ease-otp-input" data-ease-otp-length="6">
  <input class="ease-otp-box" type="text" inputmode="numeric" maxlength="1" autocomplete="one-time-code" />
  <!-- 5 more boxes -->
</div>
Why does it fit EaseMotion CSS?
Four animated keyframe states: ease-kf-otp-pulse (waiting), ease-kf-otp-pop (digit fill), ease-kf-otp-shake (error), and ease-kf-otp-success-pop (staggered 6-box success). Smooth border/transform transitions. Respects prefers-reduced-motion.
Demo
- Demo added (demo.html works by opening directly in a browser)
Browser Testing
- Chrome
- Firefox
- Edge
- Safari (optional but appreciated)
Notes for Maintainer
Inline JS handles auto-focus, backspace, paste, and arrow key navigation. Press Enter after filling all 6 boxes to trigger success (code "123456") or error (any other code). Uses inputmode="numeric" and autocomplete="one-time-code" for mobile UX.

Closes #1200

[github-actions]

✅ Submission Validation Passed!

Great job! All required files are present.

📁 Folder: submissions/examples/otp-input

Files found:

• ✅ demo.html
• ✅ style.css
• ✅ README.md

🚀 Next Steps:

• The maintainer will review your PR
• Respond to any feedback if requested
• Once approved, your contribution will be merged!

Thank you for contributing to EaseMotion CSS! 🎉

[Pcmhacker-piro]

heyy @SAPTARSHI-coder
i fixed the assigned issue so pls check thsi