Customizer: CSS changes not persistent

OK. Even though I wasn’t able to figure it out with CSS and wp_head() I managed to hack something that works.

<?php
    $sidebar_background_color = get_theme_mod('design-sidebar-background-color');
?>

<aside style="background-color: <?php $sidebar_background_color; ?>;">
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
    <?php endif; ?>
</aside>

Since I could manipulate DOM and HTML just fine I decided to change CSS “manually” as inline styling. It works though the method feels superhacky.

v2 with <style></style> block.

<?php
    $header_background_color = get_theme_mod('design-header-background-color');
    $header_background_image = get_theme_mod('design-header-background-image');

?>

<style> /* FOR CUSTOMIZER API ONLY, DON'T CUSTOMIZE CSS HERE */
    <?php if (get_theme_mod('design-header-css') === '') : ?>
        header .page-header {
            background-color: <?php echo $header_background_color; ?>;
            background-image: url('<?php echo $header_background_image; ?>');
        }
    <?php else : ?>
        <?php echo get_theme_mod('design-header-css'); ?>
    <?php endif; ?>
</style>

<!--- HTML GOES HERE -->