@import"https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap";:root{--ink:#382426;--muted:#8c7272;--rose:#bb465e;--line:#edddd7;--paper:#fffaf6;--serif:"Playfair Display",Georgia,serif;font-family:Be Vietnam Pro,system-ui,sans-serif;color:var(--ink);background:#fff7f3;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ae3856;outline-offset:4px}[hidden]{display:none!important}#petals{position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.65}#editor{isolation:isolate}.site-header{max-width:1280px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:28px 48px;border-bottom:1px solid var(--line);gap:16px}.home-link{font-size:12px;display:flex;gap:10px;align-items:center}.occasion{font-size:9px;letter-spacing:1.7px;color:#97736f}.occasion span{padding:0 12px;color:#c35d71}.header-heart{font-size:28px;color:var(--rose)}main{max-width:1180px;margin:auto;padding:0 40px}.intro{text-align:center;padding:52px 0 36px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2px;color:#a45562}.tiny-flower{font-size:16px;vertical-align:middle;margin-right:8px}.intro h1{font:500 clamp(36px,4.6vw,61px)/1.17 var(--serif);letter-spacing:-1.8px;margin:20px 0}.intro h1 em{color:var(--rose);font-weight:500}.intro>p{font-size:12px;line-height:1.95;color:var(--muted)}.workspace{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:start}.compose-card{background:#fffdfbf2;border:1px solid var(--line);padding:30px;border-radius:18px;box-shadow:0 12px 45px #79363f05;scroll-margin-top:24px}.card-heading{display:flex;align-items:center;gap:13px;margin-bottom:28px}.step{font-size:10px;letter-spacing:1px;color:#b1707a;display:inline-grid;place-items:center;flex-shrink:0;width:31px;height:31px;border:1px solid #e8c9cc;border-radius:50%}.card-heading h2{font-size:17px;margin:0 0 7px;letter-spacing:-.5px}.card-heading p{font-size:10px;color:var(--muted);margin:0;line-height:1.6}.small-heart{margin-left:auto;color:#ce8997;font-size:26px}label{font-size:11px;font-weight:600;display:block}textarea{width:100%;resize:vertical;min-height:164px;max-height:500px;border:1px solid #e8d5d2;background:#fffaf7;border-radius:10px;padding:16px;margin-top:10px;font-size:12px;line-height:1.9;color:var(--ink);transition:border-color .2s}textarea::placeholder{color:#b39c96}textarea:focus{border-color:var(--rose)}.field-caption{display:flex;justify-content:space-between;gap:12px;margin:9px 0 25px;font-size:9px;line-height:1.6;color:var(--muted)}#message-count{white-space:nowrap}.timing{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--line)}.timing p{font-size:9px;line-height:1.7;color:var(--muted);margin:7px 0 0}.seconds{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:8px;background:#fff7f3;border:1px solid var(--line);font-size:10px;color:var(--muted)}.seconds input{width:44px;border:0;background:transparent;color:var(--ink);font-size:15px;padding:2px}.form-actions{display:flex;gap:10px;margin-top:24px}.primary,.secondary{border-radius:8px;padding:14px 18px;font-size:11px;font-weight:600;display:inline-flex;justify-content:center;align-items:center;gap:12px;min-height:45px}.primary{background:var(--rose);color:#fff;border:1px solid var(--rose)}.primary:hover{background:#a83b52}.secondary{border:1px solid #dfc7c5;background:transparent;color:#77464f}.secondary:hover{background:#fff2ef}.form-actions .primary{flex:1;justify-content:space-between}.form-note{font-size:9px;line-height:1.8;text-align:center;color:#9a8480;margin:15px 0 0}.status{font-size:11px;line-height:1.8;color:#a1344d;margin:12px 0 0}.status:empty{display:none}.preview-column{padding-top:0}.gift-preview{background:radial-gradient(ellipse at 50% 75%,#572632,#28171e 52%,#20161b);position:relative;overflow:hidden;min-height:408px;color:#f7d9d3;border-radius:150px 150px 16px 16px;padding:36px 30px 24px;border:1px solid #7f4b4b25}.preview-top{display:flex;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:1.7px;color:#ba9699;position:relative;z-index:1;padding:24px 14px 0}.preview-gift{text-align:center;position:relative;z-index:1;margin-top:32px}.gift-heart{display:block;font-size:64px;color:#e4a2ad;text-shadow:0 0 65px #e67a9877;line-height:1.2;transform:rotate(-9deg)}.preview-gift p{font:500 31px/1.4 var(--serif);margin:18px 0 22px}.preview-gift em{color:#efb8b8}.preview-caption{font-size:7px;letter-spacing:2px;color:#bc9399}.preview-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:35px;font-size:9px;color:#b9949a;position:relative;z-index:1}.preview-bottom>span:first-child,.preview-bottom>span:last-child{font-size:20px;color:#dca2a7}.orbit{position:absolute;width:390px;height:390px;border:1px solid #f9bdba12;border-radius:50%;top:45px;left:50%;transform:translate(-50%)}.orbit-two{width:310px;height:310px;top:86px}.preview-flower{position:absolute;left:14px;bottom:65px;color:#b7777a33;font-size:135px;transform:rotate(-20deg)}.how-it-works{display:flex;align-items:flex-start;gap:13px;padding:24px 6px 0}.how-it-works p{margin:0;font-size:10px;line-height:1.9;color:var(--muted)}.how-it-works strong{font-size:11px;color:#69444a;font-weight:500}.handwritten{text-align:center;font:italic 17px/1.6 var(--serif);color:#b8787e;margin-top:22px}footer{display:flex;gap:7px;justify-content:center;align-items:center;padding:40px 0 26px;font-size:9px;color:#ac9290}footer span{color:#c47382}.footer-separator{padding:0 8px;color:#d5bfba}.qr-result{border-top:1px dashed #dfc2c7;margin-top:24px;padding-top:24px;text-align:center}.qr-result h3{font:500 23px/1.4 var(--serif);margin:10px 0}.qr-result p{font-size:10px;color:var(--muted);line-height:1.8}.qr-result #qr{display:block;width:224px;height:224px;max-width:100%;margin:20px auto;border:1px solid var(--line);border-radius:12px;background:#fff}.qr-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.text-link{font-size:10px;align-self:center;padding:12px}.delete-link{border:0;border-bottom:1px solid #dcb4bd;background:transparent;padding:7px 0;margin-top:18px;color:#9c5c6b;font-size:10px}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}.noscript{padding:30px;text-align:center}.player{position:fixed;inset:0;z-index:50;background:radial-gradient(ellipse at 50% 65%,#30121d,#100b12 75%);color:#ffe7eb;overflow:hidden;height:100dvh}.player #rain{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}.player-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:max(18px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 10px max(24px,env(safe-area-inset-left));font-size:9px;letter-spacing:2px;color:#ba8495;z-index:3}.player-date{color:#754858;padding-left:12px}.player button{color:inherit}.player-top button,.player-bottom button{border:1px solid #f2bdcf33;background:#21131cbb;border-radius:50%;width:40px;height:40px;font-size:17px;display:grid;place-items:center}.player-center{position:absolute;inset:60px 24px 74px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2}.rotate-phone{font-size:62px;line-height:1.1;color:#eab6c5;transform:rotate(-90deg);margin-bottom:15px}.rotate-phone span{font-size:28px;display:inline-block}.player-center>p{font-size:17px;line-height:1.7;margin:8px 0}.countdown-sub{font-size:10px;color:#ad8191;margin-top:5px}#countdown{font:500 clamp(68px,16vh,140px)/1.2 var(--serif);color:#ffd9e5;text-shadow:0 0 40px #ff8db366;margin-top:12px}#slide-text{font:500 clamp(25px,4.3vw,66px)/1.65 var(--serif);text-wrap:balance;white-space:pre-wrap;overflow-wrap:anywhere;max-width:1100px;margin:0;width:100%;text-shadow:0 2px 25px #fa8eb75c}.player.paused #progress{animation-play-state:paused!important}.final-heart{font-size:clamp(110px,30vh,230px);color:#ee83a7;line-height:1.1;filter:drop-shadow(0 0 45px #ed6a9b80);animation:heartbeat 2s ease-in-out infinite}.end-caption{font-family:var(--serif);font-style:italic;color:#e8b8c7}.player-button{border:1px solid #c88c9e66;border-radius:30px;background:#fbb1ce12;padding:12px 25px;font-size:12px;margin-top:18px;min-height:44px}.create-own{font-size:10px;color:#b38497;margin-top:19px;min-height:36px;padding:8px}.player-bottom{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));display:flex;gap:16px;align-items:center;z-index:3}.player-bottom>span{font-size:10px;letter-spacing:2px;color:#b98a9a;white-space:nowrap}.progress-track{height:2px;flex:1;background:#f5bfd322;overflow:hidden}#progress{height:100%;width:100%;background:#ef9fbb;transform-origin:left;animation:progress linear both}@keyframes progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.loading-heart{font-size:60px;color:#e6a1b9;animation:heartbeat 2s ease-in-out infinite}#error-screen p{max-width:480px;font-size:13px;color:#bd91a0}#error-screen h2{font-family:var(--serif);font-weight:500}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@media(min-width:1400px){.intro{padding-top:64px}}@media(max-width:768px){.site-header{padding:19px 22px}.occasion{font-size:7px;letter-spacing:1px}.occasion span{padding:0 5px}.home-link{font-size:10px;gap:6px}.header-heart{font-size:24px}main{padding:0 20px}.intro{padding:35px 0 25px}.eyebrow{font-size:7px;letter-spacing:1.4px}.intro h1{font-size:40px;letter-spacing:-1.5px}.intro>p{font-size:11px}.workspace{grid-template-columns:1fr;gap:24px;max-width:540px;margin:auto}.compose-card{padding:23px 20px;border-radius:14px}.card-heading{margin-bottom:22px}.card-heading h2{font-size:16px}.card-heading p{font-size:9px}textarea{font-size:16px;line-height:1.8;min-height:190px}.gift-preview{min-height:350px;border-radius:110px 110px 14px 14px}.preview-top{padding-top:10px}.preview-gift{margin-top:22px}.preview-gift p{font-size:29px}.gift-heart{font-size:55px}.preview-bottom{margin-top:25px}.field-caption,.form-note{font-size:8px}.player-top{font-size:7px;letter-spacing:1px}.player-date{padding-left:6px}.player-center{inset:65px 20px 78px}#slide-text{font-size:clamp(27px,6.5vw,48px)}footer{font-size:8px;gap:5px}.how-it-works{padding-left:12px;padding-right:12px}}@media(max-width:380px){.occasion{max-width:125px;text-align:center;line-height:1.8}.intro h1{font-size:34px}.form-actions{gap:7px}.primary,.secondary{padding:12px 13px;font-size:10px}.card-heading p{max-width:180px}.small-heart{display:none}}@media(max-height:500px)and (orientation:landscape){.player-center{inset:48px 65px 60px}.rotate-phone{font-size:34px;margin:0}.player-center>p{font-size:14px}#countdown{font-size:64px;margin-top:0}.countdown-sub{font-size:9px}.player-top{padding-top:10px}.player-bottom{bottom:max(8px,env(safe-area-inset-bottom))}.player-bottom button,.player-top button{width:34px;height:34px}#slide-text{font-size:clamp(25px,4vw,47px);line-height:1.45}.final-heart{font-size:100px}.end-caption{margin:0!important}.player-button{margin-top:9px;padding:8px 18px;min-height:36px}.create-own{margin-top:5px}.loading-heart{font-size:42px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}#petals,#rain{display:none}#progress{transform:scaleX(1)}}@font-face{font-family:Love Pacifico;src:url(/loiyeuthuong/Pacifico-Regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}#slide-text{font-family:"Love Pacifico",var(--serif);font-weight:400;line-height:1.75}#heart-letters{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 0 8px #f57dab40)}.heart-text-ready #slide-text{color:transparent;text-shadow:none}.heart-text-small #slide-text{font-family:Be Vietnam Pro,system-ui,sans-serif;line-height:1.65}.rotation-note{display:block;margin-top:9px;color:#a45562}footer{flex-wrap:wrap;row-gap:9px;text-align:center;line-height:1.8}.footer-credit{color:#9a7f7d}@media(max-width:768px){footer{flex-direction:column;gap:7px}.footer-credit-divider{display:none}}body{background:var(--theme-paper,#fff7f3)}.template-picker{border:0;padding:0;margin:0 0 23px;min-width:0}.template-picker legend{font-size:11px;font-weight:600;margin-bottom:12px}.template-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.template-options label{position:relative;cursor:pointer}.template-options input{position:absolute;opacity:0;width:1px;height:1px}.template-options span{display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:13px 3px;font-size:10px;background:#fffaf7}.template-options b{font:26px/1 Georgia;color:var(--rose);font-weight:400}.template-options input:checked+span{border-color:var(--rose);box-shadow:inset 0 0 0 1px var(--rose);background:var(--theme-paper)}.template-options input:focus-visible+span{outline:3px solid var(--rose);outline-offset:3px}.template-picker p,.effect-field p{font-size:10px;line-height:1.8;color:var(--muted);margin:10px 0 0}.message-label{display:flex;justify-content:space-between;align-items:center;gap:12px}.message-label button{border:0;background:transparent;color:var(--rose);font-size:10px;padding:9px 0;min-height:36px}.effect-field{margin:0 0 24px}.effect-field select{font:inherit;font-size:12px;color:var(--ink);width:100%;min-height:46px;border:1px solid var(--line);border-radius:8px;background:#fffaf7;margin-top:10px;padding:10px 12px}.effect-field select:focus-visible{outline:3px solid var(--rose);outline-offset:3px}.gift-preview{background:radial-gradient(ellipse at 50% 75%,var(--theme-glow,#572632),var(--theme-dark,#30121d) 75%)}.gift-heart,.final-heart{color:var(--theme-bright,#ee7eac)}.preview-gift p{color:var(--theme-light,#ffdce9)}.player{background:radial-gradient(ellipse at 50% 65%,var(--theme-dark,#30121d),#100b12 85%);color:var(--theme-light,#ffdce9)}#countdown{color:var(--theme-light,#ffdce9)}#progress{background:var(--theme-mid,#f8acc8)}.player-top,.countdown-sub,.player-bottom>span,.create-own{color:var(--theme-mid,#f8acc8)}.player.paused #slide-text{animation-play-state:paused}#slide-screen:not(.heart-text-ready) #slide-text{animation:letter-fall 1.8s ease-out both}#slide-screen[data-effect=converge]:not(.heart-text-ready) #slide-text{animation-name:letter-converge}#slide-screen[data-effect=fade]:not(.heart-text-ready) #slide-text{animation-name:letter-fade}@keyframes letter-fall{0%{opacity:0;transform:translateY(-35px)}to{opacity:1;transform:translateY(0)}}@keyframes letter-converge{0%{opacity:0;transform:scale(.8);filter:blur(8px)}to{opacity:1;transform:scale(1);filter:blur(0)}}@keyframes letter-fade{0%{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}@media(max-width:380px){.template-options{gap:5px}.template-options span{font-size:9px;padding:12px 2px}.effect-field select{font-size:16px}}@media(prefers-reduced-motion:reduce){#slide-text{animation:none!important}}.primary:hover{background:var(--rose);filter:brightness(.94)}.small-heart,.rotation-note,.handwritten{color:var(--rose)}.template-options{grid-template-columns:repeat(2,minmax(0,1fr))}.template-options span{flex-direction:row;justify-content:center;gap:10px;font-size:11px;min-height:64px}.effect-select{position:relative;margin-top:10px}.effect-field .effect-select select{appearance:none;-webkit-appearance:none;margin-top:0;padding-right:48px;cursor:pointer}.select-chevron{position:absolute;right:20px;top:50%;width:9px;height:9px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}body[data-template=mom] .gift-heart{scale:1.16}body[data-template=mom] .final-heart{scale:1.1}.text-color-picker{border:0;padding:0;margin:0 0 24px;min-width:0}.text-color-picker legend{font-size:11px;font-weight:600;margin-bottom:11px}.text-color-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.text-color-options label{position:relative;cursor:pointer}.text-color-options input{position:absolute;opacity:0;width:1px;height:1px}.text-color-options span{display:flex;gap:10px;align-items:center;justify-content:center;min-height:46px;border:1px solid var(--line);border-radius:8px;background:#fffaf7;font-size:11px}.text-color-options input:checked+span{border-color:var(--rose);box-shadow:inset 0 0 0 1px var(--rose)}.text-color-options input:focus-visible+span{outline:3px solid var(--rose);outline-offset:3px}.text-color-picker p{font-size:10px;color:var(--muted);line-height:1.8;margin:10px 0 0}.color-swatch{width:17px;height:17px;border:1px solid #d8c0c6;border-radius:50%;display:block}.swatch-white{background:#fff}.swatch-mix{background:linear-gradient(135deg,#ffdce9,#f8acc8 50%,#ee7eac)}body[data-color-mode=white] #slide-screen:not(.heart-text-ready) #slide-text{color:#fff}body[data-color-mode=white] .final-heart,body[data-color-mode=white] .gift-heart{color:#fff}#font-sample{margin-top:12px;padding:16px 12px;border:1px dashed var(--line);border-radius:8px;font-family:var(--letter-font,Arial,sans-serif);font-weight:var(--letter-weight,700);font-size:21px;line-height:1.6;text-align:center;color:var(--rose);overflow-wrap:anywhere}#slide-text,.heart-text-small #slide-text{font-family:var(--letter-font,"Love Pacifico",cursive);font-weight:var(--letter-weight,400);line-height:var(--letter-leading,1.65)}
