/* ==========================================================
   KidSitter Star Ratings (kidsitter-stars.css)
   Per-star fractional fill using SVG overlay clipping.
   ========================================================== */
.ks-star-rating {
  display: inline-flex;
  gap: 0.0625rem;
  vertical-align: middle;
  line-height: 1;
}
.ks-star-unit {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
}
.ks-star-clip {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
.ks-star-empty {
  fill: hsl(200, 15%, 88%);
}
.ks-star-gold {
  fill: var(--ks-primary);
}
/* Size variants */
.ks-star-rating-sm svg { width: 0.875rem; height: 0.875rem; }
.ks-star-rating svg,
.ks-star-rating-md svg { width: 1.125rem; height: 1.125rem; }
.ks-star-rating-lg svg { width: 1.25rem; height: 1.25rem; }