The ampersand

ampersand-can-go-anywhere-pt2.css

/* scss */
#nav {
  li a {
    color: maroon;

    body.admin & { border-bottom: dotted 1px maroon; } // <-- Awesome-sauce right there

    &:hover {
      color: purple;
    }
  }
}

/* output */
#nav li a { color: maroon; }
body.admin #nav li a { border-bottom: dotted 1px maroon; }
#nav li a:hover { color: purple; }

ampersand-can-go-wherever-pt1.css

/* scss */
#nav {
  li a {
    color: maroon;

    &:hover {
      color: purple;
    }
  }
}
body.admin #nav li a { border-bottom: dotted 1px maroon; }

/* output */
#nav li a { color: maroon; }
#nav li a:hover { color: purple; }
body.admin #nav li a { border-bottom: dotted 1px maroon; }

ampersand-to-start.css

/* scss */
#nav {
  li a {
    color: maroon;

    &:hover {
      color: purple;
    }
  }
}


/* output */
#nav li a { color: maroon; }
#nav li a:hover { color: purple; }

quicksand-mixin.css

/* scss */
@mixin quicksandlight() {
  visibility: hidden;
  .wf-active &, .msie.wf-loading &, .msie.wf-inactive &  {
    visibility:visible; 
    font-family: 'QuicksandLight', Arial, sans-serif;
  }
}
#sample span { @include quicksandlight; }

/* output */
#sample span { visibility: hidden; }

.wf-active #sample span, 
.msie.wf-loading #sample span, 
.msie.wf-inactive #sample span {
  visibility: visible;
  font-family: 'QuicksandLight', Arial, sans-serif;
}