/* Shared by every page: site navigation bar, footer and disclaimer dialog.
   Relies on the colour variables (--header, --surface, --text, --muted, --line, --blue-strong)
   that each page defines on :root. */
.sitebar {
  width: min(100%, 1080px);
  margin: 0 auto;
  padding: max(12px, env(safe-area-inset-top)) 18px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 4px;
  color: #fff;
}
.sitebar .brand {
  margin-right: auto;
  padding: 7px 4px;
  color: #fff;
  font-weight: 700;
  font-size: 1.02rem;
  letter-spacing: -.01em;
  text-decoration: none;
}
.sitebar a:not(.brand) {
  padding: 7px 11px;
  border-radius: 999px;
  color: #fff;
  font-size: .86rem;
  font-weight: 600;
  text-decoration: none;
  opacity: .9;
}
.sitebar a:not(.brand):hover { background: rgba(255, 255, 255, .12); opacity: 1; }
.sitebar a[aria-current="page"] { background: rgba(255, 255, 255, .2); opacity: 1; }
.sitebar a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
@media (max-width: 520px) {
  .sitebar { padding-left: 12px; padding-right: 12px; }
  .sitebar a:not(.brand) { padding: 6px 9px; font-size: .82rem; }
}

.sitefooter {
  width: min(100%, 1080px);
  margin: 0 auto;
  padding: 8px 18px 76px; /* room for the Netlify badge at the bottom right */
  color: var(--muted);
  font-size: .84rem;
  line-height: 1.6;
}
.sitefooter .footer-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px;
  padding-top: 18px; border-top: 1px solid var(--line);
}
.sitefooter a, .sitefooter .link-button {
  color: var(--blue-strong); font-weight: 600; text-decoration: none;
}
.sitefooter a:hover, .sitefooter .link-button:hover { text-decoration: underline; }
.sitefooter .link-button {
  padding: 0; border: 0; background: none; font: inherit; font-weight: 600; cursor: pointer;
}
.sitefooter a:focus-visible, .sitefooter .link-button:focus-visible { outline: 3px solid var(--blue-strong); outline-offset: 2px; border-radius: 3px; }
dialog.disclaimer-dialog {
  width: min(92vw, 640px);
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
}
dialog.disclaimer-dialog::backdrop { background: rgba(4, 18, 27, .55); }
dialog.disclaimer-dialog .dialog-inner { padding: 22px 22px 24px; }
dialog.disclaimer-dialog h2 { margin: 0 0 10px; font-size: 1.15rem; }
dialog.disclaimer-dialog p { margin: 0; font-size: .86rem; line-height: 1.6; }
dialog.disclaimer-dialog button {
  float: right; margin: 0 0 8px 12px; min-height: 40px; padding: 0 16px; cursor: pointer;
  border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft, var(--surface)); color: var(--text); font: inherit; font-weight: 600;
}
dialog.disclaimer-dialog button:focus-visible { outline: 3px solid var(--blue-strong); outline-offset: 2px; }
@media (min-width: 760px) {
  .sitebar, .sitefooter { padding-left: 28px; padding-right: 28px; }
}