Combinación de secuencias de selectores en @extend en SASS

Si necesitamos combinar secuencias de selectores, también usamos la directiva @extend:

Consideremos el siguiente ejemplo:

#main .list p {
	font-weight: bold;
}
#sub .resume .link {
	@extend p;
}

Preste atención al código compilado en el archivo css, al combinar dos secuencias que no tienen selectores comunes, se forman automáticamente nuevos selectores: uno con la primera secuencia antes de la segunda y uno con la segunda secuencia antes de la primera:

#main .list p,
#main .list #sub .resume .link, #sub .resume #main .list .link {
	font-weight: bold;
}

En el caso de que las secuencias tengan un selector común, se combinarán y solo se alternarán las diferencias (si las hay). En el siguiente ejemplo, ambas secuencias tienen el identificador #main:

#main .list p {
	font-weight: semi-bold;
}
#main .resume .link {
	@extend p;
}

Como resultado de la compilación, estos dos identificadores se combinarán:

#main .list p,
#main .list #sub .resume .link, #sub .resume #main .list .link {
	font-weight: bold;
}

Explique cuál será el resultado de la compilación del siguiente código:

div p {
	font-size: 12px;
	padding-bottom: 4px;
}
link button #card-title {
	@extend p;
}