*{box-sizing:border-box}html{scrollbar-width:none;background:#eaf7f4;min-height:100svh}body{color:#0d2438;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scrollbar-width:none;min-width:320px;min-height:100svh;margin:0;font-family:Avenir Next,Segoe UI,Helvetica,Arial,sans-serif;overflow-x:hidden}html::-webkit-scrollbar{width:0;height:0}body::-webkit-scrollbar{width:0;height:0}#root::-webkit-scrollbar{width:0;height:0}html.viewport-locked,body.viewport-locked{overscroll-behavior:none;width:100%;height:100%;max-height:100svh;overflow:hidden}button,input,textarea,select{font:inherit}button{color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#root{scrollbar-width:none;min-height:100svh}:root{--bg:#eaf7f4;--bg-soft:#dcf0ec;--paper:#fffdfa;--paper-soft:#f2fbf8;--ink:#0d2438;--ink-soft:#5b7184;--mint:#9fe3d4;--mint-deep:#5fc2ab;--sky:#7fb8e8;--sky-deep:#4f8fc9;--line:#0d24381f}.app-shell{scrollbar-width:none;background:radial-gradient(ellipse 90% 60% at 50% -10%, #f4fffb 0%, #f4fffb00 60%), linear-gradient(170deg, var(--bg) 0%, var(--bg-soft) 100%);min-height:100svh;color:var(--ink);position:relative;overflow-x:hidden}.app-shell::-webkit-scrollbar{width:0;height:0}.app-shell.viewport-locked{height:100svh;max-height:100svh;overflow:hidden}.bg-layer{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.bg-layer:before,.bg-layer:after{content:"";position:absolute;inset:0}.bg-layer:before{opacity:.2;background-image:linear-gradient(#5fc2ab2e 1px,#0000 1px),linear-gradient(90deg,#7fb8e829 1px,#0000 1px);background-size:72px 72px;-webkit-mask-image:linear-gradient(#0000,#000 16% 84%,#0000);mask-image:linear-gradient(#0000,#000 16% 84%,#0000)}.bg-layer:after{opacity:.28;background-image:repeating-linear-gradient(135deg,#0000 0 34px,#e0875f14 35px,#0000 36px 70px)}.access-shell{height:100svh;transition:opacity .55s .42s,filter .55s .42s,transform .55s cubic-bezier(.2,.8,.2,1) .42s;overflow:hidden}.access-shell.unlocked{opacity:0;filter:blur(12px);transform:scale(1.06)}.access-stage{z-index:1;place-items:center;min-height:100svh;padding:28px 18px;animation:.8s cubic-bezier(.16,1,.3,1) both pinPanelIn;display:grid;position:relative}.pin-panel{-webkit-backdrop-filter:blur(14px)saturate(1.08);backdrop-filter:blur(14px)saturate(1.08);text-align:center;background:#fffdfaeb;border:1px solid #5fc2ab38;border-radius:8px;width:min(380px,100%);padding:32px 34px 36px;position:relative;overflow:hidden;box-shadow:0 30px 70px #14465033,0 7px 20px #14465017,inset 0 0 0 1px #ffffffd1}.pin-panel:before,.pin-panel:after{content:"";position:absolute}.pin-panel:before{background:linear-gradient(90deg, var(--mint), var(--sky), #e7a07f);height:6px;top:0;left:0;right:0}.pin-panel:after{background:linear-gradient(90deg,#0000,#7fb8e838,#0000);height:1px;bottom:16px;left:34px;right:34px}@keyframes pinPanelIn{0%{opacity:0;transform:translateY(28px)scale(.94)}65%{transform:translateY(-5px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}.pin-panel h1{letter-spacing:0;margin:5px 0 6px;font-family:Georgia,Times New Roman,serif;font-size:32px;font-style:italic;font-weight:400}.pin-subtitle{color:var(--ink-soft);margin:0;font-size:13px;line-height:1.5}.pin-divider{grid-template-columns:48px 8px 48px;justify-content:center;align-items:center;gap:9px;margin:17px 0 0;display:grid}.pin-divider span{background:linear-gradient(90deg,#0000,#0d243829);height:1px}.pin-divider span:last-child{background:linear-gradient(90deg,#0d243829,#0000)}.pin-divider i{border:1px solid var(--mint-deep);background:#9fe3d44d;width:7px;height:7px;transform:rotate(45deg)}.pin-slots{grid-template-columns:repeat(4,46px);justify-content:center;gap:10px;margin:17px 0 12px;display:grid}.pin-slot{background:#eaf7f499;border:1px solid #0d243824;border-radius:8px;place-items:center;width:46px;height:48px;transition:border-color .22s,background .22s,box-shadow .22s,transform .22s;display:grid}.pin-slot span{background:var(--ink);opacity:0;border-radius:50%;width:10px;height:10px;transition:opacity .18s,transform .28s cubic-bezier(.16,1,.3,1);transform:scale(.2)}.pin-slot.filled{background:#9fe3d433;border-color:#5fc2abb8;transform:translateY(-2px);box-shadow:0 5px 12px #5fc2ab1f}.pin-slot.filled span{opacity:1;transform:scale(1)}.pin-slot:first-child:not(.filled),.pin-slot.filled+.pin-slot:not(.filled){border-color:#4f8fc99e;animation:1.45s ease-in-out infinite pinSlotWaiting;box-shadow:0 0 0 3px #7fb8e81a,0 6px 14px #4f8fc91a}@keyframes pinSlotWaiting{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.pin-message{min-height:18px;color:var(--ink-soft);margin:0 0 15px;font-size:11.5px;line-height:1.4;transition:color .2s}.pin-keypad{grid-template-columns:repeat(3,58px);justify-content:center;gap:11px 18px;display:grid}.pin-key,.pin-key-spacer{width:58px;height:58px}.pin-key{color:var(--ink);cursor:pointer;opacity:0;background:#ffffffe0;border:1px solid #0d24381f;border-radius:50%;place-items:center;padding:0;font-size:15px;font-weight:600;line-height:1;transition:background .18s,border-color .18s,color .18s,transform .18s;animation:.38s forwards pinKeyIn;display:grid;box-shadow:0 6px 13px #14465017,inset 0 -2px #0d243806,inset 0 2px #ffffffe6}.pin-key:nth-child(2){animation-delay:35ms}.pin-key:nth-child(3){animation-delay:70ms}.pin-key:nth-child(4){animation-delay:.105s}.pin-key:nth-child(5){animation-delay:.14s}.pin-key:nth-child(6){animation-delay:.175s}.pin-key:nth-child(7){animation-delay:.21s}.pin-key:nth-child(8){animation-delay:.245s}.pin-key:nth-child(9){animation-delay:.28s}.pin-key:nth-child(11){animation-delay:.315s}.pin-key:nth-child(12){animation-delay:.35s}@keyframes pinKeyIn{0%{opacity:0}to{opacity:1}}.pin-key:nth-child(3n+1){border-color:#5fc2ab3d}.pin-key:nth-child(3n+2){border-color:#7fb8e840}.pin-key:hover{border-color:var(--mint-deep);background:#9fe3d44d;transform:translateY(-2px)scale(1.04);box-shadow:0 9px 18px #14465021,0 0 0 4px #9fe3d414}.pin-key:active{transform:translateY(1px)scale(.94)}.pin-key:focus-visible{outline:2px solid var(--sky-deep);outline-offset:3px}.delete-key{color:#b96041;border-color:#e0875f2e}.delete-key svg{stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px;display:block}.pin-panel.error{animation:.38s both pinShake}.pin-panel.error .pin-slot{background:#e0875f1a;border-color:#e0875fb8;animation:none}.pin-panel.error .pin-message{color:#b96041}@keyframes pinShake{0%,to{transform:translate(0)}20%{transform:translate(-9px)rotate(-.6deg)}40%{transform:translate(8px)rotate(.6deg)}60%{transform:translate(-5px)}80%{transform:translate(3px)}}.pin-panel.success{animation:.8s cubic-bezier(.16,1,.3,1) both pinSuccess}.pin-panel.success .pin-slot{border-color:var(--mint-deep);background:#9fe3d452}.pin-panel.success .pin-message{color:var(--mint-deep);font-weight:700}@keyframes pinSuccess{45%{transform:scale(1.025);box-shadow:0 28px 65px #1446502e,0 0 0 6px #9fe3d433}to{transform:scale(1)}}.grain{opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.drift-shape{filter:drop-shadow(0 5px 9px #1446500f);animation:ease-in-out infinite driftFloat;position:absolute}.drift-shape:nth-child(3n){opacity:.72}.drift-shape:nth-child(4n){opacity:.58}.drift-shape.slow{animation-duration:14s}.drift-shape.mid{animation-duration:9s}.drift-shape.fast{animation-duration:6s}@keyframes driftFloat{0%,to{transform:translate(0)rotate(0)}50%{transform:translate(14px,-26px)rotate(6deg)}}.stage{z-index:1;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:100svh;padding:48px 22px;display:flex;position:relative}.envelope-stage{transition:opacity .75s,filter .75s,transform .75s}.envelope-stage.entering-stage{pointer-events:none}.envelope-stage.entering-stage .eyebrow{animation:.58s 80ms both envelopeItemIn}.envelope-stage.entering-stage .intro-text{animation:.66s .2s both envelopeItemIn}.envelope-stage.entering-stage .envelope-button{animation:.82s cubic-bezier(.16,1,.3,1) .28s both envelopeArrive}.envelope-stage.entering-stage .tap-hint{animation:.55s .62s both envelopeItemIn}@keyframes envelopeItemIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes envelopeArrive{0%{opacity:0;transform:translateY(52px)scale(.88)}70%{opacity:1;transform:translateY(-7px)scale(1.02)}to{opacity:1;transform:translateY(0)scale(1)}}.envelope-stage.active-stage .eyebrow,.envelope-stage.active-stage .intro-text,.envelope-stage.active-stage .tap-hint{opacity:0;transform:translateY(-14px)}.envelope-stage.active-stage .tap-hint{animation:none}.envelope-stage.leaving-stage{opacity:0;filter:blur(18px);pointer-events:none;transform:scale(1.04)}.envelope-stage.hidden-stage{opacity:0;filter:blur(10px);pointer-events:none;position:absolute;inset:0;transform:scale(.98)}.letter-stage{animation:.85s both stageFade}.letter-stage.exiting{animation:.42s both stageOut}@keyframes stageFade{0%{opacity:0}to{opacity:1}}@keyframes stageOut{0%{opacity:1;filter:blur();transform:scale(1)}to{opacity:0;filter:blur(12px);transform:scale(1.035)}}.eyebrow{color:var(--mint-deep);letter-spacing:0;text-transform:uppercase;align-items:center;gap:10px;margin-bottom:14px;font-family:Courier New,Consolas,monospace;font-size:11px;transition:opacity .28s,transform .28s;display:flex}.eyebrow .dash{background:var(--mint-deep);width:22px;height:1px}.intro-text{text-align:center;margin-bottom:34px;transition:opacity .28s,transform .28s}.intro-text h1{color:var(--ink);letter-spacing:0;margin:0;font-family:Georgia,Times New Roman,serif;font-size:40px;font-style:italic;font-weight:400;line-height:1.08}.intro-text p{color:var(--ink-soft);letter-spacing:0;margin-top:10px;font-size:14px}.envelope-button{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;width:min(360px,88vw);padding:0}.envelope-button:focus-visible{outline:2px solid var(--sky-deep);outline-offset:14px;border-radius:8px}.envelope-scene{aspect-ratio:320/248;perspective:1200px;filter:drop-shadow(0 24px 40px #1446502e);width:100%;transition:transform .45s cubic-bezier(.2,.8,.2,1);display:block;position:relative}.zooming .envelope-scene{transform-origin:50% 22%;transition:transform .95s cubic-bezier(.16,1,.3,1);transform:translateY(18px)scale(2.48)}.envelope-scene:before{z-index:3;clip-path:polygon(50% 0,100% 100%,0 100%);content:"";opacity:0;transform-origin:50% 100%;background:linear-gradient(135deg,#9fe3d4d1 0%,#7fb8e8e6 100%);border:1px solid #7fb8e847;border-bottom:0;border-radius:5px 5px 0 0;width:81.6%;height:44%;transition:opacity .32s .34s,transform .76s cubic-bezier(.2,.8,.2,1) .22s;display:block;position:absolute;top:1%;left:9.2%;transform:translateY(42%)scaleY(.72)}.opened .envelope-scene:before{opacity:0;transform:translateY(0)scaleY(1)}.envelope-button:hover .envelope-scene{transform:translateY(-8px)scale(1.015)}.envelope-button:active .envelope-scene{transform:translateY(-2px)scale(.98)}.envelope-button.zooming:hover .envelope-scene,.envelope-button.zooming:active .envelope-scene{transform:translateY(18px)scale(2.48)}.letter-peek{z-index:4;background:linear-gradient(180deg, #fffffff5, #fffdfafa), var(--paper);border:1px solid #d8ece7;border-radius:8px;width:71.2%;height:49%;padding:9% 7%;transition:transform .95s cubic-bezier(.2,.8,.2,1) .52s,box-shadow .55s,border-color .45s;position:absolute;top:43%;left:14.4%;overflow:hidden;transform:translateY(0);box-shadow:0 8px 20px #0d243814}.returning-stage .letter-peek{transition:transform .85s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .35s}.paper-out .letter-peek{transform:translateY(-137%);box-shadow:0 22px 34px #0d243829}.zooming .letter-peek{z-index:14;border-color:#7fb8e861;transform:translateY(-178%)scale(1.08);box-shadow:0 26px 42px #0d243838,inset 0 0 0 1px #ffffffd1}.preview-line{background:linear-gradient(90deg,#9fe3d4c7,#7fb8e86b);border-radius:999px;width:78%;height:3px;margin-bottom:8px;display:block}.preview-line.wide{width:100%}.preview-line.medium{width:88%}.preview-line.short{width:58%}.envelope-back,.envelope-front,.envelope-flap{display:block;position:absolute}.envelope-back{z-index:1;background:linear-gradient(135deg,#9fe3d475 0%,#7fb8e847 100%),linear-gradient(#e7f8f3 0%,#dff3ee 100%);border:1px solid #cfe7e2;border-radius:8px;width:93.8%;height:62.5%;top:31%;left:3.1%}.envelope-front{z-index:6;clip-path:polygon(0 0,50% 50%,100% 0,100% 100%,0 100%);background:linear-gradient(#dff3ee 0%,#e9f8f4 100%);border-bottom:1px solid #cfe7e2;border-left:1px solid #cfe7e2;border-right:1px solid #cfe7e2;border-radius:0 0 8px 8px;width:93.8%;height:62.5%;transition:opacity .55s;top:31%;left:3.1%;overflow:hidden}.envelope-front:before,.envelope-front:after{content:"";pointer-events:none;border-radius:999px;width:70%;height:2px;position:absolute;bottom:0}.envelope-front:before{transform-origin:0;background:linear-gradient(90deg,#5fc2aba6,#7fb8e842);left:0;transform:rotate(-38deg)}.envelope-front:after{transform-origin:100%;background:linear-gradient(270deg,#4f8fc985,#9fe3d442);right:0;transform:rotate(38deg)}.envelope-flap{z-index:8;background:linear-gradient(135deg, var(--mint) 0%, var(--sky) 100%);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;border-radius:8px 8px 0 0;width:93.8%;height:49%;transition:transform .88s cubic-bezier(.2,.8,.2,1),z-index 0s linear .38s;top:31%;left:3.1%}.opened .envelope-flap{z-index:3;transform:scaleY(-1)}.closing .envelope-flap{z-index:8;transition:transform .88s cubic-bezier(.2,.8,.2,1),z-index}.tap-hint{color:var(--ink-soft);letter-spacing:0;align-items:center;gap:10px;margin-top:30px;font-size:12.5px;transition:opacity .28s,transform .28s;animation:1.8s ease-in-out infinite hintBob;display:flex}.tap-hint svg{width:14px;height:14px}@keyframes hintBob{0%,to{opacity:.75;transform:translateY(0)}50%{opacity:1;transform:translateY(5px)}}.letter-card{background:var(--paper);opacity:0;border-radius:8px;width:min(600px,100%);animation:.9s cubic-bezier(.2,.8,.2,1) .15s forwards cardIn;position:relative;overflow:hidden;transform:translateY(50px)scale(.96);box-shadow:0 30px 70px #14465038,0 6px 18px #1446501f}@keyframes cardIn{to{opacity:1;transform:translateY(0)scale(1)}}.letter-topbar{background:linear-gradient(90deg, var(--mint), var(--sky));height:10px}.letter-inner{padding:46px 40px 40px;position:relative}.corner-mark{opacity:.9;width:46px;height:46px;position:absolute}.corner-mark.tl{top:18px;left:18px}.corner-mark.tr{top:18px;right:18px;transform:scaleX(-1)}.letter-header{text-align:center;margin-bottom:8px}.header-glyph{width:54px;height:54px;margin:0 auto 10px}.letter-header h2{color:var(--ink);letter-spacing:0;opacity:0;margin:0;font-family:Georgia,Times New Roman,serif;font-size:30px;font-style:italic;font-weight:400;line-height:1.15;animation:.7s .3s forwards lineIn}.letter-header .sub{color:var(--mint-deep);letter-spacing:0;text-transform:uppercase;opacity:0;margin-top:6px;font-family:Courier New,Consolas,monospace;font-size:10.5px;animation:.7s .45s forwards lineIn}.divider-row{opacity:0;justify-content:center;align-items:center;gap:10px;margin:22px 0 26px;animation:.7s .6s forwards lineIn;display:flex}.divider-row .line{background:linear-gradient(90deg, transparent, var(--line));width:60px;height:1px}.divider-row .line.right{background:linear-gradient(90deg, var(--line), transparent)}.letter-body{color:var(--ink);text-align:left;font-size:15.5px;line-height:1.95}.letter-body p{opacity:0;margin:0 0 17px;animation:.75s forwards lineIn;transform:translateY(12px)}.letter-body p:first-of-type{animation-delay:.75s}.letter-body p:nth-of-type(2){animation-delay:1.05s}.letter-body p:nth-of-type(3){animation-delay:1.35s}.letter-body p:nth-of-type(4){animation-delay:1.65s}.letter-body p:nth-of-type(5){animation-delay:1.95s}@keyframes lineIn{to{opacity:1;transform:translateY(0)}}.letter-sign{color:var(--sky-deep);text-align:right;opacity:0;margin-top:10px;font-family:Georgia,Times New Roman,serif;font-size:18px;font-style:italic;animation:.75s 2.2s forwards lineIn}.letter-footer{opacity:0;flex-direction:column;align-items:center;gap:18px;margin-top:34px;animation:.75s 2.45s forwards lineIn;display:flex}.footer-motif{align-items:center;gap:14px;display:flex}.footer-motif svg{width:26px;height:26px;animation:2.4s ease-in-out infinite motifPulse}.footer-motif svg:nth-child(2){width:30px;height:30px;animation-delay:.2s}.footer-motif svg:nth-child(3){animation-delay:.4s}@keyframes motifPulse{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}.letter-action-btn{border:1px solid var(--line);min-height:42px;color:var(--ink-soft);cursor:pointer;font:inherit;letter-spacing:0;background:0 0;border-radius:8px;align-items:center;gap:8px;padding:10px 24px;font-size:12px;transition:background .25s,border-color .25s,color .25s,transform .25s;display:inline-flex}.letter-action-btn:hover{border-color:var(--ink);background:var(--ink);color:var(--paper);transform:translateY(-2px)}.letter-action-btn:focus-visible{outline:2px solid var(--sky-deep);outline-offset:4px}.letter-action-btn svg{width:13px;height:13px;transition:transform .25s}.letter-action-btn:hover svg{transform:translate(3px)}.journey-stage{position:absolute;inset:0;overflow:hidden}.journey-message{grid-template-columns:minmax(34px,86px) auto minmax(34px,86px);align-items:center;gap:16px;width:min(560px,100%);animation:3.4s both journeySequence;display:grid}.journey-message span{background:linear-gradient(90deg,#0000,#5fc2abb3);height:1px}.journey-message span:last-child{background:linear-gradient(90deg,#7fb8e8b3,#0000)}.journey-message p{color:var(--ink);text-align:center;margin:0;font-family:Georgia,Times New Roman,serif;font-size:24px;font-style:italic;line-height:1.35}@keyframes journeySequence{0%{opacity:0;filter:blur(10px);transform:translateY(18px)scale(.97)}20%,72%{opacity:1;filter:blur();transform:translateY(0)scale(1)}to{opacity:0;filter:blur(12px);transform:translateY(-14px)scale(1.025)}}.memories-stage{justify-content:center;padding-top:28px;padding-bottom:28px;animation:.82s cubic-bezier(.16,1,.3,1) both memoriesStageIn}.memories-stage.exiting{pointer-events:none;animation:.44s both memoriesStageOut}@keyframes memoriesStageIn{0%{opacity:0;filter:blur(14px);transform:scale(1.025)}to{opacity:1;filter:blur();transform:scale(1)}}@keyframes memoriesStageOut{0%{opacity:1;filter:blur();transform:scale(1)}to{opacity:0;filter:blur(12px);transform:scale(1.025)}}.memories-header{text-align:center;width:min(680px,100%);margin:0 auto 24px;animation:.68s .12s both memoryCopyIn}.memories-header h1{letter-spacing:0;margin:0 0 6px;font-family:Georgia,Times New Roman,serif;font-size:36px;font-style:italic;font-weight:400}.memories-header p{color:var(--ink-soft);margin:0;font-size:13.5px;line-height:1.55}.memory-page{width:min(680px,100%);margin:0 auto}.memory-page.direction-next{animation:.66s cubic-bezier(.16,1,.3,1) both memoryNextIn}.memory-page.direction-previous{animation:.66s cubic-bezier(.16,1,.3,1) both memoryPreviousIn}@keyframes memoryNextIn{0%{opacity:0;transform:translate(48px)scale(.985)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes memoryPreviousIn{0%{opacity:0;transform:translate(-48px)scale(.985)}to{opacity:1;transform:translate(0)scale(1)}}.memory-date{color:var(--mint-deep);letter-spacing:0;text-align:center;margin:12px 0 0;font-family:Courier New,Consolas,monospace;font-size:10.5px;font-weight:700;animation:.58s .15s both memoryCopyIn;display:block}.memory-photo{justify-content:center;align-items:center;width:100%;height:clamp(130px,34vw,300px);min-height:0;display:flex;overflow:visible}.memory-photo img{object-fit:contain;border:1px solid #0d24381a;border-radius:8px;width:auto;max-width:100%;height:100%;animation:.8s both memoryImageReveal;box-shadow:0 24px 54px #14465029,0 5px 16px #14465014}@keyframes memoryImageReveal{0%{opacity:0;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}@keyframes memoryCopyIn{to{opacity:1;transform:translateY(0)}}.memory-navigation{grid-template-columns:44px minmax(100px,170px) 44px;justify-content:center;align-items:center;gap:18px;width:min(440px,100%);margin:28px auto 0;animation:.58s .48s both memoryCopyIn;display:grid}.memory-nav-button{width:44px;height:44px;color:var(--ink);cursor:pointer;background:#fffdfad1;border:1px solid #0d243824;border-radius:50%;place-items:center;padding:0;transition:background .22s,border-color .22s,color .22s,transform .22s;display:grid}.memory-nav-button:hover:not(:disabled){border-color:var(--ink);background:var(--ink);color:var(--paper);transform:translateY(-2px)scale(1.04)}.memory-nav-button:active:not(:disabled){transform:scale(.94)}.memory-nav-button:focus-visible{outline:2px solid var(--sky-deep);outline-offset:3px}.memory-nav-button:disabled{opacity:.28;cursor:not-allowed}.memory-nav-button svg{width:17px;height:17px}.memory-progress-track{background:#0d24381a;width:100%;height:2px;overflow:hidden}.memory-progress-track span{background:linear-gradient(90deg, var(--mint-deep), var(--sky-deep));height:100%;transition:width .5s cubic-bezier(.16,1,.3,1);display:block}.memory-finish-slot{place-items:center;height:42px;margin-top:14px;display:grid}.memory-finish-button{min-height:42px;color:var(--ink);cursor:pointer;letter-spacing:0;background:#fffdfae0;border:1px solid #5fc2ab80;border-radius:8px;align-items:center;gap:9px;padding:10px 22px;font-size:11px;font-weight:700;transition:background .22s,border-color .22s,color .22s,transform .22s;animation:.5s cubic-bezier(.16,1,.3,1) both finishButtonIn;display:inline-flex;box-shadow:0 7px 18px #1446501a}.memory-finish-button:hover{border-color:var(--ink);background:var(--ink);color:var(--paper);transform:translateY(-2px)}.memory-finish-button:active{transform:scale(.96)}.memory-finish-button:focus-visible{outline:2px solid var(--sky-deep);outline-offset:3px}.memory-finish-button svg{width:15px;height:15px}@keyframes finishButtonIn{0%{opacity:0;transform:translateY(10px)scale(.94)}to{opacity:1;transform:translateY(0)scale(1)}}.confetti-layer{z-index:4;pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti-piece{background:var(--confetti-color);border-radius:2px;animation:linear forwards confettiFall;display:block;position:fixed;top:-30px}.confetti-piece.shape-1{border-radius:50%}.confetti-piece.shape-2{clip-path:polygon(50% 0,100% 42%,50% 100%,0 42%)}@keyframes confettiFall{to{opacity:.25;transform:translateY(110vh)rotate(480deg)}}@media (width<=540px){.pin-panel{width:min(360px,100%);padding-left:22px;padding-right:22px}.stage{padding:36px 18px}.intro-text{margin-bottom:28px}.intro-text h1{font-size:30px}.intro-text p{font-size:13.5px}.letter-inner{padding:38px 24px 32px}.letter-header h2{font-size:24px}.letter-header .sub{font-size:10px}.letter-body{font-size:14.5px;line-height:1.85}.corner-mark{width:36px;height:36px}.journey-message{grid-template-columns:28px auto 28px;gap:10px}.journey-message p{font-size:20px}.memories-stage{padding:24px 16px}.memories-header{margin-bottom:18px}.memories-header h1{font-size:30px}.memories-header p{font-size:12.5px}.memory-navigation{grid-template-columns:42px minmax(92px,140px) 42px;gap:14px;margin-top:22px}.memory-nav-button{width:42px;height:42px}}@media (height<=700px){.access-stage{padding-top:14px;padding-bottom:14px}.pin-panel{padding-top:16px;padding-bottom:18px}.pin-panel h1{margin-top:3px;font-size:25px}.pin-slots{grid-template-columns:repeat(4,42px);margin-top:14px;margin-bottom:8px}.pin-slot{width:42px;height:40px}.pin-message{margin-bottom:9px}.pin-keypad{grid-template-columns:repeat(3,48px);gap:7px 14px}.pin-key,.pin-key-spacer{width:48px;height:48px}.memories-stage{padding-top:16px;padding-bottom:16px}.memories-header{margin-bottom:16px}}@media (height<=520px) and (orientation:landscape){.access-stage{padding:10px 18px}.pin-panel{grid-template-rows:auto auto 1fr;grid-template-columns:minmax(170px,.9fr) minmax(220px,1.1fr);align-items:center;column-gap:24px;width:min(620px,100%);padding:18px 28px 20px;display:grid}.pin-panel h1,.pin-subtitle,.pin-divider{grid-column:1}.pin-panel h1{grid-row:1;margin-top:0;font-size:25px}.pin-subtitle{grid-row:2}.pin-divider{grid-row:3;align-self:start;margin-top:16px}.pin-slots,.pin-message,.pin-keypad{grid-column:2}.pin-slots{grid-row:1;margin:0 0 5px}.pin-message{grid-row:2;margin-bottom:5px}.pin-keypad{grid-row:3;grid-template-columns:repeat(3,44px);gap:5px 13px}.pin-key,.pin-key-spacer{width:44px;height:44px}.stage{padding-top:10px;padding-bottom:10px}.intro-text{margin-bottom:10px}.intro-text h1{font-size:25px}.intro-text p{margin-top:5px}.envelope-button{width:min(280px,70vh)}.tap-hint{margin-top:10px}.memories-stage,.letter-stage{justify-content:flex-start}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}