:root{color-scheme:dark;--paper:#f2f0e8;--purple:#7954db}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#06101b;color:var(--paper);font-family:Helvetica,Arial,sans-serif}body{overscroll-behavior:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #c6b5f4;outline-offset:7px}button:hover{color:#fff}#application-canvas{position:fixed!important;inset:0;width:100%!important;height:100%!important;outline:0;margin:0!important}
.masthead{position:fixed;z-index:40;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:34px 3.4vw;gap:28px}.brand{padding:0;width:120px;line-height:0}.brand img{width:100%;height:38px;object-fit:contain}.reading-toggle{font-size:12px;letter-spacing:.025em;padding:8px 0;color:#d2d4d7}.reading-toggle{display:inline-flex;align-items:center;gap:8px;margin-left:auto;white-space:nowrap}.story-arrow{display:block;flex:none;width:14px;height:14px}
#experience{position:fixed;inset:0;pointer-events:none;z-index:10}.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,10,18,.45),transparent 62%);opacity:var(--shade,1);pointer-events:none}.passage{position:absolute;opacity:0;visibility:hidden;will-change:opacity,transform;max-width:calc(100vw - 12vw)}.passage.visible{visibility:visible}.passage button{pointer-events:auto}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.2em;line-height:1.6;margin:0 0 30px;color:#dadcdf}h1,h2,h3,p{margin-top:0}h1,h2{font-weight:400;letter-spacing:-.055em;line-height:1.035;margin-bottom:30px}h1{font-size:clamp(58px,6.7vw,114px)}h2{font-size:clamp(43px,4.5vw,76px)}em{font-style:normal;color:#bdace8}p{line-height:1.6}strong{font-weight:400;color:#f1f0ed}.opening{left:6.5vw;top:19vh;width:87vw;max-width:none}.opening h1{margin-bottom:28px}.opening-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;width:100%}.opening-bottom p{font-size:clamp(14px,1.1vw,17px);max-width:490px;line-height:1.6;margin:0}.enter{border-bottom:1px solid #f0f0ef73;display:inline-flex;align-items:center;justify-content:space-between;gap:40px;padding:14px 0;font-size:13px;white-space:nowrap}.enter:hover{border-color:#fff}.enter span{font-size:20px;transition:transform .3s}.enter:hover span{transform:translateY(3px)}
.body-copy{font-size:clamp(14px,1.08vw,17px);max-width:370px;line-height:1.6;margin-bottom:18px;color:#d1d4d8}.body-copy.second{color:#aeb8c3}.body-copy strong{display:block;margin-top:14px}.knowledge{left:6.5vw;top:23vh;width:47vw}.knowledge h2{font-size:clamp(44px,4.5vw,76px)}.knowledge .body-copy{max-width:365px}.human{left:6.5vw;top:23vh;width:44vw}.human h2{font-size:clamp(46px,4.8vw,82px)}.human .body-copy{max-width:350px}.world{left:6.5vw;top:18vh;width:59vw}.world h2{font-size:clamp(40px,4.1vw,68px)}.world .body-copy{max-width:365px}.world .second{max-width:345px}#person{position:absolute;left:39%;bottom:-24vh;width:min(61vw,840px);height:115vh;opacity:0;visibility:hidden;pointer-events:none;will-change:transform,opacity;mask-image:linear-gradient(to bottom,black 0%,black var(--fade-start,43%),transparent var(--fade-end,84%));-webkit-mask-image:linear-gradient(to bottom,black 0%,black var(--fade-start,43%),transparent var(--fade-end,84%))}#person img{display:block;width:100%;height:100%;object-fit:contain;object-position:50% 0;filter:saturate(.65) contrast(1.03)}.ending{inset:0;max-width:none;padding:26vh 6.5vw 0;background:#06101b}.ending h2{font-size:clamp(54px,6.7vw,110px)}.ending .body-copy{max-width:410px}.ending .enter{margin-top:16px;min-width:240px}
.wayfinding{position:fixed;z-index:35;bottom:0;left:0;right:0;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center;padding:25px 3.4vw;color:#a3abb4;font-size:10px;letter-spacing:.07em}.wayfinding button{font-size:11px;letter-spacing:.04em;white-space:nowrap}.wayfinding button span{padding-left:13px}
#loading{position:fixed;z-index:100;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#06101b;transition:opacity .9s,visibility .9s}#loading.loaded{opacity:0;visibility:hidden;pointer-events:none}#loading img{width:142px;margin-bottom:50px}#loading span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#b8bdc6}.load-track{margin-top:20px;width:180px;height:1px;background:#ffffff20}.load-track i{display:block;height:100%;width:0;background:#9e83e0;transition:width .3s}dialog{border:0;background:#e9e6df;color:#17202b;padding:0;position:fixed;width:100vw;max-width:none;height:100dvh;max-height:none;inset:0;margin:0;z-index:100;overflow-y:auto;overscroll-behavior:contain}dialog::backdrop{background:#06101b}.close{position:fixed;right:5vw;top:28px;color:#17202b;z-index:3}.reading-content{max-width:840px;margin:auto;padding:100px 40px 80px}.reading-content .eyebrow{color:#7954db}.reading-content h2{font-size:clamp(46px,6vw,80px)}.reading-content h3{font-size:clamp(30px,4vw,45px);font-weight:400;letter-spacing:-.045em;line-height:1.15;margin-top:70px;margin-bottom:25px}.reading-content p{font-size:18px;max-width:680px}.reading-content .enter{border-color:#7954db;color:#17202b}.no-script{position:fixed;inset:0;z-index:200;background:#06101b;padding:20vh 10vw;font-size:30px;line-height:1.5}
@media(max-height:760px) and (min-width:769px){.opening{top:17vh}.opening h1{font-size:clamp(58px,5.8vw,90px);margin-bottom:22px}.eyebrow{margin-bottom:20px}.human,.knowledge{top:19vh}.human h2{font-size:58px}.body-copy{font-size:14px;margin-bottom:12px}.world{top:18vh}.world h2{font-size:56px}.world .body-copy{font-size:14px}}
@media(max-width:768px){.masthead{padding:22px 23px}.brand{width:95px}.brand img{height:30px}.reading-toggle{font-size:11px;margin:0}.passage{max-width:calc(100vw - 48px)}.opening{left:24px;top:20vh;width:calc(100vw - 48px)}.opening .eyebrow{font-size:8px;letter-spacing:.16em;max-width:240px;margin-bottom:22px}.opening h1{font-size:clamp(37px,11.5vw,83px);line-height:1.03;letter-spacing:-.058em}.opening-bottom{display:block}.opening-bottom p{font-size:13px;max-width:340px;line-height:1.6}.enter{font-size:12px;padding:12px 0;gap:30px;margin-top:22px}.wayfinding{padding:22px 24px;font-size:9px}.wayfinding button{font-size:10px}.knowledge{left:24px;top:17vh;width:calc(100vw - 48px)}.knowledge h2{font-size:clamp(40px,9vw,66px);max-width:80vw}.knowledge .body-copy{font-size:13px;max-width:270px}.knowledge .second{max-width:235px}.eyebrow{font-size:8px;margin-bottom:20px}.human{left:24px;top:17vh;width:calc(100vw - 48px)}.human h2{font-size:clamp(44px,10.5vw,66px)}.human .body-copy{font-size:12px;max-width:205px}.human .second{max-width:205px}#person{left:24%;width:95vw;height:85vh;bottom:-20vh}.world{left:24px;top:16vh;width:calc(100vw - 48px)}.world h2{font-size:clamp(35px,8.3vw,60px);max-width:90vw}.world .body-copy{font-size:12px;max-width:255px}.world .second{max-width:235px}.ending{max-width:none;padding:28vh 24px 0}.ending h2{font-size:clamp(44px,11vw,78px)}.ending .body-copy{font-size:14px}.reading-content{padding:100px 25px 60px}.reading-content p{font-size:17px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.enter span{transition:none}}

html[data-theme="light"] .masthead button,html[data-theme="light"] .wayfinding{color:#172437}html[data-theme="light"] .brand img{filter:brightness(0)}html[data-theme="light"] .human{color:#172437}html[data-theme="light"] .human em{color:#5b3d8b}html[data-theme="light"] .human .body-copy{color:#223149}html[data-theme="light"] .human .second{color:#34465e}html[data-theme="light"] .eyebrow{color:#26364d}html[data-scene="human"] .scene-shade{opacity:0}html[data-scene="city"] .scene-shade{background:linear-gradient(90deg,rgba(2,10,20,.91),rgba(2,10,20,.66) 24%,rgba(2,10,20,.15) 50%,transparent 68%)}html[data-scene="city"] .masthead{background:linear-gradient(180deg,rgba(2,10,20,.7),transparent)}html[data-scene="city"] .wayfinding{background:linear-gradient(0deg,rgba(2,10,20,.7),transparent)}

.close:hover{color:#523a81}
@media(max-width:768px){#person{height:142.5vw;bottom:1vh}html[data-scene="city"] .scene-shade{background:linear-gradient(180deg,rgba(2,10,20,.7),rgba(2,10,20,.72) 44%,rgba(2,10,20,.18) 68%,transparent 90%)}}
@media(max-height:500px) and (orientation:landscape){.masthead{padding-top:15px}.brand{width:90px}.opening{top:22vh}.opening h1{font-size:40px;line-height:.98;margin-bottom:12px}.opening .eyebrow{margin-bottom:10px}.opening-bottom p{font-size:11px;max-width:430px;line-height:1.4}.opening-bottom{align-items:flex-start}.opening-bottom .enter{font-size:11px;margin-top:0}.human,.knowledge,.world{top:22vh}.human h2,.knowledge h2,.world h2{font-size:34px;margin-bottom:16px}.human .body-copy,.knowledge .body-copy,.world .body-copy{font-size:11px;line-height:1.4;margin-bottom:10px;max-width:310px}.eyebrow{margin-bottom:12px}.ending{padding-top:23vh}.ending h2{font-size:44px;margin-bottom:14px}.ending .body-copy{font-size:12px}.wayfinding{padding-bottom:14px}}
@media(max-width:768px){#person{top:35vh;bottom:auto}}
@media(max-width:768px) and (max-height:720px){.human{top:15vh}.human h2{font-size:41px;margin-bottom:24px}.human .body-copy{font-size:11px;max-width:202px}#person{top:44vh;left:29%;width:90vw;height:135vw}.opening{top:16vh}.opening .eyebrow{margin-bottom:16px}.opening h1{font-size:clamp(37px,11.5vw,83px);margin-bottom:22px}.opening-bottom p{font-size:12px}.opening .enter{margin-top:16px}.world h2{font-size:34px}.world{top:17vh}}
#application-canvas{touch-action:none}dialog{touch-action:pan-y}
/* Keep copy legible over the replacement satellite's brighter metal. The shade
   travels with the knowledge passage's opacity, leaving the flight rig intact. */
.knowledge::before{content:'';position:absolute;z-index:-1;inset:-6vh -2.5vw -6vh -6.5vw;pointer-events:none;background:linear-gradient(90deg,rgba(2,10,20,.74),rgba(2,10,20,.55) 68%,transparent);mask-image:linear-gradient(180deg,transparent,#000 13%,#000 85%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 13%,#000 85%,transparent)}
@media(max-width:768px){.knowledge::before{inset:-5vh -24px -5vh -24px;background:linear-gradient(90deg,rgba(2,10,20,.8),rgba(2,10,20,.72) 68%,rgba(2,10,20,.08) 96%,transparent)}}

/* Keep both workers together in their original proportions. The source frames
   supply transparency and mirroring; this layer only composes the scene. */
#person.energy-workers{left:51%;right:auto;top:13vh;bottom:auto;width:min(44vw,72vh);height:auto;aspect-ratio:var(--people-aspect,620 / 720)}
#person.energy-workers canvas{display:block;width:100%;height:auto}
@media(max-width:768px) and (orientation:portrait){
  .human.energy-workers-copy{top:13vh}
  .human.energy-workers-copy h2{font-size:40px;line-height:1.03;margin-bottom:16px}
  .human.energy-workers-copy .eyebrow{margin-bottom:12px}
  .human.energy-workers-copy .body-copy,.human.energy-workers-copy .second{max-width:none;font-size:12px;line-height:1.45;margin-bottom:10px}
  #person.energy-workers{left:0;right:0;margin-inline:auto;top:47vh;bottom:auto;width:min(86vw,42vh);height:auto}
}
@media(max-width:768px) and (max-height:720px) and (orientation:portrait){
  .human.energy-workers-copy h2{font-size:34px;margin-bottom:12px}
  .human.energy-workers-copy .eyebrow{font-size:8px;margin-bottom:10px}
  .human.energy-workers-copy .body-copy,.human.energy-workers-copy .second{font-size:11px;line-height:1.4;margin-bottom:8px}
  #person.energy-workers{top:max(50vh,330px);width:min(86vw,42vh,calc((100vh - max(50vh,330px) - 42px) * var(--people-width-ratio,.861111)))}
}
@media(max-height:500px) and (orientation:landscape){
  .human.energy-workers-copy{top:21vh;width:44vw}
  .human.energy-workers-copy h2{font-size:27px;line-height:1.02;margin-bottom:12px}
  .human.energy-workers-copy .eyebrow{font-size:7px;margin-bottom:10px}
  .human.energy-workers-copy .body-copy,.human.energy-workers-copy .second{font-size:10px;line-height:1.35;max-width:310px;margin-bottom:8px}
  #person.energy-workers{left:56%;top:17vh;width:min(40vw,66vh)}
}

/* Extended sequence navigation. Source objects remain clearly identified while reviewed. */
.chapter-location{min-width:0;justify-self:start;display:flex;align-items:center;gap:16px;white-space:nowrap}
#reference-note{color:inherit;opacity:.7;font-size:9px;letter-spacing:.02em}
html[data-scene="reference"] .scene-shade{opacity:0}
html[data-scene="reference"] .masthead{background:linear-gradient(180deg,rgba(3,10,18,.30),transparent)}
html[data-scene="reference"][data-theme="light"] .masthead{background:none}
@media(min-width:769px) and (max-width:1100px){.masthead{gap:18px}.reading-toggle{font-size:10px}.reading-toggle{margin-left:8px}.brand{width:100px;flex-shrink:0}}
@media(max-width:768px){.chapter-location{display:block}#reference-note{display:block;font-size:8px;margin-top:5px}#reference-note[hidden]{display:none}}

/* The restored car occupies the lower edge on small screens. Keep controls readable. */
@media(max-width:900px){html[data-action="true"] .wayfinding{color:#f2f0e8;background:linear-gradient(0deg,rgba(3,10,18,.88),rgba(3,10,18,.52) 60%,transparent)}}

/* Federated Fabric: lettering lives on the cloth; capabilities frame the orb. */
#federated-fabric-reveal{position:absolute;inset:0;visibility:hidden;opacity:0;pointer-events:none;font-family:Helvetica,Arial,sans-serif;color:#fff}
.federated-cloth{position:absolute;left:0;top:0;transform-origin:center;will-change:transform}
.federated-cloth canvas{display:block;width:100%;height:100%}
.fabric-accessible-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.fabric-capabilities{position:absolute;left:0;top:0;margin:0;padding:0;list-style:none}
.fabric-capabilities li{position:absolute;left:0;width:100%;margin:0;opacity:0;font-family:Helvetica,Arial,sans-serif;font-size:clamp(16px,1.5vw,22px);font-weight:400;letter-spacing:-.02em;line-height:1.3;color:#f1eef7;text-shadow:0 2px 14px rgba(4,5,15,.8);text-wrap:balance;will-change:opacity,transform}
.fabric-capabilities-left{text-align:right}
.fabric-capabilities-right{text-align:left}
@media(max-width:768px) and (orientation:portrait){.fabric-capabilities li{font-size:clamp(11px,3.1vw,15px);line-height:1.3;letter-spacing:-.025em}}
@media(max-height:500px) and (orientation:landscape){.fabric-capabilities li{font-size:12px;line-height:1.2}}

/* Keep the awareness passage clear of the footer on short landscape screens. */
@media(max-height:500px) and (orientation:landscape){.knowledge .body-copy{max-width:430px}}

/* Centered copy replaces the original corner-pinned compute label. */
.compute-copy{left:50%;top:auto;bottom:calc(80px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:min(960px,calc(100vw - 80px));max-width:none;text-align:center;font-family:Helvetica,Arial,sans-serif;text-shadow:0 2px 20px rgba(0,0,0,.85)}
.compute-copy h2{font-family:Helvetica,Arial,sans-serif;font-size:clamp(36px,4vw,60px);font-weight:400;line-height:1.1;letter-spacing:-.045em;margin:0 0 24px;text-wrap:balance}
.compute-copy .body-copy{font-family:Helvetica,Arial,sans-serif;max-width:680px;margin:0 auto;font-size:clamp(15px,1.2vw,18px);line-height:1.55;color:#e2e2e8;text-wrap:balance}
@media(max-width:768px){.compute-copy{bottom:calc(104px + env(safe-area-inset-bottom,0px));width:calc(100vw - 48px)}.compute-copy h2{font-size:clamp(28px,7.6vw,42px);margin-bottom:20px}.compute-copy .body-copy{font-size:14px;line-height:1.5}}
@media(max-height:500px) and (orientation:landscape){.compute-copy{bottom:calc(80px + env(safe-area-inset-bottom,0px));width:calc(100vw - 72px)}.compute-copy h2{font-size:clamp(23px,3.5vw,32px);margin-bottom:14px}.compute-copy .body-copy{font-size:12px;line-height:1.4;max-width:640px}}

.load-actions{display:flex;gap:24px;align-items:center;justify-content:center;flex-wrap:wrap}.load-actions .enter{font-size:13px;padding:10px 0;margin-top:0}

/* Global navigation. The closed trigger matches the white/black Adaly wordmark. */
.menu-toggle{position:fixed;top:31px;right:calc(3.4vw - 8px);width:44px;height:44px;padding:8px;color:#fafafa;display:grid;place-items:center;z-index:2}
.menu-toggle span{position:absolute;width:27px;height:1.5px;background:currentColor;transition:transform .22s ease;transform:translateY(-4px)}
.menu-toggle span+span{transform:translateY(4px)}
html[data-theme="light"] .masthead .menu-toggle{color:#000}
#site-menu{color-scheme:light;position:fixed;inset:20px calc(3.4vw - 20px) auto auto;width:360px;max-width:calc(100vw - 32px);height:auto;max-height:calc(100dvh - 40px);margin:0;padding:87px 40px 44px;border:1px solid rgba(255,255,255,.6);border-radius:20px;overflow-y:auto;overscroll-behavior:contain;color:#3f3d42;background:radial-gradient(ellipse at 100% 0%,rgba(247,220,200,.56),transparent 73%),radial-gradient(ellipse at 88% 100%,rgba(231,217,241,.36),transparent 78%),#f8f5f1;box-shadow:0 16px 60px rgba(0,0,0,.12);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}
#site-menu[open]{animation:menu-appear .18s ease-out}
#site-menu::backdrop{background:transparent}
#site-menu .menu-toggle{color:#3f3d42}
#site-menu .menu-toggle span{transform:rotate(45deg)}
#site-menu .menu-toggle span+span{transform:rotate(-45deg)}
#site-menu .menu-toggle:focus-visible{outline-color:#7954db;outline-offset:2px;border-radius:6px}
.site-menu-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:24px}
.site-menu-list li{margin:0;padding:0}
.site-menu-list button,.site-menu-list a{display:block;width:100%;padding:0;text-align:left;font-family:inherit;font-size:25px;font-weight:300;line-height:1.25;letter-spacing:-.025em;color:inherit;opacity:1;cursor:default;text-decoration:none;-webkit-text-fill-color:currentColor}
.site-menu-list a{cursor:pointer}.site-menu-list a:hover{color:#7954db}.site-menu-list a:focus-visible{outline:2px solid #7954db;outline-offset:7px;border-radius:2px}
.wayfinding .reading-toggle{justify-self:end;margin:0;padding:8px 0;color:inherit;font-size:11px;letter-spacing:.025em}
@keyframes menu-appear{from{opacity:0}to{opacity:1}}
@media(max-width:768px){
  .menu-toggle{top:calc(15px + env(safe-area-inset-top,0px));right:15px}
  .masthead{padding-top:calc(22px + env(safe-area-inset-top,0px))}
  #site-menu{inset:0;width:100%;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;padding:calc(clamp(100px,17dvh,160px) + env(safe-area-inset-top,0px)) 32px calc(48px + env(safe-area-inset-bottom,0px));box-shadow:none}
  .site-menu-list{gap:clamp(22px,3.3dvh,34px)}
  .site-menu-list button,.site-menu-list a{font-size:clamp(26px,7.4vw,36px);line-height:1.25}
  .wayfinding .reading-toggle{font-size:10px}
  .wayfinding{padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}
}
@media(max-height:500px) and (orientation:landscape){
  .menu-toggle{top:12px}
  #site-menu{padding-top:70px;padding-bottom:28px}
  .site-menu-list{gap:18px}
  .site-menu-list button,.site-menu-list a{font-size:23px}
}
@media(prefers-reduced-motion:reduce){.menu-toggle span{transition:none}#site-menu[open]{animation:none}}

@media(max-width:374px){.wayfinding{padding-inline:16px;gap:6px;font-size:8px;letter-spacing:.02em}.wayfinding button,.wayfinding .reading-toggle{font-size:9px;letter-spacing:.02em}.wayfinding button span{padding-left:6px}.wayfinding .reading-toggle{gap:6px}.wayfinding .story-arrow{width:12px;height:12px}}
