/* 06 — ARCHIVE
   A museum wall. Gallery grey, a framed and matted print, and the
   setup set small and quiet as a wall label. The letter is the
   transcription card: white, square, unhurried. The quietest system. */

.sys-archive {
  --ground: #E8E6E1;
  --ink: #1F1E1C;
  --ink-soft: rgba(31, 30, 28, .60);

  --pad-x: 86px;
  --pad-y: 84px;

  --setup-font: 'Inter', sans-serif;
  --setup-size: 42px;
  --setup-lh: 1.56;
  --setup-weight: 400;
  --setup-track: -.1px;
  --setup-measure: 700px;

  --cue-font: 'Inter', sans-serif;
  --cue-size: 36px;
  --cue-weight: 400;

  --letter-font: 'Spectral', Georgia, serif;
  --letter-size: 37px;
  --letter-lh: 1.58;
  --letter-gap: 30px;
  --letter-measure: 780px;
  --sheet-pad-x: 128px;
  --sheet-pad-y: 120px;

  --after-font: 'Inter', sans-serif;
  --after-size: 44px;
  --after-lh: 1.5;
  --after-weight: 400;
  --after-gap: 44px;
  --after-track: -.2px;

  --blank-hi: #CFCCC4; --blank-mid: #8C8880; --blank-lo: #33312D;
}

.sys-archive.cover { background: #E8E6E1; }

/* framed, wide mat, hung */
.sys-archive .photo {
  left: 50%; bottom: 148px;
  width: 634px; height: 562px;
  transform: translateX(-50%);
  border: 54px solid #FBFAF7;
  box-shadow:
    0 0 0 3px #2B2A28,
    0 26px 54px rgba(0, 0, 0, .16);
  overflow: visible;
}
.sys-archive .photo img { position: relative; }
.sys-archive .photo img.p-a { filter: grayscale(.12) contrast(1.02); }

.sys-archive.letter { background: #E8E6E1; }
.sys-archive .letter-sheet {
  --sheet-bg: #FCFBF9;
  position: absolute;
  inset: 62px;
  width: auto; height: auto;
  border: 1px solid rgba(31, 30, 28, .16);
}
.sys-archive .letter-sheet .deco {
  background-image: var(--grain-url);
  background-size: 220px 220px;
  opacity: .05;
  z-index: 2;
}
.sys-archive .blk-sig { color: rgba(31, 30, 28, .74); }