body {margin:0; font-family:"Poppins",sans-serif; background:#000; color:white; text-align:center; overflow-x:hidden;}
.password-screen{padding:50px;}
input{padding:12px; width:200px; border-radius:6px; border:none;}
button{padding:10px 20px; margin-top:15px; background:#ffd700; color:black; border:none; border-radius:8px; cursor:pointer;}
button:hover{transform:scale(1.05);}
.error{color:red; margin-top:10px;}
.hidden{display:none;}
.hero{height:100vh; display:flex; flex-direction:column; justify-content:center; background-size:cover; background-position:center; position:relative;}
.waves{position:relative; overflow:hidden;}
.waves::after{content:""; position:absolute; bottom:0; left:0; width:200%; height:120px; background: url('bg.jpg') repeat-x; animation: wave 6s linear infinite; opacity:0.5;}
@keyframes wave{0%{transform:translateX(0);} 100%{transform:translateX(-50%);}}
.section{padding:80px 20px; animation: fade 0.7s ease-in-out;}
@keyframes fade{from{opacity:0;} to{opacity:1;}}
.poster{width:260px; margin:20px auto; filter:sepia(70%);}
.msg{margin-top:30px; font-size:22px; color:#ffd700;}
.luffy{position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); background:#111; padding:25px; border-radius:15px; border:3px solid #ffd700; text-align:center; width:320px; z-index:9999; animation:pop 0.4s ease-out;}
.luffy-img{width:180px;}
.speech{font-size:16px; padding:10px; margin-top:10px; background:#222; border-radius:10px;}
.closeBtn{margin-top:15px; padding:10px 20px; background:#ffd700; border:none; border-radius:6px; font-weight:bold; cursor:pointer;}
@keyframes pop{from{transform:translate(-50%,-50%) scale(0.4); opacity:0;} to{transform:translate(-50%,-50%) scale(1); opacity:1;}}
.secret{color:#ffd700; text-decoration:underline; cursor:pointer;}

/* Hearts animation */
.hearts span{
    position:absolute; display:block; width:20px; height:20px; background:red; clip-path: polygon(50% 0%, 61% 10%, 70% 25%, 50% 60%, 30% 25%, 39% 10%);
    animation: float 5s linear infinite;
    opacity:0.8;
}
@keyframes float{
    0%{transform:translateY(0) scale(1);}
    50%{transform:translateY(-300px) scale(1.2);}
    100%{transform:translateY(-600px) scale(1);}
}

/* Treasure chest animation */
.chest{
    font-size:60px;
    cursor:pointer;
    animation: bounce 2s infinite;
}
@keyframes bounce{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-20px);}
}body {
    font-size: 15pt;
}