/* AL AMAL — Referrals v2.2 (uses --dx-* tokens + ax-* helpers) */
.account-app:has(.rx-page) .account-heading{display:none}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rx-page{display:flex;flex-direction:column;gap:20px;color:var(--dx-text);min-width:0}
.rx-page h1,.rx-page h2{font-family:"Alexandria","IBM Plex Sans Arabic",sans-serif;margin:0}
.rx-page h2{font-size:20px}
.rx-mono{font-family:var(--dx-mono);font-variant-numeric:tabular-nums}
.ax-warn-t{color:var(--dx-warn)!important}
.rx-card{background:var(--dx-s1);border:1px solid var(--dx-line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:16px;min-width:0}
.rx-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.rx-head small{display:block;margin-top:4px;font-size:13px}
.rx-sub{font-size:14px;color:var(--dx-muted)}.rx-sub b{color:var(--dx-text)}
.rx-note{font-size:12px;line-height:1.8}
.rx-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px}

/* hero */
.rx-hero{border-radius:24px;padding:28px;background:radial-gradient(120% 140% at 100% 0%,color-mix(in srgb,var(--dx-acc) 13%,transparent),transparent 55%),var(--dx-s1);border:1px solid color-mix(in srgb,var(--dx-acc) 22%,transparent);display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:28px;align-items:center}
.rx-hero-copy{display:flex;flex-direction:column;gap:16px;min-width:0}
.rx-pill{align-self:flex-start;font-size:13px;font-weight:600;color:color-mix(in srgb,var(--dx-acc) 80%,#fff);background:color-mix(in srgb,var(--dx-acc) 11%,transparent);padding:5px 12px;border-radius:99px}
.rx-hero h1{font-size:clamp(24px,2.6vw,34px);line-height:1.4}
.rx-hero p{margin:0;color:var(--dx-muted);line-height:1.8;max-width:56ch}
.rx-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:480px}
.rx-mini>div{background:var(--dx-bg);border:1px solid var(--dx-line);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.rx-mini small{color:var(--dx-muted);font-size:13px}
.rx-mini b{font-size:26px;font-family:"Alexandria","IBM Plex Sans Arabic",sans-serif;display:flex;align-items:center;gap:8px}
.rx-mini b.rx-mono{font-family:var(--dx-mono)}
.rx-mini b i{font-style:normal}
.rx-mini span{color:var(--dx-dim);font-size:12px}
.rx-share{background:var(--dx-bg);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0}
.rx-share-top{display:flex;gap:16px;align-items:center}
.rx-fields{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.rx-fields>small,.rx-label{color:var(--dx-muted);font-size:13px}
.rx-field{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 8px 8px 12px;border-radius:12px;background:var(--dx-s1);min-width:0}
[dir=rtl] .rx-field{padding:8px 12px 8px 8px}
.rx-code{font-size:19px;color:var(--dx-acc);overflow-wrap:anywhere}
.rx-link{font-size:13px;color:#C3CAD2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.rx-icon{appearance:none;border:0;width:40px;height:40px;border-radius:10px;background:var(--dx-s2);color:var(--dx-text);display:grid;place-items:center;cursor:pointer;flex:none}
.rx-qr{width:120px;height:120px;border-radius:14px;background:#fff;padding:6px;box-sizing:border-box;flex:none}
.rx-qr img{width:100%;height:100%;display:block;image-rendering:pixelated}
.rx-shares{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.rx-sharebtn{height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:var(--dx-s1);color:var(--dx-text)!important;font-weight:600;font-size:13px;display:grid;place-items:center;text-decoration:none}
.rx-sharebtn:hover{border-color:color-mix(in srgb,var(--dx-acc) 40%,transparent)}
.rx-share-actions{display:flex;gap:8px;flex-wrap:wrap}.rx-share-actions .ax-btn{flex:1 1 160px}

/* stats */
.rx-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.rx-stat{background:var(--dx-s1);border:1px solid var(--dx-line);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.rx-stat small{color:var(--dx-muted);font-size:13px}.rx-stat b{font-size:24px}.rx-stat span{color:var(--dx-dim);font-size:12px}

/* how */
.rx-how{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.rx-how>div{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:14px;background:var(--dx-bg)}
.rx-how i{font-style:normal;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--dx-acc) 13%,transparent);color:var(--dx-acc);display:grid;place-items:center;font-weight:700;flex:none}
.rx-how span{display:flex;flex-direction:column;gap:4px}.rx-how small{color:var(--dx-muted);font-size:13px;line-height:1.7}

/* tiers */
.rx-bar{height:8px;border-radius:8px;background:var(--dx-s2);overflow:hidden}
.rx-bar i{display:block;height:100%;background:var(--dx-acc);border-radius:8px}
.rx-tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.rx-tier{border-radius:16px;padding:16px 12px;display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center;background:var(--dx-bg);border:1px solid var(--dx-line)}
.rx-tier.on{background:color-mix(in srgb,var(--dx-acc) 8%,transparent);border:1.5px solid var(--dx-acc)}
.rx-tier>i{font-style:normal;font-size:22px}.rx-tier>b.rx-mono{font-size:22px}.rx-tier small{color:var(--dx-muted);font-size:12px}
.rx-tier em{font-style:normal;font-size:11px;font-weight:700;padding:3px 10px;border-radius:99px;background:var(--dx-acc);color:var(--dx-ink)}

/* tree & leader */
.rx-tree{display:flex;flex-direction:column;align-items:center;gap:14px;padding:6px 0}
.rx-you{width:54px;height:54px;border-radius:50%;background:var(--dx-acc);color:var(--dx-ink);display:grid;place-items:center;font-weight:700;font-family:"Alexandria",sans-serif}
.rx-layer{display:flex;flex-direction:column;align-items:center;gap:6px}
.rx-layer>div{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.rx-layer small{color:var(--dx-muted);font-size:12px}.rx-layer b{color:var(--dx-text)}
.rx-node{border-radius:50%;border:2px dashed #3A424C;box-sizing:border-box;display:block}
.rx-node.s1{width:40px;height:40px}.rx-node.s2{width:32px;height:32px}.rx-node.s3{width:24px;height:24px}
.rx-node.on{border:0;background:var(--dx-acc);box-shadow:0 0 0 4px color-mix(in srgb,var(--dx-acc) 15%,transparent)}
.rx-leader{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;background:var(--dx-bg)}
.rx-leader>span:first-child{width:48px;height:48px;border-radius:14px;background:var(--dx-s2);color:var(--dx-acc);display:grid;place-items:center;font-size:22px;flex:none}
.rx-leader>span:last-child{display:flex;flex-direction:column;gap:2px}.rx-leader b{font-family:"Alexandria",sans-serif;font-size:17px}.rx-leader small{color:var(--dx-muted);font-size:13px}
.rx-row{display:flex;justify-content:space-between;gap:10px;font-size:14px}

/* friends */
.rx-friend{display:flex;align-items:center;gap:10px}
.rx-friend>i{font-style:normal;width:34px;height:34px;border-radius:50%;background:var(--dx-s2);display:grid;place-items:center;font-weight:700;flex:none}
.rx-friend>span{display:flex;flex-direction:column}.rx-friend small{color:var(--dx-dim);font-size:12px}
.rx-steps{display:flex;gap:6px;flex-wrap:wrap}
.rx-step{font-style:normal;font-size:11px;padding:3px 8px;border-radius:99px;background:var(--dx-s2);color:var(--dx-dim)}
.rx-step.on{background:color-mix(in srgb,var(--dx-acc) 13%,transparent);color:color-mix(in srgb,var(--dx-acc) 80%,#fff)}

/* team room & faq */
.rx-chat{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;background:var(--dx-bg);max-height:280px;overflow-y:auto;min-height:100px}
.rx-msg{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:10px;background:var(--dx-s1)}
.rx-msg b{font-size:13px;color:color-mix(in srgb,var(--dx-acc) 80%,#fff)}.rx-msg span{font-size:14px;overflow-wrap:anywhere}.rx-msg small{color:var(--dx-dim);font-size:11px}
.rx-chat-empty{margin:auto;color:var(--dx-dim);font-size:14px;text-align:center}
.rx-send{display:flex;gap:8px}.rx-send .input{flex:1;min-width:0}
.rx-faq{border-top:1px solid var(--dx-line)}
.rx-faq summary{cursor:pointer;list-style:none;padding:13px 0;font-size:14px;font-weight:500;color:#C3CAD2;display:flex;justify-content:space-between;gap:10px}
.rx-faq summary::-webkit-details-marker{display:none}
.rx-faq summary::after{content:"+";color:var(--dx-dim)}.rx-faq[open] summary::after{content:"−"}
.rx-faq p{margin:0 0 14px;color:var(--dx-muted);font-size:13px;line-height:1.8}

@media (max-width:700px){
 .rx-hero{padding:18px;gap:18px}
 .rx-share{padding:16px}
 .rx-share-top{flex-direction:column-reverse;align-items:stretch}.rx-qr{align-self:center}
 .rx-shares{grid-template-columns:repeat(2,minmax(0,1fr))}
 .rx-card{padding:16px}
 .rx-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.rx-stat{padding:12px}.rx-stat b{font-size:20px}
 .rx-tiers{display:flex;overflow-x:auto;scrollbar-width:none}.rx-tiers::-webkit-scrollbar{display:none}.rx-tier{flex:0 0 112px}
}