/* TPR — members area: referral list, referrals page, wallet picker, Upcoming modal,
   logout, join-without-referral. Loaded after dash.css by dashboard.html and
   referrals.html. Kept separate so referrals.html renders with any dash.css. */

/* connect card: referral state under the connect button */
.referred-note{margin-top:16px;text-align:center;font-size:.78rem;color:#6ee7b7;}
.referred-note i{margin-right:6px;}
.referred-note[hidden]{display:none;}
.join-no-ref{display:block;width:100%;margin-top:14px;padding:10px;border:0;background:none;cursor:pointer;
  font:500 .82rem/1.3 var(--f-body);color:var(--muted);text-decoration:underline;text-underline-offset:3px;transition:color .25s;}
.join-no-ref:hover{color:var(--white);}
.join-no-ref[hidden]{display:none;}

/* dashboard head: wallet chip + logout */
.dash-head-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
.dash-head-actions .btn{padding:.72rem 1.1rem;font-size:.85rem;}

/* the Total Referrals stat box opens referrals.html */
.stat-link{display:block;color:inherit;text-decoration:none;cursor:pointer;}
.stat-link:hover{border-color:rgba(0,240,255,.45);}
.stat-link:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}
.st-go{display:inline-flex;align-items:center;gap:5px;margin-left:6px;font-weight:600;color:var(--cyan);white-space:nowrap;
  opacity:.75;transition:opacity .25s,gap .25s;}
.st-go i{font-size:.8em;}
.stat-link:hover .st-go{opacity:1;gap:8px;}

/* referral link + referral list side by side on wide screens */
@media (min-width:1000px){ .dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;} }

.rl-head{margin-bottom:0;}
.rl-all{padding:.62rem 1rem;font-size:.82rem;}

/* referral list rows (dashboard preview and referrals.html) */
.referral-list-empty{margin-top:16px;color:var(--muted);font-size:.85rem;}
.referral-list-empty[hidden]{display:none;}
.referral-list{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.referral-list[hidden]{display:none;}
.referral-list li{display:grid;grid-template-columns:30px minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:13px 16px;border-radius:14px;
  border:1px solid rgba(0,240,255,.12);background:rgba(5,7,22,.6);transition:border-color .25s,background .25s;}
.referral-list li:hover{border-color:rgba(0,240,255,.4);background:rgba(5,7,22,.88);}
.referral-list .rl-num{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  font:700 .74rem/1 var(--f-display);color:var(--cyan);background:rgba(0,240,255,.1);border:1px solid rgba(0,240,255,.3);}
.referral-list .rl-addr{display:flex;align-items:center;gap:10px;min-width:0;font:600 .88rem/1.3 var(--f-mono);color:var(--white);}
.referral-list .rl-addr i{flex:none;color:var(--cyan);}
.referral-list .rl-addr-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.referral-list .rl-copy,.rl-icon{appearance:none;flex:none;display:grid;place-items:center;width:32px;height:32px;padding:0;border-radius:9px;
  border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--muted);cursor:pointer;
  transition:border-color .25s,background .25s,color .25s;}
.referral-list .rl-copy:hover,.rl-icon:hover{border-color:rgba(0,240,255,.55);background:rgba(0,240,255,.1);color:var(--white);}
.referral-list .rl-date{font-size:.74rem;color:var(--muted);white-space:nowrap;padding-left:14px;border-left:1px solid var(--line-2);}
.referral-list li.rl-more{display:block;padding:0;border:0;background:none;text-align:center;}
.referral-list li.rl-more a{display:block;padding:11px;border-radius:14px;border:1px dashed rgba(0,240,255,.25);font-size:.84rem;color:var(--cyan);
  transition:background .25s,border-color .25s;}
.referral-list li.rl-more a:hover{background:rgba(0,240,255,.06);border-color:rgba(0,240,255,.5);}

/* activation-rule notice */
.notice-card{display:flex;align-items:flex-start;gap:14px;padding:clamp(18px,2.4vw,24px);margin-bottom:14px;
  border-color:rgba(251,191,36,.3);background:linear-gradient(160deg,rgba(251,191,36,.08),rgba(251,191,36,.02)),rgba(9,13,38,.88);}
