* { box-sizing: border-box; }
body { margin: 0; background: white; color: #111; font: 16px/1.5 Arial, Helvetica, sans-serif; }
a { color: #004990; text-decoration: none; }
a:hover { color: #111; text-decoration: underline; }
a:focus-visible { outline: 2px solid #004990; outline-offset: 4px; }
.layout { display: grid; grid-template-columns: 165px minmax(0, 1fr); gap: 28px; width: 90%; max-width: 1180px; margin: 0 auto; }
.navigation { position: sticky; top: 24px; align-self: start; display: flex; flex-direction: column; gap: 3px; padding-top: 26px; }
.navigation a { padding: 5px 10px; font-size: 15px; font-weight: bold; border-left: 3px solid transparent; }
.navigation a[aria-current="page"] { border-color: #004990; background: #f2f5f8; }
.page { min-width: 0; padding-bottom: 40px; }
h1 { margin: 0; padding: 22px 0 0; font-size: 22px; font-weight: 400; letter-spacing: 1px; }
.middle { overflow-wrap: anywhere; text-align: left; }
.middle h2 { margin: 0; padding: 17px 0 10px; font-size: 20px; font-weight: 400; color: #666; border-bottom: 1px dotted gray; }
.middle ul, .middle ol { margin: 0; padding: 10px 0 15px 24px; }
img { max-width: 100%; object-fit: contain; }
table { width: 100%; border-collapse: collapse; font: inherit; }
th, td { padding: 7px 5px; text-align: left; vertical-align: top; border-bottom: 1px solid #ddd; }
td:first-child { width: 200px; }
.skip-link { position: absolute; left: 12px; top: -100px; padding: 8px; background: white; z-index: 2; }
.skip-link:focus { top: 8px; }
@media (max-width: 700px) {
  .layout { display: block; width: auto; margin: 0 18px; }
  .navigation { position: static; flex-direction: row; flex-wrap: wrap; gap: 4px 8px; padding: 14px 0; border-bottom: 1px solid #ddd; }
  .navigation a { padding: 5px 4px; border-left: 0; border-bottom: 2px solid transparent; }
  h1 { padding-top: 18px; }
  td:first-child { width: 30%; }
}
@media print { .navigation, .skip-link { display: none; } .layout { display: block; width: 100%; } }
