/*
 * One definition of a star, for every surface that prints one.
 *
 * The shapes come from `cooking/_stars.html`, which the recipe page, the review
 * cards, the make history and every card in the catalogue include. ONE
 * definition is the property that matters: an aggregate on a card and the
 * identical aggregate on the recipe page must not drift apart in ink, size or
 * spacing.
 *
 * A SHEET OF ITS OWN rather than four declarations inside `cooking-panel.css`,
 * because the catalogue needs exactly these and nothing else from that file --
 * it has no panel, no picker and no controls, and was downloading 700-odd lines
 * of them to draw a row of stars. The panel's surfaces link both.
 *
 * Ink (`currentColor` inherited from the body colour), never the flame accent:
 * DESIGN.md reserves flame for the scale stepper, batch controls and aisle
 * indices, and a field of flame stars next to an oxblood Delete makes the two
 * reds read as one family. The half star carries no rule at all -- it is a
 * second PATH filled inline (`cooking/_star_shape.html` says why).
 */

.cooking-stars {
  display: inline-flex;
  gap: 0.125rem;
}

.cooking-star {
  color: var(--bs-body-color);
  vertical-align: middle;
}