*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:#e9e4df;color:#a14b47;font-family:'KaiTi','Kaiti SC','STKaiti','楷体',serif;font-size:18px;font-weight:400}main{width:100%;max-width:500px;margin:auto;overflow:hidden;background-color:#fbf7f3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.055' filter='url(%23n)'/%3E%3C/svg%3E")}p{margin:0}button,input{font:inherit}button{cursor:pointer}button:after{border:0}.hand{font-family:'Segoe Print','Ink Free','Bradley Hand',cursive;font-style:italic;font-weight:400;line-height:1.1}.art{background-position:center;background-repeat:no-repeat;background-size:contain;pointer-events:none}.cover-writing{position:relative;height:340px;margin:0 32px}.art-heart{position:absolute;width:290px;height:340px;left:0;top:-12px}.cover-date{position:absolute;top:18px;right:58px;font-size:17px;letter-spacing:2px}.cover-script{position:absolute;font-size:62px;top:40px;left:14px;transform:rotate(-7deg);line-height:1.04;letter-spacing:1px}.cover-call{position:absolute;bottom:0;right:0;font-size:29px;transform:rotate(-6deg)}.cover-writing .art-glass{position:absolute;right:-12px;bottom:38px;width:72px;height:110px}.cover-names{margin:30px 24px 42px;font-size:21px;letter-spacing:2px}.photo{position:relative;overflow:hidden;width:100%;height:460px}.slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease-in-out;touch-action:pan-y}.slide.active{opacity:1}.fade:before,.fade:after{content:'';position:absolute;left:0;right:0;height:55px;z-index:2;pointer-events:none}.fade:before{top:-1px;background:linear-gradient(#fbf7f3,transparent)}.fade:after{bottom:-1px;background:linear-gradient(transparent,#fbf7f3)}.cover-photo{height:460px}.ref-welcome{text-align:center;margin:36px 20px 44px}.ref-welcome p{color:#438fa3;font-size:25px;margin-bottom:16px}.ref-welcome .hand{font-size:37px;transform:rotate(-7deg)}.record-section{height:220px;position:relative;margin:0 30px}.record-section .art-camera{width:115px;height:110px;margin:auto}.record-caption{display:flex;align-items:center;justify-content:center;margin-top:16px;gap:8px}.record-caption .hand{font-size:23px;color:#438fa3}.record-caption span:last-child{font-size:20px;transform:rotate(-6deg)}.couple-photo{height:400px}.people-labels{height:220px;position:relative;margin:-35px 35px 20px;z-index:3}.people-labels .hand{font-size:39px}.people-labels p{font-size:26px;margin:10px 0 15px 25px}.people-labels .art{height:72px;width:75px;margin-left:20px}.bride-label{position:absolute;left:0;top:0}.groom-label{position:absolute;right:0;top:80px;color:#438fa3}.about-title{display:flex;align-items:center;justify-content:space-between;margin:80px 20px 25px;font-size:22px;color:#438fa3}.about-title .art-book{width:105px;height:108px}.about-title .hand{color:#a14b47;font-size:25px}.poem{font-size:19px;line-height:1.9}.intro-poem{text-align:left;margin:20px 15px 0 42%;font-size:17px;white-space:nowrap}.oval-section{position:relative;margin:0 20px 50px}.oval-photo{height:510px;border:3px double #a94b47;border-radius:50%;padding:5px;transform:rotate(-5deg)}.oval-photo .slide{border-radius:50%;padding:5px}.little-hearts{position:absolute;right:-7px;top:20px;font-size:33px;transform:rotate(12deg);line-height:1}.oval-caption{position:absolute;left:-10px;bottom:-30px;font-size:15px;color:#438fa3}.letter-poem{margin:75px 20px 48px;text-align:center;font-size:18px}.ribbon-section{position:relative;margin:0 38px 62px;padding-top:40px}.ribbon-section .art-bow{position:absolute;top:-12px;left:-25px;right:-20px;height:92px;z-index:3}.ribbon-photo{height:450px}.ribbon-section .art-cake{position:absolute;width:105px;height:110px;bottom:-42px;right:-35px;z-index:3}.blue-poem{color:#438fa3;font-size:18px;margin:45px 28px 80px;line-height:1.9}.landscape-section{position:relative;margin:0 20px 90px;padding:20px 0 0 55px}.landscape-section .art-bouquet{position:absolute;right:0;top:-145px;width:82px;height:110px}.landscape-caption{position:absolute;left:0;top:-40px;font-size:17px;z-index:3;color:#438fa3;line-height:1.2}.landscape-photo{height:245px;border:3px solid #ac4a46;box-shadow:7px -3px 0 #e6ded6}.landscape-photo .slide{padding:6px}.blue-tape{position:absolute;right:-12px;bottom:10px;width:70px;height:9px;background:#438fa3;transform:rotate(-3deg)}.last-photo-section{margin:0 35px 70px}.last-photo-section>p{font-size:14px;white-space:nowrap;transform:rotate(4deg);margin:0 0 25px}.last-photo{height:435px;border:3px double #438fa3;transform:rotate(3deg)}.last-photo .slide{padding:5px}.last-photo-section .poem{text-align:center;font-size:16px;margin:30px -15px 0}.script-title{position:relative;width:200px;margin:75px auto 60px;text-align:center}.script-title .hand{display:block;font-size:38px;transform:rotate(-7deg);line-height:1.1;border:1px solid #ad4d49;border-radius:50%;padding:8px 0}.title-zh{display:block;color:#438fa3;text-align:right;padding-right:15px;font-size:21px;margin-bottom:4px}.calendar-frame{position:relative;border:3px double #a94b47;padding:32px 22px 24px;margin:0 28px;transform:rotate(-1deg)}.calendar-frame .art-bow{position:absolute;top:-35px;right:-20px;width:170px;height:90px;transform:rotate(180deg)}.month-title{font-size:29px;margin:0 0 18px}.week,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}.week{font-size:11px;margin:12px 0}.calendar-grid{font-family:Arial,sans-serif;font-size:12px;color:#655952;line-height:2.2}.calendar-grid span{width:25px;height:25px;display:block;margin:auto}.wedding-day{background:#ae4946;border-radius:50%;color:white}.date-copy{text-align:center;font-size:17px;line-height:1.8;margin:35px 0}.calendar-save{display:block;background:none;border:0;color:#a14b47;font-size:13px;margin:0 auto}.date-section #calendar-status{font-size:12px;text-align:center}.venue-section>p{text-align:center;font-size:19px;margin:30px 25px}.venue-section .address{font-size:14px;line-height:1.6}.venue-map{display:block;margin:45px 55px 10px;border:9px solid #438fa3;outline:2px solid #438fa3;box-shadow:inset 0 0 0 3px #a94b47;background:#a94b47;padding:4px;color:#fff;text-decoration:none}.map-preview{position:relative;overflow:hidden;aspect-ratio:235/125;background:#e4e4e4}.map-preview img{position:absolute;width:112.766%;max-width:none;left:-1.702%;top:-58.5%}.venue-map>span{display:block;font-size:12px;background:#438fa3;padding-top:5px}.process-title .hand{border-color:#438fa3}.timeline{display:flex;position:relative;margin:0 40px 70px;justify-content:space-between;gap:12px;text-align:center;font-size:18px}.timeline:after{content:'';position:absolute;top:91px;left:8%;right:8%;border-top:1px solid #ad4d49}.timeline>div{width:30%}.timeline .art{height:80px;width:65px;margin:auto}.timeline p{margin:12px 0}.timeline>div:nth-child(2){padding-top:4px}.timeline>div:nth-child(2) .art{margin-top:27px}.rsvp{margin:50px 60px 90px}.rsvp h2{color:#438fa3;text-align:center;font-size:27px;font-weight:400;margin:0 0 38px}.rsvp input{display:block;width:100%;height:43px;border:1px solid #a94b47;border-radius:25px;background:transparent;padding:0 15px;margin:10px 0;color:#a14b47;outline:none;font-size:17px}.rsvp input::placeholder{color:#a14b47}.rsvp button{width:100%;height:43px;border:0;border-radius:25px;background:#3994ba;color:#a14b47;font-size:18px}.rsvp-status,#rsvp-status{font-size:14px;line-height:1.7;margin-top:15px}.tips{margin:0 35px;padding-bottom:90px}.tips-title{display:flex;justify-content:space-between;align-items:center;color:#438fa3;font-size:25px;margin-bottom:45px}.tips-title .art{width:100px;height:90px}.tip{position:relative;font-size:18px;line-height:1.9;padding-left:30px;margin-bottom:34px}.tip:before{content:'';position:absolute;left:0;top:15px;width:10px;height:10px;border:3px double #faf6f2;background:#a94b47;border-radius:50%;box-shadow:0 0 0 1px #a94b47}.tip:nth-child(odd):before{background:#438fa3;box-shadow:0 0 0 1px #438fa3}.music-toggle{position:fixed;right:12px;top:12px;border:1px solid #fcfaf4;border-radius:50%;width:34px;height:34px;background:#438fa3;color:white;padding:0;z-index:10}.music-toggle>span{display:none}.record{display:block;font-style:normal;line-height:31px;font-size:24px;animation:spin 9s linear infinite;animation-play-state:paused}.record.is-playing{animation-play-state:running}@keyframes spin{to{transform:rotate(360deg)}}.auto-scroll{position:fixed;bottom:12px;left:12px;border:1px solid #ae494650;border-radius:20px;background:#fbf7f3dc;color:#a14b47;padding:7px 12px;font-size:11px;z-index:10}.music-status{position:fixed;bottom:12px;right:12px;max-width:230px;background:#fbf7f3ee;padding:8px;color:#a14b47;font-size:12px;z-index:11}[hidden]{display:none!important}

/* Preserve faces when portrait photos fill the landscape frame. */
.landscape-photo .slide{object-position:center top}

.landscape-photo .slide{object-position:center 25%}

.music-toggle{width:auto;height:36px;padding:0 10px;display:flex;align-items:center;gap:6px;border-radius:22px}.music-toggle .record{width:24px;flex-shrink:0}.music-toggle>span,.music-toggle .music-label{display:block;font-size:12px;line-height:1;white-space:nowrap}

/* Compact music control; playback remains available by tapping the icon. */
.music-toggle{width:34px;height:34px;padding:0;display:flex;align-items:center;justify-content:center;gap:0;border-radius:50%}
.music-toggle .record{width:30px;line-height:30px;font-size:23px}
.music-toggle>span,.music-toggle .music-label{display:none}

/* Keep the complete map inside its decorative frame. */
.venue-map{overflow:hidden;min-width:0;box-sizing:border-box}
.venue-map .map-preview{display:block;position:relative;width:100%;height:auto;min-width:0;overflow:hidden;aspect-ratio:auto}
.venue-map .venue-map-image{display:block;position:static;width:100%;max-width:100%;height:auto;margin:0;padding:0;transform:none}