/* Keep the archived desktop styling; adapt only narrow viewports. */
.mobile-back { display: none; }

@media (max-width: 700px) {
  #entry-page { max-width: 100%; }
  #entry-page table {
    width: 100%;
    max-width: 800px;
    height: auto;
    table-layout: fixed;
  }
  #entry-page td:first-child { width: 64%; }
  #entry-page td:last-child { width: 36%; }
  #entry-page img { max-width: 100%; height: auto; }
  #entry-page tr:first-child td { height: auto; }
  #entry-page tr:last-child font[size="6"] { font-size: 20px; }
  #enter-site {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 8px;
    box-sizing: border-box;
  }
}

@media (max-width: 600px) {
  body { -webkit-text-size-adjust: 100%; }
  .archive-header p { margin: 6px 0; }
  .archive-header img { max-width: calc(100% - 16px); height: auto; }
  .archive-header #music-toggle {
    min-height: 40px;
    padding: 6px 12px !important;
    font-size: 14px !important;
  }

  /* Same four menu choices in their original two-by-two order. */
  #main-navigation { width: 100%; height: auto; margin: 24px auto; }
  #main-navigation tbody {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px 12px;
    align-items: center;
  }
  #main-navigation tr { display: contents; }
  #main-navigation td { display: block; width: auto; text-align: center; }
  #main-navigation tr:first-child td:nth-child(1) { grid-area: 1 / 1; }
  #main-navigation tr:first-child td:nth-child(2) { grid-area: 2 / 1; }
  #main-navigation tr:first-child td:nth-child(3) { grid-area: 1 / 2; }
  #main-navigation tr:first-child td:nth-child(4) { grid-area: 2 / 2; }
  #main-navigation tr:last-child td:nth-child(1) { grid-area: 3 / 1; margin-top: 20px; }
  #main-navigation tr:last-child td:nth-child(2) { grid-area: 4 / 1; }
  #main-navigation tr:last-child td:nth-child(3) { grid-area: 3 / 2; margin-top: 20px; }
  #main-navigation tr:last-child td:nth-child(4) { grid-area: 4 / 2; }
  #main-navigation img { max-width: 100%; height: auto; }
  #main-navigation a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }

  #shop-gallery tbody {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px 8px;
    align-items: center;
  }
  #shop-gallery tr { display: contents; }
  #shop-gallery td { display: block; height: auto; min-width: 0; }
  #shop-gallery img { max-width: 100%; height: auto; }
  #shop-gallery span { max-width: 100%; }
  #photo-viewer { padding: 8px !important; }
  #photo-close { min-height: 44px; min-width: 72px; font-size: 16px; }

  .mobile-back {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 8px;
    font: 16px "Comic Sans MS", sans-serif;
    color: #5B185B;
  }
  .archive-content > p img { max-width: 100%; height: auto; }
}