:root{--paper:#f8f3eb;--ink:#393b31;--muted:#828075;--rose:#ae4759;--rose-dark:#963b4d;--line:#dedbcf;--serif:'Playfair Display',Georgia,serif;--sans:'Be Vietnam Pro',Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--rose);outline-offset:6px}button{color:inherit}a{color:inherit;text-decoration:none}[hidden]{display:none!important}::selection{background:#eac0c5}.page-grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.16;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='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23898072' filter='url(%23n)' opacity='.3' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.site-header,.site-footer{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between}.site-header{height:110px;padding:0 6.2%;gap:24px}.wordmark{font-family:var(--serif);font-size:29px;letter-spacing:-1.3px;display:flex;align-items:center;gap:10px}.brand-flower{color:var(--rose);font-size:36px;font-family:Georgia}.wordmark-dot{color:var(--rose);margin-left:-9px}.header-occasion{font-size:10px;letter-spacing:2.9px;padding-left:45px;color:#777a68}.sound-button{border:1px solid #dcd8cb;border-radius:30px;background:transparent;padding:11px 15px;display:flex;gap:10px;align-items:center;font-size:10px}.sound-bars{display:flex;gap:3px;align-items:center;height:14px}.sound-bars i{display:block;width:2px;height:6px;background:#7d846b}.sound-bars i:nth-child(2){height:13px}.sound-bars i:nth-child(3){height:9px}.sound-bars i:nth-child(4){height:5px}.sound-button[aria-pressed=true] i{animation:sound 900ms ease-in-out infinite alternate}.sound-button[aria-pressed=true] i:nth-child(2){animation-delay:-.5s}.sound-button[aria-pressed=true] i:nth-child(3){animation-delay:-.2s}.hero{max-width:1280px;margin:auto;min-height:675px;padding:42px 3% 30px;display:grid;grid-template-columns:1fr 1fr;align-items:center}.hero-copy{padding:0 0 24px 5%}.occasion{display:flex;align-items:center;gap:13px;font-size:9px;letter-spacing:2.3px;color:#878777;margin-bottom:25px}.small-line{height:1px;width:33px;background:#9caa8a}h1{font-family:var(--serif);font-size:clamp(65px,6.4vw,88px);line-height:1.13;letter-spacing:-3.5px;font-weight:400;margin:0}h1 em{color:var(--rose);font-weight:400}h1 .title-dot{color:var(--rose)}.hero-description{color:#7a7a6e;font-size:12px;line-height:2.1;margin:27px 0 29px}.primary-button{border:0;background:var(--rose);color:#fffaf4;display:inline-flex;align-items:center;justify-content:center;gap:30px;font-size:11px;line-height:1.6;padding:18px 25px;border-radius:4px;box-shadow:0 8px 20px #953c4b12;transition:background .2s,transform .2s,box-shadow .2s}.primary-button:hover{background:var(--rose-dark);transform:translateY(-2px);box-shadow:0 9px 24px #953c4b25}.primary-button svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.4}.hero-footnote{margin-top:19px;font-size:9px;color:#929184;display:flex;align-items:center;gap:5px;flex-wrap:wrap}.hero-footnote>span:first-child{font-size:18px;margin-right:3px;color:#a36c71}.hero-art{position:relative;min-width:0;height:610px;display:flex;align-items:center;justify-content:center}.art-circle{position:absolute;width:470px;height:470px;border-radius:50%;background:radial-gradient(ellipse at 45% 35%,#efd8cb 0%,#f0e1d2 55%,#f0e7db 100%);top:55px;left:50%;transform:translateX(-50%)}.art-circle:after{content:'';position:absolute;inset:-14px;border:1px solid #e5dfd2;border-radius:50%}.date-badge{position:absolute;z-index:2;right:15px;top:9px;border:1px solid #b7bb9e;background:#f8f3eb;transform:rotate(9deg);border-radius:70px 70px 7px 7px;width:114px;min-height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 5px 9px #64684c06}.date-badge span{font-size:6px;letter-spacing:1.5px}.date-badge strong{font-family:var(--serif);font-weight:400;font-size:65px;line-height:1.15;color:#7c8865}.date-badge span:last-child{font-size:5px;letter-spacing:1px}.bouquet svg{width:100%;height:100%;overflow:visible}.hero-bouquet{position:relative;z-index:1;width:490px;height:535px;transform:rotate(-7deg);animation:arrive 1.3s ease both}.art-spark{position:absolute;color:#a29e6a;z-index:2}.spark-one{left:6px;top:130px;font-size:34px}.spark-two{right:15px;bottom:125px;font-size:21px}.floating-note{position:absolute;z-index:3;right:-5px;bottom:119px;padding:14px 19px;background:#fffcf4;box-shadow:0 7px 20px #766b4d0b;transform:rotate(-8deg);font:italic 17px var(--serif);color:#8d6c62;border:1px solid #eae1d3}.floating-note span{font-style:normal;color:var(--rose);margin-right:7px}.art-caption{position:absolute;bottom:13px;font-size:8px;letter-spacing:2.3px;color:#969482}.gentle-note{border-top:1px solid var(--line);border-bottom:1px solid var(--line);max-width:1110px;margin:16px auto 0;display:flex;justify-content:center;align-items:center;gap:35px;padding:23px 20px}.gentle-note p{margin:0;font-family:var(--serif);font-size:20px;color:#6b6e58;font-weight:400}.gentle-note em{color:#a35c66}.note-flower{color:#a8ac8d;font:28px Georgia}.site-footer{max-width:1110px;padding:25px 0 27px;font-size:9px;color:#999689;gap:20px}.footer-heart{color:var(--rose);font-size:13px}.text-button{background:none;border:0;padding:5px 0;font-size:10px;color:#7f806f}.text-button:hover{color:var(--rose)}.text-button span{margin-left:8px}.petals{position:fixed;inset:0;pointer-events:none;z-index:25;overflow:hidden}.petal{position:absolute;top:-40px;background:#d8a0aa;border-radius:75% 5% 70% 15%;animation:petal-fall var(--duration) linear forwards;opacity:0}.petal:nth-child(3n){background:#e8c1b6}.petal:nth-child(4n){background:#acb295}.gift-dialog,.custom-dialog{border:1px solid #e0d7c9;background:#fbf7ef;color:var(--ink);padding:0;max-height:calc(100dvh - 40px);width:min(580px,calc(100% - 32px));border-radius:10px;box-shadow:0 35px 130px #352d2838;overflow-x:hidden;overscroll-behavior:contain}.gift-dialog::backdrop,.custom-dialog::backdrop{background:#33332969;backdrop-filter:blur(7px)}body:has(dialog[open]){overflow:hidden}.close-button{position:absolute;top:14px;right:17px;border:0;background:#eae4d85c;width:31px;height:31px;font:24px/1 Georgia;border-radius:50%;z-index:10;color:#85816f}.close-button:hover{background:#e8dace}.gift-step{padding:47px 44px;text-align:center;animation:step-in .5s ease both}.eyebrow{font-size:8px;letter-spacing:2px;color:#92927c;line-height:1.8;margin:0 0 15px}h2{font:400 36px/1.35 var(--serif);letter-spacing:-1px;margin:0}h2 em{color:var(--rose);font-weight:400}.envelope-step{min-height:490px}.envelope{width:300px;height:194px;max-width:100%;position:relative;margin:55px auto 0;border:0;background:transparent;perspective:900px;display:block;isolation:isolate;filter:drop-shadow(0 12px 12px #68503d18)}.envelope-back{position:absolute;inset:0;background:#e4c6b5;border-radius:4px;z-index:1}.envelope-front{position:absolute;inset:0;background:#ead5c3;clip-path:polygon(0 0,50% 58%,100% 0,100% 100%,0 100%);z-index:4;border-radius:4px}.envelope-front:after{content:'';position:absolute;inset:0;background:#f0dfcc;clip-path:polygon(0 100%,50% 45%,100% 100%)}.envelope-flap{position:absolute;inset:0;background:#f1dfce;clip-path:polygon(0 0,100% 0,50% 60%);z-index:5;transform-origin:top;transition:transform .7s ease,z-index 0s .35s}.envelope-seal{position:absolute;top:83px;left:calc(50% - 21px);width:42px;height:42px;background:#ad5465;color:#f7e7dc;border-radius:50%;z-index:6;font:26px/42px Georgia;box-shadow:inset 0 0 0 4px #b86170,inset 0 0 0 5px #9d495a;transition:opacity .25s}.envelope-letter{position:absolute;inset:14px 17px 7px;background:#fffaf1;z-index:2;display:flex;align-items:center;justify-content:center;padding:25px;font:italic 20px/1.6 var(--serif);color:#9c6870;transition:transform .6s .35s;box-shadow:0 0 5px #75563f0a}.envelope:hover{transform:translateY(-3px)}.envelope.is-open .envelope-flap{transform:rotateX(180deg);z-index:0}.envelope.is-open .envelope-seal{opacity:0}.envelope.is-open .envelope-letter{transform:translateY(-64px)}.envelope-hint{font-size:10px;color:#99917e;margin-top:31px}.envelope-hint span{margin-left:9px}.letter-step{text-align:left;padding:40px 45px}.letter-topline{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5dfd2;padding-bottom:15px;margin:0 0 27px;color:#94977d;font-size:8px;letter-spacing:2px}.letter-topline span:nth-child(2){color:var(--rose);font-size:24px}.letter-step .eyebrow{font-size:7px;letter-spacing:1.7px}.letter-step h2{color:var(--rose);font-size:38px;margin-bottom:22px;overflow-wrap:anywhere}.letter-message p{font-size:12px;color:#777565;line-height:2;white-space:pre-line;margin:0 0 17px;overflow-wrap:anywhere}.signature{display:flex;flex-direction:column;margin:25px 0 30px;gap:7px}.signature span{font-size:10px;color:#96907d}.signature strong{font:italic 19px/1.6 var(--serif);font-weight:400;color:#a2616b;overflow-wrap:anywhere}.letter-step .primary-button{font-size:10px;width:100%;gap:12px}.flowers-step{padding-top:42px;padding-bottom:30px}.flowers-step h2{font-size:37px}.gift-bouquet{height:310px;width:285px;margin:2px auto -7px;animation:bloom 1.1s ease both}.flower-wish{font-size:11px;color:#888373;line-height:2;margin:3px 0 17px;overflow-wrap:anywhere}.custom-dialog{padding:42px;width:min(530px,calc(100% - 32px))}.custom-dialog h2{font-size:31px}.custom-intro{font-size:11px;line-height:1.9;color:#8d8879;margin:16px 0 23px}label{display:block;font-size:10px;color:#797562;margin-bottom:16px}input,textarea{display:block;width:100%;border:1px solid #dcd5c7;background:#fffdf7;padding:12px;border-radius:4px;margin-top:8px;color:#555847;font-size:12px;line-height:1.8}textarea{resize:vertical}input:focus,textarea:focus{outline:2px solid #b6748055;border-color:#b67480}.custom-dialog .primary-button{width:100%;font-size:10px;gap:18px}.share-result{margin-top:20px;border-top:1px solid var(--line);padding-top:20px}.share-result label{margin-bottom:9px}.share-result input{font-size:10px}.copy-button{border:1px solid #b7bba5;padding:9px 18px;background:#e8ebdf;border-radius:4px;font-size:10px}.share-result p{font-size:10px;line-height:1.8;color:#7b806a;margin-bottom:0}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#4a4e3f;color:#fff9ed;padding:13px 22px;border-radius:6px;z-index:40;font-size:11px;max-width:calc(100% - 32px);width:max-content;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}.toast.visible{opacity:1;transform:translate(-50%,0)}
main{overflow-x:clip}.hero-footnote #hero-recipient{max-width:100%;overflow-wrap:anywhere}.primary-button:disabled{cursor:wait;opacity:.65;transform:none}.form-status{font-size:10px;line-height:1.8;color:var(--rose);margin:12px 0 0}.form-status:empty{display:none}
@keyframes sound{to{height:3px}}@keyframes arrive{from{opacity:0;transform:translateY(25px) rotate(-10deg)}to{opacity:1;transform:translateY(0) rotate(-7deg)}}@keyframes step-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes bloom{from{opacity:0;transform:translateY(25px) scale(.87)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes petal-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}10%{opacity:.75}85%{opacity:.7}100%{opacity:0;transform:translate3d(var(--drift),110vh,0) rotate(var(--rotation))}}
@media(min-width:1500px){.hero{min-height:720px;padding-top:55px}.hero-art{height:640px}.hero-copy{padding-left:4%}.hero-bouquet{width:520px;height:568px}.art-circle{width:500px;height:500px}.gentle-note{margin-top:25px}}
@media(max-width:1100px){.site-header{height:90px;padding:0 5%}.hero{padding:35px 5% 20px;min-height:610px;grid-template-columns:1fr 1fr}.hero-copy{padding-left:0}h1{font-size:68px}.hero-art{height:550px}.hero-bouquet{width:410px;height:470px}.art-circle{width:365px;height:365px;top:84px}.date-badge{right:-6px;top:28px;width:94px;min-height:125px}.date-badge strong{font-size:53px}.date-badge span{font-size:5px}.date-badge span:last-child{font-size:4px}.floating-note{right:-10px;font-size:14px;bottom:100px;padding:12px}.spark-one{left:0;top:110px}.art-caption{font-size:6px;letter-spacing:1.8px;bottom:25px}.gentle-note,.site-footer{margin-left:5%;margin-right:5%}.occasion{font-size:7px;letter-spacing:1.5px}.gentle-note p{font-size:18px}.header-occasion{font-size:8px;letter-spacing:2px}}
@media(max-width:700px){.site-header{height:79px;padding:0 6%}.wordmark{font-size:25px}.brand-flower{font-size:30px}.header-occasion{display:none}.sound-button{font-size:9px;padding:10px 12px}.hero{display:flex;flex-direction:column;padding:28px 6% 0;min-height:0}.hero-copy{padding:0;text-align:center;width:100%}.occasion{justify-content:center;font-size:7px;letter-spacing:1.5px;margin-bottom:21px}.small-line{width:22px}h1{font-size:clamp(55px,11.8vw,78px);line-height:1.12;letter-spacing:-2.5px}.hero-description{font-size:10px;margin:22px 0 24px;line-height:2}.primary-button{padding:16px 22px;font-size:10px;gap:25px}.hero-footnote{justify-content:center;font-size:8px;margin-top:13px}.hero-art{width:100%;height:455px;max-width:430px;margin-top:23px}.hero-bouquet{width:365px;height:410px}.art-circle{width:310px;height:310px;top:60px}.date-badge{top:5px;right:8px;width:83px;min-height:108px}.date-badge strong{font-size:46px}.date-badge span{letter-spacing:1px}.date-badge span:last-child{font-size:4px;letter-spacing:.6px}.spark-one{left:9px;top:90px;font-size:26px}.spark-two{right:13px;bottom:95px;font-size:18px}.floating-note{bottom:78px;right:0;font-size:13px;padding:10px 12px}.art-caption{bottom:15px;font-size:6px;letter-spacing:1.8px}.gentle-note{gap:15px;padding:21px 6px;margin:8px 6% 0}.gentle-note p{font-size:16px;line-height:1.6;text-align:center;max-width:235px}.note-flower{font-size:21px}.site-footer{margin:0 6%;padding:23px 0;align-items:center;font-size:7px;gap:10px}.site-footer .text-button{font-size:8px;white-space:nowrap}.site-footer .text-button span{margin-left:3px}.gift-step{padding:47px 25px 30px}.gift-dialog h2{font-size:30px}.envelope-step{min-height:450px}.envelope{width:270px;height:177px;margin-top:60px}.envelope-seal{top:73px}.envelope-letter{font-size:18px}.envelope-hint{font-size:9px}.letter-step{padding:37px 26px 28px}.letter-step .eyebrow{font-size:6px;letter-spacing:1.2px}.letter-step h2{font-size:33px}.letter-message p{font-size:11px;line-height:1.95}.signature strong{font-size:17px}.letter-step .primary-button{font-size:9px;padding:15px 12px}.gift-bouquet{height:280px;width:260px}.flowers-step .eyebrow{font-size:6px;letter-spacing:1.5px}.flowers-step h2{font-size:31px}.flower-wish{font-size:10px}.custom-dialog{padding:39px 25px 28px}.custom-dialog h2{font-size:28px}.custom-dialog .eyebrow{font-size:7px}}
@media(max-width:360px){h1{font-size:53px}.hero-art{height:420px}.hero-bouquet{width:320px;height:370px}.art-circle{width:265px;height:265px}.floating-note{font-size:11px}.date-badge{right:0}.site-footer{flex-direction:column;gap:9px}.envelope{width:235px;height:155px}.envelope-seal{top:62px}.envelope-letter{font-size:16px}.gift-step h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.petals{display:none}}

/* The letter pairs a readable book face with a handwritten greeting and signature. */
.bouquet img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 16px #76634d12); }
.address-field { margin-bottom: 18px; }
.message-field { margin-bottom: 18px; }
.message-label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.message-label-row label { margin: 0; }
.message-label-row .text-button { font-size: 9px; color: var(--rose); }
.address-field label { margin-bottom: 10px; }
.address-field select { display: block; width: 100%; margin-top: 8px; padding: 12px; border: 1px solid #dcd5c7; border-radius: 4px; background: #fffdf7; color: #555847; font: inherit; font-size: 12px; line-height: 1.8; cursor: pointer; }
.address-field select:focus { outline: 2px solid #b6748055; border-color: #b67480; }
.field-hint { margin: 0; color: #8d8879; font-size: 9px; line-height: 1.9; }
.music-field { border: 1px solid #e3dbcf; border-radius: 6px; padding: 14px; margin-bottom: 20px; background: #f3eee4; }
.music-field label { margin-bottom: 8px; }
.music-field select { display: block; width: 100%; padding: 11px 8px; margin-top: 8px; border: 1px solid #dcd5c7; border-radius: 4px; background: #fffdf7; color: #555847; font: 11px var(--sans); }
.music-field select:focus { outline: 2px solid #b6748055; }
.music-actions { display: flex; align-items: center; gap: 18px; margin: 12px 0; }
.music-preview { border: 1px solid #be9ca0; background: #fffaf2; color: var(--rose); padding: 9px 13px; border-radius: 4px; font-size: 10px; }
.music-preview:disabled { opacity: .5; cursor: default; }
.music-player { position: fixed; left: -10000px; top: 0; width: 360px; height: 200px; overflow: hidden; opacity: 0; pointer-events: none; }
.music-player iframe { display: block; width: 360px; height: 200px; border: 0; }
.letter-step { --letter-font: 'Lora', Georgia, serif; --handwriting: 'Dancing Script', 'Playfair Display', Georgia, serif; }
.gift-dialog .letter-step h2 {
  font-family: var(--handwriting);
  font-size: 46px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  margin-bottom: 20px;
}
.letter-message p {
  font-family: var(--letter-font);
  font-size: 17px;
  line-height: 1.95;
  color: #686052;
  margin-bottom: 18px;
}
.signature span {
  font-family: var(--letter-font);
  font-size: 14px;
  font-style: italic;
}
.signature strong {
  font-family: var(--handwriting);
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5;
}
.envelope-letter {
  font-family: 'Dancing Script', 'Playfair Display', Georgia, serif;
  font-size: 25px;
  font-weight: 500;
  font-style: normal;
}
@media (max-width: 700px) {
  .gift-dialog .letter-step h2 { font-size: 39px; }
  .letter-message p { font-size: 16px; line-height: 1.9; }
  .signature strong { font-size: 26px; }
  .envelope-letter { font-size: 23px; }
}
@media (max-width: 360px) {
  .gift-dialog .letter-step h2 { font-size: 35px; }
  .letter-message p { font-size: 15px; }
  .signature strong { font-size: 24px; }
  .envelope-letter { font-size: 21px; }
}