@font-face{font-family:"WeddingKai";src:url('./assets/wedding-kai.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{--deep:#760018;--paper:#90051b;--gold:#efc698;--gold-soft:#e8bc8f;--gold-muted:#dfae8c;--rich:#fff3d9;--hairline:rgba(244,187,126,.5)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--deep);color:var(--gold);font-family:"WeddingKai","STKaiti","KaiTi","Kaiti SC",serif;font-weight:400;font-synthesis:none;-webkit-font-smoothing:antialiased}
button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}
[hidden]{display:none!important}
.offline-banner{position:relative;z-index:10;background:#fff5d9;color:#773f24;font:13px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;padding:10px 16px;text-align:center}
.screen{min-height:100svh;position:relative;padding:26px max(17px,env(safe-area-inset-right)) 30px max(17px,env(safe-area-inset-left));overflow:hidden;background:linear-gradient(165deg,#790018 0%,#7f001a 48%,#730018 100%)}
.back-pattern{position:absolute;inset:0;background:url('./assets/background-clouds.png') center top/auto 950px repeat-y;opacity:.5;pointer-events:none}
.paper{position:relative;z-index:1;width:min(100%,540px);margin:0 auto;padding:22px clamp(16px,4.5vw,32px) 38px;border:1px solid rgba(242,180,108,.15);background:#910518;box-shadow:0 22px 46px rgba(39,0,8,.30);text-align:center}
.xi-container{margin:0 auto;height:175px;display:flex;align-items:center;justify-content:center}
.xi-image{width:min(220px,70vw);height:175px;object-fit:contain;display:block}
.inviter{font-size:clamp(18px,5vw,24px);font-weight:400;line-height:1.8;letter-spacing:.035em;color:var(--gold);margin:24px 0 0}
.names{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:clamp(6px,1.8vw,12px);font-size:clamp(17px,4.8vw,25px);font-weight:400;letter-spacing:0;line-height:1.8;margin:29px -8px 0;color:var(--gold)}
.family-member{display:inline-flex;align-items:baseline;white-space:nowrap}.family-role{font:inherit;color:inherit}
.union-mark{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:30px;height:30px;border:3px double currentColor;border-radius:50%;font-size:17px;line-height:1;color:#dfb17d}
.banquet-title{font-size:clamp(19px,5.25vw,25px);line-height:1.8;letter-spacing:.12em;margin:25px auto 0;color:var(--gold)}
.date-main{font-size:clamp(18px,4.9vw,24px);line-height:1.8;margin:42px 0 0;color:var(--gold);white-space:nowrap}
.date-main span{font:inherit;margin-left:8px}
.date-sub{font-size:clamp(17px,4.7vw,22px);line-height:1.8;color:var(--gold);margin:12px 0 0}.dot{padding:0 4px}
.venue{font-size:clamp(17px,4.6vw,23px);color:var(--gold);font-weight:400;line-height:1.8;letter-spacing:0;white-space:nowrap;margin:36px -8px 0}
.poem{font-size:clamp(18px,4.9vw,24px);line-height:1.9;letter-spacing:.08em;margin:34px auto 0;color:var(--gold)}
.poem p{margin:0}
.rsvp{margin-top:48px;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
.form-division{display:flex;align-items:center;justify-content:center;font-family:"WeddingKai","STKaiti","KaiTi",serif;font-size:20px;line-height:1.6;letter-spacing:.2em;color:#f3d1aa;margin:0;font-weight:400;white-space:nowrap}
.form-division:before,.form-division:after{content:"";height:1px;background:var(--hairline);flex:1}
.form-division span{padding:0 12px}
.form-desc{font-size:13px;color:#efba92;line-height:1.7;margin:15px 0 26px}
.form-field{display:block;text-align:left;margin:0 0 23px;padding:0;border:0;min-width:0}
.field-label{display:block;color:#ffdfb4;font-size:15px;margin:0 0 10px;letter-spacing:.02em}
.required{color:#ffe8c4}.text-input{width:100%;min-width:0;height:50px;line-height:1.2;border:1px solid #e3a46f;border-radius:5px;background:rgba(107,0,15,.30);color:#fff2d7;padding:0 14px;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;outline:none;box-shadow:none}
.text-input::placeholder{color:rgba(252,201,157,.65)}.text-input:focus-visible{outline:2px solid #ffd9a7;outline-offset:2px}
.person-control{position:relative}.person-control .text-input{padding-right:44px}.person-unit{position:absolute;right:17px;top:50%;transform:translateY(-50%);font-size:16px;color:#ffe0b3}
.field-help{font-size:12px;color:#e2b18e;margin:7px 0 0;line-height:1.7}
.arrival-fieldset legend{padding:0;float:none;width:auto}.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.small-field{display:block;min-width:0}.small-field>span{display:block;font-size:12px;color:#ebbc9c;margin-bottom:9px}.small-field .text-input{padding:0 7px;font-size:13px;color-scheme:dark}
input[type=date]::-webkit-calendar-picker-indicator,input[type=time]::-webkit-calendar-picker-indicator{opacity:.85;cursor:pointer}
.submit-btn{width:100%;min-height:53px;display:flex;align-items:center;justify-content:center;margin:33px auto 0;padding:10px 12px;border:0;border-radius:5px;color:#7a0921;background:linear-gradient(110deg,#ffd0a1,#e9aa7d);box-shadow:0 4px 14px rgba(62,0,0,.14);font-size:17px;font-weight:700;letter-spacing:.04em}
.submit-btn:focus-visible{outline:2px solid #ffdfc1;outline-offset:4px}.submit-btn:disabled{opacity:.67}
.form-feedback{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;font-size:13px;line-height:1.7;margin:12px 0 0;min-height:0;color:#ffe3b3;white-space:pre-wrap}.form-feedback:empty{display:none}.form-feedback.error{color:#ffcfce}
.privacy-note,.browser-note{font-size:11px;line-height:1.75;color:#e6ae89;margin:15px 0 0}.browser-note{color:#d59e7b;margin-top:7px}
.closing-block{margin-top:46px}.closing{font-size:18px;font-weight:400;letter-spacing:.12em;color:#edbd96;margin:0}
.bottom-note{position:relative;text-align:center;font-size:12px;color:#daa885;margin:19px auto 0}
.anti-spam{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media (max-width:359px){.screen{padding-left:11px;padding-right:11px}.paper{padding-left:16px;padding-right:16px}.union-mark{width:26px;height:26px;font-size:15px}.time-grid{gap:8px}.small-field .text-input{font-size:12px}}
@media (min-width:650px){.screen{padding-top:45px}.paper{padding-top:30px;padding-bottom:48px}.xi-container{height:195px}.xi-image{width:245px;height:195px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}