@media screen and (max-width: 767px) {
  html { min-width: 0; }
  body { box-sizing: border-box; min-height: 0; padding: 0 16px; }
  body img { max-width: 100%; height: auto; }

  #navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 8px;
    margin: 0 -16px;
    padding: 5px 8px;
  }
  #navigation li { display: block; padding: 0; }
  #navigation li.selected { background: none; border-bottom: 2px solid #d8aa92; }
  #navigation a { display: block; padding: 8px 5px; font-size: 11px; }

  #titles { position: relative; min-width: 0; padding: 18px 0 24px; }
  #titles .fork-mark { width: min(42vw, 160px); height: auto; }
  #titles h1 { font-size: clamp(24px, 8vw, 38px); }
  #titles h2 { max-width: 22rem; margin: 8px auto 0; font-size: 16px; line-height: 1.35; }
  #welcome #titles::before { top: 0; width: 96%; height: 220px; }
  #os-notice { margin-bottom: 0; }

  .column, .wide.column, .left, .middle, .right {
    float: none;
    clear: none;
    width: auto;
    max-width: none;
    margin-left: 0;
  }
  .section > .column { margin-bottom: 24px; }
  .welcome-intro { display: flex; flex-direction: column; }
  .welcome-intro > .middle { order: -1; padding-top: 20px; }
  .welcome-intro > .column { margin-bottom: 24px; }
  .strip { margin: 24px -16px; padding: 22px 16px; }
  .strip + .strip { margin-top: -24px; }
  #bundled-game-covers { display: block; max-width: 100%; margin: 10px auto; }

  #screenshots .thumbnails {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    min-width: 0;
    margin: 0 0 20px;
    padding: 0;
  }
  #screenshots .thumbnails li { display: block; width: calc(50% - 6px); }
  #screenshots .thumbnails a { display: block; min-width: 0; min-height: 0; margin: 0; line-height: normal; }
  #screenshots .thumbnails img { width: 100%; height: auto; }
  #screenshots .linked small { position: static; visibility: visible; display: block; width: auto; margin-top: 5px; }
  #screenshots h3 { margin-top: 0; }
  #downloads .thumbnails { padding-bottom: 0; }
  #downloads .linked li:first-child { margin-left: 0; }

  #version-history > li { padding: 20px 0; }
  #version-history > li.latest { margin: 0 -16px; padding: 20px 16px; }
  .metadata { float: none; width: auto; margin: 0 0 16px; text-align: left; }
  .metadata h3 small { margin-left: 0; }
  #version-history, .column { overflow-wrap: break-word; }
  #designer { padding: 18px 0 32px; }
  #designer img { width: 80px; margin: 0 auto 6px; }
}
