/* the lobby's visible front door (2026-10-13) */
.qzw { max-width: 62rem; margin: 0 auto; padding: 1.5rem 1rem 2.5rem; text-align: left; color: var(--qz-text, #1f1c26); }
.qzw h2 { margin: 0 0 .5rem; font-size: 1.75rem; line-height: 1.2; }
.qzw h3 { margin: 2rem 0 .75rem; font-size: 1.15rem; }
.qzw-lead { margin: 0 0 1.1rem; max-width: 46rem; font-size: 1.05rem; line-height: 1.55; color: var(--qz-muted, #4a4558); }
.qzw-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.qzw-btn { display: inline-block; padding: .7rem 1.1rem; border-radius: 10px; border: 1px solid var(--qz-line, #cfc8dc); background: var(--qz-surface, #fff); color: var(--qz-text, #1f1c26) !important; font-weight: 600; text-decoration: none; min-height: 44px; box-sizing: border-box; }
.qzw-btn.primary { background: #8F12C4; border-color: #8F12C4; color: #fff !important; }
.qzw-btn.ghost { background: transparent; }
.qzw-btn:hover { filter: brightness(1.06); }
.qzw-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .75rem; }
.qzw-step { display: flex; flex-direction: column; gap: .35rem; padding: 1rem; border-radius: 12px; border: 1px solid var(--qz-line, #d9d2e6); background: var(--qz-surface, #fff); color: var(--qz-text, #1f1c26) !important; text-decoration: none; }
.qzw-step i { color: #8F12C4; font-size: 1.3rem; }
.qzw-step span { color: var(--qz-muted, #4a4558); font-size: .93rem; line-height: 1.45; }
.qzw-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14.5rem, 1fr)); gap: .7rem; }
.qzw-card { position: relative; display: flex; align-items: center; gap: .75rem; padding: .8rem .9rem; border-radius: 12px; border: 1px solid var(--qz-line, #d9d2e6); border-left: 4px solid var(--vt-accent, #8F12C4); background: var(--qz-surface, #fff); color: var(--qz-text, #1f1c26) !important; text-decoration: none; min-height: 44px; }
.qzw-card i { color: var(--vt-accent, #8F12C4); font-size: 1.4rem; width: 1.6rem; text-align: center; }
.qzw-card span { display: flex; flex-direction: column; }
.qzw-card small { color: var(--qz-muted, #5a5468); font-size: .82rem; }
.qzw-card em { margin-left: auto; font-style: normal; font-size: .68rem; text-transform: uppercase; letter-spacing: .04em; padding: .15rem .45rem; border-radius: 999px; background: rgba(143, 18, 196, .12); color: #6d0f96; white-space: nowrap; }
.qzw-card:hover, .qzw-step:hover { box-shadow: 0 2px 10px rgba(80, 40, 120, .18); }
@media (max-width: 640px) { .qzw h2 { font-size: 1.45rem; } .qzw-actions .qzw-btn { flex: 1 1 100%; text-align: center; } }

/* the welcome message for an invited member (js/qizmit/qizmit.invitewelcome.js) */
.qzw-modal { position: fixed; inset: 0; background: rgba(15, 8, 30, .6); z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.qzw-modal-card { background: var(--qz-surface, #fff); color: var(--qz-text, #1f1c26); width: min(34rem, 100%); max-height: 90vh; overflow: auto; border-radius: 14px; padding: 1.5rem; box-shadow: 0 12px 40px rgba(0, 0, 0, .4); }
.qzw-modal-card h2 { margin: 0 0 .5rem; font-size: 1.5rem; }
.qzw-modal-lead { margin: 0 0 1rem; line-height: 1.5; }
.qzw-modal-note { margin: 0 0 1rem; padding: .75rem 1rem; border-left: 4px solid #8F12C4; background: rgba(143, 18, 196, .08); white-space: pre-wrap; border-radius: 0 8px 8px 0; }
.qzw-modal-small { margin: 1rem 0 0; font-size: .85rem; color: var(--qz-muted, #5a5468); }
body.qzw-modal-open { overflow: hidden; }