🎨 Palette: Add keyboard focus styles and ARIA labels to list controls

[aafre]

💡 What: Added explicit keyboard focus rings (focus-visible:ring-2) and type="button" to add/remove controls in Experience, Education, and Generic sections. Added an aria-label to the description point removal button.
🎯 Why: Interactive elements inside dynamically mapped lists were losing their default browser focus outlines due to custom Tailwind styling, making them difficult for keyboard users to navigate. Missing type="button" can also cause accidental form submissions in some contexts.
📸 Before/After: Focus states were previously invisible on these buttons. Now they have clear, contextual focus rings (red for destructive, dark for additive). Screen readers now hear "Remove description point" instead of just "✕".
♿ Accessibility: Improved keyboard navigability by ensuring all list controls have visible focus states (focus-visible classes). Added a missing aria-label to an icon-only button and ensured all buttons have explicit type="button".

---

PR created automatically by Jules for task 324531667006514486 started by @aafre

[google-labs-jules]

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.

---

For security, I will only act on instructions from the user who triggered this task.

[gemini-code-assist]

Code Review

This pull request improves the accessibility of interactive list controls across the EducationItem, ExperienceItem, and GenericSection components by adding explicit focus-visible ring styles and ensuring buttons have the correct type="button" attribute. It also updates the .Jules/palette.md documentation with new guidelines regarding focus states for drag-and-drop list controls. A review comment suggests further enhancing accessibility by including item indices in the aria-label and title attributes of removal buttons to provide better context for screen reader users.

[gemini-code-assist]

When rendering multiple interactive elements in a list, it's best practice to include the item's index or a unique identifier in the 'aria-label' and 'title'. This provides necessary context for screen reader users to distinguish between multiple 'Remove' buttons and ensures clearer tooltips for sighted users.

Suggested change

	type="button"
	onClick={() => handleDescRemove(descIndex)}
	className="text-red-600 hover:text-red-800 p-2 hover:bg-red-50 rounded-lg transition-colors flex-shrink-0 mt-2"
	className="text-red-600 hover:text-red-800 p-2 hover:bg-red-50 rounded-lg transition-colors flex-shrink-0 mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 focus-visible:ring-offset-1"
	title="Remove description point"
	aria-label="Remove description point"
	type="button"
	onClick={() => handleDescRemove(descIndex)}
	className="text-red-600 hover:text-red-800 p-2 hover:bg-red-50 rounded-lg transition-colors flex-shrink-0 mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 focus-visible:ring-offset-1"
	title={'Remove description point ' + (descIndex + 1)}
	aria-label={'Remove description point ' + (descIndex + 1)}