.writing-editor{min-width:0;position:relative}.message-form textarea.writing-textarea,.messages .message-body{font-family:var(--font-handwriting), cursive;letter-spacing:.01em;font-size:1.6rem;font-weight:500}.message-form textarea.writing-textarea{overflow-wrap:break-word;min-height:12rem;caret-color:var(--pink-deep);line-height:2.2rem;display:block}.writing-editor[data-ink=ready] textarea.writing-textarea{color:#0000}.writing-editor:not([data-activity=idle]) textarea.writing-textarea{caret-color:#0000}.message-form textarea.writing-textarea::placeholder{opacity:.85;font-size:1.4rem}.messages .message-body{line-height:1.4}.writing-ink{z-index:1;box-sizing:border-box;color:var(--ink);pointer-events:none;border-style:solid;border-color:#0000;position:absolute;top:0;left:0;overflow:hidden}.writing-editor[data-ink=loading] .writing-ink{visibility:hidden}.writing-ink-text{will-change:transform}.writing-ink-pending{color:#0000}.writing-ink-current{clip-path:inset(-.7em calc(100% - var(--reveal,0%)) -.5em -.4em)}.writing-ink-marker{vertical-align:baseline;width:0;height:0;display:inline-block}.writing-pencil-viewport{pointer-events:none;clip-path:inset(-2.5rem 0 0);z-index:2;position:absolute;inset:0}.writing-pencil-position{opacity:0;width:76px;height:76px;transition:opacity .16s;position:absolute;transform:translate(-12.4%,-91.7%)}.writing-pencil-position[data-activity=erasing]{transform:translate(-85.6%,-11.3%)}.writing-pencil-position:not([data-activity=idle]){opacity:1}.writing-pencil{transform-origin:12.4% 91.7%;filter:drop-shadow(1px 2px 1px #613b461a);width:100%;height:100%;display:block}.writing-pencil-position[data-activity=writing] .writing-pencil{animation:.12s ease-in-out infinite alternate pencil-writing-stroke}.writing-pencil-position[data-activity=erasing] .writing-pencil{transform-origin:85.6% 11.3%;animation:90ms ease-in-out infinite alternate pencil-erasing-rub}@keyframes pencil-writing-stroke{0%{transform:rotate(-3deg)}to{transform:rotate(3deg)}}@keyframes pencil-erasing-rub{0%{transform:rotate(180deg)translate(-3px)}to{transform:rotate(180deg)translate(3px)}}@media (max-width:48rem){.message-form textarea.writing-textarea,.messages .message-body{font-size:1.45rem}.message-form textarea.writing-textarea::placeholder{font-size:1.25rem}.writing-pencil-position{width:62px;height:62px}}@media (prefers-reduced-motion:reduce){.writing-editor[data-ink=ready] textarea.writing-textarea,.writing-editor:not([data-activity=idle]) textarea.writing-textarea{color:var(--ink);caret-color:var(--pink-deep)}.writing-ink,.writing-pencil-viewport{display:none}.writing-pencil-position,.writing-pencil-position[data-activity=writing] .writing-pencil,.writing-pencil-position[data-activity=erasing] .writing-pencil{transition:none;animation:none}}
.mail-pile-stage{isolation:isolate;width:min(100%,34rem);display:grid;position:relative}.mail-pile-stage>.mail-pile-button,.floating-mail-reader{grid-area:1/1;place-self:start center}.mail-pile-stage>.mail-pile-button{margin-top:4rem;transition:opacity .85s}.message-mailbox[data-open=true] .mail-pile-button{opacity:.55;cursor:default}.message-mailbox[data-open=true] .mail-pile-art{transform:none}.message-mailbox[data-open=true] .mail-pile-count{visibility:hidden}.floating-mail-reader{--envelope-width:min(calc(100cqw - 3rem), 25rem);--paper-height:clamp(22rem, 58svh, 29rem);z-index:1;outline:none;width:100%;position:relative;container-type:inline-size}.mail-close{top:-1rem;right:calc((100% - var(--envelope-width)) / 2);z-index:10;width:2.75rem;height:2.75rem;color:var(--rose-ink);cursor:pointer;background:#fffaf6;border:1px solid #e9c9d2;border-radius:50%;font-size:1.7rem;position:absolute;box-shadow:0 4px 12px #93646d18}.mail-navigation{justify-content:center;align-items:center;gap:1.5rem;display:flex}.mail-counter{color:var(--muted);margin:0;font-size:.9rem}.mail-arrow{width:3rem;height:3rem;color:var(--rose-ink);cursor:pointer;background:#fffaf6;border:1px solid #e9c9d2;border-radius:50%;place-items:center;font-size:1.7rem;transition:transform .18s,opacity .18s;display:grid;box-shadow:0 5px 14px #93646d18}.mail-arrow:hover{transform:translateY(-2px)}.mail-arrow[aria-disabled=true]{opacity:.45;cursor:default;transform:none}.envelope-scene{--envelope-bottom:calc(7rem + var(--envelope-width) / 1.5 - .5rem);isolation:isolate;height:max(calc(var(--envelope-bottom) + 2rem), calc(var(--paper-height) + 2rem));perspective:1100px;transform-origin:50% 65%;position:relative}.envelope-prop{top:7rem;left:calc((100% - var(--envelope-width)) / 2);width:var(--envelope-width);aspect-ratio:1.5;visibility:hidden;position:absolute}.envelope-lining{z-index:0;background:#f5d6d0;border-radius:.5rem;position:absolute;inset:.125rem .5rem .5rem}.envelope-hinge{z-index:0;background:#f5d6d0;height:.85rem;position:absolute;top:0;left:.4rem;right:.4rem}.envelope-pocket{z-index:3;filter:drop-shadow(0 12px 12px #93646d28);width:100%;height:100%;position:absolute;inset:0}.envelope-flap{transform-origin:50% .1rem;z-index:4;width:100%;height:59%;position:absolute;top:.35rem;left:0}.envelope-flap img{width:100%;height:100%}.envelope-seal{z-index:5;filter:drop-shadow(0 3px 2px #82425138);width:18%;height:auto;position:absolute;top:46%;left:41%}.letter-window{z-index:2;visibility:hidden;height:var(--envelope-bottom);position:relative;overflow:hidden}.paper-extraction{height:var(--paper-height);position:relative}.keepsake-letter{width:calc(var(--envelope-width) - 1.5rem);height:var(--paper-height);background:#fffdf5;border:1px solid #e9d9c6;border-radius:.25rem;margin:0 auto;position:absolute;top:0;left:0;right:0;box-shadow:0 20px 40px #93646d26,0 3px 8px #93646d12}.letter-content{scrollbar-width:thin;scrollbar-color:#deb3bf #fffdf5;overscroll-behavior:contain;height:100%;padding:clamp(1rem,3vw,1.75rem);overflow:hidden}.envelope-scene[data-revealed=true] .letter-content{overflow-y:auto}.keepsake-salutation{font-family:var(--font-script), cursive;color:var(--pink-deep);margin-bottom:1.2rem;font-size:1.8rem}.keepsake-letter .message-author{text-align:right}.envelope-scene[data-ready=true]{animation:.85s cubic-bezier(.22,.7,.2,1) both envelope-pickup}.envelope-scene[data-ready=true] .envelope-prop{visibility:visible}.envelope-scene[data-ready=true] .envelope-pocket,.envelope-scene[data-ready=true] .envelope-hinge,.envelope-scene[data-ready=true] .envelope-lining{animation:.8s 3.65s both envelope-depart}.envelope-scene[data-ready=true] .envelope-seal{animation:.8s ease-in-out 1.35s both seal-release}.envelope-scene[data-ready=true] .envelope-flap{animation:.85s cubic-bezier(.4,0,.2,1) 1.95s both flap-unfold,.8s 3.65s both envelope-depart}.envelope-scene[data-ready=true] .paper-extraction{animation:3.6s cubic-bezier(.22,.7,.2,1) .85s both letter-extract}.envelope-scene[data-ready=true] .letter-window{visibility:visible}.envelope-scene[data-revealed=true] .letter-window{z-index:6;height:var(--paper-height);overflow:visible}.envelope-scene[data-failed=true] .envelope-prop{display:none}.envelope-scene[data-failed=true] .letter-window{visibility:visible;height:var(--paper-height);overflow:visible}.envelope-scene[data-failed=true] .paper-extraction{animation:none;transform:none}@keyframes envelope-pickup{0%{opacity:0;transform:translateY(2.5rem)rotate(-9deg)scale(.72)}25%{opacity:1}to{opacity:1;transform:none}}@keyframes envelope-depart{0%{opacity:1;translate:0}to{opacity:0;visibility:hidden;translate:0 4rem}}@keyframes seal-release{0%,15%{opacity:1;transform:none}40%{transform:rotate(-12deg)scale(1.13)}65%{opacity:1;transform:translate(8%,-28%)rotate(10deg)scale(1.18)}to{opacity:0;transform:translate(55%,100%)rotate(35deg)scale(.85)}}@keyframes flap-unfold{0%{z-index:4;transform:rotateX(0)}50%{z-index:4}51%,to{z-index:1}to{filter:brightness(.93);transform:rotateX(180deg)}}@keyframes letter-extract{0%,49%{transform:translateY(7.5rem)}78%,88%{transform:translateY(0)}to{transform:none}}@media (max-width:48rem){.floating-gramophone{width:4.5rem}.envelope-scene{padding-inline:0}.mail-navigation{gap:.75rem;padding-right:3rem}}@media (prefers-reduced-motion:reduce){.mail-arrow,.mail-pile-stage>.mail-pile-button{transition:none}.envelope-scene[data-ready=true]{animation:none}.envelope-scene[data-ready=true] .envelope-prop{display:none}.envelope-scene[data-ready=true] .paper-extraction{animation:1ms both letter-still}@keyframes letter-still{to{opacity:1}}}