:root{
  --ink:#f7f1e8;--muted:#c9bcae;--panel:rgba(29,22,17,.76);--panel2:rgba(245,235,220,.10);
  --line:rgba(255,255,255,.14);--warm:#e6c79d;--dark:#201812;--green:#b8d6b8;--red:#e7b7ad;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"SF Arabic","Geeza Pro",Tahoma,Arial,sans-serif;background:#17110d;color:var(--ink)}
body{min-height:100dvh}.bg{position:fixed;inset:0;background-image:linear-gradient(180deg,rgba(10,8,6,.28),rgba(12,9,7,.70)),url('/assets/bg.webp');background-size:cover;background-position:center;transform:scale(1.015);z-index:-2}.bg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 12%,rgba(230,199,157,.10),transparent 44%),linear-gradient(0deg,rgba(8,6,5,.24),transparent)}
.shell{width:min(100%,560px);margin:auto;padding:max(22px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));min-height:100dvh;display:flex;align-items:center}.hidden{display:none!important}
.panel,.glass{border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(22px) saturate(120%);-webkit-backdrop-filter:blur(22px) saturate(120%);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.panel{width:100%;border-radius:30px;padding:28px 22px;text-align:center}.brand-mark{width:68px;height:68px;border-radius:22px;margin:0 auto 18px;display:grid;place-items:center;font-size:30px;background:linear-gradient(145deg,#f0ddc2,#b6956c);box-shadow:inset 0 1px rgba(255,255,255,.6),0 14px 30px rgba(0,0,0,.25)}
.eyebrow{margin:0 0 6px;font-size:13px;color:var(--warm);font-weight:800;letter-spacing:.2px}.panel h1,.topbar h1{margin:0;font-size:30px;line-height:1.2}.lead{color:#e0d7cd;line-height:1.8;margin:14px 0 22px;font-size:16px}.hint{margin-top:18px;color:var(--muted);font-size:13px;line-height:1.7}.steps{display:grid;gap:10px;text-align:right;margin:20px 0}.steps div{display:flex;gap:11px;align-items:flex-start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:13px;border-radius:16px}.steps b{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--warm);color:#2c2118}.steps span{line-height:1.65;color:#eee4d9}
.device-rule{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 18px}.device-rule div{display:grid;gap:3px;padding:12px 8px;border-radius:17px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09)}.device-rule div.required{background:rgba(230,199,157,.12);border-color:rgba(230,199,157,.24)}.device-rule span{font-size:21px}.device-rule small{color:var(--muted);font-size:11px}.device-rule strong{font-size:13px;color:#f5ece2}
button{font:inherit;border:0;cursor:pointer}.primary,.secondary{width:100%;border-radius:17px;padding:15px 18px;font-weight:900;font-size:16px}.primary{background:var(--warm);color:#2b2018;box-shadow:0 10px 25px rgba(0,0,0,.16)}.secondary{background:rgba(255,255,255,.09);color:var(--ink);border:1px solid var(--line)}
.app-view{width:100%;align-self:stretch;padding-top:4px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 4px 18px}.status-pill{font-size:12px;font-weight:900;padding:8px 12px;border-radius:999px;background:rgba(184,214,184,.15);border:1px solid rgba(184,214,184,.35);color:#d6eed6}.status-pill.closed{background:rgba(231,183,173,.13);border-color:rgba(231,183,173,.28);color:#f0c8c0}
.glass{border-radius:27px}.hero-card{padding:20px}.hero-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.hero-head h2{margin:3px 0 0;font-size:25px}.muted{margin:0;color:var(--muted);font-size:13px}.count-badge{min-width:74px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid var(--line);padding:10px;text-align:center}.count-badge strong{font-size:28px;display:block;line-height:1}.count-badge span{font-size:11px;color:var(--muted)}.cutoff{margin:16px 0 20px;color:#d6cbc0;font-size:13px}.my-state{font-size:17px;font-weight:900;margin-bottom:12px}.rsvp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.rsvp{min-height:62px;border-radius:18px;font-weight:900;font-size:17px;border:1px solid transparent;transition:.18s transform,.18s background}.rsvp:active{transform:scale(.98)}.rsvp span{display:inline-grid;place-items:center;margin-left:6px;width:24px;height:24px;border-radius:50%}.rsvp.yes{background:rgba(184,214,184,.12);color:#d9f0d9;border-color:rgba(184,214,184,.25)}.rsvp.no{background:rgba(231,183,173,.10);color:#f1cbc4;border-color:rgba(231,183,173,.22)}.rsvp.active.yes{background:#bedabb;color:#203020}.rsvp.active.no{background:#e7b7ad;color:#40231d}.extras{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);display:grid;gap:12px}.row-between{display:flex;align-items:center;justify-content:space-between;color:#eee5dc}.stepper{display:flex;align-items:center;gap:12px}.stepper button{width:36px;height:36px;border-radius:12px;background:rgba(255,255,255,.10);color:var(--ink);font-size:22px}.stepper strong{min-width:20px;text-align:center}.extras input{width:100%;border:1px solid var(--line);background:rgba(0,0,0,.16);color:var(--ink);outline:none;border-radius:15px;padding:14px;font:inherit}.extras input::placeholder{color:#9f9489}.message{min-height:18px;margin:12px 0 0;color:var(--warm);font-size:13px}
.list-card{margin-top:13px;padding:18px}.section-title{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:13px}.section-title h3{margin:3px 0 0;font-size:19px}.guest-total{font-size:12px;color:var(--warm)}.attendees{display:flex;flex-wrap:wrap;gap:8px}.person-chip{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);border-radius:999px;padding:8px 11px;font-size:13px}.person-chip .dot{width:7px;height:7px;border-radius:50%;background:#b9d8b8}.person-chip small{color:var(--warm)}.empty{color:var(--muted);font-size:14px;padding:7px 0}.app-view footer{text-align:center;color:rgba(255,255,255,.52);font-size:11px;padding:18px 0 4px}
@media(min-width:800px){.shell{width:620px}.bg{background-position:center}.panel{padding:34px 30px}}
@media(prefers-reduced-motion:no-preference){.panel,.glass{animation:rise .45s ease both}@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}
.alt-actions{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:16px}
.alt-actions .link-btn{background:none;border:0;padding:6px 2px;color:var(--muted);font:inherit;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer;border-bottom:1px solid transparent}
.alt-actions .link-btn:hover{color:var(--warm);border-bottom-color:rgba(230,199,157,.5)}
.req-form{display:grid;gap:10px}
.req-form input{width:100%;border:1px solid var(--line);background:rgba(0,0,0,.16);color:var(--ink);outline:none;border-radius:15px;padding:14px;font:inherit}
.req-form input::placeholder{color:#9f9489}
.req-form input:focus{border-color:rgba(230,199,157,.45)}
.message.ok{color:var(--green)}
.message.bad{color:var(--red)}