@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,wght@0,400;0,500;1,400&family=Albert+Sans:wght@400;500;600&display=swap');
:root{--paper:#eeeee3;--ink:#303d31;--wine:#793345;--muted:#7d8271;--line:#c5c9b7;--serif:'Bodoni Moda',Didot,'Times New Roman',serif;--sans:'Albert Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px var(--sans);-webkit-font-smoothing:antialiased;transition:background .5s,color .5s}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #a76574;outline-offset:5px}button[hidden],[hidden]{display:none!important}header{max-width:1440px;margin:auto;padding:30px 6%;height:100px;display:flex;align-items:center;justify-content:space-between}.brand{font:italic 30px var(--serif);color:inherit;text-decoration:none;line-height:1}.brand span{display:block;font:10px var(--sans);font-style:normal;letter-spacing:1px;margin-top:8px;color:var(--muted)}#sound{font:11px var(--sans);border:0;border-bottom:1px solid var(--line);background:none;padding:8px 0}main{max-width:1440px;margin:auto}.page{display:none;opacity:1;transition:opacity .25s}.page.active{display:block;animation:page-in .65s ease both}.page.leaving{opacity:0;pointer-events:none;animation:none}h1,h2,p{margin-top:0}h1,h2{font-family:var(--serif);font-weight:400}em{font-weight:400;color:var(--wine)}.eyebrow{font:500 10px var(--sans);letter-spacing:2px;line-height:1.5;margin-bottom:30px}h1{font-size:clamp(60px,6.7vw,96px);line-height:1.03;letter-spacing:-3px;margin-bottom:30px}h2{font-size:70px;line-height:1.06;letter-spacing:-2px}.primary{background:var(--wine);color:#fff7ed;border:1px solid var(--wine);padding:15px 27px;border-radius:0;font-size:12px;letter-spacing:.4px;transition:background .3s,transform .3s}.primary:hover{background:#5d2637;transform:translateY(-2px)}.text-button{background:none;border:0;border-bottom:1px solid currentColor;padding:7px 0;font-size:11px}.text-button:hover{color:#a06373}.back-link{color:var(--muted);font-size:10px}.progress{font-size:10px;color:var(--muted);margin:0}.atmosphere,.living-label{display:none!important}
/* Invitation */
#invitation{padding:30px 6% 90px;min-height:750px}#invitation.active{display:grid;grid-template-columns:43% 57%;align-items:center}.invitation-heading{padding:0 0 0 3%}.envelope-instruction{font-size:14px;line-height:1.9;color:#7a806f;max-width:300px}.sender-line{display:block;font:italic 22px var(--serif);margin-top:45px;color:#718067}.envelope-work{text-align:center;padding-left:20px}.envelope-stage{height:410px;width:min(100%,510px);margin:0 auto;display:flex;align-items:end;perspective:1200px;transition:height 1.2s cubic-bezier(.2,.7,.2,1)}.envelope-stage:has(.opened){height:555px}.envelope{position:relative;isolation:isolate;width:100%;height:285px;filter:drop-shadow(0 18px 15px #55473018)}.envelope-back{position:absolute;inset:0;background:#cbbb9e;border-radius:3px;z-index:0}.envelope-front{position:absolute;inset:0;background:#eee0c9;clip-path:polygon(0 0,50% 58%,100% 0,100% 100%,0 100%);z-index:3;pointer-events:none}.envelope-front:before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,#dfcdb0,#f3e7d2);clip-path:polygon(0 0,50% 58%,0 100%)}.envelope-front:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#e5d2b3,#f5ead6);clip-path:polygon(0 100%,50% 49%,100% 100%)}.envelope-flap{position:absolute;inset:0;z-index:5;background:linear-gradient(170deg,#f9f0df,#e5d0ae);clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:50% 0;transition:transform 1s cubic-bezier(.4,0,.2,1)}.opened .envelope-flap{transform:rotateX(180deg);z-index:1}.invitation-card{position:absolute;bottom:7px;left:6%;width:88%;height:290px;background:#fffaf0;border:1px solid #e9e0cc;z-index:2;padding:20px;display:flex;align-items:center;gap:20px;visibility:hidden;transform:translateY(0);transition:transform 1.2s .55s cubic-bezier(.2,.7,.2,1)}.opened .invitation-card{visibility:visible;transform:translateY(-205px) rotate(-2deg);box-shadow:0 8px 18px #745d4415}.mini-photo{height:195px;width:41%;flex:none;border:5px solid #fff;box-shadow:0 2px 6px #4b42321a;rotate:-3deg;overflow:hidden;background:#dfe3d0}.mini-photo img{display:none;object-fit:cover;width:100%;height:100%}#photoPlaceholder{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;background:linear-gradient(145deg,#e6e7d6,#c5d0b6)}.intro-sprig{font:90px Georgia,serif;color:#82966d;rotate:-20deg}#photoPlaceholder span{font:italic 14px var(--serif);color:#7c8d6d;text-align:center}.card-message{text-align:left}.handwritten{font:italic 24px var(--serif);color:var(--wine);line-height:1.2;margin-bottom:20px}.card-message>p:not(.handwritten){font:11px/1.9 var(--sans);color:#898371}.card-message .card-signature{font:italic 20px var(--serif)!important;margin-bottom:0}.wax-seal{position:absolute;left:50%;top:55%;translate:-50% -50%;z-index:6;width:64px;height:64px;border:3px solid #a96271;border-radius:46% 50% 44% 49%;background:radial-gradient(ellipse at 30% 20%,#bd7b83,#873f50 70%,#6c2c3e);box-shadow:inset 2px 2px 3px #edb5b880,inset -2px -3px 4px #53213250,0 4px 6px #63344425;transition:opacity .35s,transform .35s}.wax-seal span{display:grid;place-items:center;width:43px;height:43px;border:1px solid #dfb5b56e;border-radius:50%;font:italic 30px var(--serif);color:#f7e8db;line-height:1}.wax-seal:hover{transform:rotate(-8deg) scale(1.05)}.opened .wax-seal{opacity:0;pointer-events:none}.envelope-address{position:absolute;left:0;right:0;bottom:27px;text-align:center;font:italic 21px var(--serif);color:#aa9070;z-index:4;pointer-events:none}.envelope-actions{margin-top:30px;min-height:75px}.envelope-tap{font-size:11px;letter-spacing:1px;color:#9b927d}.envelope-music{font-size:9px;color:var(--muted);margin:14px 0 0}
/* Garden */
#garden{padding:30px 6% 80px;min-height:760px}#garden.active{display:grid;grid-template-columns:36% 64%;grid-template-rows:auto auto;column-gap:0;align-items:center}.garden-heading{grid-column:1;grid-row:1;padding:40px 0 0 10px;align-self:center}.garden-heading .eyebrow{margin-bottom:25px}.garden-heading h2{font-size:clamp(54px,5.6vw,78px);margin-bottom:25px}.garden-heading>p:last-child{font:13px/1.9 var(--sans);color:var(--muted)}.bouquet{grid-column:2;grid-row:1/3;position:relative;isolation:isolate;aspect-ratio:600/620;width:100%;max-width:850px;overflow:visible}.bouquet-back,.bouquet-front,.bouquet-ribbon{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.bouquet-back{z-index:0}.bouquet-front{z-index:4}.bouquet-ribbon{z-index:5}.living-flower{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;pointer-events:none;transform-origin:50% 85%;will-change:transform;backface-visibility:hidden;z-index:1}.living-svg{display:block;width:100%;height:100%;pointer-events:none;overflow:visible;backface-visibility:hidden;transform:translateZ(0);shape-rendering:geometricPrecision}.flower-head{pointer-events:all;cursor:pointer}.living-flower:focus-visible{outline:0}.living-flower:focus-visible .flower-head{opacity:.8}.garden-actions{grid-column:1;grid-row:2;padding:0 20px 25px 10px;align-self:start}.garden-arriving .living-svg,.garden-arriving .bouquet-back,.garden-arriving .bouquet-front,.garden-arriving .bouquet-ribbon{animation:paper-in 1.6s ease both}
/* Burgundy letter */
body[data-scene="letter"]{background:#6f2c3d;color:#f6eadc;--line:#af7b8066}body[data-scene="letter"] .brand span{color:#c99b9c}body[data-scene="letter"] #sound{color:#ead8cd}#letter{padding:22px 8% 70px;min-height:calc(100vh - 100px)}.letter-topline{display:flex;justify-content:space-between;border-top:1px solid #ac727b66;padding-top:19px;font-size:9px;letter-spacing:1.8px;color:#cda4a3}.letter-paper{max-width:660px;margin:65px auto 70px}.letter-paper .eyebrow{color:#cda4a3;letter-spacing:1.7px;font-size:9px}.letter-paper h2{font-size:clamp(57px,5.7vw,78px);line-height:1.06;margin-bottom:48px;color:#f7eadb}.letter-paper h2 em{color:#d5a3a6}.salutation{font:italic 28px var(--serif);margin-bottom:26px}#letterText p{font:16px/1.95 var(--sans);font-weight:400;color:#e2c9c0;margin-bottom:24px}.signature{margin-top:42px;display:flex;flex-direction:column;gap:12px;font-size:12px;color:#cda4a3}.signature strong{font:italic 44px var(--serif);color:#f7eadb}.letter-close{max-width:860px;margin:auto;border-top:1px solid #ac727b66;padding-top:25px;display:flex;align-items:center;justify-content:space-between;gap:24px;color:#cda4a3}.letter-close>span{font:italic 18px var(--serif)}.letter-close .text-button{color:#f1dcd1;flex:none}
/* Flower notes */
dialog{width:min(460px,90vw);max-height:90vh;overflow:auto;padding:35px 40px;background:#fbf6ec;color:var(--ink);border:0;box-shadow:0 25px 90px #29302538}dialog[open]{animation:note-in .4s ease both}dialog::backdrop{background:#293c3277;backdrop-filter:blur(3px)}.close{position:absolute;top:10px;right:15px;background:none;border:0;font-size:27px;font-weight:400;padding:4px 8px}.note-flower{width:160px;height:155px;margin:0 auto 10px;overflow:visible}.note-botanical{width:100%;height:100%}.note-botanical .living-svg{position:static!important;inset:auto;width:100%;height:100%}.note-botanical .stem-and-leaves{display:none}.note-botanical .flower-head{pointer-events:none}dialog>.eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:5px}dialog h2{font-size:47px;text-align:center;margin:0 0 8px;letter-spacing:-1px}.meaning{font:italic 22px/1.4 var(--serif);text-align:center;color:var(--wine);margin-bottom:22px}#noteText{font:14px/1.9 var(--sans);color:#7b7f70;margin-bottom:25px}dialog>.text-button{color:var(--wine);font-size:11px}@keyframes page-in{from{opacity:0}to{opacity:1}}@keyframes paper-in{from{opacity:0}to{opacity:1}}@keyframes note-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px) and (min-width:761px){#invitation.active{grid-template-columns:42% 58%}h1{font-size:69px}.envelope{height:250px}.invitation-card{height:270px;padding:15px;gap:13px}.mini-photo{height:170px}.card-message .handwritten{font-size:21px}.envelope-address{font-size:18px}.envelope-work{padding-left:10px}.garden-heading h2{font-size:58px}.flower-name-button{font-size:10px}}
@media(max-width:760px){header{height:85px;padding:23px 6%}.brand{font-size:26px}.brand span{font-size:9px;margin-top:7px}#sound{font-size:10px}#invitation{padding:25px 6% 55px;min-height:0}#invitation.active{display:flex;flex-direction:column;align-items:stretch}.invitation-heading{padding:0 2%}.eyebrow{font-size:9px;margin-bottom:22px}h1{font-size:64px;letter-spacing:-2px;line-height:1.02;margin-bottom:23px}.invitation-heading h1 br:nth-of-type(2){display:none}.envelope-instruction{font-size:12px;line-height:1.8;margin-bottom:0}.sender-line{font-size:19px;margin-top:22px}.envelope-work{padding:0}.envelope-stage{width:94%;height:300px;margin-top:12px}.envelope-stage:has(.opened){height:465px}.envelope{height:225px}.invitation-card{height:255px;left:5%;width:90%;padding:13px;gap:12px}.opened .invitation-card{transform:translateY(-165px) rotate(-2deg)}.mini-photo{height:165px;border-width:4px}.intro-sprig{font-size:75px}#photoPlaceholder span{font-size:11px}.card-message .handwritten{font-size:21px;margin-bottom:12px}.card-message>p:not(.handwritten){font-size:9px;line-height:1.9}.card-message .card-signature{font-size:18px!important}.wax-seal{height:55px;width:55px}.wax-seal span{width:37px;height:37px;font-size:26px}.envelope-address{font-size:17px;bottom:23px}.envelope-actions{margin-top:23px;min-height:70px}.envelope-tap{font-size:10px}.envelope-music{font-size:8px}#garden{padding:24px 6% 55px;min-height:0}#garden.active{display:flex;flex-direction:column;align-items:stretch}.garden-heading{padding:0 2%;margin-bottom:0}.garden-heading .eyebrow{margin-bottom:16px}.garden-heading h2{font-size:58px;line-height:1.02;margin-bottom:17px;letter-spacing:-1.5px}.garden-heading>p:last-child{font-size:12px;line-height:1.7;margin-bottom:0}.bouquet{width:116%;margin:-15px -8% -5px;max-width:none}.garden-actions{padding:0 2%}.collection-caption{font-size:9px;margin-bottom:8px}.flower-name-button{font-size:12px;padding:13px 0}.garden-action-row{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 20px}.garden-action-row .primary{min-width:0;padding:13px 19px;font-size:11px}.progress{font-size:9px}.back-link{font-size:10px}#letter{padding:16px 7% 45px;min-height:calc(100vh - 85px)}.letter-topline{font-size:7px;letter-spacing:1px;padding-top:16px}.letter-paper{margin:47px auto 45px}.letter-paper .eyebrow{font-size:8px;margin-bottom:22px}.letter-paper h2{font-size:52px;letter-spacing:-1.5px;margin-bottom:35px}.salutation{font-size:25px;margin-bottom:20px}#letterText p{font-size:14px;line-height:1.9;margin-bottom:22px}.signature{margin-top:30px}.signature strong{font-size:40px}.letter-close{align-items:start;flex-direction:column;gap:22px;padding-top:22px}.letter-close>span{font-size:17px}.letter-close .text-button{font-size:11px}dialog{padding:30px 27px}dialog h2{font-size:43px}.meaning{font-size:21px}#noteText{font-size:13px}.note-flower{height:140px;width:150px}}
@media(max-width:380px){h1{font-size:56px}.envelope{height:200px}.envelope-stage{height:275px}.envelope-stage:has(.opened){height:440px}.invitation-card{height:235px;padding:10px;gap:10px}.mini-photo{height:150px}.card-message>p:not(.handwritten){font-size:8px}.card-message .handwritten{font-size:19px}.envelope-address{font-size:15px}.garden-heading h2{font-size:51px}.letter-paper h2{font-size:46px}.garden-action-row .primary{padding:12px 15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.living-flower{transform:none!important;will-change:auto}.envelope-stage{transition:none}.page.active{animation:none}.primary:hover{transform:none}}

@media(max-width:760px){.invitation-heading h1{font-size:58px}.invitation-heading h1 br:nth-of-type(2){display:initial}}@media(max-width:380px){.invitation-heading h1{font-size:51px}}

/* Paper tags, with fine threads that point to each flower. */
#garden.active{grid-template-rows:1fr auto}.bouquet{grid-row:1;grid-column:2}.garden-heading{grid-row:1;align-self:center}.flower-name-layer{position:absolute;inset:0;z-index:8;pointer-events:none}.tag-threads{position:absolute;inset:0;width:100%;height:100%;z-index:7;pointer-events:none;overflow:visible}.tag-threads path{fill:none;stroke:#8d7e68;stroke-width:.85;stroke-linecap:round;stroke-linejoin:round}.flower-name-button{position:absolute;translate:-50% -50%;rotate:var(--tag-angle);pointer-events:auto;width:auto!important;min-height:35px;min-width:65px;background:#fff8e9;color:#65494c;border:0;border-bottom:1px solid #d2c1a3;padding:10px 15px 9px;text-align:center;font:italic 17px var(--serif);white-space:nowrap;line-height:1.2;box-shadow:1px 3px 7px #4f40251c;transition:rotate .6s cubic-bezier(.2,.7,.2,1),transform .5s,box-shadow .5s,background .4s;transform:translateZ(0)}.flower-name-button:before{content:'';position:absolute;top:-6px;left:32%;width:34%;height:12px;background:#d8c6a780;rotate:-4deg;pointer-events:none}.flower-name-button:after{content:'';position:absolute;inset:2px;border:1px solid #d3c4ac33;pointer-events:none}.flower-name-button:hover,.flower-name-button:focus-visible{rotate:0deg;transform:translateY(-3px);background:#fffcf2;box-shadow:2px 6px 12px #4f402529;color:#793345}.flower-name-button.read{border-bottom-color:#a76574}.flower-name-button.read:after{content:''}.garden-arriving .flower-name-button{animation:tag-arrive .9s var(--tag-delay) both}.garden-arriving .tag-threads{animation:thread-arrive 1.1s .3s both}.garden-actions{grid-column:1/-1;grid-row:2;width:100%;max-width:1040px;margin:5px auto 0;padding:15px 0 0;align-self:auto}.garden-actions>.progress{text-align:center;margin:0 0 23px}dialog{padding-top:32px;border-radius:2px 2px 5px 2px;transform-origin:50% 65%}dialog[open]{animation:note-unfold .55s cubic-bezier(.16,1,.3,1) both}dialog[open]::backdrop{animation:backdrop-in .35s ease both}dialog .note-flower{margin-top:0}dialog[open] h2{animation:note-copy .65s .08s both}dialog[open] .meaning{animation:note-copy .65s .14s both}dialog[open] #noteText{animation:note-copy .65s .2s both}dialog.closing{animation:note-fold .19s ease both}dialog.closing::backdrop{animation:backdrop-out .19s ease both}dialog>.text-button{font:italic 19px var(--serif);margin-top:1px;color:#793345;transition:color .3s,border-color .3s}dialog>.text-button:hover{color:#ac6979;border-color:#ac6979}
@keyframes tag-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes thread-arrive{from{opacity:0}to{opacity:1}}@keyframes note-unfold{from{opacity:0;transform:translateY(18px) rotate(-1deg) scale(.97)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}@keyframes note-fold{to{opacity:0;transform:translateY(10px) scale(.985)}}@keyframes note-copy{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}
@media(max-width:1000px) and (min-width:761px){.flower-name-button{font-size:15px;padding:9px 13px}.garden-actions{padding:15px 0 0}}
@media(max-width:760px){.bouquet{width:112%;margin:10px -6% 5px}.flower-name-button{font-size:14px;padding:8px 10px;min-width:52px;min-height:33px}.tag-threads path{stroke-width:1}.garden-actions{padding:6px 2% 0;margin:0}.garden-actions>.progress{font-size:10px;margin-bottom:22px}.garden-navigation{flex-direction:column;align-items:stretch;gap:22px;padding-top:21px}.garden-navigation .letter-button{order:0;width:100%;min-width:0;font-size:23px;padding:17px 22px}.garden-navigation .back-link{order:1;align-self:center;font-size:18px}.garden-actions .progress{letter-spacing:.3px}dialog{padding-top:25px}dialog>.text-button{font-size:18px}}
@media(max-width:380px){.flower-name-button{font-size:12px;padding:8px 9px;min-height:31px}.garden-navigation .letter-button{font-size:21px}}
@media(prefers-reduced-motion:reduce){.flower-name-button,.tag-threads,dialog,dialog::backdrop,dialog h2,dialog .meaning,dialog #noteText{animation:none!important;transition:none!important}.flower-name-button:hover{transform:none}.garden-navigation .letter-button:hover{transform:none}}

/* Two pieces of correspondence at the end of the garden. */
.garden-actions{max-width:660px;padding-top:10px;margin-top:4px}.garden-actions>.progress{margin-bottom:25px}.garden-navigation{display:grid;grid-template-columns:1fr 1.12fr;align-items:center;gap:24px;padding:0 8px;border:0}.mail-button{position:relative;display:flex;flex-direction:column;align-items:start;justify-content:center;text-align:left;min-height:150px;padding:22px 25px;border:0;box-shadow:1px 5px 10px #45362712;transition:transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .55s,background .4s;isolation:isolate}.mail-caption{font:500 8px/1.4 var(--sans);letter-spacing:1.4px;margin-bottom:15px}.mail-title{font:italic 28px/1.12 var(--serif);letter-spacing:-.4px}.invitation-link{background:#faf4e5;color:#7a7261;transform:rotate(-2deg);margin:12px 0}.invitation-link:before{content:'';position:absolute;top:0;right:0;width:21px;height:21px;background:linear-gradient(45deg,#ded1b9 49.5%,var(--paper) 50%);box-shadow:-1px 1px 2px #79654b0d}.invitation-link:after{content:'';position:absolute;inset:6px;border:1px solid #d6c9b344;z-index:-1;pointer-events:none}.invitation-link .mail-caption{color:#a0947f}.mail-drawing{position:absolute;right:20px;bottom:21px;width:27px;height:23px;fill:none;stroke:#b3a183;stroke-width:.9;opacity:.7;transition:rotate .5s,translate .5s}.letter-link{background:#783646;color:#f9eddf;transform:rotate(1.5deg);min-height:165px;padding:24px 28px}.letter-link:before{content:'';position:absolute;inset:7px;border:1px solid #d1a5a344;z-index:-1;pointer-events:none}.letter-link:after{content:'';position:absolute;left:50%;bottom:-5px;width:32%;height:10px;background:#5c27331a;filter:blur(5px);z-index:-2}.letter-link .mail-caption{color:#c9a0a0}.mail-monogram{position:absolute;right:24px;bottom:23px;display:grid;place-items:center;width:31px;height:31px;border:1px solid #c08b9880;border-radius:48%;font:italic 22px var(--serif);color:#d9b5b0;rotate:-7deg;transition:rotate .5s,scale .5s}.mail-button:hover,.mail-button:focus-visible{transform:rotate(0deg) translateY(-5px);box-shadow:1px 10px 17px #45362720}.invitation-link:hover{background:#fff9ee}.letter-link:hover{background:#692c3c}.invitation-link:hover .mail-drawing{rotate:-5deg;translate:0 -2px}.letter-link:hover .mail-monogram{rotate:4deg;scale:1.06}.mail-button:active{transform:rotate(0deg) translateY(-1px);box-shadow:1px 3px 6px #4536271a}
@media(max-width:760px){.garden-actions{padding:6px 0 0;margin:0}.garden-actions>.progress{margin-bottom:25px}.garden-navigation{grid-template-columns:.95fr 1.05fr;gap:14px;padding:0 3px}.mail-button{min-width:0;min-height:135px;padding:20px 17px}.letter-link{min-height:150px;padding:22px 19px}.mail-caption{font-size:6.5px;letter-spacing:.8px;margin-bottom:13px}.mail-title{font-size:22px;line-height:1.15}.mail-drawing{right:14px;bottom:13px;width:20px;height:17px;opacity:.5}.mail-monogram{right:15px;bottom:17px;width:25px;height:25px;font-size:18px}.letter-link .mail-title{padding-right:15px}.letter-link:before{inset:5px}}
@media(max-width:380px){.garden-navigation{gap:12px}.mail-button{padding:19px 13px}.letter-link{padding:20px 15px}.mail-title{font-size:20px}.mail-caption{font-size:6px;letter-spacing:.65px}.mail-monogram{right:10px;bottom:15px;width:22px;height:22px;font-size:17px}}
@media(prefers-reduced-motion:reduce){.mail-button,.mail-drawing,.mail-monogram{transition:none!important}.mail-button:hover{transform:none}.letter-link:after{filter:none}}

/* Letter opens directly with its title and body. */
.letter-paper{margin-top:32px}.letter-paper h2{margin-bottom:36px}@media(max-width:760px){.letter-paper{margin-top:24px}.letter-paper h2{margin-bottom:28px}}

/* Quiet falling blooms, taken from the same five bouquet assets. */
header{justify-content:flex-end;position:relative;z-index:1}main{position:relative;z-index:1}.letter-flower-background{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;display:none;mask-image:linear-gradient(90deg,#000,#0006 34%,#0006 66%,#000)}body[data-scene="letter"] .letter-flower-background{display:block}.falling-blossom{position:absolute;top:-100px;left:var(--left);width:var(--size);height:var(--size);opacity:0;will-change:transform;animation:letter-flower-fall var(--duration) var(--delay) linear infinite;animation-play-state:paused}.falling-blossom img{width:100%;height:100%;display:block;opacity:.13;user-select:none;pointer-events:none;animation:letter-flower-sway 7s var(--delay) ease-in-out infinite;animation-play-state:paused}body[data-scene="letter"] .falling-blossom,body[data-scene="letter"] .falling-blossom img{animation-play-state:running}body[data-scene="letter"] .letter-flower-background.is-paused .falling-blossom,body[data-scene="letter"] .letter-flower-background.is-paused .falling-blossom img{animation-play-state:paused}body[data-scene="letter"] header{height:76px;padding-top:22px;padding-bottom:22px}body[data-scene="letter"] #letter{min-height:calc(100vh - 76px)}
@keyframes letter-flower-fall{0%{transform:translate3d(0,-20px,0) rotate(0deg);opacity:0}8%{opacity:1}90%{opacity:1}100%{transform:translate3d(var(--drift),calc(100vh + 210px),0) rotate(var(--turn));opacity:0}}@keyframes letter-flower-sway{0%,100%{transform:translateX(-7px) rotate(-6deg)}50%{transform:translateX(7px) rotate(6deg)}}
@media(max-width:760px){body[data-scene="letter"] header{height:64px;padding-top:18px;padding-bottom:18px}body[data-scene="letter"] #letter{min-height:calc(100vh - 64px)}.falling-blossom{width:calc(var(--size)*.8);height:calc(var(--size)*.8)}.falling-blossom:nth-child(n+9){display:none}.falling-blossom img{opacity:.12}}
@media(prefers-reduced-motion:reduce){.letter-flower-background{display:none!important}.falling-blossom,.falling-blossom img{animation:none!important;will-change:auto}}