customizing Bulma via SASS

[gour]

Hello,

Bulma framework uses SASS along with npm (via package.json) as build tool. Its docs says that in order to:

Add your own colors, set new fonts, override Bulma styles...

one has to provide file with the following content:

// 1. Import the initial variables
@import "../sass/utilities/initial-variables"

// 2. Set your own initial variables
// Update blue
$blue: #72d0eb
// Add pink
$pink: #ffb3b3
// Add a serif family
$family-serif: "Merriweather", "Georgia", serif

// 3. Set the derived variables
// Use the new pink as the primary color
$primary: $pink
// Use the existing orange as the danger color
$danger: $orange
// Use the new serif family
$family-primary: $family-serif

// 4. Import the rest of Bulma
@import "../bulma"

but it's not clear to me if one e.g. names such file as master.sass, how to incorporate it into the present build system?

One way to customize Bulma theme is to use:

<link rel="stylesheet" href="{{ .Site.BaseURL}}/css/custom.css"> <!--Custom CSS-->

but I wonder how could I achieve to generate the above custom.css by using SASS mechanism within Bulma framework itself instead of overriding styles directly in CSS file?