:root{color-scheme:light;--paper:#f8f5ef;--ink:#4e4655;--muted:#918497;--lilac:#eae3ef;--serif:"Songti SC","STSong","Noto Serif CJK SC","SimSun",serif;--sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overflow-wrap:break-word}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #7d658d;outline-offset:6px}[hidden]{display:none!important}main{max-width:860px;margin:0 auto}img{display:block;max-width:100%}.preview-note{padding:10px 16px;background:#eae3ef;color:#74667c;text-align:center;font-size:12px;letter-spacing:.08em;line-height:1.6}
.cover{position:relative;isolation:isolate;min-height:700px;min-height:min(920px,100svh);height:850px;height:min(920px,100svh);max-height:1050px;background:#e7e0de;overflow:hidden}.cover-photo{position:absolute;inset:0;z-index:-3;overflow:hidden}.cover-photo>button{display:block;width:100%;height:100%;border:0;padding:0;background:none;cursor:zoom-in}.cover-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;opacity:.96}.cover-wash{position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,rgba(248,245,239,.38) 0%,rgba(248,245,239,.32) 42%,rgba(248,245,239,.82) 70%,#f8f5ef 100%)}.cover-content{position:absolute;bottom:12%;left:0;right:0;text-align:center;padding:30px 16px 20px;background:linear-gradient(180deg,transparent,rgba(248,245,239,.7) 34%,rgba(248,245,239,.65) 82%,transparent)}.date{font-size:11px;letter-spacing:.27em;color:#7b6e83;margin:0 0 20px}h1{font-family:var(--serif);font-weight:400;font-size:clamp(30px,7.5vw,48px);letter-spacing:.1em;line-height:1.65;margin:0 0 15px}h1 span{display:block}h1 span:first-child{font-size:.8em;letter-spacing:.18em}h1 span:last-child{white-space:nowrap}.subtitle{font-size:12px;line-height:1.8;letter-spacing:.04em;margin:0;color:#786c7f}.scroll-cue{position:absolute;bottom:32px;left:calc(50% - 22px);display:flex;width:44px;height:44px;align-items:center;justify-content:center;color:#8d7d99;text-decoration:none;font-size:23px;font-weight:200}
.chapter{padding:66px 26px 0}.chapter-heading{display:flex;gap:11px;align-items:baseline;margin-bottom:32px}.chapter-number{font-size:10px;letter-spacing:.08em;color:#a293ab;white-space:nowrap}h2{font:400 clamp(18px,4.8vw,26px)/1.6 var(--serif);letter-spacing:.05em;margin:0}.heading-line{height:1px;background:#ded5df;flex:1;align-self:center;margin-left:6px;min-width:12px}.collage{display:grid;gap:16px;align-items:start}.photo-card{margin:0;min-width:0;position:relative}.photo-button{position:relative;display:block;width:100%;padding:0;border:0;border-radius:3px;background:#ebe5e8;overflow:hidden;cursor:zoom-in;box-shadow:0 4px 16px rgba(67,47,73,.025);transition:box-shadow .15s ease}.photo-button:hover{box-shadow:0 6px 20px rgba(67,47,73,.05)}.photo-button img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}.her-collage{grid-template-columns:1.05fr 1fr;gap:19px 15px}.her-collage .photo-card:nth-child(1){transform:rotate(-2deg);margin:3px 0 0}.her-collage .photo-card:nth-child(2){transform:rotate(2deg);margin-top:35px}.her-collage .photo-card:nth-child(3){transform:rotate(1.5deg);margin-top:4px}.her-collage .photo-card:nth-child(4){transform:rotate(-2deg);margin-top:-30px}.her-collage .photo-button{aspect-ratio:3/4}.her-collage .photo-card:nth-child(1) .photo-button{aspect-ratio:3/4.2}.her-collage .photo-card:nth-child(3) .photo-button{aspect-ratio:3/4.3}.portrait-quote{font:400 clamp(13px,3.8vw,19px)/2.15 var(--serif);max-width:440px;margin:38px auto 0;padding:0 10px;text-align:center;letter-spacing:.045em;color:#77667e}.memories{padding-top:56px}.memories .chapter-heading{gap:9px}.memories h2{font-size:clamp(17px,4.4vw,24px);letter-spacing:0}.memory-collage{--memory-stagger:24px;grid-template-columns:1fr 1fr;gap:18px 14px}
.memory-collage .photo-card:nth-child(1){grid-column:1/-1;transform:rotate(-1deg);margin:0 28px 9px}
.memory-collage .photo-card:nth-child(1) .photo-button{aspect-ratio:3/4}
.memory-collage .photo-card:nth-child(1) img{object-fit:contain;background:#eae4df}
.memory-collage .photo-card:nth-child(2){transform:rotate(-2deg)}
.memory-collage .photo-card:nth-child(2) .photo-button{aspect-ratio:4/3}
.memory-collage .photo-card:nth-child(3){margin-top:var(--memory-stagger);transform:rotate(2.5deg)}
.memory-collage .photo-card:nth-child(4){margin-top:calc(-58.3333% - var(--memory-stagger));transform:rotate(1.5deg)}
.memory-collage .photo-card:nth-child(5){margin-top:12px;transform:rotate(-2deg)}
.memory-collage .photo-button{aspect-ratio:3/4}
.wish-section{padding:84px 18px 0}.wish-card{position:relative;max-width:610px;margin:auto;padding:30px 12px 28px;background:#eae3ef;border-radius:5px;text-align:center;transform:rotate(-1deg);box-shadow:0 7px 25px rgba(87,65,98,.035)}.wish-heart{font-size:24px;color:#aa96b4;display:block;margin:0 0 16px}.wish-card p{font:400 clamp(16px,4.4vw,21px)/1.9 var(--serif);margin:0;color:#64526f;letter-spacing:0;white-space:nowrap;text-align:center}.wish-line{display:block;height:1px;width:38px;background:#bcacc5;margin:25px auto 0}.egg-section{text-align:center;padding:23px 0 0}.egg-toggle{position:relative;display:inline-flex;gap:9px;align-items:center;border:0;border-bottom:1px dashed #b5a6be;border-radius:0;background:transparent;padding:10px 4px 8px;color:#8a7597;font:400 14px/1.5 var(--serif);letter-spacing:.12em;cursor:pointer;min-height:44px;transition:color .15s ease,border-color .15s ease}.egg-toggle:hover,.egg-toggle[aria-expanded=true]{color:#654e75;border-color:#8e739e}.egg-arrow{transition:transform .15s ease}.egg-toggle[aria-expanded=true] .egg-arrow{transform:rotate(90deg)}.egg-gallery{display:grid;grid-template-columns:1fr 1fr;gap:19px 15px;padding:38px 7px 0;text-align:left}.egg-gallery .photo-button{aspect-ratio:3/4}.egg-gallery .photo-card:nth-child(1){transform:rotate(-2deg)}.egg-gallery .photo-card:nth-child(2){margin-top:28px;transform:rotate(2deg)}.egg-gallery .photo-card:nth-child(3){width:70%;grid-column:1/-1;justify-self:center;transform:rotate(-1deg)}.egg-gallery figcaption{font-size:11px;color:#96849f;letter-spacing:.12em;text-align:center;margin-top:11px}footer{text-align:center;padding:83px 24px max(48px,env(safe-area-inset-bottom))}.footer-flower{display:block;color:#b8a6c2;font-size:27px;font-weight:200;margin-bottom:24px}.farewell{font:400 24px/1.7 var(--serif);margin:0 0 15px;letter-spacing:.055em}.signature{font-family:Georgia,var(--serif);font-size:11px;letter-spacing:.15em;color:#a08da9;margin:0}
.missing-photo{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:20px 10px;background:#eae4e8;min-height:100%;color:#99889f;text-align:center;border:1px solid #ddd2df}.missing-photo .missing-icon{font-size:21px;line-height:1;color:#b6a5bd;font-family:var(--serif)}.missing-photo .missing-name{font-size:11px;line-height:1.8;letter-spacing:.025em}.missing-photo .missing-status{font-size:9px;letter-spacing:.12em;opacity:.8}.photo-button:disabled{cursor:default}.cover-photo>.missing-photo{padding-bottom:250px;background:#e9e2e3;color:#8a798f;gap:14px}.cover-photo .missing-icon{font-size:30px}.cover-photo .missing-name{font-size:13px;max-width:260px}.cover-photo .missing-status{font-size:10px}.cover-photo .missing-file{font-size:10px;letter-spacing:0;color:#a38fa9;word-break:break-all}
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(34,29,38,.97);display:flex;align-items:center;justify-content:center;color:#f5f0f7;padding:70px 12px max(60px,env(safe-area-inset-bottom));touch-action:pan-y pinch-zoom}.lightbox-close{position:absolute;top:max(16px,env(safe-area-inset-top));right:15px;width:48px;height:48px;border:0;background:rgba(255,255,255,.08);border-radius:50%;color:white;font:300 33px/1 var(--sans);cursor:pointer}.lightbox-figure{margin:0;width:100%;max-width:1100px;min-width:0}.lightbox-frame{display:flex;align-items:center;justify-content:center;height:calc(100vh - 185px);height:calc(100dvh - 185px)}.lightbox-image,.lightbox-frame img{width:auto;height:auto;max-height:100%;max-width:100%;object-fit:contain}.lightbox figcaption{display:flex;justify-content:space-between;gap:12px;padding:17px 3px 0;font-size:11px;color:#d3c5db;line-height:1.6}.lightbox-prev,.lightbox-next{position:absolute;top:calc(50% - 25px);z-index:2;border:0;border-radius:50%;background:rgba(34,29,38,.55);width:44px;height:50px;color:#fff;font-size:33px;cursor:pointer}.lightbox-prev{left:5px}.lightbox-next{right:5px}.lightbox-help{position:absolute;bottom:max(15px,env(safe-area-inset-bottom));margin:0;color:#a89bb1;font-size:10px;letter-spacing:.06em}.noscript-note{padding:20px;text-align:center;font-size:13px}
@supports not (aspect-ratio:3/4){.photo-button{height:270px}.memory-collage .photo-card:first-child .photo-button{height:230px}}
@media(min-width:640px){body{padding:30px 0}.cover{border-radius:6px 6px 0 0;height:920px;min-height:850px}.cover-content{bottom:10%}main{background:var(--paper);box-shadow:0 12px 65px rgba(78,59,86,.055)}.chapter{padding-left:70px;padding-right:70px;padding-top:80px}.chapter-heading{margin-bottom:42px}.her-collage{gap:25px 35px;max-width:600px;margin:auto}.her-collage .photo-card:nth-child(2){margin-top:70px}.portrait-quote{margin-top:46px;font-size:19px;max-width:460px}.memories{padding-top:64px}.memory-collage{--memory-stagger:45px;gap:28px 36px}.memory-collage .photo-card:nth-child(1){margin:0 80px 16px}.memory-collage .photo-card:nth-child(5){margin-top:15px}.wish-section{padding:100px 50px 0}.wish-card{padding:34px 22px}.egg-section{padding:25px 46px 0}.egg-gallery{grid-template-columns:repeat(3,1fr);gap:24px}.egg-gallery .photo-card:nth-child(3){width:100%;grid-column:auto;margin-top:9px}footer{padding-top:95px;padding-bottom:65px}.farewell{font-size:28px}.lightbox{padding-left:65px;padding-right:65px}.lightbox-prev{left:15px}.lightbox-next{right:15px}}
@media(max-width:359px){.chapter{padding-left:20px;padding-right:20px}.chapter-heading{gap:7px}.chapter-number{font-size:9px}.memories h2{font-size:15px}.heading-line{margin-left:0;min-width:3px}.wish-section{padding-left:18px;padding-right:18px}.wish-card{padding-left:12px;padding-right:12px}.subtitle{font-size:11px}.cover{min-height:650px}.lightbox figcaption{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Keep both lines of the personal note intact on narrow phones. */
.portrait-quote span{white-space:nowrap}.her-collage .photo-card:nth-child(2) .photo-button{aspect-ratio:4/3}.egg-gallery .photo-button{background:#e9e2eb}.egg-gallery .photo-button img{object-fit:contain}@media(min-width:640px){.cover-photo img{object-fit:contain}}

/* Feather only a narrow perimeter; all image pixels remain untouched. */
.photo-button{--photo-feather:clamp(6px,1.2vw,10px)}
.photo-button::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,var(--paper),rgba(248,245,239,0) var(--photo-feather),rgba(248,245,239,0) calc(100% - var(--photo-feather)),var(--paper)),linear-gradient(180deg,var(--paper),rgba(248,245,239,0) var(--photo-feather),rgba(248,245,239,0) calc(100% - var(--photo-feather)),var(--paper))}

/* A small corner detail; its quiet icon still has a comfortable touch target. */
.secret-corner{display:flex;align-items:center;justify-content:flex-end;gap:0;margin:28px -10px -10px 0}
.secret-hint{font:400 10px/1.7 var(--serif);letter-spacing:.035em;color:#897b91}
.secret-trigger{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;background:transparent;color:#a08baa;cursor:pointer}
.secret-trigger:hover{color:#786385}
.secret-overlay{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:24px 20px;overflow-y:auto;background:rgba(62,49,73,.24);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.secret-overlay:focus{outline:none}
.secret-dialog{position:relative;width:100%;max-width:360px;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);overflow-y:auto;padding:36px 24px 28px;border:1px solid rgba(255,255,255,.65);border-radius:18px;background:#f8f5f9;box-shadow:0 15px 60px rgba(66,49,77,.13);text-align:center}
.secret-close{position:absolute;right:6px;top:6px;width:44px;height:44px;padding:0;border:0;background:transparent;color:#95849f;font:300 27px/1 var(--sans);cursor:pointer}
.secret-spark{display:block;margin-bottom:15px;color:#a48eb0;font-size:23px;line-height:1}
.secret-dialog h2{font:400 20px/1.7 var(--serif);letter-spacing:.055em;margin:0 0 24px;color:#6c5879}
.secret-input{display:block;width:100%;min-height:48px;padding:12px 14px;border:1px solid #d7cbde;border-radius:9px;outline-offset:3px;background:rgba(255,255,255,.65);color:#5c4b68;text-align:center;font:400 16px/1.5 var(--sans);letter-spacing:.025em}
.secret-input:focus-visible{outline:2px solid #b6a2c2}
.secret-input[aria-invalid=true]{border-color:#b5a0bd}
.secret-error{min-height:22px;margin:8px 0 12px;font:400 12px/1.8 var(--sans);color:#917b96}
.secret-confirm{display:block;width:100%;min-height:46px;padding:11px 18px;border:1px solid #dacee1;border-radius:9px;background:#e7ddec;color:#685174;font:400 15px/1.5 var(--serif);letter-spacing:.12em;cursor:pointer}
.secret-confirm:hover{background:#e0d4e7}
.secret-audio-frame{width:100%;height:54px;border:0;border-radius:999px;overflow:hidden;background:#f1f3f4}
.secret-audio-frame:focus-within{outline:2px solid #b6a2c2;outline-offset:3px}
.secret-player audio{display:block;width:100%;height:54px;min-width:0;border:0;border-radius:inherit;outline:none;box-shadow:none;color-scheme:light}
.secret-status{min-height:22px;margin:14px 0;font:400 12px/1.8 var(--sans);color:#918099}
.secret-surprise{display:flex;min-height:150px;align-items:center;justify-content:center;padding:8px 0 24px}
.secret-envelope{overflow:visible;animation:secret-envelope-bob 1s ease-in-out both}
.secret-letter{transform-origin:50px 60px;animation:secret-letter-peek 1s cubic-bezier(.2,.7,.3,1) both}
@keyframes secret-envelope-bob{0%{transform:scale(.92) rotate(-5deg)}35%{transform:scale(1.05) rotate(4deg)}70%{transform:scale(1) rotate(-2deg)}100%{transform:scale(1) rotate(0)}}
@keyframes secret-letter-peek{0%,12%{transform:translateY(10px)}55%{transform:translateY(-20px)}75%{transform:translateY(-15px)}100%{transform:translateY(-18px)}}
@media(min-width:640px){.secret-corner{margin-top:30px}.secret-hint{font-size:11px}}
