:root{--bg:#f4f0e7;--ink:#454b3d;--green:#657650;--line:#dfddcf;--muted:#8b8d7d;--paper:#faf7ee}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font:14px 'DM Sans',sans-serif;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238e8060' opacity='.055' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,input,textarea{font:inherit}button,a,input,textarea{ -webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}button{border:0;background:none}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:5px}button:hover{filter:brightness(.92)}.header{height:100px;max-width:1344px;margin:auto;padding:0 48px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:65px}.brand{font:500 29px 'Playfair Display',serif;letter-spacing:-1.1px;white-space:nowrap}.brand-icon{display:inline-block;transform:rotate(-12deg);font-size:29px;margin-right:7px;color:#74805d}.brand-dot{color:#9c624c}.header nav{display:flex;align-items:center;gap:29px;font-size:12px;height:100%}.header nav a,.header nav button{height:100%;display:flex;align-items:center;padding:0;position:relative;white-space:nowrap}.header nav .active:after{content:'';position:absolute;bottom:22px;height:2px;background:var(--green);left:0;right:0}.little-dot{height:5px;width:5px;background:#aab18d;border-radius:50%;margin-left:6px}.header-note{font:19px Caveat,cursive;margin-left:auto;color:#8c917d;white-space:nowrap}.header-note span{margin-left:10px;font-size:26px;color:#a6ad8f}.intro{text-align:center;padding:49px 20px 34px;position:relative}.eyebrow{font-size:10px;letter-spacing:2.3px;font-weight:600;color:#7c876b;display:flex;align-items:center;justify-content:center;gap:10px}.eyebrow span{width:20px;height:1px;background:#909b7f}.intro h1{font:400 57px 'Playfair Display',serif;letter-spacing:-2px;margin:15px 0 14px}.intro h1 em{color:#7d8968;font-weight:400}.spark{display:inline-block;font:42px 'Caveat';color:#ada76f;margin-left:13px;transform:translateY(-17px)}.intro p{font-size:13px;line-height:1.9;color:#818273;margin:0}.intro-foot{font:21px Caveat,cursive;color:#92977b;margin-top:13px}.intro-foot span{font-size:31px;display:inline-block;transform:rotate(15deg);margin-left:6px}.workshop{max-width:1192px;margin:0 auto;display:grid;grid-template-columns:287px 1fr;gap:30px;padding:0 20px}.toolbox{border:1px solid #dcdccd;border-radius:12px;background:#f9f7efb0;align-self:start;overflow:hidden;box-shadow:0 4px 15px #67634803}.box-title{padding:23px 21px 20px;font-family:'Playfair Display',serif;font-size:19px;display:flex;align-items:center;gap:9px}.box-title>span:first-child{font:25px Caveat;color:#7e886e}.tiny-flower{margin-left:auto;color:#a8ac8f;font-size:22px}.tabs{display:grid;grid-template-columns:repeat(4,1fr);margin:0 16px;border-bottom:1px solid #dfdfd2}.tabs button{font-size:22px;padding:10px 0 13px;position:relative;color:#929581}.tabs button span{display:block;font:10px 'DM Sans';margin-top:5px}.tabs button.selected{color:#566d46}.tabs button.selected:after{content:'';bottom:-1px;left:7px;right:7px;background:#73855f;height:2px}#options{padding:22px 22px 27px;min-height:340px}.option-label{font-size:10px;letter-spacing:1.1px;font-weight:650;margin:0 0 13px}.swatches{display:flex;gap:11px;margin:0 0 9px}.swatch{height:32px;width:32px;flex-shrink:0;border-radius:50%;border:1px solid #0000000e;position:relative;box-shadow:inset 0 1px 3px #fff8}.swatch.selected:after{content:'';border:1.5px solid #7c8969;position:absolute;inset:-5px;border-radius:50%}.option-caption{color:#969786;font-size:10px;margin-top:11px;margin-bottom:25px}.pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.pattern{border:1px solid #deded1;border-radius:6px;height:62px;background:#f4f0e4;overflow:hidden;font-size:19px;color:#8a987b}.pattern.selected{border:1.5px solid #7c8d66;background:#f0f0e5}.pattern small{font-size:9px;display:block;margin-top:4px}.pattern-lines{background-image:repeating-linear-gradient(transparent 0px,transparent 12px,#b8b6a733 13px,transparent 14px)}.pattern-gridbg{background-image:linear-gradient(#b8b6a722 1px,transparent 1px),linear-gradient(90deg,#b8b6a722 1px,transparent 1px);background-size:12px 12px}.font-options{display:flex;gap:8px}.font-choice{border:1px solid var(--line);border-radius:5px;padding:8px 5px;flex:1;background:#faf9f3;font-size:11px}.font-choice.selected{border-color:#889674;background:#edeee3}.font-choice.hand{font:16px Caveat}.font-choice.serif{font-family:Georgia}.toolbox-bottom{padding:16px 20px;background:#efeee3;border-top:1px solid #e2e1d4;color:#8b9079;font:16px Caveat;display:flex;gap:8px;justify-content:center}.writing-area{min-width:0}.desk-top{display:flex;align-items:center;justify-content:space-between;margin:0 3px 17px;font-size:10px;color:#949888}.desk-top>span{display:flex;gap:7px;align-items:center}.status-dot{height:5px;width:5px;background:#96a67e;border-radius:50%}.desk-top button{color:#7d8570;display:flex;align-items:center;gap:5px}.paper-wrap{position:relative;padding:0 58px 15px 22px;min-height:455px}.letter{--paper:#fbf8ee;background-color:var(--paper);padding:27px 35px 16px;position:relative;box-shadow:0 6px 20px #645b3410,0 1px 4px #645b3410;min-height:426px;transform:rotate(-1deg);border:1px solid #e7e0ce;border-radius:1px;transition:background-color .3s;z-index:1}.letter:before{content:'';position:absolute;pointer-events:none;inset:0;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Cpath fill='%239e9172' filter='url(%23n)' d='M0 0h120v120H0z'/%3E%3C/svg%3E")}.letter>*{position:relative}.letter-top{display:flex;justify-content:space-between;color:#a0a18b;font-size:9px;margin-bottom:28px}.letter-mark{font:15px Caveat;color:#979a7d}.recipient-label{display:block;font-size:8px;letter-spacing:1.5px;color:#aaa58f;margin-bottom:12px}.letter input,.letter textarea{display:block;background:transparent;border:0;outline:0;width:100%;color:#5e6153;resize:vertical}.letter input::placeholder,.letter textarea::placeholder{color:#9e9d88;opacity:.85}.letter input:focus,.letter textarea:focus{outline:1px dashed #9ba88555;outline-offset:6px}#recipient{font:25px Caveat;margin-bottom:14px}#message{min-height:168px;font:21px/1.6 Caveat;resize:vertical}.signature-row{margin-top:10px;font:20px Caveat;color:#8d927b;display:flex;flex-direction:column;align-items:flex-end}.signature-row input{font:22px Caveat;text-align:right;max-width:220px;padding:0}.letter-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d7d3be66;margin-top:15px;padding-top:8px}.letter-bottom>span:first-child{font-size:24px;color:#a6af8a}.letter-bottom>span:last-child{font-size:8px;letter-spacing:.5px;color:#aaa894}.floating-flower{position:absolute;right:25px;top:-19px;font-size:61px;line-height:1;color:#c3ad72;transform:rotate(15deg);z-index:3;text-shadow:2px 3px #fff9}.postcard-decoration{position:absolute;bottom:23px;right:-12px;width:155px;background:#fcf8eb;padding:8px 8px 6px;box-shadow:0 4px 12px #514b3726;transform:rotate(12deg);z-index:2}.postcard-decoration img{width:100%;height:93px;object-fit:cover;display:block}.postcard-decoration span{font:12px Caveat;display:block;text-align:center;margin-top:5px;color:#8a8b6e}.stamp-decoration{position:absolute;top:60px;right:4px;transform:rotate(12deg);border:3px dotted #b8be9d;background:#dce0c9;padding:5px 9px;color:#748664;text-align:center;font-size:24px}.stamp-decoration small{display:block;font-size:6px;letter-spacing:1px;line-height:1.4}.desk-leaf{position:absolute;bottom:-8px;left:-15px;font-size:70px;transform:rotate(-25deg);color:#9ea98280}.desk-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:12px;padding-right:2px}.desk-bottom>span{font:17px Caveat;color:#8b927b}.desk-bottom>span>span{font-size:24px;display:inline-block;margin-right:6px;transform:rotate(-15deg)}.primary{display:inline-flex;justify-content:center;align-items:center;gap:25px;background:#687a53;color:#fffdf3;border-radius:6px;padding:14px 20px;font-size:11px;box-shadow:0 3px 5px #59654415;white-space:nowrap}.primary>span{font-size:17px}.how{max-width:1090px;margin:46px auto 0;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:27px 0 30px;gap:20px}.how>div{display:flex;align-items:center;gap:15px}.how-number{font:italic 24px 'Playfair Display';color:#a1a88c}.how p{margin:0;font-size:11px}.how strong{font-weight:500;display:block;margin-bottom:5px}.how p>span{color:#97998b;font-size:10px}.how-line{height:1px;background:#d6d9c6;width:46px;flex-shrink:1}footer{max-width:1248px;margin:0 auto;padding:22px 25px 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:#949782}footer .brand{font-size:19px;color:#80886e}footer>span{font:17px Caveat}footer button{font-size:10px}.heart{color:#ad9b89;margin-left:6px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,25px);opacity:0;transition:.25s;background:#4e5e43;color:#fffbed;padding:13px 23px;border-radius:7px;z-index:30;pointer-events:none;max-width:90vw;text-align:center;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(600px,94vw);max-height:90dvh;border:1px solid #d8d6c5;border-radius:14px;background:#f8f4e8;color:var(--ink);padding:40px;box-shadow:0 20px 100px #383b3433}dialog::backdrop{background:#333b315c;backdrop-filter:blur(4px)}.close{position:absolute;right:13px;top:8px;font-size:26px;color:#939681}.modal-title{font:30px 'Playfair Display';margin:0 0 12px;text-align:center}.modal-subtitle{text-align:center;color:#8c907c;line-height:1.8;font-size:12px}.modal-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:23px}.secondary{border:1px solid #bfc5ad;border-radius:6px;padding:12px 20px;font-size:11px}.envelope{--env:#d5dcc2;width:min(340px,85%);height:210px;margin:30px auto;background:var(--env);position:relative;border-radius:4px;box-shadow:0 12px 25px #4f543024;isolation:isolate;display:flex;align-items:center;justify-content:center}.envelope:before{content:'';position:absolute;inset:0;background:linear-gradient(32deg,#fff2 49.6%,#b9bfaa66 50%,transparent 50.4%),linear-gradient(-32deg,#fff1 49.6%,#b9bfaa66 50%,transparent 50.4%)}.envelope:after{content:'';position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 60%);background:color-mix(in srgb,var(--env) 80%,white);filter:drop-shadow(0 2px 1px #0002)}.wax{--wax:#a46654;width:57px;height:57px;background:var(--wax);box-shadow:inset 0 0 0 4px #ffffff18,inset 0 0 0 6px #00000010,0 3px 6px #0002;border:2px solid #ffffff22;border-radius:46% 53% 44% 51%;color:#fff9;font:30px Georgia;display:flex;align-items:center;justify-content:center;z-index:2;position:relative;margin-top:14px}.envelope-name{position:absolute;bottom:25px;font:23px Caveat;z-index:2}.share-field{width:100%;border:1px solid #cdd1bd;border-radius:6px;background:#fdfbf5;color:#768367;padding:12px;font-size:11px;margin-top:10px}.card-choice{display:block;border:1px solid var(--line);border-radius:6px;background:#fdfbf4;padding:7px;margin-bottom:12px;width:100%;text-align:left}.card-choice img{width:100%;height:93px;object-fit:cover;border-radius:3px}.card-choice span{font:16px Caveat;display:flex;align-items:center;justify-content:space-between;padding:5px 3px 1px}.card-choice.selected{border-color:#7e916a}.card-choice:nth-child(2) img{object-position:0 100%;filter:sepia(.18)}.remove-cards{font-size:10px;text-decoration:underline;color:#929982}.attachments{display:flex;gap:10px;flex-wrap:wrap;padding-top:15px}.attached{position:relative;width:150px;padding:5px 5px 7px;background:#fffbed;box-shadow:0 2px 5px #0002;transform:rotate(2deg)}.attached img{width:100%;height:88px;object-fit:cover}.attached p{font:14px Caveat;margin:4px;text-align:center}.attached button{position:absolute;right:0;top:0;background:#faf5e7;border-radius:50%;font-size:18px;width:22px;height:22px}.seal-input{width:100%;padding:10px;border:1px solid var(--line);background:#fffcf4;border-radius:5px;color:var(--ink);margin-bottom:20px}.checkbox-label{display:flex;gap:8px;align-items:center;font-size:11px;margin-bottom:20px;cursor:pointer;accent-color:var(--green)}.read-intro{text-align:center;margin:50px 20px 25px}.read-intro h1{font:42px 'Playfair Display'}.read-intro p{color:var(--muted);line-height:1.8}.reader-letter{max-width:650px;margin:40px auto 65px;transform:none}.read-body{white-space:pre-wrap;overflow-wrap:anywhere;font:23px/1.8 Caveat;margin:20px 0 40px}.reader-letter .read-to{font:30px Caveat}.reader-letter .read-sign{text-align:right;font:25px Caveat}.about-text{font-size:14px;line-height:1.9;color:#777e69}.checkmark{color:#829469}.dialog-preview{transform:none;margin-top:20px;padding:25px}.dialog-preview .read-body{font-size:20px;margin:20px 0}.lined{background-image:repeating-linear-gradient(transparent,transparent 32px,#8f90721c 33px,transparent 34px);background-position:0 4px}.grid-paper{background-image:linear-gradient(#91977916 1px,transparent 1px),linear-gradient(90deg,#91977916 1px,transparent 1px);background-size:22px 22px}
@media(min-width:1450px){.intro{padding-top:62px;padding-bottom:44px}.workshop{max-width:1250px;grid-template-columns:300px 1fr;gap:44px}.letter{min-height:460px}#message{min-height:198px}.how{margin-top:57px}.header{max-width:1440px}}
@media(max-width:1050px){.header{padding:0 25px;gap:35px}.header-note{display:none}.workshop{gap:20px;grid-template-columns:255px 1fr}.paper-wrap{padding-left:5px;padding-right:30px}.postcard-decoration{right:-5px;width:125px;bottom:30px}.postcard-decoration img{height:80px}.desk-bottom{align-items:flex-end}.desk-bottom>span{max-width:210px}.how{margin-left:25px;margin-right:25px;gap:12px}.how-line{width:20px}.letter{padding-left:25px;padding-right:25px}.stamp-decoration{right:-5px}}
@media(max-width:720px){.header{height:78px;justify-content:space-between;padding:0 20px}.brand{font-size:25px}.header nav{gap:18px}.header nav a{display:none}.header nav button{font-size:10px}.header nav button:last-child{max-width:92px;text-align:left;line-height:1.5}.intro{padding:34px 15px 30px}.intro h1{font-size:42px;letter-spacing:-1.5px}.spark{font-size:27px;margin-left:5px;transform:translateY(-13px)}.intro p{font-size:12px}.intro-foot{font-size:18px}.eyebrow{font-size:8px}.workshop{display:flex;flex-direction:column;padding:0 17px;gap:25px}.toolbox{width:100%}.box-title{padding:15px 18px}.tabs{margin:0 12px}.tabs button{padding:5px 0 11px}.tabs button span{margin-top:3px}#options{min-height:0;padding:19px 20px 18px;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}.option-section{min-width:0}.option-caption{margin-bottom:2px}.option-label{font-size:9px;margin-bottom:11px}.swatches{gap:10px}.swatch{width:25px;height:25px}.pattern{height:51px}.pattern small{font-size:8px}.font-section{grid-column:1/-1;display:flex;align-items:center;gap:20px}.font-section .option-label{margin:0;white-space:nowrap}.font-options{flex:1}.toolbox-bottom{display:none}.paper-wrap{padding:0 23px 10px 5px}.letter{padding:25px 22px 15px;min-height:440px}.letter-top{margin-bottom:25px}.letter-mark{font-size:12px}.letter-top>span:last-child{font-size:8px}#message{min-height:195px;font-size:20px}.postcard-decoration{width:100px;right:-5px;bottom:35px;transform:rotate(8deg)}.postcard-decoration img{height:67px}.postcard-decoration span{font-size:10px}.stamp-decoration{display:none}.floating-flower{font-size:45px;right:5px;top:-12px}.desk-bottom>span{font-size:15px;max-width:140px}.primary{padding:13px 15px;gap:15px}.desk-leaf{left:-8px;font-size:45px}.how{margin-top:32px;display:grid;grid-template-columns:1fr;gap:18px;padding:24px 8px}.how-line{display:none}.how>div{gap:17px}.how p{font-size:12px}.how p>span{font-size:11px}.how-number{font-size:26px}footer{padding:20px;gap:10px;flex-wrap:wrap}footer>span{font-size:15px}footer button{width:100%;text-align:center;padding-top:12px}dialog{padding:35px 22px}.modal-title{font-size:26px}.reader-letter{margin:30px 18px}.read-intro h1{font-size:33px}.checkbox-label{line-height:1.5}.card-choice img{height:75px}.card-choice span{font-size:14px}.envelope{height:185px}.font-choice{padding:7px}}
/* The expanded atelier keeps the writing desk in view. */
[hidden]{display:none!important}
#options{max-height:520px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c3cab1 transparent;padding-bottom:10px}
.option-section{margin-bottom:23px}.option-section:last-child{margin-bottom:10px}
.option-section .option-caption{margin-bottom:0;line-height:1.6}
.swatches{flex-wrap:wrap;gap:12px;margin:5px 0 10px;padding:2px}
.swatch{width:30px;height:30px}.swatch.selected:before{content:'✓';position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:#697455;text-shadow:0 1px #fff9}
.choice-row{display:flex;flex-wrap:wrap;gap:7px}.choice-row .font-choice{flex:1 1 40%;min-height:34px}.pattern{height:58px}.pattern small{line-height:1.2}
.seal-settings{border:0;padding:0;margin:0;min-width:0}.seal-settings:disabled{opacity:.48}.seal-settings:disabled button{cursor:default}
.option-preview{width:100%;margin:0 0 12px;background:#eef0e3}.seal-sample{display:flex;justify-content:center;padding:4px 0 8px}
.card-gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 24px}.card-choice{margin:0;padding:5px;transition:transform .2s,border-color .2s}.card-choice:hover{transform:translateY(-2px)}
.card-choice img{height:76px;aspect-ratio:3/2}.card-choice span{font:14px/1.3 Caveat;gap:4px;min-height:36px;align-items:flex-start}.card-choice b{font:15px 'DM Sans';color:#6a7d52}.card-choice.selected{box-shadow:0 0 0 1px #83946d;background:#f1f2e7}
.card-choice:nth-child(2) img{filter:none}.card-crop{object-position:0 100%;filter:sepia(.18)!important;object-fit:cover;transform:scale(1);clip-path:inset(0)}
.card-choice .card-crop{object-position:left bottom}.note-label{display:block;font-size:10px;line-height:1.6;color:#848b76}.note-label .seal-input{display:block;font-size:11px;margin:6px 0 13px}.postcard-intro .option-caption{margin:0;line-height:1.7}
.attached{margin:0;width:150px;overflow-wrap:anywhere}.attached figcaption{padding:4px 3px 1px;font:15px/1.4 Caveat;text-align:center;color:#6f735f}.attached figcaption p{margin:5px 0 0;font:17px/1.4 Caveat;color:#7d7565;border-top:1px solid #8f977333;padding-top:5px}.attached:nth-child(even){transform:rotate(-2deg)}
.paper-wrap:has(.attached) .postcard-decoration,.paper-wrap:has(#sender:not(:placeholder-shown)) .postcard-decoration{display:none}
.frame-ivory{background:#fffbed}.frame-kraft{background:#decbad}.frame-sage{background:#dce3cf}.frame-rose{background:#eed7d5}
.letter{--letter-font:Caveat,cursive;--letter-ink:#5e6153;--letter-size:21px;color:var(--letter-ink)}
.letter #message,.letter .read-body{font-family:var(--letter-font);color:var(--letter-ink);font-size:var(--letter-size);line-height:1.65}
.letter #recipient,.letter .read-to,.letter #sender,.letter .read-sign{font-family:var(--letter-font);color:var(--letter-ink);font-size:calc(var(--letter-size) + 2px)}
.letter .signature-row{color:var(--letter-ink)}.letter input::placeholder,.letter textarea::placeholder{color:var(--letter-ink);opacity:.5}
.letter:after{content:'';position:absolute;inset:12px;pointer-events:none;z-index:0}.letter>*{z-index:1}
.border-inset:after{border:1px solid #9aa88066}.border-double:after{border:3px double #9aa88066}
.border-botanical:after{border-left:2px solid #a7b18a66;border-right:2px solid #a7b18a66;border-radius:30px 4px 30px 4px;background:radial-gradient(ellipse at 16px 0,#a4b28b66 0 4px,transparent 5px) left top/32px 14px repeat-x,radial-gradient(ellipse at 16px 14px,#a4b28b66 0 4px,transparent 5px) left bottom/32px 14px repeat-x}
.dotted{background-image:radial-gradient(#8b977b40 .8px,transparent .9px);background-size:19px 19px}
.floral{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='75' height='75' viewBox='0 0 75 75'%3E%3Cg opacity='.17'%3E%3Cpath d='M11 23q8 2 5 15' stroke='%238c9c77' fill='none'/%3E%3Cellipse cx='19' cy='29' rx='5' ry='2' fill='%238c9c77' transform='rotate(-30 19 29)'/%3E%3Cg fill='%23b98d7f'%3E%3Ccircle cx='11' cy='17' r='3'/%3E%3Ccircle cx='16' cy='20' r='3'/%3E%3Ccircle cx='14' cy='25' r='3'/%3E%3Ccircle cx='8' cy='24' r='3'/%3E%3Ccircle cx='7' cy='19' r='3'/%3E%3C/g%3E%3Ccircle cx='11' cy='21' r='2' fill='%23bcad71'/%3E%3C/g%3E%3C/svg%3E")}
.starry{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='75' height='75'%3E%3Cpath d='M17 10l2 6 6 2-6 2-2 6-2-6-6-2 6-2z' fill='%23b4a875' opacity='.22'/%3E%3Ccircle cx='52' cy='53' r='1.2' fill='%23b4a875' opacity='.3'/%3E%3C/svg%3E")}
/* Real envelope layers allow the flap and letter to move independently. */
.envelope-stage{padding:72px 0 32px;perspective:1000px;position:relative}
.envelope{--env:#d5dcc2;--lining:#f1e7cc;--paper:#fbf8ee;display:block;width:min(340px,88%);height:auto;aspect-ratio:1.62;margin:0 auto;border:0;border-radius:5px;isolation:isolate;background:none;box-shadow:none;perspective:1000px}
.envelope:before,.envelope:after{content:none}
.env-back,.env-lining,.env-letter,.env-front,.env-flap{position:absolute}
.env-back{inset:0;z-index:0;border-radius:5px;background:color-mix(in srgb,var(--env) 80%,#6b715b);box-shadow:0 12px 25px #4f543024}
.env-lining{inset:5px 5px 12%;border-radius:4px;background-color:var(--lining);background-image:radial-gradient(#78846833 1px,transparent 1px);background-size:10px 10px;z-index:1}
.env-letter{inset:8px 18px 7px;z-index:2;background:var(--paper);border:1px solid #cfcab7;box-shadow:0 1px 7px #3d443222;padding:18px 20px;text-align:left;border-radius:2px;overflow:hidden}
.env-letter>span{display:block;color:#9da57f;font:27px Georgia;text-align:center;margin:0 0 12px}.env-letter i{display:block;height:1px;margin:13px 0;background:#9ea58b55;width:90%}.env-letter i:last-child{width:60%}
.env-front{inset:0;z-index:4;background-color:var(--env);background-image:linear-gradient(32deg,#ffffff15 49.6%,#949c7e66 50%,transparent 50.5%),linear-gradient(-32deg,#ffffff10 49.6%,#949c7e44 50%,transparent 50.5%);clip-path:polygon(0 0,50% 45%,100% 0,100% 100%,0 100%);border-radius:0 0 5px 5px}
.env-flap{top:-1px;left:0;right:0;height:62%;z-index:5;background:color-mix(in srgb,var(--env) 87%,white);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;transform-style:preserve-3d;filter:drop-shadow(0 2px 1px #4d563122)}
.envelope-stripes .env-front{background-image:repeating-linear-gradient(45deg,transparent 0 9px,#fff2 10px 12px)}
.envelope-stripes .env-flap{background-image:repeating-linear-gradient(45deg,transparent 0 9px,#fff2 10px 12px)}
.envelope-dots .env-front,.envelope-dots .env-flap{background-image:radial-gradient(#fff6 1.3px,transparent 1.5px);background-size:15px 15px}
.envelope-botanical .env-front,.envelope-botanical .env-flap{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='54'%3E%3Cg opacity='.22' stroke='%23667350' fill='none'%3E%3Cpath d='M17 40q16-12 6-29'/%3E%3Cpath d='M22 27q-12 1-10-7 10-3 10 7zM24 23q10-9 13-2-2 7-13 2z'/%3E%3C/g%3E%3C/svg%3E")}
.envelope .wax{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);z-index:6;margin:0;width:57px;height:57px;font-size:28px}
.wax>span{position:relative;z-index:1;font-size:inherit}.wax-flower{border-radius:40%;clip-path:polygon(50% 0,62% 7%,76% 4%,83% 18%,97% 24%,93% 39%,100% 50%,93% 62%,96% 77%,82% 83%,76% 96%,61% 93%,50% 100%,38% 93%,24% 97%,17% 83%,3% 76%,7% 61%,0 50%,7% 38%,4% 24%,18% 17%,24% 3%,39% 7%)}.wax-square{border-radius:14px 10px 15px 11px}.wax-classic{border-radius:46% 53% 44% 51%}
.seal-sample .wax{margin:0;position:relative;font-size:26px}.envelope-name{bottom:20px;left:20px;right:70px;text-align:left;font:22px Caveat;z-index:5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#657052}
.envelope-stamp{position:absolute;right:16px;bottom:16px;z-index:5;width:42px;height:48px;border:2px dotted #9ca885;background:#fff4;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#6f805b;font-size:23px;transform:rotate(5deg)}.envelope-stamp small{font:5px 'DM Sans';letter-spacing:1px;margin-top:3px}
.envelope-sample{padding:9px 0 25px}.envelope-sample .envelope{width:100%;max-width:220px}.envelope-sample .wax{width:40px;height:40px;font-size:20px}.envelope-sample .envelope-name{font-size:17px;bottom:12px;left:14px;right:45px}.envelope-sample .envelope-stamp{width:28px;height:34px;font-size:16px;right:10px;bottom:9px}.envelope-sample .envelope-stamp small{font-size:3px}
.read-intro{margin-top:45px}.read-intro h1{margin:20px 0 16px}.read-intro>p{font-size:13px}.read-intro .envelope-stage{margin:5px auto 0;max-width:480px}.read-intro .intro-foot{font:22px Caveat;margin-top:15px}.opening-status{min-height:18px;font-size:11px!important;margin:14px 0 0}.opening-status:empty{display:none}.reader-actions{display:flex;justify-content:center;margin:0 auto 45px}.loading-letter{margin:90px auto;text-align:center;color:#91957d}
.experience-modal{width:min(730px,95vw);padding:35px 35px 25px}.experience-modal .read-intro{margin:15px 0 0}.experience-modal .read-intro h1{font-size:32px}.experience-modal .read-intro>p{font-size:12px}.experience-modal .envelope-stage{padding-top:65px;padding-bottom:26px}.experience-modal .envelope{max-width:290px}.experience-modal .dialog-preview{margin-top:15px}.experience-modal .reader-actions{margin-bottom:10px}.experience-modal .eyebrow{font-size:8px;letter-spacing:1.5px}.experience-modal .read-body{font-size:var(--letter-size)}
button:disabled{cursor:wait;opacity:.7}.seal-settings:disabled button{cursor:default}
.envelope.opening{animation:envelope-depart .45s 1.85s ease-in forwards}
.envelope.opening .wax{animation:wax-break .45s ease-in forwards}
.envelope.opening .env-flap{animation:flap-open .8s .3s ease-in-out forwards}
.envelope.opening .env-letter{animation:letter-rise 1s .95s cubic-bezier(.22,.68,.1,1) forwards}
.letter-revealed{animation:letter-arrive .65s cubic-bezier(.16,.8,.3,1) both}
@keyframes wax-break{0%{transform:translate(-50%,-50%) rotate(0);opacity:1}35%{transform:translate(-50%,-50%) rotate(-10deg) scale(1.08)}100%{transform:translate(-40%,20%) rotate(25deg) scale(.75);opacity:0}}
@keyframes flap-open{0%{transform:rotateX(0);z-index:5}45%{z-index:5}46%{z-index:1}100%{transform:rotateX(180deg);z-index:1;background-color:var(--lining)}}
@keyframes letter-rise{0%{transform:translateY(0);z-index:2}70%{transform:translateY(-72%);z-index:2}71%{z-index:7}100%{transform:translateY(-85%) rotate(-3deg);z-index:7}}
@keyframes envelope-depart{to{opacity:0;transform:translateY(32px) scale(.97)}}
@keyframes letter-arrive{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:721px){.toolbox{position:sticky;top:20px}.pattern-grid{gap:8px}.pattern-grid:has(>button:nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){#options{max-height:400px;gap:10px 20px;padding:19px 18px 7px}.option-section{margin-bottom:14px}.swatches{gap:11px}.swatch{width:26px;height:26px}.pattern{height:53px}.choice-row{gap:5px}.choice-row .font-choice{font-size:10px;padding:7px 3px;min-height:32px}.card-gallery,.postcard-intro,.card-notes,.seal-settings{grid-column:1/-1}.card-gallery{grid-template-columns:repeat(2,1fr);gap:12px;margin:0 0 12px}.card-choice img{height:auto;max-height:130px}.card-choice span{font-size:17px;min-height:25px;padding-top:6px}.envelope-sample{display:flex;align-items:center}.envelope-sample .envelope{width:100%;max-width:170px}.envelope-sample .wax{width:31px;height:31px;font-size:16px}.envelope-sample .envelope-name{font-size:13px}.envelope-sample .envelope-stamp{width:23px;height:27px;font-size:13px}.seal-settings{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}.seal-settings .swatches{max-width:155px}.seal-settings .pattern-grid{grid-template-columns:repeat(3,1fr)}.option-preview{grid-column:1/-1}.envelope-stage{padding-top:65px;padding-bottom:25px}.envelope{width:min(310px,90%)}.envelope .wax{width:49px;height:49px;font-size:23px}.envelope-name{font-size:20px}.experience-modal{padding:32px 20px 22px}.experience-modal .envelope{width:min(290px,90%)}.experience-modal .read-intro h1{font-size:29px}.experience-modal .read-intro>p{line-height:1.8}.experience-modal .eyebrow{font-size:7px;letter-spacing:1px}.experience-modal .envelope-stage{padding-top:60px}.attached{width:calc(50% - 6px)}.attached img{height:auto;aspect-ratio:3/2}.attachments{gap:12px}.border-inset:after,.border-double:after,.border-botanical:after{inset:9px}.read-body{overflow-wrap:anywhere}.reader-letter{padding:25px 24px 18px}.read-intro>p{font-size:12px}}
@media(max-width:420px){.header{gap:14px;padding:0 16px}.header .brand{font-size:22px;flex-shrink:0}.header .brand-icon{font-size:24px;margin-right:4px}.header nav{gap:13px;min-width:0}.header nav button{font-size:9px}.header nav button:last-child{max-width:82px;white-space:normal;font-size:9px;line-height:1.5}.header-note{display:none}.swatches{gap:11px}.option-label{letter-spacing:.8px}.pattern-grid{gap:5px}.pattern small{font-size:8px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.upload-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:116px;border:1px dashed #a1ad8a;background:#f1f0e5;color:#606c52;padding:12px;text-align:center}.upload-card i{font-size:28px;font-style:normal;font-weight:400;line-height:1}.upload-card strong{font-size:12px;font-weight:500}.upload-card small{font-size:10px;color:#7a826c}.upload-card:disabled{cursor:default;opacity:.65}.upload-help{line-height:1.7;margin:10px 0 16px}.uploaded-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 22px}.uploaded-thumb{position:relative;min-width:0;padding:5px;background:#faf7ee;border:1px solid #ddd9c8;border-radius:5px}.uploaded-thumb img{display:block;width:100%;height:78px;object-fit:cover;border-radius:2px}.uploaded-thumb>span{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 2px 2px}.uploaded-thumb button{position:absolute;right:8px;top:8px;border:0;border-radius:50%;width:24px;height:24px;background:#faf7ee;color:#655f50;cursor:pointer;box-shadow:0 1px 5px #0002}.note-label{overflow-wrap:anywhere}