:root{--beige:#f3eee7;--soft-beige:#AC9362;--text:#6b5c45}body{margin:0;min-height:100vh;background:url(../../image/bg.jpg) center center no-repeat fixed;background-size:cover;display:flex;justify-content:center;align-items:center}.envelope{width:min(360px,90vw);aspect-ratio:3/2;position:relative;cursor:pointer}.base{position:absolute;inset:0;background:#fff;border-radius:0 0 20px 20px;box-shadow:0 20px 40px rgba(0,0,0,.15);z-index:1;border:.5px solid #000;box-sizing:border-box}.flap{position:absolute;inset:0;background:var(--soft-beige);clip-path:polygon(0 0,100% 0,50% 60%);transform-origin:top;transition:transform 1.2s ease;z-index:3;border:.5px solid #000;box-sizing:border-box}.flower{position:absolute;top:50%;left:50%;width:min(80px,22vw);height:min(80px,22vw);transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff 30%,var(--soft-beige) 70%);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,.2);z-index:4;animation:pulse 2.5s infinite}.flower::before{content:"❀";font-size:clamp(28px,6vw,36px);color:var(--text)}.flower{transition:opacity .4s ease,transform .4s ease}.hide-flower{opacity:0;transform:translate(-50%,-50%) scale(1.2) rotate(10deg)}.envelope-wrapper{display:flex;flex-direction:column;align-items:center}.base .names{position:absolute;top:55%;left:50%;transform:translate(-50%,20px);text-align:center;color:var(--text);z-index:2;opacity:0;transition:opacity 1s ease,transform 1s ease}.base .names .line1{font-family:"Playfair Display",serif;font-size:clamp(14px,3vw,18px);letter-spacing:1px;margin-bottom:6px}.base .names .line2{font-family:"Great Vibes",cursive;font-size:clamp(22px,5vw,30px);letter-spacing:2px}.open .names{opacity:1;transform:translate(-50%,-50%)}.open .flap{transform:rotateX(180deg)}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.1)}100%{transform:translate(-50%,-50%) scale(1)}}.open-text{margin-top:30px;font-family:"Great Vibes",cursive;font-size:clamp(14px,3.5vw,18px);letter-spacing:1px;color:var(--soft-beige);text-align:center;opacity:.9;transition:opacity .6s ease;animation:fadeGlow 2.5s ease-in-out infinite}.envelope-wrapper.open .open-text{opacity:0;pointer-events:none}@keyframes fadeGlow{0%{opacity:.6;letter-spacing:1px}50%{opacity:1;letter-spacing:2px}100%{opacity:.6;letter-spacing:1px}}