Eenmalige code

Bouw een interactief UI-element: Eenmalige code.

Wat het is: Zes vakjes die zelf doorschuiven, plakken van een hele code en een schudje bij een foute code.

Gedrag:
- Zes losse vakjes voor cijfers; de focus springt automatisch naar het volgende vakje.
- Backspace in een leeg vakje gaat terug en wist het vorige; pijltjestoetsen navigeren.
- Plakken van een hele code vult alle vakjes in één keer.
- Bij een volle code: kort "Controleren...", daarna groen bij goed of rood met een schudanimatie bij fout; daarna leeg en klaar voor een nieuwe poging.
- Het eerste vakje heeft autocomplete="one-time-code", zodat sms-codes op mobiel vanzelf invullen.

Eisen:
- Werk in de stack van dit project. Is het React met Tailwind CSS, maak dan één component zonder extra pakketten; anders gewone HTML, CSS en JavaScript.
- Volledig bedienbaar met toetsenbord en touch, met de juiste aria-attributen.
- Respecteer prefers-reduced-motion: minder of geen beweging.
- Neem de kleuren, lettertypes en afrondingen van mijn project over.
- Laat me aan het eind zien waar het component staat en hoe ik het gebruik.