Files appear to have changes, although no visible changes are seen + Compile on save. about webcompiler HOT 6 OPEN

[
  {
    "inputFile": "wwwroot/css/Styles/homepage.scss",
    "outputFile": "wwwroot/css/Styles/homepage.css",
    "minify": {
      "enabled": true
    }
  }
]

@charset "utf-8";
@import "libs/first-file";
@import "homepage/second-file";

[
  {
    "inputFile": "wwwroot/css/Styles/homepage.scss",
    "outputFile": "wwwroot/css/Styles/homepage.css",
    "minify": {
      "enabled": true
    },
    // added the following bit , thinking the issue might be related to invisible white space, but it doesn't really help
    "options": {
      "lineFeed": "crlf"
    }
  }
]

@charset "utf-8";
@import "libs/first-file";
@import "homepage/second-file";

.second-file {
    color: red;

    p {
        font-style: normal;
    }

    .custom-input:focus {
        border-color: inherit;
        box-shadow: none;
    }

    .left-panel {
        color: blue;
        font-size: 18px;
        text-shadow: initial;
        top: 63%;
        white-space: nowrap;
        left: -1rem;
    }

    .right-panel {
        color: blue;
        font-size: 18px;
        text-shadow: initial;
        top: 63%;
        white-space: nowrap;
        right: -1rem;
    }

    section {
        font-size: 18px;
    }

    .title {
        font-weight: bold;
    }

    .btn {
        @include sm {
            min-width: 25% !important;
            margin: 10px 0px 20px 10px;
        }

        @include mobile {
            width: 100%;
            margin: 20px 0px 10px 0px;
        }
    }
}