.notice-card>i{flex:none;margin-top:3px;font-size:1.1rem;color:#fbbf24;}
.notice-card h4{font-size:.98rem;font-weight:700;color:var(--white);margin-bottom:6px;}
.notice-card p{font-size:.87rem;line-height:1.55;color:var(--text);}
.notice-card p b{color:#fbbf24;font-weight:700;}

/* wallet list (Connect): installed wallets, MetaMask / Trust / SafePal / Binance, WalletConnect */
.wallet-pick-card{width:min(100%,440px);padding-top:56px;}
.wallet-pick-hint{margin:0 0 4px;font-size:.84rem;}
.wallet-pick-list{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
.wallet-pick-opt:disabled{opacity:.5;cursor:not-allowed;transform:none;}
.wp-ic{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:10px;background:#fff;color:#1a1240;font-size:1rem;}
.wp-ic img{width:26px;height:26px;border-radius:6px;object-fit:contain;}
.wallet-pick-opt .wp-ic img{width:26px;height:26px;}
.wp-name{flex:1;min-width:0;}
.wp-tag{flex:none;font:700 .62rem/1 var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:#7dd3fc;}
.wp-tag.is-installed{color:#6ee7b7;}
.wp-arrow{flex:none;font-size:.78rem;color:var(--muted);}
.wallet-pick-status{min-height:1.2em;margin:14px 2px 0;font-size:.76rem;text-align:center;color:var(--muted);}
.wallet-pick-status.err{color:#fca5a5;}
.wallet-pick-opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:14px 16px;border-radius:16px;cursor:pointer;
  border:1.5px solid rgba(0,240,255,.16);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));color:var(--text);
  font:600 .98rem/1.3 var(--f-body);transition:border-color .25s,background .25s,transform .25s var(--ease),color .25s;}
.wallet-pick-opt img{width:30px;height:30px;border-radius:8px;flex:none;}
.wallet-pick-opt:hover{border-color:rgba(0,240,255,.7);color:var(--white);transform:translateY(-2px);
  background:linear-gradient(160deg,rgba(0,240,255,.12),rgba(217,70,239,.08));}

/* Upcoming modal */
.upcoming-card{width:min(100%,480px);padding-top:56px;}
.upcoming-card .quiz-q{margin-bottom:10px;}

/* follow-our-socials step before the first reward box (dashboard.html) */
/* above the surprise-box overlay (.gift-overlay, z-index 260): it opens from its Collect button */
#socialOverlay{z-index:300;}
/* Nothing animates under or around it: phone browsers (Samsung Internet, wallet apps)
   flickered and blanked parts of the card while the 3D box, its spinning rays and the
   card's own spinning border all redrew together. The card keeps a still border, and
   the surprise-box overlay underneath is paused and hidden (html.gift-paused). */
#socialOverlay .social-card{animation:modal-in .4s var(--ease) both;transform:translateZ(0);
  background:linear-gradient(165deg,rgba(26,18,74,.99),rgba(9,7,32,.99) 55%,rgba(22,10,50,.99)) padding-box,
    linear-gradient(135deg,#22d3ee,#8b5cf6 50%,#ec4899) border-box;}
html.gift-paused .gift-overlay{visibility:hidden;}
html.gift-paused .gift-overlay *{animation-play-state:paused !important;}
.social-card{width:min(100%,520px);padding-top:56px;}
.social-card .quiz-q{margin-bottom:8px;}
.social-list{display:grid;gap:10px;margin:20px 0 18px;padding:0;list-style:none;}
.social-item{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 12px;border-radius:14px;
  border:1px solid rgba(170,160,255,.16);background:rgba(255,255,255,.035);transition:border-color .3s,background .3s;}
.social-ico{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;font-size:1.2rem;color:#fff;}
.social-item[data-s="instagram"] .social-ico{background:linear-gradient(135deg,#feda75,#fa7e1e 30%,#d62976 60%,#962fbf);}
.social-item[data-s="x"] .social-ico{background:#0f1419;border:1px solid rgba(255,255,255,.25);}
.social-item[data-s="youtube"] .social-ico{background:#ff0000;}
.social-item[data-s="telegram"] .social-ico{background:#229ed9;}
.social-name{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0;}
.social-name b{font:700 .95rem/1.1 var(--f-display);color:var(--white,#fff);}
.social-name small{font-size:.76rem;color:var(--muted);}
.social-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:92px;height:36px;padding:0 14px;border-radius:10px;
  font:700 .82rem/1 var(--f-display);color:#050716;background:linear-gradient(100deg,#fde68a,#fbbf24 60%,#f59e0b);
  text-decoration:none;transition:transform .2s,filter .2s;}
.social-btn:hover{transform:translateY(-1px);filter:brightness(1.08);}
.social-item.is-checking .social-btn{pointer-events:none;opacity:.75;}
.social-item.is-done{border-color:rgba(52,211,153,.4);background:rgba(52,211,153,.07);}
.social-item.is-done .social-name small{color:#6ee7b7;font-weight:600;}
.social-state{flex:none;width:92px;text-align:center;font-size:1.35rem;color:#34d399;}
.social-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.social-count{font-size:.78rem;color:var(--muted);}
.social-foot .btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4);}
@media (max-width:480px){
  /* compact on phones: the four links, the count and the button fit on one screen */
  #socialOverlay{padding:12px;}
  .social-card{padding:48px 18px 18px;max-height:calc(100svh - 24px);}
  .social-card .quiz-q{font-size:1.25rem;line-height:1.2;}
  .social-card .hint{font-size:.84rem;line-height:1.45;}
  .social-list{gap:8px;margin:14px 0 12px;}
  .social-item{padding:8px 8px 8px 10px;}
  .social-ico{width:36px;height:36px;font-size:1.05rem;}
  .social-btn{height:34px;}
  .social-foot .btn{width:100%;justify-content:center;}
  .social-btn,.social-state{min-width:80px;width:auto;}
}
.modal-close{appearance:none;position:absolute;top:16px;right:16px;z-index:2;width:36px;height:36px;padding:0;border-radius:50%;
  border:1px solid rgba(0,240,255,.22);background:rgba(9,13,38,.8);color:var(--white);font-size:1.3rem;line-height:1;cursor:pointer;
  transition:border-color .25s,background .25s;}
.modal-close:hover{border-color:rgba(0,240,255,.7);background:rgba(0,240,255,.1);}

/* ---------------------------------------------------------------- referrals.html */

.rp-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:24px;}
.rp-head h1{font-size:clamp(2rem,4.2vw,3.2rem);line-height:1;letter-spacing:-.035em;}
.rp-head .hint{max-width:52ch;}
.rp-back{margin-bottom:14px;padding:.55rem .95rem;font-size:.8rem;}
.rp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.rp-stat{padding:18px 20px;}
.rp-stat .lab{font-size:.64rem;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);}
.rp-stat b{display:block;margin-top:10px;font:700 clamp(1.5rem,2.4vw,2rem)/1.1 var(--f-display);color:var(--white);font-variant-numeric:tabular-nums;}
.rp-stat small{display:block;margin-top:6px;font-size:.78rem;color:var(--muted);}
.rp-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
.rp-search{position:relative;flex:1 1 260px;min-width:0;}
.rp-search i{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.85rem;pointer-events:none;}
.rp-search input,.rp-sort{height:46px;border-radius:13px;border:1px solid rgba(0,240,255,.2);background:rgba(5,7,22,.75);color:var(--white);
  font:500 .86rem/1 var(--f-body);outline:0;transition:border-color .3s,box-shadow .3s;}
.rp-search input{width:100%;padding:0 14px 0 40px;}
.rp-sort{padding:0 12px;cursor:pointer;}
.rp-sort option{background:#0d1232;}
.rp-search input:focus,.rp-sort:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(0,240,255,.14);}
.rp-toolbar .btn{height:46px;padding:0 1rem;font-size:.84rem;}
.rp-count{margin-top:16px;font-size:.78rem;color:var(--muted);}
.rp-page .referral-list li{grid-template-columns:34px minmax(0,1fr) auto auto;}
.dash-addr[hidden]{display:none;}
.rp-page .rl-full{display:block;overflow:hidden;text-overflow:ellipsis;}
.rp-empty a,.referral-list-empty a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px;}
.rl-sub{display:block;margin-top:3px;font:500 .72rem/1.3 var(--f-body);color:var(--muted);white-space:normal;}
.rl-team{font-size:.74rem;color:var(--text);white-space:nowrap;}
.rl-team b{color:var(--cyan);}
.rl-actions{display:flex;gap:6px;}
.rp-more{display:flex;justify-content:center;margin-top:16px;}
.rp-more[hidden]{display:none;}
.rp-state{display:flex;flex-direction:column;align-items:center;gap:14px;padding:clamp(32px,6vw,64px) 16px;text-align:center;}
.rp-state[hidden]{display:none;}
.rp-state>i{font-size:2rem;color:var(--cyan);filter:drop-shadow(0 0 12px rgba(0,240,255,.5));}
.rp-state h3{font-size:1.25rem;}
.rp-state p{max-width:46ch;color:var(--muted);font-size:.9rem;}
.rl-skel li{height:58px;border-color:rgba(0,240,255,.06);
  background:linear-gradient(90deg,rgba(255,255,255,.02),rgba(0,240,255,.06),rgba(255,255,255,.02)) 0 0/200% 100%;animation:rl-shimmer 1.3s linear infinite;}
@keyframes rl-shimmer{to{background-position:-200% 0;}}

@media (max-width:900px){
  .rp-stats{gap:10px;}
  .rp-stat{padding:14px;}
}
@media (max-width:600px){
  .dash-head-actions{width:100%;}
  .dash-head-actions .dash-addr{flex:1;justify-content:center;}
  .st-go{display:flex;margin:6px 0 0;}
  .referral-list li{grid-template-columns:26px minmax(0,1fr) auto;gap:10px;padding:12px;}
  .referral-list .rl-date{grid-column:2 / -1;padding-left:0;border-left:0;margin-top:-4px;}
  .rp-stats{grid-template-columns:1fr 1fr;}
  .rp-stats .rp-stat:last-child{grid-column:1 / -1;}
  .rp-page .referral-list li{grid-template-columns:26px minmax(0,1fr) auto;}
  .rp-page .rl-actions{grid-column:3;grid-row:1;}
  .rp-page .rl-team{grid-column:2 / -1;grid-row:2;margin-top:-4px;}
  .rp-toolbar .btn,.rp-sort{flex:1 1 auto;}
}
@media (prefers-reduced-motion:reduce){ .rl-skel li{animation:none;} }

/* ---- news from the admin panel (dashboard.html): strip on top + popup ---- */
.news-strip{display:flex;align-items:center;gap:12px;margin:0 0 18px;padding:12px 16px;border-radius:14px;
  border:1px solid rgba(251,191,36,.35);background:linear-gradient(100deg,rgba(251,191,36,.14),rgba(139,92,246,.10));}
.news-strip[hidden]{display:none;}
.ns-ico{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:rgba(251,191,36,.2);color:#fbbf24;}
.ns-text{flex:1;min-width:0;margin:0;font:600 .92rem/1.45 var(--f-body);color:var(--white,#fff);white-space:pre-line;}
.ns-link{flex:none;font:700 .8rem/1 var(--f-display);color:#050716;background:linear-gradient(100deg,#fde68a,#fbbf24);
  padding:9px 14px;border-radius:10px;text-decoration:none;}
.ns-link[hidden]{display:none;}
@media (max-width:600px){ .news-strip{flex-wrap:wrap;} .ns-link{width:100%;text-align:center;} }
#newsOverlay{z-index:320;}
.news-card{width:min(100%,520px);padding-top:56px;}
.news-msg{margin:10px 0 0;color:var(--text);font-size:.95rem;line-height:1.65;white-space:pre-line;}
.news-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}
.news-actions .btn[hidden]{display:none;}

/* ---- reward review on each collected box: waiting / approved / rejected ---- */
.rk-collected.rk-waiting{color:#fbbf24;background:linear-gradient(100deg,rgba(251,191,36,.16),rgba(251,191,36,.05));
  border-color:rgba(251,191,36,.35);box-shadow:none;}
.rk-collected.rk-rejected{color:#fca5a5;background:linear-gradient(100deg,rgba(239,68,68,.18),rgba(239,68,68,.05));
  border-color:rgba(239,68,68,.4);box-shadow:none;}
.rk-note.rk-reason{color:#fca5a5;}