/* The route is progress, not level skipping: every ranked run starts at wave one. */
.campaign-route { list-style: none; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; background: #dacee2; }
.campaign-route li { display: flex; align-items: center; gap: 6px; padding: 10px 8px; background: #ece5ef; color: #7f7088; font-size: 9px; line-height: 1.4; }
.campaign-route li > span:first-child { font: 12px 'Courier New', monospace; color: #a58aad; }
.campaign-route li[aria-current=step] { background: #705582; color: #fff2d8; }
.campaign-route li[aria-current=step] > span:first-child { color: #f7d38e; }
.campaign-route li.complete { background: #dce9e1; color: #4d7366; }
.campaign-route li.complete > span:first-child { color: #4d7366; }
.stage[data-wave="4"] .scene-wash { background: linear-gradient(#152c4bd9, #234c5b99); }
.stage[data-wave="5"] .scene-wash { background: linear-gradient(#302858e6, #64486eaa); }
.stage[data-wave="6"] .scene-wash { background: linear-gradient(#331948e6, #472765bb); }
.enemy.charging { filter: drop-shadow(0 0 10px #ffe68e) drop-shadow(0 0 3px #fff); }
.enemy.awakened .hp i { background: #eda8e4; }
.boss-warning { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); z-index: 3; color: #ffe7aa; background: #352037e8; border: 1px solid #dab476; border-radius: 4px; padding: 7px 12px; font: bold 10px 'Courier New', monospace; white-space: nowrap; pointer-events: none; }
.campaign-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font: 10px 'Courier New', monospace; color: #856792; }
.campaign-filter select { background: #faf5ed; color: #654974; border: 1px solid #cdbbd6; border-radius: 5px; padding: 9px; font: inherit; font-size: 12px; max-width: 100%; }
#leaderboard-campaign-note { margin: 9px 0 16px; }
@media(max-width:580px) {
  .campaign-route { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .campaign-route li { font-size: 8px; padding: 7px 6px; }
  .campaign-route li > span:first-child { font-size: 10px; }
  .boss-warning { font-size: 7px; padding: 5px; }
}
/* Keep the title card inside the compact desktop preview as well as phones. */
@media(min-width:581px) and (max-width:700px) {
  .overlay-copy { padding-top: 12px; padding-bottom: 12px; }
  .overlay h2 { font-size: 56px; }
  .overlay .eyebrow { font-size: 8px; margin-bottom: 10px; }
  .overlay-copy > p:not(.eyebrow) { font-size: 11px; margin: 12px 0; }
  .overlay-copy > p.overlay-foot { font-size: 7px; margin-top: 12px; }
  .primary { font-size: 12px; padding: 11px 16px; }
}