/* The opening: tactile paper, a letter that is handed to you, and the controls that sit over it. */
:root{--fold:clamp(112px,19svh,154px);--letter-width:min(290px,76vw);--paper:#f8f2e6}
body.opening-active{overflow:hidden;height:100svh;overscroll-behavior:none}.site-header{height:64px;padding-inline:28px;pointer-events:none}.site-header>*{pointer-events:auto}.site-header .monogram{cursor:default}.header-note{font-size:12px}.cover{height:100svh;min-height:560px;max-height:none}.cover-copy{top:14%}.cover-copy h1{font-size:clamp(2.4rem,5vw,4.6rem)}.cover-wash{background:linear-gradient(#f9e9cd66 0%,#f8e1b90a 42%,#29372b6b 100%)}.cover-copy .eyebrow{font-size:12px}.letter-stage{top:56%;perspective:1400px}.red-envelope{width:calc(var(--letter-width) + 34px);height:calc(var(--fold) + 54px);filter:drop-shadow(0 15px 24px #18291d36)}.envelope-back,.envelope-side,.envelope-front,.envelope-flap{background-image:linear-gradient(#983b48dd,#742835e8),url('assets/embossed-paper.webp');background-size:cover}.envelope-back{border:1px solid #b87578}.envelope-front{border-bottom:1px solid #b07873}.envelope-left{filter:brightness(1.1)}.envelope-right{filter:brightness(.91)}.envelope-flap{box-shadow:0 2px 3px #51182244}.letter-card{width:var(--letter-width);height:var(--fold);left:17px;top:25px;padding:0;overflow:visible;background:none;box-shadow:none;transform-style:preserve-3d;color:#5c503e}.paper-panel{width:100%;height:var(--fold);background:#f8f2e6 url('assets/embossed-paper.webp') center/290px auto;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:absolute;backface-visibility:hidden;transform-style:preserve-3d;box-shadow:0 1px 6px #44322115}.paper-top{bottom:100%;transform-origin:50% 100%;transform:rotateX(-179.8deg);z-index:4;border-radius:2px 2px 0 0}.paper-centre{position:relative;z-index:1}.paper-bottom{top:100%;transform-origin:50% 0;transform:rotateX(179.8deg);z-index:3;border-radius:0 0 2px 2px}.paper-face{padding:12px 20px}.paper-top:after,.paper-bottom:after{content:'';position:absolute;inset:0;background:var(--paper);transform:rotateX(180deg);backface-visibility:hidden}.paper-top .eyebrow{font:10px/1.6 var(--sans);letter-spacing:.12em}.paper-greeting{font:1.35rem/1.1 var(--serif);margin-top:14px}.paper-rule{width:35px;height:1px;background:#b9a177;display:block;margin:15px auto 0}.letter-names{font:2.75rem/.92 var(--serif);margin:0;display:flex;flex-direction:column;gap:3px}.letter-names em{font-size:1.1rem;line-height:1.1}.letter-date{font:14px/1.5 var(--serif);margin-top:12px}.letter-place{font:1.3rem/1.08 var(--serif)}.paper-town{font:12px/1.5 var(--sans);margin-top:8px}.paper-signature{font:italic 1rem/1.1 var(--serif);margin-top:16px}.paper-crease{position:absolute;left:0;right:0;height:4px;background:linear-gradient(#4d382c3b,#fff9ef66);z-index:6;pointer-events:none}.crease-one{top:0}.crease-two{bottom:0}.letter-seal{width:70px;height:70px;top:60%;transition:filter .3s}.letter-seal:enabled{animation:seal-breath 3.2s ease-in-out infinite}.letter-seal:disabled{animation:none}.chitthi-label{font-size:11px;bottom:15px;letter-spacing:.18em}.tap-note{top:calc(56% + var(--fold)/2 + 65px);font-size:16px;max-width:280px;margin:auto}.scroll-cue{bottom:24px;font-size:12px;gap:6px;min-height:50px}.cover.opened .letter-card{transform:translateY(-38px)}.cover.opened .paper-top,.cover.opened .paper-bottom{transform:rotateX(0)}.cover.opened .paper-crease{opacity:0}.cover.opened .envelope-flap,.cover.opened .envelope-front,.cover.opened .envelope-side,.cover.opened .envelope-back,.cover.opened .chitthi-label,.cover.opened .tap-note,.cover.opened .cover-copy{visibility:hidden}.skip-scene{font-size:12px;left:22px;right:auto;bottom:calc(14px + env(safe-area-inset-bottom,0px))}.messenger{width:230px;top:37%}.messenger img{visibility:hidden}.messenger:before{content:'';position:absolute;inset:0;background:url('assets/pigeon-flight.webp') left center/200% 100%;animation:wingbeat .9s steps(1,end) infinite}.carried-letter{top:66%;left:48%;width:30px;height:20px}.no-script-note{position:absolute;bottom:5%;left:10%;right:10%;background:var(--paper);padding:15px;text-align:center}.sound-control{position:fixed;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:35;width:54px;height:54px;border-radius:50%;background:#772b39;color:#fff4e5;box-shadow:0 4px 20px #2b15202a;border:1px solid #be9a885e;font-size:18px;display:grid;place-items:center}.sound-control[data-playing=true] .sound-bars{height:18px}.sound-bars{display:flex;gap:3px;height:13px;align-items:center}.sound-bars i{width:2px;height:6px;background:currentColor;transition:height .4s}.sound-control[data-playing=true] i{animation:equalize 1.3s ease-in-out infinite alternate}.sound-control i:nth-child(2){animation-delay:-.6s!important;height:14px}.sound-control i:nth-child(3){animation-delay:-.3s!important;height:9px}.sound-control[data-playing=false]:after{content:'';position:absolute;width:22px;height:1px;background:currentColor;transform:rotate(-45deg)}
/* Real colour survives motion; each swatch can be explored. */
dialog{width:min(600px,calc(100vw - 24px));padding:32px;max-height:calc(100svh - 24px)}.attire-dialog h2{font-size:3rem}.attire-guidance{font-size:15px!important}.attire-tabs button{font-size:14px}.fabric-stack{gap:14px}.fabric-swatch{height:100px;padding:14px;text-align:left;background-color:var(--tone);background-image:linear-gradient(115deg,#ffffff10,transparent 45%,#0000000c);color:var(--swatch-ink);position:relative;isolation:isolate;overflow:hidden;border:1px solid #0000000a}.fabric-swatch:before{content:'';position:absolute;inset:0;background:url('assets/silk.webp') center/cover;mix-blend-mode:luminosity;opacity:.24;z-index:-1}.fabric-swatch small{font-size:11px}.fabric-swatch span{font-size:1.3rem}.fabric-swatch[aria-pressed=true]{outline:2px solid var(--gold);outline-offset:3px}.selected-fabric{margin:15px 0 30px}.fabric-detail{height:150px;background:var(--tone);position:relative;overflow:hidden}.fabric-detail:after{content:'';position:absolute;inset:0;background:url('assets/silk.webp') center/cover;mix-blend-mode:luminosity;opacity:.35}.selected-fabric p{font:italic 1.3rem/1.3 var(--serif)!important;margin-top:12px}#wishes-form{padding:28px;background:#fbf5e8 url('assets/embossed-paper.webp') center/cover;box-shadow:0 5px 25px #50462b0e}#wishes-form label{font-size:14px}.stationery-greeting{font:italic 1.5rem/1.25 var(--serif)!important;margin-bottom:28px}.form-privacy{font-size:12px!important}.reply-animation{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:100px 0 25px;gap:35px}.reply-envelope{width:230px;height:145px;position:relative;background:#843644;perspective:800px}.reply-paper{position:absolute;left:15px;top:15px;width:200px;height:115px;background:var(--paper);z-index:2;display:grid;place-items:center;font:italic 1.4rem/1.2 var(--serif);text-align:center;transform-style:preserve-3d}.reply-fold{position:absolute;left:0;right:0;height:100%;background:#f6eedc;backface-visibility:visible}.reply-fold.top{bottom:100%;transform-origin:bottom}.reply-fold.bottom{top:100%;transform-origin:top}.reply-front{position:absolute;inset:0;background:linear-gradient(30deg,#76303b,#a0505c);clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);z-index:3}.reply-flap{position:absolute;inset:0;background:#953c4d;clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:top;z-index:4}.reply-seal{position:absolute;left:calc(50% - 23px);top:40%;height:46px;width:46px;border-radius:50%;background:#c6ae7f;display:grid;place-items:center;font:1.2rem var(--serif);z-index:5;color:#6b5630}
@keyframes seal-breath{50%{box-shadow:inset 0 0 0 4px #cab282,inset 0 0 0 6px #9d8054,inset 0 0 0 8px #cfb887,0 7px 16px #35121b75}}
@keyframes wingbeat{0%,49.99%{background-position:left center}50%,100%{background-position:right center}}
@keyframes equalize{to{height:17px}}
@media(max-width:650px){.site-header{padding-inline:20px;height:58px}.cover{min-height:540px}.cover-copy{top:13%}.cover-copy h1{font-size:clamp(2.15rem,9vw,3.3rem)}.letter-stage{top:55%}.letter-names{font-size:2.65rem}.paper-greeting{font-size:1.2rem}.paper-town{font-size:11px}.letter-place{font-size:1.15rem}.paper-signature{font-size:.9rem}.paper-face{padding:10px 15px}.paper-top .eyebrow{font-size:10px}.paper-rule{margin-top:10px}.letter-date{font-size:13px}.tap-note{top:calc(55% + var(--fold)/2 + 65px)}.scroll-cue{bottom:18px}.skip-scene{bottom:calc(9px + env(safe-area-inset-bottom,0px));left:17px;right:auto}.sound-control{right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:46px;height:46px}.cover-copy .eyebrow{font-size:12px}.fabric-swatch{height:90px;padding:12px}.fabric-swatch span{font-size:1.23rem}.attire-dialog h2{font-size:2.8rem}dialog{padding:25px}.fabric-stack{gap:12px}#wishes-form{padding:20px}}
@media(max-height:650px){:root{--fold:105px}.cover-copy{top:12%}.cover-copy h1{font-size:2.15rem}.paper-face{padding:7px 12px}.paper-top .eyebrow{font-size:9px}.paper-greeting{font-size:1.05rem;margin-top:8px}.paper-rule{margin-top:8px}.letter-names{font-size:2rem}.letter-names em{font-size:.85rem}.letter-date{font-size:12px;margin-top:8px}.letter-place{font-size:1.1rem}.paper-town{font-size:10px}.paper-signature{margin-top:9px;font-size:.85rem}.messenger{width:180px}.letter-stage{top:55%}.letter-seal{width:62px;height:62px}.chitthi-label{font-size:10px;bottom:11px}.cover{min-height:500px}.scroll-cue{bottom:20px}}
.motion-off .messenger:before,.motion-off .sound-bars i{animation:none!important}
.paper-top,.paper-bottom{backface-visibility:visible}.paper-face{backface-visibility:hidden;position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.paper-top:after,.paper-bottom:after{transform:rotateX(180deg) translateZ(.1px);background:#f8f2e6 url('assets/embossed-paper.webp') center/290px auto}.cover{min-height:0}
