/* A couple's wedding website. Six themes, each only a set of colors; the layout and type are shared. Built for a phone first. */
.th-ivory{--bg:#F7F6F3;--card:#FFFFFF;--text:#111111;--body:#2F3437;--mute:#6B6A66;--line:#EAEAEA;--line-strong:#D9D8D4;--accent:#C8791A;--accent-ink:#6B6A66;--btn:#111111;--btn-ink:#FFFFFF;--field:#FFFFFF;--field-ink:#111111;--warn:#9F2F2D;--soft:#EFEDE7}
.th-marigold{--bg:#FBF1DE;--card:#FFFBF2;--text:#5B1A1A;--body:#4A2A20;--mute:#7A5644;--line:#F0DDBB;--line-strong:#E2C796;--accent:#E08A1E;--accent-ink:#A9520F;--btn:#5B1A1A;--btn-ink:#FFF6E5;--field:#FFFDF8;--field-ink:#2A1410;--warn:#A12C22;--soft:#F6E4C2}
.th-mehndi{--bg:#1D3327;--card:#24402F;--text:#F5EDD6;--body:#E4DBC3;--mute:#BDB391;--line:#33513F;--line-strong:#46664F;--accent:#CFA64B;--accent-ink:#DDB75E;--btn:#CFA64B;--btn-ink:#1D3327;--field:#FBF6E8;--field-ink:#1A1A1A;--warn:#F2A08F;--soft:#2B4A38}
.th-royal{--bg:#4B1521;--card:#581C2A;--text:#F7EBD5;--body:#EEDFC5;--mute:#CDB591;--line:#6D2B39;--line-strong:#84404D;--accent:#D8B25E;--accent-ink:#E3C077;--btn:#D8B25E;--btn-ink:#3E0F19;--field:#FBF5E9;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#622435}
.th-blush{--bg:#F8ECEA;--card:#FFF9F7;--text:#4A1D38;--body:#5A3B4A;--mute:#7E5C69;--line:#EDD5D1;--line-strong:#DFBDB8;--accent:#C0587A;--accent-ink:#A3405F;--btn:#4A1D38;--btn-ink:#FFF5F3;--field:#FFFFFF;--field-ink:#2A1420;--warn:#9F2F2D;--soft:#F2DCD8}
.th-lotus{--bg:#F6F1F8;--card:#FFFFFF;--text:#3B2147;--body:#4E3A57;--mute:#76637E;--line:#E7DCEC;--line-strong:#D6C5DE;--accent:#B5649B;--accent-ink:#8E3F78;--btn:#3B2147;--btn-ink:#FBF6FD;--field:#FFFFFF;--field-ink:#24142B;--warn:#9F2F2D;--soft:#EDE3F2}
.th-monsoon{--bg:#EEF2F3;--card:#FFFFFF;--text:#1F3440;--body:#33474F;--mute:#5E7078;--line:#DCE4E7;--line-strong:#C6D2D6;--accent:#4F8A8B;--accent-ink:#2F6A6B;--btn:#1F3440;--btn-ink:#F2F7F8;--field:#FFFFFF;--field-ink:#152229;--warn:#9F2F2D;--soft:#E1E9EB}
.th-saffron{--bg:#FFF7EC;--card:#FFFFFF;--text:#3A1C0C;--body:#4A3020;--mute:#7A5A44;--line:#F3E1C8;--line-strong:#E8CBA4;--accent:#E8740C;--accent-ink:#A9520F;--btn:#C85A06;--btn-ink:#FFFFFF;--field:#FFFFFF;--field-ink:#2A140A;--warn:#A12C22;--soft:#FBE9D2}
.th-midnight{--bg:#141B33;--card:#1B2442;--text:#F3ECD9;--body:#DCD6C6;--mute:#ABA693;--line:#2A3558;--line-strong:#3A4770;--accent:#D6B160;--accent-ink:#E2C27A;--btn:#D6B160;--btn-ink:#141B33;--field:#FBF6E8;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#222D52}
.th-jasmine{--bg:#F4F7F1;--card:#FFFFFF;--text:#1E3A2C;--body:#2F4A3C;--mute:#5B6F63;--line:#DCE6DA;--line-strong:#C3D3C0;--accent:#2E7D4F;--accent-ink:#22603C;--btn:#1E3A2C;--btn-ink:#F7FBF5;--field:#FFFFFF;--field-ink:#14271D;--warn:#9F2F2D;--soft:#E6EFE3}
.th-sandstone{--bg:#F6EEE4;--card:#FFFBF6;--text:#4A2A1B;--body:#55392A;--mute:#7A5F4D;--line:#EBDCCB;--line-strong:#DCC6AE;--accent:#B5552B;--accent-ink:#8E3F1D;--btn:#4A2A1B;--btn-ink:#FFF8F0;--field:#FFFDF9;--field-ink:#2A170E;--warn:#A12C22;--soft:#EFE2D2}
.th-rani{--bg:#FDF1F5;--card:#FFFFFF;--text:#4B1031;--body:#5A2942;--mute:#7F5369;--line:#F3D9E4;--line-strong:#E6BDD0;--accent:#C2185B;--accent-ink:#9C1149;--btn:#4B1031;--btn-ink:#FFF4F8;--field:#FFFFFF;--field-ink:#2B0A1C;--warn:#9F2F2D;--soft:#F8E1EA}
.th-emerald{--bg:#0F2E24;--card:#143A2E;--text:#F4EEDB;--body:#DDE5DA;--mute:#A8BDB0;--line:#1F4A3B;--line-strong:#2C5E4C;--accent:#D4B061;--accent-ink:#E2C47D;--btn:#D4B061;--btn-ink:#0F2E24;--field:#FBF6E8;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#1A4234}
.th-indigo{--bg:#1B1F4B;--card:#23285C;--text:#F1EEF8;--body:#DAD7EA;--mute:#ABA8CA;--line:#2F3570;--line-strong:#3E4585;--accent:#F0B46A;--accent-ink:#F5C68A;--btn:#F0B46A;--btn-ink:#1B1F4B;--field:#FBF8F2;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#2A3068}
.th-henna{--bg:#3A2016;--card:#46291D;--text:#F8EBDD;--body:#EBDACB;--mute:#C8AE98;--line:#563526;--line-strong:#6A4433;--accent:#E07B39;--accent-ink:#EE9A5E;--btn:#E07B39;--btn-ink:#2A160E;--field:#FBF5EC;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#50301F}
.th-pearl{--bg:#F5F5F4;--card:#FFFFFF;--text:#202124;--body:#3A3B3E;--mute:#6B6C70;--line:#E4E4E2;--line-strong:#D2D2CF;--accent:#8C7A5B;--accent-ink:#6B5C42;--btn:#202124;--btn-ink:#FFFFFF;--field:#FFFFFF;--field-ink:#111111;--warn:#9F2F2D;--soft:#ECECEA}
.th-peacock{--bg:#0F3D47;--card:#144A55;--text:#F4EBD3;--body:#DDE7E2;--mute:#A9C3BF;--line:#225F6A;--line-strong:#2F7380;--accent:#D9AB4C;--accent-ink:#E5BD66;--btn:#D9AB4C;--btn-ink:#0C2F37;--field:#FBF6E8;--field-ink:#1A1A1A;--warn:#FFB4A6;--soft:#1A5562}
body.wd{background:var(--bg);color:var(--body);overflow-x:hidden}
.wd ::selection{background:var(--line-strong);color:var(--text)}
.wd a{color:var(--text)}
.wd h1,.wd h2,.wd h3{color:var(--text)}.wd h1 em,.wd h2 em{color:var(--accent-ink)}
.wd :focus-visible{outline:2px solid var(--text);outline-offset:2px}
.wd input,.wd select,.wd textarea{background:var(--field);color:var(--field-ink);border-color:var(--line-strong)}
.wd input:focus,.wd select:focus,.wd textarea:focus{outline:2px solid var(--text);outline-offset:1px}
.wd label.f{color:var(--mute)}
.wd button{color:var(--text);border-color:var(--line-strong);border-radius:99px;padding-left:1.3rem;padding-right:1.3rem}.wd button:hover{background:var(--soft);border-color:var(--text)}
.wd button.p,.wd .wbtn{background:var(--btn);color:var(--btn-ink);border:1px solid var(--btn)}.wd button.p:hover,.wd .wbtn:hover{background:var(--btn);opacity:.88}
.wd button:disabled{opacity:.55;cursor:default}
.wd .mute{color:var(--mute)}.wd .warn{color:var(--warn)}
.wbtn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:.7rem 1.4rem;border-radius:99px;font-weight:600;text-decoration:none;cursor:pointer}
.wbtn.wsm{min-height:44px;padding:.5rem 1.1rem;font-size:.9rem}
.wlink{font-size:.85rem;font-weight:600;color:var(--text);white-space:nowrap}
.wpre{white-space:pre-line}
.wnote{font-size:.85rem;color:var(--mute);margin:.6rem 0 0}
.wcode{font-family:var(--mono);font-size:.85rem;color:var(--text);background:var(--soft);border-radius:6px;padding:.1rem .45rem}
.wk{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--mute);margin:0 0 .8rem}
.wmark{width:46px;height:auto;color:var(--text);display:block;margin:0 auto 1rem}.wmark .wdot{fill:var(--accent)}

.wpv{position:sticky;top:0;z-index:40;background:var(--text);color:var(--bg);text-align:center;font-size:.85rem;font-weight:600;padding:.55rem 16px}
.wpv a{color:inherit;text-decoration:underline;margin-left:.4rem;white-space:nowrap}
.wmain{min-height:100vh}
.wload{text-align:center;padding:35vh 16px;color:var(--mute)}

/* hero: names large, the "&" in italic, a framed photo shaped like an arch */
.whero{max-width:980px;margin:0 auto;padding:clamp(2.75rem,10vw,5.5rem) 16px clamp(2.25rem,7vw,4rem);display:grid;gap:2.2rem;justify-items:center;text-align:center}
.whero h1{font-size:clamp(3rem,14vw,5.6rem);line-height:.98;letter-spacing:-.035em;margin:0}
.whero h1 em{font-style:italic;font-weight:500}
.wtag{font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,4.5vw,1.4rem);line-height:1.35;color:var(--body);margin:1rem auto 0;max-width:30ch}
.wwhen{margin:1.2rem 0 0;font-weight:600;color:var(--text)}
.wcd{font-family:var(--mono);font-size:.85rem;color:var(--mute);margin:.35rem 0 1.4rem}
.wph{width:min(100%,360px);aspect-ratio:4/5;border-radius:999px 999px 18px 18px;border:1px solid var(--line-strong);padding:9px;background:var(--card)}
.wph img{width:100%;height:100%;object-fit:cover;border-radius:999px 999px 11px 11px;display:block}
@media(min-width:860px){.whero.wpic{grid-template-columns:1fr 1fr;align-items:center;gap:3rem}.whero.wpic .wph{justify-self:end}.whero.wpic .wht{justify-self:start;text-align:left}.whero.wpic .wmark{margin-left:0}.whero.wpic .wtag{margin-left:0}}

/* section links: scroll sideways on a phone */
.wnav{position:sticky;top:0;z-index:30;background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.wpv:not([hidden])~.wmain .wnav{top:34px}
/* The links follow the scroll (aria-current, wedding.js spy) and RSVP stays pinned at the end, one tap from every section. */
.wnin{display:flex;align-items:center;gap:.4rem;max-width:980px;margin:0 auto;padding:0 10px 0 0}
.wnl{flex:1;min-width:0;display:flex;gap:.1rem;overflow-x:auto;scrollbar-width:none;padding:0 10px}.wnl::-webkit-scrollbar{display:none}
.wnl a{flex:none;display:inline-flex;align-items:center;min-height:48px;padding:0 .7rem;font-size:.9rem;font-weight:600;color:var(--mute);text-decoration:none;white-space:nowrap;box-shadow:inset 0 -2px 0 transparent;transition:color .2s,box-shadow .2s}
.wnl a:hover{color:var(--text)}.wnl a[aria-current]{color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}
.wd .wnrsvp{flex:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:64px;padding:0 1.1rem;border-radius:99px;background:var(--btn);color:var(--btn-ink);border:1px solid var(--btn);font-weight:600;font-size:.9rem;text-decoration:none}
.wd .wnrsvp:hover{opacity:.88}
.whb{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.whero.wpic .whb{justify-content:inherit}

.wsec{max-width:720px;margin:0 auto;padding:clamp(2.75rem,9vw,4.5rem) 16px;scroll-margin-top:56px}
.wpv:not([hidden])~.wmain .wsec{scroll-margin-top:90px}
.wsec+.wsec{border-top:1px solid var(--line)}
.wsec h2{font-size:clamp(2rem,8vw,2.8rem);margin:0 0 1.3rem}
.wsec h3{font-size:1.4rem;letter-spacing:-.02em;margin:0}
.wsec p{margin:.5rem 0 0}.wlead{font-size:1.08rem;line-height:1.65}
.wcard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.2rem 1.25rem}
.wcard+.wcard{margin-top:12px}
.wgrid{display:grid;gap:12px;margin-top:1.2rem}.wgrid .wcard+.wcard{margin-top:0}
@media(min-width:640px){.wgrid{grid-template-columns:1fr 1fr}}
.wgrid .wbtn{margin-top:.9rem}

/* events */
.wevs{display:grid;gap:12px}
.wev{display:grid;grid-template-columns:62px minmax(0,1fr);gap:1rem;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.15rem}
.wdate{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;border-right:1px solid var(--line);padding-right:.9rem;line-height:1.1}
.wdate span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--mute)}
.wdate b{font-family:var(--serif);font-weight:500;font-size:2.1rem;color:var(--text);letter-spacing:-.03em;margin:.15rem 0}
.wmeta{color:var(--mute);font-size:.92rem}
.wven{color:var(--body)}.wven .wlink{margin-left:.35rem}
.wattire{font-size:.92rem}.wattire span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--mute);margin-right:.5rem}
.wstream{margin-top:1rem;border-top:1px dashed var(--line-strong);padding-top:.9rem}.wstream b{color:var(--text)}.wstream p{display:flex;flex-wrap:wrap;gap:.4rem .6rem;align-items:center}
.wnow{display:flex;gap:.8rem;align-items:flex-start;margin-top:1rem;background:var(--soft);border-radius:12px;padding:.8rem .9rem}
.wnow b{display:block;color:var(--text)}.wnow span{font-size:.9rem}
.wpulse{flex:none;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-top:.4rem}
@media(prefers-reduced-motion:no-preference){.wpulse{animation:wpl 1.8s ease-in-out infinite}}
@keyframes wpl{0%,100%{opacity:1}50%{opacity:.35}}

/* ceremony program */
.wprog+.wprog{margin-top:2rem}
.wprog ol{list-style:none;counter-reset:st;margin:1rem 0 0;padding:0}
.wprog li{counter-increment:st;position:relative;padding:0 0 1.1rem 2.6rem;border-left:1px solid var(--line-strong);margin-left:.9rem}
.wprog li:last-child{border-left-color:transparent;padding-bottom:0}
.wprog li:before{content:counter(st);position:absolute;left:-.95rem;top:-.1rem;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--card);border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.78rem;color:var(--text)}
.wprog li b{color:var(--text)}.wprog li p{margin:.25rem 0 0}

/* announcements */
.wpost+.wpost{margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.wpost time{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--mute);display:block;margin-bottom:.35rem}

/* polls, trivia */
.wq{font-family:var(--serif);font-size:1.3rem;line-height:1.25;letter-spacing:-.02em;color:var(--text);margin:0 0 .9rem}
.wopts{display:grid;gap:.5rem}.wopts button{text-align:left;border-radius:12px;padding:.7rem 1rem;min-height:50px;background:var(--field);color:var(--field-ink)}.wopts button:hover{background:var(--field);border-color:var(--text)}
.wres{display:grid;gap:.6rem}
.wbar{display:grid;grid-template-columns:minmax(0,1fr) 3rem;gap:.25rem .6rem;align-items:center}
.wbl{grid-column:1/-1;font-size:.92rem;color:var(--text)}
.wbt{height:10px;border-radius:99px;background:var(--soft);overflow:hidden}.wbt i{display:block;height:100%;background:var(--text);border-radius:99px}
.wbar.me .wbt i{background:var(--accent)}
.wbn{font-family:var(--mono);font-size:.8rem;text-align:right;color:var(--text)}
@media(prefers-reduced-motion:no-preference){.wbt i{animation:wgrow .6s cubic-bezier(.2,.7,.2,1)}}
@keyframes wgrow{from{width:0}}
.wscore{font-family:var(--serif);font-size:3.4rem;line-height:1;color:var(--text);margin:0}.wscore span{font-size:1.3rem;color:var(--mute)}
.wqa{margin:1.2rem 0;padding-left:1.2rem}.wqa li{margin:.6rem 0}.wqa b{display:block;color:var(--text)}.wqa span{font-size:.92rem}

/* ask */
.wform{display:grid;gap:.9rem;margin-top:1.1rem}
.wrow{grid-template-columns:minmax(0,1fr) auto;align-items:end}
.wans{display:grid;gap:10px;margin-top:1rem}
.wqa1{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:.9rem 1.1rem}
.wq1{font-weight:600;color:var(--text);margin:0!important}.wa1{margin:.35rem 0 0!important}

/* photos */
.wgal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;border-radius:14px;overflow:hidden;margin-bottom:1.2rem}
@media(min-width:640px){.wgal{grid-template-columns:repeat(4,minmax(0,1fr))}}
.wthumb{padding:0!important;border:0;border-radius:0;min-height:0;aspect-ratio:1;overflow:hidden;background:var(--soft)}.wthumb:hover{background:var(--soft)}
.wthumb img{width:100%;height:100%;object-fit:cover;display:block}
.wfile{position:relative;display:inline-flex;cursor:pointer}.wfile input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.wfile input:focus-visible+span{outline:2px solid var(--text);outline-offset:2px}
.wlb{border:0;padding:0;background:transparent;max-width:min(96vw,1000px);max-height:96vh;color:#fff}
.wlb::backdrop{background:rgba(0,0,0,.88)}
.wlb figure{margin:0}.wlb img{display:block;max-width:100%;max-height:78vh;margin:0 auto;border-radius:10px}
.wlb figcaption{text-align:center;font-size:.9rem;margin-top:.6rem;color:#eee}
.wlbn{display:flex;justify-content:center;gap:.5rem;margin-top:.8rem}.wlbn button{color:#fff;border-color:rgba(255,255,255,.4);background:transparent}.wlbn button.p{background:#fff;color:#111;border-color:#fff}

/* faq, request form */
.wfaq{border-bottom:1px solid var(--line)}.wfaq summary{cursor:pointer;list-style:none;padding:1rem 2rem 1rem 0;font-weight:600;color:var(--text);position:relative}
.wfaq summary::-webkit-details-marker{display:none}.wfaq summary:after{content:"+";position:absolute;right:.2rem;top:.85rem;font-size:1.3rem;font-weight:500;color:var(--mute)}
.wfaq[open] summary:after{content:"–"}.wfaq>p{margin:0 0 1rem}
.wreq{margin-top:1.4rem;border-top:1px solid var(--line)}.wreq form{margin:0 0 1.2rem}
.wtwo{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.whp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}

/* closed, private */
.wclosed{max-width:520px;margin:0 auto;padding:clamp(4rem,18vh,9rem) 20px 4rem;text-align:center}
.wclosed h1{font-size:clamp(2.2rem,9vw,3.2rem)}.wclosed p{margin:1rem 0 0}
.wgate form{text-align:left;margin-top:1.6rem}
.wgate h1{font-size:clamp(2.6rem,12vw,4rem)}

.wft{text-align:center;padding:3.5rem 16px calc(3rem + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.wfn{font-family:var(--serif);font-size:1.5rem;color:var(--text);margin:0}
.wft p{margin:.3rem 0 0}

@media print{.wnav,.wpv,.wform,.wreq,#ask,#photos form{display:none!important}body.wd{background:#fff}}

/* vendor run sheet (/run): the app's calm look, one section per event */
.rnw{padding-top:clamp(1.5rem,5vw,3rem);padding-bottom:3rem}
.rnev .big{margin:0}.rnev>p{margin:.4rem 0 0}
.rntl{list-style:none;margin:1.1rem 0 0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:12px}
.rntl li{display:grid;grid-template-columns:5.6rem minmax(0,1fr) auto;gap:.8rem;align-items:baseline;padding:.75rem 1rem;border-bottom:1px solid var(--line)}.rntl li:last-child{border:0}
.rntl .rnm b{display:block;color:var(--text)}
.rntl li.past{opacity:.55}.rntl li.now{background:var(--green-bg)}
.rnh3{font-family:var(--sans);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:600;margin:1.4rem 0 .5rem}
.rnroles{list-style:none;margin:0;padding:0}.rnroles li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--line)}.rnroles li:last-child{border:0}
.rnroles span{color:var(--mute);text-align:right}
.rnf{margin-top:2rem}
/* The day-of staff page: big text to read at arm's length on a busy day, light or dark with the phone (theme.js data-system) */
body.rn{background:var(--bg);color:var(--body);font-size:1.12rem}
.rn .rntl li{grid-template-columns:6.4rem minmax(0,1fr) auto;padding:.9rem 1rem}.rn .rntl .n{font:600 1.1rem var(--sans);font-variant-numeric:tabular-nums;color:var(--ink)}.rn .rntl .rnm b{font-size:1.15rem}
.rnwho{display:block;color:var(--mute);font-size:.98rem}.rnnote{display:block;margin-top:.25rem;font-size:.98rem;color:var(--body)}
.rntl li.ch{box-shadow:inset 4px 0 0 var(--yellow)}.rnev.ch .rnwhere{color:var(--yellow)}
.rnday{font-family:var(--sans);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:600;margin:2rem 0 -.4rem}
.rnwhere{font-size:1.1rem;margin:.4rem 0 .7rem}.rnmap,.rncall{min-height:48px;display:inline-flex;align-items:center}
.rnch{margin:1.2rem 0 .4rem;padding:1rem 1.1rem;border-radius:14px;background:var(--yellow-bg);color:var(--ink);border:1px solid var(--line)}
.rnch h2{font-family:var(--sans);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin:0 0 .5rem;color:var(--yellow)}
.rnch ul{list-style:none;margin:0;padding:0}.rnch li{display:grid;grid-template-columns:5.6rem minmax(0,1fr);gap:.6rem;padding:.4rem 0;border-top:1px solid var(--line)}.rnch li:first-child{border:0}.rnch b{display:block}.rnch .n{font-weight:600}
.rnppl .rnroles li{align-items:center}.rnppl .rnroles span{text-align:left;color:var(--ink)}.rnppl .rnroles b{display:block}.rnppl .rnroles .mute{display:block;color:var(--mute)}
.rn-off #rnu{font-weight:600}
@media print{.rn .hdr,.rnf{display:none!important}.rntl{border:0}.rntl li{padding:.35rem 0;break-inside:avoid}.rnev{break-inside:avoid}}
/* gifts: money gifts sent straight to the couple, and the registry */
.wsub{font-family:var(--serif);font-weight:500;font-size:1.35rem;letter-spacing:-.02em;margin:2rem 0 0}
.wfund h3,.witem h3{font-size:1.25rem;margin:0 0 .35rem}.wfund button{margin-top:.9rem}.wfund .wbar{margin-top:.8rem}
.witem img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;margin-bottom:.8rem;background:var(--soft);display:block}
.witem.wgone{opacity:.62}.wgot{font-weight:600;color:var(--text);margin:.6rem 0 0}
.wrow2{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.8rem}.wrow2 .wbtn{margin:0}.wrow2 button{min-height:44px;font-size:.9rem}
.wclaim{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.wgive{margin-top:12px;display:grid;gap:1rem}.wgive .wq{margin:0}
.wpick{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.45rem}.wpick legend{font-size:.85rem;color:var(--mute);margin-bottom:.5rem;padding:0}
.wpick label:not(.f){position:relative}.wpick label:not(.f) input{position:absolute;opacity:0;width:1px;height:1px}
.wpick label:not(.f) span{display:inline-flex;align-items:center;min-height:44px;padding:.45rem 1rem;border:1px solid var(--line-strong);border-radius:99px;font-weight:600;cursor:pointer;background:var(--field);color:var(--field-ink)}
.wpick input:checked+span{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}.wpick input:focus-visible+span{outline:2px solid var(--text);outline-offset:2px}
.wother{flex-basis:100%;margin-top:.3rem}.wother input{max-width:12rem}
.wpay{display:grid;gap:.7rem;justify-items:start;padding:1rem;border-radius:12px;background:var(--soft)}.wpay p{margin:0}
.wcopy{min-height:44px;padding:.2rem .8rem!important;font-size:.82rem;margin-left:.3rem}
.wlinkb{border:0!important;background:none!important;padding:0!important;min-height:0;justify-self:start;font-size:.88rem;color:var(--mute)!important;text-decoration:underline}
.wthanks{background:var(--btn);color:var(--btn-ink);border-radius:14px;padding:1rem 1.2rem;font-weight:600;margin-bottom:1.2rem}.wthanks:focus{outline:none}
/* card gifts (Stripe): the guest may add the card fee so the couple receives the full amount */
.wcover{display:flex;gap:.6rem;align-items:center;min-height:44px;font-size:.92rem;cursor:pointer;color:var(--text)}.wcover input{accent-color:var(--btn);margin:0}
/* our people, hashtag, add to calendar */
.wparty{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-top:1.2rem}
.wperson{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.1rem;text-align:center;display:grid;gap:.25rem;justify-items:center}
.wperson img,.wini{width:96px;height:96px;border-radius:50%;object-fit:cover;margin-bottom:.4rem;background:var(--soft)}.wini{display:grid;place-content:center;font-family:var(--serif);font-size:2.2rem;color:var(--text)}
.wperson b{color:var(--text)}.wperson span.mute{font-size:.85rem}.wperson p{font-size:.88rem;margin:.4rem 0 0;text-align:left}
.whash{font-family:var(--mono);font-size:.9rem;color:var(--accent-ink);margin:.2rem 0 1rem}.wcal{font-size:.85rem;min-height:44px!important;display:inline-flex;align-items:center} /* a full-size tap target on phones */
/* the event's time where the guest is, the video, the local guide and the blessings */
.wvid{position:relative;aspect-ratio:16/9;margin-top:1.4rem;border-radius:16px;overflow:hidden;background:var(--soft);border:1px solid var(--line)}.wvid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.wguide{margin-top:1.2rem}.wguide .wk{margin:0 0 .5rem}
.wguide ul{list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:16px}
.wguide li{display:grid;gap:.15rem;padding:.8rem 1.1rem;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.wguide li:last-child{border:0}
.wguide b,.wgl{color:var(--text);font-weight:600}.wguide .wlink{margin-left:.35rem}.wgnote{font-size:.92rem}
.wwishes{columns:2 260px;column-gap:12px;margin-top:1.4rem}
.wwish{break-inside:avoid;margin:0 0 12px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.1rem 1.2rem}
.wwish blockquote{margin:0;font-family:var(--serif);font-size:1.12rem;line-height:1.45;color:var(--text);overflow-wrap:anywhere}.wwish figcaption{margin-top:.6rem;font-size:.85rem;font-weight:600;color:var(--mute)}
.wslgo{margin:0 0 1.2rem}
/* slideshow: the album full screen on a TV, a photo every 6 seconds with a soft fade (none for reduced motion) */
.wsl{border:0;padding:0;margin:0;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;background:#000;color:#fff;overflow:hidden}
.wsl::backdrop{background:#000}
.wslp img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0}.wslp img.on{opacity:1}
@media(prefers-reduced-motion:no-preference){.wslp img{transition:opacity 1.2s ease}}
.wslb{position:absolute;left:0;right:0;bottom:0;padding:3rem 24px calc(1.4rem + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(0,0,0,.72));text-align:center}
.wslc{margin:0;font-family:var(--serif);font-size:clamp(1.1rem,2.6vw,1.9rem);color:#fff}.wsla{margin:.4rem 0 0;font-size:clamp(.85rem,1.6vw,1.15rem);color:rgba(255,255,255,.8)}
.wslx{position:absolute;top:14px;right:14px;display:flex;gap:.5rem}.wslx button{color:#fff;border-color:rgba(255,255,255,.4);background:rgba(0,0,0,.35)}.wslx button:hover{background:rgba(255,255,255,.16);border-color:#fff}
.wslx button.p,.wslx button.p:hover{background:#fff;color:#111;border-color:#fff}
/* the couple's accent color (--ac, a mid tone) on any theme: as is on light themes, lighter on dark ones, and mixed darker or lighter for text so it stays readable */
@supports (color:color-mix(in srgb,red 50%,blue)){
.wd.wac{--accent:var(--ac);--accent-ink:color-mix(in srgb,var(--ac) 72%,#000)}
.wd.wac.th-mehndi,.wd.wac.th-royal,.wd.wac.th-peacock,.wd.wac.th-midnight,.wd.wac.th-emerald,.wd.wac.th-indigo,.wd.wac.th-henna{--accent:color-mix(in srgb,var(--ac) 72%,#fff);--accent-ink:color-mix(in srgb,var(--ac) 50%,#fff)}
}
/* font pairings, all from our own fonts or the guest's own system fonts (Devanagari has no italic and needs room above and below) */
.wd.wf-modern{--serif:"Familjen Grotesk",Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.wf-modern h1 em,.wf-modern h2 em,.wf-modern .wtag{font-style:normal}
.wd.wf-deva{--serif:"Familjen Grotesk","Noto Sans Devanagari","Kohinoor Devanagari","Nirmala UI",Mangal,sans-serif;--sans:Inter,"Noto Sans Devanagari","Kohinoor Devanagari","Nirmala UI",Mangal,system-ui,sans-serif;line-height:1.75}
.wf-deva h1,.wf-deva h2,.wf-deva h3{letter-spacing:0;line-height:1.3}.wf-deva h1 em,.wf-deva h2 em,.wf-deva .wtag{font-style:normal}
@media print{.wsl,.wvid,.wslgo{display:none!important}}
/* The seat finder (/w/<slug>/seats): big, one column, readable at arm's length in a dim hall */
.wseat{max-width:560px;margin:0 auto;padding:clamp(2rem,8vh,4rem) 20px 4rem}
.wseat-h{text-align:center;margin-bottom:1.5rem}.wseat-h h1{font-size:clamp(2.1rem,9vw,3rem);line-height:1.05;margin:.3rem 0 0}
.weye{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0}
.wseat-f{display:grid;gap:1rem;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.25rem}
.wseat-f .f{display:grid;gap:.4rem;font-weight:600;color:var(--text)}
.wseat-f input{font-size:1.25rem;padding:.9rem 1rem;border-radius:12px;border:1px solid var(--line-strong);background:var(--field);color:var(--field-ink);width:100%;min-width:0}
.wseat-go{font-size:1.1rem;padding:1rem;border-radius:999px;background:var(--btn);color:var(--btn-ink);border:0;font-weight:600;cursor:pointer}
.wseat-ev{margin:0;font-weight:600;color:var(--text);text-align:center}
.wseat-evs{border:0;margin:0;padding:0;display:grid;gap:.5rem}.wseat-evs legend{font-weight:600;color:var(--text);margin-bottom:.4rem}
.wseat-evs label{display:block}.wseat-evs input{position:absolute;opacity:0;width:1px;height:1px}
.wseat-evs span{display:block;padding:.8rem 1rem;border:1px solid var(--line-strong);border-radius:12px;color:var(--text);cursor:pointer}.wseat-evs small{display:block;color:var(--mute)}
.wseat-evs input:checked+span{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}.wseat-evs input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.wseat-r{margin-top:1.25rem}
.wseat-card{text-align:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.5rem 1.25rem}
.wseat-who{margin:0;color:var(--body);font-size:1.1rem}.wseat-who small,.wseat-pick small{display:block;color:var(--mute);font-size:.9rem}
.wseat-t{margin:.4rem 0 0;font-family:var(--serif,Georgia,serif);font-size:clamp(3rem,16vw,4.6rem);line-height:1;color:var(--text);overflow-wrap:anywhere}
.wseat-z{margin:.6rem 0 0;color:var(--accent-ink);font-weight:600}.wseat-n{margin:.4rem 0 0;color:var(--body)}
.wseat-m{margin:1rem 0 0;color:var(--body);font-size:.95rem}.wseat-m b{display:block;color:var(--mute);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.2rem}
.wseat-pick{display:grid;gap:.5rem}.wseat-pick button{text-align:left;font-size:1.1rem;padding:.9rem 1rem;border-radius:12px;border:1px solid var(--line-strong);background:var(--card);color:var(--text);cursor:pointer}
.wseat-none{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.25rem;color:var(--body)}
.wd .wbtn.wbtn2{background:transparent;color:var(--text);border-color:var(--line-strong)}.wd .wbtn.wbtn2:hover{background:var(--soft)}
.wseat .wmark{width:46px;height:51px;margin:0 auto .6rem}
/* Phones: the section tabs fade at the edge, a hint that more scroll into view; every small button is at least 44px tall */
@media(max-width:700px){.wnl{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent)}}
/* The seat finder: back to the wedding website in one tap */
.wseat-nav{display:flex;justify-content:center;padding:14px 16px 0}
.wseat-back{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:0 1rem;border:1px solid var(--line-strong);border-radius:99px;color:var(--text);font-weight:600;font-size:.9rem;text-decoration:none}
.wseat-back:before{content:"\2190";font-weight:400}.wseat-back:hover{background:var(--soft)}
.wvid .wplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3}
.wsnd{position:absolute;right:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.45rem .9rem;border-radius:999px;border:1px solid var(--line-strong);background:color-mix(in srgb,var(--card) 85%,transparent);color:var(--text);font:inherit;font-size:.9rem;cursor:pointer}
.wsnd[aria-pressed=true]{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}
/* The cover over a video or a full-screen photo (wcov). It fills the screen (100svh, inside the safe areas) and the picture is cropped to cover it,
   kept to the couple's focal point (wfo-top, -center, -bottom). The text sits at the bottom, always light (ivory, with a light tint of the accent for
   the "&") on a scrim whose numbers come from spVideo.SCRIM in video.js (--wtint, --wband, --wtop, --wpanel on the header): a tint over the whole picture,
   a gradient band behind the text that is solid by the time the text starts, and a soft shade at the top for the status bar and the speaker button.
   The band is sized for a white picture, so the names and date pass WCAG AA on any photo or video (tests/wedding.browser.mjs measures it).
   None leaves the picture clear and puts the text on a soft translucent panel instead. The theme's colors never reach the cover text. */
.whero.wcov{--hx:#FFFDF8;--hx2:rgba(255,253,248,.88);--hxa:#F1D9A0;--scr:16,12,10;position:relative;isolation:isolate;max-width:none;width:100%;margin:0;min-height:100vh;min-height:100svh;padding:0;display:flex;flex-direction:column;justify-content:flex-end;gap:0;overflow:hidden;background:#16110E;color:var(--hx)}
@supports (color:color-mix(in srgb,red 50%,blue)){.whero.wcov{--hxa:color-mix(in srgb,var(--accent) 45%,#fff)}}
.wpv:not([hidden])~.wmain .whero.wcov{min-height:calc(100vh - 34px);min-height:calc(100svh - 34px)}
.wvbg{position:absolute;inset:0;z-index:0;overflow:hidden;container-type:size;background:radial-gradient(120% 80% at 50% 0%,#3A2A22 0%,#16110E 70%)}
.wcimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.wfo-top .wcimg{object-position:50% 0}.wfo-bottom .wcimg{object-position:50% 100%}
/* a 16:9 player scaled to cover the whole cover (its own box, so a cover taller than the screen has no gaps either), so there are never black bars */
.wvbg iframe{position:absolute;top:50%;left:50%;width:max(100vw,177.78svh);height:max(100svh,56.25vw);transform:translate(-50%,-50%);border:0;pointer-events:none}
@supports (width:1cqw){.wvbg iframe{width:max(100cqw,177.78cqh);height:max(100cqh,56.25cqw)}}
.wfo-top .wvbg iframe{top:0;transform:translate(-50%,0)}.wfo-bottom .wvbg iframe{top:100%;transform:translate(-50%,-100%)}
.wvbg iframe:not([src]){visibility:hidden} /* waiting for Play (less motion): the poster shows instead */
.wcov .wvov{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(var(--scr),var(--wtop)) 0,rgba(var(--scr),0) 28%),linear-gradient(rgba(var(--scr),var(--wtint)),rgba(var(--scr),var(--wtint)))}
.wcov .wht{position:relative;z-index:2;width:100%;max-width:none;text-align:center;padding:9rem max(16px,env(safe-area-inset-right)) calc(clamp(2rem,7vh,4.5rem) + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  background:linear-gradient(180deg,rgba(var(--scr),0) 0,rgba(var(--scr),calc(var(--wband) * .18)) 2.5rem,rgba(var(--scr),calc(var(--wband) * .5)) 5rem,rgba(var(--scr),calc(var(--wband) * .85)) 7.5rem,rgba(var(--scr),var(--wband)) 9rem);text-shadow:0 1px 2px rgba(0,0,0,.4),0 0 24px rgba(0,0,0,.35)}
.wcov .whi{max-width:46rem;margin:0 auto}
.wov-none .wht{background:none}
.wov-none .whi{max-width:min(100%,40rem);background:rgba(var(--scr),var(--wpanel));-webkit-backdrop-filter:blur(8px) saturate(1.1);backdrop-filter:blur(8px) saturate(1.1);border-radius:24px;padding:1.5rem clamp(1rem,5vw,2.5rem) 1.7rem;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.wcov .wmark{color:var(--hx)}.wcov .wmark .wdot{fill:var(--hxa)}
.wcov .wht h1,.wcov .wwhen{color:var(--hx)}.wcov .wht h1 em{color:var(--hxa)}
.wcov .wk,.wcov .wtag,.wcov .wcd,.wcov .whash{color:var(--hx2)}
.wd .wcov .wbtn{background:var(--hx);color:#1B1410;border:1px solid var(--hx);text-shadow:none}.wd .wcov .wbtn:hover{background:#fff;opacity:1}
.wd .wcov .wbtn.wbtn2{background:rgba(var(--scr),.3);color:var(--hx);border:1.5px solid rgba(255,253,248,.85)}.wd .wcov .wbtn.wbtn2:hover{background:rgba(255,253,248,.16)}
.wd .wcov :focus-visible{outline-color:#fff}
.wcov .wsnd{top:calc(14px + env(safe-area-inset-top));bottom:auto;right:max(14px,env(safe-area-inset-right));background:rgba(var(--scr),.5);color:var(--hx);border-color:rgba(255,253,248,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.wcov .wsnd[aria-pressed=true]{background:var(--hx);color:#1B1410;border-color:var(--hx)}
@media(min-width:860px){.wcov .wht{padding-bottom:calc(clamp(3rem,9vh,6rem) + env(safe-area-inset-bottom))}}
@media print{.whero.wcov{min-height:0}.wvbg iframe{display:none}}
/* a link on a line of its own is a 44px target */
.wnote>a:only-child{display:inline-flex;align-items:center;min-height:44px}
/* The shared moodboard (/moodboard, public/moodboard.js): the same masonry as the planner's tool (planner.css .mb-*) */
.mb-grid{columns:2 150px;column-gap:12px;list-style:none;margin:0;padding:0}@media(min-width:860px){.mb-grid{columns:3 220px}}
.mb-pin{break-inside:avoid;margin:0 0 12px;background:var(--surface);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.mb-pin img{display:block;width:100%;height:auto;background:var(--soft)}.mb-cap{display:block;padding:.45rem .75rem .6rem;font-size:.92rem;color:var(--body)}
.mb-link{display:flex;flex-direction:column;gap:.2rem;padding:.85rem .9rem;text-decoration:none;color:var(--ink);background:var(--soft)}
.mb-note{margin:0;padding:.85rem .9rem;white-space:pre-wrap;color:var(--body);background:var(--soft-2)}
.mb-sws{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin:0 0 1.2rem;padding:0;list-style:none}.mb-sw{display:inline-flex;align-items:center;gap:.45rem}.mb-sw i{width:30px;height:30px;border-radius:50%;box-shadow:0 0 0 1px var(--line-strong);flex:none}
