/* Public gallery and batch overview. Cards follow .other in public.css; --fl-solid/--fl-tint come from the flavour. */

.pub:has(.galpage) { max-width: 960px; }
.galpage__title { font: 600 clamp(34px, 9vw, 48px)/1.05 var(--font-display); letter-spacing: -0.02em; margin: 4px 0 0; }
.galpage__lead { margin: 8px 0 20px; color: var(--color-text-secondary); text-wrap: pretty; }
.public .galpage__back { display: inline-flex; margin-bottom: 8px; font-weight: 600; text-decoration: none; }
.galpage__empty { padding: var(--space-5); text-align: center; color: var(--color-text-secondary); }

.galhero { padding-bottom: 4px; }
.galhero__lockup { color: var(--color-text-primary); margin-bottom: 12px; }

.galgroup { margin-bottom: 22px; }
.galgroup h2 { font: 600 19px/1.25 var(--font-display); margin: 0 0 10px; }
.public .galgroup h2 a { color: var(--color-text-primary); text-decoration: none; }

.gal { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.public .gal__card { border-radius: var(--radius-lg); padding: 14px; min-height: 148px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; background: var(--fl-tint); color: var(--color-text-primary); }
.gal__card .flavor-icon { color: var(--fl-solid); }
.gal__card b { font: 600 17px/1.2 var(--font-display); overflow-wrap: anywhere; }
.gal__card span { font-size: var(--font-size-sm); color: var(--color-text-secondary); margin-top: auto; }
.public .gal__card .score { margin-top: 0; color: var(--color-text-primary); }
.public .gal__card .score span { margin-top: 0; }

@media (min-width: 700px) {
  .gal { grid-template-columns: repeat(3, 1fr); gap: 14px; }
}
@media (min-width: 960px) {
  .gal { grid-template-columns: repeat(4, 1fr); }
}