:root{
  --bg:#0b0c0e;
  --bg-alt:#101216;
  --panel:#141619;
  --border:#22262b;
  --border-soft:#1a1c20;
  --text:#f2f3f4;
  --text-dim:#9a9fa6;
  --text-faint:#5c6167;
  --accent:#4ade80;
  --accent-dim:#1c3a26;
  --amber:#f5b942;
  --amber-dim:#3a2f14;
  --red:#f36a6a;
  --font-sans:'Inter',sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(11,12,14,0.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border-soft);
}
.nav-inner{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;gap:40px;
  padding:16px 24px;
}
.logo{
  display:flex;align-items:center;gap:9px;
  font-weight:700;font-size:16px;
  color:var(--text);text-decoration:none;
  letter-spacing:-0.2px;
}
.logo-mark{color:var(--accent);display:flex;}
.nav-links{display:flex;gap:26px;flex:1;}
.nav-links a{
  color:var(--text-dim);text-decoration:none;
  font-size:13.5px;font-weight:500;
  padding:4px 0;border-bottom:2px solid transparent;
  transition:color .15s;
}
.nav-links a:hover{color:var(--text);}
.nav-links a.active{color:var(--text);}
.nav-right{display:flex;align-items:center;}
.search{
  display:flex;align-items:center;gap:8px;
  background:var(--panel);border:1px solid var(--border);
  border-radius:8px;padding:8px 12px;width:230px;
  color:var(--text-faint);
}
.search input{
  background:none;border:none;outline:none;
  color:var(--text);font-size:13px;width:100%;
  font-family:var(--font-sans);
}
.search input::placeholder{color:var(--text-faint);}

/* ---------- layout ---------- */
.wrap{max-width:1200px;margin:0 auto;padding:0 24px 64px;}

/* ---------- hero ---------- */
.hero{
  padding:72px 0 36px;
  border-bottom:1px solid var(--border-soft);
  margin-bottom:36px;
  position:relative;
  overflow:hidden;
  background-image:radial-gradient(var(--border) 1px, transparent 1px);
  background-size:22px 22px;
  background-position:-10px -10px;
}
.hero-watermark{
  position:absolute;
  right:-60px;top:-40px;
  opacity:0.05;
  pointer-events:none;
  z-index:0;
}
.eyebrow{
  position:relative;z-index:1;
  font-size:12px;letter-spacing:0.3px;
  color:var(--accent);text-transform:uppercase;
  font-weight:600;
}
.hero h1{
  position:relative;z-index:1;
  font-weight:700;
  font-size:clamp(28px,3.6vw,42px);
  line-height:1.15;letter-spacing:-0.8px;
  margin-top:14px;max-width:18ch;
}
.sub{
  position:relative;z-index:1;
  color:var(--text-dim);font-size:15px;
  max-width:52ch;margin-top:14px;line-height:1.6;
}
.stat-row{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--border);
  border:1px solid var(--border);border-radius:12px;
  overflow:hidden;margin-top:32px;max-width:640px;
}
.stat-card{
  background:var(--panel);padding:18px 20px;
}
.stat-label{
  display:block;font-size:12px;color:var(--text-faint);
  margin-bottom:8px;
}
.stat-value{
  display:block;font-family:var(--font-mono);
  font-size:19px;font-weight:500;color:var(--text);
}

