GruntJS + Browsersync Not injecting the css but other reloads are working

[suthanbala]

The following is my Gruntfile. It was working fine before, then suddenly it stopped watching the css, although it's refreshes the browser for any JS or PHP file changes.

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    sass: {
      options: {
        sourceMap: true
      },
      dist: {
        files: {
          '../css/main.css' : '../sass/foundation.scss'
        }
      }
    },

    browserSync: {
        dev: {
            bsFiles: {
                src : ['../css/main.css', '../js/*.js', '../*.php']
            },
            options: {
                proxy: "test.testsite.com",
                watchTask: true,
            }
        }
    },

    watch: {
      css: {
        files: ['../sass/*.scss', '../sass/responsive/*.scss'],
        tasks: ['sass']
      }
    }
  });

  grunt.loadNpmTasks('grunt-sass');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-browser-sync');
  grunt.registerTask('default',['browserSync', 'watch']);

}

Output on the grunt when there's a change made in scss file:

Done, without errors.
Completed in 0.789s at Tue Dec 01 2015 14:56:57 GMT-0500 (Eastern Standard Time) - Waiting...
[BS] File changed: C:\xampp\htdocs\vortex\wp-content\themes\vortex\css\main.css

Attached the screenshot of the network tab on Chrome when a css file was modified.