/* Shared by every page: plain navy titles, muted descriptions, simple work-credit lines. */

/* Titles: use the header/footer navy. Page rules that set their own colour still win. */
:where(h1, h2, h3, h4) { color: #15256d; }
:where(header, footer) :where(h1, h2, h3, h4) { color: inherit; }

/* Back link above a page title. */
.project-page-link h3 a { font-size: 0.95rem; display: inline-block; padding: 0.4rem 0.5rem; }

/* Page title block: description lines and numbered lists. */
.page-header > h2 { color: #15256d; max-width: 46rem; margin: 0 auto; text-align: center; }
.page-header > h3, .page-header > p { color: #3b4a7a; font-weight: 500; line-height: 1.6; max-width: 44rem; margin: 0 auto; text-align: center; }
.page-header > ol, .temple-gamestate-blurb ol { color: #2b3560; line-height: 1.6; max-width: 44rem; margin: 0 auto 1rem; text-align: left; }

/* Work credits: <div class="credits"><div class="credit"><span class="credit-role">Role</span><span class="credit-name">Name</span></div></div> */
.credits { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.15rem 1.5rem; margin: 0.25rem auto 1rem; padding: 0; max-width: 56rem; font-family: 'Lato', sans-serif; font-size: 0.95rem; line-height: 1.5; }
.credit { display: inline; margin: 0; padding: 0; background: none; border: 0; box-shadow: none; color: #3b4a7a; }
.credit-role::after { content: ":"; }
.credit-role { font-weight: 400; }
.credit-name { font-weight: 700; color: #15256d; margin-left: 0.3rem; }
@media (max-width: 768px) { .credits { flex-direction: column; align-items: center; gap: 0; } }

/* Top navigation: fit four links on the narrowest phones and give them a comfortable tap height. */
.nav-bar ul { margin: 0; padding: 0; }
.nav-bar a { display: block; padding: 0.5rem 0; }
@media (max-width: 480px) {
  .nav-bar { padding: 0 0.5rem; }
  .nav-bar li { padding: 0 0.5rem; }
}

/* Dropdown cards (styled by js/concise.js): keep the title, line count and +/- button inside the card on narrow phones. */
@media (max-width: 480px) {
  html details.cz-dd > summary { padding-left: 0.75rem; padding-right: 0.75rem; gap: 0.5rem; }
  html details.cz-dd > summary small { margin-left: 0.3rem; }
}