@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Tajawal:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@400;500;600&display=swap');
:root{--ink:#aa466b;--rose:#ce7b9b;--pink:#f8e4ed;--paper:#fffcfa;--sans:'DM Sans',sans-serif;--serif:'Cormorant Garamond',Georgia,serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px dashed var(--ink);outline-offset:7px}button{border:0}header{height:82px;position:absolute;z-index:20;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;pointer-events:none}header>*{pointer-events:auto}.brand{text-decoration:none;color:var(--ink);font-style:italic;font-size:21px}.brand span{margin-left:8px}.sound-button{background:transparent;display:flex;align-items:center;gap:10px;font:10px var(--sans);letter-spacing:1px;text-transform:uppercase}.sound-bars{height:18px;display:flex;gap:3px;align-items:center}.sound-bars i{width:2px;height:5px;background:#bd678c;transition:.3s}.sound-bars i:nth-child(2){height:14px}.sound-bars i:nth-child(3){height:9px}.sound-bars i:nth-child(4){height:18px}.playing .sound-bars i{animation:equalize .7s infinite alternate}.playing .sound-bars i:nth-child(2){animation-delay:.2s}.playing .sound-bars i:nth-child(3){animation-delay:.4s}.grain{pointer-events:none;position:fixed;inset:0;z-index:90;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.page{position:relative;display:none;min-height:100svh;overflow:hidden;padding:100px 5vw 130px}.page.active{display:block;animation:pageIn .8s cubic-bezier(.2,.7,.2,1) both}.eyebrow{display:block;font:9px var(--sans);text-transform:uppercase;letter-spacing:3px;line-height:1.8}.page h2{font-weight:400;font-size:clamp(40px,5vw,76px);line-height:.98;margin:16px 0 12px;letter-spacing:-2px}em{font-weight:400}.page-heading{text-align:center;margin:15px auto 35px}.page-heading p,.things-heading p{font-size:17px;line-height:1.6}.dock{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:40;display:flex;gap:5px;border:1px solid #e8cad7aa;padding:8px 12px;border-radius:60px;background:#fffdf7e6;box-shadow:0 7px 35px #9a52751a;backdrop-filter:blur(20px)}.dock button{background:transparent;border-radius:40px;min-width:69px;padding:8px 10px;transition:.3s}.dock span{font-family:Georgia;font-size:22px;display:block;height:26px}.dock small{font:9px var(--sans);letter-spacing:.5px}.dock button[aria-current=page]{background:#f4dce7}.dock button:hover{transform:translateY(-5px)}.home{height:100svh;min-height:700px;padding:0;background:radial-gradient(ellipse at 50% 90%,#fcecf1 0,transparent 45%),#fffdfb}.garland{position:absolute;inset:60px 0 auto;height:175px;pointer-events:none;transform-origin:top;animation:sway 8s ease-in-out infinite alternate}.garland svg{width:100%;height:100%;overflow:visible}.home-copy{position:absolute;inset:36% 11% auto;text-align:center;z-index:3;pointer-events:none}.home-copy .eyebrow{position:absolute;top:-80px;left:0;right:0}.birthday-title{display:flex;justify-content:space-between;align-items:center}.birthday-title h1{font-weight:400;font-size:clamp(65px,8.7vw,142px);letter-spacing:-5px;line-height:1;margin:0;color:#c57596;animation:wordIn 1.3s both}.birthday-title h1:nth-child(2){animation-delay:.15s}.birthday-sub{text-align:right;font-size:clamp(18px,2.1vw,30px);margin-top:20px;animation:wordIn 1.5s .4s both}.portrait-wrap{position:absolute;width:36%;height:58%;bottom:62px;left:32%;z-index:4;pointer-events:none;animation:portraitIn 1.6s both}.portrait-wrap img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 1px #cfb6bf20);animation:bob 5s 1.6s ease-in-out infinite}.portrait-fallback{display:none}.gift{position:absolute;left:var(--x);top:var(--y);z-index:6;width:110px;transform:rotate(var(--r));animation:float 4s var(--delay) infinite ease-in-out}.gift button{background:transparent;position:relative;width:100%;padding:0;transition:transform .3s}.gift button:hover{transform:translateY(-10px) rotate(8deg) scale(1.1)}.gift-drawing{display:block;position:relative;height:108px;width:90px;margin:auto;background:repeating-linear-gradient(90deg,transparent 0 15px,#ffffff45 15px 16px),var(--gift);border:1.5px solid #8d789f80;box-shadow:inset -12px 0 #00000008,3px 6px 0 #a8759110;border-radius:2px}.gift-drawing:before{content:'';position:absolute;inset:-7px -7px auto;height:20px;background:var(--gift);border:1.5px solid #8d789f80;box-shadow:0 4px #00000008;transition:transform .4s;transform-origin:left}.gift-drawing:after{content:'';position:absolute;top:-7px;bottom:0;width:16px;background:#fff7ecb0;left:calc(50% - 8px);border-inline:1px solid #a896a866}.gift button:hover .gift-drawing:before{transform:translateY(-14px) rotate(-8deg)}.bow{position:absolute;left:25px;top:-30px;width:44px;height:30px;z-index:2}.bow:before,.bow:after{content:'';position:absolute;top:0;width:25px;height:20px;border:2px solid #9d8ca5;border-radius:70% 70% 0 70%;transform:rotate(15deg)}.bow:after{left:23px;transform:scaleX(-1) rotate(15deg)}.gift-label{display:block;margin-top:18px;font-style:italic;font-size:16px;white-space:nowrap}.gift-mint{--gift:#bcded6}.gift-lilac{--gift:#cfcaea}.gift-rose{--gift:#f5d5df}.gift-peach{--gift:#f2c6c5}.heart-gift{position:absolute;left:calc(50% - 35px);top:23%;z-index:8;background:none;font-size:50px;color:#c57596;animation:pulse 2.7s infinite}.heart-gift span{display:block;font-size:14px;font-style:italic}.home-stars{position:absolute;bottom:95px;left:3%;font-size:80px;color:#dac7b1;pointer-events:none}.home-stars span{display:inline-block;font-size:25px;transform:translateY(-40px);animation:twinkle 3s infinite}.bottom-whisper{position:absolute;bottom:125px;right:4%;font-style:italic;font-size:15px}.bottom-whisper span{display:inline-block;font-size:30px;transform:rotate(-40deg);margin-left:9px}.music{background:#fffdfa}.music .page-heading h2{font-size:clamp(42px,5vw,70px)}.album-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:22px;max-width:1150px;margin:40px auto}.album{position:relative;padding:0;border:0;background:none;text-align:left;animation:staggerIn .8s var(--delay) both}.album-art{position:relative;aspect-ratio:1;background:var(--cover);border:5px solid #fff;box-shadow:0 4px 18px #8151651a;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;transition:.5s;transform:rotate(var(--rot))}.album:hover .album-art{transform:rotate(0) translateY(-12px);box-shadow:0 12px 25px #81516525}.album-art:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 40px #ffffff55}.album-art svg{width:85%;height:85%}.album strong{display:block;font-size:17px;font-weight:500;margin:12px 0 2px}.album small{font:10px var(--sans);opacity:.65}.album .disc{position:absolute;inset:10%;border-radius:50%;background:repeating-radial-gradient(#25232b 0 1px,#39343c 2px 3px);display:grid;place-content:center;transition:.6s}.album .disc:after{content:'♡';display:grid;place-content:center;background:var(--gift,#d3a5bb);width:42px;height:42px;border-radius:50%;color:#fff}.album:hover .disc{transform:rotate(110deg)}.album-quote{position:absolute;font-size:12px;font-style:italic;top:-24px;right:-3px;transform:rotate(8deg);display:none}.album:nth-child(2) .album-quote,.album:nth-child(5) .album-quote{display:block}.player{display:flex;align-items:center;gap:17px;max-width:550px;margin:45px auto 0;padding:17px 22px;border:1px solid #ecd6df;border-radius:60px;background:#fff9fc;box-shadow:0 6px 30px #ba7b9410}.player>button{width:42px;height:42px;border-radius:50%;background:#b25a7d;color:#fff;font-size:15px;flex-shrink:0}.player strong{font-size:17px;font-weight:500;display:block}.player span{font:10px var(--sans);opacity:.7}.waveform{display:flex;gap:3px;height:28px;align-items:center;margin-left:auto}.waveform i{width:2px;height:var(--height);background:#d299b1}.playing .waveform i{animation:equalize .6s var(--delay) infinite alternate}#track-time{min-width:28px}.letter{background:radial-gradient(at 10% 10%,#fff5fa,transparent 60%),#f7e0ea;display:none}.letter-intro{position:absolute;top:25%;left:10%}.envelope{position:absolute;left:55%;top:37%;width:310px;height:210px;background:none;perspective:1000px;transform:rotate(6deg);animation:envelopeIn 1s both}.envelope-back{position:absolute;inset:0;background:#edb7cd;border-radius:4px;box-shadow:0 15px 40px #8c375b20}.envelope-front{position:absolute;inset:0;background:linear-gradient(32deg,#f6cadd 49.7%,transparent 50%) left / 51% 100% no-repeat,linear-gradient(-32deg,#f6cadd 49.7%,transparent 50%) right / 51% 100% no-repeat;z-index:3;border-bottom:7px solid #f6cadd}.envelope-flap{position:absolute;inset:0;background:#eaaec8;clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:top;transition:transform .7s;z-index:4}.envelope-paper{position:absolute;inset:14px 18px 8px;background:#fffdf5;padding:30px 25px;text-align:left;font-size:23px;line-height:1.6;z-index:2;transition:transform .6s .3s}.wax-seal{position:absolute;left:calc(50% - 24px);top:90px;z-index:5;background:#bd6589;color:#ffe8ee;border:4px double #d789a5;border-radius:50%;width:48px;height:48px;display:grid;place-content:center;font-size:29px;transition:.5s;box-shadow:0 2px 4px #742d4830}.envelope-caption{position:absolute;top:245px;left:0;right:0;font-size:17px;font-style:italic}.envelope:hover{transform:rotate(0)}.envelope.open .envelope-flap{transform:rotateX(180deg);z-index:1}.envelope.open .envelope-paper{transform:translateY(-100px)}.envelope.open .wax-seal{transform:scale(0);opacity:0}.letter-paper{display:none;position:relative;z-index:10;width:min(750px,85vw);margin:10px auto 30px;padding:55px 65px 120px;background:#fffcf6;color:#95536c;box-shadow:0 20px 90px #7d3f5b25;transform:rotate(-1deg);border:1px solid #fff}.letter.reading .letter-paper{display:block;animation:unfold .9s both}.letter.reading .letter-intro,.letter.reading .envelope{display:none}.letter-paper h2{font-size:45px;letter-spacing:-1.5px;margin:20px 0}.letter-paper p{font-size:20px;line-height:1.65;margin:20px 0}.letter-date{font:9px var(--sans);letter-spacing:2px;text-transform:uppercase}.signature{font-style:italic}.signature span{display:block;font-size:35px}.paper-close,.dialog-close{position:absolute;right:20px;top:15px;background:none;font-size:27px}.snoopy-art{position:absolute;right:30px;bottom:0;width:180px;height:180px;transform:rotate(5deg)}.snoopy-art svg{width:100%;height:100%;animation:writing 2s infinite alternate}.things{background:#eaf6fb;height:100svh;min-height:760px}.things-heading{position:absolute;top:37%;left:25%;width:50%;text-align:center;z-index:2;pointer-events:none}.things-heading h2{font-size:clamp(40px,4.9vw,70px)}.keepsake{position:absolute;width:100px;height:100px;background:none;left:var(--x);top:var(--y);animation:float 5s var(--delay) infinite ease-in-out;transform:rotate(var(--rot));z-index:3;transition:filter .3s}.keepsake svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 4px 1px #767e8e15);transition:.4s}.keepsake:hover svg{transform:scale(1.25) rotate(8deg);filter:drop-shadow(0 12px 9px #a8738c30)}.keepsake-note{position:absolute;z-index:15;bottom:140px;left:50%;transform:translateX(-50%);padding:14px 28px;border-radius:3px;background:#fffdf4;box-shadow:0 6px 20px #66839619;font-size:22px;font-style:italic;max-width:80%;text-align:center;opacity:0;pointer-events:none;transition:.4s}.keepsake-note.visible{opacity:1;transform:translateX(-50%) rotate(-2deg)}.tiny-heart{position:absolute;color:#da8eaf;font-size:22px;pointer-events:none;animation:float 5s var(--delay) infinite}.memories{background:#eddae3}.memories .page-heading h2{font-size:clamp(38px,4.6vw,70px)}.polaroids{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 50px;max-width:1000px;margin:35px auto}.polaroid{background:#fffcf5;padding:10px 10px 15px;box-shadow:3px 7px 13px #79455818;transform:rotate(var(--rot));transition:.4s;animation:photoIn 1s var(--delay) both;position:relative;text-align:left}.polaroid:hover{transform:rotate(0) translateY(-12px) scale(1.04);z-index:3;box-shadow:3px 18px 20px #79455825}.polaroid .scene{aspect-ratio:1.35;overflow:hidden;background:#b9d3c4}.scene svg{width:100%;height:100%;display:block}.polaroid strong{display:block;font-size:23px;margin:12px 4px 2px;font-weight:400}.polaroid small{display:block;margin:0 4px;font:9px var(--sans);letter-spacing:1.5px;opacity:.6}.photo-tape{position:absolute;top:-13px;width:75px;height:24px;background:#f8f2dfa6;left:calc(50% - 37px);transform:rotate(-4deg);z-index:2;clip-path:polygon(2% 5%,96% 0,100% 94%,0 100%)}.memory-hint{text-align:center;font-style:italic;font-size:17px}.love{height:100svh;min-height:760px;background:#f6e0eb}.love-cloud{position:absolute;width:470px;height:430px;left:calc(50% - 235px);top:calc(50% - 210px);filter:blur(25px);animation:heartBeat 3.2s ease-in-out infinite}.love-cloud:before,.love-cloud:after{content:'';position:absolute;width:260px;height:390px;background:#ed8d92;border-radius:150px 150px 0 0;top:0;left:220px;transform:rotate(-45deg);transform-origin:0 100%}.love-cloud:after{left:-40px;transform:rotate(45deg);transform-origin:100% 100%}.love-center{position:absolute;top:39%;left:30%;width:40%;text-align:center;z-index:3;color:#fff9f5;pointer-events:none}.love-script{font-style:italic;font-size:100px;line-height:.65;display:block;transform:rotate(-9deg)}.love-center h2{font-size:40px;letter-spacing:-1px;line-height:.9;margin-top:20px}.love-center h2 span{font-size:28px;letter-spacing:2px}.love-center p{font-style:italic;font-size:16px}.compliment{position:absolute;left:var(--x);top:var(--y);background:transparent;font-size:clamp(17px,1.8vw,26px);font-style:italic;animation:float 7s var(--delay) infinite;transition:.3s}.compliment:hover{color:#b64e76;scale:1.12}.compliment:after{content:'♡';display:block;font-size:14px;opacity:0;transition:.4s}.compliment:hover:after{opacity:1}.love-reveal{position:absolute;bottom:165px;left:50%;width:80%;transform:translateX(-50%);text-align:center;font-size:23px;font-style:italic;transition:.3s}#more-love{position:absolute;bottom:120px;left:50%;transform:translateX(-50%);border-bottom:1px solid #c68aab;background:none;padding:8px 0;font-style:italic;font-size:17px}#more-love span{margin-left:12px}dialog{padding:40px;border:1px solid #fff;border-radius:5px;color:var(--ink);background:#fffaf6;max-width:90vw;width:480px;box-shadow:0 25px 100px #48203940}dialog[open]{animation:unfold .5s both}dialog::backdrop{background:#69425570;backdrop-filter:blur(10px)}dialog h2{font-weight:400;font-size:42px;line-height:1;letter-spacing:-1px;margin:22px 0 10px}dialog p{font-size:19px;line-height:1.6}dialog a,.upload-label{display:inline-block;color:var(--ink);font:11px var(--sans);padding:14px 19px;background:#f6e3eb;border-radius:30px;text-decoration:none;margin-top:15px;cursor:pointer}dialog .scene{width:100%}.upload-label input{display:none}.memory-upload{width:100%;height:100%;object-fit:cover}.modal-album{width:150px;height:150px;border-radius:50%;background:repeating-radial-gradient(#25232b 0 1px,#39343c 2px 3px);display:grid;place-content:center;margin:5px auto;animation:spin 12s linear infinite}.modal-album:after{content:'♡';font-size:35px;color:#f1c6d8;background:#a46681;width:60px;height:60px;border-radius:50%;display:grid;place-content:center}.confetto{position:fixed;z-index:100;top:-10%;pointer-events:none;left:var(--x);width:var(--s);height:var(--s);background:var(--c);animation:fall var(--d) var(--delay) linear forwards}.confetto.heart{background:none;font-size:var(--s);color:var(--c);width:auto;height:auto}#confetti{position:fixed;inset:0;pointer-events:none;z-index:100}.sparkle{position:absolute;pointer-events:none;color:#b5c8e2;font-size:80px;animation:twinkle 4s var(--delay) infinite}
@keyframes pageIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes wordIn{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:none}}@keyframes portraitIn{from{opacity:0;transform:translateY(90px) rotate(-8deg)}to{opacity:1;transform:none}}@keyframes float{0%,100%{translate:0 0;rotate:-2deg}50%{translate:0 -10px;rotate:2deg}}@keyframes bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}@keyframes sway{from{rotate:-1deg}to{rotate:1deg}}@keyframes twinkle{0%,100%{opacity:.5;scale:.85}50%{opacity:1;scale:1.1}}@keyframes pulse{50%{scale:1.1}}@keyframes equalize{from{transform:scaleY(.3)}to{transform:scaleY(1.1)}}@keyframes staggerIn{from{opacity:0;translate:0 35px;rotate:-5deg}to{opacity:1;translate:0 0;rotate:0deg}}@keyframes photoIn{from{opacity:0;translate:0 45px;scale:.9}to{opacity:1;translate:0 0;scale:1}}@keyframes envelopeIn{from{opacity:0;translate:50px 40px;rotate:15deg}to{opacity:1;translate:0 0;rotate:0deg}}@keyframes unfold{from{opacity:0;transform:translateY(30px) scale(.92) rotate(3deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes writing{from{rotate:-3deg}to{rotate:3deg}}@keyframes heartBeat{0%,100%{scale:.94;opacity:.85}50%{scale:1.06;opacity:1}}@keyframes fall{0%{transform:translateY(-10vh) rotate(0deg);opacity:1}100%{transform:translateY(120vh) rotate(800deg);opacity:0}}@keyframes spin{to{rotate:360deg}}
@media(min-width:1500px){.home-copy{inset:36% 15% auto}.portrait-wrap{width:30%;left:35%}.gift{width:140px}.gift-drawing{width:110px;height:130px}.bow{left:37px}.album-grid{margin-top:65px}.page-heading{margin-top:55px}}
@media(max-width:900px){.album-grid{grid-template-columns:repeat(3,1fr);gap:24px;max-width:650px}.album strong{font-size:19px}.music .page-heading{margin-bottom:45px}.player{margin-top:30px}.letter-intro{left:7%}.envelope{left:55%;width:270px;height:185px}.letter-intro h2{font-size:50px}.polaroids{gap:24px}.love-center{width:50%;left:25%}}
@media(max-width:600px){header{height:67px;padding:0 23px}.brand{font-size:18px}.sound-button{font-size:8px;gap:7px}.page{padding:95px 22px 125px;min-height:100svh}.eyebrow{font-size:8px;letter-spacing:2px}.dock{bottom:16px;padding:7px 8px;gap:0;width:calc(100% - 38px);justify-content:space-around}.dock button{min-width:0;padding:7px 9px}.dock span{font-size:21px}.dock small{font-size:8px}.home{min-height:780px}.garland{top:65px;height:100px;width:150%;left:-25%}.home-copy{inset:26% 8% auto}.home-copy .eyebrow{top:-42px;white-space:nowrap;font-size:7px}.birthday-title{display:block;position:relative}.birthday-title h1{font-size:74px;letter-spacing:-3px}.birthday-title h1:first-child{text-align:left}.birthday-title h1:nth-child(2){text-align:right;margin-top:-5px}.birthday-sub{text-align:right;font-size:19px;margin:10px 0}.portrait-wrap{width:67%;left:16%;height:41%;bottom:90px}.gift{width:65px}.gift-drawing{height:65px;width:54px}.gift-drawing:before{height:13px;inset:-5px -4px auto}.gift-drawing:after{width:10px;left:calc(50% - 5px)}.bow{scale:.65;left:4px;top:-27px}.gift-label{font-size:11px;margin-top:13px}.gift-mint{left:9%;top:45%}.gift-lilac{left:77%;top:49%}.gift-rose{left:4%;top:69%}.gift-peach{left:80%;top:72%}.heart-gift{top:40%;left:45%;font-size:38px}.heart-gift span{font-size:11px}.home-stars{font-size:45px;bottom:100px;left:2%}.bottom-whisper{right:5%;bottom:103px;font-size:11px;z-index:5}.bottom-whisper span{font-size:22px}.page h2{font-size:48px;letter-spacing:-1.7px}.page-heading{margin:10px auto 35px}.page-heading p,.things-heading p{font-size:16px}.music .page-heading h2{font-size:49px}.album-grid{grid-template-columns:repeat(2,1fr);gap:29px 25px;margin:40px 5px 20px}.album strong{font-size:20px}.album small{font-size:9px}.album-quote{font-size:11px;top:-20px}.player{gap:10px;padding:13px 14px;margin-top:28px}.player strong{font-size:16px}.player span{font-size:8px}.waveform{gap:2px}.waveform i:nth-child(n+10){display:none}.letter-intro{position:static;text-align:center;margin-top:20px}.letter-intro h2{font-size:55px}.envelope{left:calc(50% - 145px);top:47%;width:290px;height:200px}.letter-paper{width:100%;padding:35px 25px 125px;margin:5px auto 25px}.letter-paper h2{font-size:36px}.letter-paper p{font-size:19px;line-height:1.6}.letter-date{font-size:7px}.snoopy-art{width:140px;height:140px;right:15px}.things{height:900px;min-height:100svh}.things-heading{top:37%;left:10%;width:80%}.things-heading h2{font-size:48px}.keepsake{width:66px;height:66px}.keepsake-note{bottom:130px;font-size:18px;max-width:85%;width:85%}.tiny-heart{font-size:15px}.polaroids{grid-template-columns:repeat(2,1fr);gap:30px 20px;margin-top:40px}.polaroid{padding:7px 7px 12px}.polaroid strong{font-size:20px;margin-top:9px}.polaroid small{font-size:7px;letter-spacing:.6px}.photo-tape{height:18px;width:55px;left:calc(50% - 27px);top:-9px}.memories .page-heading h2{font-size:48px}.memory-hint{font-size:14px;margin-top:30px}.love{min-height:850px}.love-cloud{width:310px;height:350px;left:calc(50% - 155px);top:calc(47% - 120px);scale:.7;transform-origin:top left;filter:blur(22px)}.love-cloud:before{left:220px}.love-cloud:after{left:-40px}.love-center{left:10%;width:80%;top:40%}.love-script{font-size:87px}.love-center h2{font-size:35px}.love-center h2 span{font-size:25px}.love-center p{font-size:14px}.compliment{font-size:18px;max-width:110px}.love-reveal{bottom:182px;font-size:20px}#more-love{bottom:132px}.sparkle{font-size:45px}dialog{padding:27px}dialog h2{font-size:36px}dialog p{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* Arabic letter and matching illustrated navigation icons */

.letter[lang="ar"]{font-family:'Noto Naskh Arabic','Geeza Pro',Tahoma,serif}.letter[lang="ar"] h2{letter-spacing:0;line-height:1.6;font-size:clamp(34px,4vw,55px)}.letter[lang="ar"] .eyebrow,.letter[lang="ar"] .letter-date{font-family:inherit;letter-spacing:0;font-size:14px}.letter[lang="ar"] .letter-paper{text-align:right;padding-top:45px}.letter[lang="ar"] .letter-paper h2{font-size:35px;line-height:1.65}.letter[lang="ar"] .letter-paper p{font-size:21px;line-height:2}.letter[lang="ar"] .signature{font-style:normal}.letter[lang="ar"] .signature span{font-size:29px;line-height:1.8}.letter[lang="ar"] .envelope-paper{text-align:right;line-height:1.8}.letter[lang="ar"] .envelope-caption{font-style:normal;font-size:19px}.letter[lang="ar"] .paper-close{right:auto;left:18px}.letter[lang="ar"] .snoopy-art{right:auto;left:30px}.dock .nav-icon{width:24px;height:26px;display:block;margin:0 auto;transform-origin:50% 65%;transition:transform .3s}.dock button:hover .nav-icon{transform:rotate(-10deg) scale(1.1)}.dock button[aria-current="page"] .nav-icon{animation:iconWiggle 3s ease-in-out infinite}.dock small[lang="ar"]{font-family:'Geeza Pro',Tahoma,sans-serif;letter-spacing:0}@keyframes iconWiggle{0%,75%,100%{transform:rotate(0)}83%{transform:rotate(-9deg)}91%{transform:rotate(7deg)}}@media(max-width:600px){.letter[lang="ar"] .letter-intro h2{font-size:43px}.letter[lang="ar"] .letter-paper{padding:40px 23px 135px}.letter[lang="ar"] .letter-paper h2{font-size:28px}.letter[lang="ar"] .letter-paper p{font-size:19px;line-height:2}.letter[lang="ar"] .letter-date{font-size:12px}.letter[lang="ar"] .signature span{font-size:26px}.letter[lang="ar"] .snoopy-art{left:15px}.dock .nav-icon{width:22px}}
/* Saudi Arabic typography and a balanced birthday headline. */
:root{--serif:'Noto Naskh Arabic','Geeza Pro',Tahoma,serif;--sans:'Noto Naskh Arabic','Geeza Pro',Tahoma,serif}body{line-height:1.6}.brand{font-style:normal;font-size:22px}.brand span{margin:0 8px 0 0}.eyebrow,.letter-date,.dock small,.sound-button,.album small,.polaroid small{letter-spacing:0;text-transform:none}.eyebrow{font-size:13px}.page h2{letter-spacing:0;line-height:1.5}.page em{font-style:normal}.page-heading p,.things-heading p{line-height:1.9;font-size:19px}.dock{direction:rtl}.dock small{font-size:12px;line-height:1.6}.dock button{min-width:69px}.sound-button{font-size:12px}.sound-bars{direction:ltr}.player{direction:rtl}.player strong{font-size:19px}.player span{font-size:12px}.waveform{margin-left:0;margin-right:auto}#track-time{direction:ltr;unicode-bidi:isolate}.album{text-align:right}.album strong{font-size:21px}.album small{font-size:13px}.album-quote{font-style:normal;font-size:14px;right:0;left:auto}.polaroid{text-align:right}.polaroid strong{font-size:25px}.polaroid small{font-size:12px}.memory-hint,.gift-label,.keepsake-note,.compliment,.love-reveal,#more-love,.bottom-whisper{font-style:normal}.home-copy{inset:21% 18% auto;width:64%;z-index:5}.home-copy .eyebrow{position:static;margin-bottom:8px;font-size:14px}.birthday-title{display:block}.birthday-title h1{font:500 clamp(38px,4.6vw,76px)/1.45 var(--serif);letter-spacing:0;text-align:center;margin:0;max-width:100%;text-wrap:balance}.birthday-title h1 span{color:#ad5075}.birthday-sub{text-align:center;font-size:23px;line-height:1.6;margin:8px 0 0}.portrait-wrap{height:44%;width:34%;left:33%;bottom:85px}.gift-label{font-size:17px;line-height:1.6}.gift-mint{top:30%}.gift-lilac{top:30%}.heart-gift{top:51%;left:calc(50% - 35px);font-size:38px;z-index:7}.heart-gift span{font-size:14px}.bottom-whisper{font-size:15px;bottom:121px}.letter[lang="ar"] .letter-paper h2{font-size:33px}.things-heading{top:33%}.things-heading h2{font-size:clamp(38px,4.5vw,66px)}.music .page-heading h2{font-size:clamp(40px,4.5vw,65px);line-height:1.45}.memories .page-heading h2{font-size:clamp(38px,4.5vw,65px)}.love-script{font-style:normal;font-size:90px;line-height:1.3;transform:none}.love-center{top:33%}.love-center h2{font-size:45px;line-height:1.45;letter-spacing:0;margin:0}.love-center h2 span{font-size:47px;letter-spacing:0}.love-center p{font-size:19px;font-style:normal}.love-reveal{font-size:23px}.compliment{font-size:24px}dialog h2{font-size:36px;line-height:1.5;letter-spacing:0}dialog a,.upload-label{font-size:15px}.dialog-close{right:auto;left:20px}.envelope-paper{direction:rtl}.snoopy-art{direction:ltr}.keepsake svg text{font-family:var(--serif)}
@media(max-width:600px){.brand{font-size:19px}.sound-button{font-size:10px}.dock button{min-width:0;padding:7px 9px}.dock small{font-size:11px}.eyebrow{font-size:12px}.page h2{font-size:42px;line-height:1.5}.page-heading p,.things-heading p{font-size:17px}.home{min-height:830px}.home-copy{inset:21% 8% auto;width:84%}.home-copy .eyebrow{position:static;white-space:normal;font-size:12px;margin:0 0 10px}.birthday-title h1,.birthday-title h1:first-child,.birthday-title h1:nth-child(2){font-size:clamp(34px,9vw,48px);line-height:1.5;text-align:center;letter-spacing:0;margin:0}.birthday-sub{font-size:19px;margin:8px 0 0;text-align:center}.portrait-wrap{width:68%;left:16%;height:39%;bottom:94px}.gift-label{font-size:12px}.gift-mint{top:48%}.gift-lilac{top:48%;left:76%}.gift-rose{top:72%}.gift-peach{top:72%;left:78%}.heart-gift{top:45%;left:calc(50% - 27px);font-size:32px}.heart-gift span{font-size:12px}.bottom-whisper{font-size:11px;right:4%;bottom:103px}.album strong{font-size:21px}.album small{font-size:12px}.album-quote{font-size:11px}.player strong{font-size:17px}.player span{font-size:10px}.polaroid strong{font-size:21px}.polaroid small{font-size:10px}.memories .page-heading h2,.music .page-heading h2{font-size:41px;line-height:1.5}.things-heading{top:34%}.things-heading h2{font-size:41px}.love-center{top:34%;width:76%;left:12%}.love-script{font-size:76px}.love-center h2{font-size:35px;line-height:1.5}.love-center h2 span{font-size:39px}.love-center p{font-size:17px}.compliment{font-size:19px;max-width:110px}.love-reveal{font-size:19px;bottom:185px}.letter[lang="ar"] .letter-paper h2{font-size:27px}}

@media(min-width:601px){.portrait-wrap{width:44%;left:28%;height:49%}.birthday-title h1{font-size:clamp(42px,4.6vw,76px)}}
@media(max-width:600px){.birthday-title h1,.birthday-title h1:first-child{font-size:clamp(30px,8.2vw,42px)}.birthday-title h1 span{font-size:1.13em}}
@media(max-width:600px){.bottom-whisper{right:18px;bottom:99px;background:#fffaf5df;padding:2px 8px;border-radius:20px;font-size:10px}.album-quote{max-width:145px;line-height:1.5}.album-grid{row-gap:38px}.sound-button{white-space:nowrap}}

/* Clear Arabic UI with a softer display face for the love note. */
:root{--serif:'Tajawal','Geeza Pro',Tahoma,sans-serif;--sans:'Tajawal','Geeza Pro',Tahoma,sans-serif}body{font-family:var(--sans)}.letter[lang="ar"]{font-family:'Amiri','Geeza Pro',serif}.page-heading h2,.birthday-title h1{font-family:'Amiri','Geeza Pro',serif}.brand{font-family:'Amiri',serif}.dock small{font-size:11px;font-weight:500}.album-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-width:980px;gap:30px;margin:38px auto 20px}.album strong{font-size:22px;line-height:1.5}.album small{font-size:13px}.album-art{border-radius:5px}.album-play{position:absolute;bottom:9px;left:9px;width:32px;height:32px;display:grid;place-content:center;border-radius:50%;background:#fffaf5dc;color:#a44970;font-size:12px;box-shadow:0 2px 9px #65334e15;z-index:2;transition:.3s}.album:hover .album-play{scale:1.15}.song-dedication{font-size:13px;line-height:1.8;display:block;margin-top:7px;opacity:.8}.playlist-hint{text-align:center;font-size:14px;margin:35px 0 0;opacity:.8}.player[hidden]{display:none}.song-video{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:8px;background:#f3e4eb}.song-message{font-size:16px;margin-bottom:20px}dialog:has(.song-video){width:650px}.love-cloud{width:min(560px,90vw);height:auto;aspect-ratio:300/280;left:50%;top:44%;transform:translate(-50%,-50%);transform-origin:center;scale:1;filter:blur(17px)}.love-cloud:before,.love-cloud:after{display:none}.love-cloud svg{display:block;width:100%;height:100%}.love-center{top:44%;left:50%;width:75%;max-width:400px;transform:translate(-50%,-50%);text-align:center}.love-kicker{font:400 15px/1.8 var(--sans);opacity:.9;display:block;margin-bottom:10px}.love-center h2{font-family:'Amiri',serif;font-weight:400;font-size:64px;line-height:1.25;letter-spacing:0;margin:0;white-space:nowrap}.love-center h2 span{font-family:inherit;font-size:74px;font-weight:700;letter-spacing:0;line-height:1.15}.love-center p{font:400 17px/1.8 var(--sans);margin:15px 0 8px}.love-invitation{font:400 11px/1.7 var(--sans);opacity:.8}.compliment{font-family:'Amiri',serif;font-size:23px}.love-reveal{max-width:650px;font-size:19px;line-height:1.9;bottom:173px;text-wrap:balance;min-height:38px}.love-reveal:not(:empty){background:#fff8fcaa;padding:10px 22px;border:1px solid #ffffff90;border-radius:18px;backdrop-filter:blur(8px)}#more-love{font-size:16px;line-height:1.8}.letter[lang="ar"] .letter-paper p{font-size:22px}.birthday-title h1{line-height:1.5}
@media(max-width:600px){.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;margin-top:28px}.album strong{font-size:20px}.album small{font-size:12px}.song-dedication{font-size:11px;line-height:1.9}.music .page-heading h2{font-size:40px}.music .page-heading p{font-size:15px;line-height:2}.playlist-hint{font-size:12px;margin-top:25px}.love{min-height:890px}.love-cloud{width:94vw;top:44%;filter:blur(13px);scale:1;transform-origin:center}.love-center{top:44%;left:50%;width:77%;max-width:330px}.love-center h2{font-size:clamp(38px,11vw,48px);line-height:1.3}.love-center h2 span{font-size:clamp(48px,14vw,61px)}.love-kicker{font-size:12px;margin-bottom:7px}.love-center p{font-size:13px;margin:10px 0 6px}.love-invitation{font-size:9px}.compliment{font-size:18px;max-width:96px}.love-reveal{font-size:15px;bottom:175px;width:86%;line-height:1.9}.love-reveal:not(:empty){padding:10px 15px}#more-love{bottom:128px;font-size:14px}.letter[lang="ar"] .letter-paper p{font-size:21px}}

.album-art .song-cover{display:block;width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .6s}.album:hover .song-cover{transform:scale(1.06)}.song-detail-cover{display:block;width:100%;height:auto;border-radius:8px;background:#f2e3eb}.album-art:after{pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff30}.album-art{isolation:isolate}
/* YouTube thumbnails have letterboxed edges; crop into the cover artwork. */
.album-art .song-cover{transform:scale(1.36);object-fit:cover}.album:hover .song-cover{transform:scale(1.42)}.song-detail-cover{aspect-ratio:16/9;object-fit:cover;object-position:center;clip-path:inset(0 round 8px)}
/* Match the 16:9 artwork inside the 4:3 thumbnail: retain its full width. */
.album .album-art{aspect-ratio:16/9;overflow:hidden}.album-art .song-cover{position:absolute;width:100%;height:133.3334%;max-width:none;inset:auto;left:0;top:-16.6667%;object-fit:fill;transform:none}.album:hover .song-cover{transform:none}.album-play{width:28px;height:28px;font-size:11px;bottom:6px;left:6px}

/* Give the love page a clear, readable call to action beside the heading. */
.home .heart-gift{top:44%;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:11px;width:max-content;max-width:85%;padding:9px 21px;background:#b65b80;color:#fffaf6;border:1px solid #a85075;border-radius:40px;box-shadow:0 6px 20px #a54b7526;z-index:12;font-size:17px;line-height:1.6;animation:loveButtonGlow 3s ease-in-out infinite;transition:background .25s,box-shadow .25s}.home .heart-gift span{font:500 16px/1.6 var(--sans);display:block}.home .heart-gift .heart-symbol{font:30px/1 Georgia;animation:pulse 2.7s infinite}.home .heart-gift .heart-arrow{font-size:21px;opacity:.8}.home .heart-gift:hover{background:#a64c72;box-shadow:0 8px 25px #a54b7545}.home .heart-gift:focus-visible{outline:3px solid #b65b80;outline-offset:5px}@keyframes loveButtonGlow{0%,100%{box-shadow:0 6px 20px #a54b7526}50%{box-shadow:0 6px 25px #a54b7540}}@media(max-width:600px){.home .heart-gift{top:42%;padding:8px 17px;gap:9px}.home .heart-gift span{font-size:14px}.home .heart-gift .heart-symbol{font-size:27px}.home .heart-gift .heart-arrow{font-size:18px}}
/* A floating heart link, without button styling. */
.home .heart-gift{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;display:flex;flex-direction:column;gap:5px;color:#ae527a;animation:none;width:max-content;top:43%}.home .heart-gift:hover{background:transparent;box-shadow:none;color:#963b64}.home .heart-gift .heart-symbol{font-size:46px;line-height:1}.home .heart-gift span{font-size:14px;font-weight:400}.home .heart-gift .heart-arrow{display:none}.home .heart-gift:hover .heart-symbol{scale:1.12}.home .heart-gift:focus-visible{outline:2px dashed #b65b80;outline-offset:8px}@media(max-width:600px){.home .heart-gift{top:42%;padding:0;gap:4px}.home .heart-gift .heart-symbol{font-size:37px}.home .heart-gift span{font-size:12px}}
/* Personal photos, without placeholder captions or empty upload slots. */
.album-art .song-cover.full-frame{height:100%;top:0;object-fit:fill}.song-detail-cover.full-frame{aspect-ratio:4/3}.polaroids{display:block;columns:3;column-gap:30px;max-width:1000px;margin:35px auto}.real-memory{display:block;width:100%;break-inside:avoid;margin:0 0 30px;padding:9px;background:#fffdf7;line-height:0}.real-memory .scene{aspect-ratio:auto;background:transparent;overflow:hidden}.real-memory .scene>img{display:block;width:100%;height:auto}.photo-dialog{width:min(900px,92vw);padding:32px 14px 14px;max-height:94svh;overflow:auto}.memory-full{display:block;max-width:100%;max-height:83svh;width:auto;height:auto;object-fit:contain;margin:auto}.personal-letter h2{font-family:'Amiri',serif!important;font-size:31px!important;line-height:1.8!important}.personal-letter p{font-family:'Amiri',serif!important;line-height:2.1!important}.personal-letter .personal-signature{font-family:Georgia,serif!important;font-size:20px!important;line-height:1.9!important;text-align:right;margin-top:35px}.personal-signature>span{font-size:18px}.personal-letter{padding-bottom:155px!important}.letter-sticker{position:absolute;bottom:12px;left:25px;width:115px;height:115px;object-fit:contain;border-radius:20px}.portrait-wrap{height:47%;bottom:88px}.portrait-wrap img{object-fit:contain;object-position:center bottom}.memories .page-heading{margin-bottom:45px}@media(max-width:600px){.polaroids{columns:2;column-gap:17px;margin:25px auto}.real-memory{padding:6px;margin-bottom:22px}.personal-letter h2{font-size:25px!important}.personal-letter p{font-size:21px!important;line-height:2!important}.personal-letter .personal-signature{font-size:16px!important}.personal-signature>span{font-size:15px}.letter-sticker{width:95px;height:95px;left:17px}.personal-letter{padding-bottom:125px!important}.portrait-wrap{height:40%;bottom:93px}.photo-dialog{padding:32px 10px 10px}.memory-full{max-height:80svh}}
/* Keep the greeting and heart in one flow, with a closer portrait crop. */
.home-copy{top:17%;inset-inline:18%;width:64%}.birthday-title h1,.birthday-title h1:first-child{font-size:clamp(36px,4.2vw,60px);line-height:1.35}.birthday-sub{font-size:20px;margin-top:12px}.home .home-copy .heart-gift{position:relative;inset:auto;left:auto;top:auto;transform:none;margin:17px auto 0;pointer-events:auto}.portrait-wrap{height:45%;overflow:hidden}.portrait-wrap img{position:absolute;inset:0 auto auto 0;width:100%;height:175%;object-fit:contain;object-position:center top;animation:none}@media(max-width:600px){.home-copy{top:18%;inset-inline:7%;width:86%}.birthday-title h1,.birthday-title h1:first-child{font-size:clamp(29px,8vw,40px);line-height:1.4}.birthday-sub{font-size:17px;line-height:1.8;margin-top:10px}.home .home-copy .heart-gift{margin-top:14px}.portrait-wrap{height:40%;bottom:93px}.portrait-wrap img{height:175%}}