no output for colors

[cmnstmntmn]

i have this config

postcss([
    require('postcss-import')(),
    require('autoprefixer')({ browsers: ['last 5 versions', '> 5%', 'ie >= 10'] }),
    require('postcss-atroot'),
    require('postcss-mixins'),            
    require('postcss-simple-vars'),       
    require('postcss-custom-properties'),                          
    require('postcss-custom-media'),  
    require('postcss-nested'),
    require('postcss-color-function'),       
    require('postcss-typescale'),
    require('postcss-button'), 
    styleguide({
          project: 'Project name',
          dest: 'styleguide/app.html',
          showCode: true
    }), 
    require('cssnano')({
      discardComments: {
        removeAll: true
      }
    })    
  ])
  .process(fs.readFileSync('resources/games/css/app.css', 'utf8'), { from: "resources/games/css/app.css" })
  .then(result => purify(content, result.css, options))

trying to get the style for a component

/*
@styleguide

@title Component_Name

*/

works fine

but when i want to output colors, there's no output in the styleguide html file.

/* @start color */
:root {
    --red: #e23B00;
    --blue: #3f526b;
    --black: #000;
    --background: #faf8f5;
}
/* @end color */

[cmnstmntmn]

fixed, was the order that causing that