Basecoat UI MCP

<!-- Accordion Structure --> <section class="accordion"> <details class="group border-b last:border-b-0"> <summary class="flex items-center justify-between p-4 cursor-pointer"> <h3>Section Title</h3> <svg class="w-4 h-4 transition-transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> </svg> </summary> <section class="p-4 pt-0"> <p>Section content goes here...</p> </section> </details> <details class="group border-b last:border-b-0"> <summary class="flex items-center justify-between p-4 cursor-pointer"> <h3>Another Section</h3> <svg class="w-4 h-4 transition-transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> </svg> </summary> <section class="p-4 pt-0"> <p>More content...</p> </section> </details> </section>