@font-face{font-family:Plus Jakarta Sans;src:url(/assets/plus-jakarta-sans-eXO_dkmS.woff2) format("woff2");font-weight:400 800;font-display:swap}:root{--type: "Plus Jakarta Sans", Arial, sans-serif;font-family:var(--type);font-synthesis:none;color-scheme:light}*{box-sizing:border-box}body{--bg: #f9f1fc;--edge: #f7cee5;--fg: #28213f;--accent: #5c4498;--button: #d8c4ff;--button-ink: #28213f;--line: #4a35652b;margin:0;min-width:280px;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow-x:clip;color:var(--fg);background:var(--bg);transition:background-color .42s,color .3s}#root{position:relative;isolation:isolate;display:flex;flex:1;flex-direction:column;min-width:0}body[data-room=calendar]{--bg: #fff3ed;--edge: #f8d9d4;--accent: #8f3d65;--button: #f8bfd0;--line: #853e5930}body[data-room=cake]{--bg: #251e3b;--edge: #3c2e57;--fg: #fbf4ff;--accent: #d9c7fa;--button: #e1cffb;--line: #ede3ff40;color-scheme:dark}body[data-room=album]{--bg: #f2f5ff;--edge: #ccd9fa;--accent: #414d99;--button: #c7d0ff;--line: #43528e30}body[data-room=gift]{--bg: #fff8e5;--edge: #ffe5ae;--accent: #644a97;--button: #dfceff;--line: #70533f30}body[data-room=letter]{--bg: #fff2f6;--edge: #fbd0de;--accent: #903e6d;--button: #f9bdd4;--line: #853e5930}.backdrop{position:fixed;z-index:-1;inset:0;overflow:clip;pointer-events:none;-webkit-user-select:none;user-select:none;background:linear-gradient(180deg,var(--edge),transparent 28% 72%,var(--edge));animation:backdrop-in .42s ease-out both}.backdrop-sticker{position:absolute;display:block;width:var(--sticker-size);height:var(--sticker-size);transform:translate(-50%,-50%) rotate(var(--sticker-angle));fill:currentColor;opacity:.78}.backdrop[data-chapter-backdrop=cake] .backdrop-sticker{opacity:.55}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:5px}body[data-input=pointer] :is(button,[tabindex]):focus{outline:none}[hidden]{display:none!important}h1,h2,h3,p,figure{margin:0}.icon-bank,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.bar,.foot{width:min(100% - 9vw,1420px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.bar{min-height:68px;padding-top:env(safe-area-inset-top);justify-content:flex-end}.sound{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:100px;background:#ffffff76;color:var(--fg)}.sound[aria-pressed=true]{background:var(--button)}body[data-room=cake] .sound{background:#ffffff15}body[data-room=cake] .sound[aria-pressed=true]{background:var(--button);color:var(--button-ink)}.sound svg{width:19px;height:19px}.sound[aria-pressed=true] .mute-mark{display:none}main{display:grid;flex:1;overflow:clip}.scene{width:min(100% - 12vw,1200px);min-height:min(620px,76svh);margin:auto;position:relative;isolation:isolate;padding-block:clamp(26px,5.2vh,70px);align-items:center}.scene:not([hidden]){animation:chapter-in .32s cubic-bezier(.22,.72,.32,1) both}@keyframes chapter-in{0%{opacity:.22;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.calendar-scene,.cake-scene,.gift-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,68px)}.copy{position:relative;z-index:2}.display{font:800 clamp(3.6rem,7.3vw,7.15rem)/.98 var(--type);letter-spacing:-.06em;text-wrap:balance}.display em{font-style:normal;font-weight:inherit;color:var(--accent)}.action{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;width:max-content;max-width:100%;padding:.76rem 1.18rem;min-height:52px;border:1px solid transparent;border-radius:4px;background:var(--button);color:var(--button-ink);font-weight:750;line-height:1.12;box-shadow:0 5px #08081961;transition:transform .2s,box-shadow .2s;position:relative;isolation:isolate}.action svg{width:19px;height:19px;flex:none}.copy .action{margin-top:1.8rem}.action:active{transform:translateY(3px);box-shadow:0 2px #08081961}.text-button{min-height:44px;display:inline-flex;align-items:center;gap:.38rem;border:0;background:none;padding:.35rem 0;color:inherit;font-weight:750;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.text-button svg{width:17px;height:17px}.text-button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.calendar-scene{grid-template-rows:1fr auto 1fr;row-gap:1.4rem}.calendar-copy{grid-column:1;grid-row:2}.calendar-scene>.action{grid-column:1;grid-row:3;align-self:start}.calendar-sheet{grid-area:1 / 2 / 4 / 3;justify-self:center;width:min(100%,490px);padding:clamp(.75rem,3vw,1.7rem);border:1px solid #cf9caf;border-top:6px solid #dd8eac;border-radius:8px;background:#fffdf8;box-shadow:0 5px #f1becb,0 6px #cf9caf,0 16px 35px #975d6d22}.calendar-sheet table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0 .28rem;font-variant-numeric:tabular-nums}.calendar-sheet caption{text-align:left;padding:.2rem .2rem .65rem;font-size:clamp(1.25rem,3.2vw,2.35rem);font-weight:800;letter-spacing:-.045em}.calendar-sheet caption span{margin-left:.25em;color:var(--accent);font-size:.64em;letter-spacing:0}.calendar-sheet th{color:#785b70;font-size:clamp(.65rem,1.1vw,.85rem);font-weight:750;padding-bottom:.45rem}.calendar-sheet td{height:clamp(34px,4.25vw,56px);padding:0;text-align:center;font-size:clamp(.78rem,1.4vw,1.1rem)}.calendar-birthday{position:relative;display:flex;align-items:center;justify-content:center;gap:.06em;height:clamp(32px,4.25vw,53px);border:1px solid #cf789d;border-radius:10px;background:#ffc9da;color:#713052;font-weight:800}.calendar-birthday svg{width:1.35em;height:1.35em}.entry{display:grid;place-items:center;min-height:0;padding-block:12px clamp(28px,6svh,65px)}.entry-art{position:relative;width:min(100%,83vw,448px,calc(72svh - 73px));aspect-ratio:.72;display:grid;place-items:center}.door-hit{position:relative;display:block;width:100%;height:100%;padding:0;border:0;border-radius:50% 50% 14px 14px/26% 26% 14px 14px;background:none;touch-action:manipulation}.door-hit:focus-visible{outline-offset:9px}.frame,.inside,.door-leaf{position:absolute;display:block}.frame{inset:0 3% 2%;border:2px solid #806ab5;border-radius:inherit;background:#ccb5fb;box-shadow:inset 0 0 0 7px #e4d4ff,9px 10px #e1cdef;perspective:870px;transform-style:preserve-3d}.inside,.door-leaf{inset:3.5% 5.5% 0;border-radius:50% 50% 5px 5px/25% 25% 5px 5px}.inside{background:#d1f2df;box-shadow:inset 0 0 0 2px #a18cc2}.door-leaf{transform-origin:0 50%;background:#b99bea;border:2px solid #846bbc;box-shadow:inset 0 0 0 5px #cbb3f4,3px 0 #927ac4;transition:transform .77s cubic-bezier(.65,.05,.27,1);backface-visibility:visible}.entry.is-open .door-leaf{transform:rotateY(-112deg)}.door-window{position:absolute;inset:11% 13% 41%;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:5%;padding:5%;border-radius:50% 50% 9px 9px/30% 30% 9px 9px;background:#987bc9;box-shadow:0 0 0 2px #d5c0fa;overflow:hidden}.door-window i{display:block;background:#fbe5ad;box-shadow:inset 0 0 0 1px #ffffff96}.door-window i:nth-child(1){border-radius:100% 4px 4px/58% 4px 4px}.door-window i:nth-child(2){background:#f6c8e4;border-radius:4px 100% 4px 4px/4px 58% 4px 4px}.door-window i:nth-child(3){background:#c6eedf;border-radius:4px}.door-window i:nth-child(4){background:#c9d7ff;border-radius:4px}.door-panel{position:absolute;inset:66% 13% 7%;border:2px solid #a187d0;border-radius:8px;background:#c6acf1;box-shadow:inset 0 0 0 5px #cfb9f4}.handle{position:absolute;top:57%;right:8%;width:10%;aspect-ratio:1;border:2px solid #a98138;border-radius:50%;background:#ffe49a;box-shadow:3px 4px #9c79bd,inset 0 0 0 3px #fff0be}.sill{position:absolute;bottom:0;left:-1%;right:-1%;height:3.8%;border:2px solid #9a83c5;border-radius:5px;background:#dfc9fb;box-shadow:6px 7px #e1cdef}.cake-scene{grid-template-columns:minmax(0,1.22fr) minmax(0,1fr)}.cake-stage{width:min(100%,570px);justify-self:center;min-width:0}.cake-copy .display em{display:block}.cake-art{width:100%;aspect-ratio:1.08;position:relative;justify-self:center;isolation:isolate;touch-action:pan-y}.cake-art.has-model{cursor:grab}.cake-art.has-model:active{cursor:grabbing}.cake-art:after{content:"";position:absolute;z-index:-1;inset:83% 12% 10%;border-radius:50%;background:#191329;pointer-events:none}.cake-fallback,.cake-canvas,.candle-controls{position:absolute;inset:0;width:100%;height:100%}.cake-fallback{object-fit:fill;pointer-events:none}.cake-canvas{display:none}.has-model .cake-canvas{display:block}.has-model .cake-fallback,.has-model .wax{visibility:hidden}.candle-controls{pointer-events:none}.candle-hit{position:absolute;z-index:1;left:var(--x);top:var(--y);width:clamp(35px,12.2%,49px);height:var(--hit-height, clamp(58px, 20%, 96px));transform:translate(-50%,-30%);border:0;border-radius:14px;background:transparent;pointer-events:auto;touch-action:pan-y}.candle-hit:focus-visible{outline-offset:0}.candle-hit>span{pointer-events:none}.candle-hit .wax{position:absolute;top:30%;left:50%;width:clamp(8px,2vw,13px);height:63%;transform:translate(-50%);border-radius:3px;background:repeating-linear-gradient(139deg,var(--wax) 0 5px,#fff0cd 5px 7px);box-shadow:inset 2px 0 2px #fff4df99,inset -2px 0 3px #6a375d77}.candle-hit .flame{position:absolute;top:30%;left:calc(50% - 2px);width:clamp(11px,2.7vw,21px);height:clamp(16px,3.8vw,32px);border-radius:73% 27% 55% 45%/74% 53% 47% 26%;transform:translate(-50%,-75%);transform-origin:50% 90%;background:radial-gradient(ellipse at 49% 77%,#fffbe3 12%,#ffdf79 51%,#ff8b66 82%);box-shadow:0 0 13px 4px #ffc56e91,0 0 26px 7px #ff907a56;animation:candle-flicker .64s infinite alternate ease-in-out;transition:opacity .22s}.candle-hit:nth-child(2n) .flame{animation-delay:-.22s}.candle-hit:nth-child(3n) .flame{animation-delay:-.41s}.candle-hit[aria-pressed=true]{cursor:default;pointer-events:none}.candle-hit[aria-pressed=true] .flame{opacity:0}.candle-hit .smoke{position:absolute;pointer-events:none;left:calc(50% - 2px);top:30%;width:clamp(26px,8vw,43px);height:clamp(37px,11.3vw,61px);opacity:0;overflow:visible;stroke:#faf0ff;stroke-width:3.3;stroke-linecap:round;filter:drop-shadow(0 0 4px #e6ceff73)}.candle-hit .smoke path+path{opacity:.46;stroke-width:2.2}.candle-hit.is-smoking .smoke{animation:candle-smoke 1.16s ease-out both}@keyframes candle-flicker{0%{transform:translate(-52%,-73%) rotate(-7deg) scaleY(.87)}to{transform:translate(-46%,-77%) rotate(8deg) scaleY(1.09)}}@keyframes candle-smoke{0%{opacity:0;transform:translate(-50%,-83%) rotate(-8deg) scale(.5)}17%{opacity:1}53%{opacity:.79;transform:translate(-58%,-113%) rotate(5deg) scale(.95)}to{opacity:0;transform:translate(-19%,-167%) rotate(22deg) scale(1.24)}}.cake-controls{display:flex;align-items:flex-start;flex-direction:column;gap:.4rem;margin-top:1rem}#candle-instruction{font-weight:680}#candles-left{font-size:.88rem;color:var(--accent)}.cake-controls .action{margin-top:.2rem}.cake-turn{display:flex;align-items:center;justify-content:center;gap:.65rem;margin:-.5rem auto 0;color:var(--accent);font-size:.83rem}.turn-dial{position:relative;display:inline-block;width:18px;height:18px;border:1px solid #bb9df0a8;border-radius:50%;transform:rotate(var(--cake-angle, 0rad))}.turn-dial:after{position:absolute;content:"";left:5px;top:-3px;width:6px;height:6px;border-radius:50%;background:#e1c6ff}.cake-turn button{margin-left:.2rem;min-height:44px;padding:.25rem .72rem;border:1px solid #ccb1f174;border-radius:4px;background:#ffffff14;font-size:.83rem;font-weight:650}.cake-turn button:hover{background:#ffffff25}.album-scene{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.1fr);grid-template-rows:1fr auto 1fr;column-gap:clamp(32px,7vw,110px)}.album-copy{grid-row:2;align-self:end}.album-copy .display{font-size:clamp(3.7rem,8.3vw,7.8rem)}.album-scene>.action{grid-column:1;grid-row:3;align-self:start;margin-top:1.75rem}.album-stage{grid-area:1/2/4/3;justify-self:center;width:min(100%,410px)}.album-stack{position:relative;isolation:isolate;aspect-ratio:4/5;margin:0 10%;-webkit-user-select:none;user-select:none}.print{position:absolute;inset:0;padding:3.6% 3.6% 8%;border-radius:2px;background:#fffefd;box-shadow:0 4px 14px #44477236;transition:transform .44s cubic-bezier(.22,.75,.3,1)}.print[data-depth="0"]{z-index:4;transform:translate(0) rotate(-3deg)}.print[data-depth="1"]{z-index:3;transform:translate(9%,-3%) rotate(10deg) scale(.96)}.print[data-depth="2"]{z-index:2;transform:translate(-11%,-3%) rotate(-12deg) scale(.95)}.print[data-depth="3"]{z-index:1;transform:translate(1%,-8%) rotate(2deg) scale(.93)}.print[data-moving=true]{transition:none;animation:send-print-back .46s cubic-bezier(.36,.15,.25,1) both}@keyframes send-print-back{0%{transform:translate(0) rotate(-3deg);z-index:5}38%{transform:translate(36%,5%) rotate(17deg) scale(.99);z-index:5}53%{transform:translate(35%,2%) rotate(15deg) scale(.96);z-index:1}to{transform:translate(1%,-8%) rotate(2deg) scale(.93);z-index:1}}.photo-mat{height:100%;background:#e9edf9;overflow:hidden}.photo-mat img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.photo-tap{position:absolute;z-index:6;inset:0;border:0;border-radius:4px;background:transparent;transform:rotate(-3deg);touch-action:pan-y}.photo-caption{min-height:2.7em;margin:.85rem 10% 0;text-align:center;color:#343458;font:650 clamp(.85rem,1.5vw,1.01rem)/1.35 var(--type)}.album-nav{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin:.1rem 10% 0;color:var(--accent);font-size:.79rem;font-weight:700}#photo-count{white-space:nowrap;font-variant-numeric:tabular-nums}.gift-stage{min-width:0;display:grid;place-items:center}.gift-art{--paper: repeating-conic-gradient(#f4e8ff60 0% 25%, transparent 0% 50%) 0 0 / 18px 18px;position:relative;display:block;width:min(100%,460px);aspect-ratio:1.12;perspective:900px;transition:transform .3s,width .34s cubic-bezier(.22,.75,.3,1)}.gift-hit{position:absolute;inset:0;border:0;padding:0;background:transparent}.gift-scene.is-revealed .gift-art{width:min(48%,190px)}.gift-shadow{position:absolute;inset:79% 11% 9%;border-radius:50%;background:#edddb1;pointer-events:none;transition:opacity .22s ease-out}.gift-scene.is-untying .gift-shadow{opacity:0}.wrapped-base,.wrapped-lid{position:absolute;inset:26% 12% 12%;transform-origin:53% 24%}.wrapped-lid{inset:21% 9% 37%}.gift-interior{position:absolute;inset:0;width:100%;height:100%;overflow:visible;visibility:hidden}.gift-scene.is-open .gift-interior{visibility:visible}.wrapped-base>span,.wrapped-lid>span,.wrapped-base>i,.wrapped-lid>i{position:absolute;inset:0;background:var(--paper),linear-gradient(122deg,#e1d4ff,#cdb9f7 54%,#bca5ed);box-shadow:inset 0 0 45px #7566b033}.wrapped-base>span{clip-path:polygon(1% 21%,64% 37%,64% 100%,1% 75%)}.wrapped-base>i{clip-path:polygon(64% 37%,99% 11%,99% 74%,64% 100%);background:var(--paper),linear-gradient(122deg,#bba4e9,#ae92e2 59%,#a889d9)}.wrapped-base>span:before,.wrapped-base>i:before,.wrapped-lid>span:before,.wrapped-lid>i:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#d76a99,#ffb7d0 18%,#ffcada 35%,#ed91b3 80%,#da79a6);clip-path:polygon(31% 10%,45% 13%,45% 100%,31% 100%)}.wrapped-base>i:before,.wrapped-lid>i:before{clip-path:polygon(75% 8%,83% 4%,83% 100%,75% 100%);background:linear-gradient(90deg,#cf6795,#f29fbd 79%,#d978a4)}.wrapped-lid>span{clip-path:polygon(0 29%,63% 53%,63% 80%,0 54%);background:var(--paper),linear-gradient(103deg,#e9deff,#ccbbf6);box-shadow:none}.wrapped-lid>i{clip-path:polygon(63% 53%,100% 20%,100% 48%,63% 80%);background:var(--paper),linear-gradient(115deg,#c9b2f4,#b699ea 85%);box-shadow:none}.wrapped-lid:after{content:"";position:absolute;inset:0;clip-path:polygon(0 29%,38% 0,100% 20%,63% 53%);background:linear-gradient(138deg,transparent 38%,#f2a1bf 38.4%,#ffc7da 45%,#df80aa 45.5%,transparent 46%),linear-gradient(18deg,transparent 57%,#ea8fb1 57.5%,#ffd0df 65%,#e38aaf 65.5%,transparent 66%),var(--paper),linear-gradient(125deg,#f0e6ff,#d4c3fa)}.satin{position:absolute;inset:-5% 15% auto;width:70%;overflow:visible;transform:rotate(-10deg);transform-origin:52% 45%;filter:drop-shadow(1px 6px 3px #80558455)}.gift-tag{position:absolute;right:11%;top:48%;width:18%;padding:7% 2% 5%;background:#fff9ed;color:#584675;clip-path:polygon(50% 0,100% 18%,100% 100%,0 100%,0 18%);transform:rotate(16deg);font:clamp(.82rem,2vw,1.18rem)/1.02 var(--type)}.gift-tag:before{content:"";position:absolute;left:46%;top:13%;width:7%;aspect-ratio:1;border-radius:50%;background:#bb80a5}.gift-scene.is-untying .satin{animation:untie-ribbon .52s ease-in both}.gift-scene.is-untying .gift-tag{animation:untie-tag .52s ease-in both}.gift-scene.is-open .wrapped-lid{animation:lift-lid .58s cubic-bezier(.17,.67,.33,1) both}.gift-scene.is-revealed :is(.wrapped-lid,.satin,.gift-tag){visibility:hidden;animation:none}@keyframes untie-ribbon{to{transform:translate(32%,-32%) rotate(23deg) scale(.88);opacity:0}}@keyframes untie-tag{to{transform:translate(25%,22%) rotate(40deg);opacity:0}}@keyframes lift-lid{58%{transform:translate(9%,-60%) rotate(-13deg) rotateX(-16deg);opacity:1}to{transform:translate(19%,-78%) rotate(-21deg) rotateX(-24deg);opacity:0}}.gift-reveal{width:100%;animation:show-voucher .52s cubic-bezier(.17,.69,.32,1) both}@keyframes show-voucher{0%{opacity:0;transform:translateY(22px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.ticket{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 20%;background:#fffdf7;color:#343052;position:relative;filter:drop-shadow(0 9px 0 #ddc58c);transform:rotate(-3deg);border-radius:4px}.ticket:before,.ticket:after{content:"";position:absolute;width:18px;height:18px;background:#fff2cc;right:calc(20% - 9px);border-radius:50%;top:-9px}.ticket:after{top:auto;bottom:-9px}.ticket-body{padding:clamp(16px,4vw,35px)}.ticket-kicker,.ticket-stub span{font-size:.7rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.ticket h3{font:800 clamp(1.66rem,4.2vw,3.65rem)/1.02 var(--type);letter-spacing:-.07em;margin:.55rem 0 .7rem}.ticket p{font-weight:750;font-size:clamp(.86rem,1.5vw,1rem);line-height:1.24}.ticket-stub{border-left:1px dashed #a29ac5;display:grid;place-content:center;justify-items:center;gap:.8rem;text-align:center}.ticket-stub svg{width:23px;height:23px}.gift-actions{display:flex;justify-content:space-between;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin-top:1.45rem}.ticket-preview{width:min(520px,calc(100% - 34px));max-height:calc(100% - 34px);border:1px solid #c9b8e1;border-radius:6px;padding:clamp(13px,4vw,24px);background:#fff9e9;color:#28213f;box-shadow:0 16px 60px #39285252}.ticket-preview::backdrop{background:#30283b6b}.ticket-preview form{display:flex;justify-content:space-between;align-items:center;gap:.7rem;margin-bottom:.45rem}.ticket-preview h2{font:clamp(1.2rem,5vw,1.8rem)/1 var(--type)}.ticket-preview img{display:block;width:100%;height:auto;border:1px solid #b19dc55c;border-radius:3px}.ticket-preview p{font-size:.94rem;margin:.8rem 0}.ticket-preview .action{text-decoration:none}.letter-scene{display:grid;justify-items:center;text-align:center;align-content:center;gap:clamp(20px,3.4vh,42px)}.letter-scene .display{font-size:clamp(3.2rem,7.2vw,6.1rem)}.letter-copy{transition:opacity .22s,transform .26s}.letter-scene.is-lifting .letter-copy{opacity:0;transform:translateY(-14px)}.mail-stage{position:relative;isolation:isolate;width:min(100%,550px);display:grid;justify-items:center}.envelope{position:relative;width:min(85%,420px);aspect-ratio:1.68;margin:.6rem 0 .3rem}.env-back,.env-flap,.env-pocket,.env-hit{position:absolute;inset:0;display:block;border-radius:12px}.env-back{z-index:1;background:#e69fbd;box-shadow:6px 8px #e6a3bc54}.env-flap{z-index:5;clip-path:polygon(0 0,100% 0,50% 61%);background:#ffd0df;transform-origin:50% 0}.env-pocket{z-index:4;clip-path:polygon(0 0,50% 59%,100% 0,100% 100%,0 100%);background:#f8b3ce}.env-pocket:after{content:"";position:absolute;inset:0;clip-path:polygon(0 100%,50% 51%,100% 100%);background:#ffc5d9}.env-seal{position:absolute;z-index:6;left:50%;top:55%;transform:translate(-50%,-50%);display:grid;place-items:center;width:14%;aspect-ratio:1;border-radius:50%;background:#f085b3;color:#fff3f8;box-shadow:0 3px #d36b96}.env-seal svg{width:47%;height:47%}.env-label{position:absolute;z-index:6;right:8%;bottom:13%;font-size:clamp(.79rem,2vw,1rem);font-weight:750;color:#6e3657}.env-hit{z-index:8;width:100%;border:0;background:transparent}.letter-paper{--rule: 1.72rem;position:relative;z-index:3;width:100%;padding:clamp(21px,4vw,37px) clamp(19px,5vw,43px);text-align:left;color:#2d2b4b;background-color:#fffefd;border:1px solid #dfdbea;border-radius:9px;box-shadow:5px 6px #dfcde5;transform-origin:50% 0}.mail-stage:not([data-letter=open]) .letter-paper{position:absolute;top:50%;left:50%;visibility:hidden;pointer-events:none;opacity:0}.mail-stage[data-letter=opening] .letter-paper{animation:lift-letter 1.02s cubic-bezier(.24,.74,.33,1) both}.mail-stage[data-letter=opening] .env-flap{animation:flap-open 1.02s ease-in-out both}.mail-stage[data-letter=opening] :is(.env-back,.env-pocket){animation:envelope-away 1.02s ease-in-out both}.mail-stage[data-letter=opening] :is(.env-seal,.env-label){animation:seal-away .28s ease-out both}.letter-heading{margin-bottom:.78rem}.letter-paper h3{font:800 clamp(1.75rem,5vw,2.55rem)/1.1 var(--type);letter-spacing:-.055em;color:#534483}.letter-body,.letter-signoff{background-image:repeating-linear-gradient(to bottom,transparent 0 calc(var(--rule) - 1px),#bdb8e46e calc(var(--rule) - 1px) var(--rule))}.letter-body{display:grid;gap:var(--rule)}.letter-paper p{font-size:clamp(.94rem,1.5vw,1.06rem);font-weight:530;line-height:var(--rule)}.letter-signoff{margin-top:var(--rule)}.letter-paper .letter-signature{color:#7049a3;font-weight:800}@keyframes flap-open{0%{z-index:5;transform:perspective(760px) rotateX(0);opacity:1}19%{z-index:5;transform:perspective(760px) rotateX(88deg);opacity:1}20%{z-index:2;transform:perspective(760px) rotateX(92deg);opacity:1}37%,72%{z-index:2;transform:perspective(760px) rotateX(172deg);opacity:1}to{z-index:2;transform:translateY(28px) perspective(760px) rotateX(172deg);opacity:0}}@keyframes lift-letter{0%,24%{visibility:hidden;opacity:0;z-index:3;transform:translate(-50%,-12%) scale(.62);clip-path:inset(0 0 65%)}28%{visibility:visible;opacity:1;z-index:3;transform:translate(-50%,-12%) scale(.62);clip-path:inset(0 0 65%)}62%{visibility:visible;opacity:1;z-index:3;transform:translate(-50%,-61%) scale(.66);clip-path:inset(0 0 36%)}73%{visibility:visible;opacity:1;z-index:3;transform:translate(-50%,-65%) scale(.7);clip-path:inset(0 0 26%)}74%{visibility:visible;opacity:1;z-index:7;transform:translate(-50%,-65%) scale(.71);clip-path:inset(0 0 24%)}to{visibility:visible;opacity:1;z-index:7;transform:translate(-50%,-50%) scale(1);clip-path:inset(0)}}@keyframes envelope-away{0%,68%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(28px)}}@keyframes seal-away{0%,18%{opacity:1}to{opacity:0}}.replay{justify-self:center}.foot{border-top:1px solid var(--line);min-height:61px;padding-bottom:env(safe-area-inset-bottom);font-size:.8rem;font-weight:700;gap:12px}.progress{display:flex;position:absolute;left:50%;transform:translate(-50%);align-items:center}.progress button{width:40px;height:44px;display:grid;place-items:center;border:0;background:none;padding:0}.progress button:after{content:"";width:8px;height:8px;border:1px solid var(--fg);border-radius:20px;opacity:.78;transition:width .32s,background .32s}.progress button:disabled:after{opacity:.35}.progress button[aria-current=step]:after{width:23px;background:var(--accent);border-color:var(--accent);opacity:1}.step-number{font-variant-numeric:tabular-nums;letter-spacing:.1em}.effects{position:fixed;inset:0;z-index:5;overflow:hidden;pointer-events:none}.particle{position:absolute;left:50%;top:48%;width:var(--size);height:calc(var(--size)*.53);background:var(--color);border-radius:1px}.paper-slip{height:calc(var(--size) * 1.33);border-radius:2px}@media(hover:hover){.action:hover{transform:translateY(-3px);box-shadow:0 8px #08081961}.gift-scene:not(.is-open) .gift-art:hover{transform:rotate(2deg) translateY(-5px)}.entry:not(.is-open) .door-hit:hover .door-leaf{transform:rotateY(-8deg)}.door-hit:hover{filter:brightness(1.13)}.sound:hover,.text-button:hover{color:var(--accent)}}@media(max-width:760px){.backdrop-sticker{width:calc(var(--sticker-size) * .84);height:calc(var(--sticker-size) * .84)}.bar,.foot{width:calc(100% - 36px)}.bar{min-height:59px}.scene{width:min(100% - 40px,510px);min-height:0;gap:0;padding-block:clamp(24px,5vh,47px);text-align:center}.calendar-scene,.cake-scene,.gift-scene,.album-scene{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto;justify-items:center}.display,.album-copy .display,.letter-scene .display{font-size:clamp(2.95rem,12.4vw,5rem);line-height:.96;letter-spacing:-.046em}.copy .action{margin-top:1rem}.action{min-height:48px;gap:1.2rem}.calendar-scene{row-gap:1.25rem}.calendar-copy{grid-area:1/1/2/2}.calendar-sheet{grid-area:2/1/3/2;width:min(100%,380px)}.calendar-scene>.action{grid-area:3/1/4/2}.cake-copy{display:contents}.cake-copy h2{grid-row:1}.cake-stage{grid-row:2;width:min(100%,365px,52vh);margin:.45rem auto}.cake-copy .display em{display:inline}.cake-controls{grid-row:3;align-items:center;gap:.25rem;margin-top:.4rem}.cake-controls .action{margin-top:0}.album-copy{grid-area:1/1/2/2}.album-stage{grid-area:2/1/3/2;width:min(100%,315px);margin-top:1.8rem}.album-nav{gap:.8rem}.album-scene>.action{grid-area:3/1/4/2;margin-top:.75rem}.gift-copy{display:contents}.gift-copy h2{grid-row:1}.gift-copy .action{grid-row:3;margin-top:0}.gift-stage{grid-row:2;width:min(100%,390px);margin-top:.78rem}.gift-art{width:min(91%,300px,48vh)}.gift-reveal{margin:1.4rem 0 .1rem;text-align:left}.gift-actions{gap:.25rem .7rem}.letter-scene{gap:1.15rem}.letter-paper{--rule: 1.55rem}.foot{min-height:51px;font-size:.7rem}.progress button{width:31px}.progress button[aria-current=step]:after{width:17px}}@media(max-width:365px){.bar,.foot{width:calc(100% - 26px)}.scene{width:calc(100% - 34px)}.progress button{width:28px}.action{gap:.8rem;font-size:.92rem}.gift-actions{gap:.25rem}}@media(max-width:760px)and (max-height:650px){.scene{padding-block:19px}.cake-stage{width:min(100%,49vh)}.album-stage{width:min(100%,245px);margin-top:1.35rem}.album-scene>.action{margin-top:.45rem}.album-copy .display{font-size:clamp(2rem,10vw,3rem)}.gift-art{width:min(100%,42vh)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.candle-hit .flame{animation:none}}
