:root{--story-mint:#42e8d0;--story-berry:#d34369;--story-red:#ff4f65;--story-amber:#ffbd68;--story-navy:#02080d}
.story-page,.story-shell{height:100dvh;min-height:620px;overflow:hidden;background:var(--story-navy)}
.story-stage{position:absolute;inset:0;isolation:isolate}
.chapter-scene{position:absolute;inset:0;visibility:hidden;opacity:0;overflow:hidden;transition:opacity .55s ease,clip-path .9s cubic-bezier(.72,0,.18,1);clip-path:inset(0 0 0 100%);background:#02080d}
.chapter-scene.is-active{visibility:visible;opacity:1;clip-path:inset(0);z-index:2}
.scene-layer{position:absolute;inset:0;pointer-events:none;will-change:transform,opacity,filter}
.layer-background{z-index:0;background:center/cover no-repeat;transform:scale(1.045)}
.layer-weather{z-index:1;opacity:.8;mix-blend-mode:screen}
.layer-midground{z-index:2;background:radial-gradient(circle at 72% 42%,rgba(66,232,208,.08),transparent 25%),linear-gradient(90deg,rgba(2,8,13,.92),rgba(2,8,13,.34) 48%,rgba(2,8,13,.04) 72%)}
.layer-city{z-index:3;inset:9% 6% 22% 44%;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:1fr;gap:clamp(12px,2vw,40px);opacity:.7}
.city-window{align-self:center;justify-self:center;width:7px;height:10px;border-radius:1px;background:#17333d;box-shadow:0 0 0 transparent;transition:background .55s,box-shadow .55s,transform .55s,opacity .55s}
.layer-actors{z-index:5}
.actor{position:absolute;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 20px 25px rgba(0,0,0,.55));transition:opacity .35s,transform .55s,filter .55s}
.developer-actor{right:7%;bottom:1%;width:min(48vw,720px);height:73%;opacity:0}
.yak-actor{right:4%;bottom:0;width:min(45vw,660px);height:77%;opacity:0}
.coat-comic{z-index:4;left:auto;right:2.5%;top:13%;bottom:12%;width:48%;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:center;opacity:0;transform:translateX(55px);transition:opacity .7s,transform .9s}
.coat-comic img{width:100%;height:56%;object-fit:contain;filter:saturate(.75) brightness(.58) drop-shadow(0 12px 22px #000);opacity:.5;border:1px solid rgba(244,223,196,.16);background:linear-gradient(180deg,rgba(211,67,105,.09),rgba(2,8,13,.56));clip-path:polygon(8% 0,100% 0,92% 100%,0 100%)}
.coat-comic img:nth-child(2){transform:translateY(-7%);opacity:.62}.coat-comic img:nth-child(3){transform:translateY(7%)}
.layer-objects{z-index:6;inset:10% 5% 18% 42%}
.module{position:absolute;width:54px;aspect-ratio:1;border:1px solid rgba(66,232,208,.7);border-radius:11px;background:rgba(2,18,24,.3);box-shadow:inset 0 0 18px rgba(66,232,208,.1),0 0 22px rgba(66,232,208,.08);transform:rotate(45deg) scale(.2);opacity:0}
.module:nth-child(1){left:6%;top:60%}.module:nth-child(2){left:24%;top:31%}.module:nth-child(3){left:40%;top:59%}.module:nth-child(4){left:56%;top:19%}.module:nth-child(5){left:71%;top:49%}.module:nth-child(6){left:86%;top:25%}.module:nth-child(7){left:46%;top:4%}.module:nth-child(8){left:78%;top:72%}
.proof-svg{z-index:7;overflow:visible;filter:drop-shadow(0 0 7px rgba(66,232,208,.75))}
.proof-path{fill:none;stroke:var(--story-mint);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:14 18;stroke-dashoffset:620;opacity:.16}
.proof-spark{fill:#effffa;stroke:var(--story-mint);stroke-width:7;opacity:0;transform-origin:center;filter:drop-shadow(0 0 14px #42e8d0)}
.layer-effects{z-index:8}
.light-wash{position:absolute;inset:0;background:radial-gradient(circle at 70% 42%,rgba(66,232,208,.35),transparent 32%);opacity:0;mix-blend-mode:screen}
.crack-svg{position:absolute;right:10%;bottom:12%;width:38%;height:46%;overflow:visible;filter:drop-shadow(0 0 8px #ff4f65);opacity:0}
.crack-svg path{fill:none;stroke:var(--story-red);stroke-width:3;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600}
.mint-gate{position:absolute;right:12%;top:22%;width:31%;height:53%;border:3px solid var(--story-mint);clip-path:polygon(50% 0,95% 18%,88% 75%,50% 100%,12% 75%,5% 18%);background:linear-gradient(135deg,rgba(66,232,208,.22),rgba(66,232,208,.02));box-shadow:0 0 45px rgba(66,232,208,.45),inset 0 0 40px rgba(66,232,208,.18);opacity:0;transform:scale(.55) rotate(-8deg)}
.regression-fragment{position:absolute;width:22px;height:22px;border:2px solid var(--story-red);background:rgba(255,79,101,.13);opacity:0;transform:rotate(45deg)}
.regression-fragment:nth-of-type(1){right:29%;top:40%}.regression-fragment:nth-of-type(2){right:21%;top:49%}.regression-fragment:nth-of-type(3){right:34%;top:57%}
.status-card,.change-card,.mission-ticket{pointer-events:auto;position:absolute;border-radius:18px;backdrop-filter:blur(18px);box-shadow:0 20px 70px rgba(0,0,0,.35);opacity:0;transform:translateY(25px) scale(.94)}
.status-card{right:12%;top:22%;padding:1rem 1.45rem;border:1px solid rgba(66,232,208,.75);background:rgba(7,47,43,.82);color:#bffcf2;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.status-card.is-false{border-color:var(--story-red);color:#ffd4d9;background:rgba(68,12,24,.85)}
.change-card{right:9%;top:17%;width:min(330px,30vw);padding:1.15rem;border:1px solid rgba(244,223,196,.28);background:rgba(5,16,22,.86);color:#eaf3f2}
.change-card small{display:block;color:var(--story-mint);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.5rem}.change-card strong{font-size:1.05rem}
.keep-labels{position:absolute;right:7%;bottom:12%;display:flex;gap:9vw;font-size:.74rem;font-weight:950;letter-spacing:.16em;text-transform:uppercase;opacity:0}.keep-labels b:first-child{color:var(--story-mint)}.keep-labels b:last-child{color:#ffe3bd}
.mission-ticket{right:8%;bottom:10%;width:min(440px,38vw);padding:1.15rem;border:1px solid rgba(244,223,196,.26);background:linear-gradient(135deg,rgba(24,15,16,.94),rgba(5,18,22,.92));color:#fff2df}
.mission-ticket small{color:var(--story-mint);font-weight:850;letter-spacing:.14em;text-transform:uppercase}.ticket-row{display:flex;gap:.6rem;margin-top:.75rem}.ticket-row input{min-width:0;flex:1;border:1px solid rgba(244,223,196,.25);border-radius:10px;background:rgba(255,255,255,.07);color:#fff;padding:.8rem}.ticket-row button{border:0;border-radius:10px;background:var(--story-mint);color:#03201c;font-weight:900;padding:.8rem 1rem}
.layer-foreground{z-index:9;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.58)),radial-gradient(ellipse at 92% 98%,rgba(2,8,13,.78),transparent 35%);transform:scale(1.03)}
.particle-field{z-index:4;opacity:0;overflow:hidden;transition:opacity .8s}
.particle-field i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:var(--story-mint);box-shadow:0 0 12px var(--story-mint),0 0 26px rgba(66,232,208,.46);opacity:.2;animation:proof-drift var(--d) ease-in-out var(--delay) infinite alternate}
.particle-field i:nth-child(3n){background:var(--story-berry);box-shadow:0 0 12px var(--story-berry);opacity:.28}.particle-field i:nth-child(4n){border-radius:1px;transform:rotate(45deg)}
.chapter-scene[data-chapter="1"].is-active .particle-field{opacity:1}.chapter-scene[data-chapter="1"] .layer-weather{display:none}
.chapter-beat-strip{position:absolute;z-index:14;left:3.5vw;right:3.5vw;bottom:2.3vh;height:126px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(244,223,196,.25);border-radius:36px;overflow:hidden;background:linear-gradient(90deg,rgba(8,20,27,.96),rgba(5,13,19,.92));box-shadow:0 22px 60px rgba(0,0,0,.48);opacity:0;transform:translateY(30px);transition:opacity .65s,transform .65s;pointer-events:none}
.chapter-scene[data-chapter="1"].is-active .chapter-beat-strip{opacity:1;transform:none;pointer-events:auto}
.chapter-beat-strip button{position:relative;display:grid;grid-template-columns:42% 58%;align-items:center;min-width:0;border:0;border-right:1px solid rgba(244,223,196,.14);padding:8px 18px 8px 10px;color:#eef8f6;background:transparent;text-align:left;cursor:pointer;transition:background .35s,box-shadow .35s}.chapter-beat-strip button:last-child{border-right:0}.chapter-beat-strip button:hover,.chapter-beat-strip button.is-current{background:linear-gradient(135deg,rgba(66,232,208,.11),rgba(211,67,105,.08));box-shadow:inset 0 2px 0 var(--story-mint)}
.strip-shot{position:relative;display:block;height:106px;overflow:hidden;border-radius:24px;background:radial-gradient(circle at 55% 52%,rgba(66,232,208,.18),rgba(3,10,16,.72) 64%)}.strip-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 18px #000)}.strip-shot i{position:absolute;right:10px;top:10px;width:25px;height:25px;border:1px solid var(--story-mint);border-radius:50%;box-shadow:0 0 16px rgba(66,232,208,.4)}.strip-shot i:after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:var(--story-mint);font-size:.7rem;font-weight:900}
.chapter-beat-strip button:nth-child(2) .strip-shot i{border-color:var(--story-red)}.chapter-beat-strip button:nth-child(2) .strip-shot i:after{content:"!";color:var(--story-red)}
.strip-copy{display:block;padding-left:16px;min-width:0}.strip-copy strong{display:block;color:var(--story-mint);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.45rem}.chapter-beat-strip button:nth-child(2) strong{color:#ff7185}.strip-copy small{display:block;color:#cbd7d7;font-size:.72rem;line-height:1.35;max-width:25ch}
.story-page[data-story-chapter="1"] .story-controls{bottom:158px}.story-page[data-story-chapter="1"] .story-hint{display:none}
.story-copy{z-index:12;left:6vw;top:49%;width:min(570px,44vw);transform:translateY(-48%);transition:opacity .25s}
.story-copy.is-hidden{opacity:0!important}
.story-counter{display:flex;align-items:center;gap:.8rem;color:var(--story-mint);letter-spacing:.18em;text-transform:uppercase;font-weight:900;font-size:.74rem}.story-counter:after{content:"";width:64px;height:1px;background:var(--story-mint)}
.chapter-title{font-size:clamp(3rem,6.4vw,6.8rem);line-height:.89;letter-spacing:-.06em;margin:.85rem 0 1.2rem;text-wrap:balance}
.beat-card{max-width:530px;border-left:2px solid var(--story-mint);padding:.1rem 0 .1rem 1.15rem}.beat-card h2{margin:0 0 .55rem;font-size:clamp(1.15rem,1.8vw,1.65rem)}.beat-card p{margin:0;color:#d2dddd;font-size:clamp(.95rem,1.15vw,1.08rem);line-height:1.55}
.timeline-cue{display:inline-block;margin-top:.9rem;font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;color:#7e989b}.chapter-scene.is-playing .timeline-cue:after{content:"  ·  •••";color:var(--story-mint)}
.chapter-scene[data-rain="heavy"] .layer-weather{opacity:1}.chapter-scene[data-rain="light"] .layer-weather{opacity:.32}.chapter-scene[data-rain="still"] .layer-weather{opacity:.08}
.chapter-scene[data-action="room-wakes"] .city-window:nth-child(-n+3),.chapter-scene[data-action="ideas-code"] .city-window:nth-child(-n+9),.chapter-scene[data-action="first-thread"] .city-window:nth-child(-n+12),.chapter-scene[data-action="tower-one"] .city-window:nth-child(-n+5),.chapter-scene[data-action="tower-many"] .city-window:nth-child(-n+14),.chapter-scene[data-action="after-rain"] .city-window,.chapter-scene[data-action="guardian-rests"] .city-window,.chapter-scene[data-action="invitation"] .city-window{background:var(--story-amber);box-shadow:0 0 18px rgba(255,189,104,.85)}
.chapter-scene[data-action="ideas-code"] .module:nth-child(-n+4),.chapter-scene[data-action="first-thread"] .module:nth-child(-n+5),.chapter-scene[data-action="workshop-grows"] .module:nth-child(-n+5),.chapter-scene[data-action="time-passes"] .module,.chapter-scene[data-action="map-bigger"] .module,.chapter-scene[data-action="observe"] .module,.chapter-scene[data-action="restore"] .module{opacity:1;transform:rotate(45deg) scale(1)}
.chapter-scene[data-action="map-bigger"] .layer-objects{transform:scale(1.34) translate(-9%,2%)}
.chapter-scene[data-action="city-scale"] .layer-background{transform:scale(.94)}
.chapter-scene[data-action="close-in"] .layer-midground{background:radial-gradient(circle at 70% 44%,rgba(211,67,105,.15),transparent 30%),linear-gradient(90deg,rgba(2,8,13,.94),rgba(2,8,13,.18))}
.chapter-scene[data-action="silence"] .layer-city,.chapter-scene[data-action="silence"] .layer-objects{opacity:.08;filter:saturate(0)}
.chapter-scene[data-action="done"] .status-card,.chapter-scene[data-action="crack"] .status-card,.chapter-scene[data-action="spark-find"] .status-card{opacity:1;transform:none}
.chapter-scene[data-action="crack"] .crack-svg,.chapter-scene[data-action="spark-find"] .crack-svg,.chapter-scene[data-action="block"] .crack-svg{opacity:1}.chapter-scene[data-action="crack"] .crack-svg path,.chapter-scene[data-action="spark-find"] .crack-svg path,.chapter-scene[data-action="block"] .crack-svg path{stroke-dashoffset:0}
.chapter-scene[data-action="lessons"] .light-wash,.chapter-scene[data-action="opens-eyes"] .light-wash,.chapter-scene[data-action="coat"] .light-wash{opacity:.7;background:radial-gradient(circle at 69% 51%,rgba(211,67,105,.22),rgba(66,232,208,.13) 30%,transparent 56%)}
.chapter-scene[data-action="coat"] .layer-background{filter:brightness(.38) saturate(.72) blur(1.5px)}
.chapter-scene[data-action="coat"] .layer-midground{background:linear-gradient(90deg,rgba(2,8,13,.96) 0 42%,rgba(2,8,13,.78) 57%,rgba(2,8,13,.52))}
.chapter-scene[data-action="coat"] .coat-comic{opacity:.52;transform:none}
.chapter-scene[data-action="coat"] .yak-actor{right:7%;bottom:-1%;width:min(43vw,680px);height:80%;z-index:2;filter:drop-shadow(0 28px 38px rgba(0,0,0,.8)) drop-shadow(0 0 18px rgba(211,67,105,.2))}
.chapter-scene[data-action="coat"] .proof-svg{opacity:.35}
.chapter-scene[data-action="observe"] .change-card,.chapter-scene[data-action="block"] .change-card,.chapter-scene[data-action="restore"] .change-card{opacity:1;transform:none}
.chapter-scene[data-action="block"] .mint-gate{opacity:1;transform:none}.chapter-scene[data-action="block"] .regression-fragment{opacity:1}.chapter-scene[data-action="block"] .status-card{opacity:1;transform:none}
.chapter-scene[data-action="restore"] .keep-labels{opacity:1}.chapter-scene[data-action="restore"] .crack-svg{opacity:.18}.chapter-scene[data-action="restore"] .city-window:last-child{background:var(--story-amber);box-shadow:0 0 22px var(--story-amber)}
.chapter-scene[data-action="invitation"] .mission-ticket{opacity:1;transform:none}
.chapter-scene[data-action="first-thread"] .proof-path,.chapter-scene[data-action="spark-find"] .proof-path,.chapter-scene[data-action="lessons"] .proof-path,.chapter-scene[data-action="observe"] .proof-path,.chapter-scene[data-action="block"] .proof-path,.chapter-scene[data-action="restore"] .proof-path,.chapter-scene[data-action="invitation"] .proof-path{opacity:1;stroke-dashoffset:0}.chapter-scene[data-action="first-thread"] .proof-spark,.chapter-scene[data-action="spark-find"] .proof-spark,.chapter-scene[data-action="lessons"] .proof-spark,.chapter-scene[data-action="restore"] .proof-spark{opacity:1}
.chapter-scene[data-chapter="3"] .layer-midground{background:linear-gradient(90deg,rgba(2,8,13,.92),rgba(2,8,13,.16) 50%,rgba(2,8,13,.08))}.chapter-scene[data-chapter="6"] .layer-midground,.chapter-scene[data-chapter="7"] .layer-midground,.chapter-scene[data-chapter="8"] .layer-midground{background:linear-gradient(90deg,rgba(2,8,13,.93),rgba(2,8,13,.4) 42%,rgba(2,8,13,.02) 75%)}
.story-controls{pointer-events:none}.story-controls>*{pointer-events:auto}.round[disabled]{opacity:.3;cursor:not-allowed}.round.is-waiting{animation:control-pulse .8s ease-in-out infinite alternate}.beat-dots i.on{transform:scaleX(1.08)}
@keyframes control-pulse{to{box-shadow:0 0 24px rgba(66,232,208,.45)}}
@keyframes proof-drift{0%{transform:translate3d(-8px,10px,0) scale(.65);opacity:.12}55%{opacity:.72}100%{transform:translate3d(22px,-34px,0) scale(1.25);opacity:.22}}
@media(max-width:900px){.story-page,.story-shell{min-height:560px}.story-top{height:62px;padding:0 16px}.story-progress{top:61px}.story-link-small,.story-hint{display:none}.story-tools{gap:.55rem}.story-tools .button.small{display:none}.brand{font-size:1.03rem}.layer-background{background-position:center top}.layer-midground{background:linear-gradient(180deg,rgba(2,8,13,.05) 42%,rgba(2,8,13,.94) 74%,#02080d 100%)!important}.layer-city{inset:8% 3% 42% 15%}.developer-actor,.yak-actor{right:-8%;bottom:24%;width:95vw;height:57%}.layer-objects{inset:8% 2% 39% 4%}.module{width:34px}.crack-svg{right:2%;bottom:32%;width:62%;height:31%}.mint-gate{right:5%;top:20%;width:50%;height:43%}.story-copy{left:20px;right:20px;top:auto;bottom:92px;width:auto;transform:none}.chapter-title{font-size:clamp(2.25rem,11vw,4.3rem);margin:.55rem 0 .7rem}.beat-card{max-width:none}.beat-card h2{font-size:1.08rem}.beat-card p{font-size:.88rem;line-height:1.42}.timeline-cue{display:none}.story-controls{left:20px;right:20px;bottom:22px}.round{width:46px;height:46px}.change-card{right:4%;top:16%;width:52vw}.status-card{right:5%;top:18%}.mission-ticket{left:20px;right:20px;bottom:29%;width:auto;padding:.9rem}.ticket-row input{width:55%}.keep-labels{right:4%;bottom:32%;gap:20vw}.layer-foreground{background:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.75) 75%,#02080d)}.chapter-scene[data-action="coat"] .layer-midground{background:linear-gradient(180deg,rgba(2,8,13,.18) 0 38%,rgba(2,8,13,.8) 68%,#02080d 100%)!important}.chapter-scene[data-action="coat"] .coat-comic{top:11%;right:1%;bottom:auto;width:98%;height:28%;gap:5px}.coat-comic img{height:100%;opacity:.34}.chapter-scene[data-action="coat"] .yak-actor{right:-9%;bottom:23%;width:97vw;height:58%}.story-page[data-story-chapter="1"] .story-controls{bottom:22px}.chapter-scene[data-chapter="1"] .story-copy{bottom:186px}.chapter-beat-strip{left:10px;right:10px;bottom:72px;height:98px;border-radius:22px}.chapter-beat-strip button{display:block;padding:5px;border-right:1px solid rgba(244,223,196,.12)}.strip-shot{height:86px;border-radius:17px}.strip-copy{display:none}}
@media(prefers-reduced-motion:reduce){.scene-layer,.actor,.module,.city-window,.status-card,.change-card,.mission-ticket{animation:none!important;transition:none!important}.round.is-waiting{animation:none}}
