*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#b9dff3}main{overflow:clip}.sky{position:relative;background:linear-gradient(180deg,#b9dff3 0%,#cee9f8 26%,#e5f3fb 48%,#f3faff 69%,#f6fbff 100%)}.paper{position:absolute;inset:0;pointer-events:none;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.065' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238eafba' filter='url(%23n)' opacity='.38' d='M0 0h220v220H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}.journey{position:relative;width:100%;max-width:1320px;margin:auto;height:clamp(2100px,185vw,2500px)}.scene{position:absolute;opacity:var(--reveal,0);transform:translate3d(0,var(--rise,28px),0);pointer-events:none}.scene-mj{width:49%;left:4%;top:40px;aspect-ratio:2/3;opacity:1;transform:none}.scene-shenez{width:43%;right:3%;top:30%;aspect-ratio:1087/1447}.scene-garden{width:80%;max-width:1030px;left:50%;bottom:18px;aspect-ratio:1089/1445;transform:translate3d(-50%,var(--rise,28px),0)}.art{position:absolute;inset:0}.art img,.art canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}.art img.is-rendered{visibility:hidden}.scene-garden .art{mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 86%,transparent),linear-gradient(to right,transparent,#000 14%,#000 86%,transparent);mask-composite:intersect}.scene-garden{mix-blend-mode:multiply}.ending{position:relative;min-height:32svh;background:#fff9e9}.watercolor-edge{position:absolute;width:100%;height:130px;top:-105px;left:0;overflow:visible}
@media(max-width:600px){.journey{height:1900px}.scene-mj{width:84%;left:-3%;top:50px}.scene-shenez{width:77%;right:-1%;top:35%}.scene-garden{width:118%;bottom:65px}.watercolor-edge{height:90px;top:-70px}.ending{min-height:28svh}}
@media(prefers-reduced-motion:reduce){.scene{opacity:1!important;--rise:0px!important}}

/* Shared watercolor world, static artwork, September 29 revision. */
.sky{background:#b5ddf7 url("assets/shared-sky.png") center top / 100% auto repeat-y}
.sky>.paper{display:none}
.journey{max-width:1440px;height:clamp(1400px,135vw,1944px)}
.scene{opacity:1;transform:none}
.scene-mj{width:40%;left:0;top:0;mask-image:linear-gradient(to bottom,#000 88%,transparent),linear-gradient(to right,#000 85%,transparent);mask-composite:intersect}
.scene-shenez{width:40%;right:5%;top:21%}
.scene-garden{width:100%;max-width:none;left:0;bottom:30px;aspect-ratio:3/2;transform:none;mix-blend-mode:normal}
.scene-garden .art{mask-image:none}
@media(max-width:600px){
 .journey{height:1450px}
 .scene-mj{width:74%;left:-2%;top:0}
 .scene-shenez{width:75%;right:0;top:25%}
 .scene-garden{width:155%;left:-5%;bottom:50px}
}
.sky{background-size:100% 100%;background-repeat:no-repeat}

/* Larger MJ and softly continuous cloud banks. */
.scene-mj{width:48%;mask-image:linear-gradient(to bottom,#000 68%,transparent 100%),linear-gradient(to right,#000 62%,transparent 100%);mask-composite:intersect;z-index:1}
.cloud{aspect-ratio:3/2;opacity:.82;z-index:0}
.cloud-near-flowers{width:26%;left:26%;top:29%}
.cloud-above-bird{width:25%;right:-2%;top:23%}
.cloud-below-bird{width:22%;right:20%;top:43%}
.scene-shenez{z-index:2}
.scene-garden{z-index:2}
@media(max-width:600px){
 .scene-mj{width:85%;left:-2%}
 .cloud-near-flowers{width:39%;left:-6%;top:39%}
 .cloud-above-bird{width:39%;right:-7%;top:28%}
 .cloud-below-bird{width:35%;right:1%;top:49%}
}

/* Cream sky, pale-blue footer and two soft clouds above Shenez. */
html,body{background:#fffdf5}
.sky{background:#fffdf5}
.sky>.paper{display:block;opacity:.065}
.ending{background:#d9eef9}
.scene-mj{mask-image:none}
.cloud{opacity:.92;filter:blur(.8px);}
.cloud-near-flowers{width:21%;left:auto;right:30%;top:17%}
.cloud-above-bird{width:25%;right:1%;top:19%}
@media(max-width:600px){
 .cloud-near-flowers{width:29%;left:auto;right:29%;top:21%}
 .cloud-above-bird{width:34%;right:0;top:23%}
}
.cloud-near-flowers{right:25%;top:14%}
@media(max-width:600px){
 .cloud-near-flowers{width:25%;right:2%;top:14%}
 .cloud-above-bird{width:31%;right:0;top:23%}
}

/* Restore the blue watercolor palette. */
html,body{background:#b9dff3}
.sky{background:#b5ddf7 url("assets/shared-sky.png") center top / 100% 100% no-repeat}
.sky>.paper{display:none}
.ending{background:#fff9e9}
/* User-requested black background. */
html,body,.sky{background:#000}
/* Relative artwork offsets requested by the user. */
.scene-mj,.cloud{transform:translateY(-50%)}
.scene-shenez{transform:translateY(20%)}
/* Keep MJ fully visible while reducing the space above him by half. */
.scene-mj{transform:translateY(-9%)}

/* Match the supplied 926 × 714 composition proportionally. */
.journey{container-type:inline-size}
.scene-mj{width:36%;left:10%;top:0;transform:none}
.scene-shenez{width:44%;right:auto;left:48.5%;top:31cqw;transform:none}
.cloud{opacity:.92;transform:none;filter:blur(.55px)}
.cloud-near-flowers{width:22%;right:auto;left:63%;top:2cqw}
.cloud-above-bird{width:19%;right:auto;left:75%;top:34cqw}
.cloud-left-low{width:21%;left:1%;top:42cqw}
.cloud-middle-low{width:16%;left:35%;top:57cqw}
@media(max-width:600px){
 .journey{height:190cqw;min-height:950px}
 .scene-mj{width:36%;left:10%;top:0;transform:none}
 .scene-shenez{width:44%;left:48.5%;right:auto;top:31cqw;transform:none}
 .cloud-near-flowers{width:22%;left:63%;right:auto;top:2cqw}
 .cloud-above-bird{width:19%;left:75%;right:auto;top:34cqw}
}

/* Raise the artwork by halving its visible distance from the page top. */
.scene-mj{top:-2.5cqw}
.cloud-near-flowers{top:-.8cqw}
.cloud-above-bird{top:15.4cqw}
.cloud-left-low{top:19.3cqw}
/* Give the left cloud clear space below the hanging flowers. */
.cloud-left-low{top:51cqw;left:1%;width:18%}