@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&family=Noto+Serif+Bengali:wght@500;600;700&display=swap');
:root{--bg:#080614;--bg2:#120b25;--pink:#ff8fbe;--pink2:#ff5e9d;--lav:#bda7ff;--gold:#ffd990;--white:#fff8fd;--muted:#c9bdd1;--glass:rgba(255,255,255,.065);--line:rgba(255,255,255,.12)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--white);font-family:"Hind Siliguri",system-ui,sans-serif}body{overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 20%,rgba(130,73,189,.23),transparent 38%),radial-gradient(circle at 20% 80%,rgba(255,91,158,.08),transparent 32%);pointer-events:none;z-index:-3}
#stars,#hearts,#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:-1}.star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;opacity:.65;animation:twinkle 3s infinite ease-in-out}.float-heart{position:absolute;font-size:18px;animation:floatUp 6s linear forwards;opacity:0}
.progress{position:fixed;top:0;left:0;width:100%;height:3px;background:rgba(255,255,255,.05);z-index:50}.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--pink2),var(--lav),var(--gold));transition:width .8s}
.music-control{position:fixed;right:16px;top:18px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid var(--line);backdrop-filter:blur(12px);z-index:51;color:var(--pink);font-size:20px}
main{position:relative;min-height:100svh}.scene{min-height:100svh;padding:82px 22px 45px;display:none;align-items:center;justify-content:center;flex-direction:column;text-align:center;max-width:760px;margin:auto;position:relative}.scene.active{display:flex;animation:sceneIn .8s ease both}
.eyebrow{letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:var(--lav);margin:0 0 14px}.tiny{font-size:12px;color:#8f8299;margin-top:18px}.sub,.muted{color:var(--muted);line-height:1.8}.sub{font-size:17px}
h1,h2{margin:0 0 18px;font-weight:700;line-height:1.2}h1{font-family:"Noto Serif Bengali",serif;font-size:clamp(42px,12vw,76px);text-shadow:0 0 40px rgba(255,120,180,.2)}h1 em{font-style:normal;color:var(--pink);background:linear-gradient(90deg,#ff9fc8,#d6b9ff);-webkit-background-clip:text;background-clip:text;color:transparent}h2{font-size:clamp(29px,8vw,46px);font-family:"Noto Serif Bengali",serif}
.primary{border:1px solid rgba(255,180,215,.25);background:linear-gradient(135deg,rgba(255,105,166,.22),rgba(156,118,255,.16));color:#fff;padding:14px 21px;border-radius:999px;font:600 16px "Hind Siliguri";box-shadow:0 10px 40px rgba(255,77,150,.12);cursor:pointer;transition:.25s;backdrop-filter:blur(12px);margin-top:18px}.primary:hover,.primary:active{transform:translateY(-2px) scale(1.02);box-shadow:0 15px 50px rgba(255,77,150,.25)}.hidden{display:none!important}
.orb{width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,#ffd4e6 0 3%,#ff76b3 8%,#8d5cff 34%,transparent 67%);filter:blur(1px);box-shadow:0 0 90px rgba(255,95,174,.35);animation:breathe 4s infinite;margin-bottom:24px}
.envelope{width:170px;height:115px;border-radius:12px;background:linear-gradient(135deg,#ff92bb,#a775e8);position:relative;box-shadow:0 25px 80px rgba(255,86,160,.22);margin-bottom:30px;cursor:pointer}.seal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:#fff;color:#d84d8e;display:grid;place-items:center;font:700 23px serif;box-shadow:0 4px 20px #7b3562}
.choice-grid{width:min(100%,540px);display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 4px}.choice{padding:17px 12px;border:1px solid var(--line);border-radius:18px;background:var(--glass);color:white;font:500 16px "Hind Siliguri";cursor:pointer}.choice.selected{border-color:var(--pink);background:rgba(255,112,174,.15);box-shadow:0 0 30px rgba(255,112,174,.12)}
.garden{width:min(100%,520px);display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:22px 0}.flower{font-size:31px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.04);border:1px solid var(--line);cursor:pointer;transition:.35s}.flower.open{transform:scale(1.08);background:rgba(255,137,190,.12);border-color:var(--pink)}.flower-msg{position:fixed;inset:0;background:rgba(5,3,13,.82);backdrop-filter:blur(16px);display:grid;place-items:center;padding:25px;z-index:60}.flower-msg>div{max-width:520px;background:linear-gradient(145deg,#211333,#110b20);border:1px solid var(--line);padding:32px 24px;border-radius:28px;box-shadow:0 30px 100px rgba(0,0,0,.5);font-size:20px;line-height:1.8}
.timeline{width:100%;text-align:left;position:relative;margin:20px 0}.timeline:before{content:"";position:absolute;left:17px;top:0;bottom:0;width:1px;background:linear-gradient(var(--pink),transparent)}.memory{position:relative;padding:0 0 28px 52px}.memory:before{content:"";position:absolute;left:11px;top:6px;width:13px;height:13px;border-radius:50%;background:var(--pink);box-shadow:0 0 20px var(--pink)}.memory-card{background:var(--glass);border:1px solid var(--line);border-radius:20px;padding:18px}.memory-card h3{margin:0 0 7px;font-size:20px}.memory-card p{margin:0;color:var(--muted);line-height:1.75}
.hunt-area{width:100%;height:280px;position:relative;border:1px solid var(--line);border-radius:28px;background:radial-gradient(circle at 30% 30%,rgba(255,120,180,.1),transparent 30%),rgba(255,255,255,.025);overflow:hidden;margin:18px 0}.hidden-heart{position:absolute;font-size:26px;cursor:pointer;transition:.25s;filter:drop-shadow(0 0 10px rgba(255,100,170,.6))}.hidden-heart:hover{transform:scale(1.3)}.counter{color:var(--gold);font-weight:600}
#quizBox{width:100%;max-width:560px}.quiz-question{background:var(--glass);border:1px solid var(--line);padding:22px;border-radius:22px}.quiz-question h3{font-size:22px;margin:0 0 15px}.quiz-option{display:block;width:100%;padding:13px;margin:9px 0;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.035);color:#fff;text-align:left;font:500 15px "Hind Siliguri";cursor:pointer}.quiz-option.correct{border-color:#73e6b0;background:rgba(76,210,148,.12)}.quiz-option.wrong{border-color:#ff8b9b;background:rgba(255,80,110,.1)}
.balloons{height:360px;width:100%;position:relative;overflow:hidden}.balloon{position:absolute;width:64px;height:80px;border-radius:52% 52% 48% 48%;display:grid;place-items:center;font-size:20px;cursor:pointer;animation:sway 3s infinite ease-in-out}.balloon:after{content:"";position:absolute;bottom:-48px;width:1px;height:50px;background:rgba(255,255,255,.3)}.balloon.popped{animation:pop .3s forwards}.balloon:nth-child(1){background:#ff7fae}.balloon:nth-child(2){background:#9e82ff}.balloon:nth-child(3){background:#ffd47c}.balloon:nth-child(4){background:#78d9e7}.balloon:nth-child(5){background:#f39ac5}.balloon:nth-child(6){background:#b28eff}
.gift{width:160px;height:140px;position:relative;margin-bottom:35px;cursor:pointer;filter:drop-shadow(0 25px 50px rgba(255,95,160,.22))}.gift-body{position:absolute;inset:20px 0 0;background:linear-gradient(135deg,#ff6eaa,#8e65db);border-radius:10px;display:grid;place-items:center;font-size:70px}.gift-lid{position:absolute;left:-8px;right:-8px;top:8px;height:36px;border-radius:8px;background:#ff8aba;z-index:2}.gift.open .gift-body{animation:giftOpen .8s forwards}.gift.open .gift-lid{animation:lidOpen .8s forwards}
.letter-card{width:100%;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid var(--line);border-radius:25px;padding:28px 22px;text-align:left;line-height:2;font-size:17px;box-shadow:0 25px 80px rgba(0,0,0,.22);min-height:280px}.letter-card #letterText{white-space:pre-line}.signature{text-align:right;color:var(--pink);margin-top:20px;font-weight:600}
.cake-wrap{position:relative;margin-bottom:20px}.cake{font-size:105px;filter:drop-shadow(0 15px 40px rgba(255,150,100,.2))}.flames{position:absolute;top:10px;left:50%;transform:translateX(-50%);font-size:17px;white-space:nowrap;animation:flicker .5s infinite alternate}
.finale{background:radial-gradient(circle at 50% 45%,rgba(255,87,158,.13),transparent 35%)}.final-card{max-width:560px;margin:18px 0;padding:22px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.05);line-height:1.9}.final-card p{margin:0 0 12px;white-space:pre-line}.final-card strong{color:var(--pink)}
.keepsake{padding-bottom:80px}.certificate{width:min(100%,470px);padding:35px 25px;border-radius:28px;border:1px solid rgba(255,217,144,.35);background:linear-gradient(145deg,rgba(255,217,144,.07),rgba(255,255,255,.03));box-shadow:0 25px 100px rgba(0,0,0,.3)}.certificate h2{color:var(--gold)}.seal-big{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:20px auto;background:rgba(255,125,180,.12);border:1px solid rgba(255,125,180,.4);font-size:31px}.cert-line{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:22px 0}.small{color:var(--muted);line-height:1.8}
@keyframes twinkle{0%,100%{opacity:.2}50%{opacity:1}}@keyframes breathe{50%{transform:scale(1.08);filter:blur(2px)}}@keyframes sceneIn{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}@keyframes floatUp{0%{transform:translateY(20px) scale(.7);opacity:0}15%{opacity:.8}100%{transform:translateY(-100vh) rotate(25deg);opacity:0}}@keyframes sway{50%{transform:translateY(-8px) rotate(3deg)}}@keyframes pop{to{transform:scale(1.8);opacity:0}}@keyframes giftOpen{to{transform:scale(1.2);opacity:.15}}@keyframes lidOpen{to{transform:translateY(-70px) rotate(-8deg);opacity:0}}@keyframes flicker{to{transform:translateX(-50%) scale(1.15);filter:brightness(1.3)}}
@media(max-width:430px){.scene{padding-left:18px;padding-right:18px}.garden{gap:9px}.flower{font-size:25px}.balloon{width:56px;height:70px}.letter-card{font-size:16px}.music-control{right:12px}.choice-grid{gap:9px}}


/* Popy Birthday v2 — relationship-first visual layer */
:root{--pink:#ff83b6;--pink2:#ff4f9a;--lav:#b9a2ff;--gold:#ffe09a;--cyan:#8ee9ff;--glass:rgba(255,255,255,.075)}
body{background:
 radial-gradient(circle at 15% 12%,rgba(255,93,160,.13),transparent 28%),
 radial-gradient(circle at 88% 78%,rgba(117,90,255,.13),transparent 30%),#07050f}
.scene{width:min(100%,860px);padding-left:20px;padding-right:20px}
.hero-scene{overflow:hidden}
.hero-orbit{position:absolute;width:min(82vw,440px);height:min(82vw,440px);border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 100px rgba(255,83,157,.08);animation:spin 24s linear infinite;pointer-events:none}
.hero-orbit:before{content:"";position:absolute;inset:16%;border:1px dashed rgba(255,255,255,.08);border-radius:50%}
.hero-orbit span{position:absolute;font-size:18px;filter:drop-shadow(0 0 12px rgba(255,130,190,.5))}
.hero-orbit span:nth-child(1){left:-7px;top:48%}.hero-orbit span:nth-child(2){right:12%;top:4%}.hero-orbit span:nth-child(3){left:13%;bottom:4%}
.mini-badge,.card-tag{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.045);padding:7px 12px;border-radius:999px;font-size:10px;letter-spacing:.15em;color:#cfc3dc;margin-bottom:16px;backdrop-filter:blur(12px)}
.secret-card,.dream-card{width:min(100%,650px);padding:30px;border-radius:28px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));box-shadow:0 25px 80px rgba(0,0,0,.32);backdrop-filter:blur(18px)}
.secret-icon,.dream-icon{font-size:48px;margin-bottom:12px;filter:drop-shadow(0 0 20px rgba(255,130,190,.3))}
.secret-card p,.dream-card p{color:#d1c6d7;line-height:1.9;font-size:16px}
.connection-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;width:min(100%,620px);margin:10px 0 24px}
.connection-card{padding:22px 14px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));transition:.25s;display:flex;flex-direction:column;gap:5px}
.connection-card:hover{transform:translateY(-4px);border-color:rgba(255,131,182,.35)}
.connection-card span{font-size:30px}.connection-card b{font-size:17px}.connection-card small{color:#a99caf}
.quote{max-width:650px;color:#e9dce9;font-family:"Noto Serif Bengali",serif;font-size:17px;line-height:1.8;padding:18px 20px;border-left:2px solid var(--pink);background:rgba(255,255,255,.025);border-radius:0 16px 16px 0}
.dream-card{margin-bottom:22px;text-align:left}.dream-card h2{text-align:center}.dream-line{display:flex;align-items:center;gap:12px;padding:13px 15px;margin:8px 0;border-radius:15px;background:rgba(255,255,255,.045);color:#eee0ec}.dream-line span{font-size:20px}
.keep-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.keep-grid span{padding:12px;border-radius:14px;background:rgba(255,255,255,.05);font-size:13px;color:#d9cedd}
.certificate{width:min(100%,620px);padding:34px 24px;border:1px solid rgba(255,215,150,.25);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));box-shadow:0 30px 90px rgba(0,0,0,.4);position:relative;overflow:hidden}
.certificate:before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.07);border-radius:22px;pointer-events:none}
.seal-big{width:76px;height:76px;margin:4px auto 18px;border-radius:50%;display:grid;place-items:center;font-size:32px;background:radial-gradient(circle,rgba(255,144,190,.3),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.15);box-shadow:0 0 45px rgba(255,83,157,.2)}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:520px){.secret-card,.dream-card{padding:23px 18px;border-radius:24px}.connection-grid{gap:9px}.connection-card{padding:17px 10px}.connection-card span{font-size:26px}.connection-card b{font-size:15px}.connection-card small{font-size:11px}.certificate{padding:28px 17px}}

/* Treat chapter — playful but premium */
.treat-scene{align-items:center;justify-content:center;text-align:center}
.treat-card{width:min(100%,720px);padding:clamp(26px,6vw,54px);border:1px solid rgba(240,173,255,.22);border-radius:30px;background:linear-gradient(145deg,rgba(38,20,55,.82),rgba(13,10,27,.94));box-shadow:0 24px 80px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.05)}
.treat-icon{font-size:64px;filter:drop-shadow(0 0 20px rgba(255,150,220,.3));margin-bottom:12px}
.treat-lead{font-size:clamp(18px,3.8vw,24px);line-height:1.75;margin:20px auto;max-width:600px}
.treat-receipt{margin:26px auto;padding:20px;max-width:500px;border-radius:22px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);text-align:left}
.treat-receipt>div:not(.receipt-line){display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:center;padding:10px 4px}
.treat-receipt span{grid-row:span 2;font-size:28px}.treat-receipt b{font-size:17px}.treat-receipt small{opacity:.65;margin-top:3px}.receipt-line{height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);margin:8px 0}
.treat-note{opacity:.78;line-height:1.8;margin:20px auto 26px;max-width:560px}
#treatConfirm{color:#ffd7f3;min-height:22px;margin-top:14px}
.quiz-count{font-size:13px;color:#d9b9ff;margin-bottom:8px}.quiz-result{text-align:center}.result-icon{font-size:42px;margin-bottom:8px}
.quiz-option:disabled{cursor:default;opacity:.96}.quiz-option.correct{box-shadow:0 0 0 1px rgba(115,230,176,.12),0 8px 24px rgba(115,230,176,.08)}

/* Audited v5 — wish visual + safer mobile presentation */
.wish-orbit{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;margin-bottom:18px;background:radial-gradient(circle,rgba(255,224,154,.2),rgba(255,255,255,.025) 58%,transparent 70%);border:1px solid rgba(255,217,144,.18);box-shadow:0 0 55px rgba(255,160,205,.12);animation:wishPulse 2.8s ease-in-out infinite}
.wish-orbit span{font-size:34px;filter:drop-shadow(0 0 18px rgba(255,200,150,.5))}
@keyframes wishPulse{50%{transform:scale(1.06);box-shadow:0 0 75px rgba(255,160,205,.18)}}