/* ---------- toolbar ---------- */
.toolbar{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:14px;flex-wrap:wrap;gap:12px;
}
.tabs{display:flex;gap:4px;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:3px;}
.tab{
  background:none;border:none;
  color:var(--text-dim);padding:7px 14px;border-radius:7px;
  font-size:13px;font-weight:500;cursor:pointer;
  font-family:var(--font-sans);transition:.15s;
}
.tab:hover{color:var(--text);}
.tab.active{background:var(--bg-alt);color:var(--text);}
.toolbar-right{display:flex;align-items:center;gap:12px;}
.refresh-note{font-size:12px;color:var(--text-faint);font-family:var(--font-mono);}
.refresh-btn{
  background:var(--panel);border:1px solid var(--border);
  color:var(--text-dim);width:32px;height:32px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.refresh-btn:hover{color:var(--accent);border-color:var(--accent);}
.refresh-btn.spin svg{animation:spin .7s linear;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---------- table ---------- */
.table-wrap{
  border:1px solid var(--border);border-radius:12px;overflow:hidden;
  background:var(--panel);
}
table{width:100%;border-collapse:collapse;}
thead th{
  text-align:right;font-size:11.5px;color:var(--text-faint);
  font-weight:500;
  padding:13px 16px;border-bottom:1px solid var(--border);
  background:var(--bg-alt);white-space:nowrap;
}
th.col-rank,th.col-name,th.col-chart{text-align:left;}
th.sortable{cursor:pointer;user-select:none;}
th.sortable:hover{color:var(--text);}
th.sortable.sort-active{color:var(--accent);}
tbody tr{border-bottom:1px solid var(--border-soft);transition:background .1s;}
tbody tr:last-child{border-bottom:none;}
tbody tr:hover{background:var(--bg-alt);}
td{padding:13px 16px;font-size:13.5px;white-space:nowrap;}
td.col-rank{color:var(--text-faint);font-family:var(--font-mono);width:36px;}
td.col-name{white-space:normal;}
.name-cell{display:flex;align-items:center;gap:12px;}
.token-icon{
  width:28px;height:28px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-weight:600;font-size:11px;
  color:#04140a;flex-shrink:0;
}
.token-name{font-weight:600;color:var(--text);}
.token-sym{color:var(--text-faint);font-size:12px;margin-left:6px;}
.token-tag{
  display:inline-block;margin-left:8px;font-size:10px;
  background:var(--accent-dim);color:var(--accent);
  border-radius:5px;padding:2px 6px;
  vertical-align:middle;font-weight:500;
}
.token-tag.amber{background:var(--amber-dim);color:var(--amber);}
td.col-num{text-align:right;font-family:var(--font-mono);}
.change.up{color:var(--accent);}
.change.down{color:var(--red);}
td.col-chart{width:110px;}
.loading-row td{text-align:center;color:var(--text-faint);padding:40px;font-size:13px;}

/* ---------- disclaimer ---------- */
.disclaimer{
  color:var(--text-faint);font-size:12px;margin-top:18px;line-height:1.6;
  max-width:70ch;
}

/* ---------- waitlist ---------- */
.waitlist{
  margin-top:64px;padding-top:56px;border-top:1px solid var(--border-soft);
}
.waitlist-inner{
  max-width:560px;
}
.waitlist h2{
  font-size:24px;font-weight:700;letter-spacing:-0.4px;
}
.waitlist p{
  color:var(--text-dim);font-size:14px;margin-top:8px;max-width:46ch;line-height:1.6;
}
.waitlist-form{
  display:flex;gap:10px;margin-top:22px;
}
.waitlist-form input[type="email"]{
  flex:1;background:var(--panel);border:1px solid var(--border);
  border-radius:8px;padding:11px 14px;color:var(--text);
  font-size:13.5px;font-family:var(--font-sans);outline:none;
}
.waitlist-form input[type="email"]:focus{border-color:var(--accent);}
.waitlist-form input[type="email"]::placeholder{color:var(--text-faint);}
.waitlist-form button{
  background:var(--accent);border:none;color:#04140a;
  font-weight:600;font-size:13.5px;padding:11px 20px;
  border-radius:8px;cursor:pointer;white-space:nowrap;
  font-family:var(--font-sans);
}
.waitlist-form button:hover{opacity:0.9;}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.waitlist-note{margin-top:12px;font-size:13px;color:var(--accent);min-height:18px;}
.waitlist-note.error{color:var(--red);}

/* ---------- footer ---------- */
.foot{
  border-top:1px solid var(--border-soft);
  padding:24px;text-align:center;
  color:var(--text-faint);font-size:12px;
}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .nav-links{display:none;}
  .stat-row{grid-template-columns:repeat(3,1fr);max-width:100%;}
  th.col-chart,td.col-chart{display:none;}
}
@media(max-width:600px){
  .stat-row{grid-template-columns:1fr;}
  th.col-num:nth-child(4),td.col-num:nth-child(4){display:none;}
  .search{width:130px;}
  .waitlist-form{flex-direction:column;}
}