:root{color:#3f382f;background:#1b1815;font-family:Songti SC,STSong,"Noto Serif CJK SC","Source Han Serif SC",serif;font-synthesis:none;--paper:#f5efe3;--paper-deep:#e6d8c3;--ink:#40382f;--muted:#7a6d5d;--gold:#b0874d;--night:#11100f}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--night)}body{margin:0;min-width:320px;min-height:100vh;background:var(--night);color:var(--ink);-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}.tribute-page{overflow:clip}.hero{position:relative;min-height:100svh;overflow:hidden;background:#120f0c var(--background-landscape) center/cover no-repeat;isolation:isolate}.hero:before{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:#07080647;content:"";transition:background 2.2s cubic-bezier(.22,.73,.3,1)}.hero--phase-1:before,.hero--phase-2:before,.hero--phase-3:before,.hero--phase-4:before{background:#0708069e}.hero__visual{position:absolute;top:3.5svh;left:50%;z-index:1;width:min(42vw,58svh,640px);aspect-ratio:4/3;overflow:hidden;border:7px solid rgba(255,249,236,.88);border-radius:3px;background:#fff9ec;box-shadow:0 22px 62px #0000006b;animation:visual-arrives 1.3s ease both;transform:translate(-50%)}.hero__photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.hero__shade{position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;pointer-events:none}.hero__dear{position:absolute;top:48svh;left:clamp(1.25rem,7vw,7rem);z-index:2;width:min(22rem,31vw);opacity:0;transform:translateY(12px);transition:opacity 1s ease,transform 1s ease}.hero__dear img{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 12px rgba(0,0,0,.24))}.hero--phase-2 .hero__dear,.hero--phase-3 .hero__dear,.hero--phase-4 .hero__dear{opacity:1;transform:translateY(0)}.hero__name{position:absolute;top:57svh;right:1.5rem;left:1.5rem;z-index:2;color:#fff9ec;text-align:center;opacity:0;transform:translateY(18px);transition:opacity 1.3s ease,transform 1.3s ease}.hero--phase-3 .hero__name,.hero--phase-4 .hero__name{opacity:1;transform:translateY(0)}.hero__name span{display:block;margin-bottom:1.1rem;color:#fff7e6a3;font-family:Georgia,Times New Roman,serif;font-size:clamp(.62rem,.8vw,.78rem);letter-spacing:.42em}.hero__name h1{margin:0;font-family:Georgia,Kaiti SC,serif;font-size:clamp(4.8rem,11vw,10rem);font-style:italic;font-weight:400;letter-spacing:-.035em;line-height:.8;text-shadow:0 4px 34px rgba(0,0,0,.42)}.hero__name-animation-frame{position:relative;display:block;width:min(28rem,46vw);height:clamp(5rem,13vw,10rem);margin:-1.6rem auto -1rem}.hero__name-animation{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 24px rgba(0,0,0,.42))}.hero__name-animation--final{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .18s linear}.hero--phase-4 .hero__name-animation--final{opacity:1}.hero__name p{margin:2rem 0 0;color:#fff8ebc7;font-size:clamp(.78rem,1vw,1rem);letter-spacing:.45em}.scroll-cue{position:absolute;bottom:2rem;left:50%;display:flex;align-items:center;border:0;background:transparent;color:#fff8ebb8;cursor:pointer;flex-direction:column;gap:.6rem;letter-spacing:.22em;opacity:0;pointer-events:none;transform:translate(-50%,10px);transition:color .25s ease,opacity 1s ease,transform 1s ease;white-space:nowrap}.hero>.scroll-cue{z-index:2}.scroll-cue.is-visible{opacity:1;pointer-events:auto;transform:translate(-50%)}.scroll-cue:hover,.scroll-cue:focus-visible{color:#fff;outline:none}.scroll-cue svg{animation:drift 2s ease-in-out infinite}@keyframes drift{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}@keyframes visual-arrives{0%{opacity:0;transform:translate(-50%) scale(1.025)}to{opacity:1;transform:translate(-50%) scale(1)}}.envelope-section{position:relative;display:grid;min-height:100svh;grid-template-columns:minmax(14rem,.7fr) minmax(22rem,1.2fr);align-items:center;gap:clamp(3rem,8vw,8rem);padding:clamp(6rem,10vw,10rem) max(5vw,2rem) 7rem;background-image:var(--background-landscape);background-size:cover;background-position:center;isolation:isolate}.envelope-section:before,.general-section:before{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:#0f120da3;content:""}.envelope-intro{justify-self:end;width:min(27rem,100%)}.envelope-intro>span,.general-paper header span,.participants>span{color:#8e6634;font-family:Georgia,Times New Roman,serif;font-size:.66rem;letter-spacing:.32em}.envelope-intro>span{color:#fff5e0b8}.envelope-intro h2{margin:1.35rem 0 0;color:#fff8e9;font-size:clamp(2.9rem,5vw,4.8rem);font-weight:400;line-height:1.28;text-shadow:0 2px 20px rgba(0,0,0,.3)}.envelope-intro h2 span{display:block;white-space:nowrap}.envelope-stage{display:grid;width:min(38rem,100%);min-height:32rem;place-items:center}.envelope-button{position:relative;display:flex;width:min(31rem,76vw);aspect-ratio:1.55;align-items:center;justify-content:center;border:1px solid rgba(105,77,43,.35);border-radius:2px;background:#eee4d1 url(/assets/mobile-paper-background.webp) center/cover;box-shadow:0 28px 60px #0a0c0859,inset 0 0 0 7px #fffcf46b;color:#8f6735;cursor:pointer;flex-direction:column;gap:.85rem;transition:transform .45s ease,box-shadow .45s ease,background-color .45s ease}.envelope-button:hover,.envelope-button:focus-visible{background-color:#f5ecdc;box-shadow:0 36px 75px #0a0c086e;outline:2px solid rgba(227,204,167,.64);outline-offset:5px;transform:translateY(-8px) rotate(-.35deg)}.envelope-button strong{color:#594b3c;font-size:1.1rem;font-weight:400;letter-spacing:.12em}.envelope-button span{font-size:.72rem;letter-spacing:.24em}.personal-letter{width:min(37rem,100%);padding:clamp(2rem,5vw,4.25rem);border:1px solid rgba(117,91,60,.2);background:#f8f2e7 url(/assets/mobile-paper-background.webp) center top/cover;box-shadow:0 30px 70px #0a0c085c,inset 0 0 0 8px #fffcf457;animation:letter-arrives .9s cubic-bezier(.2,.72,.2,1) both}@keyframes letter-arrives{0%{opacity:0;transform:translateY(46px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.personal-letter p{margin:0 0 1.1rem;color:#665a4c;font-size:clamp(.98rem,1.15vw,1.08rem);letter-spacing:.035em;line-height:2}.personal-letter .letter-salutation{margin-bottom:2rem;color:#3f372e;font-size:1.18rem}.personal-letter blockquote{margin:0 0 2rem;color:#42382e;font-size:clamp(1.4rem,2.4vw,2.05rem);line-height:1.75}.personal-letter .personal-blessing{margin:0;color:#51463b;font-size:clamp(1.04rem,1.35vw,1.18rem);letter-spacing:.045em;line-height:2.15}.personal-letter .personal-blessing.is-pending{color:#927f68;font-style:italic;text-align:center}.personal-letter .letter-wish{margin-top:2rem;color:#986f3b}.personal-letter .letter-signature{margin-top:2.4rem;text-align:right}.envelope-section>.scroll-cue{color:#fff7e6c7}.general-section{position:relative;padding:clamp(5rem,10vw,10rem) max(3vw,1rem);background-image:var(--background-landscape);background-size:cover;background-position:center;background-attachment:fixed;isolation:isolate}.general-section:before{background:#0f120d94}.general-paper{width:min(860px,100%);margin:0 auto;padding:clamp(3rem,8vw,7rem) clamp(1.5rem,8vw,6.5rem);border:1px solid rgba(117,91,60,.18);background:var(--paper) url(/assets/mobile-paper-background.webp) center top/cover;box-shadow:0 28px 90px #0a0c0857,inset 0 0 0 10px #fffcf44d}.general-paper header{text-align:center}.general-paper h2{margin:1.5rem auto 4rem;color:#9a6f38;font-size:clamp(2.5rem,5vw,4.7rem);font-weight:400;letter-spacing:.05em;line-height:1.35}.general-copy{width:min(38rem,100%);margin:0 auto}.general-copy p{margin:0 0 1.45rem;color:#5e5347;font-size:clamp(1rem,1.3vw,1.12rem);letter-spacing:.04em;line-height:2.15}.general-copy p:first-child{color:#3e372f;font-size:1.17rem}.letter-closing{width:min(38rem,100%);margin:3rem auto 0;color:#746758;text-align:right}.letter-closing p{margin:0 0 .4rem;letter-spacing:.14em}.letter-closing time{font-size:.78rem;letter-spacing:.12em}.participants-photo{width:min(34rem,88%);margin:clamp(5rem,9vw,8rem) auto 0}.participants-photo img{display:block;width:100%;border:8px solid #fffaf0;box-shadow:0 16px 45px #48351f2e}.participants-photo figcaption{margin-top:1rem;color:#8a7965;font-size:.76rem;letter-spacing:.18em;text-align:center}.participants{width:min(38rem,100%);margin:clamp(4rem,7vw,6rem) auto 0;text-align:center}.participants h3{margin:.65rem 0 1.3rem;font-size:1.5rem;font-weight:400;letter-spacing:.25em}.participants__line{width:100%;height:1px;background:#7d654659}.participants__names{display:flex;justify-content:center;gap:.9rem 1.65rem;margin:1.5rem auto 0;flex-wrap:wrap}.participant-name{display:inline-flex;align-items:baseline;gap:.58rem;color:#66594a;white-space:nowrap}.participant-name>span{font-size:.92rem;letter-spacing:.12em}.participant-name i{color:#9a7545;font-family:Georgia,Times New Roman,serif;font-size:.82rem;font-style:italic;letter-spacing:.06em}.participants small{display:block;margin-top:1.15rem;color:#9b8d7c;font-size:.65rem;letter-spacing:.24em}[data-reveal]{opacity:0;transform:translateY(30px);transition:opacity 1.1s ease,transform 1.1s ease}[data-reveal].is-visible{opacity:1;transform:translateY(0)}@media(max-width:760px){.hero{background-image:var(--background-portrait);background-position:center}.hero:before{background:#0708064d}.hero--phase-1:before,.hero--phase-2:before,.hero--phase-3:before,.hero--phase-4:before{background:#0708069e}.hero__visual{top:1rem;left:50%;width:calc(100% - 2rem);height:38svh;aspect-ratio:auto;border:6px solid rgba(255,250,239,.92);border-radius:3px;box-shadow:0 16px 42px #00000059}.hero__photo{object-fit:contain}.hero__photo{object-position:center center}.hero__dear{top:43svh;left:1.4rem;width:min(42vw,11rem)}.hero__name{top:59svh;color:#fff8e9}.hero__name span{margin-bottom:.5rem;color:#fff6e494;font-size:.5rem;letter-spacing:.3em}.hero__name h1{font-size:clamp(3.1rem,16vw,5.4rem);text-shadow:0 3px 24px rgba(0,0,0,.42)}.hero__name-animation-frame{width:min(21rem,82vw);height:clamp(6rem,30vw,8.5rem);margin:-1.2rem auto -1.1rem}.hero__name p{margin-top:.8rem;color:#fff6e4bf;font-size:.66rem}.hero>.scroll-cue{bottom:1.2rem;color:#fff6e4b8;font-size:.65rem}.envelope-section{grid-template-columns:1fr;align-content:center;gap:2.2rem;padding:5.5rem 1.25rem 6.5rem;background-image:var(--background-portrait);background-position:center}.envelope-intro{justify-self:start;width:100%}.envelope-intro h2{font-size:clamp(2.6rem,12.5vw,3.75rem)}.envelope-stage{min-height:auto}.envelope-button{width:min(24rem,88vw)}.personal-letter{padding:2.3rem 1.6rem 2.7rem}.general-section{padding:1rem 0;background-image:var(--background-portrait);background-attachment:scroll}.general-paper{width:calc(100% - 1.5rem);padding:4.5rem 1.4rem 3.5rem;box-shadow:0 18px 55px #0a0c0847,inset 0 0 0 6px #fffcf447}.general-paper h2{margin-bottom:3rem}.participants-photo{width:92%}.participants__names{gap:.8rem 1.15rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}[data-reveal]{opacity:1;transform:none}}