/* Invite colleagues: /<lang>/r/<CODE>/ landing + settings card (web_auth/referral.py). */
.mh-referral-stores { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; }
.mh-referral-stores img { height: 44px; width: auto; }
.mh-invite-code { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem; margin: 0.25rem 0; }
.mh-invite-code span { color: var(--mh-muted); font-size: 0.875rem; }
.mh-invite-code bdi { font-size: 1.5rem; font-weight: 800; letter-spacing: 0.12em; color: var(--mh-text); }
.mh-invite-link { word-break: break-all; }
.mh-referral-points { display: grid; gap: 0.5rem; font-size: 0.875rem; color: var(--mh-muted); padding-inline-start: 1.25rem; list-style: disc; }
.mh-referral-notice { margin: 0 auto 1rem; max-width: 32rem; padding: 0.75rem 1rem; border-radius: 1rem; font-size: 0.875rem; background: var(--mh-surface-soft); color: var(--mh-text); }
.mh-invite-field { display: flex; gap: 0.5rem; align-items: stretch; flex-wrap: wrap; }
.mh-invite-field input, .mh-invite-field textarea { flex: 1 1 14rem; min-width: 0; }
.mh-invite-message { width: 100%; min-height: 5.5rem; resize: vertical; }
.mh-invite-rules { display: grid; gap: 0.35rem; padding-inline-start: 1.25rem; list-style: disc; font-size: 0.875rem; color: var(--mh-muted); }
.mh-referral-status { min-height: 1.25rem; margin-top: 0.25rem; font-size: 0.75rem; }
.mh-referral-status.is-ok { color: var(--mh-ui-success); }
.mh-referral-status.is-warn { color: var(--mh-ui-danger); }