/* -------------------------------------------------------- */

/* @group @ranking-count */

[class*="a-ranking-count"] {
box-sizing: border-box;
position: relative;
z-index: 11;
overflow: hidden;
display: grid;
justify-content: center;
align-items: center;
width: 1.875rem;
height: 1.875rem;
background-color: hsla(337.3, 60.1%, 60%, .75);
border-radius: 50%;
font-size: .875rem;
text-transform: uppercase;
color: var(--color-white);
font-weight: 300;
font-variation-settings: "wght" 300;
text-align: center;
}

[class="a-ranking-count-one"],
[class="a-ranking-count-1"],
[class="a-ranking-count-two"],
[class="a-ranking-count-2"],
[class="a-ranking-count-three"],
[class="a-ranking-count-3"] {
width: 2.25rem;
height: 2.25rem;
border-radius: 0;
box-shadow: inset 0 .375rem 0 hsla(0, 0%, 0%, .25);
-webkit-clip-path: polygon(0% 0%, 100% 0, 100% 100%, 50% calc(100% - .375rem), 0% 100%);
clip-path: polygon(0% 0%, 100% 0, 100% 100%, 50% calc(100% - .375rem), 0% 100%);
}

[class="a-ranking-count-one"],
[class="a-ranking-count-1"] {
background-color: hsla(46, 59%, 42.5%, 1);
}

[class="a-ranking-count-two"],
[class="a-ranking-count-2"] {
background-color: hsla(226, 3%, 67.5%, 1);
}

[class="a-ranking-count-three"],
[class="a-ranking-count-3"] {
background-color: hsla(30, 61%, 50%, 1)
}

/* @end @a-ranking-count */