.gallery-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr);
  gap: var(--space-2);
  margin: 0;
  padding: var(--space-3) 0;
  border: 0;
  border-block: 1px solid var(--gray-line);
  min-inline-size: 0;
}

.gallery-filter {
  display: grid;
  align-content: start;
  gap: var(--space-1);
  min-width: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-meta);
}

.gallery-filter label { color: var(--ink); font-weight: 600; }

.gallery-filter select {
  width: 100%;
  min-height: calc(var(--space-4) + var(--space-1));
  padding: var(--space-1) var(--space-2);
  border: 1px solid var(--gray-line);
  border-radius: 0;
  background-color: var(--white);
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}

.gallery-filter select:disabled { color: var(--gray); cursor: default; }

.gallery-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-1) var(--space-3);
  margin-block: var(--space-2) var(--space-4);
  font-family: var(--font-sans);
  font-size: var(--fs-meta);
}

.gallery-summary p { margin: 0; }
.gallery-playback-note { color: var(--gray); }
.gallery-results:empty { min-block-size: calc(var(--space-6) * 4); }
.gallery-group + .gallery-group { margin-top: var(--space-5); }
.gallery-group h3 { margin: 0 0 var(--space-1); }

.gallery-context {
  max-width: var(--reading);
  margin: 0 0 var(--space-3);
  font-size: var(--fs-meta);
  font-family: var(--font-sans);
  line-height: 1.65;
  color: var(--gray);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  align-items: start;
}

.gallery-grid--comparison,
.gallery-grid[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery-grid[data-count="1"] { grid-template-columns: minmax(0, 1fr); max-width: var(--reading); }
.gallery-clip { margin: 0; min-width: 0; }

.gallery-clip video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background: var(--dark-mat);
  border: 1px solid var(--gray-line);
}

.gallery-grid--real video { aspect-ratio: 1; }

.gallery-clip figcaption {
  display: grid;
  gap: 0;
  padding: var(--space-1) 0 0;
  border: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-meta);
  line-height: 1.65;
  color: var(--gray);
}

.gallery-clip figcaption strong { color: var(--ink); font-weight: 600; }
.gallery-media-error, .gallery-status { font-family: var(--font-sans); font-size: var(--fs-meta); color: var(--ink); }
.gallery-media-error { margin: var(--space-1) 0 0; }
.gallery-status { margin: var(--space-2) 0; }

@media (max-width: 960px) {
  .gallery-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .gallery-filters { grid-template-columns: minmax(0, 1fr); }
  .gallery-summary { margin-bottom: var(--space-3); }
  .gallery-grid, .gallery-grid[data-count="2"] { grid-template-columns: minmax(0, 1fr); }
  .gallery-results:empty { min-block-size: calc(var(--space-6) * 3); }
}