Implement pattern for reusing CSS between Phoenix & React

There are a number of components that are shared between the "Build" interface (Canvas plus Inspector) soon 100% react) and the rest of the Phoenix app. There are likely many, but for this issue let's consider:

• Buttons
• Chips
• Toggles

Today, components like Buttons, Chips and Toggles are implemented twice: once as React components, and again as Phoenix partials/HEEx function components. This leads to:

1. Duplication of HTML/CSS (and sometimes JS behavior)
2. Inconsistent implementations when one side drifts
3. Extra effort to sync styling, accessibility, and behavior enhancements.

The goal of this issue is to implement a pattern that allows us to not duplicate large quantities of HTML and CSS when using or adding these basic components. This implementation (for chips, toggles, and buttons) should:

DRY: Single source for markup, styling, and ARIA/JS behavior
Consistent theming: Colors, spacing, typography, states, focus rings, etc.
Easy adoption: Minimal friction for both React and Phoenix teams
Future-proof: New components (e.g. Dropdown, Modal) should slot into the same system

Note that we don't (yet?) want to migrate the entire Phoenix UI to React, but if maintaining consistent, unified components proves infeasible that should likely be the direction of travel.

This issue should be taken on after #3093is done on the Phoenix side, and #3089 on the React side.
(Consider how #3176 is going.)

Review the Phoenix-side work in #3093 and React-side work in #3089 before starting, then consider the status of #3176. The issue is done when Buttons, Chips, and Toggles share markup, styling, and ARIA/JS behavior across Phoenix and React without duplicating large quantities of implementation.