:root{--night:#191812;--night-light:#211f18;--cream:#f3ead9;--warm:#cbbb9f;--vermillion:#c72523;--red:#a62128;--ink:#3d302a;--paper:#f7f1e7;--muted:#7b6a5c;--line:#d8cbb7}
html{background:var(--night)}body{background:var(--paper)}
.site-header{position:absolute;top:0;left:0;right:0;max-width:none;padding:25px 40px;color:var(--cream)}.wordmark{color:var(--cream)}.wordmark .xi{font-size:30px;color:#db3b32}.wordmark .wordmark-note{color:var(--warm)}.music-toggle{color:var(--cream);padding:8px 10px;min-width:105px}.music-label{font-size:12px}
.cinema-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);align-items:center;gap:25px;min-height:100svh;padding:85px 6vw 70px;background:var(--night);color:var(--cream);overflow:hidden;isolation:isolate}.poster-art{position:relative;width:100%;aspect-ratio:1.1;overflow:hidden;margin:auto;align-self:center;mask-image:linear-gradient(to bottom,#000 92%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 92%,transparent 100%)}.poster-image{width:100%;max-width:none;height:auto;display:block;transform-origin:62% 40%;animation:poster-breath 14s ease-out both}.poster-copy{position:relative;z-index:1;text-align:center;padding:25px 0 0}.poster-blessing{font-family:var(--serif);font-size:17px;line-height:2.4;letter-spacing:.21em;color:var(--cream)}.poster-blessing p:first-child span{margin-left:16px}.poster-blessing p+p{margin-top:7px}.poster-names{display:flex;justify-content:center;align-items:flex-start;gap:27px;font-family:var(--serif);font-size:31px;font-weight:400;letter-spacing:.16em;line-height:1.5;margin:58px 0 43px;color:var(--cream)}.poster-names em{font-family:var(--latin);font-size:21px;line-height:2;letter-spacing:0;font-style:normal}.poster-names small{display:block;font-family:var(--latin);font-size:12px;letter-spacing:.17em;line-height:1.5;margin-top:9px;white-space:nowrap;color:var(--warm)}.poster-event{color:var(--cream)}.poster-date{font-family:var(--latin);font-size:19px;letter-spacing:.2em;line-height:1.8}.poster-date span{margin:0 12px;color:var(--warm)}.poster-venue{font-family:var(--serif);font-size:17px;letter-spacing:.14em;line-height:1.9;margin:19px 0 7px}.poster-venue>span{margin-left:7px;white-space:nowrap}.poster-venue-en{font-family:var(--latin);font-size:12px;letter-spacing:.11em;line-height:1.8;color:var(--warm)}.cinema-hero .open-invitation{color:var(--cream);font-family:var(--serif);font-size:13px;margin-top:36px;padding:18px 4px;gap:20px}.cinema-hero .open-invitation i{background:var(--warm);height:27px;color:var(--warm)}
@keyframes poster-breath{from{transform:scale(1.035)}to{transform:scale(1)}}
@media(min-width:1600px){.cinema-hero{padding-left:max(6vw,calc((100vw - 1450px)/2));padding-right:max(6vw,calc((100vw - 1450px)/2))}.poster-art{max-width:850px}}
@media(max-width:1000px){.cinema-hero{gap:5px;padding-left:25px;padding-right:25px;grid-template-columns:minmax(0,1fr) minmax(300px,.85fr)}.poster-names{gap:20px;font-size:27px}.poster-blessing{font-size:16px;letter-spacing:.1em}.poster-date{font-size:18px;letter-spacing:.12em}.poster-venue{font-size:16px;letter-spacing:.07em}.poster-names small{letter-spacing:.05em}}
@media(max-width:700px){.site-header{padding:calc(12px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) 12px max(18px,env(safe-area-inset-left,0px))}.wordmark .xi{font-size:25px}.wordmark .wordmark-note{font-size:12px}.music-toggle{min-width:100px}.cinema-hero{display:flex;flex-direction:column;gap:0;min-height:100svh;padding:0 0 33px}.poster-art{width:100%;max-width:none;margin:0 auto;flex:none;aspect-ratio:1.1}.poster-copy{padding:4px 24px 0;width:100%;max-width:550px}.poster-blessing{font-size:16px;letter-spacing:.17em;line-height:2.1}.poster-blessing p:first-child span{margin-left:13px}.poster-blessing p+p{margin-top:6px}.poster-names{font-size:28px;letter-spacing:.14em;gap:24px;margin:30px 0 26px}.poster-names small{font-size:12px;letter-spacing:.055em;margin-top:7px}.poster-names em{font-size:19px;line-height:2}.poster-date{font-size:17px;letter-spacing:.13em}.poster-date span{margin:0 7px}.poster-venue{font-size:16px;letter-spacing:.07em;margin:15px 0 6px}.poster-venue-en{font-size:12px;letter-spacing:.04em;line-height:1.6;max-width:290px;margin:0 auto}.cinema-hero .open-invitation{margin-top:23px;font-size:13px;padding:15px 0}.cinema-hero .open-invitation i{height:22px}}
@media(max-width:359px){.poster-copy{padding:5px 18px 0}.poster-blessing{font-size:15px;letter-spacing:.09em}.poster-names{font-size:25px;gap:20px;letter-spacing:.11em}.poster-date{font-size:16px;letter-spacing:.06em}.poster-venue{font-size:15px;letter-spacing:0}.poster-venue-en{font-size:12px;letter-spacing:.02em}}
@media(prefers-reduced-motion:reduce){.poster-image{animation:none;transform:none}}
/* Carry the poster's warm light and ink-red accents through the invitation. */
.letter-section{max-width:none;margin:0;padding:95px max(65px,calc((100vw - 1000px)/2)) 115px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:90px;background:var(--night);border:0;color:var(--cream)}.letter-intro h2,.letter-intro .section-kicker,.letter-english,.letter-signature{color:var(--cream)}.letter-intro .tiny-rule{color:#af634c}.letter-intro h2{font-size:40px;letter-spacing:.06em}.letter-body{color:#dfd2bd}.letter-english{font-size:28px;color:var(--warm)}.letter-body>p:first-child{color:var(--warm)}.letter-signature small{color:var(--warm)}

.chapter-white{padding-top:80px;background:var(--paper)}.chapter-white .chapter-copy h2{font-size:40px}.chapter-white .chapter-script{color:#927555}.chapter-white .oversized-ampersand{color:#a87950;opacity:.08}.chapter-white .section-kicker{color:#8b573f}.portrait-white figcaption{color:var(--muted)}
.chapter-red{background:var(--night-light)}.chapter-red .chapter-copy{color:var(--cream)}.chapter-red .section-kicker,.chapter-red .chapter-script,.chapter-red figcaption{color:var(--warm)}.chapter-red .double-happiness{color:#db4237;font-size:57px}.chapter-red .chapter-verse{color:#e6d6bf}.chapter-red .photo-window{background:#3a231e}
.event-section{max-width:none;padding:120px max(65px,calc((100vw - 1000px)/2));background:var(--paper);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px}.event-heading h2{font-size:35px}.event-heading .section-kicker{color:#8b573f}.event-english{color:#927555}.date-year{color:#80664b}.banquet-time{display:block;font-family:var(--latin);font-size:26px;letter-spacing:.06em;line-height:1.6;margin-top:18px}.banquet-time small{font-family:var(--serif);font-size:14px;letter-spacing:.15em;margin-left:12px}.venue h3{font-size:22px;line-height:1.8;letter-spacing:.04em}.venue h3>span{white-space:nowrap;margin-left:8px}.venue .venue-english{font-family:var(--latin);font-size:12px;line-height:1.8;letter-spacing:.06em;max-width:360px;margin:15px auto 0;color:var(--muted)}.venue .tiny-rule{color:#ab8b62}.venue>p:not(.venue-english){color:var(--muted)}
.rsvp-section{margin:0;padding:90px 28px 70px;background:var(--night);color:var(--cream);border:0}.rsvp-script{color:var(--warm)}.rsvp-inner h2{font-size:34px}.rsvp-inner>p:not(.rsvp-script){color:#e6d6bf}.rsvp-button{background:#a92528;border-color:#a92528;color:#fff7e8;width:280px}.rsvp-button:hover{background:#ba302c;border-color:#ba302c}.rsvp-subnote{color:var(--warm)}
footer{background:var(--night);color:var(--cream);padding-bottom:40px}footer>small,.back-to-top{color:var(--warm)}.footer-monogram{color:#d8b998}footer>p{color:var(--cream)}
.floating-rsvp{background:#a92528;border-color:#bd6153;color:#fff7e8;box-shadow:0 4px 24px #0002}.floating-rsvp:hover{background:#bd302c}.cinema-hero a:focus-visible,.site-header a:focus-visible,.site-header button:focus-visible,.rsvp-section button:focus-visible,footer a:focus-visible{outline-color:var(--cream)}
dialog{background:#fbf7f0}dialog::backdrop{background:#100e0a99}.attendance input:checked+span{background:#f4e6df}.field input,.field select,.field textarea{background:#fffdf8}.toast{background:#fbf7f0}.submit-rsvp{background:#a92528;border-color:#a92528;color:#fff7e8}
@media(max-width:1000px){.letter-section{padding:85px 48px 95px;gap:50px}.letter-intro h2{font-size:33px}.chapter-white .chapter-copy h2{font-size:32px}.event-section{padding:95px 48px;gap:35px}.event-heading h2{font-size:31px}.venue h3{font-size:20px}}
@media(max-width:700px){
 .letter-section{display:block;margin:0;padding:48px 30px 75px;text-align:center}.letter-intro .tiny-rule{margin:0 auto 27px}.letter-intro h2{font-size:31px;line-height:1.7;margin:22px 0 15px}.letter-english{font-size:27px}.letter-body{padding-top:32px;font-size:16px;letter-spacing:.015em;line-height:2.2}.letter-signature{font-size:17px}
 
 .chapter-white{padding:44px 28px 73px}.chapter-white .chapter-copy h2{font-size:32px}.chapter-red{padding-top:43px;padding-bottom:65px}.chapter-red .double-happiness{font-size:39px}.chapter-red .chapter-copy h2{font-size:32px}
 .event-section{display:block;padding:75px 26px 76px;text-align:center}.event-heading h2{font-size:29px}.event-details{margin-top:35px}.banquet-time{font-size:27px;margin-top:17px}.banquet-time small{font-size:14px}.venue h3{font-size:22px;letter-spacing:.02em}.venue h3>span{margin-left:7px}.venue .venue-english{font-size:12px;max-width:300px;letter-spacing:.035em;margin-top:14px}.rsvp-section{padding:65px 27px 60px}.rsvp-inner h2{font-size:27px;letter-spacing:0}.rsvp-script{font-size:26px}footer{padding-bottom:25px}
}
@media(max-width:359px){.letter-section{padding-left:23px;padding-right:23px}.letter-body{font-size:16px;letter-spacing:0}.event-section{padding-left:22px;padding-right:22px}.venue h3{font-size:20px}.rsvp-inner h2{font-size:25px}.poster-blessing{font-size:16px;letter-spacing:.06em}.poster-venue{font-size:16px}}

/* The landscape portrait and invitation belong to the same dark section. */
.letter-section{align-items:center}
.letter-story{min-width:0}
.letter-photo{margin:36px 0 0}
.letter-photo .photo-window{background:var(--night)}
.letter-photo img{display:block;width:100%;height:auto;transform:none}
.letter-photo figcaption{color:var(--warm)}
@media(min-width:701px){.letter-section .letter-body{padding-top:0}}
@media(max-width:700px){.letter-photo{margin-top:30px}}
.submit-rsvp:disabled,.receipt-actions button:disabled{opacity:.55;cursor:wait}
.share-invitation{display:block;margin:22px auto 0;padding:12px 20px;border:1px solid #a9896466;background:transparent;color:var(--cream);font:inherit;font-size:14px;letter-spacing:.12em;cursor:pointer}.share-invitation:hover{border-color:var(--cream)}#shareDialog{width:min(440px,calc(100vw - 36px));max-height:90svh;padding:40px 28px;color:#a92528;text-align:left}#shareDialog h2{font-size:30px;line-height:1.65;margin:14px 0 24px}#shareInstructions{font-size:16px;line-height:2;color:#756658;margin-bottom:24px}#shareDialog label{display:block;font-size:14px;margin-bottom:8px;color:#756658}#shareLink{width:100%;padding:12px;border:1px solid #d8caba;background:#fffdf8;font-size:14px;color:#51453b;margin-bottom:18px}#shareCopyStatus{font-size:14px;line-height:1.8;margin-top:14px;color:#756658}
