/* Static section links work without JavaScript on articles and site pages. */
.page-outline {
  position:relative;
  top:auto;
  left:auto;
  right:auto;
  z-index:auto;
  display:block;
  backdrop-filter:none;
  transition:none;
  box-sizing:border-box;
  width:calc(100% - 48px);
  max-width:1056px;
  margin:32px auto;
  padding:24px 28px;
  border:1px solid #d7ddcf;
  border-radius:10px;
  background:#edf0e5;
  color:#173d2c;
  font-family:'DM Sans',sans-serif;
  scroll-margin-top:112px;
}

.prose .page-outline {
  width:100%;
  margin:28px 0 36px;
}

.page-outline .page-outline-title {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:8px 20px;
  margin:0 0 12px;
  padding:0;
  color:#173d2c;
  font-size:1rem;
  line-height:1.5;
}

.page-outline-title>span {
  color:#526154;
  font-size:.75rem;
}

.page-outline ol {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 24px;
  list-style:none;
  counter-reset:page-section;
  padding:0;
  margin:0;
}

.page-outline ol>li {
  counter-increment:page-section;
  margin:0;
  padding:0;
  border-top:1px solid #d7ddcf;
  font-size:.85rem;
  line-height:1.5;
  text-align:left;
}

.page-outline li>a {
  display:flex;
  align-items:baseline;
  gap:10px;
  min-height:44px;
  padding:12px 0;
  color:#173d2c;
  font-weight:400;
  text-decoration:none;
  overflow-wrap:anywhere;
}

.page-outline li>a::before {
  content:counter(page-section,decimal-leading-zero);
  flex-shrink:0;
  font-size:.7rem;
  color:#526154;
  font-variant-numeric:tabular-nums;
}

.page-outline a:hover {
  text-decoration:underline;
  text-underline-offset:4px;
}

main h2[id] {
  scroll-margin-top:112px;
}

.page-outline:focus-visible,
main h2[tabindex="-1"]:focus-visible {
  outline:2px solid #a36919;
  outline-offset:6px;
}

.page-outline-return {
  position:fixed;
  z-index:90;
  right:24px;
  bottom:calc(20px + env(safe-area-inset-bottom,0px));
  display:inline-flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-height:44px;
  padding:10px 16px;
  border:1px solid #b7d4b2;
  border-radius:8px;
  background:#173d2c;
  color:#f8f7f1;
  box-shadow:0 3px 12px #173d2c18;
  font:500 .8rem/1.5 'DM Sans',sans-serif;
  text-decoration:none;
}

.page-outline-return:hover {background:#29553c;color:#fff;}
.page-outline-return[hidden] {display:none;}

@media(max-width:600px) {
  .page-outline {width:calc(100% - 40px);padding:20px;}
  .page-outline ol {grid-template-columns:minmax(0,1fr);}
  .page-outline-return {right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));}
}

@media print {
  .page-outline-return {display:none;}
}