.product-reviews {
  margin-top: 24px;
  padding: clamp(18px, 4vw, 30px);
  border: 1px solid #e4d8c6;
  border-radius: 22px;
  background: linear-gradient(145deg, #fffdf9, #faf1e5);
  color: #382922;
  scroll-margin-top: 100px;
}
.product-reviews-kicker {color: #805d35; font-size: .72rem; font-weight: 800; letter-spacing: .15em}
.product-reviews h2 {margin: 5px 0 8px; font-family: var(--serif); font-size: clamp(1.6rem, 4vw, 2.2rem)}
.product-review-empty, .product-review-form p {margin: 8px 0; color: #615044}
.product-review-score, .product-review-entry-head, .product-review-controls {display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px}
.product-review-score {margin: 12px 0}
.product-review-stars {
  display: inline-block; font: 700 1.35rem/1.15 system-ui; letter-spacing: .05em;
  color: #8b5b12;
  background: linear-gradient(to right, #8b5b12 calc(var(--rating) * 20%), #cdbba4 0);
  background-clip: text; -webkit-text-fill-color: transparent;
}
.product-review-list {display: grid; gap: 8px; margin: 14px 0}
.product-review-entry {padding: 12px 14px; border-radius: 12px; background: #fffdfa; border: 1px solid #eadfce}
.product-review-entry p {margin: 7px 0 0; white-space: pre-wrap; overflow-wrap: anywhere}
.product-review-verified {color: #3c603c; font-size: .8rem; font-weight: 700}
.product-review-compose {margin-top: 18px}
.product-review-compose summary {cursor: pointer; color: #654524; font-weight: 800; width: fit-content; padding: 6px 0}
.product-review-form {display: grid; gap: 8px}
.product-review-form fieldset {min-width: 0; border: 0; margin: 4px 0; padding: 0}
.product-review-form legend, .product-review-form label[for] {font-weight: 700}
.product-review-rating {display: flex; flex-wrap: wrap; gap: 4px}
.product-review-rating label {display: grid; place-items: center; position: relative; width: 44px; height: 44px; cursor: pointer}
.product-review-rating input {position: absolute; opacity: 0; width: 1px; height: 1px}
.product-review-rating span {font-size: 1.75rem; color: #8a7a6b; transition: transform .16s, color .16s}
.product-review-rating label:has(input:checked) span,
.product-review-rating label:has(~ label input:checked) span {color: #8b5b12}
.product-review-rating label:hover span,
.product-review-rating label:has(~ label:hover) span {color: #8b5b12; transform: scale(1.12)}
.product-review-rating label:has(input:focus-visible) {outline: 2px solid #8b5b12; border-radius: 8px}
.product-review-form textarea {width: 100%; resize: vertical; padding: 10px; font: inherit; border-radius: 10px; border: 1px solid #cbbba5; background: #fffdfa}
.product-review-controls a {color: #654524; font-size: .85rem; text-decoration: underline}
.product-review-message:empty {display: none}
.product-review-confirmation {color: #3c603c; font-weight: 700}
@media (prefers-reduced-motion: reduce) {.product-review-rating span {transition: none}}