Interactive Burn Body SVG Map

I already have front- and back-view body diagrams; what I need now is an accurate SVG overlay that follows the Rule of Nines so each region represents its correct burn-percentage value. Every region must be clickable. When a user clicks, that specific area should visually highlight (for example, a temporary fill color change or outline) so the app can register the selection. No hover effects or pop-ups are required right now, just the click-to-highlight behaviour.

The web app currently runs only on my local machine, so the solution has to be plain HTML/CSS/JavaScript that I can drop straight into the existing codebase without extra build steps. A concise example page that imports the SVG, wires up the click listener, and demonstrates the highlight effect will be enough for testing.

Deliverables
• Clean, well-layered SVG of the anterior and posterior views with regions labelled per Rule of Nines
• Lightweight JS (or inline script) that attaches click handlers and toggles a highlight class
• Brief integration notes so I can merge it into the rest of the app

Accuracy of the region boundaries is critical; please base them on standard medical percentages. If any clarification is needed on boundary placement or desired highlight style, let me know before finalising the file.