<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Private Access</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">

    <link rel="stylesheet" href="/static/css/password.css">
    <script>
        // Reset semua state audio & session saat masuk password
        sessionStorage.removeItem("musicTime");
    </script>
    
</head>
<body>
    <audio id="bg-music" preload="auto">
        <source src="/static/media/music.mp3" type="audio/mpeg">
    </audio>
<div class="screen">
    <div class="glass-card">
        <p class="hint">Only for the one who owns my heart</p>

        <h1>Private Access</h1>

        <form method="post">
            <input 
                type="password" 
                name="password" 
                placeholder="Tanggal Ulang Tahun Kamu..." 
                required
            >
            <button type="submit">Unlock Story</button>
        </form>

        <p class="sub">
            ✨ Ciee.. yang sedang berulang tahun hari ini.
        </p>
    </div>
</div>

<script>
// document.addEventListener("click", () => {
//     if (!document.fullscreenElement) {
//         document.documentElement.requestFullscreen().catch(()=>{});
//     }
    
// });
document.addEventListener("click", () => {
    const audio = document.getElementById("bg-music");
    if (audio && audio.paused) {
        audio.play().catch(() => {});
    }
}, { once: true });
</script>

<script src="/static/js/audio.js"></script>

</body>
</html>
