:root{--night:#101725;--ink:#272b37;--gold:#d9b77c;--ivory:#f6f0e6;--muted:#bfc0cc;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:72px}body{margin:0;background:var(--night);color:var(--ivory);font-family:Arial,Helvetica,sans-serif;line-height:1.75}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button:disabled{cursor:default;opacity:.3}img{display:block;max-width:100%}button{color:inherit}header{position:absolute;z-index:10;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:24px 5vw;border-bottom:1px solid #f8e1ba20;background:linear-gradient(#0b111cbb,transparent)}.brand{font:25px var(--serif);letter-spacing:6px}.brand span{font-size:17px;color:var(--gold)}nav{display:flex;gap:36px;font-size:12px;letter-spacing:1.4px}nav a{opacity:.82}nav a:hover{color:var(--gold)}.motion{border:1px solid #d9b77c55;border-radius:30px;background:#10172566;padding:6px 14px;font-size:11px;letter-spacing:1px}.motion span{margin-left:5px}.hero{height:min(100svh,1080px);min-height:700px;position:relative;overflow:hidden}.hero-camera{position:absolute;inset:-2%;transform:scale(1.045);will-change:transform}.hero-art{width:100%;height:100%;object-fit:cover;object-position:65% center;max-width:none;will-change:transform}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080e1dda 0%,#0e152378 29%,transparent 65%),linear-gradient(0deg,#101725 0%,transparent 25%);pointer-events:none}.hero-copy{position:absolute;left:9%;top:24%;max-width:500px;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:500;color:var(--gold);margin:0 0 24px}h1,h2,h3,p{margin-top:0}h1{font:clamp(66px,7.3vw,124px)/.98 var(--serif);letter-spacing:-3px;margin:0 0 22px;font-weight:400;text-shadow:0 2px 30px #0d1327}h1 span{font-size:.55em;color:var(--gold);vertical-align:middle}h1 br{display:none}.tagline{font:italic clamp(21px,2.4vw,32px)/1.5 var(--serif);margin:20px 0 16px}.hero-note{font-size:12px;letter-spacing:1.5px;color:#e2d7cf}.ornament{display:flex;align-items:center;gap:16px;color:var(--gold);max-width:170px;margin:24px 0}.ornament:before,.ornament:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold))}.ornament:after{transform:rotate(180deg)}.hero-foot{position:absolute;bottom:37px;right:5%;font-size:9px;letter-spacing:2px;color:#d5c9b8}.hero-foot b{margin:0 12px;color:var(--gold)}.scroll-cue{position:absolute;bottom:31px;left:9%;font-size:9px;letter-spacing:3px;display:flex;align-items:center;gap:24px}.scroll-cue span{font-size:24px;color:var(--gold)}.embrace{position:absolute;bottom:12%;left:71%;display:flex;align-items:center;gap:10px;white-space:nowrap;background:#101725aa;border:1px solid #e4c38880;border-radius:30px;padding:8px 18px;font-size:10px;letter-spacing:1px;backdrop-filter:blur(8px)}.embrace:hover{background:#32283bd9}.embrace-icon{font-size:25px;color:#f8d7b6}.love-status{position:absolute;left:64%;bottom:20%;font:italic 20px var(--serif);text-shadow:0 2px 6px #000;color:#fff1d7}.halo{pointer-events:none;position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 75% 60%,#ffbb6440,transparent 45%)}#magic{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.heart{position:absolute;pointer-events:none;color:#ffdbc0;font-size:22px;text-shadow:0 0 20px #f8bf70}.petals{position:absolute;inset:0;pointer-events:none}.petal{position:absolute;width:7px;height:13px;background:#f3cfcc99;border-radius:80% 0 80% 0;animation:fall var(--duration) linear infinite;animation-delay:var(--delay);top:-5%}@keyframes fall{to{transform:translate(120px,1000px) rotate(330deg)}}.light{color:var(--ink);background:var(--ivory)}h2{font:400 clamp(42px,4.4vw,65px)/1.13 var(--serif);letter-spacing:-1.5px;margin-bottom:16px}.subtitle{font:italic 21px/1.6 var(--serif);opacity:.82}.story{display:grid;grid-template-columns:1fr 1.25fr;align-items:center;padding:110px 8%;gap:8%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 90% 50%,#ebd9bc80,transparent 60%),var(--ivory)}.story .eyebrow,.memories .eyebrow{color:#927341}.story-copy{max-width:455px}.story-copy>p:not(.eyebrow):not(.subtitle){font-size:14px;line-height:1.95;color:#5b5a61}.story-copy em{color:#493c3c}.story-sign{font:italic 21px var(--serif);color:#9b7642;display:block;margin-top:28px}.story-art{margin:0;position:relative}.story-art:before{content:'';position:absolute;inset:-16px 16px 16px -16px;border:1px solid #bf98574d}.story-art .sprite{border-radius:48% 48% 2px 2px;box-shadow:0 22px 48px #4b352c1a}.story-art figcaption{text-align:center;font:italic 13px var(--serif);color:#8a7660;margin-top:24px}.sprite{position:relative;overflow:hidden;width:100%;background:#20273a}.sprite img{position:absolute;max-width:none;height:auto}.letters{position:relative;overflow:hidden;min-height:780px;background:radial-gradient(ellipse at 80% 0%,#313149,#111b2b 60%)}.letter-scenery{position:absolute;width:52%;height:100%;left:0;bottom:0;opacity:.65;mask-image:linear-gradient(90deg,#000 65%,transparent),linear-gradient(0deg,#000,transparent);mask-composite:intersect}.letter-scenery .sprite{height:100%;aspect-ratio:auto!important}.letter-scenery img{width:auto!important;height:476.28%;left:-8%!important;top:-177.9069%!important}.letters-layout{position:relative;display:grid;grid-template-columns:1fr 1.06fr;gap:10%;padding:100px 9%;align-items:start}.letters-intro{padding-top:35px}.letters-intro>p:last-child{font-size:13px;color:#d8d0d7}.letter-paper{position:relative;background:radial-gradient(at 100% 0%,#ead6b7,transparent 45%),linear-gradient(135deg,#fbf5e8,#eee0ca);color:#41404b;border:1px solid #d4b17b;padding:38px 42px 30px;box-shadow:0 20px 60px #02091344;min-height:405px;border-radius:3px}.letter-paper:before{content:'';position:absolute;inset:9px;border:1px solid #b18c5244;pointer-events:none}.letter-top{display:flex;justify-content:space-between;align-items:center;font:22px var(--serif);margin-bottom:22px}.letter-top>span:last-child{color:#b58c45;font-size:30px}.draft-label{font-size:8px;letter-spacing:2px;color:#786347}.letter-paper h3{font:italic 21px var(--serif);margin:8px 0 22px}.letter-paper p{font-size:13px;line-height:1.95}.signature{font:italic 23px var(--serif)!important;margin:26px 0 12px}.paper-star{position:absolute;bottom:14px;right:25px;color:#b98e4c;font-size:29px}#letter-image{margin-top:20px;max-height:250px;object-fit:contain}.letter-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:24px}.round{width:44px;height:44px;flex-shrink:0;border-radius:50%;border:1px solid #c4a57288;background:#101a2b;color:#ead3ad;font-size:22px;display:grid;place-items:center;line-height:1}.round:hover:not(:disabled){background:#4b3a32}.months{display:flex;justify-content:center;flex-wrap:wrap;gap:6px}.months button{background:none;border:0;padding:6px 9px;font-size:10px;color:#d2cad1;border-radius:2px}.months button[aria-pressed=true]{background:#dcc090;color:#292534}.memories{padding:100px 8% 72px;background:radial-gradient(ellipse at top,#fffaf2,#f0e7d9)}.section-heading{text-align:center}.section-heading .ornament{margin:25px auto 45px}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1280px;margin:auto}.memory-card{display:block;padding:0;text-align:left;border:0;border-radius:4px;overflow:hidden;background:none;color:#3c3540}.memory-card .sprite,.memory-card .direct-memory{border-radius:4px;border:1px solid #bea06b66;transition:box-shadow .3s,transform .4s}.memory-card .direct-memory{width:100%;aspect-ratio:2;object-fit:cover}.memory-card:hover .sprite,.memory-card:hover .direct-memory{transform:translateY(-4px);box-shadow:0 10px 22px #a1815755}.memory-card .sprite img{transition:filter .3s}.memory-card:hover img{filter:brightness(1.1)}.memory-meta{display:flex;justify-content:space-between;align-items:center;padding:12px 1px 2px}.memory-name{font:17px var(--serif)}.memory-number{font-size:9px;letter-spacing:1px;color:#9b805b}.gallery-note{text-align:center;font-size:10px;color:#887965;letter-spacing:1px;margin:45px 0 0}.gallery-note span{margin:0 14px}.closing{min-height:670px;position:relative;overflow:hidden;display:flex;align-items:center}.closing-scenery{position:absolute;width:80%;height:100%;right:0;top:0;aspect-ratio:auto!important}.closing-shade{position:absolute;inset:0;background:linear-gradient(90deg,#101725 5%,#101725dd 26%,#10172544 65%),linear-gradient(0deg,#101725,transparent 45%)}.closing-copy{position:relative;margin:100px 9%;max-width:600px}.closing h2{font-size:clamp(40px,4.5vw,66px);line-height:1.15}.closing-copy>p:not(.eyebrow):not(.closing-sign){font-size:13px;color:#d8d0d7}.closing-sign{font:17px var(--serif);letter-spacing:4px;margin-top:36px;color:#ebd0a0}.closing-sign span{font-size:12px}footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:22px 5%;border-top:1px solid #d9b77c22;font-size:10px;color:#c2b7ab}.shooting-star{position:absolute;top:15%;left:80%;width:100px;height:1px;background:linear-gradient(90deg,transparent,#f9d493);transform:rotate(-30deg);animation:shoot 13s infinite}@keyframes shoot{0%,85%{opacity:0;translate:0 0}86%{opacity:1}94%,100%{opacity:0;translate:-500px 260px}}dialog{border:1px solid #a88b6655;background:#0c1220;color:var(--ivory);width:min(1100px,95vw);max-height:94svh;padding:20px 30px;border-radius:6px;overflow:auto}dialog::backdrop{background:#050914ed;backdrop-filter:blur(8px)}.lightbox-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;color:var(--gold);font-size:11px;letter-spacing:2px}.lightbox-main{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:20px}#memory-image{width:100%;max-height:60svh;overflow:hidden}#memory-image>img{width:100%;height:55svh;object-fit:contain}.memory-caption{text-align:center;margin-top:22px}.memory-caption h3{font:25px var(--serif);margin-bottom:6px}.memory-caption p{font-size:12px;color:#c4bbc3;margin-bottom:4px}.memory-caption time{font-size:10px;color:var(--gold)}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip:focus{position:fixed;z-index:100;padding:12px;background:var(--ivory);color:var(--night)}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused{scroll-behavior:auto}
@media(min-width:1500px){.hero-copy{top:28%}.hero-art{object-position:center}h1{font-size:115px}}
@media(max-width:1100px){h1 br{display:block}.hero-copy{left:7%;top:25%}.hero{min-height:650px}.story{gap:6%;padding:85px 7%}.letters-layout{padding:85px 6%;gap:6%}.letter-paper{padding:32px}.gallery{gap:18px}.embrace{left:auto;right:9%}}
@media(max-width:760px){header{padding:20px 6%}.brand{font-size:22px}nav{gap:16px;font-size:10px;letter-spacing:.5px}.motion{padding:5px 10px}.motion span{display:none}.hero{height:920px;max-height:1150px;min-height:780px}.hero-camera{inset:240px -28% 0 -64%}.hero-art{object-position:80% 60%}.hero-shade{background:linear-gradient(180deg,#101725 0%,#101725 19%,#10172580 35%,transparent 55%,#101725 98%)}.hero-copy{top:125px;left:8%;width:84%;text-align:center;max-width:none}.hero-copy .eyebrow{margin-bottom:16px;font-size:9px}h1{font-size:64px;letter-spacing:-2px}h1 br{display:none}.hero-copy .ornament{margin:16px auto}.tagline{font-size:22px;margin:0}.tagline br{display:none}.hero-note{display:none}.embrace{bottom:11%;right:50%;translate:50% 0}.hero-foot{display:none}.scroll-cue{left:50%;translate:-50% 0;bottom:25px;white-space:nowrap}.love-status{left:0;right:0;bottom:17%;text-align:center}.story{grid-template-columns:1fr;padding:72px 8%;gap:48px}.story-copy{max-width:none}.story-art{margin-left:16px}.story-art .sprite{max-height:360px}.letters-layout{grid-template-columns:1fr;padding:68px 7%;gap:28px}.letters-intro{padding:0;text-align:center}.letters-intro h2 br{display:none}.letters-intro .ornament{margin:20px auto}.letters-intro>p:last-child{display:none}.letter-scenery{width:100%;opacity:.28}.letter-paper{padding:32px;min-height:390px}.memories{padding:70px 6% 50px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.memory-name{font-size:15px}.memory-number{display:none}.closing{min-height:740px;align-items:flex-start}.closing-copy{text-align:center;margin:65px 6% 300px;width:88%;max-width:none}.closing-copy .ornament{margin:24px auto}.closing-scenery{width:100%;height:70%;top:auto;bottom:0}.closing-shade{background:linear-gradient(180deg,#101725 12%,#101725c9 38%,transparent 70%,#101725 97%)}.closing h2{font-size:40px}.closing .eyebrow{font-size:8px}.closing-sign{font-size:14px}.gallery-note{font-size:9px;line-height:2}.gallery-note span{display:block}dialog{padding:14px}.lightbox-main{gap:8px;grid-template-columns:32px minmax(0,1fr) 32px}.lightbox-main .round{width:32px;height:38px}.memory-caption h3{font-size:21px}}
@media(max-width:400px){.hero{height:840px}h1{font-size:54px}.gallery{grid-template-columns:1fr}.letter-paper{padding:28px}.months button{font-size:9px;padding:6px}.letter-controls{gap:5px}nav{gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.hero-camera,.hero-art{transform:none!important}}
[hidden]{display:none!important}
@media(min-width:761px){h1 br{display:block}}

/* Original uploaded portraits: no redrawing, recoloring, or distortion. */
.character-portraits:before{display:none}.portrait-pair{display:flex;align-items:flex-end;justify-content:center;gap:0;background:radial-gradient(ellipse at 50% 50%,#e9d6ad66,transparent 70%);padding:20px 0}.portrait-pair img{position:relative;width:54%;height:auto;max-width:none;object-fit:contain;filter:drop-shadow(0 12px 15px #4b352c22)}.portrait-pair img+img{margin-left:-8%}.character-portraits figcaption{margin-top:15px}
@media(max-width:760px){.story-art.character-portraits{margin-left:0}.portrait-pair{max-width:520px;margin:auto}}
/* Living Embrace: complete video scene plus independent browser effect layers. */
.hero-parallax,.hero-zoom{position:absolute;inset:0;will-change:transform}.hero-zoom{transform-origin:32% 53%}.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:35% center;opacity:0;pointer-events:none;transition:opacity .35s}.hero-video.is-ready{opacity:1}.hero-art{object-position:35% center}.hero-shade{background:linear-gradient(270deg,#080e1de8 0%,#0e152395 23%,transparent 55%),linear-gradient(0deg,#101725,transparent 25%)}.hero-copy{left:auto;right:7%;width:32%;top:26%}h1{font-size:clamp(60px,6.5vw,108px)}.hero-copy-inner{will-change:transform}.hero-copy h1 br{display:none}.hero-copy h1{line-height:1.12}.hero-copy h1 span{display:block;margin:2px 0;font-size:.3em}.hero-copy .tagline{font-size:clamp(21px,2vw,29px)}.halo,.hover-halo{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 33% 52%,#ffbb6440,transparent 40%);opacity:0}.hover-halo{transition:opacity .7s}.couple-hover .hover-halo{opacity:.55}.couple-target{position:absolute;left:9%;top:23%;width:48%;height:59%;border:0;background:transparent;cursor:pointer;border-radius:40%;z-index:2}.couple-target:focus-visible{outline-offset:-12px}.embrace{left:26%;right:auto;bottom:12%;z-index:3}.love-status{left:10%;right:auto;width:45%;text-align:center;bottom:20%;pointer-events:none}.scroll-cue{left:auto;right:12%}.ambient-inactive .petal{animation-play-state:paused}.motion-paused .hero-video{opacity:0}.motion-paused .couple-hover .hover-halo{opacity:0}.scroll-cue span{animation:scroll-hint 2.5s ease-in-out infinite}@keyframes scroll-hint{50%{transform:translateY(5px)}}
@media(max-width:1100px) and (min-width:761px){.hero-copy{right:5%;width:32%;top:26%}.hero-copy h1{font-size:62px}}
@media(max-width:760px){.hero-camera{inset:250px -57% 0 -20%}.hero-art,.hero-video{object-position:28% 60%}.hero-shade{background:linear-gradient(180deg,#101725 0%,#101725 19%,#10172580 35%,transparent 55%,#101725 98%)}.hero-copy{top:120px;left:8%;right:auto;width:84%;text-align:center}.hero-copy h1{font-size:58px;line-height:1}.hero-copy h1 span{display:inline;font-size:.55em}.hero-copy .tagline{font-size:22px}.hero-zoom{transform-origin:33% 58%}.couple-target{left:12%;top:43%;width:75%;height:36%}.embrace{left:auto;right:50%;bottom:11%;translate:50% 0}.love-status{left:0;right:0;width:100%;bottom:17%}.scroll-cue{left:50%;right:auto}.halo,.hover-halo{background:radial-gradient(ellipse at 50% 65%,#ffbb6450,transparent 45%)}}
@media(max-width:400px){.hero-copy h1{font-size:49px}}
@media(prefers-reduced-motion:reduce){.hero-parallax,.hero-zoom,.hero-copy-inner{transform:none!important}.hero-video{opacity:0!important}}

/* Supplied standalone section backgrounds. */
.letter-scenery{inset:0;width:100%;height:100%;opacity:1;mask-image:none}
.letter-scenery img{position:static;width:100%!important;height:100%;object-fit:cover;object-position:left bottom}
.letter-scenery{background-image:linear-gradient(90deg,rgba(17,27,43,.75),rgba(17,27,43,.05)),url('assets/bg-monthly.webp');background-size:cover;background-position:center}
.letters:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#10172577,transparent 65%)}
.letters-layout{z-index:1;min-height:780px}
.letters-intro{text-shadow:0 2px 14px #080d20}
.memories{background:linear-gradient(#f6f0e640,#f6f0e680),url('assets/bg-memories.webp') center/cover no-repeat}
.memories .section-heading{max-width:520px;margin:0 auto 40px;padding:22px;border-radius:8px;background:#fff9eedb}
.memory-card{background:#fff9eef2;box-shadow:0 6px 22px #242c4820}
.memory-meta{padding:12px 14px}
.memory-card .direct-memory{width:100%;aspect-ratio:5/3;object-fit:cover;border-radius:4px 4px 0 0}
#memory-image .direct-memory{width:100%;max-height:70svh;object-fit:contain}
.months button{font-size:16px;}
.gallery-note{width:fit-content;margin:38px auto 0;padding:8px 20px;border-radius:30px;background:#fff9eedb}
.closing-scenery{inset:0;width:100%;height:100%}
.closing-scenery img{position:static;width:100%;height:100%;object-fit:cover;object-position:center}
.closing-shade{background:linear-gradient(90deg,#101725e6, #10172580 40%,transparent 70%),linear-gradient(0deg,#101725d9,transparent 25%)}
.closing-copy{max-width:480px;margin-left:7%}

.gallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px;max-width:1280px;margin:auto}.gallery>*{grid-column:span 2}.gallery>:last-child:nth-child(3n+1){grid-column:3/span 2}.gallery>:nth-last-child(2):nth-child(3n+1){grid-column:2/span 2}@media(max-width:767px){.gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.gallery>:last-child:nth-child(3n+1),.gallery>:nth-last-child(2):nth-child(3n+1){grid-column:span 2}.gallery>:last-child:nth-child(2n+1){grid-column:2/span 2}}

@media(max-width:760px){
 .letters-layout{min-height:1080px;padding-bottom:330px}
 .letter-scenery img{object-position:25% bottom}
 .letters:after{background:linear-gradient(180deg,#101725b8, #10172533 60%,transparent)}
 .memories{background-position:center top}
 .closing{min-height:800px}
 .closing-scenery{inset:auto 0 0;height:65%;width:100%}
 .closing-scenery img{object-position:65% center}
 .closing-copy{margin:65px 6% 380px;max-width:none}
 .closing-shade{background:linear-gradient(180deg,#101725 20%,#101725aa 40%,transparent 65%,#101725d9 100%)}
}

.hero-copy{opacity:1!important}
.header-controls { display: flex; align-items: center; gap: 10px; } .music-toggle { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d9b77c55; border-radius: 30px; background: #10172566; color: inherit; padding: 6px 14px; font: inherit; font-size: 11px; letter-spacing: 1px; cursor: pointer; } .music-toggle[aria-pressed="true"] { border-color: #d9b77c; color: #ead3ad; } @media (max-width: 760px) { .header-controls { gap: 6px; } .music-toggle { padding: 5px 10px; } .music-toggle > span:last-child { display: none; } }

.letter-controls{background:linear-gradient(90deg,rgba(20,15,35,.75),rgba(35,25,45,.45),rgba(20,15,35,.75));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,220,170,.12);border-radius:100px}