/* space-invite.css — "Bring people in" on a free space's Overview
   (js/space-invite.js; the approved design docs/projects/dau-50/invite-to-space-design.html:
   a dashed "Your link" card, then two cards side by side that stack on a phone). */
#route-spaces .sinv { padding: 18px 20px; display: grid; gap: 14px; }
#route-spaces .sinv-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; justify-content: space-between; }
#route-spaces .sinv-head .card-title { margin: 0; }
#route-spaces .sinv-muted { color: var(--text-2); font-size: 13.5px; line-height: 1.5; margin: 0; }
#route-spaces .sinv-small { font-size: 12.5px; }
#route-spaces .sinv-box { border: 1px solid var(--border, #e5e7eb); border-radius: 14px; padding: 14px; display: grid; gap: 8px; align-content: start; min-width: 0; }
#route-spaces .sinv-box h3 { margin: 0; font-size: 15px; font-weight: 700; }
#route-spaces .sinv-link { border-style: dashed; }
#route-spaces .sinv-url { color: var(--text-1, #15172b); font-weight: 600; overflow-wrap: anywhere; }
#route-spaces .sinv-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
#route-spaces .sinv-row { display: flex; flex-wrap: wrap; gap: 8px; }
#route-spaces .sinv-row .btn { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
#route-spaces .sinv-draft { grid-column: 1 / -1; }
#route-spaces .sinv-f { display: grid; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--text-2); }
#route-spaces .sinv-f input,
#route-spaces .sinv-f textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--border, #d9dbe3); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 15px; font-weight: 400; color: var(--text-1, #15172b); background: var(--surface, #fff); min-height: 44px; resize: vertical; }