.hero{overflow:hidden;isolation:isolate;min-height:105svh}.hero-content{z-index:2}.hero h1{background:linear-gradient(100deg,#f3e5d0 25%,#fff9e9 40%,#d6b77b 50%,#fff4df 60%,#f3e5d0 75%);background-size:240% auto;background-clip:text;color:transparent;animation:titleLight 10s ease-in-out infinite}.title-star{color:var(--gold)}.portrait{position:absolute;width:clamp(150px,20vw,290px);margin:0;padding:9px 9px 34px;background:#f3eadb;box-shadow:0 24px 70px #0008;color:#45372d;transform:rotate(var(--angle));transition:transform .7s;z-index:1}.portrait img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}.portrait figcaption{position:absolute;bottom:6px;left:0;right:0;text-align:center;font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;font-style:italic}.portrait-left{--angle:-12deg;left:5%;top:24%;animation:photoLeft 1.8s cubic-bezier(.2,.8,.2,1) both,floatLeft 8s 1.8s ease-in-out infinite}.portrait-right{--angle:10deg;right:5%;top:31%;animation:photoRight 2s .2s cubic-bezier(.2,.8,.2,1) both,floatRight 9s 2s ease-in-out infinite}.portrait:hover{animation-play-state:paused;transform:rotate(0) scale(1.06)!important;z-index:3}.portrait-left img{object-position:50% 28%}.portrait-right img{object-position:50% 30%}.halo{position:absolute;z-index:0;width:600px;height:600px;max-width:90vw;max-height:90vw;left:50%;top:45%;transform:translate(-50%,-50%);border:1px solid #e9d6b321;border-radius:50%;box-shadow:0 0 90px #c5aade12,inset 0 0 70px #c5aade0d;animation:haloBreathe 9s ease-in-out infinite}.halo:before,.halo:after{content:'';position:absolute;inset:30px;border:1px solid #e9d6b312;border-radius:50%}.halo:after{inset:-40px;border-style:dashed;animation:orbit 120s linear infinite}.wish-trail{position:fixed;pointer-events:none;z-index:20;color:#ffe5af;font-size:35px;text-shadow:0 0 15px #fff5c9,0 0 40px #ffd39b}.touch-wave{position:fixed;width:14px;height:14px;border:1px solid #edc895bb;border-radius:50%;pointer-events:none;z-index:15;animation:touchWave 1.7s ease-out forwards}.spark{position:fixed;width:4px;height:4px;pointer-events:none;background:#ffe0a6;border-radius:50%;box-shadow:0 0 12px #ffe6b6;z-index:16}.page-progress{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,#b4adf0,#ebcc91);transform-origin:left;width:100%;transform:scaleX(0);z-index:30;box-shadow:0 0 12px #ebcc91}.surprise{margin-top:40px}.surprise-button{border:0;background:none;display:flex;align-items:center;gap:16px;margin:auto;padding:12px 20px;font-size:14px;color:#e9d6b8}.surprise-button img{width:60px;height:60px;object-fit:cover;border-radius:50%;border:2px solid #e7cda57a;box-shadow:0 0 28px #f7dca524;animation:cuteBounce 5s ease-in-out infinite}.surprise-button:hover img{transform:rotate(-10deg) scale(1.1)}#hug-dialog{max-width:430px;padding-top:30px}#hug-dialog img{width:min(220px,75%);aspect-ratio:1;object-fit:cover;border-radius:50%;box-shadow:0 0 60px #eac69f24;margin-bottom:20px}#hug-dialog h3{font-size:38px}#hug-dialog p{font-size:15px;color:#d9e0ea}.letter-inner.visible .letter-copy p{animation:softReveal 1.3s both}.letter-inner.visible .letter-copy p:nth-child(2){animation-delay:.25s}.letter-inner.visible .letter-copy p:nth-child(3){animation-delay:.5s}.final-content.visible h2{animation:softReveal 1.6s both}.colorwash:after{transition:opacity .2s}.landscape{will-change:transform}.constellation:before{content:'';position:absolute;left:15%;right:15%;top:15%;bottom:10%;border:1px solid #edc89518;border-radius:50%;transform:rotate(-20deg);pointer-events:none}.wish .orb{border:1px solid #edc89515;border-radius:50%;box-shadow:0 0 30px #efca8b0a}.resting .page-progress{display:none}@keyframes titleLight{0%,100%{background-position:100% center}50%{background-position:0 center}}@keyframes photoLeft{from{opacity:0;transform:translate(-90px,80px) rotate(-25deg)}to{opacity:1;transform:rotate(-12deg)}}@keyframes photoRight{from{opacity:0;transform:translate(90px,80px) rotate(25deg)}to{opacity:1;transform:rotate(10deg)}}@keyframes floatLeft{50%{transform:translateY(-16px) rotate(-9deg)}}@keyframes floatRight{50%{transform:translateY(15px) rotate(7deg)}}@keyframes haloBreathe{50%{opacity:.45;transform:translate(-50%,-50%) scale(1.08)}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes touchWave{from{opacity:.8;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(22)}}@keyframes cuteBounce{0%,80%,100%{transform:translateY(0) rotate(0)}86%{transform:translateY(-7px) rotate(-7deg)}93%{transform:translateY(-3px) rotate(5deg)}}@keyframes softReveal{from{opacity:0;filter:blur(8px);transform:translateY(20px)}to{opacity:1;filter:blur(0);transform:none}}@media(min-width:1000px){.hero-content{max-width:570px}.hero h1{font-size:clamp(130px,14vw,210px)}.intro{font-size:17px}.portrait{width:21vw;max-width:280px}.portrait-left{left:3%}.portrait-right{right:3%}}@media(min-width:601px) and (max-width:999px){.hero{min-height:1080px;align-items:flex-start;padding-top:150px}.portrait{width:220px;top:auto;bottom:110px}.portrait-left{left:12%}.portrait-right{right:12%}.hero-content{margin:0}.halo{top:32%}}@media(max-width:600px){.hero{min-height:950px;min-height:max(950px,115svh);align-items:flex-start;padding-top:150px}.hero h1{font-size:115px}.hero-content{margin:0}.portrait{width:38%;max-width:175px;padding:7px 7px 30px;top:auto;bottom:100px}.portrait-left{left:9%;bottom:115px}.portrait-right{right:9%;bottom:85px}.portrait figcaption{font-size:17px}.halo{top:30%;width:330px;height:330px}.intro{font-size:16px}.hero-foot{bottom:20px}.hero .primary{margin-top:6px}.surprise-button{font-size:13px}}@media(prefers-reduced-motion:reduce){.hero h1{color:var(--cream)}.portrait{animation:none!important}.touch-wave,.spark,.wish-trail{display:none}.landscape{will-change:auto}}
.portrait img{height:auto;aspect-ratio:3/4;object-fit:cover}.resting.begun .landscape{filter:brightness(.9) saturate(.8)}
.portrait figcaption{white-space:nowrap;font-size:clamp(13px,1.5vw,19px)}@media(max-width:600px){.portrait figcaption{font-size:14px}}
.sound{position:fixed;top:25px;right:5%;background:#101d32d9;backdrop-filter:blur(12px);z-index:10}header{pointer-events:none}header>*{pointer-events:auto}@media(max-width:600px){.sound{top:23px;right:6%}}