* { margin:0; padding:0; box-sizing:border-box; }
:root { --primary:#7c3aed; --primary-hover:#6d28d9; --bg:#0a0a1a; --bg-card:rgba(30,30,50,0.9); --border:rgba(255,255,255,0.08); --text:#fff; --text-muted:#9ca3af; }
body { font-family:'Inter',sans-serif; background:var(--bg); color:var(--text); min-height:100vh; }
a { color:#c4b5fd; text-decoration:none; }

/* Content */
.page-content { max-width:800px; margin:0 auto; padding:2rem 24px; }

/* Hero */
.orbs-hero { display:flex; align-items:center; gap:2rem; padding:2rem; background:linear-gradient(135deg, rgba(124,58,237,0.15), rgba(124,58,237,0.05)); border:1px solid rgba(124,58,237,0.2); border-radius:16px; margin-bottom:2rem; }
.orbs-icon { width:80px; height:80px; flex-shrink:0; }
.orbs-icon svg { width:100%; height:100%; }
.orbs-hero-info h2 { margin:0 0 0.25rem; font-size:1.5rem; color:#fff; }
.orbs-hero-info .balance { font-size:2.5rem; font-weight:800; color:#a78bfa; margin:0.5rem 0; }
.orbs-hero-info .rank { font-size:0.9rem; color:rgba(255,255,255,0.5); }
.orbs-hero-info .total-earned { font-size:0.85rem; color:rgba(255,255,255,0.4); margin-top:0.25rem; }
.orbs-hero-info .connect-msg { font-size:0.85rem; color:rgba(255,255,255,0.4); margin-top:0.5rem; }

/* Tabs */
.orbs-tabs { display:flex; gap:4px; margin-bottom:1.5rem; background:rgba(0,0,0,0.2); border-radius:10px; padding:4px; }
.orbs-tab { padding:0.6rem 1.2rem; background:transparent; border:none; border-radius:8px; color:rgba(255,255,255,0.5); font-size:0.85rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.2s; }
.orbs-tab:hover { color:rgba(255,255,255,0.7); }
.orbs-tab.active { background:rgba(124,58,237,0.2); color:#a78bfa; }
.orbs-panel { display:none; }
.orbs-panel.active { display:block; }

/* History Table */
.history-table { width:100%; border-collapse:collapse; }
.history-table th { text-align:left; padding:0.5rem 0.6rem; font-size:0.72rem; color:rgba(255,255,255,0.5); border-bottom:1px solid rgba(255,255,255,0.1); text-transform:uppercase; letter-spacing:0.5px; font-weight:700; }
.history-table th:last-child { text-align:right; }
.history-table td { padding:0.5rem 0.6rem; border-bottom:1px solid rgba(255,255,255,0.05); font-size:0.82rem; vertical-align:middle; }
.history-table tr:hover { background:rgba(124,58,237,0.06); }
.history-nft-cell { display:flex; align-items:center; gap:8px; }
.history-nft-img { width:32px; height:32px; border-radius:6px; object-fit:cover; background:rgba(255,255,255,0.05); flex-shrink:0; }
.history-nft-name { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:160px; color:#fff; font-weight:500; }
.history-type { font-size:0.78rem; color:rgba(255,255,255,0.6); }
.history-project { font-size:0.78rem; color:rgba(255,255,255,0.4); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
.history-price { font-size:0.82rem; color:rgba(255,255,255,0.6); display:flex; align-items:center; gap:3px; }
.history-price img { width:12px; height:12px; }
.history-orbs { display:flex; align-items:center; justify-content:flex-end; gap:4px; font-weight:700; font-size:0.88rem; }
.history-orbs.positive { color:#6cff8f; }
.history-orbs.negative { color:#ff6b6b; }
.history-orbs img { width:16px; height:16px; flex-shrink:0; }
.history-date { font-size:0.75rem; color:rgba(255,255,255,0.35); white-space:nowrap; }
@media (max-width:600px) {
.history-table th.hide-mobile, .history-table td.hide-mobile { display:none; }
.history-nft-name { max-width:100px; }
.history-project { max-width:80px; }
}

/* Leaderboard */
.leaderboard-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.leaderboard-table th { text-align:left; padding:0.6rem 0.5rem; font-size:0.75rem; color:rgba(255,255,255,0.5); border-bottom:1px solid rgba(255,255,255,0.1); }
.leaderboard-table td { padding:0.6rem 0.5rem; font-size:0.85rem; border-bottom:1px solid rgba(255,255,255,0.05); vertical-align:middle; }
.leaderboard-table tr:nth-child(-n+3) td:first-child { font-weight:700; color:#fbbf24; }
.col-rank { width:36px; text-align:center; }
.col-pfp { width:34px; padding-left:0 !important; padding-right:0 !important; }
.col-wallet { }
.col-copy { width:30px; padding-left:0 !important; padding-right:0 !important; }
.col-links { width:60px; }
.col-tx, .col-balance { width:110px; text-align:right; }
.leaderboard-table th.col-tx, .leaderboard-table th.col-balance { text-align:right; }
.leaderboard-table td.col-tx, .leaderboard-table td.col-balance { text-align:right; }
.leaderboard-table th.col-rank, .leaderboard-table td.col-rank { text-align:center; }
.lb-wallet-cell { display:flex; flex-direction:column; gap:2px; min-width:0; }
.lb-username { font-size:0.85rem; font-weight:600; color:#c4b5fd; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lb-wallet-text { cursor:pointer; transition:color 0.15s; font-size:0.8rem; color:var(--text-muted, #9ca3af); }
.lb-wallet-text:hover { color:#c4b5fd; }
.lb-wallet-muted { font-size:0.8rem; color:var(--text-muted, #9ca3af); cursor:default; }
.lb-links { display:flex; align-items:center; gap:4px; }
.lb-pfp { width:36px; height:36px; border-radius:50%; object-fit:cover; background:rgba(255,255,255,0.06); cursor:pointer; transition:transform 0.15s; display:block; }
.lb-pfp:hover { transform:scale(1.15); }
.lb-pfp-placeholder { width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.04); }
.pfp-expand-overlay { display:none; position:fixed; inset:0; z-index:10000; background:rgba(0,0,0,0.75); justify-content:center; align-items:center; cursor:pointer; }
.pfp-expand-overlay.active { display:flex; }
.pfp-expand-overlay img { width:200px; height:200px; border-radius:50%; object-fit:cover; border:3px solid rgba(255,255,255,0.15); box-shadow:0 16px 60px rgba(0,0,0,0.5); }
.btn-icon-link { background:none; border:none; color:rgba(255,255,255,0.3); cursor:pointer; padding:2px; display:flex; align-items:center; transition:color 0.15s; text-decoration:none; }
.btn-icon-link:hover { color:rgba(255,255,255,0.7); }
.btn-icon-link.copied { color:#6cff8f !important; }
@media (max-width:600px) {
.col-tx { display:none; }
.leaderboard-table th.col-tx { display:none; }
.col-balance { width:80px; }
.col-links { width:60px; }
}

/* About */
.about-section { max-width:640px; }
.about-section h3 { color:#fff; font-size:1.1rem; margin:1.5rem 0 0.75rem; }
.about-section p { color:rgba(255,255,255,0.6); font-size:0.9rem; line-height:1.6; margin:0 0 0.75rem; }
.tier-list { list-style:none; padding:0; }
.tier-list li { padding:0.5rem 0; display:flex; align-items:center; gap:10px; color:rgba(255,255,255,0.7); font-size:0.9rem; }
.tier-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.tier-dot.default { background:rgba(255,255,255,0.3); }
.tier-dot.tier1 { background:#a78bfa; }
.tier-dot.tier2 { background:#fbbf24; }

/* Referrals */
.ref-flow { display:flex; flex-direction:column; gap:12px; margin:1rem 0 1.5rem; }
.ref-step { display:flex; align-items:flex-start; gap:12px; padding:12px 16px; background:rgba(0,0,0,0.2); border:1px solid rgba(255,255,255,0.06); border-radius:10px; }
.ref-step-num { width:28px; height:28px; border-radius:50%; background:rgba(124,58,237,0.2); color:#a78bfa; font-weight:700; font-size:0.8rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ref-step-text { flex:1; }
.ref-step-text strong { color:#fff; font-size:0.9rem; display:block; margin-bottom:2px; }
.ref-step-text span { color:rgba(255,255,255,0.5); font-size:0.8rem; line-height:1.5; }
.ref-rates { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0.75rem 0 1.5rem; }
.ref-rate-card { padding:12px 14px; background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.15); border-radius:10px; }
.ref-rate-card .rate-label { font-size:0.75rem; color:rgba(255,255,255,0.5); margin-bottom:4px; }
.ref-rate-card .rate-value { font-size:1.1rem; font-weight:700; color:#a78bfa; }
@media (max-width:500px) { .ref-rates { grid-template-columns:1fr; } }

/* Admin */
#panel-leaderboard { padding:1.5rem; background:rgba(124,58,237,0.06); border:1px solid rgba(124,58,237,0.2); border-radius:14px; }

.lb-controls { display:flex; gap:8px; margin-bottom:1rem; align-items:center; }
.lb-search-wrap { flex:1; position:relative; }
.lb-search-wrap input { width:100%; padding:8px 12px 8px 34px; background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.1); border-radius:8px; color:#fff; font-size:0.82rem; font-family:inherit; outline:none; }
.lb-search-wrap input:focus { border-color:rgba(124,58,237,0.5); }
.lb-search-wrap input::placeholder { color:rgba(255,255,255,0.3); }
.lb-search-wrap svg { position:absolute; left:10px; top:50%; transform:translateY(-50%); opacity:0.3; pointer-events:none; }
.lb-btn { padding:8px 14px; background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3); border-radius:8px; color:#a78bfa; font-weight:600; font-size:0.8rem; cursor:pointer; font-family:inherit; white-space:nowrap; transition:all 0.15s; display:flex; align-items:center; gap:6px; }
.lb-btn:hover { background:rgba(124,58,237,0.3); }
.lb-btn:disabled { opacity:0.4; cursor:not-allowed; }
.lb-btn svg { flex-shrink:0; }
.lb-pagination { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,0.06); }
.lb-pagination button { padding:6px 12px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:6px; color:rgba(255,255,255,0.6); font-size:0.8rem; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.lb-pagination button:hover:not(:disabled) { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); color:#a78bfa; }
.lb-pagination button:disabled { opacity:0.3; cursor:not-allowed; }
.lb-pagination .lb-page-info { font-size:0.78rem; color:rgba(255,255,255,0.4); min-width:80px; text-align:center; }
.lb-highlight { animation:lbHighlight 2s ease-out; }
@keyframes lbHighlight { 0% { background:rgba(124,58,237,0.3); } 100% { background:transparent; } }
.lb-search-result { background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.2); border-radius:8px; padding:10px 14px; margin-bottom:12px; display:none; font-size:0.82rem; color:var(--text-muted); }
.lb-search-result .lb-sr-close { background:none; border:none; color:rgba(255,255,255,0.4); cursor:pointer; float:right; font-size:1rem; line-height:1; }

.empty-state-text { text-align:center; padding:2rem; color:rgba(255,255,255,0.4); font-size:0.9rem; }
.btn-load-more { display:block; margin:1rem auto 0; padding:0.5rem 1.5rem; background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3); border-radius:8px; color:#a78bfa; font-weight:600; cursor:pointer; font-family:inherit; }
.btn-load-more:hover { background:rgba(124,58,237,0.3); }

@media (max-width: 600px) {
.orbs-hero { flex-direction:column; text-align:center; gap:1rem; padding:1.5rem; }
.orbs-hero-info .balance { font-size:2rem; }
.orbs-tabs { flex-wrap:wrap; }
.orbs-tab { padding:0.5rem 0.8rem; font-size:0.78rem; flex:1; text-align:center; white-space:nowrap; }

/* Leaderboard mobile */
.lb-controls { flex-wrap:wrap; }
.lb-search-wrap { min-width:0; flex:1 1 180px; }
.lb-btn { padding:7px 10px; font-size:0.75rem; }
.leaderboard-table th, .leaderboard-table td { padding:0.45rem 0.4rem; font-size:0.75rem; }
.leaderboard-table th:nth-child(4), .leaderboard-table td:nth-child(4) { display:none; }
.leaderboard-table th:first-child, .leaderboard-table td:first-child { width:24px; text-align:center; padding-right:2px; }
.wallet-cell { gap:3px; }
.wallet-cell span { font-size:0.72rem; }
.btn-copy-wallet { padding:1px; }
.btn-copy-wallet svg { width:11px; height:11px; }
.btn-orb-link img { width:12px; height:12px; }
.leaderboard-table th:nth-child(3), .leaderboard-table td:nth-child(3),
.leaderboard-table th:nth-child(5), .leaderboard-table td:nth-child(5) { text-align:right; }
#panel-leaderboard { padding:1rem; overflow-x:auto; }
}