Theme Guidance

Treat foundational foreground and surface colors as a coordinated theme system. QP components often consume semantic Theme variables directly, so changing a container color or background does not necessarily recolor its descendants. When changing the document canvas or ordinary surfaces, review primary, strong, muted, inverse, and heading foregrounds together with ordinary, muted, hover, and overlay surfaces. Use local CSS for image-dependent overlay contrast, but do not rely on body color inheritance as a substitute for declaring the theme’s ordinary semantic color decisions.

Prefer modifying CSS properties directly over overriding QP variables within scoped selectors. Use scoped variable overrides when a change intentionally coordinates multiple descendant consumers or carries shared inherited context. For configurable color, size, spacing, and other design values, prefer an explicit alternate Theme variable applied by the selector.