Persona Picker

Build a persona picker for onboarding. Structure: a question, a reassurance line, three role cards, and a Continue plus Skip row. The rule that makes it worth asking: EVERY CARD STATES ITS CONSEQUENCE. Under each role name, print what picking it will actually do - "Starts you in the component library", "Pins the usage dashboard to your home". Most persona pickers leave this out, and without it the choice is a guess. If the choices genuinely lead to the same screen, delete the component; it is a survey in a wizard's costume. Ask about the FIRST TASK, not identity: "What will you do here first?" is answerable, while "who are you?" invites people to pick the flattering option. Selection state: fill the icon tile with the accent colour, tint the card, switch its border, and spring in a check (stiffness ~620). Several signals at once, because a card that differs by one border is not obviously selected. Tapping the selected card again deselects it - in a single-select group that is the only way out of a wrong tap. Add a reassurance line ("you can change this later") and a real, reachable SKIP next to Continue. A wizard you cannot leave gets abandoned at the browser tab, and that costs the whole signup. Keep Continue visibly inert until a choice exists: muted background AND muted text, not merely a disabled attribute. Accessibility: aria-pressed on each card. Under prefers-reduced-motion, drop the tap scale; colours and the check still change. Colors as tokens: paper cards, hairline borders, one accent for the selected state. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.