Never put code before an ampersand when using SCSS nesting. Therein lies madness.

innocent.html

<div class="wrap">
  <div class="bar">
    <div class="foo">Text!</div>
  </div>
</div>

madness.scss

// this looks safe
.foo {
  .bar & {
    color: red;
  }
} // .bar .foo { color: red; } \(^.^)/


// until you need to wrap all your selectors in a namespaced container
.wrap {
  .foo {
    .bar & {
      color: red;
    }
  }  
} // .bar .wrap .foo { color: red; } （╯°□°）╯︵ ┻━┻