*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:0}body{margin:0;color:#7e6256;background:#fbf1e6;font-family:Georgia,serif}header{position:fixed;top:0;left:0;width:100%;padding:27px 4vw;display:flex;justify-content:space-between;align-items:center;z-index:10;pointer-events:none}header>*{pointer-events:auto}.brand{font:italic 25px Georgia;letter-spacing:-.8px}.brand span{font-size:17px;color:#c5917b;margin-left:5px}a{color:inherit;text-decoration:none}nav{display:flex;gap:5px;border-radius:30px;padding:5px;background:#fffaf05c;backdrop-filter:blur(12px);box-shadow:0 0 0 1px #cda98e15}nav a{font:10px 'Trebuchet MS',sans-serif;padding:10px 15px;border-radius:25px;color:#a1816e}nav a.active{background:#bb987417;color:#785947}a:focus-visible,button:focus-visible{outline:2px solid #bb876f;outline-offset:5px}.chapter{height:240svh;position:relative}.sticky{height:100svh;min-height:550px;position:sticky;top:0;overflow:hidden;display:flex;align-items:center}.paper .sticky{background:radial-gradient(ellipse at 66% 43%,#fffaf3,#f7e7da)}.moon .sticky{background:radial-gradient(ellipse at 65% 47%,#f5dfc1,#e4bf9e)}.wings .sticky{background:radial-gradient(ellipse at 65% 40%,#fffbec,#edeedb)}.ribbon .sticky{background:radial-gradient(ellipse at 65% 50%,#fff8ef,#efddd3)}.copy{position:relative;z-index:2;width:40%;margin-left:8vw;pointer-events:none}.eyebrow{font:8px 'Trebuchet MS',sans-serif;letter-spacing:.2em;color:#a68a76}h1,h2{font-size:clamp(34px,4.5vw,68px);line-height:1.1;font-weight:400;letter-spacing:-.035em;margin:25px 0}h1 em,h2 em{font-weight:400;color:#b78878}.copy>p:last-of-type{font:14px/1.9 Georgia;color:#a38b79}.art{position:absolute;left:43%;top:12%;width:54%;height:76%;perspective:1200px;isolation:isolate}.foot{position:absolute;bottom:30px;left:4vw;right:4vw;display:flex;justify-content:space-between;font:9px 'Trebuchet MS',sans-serif;color:#a58b77;letter-spacing:.03em}.progress{position:fixed;left:0;bottom:0;right:0;height:3px;background:#bb8f6c10;z-index:11}.progress i{display:block;height:100%;width:100%;background:#bd9980;transform:scaleX(0);transform-origin:left}.envelope{position:absolute;left:50%;top:58%;width:340px;height:220px;transform:translate(-50%,-50%) rotate(-7deg);transform-style:preserve-3d}.back{position:absolute;inset:0;background:#d7a797;border-radius:12px;box-shadow:0 15px 35px #9d6b5120}.pocket{position:absolute;inset:0;z-index:3;background:linear-gradient(145deg,#f1c7b7,#dfad9d);clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);border-radius:12px}.pocket:after{content:'';position:absolute;inset:0;background:linear-gradient(145deg,#f4cbb9,#e6b6a4);clip-path:polygon(0 100%,50% 40%,100% 100%)}.lid,.lid-back{position:absolute;inset:0;background:linear-gradient(160deg,#f7d6c7,#e6b5a2);clip-path:polygon(0 0,100% 0,53% 62%,50% 64%,47% 62%);transform-origin:top;z-index:4;backface-visibility:hidden;border-radius:8px}.lid-back{z-index:0;transform:rotateX(180deg);opacity:0;background:#e5b6a2}.letter{position:absolute;left:25px;right:25px;top:12px;height:195px;background:#fff9ed;border-radius:9px;z-index:2;box-shadow:0 5px 15px #8c654019;text-align:center}.letter:after{content:'';position:absolute;inset:14px;border:1px solid #e6d9c236;border-radius:4px}.letter span{display:block;color:#bf9683;font:31px Georgia;margin-top:32px}.seal{position:absolute;left:147px;top:116px;width:48px;height:47px;background:radial-gradient(circle at 30% 20%,#dfa9a0,#bd827d);box-shadow:inset 0 0 0 4px #ca91893b,0 3px 6px #9e6b5815;border-radius:48% 44% 50% 45%;z-index:5;display:grid;place-items:center;color:#f2ccc0;font:26px Georgia}.paper-shadow{position:absolute;width:260px;height:20px;border-radius:50%;background:#a77e5912;filter:blur(15px);left:50%;top:85%;transform:translateX(-50%)}.moonball{position:absolute;left:50%;top:50%;width:225px;height:225px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 30% 25%,#fff3cd,#e5bd82 75%);box-shadow:inset -15px -10px 25px #ba915422,0 20px 65px #a87c3713;overflow:hidden}.moonball:after{content:'';position:absolute;inset:-1px;border-radius:50%;background:radial-gradient(circle at 75% 45%,#a6836350,transparent 66%)}.moonball i,.moonball b,.moonball span{position:absolute;border-radius:50%;background:#d6b3821c;box-shadow:inset 3px 3px 8px #c69e6520}.moonball i{width:40px;height:40px;left:40px;top:42px}.moonball b{width:65px;height:65px;right:25px;bottom:33px}.moonball span{width:22px;height:22px;left:67px;bottom:49px}.orbit{position:absolute;left:50%;top:50%;border:1px solid #ac8b621d;border-radius:50%;transform:translate(-50%,-50%) rotate(-28deg)}.orbit-one{width:420px;height:255px}.orbit-two{width:500px;height:330px}.little-world{position:absolute;left:50%;top:50%;width:39px;height:39px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#f4c1ad,#c6937f);box-shadow:0 5px 15px #9d654018}.cloud{position:absolute;background:#fff4df;border-radius:60px;filter:drop-shadow(0 6px 10px #a77a5210);opacity:.85}.cloud:before,.cloud:after{content:'';position:absolute;border-radius:50%;background:inherit}.cloud-a{width:130px;height:28px;left:15%;top:65%}.cloud-a:before{width:58px;height:58px;bottom:4px;left:22px}.cloud-a:after{width:42px;height:42px;bottom:3px;left:69px}.cloud-b{width:100px;height:22px;right:10%;top:29%}.cloud-b:before{width:40px;height:40px;bottom:2px;left:13px}.cloud-b:after{width:31px;height:31px;bottom:3px;left:47px}.star{position:absolute;color:#fff2d8;font:18px Georgia}.wing-halo{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(ellipse,#f4d8b425,transparent 65%)}.butterfly{position:absolute;left:50%;top:48%;width:60px;height:50px;z-index:3;transform-style:preserve-3d}.butterfly i,.butterfly b{position:absolute;top:0;width:30px;height:44px;background:var(--wing);box-shadow:inset 2px 2px 7px #fffae540;border-radius:75% 45% 65% 35%;transform-origin:right center}.butterfly b{left:30px;border-radius:45% 75% 35% 65%;transform-origin:left center}.butterfly:after{content:'';position:absolute;left:28px;top:9px;width:4px;height:28px;border-radius:5px;background:#ae957d}.postcard{position:absolute;left:50%;top:50%;width:270px;height:200px;background:#fff9ed;border-radius:12px;box-shadow:0 15px 40px #85774c13;transform:translate(-50%,-50%) rotate(-5deg)}.postcard-inner{position:absolute;inset:15px;border:1px solid #dcccac45;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center}.postcard span{font:italic 18px Georgia;color:#b4937b}.postcard strong{font:italic 38px Georgia;font-weight:400;color:#ad7c70;margin:7px}.postcard i{font:25px Georgia;color:#c6a18b}.ribbon svg{position:absolute;width:100%;height:100%;inset:0;overflow:visible}.silk,.silk-light,.ribbon-shadow{fill:none;stroke-linecap:round;stroke-linejoin:round}.silk{stroke:url(#silk);stroke-width:16;filter:url(#soft)}.silk-light{stroke:#fff2de;stroke-width:1.5;opacity:.5;transform:translateY(-4px)}.ribbon-shadow{stroke:#ad7c67;stroke-width:19;opacity:.045;transform:translateY(10px)}.ribbon-word{position:absolute;top:38%;left:48%;font:italic 45px Georgia;color:#ca9e94;opacity:0}#again{pointer-events:auto;font:10px 'Trebuchet MS',sans-serif;background:#bd958419;color:#9b7867;border:1px solid #c6a28b26;border-radius:30px;padding:14px 18px;cursor:pointer;margin-top:17px}#again span{margin-left:15px}@media(max-width:700px){header{padding:20px 22px}.brand{font-size:21px}nav a{padding:9px 8px;font-size:8px}nav{gap:0}.copy{position:absolute;left:26px;top:16%;margin:0;width:85%}h1,h2{font-size:36px;margin:17px 0}.copy>p:last-of-type{font-size:12px;line-height:1.7}.eyebrow{font-size:7px}.art{left:0;top:35%;width:100%;height:58%;transform:scale(.83);transform-origin:center}.foot{bottom:22px;left:23px;right:23px;font-size:7px}.foot>span:first-child{max-width:170px}.envelope{width:310px;height:200px}.seal{left:132px;top:106px}.letter{height:175px}.moonball{width:185px;height:185px}.orbit-one{width:340px;height:230px}.orbit-two{width:390px;height:300px}.copy #again{margin-top:6px;padding:11px 15px}.ribbon .art{top:40%;height:53%}.chapter{height:210svh}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chapter{height:100svh}}
.butterfly i,.butterfly b{height:31px;border-radius:85% 55% 60% 45%}.butterfly b{border-radius:55% 85% 45% 60%}.butterfly i:after,.butterfly b:after{content:'';position:absolute;width:21px;height:24px;top:23px;background:var(--wing);border-radius:45% 60% 70% 80%;box-shadow:inset 2px -2px 5px #fffae525}.butterfly i:after{right:0}.butterfly b:after{left:0;border-radius:60% 45% 80% 70%}
/* Continuous-story overrides: one fixed illustration accompanies all content. */
body{background:#fbefe3}.continuous-art{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}.continuous-art .art{left:43%;top:12%;width:54%;height:76%;transition:none}.chapter{height:180svh}.chapter .sticky{background:transparent;overflow:visible}.copy{z-index:2}.layer-wings,.layer-ribbon{opacity:0}.layer-paper .envelope{transform-style:flat}.layer-wings .postcard{opacity:0}.story-footer{position:fixed;bottom:25px;left:4vw;right:4vw;z-index:5;display:flex;justify-content:space-between;font:9px 'Trebuchet MS',sans-serif;letter-spacing:.04em;color:#a88a76}.ribbon .sticky{align-items:center}header{z-index:10}.chapter .copy{pointer-events:auto}.chapter .eyebrow{font-size:8px}.layer-wings .wing-halo{display:none}
@media(max-width:700px){.continuous-art .art{left:0;top:38%;width:100%;height:55%;transform:scale(.8)}.chapter{height:170svh}.chapter .copy{top:15%;width:85%}.chapter h1,.chapter h2{font-size:33px}.chapter .copy>p:last-of-type{font-size:12px}.story-footer{font-size:7px;left:23px;right:23px}.layer-ribbon svg{transform:scale(.9)}.copy #again{margin-top:3px}.brand{font-size:25px}}
@media(prefers-reduced-motion:reduce){.chapter{height:110svh}}