/* A living enchanted forest: doors, butterflies, portrait frame and leaf transitions. */
.cover{perspective:1400px;background:linear-gradient(#0e291f20,#0e291f70),url('assets/forest.webp') center 48%/cover}
.cover-frame{z-index:4;background:radial-gradient(ellipse,#0d291fea 0%,#163e2eab 45%,transparent 73%);transition:opacity .6s ease,transform .8s ease;filter:drop-shadow(0 6px 20px #0b231f)}
.gate-doors{position:absolute;inset:0;z-index:2;display:flex;perspective:1400px;pointer-events:none}
.gate-door{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(90deg,#0c221a63,#2347313d);border-bottom:1px solid #dabd78;transform-style:preserve-3d;backface-visibility:visible;transition:transform 1.9s cubic-bezier(.2,.65,.2,1),opacity 1.8s ease;filter:drop-shadow(0 1px 5px #011a0b)}
.gate-left{left:0;transform-origin:0 50%}.gate-right{right:0;transform-origin:100% 50%}
.gate-door svg{width:100%;height:100%;overflow:visible}.gate-right svg{transform:scaleX(-1)}
.gate-door path{vector-effect:non-scaling-stroke}.gate-outline{fill:#163e2e22;stroke:#dcc080;stroke-width:2.7}.gate-rails{fill:none;stroke:#c4aa6c;stroke-width:1.5}.gate-scrollwork{fill:none;stroke:#dec080;stroke-width:1.8}.gate-door circle{fill:#d8bc79;stroke:#f7e1ae;stroke-width:1}.gate-vine{fill:none;stroke:#83a760;stroke-width:5}.gate-leaves{fill:#73a15e;stroke:#a4ba6d;stroke-width:1}.gate-flowers circle{fill:#faf1d0;stroke:#d6b96d;stroke-width:3}
.cover.opening .gate-left{transform:rotateY(-105deg);opacity:.2}.cover.opening .gate-right{transform:rotateY(105deg);opacity:.2}.cover.opening .cover-frame{opacity:0;transform:translateY(-22px);pointer-events:none}
.gate-reveal{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;opacity:0;transform:scale(.93);transition:opacity 1s .4s ease,transform 1.7s .3s ease;color:#fff8e7;text-shadow:0 2px 25px #102e1f}
.gate-reveal span{font:10px Arial;letter-spacing:3px;text-transform:uppercase;color:#e7d2a2}.gate-reveal strong{font:italic 110px Georgia,serif;font-weight:normal}.gate-reveal i{font-size:18px}.cover.opening .gate-reveal{opacity:1;transform:scale(1)}
.skip-entrance{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);z-index:6;white-space:nowrap;border:0;border-bottom:1px solid #c5a26480;background:#163e2eaa;padding:12px 14px;color:#f9e9c5;font:11px Arial;letter-spacing:1px;cursor:pointer}
.hero{padding:90px 25px 50px;min-height:100svh}.hero h1{font-size:clamp(70px,10vw,122px)}.hero .tiny-crown{margin:15px 0 8px}.hero-age{font-size:23px;margin:10px 0}.hero .ornament{margin:22px 0 12px}.hero-quote{font-size:18px;margin:12px 0}.hero .date-line{margin-top:20px}.hero .scroll{margin-top:25px}
.portrait-frame{position:relative;width:210px;margin:25px auto 22px;isolation:isolate}.portrait-window{position:relative;width:180px;height:245px;margin:auto;overflow:hidden;border-radius:48% 48% 44% 44%;border:3px solid #d9ba7b;outline:1px solid #d5bb8080;outline-offset:7px;background:#1b3e2a;box-shadow:0 0 35px #c5a26435,0 10px 25px #061d1460}
.portrait-window img{width:100%;height:100%;object-fit:cover;display:block}.portrait-placeholder img{filter:brightness(.65)}.portrait-monogram{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fff5d9;text-shadow:0 0 25px #152d1d}.portrait-monogram span{font-size:55px;font-style:italic}.portrait-monogram i{font-size:12px;letter-spacing:1px}
.portrait-halo{position:absolute;width:270px;height:270px;border-radius:50%;background:radial-gradient(ellipse,#dfc48035,transparent 67%);left:-30px;top:0;z-index:-1}
.portrait-branch{position:absolute;top:30px;width:85px;height:230px;color:#8bac64;z-index:2;filter:drop-shadow(0 1px 2px #0d271c)}.branch-left{left:-22px;transform:rotate(-13deg)}.branch-right{right:-22px;transform:scaleX(-1) rotate(-13deg)}
.portrait-flower{position:absolute;color:#f8efd4;z-index:3;text-shadow:0 1px 5px #c5a264;line-height:1}.flower-one{font-size:34px;left:5px;bottom:54px;transform:rotate(-20deg)}.flower-two{font-size:25px;right:3px;top:55px;transform:rotate(15deg)}.flower-three{font-size:19px;left:8px;top:86px}
.portrait-frame figcaption{font:italic 12px Georgia;margin-top:21px;color:#e0ceac;letter-spacing:.3px}
.butterfly-field,.falling-leaves{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2}.butterfly-flight{position:absolute;left:var(--flight-left);top:var(--flight-top);width:var(--butterfly-size,40px);height:var(--butterfly-size,40px);opacity:.9;animation:butterfly-drift var(--flight-duration,12s) ease-in-out infinite alternate;animation-delay:var(--flight-delay,0s);animation-play-state:paused;will-change:transform}
.butterfly{width:100%;height:100%;color:#e3c57e;filter:drop-shadow(0 0 5px #efd397aa)}.paper .butterfly,.dress .butterfly{color:#759656;filter:drop-shadow(0 0 4px #caaf6590)}.butterfly-body{fill:#fff0c4}.butterfly-antenna{stroke:#f4e4ae;stroke-width:1.1;fill:none}.wing-left,.wing-right{fill:currentColor;stroke:#faf0cd;stroke-width:.75;transform-box:view-box;transform-origin:50% 50%;animation:wingbeat .58s ease-in-out infinite alternate;animation-play-state:paused}.wing-right{animation-delay:-.18s}.wing-detail{fill:none;stroke:#fff5d2;stroke-width:.7;opacity:.8}
.cover .butterfly-flight,.hero .butterfly-flight,.is-enchanted .butterfly-flight,.cover .wing-left,.cover .wing-right,.hero .wing-left,.hero .wing-right,.is-enchanted .wing-left,.is-enchanted .wing-right{animation-play-state:running}
.falling-leaf{position:absolute;top:-30px;left:var(--leaf-left);width:var(--leaf-size,16px);height:var(--leaf-size,16px);color:var(--leaf-color,#a8b77a);opacity:0;animation:leaf-fall var(--leaf-duration,12s) linear infinite;animation-delay:var(--leaf-delay,0s);animation-play-state:paused}.falling-leaf svg{width:100%;height:100%;filter:drop-shadow(0 0 2px #c5a26455)}.is-enchanted .falling-leaf{animation-play-state:running}.forest-divider{position:absolute;top:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:23px;pointer-events:none;color:#799a5870;width:220px;height:50px;z-index:0}.forest-divider svg{width:34px;height:52px;transform:rotate(65deg)}.forest-divider svg:last-child{transform:scaleX(-1) rotate(65deg)}.forest-divider span{color:#b59456;font-size:19px;text-shadow:0 0 8px #dec88b50}.countdown-section .forest-divider,.rsvp-section .forest-divider{color:#a1b86f80}.reveal{transition:opacity 1s ease,transform 1s ease}.reveal.visible{animation:forest-arrival .9s ease both}.section-botanical{color:#71995765}.paper .spark{box-shadow:0 0 12px 4px #c5a26460}
body.effects-paused .spark,body.effects-paused .butterfly-flight,body.effects-paused .wing-left,body.effects-paused .wing-right,body.effects-paused .falling-leaf,body.effects-paused .section-botanical{animation-play-state:paused}
.motion-toggle{position:fixed;left:15px;bottom:19px;z-index:29;display:flex;align-items:center;gap:5px;background:#163e2ef0;border:1px solid #c5a26490;color:#f3e6bf;padding:9px 11px;border-radius:24px;cursor:pointer;font:10px Arial;letter-spacing:.2px;box-shadow:0 2px 12px #0b2f1e30}
@keyframes wingbeat{from{transform:scaleX(1)}to{transform:scaleX(.25)}}
@keyframes butterfly-drift{0%{transform:translate(0,0) rotate(-12deg)}30%{transform:translate(var(--drift-x,25px),-18px) rotate(8deg)}65%{transform:translate(-12px,var(--drift-y,35px)) rotate(-5deg)}100%{transform:translate(18px,-38px) rotate(15deg)}}
@keyframes leaf-fall{0%{transform:translate(0,-25px) rotate(0);opacity:0}10%{opacity:.55}60%{opacity:.5}90%{opacity:.35}100%{transform:translate(var(--leaf-drift,40px),var(--fall-height,600px)) rotate(230deg);opacity:0}}
@keyframes forest-arrival{from{filter:brightness(1.15)}to{filter:brightness(1)}}
@media(min-width:1000px){.hero-content{max-width:850px}.portrait-frame{width:235px}.portrait-window{width:200px;height:270px}.portrait-branch{height:250px;width:95px}.hero{padding-top:75px}.hero .eyebrow{font-size:10px}.gate-door{background:linear-gradient(90deg,#0e291f55,#14372125)}.cover-frame{padding:30px 20px}}
@media(max-width:600px){.hero{padding:70px 24px 35px}.hero h1{font-size:86px}.portrait-frame{width:180px;margin:22px auto 17px}.portrait-window{width:150px;height:205px}.portrait-branch{width:70px;height:200px;top:20px}.branch-left{left:-16px}.branch-right{right:-16px}.portrait-frame figcaption{font-size:11px;margin-top:19px}.portrait-monogram span{font-size:43px}.flower-one{font-size:28px;bottom:48px}.flower-two{font-size:23px;top:38px}.portrait-halo{width:230px;height:240px;left:-25px}.hero .eyebrow{font-size:8px}.hero .hero-quote{font-size:16px}.hero .ornament{font-size:20px;margin:15px 0 8px}.hero .hero-age{font-size:21px}.hero .date-line{font-size:9px;margin-top:18px}.gate-reveal strong{font-size:88px}.gate-reveal span{font-size:9px;letter-spacing:2px}.cover-frame{background:radial-gradient(ellipse,#0d291feb, #163e2eab 45%,transparent 78%)}.motion-toggle{font-size:9px;left:12px;padding:9px 10px}.butterfly-flight{max-width:37px;max-height:37px}}
@media(prefers-reduced-motion:reduce){.gate-door,.cover-frame,.gate-reveal{transition:none}.butterfly-flight,.wing-left,.wing-right,.falling-leaf,.reveal.visible{animation:none}.falling-leaves{display:none}.butterfly-flight{opacity:.7}.motion-toggle{display:none}.cover.open{transition:none}}
.cover{overflow:hidden}
@media(max-width:600px){.butterfly-flight{max-width:26px;max-height:26px;opacity:.75}.butterfly-flight:nth-child(odd){left:0}.butterfly-flight:nth-child(even){left:calc(100% - 26px)}}
/* The itinerary is painted as the reader moves down the page. */
#itinerary .timeline:before,#itinerary .timeline:after{content:'';position:absolute;left:24px;top:var(--track-top,25px);bottom:auto;width:2px;pointer-events:none}
#itinerary .timeline:before{height:var(--track-span,calc(100% - 50px));background:#bbba9e70}
#itinerary .timeline:after{height:var(--track-fill,0px);background:linear-gradient(#547b42,#b89a51);box-shadow:0 0 8px #c5a26466;z-index:0}
#itinerary .timeline li{z-index:1;align-items:center}
#itinerary .timeline-icon{position:relative;background:#f5f5e8;border:1px solid #bdc7aa;color:#98a086;box-shadow:none;transition:background .5s ease,color .5s ease,border-color .5s ease,box-shadow .5s ease}
#itinerary .timeline li>div{position:relative;isolation:isolate;flex:1;padding:11px 13px;border:1px solid transparent;border-radius:4px;transition:border-color .6s ease}
#itinerary .timeline li>div:before{content:'';position:absolute;inset:0;z-index:-1;border-radius:4px;background:linear-gradient(100deg,#dfead1cc,#f0ebd98c);clip-path:inset(0 100% 0 0);transition:clip-path .65s ease}
#itinerary .timeline h3{color:#7e8974;transition:color .5s ease}
#itinerary .timeline li.is-colored .timeline-icon{background:#355c38;border-color:#c5a264;color:#fff0c3;box-shadow:0 0 0 3px #c5a26422}
#itinerary .timeline li.is-colored>div{border-color:#b9bc9655}
#itinerary .timeline li.is-colored>div:before{clip-path:inset(0 0 0 0)}
#itinerary .timeline li.is-colored h3{color:#294a2f}
#itinerary .timeline li.is-current .timeline-icon{box-shadow:0 0 0 4px #c5a26440,0 0 18px #c5a26470}
@media(max-width:600px){#itinerary .timeline li{gap:15px}#itinerary .timeline li>div{padding:11px 10px}#itinerary .timeline h3{font-size:17px}}
@media(prefers-reduced-motion:reduce){#itinerary .timeline-icon,#itinerary .timeline li>div,#itinerary .timeline li>div:before,#itinerary .timeline h3{transition:none}}
.dress-options{align-items:start;gap:70px;margin-top:28px}
.dress-options>div{min-width:125px}
.attire-silhouette{display:block;width:104px;height:155px;margin:0 auto 19px;filter:drop-shadow(0 5px 7px #34563220)}
.attire-body{fill:#35583c;stroke:#b89b60;stroke-width:1.2;stroke-linejoin:round}
.attire-detail{fill:none;stroke:#c9b77f;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.attire-shirt{fill:#f4eedb}.attire-tie{fill:#b99a57}.attire-button{fill:#e5ce95}
@media(max-width:600px){.dress-options{gap:35px}.dress-options>div{min-width:110px}.attire-silhouette{width:88px;height:132px;margin-bottom:16px}}
/* Neutral clothing silhouettes; the theme palette is not a guest dress suggestion. */
.attire-silhouette{filter:drop-shadow(0 4px 5px #00000018)}
.attire-body{fill:#4b4b4b;stroke:none}.attire-detail{stroke:#dedede}.attire-shirt{fill:#efefef}.attire-tie{fill:#656565}.attire-button{fill:#dfdfdf}
.reserved-color{max-width:430px;margin:26px auto 0;font:12px/1.9 Arial,sans-serif;color:#3f4e39}
.reserved-color strong{font-weight:600}

/* Botanical plaques echo the gold gates and the foliage around Kasumi. */
.cover-frame{min-width:0}
.button{position:relative;isolation:isolate;min-height:52px;max-width:100%;gap:14px;padding:16px 29px;border:1px solid #d2b479;border-radius:28px 7px 28px 7px;background:linear-gradient(135deg,#365e3d,#173d2c 65%,#244d34);color:#fff3d5;font:16px/1.25 Georgia,'Times New Roman',serif;letter-spacing:.3px;box-shadow:inset 0 1px 0 #f0d49c29,0 5px 16px #071e1926;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}
.button:before{content:'';position:absolute;inset:4px;border:1px solid #d8b97a69;border-radius:23px 4px 23px 4px;pointer-events:none;z-index:-1}
.button:hover{background:linear-gradient(135deg,#436f48,#234d35 65%,#345e3c);box-shadow:inset 0 1px 0 #f0d49c38,0 6px 22px #bca26a35;transform:translateY(-2px)}
.button:active{transform:translateY(0);box-shadow:inset 0 2px 8px #071e1940}
.button.outline{background:linear-gradient(135deg,#fffcf4,#ecebdc);color:#244a32;border-color:#9f8754;box-shadow:0 3px 12px #244a3210}
.button.outline:before{border-color:#a9915b55}
.button.outline:hover{background:linear-gradient(135deg,#f5f3e7,#e4e7d2);box-shadow:0 5px 18px #244a3220}
.button-botanical{padding-left:38px;padding-right:34px;margin-left:8px;margin-right:8px;max-width:calc(100% - 16px)}
.button-label{position:relative;z-index:1}
.button-arrow{position:relative;flex:none;width:20px;height:20px;color:#e2c184;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s ease}
.button:hover .button-arrow{transform:translateX(3px)}
.button-sprig{position:absolute;width:42px;height:58px;color:#9cad70;filter:drop-shadow(0 1px 2px #0c271b80);pointer-events:none;z-index:2}
.sprig-left{left:-16px;bottom:-9px;transform:rotate(-14deg)}
.sprig-right{right:-15px;top:-10px;transform:rotate(166deg)}
#enter{min-height:68px;width:294px;margin-top:28px;padding:20px 35px 20px 39px;border-color:#e1c78e;border-radius:36px 9px 36px 9px;background:radial-gradient(ellipse at 50% 0,#6c82443d,transparent 75%),linear-gradient(125deg,#365b39,#123726 72%);font-size:19px;font-style:italic;box-shadow:0 0 30px #c5a26429,0 7px 22px #031c17a6,inset 0 1px 0 #f3dfad35}
#enter:before{inset:5px;border-color:#d8bd817d;border-radius:30px 5px 30px 5px}
#enter:hover{background:radial-gradient(ellipse at 50% 0,#91a65750,transparent 75%),linear-gradient(125deg,#456d42,#1b462f 72%);box-shadow:0 0 35px #d6bd7850,0 9px 25px #031c17a6,inset 0 1px 0 #f3dfad45}
#enter .button-sprig{width:48px;height:68px;color:#b2bd7a}
#enter .sprig-left{left:-18px;bottom:-10px}
#enter .sprig-right{right:-18px;top:-12px}
.button-star{position:absolute;left:50%;top:-13px;transform:translateX(-50%);padding:0 7px;background:radial-gradient(ellipse,#22452d 30%,#22452d00 72%);font:20px/1 Georgia,serif;color:#f1d99e;text-shadow:0 0 9px #dec07890;pointer-events:none}
.cover-foot{margin-top:31px}
.rsvp-section .button-botanical{margin-top:10px}
@media(max-width:600px){.button{font-size:16px}.button-botanical{padding-left:32px;padding-right:29px;gap:10px}.button-sprig{width:36px;height:51px}#enter{width:286px;min-height:66px;font-size:18px;letter-spacing:.2px;gap:12px}.button-arrow{width:18px;height:18px}}
@media(prefers-reduced-motion:reduce){.button,.button-arrow{transition:none}.button:hover,.button:active,.button:hover .button-arrow{transform:none}}
/* Memories lead to their own forest welcome. */
.memory-invitation{position:relative;max-width:510px;margin:20px auto 0;padding:34px 22px 25px;border:1px solid #bac6a070;border-radius:90px 90px 6px 6px;background:linear-gradient(#e9efdc88,#fbf8ee)}
.memory-invitation h3{font:normal 34px/1.3 Georgia;margin:18px 0;color:#2d5137;letter-spacing:0}.memory-invitation>p:not(.eyebrow):not(.fineprint){font-size:15px;line-height:1.9;margin-bottom:27px}.memory-invitation .fineprint{font-size:10px;margin-top:25px}
@media(max-width:600px){.memory-invitation h3{font-size:29px}.memory-invitation{padding:30px 16px 20px}.memory-invitation .button{font-size:15px}}

/* Attendance keeps the original form and confirms after the cloud save succeeds. */
.rsvp-section #sendRsvp:disabled{opacity:.65;cursor:wait}.rsvp-section #rsvpStatus:empty{display:none}.rsvp-section #rsvpThanks{color:#f2dfae;font-size:19px}.rsvp-section #rsvpSavedText{overflow-wrap:anywhere}.rsvp-section #result:focus{outline:none}.rsvp-section #result .form-note{font-size:11px}

/* The supplied princess silhouette replaces the XV portrait placeholder. */
.silhouette-portrait .portrait-window{background:linear-gradient(155deg,#153c2bd9,#153c2b70 45%,#0c291dda),url('assets/details.webp') center 42%/cover}
.silhouette-portrait .portrait-window img{object-fit:contain;object-position:center 60%;padding:16px 7px 12px;filter:drop-shadow(0 2px 8px #d9bd7e25)}
@media(max-width:600px){.silhouette-portrait .portrait-window img{padding:13px 6px 10px}}




.music-notice{position:fixed;z-index:31;right:76px;bottom:21px;max-width:min(240px,calc(100vw - 102px));margin:0;padding:9px 13px;border:1px solid #bca16a80;border-radius:18px;background:#163e2ef2;color:#f7edce;font:12px/1.4 Georgia;text-align:left;box-shadow:0 4px 16px #071c1426;pointer-events:none}
