Gulp 4 not updating CSS?

Question

Sass

Hello!
I'm still a beginner, but there is a problem..

here is my gulp file:

const gulp        = require('gulp');
const browserSync = require('browser-sync');
const sass        = require('gulp-sass');
const cleanCSS = require('gulp-clean-css');
const autoprefixer = require('gulp-autoprefixer');
const rename = require("gulp-rename");

gulp.task('server', function() {

    browserSync({
        server: {
            baseDir: "./"
        }
    });

    gulp.watch("src/*.html").on('change', browserSync.reload);
});

gulp.task('styles', function() {
    return gulp.src("src/sass/**/*.+(scss|sass)")
        .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
        .pipe(rename({suffix: '.min', prefix: ''}))
        .pipe(autoprefixer())
        .pipe(cleanCSS({compatibility: 'ie8'}))
        .pipe(gulp.dest("src/css"))
        .pipe(browserSync.stream())
        .pipe(browserSync.reload({stream: true}));
});

gulp.task('styles', function() {
    return gulp.src("src/sass/**/*.+(scss|sass)")
    .pipe(browserSync.reload({stream: true}));
});

gulp.task('watch', function() {
    gulp.watch("src/sass/**/*.+(scss|sass)", gulp.parallel('styles'));
})
 
  gulp.watch(['scripts/**/*.js','!scripts/main.min.js'], gulp.series(buildScripts, reload));
gulp.task('default', gulp.parallel('watch', 'server', 'styles'));

gulp.watch([settings.themeLocation + 'js/modules/*.js', settings.themeLocation + 'js/scripts.js'], gulp.series('waitForScripts', browserSync.reload));

Outputs:

PS D:\EDUCATION\pulse> gulp
ReferenceError: buildScripts is not defined
at Object. (D:\EDUCATION\pulse\gulpfile.js:41:70)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs /loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at requireOrImport (C:\Users\Stasy\AppData\Roaming\npm \node_modules\gulp-cli\lib\shared\require-or-import.js:19:11)
at execute (C:\Users\Stasy\AppData\Roaming\npm\node_modules\gulp-cli\lib\versioned\^4.0.0\index.js:37:3)
at Liftoff.handleArguments (C:\Users\Stasy \AppData\Roaming\npm\node_modules\gulp-cli\index.js:211:24)

If I do this
// gulp.watch(['scripts/**/*.js','!scripts/main.min .js'], gulp.series(buildScripts, reload));
gulp.task('default', gulp.parallel('watch', 'server', 'styles'));

// var gulp = require('gulp');
// gulp.watch([settings.themeLocation + 'js/modules/*.js', settings.themeLocation + 'js/scripts.js'], gulp.series('waitForScripts', browserSync.reload));

then
[15:42:11] Using gulpfile D:\STUDY\pulse\gulpfile.js
[15:42:11] Starting '
[15:42:11] Starting 'server'...
[15:42:11] Starting 'styles'...
[15:42:12] Finished 'styles' after 237 ms
[Browsersync] Access URLs:
-- ------------------------------------
Local: localhost:3000
External: 192.168.1.143:3000
-- ------------------------------------
UI: localhost:3001
UI External: localhost:3001
--- -----------------------------------
[Browsersync] Serving files from: ./

but no styles anyway. .What

am I doing wrong?