SASS vars not loading into project

I finally had a need for SASS vars so I am trying to get them to work for the first time.

Here is my gulpfile.js:

var gulp = require('gulp');
var sass = require('gulp-sass');
var cleanCss = require('gulp-clean-css');
var rename = require('gulp-rename');

var paths = {
  sass: ['./scss/**/*.scss']

gulp.task('default', ['sass']);

gulp.task('sass', function(done) {
    .on('error', sass.logError)
      keepSpecialComments: 0
    .pipe(rename({ extname: '.min.css' }))
    .on('end', done);

gulp.task('watch', ['sass'], function() {, ['sass']);

And in my projectRoot/scss/ file I have:

$tabs-icon-size:                  25px !default;
$tabs-height:                     35px !default;
$eBlue:                     #192a67;
$eBlueRGB:                  25, 42, 103;
$eYellow:                   #f8d294;
$eYellowRGB:                248, 210, 148;
$eOrange:                   #f5aa07;
$eOrangeRGB:                245,168,7;

// The path for our ionicons font files, relative to the built CSS in www/css
$ionicons-font-path: "../lib/ionic/fonts" !default;

// Include all of Ionic
@import "www/lib/ionic/scss/ionic";

And for my first scss variable, I added one to a class for a custom color:

.button-custom {
  background-color: $eBlue; 

But its not working. Inspecting the element I see button-custom applied to the button I am trying to change, but the background-color: $eBlue ; is striked out.

At the beginning of the ionic build android output I see:
[23:27:44] Invoking sass gulp task.

What am I doing wrong?