#invite-dim{ --ink:#1C1512; --mud:#726A62; --hair:#D3D1CF; --road:#F4BB00; --danger:#B3362C; position:fixed; inset:0; background:rgba(10,8,6,0.4); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); z-index:1000; display:flex; align-items:center; justify-content:center; padding:18px; font-family:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; color:var(--ink); line-height:1.5; }
#invite-dim *{ box-sizing:border-box; margin:0; padding:0; }
#invite-dim .dlg{ width:100%; max-width:420px; border-radius:24px; background:rgba(255,255,255,0.9); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px); border:1px solid rgba(255,255,255,0.6); box-shadow:0 18px 36px rgba(0,0,0,0.35); padding:24px 20px 20px; display:flex; flex-direction:column; gap:14px; animation:inv-pop .22s cubic-bezier(.34,1.56,.64,1); }
@keyframes inv-pop{ from{ transform:scale(.88); opacity:0; } to{ transform:scale(1); opacity:1; } }
#invite-dim h2{ font-size:22px; letter-spacing:-0.6px; }
#invite-dim p{ font-size:14.5px; color:var(--mud); }
#invite-dim .center{ text-align:center; }
#invite-dim .field{ display:flex; flex-direction:column; gap:6px; }
#invite-dim .field label{ font-size:13px; font-weight:600; }
#invite-dim .field .in{ height:50px; border:1.5px solid var(--ink); border-radius:12px; display:flex; align-items:center; padding:0 14px; gap:10px; background:#fff; }
#invite-dim .field .in.bad{ border-color:var(--danger); }
#invite-dim .field .cc{ color:var(--mud); padding-right:10px; border-right:1px solid var(--hair); }
#invite-dim .field input{ border:0; outline:0; font:inherit; font-size:16px; flex:1; min-width:0; background:transparent; color:var(--ink); }
#invite-dim .field .errt{ font-size:12.5px; color:var(--danger); }
#invite-dim .btn{ display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:12px; font:inherit; font-weight:600; font-size:15px; padding:15px; cursor:pointer; }
#invite-dim .btn:active{ opacity:.7; }
#invite-dim .btn:disabled{ opacity:.6; cursor:default; }
#invite-dim .btn-y{ background:var(--road); color:var(--ink); }
#invite-dim .btn-o{ background:#fff; color:var(--ink); border:1px solid var(--hair); }
#invite-dim .fine{ font-size:12px; color:var(--mud); text-align:center; }
#invite-dim .done-ic{ width:56px; height:56px; border-radius:50%; background:var(--road); display:flex; align-items:center; justify-content:center; align-self:center; color:var(--ink); }
@media (prefers-reduced-motion: reduce){ #invite-dim .dlg{ animation:none; } }