:root{--night: #1a080e;--wine: #2a0f17;--wine2: #3d1520;--rose: #e8798f;--rose2: #f4a7b5;--red: #c42a49;--gold: #d9b26f;--gold2: #f0d9a8;--cream: #fbefe9;--paper: #fff8f1;--ink: #3a1d24;--script: "Great Vibes", cursive;--serif: "Cormorant Garamond", Georgia, serif;--hand: "Caveat", cursive;--safe-b: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}html.locked,html.locked body{overflow:hidden;height:100%}body{margin:0;min-height:100svh;background:radial-gradient(120% 60% at 50% 0%,#4a1626 0%,transparent 60%),radial-gradient(90% 50% at 50% 100%,#3a1020 0%,transparent 70%),var(--night);background-attachment:fixed;color:var(--cream);font-family:var(--serif);font-size:19px;line-height:1.6;overflow-x:hidden;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}img{max-width:100%;display:block}.script{font-family:var(--script);font-weight:400;line-height:1.15}#fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60}#stars{position:fixed;inset:0;pointer-events:none;z-index:0}#stars i{position:absolute;border-radius:50%;background:#fff;animation:twinkle var(--d, 3s) ease-in-out infinite;animation-delay:var(--dl, 0s);opacity:.2}@keyframes twinkle{50%{opacity:.9;transform:scale(1.4)}}#progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:70;pointer-events:none}#progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--rose));box-shadow:0 0 10px var(--rose)}#progress i{position:absolute;top:-7px;left:0;font-style:normal;font-size:14px;color:var(--rose2);transform:translate(-50%);text-shadow:0 0 8px var(--rose)}main{position:relative;z-index:1}.sec{position:relative;padding:18vh 20px 12vh;max-width:560px;margin:0 auto}.intro{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px 20px calc(24px + var(--safe-b));background:radial-gradient(80% 60% at 50% 45%,#4b1828 0%,var(--wine) 55%,var(--night) 100%);touch-action:none;transition:opacity 1.1s ease,transform 1.1s ease,visibility 0s 1.1s}.intro.gone{opacity:0;transform:scale(1.08);visibility:hidden;pointer-events:none}.intro-top{margin:0;font-size:15px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold2);opacity:0;animation:up .9s .3s ease forwards}.intro-name{margin:0 0 4vh;font-family:var(--script);font-weight:400;font-size:clamp(64px,20vw,110px);line-height:1.1;background:linear-gradient(180deg,#fff3ea,var(--rose2) 70%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 24px rgba(232,121,143,.45));opacity:0;animation:up 1.1s .6s ease forwards}.intro-hint{margin:5vh 0 0;font-size:17px;font-style:italic;color:var(--rose2);opacity:0;animation:up .9s 1.4s ease forwards}.intro-hint .beat{display:inline-block;color:var(--rose);margin-right:4px}@keyframes up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.env{position:relative;width:min(80vw,340px);aspect-ratio:3 / 2;padding:0;border:0;background:none;perspective:1000px;opacity:0;animation:up 1s 1s ease forwards,float 4.5s 2s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(1deg)}}.env>span{position:absolute}.env-back{inset:0;border-radius:10px;background:#e2bcaa;box-shadow:0 40px 70px -25px #000000bf,0 0 0 1px #ffffff0f}.env-letter{left:7%;right:7%;top:7%;height:86%;z-index:1;border-radius:6px;background:var(--paper);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 6px 20px #0000002e;transition:transform 1.1s cubic-bezier(.2,.8,.2,1) .6s}.env-letter em{font-size:13px;letter-spacing:.2em;color:#a26b74;font-style:normal}.env-letter b{font-family:var(--script);font-weight:400;font-size:54px;line-height:1.1;color:var(--red)}.env-letter small{font-size:15px;font-style:italic}.env-front{inset:0;z-index:2;border-radius:10px;background:linear-gradient(165deg,#f8e6dc,#eccdbd);clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%)}.env-flap{left:0;right:0;top:0;height:58%;z-index:3;background:linear-gradient(180deg,#f4dbcf,#e3bba9);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transition:transform .8s cubic-bezier(.6,0,.3,1),z-index 0s .4s}.env-seal{left:50%;top:58%;z-index:4;width:23%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 35% 30%,#e0516d,#9a1430 70%);box-shadow:0 4px 10px #00000059,inset 0 0 0 4px #00000014;display:grid;place-items:center;transition:opacity .35s,transform .5s}.env-seal svg{width:52%;fill:#ffdce1d9}.opening .env{animation:none;opacity:1}.opening .env-seal{opacity:0;transform:translate(-50%,-50%) scale(1.8)}.opening .env-flap{transform:rotateX(180deg);z-index:0}.opening .env-letter{transform:translateY(-58%)}.opening .intro-hint{opacity:0!important;transition:opacity .3s}.letter-sec{padding-top:12vh}.paper{position:relative;color:var(--ink);padding:44px 26px 36px;border-radius:4px;background:repeating-linear-gradient(180deg,transparent 0 33px,rgba(162,107,116,.16) 33px 34px),linear-gradient(180deg,#fffaf4,#fbeee4);box-shadow:0 30px 60px -20px #000000b3,0 0 0 1px #0000000a;transform:rotate(-1deg) translateY(40px);opacity:0;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity 1s}.paper.in{transform:rotate(-1deg);opacity:1}.tape{position:absolute;top:-14px;left:50%;width:110px;height:30px;transform:translate(-50%) rotate(-3deg);background:#f0d9a8bf;box-shadow:0 2px 4px #0000001a}.hitap{font-size:44px;color:var(--red);margin:0 0 14px}.paper .line{margin:0 0 16px;font-size:19.5px;opacity:0;transform:translateY(12px);transition:opacity .8s,transform .8s;transition-delay:calc(.35s + var(--i) * .45s)}.paper.in .line{opacity:1;transform:none}.vurgu{font-style:italic;font-weight:600;font-size:22px!important;color:var(--red);text-align:center;padding:6px 0}.kapanis{margin-top:24px!important;text-align:right;font-style:italic}.imza{text-align:right;font-size:46px!important;color:var(--red);margin:0!important}.hint{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:9vh;color:var(--rose2);font-style:italic;font-size:17px}.hint svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;animation:bounce 1.6s ease-in-out infinite}@keyframes bounce{50%{transform:translateY(8px);opacity:.5}}.sec-head{text-align:center;margin-bottom:8vh}.sec-head h2{margin:4px 0 0;font-size:clamp(48px,14vw,72px);color:var(--cream);text-shadow:0 0 30px rgba(232,121,143,.35)}.kicker{margin:0;font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}.sub{margin:10px 0 0;font-style:italic;color:var(--rose2);font-size:18px}.reveal:not(.paper){opacity:0;transform:translateY(36px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal.in:not(.paper){opacity:1;transform:none}.notes-sec{padding-bottom:16vh}.trail{position:absolute;top:34vh;bottom:10vh;left:50%;width:2px;transform:translate(-50%);background-image:linear-gradient(rgba(232,121,143,.4) 50%,transparent 0);background-size:2px 12px}.trail-fill{position:absolute;left:0;top:0;width:100%;height:calc(var(--p, 0) * 100%);background:linear-gradient(var(--gold),var(--rose));box-shadow:0 0 10px var(--rose)}.trail-heart{position:absolute;left:50%;top:calc(var(--p, 0) * 100%);transform:translate(-50%,-50%);font-style:normal;color:var(--rose);font-size:22px;text-shadow:0 0 12px var(--rose)}.note{position:relative;z-index:1;width:84%;padding:30px 22px 22px;margin-bottom:4vh;background:linear-gradient(170deg,#fff6ea,#f6e3cf);color:var(--ink);border-radius:3px;box-shadow:0 24px 40px -18px #000000b3}.note.left{margin-right:auto}.note.right{margin-left:auto}.note.reveal{transform:translateY(50px) rotate(calc(var(--r) * 3))}.note.reveal.in{transform:rotate(var(--r))}.pin{position:absolute;top:10px;left:50%;width:16px;height:16px;border-radius:50%;transform:translate(-50%);background:radial-gradient(circle at 35% 30%,#ff8aa0,var(--red));box-shadow:0 3px 4px #00000059}.note-yil{margin:0;font-size:42px;color:var(--red)}.note-tarih{margin:0;font-size:13px;letter-spacing:.12em;color:#9a6a70}.note h3{margin:10px 0 4px;font-family:var(--hand);font-size:30px;font-weight:700;line-height:1.1}.note-metin{margin:0;font-family:var(--hand);font-size:25px;line-height:1.3}.whisper{position:relative;z-index:1;text-align:center;font-style:italic;color:var(--rose2);margin:0 0 4vh;font-size:18px}.reasons{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.reason{padding:0;border:0;background:none;aspect-ratio:1;perspective:800px;transition-delay:calc(var(--i) * .08s)!important}.reason-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.3,1.4,.5,1)}.reason.open .reason-in{transform:rotateY(180deg)}.reason-front,.reason-back{position:absolute;inset:0;border-radius:18px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:grid;place-items:center}.reason-front{background:linear-gradient(160deg,#ffffff14,#ffffff05);border:1px solid rgba(240,217,168,.25)}.reason-front svg{width:62%;fill:var(--rose);filter:drop-shadow(0 6px 14px rgba(232,121,143,.55));animation:heartbeat 1.8s ease-in-out infinite;animation-delay:calc(var(--i) * .2s)}.reason-front b{position:absolute;font-family:var(--serif);font-size:30px;color:#fff;top:50%;left:50%;transform:translate(-50%,-58%)}.reason-back{transform:rotateY(180deg);padding:14px;background:linear-gradient(160deg,var(--paper),#f6dfd3);color:var(--ink);font-family:var(--hand);font-size:22px;line-height:1.2;text-align:center}@keyframes heartbeat{0%,to{transform:scale(1)}15%{transform:scale(1.1)}30%{transform:scale(.97)}45%{transform:scale(1.06)}}.beat{animation:heartbeat 1.6s ease-in-out infinite}.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.tile{padding:16px 4px 12px;text-align:center;border-radius:16px;background:linear-gradient(170deg,#ffffff17,#ffffff05);border:1px solid rgba(217,178,111,.45);box-shadow:inset 0 1px #ffffff1a,0 18px 30px -18px #000c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.tile b{display:block;font-size:clamp(34px,10vw,48px);font-weight:500;line-height:1;color:var(--gold2);font-variant-numeric:tabular-nums}.tile b.tick{animation:tick .45s ease}@keyframes tick{0%{transform:translateY(-6px);opacity:.3}to{transform:none;opacity:1}}.tile span{display:block;margin-top:6px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--rose2)}.cd-done-title,.cd-done-text,.clock-sec.done .cd-title,.clock-sec.done .cd{display:none}.clock-sec.done .cd-done-title{display:block}.clock-sec.done .cd-done-text{display:block;text-align:center;font-size:22px;font-style:italic;color:var(--cream)}.together{margin-top:10vh;text-align:center;padding:28px 18px;border-radius:22px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.together-main{margin:10px 0 18px;font-size:20px;line-height:1.9}.together-main b{font-size:30px;font-weight:500;color:var(--rose2);font-variant-numeric:tabular-nums}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stats div{padding:10px 2px;border-top:1px solid rgba(217,178,111,.3)}.stats b{display:block;font-size:22px;font-weight:600;color:var(--gold2);font-variant-numeric:tabular-nums}.stats span{font-size:14px;color:var(--rose2)}.gallery-sec{max-width:980px;padding-left:14px;padding-right:14px}.gallery{columns:2;column-gap:14px}@media(min-width:700px){.gallery{columns:3;column-gap:22px}}.polaroid{break-inside:avoid;margin:0 0 18px;padding:8px 8px 0;background:#fffaf3;border-radius:2px;box-shadow:0 16px 26px -14px #000c}.polaroid.reveal{transform:translateY(40px) rotate(var(--r))}.polaroid.reveal.in{transform:rotate(var(--r))}.polaroid button{display:block;width:100%;padding:0;border:0;background:#e9ddd2}.polaroid img{width:100%;height:auto}.polaroid figcaption{padding:6px 2px 2px;text-align:center;font-family:var(--hand);font-size:20px;color:var(--ink);line-height:1.1}.polaroid:after{content:"";display:block;height:22px}.polaroid:has(figcaption):after{height:8px}.final-sec{min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding-bottom:calc(14vh + var(--safe-b))}.big-heart{margin:0;font-size:72px;line-height:1;color:var(--rose);text-shadow:0 0 40px var(--rose)}.final-title{margin:0;font-size:clamp(64px,19vw,104px);background:linear-gradient(180deg,#fff3ea,var(--rose2) 65%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}.final-text{margin:10px auto 34px;max-width:30ch;font-size:21px;font-style:italic}.btn{padding:16px 28px;border:0;border-radius:999px;font-size:19px;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--rose),var(--red));box-shadow:0 14px 30px -10px #c42a49cc,inset 0 1px #ffffff4d;transition:transform .15s}.btn:active{transform:scale(.95)}.sent{min-height:1.6em;margin:12px 0 0;color:var(--rose2);font-style:italic;font-size:17px}.sign{margin:8vh 0 0;display:flex;flex-direction:column;align-items:center}.sign .script{font-size:48px;color:var(--gold2)}.sign small{font-size:14px;letter-spacing:.2em;color:var(--rose2)}.lb{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;background:#100408f0;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;touch-action:pan-y}.lb.open{opacity:1;visibility:visible;transition:opacity .3s}.lb figure{margin:0;padding:10px 10px 0;background:#fffaf3;max-width:92vw;transform:scale(.94);transition:transform .3s}.lb.open figure{transform:none}.lb img{max-width:calc(92vw - 20px);max-height:74svh;width:auto;height:auto}.lb figcaption{min-height:40px;padding:6px 4px 8px;text-align:center;font-family:var(--hand);font-size:22px;color:var(--ink)}.lb-x{position:absolute;top:calc(10px + env(safe-area-inset-top,0px));right:12px;width:46px;height:46px;border:0;border-radius:50%;background:#ffffff1a;font-size:30px;line-height:1}.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:64px;border:0;background:#ffffff14;font-size:34px;border-radius:10px;z-index:1}.lb-prev{left:6px}.lb-next{right:6px}.lb-count{position:absolute;bottom:calc(14px + var(--safe-b));left:0;right:0;margin:0;text-align:center;font-size:15px;letter-spacing:.2em;color:var(--rose2)}.music{position:fixed;right:16px;bottom:calc(16px + var(--safe-b));z-index:75;width:54px;height:54px;padding:0;border:1px solid rgba(217,178,111,.5);border-radius:50%;background:#2a0f17d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;box-shadow:0 10px 24px -8px #000c;opacity:0;pointer-events:none;transition:opacity .6s}.music.show{opacity:1;pointer-events:auto}.disc{position:absolute;inset:7px;border-radius:50%;background:repeating-radial-gradient(circle,#2a0f17 0 2px,#3d1520 2px 4px);box-shadow:inset 0 0 0 9px transparent}.disc:after{content:"";position:absolute;inset:35%;border-radius:50%;background:var(--rose)}.music.on .disc{animation:spin 4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.music:not(.on):after{content:"";position:absolute;width:70%;height:2px;background:var(--rose2);transform:rotate(-45deg)}.music-toast{position:fixed;left:50%;bottom:calc(26px + var(--safe-b));z-index:75;margin:0;padding:8px 16px;border-radius:999px;background:#2a0f17e6;border:1px solid rgba(217,178,111,.4);font-size:16px;color:var(--gold2);transform:translate(-50%,20px);opacity:0;transition:opacity .5s,transform .5s;pointer-events:none;white-space:nowrap}.music-toast.show{opacity:1;transform:translate(-50%)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.2s!important}}.yt{position:fixed;left:-400px;bottom:0;width:200px;height:200px;opacity:0;pointer-events:none}