* { margin:0; padding:0; box-sizing:border-box; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
:root {
--primary: #7c3aed;
--primary-hover: #6d28d9;
--primary-glow: rgba(124,58,237,0.25);
--bg: #0a0a1a;
--bg-card: rgba(20, 20, 40, 0.95);
--bg-card-hover: rgba(30, 30, 55, 0.98);
--bg-surface: rgba(25,25,50,0.9);
--border: rgba(255,255,255,0.08);
--border-hover: rgba(124,58,237,0.4);
--text: #ffffff;
--text-muted: #9ca3af;
--text-dim: #94a3b8;
--success: #10b981;
--danger: #ef4444;
--warning: #f59e0b;
--blue: #3b82f6;
--me-purple: #e42575;
--tensor-blue: #14f195;
}
body.orbis-mode::before { content:''; position:fixed; top:0; left:0; right:0; bottom:0; background:radial-gradient(ellipse at 50% 0%, rgba(124,58,237,0.08) 0%, transparent 60%); pointer-events:none; z-index:-1; }
body { font-family:'Inter',sans-serif; background:var(--bg); color:var(--text); height:100vh; display:flex; flex-direction:column; overflow:hidden; }
a { color:#c4b5fd; text-decoration:none; }

/* Custom scrollbars */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(124,58,237,0.3); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:rgba(124,58,237,0.5); }
* { scrollbar-width:thin; scrollbar-color:rgba(124,58,237,0.3) transparent; }

/* Hide scrollbars on sticky header elements */
.stats-bar, .controls, .collection-tabs, .stats-scroll { scrollbar-width:none; }
.stats-bar::-webkit-scrollbar, .controls::-webkit-scrollbar, .collection-tabs::-webkit-scrollbar, .stats-scroll::-webkit-scrollbar { display:none; }

/* Header */
.mp-header { background:var(--bg); border-bottom:1px solid var(--border); display:flex; flex-direction:column; flex-shrink:0; }
.mp-header.header-orbis { background:rgba(10,10,26,0.92); backdrop-filter:blur(16px); z-index:100; }
@media (min-width:769px) { #mpHeader.header-orbis { position:sticky; top:0; z-index:100; } }
@media (max-width:768px) { #mpHeader.header-orbis { position:relative; } }
.mp-header-top { display:flex; align-items:center; gap:16px; padding:14px 24px; min-height:68px; }
.mp-header-top img { height:40px; border-radius:8px; }
.mp-header-top h1 { font-size:1.25rem; font-weight:700; flex:1; }
.mp-tabs { display:flex; gap:4px; }
.mp-tabs button { background:none; border:none; color:var(--text-muted); padding:8px 16px; cursor:pointer; border-radius:8px; font-size:0.875rem; font-family:inherit; transition:all 0.2s; }
.mp-tabs button.active, .mp-tabs button:hover { background:rgba(124,58,237,0.2); color:var(--text); }
.wallet-btn { background:var(--primary); color:white; border:none; padding:10px 20px; border-radius:8px; cursor:pointer; font-family:inherit; font-weight:600; font-size:0.875rem; transition:all 0.2s; }
.wallet-btn:hover { background:var(--primary-hover); }
.wallet-btn.connected { background:rgba(16,185,129,0.2); color:var(--success); border:1px solid rgba(16,185,129,0.3); }
.mp-header.header-orbis .wallet-btn { background:rgba(255,255,255,0.08); border:1px solid var(--border); color:var(--text); padding:7px 14px; font-size:0.8rem; }
.mp-header.header-orbis .wallet-btn:hover { background:rgba(255,255,255,0.12); border-color:var(--border-hover); }
.mp-header.header-orbis .wallet-btn.connected { border-color:var(--success); color:var(--success); background:transparent; }


/* Header Nav Links */
.header-nav-links { display:flex; gap:8px; align-items:center; }
.header-nav-link { display:flex; align-items:center; gap:6px; padding:6px 12px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:8px; color:var(--text-muted); font-size:0.8rem; text-decoration:none; transition:all 0.2s; white-space:nowrap; }
.header-nav-link:hover { background:rgba(124,58,237,0.2); color:var(--text); border-color:rgba(124,58,237,0.3); }
.header-nav-link img { width:18px; height:18px; object-fit:contain; border-radius:4px; }
/* Orbis integration elements */
.orbis-search { display:flex; align-items:center; gap:6px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:8px; padding:4px 10px; transition:border-color 0.2s; position:relative; }
.orbis-search:focus-within { border-color:rgba(124,58,237,0.5); }
.orbis-search input { background:transparent; border:none; outline:none; color:var(--text); font-size:0.8rem; width:140px; }
.orbis-search input::placeholder { color:var(--text-muted); }
.orbis-search svg { width:14px; height:14px; color:var(--text-muted); flex-shrink:0; }
.orbs-display { display:none; align-items:center; gap:5px; padding:6px 12px; background:rgba(124,58,237,0.12); border:1px solid rgba(124,58,237,0.25); border-radius:8px; color:#c4b5fd; font-size:0.8rem; font-weight:600; cursor:pointer; transition:all 0.2s; text-decoration:none; white-space:nowrap; }
.orbs-display:hover { background:rgba(124,58,237,0.22); border-color:rgba(124,58,237,0.45); }
.orbs-display svg { width:16px; height:16px; }
.giveaways-link { display:flex; align-items:center; gap:5px; padding:6px 12px; background:rgba(236,72,153,0.12); border:1px solid rgba(236,72,153,0.25); border-radius:8px; color:#f9a8d4; font-size:0.8rem; font-weight:600; cursor:pointer; transition:all 0.2s; white-space:nowrap; text-decoration:none; }
.giveaways-link:hover { background:rgba(236,72,153,0.22); border-color:rgba(236,72,153,0.45); }
.giveaways-link svg { width:14px; height:14px; }

/* Orbis header styles are now in marketplace-header.js shared component */
.search-dropdown { position:absolute; top:calc(100% + 4px); left:0; right:0; background:#1a1a2e; border:1px solid var(--border); border-radius:10px; max-height:360px; overflow-y:auto; z-index:300; display:none; box-shadow:0 8px 32px rgba(0,0,0,0.5); }
.search-dropdown.open { display:block; }
.search-dropdown.mobile-body-dd { position:fixed !important; z-index:9999 !important; }
.search-dropdown.mobile-body-dd.open { display:flex !important; }
.search-dropdown-item { display:flex; align-items:center; gap:10px; padding:10px 14px; cursor:pointer; transition:background 0.15s; text-decoration:none; color:var(--text); }
.search-dropdown-item:hover { background:rgba(124,58,237,0.15); }
.search-dropdown-item img { width:32px; height:32px; border-radius:6px; object-fit:cover; flex-shrink:0; background:rgba(255,255,255,0.05); }
.search-dropdown-item .sdi-info { flex:1; min-width:0; }
.search-dropdown-item .sdi-name { font-size:0.85rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.search-dropdown-item .sdi-floor { font-size:0.7rem; color:var(--text-muted); }
.search-dropdown-empty { padding:16px; text-align:center; color:var(--text-muted); font-size:0.85rem; }

/* Collections Sidebar */
.collections-sidebar { width:340px; min-width:340px; background:var(--bg-card); border-right:1px solid var(--border); padding:16px; transition:all 0.3s; overflow-y:auto; }
.collections-sidebar.hidden { width:0; min-width:0; padding:0; overflow:hidden; }
.collections-sidebar h3 { font-size:0.875rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin:0; }
.collections-sidebar .cs-search { width:100%; padding:8px 28px 8px 30px; background:rgba(0,0,0,0.3); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.8rem; font-family:inherit; outline:none; margin:0; }
.collections-sidebar .cs-search:focus { border-color:var(--primary); }
.collections-sidebar .cs-search::placeholder { color:var(--text-muted); }
.cs-search-wrap { position:relative; margin-bottom:12px; display:flex; align-items:center; }
.cs-search-wrap > svg { position:absolute; left:8px; top:50%; transform:translateY(-50%); width:14px; height:14px; color:var(--text-muted); pointer-events:none; }
.cs-search-clear { position:absolute; right:6px; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--text-muted); cursor:pointer; padding:2px; display:none; align-items:center; justify-content:center; border-radius:4px; line-height:0; }
.cs-search-clear:hover { color:var(--text); }
.cs-search-clear.visible { display:flex; }
.cs-col-headers { display:flex; align-items:center; padding:0 8px 6px; border-bottom:1px solid var(--border); margin-bottom:4px; gap:6px; }
.cs-col-headers span { font-size:0.65rem; font-weight:600; color:rgba(255,255,255,0.45); text-transform:uppercase; letter-spacing:0.5px; white-space:nowrap; }
.cs-col-headers span.cs-sortable { cursor:pointer; transition:color 0.15s; user-select:none; }
.cs-col-headers span.cs-sortable:hover { color:rgba(255,255,255,0.8); }
.cs-col-headers span.cs-sortable.active { color:#c4b5fd; }
.cs-col-name { width:90px; min-width:0; padding-left:6px; text-align:left; }
.cs-col-held { width:36px; text-align:center; flex-shrink:0; }
.cs-col-listed { width:44px; text-align:center; flex-shrink:0; }
.cs-col-floor { width:52px; text-align:right; flex-shrink:0; }
.cs-col-sales { width:46px; text-align:right; flex-shrink:0; }
.cs-list { display:flex; flex-direction:column; gap:4px; }
.cs-item { display:flex; align-items:center; gap:6px; padding:6px 8px; border-radius:8px; cursor:pointer; transition:all 0.15s; text-decoration:none; color:var(--text); }
.cs-item:hover { background:rgba(124,58,237,0.15); }
.cs-item.active { background:rgba(124,58,237,0.2); border:1px solid rgba(124,58,237,0.3); }
.cs-item img { width:32px; height:32px; border-radius:6px; object-fit:cover; background:rgba(255,255,255,0.05); flex-shrink:0; }
.cs-item-name { flex:1; min-width:0; font-size:0.8rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.3; }
.cs-item-floor { width:52px; text-align:right; flex-shrink:0; font-size:0.75rem; display:inline-flex; align-items:center; justify-content:flex-end; gap:2px; }
.cs-item-sales { width:46px; text-align:right; flex-shrink:0; font-size:0.7rem; color:var(--text-muted); }
.cs-item-held { width:32px; text-align:center; flex-shrink:0; font-size:0.72rem; font-weight:600; color:var(--text); display:none; }
.cs-item-listed { width:44px; text-align:center; flex-shrink:0; font-size:0.65rem; color:rgba(255,255,255,0.4); display:none; white-space:nowrap; }
.collections-sidebar.portfolio-mode .cs-item-name { flex:0 1 auto; max-width:90px; }
.collections-sidebar.portfolio-mode .cs-item-floor { margin-left:auto; }
.collections-sidebar.portfolio-mode .cs-col-floor { margin-left:auto; }
.cs-header { display:flex; align-items:center; justify-content:space-between; margin:0 0 12px; }
.cs-header h3 { margin:0; }
.cs-sort-select { background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:6px; color:var(--text-muted); font-size:0.65rem; font-weight:600; padding:3px 6px; cursor:pointer; font-family:inherit; outline:none; display:none; }
.cs-sort-select option { background:var(--bg-card); color:var(--text); }
.cs-time-toggle { display:flex; background:rgba(255,255,255,0.06); border-radius:6px; border:1px solid var(--border); overflow:hidden; }
.cs-time-btn { background:none; border:none; color:var(--text-muted); font-size:0.65rem; font-weight:600; padding:3px 8px; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.cs-time-btn.active { background:var(--primary); color:white; }
.cs-floor-up { color:#22c55e; }
.cs-floor-down { color:#ef4444; }
.cs-floor-arrow { font-size:0.6rem; line-height:1; }
.collections-toggle { padding:8px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); cursor:pointer; font-size:0; font-family:inherit; display:flex; align-items:center; justify-content:center; gap:0; transition:all 0.2s; min-width:34px; min-height:34px; }
.collections-toggle.active { background:var(--primary); border-color:var(--primary); color:#fff; }
.header-social-links { display:flex; gap:6px; align-items:center; }
.header-social-link { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:8px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); transition:all 0.2s; }
.header-social-link:hover { background:rgba(124,58,237,0.2); border-color:rgba(124,58,237,0.3); }
.header-social-link svg { width:16px; height:16px; fill:var(--text-muted); }
.header-social-link:hover svg { fill:var(--text); }

/* Collection Tabs (linked collections switcher) */
.collection-tabs-wrapper { border-top:1px solid var(--border); display:none; }
.collection-tabs-wrapper.visible { display:block; }
.collection-tabs { display:none; overflow-x:auto; gap:0; align-items:stretch; padding:0 24px; }
.collection-tabs.visible { display:flex; }
.collection-tab { display:flex; align-items:center; gap:0.5rem; padding:0.75rem 1.25rem; background:none; border:none; color:var(--text-muted); font-size:0.875rem; cursor:pointer; transition:all 0.2s; border-bottom:2px solid transparent; white-space:nowrap; font-family:inherit; }
.collection-tab:hover { color:var(--text); background:rgba(255,255,255,0.05); }
.collection-tab.active { color:#c4b5fd; border-bottom-color:var(--primary); }
.collection-tab-icon { width:24px; height:24px; border-radius:6px; overflow:hidden; flex-shrink:0; background:rgba(255,255,255,0.1); display:flex; align-items:center; justify-content:center; }
.collection-tab-icon img { width:100%; height:100%; object-fit:cover; }

/* Stats Bar */
.stats-bar { display:flex; gap:0; background:var(--bg); margin:0; flex-shrink:0; border-bottom:1px solid var(--border); min-height:63px; }
.stats-scroll { display:flex; flex:1; min-width:0; overflow-x:auto; }
.mobile-stats-strip { display:none; }
.mobile-info-overlay { display:none; }
.view-select-mobile { display:none; }

/* Mobile Stats Popup (hidden on desktop) */
.mobile-stats-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:250; align-items:flex-end; justify-content:center; padding:0; }
.mobile-stats-overlay.open { display:flex; }
.mobile-stats-modal { background:var(--bg-card); border:1px solid var(--border); border-radius:16px 16px 0 0; width:100%; max-height:70vh; overflow-y:auto; animation:slideUp 0.2s; }
.msm-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--border); }
.msm-header h3 { font-size:1rem; font-weight:700; margin:0; }
.msm-header button { background:none; border:none; color:var(--text-muted); font-size:1.5rem; cursor:pointer; padding:4px; line-height:1; }
.msm-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); }
.msm-stat { background:var(--bg-card); padding:14px 16px; text-align:center; }
.msm-stat-label { font-size:0.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:4px; }
.msm-stat-value { font-size:1rem; font-weight:700; }
.msm-founder-offer { background:rgba(20,241,149,0.06); padding:12px 16px; display:flex; align-items:center; justify-content:center; gap:8px; border-top:1px solid var(--border); }
.stat-item { flex:1; min-width:120px; background:var(--bg); padding:16px; text-align:center; position:relative; cursor:default; border-right:1px solid var(--border); }
.stat-item:last-child { border-right:none; }
.stat-item .stat-label { font-size:0.7rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:4px; }
.stat-item .stat-value { font-size:1.1rem; font-weight:700; }
.stat-item .stat-tooltip { display:none; position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:#1a1a2e; border:1px solid var(--border); border-radius:8px; padding:8px 12px; font-size:0.7rem; color:var(--text-muted); white-space:nowrap; z-index:50; pointer-events:none; box-shadow:0 4px 12px rgba(0,0,0,0.4); }
.stat-item:hover .stat-tooltip { display:block; }
.stat-item.stat-flash-up { animation: statFlashUp 1.2s ease-out; }
.stat-item.stat-flash-down { animation: statFlashDown 1.2s ease-out; }
.stat-item.stat-flash-neutral { animation: statFlashNeutral 1.2s ease-out; }
.stat-item.stat-flash-up .stat-value { animation: statValuePopUp 1.2s ease-out; }
.stat-item.stat-flash-down .stat-value { animation: statValuePopDown 1.2s ease-out; }
.stat-item.stat-flash-neutral .stat-value { animation: statValuePopNeutral 1.2s ease-out; }
/* Hold at peak (~18%) before fading: brighter inset border + glow + a faint
   card wash, and the value snaps up in scale AND flashes the up/down colour
   (returns to white) so the change is unmistakable. */
@keyframes statFlashUp {
  0%   { box-shadow: inset 0 0 0 1.5px rgba(16,185,129,0.95), 0 0 22px 2px rgba(16,185,129,0.6); background: rgba(16,185,129,0.16); }
  18%  { box-shadow: inset 0 0 0 1.5px rgba(16,185,129,0.95), 0 0 22px 2px rgba(16,185,129,0.6); background: rgba(16,185,129,0.16); }
  100% { box-shadow: inset 0 0 0 1.5px rgba(16,185,129,0), 0 0 22px 2px rgba(16,185,129,0); background: var(--bg); }
}
@keyframes statFlashDown {
  0%   { box-shadow: inset 0 0 0 1.5px rgba(239,68,68,0.95), 0 0 22px 2px rgba(239,68,68,0.6); background: rgba(239,68,68,0.16); }
  18%  { box-shadow: inset 0 0 0 1.5px rgba(239,68,68,0.95), 0 0 22px 2px rgba(239,68,68,0.6); background: rgba(239,68,68,0.16); }
  100% { box-shadow: inset 0 0 0 1.5px rgba(239,68,68,0), 0 0 22px 2px rgba(239,68,68,0); background: var(--bg); }
}
@keyframes statFlashNeutral {
  0%   { box-shadow: inset 0 0 0 1.5px rgba(167,139,250,0.95), 0 0 22px 2px rgba(124,58,237,0.6); background: rgba(124,58,237,0.16); }
  18%  { box-shadow: inset 0 0 0 1.5px rgba(167,139,250,0.95), 0 0 22px 2px rgba(124,58,237,0.6); background: rgba(124,58,237,0.16); }
  100% { box-shadow: inset 0 0 0 1.5px rgba(167,139,250,0), 0 0 22px 2px rgba(124,58,237,0); background: var(--bg); }
}
@keyframes statValuePopUp {
  0%   { transform: scale(1.14); color: #34ffc2; text-shadow: 0 0 12px rgba(16,185,129,0.85); }
  18%  { transform: scale(1.14); color: #34ffc2; text-shadow: 0 0 12px rgba(16,185,129,0.85); }
  100% { transform: scale(1); color: #ffffff; text-shadow: 0 0 0 rgba(16,185,129,0); }
}
@keyframes statValuePopDown {
  0%   { transform: scale(1.14); color: #ff7a7a; text-shadow: 0 0 12px rgba(239,68,68,0.85); }
  18%  { transform: scale(1.14); color: #ff7a7a; text-shadow: 0 0 12px rgba(239,68,68,0.85); }
  100% { transform: scale(1); color: #ffffff; text-shadow: 0 0 0 rgba(239,68,68,0); }
}
@keyframes statValuePopNeutral {
  0%   { transform: scale(1.14); color: #d6c8ff; text-shadow: 0 0 12px rgba(167,139,250,0.85); }
  18%  { transform: scale(1.14); color: #d6c8ff; text-shadow: 0 0 12px rgba(167,139,250,0.85); }
  100% { transform: scale(1); color: #ffffff; text-shadow: 0 0 0 rgba(167,139,250,0); }
}
.stat-founder-offer { background:rgba(20,241,149,0.04); border-right:1px solid rgba(20,241,149,0.15); position:relative; }
.stat-fo-accept-btn { margin-left:6px; padding:2px 10px; font-size:0.7rem; font-weight:600; font-family:inherit; border:none; border-radius:5px; background:#14F195; color:#000; cursor:pointer; transition:all 0.15s; vertical-align:middle; }
.stat-fo-accept-btn:hover { background:#0dd882; transform:translateY(-1px); }

/* Founder Offer NFT Picker */
.fo-picker-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:300; display:flex; align-items:center; justify-content:center; padding:20px; animation:fadeIn 0.15s; }
.fo-picker-modal { background:var(--bg); border:1px solid var(--border); border-radius:16px; width:520px; max-width:95vw; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; }
.fo-picker-header { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.fo-picker-header h3 { margin:0; font-size:1rem; }
.fo-picker-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; font-size:1.2rem; line-height:1; }
.fo-picker-close:hover { color:var(--text); }
.fo-picker-body { padding:16px 20px; overflow-y:auto; flex:1; }
.fo-picker-info { font-size:0.82rem; color:var(--text-muted); margin-bottom:12px; line-height:1.5; }
.fo-picker-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:10px; }
.fo-picker-nft { background:var(--bg-card); border:1px solid var(--border); border-radius:10px; cursor:pointer; overflow:hidden; transition:all 0.15s; }
.fo-picker-nft:hover { border-color:rgba(20,241,149,0.5); transform:translateY(-2px); }
.fo-picker-nft img { width:100%; aspect-ratio:1; object-fit:cover; display:block; }
.fo-picker-nft .fo-nft-name { padding:6px 8px; font-size:0.72rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fo-picker-empty { text-align:center; padding:24px; color:var(--text-muted); font-size:0.85rem; }

/* Collection Info Card */
.collection-info-card { display:flex; align-items:center; gap:12px; padding:10px 16px; text-align:left; min-width:220px; cursor:default; flex:none; background:var(--bg); border-right:1px solid var(--border); }
.cic-logo { width:40px; height:40px; border-radius:10px; object-fit:cover; flex-shrink:0; background:rgba(255,255,255,0.05); }
.cic-details { flex:1; min-width:0; }
.cic-name-row { display:flex; align-items:center; gap:4px; position:relative; }
.cic-name { font-size:0.95rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.2; cursor:pointer; transition:color 0.15s; }
.cic-name:hover { color:#c4b5fd; }
.cic-name-tooltip { display:none; position:absolute; top:calc(100% + 8px); left:0; min-width:300px; max-width:440px; background:rgba(15,15,30,0.97); border:1px solid var(--border); border-radius:10px; padding:12px 14px; z-index:60; box-shadow:0 8px 32px rgba(0,0,0,0.5); cursor:default; }
.cic-name-tooltip::before { content:''; position:absolute; bottom:100%; left:16px; border:6px solid transparent; border-bottom-color:var(--border); }
.cic-name-tooltip.open { display:block; animation:fadeIn 0.15s; }
.cic-name-tooltip-desc { font-size:0.78rem; color:var(--text-dim); line-height:1.5; white-space:normal; word-break:break-word; max-height:160px; overflow-y:auto; }
.cic-name-tooltip-link { display:inline-flex; align-items:center; gap:4px; font-size:0.72rem; font-weight:600; color:#c4b5fd; margin-top:8px; white-space:nowrap; text-decoration:none; cursor:pointer; }
.cic-name-tooltip-link:hover { color:#a78bfa; text-decoration:underline; }
.cic-name-tooltip-link svg { width:10px; height:10px; }
/* Team popup */
.team-popup-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:2000; justify-content:center; align-items:center; padding:20px; }
.team-popup-overlay.active { display:flex; }
.team-popup { background:linear-gradient(135deg, #1a1a2e, #0a0a1a); border:1px solid var(--border); border-radius:16px; max-width:420px; width:100%; max-height:80vh; overflow-y:auto; padding:24px; }
.team-popup-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.team-popup-header h3 { font-size:1rem; font-weight:700; display:flex; align-items:center; gap:8px; }
.team-popup-close { width:28px; height:28px; background:rgba(255,255,255,0.08); border:none; border-radius:6px; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.team-popup-close:hover { background:rgba(255,255,255,0.15); }
.team-section-label { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:#fbbf24; margin-bottom:10px; display:flex; align-items:center; gap:5px; }
.team-section-label.team-label { color:var(--text-muted); margin-top:16px; }
.team-member { display:flex; align-items:center; gap:12px; padding:10px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.06); border-radius:10px; margin-bottom:8px; cursor:pointer; transition:all 0.15s; text-decoration:none; }
.team-member:hover { background:rgba(124,58,237,0.1); border-color:rgba(124,58,237,0.25); }
.team-member-avatar { width:40px; height:40px; border-radius:50%; object-fit:cover; background:rgba(255,255,255,0.06); flex-shrink:0; }
.team-member-info { flex:1; min-width:0; }
.team-member-name { font-size:0.88rem; font-weight:600; color:#fff; }
.team-member-handle { font-size:0.75rem; color:var(--text-muted); }
.team-member svg { width:16px; height:16px; color:var(--text-dim); flex-shrink:0; }
.cic-links { display:flex; gap:6px; margin-top:4px; }
.cic-links a { display:flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:6px; background:rgba(255,255,255,0.06); color:var(--text-muted); transition:all 0.15s; }
.cic-links a:hover { background:rgba(124,58,237,0.25); color:var(--text); }
.cic-links a svg { width:13px; height:13px; fill:currentColor; }
.cic-links button.cic-share-btn { display:flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:6px; background:rgba(255,255,255,0.06); color:var(--text-muted); border:none; cursor:pointer; transition:all 0.15s; padding:0; }
.cic-links button.cic-share-btn:hover { background:rgba(124,58,237,0.25); color:var(--text); }
.cic-links button.cic-share-btn svg { width:13px; height:13px; }

/* Share Stats Modal */
.share-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.75); z-index:200; align-items:center; justify-content:center; backdrop-filter:blur(6px); }
.share-overlay.open { display:flex; animation:fadeIn 0.2s; }
.share-modal { background:var(--card); border:1px solid var(--border); border-radius:16px; width:480px; max-width:92vw; overflow:hidden; box-shadow:0 24px 80px rgba(0,0,0,0.7); }
.share-modal-header { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--border); }
.share-modal-header h3 { font-size:0.9rem; font-weight:700; margin:0; }
.share-modal-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; display:flex; }
.share-modal-close:hover { color:var(--text); }
.share-card { padding:24px; background:linear-gradient(160deg, #0d0d1a 0%, #1a1230 50%, #0d0d1a 100%); }
.share-card-inner { border-radius:14px; padding:24px; background:rgba(0,0,0,0.5); border:1px solid rgba(124,58,237,0.2); position:relative; overflow:hidden; }
.share-card-inner::before { content:''; position:absolute; top:-50%; right:-50%; width:100%; height:100%; background:radial-gradient(circle, rgba(124,58,237,0.08) 0%, transparent 70%); pointer-events:none; }
.share-card-header { display:flex; align-items:center; gap:16px; margin-bottom:20px; position:relative; }
.share-card-logo { width:72px; height:72px; border-radius:14px; object-fit:cover; background:rgba(255,255,255,0.05); flex-shrink:0; border:2px solid rgba(124,58,237,0.3); }
.share-card-title { flex:1; min-width:0; }
.share-card-name { font-size:1.3rem; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-0.02em; }
.share-card-floor { margin-top:6px; }
.share-card-floor-label { font-size:0.6rem; text-transform:uppercase; letter-spacing:0.8px; color:var(--text-dim); }
.share-card-floor-value { font-size:1.5rem; font-weight:800; color:#c084fc; letter-spacing:-0.02em; }
.share-card-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; position:relative; }
.share-card-stat { background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.12); border-radius:10px; padding:10px 12px; text-align:center; }
.share-card-stat-label { font-size:0.55rem; text-transform:uppercase; letter-spacing:0.7px; color:rgba(255,255,255,0.35); margin-bottom:3px; font-weight:600; }
.share-card-stat-value { font-size:1rem; font-weight:700; white-space:nowrap; }
.share-card-brand { display:flex; align-items:center; justify-content:center; gap:6px; margin-top:16px; position:relative; }
.share-card-brand img { height:22px; opacity:0.5; }
.share-actions { display:flex; gap:8px; padding:14px 20px; border-top:1px solid var(--border); }
.share-actions button { flex:1; display:flex; align-items:center; justify-content:center; gap:6px; padding:10px; border-radius:8px; border:1px solid var(--border); background:rgba(255,255,255,0.04); color:var(--text); font-size:0.78rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.share-actions button:hover { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); }
.share-actions button svg { width:14px; height:14px; flex-shrink:0; }

/* Features card — second info card for project ecosystem icons */
.features-card { display:none; flex-direction:column; justify-content:center; gap:4px; padding:6px 14px; text-align:center; flex:none; background:var(--bg); border-right:1px solid var(--border); }
.features-card.visible { display:flex; }
.features-card .fc-label { font-size:0.6rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:0.5px; white-space:nowrap; }
.features-card .fc-icons { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.features-card .fc-icons a, .features-card .fc-icons span.fc-icon { display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:8px; background:none; border:none; color:var(--text-muted); transition:all 0.15s; text-decoration:none; cursor:pointer; }
.features-card .fc-icons a:hover { color:var(--text); }
.features-card .fc-icons a svg, .features-card .fc-icons span.fc-icon svg { width:15px; height:15px; }
.features-card .fc-icons a.fc-staking { color:#6366f1; }
.features-card .fc-icons a.fc-staking:hover { color:#a5b4fc; }
.features-card .fc-icons a.fc-traits { color:#10b981; }
.features-card .fc-icons a.fc-traits:hover { color:#6ee7b7; }
.features-card .fc-icons a.fc-reroll { color:#a78bfa; }
.features-card .fc-icons a.fc-reroll:hover { color:#c4b5fd; }
.features-card .fc-icons a.fc-swap { color:#10b981; }
.features-card .fc-icons a.fc-swap:hover { color:#6ee7b7; }
.features-card .fc-icons .fc-tkn-img { width:18px; height:18px; border-radius:50%; cursor:pointer; transition:all 0.15s; }
.features-card .fc-icons .fc-tkn-img:hover { opacity:0.8; }
.cic-info { background:none; border:none; cursor:pointer; padding:4px; flex-shrink:0; color:var(--text-muted); transition:all 0.15s; position:relative; }
.cic-info > svg { width:16px; height:16px; }
.cic-info:hover { color:#c4b5fd; }
.desc-popover { display:none; position:absolute; top:-4px; left:calc(100% + 10px); width:300px; max-width:80vw; background:rgba(15,15,30,0.97); border:1px solid var(--border); border-radius:12px; padding:14px 16px; z-index:60; box-shadow:0 8px 32px rgba(0,0,0,0.5); cursor:default; }
.desc-popover::before { content:''; position:absolute; top:14px; right:100%; border:6px solid transparent; border-right-color:var(--border); }
.desc-popover.open { display:block; animation:fadeIn 0.15s; }
.cic-info:hover .desc-popover { display:block; animation:fadeIn 0.15s; }
.desc-popover-text { font-size:0.8rem; color:var(--text); line-height:1.5; max-height:120px; overflow-y:auto; word-break:break-word; white-space:pre-wrap; }
.desc-popover-copy { display:flex; align-items:center; gap:4px; margin-top:10px; padding:4px 10px; background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:6px; color:var(--text-muted); font-size:0.7rem; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.desc-popover-copy:hover { background:rgba(255,255,255,0.12); color:var(--text); }
.cic-actions { display:flex; flex-direction:row; align-items:center; gap:4px; flex-shrink:0; }
.cic-fav { background:none; border:none; cursor:pointer; padding:4px; flex-shrink:0; color:var(--text-muted); transition:all 0.15s; }
.cic-fav svg { width:16px; height:16px; }
.cic-fav:hover { color:#facc15; transform:scale(1.1); }
.cic-fav.active { color:#facc15; }
.cic-fav.active svg { fill:#facc15; }
.cic-fav[data-tip]::after { top:calc(100% + 8px); bottom:auto; left:50%; transform:translateX(-50%); }
.cic-fav[data-tip]::before { top:calc(100% + 2px); bottom:auto; left:50%; transform:translateX(-50%); border-right-color:transparent; border-top-color:transparent; border-bottom-color:var(--border); }
.cic-token-offer-btn { display:flex; align-items:center; gap:4px; background:rgba(168,85,247,0.15); border:1px solid rgba(168,85,247,0.3); color:#c084fc; padding:3px 10px; border-radius:8px; cursor:pointer; font-size:0.72rem; font-weight:600; transition:all 0.15s; white-space:nowrap; }
.cic-token-offer-btn:hover { background:rgba(168,85,247,0.25); border-color:rgba(168,85,247,0.5); }
.cic-token-offer-btn svg { flex-shrink:0; }
.cic-token-offer-btn[data-tip]::after { top:calc(100% + 8px); bottom:auto; left:50%; transform:translateX(-50%); }
.cic-token-offer-btn[data-tip]::before { top:calc(100% + 2px); bottom:auto; left:50%; transform:translateX(-50%); border-right-color:transparent; border-top-color:transparent; border-bottom-color:var(--border); }
.offers-make-btn { padding:6px 16px !important; font-size:0.82rem !important; border-radius:8px; }

/* Offers sub-nav filter toggle */
.view-toggle { display:flex; border:1px solid rgba(168,85,247,0.3); border-radius:8px; overflow:hidden; }
.view-toggle button { padding:5px 14px; background:none; border:none; color:rgba(255,255,255,0.5); cursor:pointer; font-size:0.78rem; font-weight:600; font-family:inherit; transition:all 0.15s; white-space:nowrap; }
.view-toggle button:not(:last-child) { border-right:1px solid rgba(168,85,247,0.2); }
.view-toggle button:hover:not(.active) { background:rgba(168,85,247,0.1); color:rgba(255,255,255,0.7); }
.view-toggle button.active { background:rgba(168,85,247,0.2); color:#c084fc; }
#offersSubNav .btn-outline { border:1px solid rgba(168,85,247,0.3); border-radius:8px; color:#c084fc; padding:5px 12px; font-size:0.78rem; font-weight:600; margin-top:0; }
#offersSubNav .btn-outline:hover { background:rgba(168,85,247,0.1); border-color:rgba(168,85,247,0.5); }

/* Staked pulse */
@keyframes staked-pulse { 0%,100% { transform:scale(1); opacity:0.85; } 50% { transform:scale(1.25); opacity:1; } }
#stakedFire.pulsing { animation:staked-pulse var(--beat-speed, 2s) ease-in-out infinite; transform-origin:center; }

/* Controls */
.controls { display:flex; gap:12px; padding:14px 24px; align-items:center; flex-wrap:nowrap; flex-shrink:0; background:var(--bg); border-bottom:1px solid var(--border); overflow-x:auto; }
.search-box { flex:1; min-width:200px; position:relative; display:flex; }
.search-box input { flex:1; min-width:0; padding:7px 32px 7px 36px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px 0 0 8px; color:var(--text); font-size:0.8rem; font-family:inherit; outline:none; height:34px; box-sizing:border-box; }
.search-box input:focus { border-color:var(--primary); }
.search-box:focus-within .exact-toggle { border-color:var(--border); }
.search-box::before { content:""; position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E") no-repeat center; z-index:1; }
.exact-toggle { display:flex; align-items:center; justify-content:center; gap:0; cursor:pointer; font-size:0.65rem; color:var(--text-dim); white-space:nowrap; user-select:none; padding:0 10px; height:34px; background:var(--bg-card); border:1px solid var(--border); border-left:none; border-radius:0 8px 8px 0; transition:all 0.15s; box-sizing:border-box; }
.exact-toggle:hover { color:var(--text); background:rgba(255,255,255,0.05); }
.exact-toggle:has(input:checked) { color:var(--primary); background:rgba(124,58,237,0.1); border-color:var(--primary); }
.exact-toggle input { display:none; }
.exact-toggle span { font-weight:600; letter-spacing:0.5px; }
.search-clear { position:absolute; right:68px; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--text-muted); cursor:pointer; padding:2px; display:none; align-items:center; justify-content:center; border-radius:4px; transition:all 0.15s; line-height:0; z-index:1; }
.search-clear:hover { color:var(--text); background:rgba(255,255,255,0.1); }
.search-clear.visible { display:flex; }
select { padding:0 12px; height:34px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.8rem; font-family:inherit; cursor:pointer; outline:none; box-sizing:border-box; }
.sort-select-wrap { position:relative; display:flex; align-items:center; }
.sort-select-wrap select { padding-left:30px; }
.sort-select-icon { position:absolute; left:10px; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--text-muted); }
.filter-toggle { padding:0 14px; height:34px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); cursor:pointer; font-size:0.8rem; font-family:inherit; display:flex; align-items:center; gap:6px; transition:all 0.2s; box-sizing:border-box; }
.filter-toggle.active { background:#7c3aed; border-color:#7c3aed; color:#fff; }

/* View Mode Toggle */
.view-tabs { display:inline-flex; flex-shrink:0; border:1px solid var(--border); border-radius:8px; overflow:hidden; height:34px; box-sizing:border-box; }
.view-tab { padding:0 12px; height:34px; background:transparent; border:none; color:var(--text-muted); font-size:0.75rem; font-weight:500; font-family:inherit; cursor:pointer; transition:all 0.15s; white-space:nowrap; border-right:1px solid var(--border); display:flex; align-items:center; box-sizing:border-box; }
.view-tab:last-child { border-right:none; }
.view-tab:hover { color:var(--text); background:rgba(255,255,255,0.03); }
.view-tab.active { color:#fff; background:linear-gradient(135deg, #7c3aed 0%, #9333ea 100%); box-shadow:0 0 12px rgba(124,58,237,0.4); }
.view-tab .tab-count { font-size:0.7rem; color:#9094a8; margin-left:2px; }
.view-tab svg { vertical-align:-1px; }
.view-select-wrap { position:relative; display:inline-flex; align-items:center; flex-shrink:0; display:none; }
.view-select-wrap .view-select-icon { position:absolute; left:10px; pointer-events:none; color:var(--text-muted); z-index:1; }
.view-select-wrap select { padding:8px 28px 8px 30px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.8rem; font-family:inherit; font-weight:600; cursor:pointer; -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 8px center; background-size:14px; transition:all 0.2s; }
.view-select-wrap select:hover { border-color:rgba(124,58,237,0.4); }
.view-select-wrap select:focus { outline:none; border-color:var(--primary); }

/* Offers split button */
.offers-split-btn { display:none; align-items:stretch; border-radius:8px; overflow:hidden; border:1px solid var(--border); background:var(--bg-card); }
.offers-split-btn button { padding:8px 12px; background:none; border:none; color:var(--text); cursor:pointer; font-size:0.8rem; font-family:inherit; display:flex; align-items:center; gap:5px; transition:all 0.2s; white-space:nowrap; line-height:1; }
.offers-split-btn button:hover { background:rgba(124,58,237,0.2); }
.offers-split-btn button + button { border-left:1px solid var(--border); }
.offers-notif-badge { background:#a78bfa; color:#fff; font-size:0.6rem; font-weight:700; border-radius:10px; padding:1px 5px; margin-left:4px; line-height:1.2; min-width:14px; text-align:center; }

/* Unlisted card */
.nft-card.unlisted { opacity:1; }
.nft-card.unlisted:hover { opacity:1; }

/* Layout */
.content-wrapper { display:flex; gap:0; flex:1; min-height:0; }
.sidebar { width:280px; min-width:280px; background:var(--bg-card); border-right:1px solid var(--border); padding:16px; transition:all 0.3s; overflow-y:auto; }
.sidebar-mobile-header { display:none; }
.sidebar.hidden { width:0; min-width:0; padding:0; overflow:hidden; }
.sidebar h3 { font-size:0.875rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-top:0; margin-bottom:12px; }

/* Trait Filters */
.trait-search { width:100%; padding:8px 10px; background:rgba(0,0,0,0.3); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.8rem; font-family:inherit; outline:none; margin-bottom:12px; }
.trait-search:focus { border-color:var(--primary); }
.trait-search::placeholder { color:var(--text-muted); }
.trait-search-row { display:flex; gap:6px; align-items:center; margin-bottom:12px; }
.trait-search-wrap { position:relative; margin-bottom:0; flex:1; min-width:0; }
.trait-search-wrap .trait-search { padding-left:30px; padding-right:28px; margin-bottom:0; }
.trait-search-wrap .ts-icon { position:absolute; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--text-muted); }
.trait-search-wrap .ts-icon-search { left:8px; }
.trait-search-wrap .ts-icon-clear { right:8px; pointer-events:auto; cursor:pointer; display:none; }
.trait-search-wrap .ts-icon-clear:hover { color:var(--text); }
.trait-exact-btn { padding:7px 8px; background:rgba(0,0,0,0.3); border:1px solid var(--border); border-radius:6px; color:var(--text-muted); font-size:0.65rem; font-weight:700; cursor:pointer; white-space:nowrap; transition:all 0.15s; line-height:1; letter-spacing:0.3px; flex-shrink:0; }
.trait-exact-btn:hover { border-color:rgba(124,58,237,0.4); color:#c4b5fd; }
.trait-exact-btn.active { background:rgba(124,58,237,0.25); border-color:rgba(124,58,237,0.5); color:#a78bfa; }
.trait-search[type="number"]::-webkit-inner-spin-button, .trait-search[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.trait-search[type="number"] { -moz-appearance:textfield; }
.num-input-wrap { display:flex; align-items:stretch; border:1px solid var(--border); border-radius:6px; overflow:hidden; width:50%; }
.num-input-wrap .trait-search { border:none; border-radius:0; text-align:center; flex:1; min-width:0; margin-bottom:0; padding:8px 4px; }
.num-btn { background:rgba(255,255,255,0.05); border:none; color:var(--text-muted); width:24px; cursor:pointer; font-size:0.85rem; display:flex; align-items:center; justify-content:center; transition:all 0.15s; flex-shrink:0; }
.num-btn:hover { background:rgba(124,58,237,0.2); color:var(--text); }
.trait-category { margin-bottom:4px; border-bottom:1px solid var(--border); padding-bottom:4px; }
.trait-category-header { display:flex; justify-content:space-between; align-items:center; cursor:pointer; padding:8px 0; border-radius:6px; transition:background 0.15s; }
.trait-category-header:hover { background:rgba(255,255,255,0.04); }
.trait-category-header span { font-size:0.875rem; font-weight:600; }
.trait-category-header .count { font-size:0.75rem; color:var(--text-muted); margin-right:4px; }
.trait-category-header .chevron { width:16px; height:16px; color:var(--text-muted); transition:transform 0.2s; flex-shrink:0; }
.trait-category-header.expanded .chevron { transform:rotate(90deg); }
.trait-values { display:none; padding:4px 0 4px 4px; }
.trait-values.open { display:block; }
.trait-value { display:flex; align-items:center; gap:8px; padding:4px 0; cursor:pointer; font-size:0.8rem; }
.trait-value input[type="checkbox"] { accent-color:var(--primary); }
.trait-value .tv-count { color:var(--text-muted); margin-left:auto; font-size:0.7rem; }
.trait-value-rich { display:flex; align-items:center; gap:8px; padding:6px 0; cursor:pointer; font-size:0.8rem; }
.trait-value-rich input[type="checkbox"] { accent-color:var(--primary); flex-shrink:0; }
.tv-rich-left { display:flex; flex-direction:column; gap:1px; min-width:0; }
.tv-rich-name { font-weight:600; font-size:0.85rem; }
.tv-rich-floor { font-size:0.65rem; color:#c084fc; }
.tv-rich-right { display:flex; flex-direction:column; align-items:flex-end; gap:1px; margin-left:auto; flex-shrink:0; }
.tv-rich-count { font-weight:700; font-size:0.8rem; }
.tv-rich-pct { font-size:0.65rem; color:#c084fc; }
.trait-icon-btn { font-size:14px; cursor:pointer; opacity:0.6; transition:opacity 0.15s,transform 0.3s; flex-shrink:0; line-height:1; }
.trait-icon-btn:hover { opacity:1; }
.trait-icon-btn.active { opacity:1; transform:rotate(60deg); }
.trait-settings-panel { display:none; padding:8px 0 12px; border-bottom:1px solid rgba(255,255,255,0.06); margin-bottom:8px; }
.trait-settings-panel.open { display:flex; flex-direction:column; gap:8px; }
.trait-presets { margin-bottom:10px; }
.trait-presets-list { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.trait-preset-chip { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; background:rgba(124,58,237,0.12); border:1px solid rgba(124,58,237,0.25); border-radius:14px; font-size:0.7rem; color:var(--text); cursor:pointer; transition:all 0.15s; max-width:160px; }
.trait-preset-chip:hover { background:rgba(124,58,237,0.25); border-color:var(--primary); }
.trait-preset-chip.active { background:rgba(124,58,237,0.4); border-color:var(--primary); color:#fff; }
.trait-preset-chip .preset-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.trait-preset-chip .preset-del { color:var(--text-muted); font-size:0.65rem; margin-left:2px; flex-shrink:0; line-height:1; }
.trait-preset-chip .preset-del:hover { color:#ef4444; }
.trait-preset-save { display:inline-flex; align-items:center; gap:3px; padding:4px 8px; background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:14px; font-size:0.65rem; color:var(--text-muted); cursor:pointer; transition:all 0.15s; }
.trait-preset-save:hover { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); color:var(--text); }
.preset-save-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:10000; display:flex; align-items:center; justify-content:center; }
.preset-save-modal { background:var(--bg-card); border:1px solid var(--border); border-radius:14px; padding:24px; width:340px; max-width:90vw; }
.preset-save-modal h3 { margin:0 0 16px; font-size:0.95rem; }
.preset-save-modal input { width:100%; padding:10px 12px; background:rgba(0,0,0,0.3); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.85rem; font-family:inherit; outline:none; }
.preset-save-modal input:focus { border-color:var(--primary); }
.preset-save-modal .preset-summary { font-size:0.7rem; color:var(--text-muted); margin-top:8px; line-height:1.4; }
.preset-save-btns { display:flex; gap:8px; margin-top:16px; justify-content:flex-end; }
.preset-save-btns button { padding:8px 18px; border-radius:8px; border:none; font-size:0.8rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.preset-save-btns .btn-cancel { background:rgba(255,255,255,0.06); color:var(--text-muted); }
.preset-save-btns .btn-cancel:hover { background:rgba(255,255,255,0.1); color:var(--text); }
.preset-save-btns .btn-save { background:var(--primary); color:#fff; }
.preset-save-btns .btn-save:hover { background:#9333ea; }
.trait-settings-row { display:flex; align-items:center; justify-content:space-between; font-size:0.75rem; }
.trait-settings-label { color:var(--text-muted); }
.trait-settings-toggle { display:flex; gap:0; border-radius:6px; overflow:hidden; border:1px solid rgba(255,255,255,0.1); }
.trait-settings-toggle button { padding:3px 10px; font-size:0.7rem; background:transparent; border:none; color:var(--text-muted); cursor:pointer; transition:all 0.15s; }
.trait-settings-toggle button.active { background:rgba(124,58,237,0.3); color:var(--text); }
.trait-settings-toggle button:hover:not(.active) { background:rgba(255,255,255,0.05); }
.trait-settings-check { display:flex; align-items:center; gap:6px; cursor:pointer; }
.trait-settings-check input { accent-color:var(--primary); }
.active-filters { display:flex; flex-wrap:wrap; gap:6px; padding:14px 24px; border-bottom:1px solid var(--border); }
.active-filters:empty { display:none; }
.filter-chip { display:flex; align-items:center; gap:4px; padding:4px 10px; background:rgba(124,58,237,0.2); border:1px solid rgba(124,58,237,0.3); border-radius:16px; font-size:0.75rem; cursor:pointer; }
.filter-chip:hover { background:rgba(239,68,68,0.2); border-color:rgba(239,68,68,0.3); }
.clear-filters { color:var(--danger); cursor:pointer; font-size:0.75rem; padding:4px 8px; }
.sidebar-section-header { display:flex; align-items:center; justify-content:space-between; cursor:pointer; padding:2px 0; margin-bottom:12px; }
.sidebar-section-header:hover { opacity:0.8; }
.sidebar-chevron { width:16px; height:16px; color:var(--text-muted); transition:transform 0.2s; flex-shrink:0; }
.sidebar-section-header.collapsed .sidebar-chevron { transform:rotate(-90deg); }
.sidebar-section-body { overflow:hidden; transition:max-height 0.25s ease; max-height:200px; }
.sidebar-section-body:not(.open) { max-height:0; margin:0; }
#clearTraitFiltersBtn:hover { color:var(--danger) !important; }
.cic-royalty-crown { display:none; position:relative; cursor:default; margin-left:2px; }
.cic-royalty-crown img { height:20px; width:20px; opacity:0.7; transition:opacity 0.15s; }
.cic-royalty-crown:hover img { opacity:1; }
.cic-royalty-crown .crown-tip { position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%); background:var(--bg-card); border:1px solid var(--border); border-radius:6px; padding:6px 10px; font-size:0.7rem; color:var(--text); white-space:nowrap; pointer-events:none; opacity:0; transition:opacity 0.15s; z-index:20; line-height:1.5; }
.cic-royalty-crown:hover .crown-tip { opacity:1; }

/* Grid */
.grid-area { flex:1; padding:12px 24px 48px; overflow-y:auto; overflow-x:hidden; }
.nft-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:16px; }
.nft-card { background:var(--bg-card); border:1px solid var(--border); border-radius:12px; cursor:pointer; transition:transform 0.2s, border-color 0.2s, background 0.2s, box-shadow 0.2s; position:relative; contain:layout style; content-visibility:auto; contain-intrinsic-size:280px 320px; }
.nft-card:hover { transform:translateY(-2px); border-color:var(--primary); background:var(--bg-card-hover); z-index:5; }
.instant-sell-card { border:1px solid rgba(124,58,237,0.2) !important; background:linear-gradient(168deg,rgba(124,58,237,0.06) 0%,rgba(10,10,30,0.98) 50%) !important; cursor:default !important; }
.instant-sell-card:hover { border-color:rgba(124,58,237,0.4) !important; transform:translateY(-2px); }
.instant-sell-card .is-sell-btn:not(:disabled):hover { background:#6d28d9; }
.instant-sell-card .is-sell-btn:disabled { opacity:0.35; cursor:not-allowed; }
.nft-card img { width:100%; aspect-ratio:1; object-fit:cover; background:var(--bg-card); transition:opacity 0.3s; }
.nft-card img.loading { opacity:0.4; filter:blur(4px); }
.nft-card img.loaded { opacity:1; filter:none; }
.card-badges-br { position:absolute; bottom:8px; right:8px; display:flex; flex-direction:column; gap:4px; align-items:flex-end; z-index:2; pointer-events:none; }
.card-badge-mine { background:rgba(59,130,246,0.9); color:#fff; font-size:0.6rem; font-weight:700; padding:2px 8px; border-radius:6px; letter-spacing:0.5px; text-transform:uppercase; }
.card-badges-bl { position:absolute; bottom:8px; left:8px; z-index:3; display:flex; flex-direction:column; gap:4px; align-items:flex-start; pointer-events:none; }
.card-badge-bot { background:rgba(239,68,68,0.85); color:#fff; font-size:0.55rem; font-weight:700; padding:2px 6px; border-radius:6px; display:flex; align-items:center; gap:3px; pointer-events:none; letter-spacing:0.3px; backdrop-filter:blur(4px); }
.card-badge-royalty { background:rgba(159,18,57,0.92); color:#fff; font-size:0.55rem; font-weight:700; padding:2px 6px; border-radius:6px; display:flex; align-items:center; gap:3px; pointer-events:auto; letter-spacing:0.3px; backdrop-filter:blur(4px); border:1px solid rgba(255,255,255,0.18); }
.card-badge-royalty img { height:9px; width:9px; }
.card-badge-unlisted { background:rgba(0,0,0,0.7); color:var(--text-muted); font-size:0.65rem; padding:3px 8px; border-radius:6px; font-weight:600; }
.card-fav { position:absolute; top:8px; left:8px; z-index:5; width:22px; height:22px; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; pointer-events:none; transition:all 0.15s; color:rgba(255,255,255,0.5); }
.nft-card:hover .card-fav { opacity:1; pointer-events:auto; }
.card-fav.active { opacity:1; pointer-events:auto; color:#fbbf24; }
.card-fav:hover { color:#fbbf24; transform:scale(1.2); }
.nft-card .card-body { padding:12px; }
/* Flex-row so inline badges (cNFT) sit beside the name, and their absolute-
 * positioned tooltips can escape the container. Ellipsis is applied to the
 * inner .nft-name-text span since overflow:hidden on the outer box would
 * clip the tooltip. */
.nft-card .nft-name { font-size:0.875rem; font-weight:600; margin-bottom:4px; display:flex; align-items:center; gap:5px; min-width:0; }
.nft-card .nft-name-text { flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nft-card .nft-price { font-size:1rem; font-weight:700; position:relative; }
.price-breakdown { display:none; position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%); background:rgba(10,10,26,0.95); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,0.12); border-radius:10px; padding:10px 14px; z-index:50; min-width:200px; pointer-events:none; box-shadow:0 8px 32px rgba(0,0,0,0.6); }
.price-breakdown::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top-color:rgba(255,255,255,0.12); }
.nft-price:hover .price-breakdown { display:block; }
.pb-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:3px 0; font-size:0.72rem; }
.pb-row .pb-label { color:rgba(255,255,255,0.5); white-space:nowrap; }
.pb-row .pb-value { color:#fff; font-weight:600; font-family:'JetBrains Mono',monospace; white-space:nowrap; font-size:0.7rem; }
.pb-row .pb-pct { color:rgba(255,255,255,0.35); font-size:0.62rem; margin-left:4px; }
.pb-row.pb-total { border-top:1px solid rgba(255,255,255,0.1); padding-top:6px; margin-top:3px; }
.pb-row.pb-total .pb-label { color:rgba(255,255,255,0.7); font-weight:600; }
.pb-row.pb-total .pb-value { color:#14F195; }
.nft-card .card-footer { display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.card-last-sale { font-size:0.62rem; color:#8b93a8; white-space:nowrap; display:inline-flex; align-items:center; gap:2px; margin-left:auto; }
.card-last-sale svg { flex-shrink:0; }
.card-collection-link { display:block; font-size:0.65rem; color:var(--text-muted); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-decoration:none; transition:color 0.15s; }
.card-collection-link:hover { color:#c4b5fd; }
/* Re-Roll Dice Card */
.reroll-dice-card { border:2px dashed var(--primary); }
.reroll-dice-card:hover { border-color:var(--primary); box-shadow:0 0 20px rgba(153,69,255,0.2); }
.reroll-dice-card.reroll-sold-out { border-color:rgba(100,100,100,0.4); opacity:0.7; cursor:default; }
.reroll-dice-card.reroll-sold-out:hover { box-shadow:none; border-color:rgba(100,100,100,0.4); }
.reroll-dice-card.reroll-sold-out .reroll-dice-svg { animation:none; }
.reroll-select-banner { display:none; position:sticky; top:0; z-index:50; background:linear-gradient(135deg,rgba(153,69,255,0.25),rgba(99,44,187,0.25)); border:1px solid rgba(153,69,255,0.4); border-radius:10px; padding:12px 20px; margin-bottom:12px; align-items:center; justify-content:space-between; gap:12px; backdrop-filter:blur(12px); }
.reroll-select-banner.active { display:flex; }
.reroll-select-banner .banner-text { font-size:0.85rem; font-weight:600; color:#c084fc; }
.reroll-select-banner .banner-sub { font-size:0.75rem; color:var(--text-muted); }
.reroll-select-banner .btn-cancel { background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); color:#fff; padding:6px 16px; border-radius:8px; font-size:0.75rem; cursor:pointer; }
.reroll-select-banner .btn-cancel:hover { background:rgba(255,255,255,0.15); }
body.reroll-selecting .nft-card:not(.reroll-dice-card):not(.reroll-ineligible) { cursor:pointer; transition:all 0.15s; }
body.reroll-selecting .nft-card:not(.reroll-dice-card):not(.reroll-ineligible):hover { border-color:rgba(153,69,255,0.5); box-shadow:0 0 16px rgba(153,69,255,0.25); }
body.reroll-selecting .nft-card .card-quick-action { display:none; }
body.reroll-selecting .nft-card.reroll-ineligible { opacity:0.35; cursor:not-allowed; pointer-events:none; }
body.reroll-selecting .nft-card.reroll-ineligible::after { content:'Ineligible'; position:absolute; top:8px; right:8px; background:rgba(239,68,68,0.85); color:#fff; font-size:0.65rem; padding:2px 6px; border-radius:4px; z-index:5; }
.reroll-dice-wrap { display:flex; align-items:center; justify-content:center; background:var(--surface); aspect-ratio:1; position:relative; }
.reroll-sound-toggle { position:absolute; bottom:8px; right:8px; width:28px; height:28px; border-radius:50%; background:rgba(0,0,0,0.6); border:1px solid rgba(255,255,255,0.2); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; transition:background 0.15s; }
.reroll-sound-toggle:hover { background:rgba(0,0,0,0.8); }
.reroll-sound-toggle svg { width:14px; height:14px; }
.reroll-traits-btn { position:absolute; bottom:8px; left:8px; width:28px; height:28px; border-radius:50%; background:rgba(0,0,0,0.6); border:1px solid rgba(20,184,166,0.4); color:#14b8a6; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; transition:all 0.15s; }
.reroll-traits-btn:hover { background:rgba(20,184,166,0.25); border-color:rgba(20,184,166,0.7); }
.reroll-traits-btn svg { width:14px; height:14px; }
.reroll-dice-inner { padding:20px; }
.reroll-dice-svg { width:80px; height:80px; animation: diceIdle 3s ease-in-out infinite; }
@keyframes diceIdle {
0%,70% { transform:rotate(0deg); }
80% { transform:rotate(360deg) scale(1.1); }
90% { transform:rotate(720deg); }
100% { transform:rotate(720deg); }
}
.source-badge { padding:2px; border-radius:0; display:inline-flex; align-items:center; justify-content:center; position:relative; background:transparent; }
.source-badge img { height:18px; width:18px; border-radius:0; object-fit:contain; vertical-align:middle; }
.source-badge.source-external { cursor:pointer; transition:transform 0.15s; }
.source-badge.source-external:hover { transform:scale(1.15); }
.source-badge .source-tip { position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%) translateY(4px); background:rgba(20,20,25,0.98); border:1px solid rgba(139,92,246,0.3); border-radius:8px; padding:6px 10px; font-size:0.7rem; color:rgba(255,255,255,0.85); white-space:nowrap; z-index:200; pointer-events:none; opacity:0; visibility:hidden; transition:all 0.2s ease; box-shadow:0 4px 16px rgba(0,0,0,0.5); display:flex; align-items:center; gap:6px; }
.source-badge .source-tip::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:rgba(139,92,246,0.3); }
.source-badge .source-tip .tip-label { font-size:0.6rem; text-transform:uppercase; letter-spacing:0.5px; color:rgba(255,255,255,0.5); }
.source-badge .source-tip .tip-name { font-weight:600; color:#fff; }
.source-badge:hover .source-tip { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.relist-earn-badge { padding:2px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; position:relative; cursor:pointer; transition:transform 0.15s; }
.relist-earn-badge:hover { transform:scale(1.15); }
.relist-earn-badge img { height:18px; width:18px; filter:drop-shadow(0 0 4px rgba(124,58,237,0.5)); }
.relist-earn-badge .relist-earn-tip { position:absolute; top:calc(100% + 8px); right:0; background:linear-gradient(135deg,rgba(124,58,237,0.98),rgba(76,29,149,0.98)); border:1px solid rgba(168,139,250,0.5); border-radius:8px; padding:6px 10px; font-size:0.7rem; font-weight:600; color:#fff; white-space:nowrap; z-index:1000; pointer-events:none; opacity:0; visibility:hidden; transform:translateY(-4px); transition:all 0.2s ease; box-shadow:0 6px 20px rgba(124,58,237,0.4), 0 2px 6px rgba(0,0,0,0.5); display:flex; align-items:center; gap:4px; }
.relist-earn-badge .relist-earn-tip::after { content:''; position:absolute; bottom:100%; right:10px; border:5px solid transparent; border-bottom-color:rgba(168,139,250,0.5); }
.relist-earn-badge:hover .relist-earn-tip { opacity:1; visibility:visible; transform:translateY(0); }
@keyframes orbPulse { 0%,100% { filter:drop-shadow(0 0 4px rgba(124,58,237,0.5)); } 50% { filter:drop-shadow(0 0 8px rgba(124,58,237,0.8)); } }
.relist-earn-badge img { animation:orbPulse 2s ease-in-out infinite; }
.rank-badge { font-size:0.65rem; font-weight:700; display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:20px; margin-top:4px; cursor:default; position:relative; letter-spacing:0.02em; }
.rank-common { background:rgba(107,114,128,0.25); color:#9ca3af; }
.rank-uncommon { background:rgba(34,197,94,0.18); color:#22c55e; }
.rank-rare { background:rgba(59,130,246,0.2); color:#60a5fa; }
.rank-epic { background:rgba(168,85,247,0.2); color:#c084fc; }
.rank-legendary { background:rgba(245,158,11,0.2); color:#fbbf24; }
.rank-mythic { background:linear-gradient(135deg, rgba(255,69,0,0.25), rgba(255,0,128,0.25)); color:#ff6b6b; text-shadow:0 0 8px rgba(255,69,0,0.3); }
/* Tooltip inherits the badge's text color via `color: inherit`, so each tier
 * shows its own accent color. Border tint comes from currentColor too. */
.rank-badge .rank-tooltip { display:none; position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:var(--bg-card); border:1px solid currentColor; border-radius:8px; padding:6px 10px; font-size:0.7rem; font-weight:600; white-space:nowrap; z-index:20; pointer-events:none; color:inherit; box-shadow:0 4px 12px rgba(0,0,0,0.3); }
.rank-badge .rank-tooltip::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:currentColor; }
.rank-badge:hover .rank-tooltip { display:block; }

/* Compressed-NFT marker — small stylised C shown inline after the NFT name
 * in the grid and after the collection name in the detail popup. Renders as
 * an <img> referencing /images/brand/cnft.webp. Tooltip is a nested span
 * (not data-tip) to avoid colliding with the global [data-tip] rules later
 * in this file, which would force the popup to the right of the icon. */
.cnft-badge {
    display:inline-block;
    width:14px; height:14px;
    vertical-align:-3px; margin-left:5px;
    flex-shrink:0; cursor:default; position:relative;
}
.cnft-badge img {
    width:100%; height:100%; object-fit:contain; display:block;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.4));
}
.cnft-badge-tip {
    position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
    background:#1a1a2e; border:1px solid rgba(124,58,237,0.5); border-radius:6px;
    padding:4px 8px; font-size:0.68rem; font-weight:500; color:#c4b5fd;
    white-space:nowrap; z-index:9999; pointer-events:none;
    opacity:0; visibility:hidden;
    transition:opacity 0.12s, visibility 0.12s;
    box-shadow:0 4px 12px rgba(0,0,0,0.5);
}
.cnft-badge:hover .cnft-badge-tip { opacity:1; visibility:visible; }

/* Custom data badges — body */
.custom-badges { display:flex; flex-wrap:wrap; gap:3px; margin-top:3px; }
.custom-badge { font-size:0.6rem; font-weight:600; display:inline-flex; align-items:center; gap:3px; padding:1px 6px; border-radius:10px; cursor:default; position:relative; }
.custom-badge img.cb-icon { width:12px; height:12px; object-fit:contain; flex-shrink:0; }
.custom-badge .cb-tooltip { display:none; position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:var(--bg-card); border:1px solid var(--border); border-radius:8px; padding:8px 10px; font-size:0.7rem; font-weight:500; white-space:nowrap; z-index:20; pointer-events:none; color:var(--text); box-shadow:0 4px 12px rgba(0,0,0,0.3); }
.custom-badge .cb-tooltip::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:var(--border); }
.custom-badge:hover .cb-tooltip { display:block; }
/* Badge style: square */
.custom-badge.cb-square { border-radius:4px; padding:2px 5px; }
/* Badge style: icon-only (no background) */
.custom-badge.cb-icon-only { background:none !important; padding:0; gap:2px; }
.custom-badge.cb-icon-only img.cb-icon { width:14px; height:14px; }
/* Overlay badges on image */
.custom-overlay-badges { position:absolute; z-index:2; pointer-events:none; display:flex; flex-direction:column; gap:3px; }
.custom-overlay-badges .custom-badge { pointer-events:auto; backdrop-filter:blur(4px); font-size:0.6rem; }
.custom-overlay-tl { top:6px; left:6px; align-items:flex-start; }
.custom-overlay-tr { top:6px; right:6px; align-items:flex-end; }
.custom-overlay-bl { bottom:6px; left:6px; align-items:flex-start; }
.custom-overlay-br { bottom:6px; right:6px; align-items:flex-end; }

/* Quick action button on card hover */
.card-img-wrap { position:relative; overflow:hidden; border-radius:12px 12px 0 0; aspect-ratio:1; }
.card-quick-action { position:absolute; bottom:0; left:0; right:0; padding:10px; background:linear-gradient(transparent, rgba(0,0,0,0.85) 40%); display:flex; justify-content:center; opacity:0; transition:opacity 0.2s; z-index:3; pointer-events:none; border-radius:0; }
.nft-card:hover .card-quick-action { opacity:1; pointer-events:auto; }
.card-quick-btn { padding:8px 20px; border:none; border-radius:8px; font-size:0.8rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.card-quick-btn.buy { background:#7c3aed; color:white; }
.card-quick-btn.buy:hover { background:#9333ea; }
.card-quick-btn.manage { background:rgba(255,255,255,0.15); color:var(--text); }
.card-quick-btn.manage:hover { background:rgba(255,255,255,0.25); }

/* Multi-image card arrows */
.card-img-arrows { position:absolute; top:50%; left:0; right:0; display:flex; justify-content:space-between; transform:translateY(-50%); z-index:4; padding:0 4px; opacity:0; transition:opacity 0.2s; pointer-events:none; }
.nft-card:hover .card-img-arrows { opacity:1; pointer-events:auto; }
.card-img-arrow { width:24px; height:24px; border-radius:50%; background:rgba(0,0,0,0.65); border:none; color:white; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:14px; line-height:1; transition:background 0.15s; backdrop-filter:blur(4px); }
.card-img-arrow:hover { background:rgba(0,0,0,0.9); }
.card-img-dots { position:absolute; bottom:6px; left:50%; transform:translateX(-50%); display:flex; gap:4px; z-index:4; pointer-events:none; }
.card-img-dot { width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,0.35); transition:background 0.2s; }
.card-img-dot.active { background:rgba(255,255,255,0.95); }

/* Pool/AMM card */
.pool-card { cursor:pointer; }
.pool-card .pool-stack { position:relative; width:100%; aspect-ratio:1; }
.pool-card .pool-stack img { position:absolute; width:70%; aspect-ratio:1; object-fit:cover; border-radius:8px; border:2px solid var(--bg-card); }
.pool-card .pool-stack img:nth-child(1) { top:0; left:0; z-index:3; }
.pool-card .pool-stack img:nth-child(2) { top:8%; left:15%; z-index:2; opacity:0.7; }
.pool-card .pool-stack img:nth-child(3) { top:16%; left:30%; z-index:1; opacity:0.4; }
.pool-card .pool-badge { position:absolute; top:8px; left:8px; background:rgba(0,0,0,0.75); backdrop-filter:blur(4px); border-radius:10px; padding:3px 10px; font-size:0.7rem; font-weight:600; color:#fff; z-index:5; display:flex; align-items:center; gap:4px; }
.pool-card .pool-price-range { font-size:0.75rem; color:var(--text-muted); margin-top:2px; }
.pool-card.pool-unavailable { opacity:0.45; pointer-events:none; position:relative; }
.pool-card.pool-unavailable .pool-unavailable-overlay { position:absolute; inset:0; z-index:10; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.5); border-radius:var(--radius-card, 12px); backdrop-filter:blur(2px); }
.pool-card.pool-unavailable .pool-unavailable-overlay span { background:rgba(239,68,68,0.9); color:#fff; padding:6px 14px; border-radius:8px; font-size:0.75rem; font-weight:600; text-align:center; line-height:1.3; }
.pool-expand-btn { background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3); border-radius:6px; padding:3px 8px; color:#a78bfa; cursor:pointer; font-size:0.65rem; font-weight:600; display:inline-flex; align-items:center; gap:4px; transition:all 0.15s; margin-left:auto; }
.pool-expand-btn:hover { background:rgba(124,58,237,0.35); border-color:rgba(124,58,237,0.5); color:#c4b5fd; }

/* Pool expand modal */
.pool-modal-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:9999; display:flex; align-items:center; justify-content:center; }
.pool-modal { background:var(--bg-card); border:1px solid var(--border); border-radius:16px; padding:24px; max-width:800px; width:90vw; max-height:80vh; overflow-y:auto; }
.pool-modal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.pool-modal-header h3 { margin:0; font-size:1rem; }
.pool-modal-close { background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:1.5rem; line-height:1; padding:4px; }
.pool-modal-close:hover { color:var(--text); }
.pool-modal-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:12px; }
.pool-nft-card { background:rgba(0,0,0,0.2); border:1px solid var(--border); border-radius:10px; overflow:hidden; cursor:pointer; transition:all 0.15s; }
.pool-nft-card:hover { border-color:var(--primary); transform:translateY(-2px); }
.pool-nft-card img { width:100%; aspect-ratio:1; object-fit:cover; }
.pool-nft-card .pool-nft-info { padding:8px 10px; }
.pool-nft-card .pool-nft-name { font-size:0.8rem; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pool-nft-card .pool-nft-price { font-size:0.85rem; font-weight:700; margin-top:4px; }
.pool-nft-card .pool-nft-buy { width:100%; padding:8px; background:var(--primary); border:none; border-radius:0 0 10px 10px; color:#fff; font-size:0.8rem; font-weight:600; cursor:pointer; font-family:inherit; }
.pool-nft-card .pool-nft-buy:hover { background:#9333ea; }

/* Modal thumbnail strip */
.modal-thumb-strip { display:flex; gap:6px; margin-top:8px; }
.modal-thumb { width:48px; height:48px; min-width:48px; max-width:48px; border-radius:6px; object-fit:cover; cursor:pointer; border:2px solid transparent; opacity:0.6; transition:all 0.15s; }
.modal-thumb.active { border-color:var(--primary, #7c3aed); opacity:1; }
.modal-thumb:hover { opacity:1; }

/* Skeleton loading */
@keyframes shimmer { 0% { background-position:-400px 0; } 100% { background-position:400px 0; } }
@keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
.skeleton-card { background:var(--bg-card); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.skeleton-img { width:100%; aspect-ratio:1; background:linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%); background-size:800px 100%; animation:shimmer 1.5s infinite; }
.skeleton-text { height:14px; border-radius:4px; background:linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%); background-size:800px 100%; animation:shimmer 1.5s infinite; margin:12px; }
.skeleton-text.short { width:40%; height:12px; margin-top:8px; }
.offer-indicator { font-size:0.7rem; color:var(--text-muted); margin-top:4px; }

/* Grid size toggle */
.grid-size-toggle { display:flex; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; overflow:hidden; height:34px; box-sizing:border-box; }
.grid-size-toggle button { width:34px; height:34px; background:none; border:none; color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; box-sizing:border-box; }
.grid-size-toggle button.active { background:rgba(124,58,237,0.25); color:var(--text); }
.grid-size-toggle button:hover:not(.active) { background:rgba(255,255,255,0.05); }
.nft-grid.grid-sm { grid-template-columns:repeat(auto-fill, minmax(115px, 1fr)); gap:8px; }
.nft-grid.grid-sm .nft-card .card-body { padding:6px 8px; }
.nft-grid.grid-sm .nft-card .nft-name { font-size:0.7rem; margin-bottom:2px; }
.nft-grid.grid-sm .nft-card .nft-price { font-size:0.78rem; }
.nft-grid.grid-sm .nft-card .card-footer { margin-top:4px; }
.nft-grid.grid-md { grid-template-columns:repeat(auto-fill, minmax(165px, 1fr)); gap:12px; }
.nft-grid.grid-md .nft-card .card-body { padding:8px 10px; }
.nft-grid.grid-md .nft-card .nft-name { font-size:0.78rem; }
.nft-grid.grid-md .nft-card .nft-price { font-size:0.88rem; }
.nft-grid.grid-lg { grid-template-columns:repeat(auto-fill, minmax(270px, 1fr)); gap:16px; }


/* Loading */
.loading { display:flex; justify-content:center; align-items:center; padding:60px; }
.spinner { width:40px; height:40px; border:3px solid var(--border); border-top-color:var(--primary); border-radius:50%; animation:spin 0.8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.empty-state { text-align:center; padding:60px 20px; color:var(--text-muted); }

/* Modal */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:300; display:none; align-items:center; justify-content:center; padding:20px; }
.modal-overlay.open { display:flex; }
.modal { background:#1a1a2e; border:1px solid var(--border); border-radius:16px; max-width:800px; width:100%; max-height:90vh; overflow-y:auto; }
.modal-header { display:flex; align-items:center; gap:8px; padding:20px 24px; border-bottom:1px solid var(--border); }
.modal-header h2 { font-size:1.4rem; flex:1; font-weight:700; }
.modal-close { background:none; border:none; color:var(--text-muted); font-size:1.5rem; cursor:pointer; padding:4px 8px; border-radius:6px; transition:all 0.15s; }
.modal-close:hover { color:var(--text); background:rgba(255,255,255,0.1); }
.modal-body { padding:24px; }
.modal-detail { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.modal-detail img { width:100%; border-radius:12px; }
.detail-info h3 { font-size:1.5rem; margin-bottom:8px; }
.price-display { font-size:2rem; font-weight:800; margin:16px 0; }
.fee-breakdown { font-size:0.8rem; color:var(--text-muted); margin-bottom:16px; }
.fee-breakdown div { display:flex; justify-content:space-between; padding:4px 0; }
.btn-primary { width:100%; padding:14px; background:#7c3aed; color:white; border:none; border-radius:10px; font-size:1rem; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.2s; }
.btn-primary:hover { background:#9333ea; }

/* Custom dialog */
.dialog-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.75); z-index:400; display:flex; align-items:center; justify-content:center; padding:20px; animation:fadeIn 0.15s; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.dialog-box { background:#1a1a2e; border:1px solid var(--border); border-radius:16px; width:100%; max-width:400px; overflow:hidden; animation:slideUp 0.2s; }
@keyframes slideUp { from { transform:translateY(20px); } to { transform:translateY(0); } }
.dialog-body { padding:24px; }
.dialog-title { font-size:1.1rem; font-weight:700; margin-bottom:12px; }
.dialog-text { color:var(--text-muted); font-size:0.9rem; line-height:1.5; margin-bottom:16px; }
.dialog-input { width:100%; padding:12px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:1rem; font-family:inherit; outline:none; margin-bottom:16px; }
.dialog-input:focus { border-color:var(--primary); }
.dialog-actions { display:flex; gap:10px; }
.dialog-actions button { flex:1; padding:12px; border:none; border-radius:10px; font-size:0.9rem; font-weight:600; cursor:pointer; font-family:inherit; transition:background-color 0.15s; }
.dialog-btn-cancel { background:rgba(255,255,255,0.1); color:var(--text); }
.dialog-btn-cancel:hover { background:rgba(255,255,255,0.15); }
.dialog-btn-confirm { background:var(--primary); color:white; }
.dialog-btn-confirm:hover { background:var(--primary-hover); }
.dialog-btn-danger { background:var(--danger); color:white; }
.dialog-btn-danger:hover { background:#dc2626; }
.btn-primary:disabled { opacity:0.5; cursor:not-allowed; }

/* Success screen */
.success-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:300; display:flex; align-items:center; justify-content:center; padding:20px; animation:fadeIn 0.15s; }
.success-box { background:#1a1a2e; border:1px solid var(--border); border-radius:16px; width:100%; max-width:420px; padding:32px; text-align:center; animation:slideUp 0.25s; }
.success-icon { width:64px; height:64px; background:rgba(16,185,129,0.15); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.success-icon svg { width:32px; height:32px; color:var(--success); }
@keyframes successPop { 0% { transform:scale(0); } 50% { transform:scale(1.2); } 100% { transform:scale(1); } }
.success-icon svg { animation:successPop 0.4s ease-out; }
.success-title { font-size:1.2rem; font-weight:700; margin-bottom:8px; }
.success-subtitle { color:var(--text-muted); font-size:0.85rem; margin-bottom:20px; }
.success-nft-img { width:80px; height:80px; border-radius:12px; object-fit:cover; border:1px solid var(--border); margin-bottom:16px; }
.success-actions { display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.success-actions a, .success-actions button { display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border-radius:10px; font-size:0.875rem; font-weight:600; cursor:pointer; font-family:inherit; text-decoration:none; transition:all 0.2s; border:none; }
.success-btn-explorer { background:rgba(255,255,255,0.1); color:var(--text); }
.success-btn-explorer:hover { background:rgba(255,255,255,0.15); }
.success-btn-stake { background:rgba(16,185,129,0.2); color:var(--success); }
.success-btn-stake:hover { background:rgba(16,185,129,0.3); }
.success-btn-close { background:var(--primary); color:white; }
.success-btn-close:hover { background:var(--primary-hover); }

/* Bulk success — thumbnail strip for multi-NFT relist success */
.success-box.bulk { max-width: 480px; }
.success-bulk-thumbs {
    display:flex; flex-wrap:wrap; gap:8px; justify-content:center;
    margin:0 auto 16px; max-width:420px;
}
.success-bulk-thumbs .sbt-img {
    width:56px; height:56px; border-radius:10px;
    object-fit:cover; border:1px solid var(--border);
    background:rgba(0,0,0,0.4);
}
.success-bulk-thumbs .sbt-more {
    width:56px; height:56px; border-radius:10px;
    background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3);
    display:flex; align-items:center; justify-content:center;
    color:#c4b5fd; font-size:0.78rem; font-weight:700;
}

/* Share button */
.share-btn { display:flex; align-items:center; gap:6px; padding:8px 14px; background:rgba(255,255,255,0.08); border:1px solid var(--border); border-radius:8px; color:var(--text-muted); font-size:0.8rem; cursor:pointer; font-family:inherit; transition:all 0.2s; position:relative; }
.share-btn:hover { background:rgba(255,255,255,0.12); color:var(--text); border-color:rgba(255,255,255,0.2); }

/* Custom tooltips (appear to the right by default) */
[data-tip] { position:relative; }
[data-tip]::after { position:absolute; top:50%; left:calc(100% + 8px); transform:translateY(-50%); background:rgba(15,15,30,0.95); border:1px solid var(--border); border-radius:8px; padding:6px 12px; font-size:0.7rem; font-weight:500; color:var(--text); white-space:nowrap; z-index:50; pointer-events:none; box-shadow:0 4px 16px rgba(0,0,0,0.4); }
[data-tip]::before { position:absolute; top:50%; left:calc(100% + 2px); transform:translateY(-50%); border:5px solid transparent; border-right-color:var(--border); z-index:51; pointer-events:none; }
[data-tip]:hover::after { content:attr(data-tip); }
[data-tip]:hover::before { content:''; }
/* Tooltip variant: appear to the left */
[data-tip].tip-left::after { top:50%; left:auto; right:calc(100% + 8px); transform:translateY(-50%); }
[data-tip].tip-left::before { top:50%; left:auto; right:calc(100% + 2px); transform:translateY(-50%); border-right-color:transparent; border-left-color:var(--border); }

/* Owner wallet clickable */
.modal-owner-wallet { font-family:monospace; cursor:pointer; color:var(--text-muted); transition:color 0.15s; }
.modal-owner-wallet:hover { color:#c4b5fd; text-decoration:underline; }

/* Detail mint/collection addresses */
.detail-address { font-family:monospace; cursor:pointer; color:var(--text-muted); transition:color 0.15s; display:inline-flex; align-items:center; gap:4px; }
.detail-address:hover { color:#c4b5fd; }
.detail-address .copy-tick { display:none; color:var(--success); }
.detail-address.copied .copy-tick { display:inline; }
.detail-address.copied .copy-text { display:none; }
.btn-outline { width:100%; padding:12px; background:none; border:1px solid var(--border); color:var(--text); border-radius:10px; font-size:0.875rem; cursor:pointer; font-family:inherit; margin-top:8px; }
#tab-my-offers .btn-outline { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); color:#c4b5fd; }
#tab-my-offers .btn-outline:hover { background:rgba(124,58,237,0.25); border-color:rgba(124,58,237,0.5); }
.btn-outline:hover { border-color:var(--primary); }
.btn-danger { background:var(--danger); }
.btn-danger:hover { background:#dc2626; }

/* Lightbox */
.lightbox-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.92); z-index:400; display:flex; align-items:center; justify-content:center; cursor:zoom-out; animation:fadeIn 0.2s; }
.lightbox-overlay img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:8px; }
.lightbox-close { position:fixed; top:20px; right:20px; background:none; border:none; color:white; font-size:2rem; cursor:pointer; z-index:401; line-height:1; }

/* NFT History mini-feed */
/* NFT Activity table */
.nft-activity-table { width:100%; border-collapse:collapse; font-size:0.75rem; }
.nft-activity-table th { font-size:0.6rem; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); font-weight:600; padding:6px 4px; text-align:left; border-bottom:1px solid var(--border); white-space:nowrap; }
.nft-activity-table td { padding:8px 4px; border-bottom:1px solid rgba(255,255,255,0.04); vertical-align:middle; white-space:nowrap; }
.nft-activity-table tr:last-child td { border-bottom:none; }
.nft-activity-table .act-wallet { font-family:monospace; color:var(--text-muted); cursor:pointer; transition:color 0.15s; }
.nft-activity-table .act-wallet:hover { color:#c4b5fd; text-decoration:underline; }
.nft-activity-table .act-price { font-weight:600; display:flex; align-items:center; gap:3px; }
.nft-activity-table .act-source img { height:14px; width:14px; vertical-align:-2px; }
.via-orbis { font-size:0.6rem; color:#c4b5fd; opacity:0.85; margin-left:4px; white-space:nowrap; }
.act-you { color:#6d28d9; font-weight:700; font-size:0.75rem; cursor:pointer; }
.act-row-you { background:linear-gradient(90deg, rgba(124,58,237,0.12) 0%, rgba(124,58,237,0.04) 60%, transparent 100%); border-left:2px solid var(--primary); }
.nft-activity-table .act-tx a { display:inline-flex; align-items:center; opacity:0.6; transition:opacity 0.15s; }
.nft-activity-table .act-tx a:hover { opacity:1; }
.nft-history-badge { font-size:0.6rem; padding:2px 6px; border-radius:6px; font-weight:700; text-transform:uppercase; display:inline-block; }
.act-collapsed-pill { display:inline-block; margin-left:4px; padding:1px 5px; font-size:0.6rem; font-weight:700; border-radius:4px; background:rgba(148,163,184,0.15); color:var(--text-muted); vertical-align:1px; cursor:help; letter-spacing:0.02em; }

/* Sales History */
.sales-history-stats { display:flex; gap:24px; margin-bottom:16px; padding:12px 16px; background:rgba(255,255,255,0.03); border-radius:10px; }
.sales-history-stats .sh-stat { text-align:center; }
.sales-history-stats .sh-label { font-size:0.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; }
.sales-history-stats .sh-value { font-size:1rem; font-weight:700; margin-top:2px; display:flex; align-items:center; justify-content:center; gap:3px; }
.sales-chart-wrap { position:relative; margin-bottom:16px; }
.sales-chart-wrap svg { width:100%; height:180px; display:block; }
.sales-chart-dot { cursor:pointer; }
.sales-chart-tooltip { position:absolute; background:rgba(0,0,0,0.9); border:1px solid var(--border); border-radius:8px; padding:6px 10px; font-size:0.7rem; pointer-events:none; white-space:nowrap; z-index:10; display:none; }

/* Offer form */
.offer-form { margin-top:16px; padding:16px; background:rgba(0,0,0,0.3); border-radius:10px; }
#globalOfferQty::-webkit-inner-spin-button, #globalOfferQty::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.offer-form label { font-size:0.8rem; color:var(--text-muted); display:block; margin-bottom:4px; }
.offer-form input, .offer-form select { width:100%; padding:10px; height:auto; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.875rem; font-family:inherit; margin-bottom:12px; outline:none; }

/* Attributes */
.attributes-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:8px; padding-top:8px; }
.attr-item { background:rgba(0,0,0,0.3); padding:10px; border-radius:8px; cursor:pointer; transition:background 0.15s, border-color 0.15s; border:1px solid transparent; }
.attr-item:hover { background:rgba(99,102,241,0.15); border-color:var(--primary); }
.attr-item .attr-type { font-size:0.6rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:2px; }
.attr-item .attr-value { font-size:0.8rem; font-weight:600; margin-bottom:4px; }
.attr-meta { display:flex; justify-content:space-between; align-items:center; gap:4px; }
.attr-pct { font-size:0.6rem; font-weight:600; padding:2px 6px; border-radius:4px; white-space:nowrap; }
.attr-pct.rarity-mythic { background:rgba(255,69,0,0.2); color:#ff6b6b; }
.attr-pct.rarity-legendary { background:rgba(245,158,11,0.18); color:#fbbf24; }
.attr-pct.rarity-epic { background:rgba(168,85,247,0.18); color:#c084fc; }
.attr-pct.rarity-rare { background:rgba(59,130,246,0.18); color:#60a5fa; }
.attr-pct.rarity-uncommon { background:rgba(34,197,94,0.15); color:#22c55e; }
.attr-pct.rarity-common { background:rgba(107,114,128,0.2); color:#9ca3af; }
.attr-floor { font-size:0.65rem; color:var(--success); display:flex; align-items:center; gap:2px; }
.attr-floor img { width:10px; height:10px; }

/* Modal Tabs */
.modal-tabs { display:flex; gap:4px; border-bottom:1px solid var(--border); margin-top:16px; }
.modal-tab { background:none; border:none; color:var(--text-muted); font-size:0.8rem; font-weight:600; padding:8px 16px; cursor:pointer; border-bottom:2px solid transparent; transition:all 0.15s; font-family:inherit; }
.modal-tab:hover { color:var(--text); }
.modal-tab.active { color:#c4b5fd; border-bottom-color:var(--primary); }
.modal-tab-content { display:none; }
.modal-tab-content.active { display:block; }
.modal-tab-content.active#modalTabActivity,
.modal-tab-content.active#modalTabOffers { max-height:40vh; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }

/* NFT Preview Scroller in detail modal */
.modal-nft-scroller { border-top:1px solid var(--border); padding:10px 0 6px; margin-top:8px; position:relative; }
.modal-nft-scroller-label { font-size:0.65rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:0.6px; padding:0 4px 6px; display:flex; align-items:center; justify-content:space-between; }
.modal-nft-scroller-label span { font-weight:600; }
.modal-nft-scroller-nav { display:flex; gap:4px; }
.modal-nft-scroller-nav button { background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:6px; color:var(--text-muted); cursor:pointer; width:24px; height:24px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; padding:0; }
.modal-nft-scroller-nav button:hover { background:rgba(124,58,237,0.2); color:var(--text); border-color:rgba(124,58,237,0.3); }
.modal-nft-scroll-track { display:flex; gap:6px; overflow-x:auto; padding:2px 0 4px; scroll-behavior:smooth; scrollbar-width:none; }
.modal-nft-scroll-track::-webkit-scrollbar { display:none; }
.modal-nft-thumb { width:56px; height:56px; border-radius:8px; object-fit:cover; cursor:pointer; border:2px solid transparent; transition:all 0.15s; flex-shrink:0; background:rgba(255,255,255,0.04); }
.modal-nft-thumb:hover { border-color:rgba(124,58,237,0.5); transform:scale(1.05); }
.modal-nft-thumb.active { border-color:#7c3aed; box-shadow:0 0 8px rgba(124,58,237,0.4); }

/* Offers table */
.offers-sub-btn { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18); color:var(--text-muted); padding:5px 14px; border-radius:20px; font-size:0.78rem; cursor:pointer; transition:all 0.15s; }
.offers-sub-btn:hover { background:rgba(255,255,255,0.14); color:var(--text); border-color:rgba(255,255,255,0.25); }
.offers-sub-btn.active { background:rgba(124,58,237,0.25); color:#fff; border-color:rgba(124,58,237,0.6); font-weight:600; }
.pog-chevron { transform:rotate(0deg); }
.pog-chevron.pog-open { transform:rotate(90deg); }
.offers-table { width:100%; border-collapse:collapse; margin-top:16px; table-layout:fixed; }
.offers-table th { text-align:left; padding:8px; font-size:0.75rem; color:var(--text-muted); border-bottom:1px solid var(--border); }
.offers-table td { padding:8px; font-size:0.85rem; border-bottom:1px solid var(--border); overflow:hidden; text-overflow:ellipsis; }
.offers-table .col-source { width:90px; }
.offers-table .col-amount { width:170px; white-space:nowrap; }
.offers-table .col-qty { width:60px; text-align:center; }
.offers-table .col-action { width:90px; text-align:right; }
.offers-table td:last-child { text-align:right; }
.offers-table .col-buyer { }
.offers-table .col-created { width:80px; }
.offers-table .col-action { }

/* Activity Sidebar (sticky right panel like trait filter) */
.activity-sidebar { width:420px; min-width:420px; background:var(--bg-card); border-left:1px solid var(--border); display:none; flex-direction:column; overflow:hidden; transition:all 0.3s; }
.activity-sidebar.visible { display:flex; }
.activity-sidebar-header { display:flex; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid var(--border); flex-shrink:0; }
.activity-sidebar-header h3 { flex:1; font-size:0.875rem; font-weight:700; margin:0; }
.activity-sidebar-header .panel-expand { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:6px; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.activity-sidebar-header .panel-expand:hover { background:rgba(255,255,255,0.1); color:var(--text); }
.activity-sidebar-header .panel-expand.active { color:#c4b5fd; }
.activity-sidebar-header .panel-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:6px; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.activity-sidebar-header .panel-close:hover { background:rgba(255,255,255,0.1); color:var(--text); }
/* Filter chips + search */
.activity-controls { flex-shrink:0; border-bottom:1px solid var(--border); }
.activity-filter-chips { display:flex; flex-wrap:wrap; gap:4px; padding:8px 14px; }
.activity-chip { display:flex; align-items:center; cursor:pointer; font-size:0.65rem; padding:3px 8px; border-radius:12px; border:1px solid var(--border); color:var(--text-muted); transition:all 0.2s; user-select:none; }
.activity-chip input { display:none; }
.activity-chip.active { background:rgba(124,58,237,0.25); border-color:var(--primary); color:var(--text); }
.activity-search { padding:0 14px 8px; position:relative; }
.activity-search input { width:100%; padding:6px 26px 6px 10px; background:var(--bg); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.7rem; font-family:inherit; outline:none; }
.activity-search input:focus { border-color:var(--primary); }
.activity-search input::placeholder { color:var(--text-muted); }
.activity-search .search-clear { right:20px; }
.activity-panel-body { flex:1; overflow-y:auto; padding:4px 0; overscroll-behavior:contain; }
/* Shared styles */
.activity-badge { font-size:0.6rem; padding:2px 6px; border-radius:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.3px; flex-shrink:0; min-width:48px; text-align:center; display:inline-flex; align-items:center; justify-content:center; gap:3px; line-height:1.2; }
.badge-sale { background:rgba(16,185,129,0.2); color:var(--success); }
.badge-listing { background:rgba(59,130,246,0.2); color:var(--blue); }
.badge-price-update { background:rgba(168,85,247,0.2); color:#a855f7; }
.badge-offer { background:rgba(245,158,11,0.2); color:var(--warning); }
.badge-delist { background:rgba(239,68,68,0.2); color:var(--danger); }
.badge-relist { background:rgba(20,241,149,0.2); color:#14F195; }
.badge-mint { background:rgba(168,85,247,0.2); color:#a855f7; }
.badge-burn { background:rgba(239,68,68,0.25); color:#f87171; }
.badge-reroll { background:rgba(168,85,247,0.2); color:#a855f7; }
.badge-accepted { background:rgba(239,68,68,0.2); color:#f87171; }
.badge-reroll-sale { background:rgba(20,241,149,0.2); color:#14F195; }
.badge-transfer { background:rgba(139,92,246,0.2); color:#c4b5fd; }
.activity-wallet-click { font-family:monospace; font-size:0.68rem; color:var(--text-muted); cursor:pointer; transition:color 0.15s; }
.activity-wallet-click:hover { color:#c4b5fd; text-decoration:underline; }
.act-dot { color:var(--text-muted); font-size:0.7rem; }
/* Shared activity rank badge (reuses rank-* color classes) */
.act-rank-badge { font-size:0.6rem; font-weight:700; padding:1px 5px; border-radius:10px; white-space:nowrap; display:inline-block; line-height:1.4; }
.activity-row-sm .act-rank-badge { font-size:0.5rem; padding:1px 4px; }
/* Shared activity wallet styles */
.act-wallet { font-family:monospace; color:var(--text-muted); cursor:pointer; transition:color 0.15s; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:middle; min-width:0; }
.act-wallet:hover { color:#c4b5fd; text-decoration:underline; }
/* Wallet + copy-icon pairing: inline-flex so the icon never wraps below
   a truncated wallet address. Used in activity-row-lg / xl rendering. */
.act-wallet-wrap { display:inline-flex; align-items:center; gap:3px; min-width:0; max-width:100%; overflow:hidden; }
.act-wallet-wrap .act-wallet { min-width:0; flex:0 1 auto; }
.act-wallet-wrap .act-copy-btn { flex-shrink:0; margin-left:0; }
/* ===== COMPACT VIEW — strict 1 row, 8 columns ===== */
.act-sm-header { display:grid; grid-template-columns:28px 46px minmax(60px,1fr) minmax(60px,1fr) 54px 50px 36px; gap:8px; padding:6px 10px; font-size:0.58rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); border-bottom:1px solid var(--border); position:sticky; top:-4px; padding-top:10px; background:#141428; z-index:1; box-shadow:0 4px 8px rgba(0,0,0,0.5); }
.activity-row-sm { display:grid; grid-template-columns:28px 46px minmax(60px,1fr) minmax(60px,1fr) 54px 50px 36px; gap:8px; align-items:center; padding:6px 10px; cursor:pointer; transition:background 0.15s; border-bottom:1px solid rgba(255,255,255,0.04); font-size:0.72rem; }
.act-sm-header.no-rarity,
.activity-row-sm.no-rarity { grid-template-columns:28px minmax(60px,1fr) minmax(60px,1fr) 54px 50px 36px; }
.activity-row-sm:hover { background:rgba(255,255,255,0.04); }
.activity-row-sm .act-img { width:24px; height:24px; border-radius:4px; object-fit:cover; background:var(--bg); }
.activity-row-sm .act-name { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.activity-row-sm .act-price { font-weight:700; white-space:nowrap; }
.activity-row-sm .act-badge { font-size:0.52rem; padding:2px 5px; border-radius:8px; font-weight:700; text-transform:uppercase; text-align:center; white-space:nowrap; }
.activity-row-sm .act-time { font-size:0.6rem; color:var(--text-muted); white-space:nowrap; justify-self:end; text-align:right; }
.act-sm-header > span:last-child { text-align:right; }
.activity-row-sm .act-copy-btn { display:none; }
/* ===== LARGE VIEW — 2 rows ===== */
/* Row 1: NFT(spans 2) | Name | Action   Row 2: _ | Rank | Seller | Buyer | Price | Time */
.activity-row-lg { display:grid; grid-template-columns:44px 1fr auto; grid-template-rows:auto auto; gap:1px 10px; align-items:center; padding:8px 12px; cursor:pointer; transition:background 0.15s; border-bottom:1px solid rgba(255,255,255,0.04); }
.activity-row-lg:hover { background:rgba(255,255,255,0.04); }
.activity-row-lg .act-img { width:44px; height:44px; border-radius:8px; object-fit:cover; background:var(--bg); grid-row:1/3; }
.activity-row-lg .act-name { font-size:0.85rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.activity-row-lg .act-badge { font-size:0.6rem; padding:3px 8px; border-radius:8px; font-weight:700; text-transform:uppercase; justify-self:end; display:inline-flex; align-items:center; gap:4px; }
.activity-row-lg .act-meta { display:grid; grid-template-columns:auto minmax(0,1fr) 16px minmax(0,1fr) auto auto; align-items:center; gap:0 6px; font-size:0.72rem; grid-column:2/4; overflow:hidden; }
.act-copy-btn { width:11px; height:11px; color:var(--text-muted); cursor:pointer; flex-shrink:0; margin-left:2px; vertical-align:-1px; }
.act-copy-btn:hover { color:var(--text); }
.activity-row-lg .act-meta .act-arrow { color:var(--text-muted); font-size:0.6rem; text-align:center; }
.activity-row-lg .act-price { font-weight:700; white-space:nowrap; display:inline-flex; align-items:center; gap:2px; justify-self:end; }
.activity-row-lg .act-price img { height:12px; width:12px; }
.activity-row-lg .act-time { font-size:0.62rem; color:var(--text-muted); justify-self:end; white-space:nowrap; }
/* ===== X-LARGE VIEW — 3 rows ===== */
/* Row 1: NFT(spans 3) | Name | Action   Row 2: _ | Rank | Seller > Buyer   Row 3: _ | Price(+SOL) | Source | Time */
.activity-row-xl { display:grid; grid-template-columns:80px 1fr auto; grid-template-rows:auto auto auto; gap:2px 12px; align-items:center; padding:10px 12px; cursor:pointer; transition:background 0.15s; border-bottom:1px solid rgba(255,255,255,0.04); }
.activity-row-xl:hover { background:rgba(255,255,255,0.04); }
.activity-row-xl .act-img { width:80px; height:80px; border-radius:10px; object-fit:cover; background:var(--bg); grid-row:1/4; }
.activity-row-xl .act-name { font-size:0.92rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.activity-row-xl .act-badge { font-size:0.62rem; padding:3px 8px; border-radius:8px; font-weight:700; text-transform:uppercase; justify-self:end; display:inline-flex; align-items:center; gap:4px; }
.activity-row-xl .act-row2 { display:grid; grid-template-columns:auto minmax(0,1fr) 18px minmax(0,1fr); align-items:center; gap:0 10px; font-size:0.75rem; grid-column:2/4; overflow:hidden; }
.activity-row-xl .act-row2 .act-arrow { color:var(--text-muted); font-size:0.7rem; text-align:center; justify-self:center; }
.activity-row-xl .act-row3 { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:0 10px; font-size:0.75rem; grid-column:2/4; }
.activity-row-xl .act-price { font-size:0.9rem; font-weight:700; display:inline-flex; align-items:center; gap:2px; }
.activity-row-xl .act-price img { height:14px; width:14px; }
.activity-row-xl .act-source { font-size:0.65rem; color:var(--text-muted); display:inline-flex; align-items:center; gap:3px; }
.activity-row-xl .act-source img { height:14px; width:14px; border-radius:3px; }
.activity-row-xl .act-time { font-size:0.65rem; color:var(--text-muted); justify-self:end; white-space:nowrap; }
/* Activity view toggle */
.activity-view-toggle { display:flex; background:var(--bg); border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.activity-view-toggle button { padding:4px 6px; background:none; border:none; color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.activity-view-toggle button.active { background:rgba(124,58,237,0.25); color:var(--text); }
.activity-view-toggle button:hover:not(.active) { background:rgba(255,255,255,0.05); }
.activity-btn { padding:8px 12px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); cursor:pointer; font-size:0.875rem; font-family:inherit; display:flex; align-items:center; gap:6px; transition:all 0.2s; white-space:nowrap; }
.activity-btn:hover { background:rgba(124,58,237,0.2); border-color:rgba(124,58,237,0.3); }
.activity-btn.active { background:rgba(124,58,237,0.2); border-color:var(--primary); color:var(--text); }
@media (max-width:900px) { .activity-sidebar { position:fixed; top:0; right:0; width:85vw; max-width:380px; height:100vh; z-index:200; min-width:0; border-left:1px solid var(--border); box-shadow:-4px 0 20px rgba(0,0,0,0.5); background:#0f0f1e; } }

/* Activity Page (My Activity mode) */
.activity-page-content { flex:1; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.activity-page-header { padding:16px 20px; border-bottom:1px solid var(--border); flex-shrink:0; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.activity-page-title { font-size:1.1rem; font-weight:700; margin:0; }
.activity-page-filters { flex:1; }
.activity-page-filters .activity-filter-chips { gap:4px; display:flex; flex-wrap:wrap; }
.activity-page-table-wrap { flex:1; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.activity-page-table-header { display:grid; grid-template-columns:150px 1.5fr 80px 110px 110px 90px 70px 120px; gap:8px; padding:10px 16px; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); border-bottom:1px solid var(--border); background:var(--bg-card); position:sticky; top:0; z-index:1; }
.activity-page-table-body { flex:1; overflow-y:auto; overscroll-behavior:contain; }
.activity-page-row { display:grid; grid-template-columns:150px 1.5fr 80px 110px 110px 90px 70px 120px; gap:8px; align-items:center; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.04); transition:background 0.15s; font-size:0.8rem; }
.activity-page-row:hover { background:rgba(255,255,255,0.04); }
.activity-page-row.act-row-you { background:rgba(124,58,237,0.06); }
.activity-page-row .ap-collection { display:flex; align-items:center; gap:8px; min-width:0; cursor:pointer; }
.activity-page-row .ap-collection img { width:24px; height:24px; border-radius:6px; object-fit:cover; flex-shrink:0; }
.activity-page-row .ap-collection span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:500; font-size:0.75rem; transition:color 0.15s; }
.activity-page-row .ap-collection:hover span { color:#c084fc; }
.activity-page-row .ap-nft { display:flex; align-items:center; gap:8px; min-width:0; cursor:pointer; }
.activity-page-row .ap-nft img { width:32px; height:32px; border-radius:6px; object-fit:cover; flex-shrink:0; }
.activity-page-row .ap-nft span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600; transition:color 0.15s; }
.activity-page-row .ap-nft:hover span { color:#c084fc; }
.activity-page-row .ap-price { font-weight:700; display:inline-flex; align-items:center; gap:2px; }
.activity-page-row .ap-time { font-size:0.72rem; color:var(--text-muted); }
.activity-page-row .ap-ago { font-size:0.72rem; color:var(--text-muted); }
.activity-page-row .ap-wallet-cell { display:flex; align-items:center; gap:4px; min-width:0; }
.activity-page-row .act-wallet { font-family:monospace; color:var(--text-muted); cursor:pointer; transition:color 0.15s; }
.activity-page-row .act-wallet:hover { color:#c084fc; text-decoration:underline; }
.activity-page-row .act-you { color:#c084fc; font-weight:700; font-size:0.75rem; cursor:pointer; }
.activity-page-row .act-you:hover { color:#d8b4fe; }
.activity-page-row .ap-copy-btn { background:none; border:none; color:var(--text-dim); cursor:pointer; padding:2px; border-radius:4px; transition:all 0.15s; flex-shrink:0; line-height:0; }
.activity-page-row .ap-copy-btn:hover { color:#c084fc; background:rgba(192,132,252,0.15); }
.activity-page-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:80px 20px; color:var(--text-muted); font-size:0.9rem; }
.activity-page-loading { text-align:center; padding:40px; }
@media (max-width:900px) {
.activity-page-table-header, .activity-page-row { grid-template-columns:100px 1fr 55px 75px 75px 60px 50px 80px; gap:4px; padding:8px 10px; font-size:0.72rem; }
.activity-page-row .ap-copy-btn { display:none; }
.activity-page-row .ap-nft img { width:24px; height:24px; }
}


/* Collection Activity Grid View */
#collectionActivityView { display:flex; flex-direction:column; min-height:0; overflow:hidden; flex:1; }
.ca-filter-bar { padding:10px 16px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:8px; flex-shrink:0; }
.ca-filter-bar .activity-filter-chips { gap:4px; display:flex; flex-wrap:wrap; }
.ca-table-header { display:grid; grid-template-columns:1.5fr 80px 110px 110px 90px 80px; gap:8px; padding:10px 16px; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); border-bottom:1px solid var(--border); background:var(--bg-card); position:sticky; top:0; z-index:1; flex-shrink:0; }
.ca-table-body { flex:1; overflow-y:auto; overscroll-behavior:contain; }
.ca-row { display:grid; grid-template-columns:1.5fr 80px 110px 110px 90px 80px; gap:8px; align-items:center; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.04); transition:background 0.15s; font-size:0.8rem; cursor:pointer; }
.ca-row:hover { background:rgba(255,255,255,0.04); }
.ca-row.act-row-you { background:rgba(124,58,237,0.06); }
.ca-row .ca-nft { display:flex; align-items:center; gap:8px; min-width:0; }
.ca-row .ca-nft img { width:36px; height:36px; border-radius:6px; object-fit:cover; flex-shrink:0; }
.ca-row .ca-nft span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600; }
.ca-row .ca-wallet { display:flex; align-items:center; gap:3px; min-width:0; }
.ca-row .act-wallet { font-family:monospace; font-size:0.75rem; color:var(--text-muted); cursor:pointer; transition:color 0.15s; }
.ca-row .act-wallet:hover { color:#c084fc; text-decoration:underline; }
.ca-row .act-you { color:#c084fc; font-weight:700; font-size:0.75rem; cursor:pointer; }
.ca-row .act-you:hover { color:#d8b4fe; text-decoration:underline; }
.ca-row .ca-copy-btn { background:none; border:none; padding:2px; cursor:pointer; color:var(--text-muted); opacity:0; transition:opacity 0.15s, color 0.15s; flex-shrink:0; }
.ca-row .ca-copy-btn:hover { color:#c084fc; }
.ca-row:hover .ca-copy-btn { opacity:1; }
.ca-row .ca-price { font-weight:700; display:inline-flex; align-items:center; gap:2px; }
.ca-row .ca-time { font-size:0.72rem; color:var(--text-muted); }
@media (max-width:900px) {
.ca-table-header, .ca-row { grid-template-columns:1fr 60px 80px 80px 70px 55px; gap:4px; padding:8px 10px; font-size:0.72rem; }
.ca-row .ca-nft img { width:28px; height:28px; }
}
@media (max-width:640px) {
.ca-table-header, .ca-row { grid-template-columns:1fr 55px 65px 55px; }
.ca-table-header > :nth-child(4), .ca-row > :nth-child(4) { display:none; }
.ca-table-header > :nth-child(6), .ca-row > :nth-child(6) { display:none; }
}

/* Bonus Sidebar */
.bonus-sidebar { width:420px; min-width:420px; background:var(--bg-card); border-left:1px solid var(--border); display:none; flex-direction:column; overflow:hidden; transition:all 0.3s; }
.bonus-sidebar.visible { display:flex; }
.bonus-sidebar-header { display:flex; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid var(--border); flex-shrink:0; }
.bonus-sidebar-header h3 { flex:1; font-size:0.875rem; font-weight:700; margin:0; }
.bonus-sidebar-header .panel-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:6px; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.bonus-sidebar-header .panel-close:hover { background:rgba(255,255,255,0.1); color:var(--text); }
.bonus-panel-body { flex:1; overflow-y:auto; padding:16px; overscroll-behavior:contain; }
@media (max-width:900px) { .bonus-sidebar { position:fixed; top:0; right:0; width:85vw; max-width:380px; height:100vh; z-index:200; min-width:0; border-left:1px solid var(--border); box-shadow:-4px 0 20px rgba(0,0,0,0.5); background:#0f0f1e; } }
/* Bonus content styles */
.mp-bonus-section { margin-bottom:20px; }
.mp-bonus-section-header { display:flex; align-items:center; gap:8px; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid transparent; background:linear-gradient(90deg, rgba(124,58,237,0.1), transparent) padding-box, linear-gradient(90deg, rgba(124,58,237,0.3), rgba(139,92,246,0.2), transparent) border-box; border-image:linear-gradient(90deg, rgba(124,58,237,0.4), rgba(139,92,246,0.2), transparent) 1; }
.mp-bonus-section-title { font-size:0.8rem; font-weight:600; color:rgba(255,255,255,0.7); text-transform:uppercase; letter-spacing:0.5px; }
.mp-bonus-section-count { background:rgba(124,58,237,0.2); color:#fff; font-size:0.7rem; font-weight:600; padding:2px 7px; border-radius:10px; }
.mp-bonus-row { display:flex; justify-content:space-between; align-items:center; padding:8px 10px; border-radius:8px; background:rgba(255,255,255,0.03); margin-bottom:4px; }
.mp-bonus-row-label { font-size:0.75rem; color:var(--text-muted); }
.mp-bonus-row-value { font-size:0.75rem; font-weight:600; color:var(--text); display:flex; align-items:center; gap:4px; }
.mp-bonus-card { background:linear-gradient(135deg, rgba(124,58,237,0.03), rgba(139,92,246,0.03)); border:1px solid rgba(124,58,237,0.15); border-radius:10px; padding:12px; margin-bottom:8px; display:flex; align-items:center; gap:10px; transition:all 0.2s; }
.mp-bonus-card-dim { opacity:0.45; }
.mp-bonus-card:hover { background:linear-gradient(135deg, rgba(124,58,237,0.08), rgba(139,92,246,0.08)); border-color:rgba(124,58,237,0.3); }
.mp-bonus-card.active { background:linear-gradient(135deg, rgba(124,58,237,0.12), rgba(139,92,246,0.12)); border-color:rgba(124,58,237,0.5); box-shadow:0 0 8px rgba(124,58,237,0.2); }
.mp-bonus-card-img { width:48px; height:48px; border-radius:8px; object-fit:cover; background:rgba(255,255,255,0.1); flex-shrink:0; }
.mp-bonus-card-img-placeholder { width:48px; height:48px; border-radius:8px; background:linear-gradient(135deg, rgba(124,58,237,0.2), rgba(139,92,246,0.2)); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mp-bonus-card-img-placeholder svg { width:20px; height:20px; color:rgba(255,255,255,0.3); }
.mp-bonus-card-info { flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center; }
.mp-bonus-card-type { font-size:0.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.3px; }
.mp-bonus-card-value { font-size:0.8rem; font-weight:600; color:var(--text); margin-bottom:2px; }
.mp-bonus-card-bonus { font-size:0.7rem; color:#d4b0ff; display:flex; align-items:center; gap:4px; }
.mp-bonus-card-bonus svg { width:12px; height:12px; }
.mp-bonus-set-card { background:rgba(255,255,255,0.03); border:1px solid rgba(124,58,237,0.12); border-radius:10px; padding:12px; margin-bottom:8px; transition:all 0.2s; cursor:pointer; }
.mp-bonus-set-card:hover { background:linear-gradient(135deg, rgba(124,58,237,0.08), rgba(139,92,246,0.08)); border-color:rgba(124,58,237,0.3); }
.mp-bonus-set-card.active { background:linear-gradient(135deg, rgba(124,58,237,0.12), rgba(139,92,246,0.12)); border-color:rgba(124,58,237,0.5); box-shadow:0 0 8px rgba(124,58,237,0.2); }
.mp-bonus-set-header { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.mp-bonus-set-img { width:40px; height:40px; border-radius:8px; object-fit:cover; flex-shrink:0; }
.mp-bonus-set-name { font-size:0.8rem; font-weight:600; }
.mp-bonus-set-bonus { font-size:0.7rem; color:#d4b0ff; display:flex; align-items:center; gap:4px; }
.mp-bonus-set-traits { display:flex; flex-wrap:wrap; gap:4px; }
.mp-bonus-set-trait { font-size:0.6rem; padding:2px 6px; border-radius:6px; background:rgba(124,58,237,0.1); color:var(--text-muted); border:1px solid rgba(124,58,237,0.15); }
.mp-bonus-time-wrap { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:10px 12px; }
.mp-bonus-time-item { display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.mp-bonus-time-item:last-child { border-bottom:none; }
.mp-bonus-time-days { font-size:0.75rem; color:var(--text-muted); }
.mp-bonus-time-mult { font-size:0.75rem; font-weight:600; color:#c4b5fd; }
.mp-bonus-lock-item { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:8px; margin-bottom:6px; }
.mp-bonus-lock-name { font-size:0.8rem; font-weight:600; }
.mp-bonus-lock-details { font-size:0.65rem; color:var(--text-muted); margin-top:2px; }
.mp-bonus-lock-mult { font-size:0.75rem; font-weight:600; color:#c4b5fd; text-align:right; }
.mp-bonus-empty { text-align:center; padding:40px 20px; color:var(--text-muted); }
.mp-bonus-empty svg { width:48px; height:48px; margin-bottom:12px; opacity:0.3; }
.mp-bonus-empty p { font-size:0.8rem; margin:0; }
/* Trait Explorer (inline in grid area) */
.trait-explorer-inline { display:none; padding:0 0 40px; isolation:isolate; }
.trait-explorer-inline.open { display:block; }
.trait-explorer-header { display:flex; align-items:center; gap:10px; padding:26px 24px 16px; flex-wrap:wrap; position:sticky; top:-12px; z-index:20; background:#0a0a1a; border-bottom:1px solid var(--border); box-shadow:0 6px 20px rgba(0,0,0,0.7); margin:0 -24px 4px; }
.trait-explorer-header h3 { font-size:0.88rem; font-weight:700; }
.trait-explorer-search { padding:6px 12px; background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.78rem; font-family:inherit; outline:none; width:200px; }
.trait-explorer-sort { padding:5px 10px; background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.72rem; font-family:inherit; outline:none; cursor:pointer; appearance:none; padding-right:24px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 8px center; }
.trait-explorer-sort option { background:#1a1a2e; color:#e5e5e5; }
.trait-explorer-close { background:rgba(239,68,68,0.1); border:1px solid rgba(239,68,68,0.3); color:#f87171; cursor:pointer; padding:5px 12px; display:flex; align-items:center; gap:4px; border-radius:8px; font-size:0.72rem; font-weight:600; font-family:inherit; transition:all 0.15s; }
.trait-explorer-close:hover { background:rgba(239,68,68,0.25); border-color:rgba(239,68,68,0.5); color:#fca5a5; }
#teBody { position:relative; z-index:1; }
.te-category { margin-bottom:20px; }
.te-category-title { font-size:0.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text); margin-bottom:8px; padding-bottom:5px; border-bottom:1px solid var(--border); }
.te-category-title span { color:var(--text-dim); font-weight:500; }
.te-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(185px, 1fr)); gap:8px; }
.te-card { display:flex; align-items:center; gap:10px; padding:8px 12px 8px 8px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:10px; cursor:pointer; transition:all 0.15s; min-width:180px; }
.te-card:hover { border-color:rgba(124,58,237,0.3); background:rgba(124,58,237,0.08); }
.te-card.selected { border-color:rgba(124,58,237,0.5); background:rgba(124,58,237,0.15); }
.te-card-img { width:56px; height:56px; border-radius:8px; object-fit:cover; background:rgba(255,255,255,0.05); flex-shrink:0; transition:transform 0.2s ease; }
.te-card:hover .te-card-img { transform:scale(1.12); }
.te-card-info { flex:1; min-width:0; }
.te-card-name { font-size:0.75rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.te-card-floor { font-size:0.68rem; color:#c084fc; font-weight:600; }
.te-card-stats { font-size:0.62rem; color:var(--text-dim); }
.te-card-rarity { font-size:0.6rem; font-weight:700; margin-top:1px; }
@media (max-width:768px) { .te-card { min-width:140px; } .te-card-img { width:44px; height:44px; } }
/* Trait Explorer view toggle */
.te-view-toggle { display:flex; gap:2px; background:rgba(255,255,255,0.06); border-radius:6px; padding:2px; }
.te-view-toggle button { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px 8px; border-radius:4px; display:flex; align-items:center; transition:all 0.15s; }
.te-view-toggle button.active { background:rgba(124,58,237,0.2); color:#c4b5fd; }
.te-view-toggle button:hover:not(.active) { color:var(--text); }
/* Trait Explorer table/accordion view */
.te-table-row { display:flex; align-items:center; padding:10px 14px; border-bottom:1px solid rgba(255,255,255,0.04); cursor:pointer; transition:background 0.15s; gap:12px; }
.te-table-row:hover { background:rgba(124,58,237,0.06); }
.te-table-row .te-row-name { flex:1; font-size:0.82rem; font-weight:600; }
.te-table-row .te-row-count { font-size:0.75rem; color:var(--text-muted); min-width:50px; text-align:right; }
.te-table-row .te-row-chevron { color:var(--text-dim); transition:transform 0.2s; }
.te-table-row .te-row-chevron.open { transform:rotate(180deg); }
.te-table-expand { display:none; padding:8px 14px 16px; background:rgba(0,0,0,0.15); border-bottom:1px solid rgba(255,255,255,0.06); }
.te-table-expand.open { display:block; }

/* Trait sidebar bonus toggle */
.bonus-trait-toggle { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:6px; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.bonus-trait-toggle:hover { background:rgba(124,58,237,0.15); color:#c4b5fd; }
.bonus-trait-toggle.active { color:#c4b5fd; background:rgba(124,58,237,0.15); }

/* Missions Button */
.activity-btn.missions-btn { background:linear-gradient(135deg, rgba(168,85,247,0.15), rgba(139,92,246,0.1)); border-color:rgba(168,85,247,0.3); }
.activity-btn.missions-btn:hover { background:linear-gradient(135deg, rgba(168,85,247,0.25), rgba(139,92,246,0.2)); border-color:rgba(168,85,247,0.5); box-shadow:0 0 12px rgba(168,85,247,0.3); }
.activity-btn.missions-btn svg { color:#a855f7; }

/* Bonus Button - Gold */
.activity-btn.bonus-btn { background:linear-gradient(135deg, rgba(255,215,0,0.15), rgba(255,165,0,0.1)); border-color:rgba(255,215,0,0.3); }
.activity-btn.bonus-btn:hover { background:linear-gradient(135deg, rgba(255,215,0,0.25), rgba(255,165,0,0.2)); border-color:rgba(255,215,0,0.5); box-shadow:0 0 12px rgba(255,215,0,0.3); }
.activity-btn.bonus-btn svg { color:#ffd700; }
.activity-btn.bonus-btn.active { background:linear-gradient(135deg, rgba(255,215,0,0.25), rgba(255,165,0,0.2)); border-color:rgba(255,215,0,0.5); }
/* Traits Button - Teal */
.activity-btn.traits-btn { background:linear-gradient(135deg, rgba(20,184,166,0.15), rgba(45,212,191,0.1)); border-color:rgba(20,184,166,0.3); }
.activity-btn.traits-btn:hover { background:linear-gradient(135deg, rgba(20,184,166,0.25), rgba(45,212,191,0.2)); border-color:rgba(20,184,166,0.5); box-shadow:0 0 12px rgba(20,184,166,0.3); }
.activity-btn.traits-btn svg { color:#14b8a6; }
.activity-btn.traits-btn.active { background:linear-gradient(135deg, rgba(20,184,166,0.25), rgba(45,212,191,0.2)); border-color:rgba(20,184,166,0.5); }
.activity-btn.chart-btn { background:linear-gradient(135deg, rgba(16,185,129,0.15), rgba(52,211,153,0.1)); border-color:rgba(16,185,129,0.3); }
.activity-btn.chart-btn:hover { background:linear-gradient(135deg, rgba(16,185,129,0.25), rgba(52,211,153,0.2)); border-color:rgba(16,185,129,0.5); box-shadow:0 0 15px rgba(16,185,129,0.25); }
.activity-btn.chart-btn svg { color:#10b981; }
.activity-btn.chart-btn.active { background:linear-gradient(135deg, rgba(16,185,129,0.3), rgba(52,211,153,0.2)); border-color:rgba(16,185,129,0.5); box-shadow:0 0 20px rgba(16,185,129,0.2); }
.activity-btn.holders-btn { background:linear-gradient(135deg, rgba(56,189,248,0.15), rgba(96,165,250,0.1)); border-color:rgba(56,189,248,0.3); }
.activity-btn.holders-btn:hover { background:linear-gradient(135deg, rgba(56,189,248,0.25), rgba(96,165,250,0.2)); border-color:rgba(56,189,248,0.5); box-shadow:0 0 12px rgba(56,189,248,0.3); }
.activity-btn.holders-btn svg { color:#38bdf8; }
.activity-btn.holders-btn.active { background:linear-gradient(135deg, rgba(56,189,248,0.25), rgba(96,165,250,0.2)); border-color:rgba(56,189,248,0.5); }

/* Chart Panel — TradingView Advanced Charts */
.chart-panel { background:var(--bg-card); border:1px solid rgba(16,185,129,0.15); border-radius:16px; margin-bottom:20px; overflow:hidden; position:relative; box-shadow:0 4px 24px rgba(0,0,0,0.3), 0 0 40px rgba(16,185,129,0.05); }
.chart-header { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:linear-gradient(180deg, rgba(16,185,129,0.08) 0%, transparent 100%); border-bottom:1px solid rgba(255,255,255,0.06); }
.chart-header-left { display:flex; align-items:center; gap:10px; }
.chart-icon { color:#10b981; }
.chart-title { font-size:0.85rem; font-weight:600; color:var(--text); letter-spacing:0.3px; }
.chart-tab { background:none; border:1px solid transparent; color:var(--text-muted); font-size:0.78rem; font-weight:600; padding:3px 10px; border-radius:6px; cursor:pointer; transition:all 0.15s; font-family:inherit; }
.chart-tab:hover { color:#fff; background:rgba(255,255,255,0.06); }
.chart-tab.active { color:#fff; background:rgba(124,58,237,0.18); border-color:rgba(124,58,237,0.3); }
.chart-badge { font-size:0.6rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#10b981; background:rgba(16,185,129,0.12); border:1px solid rgba(16,185,129,0.25); padding:2px 8px; border-radius:20px; animation:pulse-badge 2s ease-in-out infinite; }
@keyframes pulse-badge { 0%,100%{opacity:1;} 50%{opacity:0.6;} }
.chart-header-right { display:flex; align-items:center; gap:12px; }
.tv-attribution { display:flex; align-items:center; gap:6px; font-size:0.7rem; color:rgba(255,255,255,0.4); text-decoration:none; padding:4px 10px; border-radius:6px; transition:all 0.2s; }
.tv-attribution:hover { color:rgba(255,255,255,0.7); background:rgba(255,255,255,0.05); }
.tv-attribution span { white-space:nowrap; }
.chart-close-btn { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); border-radius:8px; color:var(--text-muted); width:30px; height:30px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; }
.chart-close-btn:hover { background:rgba(239,68,68,0.15); border-color:rgba(239,68,68,0.3); color:#ef4444; }
.chart-footer-bar { padding:6px 16px; background:rgba(0,0,0,0.2); border-top:1px solid rgba(255,255,255,0.04); text-align:right; }
.chart-footer-text { font-size:0.65rem; color:rgba(255,255,255,0.3); }
.chart-footer-text a { color:rgba(41,98,255,0.7); text-decoration:none; }
.chart-footer-text a:hover { color:#2962FF; }
.chart-resize-handle { height:6px; cursor:ns-resize; background:transparent; position:relative; display:flex; align-items:center; justify-content:center; transition:background 0.15s; }
.chart-resize-handle:hover, .chart-resize-handle.dragging { background:rgba(16,185,129,0.1); }
.chart-resize-handle::after { content:''; width:40px; height:3px; border-radius:2px; background:rgba(255,255,255,0.15); transition:background 0.15s; }
.chart-resize-handle:hover::after, .chart-resize-handle.dragging::after { background:rgba(16,185,129,0.5); }

/* Missions Iframe Overlay */
.missions-iframe-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.9); z-index:10000; justify-content:center; align-items:center; }
.missions-iframe-overlay.open { display:flex; }
.missions-modal { width:95%; max-width:1200px; height:90vh; background:#0a0a0a; border-radius:16px; border:1px solid rgba(153,69,255,0.3); display:flex; flex-direction:column; overflow:hidden; }
.missions-iframe-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; background:rgba(153,69,255,0.1); border-bottom:1px solid rgba(153,69,255,0.2); }
.missions-iframe-header h3 { color:#fff; font-size:1.1rem; font-weight:600; margin:0; display:flex; align-items:center; gap:10px; }
.missions-iframe-close { background:rgba(255,255,255,0.1); border:none; color:#fff; width:32px; height:32px; border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1.25rem; transition:all 0.2s; }
.missions-iframe-close:hover { background:rgba(255,255,255,0.2); }
.missions-iframe-content { flex:1; overflow:hidden; position:relative; }
.missions-iframe-loading { display:flex; align-items:center; justify-content:center; flex:1; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; }
.missions-iframe-loading .spinner { width:40px; height:40px; border:3px solid rgba(153,69,255,0.2); border-top-color:#9945ff; border-radius:50%; animation:spin 1s linear infinite; }
.missions-iframe { width:100%; height:100%; border:none; position:relative; z-index:2; background:transparent; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Holders / Analytics Panel */
.holders-panel-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:197; opacity:0; pointer-events:none; transition:opacity 0.3s; }
.holders-panel-overlay.open { opacity:1; pointer-events:auto; }
.holders-panel { position:fixed; top:0; right:0; width:520px; max-width:90vw; height:100vh; background:var(--bg); border-left:1px solid var(--border); z-index:198; display:flex; flex-direction:column; transform:translateX(100%); transition:transform 0.3s ease; overflow:hidden; }
/* Announcements Panel */
.ann-panel-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:197; opacity:0; pointer-events:none; transition:opacity 0.3s; }
.ann-panel-overlay.open { opacity:1; pointer-events:auto; }
.ann-panel { position:fixed; top:0; right:0; width:420px; max-width:90vw; height:100vh; background:var(--bg); border-left:1px solid var(--border); z-index:198; display:flex; flex-direction:column; transform:translateX(100%); transition:transform 0.3s ease; overflow:hidden; }
.ann-panel.open { transform:translateX(0); }
.ann-panel-header { display:flex; align-items:center; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); background:rgba(0,0,0,0.3); flex-shrink:0; }
.ann-panel-header h3 { flex:1; font-size:1rem; font-weight:700; }
.ann-panel-body { flex:1; overflow-y:auto; padding:16px 20px; }
.ann-card { padding:14px; background:var(--bg-card); border:1px solid var(--border); border-radius:10px; margin-bottom:12px; }
.ann-card.pinned { border-color:rgba(250,204,21,0.3); background:rgba(250,204,21,0.04); }
.ann-card-title { font-size:0.9rem; font-weight:700; margin-bottom:0; display:flex; align-items:center; gap:6px; cursor:pointer; }
.ann-card-title .ann-chevron { transition:transform 0.15s; flex-shrink:0; }
.ann-card.expanded .ann-chevron { transform:rotate(90deg); }
.ann-card-date { font-size:0.65rem; color:var(--text-muted); margin-top:4px; }
.ann-card-detail { display:none; margin-top:8px; }
.ann-card.expanded .ann-card-detail { display:block; }
.ann-card-body { font-size:0.8rem; color:var(--text-dim); line-height:1.6; white-space:pre-wrap; }
.ann-card-img { width:100%; border-radius:8px; margin-top:10px; }
#holdersMainView { display:flex; flex-direction:column; height:100%; min-height:0; }
.holders-panel.open { transform:translateX(0); }
.holders-panel-header { display:flex; align-items:center; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); background:rgba(0,0,0,0.3); flex-shrink:0; }
.holders-panel-header h3 { flex:1; font-size:1rem; font-weight:700; }
.holders-panel-body { flex:1; overflow-y:auto; padding:0; min-height:0; }
.holders-stats { display:flex; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); }
.holders-stat { flex:1; text-align:center; padding:10px; background:var(--bg-card); border-radius:8px; border:1px solid var(--border); }
.holders-stat-value { font-size:1.1rem; font-weight:700; color:var(--text); }
.holders-stat-label { font-size:0.65rem; color:var(--text-muted); margin-top:2px; text-transform:uppercase; letter-spacing:0.5px; }
.holders-search { padding:8px 20px; border-bottom:1px solid var(--border); }
.holders-search input { width:100%; padding:8px 12px; background:var(--bg-card); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.8rem; font-family:inherit; }
.holders-search input::placeholder { color:var(--text-muted); }
.holders-table-wrap { padding:0 12px; }
.holders-table { width:100%; border-collapse:collapse; }
.holders-table th { position:sticky; top:0; background:var(--bg); text-align:left; padding:10px 8px; font-size:0.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; border-bottom:1px solid var(--border); cursor:pointer; user-select:none; white-space:nowrap; }
.holders-table th:hover { color:var(--text); }
.holders-table th .sort-arrow { margin-left:2px; opacity:0.4; }
.holders-table th.sorted .sort-arrow { opacity:1; color:#c4b5fd; }
.holders-table td { padding:8px; font-size:0.8rem; border-bottom:1px solid rgba(255,255,255,0.04); }
.holders-table tr:hover { background:rgba(255,255,255,0.03); }
.holder-wallet-cell { display:flex; align-items:center; gap:6px; min-width:0; }
.holder-addr { font-family:monospace; font-size:0.75rem; cursor:pointer; transition:color 0.15s; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:120px; display:inline-block; }
.holder-addr:hover { color:#c4b5fd; }
.holders-table tr.holder-active { background:rgba(124,58,237,0.10); }
.holder-icon-btn { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:2px; display:flex; align-items:center; opacity:0.5; transition:opacity 0.15s; flex-shrink:0; }
.holder-icon-btn:hover { opacity:1; color:#c4b5fd; }
.holder-tier-cell { position:relative; cursor:default; }
.holder-tier-cell::after { content:attr(data-tier-tip); position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:rgba(20,12,35,0.95); color:#e8e0f0; font-size:0.7rem; font-weight:600; letter-spacing:0.3px; padding:5px 10px; border-radius:6px; border:1px solid rgba(124,58,237,0.35); box-shadow:0 4px 12px rgba(0,0,0,0.4); white-space:nowrap; pointer-events:none; opacity:0; transition:opacity 0.15s; z-index:50; }
.holder-tier-cell:hover::after { opacity:1; }
.holder-pct-bar { height:4px; border-radius:2px; background:rgba(124,58,237,0.3); margin-top:3px; }
.holder-pct-fill { height:100%; border-radius:2px; background:var(--primary); }
.tier-info-link { color:var(--text-muted); display:inline-flex; align-items:center; text-decoration:none; transition:color 0.15s; }
.tier-info-link:hover { color:#c4b5fd; }

/* Holder Profile Sub-view */
.holder-profile-header { display:flex; align-items:center; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); }
.holder-profile-back { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; display:flex; align-items:center; border-radius:6px; transition:all 0.2s; }
.holder-profile-back:hover { background:rgba(255,255,255,0.1); color:var(--text); }
.holder-profile-info { flex:1; }
.holder-profile-addr { font-family:monospace; font-size:0.85rem; font-weight:600; }
.holder-profile-sub { font-size:0.7rem; color:var(--text-muted); margin-top:2px; }
.holder-profile-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; padding:12px 16px; overflow-y:auto; flex:1; }
.holder-profile-card { background:var(--bg-card); border:1px solid var(--border); border-radius:8px; overflow:hidden; cursor:pointer; transition:all 0.2s; }
.holder-profile-card:hover { border-color:var(--primary); transform:translateY(-2px); }
.holder-profile-card img { width:100%; aspect-ratio:1; object-fit:cover; }
.holder-profile-card .hp-name { padding:6px; font-size:0.65rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Viewing Wallet Banner */
.viewing-wallet-bar { display:none; align-items:center; gap:10px; padding:8px 16px; background:rgba(124,58,237,0.12); border:1px solid rgba(124,58,237,0.25); border-radius:8px; margin:0 16px 4px; }
.viewing-wallet-bar.visible { display:flex; }
.viewing-wallet-bar .vw-label { font-size:0.75rem; color:var(--text-muted); }
.viewing-wallet-bar .vw-addr { font-family:monospace; font-size:0.8rem; font-weight:600; cursor:pointer; transition:color 0.15s; }
.viewing-wallet-bar .vw-addr:hover { color:#c4b5fd; text-decoration:underline; }
.viewing-wallet-bar .vw-info { font-size:0.75rem; color:var(--text-muted); }
.viewing-wallet-bar .vw-links { display:flex; align-items:center; gap:6px; margin-left:auto; }
.viewing-wallet-bar .vw-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:4px; display:flex; align-items:center; transition:all 0.15s; }
.viewing-wallet-bar .vw-close:hover { background:rgba(255,255,255,0.1); color:var(--text); }

/* Tab Content */
.tab-content { display:none; }
.tab-content.active { display:flex; flex-direction:column; flex:1; min-height:0; }

/* List NFT Modal */
.list-nft-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:12px; max-height:400px; overflow-y:auto; padding:4px; }
.list-nft-item { background:var(--bg-card); border:1px solid var(--border); border-radius:8px; overflow:hidden; cursor:pointer; text-align:center; padding-bottom:8px; }
.list-nft-item.selected { border-color:var(--primary); box-shadow:0 0 0 2px rgba(124,58,237,0.3); }
.list-nft-item img { width:100%; aspect-ratio:1; object-fit:cover; }
.list-nft-item .name { font-size:0.75rem; padding:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.list-nft-item { position:relative; }
.list-nft-item.frozen { cursor:not-allowed; opacity:0.7; }
.list-nft-item.frozen:hover { transform:none; border-color:var(--border); }
.list-nft-item.frozen img { filter:grayscale(50%); }
.frozen-overlay { position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6); display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:5; border-radius:8px; }
.frozen-overlay-icon { font-size:24px; margin-bottom:4px; }
.frozen-overlay-text { color:#ff6b6b; font-size:0.65rem; font-weight:600; text-transform:uppercase; letter-spacing:0.5px; text-align:center; }

/* List modal — in-cart badge on grid items */
.list-nft-item.in-cart { border-color:var(--success); box-shadow:0 0 0 2px rgba(16,185,129,0.35); }
.list-nft-item.in-cart::after { content:'✓'; position:absolute; top:4px; right:4px; width:20px; height:20px; background:var(--success); color:#fff; border-radius:50%; font-size:0.7rem; display:flex; align-items:center; justify-content:center; font-weight:700; z-index:6; }

/* List modal — pricing controls row */
.list-pricing-controls { display:flex; gap:10px; align-items:flex-end; margin-bottom:14px; flex-wrap:wrap; }
@media (max-width:520px) { .list-pricing-controls { flex-direction:column; align-items:stretch; } .list-pricing-controls .list-pricing-group { width:100%; } }
.list-pricing-group { display:flex; flex-direction:column; gap:4px; }
.list-pricing-group label { font-size:0.75rem; color:var(--text-muted); font-weight:500; }
.list-pricing-group input { padding:8px 10px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.85rem; font-family:inherit; outline:none; width:110px; }
.list-pricing-group input:focus { border-color:var(--primary); }
.ladder-btns { display:flex; gap:4px; }
.ladder-btn { padding:7px 10px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; color:var(--text-muted); font-size:0.75rem; font-family:inherit; cursor:pointer; transition:all 0.15s; white-space:nowrap; }
.ladder-btn:hover { border-color:var(--text-muted); }
.ladder-btn.active { background:var(--primary); border-color:var(--primary); color:#fff; font-weight:600; }

/* List modal — cart */
.list-cart { max-height:280px; overflow-y:auto; display:flex; flex-direction:column; gap:6px; margin-bottom:14px; padding-right:4px; }
.list-cart-item { display:flex; align-items:center; gap:10px; padding:8px 10px; background:var(--bg-card); border:1px solid var(--border); border-radius:10px; }
.list-cart-item img { width:44px; height:44px; border-radius:6px; object-fit:cover; flex-shrink:0; }
.list-cart-item .lci-info { flex:1; min-width:0; }
.list-cart-item .lci-name { font-size:0.8rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lci-price-wrap { display:flex; flex-direction:column; gap:2px; align-items:flex-end; }
.lci-price-input { width:100px; padding:6px 8px; background:var(--bg-main); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.8rem; font-family:inherit; outline:none; text-align:right; }
.lci-price-input:focus { border-color:var(--primary); }
.lci-fee-line { font-size:0.65rem; color:var(--text-muted); white-space:nowrap; }
.lci-remove { background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:1.1rem; padding:4px 6px; border-radius:6px; transition:all 0.15s; flex-shrink:0; }
.lci-remove:hover { color:#ff6b6b; background:rgba(255,107,107,0.1); }

/* List modal — fee summary */
.list-fee-summary { padding:12px; background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.2); border-radius:10px; margin-bottom:16px; font-size:0.85rem; }
.lfs-row { display:flex; justify-content:space-between; margin-bottom:5px; }
.lfs-row:last-child { margin-bottom:0; border-top:1px solid var(--border); padding-top:6px; margin-top:4px; font-weight:600; }
.lfs-row .lfs-label { color:var(--text-muted); }
.lfs-row .lfs-value { color:var(--text); }
.lfs-row:last-child .lfs-label, .lfs-row:last-child .lfs-value { color:var(--success); }

/* Multi-select checkbox */
.card-select-cb { position:absolute; top:8px; right:8px; z-index:5; width:22px; height:22px; border-radius:6px; border:2px solid rgba(255,255,255,0.4); background:rgba(0,0,0,0.5); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; opacity:0; pointer-events:none; }
.nft-card:hover .card-select-cb, .nft-grid.multi-select-active .card-select-cb { opacity:1; pointer-events:auto; }
.card-select-cb.checked { background:var(--primary); border-color:var(--primary); }
.card-select-cb.checked::after { content:''; width:6px; height:10px; border:solid white; border-width:0 2px 2px 0; transform:rotate(45deg); margin-bottom:2px; }
.card-select-cb.hidden { display:none !important; }
.nft-card.selected { border-color:var(--primary) !important; box-shadow:0 0 0 2px rgba(124,58,237,0.4); }
/* Batch action bar */
.batch-bar { position:fixed; bottom:0; left:0; right:0; background:rgba(20,20,40,0.97); backdrop-filter:blur(16px); border-top:1px solid var(--border); padding:12px 24px calc(12px + env(safe-area-inset-bottom, 0px)); z-index:250; display:flex; align-items:center; gap:16px; transform:translateY(100%); transition:transform 0.25s ease; }
.batch-bar.visible { transform:translateY(0); }
.batch-bar-count { font-weight:700; font-size:0.95rem; white-space:nowrap; }
.batch-bar-actions { display:flex; gap:10px; margin-left:auto; }
.batch-bar-btn { padding:10px 24px; border:none; border-radius:8px; font-size:0.875rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; display:flex; align-items:center; gap:6px; }
.batch-bar-btn.buy { background:#7c3aed; color:white; }
.batch-bar-btn.buy:hover { background:#9333ea; }
.batch-bar-btn.list { background:rgba(16,185,129,0.2); color:var(--success); border:1px solid rgba(16,185,129,0.3); }
.batch-bar-btn.list:hover { background:rgba(16,185,129,0.3); }
.batch-bar-btn.send { background:rgba(59,130,246,0.2); color:#60a5fa; border:1px solid rgba(59,130,246,0.3); }
.batch-bar-btn.send:hover { background:rgba(59,130,246,0.3); }
.batch-bar-btn.clear { background:rgba(255,255,255,0.1); color:var(--text-muted); }
.batch-bar-btn.clear:hover { background:rgba(255,255,255,0.15); color:var(--text); }
.batch-bar-btn:disabled { opacity:0.5; cursor:not-allowed; }
.batch-qty-section { display:flex; align-items:center; gap:10px; padding:0 16px; border-left:1px solid var(--border); border-right:1px solid var(--border); }
.batch-qty-section label { font-size:0.8rem; color:var(--text-muted); white-space:nowrap; }
.batch-qty-input { width:56px; padding:6px 8px; background:var(--bg-card); border:1px solid var(--border); border-radius:6px; color:var(--text); font-size:0.9rem; font-family:inherit; text-align:center; outline:none; }
.batch-qty-input:focus { border-color:var(--primary); }
.batch-qty-slider { width:120px; accent-color:var(--primary); }
.batch-qty-btn { width:28px; height:28px; border-radius:6px; border:1px solid var(--border); background:rgba(124,58,237,0.12); color:#a78bfa; font-size:1rem; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; line-height:1; padding:0; font-family:inherit; }
.batch-qty-btn:hover { background:rgba(124,58,237,0.3); border-color:rgba(124,58,237,0.5); }
.batch-qty-btn:active { transform:scale(0.92); }
.batch-total { font-size:0.85rem; color:var(--text-muted); white-space:nowrap; }
/* Batch progress overlay */
.batch-progress-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:350; display:flex; align-items:center; justify-content:center; animation:fadeIn 0.2s; }
.batch-progress-box { background:#1a1a2e; border:1px solid var(--border); border-radius:16px; width:100%; max-width:480px; padding:24px; max-height:80vh; overflow-y:auto; position:relative; }
.batch-progress-close { position:absolute; top:12px; right:12px; background:none; border:none; color:rgba(255,255,255,0.4); font-size:1.4rem; cursor:pointer; padding:4px 8px; line-height:1; border-radius:8px; transition:all 0.2s; }
.batch-progress-close:hover { color:#fff; background:rgba(255,255,255,0.1); }
.batch-progress-title { font-size:1.1rem; font-weight:700; margin-bottom:16px; text-align:center; }
.batch-progress-item { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.batch-progress-item img { width:40px; height:40px; border-radius:6px; object-fit:cover; }
.batch-progress-item .bp-name { flex:1; font-size:0.85rem; font-weight:500; }
.batch-progress-item .bp-price { font-size:0.8rem; color:var(--text-muted); white-space:nowrap; }
.batch-progress-item .bp-status { width:20px; height:20px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.bp-pending { color:var(--text-muted); }
.bp-processing { color:#f59e0b; }
.bp-success { color:var(--success); }
.bp-failed { color:#ef4444; }
.bp-skipped { color:var(--text-muted); }
.batch-progress-summary { margin-top:16px; padding-top:12px; border-top:1px solid var(--border); text-align:center; }

/* Send modal */
.send-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:350; display:flex; align-items:center; justify-content:center; animation:fadeIn 0.2s; }
.send-modal-box { background:#1a1a2e; border:1px solid var(--border); border-radius:16px; width:100%; max-width:480px; padding:24px; max-height:80vh; overflow-y:auto; position:relative; }
.send-modal-close { position:absolute; top:12px; right:12px; background:none; border:none; color:rgba(255,255,255,0.4); font-size:1.4rem; cursor:pointer; padding:4px 8px; line-height:1; border-radius:8px; transition:all 0.2s; }
.send-modal-close:hover { color:#fff; background:rgba(255,255,255,0.1); }
.send-modal-title { font-size:1.1rem; font-weight:700; margin-bottom:16px; text-align:center; }
.send-nft-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(60px, 1fr)); gap:8px; margin-bottom:16px; max-height:200px; overflow-y:auto; }
.send-nft-thumb { width:100%; aspect-ratio:1; border-radius:8px; object-fit:cover; border:1px solid rgba(255,255,255,0.08); }
.send-nft-thumb-wrap { position:relative; text-align:center; }
.send-nft-thumb-name { font-size:0.6rem; color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:2px; }
.send-wallet-input { width:100%; padding:12px 16px; background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.1); border-radius:10px; color:#fff; font-size:0.9rem; font-family:'SF Mono','Fira Code',monospace; outline:none; transition:border-color 0.15s; }
.send-wallet-input:focus { border-color:rgba(59,130,246,0.5); }
.send-wallet-input.invalid { border-color:rgba(239,68,68,0.5); }
.send-error { font-size:0.75rem; color:#ef4444; margin-top:6px; min-height:18px; }
.send-confirm-btn { width:100%; padding:14px; background:rgba(59,130,246,0.9); border:none; border-radius:10px; color:white; font-size:0.95rem; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.15s; margin-top:12px; }
.send-confirm-btn:hover { background:rgba(59,130,246,1); }
.send-confirm-btn:disabled { opacity:0.5; cursor:not-allowed; }

/* Toast */
.toast { position:fixed; bottom:calc(52px + env(safe-area-inset-bottom, 0px)); right:20px; padding:12px 20px; border-radius:10px; font-size:0.875rem; z-index:9100; animation:slideIn 0.3s; }
.toast.success { background:rgba(16,185,129,0.9); }
.toast.error { background:rgba(239,68,68,0.9); }
.toast.info { background:rgba(59,130,246,0.9); }
@keyframes slideIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }

/* Responsive — Wide screens: activity buttons become icon-only first */
@media (max-width: 1600px) {
.activity-btn { font-size:0; padding:8px; gap:0; min-width:34px; min-height:34px; justify-content:center; overflow:hidden; max-width:34px; transition:all 0.2s; }
.activity-btn svg { flex-shrink:0; }
.activity-btn:hover { font-size:0.8rem; gap:6px; max-width:160px; padding:8px 12px; }
}

/* Responsive — Large tablets / small desktops */
@media (max-width: 1400px) {
/* Stats: tighter */
.stat-item { min-width:100px; padding:12px 10px; }
.stat-item .stat-value { font-size:1rem; }
}

/* Responsive — Medium */
@media (max-width: 1200px) {
/* View tabs → dropdown */
.view-tabs { display:none; }
.view-select-wrap { display:inline-flex !important; }
/* Grid size: show only active button */
.grid-size-toggle button:not(.active) { display:none; }
.grid-size-toggle { border-radius:8px; }
}

@media (max-width: 1100px) {
/* Sort: icon only first to preserve grid buttons */
.filter-toggle { font-size:0; padding:0 8px; gap:0; min-width:34px; justify-content:center; }
.filter-toggle svg, .collections-toggle svg { flex-shrink:0; }
.sort-select-wrap select { font-size:0; padding:0 8px 0 28px; min-width:34px; height:34px; -webkit-appearance:none; appearance:none; }
/* Controls: tighter */
.controls { gap:6px; padding:12px 16px; }
/* Stats: tighter */
.stat-item { min-width:85px; padding:10px 6px; }
.stat-item .stat-label { font-size:0.6rem; }
.stat-item .stat-value { font-size:0.9rem; }
/* Search: collapsed */
.search-box { flex:0 0 34px; min-width:34px; width:34px; overflow:hidden; transition:all 0.3s ease; }
.search-box input { opacity:0; }
.search-box .exact-toggle { display:none; }
.search-box:focus-within { flex:1; min-width:160px; width:auto; }
.search-box:focus-within input { opacity:1; }
.search-box:focus-within .exact-toggle { display:flex; }
}

/* Responsive — Small tablets */
@media (max-width: 900px) {
/* Grid area: tighter padding */
.grid-area { padding:10px 14px; }
}

/* Responsive — Mobile */
#heroBannerImg, #heroBannerMobile { width: 100%; aspect-ratio: 4/1; max-height: 300px; }
/* Banner hidden by default (no inline style) so the reveal below — and the
   scroll-to-collapse inline display:none — both win the cascade without !important. */
#heroBannerWrap { display: none; }
/* Reserve the banner slot when the warm-up confirms a banner exists, so the image
   filling in doesn't shove the app-shell column down (CLS). NOT !important: the
   scroll-shrink handler sets inline display:none to close it, which must win. */
html.orbis-has-banner #heroBannerWrap { display: block; aspect-ratio: 4/1; max-height: 300px; }
.hero-banner-desktop { display: block; }
#heroBannerMobile { display: none !important; }
@media (max-width: 768px) {
.hero-banner-desktop { display: none !important; }
#heroBannerMobile[src]:not([src=""]) { display: block !important; }
}

@media (max-width: 768px) {
/* === Full-page scroll: header + stats scroll away, only controls sticky === */
body { height:auto; overflow-y:auto; overflow-x:hidden; }
.tab-content.active { flex:1 0 auto; }
.content-wrapper { flex:none; min-height:auto; width:100%; }
.grid-area { overflow-y:visible; flex:none; min-height:auto; padding:8px 8px; width:100%; box-sizing:border-box; }

.sidebar { display:none; position:fixed; top:0; left:0; width:85vw; max-width:320px; height:100vh; z-index:200; background:var(--bg); border-right:1px solid var(--border); overflow-y:auto; padding:16px; }
.sidebar-mobile-header {
    display:flex; align-items:center; justify-content:space-between;
    margin:-16px -16px 12px; padding:14px 16px;
    border-bottom:1px solid var(--border); background:rgba(0,0,0,0.2);
}
.sidebar-mobile-header h3 { font-size:0.9rem; font-weight:700; margin:0; }
.sidebar-mobile-header .panel-close { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:4px; border-radius:6px; display:flex; align-items:center; justify-content:center; }
.sidebar-mobile-header .panel-close:hover { background:rgba(255,255,255,0.1); color:var(--text); }
.sidebar:not(.hidden) { display:block; }
.sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:199; }
.sidebar-overlay:not(.hidden) { display:block; }
.modal-detail { grid-template-columns:1fr; }
.mp-tabs { display:none; }

/* === Stats bar: compact strip with logo + info + view tabs === */
.stats-bar { flex-wrap:nowrap; position:relative; overflow:hidden; padding:0; gap:0; align-items:center; min-height:48px; }
.stats-bar .stats-scroll { display:none; }
.stats-bar .features-card { display:none !important; }
.collection-info-card { min-width:0; flex:0 0 auto; padding:8px 8px 8px 10px; gap:6px; border-right:none; max-width:44px; }
.collection-info-card .cic-logo { width:32px; height:32px; min-width:32px; border-radius:6px; }
.cic-details { display:none; }
.cic-actions { display:none; }
.mobile-stats-strip {
    display:flex !important; align-items:center; gap:0;
    flex:1; min-width:0; overflow:hidden;
}
.mss-info-btn {
    display:flex; align-items:center; gap:3px; flex-shrink:0;
    background:none; border:1px solid var(--border);
    color:var(--text-muted); padding:5px 8px; border-radius:8px;
    font-size:0.65rem; font-weight:600; font-family:inherit;
    cursor:pointer; white-space:nowrap; transition:all 0.15s;
}
.mss-info-btn:active { background:rgba(255,255,255,0.08); color:var(--text); }
.mss-info-btn svg { flex-shrink:0; }
.mss-view-tabs {
    display:flex; align-items:center; gap:2px;
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; flex:1; min-width:0;
    padding:0 6px;
}
.mss-view-tabs::-webkit-scrollbar { display:none; }
.mss-vtab {
    display:flex; align-items:center; gap:2px; flex-shrink:0;
    background:none; border:1px solid transparent;
    color:var(--text-muted); padding:4px 8px; border-radius:16px;
    font-size:0.65rem; font-weight:600; font-family:inherit;
    cursor:pointer; white-space:nowrap; transition:all 0.15s;
}
.mss-vtab.active { background:rgba(124,58,237,0.2); border-color:rgba(124,58,237,0.4); color:#c4b5fd; }
.mss-vtab:active { background:rgba(255,255,255,0.08); }
.mss-vtab-count { font-size:0.6rem; color:#9094a8; }
.mss-vtab-count:not(:empty)::before { content:'('; }
.mss-vtab-count:not(:empty)::after { content:')'; }
.mss-vtab-offers { border-color:rgba(124,58,237,0.25); }
/* Mobile info popup */
.mobile-info-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:10000; align-items:flex-end; justify-content:center; }
.mobile-info-overlay.open { display:flex; }
.mobile-info-modal { background:var(--bg, #0a0a1a); border-radius:16px 16px 0 0; width:100%; max-height:75vh; overflow-y:auto; padding-bottom:env(safe-area-inset-bottom, 16px); }
.mobile-info-modal .msm-header { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--border); }
.mobile-info-modal .msm-header h3 { margin:0; font-size:0.95rem; }
.mobile-info-modal .msm-header button { background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:1.3rem; padding:4px 8px; }
.mobile-info-body { padding:12px 16px; }
.mi-section { margin-bottom:16px; }
.mi-section-label { font-size:0.65rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); margin-bottom:8px; }
.mi-links { display:flex; gap:8px; flex-wrap:wrap; }
.mi-links a, .mi-links button { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,0.06); color:var(--text-muted); transition:all 0.15s; border:none; cursor:pointer; text-decoration:none; }
.mi-links a:hover, .mi-links button:hover { background:rgba(124,58,237,0.25); color:var(--text); }
.mi-links a svg, .mi-links button svg { width:18px; height:18px; fill:currentColor; }
.mi-utility { display:flex; gap:8px; flex-wrap:wrap; }
.mi-utility a, .mi-utility span { display:flex; align-items:center; gap:6px; padding:8px 14px; background:rgba(255,255,255,0.05); border:1px solid var(--border); border-radius:10px; color:var(--text-muted); font-size:0.75rem; font-weight:600; text-decoration:none; transition:all 0.15s; cursor:pointer; }
.mi-utility a:hover { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); color:var(--text); }
.mi-utility a svg, .mi-utility span svg { width:16px; height:16px; }
.mi-utility img { width:18px; height:18px; border-radius:50%; }

/* === NFT grid === */
.nft-grid { grid-template-columns:repeat(2, 1fr); gap:8px; max-width:100%; }
.nft-grid.grid-sm { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:4px; }
.nft-grid.grid-md { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
.nft-grid.grid-lg { grid-template-columns:1fr; gap:10px; }
.nft-card { border-radius:10px; }
.nft-card .card-body { padding:8px; }
.nft-card .nft-name { font-size:0.72rem; }
.nft-card .card-price { font-size:0.72rem; }
.card-collection-link { font-size:0.55rem; }
.attributes-grid { grid-template-columns:repeat(2, 1fr); }

/* === Batch bar === */
.batch-bar { flex-wrap:wrap; gap:6px; padding:8px 12px; }
.batch-qty-section { order:-1; width:100%; border:none; padding:0; border-bottom:1px solid var(--border); padding-bottom:8px; }
.batch-bar-btn { padding:6px 12px; font-size:0.75rem; }
.orbis-list-btn .btn-text-full { display:none; }
.orbis-list-btn .btn-icon-only { display:inline; }

/* Remove sticky headers on mobile */
.act-sm-header { position:relative !important; }
.activity-page-table-header { position:relative !important; }
.ca-table-header { position:relative !important; }
.holders-table th { position:relative !important; }

/* === Header === */
.mp-header, .mp-header-top { max-width:100vw; overflow-x:hidden; }
.mp-header-top { padding:8px 12px 6px; gap:8px; }
.mp-header-top h1 { font-size:1rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:120px; }
/* Wallet button: icon-only — uses shared styles from marketplace-header.js */
.gotm-wd-wrap { flex-shrink:0 !important; overflow:visible; position:relative; }
.gotm-wd-wrap .wallet-btn { order:0 !important; margin-left:0 !important; font-size:0 !important; padding:8px !important; min-width:36px; max-width:44px; min-height:36px; overflow:hidden; white-space:nowrap; }
.gotm-wd-bal { position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:1px; font-size:0.55rem !important; text-align:center; white-space:nowrap; }
.gotm-wd-bal .sol-icon { width:8px !important; height:8px !important; }

/* === Controls row: sticky, tighter, NO horizontal scroll === */
.controls { position:sticky; top:0; z-index:50; padding:6px 10px; gap:4px; flex-wrap:wrap; overflow-x:hidden; }
/* Search box: inline icon button, expands when .search-expanded */
.search-box { order:90; flex:0 0 auto; min-width:auto; width:34px; }
.search-box input { padding:7px 28px 7px 32px; font-size:0.8rem; width:34px; background:transparent; border-color:var(--border); cursor:pointer; color:transparent; }
.search-box input::placeholder { color:transparent; }
.search-box.search-expanded { flex:1 1 100%; order:99; width:auto; }
.search-box.search-expanded input { width:100%; background:var(--bg-card); cursor:text; color:var(--text); }
.search-box.search-expanded input::placeholder { color:var(--text-dim); }
/* Hide collections toggle on mobile collection pages (but show in portfolio) */
.collections-toggle { display:none !important; }
.collections-toggle.portfolio-visible { display:flex !important; }
/* Grid size toggle — single cycle button on mobile */
.grid-size-toggle { border-radius:6px; }
.grid-size-toggle button { font-size:0; padding:0; width:36px; height:36px; min-width:36px; display:none; align-items:center; justify-content:center; }
.grid-size-toggle button svg { width:14px; height:14px; }
.grid-size-toggle button.active { display:flex; background:rgba(124,58,237,0.35); border-radius:6px; }
/* Activity buttons: icon-only, no hover expand */
.activity-btn { max-width:40px !important; min-width:40px !important; min-height:40px !important; font-size:0 !important; gap:0 !important; padding:10px !important; }
/* View select: hide on mobile (moved to stats strip) */
.view-select-wrap { display:none !important; }
.view-select-mobile { display:none !important; }
/* Offers split button: hidden on mobile, moved to stats strip */
.offers-split-btn { display:none !important; }
/* Hide favourite button on mobile */
.card-fav { display:none !important; }
/* Holders panel: full screen on mobile */
.holders-panel { width:100vw; max-width:100vw; }
/* Activity panel: full screen on mobile too (matches holders) */
.activity-sidebar { width:100vw !important; max-width:100vw !important; }
/* Holders table: drop the Staked column on mobile to free up horizontal
   space for Wallet + Qty + %. */
.holders-table th:nth-child(5),
.holders-table td:nth-child(5) { display:none; }

/* === Modal detail === */
.modal { max-height:85vh; border-radius:12px; }
.modal-header { flex-wrap:wrap; padding:14px 16px; gap:6px; }
.modal-header > div:first-child { flex:1; min-width:0; max-width:calc(100% - 140px); }
.modal-header h2 { font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#modalCollectionLink { max-width:100%; }
.share-btn { padding:10px; font-size:0; min-width:40px; min-height:40px; display:flex; align-items:center; justify-content:center; }
.share-btn svg { margin:0; }
.modal-close { padding:8px 10px; min-width:40px; min-height:40px; display:flex; align-items:center; justify-content:center; }
.modal-detail { gap:12px; padding:16px; }
}

/* 2FA Verification Modal */
.tfa-verify-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:400; display:flex; align-items:center; justify-content:center; padding:20px; animation:fadeIn 0.2s; }
.tfa-verify-modal { background:#1a1a2e; border:1px solid rgba(255,255,255,0.1); border-radius:16px; padding:28px; max-width:380px; width:100%; text-align:center; }
.tfa-verify-modal h3 { font-size:1.1rem; font-weight:700; margin-bottom:8px; }
.tfa-verify-modal p { font-size:0.85rem; color:var(--text-muted); margin-bottom:20px; line-height:1.5; }
.tfa-verify-modal .tfa-shield-icon { width:48px; height:48px; border-radius:12px; background:rgba(124,58,237,0.12); color:#c4b5fd; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.tfa-verify-modal input { width:100%; padding:12px 16px; background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.1); border-radius:10px; color:#fff; font-size:1.2rem; font-family:monospace; text-align:center; letter-spacing:8px; margin-bottom:16px; }
.tfa-verify-modal input:focus { outline:none; border-color:var(--primary); }
.tfa-verify-actions { display:flex; gap:8px; justify-content:center; }
.tfa-verify-actions button { padding:10px 20px; border-radius:8px; border:none; font-size:0.85rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.tfa-verify-actions .tfa-cancel { background:rgba(255,255,255,0.08); color:var(--text-muted); }
.tfa-verify-actions .tfa-cancel:hover { background:rgba(255,255,255,0.12); }
.tfa-verify-actions .tfa-confirm { background:var(--primary); color:#fff; }
.tfa-verify-actions .tfa-confirm:hover { background:var(--primary-h,#6d28d9); }

/* =====================================================
 * Wallet-view mode — activated when browsing another user's
 * holdings in a collection context (?wallet= in URL). Hides
 * controls that only make sense for your own wallet or for
 * the collection as a whole.
 * ===================================================== */
body.wallet-view-mode #heroBannerWrap,
body.wallet-view-mode #statsBar,
body.wallet-view-mode #holdersToggleBtn,
body.wallet-view-mode #chartToggleBtn,
body.wallet-view-mode #activityToggleBtn,
body.wallet-view-mode #offersSplitBtn,
body.wallet-view-mode #portfolioOffersBtn,
body.wallet-view-mode #myItemsTab,
body.wallet-view-mode #myListingsTab,
body.wallet-view-mode #missionsToggleBtn,
body.wallet-view-mode #bonusToggleBtn { display: none !important; }

/* The left-side portfolio Activity button is kept — it shows the viewed
 * wallet's activity (loadPortfolioActivity resolves the wallet via
 * portfolioWallet || viewingHolderWallet || getActiveWallet). */
body.wallet-view-mode #portfolioActivityBtn { display: flex !important; }

/* In wallet-view mode, "All Items" becomes the user's items — relabel
 * the active tab for clarity. Also hide tabs that only make sense for
 * your own wallet (For Sale, Favourites) since the context is "this
 * user's holdings", not the market. */
body.wallet-view-mode #viewTabs .view-tab[data-mode="forSale"],
body.wallet-view-mode #viewTabs .view-tab[data-mode="favourites"],
body.wallet-view-mode .mss-vtab[data-mode="favourites"] { display: none !important; }

/* =====================================================
 * Portfolio mode — /marketplace/portfolio/{wallet}.
 * No specific collection is loaded, so hide the
 * collection-info card, utility/features card, and stats
 * scroll inside the stats-bar. On mobile we keep stats-bar
 * mounted because mobile-stats-strip is the only place
 * view-mode tabs (All / For Sale / Favourites / Offers)
 * exist on a phone.
 * ===================================================== */
body.portfolio-mode .stats-bar .collection-info-card,
body.portfolio-mode .stats-bar .features-card,
body.portfolio-mode .stats-bar .stats-scroll,
body.portfolio-mode .stats-bar .mss-info-btn { display: none !important; }
@media (min-width: 769px) {
    body.portfolio-mode .stats-bar { display: none; }
}
@media (max-width: 768px) {
    body.portfolio-mode .stats-bar { padding: 4px 8px; gap: 0; min-height: 0; }
    body.portfolio-mode .mobile-stats-strip { padding: 0; }
    /* Viewing wallet bar: shrink margins, allow wrap, make close button comfortable */
    body.portfolio-mode .viewing-wallet-bar { margin: 0 8px 4px; padding: 8px 10px; gap: 6px; flex-wrap: wrap; }
    body.portfolio-mode .viewing-wallet-bar .vw-label { display: none; }
    body.portfolio-mode .viewing-wallet-bar .vw-addr { font-size: 0.78rem; }
    body.portfolio-mode .viewing-wallet-bar .vw-info { font-size: 0.7rem; flex-basis: 100%; order: 3; margin-top: 2px; }
    body.portfolio-mode .viewing-wallet-bar .vw-links { margin-left: auto; }
    body.portfolio-mode .viewing-wallet-bar .vw-close { padding: 8px; min-width: 36px; min-height: 36px; }

    /* Collections sidebar in portfolio mode becomes a left drawer so the
       user sees EITHER the NFT grid OR the collection picker, not both
       squished. Reveal/dismiss via the Collections toggle button or by
       tapping the backdrop. */
    body.portfolio-mode .collections-sidebar {
        position: fixed; top: 0; left: 0;
        width: 90vw; max-width: 360px; min-width: 0; height: 100vh;
        z-index: 200;
        box-shadow: 4px 0 20px rgba(0,0,0,0.5);
        padding: 16px;
        transition: transform 0.25s ease;
    }
    body.portfolio-mode .collections-sidebar.hidden {
        width: 90vw; max-width: 360px; min-width: 0;
        padding: 16px;
        transform: translateX(-100%);
        overflow: auto;
    }
    body.portfolio-mode .collections-sidebar:not(.hidden) {
        transform: translateX(0);
    }
    body.portfolio-mode .collections-sidebar-backdrop {
        display: none; position: fixed; inset: 0;
        background: rgba(0,0,0,0.5); z-index: 199;
    }
    body.portfolio-mode .collections-sidebar-backdrop.open { display: block; }
}
/* Default (desktop or non-portfolio) — backdrop never shows */
.collections-sidebar-backdrop { display: none; }

/* Collections toggle — visible in wallet view at all times so users can
 * hide or show the collections sidebar. Active state mirrors the existing
 * Filters button styling. */
.collections-reopen-btn {
    display: none;
    align-items: center; gap: 6px;
    padding: 6px 12px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s;
}
.collections-reopen-btn:hover {
    background: rgba(124,58,237,0.15);
    border-color: rgba(124,58,237,0.4);
    color: #c4b5fd;
}
.collections-reopen-btn.active {
    background: rgba(124,58,237,0.18);
    border-color: rgba(124,58,237,0.5);
    color: #c4b5fd;
}
.collections-reopen-btn svg { width: 14px; height: 14px; }
body.wallet-view-mode .controls .collections-reopen-btn,
body.portfolio-mode .controls .collections-reopen-btn { display: inline-flex; }
.tfa-verify-actions .tfa-confirm:disabled { opacity:0.5; cursor:not-allowed; }