/* Make the selected menu marker a small warm diamond above each tab. */
nav#nav > a.active { overflow: visible !important; }
nav#nav > a.active::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  top: -2px !important;
  width: 6px !important;
  height: 6px !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
  border: 1px solid #ffd58a !important;
  border-radius: 1px !important;
  background: #ef9b31 !important;
  box-shadow: 0 0 5px #e98e29aa !important;
  opacity: .88 !important;
  pointer-events: none !important;
}
/* The home challenge aligns with the attribute panel and its shorter title. */
.reference-home .ref-next {
  width: 35.5% !important;
  left: 61.8% !important;
  box-sizing: border-box !important;
}
.reference-home .home-attributes { height: 23.2% !important; }
.reference-home .ref-objective,
.reference-home .ref-weekly-oath { height: 17.6% !important; }
.reference-home .ref-objective-copy { height: 42% !important; top: 29% !important; }
.reference-home .ref-objective .ref-goalbar { top: 76% !important; }
.reference-home .ref-objective .ref-goalcount { top: 73% !important; }
.reference-home .ref-objective .ref-goalbutton { top: 83% !important; height: 13% !important; }
.reference-home .ref-weekly-oath {
  grid-template-rows: 20% 31% 11% 14% 19% !important;
  row-gap: 1.2% !important;
}
/* Keep all seven reward cards and their labels inside the campaign frame. */
.campaign-steps {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  align-items: start !important;
  overflow: visible !important;
}
.campaign-steps .campaign-step-art {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: .84 !important;
  background-size: 428% 255% !important;
}
.campaign-steps .campaign-step-5 { background-position: 2.1% 66% !important; }
.campaign-steps .campaign-step-6 { background-position: 34.5% 66% !important; }
.campaign-steps .campaign-step-7 { background-position: 66.8% 66% !important; }
.campaign-steps .campaign-step-art .sr-only { display: block !important; }
.campaign-steps .campaign-step-art small {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 3% !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  color: #f0d7aa !important;
  font: clamp(9px, 2.2cqw, 14px)/1 Georgia, serif !important;
  text-align: center !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 4px #000 !important;
}
@media (max-width: 520px) {
  .campaign-steps { gap: 6px !important; }
  .reference-home .ref-next { width: 35.5% !important; }
}