Crea una hermosa línea horizontal solo con CSS

Hay un tutorialaquí sobre cómo hacer esto en photoshop:

Estoy tratando de hacer esto solo con CSS. Cuanto más cerca puedo estar en estoviolín.

hr.fancy-line { 
    border: 0; 
    height: 1px; 
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(215,215,215,0.75), rgba(0,0,0,0)); 
    background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(215,215,215,0.75), rgba(0,0,0,0)); 
    background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(215,215,215,0.75), rgba(0,0,0,0)); 
    background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(215,215,215,0.75), rgba(0,0,0,0)); 
    box-shadow: 0px -2px 4px rgba(136,136,136,0.75);
}
<hr class="fancy-line"></hr>

Hacer un gradiente en la sombra parece bastante difícil. ¿Alguna idea de cómo podría mejorar esto?

Respuestas a la pregunta(3)

Su respuesta a la pregunta