:root{
    --tema:#ff69b4; /* pink romantis */
}

body{
    margin:0;
    min-height:100vh;
    background:radial-gradient(circle at top,#ffb6c1,#ff69b4);
    overflow:hidden;
    font-family:'Segoe UI',sans-serif;
    color:white;
    text-align:center;
}

.rose{
    position:fixed;
    top:-15%;
    width:30px;
    height:30px;
    background-image:url("https://takenupload.com/694cf15d8065d");
    background-size:contain;
    background-repeat:no-repeat;
    pointer-events:none;
    opacity:0.9;
    animation:roseFall linear infinite;
}

@keyframes roseFall{
    0%{transform:translateX(0) translateY(0) rotate(0deg);}
    50%{transform:translateX(40px) translateY(50vh) rotate(180deg);}
    100%{transform:translateX(-30px) translateY(120vh) rotate(360deg);}
}

.container{
    position:relative;
    top:50%;
    transform:translateY(-50%);
    z-index:2;
    padding:0 10px;
}

.name{
    font-size:6vw;
    font-weight:bold;
    color:var(--tema);
    margin-bottom:12px;
    text-shadow:0 0 25px var(--tema);
}

.photo{
    width:50vw;
    height:50vw;
    max-width:280px;
    max-height:280px;
    border-radius:50%;
    object-fit:cover;
    border:5px solid var(--tema);
    box-shadow:0 0 35px var(--tema);
    transition:opacity 1s;
}

.love-btn{
    margin-top:15px;
    font-size:10vw;
    background:none;
    border:none;
    cursor:pointer;
    animation:pulse 1.5s infinite;
}

@keyframes pulse{
    50%{transform:scale(1.25);}
}

.lyrics{
    margin-top:20px;
    max-width:90%;
    height:25vh;
    overflow-y:auto;
    margin-left:auto;
    margin-right:auto;
    font-size:4.5vw;
    line-height:1.6;
    scroll-behavior:smooth;
}

.lyric-line{
    opacity:0.4;
    transition:0.5s;
}

.lyric-line.active{
    opacity:1;
    color:var(--tema);
    text-shadow:0 0 15px var(--tema);
    transform:scale(1.05);
}