CSS-in-JS: Architecture, Pros, and Cons?

CSS-in-JS (e.g., Styled Components) scopes styles locally and integrates with JS logic, but adds runtime overhead.

Pros: True scoping, dynamic styling based on JS state, dead code elimination, and component co-location. Cons: Bundle size increases, runtime performance cost for evaluating styles on the fly, and loss of standard CSS caching.