:root{--ink:#102e25;--ivory:#fff8e6;--sage:#dce8bd;--serif:Palatino Linotype,Book Antiqua,Georgia,serif;--sans:Segoe UI,Arial,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:var(--ink);color:var(--ivory);font-family:var(--sans)}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--ivory);outline-offset:6px}h1:focus,h2:focus{outline:none}img{user-select:none;-webkit-user-drag:none}[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}.screen{position:absolute;inset:0;overflow:hidden;height:100%;isolation:isolate}.next{display:block;border:0;border-bottom:1px solid #e6ebc760;background:#102e25b5;color:#f7f4df;border-radius:28px;padding:13px 23px;font:18px/1.3 var(--serif);min-height:48px;backdrop-filter:blur(12px);text-align:center}.next span{margin-left:12px}.next:hover{background:#33553d}
.opening{background:radial-gradient(ellipse at 50% 35%,#42664b,#102e25 73%)}.opening-copy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:30px 8% 95px}#opening-message{width:min(700px,100%)}.salutation{font:italic clamp(28px,3vw,40px) var(--serif);margin:0 0 22px}.opening h1{font:400 clamp(46px,6vw,80px)/1.06 var(--serif);letter-spacing:-.045em;margin:0;text-wrap:balance}.opening h1 em{color:var(--sage);font-weight:400}#opening-message>p:last-child{font:clamp(22px,2.5vw,32px)/1.4 var(--serif);max-width:580px;margin:26px auto 0;text-wrap:balance}#flower-cover{position:absolute;inset:0;width:100%;height:100%;z-index:2;touch-action:none;cursor:grab;outline-offset:-7px}#flower-cover:active{cursor:grabbing}.flower-invitation{position:absolute;z-index:3;bottom:5%;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;text-align:center;padding:13px 22px;border-radius:32px;background:#163b2df0;box-shadow:0 6px 35px #0003;font:18px/1.4 var(--serif);pointer-events:none;transition:opacity .5s}.opening.started .flower-invitation{opacity:0}.opening-next{position:absolute;z-index:4;bottom:8%;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;animation:appear .7s both}.opening.revealed #flower-cover{pointer-events:none}
.portrait{background:#182d24}#gaze-stage{position:absolute;inset:0;overflow:hidden}#gaze-man{position:absolute;left:0;top:0;max-width:none;transform-origin:0 0;will-change:transform;pointer-events:none}#eye-reflection{position:absolute;inset:0;pointer-events:none;will-change:clip-path}#reflection-portrait{width:100%;height:100%;object-fit:cover;object-position:50% 34%;transform-origin:center;will-change:transform}.portrait-shade,.night-tint{position:absolute;inset:0;pointer-events:none}.portrait-shade{background:linear-gradient(0deg,#061d17f0,transparent 68%)}.night-tint{background:radial-gradient(ellipse at 52% 35%,transparent 10%,#071b3770 65%,#071b37b0);opacity:0;transition:opacity 1.2s}.portrait.night .night-tint{opacity:1}#gaze-scroll{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;touch-action:pan-y;z-index:2}#gaze-scroll::-webkit-scrollbar{display:none}#gaze-track{height:360%;min-height:360vh}.gaze-caption{position:absolute;z-index:3;bottom:9%;left:7%;right:7%;text-align:center;pointer-events:none}.gaze-caption h2{font:400 clamp(35px,4.3vw,60px)/1.12 var(--serif);letter-spacing:-.035em;margin:0;text-wrap:balance}.gaze-caption p{font:17px var(--serif);margin:22px 0 0;color:#e5ebd3}.gaze-caption p span{display:block;margin-top:12px}.portrait-story{position:absolute;inset:0;z-index:4;animation:appear 1s both}.her-name{position:absolute;top:4%;left:0;right:0;text-align:center;font:italic 25px var(--serif);text-shadow:0 2px 8px #0008}.story-copy{position:absolute;left:7%;right:7%;bottom:228px;max-width:830px;margin:auto;text-align:center;text-shadow:0 2px 16px #062519}#whisper{font:italic 23px var(--serif);margin:0 0 15px}#story-title{font:400 clamp(28px,3vw,42px)/1.15 var(--serif);letter-spacing:-.025em;margin:0;text-wrap:balance}#story-secret{font:clamp(29px,3.6vw,47px)/1.2 var(--serif);margin:16px auto 0;text-wrap:balance;max-width:800px}.portrait.has-secret #story-title{display:none}.portrait:not(.has-secret) #story-secret{font-size:23px}.portrait:not(.flower-phase) .story-copy{bottom:18%}.portrait:not(.flower-phase) #story-title{font-size:clamp(35px,4.5vw,61px)}.portrait:not(.flower-phase) #story-secret{font-size:clamp(26px,3vw,36px);margin-top:23px}#portrait-flowers{position:absolute;bottom:83px;left:50%;transform:translateX(-50%);width:min(660px,94%);display:flex;justify-content:space-around;gap:10px}#portrait-flowers button{border:0;background:transparent;padding:0;display:flex;align-items:center;flex-direction:column;gap:5px;min-width:0;flex:1;animation:rise 1.1s backwards}#portrait-flowers button:nth-child(2){animation-delay:.12s}#portrait-flowers button:nth-child(3){animation-delay:.25s}.bloom{display:block;width:105px;height:105px;background:url(gerbera-atlas.webp) no-repeat;background-size:200% 200%;filter:drop-shadow(0 6px 10px #001d1655);transition:transform .5s}.bloom.yellow{background-position:0 0}.bloom.pink{background-position:100% 0}.bloom.ivory{background-position:0 100%}#portrait-flowers button:hover .bloom,#portrait-flowers button[aria-pressed=true] .bloom{transform:translateY(-6px) rotate(12deg)}#portrait-flowers button>span:nth-child(2){font:italic 21px var(--serif);text-shadow:0 1px 5px #000}#portrait-flowers i{width:4px;height:4px;background:#e5edc9;border-radius:100%;opacity:0}#portrait-flowers .visited i{opacity:1}.story-next{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;animation:appear .6s both}
.pond-scene{background:#123b32 url(pond-photo.webp) center/cover}.pond-fallback{position:absolute;inset:-2%;background:url(pond-photo.webp) center/cover;animation:water-breath 16s ease-in-out infinite alternate;pointer-events:none}.pond-scene canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.pond-shade{position:absolute;inset:0;background:linear-gradient(180deg,#06251d99,transparent 42%,#09271fe0);pointer-events:none}.pond-heading{position:absolute;left:7%;right:7%;top:5%;text-align:center;pointer-events:none}.pond-heading h2{font:400 clamp(34px,4.3vw,60px)/1.08 var(--serif);letter-spacing:-.04em;margin:0 0 18px}.pond-heading p{font:16px/1.4 var(--serif);color:#e1ebd3}.lily{position:absolute;z-index:3;width:clamp(130px,18vw,230px);aspect-ratio:1;transform:translate(-50%,-50%);background:none;border:0;padding:0;touch-action:none;cursor:grab;user-select:none;outline-offset:-8px!important}.lily:active{cursor:grabbing}.lily img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 7px #05271b65);animation:leaf-breathe 6s ease-in-out infinite alternate}.lily:nth-of-type(2) img{animation-delay:-3s}.lily span{position:absolute;top:90%;left:0;right:0;text-align:center;font:italic 20px var(--serif);text-shadow:0 2px 8px #002419}.pond-copy{position:absolute;z-index:4;left:8%;right:8%;bottom:100px;text-align:center;max-width:740px;margin:auto;pointer-events:none;text-shadow:0 2px 14px #06271a}.pond-copy p{font:400 clamp(25px,2.8vw,38px)/1.23 var(--serif);margin:0;text-wrap:balance}.pond-copy em{display:block;color:#edf0cf;font:italic clamp(23px,2.7vw,35px) var(--serif);margin-top:16px}.pond-next{position:absolute;z-index:5;bottom:25px;left:50%;transform:translateX(-50%);max-width:94%;width:max-content}
.confession,.ending{background:#173c2a url(williandri-scene.webp) center 30%/cover;display:flex;align-items:flex-end;justify-content:center;padding:24px 7% max(35px,6vh)}.confession:before,.ending:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#08251dfc 2%,#08251da6 38%,transparent 82%)}.confession-copy,.ending-copy{position:relative;text-align:center;max-width:720px}.eyebrow{font:italic clamp(22px,2.5vw,30px) var(--serif);margin:0 0 15px}.confession-intro{font:19px/1.45 var(--serif);margin:0 0 14px}.confession h2,.ending h2{font:400 clamp(43px,5.6vw,76px)/1.02 var(--serif);letter-spacing:-.04em;margin:0 0 20px}.confession h2 em{color:var(--sage);font-weight:400}.confession-small{font:18px/1.4 var(--serif);margin:0}.responses{position:relative;display:flex;justify-content:center;align-items:center;margin:25px auto 0;min-height:62px}.yes{border:1px solid #eff4d5;background:#e8efce;color:#20442e;padding:17px 40px;min-height:59px;border-radius:50px;font:21px var(--serif);box-shadow:0 4px 25px #061d2426;transition:transform .3s}.yes span{margin-left:15px}.yes:hover{transform:scale(1.04)}.no{position:absolute;left:calc(50% + 150px);border:0;background:transparent;color:#d3ddc5a8;min-width:50px;min-height:44px;cursor:default;transition:transform .12s}.mobile-note{display:none;font:italic 15px/1.4 var(--serif);color:#d0dfc4;max-width:320px;margin:17px auto 0}.ending h2{font-size:clamp(35px,4.5vw,65px);line-height:1.15}.ending p:not(.eyebrow){font:23px/1.5 var(--serif)}.ending .bloom{margin:25px auto 0}
@keyframes appear{from{opacity:0}to{opacity:1}}@keyframes rise{from{opacity:0;translate:0 35px}to{opacity:1;translate:0 0}}@keyframes water-breath{to{transform:scale(1.035) translate(5px,-3px)}}@keyframes leaf-breathe{to{transform:translateY(2px) rotate(1deg)}}
@media(max-width:700px){.opening-copy{padding:30px 9% 100px}.opening h1{font-size:46px}.salutation{font-size:29px;margin-bottom:18px}#opening-message>p:last-child{font-size:24px;margin-top:22px}.flower-invitation{font-size:16px;max-width:86%}.next{font-size:17px}#reflection-portrait{object-position:51% 25%}.portrait-shade{background:linear-gradient(0deg,#09251dfb 1%,#09251d95 36%,transparent 67%)}.her-name{font-size:23px;top:25px}.story-copy{bottom:211px;left:6%;right:6%}#whisper{font-size:20px;margin-bottom:12px}#story-title{font-size:29px}#story-secret{font-size:31px;line-height:1.21}.portrait:not(.has-secret) #story-secret{font-size:22px}.bloom{width:85px;height:85px}#portrait-flowers button>span:nth-child(2){font-size:18px}#portrait-flowers{bottom:81px;gap:3px;width:96%}.portrait:not(.flower-phase) .story-copy{bottom:20%}.portrait:not(.flower-phase) #story-title{font-size:39px}.portrait:not(.flower-phase) #story-secret{font-size:28px}.pond-heading h2{font-size:39px}.pond-heading p{font-size:15px}.lily{width:133px}.lily span{font-size:18px}.pond-copy{left:7%;right:7%;bottom:103px}.pond-copy p{font-size:27px}.pond-copy em{font-size:26px}.confession,.ending{background-position:51% 23%;padding-bottom:6vh}.confession h2{font-size:50px}.confession-intro{font-size:17px}.confession-small{font-size:17px}.eyebrow{font-size:24px}.ending h2{font-size:39px}}
@media(pointer:coarse),(max-width:700px){.no{display:none!important}.mobile-note{display:block}}
@media(max-height:650px){.opening h1{font-size:38px}.salutation{font-size:25px;margin-bottom:12px}#opening-message>p:last-child{font-size:21px;margin-top:17px}.opening-next{bottom:5%}.her-name{top:18px;font-size:21px}.story-copy{bottom:180px}#story-secret{font-size:25px}#whisper{font-size:18px;margin-bottom:8px}#story-title{font-size:25px}#portrait-flowers{bottom:70px}.bloom{width:64px;height:64px}#portrait-flowers button>span:nth-child(2){font-size:16px}.story-next{bottom:15px}.pond-heading{top:4%}.pond-heading h2{font-size:31px;margin-bottom:9px}.pond-heading p{font-size:13px;margin:0}.lily{width:112px}.pond-copy{bottom:83px}.pond-copy p{font-size:22px}.pond-copy em{font-size:22px;margin-top:10px}.pond-next{bottom:17px}.confession,.ending{padding-bottom:20px}.confession h2{font-size:40px;margin-bottom:12px}.confession-intro{font-size:15px}.eyebrow{font-size:21px;margin-bottom:10px}.responses{margin-top:17px}.mobile-note{margin-top:12px;font-size:13px}.ending h2{font-size:32px}.ending p:not(.eyebrow){font-size:20px}.ending .bloom{margin-top:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.screen h1[tabindex]:focus-visible,.screen h2[tabindex]:focus-visible{outline:none}

/* Keep text clear of the flower row, including its lifted hover state. */
.portrait.flower-phase .story-copy{bottom:268px}
@media(max-width:700px){.portrait.flower-phase .story-copy{bottom:243px}}
@media(max-height:650px){.portrait.flower-phase .story-copy{bottom:204px}}

.pond-scene.near .lily img{filter:drop-shadow(0 0 14px #fff5b780) drop-shadow(0 10px 7px #05271b65)}.pond-scene.joined .lily{transition:left .65s ease,top .65s ease;cursor:default}.pond-scene.joined .pond-next{animation:appear .6s both;box-shadow:0 0 28px #e6ebc735}.lily[aria-disabled=true]{cursor:default}

/* Approved longer copy: readable paragraphs without colliding with flowers/actions. */
.opening h1{font-size:clamp(32px,4.1vw,56px);line-height:1.12}
#opening-message>p:last-child{font-size:clamp(18px,2.2vw,27px);line-height:1.45}
.opening-copy{padding-bottom:130px}
.portrait.flower-phase.has-secret #story-title{display:block}
.portrait .story-copy{max-height:calc(100% - 340px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#78927b transparent}
.portrait.flower-phase #story-title{font-size:clamp(26px,2.8vw,38px)}
.portrait.flower-phase #story-secret{font-size:clamp(20px,2.3vw,29px);line-height:1.35;white-space:pre-line}
#story-complete{font:italic clamp(18px,1.9vw,24px)/1.3 var(--serif);color:var(--sage);margin:18px 0 0;text-wrap:balance}
.portrait:not(.flower-phase) .story-copy{bottom:110px;max-height:calc(100% - 190px)}
.portrait:not(.flower-phase) #story-title{font-size:clamp(29px,3.4vw,46px)}
.portrait:not(.flower-phase) #story-secret{font-size:clamp(21px,2.5vw,31px);line-height:1.35;white-space:pre-line}
.pond-copy p{white-space:pre-line}
.pond-scene.joined .pond-copy p{font-size:clamp(20px,2.3vw,30px);line-height:1.25}
.confession-intro{font-size:clamp(18px,2vw,24px);line-height:1.4;text-wrap:pretty}
.confession h2{margin-top:24px}
@media(max-width:700px){
 .opening h1{font-size:34px}.opening-copy{padding:24px 8% 125px}#opening-message>p:last-child{font-size:20px}
 .portrait.flower-phase .story-copy{max-height:calc(100% - 315px)}
 .portrait.flower-phase #story-title{font-size:26px}.portrait.flower-phase #story-secret{font-size:22px}
 .portrait:not(.flower-phase) #story-title{font-size:31px}.portrait:not(.flower-phase) #story-secret{font-size:23px}
 .pond-scene.joined .pond-copy p{font-size:21px}.pond-scene.joined .pond-copy em{font-size:23px}
 .confession-intro{font-size:18px}.confession h2{font-size:46px}
}
@media(max-height:650px){
 .opening h1{font-size:29px}.salutation{font-size:24px}#opening-message>p:last-child{font-size:18px;margin-top:16px}
 .opening-copy{padding-top:18px;padding-bottom:100px}
 .portrait.flower-phase .story-copy{max-height:calc(100% - 260px)}
 .portrait.flower-phase #story-title{font-size:23px}.portrait.flower-phase #story-secret{font-size:19px}
 .portrait:not(.flower-phase) .story-copy{bottom:90px;max-height:calc(100% - 145px)}
 .portrait:not(.flower-phase) #story-title{font-size:27px}.portrait:not(.flower-phase) #story-secret{font-size:20px}
 .pond-scene.joined .pond-copy p{font-size:18px}.pond-scene.joined .pond-copy em{font-size:20px}
 .confession-intro{font-size:16px}.confession h2{font-size:38px;margin-top:15px}
}

/* A single centered voice; keep the portrait and the words, not competing labels. */
.portrait.chapter-phase{--chapter-size:clamp(26px,3.1vw,36px);--chapter-gap:.65em}
.portrait.chapter-phase .portrait-story{display:flex;flex-direction:column;justify-content:flex-start;gap:32px;padding:40px max(24px,7vw) max(44px,7vh);overflow-y:auto;overscroll-behavior:contain}
.portrait.chapter-phase .her-name,.portrait.chapter-phase #whisper{display:none}
.portrait.chapter-phase .story-copy{position:static;inset:auto;width:100%;max-width:880px;max-height:none;overflow:visible;margin:auto auto 0;text-align:center;flex:0 0 auto;text-shadow:0 2px 16px #062519}
.portrait.chapter-phase :is(#story-title,#story-secret,#story-outro){font:400 var(--chapter-size)/1.36 var(--serif);letter-spacing:-.015em;color:var(--ivory);text-wrap:pretty;white-space:normal;max-width:none;margin:0}
.portrait.chapter-phase :is(#story-secret,#story-outro){margin-top:var(--chapter-gap)}
.portrait.chapter-phase .story-next{position:static;transform:none;flex:0 0 auto;align-self:center;margin:0;max-width:100%;font:400 18px/1.3 var(--serif)}
.portrait.chapter-phase .portrait-shade{background:linear-gradient(0deg,#09251dfc 0%,#09251dd4 40%,#09251d66 63%,#09251d10 100%)}
@media(max-width:700px){
 .portrait.chapter-phase{--chapter-size:clamp(22px,5.6vw,28px);--chapter-gap:.65em}
 .portrait.chapter-phase .portrait-story{gap:28px;padding:28px 24px max(40px,6vh)}
}
@media(max-height:650px){
 .portrait.chapter-phase{--chapter-size:clamp(20px,3.2vw,25px);--chapter-gap:.5em}
 .portrait.chapter-phase .portrait-story{gap:24px;padding:24px max(24px,6vw) 30px}
 .portrait.chapter-phase .story-next{font-size:17px}
}
/* Whole-scene overflow remains available for extreme zoom, never a clipped text box. */
@media(max-height:450px){.portrait.chapter-phase .portrait-story{padding-top:20px;padding-bottom:20px;gap:20px}}
/* Longer opening dedication stays inside the flower reveal area. */
#opening-message.opening-prose{max-width:780px}
#opening-message.opening-prose h1{font:400 clamp(28px,3.5vw,46px)/1.2 var(--serif);letter-spacing:-.02em}
#opening-message.opening-prose>p:last-child{max-width:720px;font:400 clamp(20px,2.2vw,28px)/1.5 var(--serif);margin-top:22px;text-wrap:pretty}
@media(max-width:700px){#opening-message.opening-prose h1{font-size:29px}#opening-message.opening-prose>p:last-child{font-size:20px;line-height:1.45}}
@media(max-height:650px){#opening-message.opening-prose h1{font-size:25px}#opening-message.opening-prose>p:last-child{font-size:18px;margin-top:16px;line-height:1.4}}