@import "https://fonts.googleapis.com/css2?family=Beth+Ellen&family=Caveat:wght@400;500&family=DM+Sans:wght@400;500&family=Kalam:wght@300;400&family=Patrick+Hand&family=Playfair+Display:ital,wght@0,500;1,500&display=swap";@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.fixed{position:fixed}.relative{position:relative}.start{inset-inline-start:var(--spacing)}.table{display:table}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}:root{--plum:#472e36;--plum-dark:#2d171f;--cream:#fffaf0;--paper:#fffdf7;--pink:#e85ab6;--olive:#93922e;--ink:#40272c}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--plum);color:var(--cream);text-transform:lowercase;font-family:DM Sans,sans-serif}button{font:inherit}.letter-world{background:radial-gradient(circle at 50% 42%, #7d515e54, transparent 34%), var(--plum);flex-direction:column;align-items:center;min-height:100svh;padding:30px 24px 22px;display:flex;position:relative;overflow:hidden}.letter-world.is-open{overflow:hidden auto}.studio{z-index:30;width:min(390px,100vw - 44px);max-height:calc(100svh - 44px);color:var(--ink);text-align:left;background:#fffaf0fa;border:1px solid #472e3624;border-radius:18px;padding:24px;position:fixed;top:22px;left:22px;overflow-y:auto;box-shadow:0 24px 70px #14080c59}.studio-heading{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.studio-kicker{color:#9b365f;letter-spacing:.2em;text-transform:uppercase;margin:0 0 3px;font-size:9px;font-weight:500}.studio h2{margin:0;font:500 26px/1.1 Playfair Display,serif}.icon-button{color:#765a60;cursor:pointer;background:0 0;border:0;padding:0 3px;font:300 28px/1 sans-serif}.studio label{color:#684c52;letter-spacing:.08em;text-transform:uppercase;margin-top:14px;font-size:10px;font-weight:500;display:block}.studio textarea,.studio input,.studio select{width:100%;color:var(--ink);resize:vertical;background:#fffdf8;border:1px solid #ddcfd0;border-radius:9px;outline:none;margin-top:7px;padding:11px 12px;font:400 13px/1.55 DM Sans,sans-serif;display:block}.studio select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,#765a60 50%),linear-gradient(135deg,#765a60 50%,#0000 50%);background-position:calc(100% - 15px) 16px,calc(100% - 10px) 16px;background-repeat:no-repeat;background-size:5px 5px}.design-title{border-top:1px solid #e4d7d6;margin-top:20px;padding-top:17px;font:500 18px/1.2 Playfair Display,serif}.control-grid{grid-template-columns:1fr 1fr;gap:0 10px;display:grid}.seal-picker{border:0;margin:15px 0 0;padding:0}.seal-picker legend{color:#684c52;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;font-size:10px;font-weight:500}.seal-picker button{color:#765a60;cursor:pointer;background:#fffdf8;border:1px solid #ddcfd0;border-radius:50%;width:40px;height:40px;margin-right:7px}.seal-picker button.selected{border-color:var(--pink);color:#fff;background:var(--plum);box-shadow:0 0 0 2px #fff,0 0 0 4px #e85ab640}.studio textarea:focus,.studio input:focus{border-color:#c96a91;box-shadow:0 0 0 3px #e85ab61a}.studio-actions{grid-template-columns:1fr 1fr;gap:9px;margin-top:18px;display:grid}.studio-actions button{cursor:pointer;border:0;border-radius:999px;padding:11px 13px;font-size:11px;font-weight:500}.preview-button{color:var(--plum);background:#eadfcd}.save-button{color:var(--plum);background:#f0dfe3}.copy-button{color:#fffaf0;background:var(--plum);grid-column:1/-1}.studio-note{color:#967d81;margin:11px 3px 0;font-size:9px;line-height:1.5}.edit-entry{z-index:15;color:#fffaf0b8;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;background:#2d171f40;border:1px solid #fffaf033;border-radius:999px;padding:8px 13px;font-size:9px;position:fixed;top:20px;right:20px}.editor-mode .arrival{transform:translate(min(15vw,140px))}.letter-world:after{content:"";opacity:.12;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");position:absolute;inset:0}.theme-rose{--plum:#895966;--plum-dark:#633844;--pink:#f2a0bb;--olive:#a88757}.theme-midnight{--plum:#243552;--plum-dark:#152239;--pink:#d392b8;--olive:#9aa56b}.theme-olive{--plum:#5d6345;--plum-dark:#3d422d;--pink:#e494ac;--olive:#9f763e}.paper-blush{--paper:#fff4f2}.paper-white{--paper:#fff}.paper-blush .letter-sheet{background-color:#fff4f2}.paper-white .letter-sheet{background-color:#fff}.font-serif .letter-copy,.font-serif .salutation,.font-serif .signoff{font-family:Playfair Display,serif}.font-clean .letter-copy,.font-clean .salutation,.font-clean .signoff{font-family:DM Sans,sans-serif}.font-caveat .letter-copy,.font-caveat .signoff{font-family:Caveat,cursive}.font-kalam .letter-copy,.font-kalam .signoff{font-family:Kalam,cursive}.font-patrick .letter-copy,.font-patrick .signoff{font-family:Patrick Hand,cursive}.font-serif .salutation,.font-clean .salutation,.font-caveat .salutation,.font-kalam .salutation,.font-patrick .salutation{font-family:Beth Ellen,cursive}.size-small .letter-copy{font-size:11.5px}.size-large .letter-copy{font-size:14.5px}.brand{z-index:10;border-radius:20px;width:74px;height:74px;position:relative;overflow:hidden;box-shadow:0 8px 28px #1e0c1247}.brand img{object-fit:cover;width:100%;height:100%;display:block}.arrival{z-index:2;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;width:min(100%,720px);padding-top:20px;display:flex}.eyebrow{color:#f1cf64;letter-spacing:.28em;text-transform:uppercase;margin:0 0 11px;font-size:10px;font-weight:500}h1{letter-spacing:-.035em;max-width:650px;margin:0;font:500 clamp(39px,7vw,69px)/.98 Playfair Display,serif;transition:opacity .35s}.instruction{color:#decfd2;margin:17px 0 8px;font:italic 500 16px/1.5 Playfair Display,serif;transition:opacity .4s}.eyebrow{transition:opacity .35s}.envelope-button{z-index:5;cursor:pointer;-webkit-tap-highlight-color:transparent;perspective:1200px;background:0 0;border:0;margin:16px 0 4px;padding:0;position:relative}.envelope{filter:drop-shadow(0 24px 22px #16080c61);width:min(76vw,400px);height:min(48vw,250px);min-height:185px;position:relative}.envelope-back,.envelope-front,.flap{position:absolute;inset:0}.envelope-back{background:#f5ead3;border-radius:4px;box-shadow:inset 0 0 35px #5e412814}.flap{z-index:5;transform-origin:top;clip-path:polygon(0 0,100% 0,50% 71%);backface-visibility:hidden;background:linear-gradient(155deg,#fffaf0,#eadfc7);transition:transform .75s cubic-bezier(.3,.02,.15,1)}.envelope-front{z-index:4;border-radius:0 0 4px 4px;overflow:hidden}.front-left,.front-right,.front-bottom{position:absolute;inset:0}.front-left{clip-path:polygon(0 0,55% 100%,0 100%);background:#f7ecd8}.front-right{clip-path:polygon(100% 0,45% 100%,100% 100%);background:#f1e3cb}.front-bottom{clip-path:polygon(0 100%,50% 35%,100% 100%);background:linear-gradient(#f2e5ce,#f8ecd5)}.seal{z-index:7;background:var(--olive);color:#f7e99b;border-radius:46% 54% 50% 45%;place-items:center;width:50px;height:50px;font-size:23px;transition:opacity .28s,transform .5s;display:grid;position:absolute;top:47%;left:50%;transform:translate(-50%,-50%)rotate(-7deg);box-shadow:inset 0 0 0 4px #ffffff29,0 3px 7px #372d1240}.letter-sheet{z-index:2;text-align:left;width:86%;height:540px;color:var(--ink);opacity:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#7e345c4d transparent;-webkit-overflow-scrolling:touch;background:linear-gradient(#fffdf7e0,#fffdf7e0),url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.45' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");padding:42px 44px 66px;transition:transform .95s cubic-bezier(.2,.72,.16,1) .18s,opacity .18s .22s;position:absolute;top:13%;left:7%;overflow-y:auto;box-shadow:0 8px 15px #3b221d2e}.opened-letter{z-index:12;width:min(560px,100vw - 36px);color:var(--ink);background:linear-gradient(#fffdf7e6,#fffdf7e6),url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.45' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");border-radius:3px;animation:.7s cubic-bezier(.2,.72,.16,1) both page-rise;position:absolute;top:92px;bottom:132px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 24px 70px #14080c6b}.opened-letter:before{content:"";z-index:2;pointer-events:none;border:1px solid #e85ab659;position:absolute;inset:14px}.opened-letter-scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;text-align:left;padding:48px 52px 70px;position:absolute;inset:0;overflow-y:scroll}@keyframes page-rise{0%{opacity:0;transform:translate(-50%,90px)}to{opacity:1;transform:translate(-50%)}}.letter-sheet:before{content:"";pointer-events:none;border:1px solid #e85ab659;position:absolute;inset:14px}.paper-mark{color:var(--pink);font-size:28px;position:absolute;top:28px;right:31px}.salutation{margin:0 0 22px;font:400 20px/1.5 Beth Ellen,cursive}.letter-copy{padding-right:4px;font:400 13px/1.62 Beth Ellen,cursive}.letter-copy p{margin:0 0 14px}.signoff{margin:14px 0 0;font:400 13px/1.55 Beth Ellen,cursive}.signoff span{color:#7e345c}.paper-footer{text-align:center;color:#9a7e80;letter-spacing:.2em;text-transform:uppercase;border-top:1px solid #7e345c1f;margin:32px -20px -42px;padding:18px 20px 0;font-size:8px}.instagram-share{min-height:42px;color:var(--cream);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:#2d171f52;border:1px solid #fffaf047;border-radius:999px;justify-content:center;align-items:center;gap:9px;padding:10px 15px;font-size:10px;font-weight:500;animation:.45s both share-arrival;display:flex}.instagram-share span{color:var(--pink);font-size:15px}.instagram-share:disabled{opacity:.65;cursor:wait}.letter-actions{z-index:22;left:50%;bottom:max(18px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);background:#2d171feb;border:1px solid #fffaf029;border-radius:18px;width:min(560px,100vw - 28px);padding:10px;animation:.45s both share-arrival;position:fixed;transform:translate(-50%);box-shadow:0 14px 40px #14080c61}.letter-action-buttons{grid-template-columns:1fr 1fr;gap:8px;display:grid}.fold-letter{min-height:42px;color:var(--plum-dark);background:var(--cream);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:10px 15px;font-size:10px;font-weight:500;display:flex}.fold-letter span{color:var(--pink);font-size:15px}.scroll-cue{color:#fffaf0b8;letter-spacing:.06em;text-align:center;margin:0 0 8px;font-size:9px}.scroll-cue span{color:#f1cf64;margin-right:5px;animation:1.6s ease-in-out infinite scroll-nudge;display:inline-block}@keyframes scroll-nudge{0%,to{transform:translateY(-2px)}50%{transform:translateY(2px)}}@keyframes share-arrival{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.open-label{z-index:10;color:var(--cream);cursor:pointer;background:0 0;border:0;border-bottom:1px solid #fffaf066;align-items:center;gap:9px;margin-top:8px;padding:5px 2px 7px;font:400 14px/1 Beth Ellen,cursive;display:flex}.open-label span{color:#f1cf64;font:18px/1 sans-serif;transition:transform .3s}.open-label:hover span{transform:translate(4px)}.is-open .flap{z-index:1;transform:rotateX(180deg)}.is-open .seal{opacity:0;transform:translate(-50%,-100%)rotate(20deg)scale(.7)}.is-open .letter-sheet{z-index:6;opacity:1;pointer-events:auto;cursor:default;transform:translateY(-430px)}.is-open h1,.is-open .eyebrow,.is-open .instruction{opacity:0}footer{z-index:3;color:#bdaeb1;letter-spacing:.12em;text-transform:uppercase;justify-content:space-between;align-items:center;width:min(100%,620px);font-size:8px;display:flex}.footer-logo{object-fit:cover;border-radius:9px;width:30px;height:30px;box-shadow:0 4px 12px #18080e38}.stars span{z-index:1;pointer-events:none;position:absolute}.star-one{color:#e6d467;font-size:25px;top:14%;left:10%;transform:rotate(16deg)}.star-two{color:var(--pink);font-size:34px;top:29%;right:9%;transform:rotate(-12deg)}.star-three{color:#e6d467;font-size:22px;bottom:19%;left:15%}.star-four{color:#e6d467;font-size:15px;bottom:23%;right:14%}@media (width<=600px){.letter-world{padding:24px 18px 18px}.brand{border-radius:16px;width:58px;height:58px}.arrival{justify-content:flex-start;padding-top:8vh}.eyebrow{margin-bottom:9px;font-size:8px}h1{font-size:clamp(38px,12vw,51px)}.instruction{margin-top:13px;font-size:14px}.envelope-button{margin-top:12px}.envelope{width:86vw;height:54vw}.letter-sheet{height:min(68svh,610px);padding:34px 29px 62px}.letter-copy{font-size:12.5px;line-height:1.58}.letter-copy p{margin-bottom:11px}.salutation{margin-bottom:15px;font-size:17px}.signoff{margin-top:13px;font-size:12.5px}.paper-mark{font-size:23px;top:23px;right:24px}.is-open .arrival{flex:none;min-height:auto;padding-top:18px;padding-bottom:34px}.is-open .eyebrow,.is-open h1,.is-open .instruction{display:none}.is-open .envelope-button{order:1;margin-top:0}.is-open .letter-sheet{height:min(64svh,590px);padding-top:46px;padding-bottom:82px;scroll-padding:46px 0 82px;top:0;transform:translateY(0)}.is-open .envelope{opacity:1;height:54vw}.is-open .envelope-back,.is-open .envelope-front,.is-open .flap,.is-open .seal,.is-open .envelope-button{pointer-events:none}.opened-letter{z-index:12;order:2;width:calc(100vw - 54px);height:auto;min-height:min(76svh,720px);margin-top:calc(34px - 54vw);animation:.7s cubic-bezier(.2,.72,.16,1) both mobile-page-rise;position:relative;top:auto;bottom:auto;left:auto;overflow:visible;transform:none}.opened-letter-scroll{min-height:min(76svh,720px);padding:48px 30px 78px;position:relative;inset:auto;overflow:visible}.opened-letter .paper-footer{margin:34px -8px 0;padding:20px 8px 4px}footer span:first-child{display:none}footer{justify-content:center;gap:14px}.footer-logo{width:28px;height:28px}.star-one{top:19%;left:5%}.star-two{top:32%;right:3%}.studio{border:0;border-radius:0;width:100vw;max-height:100svh;padding:24px 18px 34px;inset:0}.studio textarea{min-height:230px}.studio-actions{background:#fffaf0f7;margin:20px -18px -34px;padding:13px 18px 22px;position:sticky;bottom:-34px;box-shadow:0 -10px 26px #42272c14}.studio-actions button{min-height:46px}.studio-note{margin-bottom:18px}.editor-mode .arrival{opacity:.16;pointer-events:none;transform:none}.edit-entry{top:14px;right:14px}.letter-actions{z-index:13;width:min(100%,520px);box-shadow:none;-webkit-backdrop-filter:none;background:0 0;border:0;order:3;margin-top:22px;padding:0;position:relative;bottom:auto;left:auto;transform:none}.letter-action-buttons{flex-direction:column;align-items:center;gap:15px;display:flex}.fold-letter{min-height:auto;color:var(--cream);letter-spacing:0;text-transform:none;background:0 0;border-bottom:1px solid #fffaf06b;border-radius:0;padding:4px 2px 8px;font:400 18px/1.2 Beth Ellen,cursive}.fold-letter span{color:#f1cf64;order:2;font-size:20px}.instagram-share{letter-spacing:.08em;width:min(100%,350px);min-height:52px;padding:11px 18px;font-size:10px}.scroll-cue{color:#fffaf0c7;margin:0 0 14px}.is-open footer{margin-top:8px}}@keyframes mobile-page-rise{0%{opacity:0;transform:translateY(70px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.flap,.letter-sheet,.seal{transition-duration:.01ms}}
