.mz-rating { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; width: fit-content; max-width: 100%; color: var(--mz-ink); font-family: var(--mz-font); font-size: 1.4rem; line-height: 1.4; text-decoration: none; }
.mz-rating__stars { display: inline-flex; flex-shrink: 0; gap: .1rem; }
.mz-rating__stars svg { display: block; width: 1.8rem; height: 1.8rem; }
.mz-rating__empty { fill: #dce0e4; }
.mz-rating__fill { fill: #df783f; }
.mz-rating__score { font-weight: 700; white-space: nowrap; }
.mz-rating__count { color: var(--mz-steel); white-space: nowrap; }
.mz-rating--link { min-height: 44px; margin-top: .8rem; gap: 1rem; }
.mz-rating--link:hover .mz-rating__count { color: var(--mz-ink); text-decoration: underline; text-underline-offset: .25em; }
.mz-rating--link:focus-visible { outline: 2px solid var(--mz-ink); outline-offset: 4px; border-radius: 2px; }
.mz-rating--compact { margin: .7rem 0; font-size: 1.25rem; gap: .6rem; }
.mz-rating--compact .mz-rating__stars { gap: 0; }
.mz-rating--compact .mz-rating__stars svg { width: 1.7rem; height: 1.7rem; }
@media (max-width: 749px) {
  .mz-rating--compact { column-gap: .5rem; row-gap: .3rem; font-size: 1.15rem; }
  .mz-rating--compact .mz-rating__stars svg { width: 1.5rem; height: 1.5rem; }
}

.mz-rating__demo { flex-basis: 100%; color: #86410b; font-size: 1.1rem; font-weight: 500; line-height: 1.5; }
.mz-rating--link .mz-rating__demo { margin-top: -.6rem; }