.collection-empty{text-align:center;border:3px dashed var(--ink);border-radius:22px;background:#fff4d8;padding:55px 24px;margin-top:12px;box-shadow:7px 8px 0 #25201820}.collection-empty[hidden],.collection-error[hidden]{display:none}.collection-empty h3{font-size:clamp(24px,4vw,44px);letter-spacing:-.055em;margin:6px auto 13px;line-height:1.08}.collection-empty p{max-width:570px;margin:0 auto 20px;font-size:17px}.empty-pie{display:block;font-size:72px}.nft-image{width:100%;height:100%;object-fit:cover;display:block}.nft-link{display:inline-flex;margin-top:15px;background:#252018;color:#fff;padding:10px 17px;border-radius:30px;text-decoration:none;font-weight:900;font-size:12px}.collection-error{padding:24px;border:2px solid #ae3f31;border-radius:15px}

.card { position: relative; }
.card .nft-link { margin-inline-start: 12px; cursor: pointer; font: inherit; }
.card .nft-link::after { content: ""; position: absolute; inset: 0; }
.card:focus-within { outline: 3px solid var(--ink); outline-offset: 4px; }
.nft-viewer { width: min(46rem, 94vw); max-height: 90vh; margin: auto; padding: clamp(1rem, 4vw, 2rem); border: 2px solid var(--ink); border-radius: 20px; background: var(--cream); color: var(--ink); overflow: auto; overflow-wrap: anywhere; }
.nft-viewer::backdrop { background: rgb(25 21 17 / 75%); }
.viewer-header, .viewer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.viewer-header { justify-content: space-between; }
.viewer-header h2 { font-size: clamp(1.75rem, 5vw, 3rem); margin: 0; }
.viewer-art { display: block; width: auto; max-width: 100%; border: 3px solid #000; max-height: 54vh; object-fit: contain; margin: 1rem auto; }
.viewer-metadata { margin: 1rem 0; }
.viewer-metadata dt { font-weight: bold; }
.viewer-metadata dd { margin: .25rem 0 1rem; }

/* A compact gallery caption under the artwork. */
.card .card-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 10px;
  padding: 10px 14px;
}
.card-content .number { grid-column: 1 / -1; }
.card .card-content h3 { margin: 0; font-size: 21px; overflow-wrap: anywhere; }
.card-content .status { justify-self: end; padding: 2px 7px; }
.card .card-content p { min-height: 0; margin: 0; line-height: 1.3; }
.card .card-content .nft-link {
  grid-column: 2;
  justify-self: end;
  margin: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  padding: 3px 0;
  font-size: 13px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Let the section introduction use the same width as the gallery. */
#collection .section-heading .intro { max-width: none; }
