body {
    font-family: 'Poppins', sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    position: relative;

    background-color: #ffc0cb;
    background-image:
        repeating-linear-gradient(45deg, rgba(255,255,255,0.15) 0 10px, transparent 10px 20px),
        repeating-linear-gradient(-45deg, rgba(255,255,255,0.15) 0 10px, transparent 10px 20px);
}

/* Sprinkles */
#sprinkles { position: fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:0; }
.sprinkle { position:absolute; border-radius:2px; opacity:0.8; }

/* Floating images */
.floating-image{ position:fixed; pointer-events:none; z-index:999; transition: transform 0.3s ease; }
#floating-character { left:20px; top:50%; transform:translateY(-50%); animation: floatCharacter 3s ease-in-out infinite alternate; }
#floating-character3 {
    position: absolute; /* so it can overlap the paper block */
    right: 30px;        /* distance from right edge */
    bottom: -70px;      /* negative value moves it "into" the block */
    width: 330px;       /* size */
    z-index: 1005;      /* above the paper block (paper z-index is 999) */
    transition: transform 0.3s ease;
}

#floating-character3:hover {
    transform: scale(1.5); /* hover effect */
}
{ right:10px; bottom:5px; width:380px; animation: floatCharacter 4s ease-in-out infinite alternate-reverse; }

@keyframes floatCharacter{0%{transform:translateY(0);}100%{transform:translateY(-15px);}}
.floating-image:hover{ transform: scale(1.5); cursor:pointer; }

#button { position: fixed; bottom: 200px; left: 50px; width: 150px; z-index: 1000; }
#button2 { position: fixed; top: 50px; left: 200px; width: 120px; z-index: 1000; }
#button3 {position: fixed; top: 200px; right: 50px; width: 150px; z-index: 1000; }

/* Per-word text hover */
.hover-scale-text span { display:inline-block; transition: transform 0.3s ease; }
.hover-scale-text span:hover { transform: scale(1.1); }

/* Ribbons */
.ribbon{ position:fixed; width:200%; height:200px; opacity:0.3; border-radius:50%; background:linear-gradient(90deg, #ffb6c1, #ffd1dc, #fff0f8, #ffc0cb); z-index:1; animation: wave 15s infinite linear; }
.ribbon1{ top:150px; transform:rotate(10deg); }
.ribbon2{ top:350px; transform:rotate(-10deg); animation-delay:7s; }
@keyframes wave{0%{transform:translateX(-50%) rotate(0deg);}100%{transform:translateX(50%) rotate(360deg);}}

/* Candy garland */
#candy-garland { position:fixed; top:0; left:50%; transform:translateX(-50%); width:100%; height:auto; z-index:9999; text-align:center; }
.garland-candy { transition: transform 0.3s ease; display:inline-block; }
.garland-candy:hover{ transform: scale(1.5); cursor:pointer; }

/* Swirls */
#swirls-container{ position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:1003; }
#swirls-container .swirl{ position:absolute; border-radius:50%; opacity:0.6; border-width:3px; animation: swirlDrift linear infinite; }
@keyframes swirlDrift{0%{transform:translate(0,0) rotate(0deg);}50%{transform:translate(10px,-15px) rotate(180deg);}100%{transform:translate(-10px,0) rotate(360deg);}}

/* Border decorations */
.border-deco{ position:absolute; width:100px; height:auto; z-index:1004; }
.top-left{ top:-50px; left:-50px; }
.top-right{ top:-50px; right:-50px; }

/* Falling stars */
#star-container{ position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:1000; }
.falling-star{ position:absolute; opacity:0.9; animation:fall linear infinite; }
@keyframes fall{0%{transform:translateY(-20px) translateX(0) rotate(0deg);opacity:0.6;}50%{opacity:1;}100%{transform:translateY(110vh) translateX(50px) rotate(360deg);opacity:0.8;}}

/* Mouse-follow sparkles */
#mouse-trail-container .trail{ position:absolute; pointer-events:none; user-select:none; animation:fadeTrail 0.5s forwards; }
@keyframes fadeTrail{0%{opacity:1;}100%{opacity:0; transform:translateY(-10px);}}

/* Paper block */
.paper{
    position:relative;
    background-color:#ffffff;
    border-radius:30px;
    border:6px solid #ffb6c1;
    border-style:double;
    border-image: repeating-linear-gradient(45deg,#ffb6c1,#ffb6c1 15px,#ffe4f0 15px,#ffe4f0 30px) 40;
    max-width:800px;
    min-height:250px;
    margin:200px auto 80px auto; /* margin-top increased for garland gap */
    padding:40px;
    box-shadow:0 8px 20px rgba(0,0,0,0.1);
    text-align:center;
    z-index:999;
}

/* Heading animation - pastel fade */
.animated-heading {
    font-family:'Baloo 2', cursive;
    font-weight:700;
    font-size:4em;
    margin-bottom:40px;
    animation: pastelFade 10s infinite alternate;
    text-shadow:2px 2px 8px rgba(212,108,160,0.4);
}
@keyframes pastelFade {
    0% { color: #ffc0cb; }
    25% { color: #d8b2ff; }
    50% { color: #add8ff; }
    75% { color: #a0ffc4; }
    100% { color: #fffacd; }
}

.paper main p{ font-size:1.3em; line-height:1.6; color:#333; transition: font-size 0.3s ease; }
.paper footer{ margin-top:30px; font-size:1em; color:#555; transition: font-size 0.3s ease; }




























  