:root{--ink:#314954;--muted:#586e77;--gold:#967947;--paper:#f8f8f3}*{box-sizing:border-box}html{min-height:100%;background:#eaf1f3}body{margin:0;color:var(--ink);font-family:'Manrope',sans-serif;min-height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button{border:0}a{color:inherit;text-decoration:none}.world{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#fffef8 5%,#e6eef2 50%,#bad3df 100%)}.painting{position:absolute;inset:-3%;background:url('assets/watercolor.png') center 52%/cover no-repeat;will-change:transform;animation:drift 28s ease-in-out infinite alternate}.veil{position:absolute;inset:0;background:linear-gradient(180deg,#edf4f622,transparent 24%,#f3f7f012 70%,#f4f5ef80);pointer-events:none}#water{width:100%;height:100%;position:absolute;inset:0;opacity:.65}header{height:112px;display:flex;justify-content:space-between;align-items:center;padding:0 5%;gap:20px}.brand{display:flex;gap:12px;align-items:center;font-size:12px;font-weight:600;letter-spacing:.19em}.halo{font-family:serif;font-size:40px;line-height:1;color:var(--gold)}.controls{display:flex;gap:24px;align-items:center}.controls button{background:transparent;font-size:12px}.sound-icon{margin-right:5px;font-size:18px}.entrance{text-align:center;min-height:calc(100svh - 208px);display:flex;align-items:center;flex-direction:column;justify-content:center;padding:20px 24px 64px}.eyebrow{font-size:11px;letter-spacing:.28em;font-weight:600;margin:0 0 18px}.small-star{font-size:29px;color:var(--gold);margin-bottom:7px}h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(78px,8.3vw,132px);font-weight:400;line-height:.94;letter-spacing:-.055em;margin:0 0 27px}h1 em{font-weight:400;letter-spacing:-.055em} .intro{font-family:'Cormorant Garamond',Georgia,serif;font-size:25px;line-height:1.35;margin:0 0 31px}.enter{display:flex;align-items:center;justify-content:center;gap:30px;background:#344d57;color:#fffef7;padding:20px 29px;border-radius:2px;box-shadow:0 7px 26px #304a5520;font-size:13px;transition:background .3s,transform .3s}.enter:hover{transform:translateY(-3px);background:#243d47}.button-star{font-size:20px;color:#eadab5}.invitation{font-size:12px;color:var(--muted);margin-top:20px}footer{min-height:96px;display:flex;align-items:center;justify-content:space-between;padding:20px 5%;gap:20px;border-top:1px solid #61798125}footer>span:first-child{font-size:10px;letter-spacing:.18em}.footer-center{font-family:'Cormorant Garamond',serif;font-size:24px}footer button{background:transparent;font-size:12px}footer button span{margin-left:10px;color:var(--gold)}.memories{text-align:center;padding:25px 5% 55px;max-width:1200px;margin:auto}.back{display:block;margin:0 auto 25px;background:transparent;font-size:12px;text-decoration:underline;text-underline-offset:5px}h2{font:400 clamp(45px,5vw,72px)/1.1 'Cormorant Garamond',Georgia,serif;letter-spacing:-.035em;margin:12px 0 15px}.memory-intro{font:22px/1.4 'Cormorant Garamond',Georgia,serif}.gallery{display:flex;gap:32px;align-items:center;justify-content:center;margin:35px auto 20px;max-width:870px}.photo-slot{width:30%;height:280px;border:1px solid #9c885768;background:#ffffff66;box-shadow:inset 0 0 0 8px #ffffff60,0 20px 50px #334b5710;border-radius:150px 150px 3px 3px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;overflow:hidden;position:relative;transition:transform .4s,background .4s}.photo-slot:hover{transform:translateY(-7px);background:#ffffffa0}.photo-slot.tall{height:340px}.photo-slot>span:not(.photo-icon){font:24px 'Cormorant Garamond',serif}.photo-slot small{font-size:12px;color:var(--muted)}.photo-icon{font:30px Georgia;color:var(--gold)}.photo-slot img{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.local-note,#photo-status{font-size:12px;line-height:1.6;color:var(--muted)}#quiet{position:fixed;inset:0;background:#eff4f0e8;backdrop-filter:blur(12px);z-index:4;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}#quiet[hidden],section[hidden]{display:none}#quiet p{font:400 clamp(45px,7vw,90px)/1.15 'Cormorant Garamond',serif;animation:breathe 7s ease-in-out infinite}#quiet>span{font-size:13px;letter-spacing:.04em}#close-quiet{position:absolute;right:5%;top:45px;background:transparent;font-size:14px}.paused *{animation-play-state:paused!important}@keyframes drift{to{transform:scale(1.025) translateY(-.5%)}}@keyframes breathe{50%{opacity:.65;transform:scale(1.035)}}@media(min-width:1700px){.entrance{padding-bottom:90px}}@media(max-width:650px){header{height:88px;padding:0 6%;align-items:center}.brand{font-size:9px;gap:7px;letter-spacing:.12em}.halo{font-size:30px}.controls{gap:12px}.controls button{font-size:11px}.sound-icon{display:none}.eyebrow{font-size:10px;letter-spacing:.18em}h1{font-size:82px}.entrance{min-height:calc(100svh - 200px);padding:40px 20px 55px}.intro{font-size:24px}.invitation{max-width:260px;line-height:1.8}.painting{background-position:center}.enter{padding:18px 24px}footer{flex-wrap:wrap;justify-content:center;padding:20px;gap:15px 30px}footer>span:first-child{width:100%;text-align:center;font-size:9px}.footer-center{font-size:22px}.gallery{gap:12px;flex-wrap:wrap}.photo-slot,.photo-slot.tall{width:min(100%,280px);height:320px}.memories{padding-top:20px}.memory-intro{font-size:22px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* A portrait suspended within the painting. */
body{isolation:isolate}.world{z-index:-1}.painting{animation:none;transition:opacity 1.6s}.world.scene-ready .painting{opacity:0}#water{opacity:1}.veil{background:linear-gradient(180deg,#f5f7f320,transparent 20%,transparent 80%,#f3f6f375)}header{height:86px;position:relative;z-index:3}.brand{font-size:12px}.controls button{font-size:13px}.entrance{position:relative;min-height:calc(100svh - 175px);padding:15px 24px 37px;justify-content:flex-start}.entrance>.eyebrow{margin:0 0 -2px;font-size:12px;letter-spacing:.24em}.portrait-composition{position:relative;width:100%;display:flex;justify-content:center;align-items:center}.portrait-mount{position:relative;aspect-ratio:1;width:clamp(350px,47vh,530px);flex-shrink:0;transform-style:preserve-3d;will-change:transform;animation:portrait-arrive 1.7s both}.portrait-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:2;filter:drop-shadow(0 14px 13px #4a62601b)}.portrait-aperture{position:absolute;left:28%;top:17%;width:44%;height:62%;border-radius:50%;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#fbf6e5,#e5e8dc 75%,#cad9d8);display:flex;align-items:center;justify-content:center;padding:0;box-shadow:inset 0 0 28px #c4ae7840}.portrait-aperture:focus-visible{outline-offset:0;outline:3px solid var(--gold)}.portrait-aperture img{height:100%;width:100%;object-fit:cover;object-position:50% 40%;filter:saturate(.8) sepia(.08);transition:filter .7s}.portrait-aperture:hover img{filter:saturate(1)}.portrait-empty{display:flex;flex-direction:column;align-items:center;gap:13px;font:25px/1.12 'Cormorant Garamond',serif;padding:12px}.portrait-empty small{font:11px/1.7 'Manrope',sans-serif;letter-spacing:.03em}.portrait-plus{font:23px 'Cormorant Garamond',serif;color:#9a8255}.side-dedication{position:absolute;top:45%;font:22px/1.6 'Cormorant Garamond',serif;color:#4b6068;margin:0;text-align:center}.side-dedication.left{right:calc(50% + 270px)}.side-dedication.right{left:calc(50% + 270px)}.side-dedication em{color:#6a7778}.dedication{position:relative;margin:-10px 0 20px;z-index:3}.title-ornament{display:block;font-size:24px;color:#ac8d58;margin:0 0 7px}h1{font-size:clamp(55px,5.5vw,86px);line-height:1.02;letter-spacing:-.04em;margin:0 0 16px}h1 em{letter-spacing:-.045em}.intro{font-size:23px;margin:0}.enter{font-size:14px;padding:17px 28px;border:1px solid #47616b;position:relative;z-index:3}.invitation{font-size:12px;margin:16px 0 0}.portrait-options{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:15px;flex-wrap:wrap;font-size:12px;margin:0 auto 12px;max-width:480px}.portrait-options[hidden]{display:none}.portrait-options button{background:transparent;text-decoration:underline;text-underline-offset:4px;padding:6px}.portrait-options label{display:flex;align-items:center;gap:8px}.portrait-options input{width:80px;accent-color:#967947}.portrait-options>span{width:100%;font-size:11px;color:#586e77}.portrait-message{font-size:12px;margin:0;max-width:330px}.portrait-message:not(:empty){margin:5px 0 12px}.cloud-layer{position:absolute;width:130%;height:65%;bottom:-17%;left:-15%;background:url('assets/clouds.png') center bottom/100% 100% no-repeat;pointer-events:none;will-change:transform;opacity:.78}.cloud-back{animation:cloud-back 34s ease-in-out infinite alternate;filter:blur(1px);bottom:-10%;opacity:.43;transform:scaleX(-1)}.cloud-front{animation:cloud-front 27s ease-in-out infinite alternate}.passage{position:fixed;inset:0;z-index:10;background:radial-gradient(ellipse,#fffef6,#e6eef0);opacity:0;pointer-events:none;transition:opacity .55s}.passing .passage{opacity:1}.memories{animation:memory-arrive 1s both}.photo-slot{transform-style:preserve-3d;transition:transform .35s,background .35s}.memories .gallery{perspective:1000px}.memories .photo-slot{box-shadow:inset 0 0 0 7px #ffffff80,0 25px 60px #3a566c20;border-color:#a48a54}.memories h2{margin-top:20px}footer{min-height:89px;position:relative;z-index:2;border-color:#61798118;background:#f5f6f120}footer>span:first-child{font-size:12px;letter-spacing:.12em}footer button{font-size:13px}#quiet{background:#eff4f0d9}.scene-unavailable .painting{animation:drift 28s ease-in-out infinite alternate}@keyframes cloud-front{from{transform:translate3d(-4%,3%,0) scale(1.04)}to{transform:translate3d(5%,-3%,0) scale(1.12)}}@keyframes cloud-back{from{transform:translate3d(5%,0,0) scaleX(-1)}to{transform:translate3d(-4%,4%,0) scaleX(-1.1)}}@keyframes portrait-arrive{from{opacity:0;transform:translateY(25px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes memory-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@media(min-width:1600px){.portrait-mount{width:530px}.side-dedication.left{right:calc(50% + 340px)}.side-dedication.right{left:calc(50% + 340px)}}@media(max-width:950px){.side-dedication{display:none}.portrait-mount{width:clamp(350px,49vh,460px)}}@media(max-width:650px){header{height:78px;padding:0 5%}.brand{font-size:9px}.controls{gap:14px}.controls button{font-size:12px}.entrance{padding:16px 12px 30px;min-height:calc(100svh - 180px)}.entrance>.eyebrow{font-size:10px;letter-spacing:.13em;margin-bottom:3px}.portrait-mount{width:min(108vw,430px)}.portrait-composition{width:calc(100vw - 24px)}.portrait-empty{font-size:25px}.portrait-empty small{font-size:11px}.dedication{margin:-3px 0 23px}h1{font-size:clamp(46px,10.4vw,65px);line-height:1.02;max-width:95vw;margin-bottom:12px}.intro{font-size:21px;max-width:290px;margin:auto}.title-ornament{font-size:20px;margin-bottom:9px}.invitation{max-width:290px;font-size:12px}.enter{font-size:14px}.cloud-layer{width:220%;left:-60%;height:40%;bottom:-7%;opacity:.5}footer>span:first-child{font-size:10px}.portrait-options{max-width:310px;gap:10px}.portrait-options>span{font-size:11px}footer{gap:12px 24px}.portrait-aperture{z-index:1}}@media(prefers-reduced-motion:reduce){.passage{transition:none}.portrait-mount{will-change:auto}.cloud-layer{will-change:auto}}
.portrait-aperture{left:28.5%;top:19.6%;width:43%;height:56.4%}.portrait-frame{filter:drop-shadow(0 12px 15px #4a62601b)}
.portrait-mount{animation-fill-mode:backwards}@media(max-width:650px){.portrait-mount{width:min(100%,430px)}}
/* Royal violet watercolor and a more expressive cloud procession. */
:root{--ink:#3e2d52;--muted:#665970;--gold:#977337;--paper:#faf7fb}html{background:#eee6f3}.world{background:radial-gradient(ellipse at 50% 38%,#fffaf1 5%,#e3d5ef 50%,#a38abc 100%)}.side-dedication{color:#554165}.side-dedication em{color:#796783}.enter{background:#503365;border-color:#654779;box-shadow:0 8px 30px #45285f26}.enter:hover{background:#3e2453}.portrait-aperture{background:radial-gradient(ellipse at 50% 30%,#fcf4e6,#eee5f1 70%,#d2bfdf)}.cloud-layer{width:160%;left:-30%;height:100%;bottom:-9%;opacity:.69;filter:hue-rotate(43deg) saturate(1.35) contrast(1.12);background-size:100% 100%}.cloud-front{animation:royal-cloud-front 11s ease-in-out infinite alternate}.cloud-back{bottom:-1%;opacity:.42;filter:hue-rotate(48deg) saturate(1.3) contrast(1.1) blur(.5px);animation:royal-cloud-back 16s ease-in-out infinite alternate}.passage{background:radial-gradient(ellipse,#fffaf2,#e8daf1)}#quiet{background:#f2eaf3df}footer{background:#f5edf620;border-color:#68517620}@keyframes royal-cloud-front{0%{transform:translate3d(-9%,4%,0) scale(1.02)}50%{transform:translate3d(0,-1.5%,0) scale(1.055)}100%{transform:translate3d(9%,-5%,0) scale(1.09)}}@keyframes royal-cloud-back{0%{transform:translate3d(8%,-2%,0) scaleX(-1.03)}100%{transform:translate3d(-8%,5%,0) scaleX(-1.12)}}@media(max-width:650px){.cloud-layer{width:240%;left:-70%;height:70%;bottom:-5%;opacity:.58}.cloud-back{bottom:5%;opacity:.35}}@media(prefers-reduced-motion:reduce){.cloud-layer{animation:none!important}}

/* Keep the dedication together and lift the entrance copy. */
.dedication,.entrance>.enter{translate:0 -30px}
.title-ornament{visibility:hidden}
.entrance .intro{white-space:nowrap;max-width:none;width:max-content;font-size:clamp(1rem,5vw,1.4375rem);margin-inline:auto}