:root{color-scheme:light;--paper:#fffaf5;--coffee:#51392f;--soft-coffee:#80685a;--rose:#d9839d;--serif:Georgia,'Times New Roman',serif;--sans:'Segoe UI',Arial,sans-serif}
*{box-sizing:border-box}html,body{height:100%}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--coffee);font-family:var(--sans);overflow:hidden}img{max-width:100%}h1,h2,p{margin-top:0}
.stage{position:relative;height:100svh;overflow:hidden}
.intro,.garden{position:absolute;inset:0;width:100%;height:100%;transition:transform .55s cubic-bezier(.4,0,.2,1),opacity .4s ease}
.intro{z-index:2}
.garden{z-index:1;transform:translateX(3%);opacity:0;pointer-events:none}
body.garden-open .intro{transform:translateX(-3%);opacity:0;pointer-events:none}
body.garden-open .garden{transform:translateX(0);opacity:1;pointer-events:auto;z-index:3}
.intro{display:flex;flex-direction:column;background:radial-gradient(circle at 50% 42%,#fffefd 0 23%,transparent 65%),linear-gradient(145deg,#fffaf5 12%,#fbeef0 100%)}.intro:before,.intro:after{content:"";position:absolute;pointer-events:none;border:1px solid #d7b2a766;border-radius:50%;width:45vw;height:45vw;min-width:300px;min-height:300px;transform:rotate(-22deg)}.intro:before{left:-29vw;top:6vh}.intro:after{right:-30vw;bottom:-27vw}
.site-header{padding:27px clamp(24px,5vw,80px);display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:1}.brand{font:italic 20px var(--serif)}.brand span{color:var(--rose);font:30px var(--serif);vertical-align:-3px;margin-left:4px}.date{font-size:14px;letter-spacing:.04em;color:var(--soft-coffee)}
.intro-content{flex:1;position:relative;z-index:1;display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;padding:32px 20px 22px}.eyebrow,.garden-kicker{font-size:14px;letter-spacing:.23em;font-weight:700;margin-bottom:21px}.intro h1,.garden h2{font-family:var(--serif);font-weight:400;line-height:1.06;letter-spacing:-.045em}.intro h1{font-size:clamp(48px,5.5vw,82px);margin:0}.intro h1 em{color:#bd6c83;font-weight:400}.envelope{display:block;width:min(39vw,440px);min-width:250px;height:auto;margin:-20px 0 -25px;filter:drop-shadow(0 18px 18px #80504720);animation:envelope-drift 6s ease-in-out infinite}.scroll-note{font:italic 18px var(--serif);color:var(--soft-coffee);margin:4px 0 0}.scroll-note span{display:inline-block;margin-left:10px;font-style:normal;color:#c77b92}.intro-bottom{display:flex;align-items:center;gap:22px;justify-content:center;padding:19px 24px;border-top:1px solid #dac9c2;color:#8e716a;font:italic 15px var(--serif);position:relative;z-index:1}.intro-bottom span:nth-child(2){color:#c8869c;font:19px var(--sans)}
.garden{isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background:#ead4be}
.back-to-intro{position:absolute;top:18px;left:18px;z-index:5;border:0;background:#fffaf2cc;color:#6d4545;padding:9px 16px;border-radius:100px;font:600 13px var(--sans);cursor:pointer;box-shadow:0 3px 10px #3c28281f;transition:transform .2s ease,background .2s ease}
.back-to-intro:hover{background:#fffaf2;transform:translateY(-1px)}
.garden .site-footer{position:absolute;left:0;right:0;bottom:6px;z-index:4;padding:6px 20px;font-size:13px;opacity:.7}.garden-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:-2}.garden-tint{position:absolute;inset:0;z-index:-1;background:linear-gradient(#fff6eb6e 0%,#fff7f026 38%,transparent 56%,#3e292849 100%)}.garden-heading{text-align:center;padding:clamp(50px,7vh,90px) 22px 20px;color:#583c38;text-shadow:0 1px 5px #fff7e5b3}.garden-kicker{margin-bottom:16px}.garden h2{font-size:clamp(46px,5.1vw,76px);margin:0}.garden h2 em{font-weight:400;color:#a85570}.dedication{display:inline-flex;align-items:center;gap:9px;font:italic clamp(21px,2.2vw,30px) var(--serif);margin:21px 0 0;border-bottom:1px solid #714f4b7d;padding-bottom:7px}.dedication span{color:#c96981;font-size:25px}
.garden-controls{display:flex;align-items:end;justify-content:space-between;gap:30px;padding:0 clamp(22px,5vw,75px) clamp(24px,4vh,52px)}.watering-preview{display:flex;align-items:end;gap:6px;color:#fffaf5;text-shadow:0 2px 6px #3c2b32aa;font:italic 17px var(--serif)}.watering-preview img{width:clamp(100px,12vw,165px);height:auto;filter:drop-shadow(0 10px 8px #432f3055)}.watering-preview span{padding-bottom:13px;max-width:120px}.flower-choice{display:flex;flex-direction:column;align-items:end;gap:10px}.choice-note{color:#fff9f2;text-shadow:0 2px 6px #3c2b32aa;font:italic 17px var(--serif)}.flower-choice button{border:1px solid #784e53;border-radius:100px;background:#fff6efeb;color:#6d4545;padding:15px 21px;box-shadow:0 7px 0 #764a5073,0 13px 18px #41292657;font:600 15px var(--sans);text-align:center;cursor:default}.flower-choice button span{margin-left:16px;color:#bc6d82}.flower-choice button:disabled{opacity:1}.site-footer{text-align:center;padding:17px 20px;color:var(--soft-coffee);font:italic 16px var(--serif)}.site-footer span{color:var(--rose)}@keyframes envelope-drift{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(1deg)}}
@media(max-width:650px){.site-header{padding:19px 21px}.brand{font-size:17px}.date{font-size:12px}.intro-content{justify-content:center;padding-top:25px}.eyebrow,.garden-kicker{font-size:12px;letter-spacing:.19em}.intro h1{font-size:clamp(45px,11vw,62px)}.envelope{width:min(84vw,410px);min-width:0;margin:2px 0 -8px}.scroll-note{font-size:16px}.intro-bottom{font-size:13px;padding:15px}.garden{min-height:100svh}.garden-art{object-position:50% center}.garden-tint{background:linear-gradient(#fff4e7c2 0%,#fff5e28f 30%,transparent 58%,#3e292873 100%)}.garden-heading{padding:64px 15px 0}.garden h2{font-size:clamp(42px,10vw,56px)}.dedication{font-size:22px;margin-top:17px}.garden-controls{padding:0 16px 27px;gap:8px}.watering-preview{display:block}.watering-preview img{display:block;width:107px}.watering-preview span{display:block;font-size:13px;padding:0;margin-top:-6px;max-width:100px}.flower-choice{gap:5px}.choice-note{font-size:13px;text-align:right}.flower-choice button{font-size:12px;line-height:1.35;padding:11px 13px;max-width:194px}.flower-choice button span{margin-left:2px}}
@media(max-width:390px){.brand{font-size:15px}.date{font-size:11px}.garden-controls{align-items:end}.watering-preview img{width:87px}.watering-preview span{font-size:12px}.flower-choice button{max-width:176px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.envelope{animation:none}.intro,.garden{transition:none}}
.garden-art{z-index:0}.garden-tint{z-index:1}.garden-heading,.garden-controls{position:relative;z-index:2}
.envelope-trigger{display:block;position:relative;width:min(39vw,440px);min-width:250px;margin:-20px 0 -25px;padding:0;border:0;background:transparent;cursor:pointer;animation:envelope-drift 6s ease-in-out infinite}.envelope-trigger:focus-visible,.watering-can:focus-visible,.flower-choice button:focus-visible{outline:3px solid #924760;outline-offset:5px}.envelope-trigger .envelope{position:relative;z-index:1;width:100%;min-width:0;margin:0;animation:none;transition:transform .7s ease,opacity .7s ease}.envelope-trigger:hover .envelope{transform:translateY(-5px) rotate(-2deg)}.envelope-note{position:absolute;z-index:0;left:50%;top:36%;transform:translate(-50%,0);width:64%;padding:22px 7px 28px;background:#fffdf7;border:1px solid #dccac2;box-shadow:0 10px 20px #65414125;color:#865565;font:italic clamp(17px,2vw,24px) var(--serif);opacity:0;transition:transform .8s ease,opacity .45s ease}.intro.opening .envelope-trigger{animation:none}.intro.opening .envelope-note{opacity:1;transform:translate(-50%,-75%)}.intro.opening .envelope{transform:translateY(25px) rotate(-3deg);opacity:.55}
.garden-art--yellow{filter:saturate(var(--water-saturation,1));transition:filter .65s ease}.garden-art--roses{opacity:0;clip-path:inset(100% 0 0 0);transition:clip-path 1.25s ease-out,opacity .4s ease}.garden.roses .garden-art--roses{opacity:1;clip-path:inset(0 0 0 0)}.garden.transforming .garden-art--yellow{filter:sepia(.65) brightness(.63) saturate(.48)}.burn-layer{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:linear-gradient(to top,#3e1c1b88 0%,#b7412f9c 11%,#f4a44c97 17%,#ffe6a45b 23%,transparent 36%)}.garden.transforming .burn-layer{animation:burn-sweep 1.55s ease-in-out forwards}.water-effects{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}.garden-heading,.garden-controls{z-index:4}.watering-can{display:block;padding:0;border:0;background:none;cursor:grab;touch-action:none;user-select:none}.watering-can:active{cursor:grabbing}.watering-can img{display:block;pointer-events:none;user-select:none}.watering-preview span{user-select:none}.flower-choice button{cursor:pointer;transition:transform .2s ease,background .2s ease}.flower-choice button:hover{transform:translateY(-2px);background:#fffaf4}.flower-choice button:active{transform:translateY(3px);box-shadow:0 3px 0 #764a5073,0 7px 12px #41292657}.flower-choice button:disabled{cursor:wait}.watering-ghost{position:fixed;z-index:50;pointer-events:none;user-select:none;filter:drop-shadow(0 12px 10px #3c242b66);transform:translate(-38%,-45%) rotate(-13deg)}.watering-preview.dragging .watering-can{opacity:.35}.water-drop{position:absolute;width:7px;height:11px;border-radius:60% 60% 55% 55%;background:#d7f8ffdc;box-shadow:0 0 7px #e9ffff;animation:water-fall .65s ease-in forwards}.bloom-pulse{position:absolute;width:24px;height:24px;border:2px solid #fffbd7d9;border-radius:50%;background:radial-gradient(circle,#fff8b088 0%,transparent 70%);transform:translate(-50%,-50%) scale(.5);animation:bloom-pulse .95s ease-out forwards;mix-blend-mode:screen}.interaction-status{position:absolute;z-index:5;left:50%;bottom:clamp(143px,20vh,185px);transform:translate(-50%,12px);max-width:min(90vw,380px);margin:0;padding:9px 16px;border-radius:22px;background:#fffaf2ed;box-shadow:0 5px 16px #34282a32;color:#784a51;text-align:center;font:italic 16px var(--serif);opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease}.interaction-status.visible{opacity:1;transform:translate(-50%,0)}@keyframes burn-sweep{0%{transform:translateY(95%);opacity:0}20%{opacity:.8}60%{transform:translateY(-10%);opacity:.9}100%{transform:translateY(-100%);opacity:0}}@keyframes water-fall{to{transform:translate(8px,42px) scale(.5);opacity:0}}@keyframes bloom-pulse{to{transform:translate(-50%,-50%) scale(4);opacity:0}}
@media(max-width:650px){.envelope-trigger{width:min(84vw,410px);min-width:0;margin:2px 0 -8px}.watering-ghost{width:107px}.interaction-status{bottom:150px;font-size:14px}.watering-preview span{line-height:1.1}}
@media(prefers-reduced-motion:reduce){.envelope-trigger{animation:none}.envelope-trigger .envelope,.envelope-note,.garden-art--yellow,.garden-art--roses,.interaction-status{transition:none}.garden.transforming .burn-layer,.water-drop,.bloom-pulse{animation:none}}
.flower-choice button .choice-label{margin-left:0;color:inherit}.ember{position:absolute;width:5px;height:5px;border-radius:50%;background:#ffd797;box-shadow:0 0 10px 3px #e47f49aa;pointer-events:none;animation:ember-rise 1.35s ease-out forwards}@keyframes ember-rise{to{transform:translate(24px,-140px) scale(.3);opacity:0}}@media(prefers-reduced-motion:reduce){.ember{animation:none}}
