@media (max-width: 860px) {
  .site-header {
    padding: 0 14px;
  }

  .search span {
    display: none;
  }

  .search input {
    width: min(44vw, 220px);
  }

  .menu-button {
    display: inline-flex;
  }

  .site-frame {
    display: block;
  }

  .sidebar {
    position: fixed;
    inset: 64px auto 0 0;
    z-index: 25;
    width: min(84vw, 320px);
    transform: translateX(-105%);
    transition: transform 160ms ease;
    box-shadow: var(--shadow);
  }

  body.nav-open .sidebar {
    transform: translateX(0);
  }

  .site-main {
    padding: 30px 18px 56px;
  }

  .content img {
    width: 100%;
    max-width: 100%;
  }

  .home-hero,
  .pager,
  .home-meta {
    grid-template-columns: 1fr;
  }

  .chapter-card {
    min-height: 320px;
  }
}
