/* Summit finale — loaded after journey.css; see journey-ribbon-notes.md “Summit stack” */

/* Paint order: mtn (2) → sea bands (3) → floor veil (4) */
.sfx-mtn { z-index: 2; }

.summit-fx svg.sfx-sea {
    left: 50%;
    width: auto;
    height: 100%;
    z-index: 3;
    opacity: calc(var(--summit-show) * var(--cloud-sfx));
    transform: translateX(-50%) translateY(calc(11px + var(--cloud-reveal) * 40px));
    /* Upper mist bands only — land peeks through below */
    clip-path: inset(0 0 18% 0);
}

.summit-fx svg.sfx-floor {
    left: 50%;
    width: auto;
    height: 100%;
    z-index: 4;
    opacity: calc(var(--summit-show) * var(--cloud-sfx));
    transform: translateX(-50%) translateY(calc(11px + var(--cloud-reveal) * 40px));
    /* No clip — sfx-mist-floor runs to the strip bottom */
}

body.app-process.stage-yellow .summit-fx {
    z-index: 5;
}

/* Keep ribbon land — hide forest trees only */
body.app-process.stage-yellow .journey-overlay [data-id="mid-trees"],
body.app-process.stage-yellow .journey-overlay [data-id="near-trees"],
body.app-process.stage-yellow .journey-overlay [data-id="mid-shrubs"],
body.app-process.stage-yellow .journey-overlay [data-id="near-bushes"] {
    opacity: 0;
    transition: opacity var(--strip-pan-ms) var(--strip-pan-ease);
}

/* Land fills stay as built in journey-ribbon.js — do not override on gold */