/* Original screen content, clipped at its source coordinates. */
.archive-screen {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: var(--screen-ratio);
  overflow: hidden;
  background: transparent;
  isolation: isolate;
}

.archive-screen > img {
  position: absolute;
  left: var(--image-left);
  top: var(--image-top);
  width: var(--image-width) !important;
  max-width: none;
  height: auto !important;
  aspect-ratio: 2000 / 840 !important;
  border: 0 !important;
  object-fit: fill !important;
  filter: none;
  transform: none;
}

.archive-screen-tile {
  display: grid;
  align-items: center;
  min-width: 0;
  aspect-ratio: 3 / 2;
  background: #efefeb;
}

.archive-screen-tile .archive-screen {
  max-height: 100%;
  width: auto;
  max-width: 100%;
  height: auto;
}

.archive-screen-tile--portrait .archive-screen {
  width: 42%;
  justify-self: center;
}

.case-screen-gallery .plate {
  max-width: 1200px;
}

.case-screen-gallery .plate--portrait {
  width: min(100%, 520px);
}

.archive-originals {
  margin-top: 48px;
  padding-top: 20px;
  border-top: 1px solid var(--hair);
  font: 12px/1.6 var(--mono);
  color: var(--ink-soft);
}

.archive-originals summary { cursor: pointer; }
.archive-originals ul { margin: 16px 0 0; padding-left: 20px; }
.archive-originals li { margin: 8px 0; }
.archive-originals a { text-decoration: underline; }

/* Physical presentation studies retain their full composition at every width. */
.archive-studies > .section-head { margin-top: 32px; margin-bottom: 16px; }
.archive-studies .plate img {
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
}
