Add PlateAdapter visualization with hole grid and magnetic rack styling

[BioCam]

PlateAdapter now renders with its actual hole grid geometry instead of a generic rectangle.

The Problem

PlateAdapter resources (magnetic racks, PCR adapters, shaker adapters) rendered as plain rectangles, indistinguishable from unknown resources.
Their rich geometry data (hole grid position, size, spacing) was completely unused visually.

PR Content

• New PlateAdapter JS class with hole grid computed from serialized geometry
• Standard adapters: brushed-metal gradient body with inner bevel and depth-effectholes
• Magnetic adapters (name/model contains "magn"): cornflower blue body with silvermetallic holes
• Sidebar summary shows assigned plate name or "empty"
• UML info panel shows hole size, spacing, offset, and plate_z_offset
• Registered in classForResourceType() for both type and category lookup

Looks like this:

[Copilot]

Pull request overview

This PR enhances the visualizer’s representation of PlateAdapter resources so they render with their real hole-grid geometry and distinct styling (standard vs. magnetic), making adapters visually identifiable and more informative in the UI.

Changes:

• Added a new PlateAdapter resource class in the visualizer that renders a computed hole grid (with distinct standard/magnetic styling).
• Registered PlateAdapter in classForResourceType() for both type and category mapping.
• Extended the sidebar summary and UML info panel to show adapter-specific information (assigned plate name / empty; hole sizing/spacing/offsets).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.