/* Keep both artworks at their original proportions, with aligned effect layers. */
.lore-intro:not(.archive-intro){aspect-ratio:3/2;height:auto;min-height:0;background:#000}
.phoenix-hero-art,.phoenix-hero-stage{position:relative;width:100%;height:auto;margin:0;aspect-ratio:3/2;border:0;border-radius:0;box-shadow:none;overflow:hidden}
.phoenix-hero-stage>img{display:block;width:100%;height:auto;object-fit:contain}
.lore-intro::after{display:none}
.phoenix-hero-stage{mask-image:none;-webkit-mask-image:none}
.lore-intro .hero-title{bottom:3%;z-index:3;pointer-events:none}
.phnix-footer-banner{background:#000;width:100%;margin:0;padding:0}
.phnix-footer-art{position:relative;width:min(100%,1100px);height:auto;margin:0 auto;border:0;border-radius:0;box-shadow:none;background:none;padding:0;overflow:hidden}
.phnix-footer-art .feather-hero-stage{position:relative;inset:auto;transform:none;width:100%;height:auto;aspect-ratio:1;mask-image:linear-gradient(transparent,#000 5%,#000 88%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 5%,#000 88%,transparent)}
.phnix-footer-art img{display:block;width:100%;height:auto;object-fit:contain}
.feather-sky{z-index:1}
.feather-sky i{width:clamp(7px,1.1vw,16px);height:clamp(7px,1.1vw,16px);background:#fff;filter:drop-shadow(0 0 6px #fffd);animation:phnix-twinkle var(--speed,7s) ease-in-out var(--delay,0s) infinite}
@keyframes phnix-twinkle{0%,20%,85%,100%{opacity:.04;transform:translate(-50%,-50%) scale(.6)}48%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}64%{opacity:.2;transform:translate(-50%,-50%) scale(.8)}}
.feather-shimmer{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;mask:url('assets/tale/feather-shimmer-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/tale/feather-shimmer-mask.svg') center/100% 100% no-repeat;mix-blend-mode:screen}
.feather-shimmer:before{content:"";position:absolute;inset:0;background:linear-gradient(125deg,transparent 42%,#fff8be11 46%,#fff8c3b3 50%,#fff8be11 54%,transparent 58%);background-size:300% 300%;animation:feather-sweep 9s ease-in-out infinite;opacity:0}
@keyframes feather-sweep{0%,55%{background-position:100% 100%;opacity:0}62%{opacity:.65}79%{background-position:0 0;opacity:.4}85%,100%{background-position:0 0;opacity:0}}
.phnix-footer-art .feather-sparkles{z-index:2}
.phnix-footer-art .feather-sparkles i{transform:translate(-50%,-50%);animation:phnix-twinkle 6.8s ease-in-out var(--delay) infinite}
.stone-media-pair.single-art{grid-template-columns:1fr;max-width:600px;margin:26px auto 0}
.lore-footer{margin:0;padding-top:0;min-height:70px;background:#000}
@media(max-width:650px){.lore-intro .hero-title{font-size:clamp(19px,5vw,32px)!important;bottom:2%}.phnix-footer-art{width:100%}}
@media(prefers-reduced-motion:reduce){.feather-sky i,.phnix-footer-art .feather-sparkles i{animation:none;opacity:.18}.feather-shimmer:before{animation:none;opacity:0}}
.still .feather-sky i,.still .phnix-footer-art .feather-sparkles i{animation:none;opacity:.18}.still .feather-shimmer:before{animation:none;opacity:0}

/* The archive title belongs to the wall below the uninterrupted hero painting. */
#story.stone-archive{margin-top:clamp(64px,8vw,120px)}
.wall-section-heading{display:block;position:relative;text-align:center;padding:0 24px clamp(30px,4vw,56px)}
.wall-section-heading h1{position:static;transform:none;width:auto;max-width:1100px;margin:0 auto;color:#fff0c8;font:400 clamp(30px,4.2vw,60px)/1.22 Uncial,Georgia,serif;text-shadow:0 3px 8px #000,0 1px 2px #000}
/* A small cross-shaped core and a soft white halo visibly breathe together. */
.phoenix-hero-stage .feather-sky i,.phnix-footer-art .feather-sky i{width:clamp(12px,1.9vw,27px);height:clamp(12px,1.9vw,27px);clip-path:none;border-radius:50%;background:radial-gradient(circle,#ffffffa6 0%,#ffffff40 15%,transparent 66%);filter:none;opacity:.08;animation:phnix-sky-breathe var(--speed,6s) ease-in-out var(--delay,0s) infinite;transform:translate(-50%,-50%)}
.phoenix-hero-stage .feather-sky i:before,.phnix-footer-art .feather-sky i:before{content:"";position:absolute;inset:20%;background:#fff;clip-path:polygon(50% 0,57% 42%,100% 50%,57% 58%,50% 100%,43% 58%,0 50%,43% 42%)}
@keyframes phnix-sky-breathe{0%,12%,88%,100%{opacity:.04;transform:translate(-50%,-50%) scale(.65)}36%{opacity:.35}49%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}62%{opacity:.3;transform:translate(-50%,-50%) scale(.9)}75%{opacity:.08}}
@media(max-width:650px){#story.stone-archive{margin-top:54px}.wall-section-heading{padding:0 20px 28px}.wall-section-heading h1{font-size:clamp(27px,7.4vw,38px)}}
@media(prefers-reduced-motion:reduce){.phoenix-hero-stage .feather-sky i,.phnix-footer-art .feather-sky i{animation:none;opacity:.15}}
.still .phoenix-hero-stage .feather-sky i,.still .phnix-footer-art .feather-sky i{animation:none;opacity:.15}

/* The framed archive overlaps the lower foreground of the opening banner. */
#story.stone-archive{position:relative;z-index:3;margin-top:clamp(-330px,-23vw,-60px)}
#story .stone-reader{background:transparent}
#story .stone-wall{mask-image:none;-webkit-mask-image:none}
#story .wall-section-heading{position:absolute;z-index:2;top:21%;left:15%;right:15%;padding:0;text-align:center}
#story .wall-section-heading h1{font-size:clamp(28px,3.7vw,54px);line-height:1.2;max-width:100%;margin:0}
#story .stone-panels{top:34%;bottom:18%}
#story .stone-panel{justify-content:flex-start;min-height:100%;padding-top:20px}
.lore-footer{padding:30px 20px 24px}
@media(max-width:650px){
 #story.stone-archive{margin-top:-22vw}
 #story .wall-section-heading{left:7%;right:7%;top:21%}
 #story .wall-section-heading h1{font-size:clamp(24px,6.4vw,36px)}
 #story .stone-panels{top:34%;bottom:18%}
}

.lore-intro:not(.archive-intro),.phoenix-hero-art,.phoenix-hero-stage{aspect-ratio:1534/1025}

/* Warm, restrained twinkles stay centered on the stars in the current hero art. */
.phoenix-hero-stage .phoenix-sky i{width:clamp(8px,1.05vw,18px);height:auto;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff5c48c,transparent 68%);filter:drop-shadow(0 0 5px #ffe6a6b3);animation:phoenix-star-twinkle var(--speed,5.8s) ease-in-out var(--delay,0s) infinite}
.phoenix-hero-stage .phoenix-sky i:before{inset:22%;background:#fff6d2}
.phoenix-hero-stage .phoenix-sky i:after{content:"";position:absolute;inset:-50%;border-radius:50%;background:radial-gradient(circle,#ffe6a64d,transparent 70%)}
@keyframes phoenix-star-twinkle{0%,100%{opacity:.08;transform:translate(-50%,-50%) scale(.65)}30%{opacity:.25}48%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}64%{opacity:.3;transform:translate(-50%,-50%) scale(.9)}80%{opacity:.1}}
@media(max-width:600px){.phoenix-hero-stage .phoenix-sky i{filter:drop-shadow(0 0 3px #ffe6a680)}.phoenix-hero-stage .phoenix-sky i:after{inset:-25%}}
.still .phoenix-hero-stage .phoenix-sky i{animation:none;opacity:.15}
@media(prefers-reduced-motion:reduce){.phoenix-hero-stage .phoenix-sky i{animation:none;opacity:.15}}

/* Compact source links sit with the recorded history inside the reading face. */
#story .stone-record-sources{font-size:clamp(14px,1.2vw,18px);color:#dcc99f}

/* Show more of the phoenix before the archive, with floor space below it. */
#story.stone-archive{margin-top:clamp(-140px,-9vw,-24px)}
body.phnix-lore-page .interior-stone-footer{margin-top:clamp(22px,3vw,48px)!important;height:calc(10.3515625vw - clamp(4px,1vw,14px));min-height:20px;overflow:hidden}
@media(max-width:650px){#story.stone-archive{margin-top:-6vw}}

/* Extend the archive stonework twenty-six pixels beyond each screen edge. */
html,body{overflow-x:clip}
#story .stone-reader{width:calc(100% + 52px);margin-left:-26px}

/* Let titles and subtitles sit directly on the stone artwork. */
#story .wall-section-heading,#story .wall-section-heading h1,#story .stone-panel h2,#story .stone-kicker{background:none;box-shadow:none;text-shadow:none;filter:none}

/* Enlarge the wall art another 50px per side; keep the reading area in place. */
#story .stone-wall{left:-50px;right:auto;width:calc(100% + 100px)}

/* Small gold-white glints follow the falling feather in image coordinates. */
.falling-feather-glints{position:absolute;left:56.2%;top:66.8%;width:7.8%;height:8.4%;transform:translate(-50%,-50%);z-index:2;pointer-events:none}.falling-feather-glints i{position:absolute;left:var(--x);top:var(--y);width:clamp(3px,.55vw,9px);aspect-ratio:1;opacity:0;filter:drop-shadow(0 0 3px #ffe37b) drop-shadow(0 0 6px #ffd53b99);animation:falling-feather-glint var(--speed) ease-in-out var(--delay) infinite}.falling-feather-glints i:before{content:"";position:absolute;inset:0;background:#fff6c2;clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,40% 61%,0 50%,40% 39%)}@keyframes falling-feather-glint{0%,30%,75%,100%{opacity:0;transform:translate(-50%,-50%) scale(.35)}48%{opacity:1;transform:translate(-50%,-50%) scale(1.15) rotate(12deg)}60%{opacity:.3;transform:translate(-50%,-55%) scale(.65) rotate(18deg)}}@media(prefers-reduced-motion:reduce){.falling-feather-glints i{animation:none;opacity:.4}}.still .falling-feather-glints i{animation:none;opacity:.4}