:root{color-scheme:light;--paper:#f4f1e9;--ink:#191917;--muted:#656158;--line:#d2ccc0;--accent:#92743e;font-family:Arial,"Helvetica Neue",sans-serif;font-synthesis:none;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-width:280px}
button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}
button:focus-visible{outline:3px solid #997132;outline-offset:6px}
button:disabled{cursor:default}
[hidden]{display:none!important}
::selection{background:#1c1c19;color:var(--paper)}
main{overflow:clip}
.cover,.gift{--frame-top:28px;--frame-sides:48px;padding:calc(var(--frame-top) + env(safe-area-inset-top,0px)) calc(var(--frame-sides) + env(safe-area-inset-right,0px)) calc(var(--frame-bottom) + env(safe-area-inset-bottom,0px)) calc(var(--frame-sides) + env(safe-area-inset-left,0px))}
.cover{--frame-bottom:26px;min-height:100vh;min-height:100svh;max-width:1440px;margin:auto;display:flex;flex-direction:column;position:relative}
.cover-top,.gift-top{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}
.cover-top>span:last-child,.gift-top>span:last-child{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:2rem;letter-spacing:-.08em;line-height:1}
.cover-content{width:100%;max-width:760px;text-align:center;margin:auto; padding:34px 0 26px}
.eyebrow{margin:0 0 20px;font-size:.75rem;line-height:1.5;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}
h1,h2,h3,p{overflow-wrap:anywhere}
.instructions,.steps li>div{min-width:0}
.cover h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(3.8rem,8.3vw,6.5rem);line-height:1.01;letter-spacing:-.055em;margin-bottom:24px}
h1 em,.signoff em{font-weight:400}
.cover-intro{font-size:1rem;color:var(--muted);line-height:1.65;margin-bottom:28px}
.parcel{position:relative;isolation:isolate;width:min(480px,100%);height:190px;margin:auto;background:#eae5d9;border:1px solid #d2cabb;box-shadow:0 24px 40px -30px #29251d60;overflow:hidden}
.parcel:before{content:"";position:absolute;inset:11px;border:1px solid #c7bead;pointer-events:none}
.parcel-line{position:absolute;inset:0 auto 0 20%;width:48px;background:linear-gradient(90deg,#111,#30302e 47%,#171717);box-shadow:4px 0 8px #0002;transform:rotate(17deg) scaleY(1.3)}
.parcel-label{position:absolute;top:25px;left:38%;right:20px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.625rem;letter-spacing:.12em;text-transform:uppercase}
.label-star{font-size:1.5rem}
.band{position:absolute;z-index:1;top:85px;height:66px;width:51%;background:linear-gradient(#232322,#101010 56%,#292928);display:flex;align-items:center;color:#ece9e0;overflow:hidden;font-size:.62rem;letter-spacing:.2em;white-space:nowrap;box-shadow:0 6px 8px #0003}
.band-left{left:0;justify-content:flex-start;transform-origin:left center}
.band-right{right:0;justify-content:flex-end;transform-origin:right center}
.band-left span{transform:translateX(-35px)}
.band-right span{transform:translateX(35px)}
.open-button{position:absolute;z-index:2;left:50%;top:95px;transform:translateX(-50%);display:flex;justify-content:space-between;align-items:center;gap:28px;min-height:46px;width:max-content;max-width:calc(100% - 36px);padding:11px 20px;background:var(--paper);border:1px solid #fff8;border-radius:0;font-size:.875rem;font-weight:600;box-shadow:0 3px 15px #0003;transition:background .18s}
@media(hover:hover){.open-button:hover{background:white}}
.open-button>span:last-child{font-size:1.3rem;font-weight:400;line-height:1}
.cover-from{font-size:.875rem;text-align:center;margin:0;letter-spacing:.03em}
.cover.is-opening .band-left{animation:unwrap-left .68s cubic-bezier(.65,0,.35,1) forwards}
.cover.is-opening .band-right{animation:unwrap-right .68s cubic-bezier(.65,0,.35,1) forwards}
.cover.is-opening .parcel-line{animation:vertical-unwrap .6s ease-in forwards}
.cover.is-opening .open-button{opacity:0;transition:opacity .2s;pointer-events:none}
.cover.is-opening .parcel-label{animation:fade-out .55s forwards}
.gift{--frame-bottom:35px;max-width:1360px;margin:auto}
.gift-top{padding-bottom:24px;border-bottom:1px solid var(--line)}
.greeting{padding:45px 0 36px;text-align:center}
.greeting .eyebrow{margin-bottom:15px}
.greeting h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.75rem,4.8vw,4.7rem);font-weight:400;letter-spacing:-.052em;line-height:1.08;margin-bottom:21px;text-wrap:balance;outline:none}
.greeting h1 em{white-space:nowrap}
.wish{font-size:1rem;line-height:1.7;color:var(--muted);margin-bottom:0;text-wrap:pretty}
.gift-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(285px,1fr);align-items:start;gap:clamp(35px,5vw,76px)}
.certificate{min-width:0;animation-delay:.15s!important}
.gift-media{position:relative;overflow:hidden;box-shadow:0 18px 40px -20px #39302348;transform:rotate(-1.4deg);margin:9px 2px 0}
.gift-media img{display:block;width:100%;height:auto;background:#f6f4ee}
.certificate-details{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 16px;margin-top:28px;font-size:.875rem;line-height:1.5}
.certificate-details strong{font-weight:600}
.certificate-note{font-size:.75rem;line-height:1.65;color:var(--muted);margin:16px 0 0}
.instructions{padding-top:2px;animation-delay:.3s!important}
.approved{display:inline-flex;align-items:center;gap:8px;border:1px solid #b2a99a;border-radius:2px;padding:7px 10px;font-size:.75rem;line-height:1.3;transform:rotate(-3deg);margin-bottom:23px}
.approved>span{font-size:1.1rem;line-height:1}
h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:2rem;line-height:1.12;letter-spacing:-.035em;margin-bottom:24px}
.steps{list-style:none;padding:0;margin:0}
.steps li{display:flex;gap:16px;margin-bottom:22px}
.step-number{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:.875rem;color:var(--accent);line-height:1.5;padding-top:2px;flex-shrink:0}
.steps h3{font-size:1rem;font-weight:500;line-height:1.5;margin-bottom:4px}
.steps p{font-size:.875rem;line-height:1.55;color:var(--muted);margin-bottom:0}
.payment{border-top:1px solid var(--line);padding:16px 0 0;margin:2px 0 0;display:flex;flex-direction:column;gap:5px}
.payment>span{font-size:.75rem;color:var(--muted)}
.payment strong{font-size:1rem;font-weight:400;display:flex;align-items:center;justify-content:space-between;gap:12px}
.payment strong span{font-size:1.55rem;line-height:1;color:var(--accent)}
.gift-footer{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:38px;padding-top:28px;border-top:1px solid var(--line);animation-delay:.45s!important}
.signoff{font-family:Georgia,"Times New Roman",serif;font-size:1.4rem;line-height:1.3;letter-spacing:-.025em;margin-bottom:14px}
.signature{font-size:.875rem;margin-bottom:0;line-height:1.5}
.replay-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;border:0;border-bottom:1px solid #a39b8b;padding:10px 0;background:none;font-size:.875rem;transition:color .15s}
@media(hover:hover){.replay-button:hover{color:var(--accent)}}
.replay-button>span:first-child{font-size:1.5rem;line-height:1}
.replay-button:disabled{color:var(--muted);border-bottom-color:transparent}
.gift.is-revealing .reveal{animation:appear .65s cubic-bezier(.2,.8,.3,1) backwards}
.replay-ribbon{display:none;position:absolute;z-index:1;width:110%;height:18%;align-items:center;justify-content:center;background:linear-gradient(#282826,#111);color:var(--paper);font-size:clamp(.7rem,2vw,1.2rem);letter-spacing:.3em;box-shadow:0 5px 10px #0005}
.ribbon-one{top:20%;left:-5%;transform:rotate(-12deg)}
.ribbon-two{bottom:20%;right:-5%;transform:rotate(12deg)}
.gift-media.is-replaying .replay-ribbon{display:flex}
.gift-media.is-replaying .ribbon-one{animation:replay-left 1.2s ease-in-out forwards}
.gift-media.is-replaying .ribbon-two{animation:replay-right 1.2s ease-in-out forwards}
.confetti{position:fixed;inset:0;z-index:5;pointer-events:none;overflow:hidden}
.confetti i{position:absolute;left:var(--x);top:-22px;width:var(--w);height:var(--h);background:var(--color);opacity:0;animation:confetti-fall var(--duration) var(--delay) ease-out forwards}
@keyframes unwrap-left{to{transform:translateX(-110%) rotate(-15deg)}}
@keyframes unwrap-right{to{transform:translateX(110%) rotate(15deg)}}
@keyframes vertical-unwrap{to{transform:translateY(-140%) rotate(20deg)}}
@keyframes fade-out{to{opacity:0}}
@keyframes appear{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes replay-left{0%,20%{transform:translateX(0) rotate(-12deg)}100%{transform:translateX(-130%) rotate(-22deg)}}
@keyframes replay-right{0%,20%{transform:translateX(0) rotate(12deg)}100%{transform:translateX(130%) rotate(22deg)}}
@keyframes confetti-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}10%,65%{opacity:.85}100%{opacity:0;transform:translate3d(var(--drift),105vh,0) rotate(var(--spin))}}
@media(min-width:1500px){.gift{--frame-top:36px}.greeting{padding:58px 0 45px}.gift-footer{margin-top:48px}}
@media(max-width:760px){.cover{--frame-top:22px;--frame-sides:24px;--frame-bottom:25px}.cover-top,.gift-top{font-size:.625rem;letter-spacing:.08em}.cover-content{padding:38px 0 30px}.cover .eyebrow{margin-bottom:18px}.cover h1{font-size:clamp(3.4rem,15vw,5.5rem)}.cover-intro{font-size:.875rem;margin-bottom:30px}.parcel{height:180px}.parcel-label{left:calc(20% + 88px);font-size:.625rem}.parcel-label>span:last-child{display:none}.label-star{font-size:1.2rem}.cover-from{font-size:.8rem}.gift{--frame-top:22px;--frame-sides:24px;--frame-bottom:30px}.gift-top{padding-bottom:20px}.greeting{padding:34px 0 29px}.greeting h1{font-size:clamp(2.65rem,8.5vw,4rem);line-height:1.04;margin-bottom:20px}.greeting h1 em{display:block;white-space:normal}.greeting .eyebrow{font-size:.6875rem;letter-spacing:.2em}.wish{font-size:1rem;line-height:1.65}.desktop-break{display:none}.gift-layout{grid-template-columns:1fr;gap:33px}.gift-media{margin:5px 2px 0}.certificate-details{margin-top:22px;gap:8px;font-size:.875rem}.certificate-note{margin-top:13px}.instructions{padding-top:2px}.approved{margin-bottom:21px}h2{font-size:2.1rem;margin-bottom:23px}h2 br{display:none}.steps li{gap:18px;margin-bottom:22px}.steps h3{font-size:1rem}.steps p{font-size:1rem}.payment{padding-top:18px}.payment>span{font-size:.875rem}.payment strong{font-size:1.1rem}.gift-footer{margin-top:30px;padding-top:25px;display:block}.signoff{font-size:1.35rem}.signature{font-size:.875rem}.replay-button{margin-top:24px}.replay-button:disabled{font-size:.8125rem}.confetti i{max-width:8px}}
@media(max-width:359px){.cover,.gift{--frame-sides:18px}.cover-top{font-size:.56rem}.parcel-label{left:calc(20% + 88px);right:14px;gap:5px}.parcel-label>span:last-child{display:none}.open-button{gap:15px;padding:11px 15px}.cover-intro{font-size:.875rem}.certificate-details{justify-content:flex-start;gap:8px 15px}.certificate-details>span:last-child{flex-basis:100%}}
@media(max-width:760px){.gift-layout{grid-template-columns:minmax(0,1fr)}.approved{max-width:100%}.open-button>span:first-child{min-width:0;overflow-wrap:anywhere}}
@media(hover:none) and (pointer:coarse) and (orientation:landscape) and (max-height:500px){.cover,.gift{--frame-top:18px;--frame-sides:24px;--frame-bottom:24px}.cover-content{padding:20px 0}.cover .eyebrow{margin-bottom:12px}.cover h1{font-size:3.5rem;margin-bottom:16px}.cover-intro{margin-bottom:20px}.greeting{padding:26px 0}.greeting h1{font-size:2.75rem}.gift-layout{grid-template-columns:minmax(0,1fr);max-width:680px;margin-inline:auto}.gift-footer{max-width:680px;margin-inline:auto}.gift-media{margin-inline:8px}.steps p{font-size:1rem}.parcel-label{left:calc(20% + 88px)}.parcel-label>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.confetti,.replay-ribbon{display:none!important}.cover.is-opening .open-button{opacity:1}}