[hidden]{display:none!important}html,body{height:100%;overflow:hidden;scroll-behavior:auto}body{padding:0;background:#e6d5c1}.shell{width:min(100%,430px);height:100svh;border-radius:0;box-shadow:none;overflow:hidden}.section{height:100svh;min-height:0;padding:0;display:block;overflow-y:auto;scrollbar-width:none;background-size:100% 100%;border-radius:0!important}.section::-webkit-scrollbar{display:none}.content{position:relative;width:100%;max-width:none;height:100%;margin:0}.section::before{display:none}.section-head{position:absolute;top:18%;left:15%;right:15%;text-align:center;margin:0!important}.section-head h2{font-size:32px;line-height:1.08;margin:8px 0}.eyebrow{font-size:9px;letter-spacing:.25em}.cover .content{height:100%;padding:24% 15% 22%;background:none;border:0;border-radius:0;backdrop-filter:none;display:flex;flex-direction:column;justify-content:center;align-items:center}.cover h1{font-size:49px;line-height:1.04;margin:16px 0}.cover h1 span,.cover h1 i{display:block}.cover h1 i{font-size:30px;color:#a55334}.cover p{font-size:12px;margin:10px 0}.cover .date{font-size:14px;margin:12px 0}.guest{width:100%;margin:18px 0;padding:10px}.guest strong{font-size:17px}.cover .btn{font-size:12px;min-height:43px}.couple .section-head{top:21%}.couple .section-head h2{font-size:31px}.couple-grid{position:absolute;top:29.6%;left:14.5%;right:14.5%;height:44%;gap:15.5%;grid-template-columns:1fr 1fr}.person{height:100%;min-width:0;padding:0;border:0;background:none;border-radius:0;box-shadow:none;text-align:center}.portrait{height:60.5%;aspect-ratio:auto;margin:0 0 16px;border:0;background:none;border-radius:50% 50% 0 0/27% 27% 0 0;overflow:hidden}.portrait img{object-fit:cover;object-position:50% 24%;border-radius:inherit}.person h3{font-size:21px;margin:0 0 8px;line-height:1.05;overflow-wrap:anywhere;max-height:64px;overflow-y:auto}.person p{font-size:10px;line-height:1.5;max-height:70px;overflow-y:auto}.story .section-head{top:17%}.story .content{max-width:none}.timeline{position:absolute;top:29%;bottom:19%;left:17%;right:17%;padding:0;gap:12px;grid-template-rows:repeat(4,1fr)}.milestone{width:100%;padding:8px 0;background:none;border:0;border-radius:0;box-shadow:none;overflow:auto;scrollbar-width:none;min-height:0}.milestone:nth-child(odd){padding-right:18%;text-align:left}.milestone:nth-child(even){padding-left:18%;text-align:right}.milestone small{font-size:9px;letter-spacing:.16em}.milestone h3{font-size:21px;margin-bottom:6px}.milestone p{font-size:10px;line-height:1.5}.events .section-head{top:16%;left:15%;right:15%}.event-stack{position:absolute;top:26%;bottom:22%;left:17%;right:18%;grid-template-rows:1fr 1fr;gap:5%}.event-card{padding:9px 10px;background:none;border:0;border-radius:0;box-shadow:none;overflow:auto;scrollbar-width:none;min-height:0;display:flex;flex-direction:column;justify-content:safe center}.event-card h3{font-size:26px;margin:0 0 8px}.event-card .meta{margin:5px 0;gap:6px}.event-card .meta span{font-size:10px;padding:4px;background:none}.event-card .address{font-size:10px;line-height:1.5;min-height:0;margin:6px 0}.event-card .btn,.wk-map{font-size:10px;padding:8px;min-height:31px}.wk-event p,.wk-event strong{font-size:11px;line-height:1.5;margin:5px 0}.gallery .section-head{top:8%;left:20%;right:12%}.gallery .section-head h2{font-size:28px}.gallery-grid{position:absolute;inset:0;display:block;pointer-events:none}.photo{position:absolute;grid-column:auto!important;grid-row:auto!important;border:0;background:none;outline:none;box-shadow:none;border-radius:0;pointer-events:auto}.photo img{object-fit:contain;background:#f0d4b1;cursor:zoom-in}.photo:hover img{transform:none}.photo:nth-child(1){left:21.5%;top:15.3%;width:26%;height:21.5%;border-radius:50% 50% 0 0/30% 30% 0 0}.photo:nth-child(2){left:57%;top:21%;width:19.8%;height:15.7%;border-radius:0}.photo:nth-child(3){left:21.5%;top:41.5%;width:31%;height:10.4%;border-radius:0}.photo:nth-child(4){left:59.6%;top:41.1%;width:23.5%;height:18.4%;border-radius:50% 50% 0 0/31% 31% 0 0}.photo:nth-child(5){left:25.5%;top:56%;width:19.8%;height:16.1%;border-radius:0}.photo:nth-child(6){left:53.5%;top:63.5%;width:28.7%;height:9.9%;border-radius:0}.rsvp .section-head{top:18%;left:15%;right:15%}.rsvp .section-head h2{font-size:29px}.gift-tabs{position:absolute;top:29%;left:16%;right:16%;display:flex;gap:8px}.gift-tabs button{flex:1;padding:10px;border:1px solid #ae7153;border-radius:22px;background:#fff3df;color:#763b28;font-size:11px}.gift-tabs button[aria-pressed=true]{background:#a55334;color:#fff}.form-card,.gift-card{position:absolute;top:36%;bottom:16%;left:16%;right:16%;margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;overflow-y:auto;scrollbar-width:none}.form-card label{margin:7px 0 4px;font-size:10px}.form-card input,.form-card select,.form-card textarea{padding:9px 10px;font-size:11px;border-radius:11px}.form-card textarea{min-height:56px;resize:vertical}.form-card .btn{margin-top:10px;min-height:36px;padding:9px;font-size:11px}.form-status{font-size:10px;margin:8px 0;line-height:1.5}.gift-card .demo-gift{font-size:10px;line-height:1.6;margin:0 0 12px}.qr-slot{width:150px;height:150px;margin:10px auto;border:0;border-radius:12px;padding:8px;background:#fff;box-shadow:none}.qr-slot img{width:100%;height:100%;object-fit:contain;cursor:zoom-in}.bank-row{display:block}.bank-card{padding:12px 14px;text-align:left;font-size:11px;display:flex;align-items:center;justify-content:space-between;gap:10px}.bank-card small{font-size:10px}.bank-card strong{font-size:20px;margin:5px 0}.bank-card span{font-size:10px}.copy-btn{width:35px;height:35px;border:1px solid #b88668;border-radius:50%;background:#fff5e7;display:grid;place-items:center;color:#763b28}.copy-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}.closing .content{padding:35% 17% 20%;border:0;background:none;border-radius:0;backdrop-filter:none;height:100%;display:flex;flex-direction:column;justify-content:center}.closing h2{font-size:37px}.closing p{font-size:12px}.closing .names{font-size:32px;margin:18px 0}.closing .date{font-size:12px}.music-toggle{top:18px;bottom:auto;right:max(16px,calc((100vw - 430px)/2 + 16px));width:36px;height:36px}.music-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}.page-navigation{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:25;width:min(calc(100% - 40px),390px);height:48px;padding:6px;border:1px solid #ac7657;border-radius:26px;background:#fff4e4ed;display:flex;align-items:center;gap:10px}.page-navigation button{width:34px;height:34px;border:1px solid #ac7657;border-radius:50%;background:none;color:#763b28;display:grid;place-items:center}.page-navigation button:disabled{opacity:.3}.page-navigation svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}.page-navigation span{flex:1;font-size:11px}.page-navigation small{font-size:10px}.locked .page-navigation{display:none}.toast{bottom:80px;max-width:85vw;white-space:normal;text-align:center}.photo-dialog{width:min(92vw,650px);max-height:92svh;border:0;border-radius:12px;padding:40px 10px 10px;background:#fff4e4}.photo-dialog::backdrop{background:#30221ce6}.photo-dialog img{width:100%;max-height:80svh;object-fit:contain}.photo-dialog button{position:absolute;right:10px;top:5px;background:none;border:0;font-size:28px;color:#763b28}a,button{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #763b28;outline-offset:3px}
@media(max-width:355px){.cover h1{font-size:41px}.couple .section-head h2{font-size:25px}.person h3{font-size:18px}.person p{font-size:9px}.milestone h3{font-size:18px}.gallery .section-head h2{font-size:24px}.rsvp .section-head h2{font-size:25px}.qr-slot{width:120px;height:120px}.event-card h3{font-size:22px}.closing h2{font-size:30px}}

.portrait{margin-bottom:30px}.person h3{font-size:20px}.timeline{left:23%;right:21%}.milestone:nth-child(odd){padding-right:12%}.milestone:nth-child(even){padding-left:12%}.milestone p{font-size:11px}.section-head h2{text-shadow:0 1px 8px #f6dfbf}.cover h1{max-width:100%;max-height:none;overflow:visible;overflow-wrap:anywhere;flex-shrink:0;font-size:clamp(34px,11vw,47px);line-height:1.12}.person h3,.person p{scrollbar-width:none}@media(max-width:355px){.portrait{margin-bottom:23px}.person h3{font-size:17px}.milestone p{font-size:10px}}

.cover h1>span,.cover h1>i{display:block}.cover h1>i{font-size:.6em;line-height:1.15;margin:6px 0}.cover .content{overflow-y:auto;scrollbar-width:none;justify-content:safe center}.cover .content::-webkit-scrollbar{display:none}

/* Keep artwork proportions and place content in the same coordinate space. */
.shell{container-type:size}.section{background-size:cover;background-position:center center}
.section>.content{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100cqw,56.2799043cqh);height:max(100cqh,177.6833156cqw);max-width:none;margin:0}
.gallery .photo img{object-fit:cover;background:none}
.gallery .photo:nth-child(1){left:21.1%;top:15.1%;width:26.6%;height:22.1%}
.gallery .photo:nth-child(2){left:56.8%;top:21%;width:20.2%;height:16%}
.gallery .photo:nth-child(3){left:21.3%;top:41.6%;width:31.2%;height:10.5%}
.gallery .photo:nth-child(4){left:59.2%;top:41.2%;width:24%;height:18.5%}
.gallery .photo:nth-child(5){left:25.3%;top:56%;width:20.3%;height:16.3%}
.gallery .photo:nth-child(6){left:53.5%;top:63.5%;width:29%;height:10.2%}

.gallery .photo:nth-child(3) img,.gallery .photo:nth-child(6) img{object-position:50% 20%}

/* Story follows the alternating sides of the center line. */
.story .section-head{top:16%;left:16%;right:16%}
.story .section-head .wk-story{font:10px/1.5 Arial,sans-serif;margin:12px 0 0;max-height:58px;overflow:auto;scrollbar-width:none}
.story .timeline{top:34%;bottom:21%;left:18%;right:18%;gap:9px;grid-template-rows:repeat(4,minmax(0,1fr))}
.story .milestone{width:43%;margin:0;padding:0;min-height:0}
.story .milestone:nth-child(odd){justify-self:end;text-align:left;padding:0}
.story .milestone:nth-child(even){justify-self:start;text-align:right;padding:0}
.story .milestone h3{font-size:17px;line-height:1.15;margin:5px 0}
.story .milestone p{font-size:9px;line-height:1.5}
.story .milestone small{font-size:8px}
/* Keep maps and event text inside the painted panels. */
.events .event-stack{top:26.5%;bottom:23.5%;left:18%;right:18%;gap:8%}
.events .event-card{padding:3px 4px;justify-content:safe center}
.events .event-card>*{flex-shrink:0}
.events .wk-event{font:9px/1.4 Arial,sans-serif;padding:0;text-align:center}
.events .wk-event h3,.events .event-card>h3{font:21px/1.15 Georgia,serif;margin:0 0 6px!important}
.events .wk-event p{font:9px/1.4 Arial,sans-serif;margin:3px 0}
.events .wk-event strong{display:block;font:600 9px/1.4 Arial,sans-serif;margin:3px 0}
.events .wk-map,.events .event-card .btn{display:inline-block;min-height:25px;font:600 9px/1.3 Arial,sans-serif;padding:6px 10px;margin-top:5px}
/* Five openings in the new gallery artwork. */
.gallery .section-head{top:12%;left:20%;right:15%}
.gallery .section-head h2{font-size:25px}
.gallery .photo:nth-child(1){left:22.85%;top:19.32%;width:24.34%;height:20.45%;border-radius:50% 50% 0 0/33.5% 33.5% 0 0}
.gallery .photo:nth-child(2){left:53.9%;top:19.32%;width:24.1%;height:20.45%;border-radius:50% 50% 0 0/33.5% 33.5% 0 0}
.gallery .photo:nth-child(3){left:23.05%;top:43.72%;width:23.91%;height:17%;border-radius:0}
.gallery .photo:nth-child(4){left:54%;top:43.72%;width:24%;height:17%;border-radius:0}
.gallery .photo:nth-child(5){left:22%;top:64.05%;width:57.6%;height:11.12%;border-radius:0}
.gallery .photo img{object-fit:cover;object-position:50% 23%}
.gallery .photo:nth-child(5) img{object-position:50% 40%}
@media(max-width:355px){.story .milestone h3{font-size:15px}.story .milestone p{font-size:8px}.events .wk-event h3{font-size:19px}.events .wk-event p{font-size:8px}}

.story .milestone small{display:block;line-height:1.2}.story .milestone h3{font-size:16px;line-height:1.1;margin:3px 0}.story .milestone p{font-size:9px;line-height:1.4;margin:0}@media(max-width:355px){.story .milestone h3{font-size:14px}.story .milestone p{font-size:8px}}
