@font-face{font-family:LYW;src:local("Inter"),local("Arial");font-display:swap}
:root{--ink:#432d3a;--muted:#947987;--rose:#bf6b91;--pink:#efb7cf;--light:#fff4f8;--line:#efdee7;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}body{margin:0;background:#fffafb;color:var(--ink);font-family:LYW,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;color:inherit}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible{outline:3px solid #a85a83;outline-offset:4px}input:focus,textarea:focus,select:focus{outline:2px solid #d391b2;outline-offset:2px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}button{touch-action:manipulation}body:has(dialog[open]){overflow:hidden}
.brand-header{height:90px;max-width:1120px;padding:0 24px;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand-header img{width:132px;height:82px;object-fit:contain;object-position:center}.brand-header>span{font-size:12px;color:#a98c9b}.landing{max-width:1080px;min-height:calc(100svh - 160px);margin:auto;padding:18px 30px 32px;display:grid;grid-template-columns:1fr 1.12fr;gap:85px;align-items:center}.hero-visual{position:relative;background:radial-gradient(ellipse at 50% 40%,#ffedf5,#f9e9f1 70%);border:1px solid #f2dce7;border-radius:36px;padding:18px 15px 14px;box-shadow:0 35px 70px -45px #b0668b5c;transform:rotate(-2deg)}.demo-badge{display:flex;gap:7px;align-items:center;justify-content:center;font-size:10px;color:#a2748d;letter-spacing:.2px}.demo-badge i,.live-meta i{width:6px;height:6px;display:inline-block;border-radius:50%;background:#cd84a6;box-shadow:0 0 0 4px #d79bb524}.hero-visual #hero-preview{height:320px;margin:3px 0}.hero-watch{display:flex;gap:15px;align-items:center;justify-content:center;margin:auto;width:90%;padding:13px;border-radius:14px;background:#ffffffc9;color:#a46687;border:1px solid #f3e3eb;font-size:12px;min-height:44px}.hero-watch>span{font-size:18px}.eyebrow{font-size:10px;letter-spacing:1.1px;color:#b17a98;margin-bottom:20px}.hero-copy h1{font-size:clamp(36px,3.6vw,50px);font-weight:620;line-height:1.08;letter-spacing:-2px}.hero-copy h1 em{font-style:normal;color:#c982a4}.intro{font-size:14px;line-height:1.7;color:var(--muted);margin:22px 0}.audiences{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:25px}.audiences>span{font-size:10px;border:1px solid #efdee7;border-radius:20px;padding:7px 10px;background:#fff}.primary{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px;width:100%;padding:14px 20px;border-radius:17px;background:linear-gradient(108deg,#ce81a4,#b86993);color:#fff;font-size:15px;font-weight:570;box-shadow:0 8px 25px #c4789d20;transition:transform .25s var(--ease),box-shadow .3s}.primary .arrow,.primary>span:last-child{margin-left:auto;font-size:21px}.primary:hover{box-shadow:0 8px 32px #c4789d4f;transform:translateY(-2px)}.primary:active{transform:scale(.97)}.glow:before{content:"";position:absolute;inset:5px 18px -8px;border-radius:25px;background:#e38eb9;filter:blur(15px);z-index:-1;opacity:.38;animation:soft-glow 3s ease-in-out infinite}.button-envelope{width:28px;height:21px;display:grid;place-items:center;transform:rotate(-10deg);border-radius:4px;color:#c6789d;background:#ffe7f1;font-size:19px;animation:invite-wiggle 5s ease-in-out infinite}.hero-note{font-size:11px;text-align:center;margin-top:16px;color:#ab8e9e}.landing-footer{display:flex;justify-content:center;gap:23px;padding:18px 15px 25px}.landing-footer button{background:none;color:#ad93a2;font-size:10px;min-height:34px}.landing-footer button:hover{color:var(--rose)}
body[data-view=builder] .brand-header,body[data-view=builder] .landing-footer{display:none}#builder{max-width:1000px;margin:auto;padding:24px 24px 32px;min-height:100svh}.builder-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:940px;margin:auto}.builder-nav>span{font-size:11px;color:#b594a6;letter-spacing:.3px}.quiet{background:transparent;color:#99778b;font-size:13px;min-height:40px;padding:8px 0}.motion-button{width:38px;height:38px;border-radius:50%;background:#fbedf3;color:#ae7794;font-size:14px}.progress{position:relative;max-width:940px;height:13px;border-radius:20px;background:#f2e3eb;margin:17px auto 31px;border:1px solid #f5e8ef}.progress>div{height:100%;position:relative;background:linear-gradient(90deg,#f0bfd4,#cc80a3);border-radius:20px;transition:width .7s var(--ease);width:0}.progress>div>span{position:absolute;right:-14px;top:-14px;font-size:36px;line-height:36px;color:#c3759c;text-shadow:0 2px #fff,0 -2px #fff,2px 0 #fff,-2px 0 #fff;filter:drop-shadow(0 3px 4px #c3759c22);animation:heartbeat 2.6s ease-in-out infinite}.progress>i{position:absolute;right:9px;top:-5px;font-size:18px;color:#d5a8bd;font-style:normal;z-index:-1}.workbench{display:grid;grid-template-columns:minmax(280px,1fr) minmax(310px,1fr);gap:58px;align-items:start}.editor{min-width:0}.workbench:not(:has(#live-panel:not([hidden]))){display:block;max-width:480px;margin:60px auto 0}#step-title{font-size:31px;line-height:1.12;font-weight:620;letter-spacing:-1px;outline:none}#step-description{font-size:12px;color:var(--muted);line-height:1.55;margin-top:9px;margin-bottom:19px}.field{display:block;margin-bottom:15px;font-size:12px;color:#8c687e}.field>span{display:block;margin:0 0 7px;font-weight:520}.field input,.field textarea,.field select{display:block;width:100%;min-width:0;border:1px solid #ead6e1;background:#fff;border-radius:13px;padding:13px 14px;color:var(--ink);font-size:14px;line-height:1.4}.field input::placeholder,.field textarea::placeholder{color:#c1a7b6}.field textarea{resize:vertical;min-height:85px}.field select{min-height:46px}.form-note,.muted{font-size:11px;line-height:1.55;color:#a88b9c}.form-note{margin:8px 0 14px}.inline-action{padding:7px 0;min-height:35px;background:none;color:#ad6388;text-align:left;font-size:12px;text-decoration:underline;text-underline-offset:4px}.error{font-size:12px;color:#ab496c;line-height:1.5;margin-top:8px}.error:empty{display:none}.next-bar{margin-top:21px}.live-meta{display:flex;justify-content:space-between;align-items:center;padding:0 4px 9px;color:#ad859a;font-size:10px}.live-meta>span{display:flex;align-items:center;gap:7px}.live-meta button{background:none;color:#aa6c8b;font-size:10px;min-height:32px}.live-meta button:hover{color:#7f3d61}#live-panel{position:sticky;top:20px}#live-preview{height:430px;background:#fff1f7;border:1px solid #efd9e4;border-radius:26px;overflow:hidden;box-shadow:0 15px 35px -25px #9f52763f}
.format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.format{border:1px solid #eedce6;background:#fff;border-radius:17px;text-align:center;padding:12px 4px 10px;min-height:130px;position:relative}.format[aria-pressed=true]{border-color:#ce87a9;background:#fff3f8;box-shadow:0 4px 15px #c5739b15}.format strong{display:block;font-size:12px;line-height:1.3;margin-top:12px;font-weight:550}.format-art{display:block;position:relative;height:53px;width:68px;margin:auto}.format-art.envelope{height:44px;margin-top:9px;background:#e9aac5;border-radius:5px;transform:rotate(-6deg);box-shadow:0 5px 12px #a5618025}.format-art.envelope:before{content:"";position:absolute;inset:0;background:#d988ad;clip-path:polygon(0 0,100% 0,50% 62%);border-radius:5px}.format-art.envelope:after{content:"♥";position:absolute;left:26px;top:17px;color:#bf6d93;background:#fff5f8;border-radius:50%;width:18px;height:18px;font-size:11px;display:grid;place-items:center}.format-art.scratch{border-radius:8px;background:linear-gradient(130deg,#edbfd4,#ddd8f1);transform:rotate(5deg);box-shadow:0 5px 12px #a5618025}.format-art.scratch:before{content:"♡";font-size:34px;line-height:53px;color:#ad7e9c}.format-art.scratch:after{content:"";width:41px;height:8px;position:absolute;background:#fffafc;transform:rotate(-28deg);top:27px;left:14px;border-radius:8px}.format-art.gift{width:52px;height:44px;margin-top:9px;border-radius:5px;background:#dca5be;box-shadow:0 5px 12px #a5618025}.format-art.gift:before{content:"";position:absolute;left:22px;top:0;bottom:0;width:9px;background:#fff0d9}.format-art.gift:after{content:"୨୧";position:absolute;left:4px;top:-19px;font-size:35px;line-height:25px;color:#b4678e;font-weight:bold}.format[aria-pressed=true] .format-art{animation:invite-wiggle 4s ease-in-out infinite}.selected-dot{position:absolute;right:7px;top:7px;width:15px;height:15px;border-radius:50%;display:grid;place-items:center;font-size:10px;color:white;background:#c582a3}.text-counter{text-align:right;font-size:10px;color:#b799aa;margin:-9px 0 10px}.media-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.media-tab{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #ecd8e2;border-radius:12px;background:#fff;color:#9b6c86;font-size:12px;min-height:42px;flex:1;padding:8px}.media-tab svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.media-tab[aria-pressed=true]{background:#f9e8f1;border-color:#d79ab7}.media-tab .added{width:15px;height:15px;background:#c582a3;color:#fff;border-radius:50%;font-size:10px;display:grid;place-items:center}.media-slot{background:#fff;border:1px solid #f0e1e9;border-radius:20px;padding:12px 15px}.media-slot:empty{display:none}.media-composer{padding:0;display:grid;grid-template-columns:92px 1fr;align-items:center;gap:5px 12px}.media-composer .mc-heading{grid-column:1/-1}.media-composer .mc-heading h3{font-size:12px}.media-composer .mc-heading p{display:none}.media-composer .mc-visual{grid-column:1;grid-row:2;margin:5px auto}.media-composer .mc-circle{width:88px;height:88px}.media-composer .mc-actions{grid-column:2;grid-row:2;width:100%;gap:4px}.media-composer .mc-button{font-size:11px;min-height:40px;min-width:0;padding:8px 9px;width:100%;border-radius:11px}.media-composer .mc-camera-glyph>svg{width:38px;height:38px}.media-composer .mc-camera-glyph>span{font-size:15px;top:12px;left:auto;right:16px}.media-composer .mc-circle-spark{display:none}.media-composer .mc-local-note{grid-column:1/-1;font-size:9px;margin:0}.media-composer .mc-error{grid-column:1/-1;font-size:11px}.media-composer .mc-file-illustration{width:75px;height:75px;border-radius:19px}.media-composer .mc-file-illustration svg{width:31px;height:31px}.media-composer .mc-action-pair{flex-direction:column;gap:2px}.media-composer .mc-play{margin:0}.media-composer .mc-photo-preview{width:90px;height:90px}.media-composer .mc-timer{font-size:10px;margin-top:3px}.media-composer[data-kind=audio] .mc-visual:has(audio){grid-column:1/-1;flex-direction:row;gap:8px;width:100%}.media-composer[data-kind=audio]:has(audio) .mc-actions{grid-column:1/-1;grid-row:3}.media-composer .mc-audio{max-width:220px;margin:0;height:36px}.media-composer[data-kind=audio]:has(audio) .mc-file-illustration{display:none}
.count-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#937388;margin-bottom:12px}.count-picker{display:flex;gap:5px}.count-picker button{min-width:38px;min-height:36px;border:1px solid var(--line);border-radius:11px;background:#fff;color:#a4748f}.count-picker button[aria-pressed=true]{background:#c783a4;color:#fff;border-color:#c783a4}.activity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.activity{position:relative;background:#fff;border:1px solid var(--line);border-radius:13px;padding:3px 3px 7px;overflow:hidden;min-height:88px}.activity img{width:100%;height:51px;display:block;object-fit:cover;border-radius:9px;margin-bottom:4px}.activity strong{display:block;font-size:10px;line-height:1.25;font-weight:550}.activity[aria-pressed=true]{border-color:#cd86a7;background:#fff1f7;box-shadow:0 3px 10px #c57e9e14}.activity .selected-dot{width:15px;height:15px;top:5px;right:5px}.custom-photos{display:grid;gap:7px;margin-top:13px}.date-edit{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:9px;border:1px solid #efdee7;border-radius:13px;background:#fff;padding:6px 8px}.date-edit img{width:40px;height:35px;object-fit:cover;border-radius:7px}.date-edit input{min-width:0;width:100%;font-size:11px;color:#79556b;background:none;border:0;border-bottom:1px dashed #ead4e1;padding:5px 1px;outline-offset:0}.date-edit button{font-size:10px;min-height:34px;padding:5px 7px;background:#fbedf4;color:#a36a89;border-radius:8px}.date-edit .remove-photo{grid-column:2/-1;justify-self:end;background:none;min-height:25px}.time-choices,.delivery-choices{display:grid;gap:9px}.option{display:flex;align-items:center;gap:12px;min-height:68px;border:1px solid var(--line);border-radius:15px;background:#fff;padding:12px 14px;text-align:left}.option[aria-pressed=true]{background:#fff2f7;border-color:#d79ab7}.option-symbol{font-size:25px;color:#c485a4;min-width:28px;text-align:center}.option strong{display:block;font-size:13px;font-weight:550}.option small{display:block;font-size:10px;line-height:1.45;color:#aa8a9d;margin-top:4px}.option-check{margin-left:auto;color:#bc6a93}.date-fields{display:grid;grid-template-columns:1.2fr 1fr;gap:10px;margin-top:16px}.delivery-choices{margin-top:13px}.review-edit{display:flex;flex-wrap:wrap;gap:6px}.review-edit button{border:1px solid #ead8e2;background:#fff;color:#a16e8c;padding:8px 11px;min-height:35px;border-radius:10px;font-size:11px}.anonymous-note{margin-top:10px;padding:11px 13px;border-radius:11px;background:#f8ecf2;font-size:10px;line-height:1.55;color:#a07a90}.telegram-field{margin-top:12px}.checkout-note{font-size:10px;color:#a98b9d;margin-top:10px;line-height:1.5;text-align:center}.delivery-description{font-size:12px;margin:10px 0;color:#aa859b}.link-example{font-family:monospace;font-size:11px;border:1px dashed #e5c9d9;padding:12px;border-radius:11px;display:block;color:#a78699;overflow-wrap:anywhere}.demo-actions{display:flex;gap:8px;margin-top:14px}.demo-actions button{flex:1;border-radius:12px;background:#f7e6ef;color:#ab688b;padding:12px;font-size:12px;min-height:44px}.demo-actions button:disabled{cursor:not-allowed}.status-note{font-size:11px;color:#9d7890;line-height:1.6;margin-top:12px}
dialog{border:0;padding:0;color:var(--ink);background:#fffafb;box-shadow:0 20px 80px #4d283a33}dialog::backdrop{background:#422b3c77;backdrop-filter:blur(8px)}.recipient-dialog{width:min(440px,100vw - 24px);height:min(820px,100svh - 24px);max-height:calc(100svh - 24px);border-radius:28px;overflow:hidden}.modal-top{height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font-size:11px;color:#a77e95;border-bottom:1px solid #f0e0e8}.modal-top button{width:37px;height:37px;font-size:23px;border-radius:50%;color:#a67490;background:#f9eaf2}#full-preview{height:calc(100% - 49px)}.info-dialog{width:min(430px,calc(100vw - 32px));padding:30px 24px 25px;border-radius:23px;max-height:calc(100svh - 40px);overflow:auto}.info-dialog h2{font-size:24px;line-height:1.15;letter-spacing:-.7px;margin:10px 25px 16px 0}.info-dialog p{font-size:12px;line-height:1.6;color:#99768d}.info-dialog .primary{margin-top:17px}.close-info{position:absolute;right:10px;top:10px;width:36px;height:36px;border-radius:50%;background:#f9eaf1;color:#a67791;font-size:22px}#translation-form{margin-top:18px}#effects{pointer-events:none;position:fixed;inset:0;overflow:hidden;z-index:1000}.burst-heart{position:absolute;left:0;top:0;color:#d787ac;text-shadow:0 2px 6px #b66e9420;will-change:transform,opacity}.motion-paused *{animation-play-state:paused!important}.motion-paused .glow:before{animation:none}
@keyframes soft-glow{0%,100%{opacity:.24;transform:scale(.98)}50%{opacity:.56;transform:scale(1.04)}}@keyframes invite-wiggle{0%,76%,100%{transform:rotate(-6deg)}80%{transform:rotate(6deg) translateY(-2px)}84%{transform:rotate(-8deg)}88%{transform:rotate(5deg)}}@keyframes heartbeat{0%,78%,100%{transform:scale(1)}84%{transform:scale(1.16)}91%{transform:scale(1.04)}}
@media(max-width:740px){.desktop-only{display:none}.brand-header{height:70px;padding:0 21px}.brand-header img{width:112px;height:70px}.brand-header>span{font-size:9px}.landing{display:flex;flex-direction:column;gap:25px;padding:8px 22px 20px;min-height:0;max-width:480px}.hero-visual{width:100%;border-radius:24px;padding:11px 10px 9px;transform:none}.hero-visual #hero-preview{height:160px;margin:0}.hero-watch{min-height:35px;padding:7px;font-size:10px;width:auto;gap:8px}.demo-badge{font-size:9px}.hero-copy{width:100%}.eyebrow{font-size:8px;letter-spacing:.6px;margin-bottom:10px}.hero-copy h1{font-size:35px;letter-spacing:-1.4px;line-height:1.07}.intro{font-size:12px;line-height:1.6;margin:13px 0}.audiences{gap:4px;margin-bottom:16px}.audiences>span{font-size:8px;padding:6px 7px}.hero-note{font-size:10px;margin-top:11px}.primary{min-height:52px;font-size:14px;border-radius:15px;padding:12px 16px}.landing-footer{gap:16px;padding:3px 12px 13px}.landing-footer button{font-size:9px}.builder-nav{padding:0 2px}.builder-nav>span{font-size:10px}#builder{padding:9px 18px 21px;max-width:480px}.progress{margin:10px 8px 23px;height:12px}.progress>div>span{font-size:32px;top:-12px;right:-13px}.workbench{display:flex;flex-direction:column;gap:19px}.workbench:not(:has(#live-panel:not([hidden]))){margin:35px auto 0}.editor{width:100%}#live-panel{position:static;width:100%}.live-meta{padding:0 3px 4px;font-size:9px}.live-meta button{font-size:9px;min-height:27px}#live-preview{height:174px;border-radius:21px}#step-title{font-size:27px;letter-spacing:-.8px}#step-description{font-size:11px;margin:7px 0 14px}.field{font-size:11px;margin-bottom:13px}.field input,.field select,.field textarea{font-size:16px;padding:11px 12px}.field textarea{font-size:14px;min-height:75px}.next-bar{margin-top:16px}.format{min-height:112px;padding:8px 3px}.format strong{font-size:11px;margin-top:9px}.format-art{transform:scale(.9)}.format-art.envelope{transform:rotate(-6deg) scale(.9)}.media-tabs{margin-top:9px}.media-tab{font-size:11px;min-height:40px;gap:5px}.media-slot{padding:9px 11px}.activity{min-height:80px}.activity img{height:44px}.activity strong{font-size:9px}.activity-grid{gap:6px}.date-edit{grid-template-columns:30px 1fr auto;gap:7px;padding:5px 6px}.date-edit img{width:30px;height:30px}.count-row{font-size:11px;margin-bottom:10px}.option{min-height:63px;padding:10px 12px}.option strong{font-size:12px}.option small{font-size:10px}.step-description:empty{display:none}body[data-step=personal] #live-preview,body[data-step=plans] #live-preview{height:145px}body[data-step=personal] .workbench,body[data-step=plans] .workbench{gap:14px}.custom-photos{margin-top:10px;gap:5px}}
@media(max-width:740px) and (max-height:700px){.brand-header{height:57px}.brand-header img{height:58px;width:97px}.hero-visual #hero-preview{height:130px}.landing{gap:18px;padding-top:3px}.hero-copy h1{font-size:31px}.intro{margin:10px 0;font-size:11px}.eyebrow{font-size:7px}.hero-note{margin-top:8px}.audiences{margin-bottom:12px}.hero-watch{min-height:31px}.hero-visual{padding-top:9px}.hero-note{font-size:9px}.landing-footer button{font-size:8px}#builder{padding-top:5px}.progress{margin-top:6px;margin-bottom:20px}.workbench{gap:14px}#live-preview{height:145px}.workbench:not(:has(#live-panel:not([hidden]))){margin-top:24px}#step-title{font-size:25px}#step-description{margin-bottom:11px}.next-bar{margin-top:12px}body[data-step=personal] #live-preview,body[data-step=plans] #live-preview{height:115px}.live-meta{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.burst-heart{display:none}}

/* Keep navigation available while only the active step's fields can scroll. */
.format-art.gift{width:68px;height:53px;margin-top:0;background:url("./assets/gift-tile.svg") center/contain no-repeat;box-shadow:none;border-radius:0}
.format-art.gift:before,.format-art.gift:after{display:none}
@media(max-width:740px){
body[data-view=builder]{overflow:hidden}
#builder:not([hidden]){height:100svh;min-height:0;display:flex;flex-direction:column;padding-bottom:12px}
.builder-nav{flex:none;width:100%}.progress{flex:none;width:calc(100% - 16px)}
.workbench,.workbench:not(:has(#live-panel:not([hidden]))){display:flex;flex-direction:column;min-height:0;flex:1;width:100%;max-width:none;margin:0;gap:14px}
.workbench:not(:has(#live-panel:not([hidden]))){padding-top:20px}
#live-panel{flex:none}.editor{min-height:0;flex:1;display:flex;flex-direction:column}
#step-title,#step-description,.error,.next-bar{flex:none}
#fields{min-height:0;overflow:auto;overscroll-behavior:contain;padding:2px 3px 5px;margin:0 -3px;scrollbar-width:thin;scrollbar-color:#e5bfd3 transparent}
.next-bar{margin-top:auto;padding-top:12px;background:#fffafb;z-index:1}
#fields:has(.media-slot:not(:empty)){padding-bottom:8px}
body[data-step=personal] #live-preview,body[data-step=plans] #live-preview{height:115px}
body[data-step=personal] #step-title,body[data-step=plans] #step-title{font-size:25px}
body[data-step=personal] #step-description,body[data-step=plans] #step-description{margin-bottom:8px}
body[data-step=personal] .field{margin-bottom:10px}
body[data-step=personal] .field textarea{min-height:65px;height:65px}
.media-composer .mc-circle{width:72px;height:72px}
.media-composer .mc-visual{margin:1px auto}.media-slot{padding:7px 10px}
.media-composer{grid-template-columns:78px 1fr}.media-composer .mc-local-note{font-size:8px}
body[data-step=plans] .activity{min-height:67px}body[data-step=plans] .activity img{height:34px}
}

@media(max-width:740px){body[data-step=time] .lyw-recipient.is-compact[data-scene=letter] .lr-time{display:flex;margin:7px 0 0;font-size:10px;min-height:24px;padding:4px 8px}}

@media(max-width:740px){body[data-step=plans] #live-preview .lr-answer-buttons{display:none}}
/* V8: stronger hierarchy, tactile choices, quieter secondary UI. */
:root{--ink:#492b3d;--muted:#886276;--rose:#a74672;--line:#e7cddc}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.brand-header>span,.demo-badge,.eyebrow,.hero-note,.landing-footer button{color:#8c6078}
.hero-copy h1 em{color:#a54975}.hero-copy h1{font-weight:660;letter-spacing:-1.6px}
.hero-visual{background:radial-gradient(ellipse at 50% 38%,#fff4f9,#f7e0ec 80%);box-shadow:0 26px 55px -38px #95496e64}
.hero-watch{color:#904466;font-weight:600;border-color:#e9c9da;background:#fffcfe;min-height:42px}
.audiences>span{color:#80566e;border-color:#e8d1dd;background:#fffafd}
.primary{background:linear-gradient(112deg,#b65380,#943c68);font-weight:650;font-size:15px;padding-left:45px;padding-right:45px;min-height:56px;box-shadow:0 8px 19px #983e6b25,inset 0 1px 0 #ffffff29}
.primary .arrow,.primary>span:last-child{position:absolute;right:18px;margin:0;font-size:21px}
#start .button-envelope{position:absolute;left:17px;margin:0}
.primary:hover{box-shadow:0 11px 30px #983e6b42}
.glow:before{background:#d46a9d;filter:blur(12px);inset:8px 25px -7px;opacity:.4}
.builder-nav>span{color:#8d627a;font-weight:550}.quiet{color:#81546d}.motion-button{color:#985171;border:1px solid #ebd4e0;background:#fff2f8}
.progress{background:#eddae5}.progress>div{background:linear-gradient(90deg,#e8adc9,#b95889)}.progress>div>span{color:#b85887}
#step-title{font-weight:660;letter-spacing:-.85px}.field{color:#775068}.field>span{font-weight:600}.field input,.field textarea,.field select{border-color:#dfc3d2;box-shadow:0 2px 5px #8b4a6b03}.field input::placeholder,.field textarea::placeholder{color:#a08094}
.form-note,.muted,.text-counter,.checkout-note{color:#8d687d}.live-meta{color:#81556e}.live-meta button{color:#974468;font-weight:600;min-height:34px}.live-meta button:after{content:"";display:block;height:1px;background:#d9a6c0;opacity:.65;margin-top:1px}
#live-preview{border-color:#e6c8d9;background:#fff1f7;box-shadow:0 8px 26px -20px #994b7180}
.format{border-color:#e6d1dc;transition:transform .25s var(--ease),border-color .2s,box-shadow .2s}.format:hover{transform:translateY(-3px);border-color:#c1779d}.format[aria-pressed=true]{border:1.5px solid #ae5480;background:linear-gradient(#fff7fb,#fbe8f2);box-shadow:0 5px 16px #b55e861a}.format strong{color:#754259;font-weight:600}.selected-dot{width:18px;height:18px;background:#a74975}
.media-tab{color:#82516d;border-color:#dfc2d1}.media-tab[aria-pressed=true]{background:#f8e1ed;border-color:#af5982;color:#854266;box-shadow:inset 0 0 0 .5px #af5982}.media-tab .added{background:#a74975}
.count-row{color:#794e68}.count-picker button{min-width:40px;min-height:40px;color:#8c4e6d}.count-picker button[aria-pressed=true]{background:#a74975;border-color:#a74975;box-shadow:0 4px 10px #a7497524}.activity{transition:transform .2s,border-color .2s,box-shadow .2s}.activity:hover{transform:translateY(-2px)}.activity[aria-pressed=true]{border:1.5px solid #ad5480;background:#fae7f0;box-shadow:0 4px 12px #a7497520}.activity strong{color:#77465e;font-weight:600}.activity .selected-dot{background:#a74975}.date-edit{border-color:#e4cbd9}.date-edit input{font-size:12px;color:#744761}.date-edit button{color:#8d4265;background:#f4dfea;font-size:11px;font-weight:550}
.option{transition:border-color .2s,background .2s,transform .2s}.option:active{transform:scale(.985)}.option[aria-pressed=true]{border:1.5px solid #b25982;background:#fff0f7;box-shadow:0 3px 12px #a749750e}.option strong{color:#72435d;font-weight:600}.option small{color:#90677d}.option-check{color:#a23e6e;font-size:18px;font-weight:700}.option-symbol{color:#a8547a}.review-edit button{color:#8b4e6e;border-color:#dfc1d3}.delivery-description,.anonymous-note,.status-note{color:#866078}.modal-top{color:#81546d}.info-dialog p{color:#80566d}
@media(min-width:741px){.next-bar{margin-top:25px}.hero-copy .primary{max-width:370px}.hero-note{max-width:370px}.hero-copy h1{font-size:46px}#fields{max-width:100%}}
@media(max-width:740px){
.landing{gap:21px;padding-bottom:17px}.hero-copy h1{font-size:34px;line-height:1.08}.hero-watch{min-height:36px}.intro{font-size:12px;line-height:1.65}.hero-note{font-size:10px}.audiences>span{font-size:9px}.eyebrow{font-size:8px;line-height:1.5;letter-spacing:.65px}.primary{min-height:55px;font-size:14px}.hero-visual #hero-preview{height:156px}
#builder:not([hidden]){padding-top:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}.progress{margin-bottom:21px}.workbench{gap:15px}#step-description{color:#866177;font-size:11px;line-height:1.55}.form-note{font-size:11px}.live-meta{font-size:9px}.live-meta button{font-size:10px;min-height:32px}#live-preview{height:185px}body[data-step=personal] #live-preview,body[data-step=plans] #live-preview{height:130px}
.next-bar{padding-top:10px;box-shadow:0 -7px 15px -9px #94577720}#fields{padding-bottom:9px}.count-row{font-size:11px}.activity-grid{gap:7px}body[data-step=plans] .activity{min-height:76px}body[data-step=plans] .activity img{height:40px}.activity strong{font-size:10px}.date-edit{padding:6px}.date-edit input{font-size:12px}.date-edit button{min-height:36px}.format{min-height:116px}.format strong{font-size:11px}.builder-nav .quiet{min-height:40px}body[data-step=finish] #live-preview{height:185px}
}
@media(max-width:740px) and (max-height:650px){.landing{gap:14px}.hero-copy h1{font-size:30px}.hero-visual #hero-preview{height:120px}.brand-header{height:52px}.brand-header img{height:52px}.hero-note{font-size:9px}.audiences>span{font-size:8px}.intro{margin:10px 0}.primary{min-height:50px}#builder:not([hidden]){padding-top:4px}.progress{margin-top:7px;margin-bottom:18px}#live-preview,body[data-step=finish] #live-preview{height:143px}body[data-step=personal] #live-preview,body[data-step=plans] #live-preview{height:110px}#step-title{font-size:24px}.workbench{gap:11px}.live-meta button{min-height:27px}.next-bar{padding-top:8px}}
@media(prefers-reduced-motion:reduce){.format,.activity,.option{transition:none}}
/* Readable white labels on every main action. */
.media-composer .mc-primary,.media-composer .mc-primary:hover:not(:disabled){color:#fff;background:linear-gradient(112deg,#b65380,#943c68);font-weight:600}
.media-composer .mc-secondary,.media-composer .mc-quiet{color:#81516d}.media-composer .mc-local-note{color:#86667a}
.lyw-recipient .lr-primary:not(:disabled),.lyw-recipient .lr-open-hint{color:#fff;background:linear-gradient(130deg,#b65380,#a43e6d)}
.lyw-recipient .lr-open-hint:hover{background:linear-gradient(130deg,#ab4876,#943360)}
/* A visible test boundary, kept separate from the invitation artwork. */
.checkout-banner{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 14px;padding:8px 14px;margin:0 auto 12px;color:#87526d;background:#fbf0f5;font-size:12px;text-align:center;border-radius:12px;max-width:700px}
.checkout-banner[hidden],.checkout-banner button[hidden]{display:none}
.checkout-banner button{border:0;background:none;font:inherit;text-decoration:underline;color:inherit;cursor:pointer;min-height:32px}
.checkout-total{display:flex;justify-content:space-between;padding:18px 0;border-top:1px solid #eedee7;margin-top:16px}
.checkout-answer{background:#fff4f8;border-radius:18px;padding:16px 18px;margin:18px 0;color:#80485f}
.checkout-answer p{margin:6px 0 0}
.checkout-url{font-size:12px!important;width:100%;min-width:0}
.checkout-open{display:block;text-align:center;color:#8e4a69;text-decoration:underline;padding:16px;min-height:48px}
.info-dialog .primary{width:100%}
.info-dialog [data-checkout="refresh"],.info-dialog [data-checkout="edit"]{display:block;width:100%;min-height:44px;padding:10px 12px;margin:5px 0;font-size:14px;text-align:center;border:1px solid #eedee7;border-radius:12px;text-decoration:none}
.info-dialog [data-checkout="edit"]{border-color:transparent}

/* Recipient-owned scheduling */
.time-slot-list{display:grid;gap:10px;margin-top:14px}.time-slot-editor{padding:13px 14px 3px;background:#fff;border:1px solid #ead6e1;border-radius:16px}.slot-heading{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600;color:#98617f}.slot-heading button{background:#faedf3;border-radius:50%;width:32px;height:32px}.time-slot-editor .date-fields{margin-top:10px}.recipient-time-explainer{display:flex;gap:12px;align-items:center;padding:18px 14px;background:linear-gradient(120deg,#fff5f9,#f6ebf6);border-radius:16px;margin-top:15px}.recipient-time-explainer>span{font-size:34px;color:#c16d99}.recipient-time-explainer p{font-size:13px;line-height:1.5;color:#8b6079}.time-slot-editor input{min-height:46px;font-size:16px!important}

/* Form tracks must be allowed to shrink below Safari's native date-control
   intrinsic width. The native picker still opens normally on tap. */
.date-fields { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.date-fields > *, .time-slot-editor, .time-slot-list, .field,
.date-edit, .date-edit > *, .option > span { min-width: 0; }
.field input, .field select, .field textarea, .date-edit input { max-width: 100%; box-sizing: border-box; }
.field input[type="date"], .field input[type="time"] {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  -webkit-appearance: none;
  appearance: none;
  text-align: start;
}
.field input[type="date"]::-webkit-date-and-time-value,
.field input[type="time"]::-webkit-date-and-time-value { min-width: 0; text-align: start; }
.field input[type="date"]::-webkit-datetime-edit,
.field input[type="time"]::-webkit-datetime-edit { min-width: 0; padding: 0; }
.date-edit { grid-template-columns: 40px minmax(0, 1fr) auto; }
.option > span:nth-child(2) { flex: 1; overflow-wrap: anywhere; }
.option-symbol, .option-check { flex-shrink: 0; }

@media (max-width: 740px) {
  /* One scrolling work area, with a separate pinned action. No scroll box
     inside another scroll box, and no empty flex spacer above Continue. */
  body[data-view="builder"] {
    display: flex;
    flex-direction: column;
    height: 100svh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
  }
  body[data-view="builder"] > main { display: flex; flex: 1; flex-direction: column; min-height: 0; width: 100%; }
  body[data-view="builder"] .checkout-banner { flex-shrink: 0; margin-bottom: 3px; border-radius: 0; }
  body[data-view="builder"] #builder:not([hidden]) {
    display: flex;
    flex: 1;
    flex-direction: column;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 7px 18px 0;
    overflow: hidden;
  }
  body[data-view="builder"] .workbench,
  body[data-view="builder"] .workbench:not(:has(#live-panel:not([hidden]))) {
    display: block;
    flex: 1;
    width: 100%;
    min-height: 0;
    max-width: none;
    margin: 0;
    padding: 0 2px calc(96px + env(safe-area-inset-bottom));
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    scroll-padding-block: 14px calc(96px + env(safe-area-inset-bottom));
    scrollbar-width: thin;
    scrollbar-color: #dfb5cb transparent;
    -webkit-overflow-scrolling: touch;
  }
  body[data-view="builder"] .workbench:not(:has(#live-panel:not([hidden]))) { padding-top: 13px; }
  body[data-view="builder"] .editor { display: block; min-height: 0; width: 100%; }
  body[data-view="builder"] #fields { height: auto; min-height: 0; max-height: none; padding: 2px 2px 7px; margin: 0 -2px; overflow: visible; }
  body[data-view="builder"] #live-panel { position: static; min-width: 0; width: 100%; margin: 0 0 19px; }
  body[data-view="builder"] .live-meta { gap: 10px; padding-bottom: 6px; }
  body[data-view="builder"] .live-meta > span { flex-shrink: 0; font-size: 11px; }
  body[data-view="builder"] .live-meta button { min-height: 36px; padding: 4px 0; font-size: 11px; text-align: end; }
  body[data-view="builder"] #live-preview { height: 220px; border-radius: 21px; }
  body[data-view="builder"] #step-title { font-size: 27px; line-height: 1.14; }
  body[data-view="builder"] #step-description { margin: 9px 0 17px; font-size: 12px; line-height: 1.55; }
  body[data-view="builder"] .field { font-size: 12px; margin-bottom: 14px; }
  body[data-view="builder"] .field textarea { height: auto; min-height: 95px; font-size: 16px; }
  body[data-view="builder"] .form-note { font-size: 12px; line-height: 1.55; }
  body[data-view="builder"] .next-bar {
    position: fixed;
    z-index: 15;
    left: 50%;
    bottom: 0;
    width: min(100%, 480px);
    margin: 0;
    padding: 12px 18px max(12px, env(safe-area-inset-bottom));
    transform: translateX(-50%);
    border-top: 1px solid #ecd6e1;
    background: #fffafbf7;
    box-shadow: 0 -10px 24px -17px #934f7440;
  }
  body[data-view="builder"] .next-bar .primary { min-height: 55px; }
  .date-edit { grid-template-columns: 42px minmax(0, 1fr); gap: 6px 10px; padding: 10px; }
  .date-edit > img { grid-column: 1; grid-row: 1 / span 2; width: 42px; height: 48px; align-self: start; margin-top: 3px; }
  .date-edit > input:not([type="file"]) { grid-column: 2; grid-row: 1; min-height: 36px; padding: 6px 2px; font-size: 16px; }
  .date-edit > button { grid-column: 2; justify-self: start; width: fit-content; max-width: 100%; min-height: 44px; padding: 8px 11px; font-size: 12px; }
  .date-edit > .remove-photo { grid-column: 2; min-height: 40px; }
  .time-slot-editor { padding: 12px 12px 1px; }
  .time-slot-editor .date-fields { gap: 8px; }
  .time-slot-editor .field input { padding-inline: 9px; }
  .recipient-time-explainer { padding: 14px; }
  .count-picker button, .review-edit button { min-height: 44px; }
}

@media (max-width: 390px) {
  body[data-view="builder"] #builder:not([hidden]) { padding-inline: 14px; }
  body[data-view="builder"] .next-bar { padding-inline: 14px; }
  body[data-view="builder"] #step-title { font-size: 25px; }
  body[data-view="builder"] #live-preview { height: 210px; }
  .builder-nav { gap: 8px; }
  .builder-nav > span { min-width: 0; text-align: center; font-size: 11px; }
  .format-grid { gap: 6px; }
  .format strong { font-size: 11px; }
  .activity-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .activity strong { font-size: 11px; }
  body[data-step="plans"] .activity { min-height: 86px; }
  body[data-step="plans"] .activity img { height: 49px; }
  .count-row { gap: 8px; align-items: flex-start; font-size: 12px; }
  .count-row > span { max-width: 150px; line-height: 1.45; padding-top: 4px; }
  .count-picker { flex-shrink: 0; }
}

@media (max-width: 340px) {
  body[data-view="builder"] #builder:not([hidden]) { padding-inline: 12px; }
  body[data-view="builder"] .next-bar { padding-inline: 12px; }
  body[data-view="builder"] .next-bar .primary { padding-inline: 35px; font-size: 13px; }
  .date-edit { grid-template-columns: 36px minmax(0, 1fr); gap: 6px 8px; padding: 8px; }
  .date-edit > img { width: 36px; height: 42px; }
  .option { gap: 9px; padding: 11px; }
  .option-symbol { min-width: 24px; font-size: 22px; }
  .option strong { font-size: 12px; }
  .option small { font-size: 11px; }
  .date-fields { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 7px; }
}

/* Reserve symmetric sides when the optional animation control is hidden, so
   the current section remains centered independently of the Back label. */
.builder-nav {
  display: grid;
  grid-template-columns: minmax(60px, 1fr) minmax(0, 2fr) minmax(60px, 1fr);
}
.builder-nav > #back { grid-column: 1; grid-row: 1; justify-self: start; min-height: 44px; }
.builder-nav > #section-label { grid-column: 2; grid-row: 1; min-width: 0; text-align: center; line-height: 1.4; }
.builder-nav > #motion { grid-column: 3; grid-row: 1; justify-self: end; }