Can I check if one attribute is equal to another in CSS?

Question

I have the following basic component which I am styling:

<progress value="60" max="100" />

I am trying to style it in a special way when the value is equal to the max.

Here is what I tried:

progress {
  -webkit-appearance: none;
}

progress::-webkit-progress-value {
  background-color: #0000ff;
}

progress[value=attr(max "100")]::-webkit-progress-value {
  background-color: #00ff00;
}

The idea is that this will be green when complete, and blue when loading.

However, this doesn't seem to change the color. When I switch this line, it works:

progress[value="100"]::-webkit-progress-value {

In CSS, would there be a way to create a selector that compares two values like this?