:root{--black: #0a0a0c;--black-2: #121216;--gold: #d4af37;--gold-soft: #c9a961;--gold-light: #ecd9a0;--ivory: #f4eee1;--muted: rgba(244, 238, 225, .55);--paper: #f7f0e0;--ink: #2a2117;--serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;--script: "Great Vibes", "Brush Script MT", cursive;--sans: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--black);color:var(--ivory);font-family:var(--serif);-webkit-font-smoothing:antialiased;overflow-x:hidden}.stage{position:relative;min-height:100vh;background:radial-gradient(1200px 700px at 50% -10%,rgba(212,175,55,.09),transparent 60%),radial-gradient(900px 600px at 85% 110%,rgba(212,175,55,.05),transparent 60%),var(--black);overflow:hidden}.noise{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}.dust{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.dust span{position:absolute;bottom:-14px;border-radius:50%;background:radial-gradient(circle,var(--gold-light) 0%,var(--gold) 55%,transparent 75%);box-shadow:0 0 8px 1px #d4af3773;animation-name:floatUp;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes floatUp{0%{transform:translateY(0);opacity:0}7%{opacity:1}88%{opacity:.9}to{transform:translateY(-108vh);opacity:0}}.intro{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,4vh,40px);padding:32px 20px;text-align:center}.eyebrow{margin:0;font-family:var(--sans);font-size:.72rem;font-weight:400;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);animation:fadeDown 1.2s .2s ease both}.name{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,9vw,4.6rem);line-height:1.05;letter-spacing:.02em;color:var(--ivory);animation:fadeDown 1.2s .4s ease both}.name-gold{background:linear-gradient(110deg,#8a6d3b,#d4af37 30%,#f5e3ae,#d4af37 70%,#8a6d3b);background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:fadeDown 1.2s .4s ease both,shimmer 7s linear infinite}@keyframes shimmer{to{background-position:220% center}}.envelope-scene{cursor:pointer;outline:none;display:flex;flex-direction:column;align-items:center;gap:26px;animation:fadeDown 1.2s .6s ease both}.envelope-scene:hover .envelope,.envelope-scene:focus-visible .envelope{transform:translateY(-6px)}.envelope{position:relative;width:min(330px,76vw);aspect-ratio:5 / 3.4;perspective:1400px;filter:drop-shadow(0 22px 36px rgba(0,0,0,.55));transition:transform .45s ease;animation:idleSway 4.5s ease-in-out infinite}@keyframes idleSway{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}.env-back,.env-front,.env-flap,.env-letter,.env-seal{position:absolute}.env-back{top:0;right:0;bottom:0;left:0;z-index:1;border-radius:8px;background:linear-gradient(160deg,#1d1c22,#141318 55%,#0e0d11);box-shadow:inset 0 0 0 1px #d4af3747,inset 0 0 26px #0009}.env-letter{left:4.5%;right:4.5%;top:5%;height:78%;z-index:2;border-radius:4px;background:linear-gradient(180deg,#fbf6e9 0%,var(--paper) 100%);box-shadow:0 6px 14px #00000059;transition:transform .95s .4s cubic-bezier(.33,1,.5,1)}.is-open .env-letter{transform:translateY(-72%);z-index:3}.env-front{top:0;right:0;bottom:0;left:0;z-index:4;border-radius:8px;background:linear-gradient(165deg,#201e25,#151419 55%,#0f0e12);clip-path:polygon(0 30%,50% 58%,100% 30%,100% 100%,0 100%);box-shadow:inset 0 0 0 1px #d4af3738,inset 0 8px 18px #00000073}.env-flap{left:0;right:0;top:0;height:52%;z-index:5;background:linear-gradient(180deg,#2a2731,#1b191f);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;transform:rotateX(0);transition:transform .85s cubic-bezier(.6,0,.4,1);box-shadow:inset 0 0 22px #00000080}.is-open .env-flap{transform:rotateX(180deg)}.env-seal{left:50%;top:42%;z-index:6;width:62px;height:62px;border-radius:50%;transform:translate(-50%,-50%);display:grid;place-items:center;font-family:var(--serif);font-size:1.5rem;font-weight:600;color:#2a2117;background:radial-gradient(circle at 35% 30%,#f5e3ae,#d4af37 45%,#9c7c2c);box-shadow:0 6px 16px #00000080,inset 0 0 0 2px #785a1459;transition:transform .7s ease,opacity .55s ease}.is-open .env-seal{opacity:0;transform:translate(-50%,-50%) scale(1.7)}.hint{margin:0;font-family:var(--sans);font-size:.74rem;font-weight:300;letter-spacing:.34em;text-transform:uppercase;color:var(--muted);animation:hintPulse 2.6s ease-in-out infinite}@keyframes hintPulse{0%,to{opacity:.45}50%{opacity:1}}.letter-phase{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:clamp(28px,6vh,64px) 20px;animation:fadeIn .8s ease both}.letter-card{position:relative;width:min(660px,100%);background:radial-gradient(110% 60% at 50% 0%,rgba(255,248,228,.9),transparent 55%),linear-gradient(180deg,#faf4e6,#f3ebd8);color:var(--ink);border-radius:6px;box-shadow:0 30px 70px #000000a6,0 0 0 1px #d4af3759;padding:clamp(28px,5.5vw,58px);animation:cardIn 1s .15s cubic-bezier(.22,1,.36,1) both}.letter-card:before{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border:1px solid rgba(212,175,55,.55);border-radius:3px;pointer-events:none}@keyframes cardIn{0%{transform:translateY(46px) scale(.94);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.letter-head{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:6px}.ornament{color:var(--gold);font-size:1rem}.letter-for{margin:0;font-size:clamp(1.3rem,4vw,1.7rem);font-weight:600;letter-spacing:.14em;text-transform:uppercase;background:linear-gradient(110deg,#8a6d3b,#c9a961,#8a6d3b);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s linear infinite}.letter-head:before,.letter-head:after{content:"";height:1px;flex:1;max-width:90px;background:linear-gradient(90deg,transparent,rgba(212,175,55,.7))}.letter-head:after{background:linear-gradient(90deg,rgba(212,175,55,.7),transparent)}.letter-body{padding-top:18px}.letter-body p{margin:0 0 16px;font-size:clamp(1.08rem,2.7vw,1.24rem);font-weight:400;line-height:1.85}.salutation{font-size:clamp(1.35rem,3.4vw,1.6rem)!important;font-weight:600;margin-bottom:12px!important}.letter-body .stagger{opacity:0;animation:fadeUp 1.1s ease forwards}@keyframes fadeUp{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}.signature{margin-top:30px}.signature p{margin:0 0 4px}.sign-name{font-family:"Noto Serif Bengali",var(--script),serif;font-size:clamp(1.6rem,5vw,2.2rem);color:#5c4619;line-height:1.4!important;transform:rotate(-2deg)}.actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background:transparent;color:var(--gold-light);font-family:var(--sans);font-size:.74rem;font-weight:400;letter-spacing:.26em;text-transform:uppercase;text-decoration:none;border:1px solid rgba(212,175,55,.5);border-radius:40px;padding:13px 26px;transition:background .3s ease,box-shadow .3s ease,color .3s ease}.btn:hover{background:#d4af371f;box-shadow:0 0 24px #d4af3747}.btn-gold{background:linear-gradient(110deg,#b8912e,#d4af37 45%,#e6c766);color:#241c06;font-weight:500;border-color:transparent}.btn-gold:hover{background:linear-gradient(110deg,#c9a136,#e0bd4f 45%,#f0d47e);box-shadow:0 0 30px #d4af3766}.star-phase{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;padding:32px 20px;text-align:center;background:radial-gradient(1000px 600px at 50% 0%,rgba(28,38,88,.55),transparent 60%),radial-gradient(700px 500px at 85% 110%,rgba(212,175,55,.1),transparent 60%),linear-gradient(180deg,#04040d,#0a0a1a);animation:fadeIn .9s ease both}.sky-stars{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.sky-stars>span:not(.shooter){position:absolute;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px #ffffff8c;animation:twinkle linear infinite}.sky-stars>span.gold{background:var(--gold-light);box-shadow:0 0 9px 2px #d4af378c}@keyframes twinkle{0%,to{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}.shooter{position:absolute;left:-12%;width:130px;height:1.5px;border-radius:2px;opacity:0;background:linear-gradient(90deg,rgba(255,255,255,.95),transparent);box-shadow:0 0 12px 2px #ffffff80;animation:shoot linear infinite}@keyframes shoot{0%{transform:translate(0) rotate(24deg);opacity:0}2%{opacity:1}18%{transform:translate(112vw,50vh) rotate(24deg);opacity:0}to{transform:translate(112vw,50vh) rotate(24deg);opacity:0}}.sky-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:18px}.sky-eyebrow{margin:0;font-family:var(--sans);font-size:.72rem;font-weight:400;letter-spacing:.42em;text-transform:uppercase;color:var(--muted)}.sky-name{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,10vw,5.2rem);line-height:1.08;letter-spacing:.02em;color:var(--ivory);text-shadow:0 0 42px rgba(212,175,55,.25)}.sky-name span{background:linear-gradient(110deg,#8a6d3b,#d4af37 30%,#f5e3ae,#d4af37 70%,#8a6d3b);background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 7s linear infinite}.sky-line{margin:0;max-width:42ch;font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,3vw,1.45rem);line-height:1.6;color:#f4eee1d1}.footnote{margin:0;font-family:var(--sans);font-size:.7rem;font-weight:300;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}.foot-heart{color:#ff3850;text-shadow:0 0 10px rgba(255,56,80,.6)}.love-burst{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;pointer-events:none}.love-core{position:absolute;left:50%;top:50%;width:76px;height:76px;transform:translate(-50%,-50%);display:grid;place-items:center;animation:coreLove 1.3s ease-out forwards}.core-heart{position:relative;z-index:2;color:#ff3850;font-size:48px;line-height:1;text-shadow:0 0 8px rgba(255,120,135,.95),0 0 22px rgba(255,56,80,.8),0 0 42px rgba(255,56,80,.45);animation:heartBeat .6s ease-in-out 2}.core-ring{position:absolute;top:3px;right:3px;bottom:3px;left:3px;border:1px solid rgba(255,120,135,.85);border-radius:50%;box-shadow:0 0 22px #ff385099,inset 0 0 16px #ff385047;animation:ringExpand 1.4s ease-out forwards}@keyframes coreLove{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}72%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}@keyframes heartBeat{0%,to{transform:scale(1)}35%{transform:scale(1.25)}}@keyframes ringExpand{0%{opacity:.9;transform:scale(.45)}to{opacity:0;transform:scale(2.25)}}.hb{position:absolute;left:50%;top:50%;line-height:1;font-family:var(--serif);color:#ff3850;text-shadow:0 0 10px rgba(255,56,80,.75),0 0 24px rgba(255,56,80,.35)}.hb.rose{color:#ff8a9b;text-shadow:0 0 10px rgba(255,138,155,.75),0 0 24px rgba(255,138,155,.35)}.hb-burst{transform:translate(-50%,-50%);animation:heartBurst 1.35s cubic-bezier(.2,.8,.3,1) forwards}@keyframes heartBurst{0%{transform:translate(-50%,-50%) scale(.4);opacity:0}16%{transform:translate(-50%,-50%) scale(1.15);opacity:1}42%{opacity:.95}to{transform:translate(calc(-50% + var(--bx)),calc(-50% + var(--by))) scale(1);opacity:0}}.hb-rise{top:auto;bottom:-50px;filter:blur(.1px);animation:heartRise linear forwards}@keyframes heartRise{0%{transform:translate(0) scale(.5);opacity:0}10%{opacity:.95}62%{opacity:.9;transform:translate(var(--sway),-38vh) scale(1)}to{transform:translate(calc(var(--sway) * -.4),-82vh) scale(1.05);opacity:0}}.reply-page{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:24px;overflow-y:auto;background:radial-gradient(900px 500px at 50% 0%,rgba(212,175,55,.08),transparent 60%),#050507;animation:fadeIn .4s ease both}.paper{--lh: clamp(2.6rem, 7vw, 3rem);position:relative;margin:auto;width:min(660px,100%);background:radial-gradient(120% 40% at 50% 0%,rgba(255,252,240,.9),transparent 60%),linear-gradient(180deg,#fdf8ec,#f5edda);border-radius:4px;box-shadow:0 40px 90px #000000bf,0 8px 22px #00000073;padding:clamp(24px,4vw,42px) clamp(20px,4vw,44px) clamp(28px,5vw,48px);text-align:left;transform:rotate(-.5deg);animation:replyIn .5s cubic-bezier(.22,1,.36,1) both}.paper:before{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:1px solid rgba(180,150,90,.4);border-radius:2px;pointer-events:none}@keyframes replyIn{0%{transform:rotate(-.5deg) translateY(26px) scale(.96);opacity:0}to{transform:rotate(-.5deg) translateY(0) scale(1);opacity:1}}.paper-head{display:flex;align-items:center;justify-content:center;gap:14px;padding-bottom:6px}.paper-title{margin:0;font-family:var(--serif);font-weight:600;font-size:clamp(1.25rem,4vw,1.6rem);letter-spacing:.12em;text-transform:uppercase;color:#8a6d3b}.paper-to{margin:18px 0 4px;font-family:var(--serif),"Noto Serif Bengali",serif;font-style:italic;font-size:clamp(1.15rem,3.4vw,1.35rem);color:#4a3d26}.paper-to-name{font-style:normal;font-weight:600;color:#6b4f1d}.paper-input{--lh: inherit;width:100%;resize:none;min-height:calc(var(--lh) * 8);border:none;outline:none;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--lh) - 1px),rgba(178,148,92,.45) calc(var(--lh) - 1px),rgba(178,148,92,.45) var(--lh));background-attachment:local;padding:10px 6px;font-family:"Caveat",var(--script),cursive;font-size:clamp(1.5rem,4.5vw,1.8rem);font-weight:500;line-height:var(--lh);color:#3b2f1c}.paper-input::placeholder{color:#64502d66}.paper-sign{margin:14px 0 22px;font-family:"Caveat",var(--script),cursive;font-size:clamp(1.5rem,4.5vw,1.8rem);color:#6b4f1d;text-align:right}.paper .actions{justify-content:flex-start}.paper .btn{color:#6b5a35;border-color:#6b5a358c}.paper .btn:hover{background:#6b5a351a;box-shadow:0 0 20px #6b5a3533}.paper-sent{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}.paper-stamp{display:grid;place-items:center;width:118px;height:118px;border:3px solid rgba(200,60,80,.6);border-radius:50%;color:#c83c50cc;font-family:var(--sans);font-size:1rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;text-indent:.34em;transform:rotate(-14deg)}.paper-sent-title{margin:6px 0 0;font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,5vw,2rem);color:#3b2f1c}.paper-sent-sub{margin:0 0 10px;font-family:var(--serif);font-style:italic;font-size:1.1rem;color:#6b5a35}.reply-error{margin:6px 0 0;font-family:var(--sans);font-size:.82rem;color:#c0392b}.reply-close{position:fixed;top:18px;right:20px;z-index:2;width:40px;height:40px;border-radius:50%;background:none;border:1px solid rgba(212,175,55,.4);color:var(--muted);font-size:1.35rem;line-height:1;cursor:pointer;transition:color .25s ease,border-color .25s ease}.reply-close:hover{color:var(--ivory);border-color:#d4af37cc}.btn:disabled{opacity:.45;cursor:not-allowed}@keyframes fadeDown{0%{transform:translateY(-14px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.dust span,.envelope,.hint,.sky-stars>span,.shooter{animation:none}.name-gold,.letter-for,.sky-name span{animation:fadeIn 1s ease both}.love-burst{display:block}.love-core,.core-heart{animation:none}.core-ring{animation:none;opacity:.7}.hb-burst{animation:none;opacity:.8}.hb-rise{animation:none;opacity:.6}.letter-body .stagger{animation:fadeIn .6s ease forwards}}@media(max-width:480px){.env-seal{width:54px;height:54px;font-size:1.3rem}}*{-webkit-tap-highlight-color:transparent}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}@supports (min-height: 100dvh){.stage,.intro,.letter-phase{min-height:100dvh}}@media(max-width:600px){.actions{width:min(320px,100%);flex-direction:column}.actions .btn{width:100%;justify-content:center;display:flex;align-items:center}.eyebrow{letter-spacing:.26em}.letter-card{padding:26px 22px}.letter-card:before{top:7px;right:7px;bottom:7px;left:7px}.letter-head:before,.letter-head:after{max-width:56px}}@media(max-width:360px){.envelope{width:min(286px,82vw)}.name{font-size:clamp(2rem,9vw,3rem)}}@media(max-height:560px)and (orientation:landscape){.intro{gap:12px;padding-top:16px;padding-bottom:16px}.name{font-size:clamp(1.7rem,6vh,2.6rem)}.envelope{width:min(230px,56vh)}.hint{display:none}}
