.ref-hero{background:linear-gradient(135deg,#c8ff3d2e,#0b0b0ed9),var(--bg-1);border:1px solid rgba(200,255,61,.3);border-radius:var(--r-lg);padding:28px 24px;margin-bottom:var(--s-6);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:24px}.ref-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 10%,rgba(200,255,61,.18),transparent 45%),radial-gradient(circle at 5% 90%,rgba(183,101,242,.18),transparent 45%);pointer-events:none}.ref-hero>*{position:relative;z-index:1}.ref-hero-main{display:flex;flex-direction:column;gap:14px;min-width:0}.ref-hero .section-eyebrow{font-family:var(--ui);font-size:11px;letter-spacing:2.5px;color:var(--green);text-transform:uppercase;display:block}.ref-hero h1{font-family:var(--display);font-size:clamp(30px,4vw,46px);letter-spacing:1px;margin:0;text-transform:uppercase;line-height:1.05}.ref-hero h1 .accent{color:var(--green)}.ref-hero p{color:var(--muted);margin:0;max-width:60ch;font-size:15px;line-height:1.55}.ref-hero-aside{background:#0b0b0e8c;border:1px solid rgba(200,255,61,.25);border-radius:var(--r-md);padding:22px 20px;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}.ref-code-label{font-family:var(--ui);font-size:11px;letter-spacing:2.5px;color:var(--muted);text-transform:uppercase}.ref-code-value{font-family:var(--mono);font-size:clamp(26px,3.5vw,38px);font-weight:700;letter-spacing:.16em;color:var(--text);word-break:break-all;line-height:1.1}.ref-code-pending{font-family:var(--body);font-size:13px;letter-spacing:0;color:var(--muted);font-weight:400}.ref-code-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.ref-share{display:flex;gap:10px;flex-wrap:wrap}.ref-share-btn{background:var(--bg-2);border:1px solid var(--line);color:var(--text);padding:10px 16px;border-radius:999px;font-family:var(--ui);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;cursor:pointer;transition:border-color var(--t-fast),color var(--t-fast);text-decoration:none}.ref-share-btn:hover{border-color:var(--green);color:var(--green)}.ref-share-btn:disabled,.ref-share-btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}.ref-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);margin-bottom:var(--s-8)}.ref-stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px}.ref-stat .lab{font-family:var(--ui);font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase;display:block;margin-bottom:8px}.ref-stat .val{font-family:var(--display);font-size:32px;color:var(--text);letter-spacing:.5px;line-height:1;display:block}.ref-stat.is-green .val{color:var(--green)}.ref-stat.is-purple .val{color:var(--purple-soft)}.ref-stat .val.ref-stat-val-token{display:inline-flex;align-items:center;gap:6px}.ref-fun-amount{white-space:nowrap}.ref-fun-num{color:var(--text)}.ref-how{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4);margin-bottom:var(--s-8)}.ref-step{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:24px 24px 22px;position:relative}.ref-step-num{font-family:var(--display);font-size:14px;color:var(--bg);background:var(--green);width:32px;height:32px;display:grid;place-items:center;border-radius:50%;letter-spacing:0;margin-bottom:14px}.ref-step h3{font-family:var(--display);font-size:22px;letter-spacing:1px;margin:0 0 8px;text-transform:uppercase}.ref-step p{color:var(--muted);font-size:13px;line-height:1.55;margin:0}.ref-ach-progress{font-family:var(--mono);font-size:12px;color:var(--muted);flex-shrink:0}.ref-ach-grid{margin-bottom:var(--s-8)}.ref-qr-body{display:flex;flex-direction:column;align-items:center;gap:14px}.ref-qr-img{width:240px;height:240px;border-radius:var(--r-md);background:#fff;padding:12px;display:block}.ref-qr-skeleton{width:240px;height:240px;border-radius:var(--r-md);background:var(--bg-2);border:1px solid var(--line)}.ref-qr-code{font-family:var(--mono);font-size:18px;font-weight:700;letter-spacing:.16em;color:var(--text)}.ref-friend-list{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}.ref-friend-row{display:grid;grid-template-columns:36px 1fr auto auto auto;gap:var(--s-4);padding:14px 22px;border-bottom:1px solid var(--line);align-items:center;font-size:13px}.ref-friend-row:last-child{border-bottom:0}.ref-friend-row.is-head{background:var(--bg-2);font-family:var(--ui);font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase}.ref-friend-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--purple-deep));display:grid;place-items:center;font-family:var(--display);color:#fff;font-size:14px}.ref-friend-avatar.is-green{background:linear-gradient(135deg,var(--green),var(--green-deep));color:var(--bg)}.ref-friend-avatar.is-warning{background:linear-gradient(135deg,var(--warning),#cc8800);color:var(--bg)}.ref-friend-name{font-family:var(--ui);font-size:13px;letter-spacing:1px;color:var(--text);text-transform:uppercase}.ref-friend-meta{font-size:12px;color:var(--muted);margin-top:2px}.ref-friend-status{font-family:var(--ui);font-size:10px;letter-spacing:1.5px;padding:4px 10px;border-radius:4px;background:var(--bg-3);color:var(--muted);text-transform:uppercase}.ref-friend-status.is-active{background:#c8ff3d1a;color:var(--green)}.ref-friend-status.is-pending{background:#ffb8381a;color:var(--warning)}.ref-friend-payout{font-family:var(--mono);font-size:13px;color:var(--text);display:inline-flex;align-items:center;gap:4px;justify-content:flex-end}.ref-friend-payout.is-muted{color:var(--muted)}.ref-friend-when{font-family:var(--mono);font-size:11px;color:var(--muted-2);text-align:right}@media(max-width:640px){.ref-stats{grid-template-columns:1fr}}@media(max-width:1024px){.ref-how{grid-template-columns:1fr}.ref-friend-row{grid-template-columns:32px 1fr auto;padding:12px 16px;gap:10px}.ref-friend-row .ref-friend-payout,.ref-friend-row .ref-friend-when,.ref-friend-row.is-head{display:none}}@media(min-width:1025px){.ref-hero{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:40px;padding:36px 40px}.ref-hero-aside{min-width:280px;max-width:340px}}.ref-empty{background:var(--card);border:1px dashed var(--line-2);border-radius:var(--r-lg);padding:40px 24px;text-align:center;color:var(--muted);font-size:13px}.ref-apply-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;margin-bottom:var(--s-6)}.ref-apply-card .ref-apply-eyebrow{font-family:var(--ui);font-size:11px;letter-spacing:2.5px;color:var(--muted);text-transform:uppercase;margin-bottom:6px;display:block}.ref-apply-card h3{font-family:var(--display);font-size:22px;letter-spacing:1px;margin:0 0 8px;text-transform:uppercase}.ref-apply-card p{color:var(--muted);font-size:13px;margin:0 0 14px;line-height:1.5}.ref-apply-form{display:flex;gap:8px;flex-wrap:wrap}.ref-apply-form input{flex:1;min-width:200px;background:var(--bg-2);border:1px solid var(--line-2);border-radius:999px;padding:10px 18px;color:var(--text);font-family:var(--mono);font-size:14px;letter-spacing:1px;text-transform:uppercase;outline:0;transition:border-color var(--t-fast)}.ref-apply-form input:focus{border-color:var(--green)}.ref-apply-msg{margin-top:10px;font-size:12px;font-family:var(--mono)}.ref-apply-msg.is-success{color:var(--green)}.ref-apply-msg.is-error{color:var(--danger)}.ref-referred-by{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 18px;margin-bottom:var(--s-5);display:flex;align-items:center;gap:12px}.ref-referred-by .lab{font-family:var(--ui);font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase}.ref-referred-by .name{font-family:var(--ui);font-size:14px;letter-spacing:1px;color:var(--text);text-transform:uppercase}.ref-referred-by .badge{font-family:var(--ui);font-size:10px;letter-spacing:1.5px;padding:4px 10px;border-radius:4px;text-transform:uppercase;margin-left:auto;background:#ffb8381a;color:var(--warning)}.ref-referred-by .badge.is-completed{background:#c8ff3d1a;color:var(--green)}
