Avoid embedded and inline CSS

Inline CSS cannot be cached separately, increases HTML payload, breaks separation of concerns, and is harder to maintain in large codebases.

Quick Reference

• Move inline styles to external CSS files or CSS-in-JS
• Exception: critical CSS should be inlined for performance
• Exception: dynamic values (CSS custom properties) can be inline
• Inline CSS breaks caching and increases HTML size

Check

Verify that inline CSS and embedded styles are avoided except for valid use cases like critical CSS, dynamic styles, or performance optimization.

Fix

Move inline and embedded CSS to external stylesheets, keeping only critical above-the-fold CSS inline for performance optimization.