/* /popular page — 3-column, archive-style card grid with star ratings.
   Mirrors the theme's category layout (body.llk-cardgrid, 3 columns) and the
   archive rating row, so a plain Page gets the same look without theme edits.
   Loaded only when [llk_popular] is on the page. Star colour comes from the
   theme's global `.llk-card .stars` rule; theme CSS vars are reused. */

.llk-popular-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(22px, 2.6vw, 34px);
}
@media (max-width: 900px) {
  .llk-popular-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .llk-popular-grid { grid-template-columns: 1fr; max-width: 440px; margin-inline: auto; }
}

/* Rating row — same treatment the archive cards get (body.llk-cardgrid). */
.llk-popular-grid .llk-card-rating {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 10px 0 0;
  font-size: 13px;
  font-weight: 600;
}
.llk-popular-grid .llk-card-rating .stars { letter-spacing: 1px; font-size: 14px; }
.llk-popular-grid .llk-card-rating .cnt { color: var(--llk-muted); font-weight: 500; }