/* B2's paper, type hierarchy and keepsakes; C1's header and cards are in base.css. */
html{scroll-padding-top:16px}body{overflow-x:clip}.header{padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top))}.scroll-story{position:relative;--stage-h:640px;--paper-h:510px;--env-open:365px;--env-closed:180px;--env-w:340px;--env-h:220px}.letter-stick{width:min(1160px,100%);margin:0 auto;position:relative;padding:12px 0 10px;z-index:1;display:grid;grid-template-columns:.68fr 1.32fr;grid-template-areas:'heading art' 'actions art';align-items:center;isolation:isolate}.scroll-ready .letter-stick{position:sticky;top:0}.hero-heading{grid-area:heading;padding:0 0 12px 28px;align-self:end}.hero-heading .phrase{font:400 43px/1.12 var(--serif);max-width:320px;letter-spacing:-1.6px}.hero-actions{grid-area:actions;padding:0 0 0 28px;align-self:start;gap:2px 18px}.hero-actions>button{font-size:14px;min-height:44px}.gift-jump{display:inline-flex;align-items:center;gap:14px;font-size:14px;min-height:44px;border-bottom:1px solid #9daa8e}.gift-jump>span:last-child{color:var(--red);font-size:22px}.stage{grid-area:art;height:var(--stage-h);width:100%;margin:0;position:relative;perspective:1600px;isolation:isolate}.scroll-depth{position:absolute;inset:0;transform-origin:50% 30%;transform-style:preserve-3d;will-change:transform}.scene-world{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(3deg) rotateY(-3deg);transform-origin:50% 50%;perspective:1500px}.ambient{inset:0;overflow:clip}.leaf-left{top:55%;left:0;width:58px}.leaf-right{top:7%;right:2%;width:49px}.spark-a{left:8%;top:19%}.spark-b{right:3%;top:53%}.spark-c{right:15%;bottom:4%}.spark-d{left:11%;bottom:14%}.ground-shadow{left:15%;top:calc(var(--env-open) + 170px);width:70%;height:90px;transform:rotateX(65deg) translateZ(-18px);opacity:.5}.envelope-assembly{position:absolute;left:calc(50% - var(--env-w)/2);top:var(--env-closed);width:var(--env-w);height:var(--env-h);transform-style:preserve-3d;transform:translateY(calc(var(--env-open) - var(--env-closed)))}.envelope-body{left:0;top:0;width:100%;height:100%;transform:translateZ(0)}.envelope-edge{transform:translateZ(-4px) translateY(3px)}.envelope-back{box-shadow:0 19px 27px -8px #304F432c;background:linear-gradient(137deg,#c0caad,#9fad91);border:1px solid #9ead8c}.lining{inset:7px 8px 0;clip-path:polygon(0 0,100% 0,50% 72%)}.flap-hinge{left:0;top:0;width:100%;height:calc(var(--env-w)*.40);transform:translateZ(-18px) rotateX(-176deg);z-index:1}.flap-front{background:linear-gradient(155deg,#c7d0b6,#a6b594);border-top:1px solid #e1e5d4}.flap-back{background:repeating-linear-gradient(45deg,#e3e8d6 0,#e3e8d6 1px,#ccd5b8 1px,#ccd5b8 7px)}.envelope-pocket{left:0;top:0;width:100%;height:100%;transform:translateZ(8px);z-index:5}.pocket-left{background:linear-gradient(140deg,#c8d0b7,#adbd9c)}.pocket-right{background:linear-gradient(225deg,#bdc8ab,#a6b694)}.pocket-bottom{background:linear-gradient(0deg,#bcc7ac,#ced5bb);box-shadow:inset 0 -1px #879a76}.envelope-pocket>p{font:italic 13px var(--serif);left:12%;bottom:24px}.envelope-ribbon{left:1%;top:calc(var(--env-h) - 105px);width:145px;height:auto;transform:translateZ(18px) rotate(-16deg)}.seal-shadow{left:calc(50% - 26px);top:calc(var(--env-h)*.44);width:58px;height:58px;transform:translateZ(9px)}.letter-cavity{left:0;top:0;width:100%;height:100%;transform:translateZ(46px);clip-path:none;z-index:10;pointer-events:none}.letter-rise{position:absolute;left:50%;top:20px;width:min(490px,calc(100% - 80px));transform:translateX(-50%) rotate(-4deg);transform-style:preserve-3d}.letter{position:relative;left:0;top:0;width:100%;height:auto;transform:none;transform-style:preserve-3d;pointer-events:auto}.paper-front{position:relative;inset:auto;padding:34px 38px 38px;overflow:visible;background:var(--white);border:1px solid #e4ddc9;box-shadow:0 2px 2px #304F4315,0 22px 34px -11px #304F4335,0 0 32px #E9CD8811 inset;isolation:isolate}.paper-front:before{opacity:.55}.paper-edge{inset:0;transform:translateZ(-2px) translateY(2px);background:#e5dcc6;border:1px solid #d8ceb5}.edge-under{transform:translateZ(-4px) translate(1px,4px);background:#d4c7a8}.paper-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d7dbc7;padding-bottom:13px}.paper-label{font-size:9px;letter-spacing:1.8px;font-weight:550}.paper-star{width:20px;height:20px;fill:var(--sage)}.letter-pretitle{margin-top:27px;font-size:10px;letter-spacing:2px;font-weight:550}.paper-front h1{font:440 124px/1.04 var(--serif);letter-spacing:-6px;margin-top:2px;margin-left:-5px}.paper-front h1>span{font-size:36px;color:var(--sage)}.letter-rule{width:37px;height:1px;background:var(--gold);margin:19px 0 21px}.letter-salutation{font:440 28px/1.25 var(--serif);letter-spacing:-.6px;margin-bottom:14px}.letter-body{font:400 22px/1.55 var(--sans);position:relative}.letter-love{font-size:14px;line-height:1.5;margin-top:24px}.signature{font:italic 430 32px/1.3 var(--serif);letter-spacing:-.8px;color:var(--red);margin-top:3px;position:relative;z-index:2}.keepsake-stamp{position:absolute;right:25px;bottom:30px;width:69px;height:auto;transform:rotate(8deg);opacity:.82;z-index:1}.letter-fold{position:absolute;left:0;right:0;bottom:100px;height:3px;border-top:1px solid #fffdf8;background:linear-gradient(#304F4305,transparent);pointer-events:none}.paper-sheen{position:absolute;inset:0;background:linear-gradient(118deg,transparent 12%,#ffffff15 20%,#ffffff6b 25%,transparent 33%);opacity:.27;mix-blend-mode:screen;pointer-events:none}.qa-point{position:absolute;width:0;height:0;left:0;top:0;opacity:0;pointer-events:none}.qa-y{top:100px}.seal-flight{left:0;top:0;width:65px;height:65px;transform-style:preserve-3d;z-index:20}.seal-face{box-shadow:inset 0 0 0 2px #9c4c40,inset 0 0 0 4px #d0907966,inset 1px 3px 3px #efb89b88,0 9px 15px #304F4333;background:radial-gradient(ellipse at 26% 16%,#cf8b70 0,#b76855 32%,#AA5148 65%,#8d453c);overflow:hidden}.seal-monogram{opacity:1;font-size:39px}.seal-star{opacity:0}.wax-glint{position:absolute;inset:0;background:linear-gradient(135deg,transparent 20%,#ffedcb60 32%,#ffedcb05 43%,transparent 55%);transform:translateX(-12px);opacity:.6;pointer-events:none}.seal-layer{background:#894539}.little-tag{position:absolute;right:16px;top:136px;width:85px;height:129px;background:#eddfb9;border:1px solid #dfce9f;clip-path:polygon(17% 0,83% 0,100% 14%,100% 100%,0 100%,0 14%);transform:translateZ(60px) rotate(13deg);z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;font:italic 18px/1.25 var(--serif);color:#696148;box-shadow:0 7px 12px #304F431c;pointer-events:none}.little-tag:before{content:'';position:absolute;width:7px;height:7px;left:calc(50% - 3px);top:9px;background:var(--cream);border-radius:50%;box-shadow:0 0 0 1px #ceb98b}.little-tag>span:first-child{color:var(--red);font-size:27px;margin-top:14px;line-height:1}.js .letter-rise{opacity:0}.js .letter{opacity:1}.js .flap-hinge{transform:translateZ(3px) rotateX(0)}.js .envelope-assembly{transform:none}.js .little-tag{opacity:0}.gift-surface{position:relative;z-index:5;background:var(--cream);border:1px solid #dedbc9;border-bottom:0;border-radius:30px 30px 0 0;box-shadow:0 -22px 38px -24px #304F4355,0 -2px 0 #ffffffb0;isolation:isolate;padding:8px 0 calc(38px + env(safe-area-inset-bottom));margin:0 auto;width:min(1160px,100%)}.surface-inner{width:min(1040px,calc(100% - 48px))}.surface-handle{width:37px;height:3px;border-radius:5px;background:#c6ceb8;margin:4px auto 22px}.gifts{border:0;padding-top:0}.gift-surface .gift-card{box-shadow:0 10px 17px -12px #304F4333}.gift-surface .delivery{margin-top:16px}.flow-mode .letter-stick,.motion-paused .letter-stick{position:relative!important}.flow-mode .scroll-depth,.motion-paused .scroll-depth{transform:none!important}.flow-mode .gift-surface,.motion-paused .gift-surface{margin-top:0}.scroll-depth,.letter-stick,.gift-surface{scroll-margin-top:0}
@media(max-width:760px){body{overflow-x:clip}.header.wrap{width:calc(100% - 28px)}.letter-stick{display:block;padding:10px 0 10px;min-height:0}.hero-heading{padding:0 14px 5px;text-align:center}.hero-heading .phrase{font-size:23px;line-height:1.2;letter-spacing:-.8px;max-width:none}.hero-actions{padding:0 12px;justify-content:center;gap:0 18px}.hero-actions>button{font-size:14px}.gift-jump{font-size:14px;gap:9px}.letter-rise{width:calc(100% - 52px);top:20px;transform:translateX(-50%) rotate(-3deg)}.scene-world{transform:rotateX(2deg) rotateY(-1deg)}.paper-front{padding:26px 26px 30px}.paper-top{padding-bottom:12px}.paper-label{font-size:7.5px;letter-spacing:1.5px}.paper-star{width:17px;height:17px}.letter-pretitle{font-size:8px;letter-spacing:1.7px;margin-top:25px}.paper-front h1{font-size:24vw;letter-spacing:-4.8px;margin-left:-4px}.paper-front h1>span{font-size:29px}.letter-rule{margin:17px 0 18px;width:29px}.letter-salutation{font-size:22px;letter-spacing:-.45px;margin-bottom:12px}.letter-body{font-size:18px;line-height:1.55}.letter-love{font-size:12px;margin-top:21px}.signature{font-size:26px;letter-spacing:-.75px;line-height:1.3}.keepsake-stamp{width:54px;right:21px;bottom:26px}.letter-fold{bottom:82px}.little-tag{right:8px;top:118px;width:64px;height:100px;font-size:14px;gap:7px}.little-tag>span:first-child{font-size:23px;margin-top:13px}.little-tag:before{width:6px;height:6px;top:8px}.envelope-ribbon{width:130px;left:2%;top:calc(var(--env-h) - 95px)}.envelope-pocket>p{font-size:11px;bottom:23px;left:15%}.seal-flight{width:56px;height:56px}.seal-monogram{font-size:35px}.leaf-left{left:0;top:53%;width:45px;opacity:.55}.leaf-right{right:0;top:6%;width:39px;opacity:.55}.spark-a{left:5%;top:24%}.spark-b{right:2%;top:58%;font-size:19px}.spark-c{bottom:4%;right:8%}.spark-d{bottom:20%;left:5%}.gift-surface{border-radius:24px 24px 0 0;padding-top:7px}.surface-inner{width:calc(100% - 32px)}.surface-handle{margin:4px auto 17px}.gifts-heading{margin-bottom:12px}.gifts-heading h2{font-size:25px}.gifts-heading p{font-size:14px}.gift-surface .gift-list{gap:9px}.gift-surface .delivery{margin-top:12px}.gift-surface .gift-card{min-height:102px}.paper-sheen{opacity:.22}}
@media(max-width:359px){.header.wrap{width:calc(100% - 24px)}.hero-heading .phrase{font-size:21px}.letter-rise{width:calc(100% - 44px)}.paper-front{padding:23px 22px 27px}.paper-label{font-size:6.5px;letter-spacing:1.25px}.letter-pretitle{font-size:7px;letter-spacing:1.4px;margin-top:22px}.paper-front h1{font-size:74px;letter-spacing:-4.3px}.letter-salutation{font-size:20px}.letter-body{font-size:17.5px;line-height:1.55}.letter-rule{margin:15px 0 17px}.letter-love{margin-top:19px}.signature{font-size:24px}.little-tag{width:52px;height:87px;right:4px;top:108px;font-size:12px}.little-tag>span:first-child{font-size:20px}.keepsake-stamp{width:45px;right:17px;bottom:23px}.hero-actions{gap:0 12px}.hero-actions>button,.gift-jump{font-size:13px}.gift-jump{gap:8px}.gifts-heading h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.letter-stick{position:relative!important}.scroll-depth{transform:none!important}.gift-surface{margin-top:0}.letter-rise{opacity:1!important}}
html:not(.js) .stage{height:auto;min-height:0;padding:12px 0 110px}html:not(.js) .scroll-depth,html:not(.js) .scene-world{position:relative;inset:auto;height:auto;transform:none}html:not(.js) .letter-cavity{position:relative;inset:auto;height:auto;transform:translateZ(46px)}html:not(.js) .letter-rise{position:relative;left:auto;top:auto;margin:0 auto;transform:rotate(-3deg);opacity:1}html:not(.js) .envelope-assembly{top:auto;bottom:-45px;transform:none}html:not(.js) .seal-flight{top:auto;bottom:-10px}html:not(.js) .little-tag{opacity:1}html:not(.js) .letter-stick{position:relative}
/* Containment comes from the physical planes, not cropping the readable paper. */
body{overflow-x:visible}.letter-cavity{transform:translateZ(20px)}.little-tag{transform:translateZ(24px) rotate(8deg)}.seal-flight{transform:translateZ(22px) rotate(12deg)}
@media(max-width:760px){.letter-rise{transform:translateX(-50%) rotate(-2.5deg)}.letter-pretitle{margin-top:40px}.little-tag{right:20px;top:40px;width:60px;height:92px}}
@media(max-width:359px){.letter-pretitle{margin-top:37px}.little-tag{right:18px;top:38px;width:52px;height:84px}}
html:not(.js) .letter-cavity{transform:translateZ(20px)}html:not(.js) .seal-flight{left:calc(50% + var(--env-w)/2 - 86px)}
/* Transparent 3D carrier boxes stay inside the viewport; paper keeps its width. */
.scene-world{transform:none}.letter-cavity{left:12px;width:calc(100% - 24px)}.letter-rise{width:min(490px,calc(100% - 56px))}.scroll-ready .letter-stick{top:var(--sticky-top,0px)}
@media(max-width:760px){.letter-rise{width:calc(100% - 28px)}}
@media(max-width:359px){.letter-rise{width:calc(100% - 20px)}}
html:not(.js) .letter-cavity{left:12px}html:not(.js) .letter-rise{transform:rotate(-2deg)}
/* Static fallback is fluid CSS, independent of any cached animation geometry. */
html:not(.js) .envelope-assembly{left:50%;width:calc(100% - 44px);max-width:540px;height:auto;aspect-ratio:1.56;transform:translateX(-50%)}html:not(.js) .flap-hinge{height:auto;aspect-ratio:2.5}html:not(.js) .envelope-ribbon{top:auto;bottom:-6px}html:not(.js) .seal-flight{left:auto;right:max(36px,calc((100% - 540px)/2 + 24px));top:auto;bottom:-10px}html:not(.js) .ground-shadow{top:auto;bottom:-75px}