/* Each painting feathers into a shared black ground, without mixing its geometry. */
:root{--painting-fade:clamp(24px,5.5vw,106px);--painting-top-fade:clamp(18px,4vw,76px)}
#beginning.forest-hero.video-hero .hero-picture:after{height:23%;background:linear-gradient(to bottom,transparent 0%,#0001 25%,#0005 53%,#000c 80%,#000 100%)}
#river{margin-top:0;background:#000;mask-image:none;-webkit-mask-image:none}
#river:before{display:none}
#river>img{mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%)}
#riddles.crypt-art-only{margin-top:0;padding:0;background:#000;mask-image:none;-webkit-mask-image:none}
.crypt-art-stage{mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%)}
#roadmap.nft-scroll{margin-top:0;background:#000;mask-image:none;-webkit-mask-image:none}
.nft-scroll .scroll-scene{mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),transparent 100%)}
.scroll-scene:after{display:none}
#garden{margin-top:0;background:#000;mask-image:none;-webkit-mask-image:none}
#garden:before{display:none}
#garden>.footer-art{mask-image:linear-gradient(to bottom,transparent 0,#000 clamp(10px,2.4vw,44px),#000 82%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 clamp(10px,2.4vw,44px),#000 82%,transparent 100%)}
/* More black space gives the closing signature room beneath the pond. */
#garden .footer-overlay{margin-top:-55px;min-height:360px;padding:90px 0 72px;justify-content:center;background:linear-gradient(to bottom,transparent 0,#000 55px)}
@media(max-width:900px){
 #roadmap.nft-scroll{padding-bottom:90px}
 #garden .footer-overlay{margin-top:-22px;min-height:300px;padding:68px 0 62px;background:linear-gradient(to bottom,transparent 0,#000 22px)}
}

/* A restrained overlap softens the join while retaining each full image canvas. */
:root{--scene-overlap:clamp(12px,2.2vw,38px);--painting-fade:clamp(28px,6.8vw,126px);--painting-top-fade:clamp(22px,4.6vw,86px)}
#river,#riddles.crypt-art-only,#roadmap.nft-scroll,#garden{margin-top:calc(-1 * var(--scene-overlap))}
#river>img,.crypt-art-stage,.nft-scroll .scroll-scene{
 mask-image:linear-gradient(to bottom,transparent 0,#0002 calc(var(--painting-top-fade)*.2),#0009 calc(var(--painting-top-fade)*.6),#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),#000b calc(100% - var(--painting-fade)*.6),#0003 calc(100% - var(--painting-fade)*.2),transparent 100%);
 -webkit-mask-image:linear-gradient(to bottom,transparent 0,#0002 calc(var(--painting-top-fade)*.2),#0009 calc(var(--painting-top-fade)*.6),#000 var(--painting-top-fade),#000 calc(100% - var(--painting-fade)),#000b calc(100% - var(--painting-fade)*.6),#0003 calc(100% - var(--painting-fade)*.2),transparent 100%);
}
@media(max-width:900px){#roadmap.nft-scroll{padding-bottom:64px}}

/* The attribution sits quietly at the final edge of the page. */
#garden .footer-overlay{position:relative}
#garden .music-credit{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);width:calc(100% - 36px);max-width:650px;margin:0;font-size:9px;line-height:1.4;color:#53574f;opacity:.22;text-align:center}
/* Join castle and crypt through a short shared dark fade, without ghosting their lines. */
:root{--castle-crypt-blend:clamp(44px,7.5vw,142px)}
#river>img{mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--castle-crypt-blend)),transparent calc(100% - var(--castle-crypt-blend)*.4));-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--painting-top-fade),#000 calc(100% - var(--castle-crypt-blend)),transparent calc(100% - var(--castle-crypt-blend)*.4))}
#riddles.crypt-art-only{position:relative;z-index:3;margin-top:calc(-.4 * var(--castle-crypt-blend));background:#000}
#riddles .crypt-art-stage{background:transparent;mask-image:linear-gradient(to bottom,transparent 0,#000 calc(var(--castle-crypt-blend)*.65),#000 calc(100% - var(--painting-fade)),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 calc(var(--castle-crypt-blend)*.65),#000 calc(100% - var(--painting-fade)),transparent 100%)}
/* The dragon head sits above the closing name rather than beside it. */
#garden .footer-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center}
#garden .footer-brand img{width:clamp(130px,12vw,180px);height:clamp(130px,12vw,180px);max-width:none;object-fit:contain;flex:none;margin:0}
#garden .footer-overlay{min-height:480px;padding-top:72px;padding-bottom:85px}
@media(max-width:650px){#garden .footer-brand{gap:17px}#garden .footer-brand img{width:140px;height:140px}#garden .footer-overlay{min-height:430px;padding-top:50px;padding-bottom:80px}}

/* Give the silent hero its complete lower dissolve before the castle begins. */
#river{margin-top:0}

#garden .footer-brand img{width:clamp(190px,17vw,250px);height:clamp(190px,17vw,250px)}@media(max-width:650px){#garden .footer-brand img{width:196px;height:196px}}