.filter-bar {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
  padding-block: var(--sp-6);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.filter-chip {
  padding: 0.55em 1.2em;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-border-strong);
  font-size: var(--fs-body-sm);
  letter-spacing: var(--ls-normal);
  color: var(--color-ink-muted);
  white-space: nowrap;
  transition: border-color var(--dur-fast), color var(--dur-fast), background var(--dur-fast);
}
.filter-chip:hover { border-color: var(--color-gold); color: var(--color-ink); }
.filter-chip[aria-pressed="true"] { background: var(--color-gold); border-color: var(--color-gold); color: var(--color-on-gold); font-weight: 600; }

.gallery-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-5);
  padding-block: var(--sp-8);
}
.gallery-item { text-decoration: none; }
.gallery-item[hidden] { display: none; }
.gallery-item__meta { margin-top: var(--sp-4); display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-3); }
.gallery-item__meta h4 { color: var(--color-ink); }
.gallery-empty { padding-block: var(--sp-8); text-align: center; display: none; }
.gallery-empty.is-visible { display: block; }

@media (min-width: 640px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }