html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y proximity;background:#e9e3d8}
.relay{--mobile-reveal:100%;width:100%;height:300svh;min-height:2100px;overflow:hidden;background:linear-gradient(180deg,#e9e3d8 0 33.333%,#a8bac7 33.333% 66.666%,#14232d 66.666% 100%)}
.city-stage{inset:auto 0;top:100svh;width:100%;height:100svh;z-index:1;scroll-snap-align:start}
.city-stage>img,.future-window img{inset:0;width:100%;height:100%;object-fit:contain;object-position:center 50%}
.future-window{clip-path:inset(var(--mobile-reveal) 0 0 0)}
.reveal-line{left:0;right:0;top:var(--mobile-reveal);bottom:auto;width:100%;height:1px;background:linear-gradient(90deg,transparent,#fff 22%,#fff 78%,transparent)}
.reveal-line:before{width:70px;height:16px}
.city-stage:after{background:linear-gradient(180deg,#07151e33,transparent 24% 72%,#07151e8f)}
.logo{left:50%;top:3svh;width:clamp(280px,26vw,430px);transform:translateX(-50%)}
.event-date{left:50%;top:calc(100svh + 3svh);font-size:clamp(11px,.9vw,15px);z-index:20}
.jupiter{left:0;top:11svh;width:100vw;height:82svh;z-index:5;scroll-snap-align:start}
.moon{left:0;right:auto;top:calc(200svh + 9svh);bottom:auto;width:100vw;height:84svh;z-index:5;scroll-snap-align:start}
.message{left:34%;top:19%;width:32%;text-align:left}
.message small{font-size:clamp(12px,1vw,16px)}
.message h1{font-size:clamp(92px,9vw,148px)}
.message p{font-size:clamp(13px,1vw,17px)}
.era{z-index:8;font-size:9px}.era.now{left:3vw;top:4svh;bottom:auto}.era.future-label{right:3vw;bottom:4svh}
.reveal-readout{top:calc(100svh + 50svh);bottom:auto;transform:translate(-50%,-50%);writing-mode:vertical-rl}
.moon-instruction{bottom:3%;font-size:8px}
.sound-hint{font-size:8px}
.credit{right:3vw;bottom:2svh;font-size:8px}
.sheet{position:fixed}
@media(max-width:700px){
 .relay{min-height:1800px}
 .city-stage>img,.future-window img{object-fit:cover}
 .logo{width:min(280px,70vw)}
 .event-date{font-size:10px}
 .jupiter{top:15svh;height:min(100vw,72svh)}
 .moon{top:calc(200svh + 12svh);height:min(100vw,72svh)}
 .message{left:16%;top:21%;width:68%}
 .message small{font-size:clamp(10px,2.8vw,13px)}
 .message h1{font-size:clamp(62px,18vw,84px)}
 .message p{font-size:clamp(10px,2.7vw,13px)}
 .reveal-readout{display:none}
}
/* Scroll-led transition and restrained wayfinding */
.relay{--scroll-progress:0}
.city-stage>img,.future-window img{transform:scale(calc(.96 + var(--scroll-progress)*.05));transition:filter .15s linear;will-change:transform}
.city-stage .present{filter:saturate(calc(.84 - var(--scroll-progress)*.2)) brightness(calc(1.04 - var(--scroll-progress)*.08))}
.future-window img{filter:saturate(calc(.9 + var(--scroll-progress)*.1)) contrast(calc(1 + var(--scroll-progress)*.08))}
.scroll-cue{position:absolute;z-index:25;left:50%;display:grid;justify-items:center;gap:8px;transform:translateX(-50%);color:#172a33;font:700 7px DMMono;letter-spacing:.18em;pointer-events:none;transition:opacity .5s ease,transform .5s ease}
.scroll-cue i{position:relative;width:1px;height:36px;background:linear-gradient(transparent,#172a3399)}
.scroll-cue i:after{content:'';position:absolute;left:50%;bottom:0;width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translate(-50%,-1px) rotate(45deg)}
.cue-intro{top:calc(100svh - 62px);opacity:calc(1 - var(--scroll-progress)*3)}
.cue-city{top:calc(200svh - 68px);color:#f4eee5;opacity:calc(.72 - var(--scroll-progress)*.55);text-shadow:0 2px 10px #07131a}
@media(max-width:700px){
 .city-stage{height:115svh}
 .future-window{clip-path:inset(var(--mobile-reveal) 0 0 0)}
 .scroll-cue{font-size:6px;gap:7px}
 .scroll-cue i{height:31px}
}
@media(prefers-reduced-motion:reduce){.city-stage>img,.future-window img{transform:none}.scroll-cue i:after{animation:none}}
/* Refined Jupiter typography */
.message{left:50%;width:min(520px,42vw);transform:translateX(-50%);text-align:center}
.message h1 em{margin-left:0}
.message p,.message p+p{margin-left:auto;margin-right:auto}
.message strong{font-size:1.18em;font-weight:800;letter-spacing:.015em}
@media(max-width:700px){
 .message{left:50%;width:72vw;transform:translateX(-50%);text-align:center}
 .message p,.message p+p{margin-left:auto;margin-right:auto}
 .message strong{font-size:1.2em;font-weight:800}
}
/* Future follows the visitor's downward reading direction */
.future-window{clip-path:inset(0 0 var(--mobile-reveal) 0)}
.reveal-line{top:calc(100% - var(--mobile-reveal))}
@media(max-width:700px){.future-window{clip-path:inset(0 0 var(--mobile-reveal) 0)}}
/* A real, restrained space field for the opening and lunar chapters */
.relay{background:
 linear-gradient(180deg,#eef0ede0 0 33.333%,transparent 33.333% 66.666%,#13212c9c 66.666% 100%),
 url('/assets/hubble-skymap.jpg') center top/auto 100svh repeat-y,
 #243641}
.relay:before{content:'';position:absolute;z-index:0;inset:0 0 auto;height:100svh;background:radial-gradient(ellipse at 50% 44%,#f2f2e2b5 0 23%,#d8e0df8a 44%,#aab9bd59 66%,#72878e47 100%);pointer-events:none}
.logo{top:2.5svh}
.jupiter{top:16svh;height:77svh}
.message{color:#10242c;text-shadow:0 1px 22px #f4f4e7,0 0 44px #edf0e5}
@media(max-width:700px){.jupiter{top:18svh;height:min(100vw,68svh)}}
/* One uninterrupted spatial canvas across all three chapters */
html,body{background:#5f7680}
.relay{background:transparent}
.relay:before{content:'';position:fixed;z-index:0;inset:0;height:auto;background:
 linear-gradient(180deg,#eaf0e5aa,#c5d1cc8c 38%,#768d9280 67%,#3047518f),
 url('/assets/hubble-skymap.jpg') center center/cover no-repeat;
 pointer-events:none}
.city-stage{background:transparent}
.city-stage>img,.future-window img{object-fit:contain}
.city-stage:after{background:linear-gradient(180deg,#d6e0dc35,transparent 20% 78%,#13263059)}
.jupiter .sound-wave{z-index:2;width:min(68%,680px)}
.jupiter-sound-hint{position:absolute;z-index:12;left:50%;bottom:7%;transform:translateX(-50%) translateY(4px);padding:9px 13px;border:1px solid #172a3352;border-radius:99px;color:#172a33;background:#edf0e3b8;backdrop-filter:blur(10px);font:700 7px DMMono;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;opacity:.82;pointer-events:none;transition:opacity .25s,transform .25s}
.jupiter:hover .jupiter-sound-hint,.jupiter:focus-visible .jupiter-sound-hint{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:700px){
 .city-stage>img,.future-window img{object-fit:contain}
 .jupiter-sound-hint{bottom:2%;font-size:6px}
 .jupiter .sound-wave{width:70%}
}
/* The transition line is also a quiet manual scrubber */
.reveal-line{pointer-events:auto;cursor:ns-resize;touch-action:none}
.reveal-line:after{content:'';position:absolute;left:0;right:0;top:50%;height:34px;transform:translateY(-50%);background:transparent}
.reveal-line:active:before{background:#f4eee5cc;box-shadow:0 0 24px #fff}
/* Dissolve the photographic chapter into the single fixed star field */
.city-stage{background:transparent;isolation:isolate}
.city-stage>.present,.city-stage>.future-window{
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%);
 mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%);
}
.city-stage:after{
 background:radial-gradient(ellipse at center,transparent 52%,#263b4630 86%,transparent 100%);
 -webkit-mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent);
 mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent);
}
@media(max-width:700px){
 .city-stage>.present,.city-stage>.future-window{
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 92%,transparent 100%);
 }
}
/* Higher-contrast but restrained scroll wayfinding */
.scroll-cue{gap:9px;padding:10px 14px;border:1px solid #fff7;border-radius:99px;color:#f7f3ea;background:#10242ca8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:9px;font-weight:800;letter-spacing:.2em;text-shadow:0 1px 9px #07131a;box-shadow:0 8px 28px #07131a4f,0 0 24px #fff2}
.scroll-cue i{height:40px;width:2px;background:linear-gradient(transparent,#fff)}
.scroll-cue i:after{width:8px;height:8px;border-width:0 2px 2px 0}
.cue-intro{color:#f7f3ea}
.cue-city{color:#f7f3ea;opacity:calc(.9 - var(--scroll-progress)*.55)}
@media(max-width:700px){.scroll-cue{padding:9px 13px;font-size:8px}.scroll-cue i{height:34px}}
/* Playback attribution stays anchored to the viewport */
.credit{position:fixed;z-index:35;right:18px;bottom:16px;top:auto;left:auto}
@media(max-width:700px){.credit{right:12px;bottom:12px;font-size:7px}}
/* Planetary sound countdown */
.audio-countdown{position:absolute;z-index:30;left:50%;top:50%;display:grid;place-items:center;min-width:74px;min-height:74px;transform:translate(-50%,-50%) scale(.88);border:1px solid #f6f3e8a8;border-radius:50%;color:#f9f5e9;background:#10242ca8;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font:400 34px/1 Instrument;text-align:center;text-shadow:0 2px 12px #07131a;box-shadow:0 0 34px #b9edff4a;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.audio-countdown.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}
.audio-countdown:not(:empty){padding:12px}
.audio-countdown[data-kind=label]{font-family:DMMono;font-size:8px;font-weight:800;letter-spacing:.12em}
@media(max-width:700px){.audio-countdown{min-width:66px;min-height:66px;font-size:30px}}
/* Identical lower-orbit sound instructions on both planets */
.jupiter-sound-hint,.sound-hint{
 position:absolute;z-index:12;left:50%;top:auto;bottom:7%;
 min-height:32px;padding:9px 13px;
 transform:translateX(-50%) translateY(4px);
 border:1px solid #f6f3e88a;border-radius:99px;
 color:#f7f3ea;background:#10242ca8;
 backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
 font:700 7px DMMono;letter-spacing:.11em;text-transform:uppercase;
 text-shadow:0 1px 8px #07131a;box-shadow:0 8px 24px #07131a42;
 white-space:nowrap;opacity:.86;pointer-events:none;
 transition:opacity .25s,transform .25s;
}
.jupiter:hover .jupiter-sound-hint,.jupiter:focus-visible .jupiter-sound-hint,.moon:hover .sound-hint,.moon:focus-visible .sound-hint,.sound-locked .sound-hint{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:700px){.jupiter-sound-hint,.sound-hint{bottom:3%;min-height:30px;padding:8px 11px;font-size:6px}}
/* Countdown reuses both shared lower-orbit instruction pills */
.jupiter-sound-hint.counting,.sound-hint.counting{font-family:Instrument;font-size:24px;font-weight:400;letter-spacing:0;opacity:1;transform:translateX(-50%) translateY(0);box-shadow:0 0 32px #b9edff4a,0 8px 24px #07131a42}
/* Keep the NOW/FUTURE scrubber within the portrait artwork, not the viewport */
.city-stage .reveal-line{
 left:50%;right:auto;width:min(100%,75vh);
 transform:translateX(-50%);
 background:linear-gradient(90deg,transparent,#eef4ef38 12%,#eef4ef78 50%,#eef4ef38 88%,transparent);
 box-shadow:0 0 8px #e8f2ed24;
 opacity:.62;
}
.city-stage .reveal-line:before{
 width:54px;height:12px;
 border-color:#eef4ef78;
 background:#2138426b;
 box-shadow:0 5px 14px #07131a38;
}
.city-stage .reveal-line:hover,.city-stage .reveal-line:active{opacity:.86}
@media(max-width:700px){.city-stage .reveal-line{width:min(100%,86.25vh);opacity:.55}}
/* Quiet first-visit invitation, with no autoplay */
.sound-guide{position:absolute;z-index:32;right:5vw;top:44svh;display:flex;align-items:center;gap:12px;color:#f7f3ea;font:800 8px DMMono;letter-spacing:.16em;text-shadow:0 2px 12px #07131a;opacity:0;transform:translateX(10px);pointer-events:none;transition:opacity .7s ease,transform .7s ease}
.sound-guide i{position:relative;width:68px;height:1px;background:linear-gradient(90deg,#f7f3ea,transparent)}
.sound-guide i:before{content:'';position:absolute;left:0;top:50%;width:8px;height:8px;border-left:1px solid #f7f3ea;border-bottom:1px solid #f7f3ea;transform:translateY(-50%) rotate(45deg)}
.sound-guide.visible{opacity:.84;transform:translateX(0)}.sound-guide.dismissed{opacity:0;transform:translateX(8px)}
/* Smaller, borderless scroll guidance */
.scroll-cue{gap:6px;padding:5px 7px;border:0;border-radius:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:7px;box-shadow:none;text-shadow:0 2px 10px #07131a}
.scroll-cue i{height:28px;width:1px}.scroll-cue i:after{width:6px;height:6px;border-width:0 1px 1px 0}
@media(max-width:700px){.sound-guide{right:4vw;top:43svh;font-size:7px}.sound-guide i{width:45px}.scroll-cue{padding:4px;font-size:6px}.scroll-cue i{height:24px}}
@media(max-width:700px){
 /* Mobile music invitation sits below the globe and points upward */
 .sound-guide{left:50%;right:auto;top:calc(100svh - 84px);display:grid;justify-items:center;gap:7px;transform:translate(-50%,8px);text-align:center;white-space:nowrap}
 .sound-guide b{grid-row:2}
 .sound-guide i{grid-row:1;width:1px;height:34px;background:linear-gradient(transparent,#f7f3ea)}
 .sound-guide i:before{left:50%;top:0;width:7px;height:7px;border:1px solid #f7f3ea;border-width:1px 0 0 1px;transform:translate(-50%,1px) rotate(45deg)}
 .sound-guide.visible{transform:translate(-50%,0)}
 .sound-guide.dismissed{transform:translate(-50%,8px)}
 /* The second cue is revealed by intersection, not page-load position. */
 .cue-city{opacity:0!important;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s}
 .cue-city.in-view{opacity:.72!important;visibility:visible;transition-delay:0s}
}
/* Event date belongs to the Jupiter chapter */
.jupiter-date{position:absolute;z-index:12;left:50%;bottom:14%;transform:translateX(-50%);color:#10242c;font:800 clamp(11px,1vw,17px)/1.4 DMMono;letter-spacing:.08em;white-space:nowrap;text-shadow:0 1px 18px #eef1e5,0 0 28px #eef1e5}
@media(max-width:700px){.jupiter-date{bottom:12%;font-size:9px}.jupiter-sound-hint{bottom:3%}}
/* Countdown removed: sound labels remain compact and immediate */
.jupiter-sound-hint.counting,.sound-hint.counting{font:700 7px DMMono;letter-spacing:.11em;box-shadow:0 8px 24px #07131a42}
/* Optical logo alignment with Jupiter's projected centre */
.logo{left:49.2%;transform:translateX(-50%)}
@media(max-width:700px){.logo{left:49.2%;transform:translateX(-50%)}}
/* The opening cue doubles as a quiet cinematic-scroll control */
button.scroll-cue{-webkit-appearance:none;appearance:none;margin:0;color:#f7f3ea;cursor:pointer;pointer-events:auto}
button.scroll-cue:focus-visible{outline:1px solid #f7f3eab8;outline-offset:5px}
button.scroll-cue.auto-scrolling{opacity:.9}
button.scroll-cue.auto-scrolling i{animation:auto-scroll-pulse 1.4s ease-in-out infinite}
@keyframes auto-scroll-pulse{50%{opacity:.35;transform:translateY(4px)}}

/* Middle chapter editorial note */
.city-story{position:absolute;z-index:16;top:calc(100svh + 50svh);right:clamp(18px,3vw,54px);width:min(300px,calc((100vw - min(100vw,75vh))/2 - 38px));transform:translateY(-50%);color:#f4f2e9;text-shadow:0 2px 12px #07131a}
.city-story ul{display:grid;gap:18px;margin:0;padding:0;list-style:none}
.city-story li{position:relative;margin:0;padding-left:14px;font:600 clamp(9px,.72vw,12px)/1.55 DMMono}
.city-story li:before{content:'—';position:absolute;left:0;color:#f3aa94}
.city-story a{color:#fff;text-decoration:none;border-bottom:1px solid #ffffff6b}
.city-story strong{color:#fff;font-weight:800}
@media(max-width:900px){
 .city-story{right:16px;width:180px;padding:14px;background:#071821b8;border:1px solid #dbe8e22b;border-radius:10px;backdrop-filter:blur(12px)}
 .city-story ul{gap:10px}.city-story li{font-size:8px;line-height:1.45}
}
@media(max-width:700px){
 .city-story{top:calc(100svh + 77svh);left:50%;right:auto;width:min(88vw,430px);transform:translate(-50%,-50%);padding:16px 18px}
 .city-story ul{grid-template-columns:1fr 1fr;gap:12px 15px}.city-story li{font-size:9px}
}
@media(max-width:420px){.city-story{top:calc(100svh + 79svh)}.city-story li{font-size:8px}}

/* Keep the middle-chapter copy visibly beside the portrait artwork. */
@media(min-width:701px){
 .city-story{
  left:calc(50% + min(50vw,37.5vh) + clamp(18px,2.2vw,38px));
  right:clamp(18px,2.4vw,44px);
  width:auto;
  top:calc(100svh + 50svh);
  padding:clamp(16px,1.6vw,24px);
  border:1px solid #dbe8e238;
  border-radius:12px;
  background:#071821a8;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
 }
 .city-story li{font-size:clamp(10px,.74vw,13px);line-height:1.6}
}
@media(min-width:701px) and (max-width:1050px){
 .city-story{left:auto;right:20px;width:clamp(210px,25vw,270px)}
}
@media(max-width:700px){
 .city-story{top:calc(100svh + 76svh);z-index:22}
}

/* Unframed middle-chapter statements */
.city-story,.city-story ul,.city-story li{
 background:transparent;
 border:0;
 border-radius:0;
 box-shadow:none;
 backdrop-filter:none;
 -webkit-backdrop-filter:none;
}
.city-story{padding:0}
.city-story ul{gap:clamp(22px,3.2vh,38px)}
.city-story li{padding-left:0;text-wrap:balance}
.city-story li:before{content:none}
@media(max-width:900px){
 .city-story{padding:0;background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}
 .city-story ul{gap:20px}
}
@media(max-width:700px){
 .city-story{padding:0 22px}
 .city-story ul{gap:18px}
}

/* More breathing room between the four middle-chapter statements. */
.city-story ul{gap:clamp(38px,5.4vh,64px)}
@media(max-width:900px){.city-story ul{gap:34px}}
@media(max-width:700px){.city-story ul{gap:30px}}

/* Opening registration and update actions */
.opening-actions{position:absolute;z-index:18;left:calc(50% + min(38vw,390px));top:48%;display:grid;gap:14px;transform:translateY(-50%)}
.opening-actions a{display:flex;align-items:center;justify-content:center;min-width:170px;min-height:48px;padding:13px 18px;border:1px solid #f7f3eaa1;border-radius:3px;color:#fffaf0;font:800 10px/1 DMMono;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;white-space:nowrap;text-shadow:0 1px 8px #07131a;box-shadow:0 14px 34px #07131a66;transition:transform .2s,box-shadow .2s,background .2s}
.opening-register{border-color:#ffd2a6d9!important;background:linear-gradient(110deg,#a94f42f2,#d77a62ee 58%,#df9b6aee)}
.opening-register span:before{content:'◈';margin-right:9px;color:#fff4d9;font-size:1.2em}
.opening-waitlist{background:#10242cc7;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.opening-waitlist span:before{content:'✦';margin-right:9px;color:#91dbc1}
.opening-actions a:hover,.opening-actions a:focus-visible{transform:translateY(-2px);box-shadow:0 18px 42px #07131a80,0 0 28px #f3aa9440}
@media(max-width:1100px) and (min-width:701px){.opening-actions{left:auto;right:3vw}.opening-actions a{min-width:150px}}
@media(max-width:700px){
 .opening-actions{left:50%;top:calc(100svh - 142px);grid-template-columns:1fr 1fr;width:min(88vw,430px);gap:9px;transform:translateX(-50%)}
 .opening-actions a{min-width:0;min-height:44px;padding:11px 8px;font-size:8px}
}

/* Institutional collaboration action within the middle narrative */
.city-story li.story-action{margin-top:-10px}
.collaborate-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 17px!important;border:1px solid #91dbc195!important;border-radius:3px;color:#fff!important;background:#10242ca8;font:800 9px/1 DMMono!important;letter-spacing:.12em;text-transform:uppercase;text-decoration:none!important;box-shadow:0 12px 28px #07131a54;transition:background .2s,border-color .2s,transform .2s}
.collaborate-button:before{content:'✦';margin-right:9px;color:#91dbc1}
.collaborate-button:hover,.collaborate-button:focus-visible{background:#183440d6;border-color:#91dbc1!important;transform:translateY(-2px)}
@media(max-width:700px){.city-story ul{gap:22px}.collaborate-button{min-height:40px;padding:10px 13px!important;font-size:8px!important}}

/* Keep the opening controls balanced around the planet. */
@media(min-width:701px){
 .sound-guide{
  left:5vw;
  right:auto;
  flex-direction:row-reverse;
  transform:translateX(-10px);
 }
 .sound-guide i{background:linear-gradient(90deg,transparent,#f7f3ea)}
 .sound-guide i:before{
  left:auto;
  right:0;
  border:1px solid #f7f3ea;
  border-width:1px 1px 0 0;
  transform:translateY(-50%) rotate(45deg);
 }
 .sound-guide.visible{transform:translateX(0)}
 .sound-guide.dismissed{transform:translateX(-8px)}
}

@media(max-width:700px){
 /* Keep the music and scroll prompts separate around the opening planet. */
 .sound-guide{
  left:7vw;
  top:42svh;
  justify-items:start;
  transform:translateY(8px);
 }
 .sound-guide.visible{transform:translateY(0)}
 .sound-guide.dismissed{transform:translateY(8px)}
 .cue-intro{left:auto;right:7vw;top:72svh;transform:none}

 /* Position the actions in the viewport; they are relative to the Jupiter stage. */
 .opening-actions{top:calc(82svh - 142px)}

 /* Introduce the city story before the tower instead of beside it. */
 .city-story{
  top:calc(100svh - 74px);
  transform:translateX(-50%);
 }
 .city-stage>img,.future-window img{object-position:center calc(50% + 12svh)}
}