/* Responsive additions to the preserved historical layout. */
[role="button"]:focus-visible { outline: 3px solid #f5d800; outline-offset: 4px; }
@media (max-width: 1023px) {
  html, body { min-width: 0; width: 100%; }
  #menu { position: relative; height: auto; }
  #menu .container { display: flex; align-items: center; gap: 12px; }
  #nav { width: auto; max-width: none; flex: 1; margin: 0; }
  #logo { width: 46px; margin: 0; flex-shrink: 0; }
  .navigation { display: flex; flex-wrap: wrap; gap: 4px; float: none; }
  .navigation li { float: none; border: 0; }
  .navigation li::after { content: none; }
  .navigation li a { display: block; padding: 8px; }
  .navigation .textlink { display: none; }
  .navigation .chapter { display: inline; }
  .navigation .number { margin-left: 4px; }
  #source { max-width: calc(100vw - 150px); }
  .container { width: 92%; }
  .maintext { width: 100% !important; }
  .slide, .introslide { background-attachment: scroll !important; }
  h1, h2 { overflow-wrap: anywhere; }
  .extend_btn, .closebutton { max-width: 100%; box-sizing: border-box; }
  h3.buttontext { white-space: normal; }
}