/* Campaign geography and camp rewards. */
#camp-map { background: #0b131a; }
.trail-map { margin: 12px auto 24px; border: 1px solid #635844; box-shadow: 0 18px 48px #0009; border-radius: 4px; overflow: hidden; }
#camp-map .campaign-heading { position: sticky; top: 0; z-index: 3; padding: 12px 20px; background: #0b131af2; border-bottom: 1px solid #2b3b49; }
.trail-map .node.avail:focus-visible { outline: 3px solid #fff1b9; outline-offset: 4px; }
.cp-recovery { display: flex; gap: 14px; padding: 14px 28px; background: #1b302b; border-block: 1px solid #547566; color: #d3e6d6; font-size: 14px; }
.cp-recovery b { color: #f2dfab; white-space: nowrap; }
.cp-recovery span { line-height: 1.5; }
.cp-cards { grid-template-columns: 1fr 1fr; }
.cp-card > button.primary { margin-top: auto; width: 100%; min-height: 44px; }
.cp-card.cp-supplies { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr auto; column-gap: 24px; }
.cp-supplies h3, .cp-supplies p { grid-column: 1; }
.cp-supplies .cp-gold { grid-column: 2; grid-row: 1 / 3; color: #f2d18e; font: 40px 'Marcellus SC',serif; text-align: right; }
.cp-gold small { display: block; color: #aebcbc; font: 13px 'Barlow',sans-serif; }
.cp-supplies > button.primary { grid-column: 1 / -1; }
.cp-list { max-height: 240px; overflow-y: auto; }
@media(max-width:600px) {
 .cp-cards { grid-template-columns: 1fr; }
 .cp-recovery { padding: 12px 16px; flex-direction: column; gap: 4px; }
 .cp-card.cp-supplies { display: flex; }
 .cp-supplies .cp-gold { text-align: left; margin: 8px 0 16px; }
 .cp-sky h2 { font-size: 24px; }
}

.unit-art-portrait { background: radial-gradient(ellipse at 50% 60%, #35404a, #0d1722 75%); height: 164px; display: flex; justify-content: center; }
.unit-art-portrait canvas.thumb { width: 128px; height: 145px; border: 0; background: none; box-shadow: none; }
.unit-art-portrait:after { display: none; }
.unit-art-portrait span { bottom: 5px; }