Problem z SASS

Czołem forumowicze! To mój pierwszy temat na tym forum, więc nie czuję się tu jeszcze zadomowiony :] Tak więc jeśli wsadziłem temat do złego działu albo coś podobnego, to nie bijcie ;]
Mam mały problem z VSC, a dokładnie z kompilacją z Sass. Po pierwsze, używam dodatku Sass Compiler. Problem w tym, że chcę aby pliki css stworzone po przekształceniu z Sass do CSS zapisywały się w oddzielnym folderze oraz aby były skompresowane. Wszystkie pliki css zapisują się w tym samym folderze co pliki Sass oraz są plikami expanded. Nie działa zmiana ustawień zgodnie z tym co jest napisane w dokumentacji. Dokumentacja wskazuje, że w ustawieniach należy umieścić jeden z poniższych fragmentów :
"liveSassCompile.settings.formats":[
```html
// This is Default.
{
"format": "expanded",
"extensionName": ".css",
"savePath": null
},
// You can add more
{
"format": "compressed",
"extensionName": ".min.css",
"savePath": "/dist/css"
},
// More Complex
{
"format": "compressed",
"extensionName": ".min.css",
"savePath": "~/../css/"
}
]

Niestety, po zmianie ustawień nic się nie zmienia w kwestii zapisywania pliku css. Obecne moje ustawienia wyglądają tak: 
```html

{
    "workbench.colorTheme": "Solarized Dark"
}

 "autoprefixer.browsers": [
    "last 5 versions",
    "> 5%"
  ],

  "liveSassCompile.settings.formats": [
    {
        "format": "compressed",
        "extensionName": ".css",
        "savePath": "/dist/css"
    }
  ],


  "liveSassCompile.settings.autoprefix": [
    "> 1%",
    "last 2 versions"
  ],

Po drugie, robię sobie stronkę w ramach treningu w oparciu o Sass i w pewnym momencie wyskakuje mi taki błąd:

"Compilation Error
Error: Invalid CSS after "...in: auto; } } }": expected "}", was "{"
        on line 74 of sass/d:\Programowanie\gudzień\30.12.18\sass\_header.sass
        from line 1 of sass/d:\Programowanie\gudzień\30.12.18\sass\style.sass    
margin: auto; } } } {"

Nie wiem, w jaki sposób mam poprawić ten błąd. Wg mnie w linii 74 wszystko jest ok (linia pogrubiona i opatrzona kursywą).

Zapis w pliku Sass wygląda z kolei tak:

*
    font-family: 'Magra', sans-serif
    margin: 0
    padding: 0
    box-sizing: border-box

body 
    background-color: #fff
    header 
        background-image: url(../img/lost-places-1510592_1920.jpg)
        background-repeat: no-repeat
        background-size: cover
        background-position: center
        min-height: 100vh
        div.bcblack
        //    position: absolute
        //    top: 0
        //    right: 0
        //    left: 0
        //    bottom: 0
           background-color: rgb(0, 0, 0)
           width: 100%
           min-height: 100vh
        section.menu.title
           position: absolute
           max-width: 1280px
           margin: 0 auto
           i.fas.fa-chevron-circle-down
               display: none
               padding: 10px
               font-size: 30px
               color: #fff
               cursor: pointer
           i.fas.fa-chevron-circle-down.active
               display: block
               position: relative
               top: 3%
               left: 0%
               z-index: 1
           i.fas.fa-bars
               display: block
               padding: 10px
               font-size: 30px
               color: #fff
               cursor: pointer
           i.fas.fa-bars.disactive
               display: none 
           nav
              position: relative
              top: 0
              left: -200%
              transition: 0.3s
              ul 
                display: grid
                grid-column-gap: 20px
                grid-template-columns: 1fr 1fr 1fr 1fr
                grid-auto-flow: column
                justify-content: start
                li
                   margin: 0 30px 0 30px
                   a
                        display: inline-block
                        width: 100%
                        padding: 5px
                        text-decoration: none
                        text-transform: uppercase
                        text-align: center
                        color: #fff
           nav.active 
              position: relative
              top: 0
              left: 0
            ** <u> margin: 0 auto </u> **
       h1
           text-transform: capitalize
           font-size: 3em`````html

Czy ktoś byłby w stanie mnie nakierować? Pozdrawiam

Nie dodajesz ; oraz {} - z tym się przekompilował, sprawdź czy Ci działa:

* {
  font-family: 'Magra', sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background-color: #fff;
}
header {
  background-image: url(../img/lost-places-1510592_1920.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 100vh;
}
div.bcblack {
  // position: absolute
  // top: 0
  // right: 0
  // left: 0
  // bottom: 0
  background-color: rgb(0, 0, 0);
  width: 100%;
  min-height: 100vh;
}
section.menu.title {
  position: absolute;
  max-width: 1280px;
  margin: 0 auto;
}
i.fas.fa-chevron-circle-down {
  display: none;
  padding: 10px;
  font-size: 30px;
  color: #fff;
  cursor: pointer;
}
i.fas.fa-chevron-circle-down.active {
  display: block;
  position: relative;
  top: 3%;
  left: 0%;
  z-index: 1;
}
i.fas.fa-bars {
  display: block;
  padding: 10px;
  font-size: 30px;
  color: #fff;
  cursor: pointer;
}
i.fas.fa-bars.disactive {
  display: none;
}
nav {
  position: relative;
  top: 0;
  left: -200%;
  transition: 0.3s;
}
ul {
  display: grid;
  grid-column-gap: 20px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-flow: column;
  justify-content: start;
}
li {
  margin: 0 30px 0 30px;
}
a {
  display: inline-block;
  width: 100%;
  padding: 5px;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
}
nav.active {
  position: relative;
  top: 0;
  left: 0;
  margin: 0 auto;
}
h1 {
  text-transform: capitalize;
  font-size: 3em;
}

Pliki sass powinny kompilować się chyba do jednego pliku css? Zamiast wtyczki użyj raczej jakiegoś narzędzia do automatyzacji pracy np. gulpa. Ostatnio natknąłem się na Parcel.js Banalnie proste narzędzie. Praktycznie nie wymaga konfiguracji. https://parceljs.org

A jeśli nie chcesz bawić się w parcela to właśnie rozwiązałam ten problem inaczej. Powód był w rozszerzeniu które blokowało zapis do folderu. Ten dodatek to: Easy Sass Sprawdź, jeśli masz go zainstalowanego może to być ten problem :) Wiem, że odpowiedź po czasie, ale może ktoś będzie szukał i znajdzie akurat odpowiedź i nie zmarnuje jak ja pół dnia :D