/* Each earnings tier has its own real paint mark, in the tier's inherited ink. */
.heat-negative,.band-negative{--earnings-mark:url("assets/graffiti/graffiti-51.png")}
.heat-1,.band-1{--earnings-mark:url("assets/graffiti/graffiti-43.png")}
.heat-2,.band-2{--earnings-mark:url("assets/graffiti/graffiti-14.png")}
.heat-3,.band-3{--earnings-mark:url("assets/graffiti/graffiti-26.png")}
.heat-4,.band-4{--earnings-mark:url("assets/graffiti/graffiti-10.png")}
.heat-5,.band-5{--earnings-mark:url("assets/graffiti/graffiti-19.png")}
.day{position:relative;isolation:isolate;overflow:hidden}
.day::before,html[data-palette="glow"] .day:not(.heat-0)::before{display:none}
.day:not(.heat-0):not(.band-0)::after,
html[data-palette="glow"] .day:not(.heat-0)::after{
  content:"";display:block;position:absolute;z-index:-1;pointer-events:none;
  width:72%;height:80%;right:-10%;bottom:-13%;border:0;border-radius:0;
  background:currentColor;-webkit-mask:var(--earnings-mark) center / contain no-repeat;
  mask:var(--earnings-mark) center / contain no-repeat;opacity:.16;transform:rotate(-12deg);
}
.day.heat-3::after,.day.band-3::after,html[data-palette="glow"] .day.heat-3::after{right:-8%;bottom:-10%;transform:rotate(-30deg);width:72%}
.day.heat-4::after,.day.band-4::after,html[data-palette="glow"] .day.heat-4::after{height:95%;right:-15%;bottom:-19%;opacity:.2}
.day.heat-5::after,.day.band-5::after,html[data-palette="glow"] .day.heat-5::after{width:86%;height:93%;right:-16%;bottom:-20%;opacity:.22}
.day.heat-0::after,.day.band-0::after{display:none}
@media(max-width:680px){
 .day:not(.heat-0):not(.band-0)::after,html[data-palette="glow"] .day:not(.heat-0)::after{opacity:.1;right:-18%;bottom:-18%}
}