opal-birthday

byAwais Khan

Act as an elite senior front end developer UI UX designer motion graphics expert and emotional storytelling writer Your task is to build a fully functional cinematic romantic interactive birthday website for a girl named Minahil age 17 This website is not a normal website it is a digital emotional experience that feels like a love story unfolding scene by scene The experience must be smooth animated mobile friendly and deeply emotional --------------------------------------- 🌙 CORE STRUCTURE OF WEBSITE FLOW --------------------------------------- The website must follow this exact flow 1 PASSWORD LOCK SCREEN 2 CINEMATIC INTRO WITH TYPING EFFECT 3 STORY BASED ROMANTIC SECTIONS 4 INTERACTIVE LOVE REASONS SECTION 5 10 IMAGE ROMANTIC GALLERY 6 FINAL EMOTIONAL LOVE LETTER 7 FIREWORKS CINEMATIC ENDING Each section must appear one by one with smooth fade transition or slide transition --------------------------------------- 🔐 1 PASSWORD SCREEN DESIGN --------------------------------------- Full screen dark romantic background black with soft pink glow particles floating Centered card with soft blur glass effect Heading text must be This is only for you Minahil Subtext must be Enter the secret to open my heart world Input field must be password type Button text must be Unlock my world If correct password is entered transition smoothly to next section If wrong password show soft message Try again my love No harsh error no red alerts only soft romantic tone --------------------------------------- 🌙 2 INTRO CINEMATIC SCREEN --------------------------------------- Background must be dark gradient black to purple with floating hearts particles slowly moving upward Add typing animation text exactly Hey Minahil I made something only for you After typing completes show button Enter my world On click start background music --------------------------------------- 🎂 3 STORY SECTIONS EMOTIONAL FLOW --------------------------------------- Each section appears full screen centered with smooth fade animation SECTION ONE TITLE Happy Birthday My Jaana TEXT MUST BE EXACT Minahil meri jaana meri duniya Today is your special day and I just want you to know that you mean everything to me You are my peace my comfort my happiness --------------------------------------- SECTION TWO TITLE The First Time I Saw You TEXT MUST BE EXACT I still remember that day when you entered the class wearing a black mask Only your eyes were visible but they stopped my world for a moment Something inside me changed that day forever --------------------------------------- SECTION THREE TITLE You Changed My Life TEXT MUST BE EXACT You came into my life like calmness in chaos Without even trying you healed parts of me I never told anyone about Your presence feels like home to me --------------------------------------- SECTION FOUR TITLE Why You Are Special TEXT MUST BE EXACT Your smile is my peace Your eyes are my favorite place Your voice feels like comfort You are not just someone to me you are my everything --------------------------------------- 💗 4 INTERACTIVE LOVE REASONS SECTION --------------------------------------- Add a button Tap to know why I love you Every click shows one random line from this list You are my peace in chaos You make everything feel better Your smile fixes my worst days You are my safest place You are my home I see my future with you You are my everything Each line must appear with soft fade animation --------------------------------------- 📸 5 ROMANTIC GALLERY SECTION --------------------------------------- Title must be Our Memories Forever Show 10 images in grid layout Each image must have hover zoom effect soft glow border rounded corners Images should be named pic1 to pic10 --------------------------------------- 👑 6 FINAL EMOTIONAL SECTION --------------------------------------- This is most important emotional climax Title must be Happy Birthday My Queen TEXT MUST BE EXACT Minahil meri jaana meri duniya meri roshni You are the most beautiful part of my life You came into my world like peace like light like healing I pray Allah always protects you gives you happiness success and everything your heart wishes for One day I hope we will look back at all this together not through a screen but standing beside each other Until then just remember you are deeply loved more than you know --------------------------------------- 🎆 7 FIREWORKS ENDING SCENE --------------------------------------- After final section automatically trigger fireworks animation using canvas Fireworks must: burst from center use pink red gold colors fade smoothly feel cinematic and romantic Background becomes darker during fireworks Add final floating text This moment belongs to you --------------------------------------- 🎨 DESIGN STYLE GUIDE --------------------------------------- Theme must be romantic cinematic soft glowing aesthetic Colors black background dark purple gradients pink glow accents soft red highlights Typography modern soft elegant font like Poppins or Segoe UI UI STYLE glass morphism cards soft blur rounded edges glow effects --------------------------------------- 🎵 AUDIO --------------------------------------- Add romantic background music Must NOT autoplay until user clicks first button Music should loop continuously --------------------------------------- 💫 ANIMATIONS --------------------------------------- Typing animation in intro fade in fade out transitions between sections floating hearts continuously button hover scale effect image zoom hover effect fireworks particle system at end --------------------------------------- 📱 MOBILE RESPONSIVE --------------------------------------- Must be fully responsive centered content large touch friendly buttons optimized for mobile viewing --------------------------------------- 💖 EMOTIONAL EXPERIENCE GOAL --------------------------------------- When user opens website they must feel curiosity at password screen emotional warmth at intro nostalgia during story love connection in interactive section emotional depth in final letter WOW cinematic feeling during fireworks --------------------------------------- OUTPUT REQUIREMENT --------------------------------------- Generate complete working code in single file using HTML CSS JavaScript only No external frameworks required Ensure code is clean structured and ready to deploy directly on Netlify or Vercel