:root{--primary:#ff0844;--secondary:#ffb199;--accent:#ff4d6d;--text-dark:#4a001f;--font-main:"Poppins", sans-serif;--font-hand:"Kalam", cursive;--font-fancy:"Great Vibes", cursive;--font-elegant:"Cinzel", serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-main);color:var(--text-dark);background:linear-gradient(-45deg,#ff9a9e,#fecfef,#fdd6bd,#ffb199,#ff758c) 0 0/400% 400%;min-height:100vh;margin:0;line-height:1.6;animation:12s infinite livelyGradient;position:relative;overflow-x:hidden}@keyframes livelyGradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}#welcome-screen{z-index:999999;text-align:center;color:#fff;background:linear-gradient(-45deg,#ff0844,#ffb199,#ff4d6d) 0 0/200% 200%;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;transition:transform 2.2s cubic-bezier(.25,.46,.45,.94),filter 2.2s ease-out,opacity 2.2s ease-out;animation:5s infinite livelyGradient;display:flex;position:fixed;top:0;left:0}#welcome-screen.dramatic-exit{filter:blur(8px);opacity:0;pointer-events:none;transform:scale(1.1)translateY(-10%)}.welcome-quote{font-family:var(--font-fancy);text-shadow:0 4px 10px #0003;margin-bottom:2rem;padding:0 20px;font-size:3.5rem;line-height:1.2}.welcome-sub{opacity:.9;letter-spacing:2px;margin-bottom:3rem;font-size:1.1rem}#open-letter-btn{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;cursor:pointer;background:#fff3;border:2px solid #fff;border-radius:50px;padding:15px 40px;font-size:1.2rem;font-weight:700;transition:all .3s;animation:2s infinite pulseBtn;box-shadow:0 10px 20px #ff08444d}#open-letter-btn:hover{color:#ff0844;background:#fff;transform:scale(1.05)}model-viewer::part(default-poster){display:none!important}model-viewer{-webkit-tap-highlight-color:transparent;--poster-color:transparent!important;background-color:#0000!important;border:none!important;outline:none!important}model-viewer:focus{outline:none!important}.hero{z-index:2;min-height:100vh;padding-bottom:4rem;position:relative}.nav{text-align:center;padding:1.5rem}.nav__brand{font-family:var(--font-elegant);text-shadow:0 2px 10px #fffc;font-size:2rem;font-weight:700}.baby-illustration-wrapper{z-index:10;background:radial-gradient(circle,#fffc 0%,#0000 70%);border-radius:50%;animation:4s ease-in-out infinite gentleBounce;position:relative}@keyframes gentleBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.hero__text-content{margin-top:1rem;margin-bottom:3rem}.hero__tag{font-family:var(--font-elegant);letter-spacing:4px;color:var(--accent);font-size:1rem;font-weight:700}.hero__title{color:var(--text-dark);margin:.5rem 0 1rem;font-size:4.5rem;line-height:1.1}.hero__title--accent{background:-webkit-linear-gradient(45deg,#ff0844 0%,#ff4d6d 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 2px #fffc);-webkit-background-clip:text}.hero__subtitle{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff80;border-radius:30px;max-width:600px;margin:0 auto;padding:10px 20px;font-size:1.2rem}.letter-paper{-webkit-backdrop-filter:blur(12px);background:#ffffffd9;border:1px solid #fff;border-radius:24px;padding:4rem 5rem;position:relative;overflow:hidden;box-shadow:0 25px 45px #ff084426,inset 0 0 0 8px #ffffff80}.letter-header{color:#8a3a5b;border-bottom:2px dashed #ff4d6d4d;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;font-weight:700;display:flex}.letter-greeting{color:var(--primary);text-align:left;margin-bottom:1.5rem;font-family:Dancing Script,cursive;font-size:3rem}.letter-body{color:#3a1a24;font-size:1.4rem;line-height:2}.letter-paragraph{text-align:justify;margin-bottom:1.5rem}.letter-indent{float:left;color:var(--primary);background:#fffc;border-radius:8px;margin-right:8px;padding:5px;font-size:2.8rem;line-height:.8;box-shadow:0 4px 10px #0000001a}.letter-rose-section{justify-content:center;align-items:center;gap:1.5rem;margin:3rem 0;display:flex}.rose-divider-line{background:linear-gradient(90deg, transparent, var(--accent), transparent);border-radius:5px;flex:1;height:3px}.flower-container{background:radial-gradient(circle,#ffffffe6 0%,#0000 60%);border-radius:50%;animation:3s infinite alternate pulseFlower}@keyframes pulseFlower{0%{transform:scale(1)}to{filter:drop-shadow(0 0 10px #ff4d6d66);transform:scale(1.05)}}.memory-photo-wrapper{perspective:1000px;justify-content:center;margin:3rem 0 2rem;display:flex}.memory-photo{border:12px solid #fff;border-bottom-width:35px;border-radius:4px;width:280px;max-width:100%;height:auto;transition:transform .4s cubic-bezier(.175,.885,.32,1.275),box-shadow .4s;transform:rotate(-3deg);box-shadow:0 15px 35px #ff084433}.memory-photo:hover{transform:rotate(2deg)scale(1.05);box-shadow:0 20px 45px #ff08444d}.letter-closing-section{perspective:600px;margin-top:3rem;text-align:center!important}.closing-heart{transform-style:preserve-3d;filter:drop-shadow(0 10px 15px #ff084480);margin-top:15px;font-size:3.5rem;animation:3.5s linear infinite magical3DHeart;display:inline-block}@keyframes magical3DHeart{0%{transform:rotateY(0)scale(1)}50%{filter:drop-shadow(0 15px 25px #ff0844cc);transform:rotateY(180deg)scale(1.15)}to{transform:rotateY(360deg)scale(1)}}.letter-signature{flex-direction:column;align-items:flex-end;margin-top:1.5rem;display:flex}.signature-label{color:#8a3a5b;margin-right:10px;font-size:1.2rem}.signature-name{font-family:var(--font-fancy);color:var(--primary);font-size:3.5rem;line-height:1}.corner-decoration{opacity:.8;filter:drop-shadow(0 2px 4px #0003);z-index:1;font-size:2rem;position:absolute}.top-left{top:1.5rem;left:1.5rem}.top-right{top:1.5rem;right:1.5rem}.bottom-left{bottom:1.5rem;left:1.5rem;transform:scaleX(-1)}.music-btn{z-index:9999;border:2px solid var(--accent);color:var(--accent);cursor:pointer;background:#fffc;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:1.5rem;transition:all .3s;display:flex;position:fixed;top:20px;right:20px;box-shadow:0 4px 15px #ff08444d}.music-btn:hover{background:#fff;transform:scale(1.1)}.music-btn.playing{background:#fff;animation:1.5s infinite pulseHeart}@keyframes pulseHeart{0%{box-shadow:0 0 #ff4d6d99}70%{box-shadow:0 0 0 15px #ff4d6d00}to{box-shadow:0 0 #ff4d6d00}}.scroll-indicator{opacity:.8;color:var(--text-dark);flex-direction:column;justify-content:center;align-items:center;margin-top:4rem;font-size:1rem;font-weight:700;display:flex}.scroll-indicator__line{background:var(--primary);width:2px;height:50px;margin-top:10px;animation:2s cubic-bezier(.65,0,.35,1) infinite scrollLine}@keyframes scrollLine{0%{transform-origin:top;transform:scaleY(0)}50%{transform-origin:top;transform:scaleY(1)}50.1%{transform-origin:bottom;transform:scaleY(1)}to{transform-origin:bottom;transform:scaleY(0)}}.footer{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff4d;border-top:2px solid #fff9;padding:3rem 1.5rem}.footer__main{color:var(--text-dark);margin-bottom:.5rem;font-size:1.1rem;font-weight:500}.heart-beat{color:var(--primary);font-size:1.3rem;animation:1.5s infinite heartBeat;display:inline-block}@keyframes heartBeat{0%,to{transform:scale(1)}10%,30%{transform:scale(1.3)}20%{transform:scale(1.1)}40%{transform:scale(1)}}.footer__wishes{color:var(--primary);margin-top:1rem;font-size:1.4rem;font-weight:700}@media (width<=900px){.letter-paper{padding:3rem}}@media (width<=768px){.hero__title{font-size:4rem}.letter-header{text-align:center;border-bottom:none;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1.5rem}.letter-greeting{text-align:center;font-size:2.5rem}.letter-body{font-size:1.2rem}.letter-closing-section{text-align:center;font-size:2rem}.letter-signature{align-items:center}.signature-name{font-size:3rem}}@media (width<=480px){.nav__brand{font-size:1.5rem}.hero__title{font-size:3.2rem}.hero__subtitle{padding:8px 15px;font-size:1rem}.letter-paper{border-radius:16px;padding:2.5rem 1.5rem;box-shadow:0 15px 30px #ff084426}.letter-indent{margin-right:5px;padding:2px 6px;font-size:2rem}.letter-paragraph{text-align:left;margin-bottom:1rem;line-height:1.7}.flower-container{width:100px!important;height:100px!important}.baby-illustration-wrapper{width:160px!important;height:160px!important;margin-top:.5rem!important}.corner-decoration{font-size:1.5rem}.top-left{top:1rem;left:1rem}.top-right{top:1rem;right:1rem}.bottom-left{bottom:1rem;left:1rem}.memory-photo{border-width:8px 8px 25px;width:220px}.welcome-quote{font-size:2.8rem}}.letter-container{margin:0 auto;max-width:650px!important}.animated-letter{display:block;transition:transform .4s cubic-bezier(.175,.885,.32,1.275)!important;transform:rotate(-2.5deg)!important}.animated-letter:hover{transform:rotate(-.5deg)translateY(-8px)!important}.letter-paper{padding:3rem 4rem!important}.letter-body{font-size:1.25rem!important}.letter-greeting,.letter-indent{font-size:2.4rem!important}@media (width<=768px){.letter-container{max-width:90%!important}.letter-paper{padding:2.5rem!important}.letter-body{font-size:1.15rem!important}}@media (width<=480px){.animated-letter{transform:rotate(-1.5deg)!important}.letter-paper{border-radius:16px!important;padding:2rem 1.5rem!important}.letter-body{font-size:1.1rem!important;line-height:1.6!important}.letter-greeting{font-size:2rem!important}.letter-indent{padding:2px 4px!important;font-size:1.8rem!important}}.animated-letter{transition:transform .5s cubic-bezier(.175,.885,.32,1.275),box-shadow .5s!important;transform:rotate(0)translateY(0)!important}.animated-letter:hover{transform:rotate(0)translateY(-10px)!important;box-shadow:0 40px 60px #ff084433!important}.letter-paper{-webkit-backdrop-filter:blur(25px)saturate(150%)!important;background:#fff9!important;border:1px solid #fffc!important;box-shadow:0 20px 40px #0000001a,inset 0 0 0 2px #fff6,inset 0 0 20px #fffc!important}.letter-greeting .greeting-text{display:inline-block;transform:translateZ(20px);text-shadow:1px 1px #ff758c,2px 2px #ff758c,3px 3px #ff4d6d,4px 4px #ff0844,5px 5px 15px #ff084466!important}.letter-body p{text-shadow:1px 1px 2px #fffc,2px 2px 4px #0000001a!important;color:#5c1e34!important;font-weight:600!important}.letter-indent{text-shadow:1px 1px #ffb199,2px 2px #ff758c,3px 3px #ff4d6d,4px 4px 10px #ff084480!important}.signature-name{text-shadow:1px 1px #ff758c,2px 2px #ff4d6d,3px 3px 15px #ff084499!important}.memory-photo{border:8px solid #ffffffe6!important;border-bottom-width:25px!important;box-shadow:0 15px 30px #00000026!important}
