@import "https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&family=Nunito:wght@300;400;600;700;800&family=Pacifico&display=swap";:root{--red:#e8274b;--red-light:#ff6b8a;--red-deep:#c01e3f;--pink:#ffb3c6;--pink-soft:#ffe0e8;--pink-pale:#fff0f3;--cream:#fff8fa;--white:#fff;--text-dark:#3d1520;--text-mid:#7a3045;--text-soft:#b05070;--shadow:#e8274b40;--font-cute:"Dancing Script", cursive;--font-main:"Nunito", sans-serif;--font-display:"Pacifico", cursive}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-main);background:var(--cream);color:var(--text-dark);min-height:100vh;overflow-x:hidden}#confetti-canvas{pointer-events:none;z-index:9000;width:100%;height:100%;position:fixed;inset:0}#hearts-bg{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.heart-float{opacity:0;-webkit-user-select:none;user-select:none;animation:linear infinite float-up;position:absolute;bottom:-50px}.section{justify-content:center;align-items:center;min-height:100vh;padding:4rem 1.5rem;display:flex;position:relative;overflow:hidden}.section:before{content:"";pointer-events:none;background:radial-gradient(circle,#e8274b14 0%,#0000 70%);border-radius:50%;width:500px;height:500px;position:absolute;top:-100px;right:-100px}.section:after{content:"";pointer-events:none;background:radial-gradient(circle,#ff6b8a1a 0%,#0000 70%);border-radius:50%;width:350px;height:350px;position:absolute;bottom:-80px;left:-80px}.section-inner{text-align:center;z-index:1;width:100%;max-width:900px;position:relative}.section-badge,.badge-top{background:linear-gradient(135deg, var(--red), var(--red-light));color:#fff;letter-spacing:1px;box-shadow:0 4px 15px var(--shadow);border-radius:999px;margin-bottom:1.2rem;padding:.45rem 1.2rem;font-size:.85rem;font-weight:700;animation:2s ease-in-out infinite pulse-badge;display:inline-block}.section-title{font-family:var(--font-cute);color:var(--red-deep);margin-bottom:.75rem;font-size:clamp(2rem,5vw,3.2rem);line-height:1.2}.section-sub{color:var(--text-soft);margin-bottom:2.5rem;font-size:1.05rem;line-height:1.6}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes float-up{0%{opacity:.8;transform:translateY(0)rotate(0)}to{opacity:0;transform:translateY(-110vh)rotate(360deg)}}@keyframes bounce-dot{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@keyframes slide-in-left{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scroll-mouse{0%{opacity:1;top:6px}to{opacity:0;top:18px}}@keyframes pulse-badge{0%,to{box-shadow:0 4px 15px var(--shadow)}50%{box-shadow:0 4px 30px var(--shadow), 0 0 0 6px #e8274b1f}}.loading-screen{z-index:9999;background:linear-gradient(135deg,#ff6b8a 0%,#e8274b 50%,#c01e3f 100%);justify-content:center;align-items:center;transition:opacity .8s,visibility .8s;display:flex;position:fixed;inset:0}.loading-hidden{opacity:0;visibility:hidden}.loading-content{text-align:center}.loading-heart{font-size:4rem;animation:.8s ease-in-out infinite heartbeat;display:block}.loading-text{color:#fff;letter-spacing:.5px;margin-top:1rem;font-size:1.1rem;font-weight:600}.loading-dots{justify-content:center;gap:8px;margin-top:1rem;display:flex}.loading-dots span{background:#fff;border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite bounce-dot}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}.hero-section{background:linear-gradient(160deg,#fff0f3 0%,#ffe0e8 40%,#ffccd8 100%)}.hero-inner{text-align:center;z-index:1;width:100%;max-width:800px;position:relative}.hero-char{margin-bottom:1rem;animation:3s ease-in-out infinite float;display:inline-block}.girl-img{border-radius:50%;width:240px;height:auto;display:block;box-shadow:0 15px 40px #e8274b4d,0 0 0 6px #ffb6c166}.hero-title{flex-direction:column;align-items:center;gap:.2rem;margin-bottom:1.2rem;display:flex}.hero-title .line1{font-family:var(--font-cute);color:var(--text-soft);font-size:clamp(2rem,6vw,3.5rem);animation:.8s .3s both slide-in-left}.hero-title .line2{font-family:var(--font-display);background:linear-gradient(135deg, var(--red), var(--red-light), var(--red-deep));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:clamp(3rem,10vw,6.5rem);line-height:1;animation:.8s .5s both slide-in-right}.hero-title .line2 sup{vertical-align:super;font-size:.45em}.hero-title .line3{font-family:var(--font-cute);color:var(--red-deep);font-size:clamp(2rem,6vw,3.5rem);animation:.8s .7s both slide-in-left}.hero-sub{color:var(--text-mid);margin-bottom:2rem;font-size:1.1rem;line-height:1.8;animation:.8s .9s both fade-up}.btn-start{background:linear-gradient(135deg, var(--red), var(--red-light));color:#fff;font-family:var(--font-main);cursor:pointer;box-shadow:0 8px 25px var(--shadow);border:none;border-radius:999px;padding:1rem 2.5rem;font-size:1.1rem;font-weight:700;transition:transform .2s,box-shadow .2s;animation:.8s 1.1s both fade-up;display:inline-block}.btn-start:hover{box-shadow:0 14px 35px var(--shadow);transform:translateY(-4px)scale(1.04)}.scroll-indicator{opacity:.6;flex-direction:column;align-items:center;gap:.4rem;margin-top:2.5rem;animation:1s 1.4s both fade-up;display:flex}.mouse{border:2px solid var(--red-light);border-radius:12px;width:24px;height:40px;position:relative}.mouse:after{content:"";background:var(--red-light);border-radius:2px;width:4px;height:8px;animation:2s ease-in-out infinite scroll-mouse;position:absolute;top:6px;left:50%;transform:translate(-50%)}.scroll-indicator p{color:var(--text-soft);letter-spacing:1px;font-size:.75rem}@media (width<=600px){.girl-img{width:160px}}.countdown-section{background:linear-gradient(160deg,#fff5f7 0%,#ffe8ed 60%,#ffd6e0 100%)}.countdown-grid{flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex}.cd-box{-webkit-backdrop-filter:blur(16px);text-align:center;background:#ffffff8c;border:2px solid #ffb6c199;border-radius:28px;min-width:110px;padding:1.5rem 2rem;transition:transform .3s;box-shadow:0 8px 32px #e8274b26}.cd-box:hover{transform:translateY(-6px)scale(1.04)}.cd-num{font-family:var(--font-display);background:linear-gradient(135deg, var(--red), var(--red-light));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:3.5rem;line-height:1;display:block}.cd-label{letter-spacing:1.5px;text-transform:uppercase;color:var(--text-soft);margin-top:.4rem;font-size:.8rem;font-weight:700;display:block}.cd-sep{font-family:var(--font-display);color:var(--red-light);margin-top:-.5rem;font-size:3rem;line-height:1}.birthday-arrived{background:linear-gradient(135deg, var(--red), var(--red-light));color:#fff;font-family:var(--font-cute);box-shadow:0 10px 30px var(--shadow);border-radius:28px;margin-top:2rem;padding:1.5rem 2rem;font-size:1.6rem;line-height:1.6;animation:1s ease-in-out infinite heartbeat}@media (width<=600px){.countdown-grid{gap:.6rem}.cd-box{min-width:75px;padding:1rem .8rem}.cd-num{font-size:2.5rem}.cd-sep{font-size:2rem}}.cake-section{background:linear-gradient(160deg,#fff0f3 0%,#ffe0e8 60%,#ffccd8 100%)}.cake-wrapper{cursor:pointer;border-radius:24px;outline:none;transition:transform .3s;display:inline-block;position:relative;overflow:hidden;box-shadow:0 20px 50px #e8274b40,0 0 0 4px #ffb6c14d}.cake-wrapper:hover:not(.cake-blown){transform:scale(1.04)}.cake-wrapper:focus-visible{outline:3px dashed var(--red-light);outline-offset:8px;border-radius:12px}.cake-img{width:300px;height:auto;animation:4s ease-in-out infinite float;display:block}.candles-overlay{pointer-events:none;position:absolute;top:10px;left:50%;transform:translate(-50%)}.flame-row{justify-content:center;gap:8px;display:flex}.flame{font-size:1.4rem;animation:.5s ease-in-out infinite alternate flicker}.wish-pop{background:linear-gradient(135deg, var(--red), var(--red-light));color:#fff;white-space:nowrap;box-shadow:0 8px 20px var(--shadow);border-radius:999px;padding:.8rem 1.4rem;font-size:.95rem;font-weight:700;animation:.4s cubic-bezier(.175,.885,.32,1.275) pop-in;position:absolute;top:-70px;left:50%;transform:translate(-50%)}.wish-pop:after{content:"";border-left:8px solid #0000;border-right:8px solid #0000;border-top:10px solid var(--red-light);position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.cake-hint{color:var(--text-soft);margin-top:1.2rem;font-size:.95rem;transition:opacity .5s}@keyframes flicker{0%{transform:scaleY(1)rotate(-2deg)}to{transform:scaleY(1.15)rotate(2deg)}}@keyframes pop-in{0%{opacity:0;transform:translate(-50%)scale(.5)}to{opacity:1;transform:translate(-50%)scale(1)}}@media (width<=600px){.cake-img{width:220px}.wish-pop{white-space:normal;text-align:center;width:240px;padding:.6rem 1rem;font-size:.8rem}}.message-section{background:linear-gradient(160deg,#fef2f4 0%,#fde8ec 50%,#fcd4db 100%)}.cards-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin-top:1rem;display:grid}.msg-card{-webkit-backdrop-filter:blur(16px);text-align:center;opacity:0;background:#ffffff8c;border:2px solid #ffb6c199;border-radius:28px;padding:2rem 1.5rem;transition:transform .3s,box-shadow .3s;transform:translateY(40px);box-shadow:0 10px 30px #e8274b1f}.msg-card.visible{animation:.6s forwards fade-up-in}.msg-card:hover{transform:translateY(-8px)scale(1.02);box-shadow:0 18px 45px #e8274b38}.card-icon{margin-bottom:1rem;font-size:2.5rem;animation:3s ease-in-out infinite float;display:block}.msg-card h3{font-family:var(--font-cute);color:var(--red-deep);margin-bottom:.75rem;font-size:1.5rem}.msg-card p{color:var(--text-mid);font-size:.97rem;line-height:1.7}@keyframes fade-up-in{to{opacity:1;transform:translateY(0)}}@media (width<=600px){.cards-grid{grid-template-columns:1fr}}.letter-section{background:linear-gradient(160deg,#fff0f3 0%,#ffccd8 50%,#ffb3c6 100%)}.letter-envelope{max-width:580px;margin:0 auto}.envelope-front{background:linear-gradient(135deg, var(--red), var(--red-light));text-align:center;box-shadow:0 15px 40px var(--shadow);cursor:pointer;border-radius:28px;outline:none;padding:3rem 2rem;transition:transform .3s}.envelope-front:hover{transform:scale(1.03)rotate(-1deg)}.envelope-front:focus-visible{outline-offset:6px;outline:3px dashed #fff}.env-heart{font-size:4rem;animation:1.2s ease-in-out infinite heartbeat;display:block}.env-label{color:#ffffffe6;margin-top:1rem;font-size:1rem;font-weight:600}.letter-paper{text-align:left;border:2px solid var(--pink);background:#fff;border-radius:28px;padding:2.5rem;animation:.6s unfold;box-shadow:0 15px 50px #0000001f}.letter-header{border-bottom:2px dashed var(--pink);flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.letter-date,.letter-to{color:var(--text-soft);font-size:.85rem;font-weight:600}.letter-body p{font-family:var(--font-cute);color:var(--text-mid);font-size:1.1rem;line-height:1.9}.letter-sign{font-family:var(--font-cute);margin-top:.5rem;color:var(--red)!important;font-size:1.5rem!important}@keyframes unfold{0%{opacity:0;transform:scaleY(.4)translateY(-30px)}to{opacity:1;transform:scaleY(1)translateY(0)}}@media (width<=600px){.letter-header{flex-direction:column}.letter-paper{padding:1.5rem}}.wishes-section{background:linear-gradient(160deg,#fff5f7 0%,#ffe8ed 60%,#ffd6e0 100%)}.wishes-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;display:grid}.wish-item{-webkit-backdrop-filter:blur(12px);text-align:center;opacity:0;background:#ffffff8c;border:1.5px solid #ffb6c199;border-radius:18px;padding:1.2rem 1rem;transition:transform .25s,box-shadow .25s;transform:translateY(20px)scale(.95);box-shadow:0 4px 16px #e8274b1a}.wish-item.visible{animation:.5s cubic-bezier(.175,.885,.32,1.275) forwards pop-up}.wish-item:hover{transform:translateY(-5px)scale(1.04);box-shadow:0 12px 28px #e8274b33}.wish-num{font-family:var(--font-display);background:linear-gradient(135deg, var(--red), var(--red-light));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.4rem;font-size:2rem;display:block}.wish-icon{margin-bottom:.4rem;font-size:1.6rem;display:block}.wish-text{color:var(--text-mid);font-size:.88rem;line-height:1.5}@keyframes pop-up{to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=600px){.wishes-grid{grid-template-columns:repeat(2,1fr)}}.final-section{background:linear-gradient(160deg,#e8274b 0%,#c01e3f 50%,#9a0f2c 100%)}.final-inner{color:#fff}.big-number{font-family:var(--font-display);opacity:.15;-webkit-user-select:none;user-select:none;pointer-events:none;color:#fff;font-size:clamp(6rem,20vw,14rem);line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.final-title{font-family:var(--font-cute);color:#fff;margin-bottom:1rem;font-size:clamp(2.5rem,7vw,4.5rem);line-height:1.3;animation:3s ease-in-out infinite float}.final-sub{color:#ffffffe0;margin-bottom:2rem;font-size:1.1rem;line-height:1.8}.final-hearts{justify-content:center;gap:1rem;margin-bottom:2rem;font-size:1.8rem;display:flex}.final-hearts span{animation:2s ease-in-out infinite float}.btn-celebrate{color:var(--red-deep);font-family:var(--font-main);cursor:pointer;background:#fff;border:none;border-radius:999px;padding:1.1rem 3rem;font-size:1.2rem;font-weight:800;transition:transform .2s,box-shadow .2s;display:inline-block;box-shadow:0 10px 30px #00000040}.btn-celebrate:hover{transform:translateY(-5px)scale(1.05);box-shadow:0 18px 40px #00000059}.btn-celebrate:active{transform:scale(.97)}