.custom-result-rating { margin: 12px 0 16px; }
.custom-result-rating fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.custom-result-rating legend { padding: 0; margin-bottom: 3px; }
.custom-result-rating-options { display: flex; flex-wrap: wrap; gap: 2px; }
.custom-result-rating-choice { position: relative; display: inline-grid; place-items: center; width: 44px; min-height: 44px; margin: 0; border-radius: 6px; color: var(--muted); cursor: pointer; }
.custom-result-rating-choice input { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; opacity: 0; cursor: inherit; }
.custom-result-rating-choice > span:not(.sr-only) { display: block; pointer-events: none; }
.custom-result-rating-choice svg { display: block; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform 180ms ease, color 180ms ease; }
.custom-result-rating-choice.is-filled { color: var(--accent); }
.custom-result-rating-choice.is-filled svg { fill: currentColor; }
.custom-result-rating-choice:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
.custom-result-rating-choice:has(input[aria-disabled=true]) { cursor: wait; opacity: .6; }
.custom-result-rating > p { margin: 4px 0; overflow-wrap: anywhere; }
.custom-result-rating > button { min-height: 44px; }
.custom-result-rating-choice:has(input:focus-visible) svg { transform: translateY(-2px) scale(1.1); }
.custom-result-rating-choice:has(input:active) svg { transform: scale(.9); }
@media (hover: hover) and (pointer: fine) {
  .custom-result-rating-choice:hover { background: var(--hover); }
  .custom-result-rating-choice:hover svg { transform: translateY(-2px) scale(1.1); }
}
@media (prefers-reduced-motion: reduce) {
  .custom-result-rating-choice svg { transition: none; }
  .custom-result-rating-choice:is(:hover, :has(input:focus-visible), :has(input:active)) svg { transform: none; }
}
@media (forced-colors: active) {
  .custom-result-rating-choice.is-filled { color: Highlight; }
  .custom-result-rating-choice:has(input:checked) { outline: 2px solid Highlight; outline-offset: -2px; }
}

.custom-rating-launcher { margin: 12px 0 16px; }
.custom-rating-open { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 44px; text-align: left; }
.custom-rating-open .rating-visual { --rating-star-size: 20px; --rating-star-gap: 2px; }
.custom-rating-open-label { overflow-wrap: anywhere; }
.custom-rating-dialog { width: min(27rem, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); padding: 0; overflow: hidden; }
.custom-rating-dialog[open] { display: flex; flex-direction: column; }
.custom-rating-dialog > .dialog-heading { flex: none; margin: 0; padding: 6px 10px 6px 14px; gap: 4px; }
.custom-rating-dialog > .dialog-heading h2 { flex: 1; min-width: 0; margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
.custom-rating-dialog > .dialog-heading .icon-button { flex: none; width: 44px; min-height: 44px; }
.custom-rating-dialog-refresh svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.custom-rating-dialog-refresh[aria-disabled=true] { opacity: .55; cursor: wait; }
.custom-rating-dialog-body { min-height: 0; padding: 0 16px 16px; overflow-y: auto; overscroll-behavior: contain; }
.custom-rating-dialog p { margin: 6px 0; overflow-wrap: anywhere; }
.custom-rating-dialog .custom-rating-dialog-title { margin: 0 0 16px; font-size: 1rem; font-weight: 600; line-height: 1.45; }
.custom-rating-dialog h3, .custom-rating-dialog legend { margin: 0 0 6px; padding: 0; font-size: .8125rem; font-weight: 500; color: var(--muted); }
.custom-rating-dialog-community { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: .875rem; line-height: 1.5; }
.custom-rating-dialog-community .rating-visual { --rating-star-size: 19px; --rating-star-gap: 2px; }
.custom-rating-dialog-distribution { margin-top: 4px; font-size: .8125rem; }
.custom-rating-dialog-distribution summary { width: fit-content; max-width: 100%; min-height: 36px; align-content: center; cursor: pointer; color: var(--muted); }
.custom-rating-dialog-distribution ol { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; column-gap: 10px; list-style: none; padding: 0; margin: 4px 0 12px; font-variant-numeric: tabular-nums; }
.custom-rating-dialog-distribution li { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; align-items: center; min-height: 26px; }
.custom-rating-dialog-distribution li > :first-child { white-space: nowrap; }
.custom-rating-dialog-distribution li > :last-child { text-align: right; }
.custom-rating-dialog-distribution meter { width: 100%; height: 6px; border: 0; background: var(--line); }
.custom-rating-dialog-distribution meter::-webkit-meter-bar { height: 6px; border: 0; background: var(--line); }
.custom-rating-dialog-distribution meter::-webkit-meter-optimum-value { background: var(--accent); }
.custom-rating-dialog-distribution meter::-moz-meter-bar { background: var(--accent); }
.custom-rating-dialog-editor { min-width: 0; border: 0; margin: 20px 0 0; padding: 0; }
.custom-rating-dialog .custom-rating-dialog-selection { margin: 0 0 4px; font-size: 1rem; font-variant-numeric: tabular-nums; font-weight: 600; }
.custom-rating-dialog-options { display: grid; grid-template-columns: repeat(5, minmax(44px, 1fr)); gap: 2px; max-width: 20rem; }
.custom-rating-dialog-choice { position: relative; display: grid; place-items: center; min-width: 44px; min-height: 52px; margin: 0; color: var(--muted); border-radius: 6px; cursor: pointer; }
.custom-rating-dialog-choice input { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; opacity: 0; cursor: inherit; }
.custom-rating-dialog-choice > span:not(.sr-only) { display: block; pointer-events: none; }
.custom-rating-dialog-choice svg { display: block; width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform 160ms ease, color 160ms ease; }
.custom-rating-dialog-choice.is-filled { color: var(--accent); }
.custom-rating-dialog-choice.is-filled svg { fill: currentColor; }
.custom-rating-dialog-choice:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: -2px; }
.custom-rating-dialog-choice:has(input:focus-visible) svg { transform: translateY(-2px) scale(1.06); }
.custom-rating-dialog-choice:has(input[aria-disabled=true]) { cursor: wait; opacity: .65; }
.custom-rating-dialog .custom-rating-dialog-preview { min-height: 1.5em; margin-top: 5px; }
.custom-rating-dialog .custom-rating-dialog-explanation { margin-top: 16px; }
.custom-rating-dialog-status, .custom-rating-dialog-error { line-height: 1.5; }
.custom-rating-dialog-retry { min-height: 44px; }
.custom-rating-dialog-retry[aria-disabled=true] { cursor: wait; opacity: .65; }
@media (hover: hover) and (pointer: fine) {
  .custom-rating-dialog-choice:hover { background: var(--hover); }
  .custom-rating-dialog-choice:hover svg { transform: translateY(-2px) scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
  .custom-rating-dialog-choice svg { transition: none; }
  .custom-rating-dialog-choice:is(:hover, :has(input:focus-visible)) svg { transform: none; }
}
@media (forced-colors: active) {
  .custom-rating-dialog-choice.is-filled { color: Highlight; }
  .custom-rating-dialog-choice:has(input:checked) { outline: 2px solid Highlight; outline-offset: -2px; }
}
