.progress-bar{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"label-start bar label-end";align-items:center;width:100%;grid-gap:1.75rem;gap:1.75rem}@media only screen and (max-width: 560px){.progress-bar{grid-template-columns:1fr 1fr;grid-template-areas:"label-start label-end" "bar bar";gap:.125rem}}.progress-bar__label{font-size:1rem;font-weight:300;color:var(--color-gray--dark)}@media only screen and (max-width: 560px){.progress-bar__label{font-weight:400;text-align:center}}.progress-bar__label--start{text-align:left;grid-area:label-start}@media only screen and (max-width: 560px){.progress-bar__label--start{margin-left:10px;margin-right:10px;text-align:left}}.progress-bar__label--end{text-align:right;grid-area:label-end}@media only screen and (max-width: 560px){.progress-bar__label--end{margin-left:10px;margin-right:10px;text-align:right}}.progress-bar__wrapper{position:relative;flex-grow:1;height:10px;margin-left:10px;margin-right:10px;background-color:var(--color-bg--darken);border-radius:5px;grid-area:bar}@media only screen and (max-width: 560px){.progress-bar__wrapper{margin-top:.5rem;margin-bottom:.5rem}}.progress-bar__fill{position:relative;height:100%;background:linear-gradient(90deg,var(--color-start),var(--color-middle),var(--color-end));border-radius:5px;transition:width .3s ease-in-out;overflow:hidden}.progress-bar__fill:after{position:absolute;top:0;left:-50%;content:"";width:50%;height:100%;background:linear-gradient(120deg,#fff0,#fff6,#fff0);animation:shimmer 2s infinite}.progress-bar__value{position:absolute;top:-9px;padding:.25rem .75rem;background-color:var(--color-end);border-radius:1rem;font-size:.85rem;font-weight:500;line-height:1.5;color:var(--color-white);white-space:nowrap;transform:translate(-50%)}@keyframes shimmer{0%{left:-50%}to{left:100%}}
