MUI v5 Emotion Migration: Theme Override Precedence During JSS Coexistence

When incrementally migrating a large codebase from MUI v4 (JSS) to v5 (Emotion), the compatibility layer allows both styling engines to operate simultaneously. The goal is to progressively convert theme-level component overrides in createTheme to the new Emotion-based styled() API without a full rewrite.

The migration path introduces uncertainty around precedence: theme overrides defined in createTheme (v5 style) may conflict with lingering makeStyles or withStyles injections (v4 style) targeting the same component slots. Additionally, the sx prop resolves against the v5 theme object, but its generated Emotion classes must not collide with existing JSS class names in the DOM. Bundle size impact from dual-engine runtime is a documented constraint.

How does MUI v5 resolve specificity when a component slot receives styles from both a v4 JSS class and a v5 theme override simultaneously? What is the recommended sequence for converting createTheme overrides to styled() utilities to avoid regression during the coexistence window? Does the CssVarsProvider experimental API alter this precedence model when CSS variables are enabled?