@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=DM+Sans:wght@400;500;600&display=swap');
:root{--pink:#f7b9d2;--rose:#e989b0;--cream:#fff6f4;--ink:#24192d;--night:#0f0b1e;--glass:rgba(19,12,35,.48)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:'DM Sans',sans-serif;background:var(--night);color:var(--cream)}button,input{font:inherit}button{cursor:pointer}#app{height:100dvh}header{position:fixed;z-index:20;top:0;left:0;right:0;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;pointer-events:none}.brand{font-size:12px;letter-spacing:.22em;font-weight:600;text-shadow:0 2px 20px #000}.brand span{color:var(--pink);font-size:18px}.icon{pointer-events:auto;border:1px solid #ffffff2a;background:#120c20aa;color:#fff;border-radius:50%;width:40px;height:40px}.screen{position:absolute;inset:0;opacity:0;visibility:hidden;transform:scale(1.012);transition:opacity .28s ease,transform .32s ease;contain:layout paint}.screen.active{opacity:1;visibility:visible;transform:none}.world{position:absolute;inset:0;overflow:hidden;background:#100b1d}.world-bg{position:absolute;inset:-2%;background-position:center;background-size:cover;background-repeat:no-repeat;transform:scale(1.03)}.veil{position:absolute;inset:0;background:linear-gradient(90deg,#0b0714b8 0%,#0b071436 55%,#0b07148f 100%)}.veil.light{background:linear-gradient(90deg,#150a19a8,#150a1935 55%,#150a1950)}.center-card,.place-card,.library-card,.lake-card,.secret-card,.finale-card{position:absolute;z-index:4}.center-card{left:7%;top:50%;transform:translateY(-50%);max-width:520px}.kicker{font-size:10px;letter-spacing:.25em;font-weight:600;color:#ffd4e3;margin:0 0 12px}.center-card h2,.place-card h2,.library-card h2,.lake-card h2,.secret-card h2,.finale-card h2{font:600 clamp(42px,6vw,76px)/.95 'Cormorant Garamond',serif;margin:0 0 18px}.center-card p,.place-card p,.library-card>p,.lake-card p,.secret-card p,.finale-card p{font-size:15px;line-height:1.7;color:#fffafcce;max-width:520px}.primary{border:0;border-radius:999px;padding:14px 24px;background:linear-gradient(135deg,#fff,#ffd8e7);color:#3a2030;font-weight:700;letter-spacing:.08em;box-shadow:0 10px 35px #0004;transition:transform .18s ease}.primary:active{transform:scale(.97)}.small{padding:10px 18px;font-size:12px}.ghost{border:1px solid #ffffff40;background:#ffffff0d;color:#fff;border-radius:999px;padding:11px 18px;margin-top:16px}.place-card{left:6%;top:14%;max-width:420px}.stat{display:inline-block;margin-top:8px;padding:9px 14px;border:1px solid #ffffff30;border-radius:999px;background:#120c1e66}.rose{position:absolute;z-index:6;border:0;background:transparent;font-size:42px;filter:drop-shadow(0 6px 12px #0008);transition:transform .2s}.rose:active{transform:scale(1.25)}.r1{left:25%;top:64%}.r2{left:66%;top:48%}.r3{left:78%;top:73%}.win{position:absolute;z-index:10;left:50%;bottom:12%;transform:translateX(-50%);background:#160e25e8;border:1px solid #ffffff2c;padding:14px 18px;border-radius:18px;text-align:center;backdrop-filter:blur(8px)}.win .primary{display:block;margin:10px auto 0}.hidden{display:none!important}.hotspot{position:absolute;z-index:5;border:0;background:#ffffff14;color:#fff;border-radius:20px;width:62px;height:62px;font-size:30px;box-shadow:0 10px 30px #0005}.hs1{left:23%;bottom:27%}.hs2{left:44%;bottom:22%}.hs3{right:27%;bottom:30%}.hs4{right:17%;top:35%}.hs5{left:57%;top:45%}.toast{position:absolute;z-index:12;left:50%;bottom:9%;transform:translateX(-50%);background:#160d22ee;padding:14px 18px;border-radius:16px;border:1px solid #ffffff30;opacity:0;transition:opacity .2s}.toast.show{opacity:1}.library-card{left:8%;top:15%;max-width:640px}.books{display:flex;gap:12px;margin:22px 0}.books button{width:130px;height:150px;border:1px solid #ffffff2c;border-radius:12px;background:linear-gradient(135deg,#7d3f60,#24142f);color:#fff;font:32px 'Cormorant Garamond';box-shadow:0 15px 30px #0005}.books span{display:block;font:600 11px 'DM Sans';margin-top:14px}.book-text{max-width:520px;min-height:90px;padding:18px;border-left:2px solid var(--pink);background:#160d2277;border-radius:0 14px 14px 0;line-height:1.7}.lake-card{left:7%;top:13%}.stars{position:absolute;inset:0;z-index:5}.star{position:absolute;border:0;background:#fff8;border-radius:50%;width:28px;height:28px;color:#fff;box-shadow:0 0 20px 6px #fff7}.star.done{background:#ffd8e8;box-shadow:0 0 25px 9px #f8b8d877}.star-lines{position:absolute;inset:0;z-index:4}.secret-card,.finale-card{left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;max-width:560px;width:90%;padding:38px 30px;border:1px solid #ffffff2c;border-radius:28px;background:#120b20a8;backdrop-filter:blur(10px)}.reveal{margin-top:22px;padding-top:20px;border-top:1px solid #ffffff24}.heart-big{font-size:76px;color:#ffc5dc;text-shadow:0 0 35px #f48db6}.reveal h3{font:600 48px 'Cormorant Garamond';margin:0}.reveal span{color:#fff9}.finale-card h2{font-size:64px}.final-gift{margin-top:22px;padding-top:18px;border-top:1px solid #ffffff25}.gift{font-size:72px;animation:float 2.6s ease-in-out infinite}.final-butterfly{right:12%;top:24%}.butterfly{position:absolute;width:70px;height:62px;z-index:8;filter:drop-shadow(0 7px 13px #0007);animation:fly 7s ease-in-out infinite}.butterfly i{position:absolute;display:block}.wl,.wr{width:29px;height:38px;background:radial-gradient(circle at 65% 55%,#fff5 0 6%,transparent 7%),linear-gradient(145deg,#ffe2ef,#d982b6);border:1px solid #ffffff99}.wl{left:3px;top:2px;border-radius:80% 20% 55% 35%;transform:rotate(18deg)}.wl.b{top:27px;left:9px;width:24px;height:28px;transform:rotate(35deg)}.wr{right:3px;top:2px;border-radius:20% 80% 35% 55%;transform:rotate(-18deg)}.wr.b{top:27px;right:9px;width:24px;height:28px;transform:rotate(-35deg)}.butterfly .body{left:31px;top:18px;width:8px;height:29px;background:#3a2030;border-radius:50%}.b-gate{left:12%;top:25%;animation-duration:9s}.secret{right:15%;top:64%;border:0;background:transparent}.mini-butterfly{font-size:46px}.modal{position:absolute;z-index:20;inset:0;background:#09061199;display:grid;place-items:center}.modal-box{position:relative;max-width:420px;width:90%;padding:30px;background:#180d24f5;border:1px solid #ffffff2c;border-radius:24px;text-align:center;box-shadow:0 30px 80px #0008}.close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:28px}.gate{position:fixed;inset:0;z-index:100;background:#090613;overflow:hidden;display:grid;place-items:center}.gate-sky{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#643a76 0,#201533 35%,#090613 75%)}.gate-sky:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:75px 75px;opacity:.22}.moon{position:absolute;width:180px;height:180px;border-radius:50%;background:#fff4df;box-shadow:0 0 80px #ffd8b866;right:14%;top:10%}.gate-door{position:absolute;width:min(330px,55vw);height:min(520px,72vh);bottom:-3%;left:50%;transform:translateX(-50%);border-radius:170px 170px 10px 10px;background:linear-gradient(90deg,#28162e,#58354e,#211329);border:8px solid #b77b5f;box-shadow:0 0 0 3px #f4c39d55,0 0 100px #e89bc055;overflow:hidden}.door-glow{position:absolute;inset:10px;background:radial-gradient(circle,#ffe8f4 0,#df9cbd 18%,#5d3766 55%,transparent 72%);opacity:.75}.door-panel{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:120px;height:150px;border:2px solid #e9c09b88;border-radius:60px 60px 8px 8px;display:flex;align-items:center;justify-content:center;gap:9px;color:#ffe7d2;background:#25162c77}.door-panel span{font:600 42px 'Cormorant Garamond'}.door-panel small{color:#f6b7d0;font-size:22px}.gate-copy{position:absolute;z-index:5;top:9%;left:50%;transform:translateX(-50%);text-align:center;width:92%}.gate-copy h1{font:600 clamp(55px,10vw,100px) 'Cormorant Garamond';margin:0;text-shadow:0 5px 30px #0008}.gate-copy p:not(.kicker){font-size:16px;color:#fffbd9}.pass{display:flex;justify-content:center;gap:8px;margin-top:20px}.pass input{width:120px;text-align:center;border:1px solid #ffffff44;background:#fff1;color:#fff;padding:13px;border-radius:999px;outline:none;letter-spacing:.35em}.pass button{border:1px solid #ffffff55;background:#ffe0ed;color:#311d2c;border-radius:999px;padding:12px 18px;font-weight:700}.gate-copy small{display:block;color:#ffb7ca;margin-top:10px}nav{position:fixed;z-index:30;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px}.nav{width:42px;height:42px;border-radius:50%;border:1px solid #ffffff35;background:#10091dcc;color:#fff;font-size:25px}#dots{display:flex;gap:6px}.dot{width:7px;height:7px;border:0;border-radius:50%;background:#ffffff55}.dot.active{width:20px;border-radius:99px;background:#ffd1e3}@keyframes fly{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(35px,-25px) rotate(5deg)}50%{transform:translate(8px,28px) rotate(-4deg)}75%{transform:translate(-30px,-10px) rotate(5deg)}}@keyframes float{50%{transform:translateY(-9px)}}@media(max-width:700px){header{padding:0 14px}.brand{font-size:9px}.world-bg{background-position:center}.center-card{left:7%;right:7%;top:53%;max-width:none}.center-card h2{font-size:47px}.center-card p,.place-card p,.library-card>p,.lake-card p,.secret-card p,.finale-card p{font-size:13px}.place-card{left:7%;top:12%;right:7%}.place-card h2{font-size:44px}.r1{left:16%;top:63%}.r2{left:61%;top:52%}.r3{left:72%;top:75%}.secret{right:8%;top:67%}.books{gap:7px}.books button{width:30vw;height:125px}.library-card{left:6%;right:6%;top:12%}.book-text{font-size:13px}.lake-card{left:7%;top:11%;right:7%}.secret-card,.finale-card{padding:28px 20px}.finale-card h2{font-size:48px}.moon{width:110px;height:110px;right:8%;top:12%}.gate-copy{top:7%}.gate-door{width:230px;height:400px}.pass{flex-direction:column;align-items:center}.pass input{width:130px}.pass button{width:max-content}.b-gate{left:7%;top:42%;transform:scale(.75)}.final-butterfly{right:5%;top:17%}.nav{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Cinematic world backgrounds */
.hero-world .world-bg{background-image:url('assets/night-garden-mobile.jpg')}.garden-world .world-bg{background-image:url('assets/garden-roses-mobile.jpg')}.cafe-world .world-bg{background-image:url('assets/cozy-cafe-mobile.jpg')}.library-world .world-bg{background-image:url('assets/night-garden-mobile.jpg');filter:saturate(.8) brightness(.72)}.lake-world .world-bg{background-image:url('assets/night-garden-mobile.jpg');filter:saturate(1.05) brightness(.62)}.secret-world .world-bg{background-image:url('assets/04-cafe.jpg');filter:saturate(.8) brightness(.55)}.finale-world .world-bg{background-image:url('assets/10-ending-romantic.jpg');filter:saturate(1.05) brightness(.68)}
@media(min-width:701px){.hero-world .world-bg{background-image:url('assets/night-garden.jpg')}.garden-world .world-bg{background-image:url('assets/garden-roses.jpg')}.cafe-world .world-bg{background-image:url('assets/cozy-cafe.jpg')}.library-world .world-bg{background-image:url('assets/night-garden.jpg')}.lake-world .world-bg{background-image:url('assets/night-garden.jpg')}.secret-world .world-bg{background-image:url('assets/04-cafe.jpg')}.finale-world .world-bg{background-image:url('assets/10-ending-romantic.jpg')}}
.gate.open .gate-door{animation:doorOpen .65s ease forwards}.gate.open .gate-copy{animation:fadeAway .4s ease forwards}@keyframes doorOpen{to{transform:translateX(-50%) scale(1.18);opacity:0;filter:brightness(2)}}@keyframes fadeAway{to{opacity:0;transform:translateX(-50%) translateY(-10px)}}