.project-detail > div,
.project-points li > span { min-width: 0; }

html:is([lang="ja"],[lang="zh-Hans"]) :is(.page-hero,.project-detail) { word-break: normal; }
.project-detail :is(h2,.project-kind,.project-description,.project-points) { overflow-wrap: anywhere; }

.project-detail .project-gallery { grid-column: 1 / -1; min-width: 0; }
.project-gallery summary {
  cursor: pointer;
  color: var(--gold-light);
  border: 1px solid var(--line);
  border-radius: .5rem;
  padding: .8rem 1rem;
}
.project-gallery summary:hover { border-color: var(--gold-light); }
.project-gallery summary small { margin-inline-start: .5rem; }
.project-gallery ol { display: grid; gap: 1rem; list-style: none; margin: 1rem 0 0; padding: 0; }
.project-gallery a { display: block; }
.project-gallery img { display: block; width: 100%; height: auto; border-radius: .5rem; }

@media (min-width: 581px) and (max-width: 1050px) {
  .project-detail {
    grid-template-columns: 2.5rem minmax(0, 1fr);
    column-gap: 1.5rem;
    row-gap: 1rem;
  }

  .project-detail > div { grid-column: 2; }
}