<?php
$page          = 'home';
$pageTitle     = 'Aptum — Agents, Growth Tools & Data for Builders';
$pageDesc      = 'Aptum is an AI platform for agents, growth tools, analytics, and monetization. Evaluate X accounts, curate signals, generate content, and build with a data edge.';
$pageExtraHead = '<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet"><script src="https://cdnjs.cloudflare.com/ajax/libs/ethers/6.7.1/ethers.umd.min.js" crossorigin="anonymous"></script>';
include 'header.php';
?>
<style>
/* ══════════════════════════════════════
   TOKENS
══════════════════════════════════════ */
:root {
  --bg:        #F4F5F8;
  --bg1:       #ECEEF3;
  --bg2:       #FFFFFF;
  --bg3:       #F8F9FB;
  --bdr:       rgba(9,11,16,0.12);
  --bdr2:      rgba(9,11,16,0.22);
  --bdr3:      rgba(9,11,16,0.30);

  --ink:       #0A0C12;
  --ink2:      rgba(10,12,18,0.80);
  --ink3:      rgba(10,12,18,0.62);
  --ink4:      rgba(10,12,18,0.45);
  --ink5:      rgba(10,12,18,0.20);

  --green:     #0B7A42;
  --green-bg:  rgba(11,122,66,0.08);
  --red:       #B91C1C;

  --mono:      'IBM Plex Mono', monospace;
  --sans:      'IBM Plex Sans', sans-serif;
  --disp:      'Syne', sans-serif;
  --safe-b:    env(safe-area-inset-bottom, 0px);
  --safe-t:    env(safe-area-inset-top, 0px);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.6;
  overflow-x: hidden;
  cursor: none;
  -webkit-font-smoothing: antialiased;
}

/* subtle grid */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 0;
  background-image:
    linear-gradient(rgba(9,11,16,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(9,11,16,0.05) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
}

/* cursor, statusbar, navbar — provided by header.php */

/* ═══════════════════════
   TICKER TAPE
═══════════════════════ */
.tape {
  height: 28px; background: var(--bg1); border-bottom: 1px solid var(--bdr);
  overflow: hidden; display: flex; align-items: center; position: relative;
}
.tape::before, .tape::after {
  content:''; position:absolute; top:0; bottom:0; width:60px; z-index:2; pointer-events:none;
}
.tape::before { left:0; background: linear-gradient(to right, var(--bg1), transparent); }
.tape::after  { right:0; background: linear-gradient(to left, var(--bg1), transparent); }
.tape-track { display:flex; align-items:center; animation: scroll 28s linear infinite; white-space:nowrap; }
.tape-item {
  display:inline-flex; align-items:center; gap:7px;
  padding:0 18px; border-right:1px solid var(--bdr);
  font-size:9.5px; color:rgba(10,12,18,0.48); height:28px;
}
.tape-item .sym { color:var(--ink); font-weight:700; letter-spacing:.1em; }
.tape-item .up  { color:var(--green); font-weight:600; }
.tape-item .dn  { color:var(--red); font-weight:600; }
.tape-item .neu { color:var(--ink2); font-weight:500; }
@keyframes scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ═══════════════════════
   LAYOUT
═══════════════════════ */
#d-wrap { display:block; }
#m-wrap { display:none; }
.layout { padding-top: 68px; min-height: 100vh; display: flex; flex-direction: column; position: relative; z-index: 1; }

/* ═══════════════════════
   HERO
═══════════════════════ */
.hero {
  background: var(--bg2);
  border-bottom: 1.5px solid var(--bdr2);
  display: grid; grid-template-columns: 1fr 370px;
  box-shadow: 0 2px 16px rgba(9,11,16,.05);
}
.hero-main {
  padding: 28px 32px; border-right: 1px solid var(--bdr2);
  position: relative; overflow: hidden;
}
.hero-ascii-bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; display: block;
}
.hero-content { position: relative; z-index: 1; }
html, body, * { scrollbar-width: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar, *::-webkit-scrollbar { display: none; }
.hero-wm {
  position: absolute; right: -8px; top: -20px;
  font-family: var(--disp); font-weight: 800; font-size: 220px;
  line-height: 1; color: rgba(9,11,16,.035); pointer-events: none;
  user-select: none; letter-spacing: -.04em;
}
.tag-row { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
.tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase;
  padding: 3px 10px; border: 1px solid var(--bdr); color: var(--ink3); font-weight: 500;
}
.tag.live { border-color: var(--green); color: var(--green); background: var(--green-bg); font-weight: 700; }
.tag-dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; animation: blink 2s infinite; }
.hero-ticker {
  font-family: var(--disp); font-weight: 800;
  font-size: clamp(52px, 6.5vw, 92px); line-height: .9;
  letter-spacing: -.03em; color: var(--ink); margin-bottom: 6px;
}
.hero-sub { font-size: 13px; color: rgba(10,12,18,0.58); letter-spacing: .02em; margin-bottom: 22px; font-weight: 400; }
.metrics { display: flex; gap: 0; flex-wrap: wrap; }
.metric {
  padding: 11px 18px; border: 1px solid var(--bdr); border-right: none;
  display: flex; flex-direction: column; gap: 3px; background: var(--bg3);
  transition: background .13s; min-width: 100px;
}
.metric:hover { background: var(--bg1); }
.metric:first-child { border-left: 1px solid var(--bdr); }
.metric:last-child { border-right: 1px solid var(--bdr); }
.metric-val { font-size: 18px; font-weight: 700; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.metric-lbl { font-size: 8.5px; letter-spacing: .12em; text-transform: uppercase; color: rgba(10,12,18,0.48); font-weight: 600; }
.metric-chg { font-size: 9.5px; color: rgba(10,12,18,0.52); font-weight: 500; }

/* hero side */
.hero-side { display: flex; flex-direction: column; background: var(--bg1); }
.side-hd {
  padding: 11px 18px; border-bottom: 1px solid var(--bdr);
  display: flex; align-items: center; justify-content: space-between;
  background: var(--bg3);
}
.side-hd-lbl { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(10,12,18,0.55); font-weight: 600; }
.side-hd-r { font-size: 9.5px; color: var(--ink2); font-weight: 600; }
.price-display { padding: 20px 18px; border-bottom: 1px solid var(--bdr); text-align: center; background: var(--bg2); }
.price-main { font-size: 30px; font-weight: 700; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-bottom: 2px; }
.price-sub { font-size: 11.5px; color: var(--ink3); font-weight: 500; }
.sparkwrap { padding: 0 16px 8px; background: var(--bg2); border-bottom: 1px solid var(--bdr); }
.spark { width: 100%; height: 52px; display: block; }

.mkt-grid { display: grid; grid-template-columns: 1fr 1fr; }
.mkt-cell { padding: 10px 16px; border-right: 1px solid var(--bdr); border-bottom: 1px solid var(--bdr); }
.mkt-cell:nth-child(even) { border-right: none; }
.mkt-cell:nth-last-child(-n+2) { border-bottom: none; }
.mkt-lbl { font-size: 8.5px; text-transform: uppercase; letter-spacing: .12em; color: rgba(10,12,18,0.48); margin-bottom: 2px; font-weight: 700; }
.mkt-val { font-size: 12.5px; font-weight: 700; color: var(--ink); }
a.mkt-cell { text-decoration: none; display: block; color: inherit; transition: background .12s; }
a.mkt-cell:hover { background: var(--bg3); }
a.mkt-cell:hover .mkt-lbl { color: rgba(10,12,18,0.70); }

.chg-row { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--bdr); }
.chg-cell { padding: 8px 0; text-align: center; border-right: 1px solid var(--bdr); display: flex; flex-direction: column; gap: 2px; }
.chg-cell:last-child { border-right: none; }
.chg-lbl { font-size: 8px; color: rgba(10,12,18,0.45); letter-spacing: .10em; text-transform: uppercase; font-weight: 700; }
.chg-val { font-size: 11.5px; font-weight: 700; color: var(--ink3); }
.chg-val.pos { color: var(--green); }
.chg-val.neg { color: var(--red); }

.txn-row { padding: 9px 16px; border-top: 1px solid var(--bdr); display: flex; justify-content: space-between; align-items: center; }
.txn-lbl { font-size: 8.5px; color: rgba(10,12,18,0.48); letter-spacing: .09em; text-transform: uppercase; font-weight: 700; }
.txn-val { font-size: 11.5px; color: var(--ink); font-weight: 600; }

.buy-panel { padding: 12px 14px; display: flex; flex-direction: column; gap: 7px; }
.btn-primary {
  width: 100%; padding: 14px 16px; background: var(--ink); color: var(--bg2);
  border: none; cursor: none; font-family: var(--mono); font-size: 12px;
  font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  display: flex; align-items: center; justify-content: space-between;
  transition: background .13s; text-decoration: none;
}
.btn-primary:hover { background: #1e2130; }
.btn-outline {
  width: 100%; padding: 10px 16px; background: transparent; color: var(--ink2);
  border: 1px solid var(--bdr); cursor: none; font-family: var(--mono);
  font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  transition: border-color .13s, color .13s, background .13s;
  display: flex; align-items: center; justify-content: space-between;
  text-decoration: none;
}
.btn-outline:hover { border-color: var(--bdr2); color: var(--ink); background: var(--bg3); }

.ca-row {
  padding: 9px 16px; border-top: 1px solid var(--bdr);
  display: flex; align-items: center; gap: 8px; background: var(--bg3);
}
.ca-addr { font-size: 9px; color: var(--ink3); letter-spacing: .02em; word-break: break-all; flex: 1; }
.ca-copy {
  font-size: 9px; color: var(--ink2); background: none; border: 1px solid var(--bdr);
  cursor: none; padding: 3px 9px; white-space: nowrap; font-family: var(--mono);
  letter-spacing: .08em; font-weight: 600;
  transition: color .13s, background .13s, border-color .13s;
}
.ca-copy:hover { color: var(--bg2); background: var(--ink); border-color: var(--ink); }

/* ═══════════════════════
   3-COL BODY
═══════════════════════ */
.body { display: grid; grid-template-columns: 220px 1fr 300px; flex: 1; border-bottom: 1px solid var(--bdr); }

/* LEFT */
.left { border-right: 1.5px solid var(--bdr2); display: flex; flex-direction: column; background: var(--bg2); }
.panel-hd {
  padding: 9px 15px; border-bottom: 1.5px solid var(--bdr2);
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--ink4); background: var(--bg1); font-weight: 700;
  display: flex; align-items: center; justify-content: space-between;
}
.left-nav { display: flex; flex-direction: column; }
.left-link {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 15px; border-bottom: 1px solid var(--bdr);
  color: var(--ink3); font-size: 11.5px; cursor: none;
  transition: background .1s, color .1s;
  background: none; border-left: none; border-right: none; border-top: none;
  width: 100%; text-align: left; font-family: var(--mono); font-weight: 500;
}
.left-link:hover { background: var(--bg3); color: var(--ink2); }
.left-link.active { background: var(--bg3); color: var(--ink); font-weight: 700; border-left: 3px solid var(--ink); padding-left: 12px; }
.left-link-arr { font-size: 10.5px; color: var(--ink5); }
.left-link:hover .left-link-arr, .left-link.active .left-link-arr { color: var(--ink3); }

.left-section { padding: 16px 15px; border-bottom: 1px solid var(--bdr); }
.left-section-ttl { font-size: 9px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink4); margin-bottom: 11px; font-weight: 700; }
.left-kv { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.left-k { font-size: 10.5px; color: var(--ink3); font-weight: 500; }
.left-v { font-size: 10.5px; color: var(--ink2); font-variant-numeric: tabular-nums; font-weight: 500; }
.left-v.ok { color: var(--green); font-weight: 700; }
.left-v a { color: var(--ink2); font-size: 10.5px; font-weight: 600; transition: color .13s; }
.left-v a:hover { color: var(--ink); text-decoration: underline; }

/* CENTER */
.center { display: flex; flex-direction: column; }
.section {
  border-bottom: 1px solid var(--bdr);
  opacity: 0; transform: translateY(12px);
  transition: opacity .5s ease, transform .5s ease;
}
.section.visible { opacity: 1; transform: translateY(0); }
.section-hd {
  padding: 9px 22px; border-bottom: 1px solid var(--bdr2);
  display: flex; align-items: center; gap: 10px; background: var(--bg1);
  flex-wrap: wrap;
}
.section-num {
  font-size: 8.5px; color: rgba(10,12,18,0.42); letter-spacing: .1em;
  font-weight: 700; border: 1px solid var(--bdr); padding: 2px 6px; background: var(--bg3);
}
.section-pipe { color: var(--bdr); }
.section-title { font-size: 11px; color: var(--ink); letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.section-sub { font-size: 10px; color: rgba(10,12,18,0.55); flex: 1; min-width: 120px; font-weight: 500; }
.section-status { font-size: 8.5px; color: rgba(10,12,18,0.42); margin-left: auto; letter-spacing: .08em; font-weight: 600; white-space: nowrap; }
.section-status.ok { color: var(--green); }
.section-body { padding: 20px 22px; }

/* Stats grid */
.stats-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--bdr); border: 1px solid var(--bdr); margin-bottom: 16px; }
.stat-cell { background: var(--bg2); padding: 18px 20px; display: flex; flex-direction: column; gap: 4px; transition: background .13s; }
.stat-cell:hover { background: var(--bg3); }
.stat-val { font-size: 26px; font-weight: 700; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.stat-lbl { font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: rgba(10,12,18,0.58); font-weight: 600; }
.stat-chg { font-size: 10.5px; color: var(--ink3); font-weight: 500; }

/* Log */
.log { display: flex; flex-direction: column; border: 1px solid var(--bdr); overflow: hidden; }
.log-row {
  display: grid; grid-template-columns: 76px 1fr auto;
  align-items: center; border-bottom: 1px solid var(--bdr);
  padding: 11px 16px; font-size: 11.5px; transition: background .1s;
}
.log-row:last-child { border-bottom: none; }
.log-row:hover { background: var(--bg3); }
.log-ts { font-size: 8.5px; color: rgba(10,12,18,0.48); letter-spacing: .06em; font-variant-numeric: tabular-nums; font-weight: 600; }
.log-msg { color: rgba(10,12,18,0.72); font-weight: 500; font-size: 11px; }
.log-msg .hl { color: var(--ink); font-weight: 700; }
.log-msg .gr { color: var(--green); font-weight: 700; }
.log-val { font-size: 9.5px; color: var(--ink3); text-align: right; font-weight: 600; }

/* Table */
.t-table { width: 100%; border: 1px solid var(--bdr); border-collapse: collapse; }
.t-table th {
  padding: 8px 14px; border-bottom: 1px solid var(--bdr2); border-right: 1px solid var(--bdr);
  font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(10,12,18,0.58);
  text-align: left; background: var(--bg1); font-weight: 700;
}
.t-table th:last-child { border-right: none; }
.t-table td {
  padding: 10px 14px; border-bottom: 1px solid var(--bdr); border-right: 1px solid var(--bdr);
  font-size: 11px; color: rgba(10,12,18,0.75); transition: background .1s; font-weight: 500;
}
.t-table td:last-child { border-right: none; }
.t-table tr:last-child td { border-bottom: none; }
.t-table tr:hover td { background: var(--bg3); }
.status-live { color: var(--green); font-weight: 700; }
.status-soon { color: var(--ink3); font-weight: 600; }
.status-tba  { color: var(--ink4); }
.td-bold { color: var(--ink); font-weight: 700; }

/* Tokenomics grid */
.tok-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: var(--bdr); border: 1px solid var(--bdr); margin-bottom: 16px; }
.tok-cell { background: var(--bg2); padding: 12px 16px; }
.tok-key { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(10,12,18,0.48); margin-bottom: 3px; font-weight: 700; }
.tok-val { font-size: 14px; color: var(--ink); font-weight: 600; }

/* Mechanism */
.mech-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--bdr); border: 1px solid var(--bdr); }
.mech-cell {
  background: var(--bg2); padding: 18px 16px;
  position: relative; overflow: hidden; transition: background .13s;
}
.mech-cell:hover { background: var(--bg3); }
.mech-cell::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:transparent; transition:background .2s; }
.mech-cell:hover::before { background: var(--ink); }
.mech-sym { font-family: var(--disp); font-size: 24px; font-weight: 800; color: var(--ink); margin-bottom: 8px; line-height: 1; }
.mech-name { font-size: 11px; color: var(--ink); font-weight: 700; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .12em; }
.mech-desc { font-size: 11px; color: rgba(10,12,18,0.58); line-height: 1.65; font-weight: 500; }

/* Callout */
.callout {
  border: 1px solid var(--bdr); background: var(--bg3);
  padding: 13px 18px; margin-top: 14px;
  display: flex; gap: 12px; align-items: flex-start;
  border-left: 2px solid var(--bdr3);
}
.callout-pre { font-size: 8.5px; color: rgba(10,12,18,0.42); letter-spacing: .12em; white-space: nowrap; padding-top: 2px; font-weight: 700; }
.callout-text { font-size: 11.5px; color: rgba(10,12,18,0.70); line-height: 1.7; font-weight: 500; }

/* Roadmap */
.roadmap-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--bdr); border: 1px solid var(--bdr); }
.phase { background: var(--bg2); padding: 16px 15px; display: flex; flex-direction: column; gap: 8px; position: relative; overflow: hidden; transition: background .13s; }
.phase:hover { background: var(--bg3); }
.phase-active { background: var(--bg3) !important; }
.phase-active::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: var(--ink); }
.phase-tag { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(10,12,18,0.45); display: flex; align-items: center; gap: 5px; font-weight: 700; }
.phase-tag .dot { width: 4px; height: 4px; border-radius: 50%; background: var(--ink5); }
.phase-active .phase-tag { color: var(--green); }
.phase-active .phase-tag .dot { background: var(--green); }
.phase-name { font-family: var(--disp); font-size: 19px; font-weight: 800; color: var(--ink); }
.phase-period { font-size: 10.5px; color: var(--ink3); font-weight: 600; }
.phase-items { list-style: none; display: flex; flex-direction: column; gap: 5px; margin-top: 3px; }
.phase-items li { font-size: 11px; color: rgba(10,12,18,0.58); line-height: 1.5; display: flex; gap: 7px; align-items: flex-start; font-weight: 500; }
.phase-items li::before { content: '—'; color: var(--ink5); flex-shrink: 0; }
.phase-items li.done { color: rgba(10,12,18,0.75); font-weight: 600; }
.phase-items li.done::before { content: '✓'; color: var(--green); }

/* CTA */
.cta {
  background: var(--bg2); border-bottom: 1px solid var(--bdr);
  padding: 36px 32px;
  display: grid; grid-template-columns: 1fr auto; gap: 36px; align-items: center;
  opacity: 0; transform: translateY(12px);
  transition: opacity .5s ease, transform .5s ease;
}
.cta.visible { opacity: 1; transform: translateY(0); }
.cta-title { font-family: var(--disp); font-size: clamp(30px,3.5vw,48px); font-weight: 800; line-height: 1.04; letter-spacing: -.02em; color: var(--ink); margin-bottom: 10px; }
.cta-title span { color: var(--ink4); }
.cta-sub { font-size: 12.5px; color: rgba(10,12,18,0.60); line-height: 1.75; max-width: 520px; font-weight: 500; }
.cta-actions { display: flex; flex-direction: column; gap: 10px; min-width: 200px; }
.social-row { display: flex; gap: 7px; margin-top: 16px; flex-wrap: wrap; }
.social-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 14px; border: 1px solid var(--bdr);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink2); font-weight: 600;
  transition: border-color .13s, color .13s, background .13s; cursor: none;
}
.social-btn:hover { border-color: var(--bdr2); color: var(--ink); background: var(--bg3); }
.social-btn svg { width: 12px; height: 12px; fill: currentColor; }

/* RIGHT */
.right { border-left: 1.5px solid var(--bdr2); display: flex; flex-direction: column; background: var(--bg2); }

.phase-mini { padding: 11px 14px; border-bottom: 1px solid var(--bdr); }
.phase-mini-hd { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(10,12,18,0.45); margin-bottom: 8px; font-weight: 700; }
.phase-bar { height: 3px; background: var(--bg1); margin-bottom: 8px; overflow: hidden; }
.phase-bar-fill { height: 100%; background: var(--ink); width: 80%; }
.phase-progress { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--ink4); font-weight: 600; }
.phase-progress .cur { color: var(--ink2); }

.token-panel { padding: 15px; border-bottom: 1px solid var(--bdr); }
.token-panel-hd { font-size: 8.5px; letter-spacing: .15em; text-transform: uppercase; color: rgba(10,12,18,0.48); margin-bottom: 8px; font-weight: 700; }
.token-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--bdr); }
.token-row:last-child { border-bottom: none; }
.token-key { font-size: 10px; color: rgba(10,12,18,0.55); font-weight: 500; }
.token-val { font-size: 11px; color: var(--ink); font-variant-numeric: tabular-nums; font-weight: 600; }
.token-val.ok { color: var(--green); font-weight: 700; }

/* FOOTER */
.footer {
  position: relative; z-index: 1; height: 28px;
  background: var(--ink); border-top: 1px solid rgba(255,255,255,.09);
  display: flex; align-items: center; padding: 0;
}
.footer-cell {
  display: flex; align-items: center; gap: 7px;
  padding: 0 14px; border-right: 1px solid rgba(255,255,255,.08);
  font-size: 9px; color: rgba(255,255,255,.42); height: 28px; font-weight: 500;
}
.footer-cell:first-child { padding-left: 0; }
.footer-cell .val { color: rgba(255,255,255,.62); font-weight: 600; }
.footer-cell a { color: rgba(255,255,255,.5); transition: color .13s; cursor: none; font-weight: 600; }
.footer-cell a:hover { color: rgba(255,255,255,.95); }
.footer-right { margin-left: auto; padding-right: 14px; font-size: 9px; color: rgba(255,255,255,.28); }

/* #progress — provided by header.php */

/* ═══════════════════════
   RESPONSIVE
═══════════════════════ */
@media (max-width: 1280px) {
  .body { grid-template-columns: 190px 1fr 265px; }
  .hero { grid-template-columns: 1fr 320px; }
}
@media (max-width: 1060px) {
  .body { grid-template-columns: 1fr 255px; }
  .left { display: none; }
  .hero { grid-template-columns: 1fr 280px; }
  .roadmap-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 860px) {
  .body { grid-template-columns: 1fr; }
  .right { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-side { display: none; }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .mech-row { grid-template-columns: 1fr; }
  .cta { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .layout { padding-top: 42px; }
  .navbar { display: none; }
  .tok-grid { grid-template-columns: 1fr; }
  .roadmap-grid { grid-template-columns: 1fr; }
  .section-body { padding: 16px; }
  .hero-main { padding: 20px 16px; }
  .hero-ticker { font-size: 52px; }
  .t-table { font-size: 10.5px; }
  .t-table th, .t-table td { padding: 9px 10px; }
  .cta { padding: 32px 20px; }
}

/* ═══════════════════════
   DARK MODE OVERRIDES
═══════════════════════ */
html[data-theme="dark"] .tape-item { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] .side-hd-lbl { color: rgba(239,241,248,0.55); }
html[data-theme="dark"] .mkt-lbl { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] a.mkt-cell:hover .mkt-lbl { color: rgba(239,241,248,0.70); }
html[data-theme="dark"] .hero-sub { color: rgba(239,241,248,0.58); }
html[data-theme="dark"] .metric-lbl { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] .metric-chg { color: rgba(239,241,248,0.52); }
html[data-theme="dark"] .section-num { color: rgba(239,241,248,0.42); }
html[data-theme="dark"] .section-sub { color: rgba(239,241,248,0.55); }
html[data-theme="dark"] .section-status { color: rgba(239,241,248,0.42); }
html[data-theme="dark"] .stat-lbl { color: rgba(239,241,248,0.58); }
html[data-theme="dark"] .log-ts { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] .log-msg { color: rgba(239,241,248,0.72); }
html[data-theme="dark"] .t-table th { color: rgba(239,241,248,0.58); }
html[data-theme="dark"] .t-table td { color: rgba(239,241,248,0.75); }
html[data-theme="dark"] .tok-key { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] .mech-desc { color: rgba(239,241,248,0.58); }
html[data-theme="dark"] .callout-pre { color: rgba(239,241,248,0.42); }
html[data-theme="dark"] .callout-text { color: rgba(239,241,248,0.70); }
html[data-theme="dark"] .phase-tag { color: rgba(239,241,248,0.45); }
html[data-theme="dark"] .phase-items li { color: rgba(239,241,248,0.58); }
html[data-theme="dark"] .phase-items li.done { color: rgba(239,241,248,0.75); }
html[data-theme="dark"] .cta-sub { color: rgba(239,241,248,0.60); }
html[data-theme="dark"] .token-panel-hd { color: rgba(239,241,248,0.48); }
html[data-theme="dark"] .token-key { color: rgba(239,241,248,0.55); }
html[data-theme="dark"] .phase-mini-hd { color: rgba(239,241,248,0.45); }
html[data-theme="dark"] .chg-lbl { color: rgba(239,241,248,0.45); }
html[data-theme="dark"] .txn-lbl { color: rgba(239,241,248,0.48); }

/* ══════════════════════
   MOBILE
══════════════════════ */
:root {
  --m-bg0:  #080A0F;
  --m-glass:  rgba(255,255,255,0.055);
  --m-glass2: rgba(255,255,255,0.034);
  --m-gb:  rgba(255,255,255,0.11);
  --m-gb2: rgba(255,255,255,0.07);
  --m-ink:  #FFFFFF;
  --m-ink2: rgba(255,255,255,0.72);
  --m-ink3: rgba(255,255,255,0.44);
  --m-ink4: rgba(255,255,255,0.22);
  --m-green: #34D399;
  --m-gdim: rgba(52,211,153,0.10);
}

@media (pointer: coarse), (max-width: 759px) {
  body { background: var(--m-bg0); color: var(--m-ink); cursor: auto; scrollbar-width: none; }
  body::-webkit-scrollbar { display: none; }
  body::after { display: none; }
  .navbar { display: none; }
  #cursor, #progress { display: none; }
  #d-wrap { display: none; }
  #m-wrap { display: block; }

  .m-orb { position: fixed; border-radius: 50%; pointer-events: none; z-index: 0; }
  .m-orb-1 { width: 480px; height: 480px; top: -100px; left: -160px; background: radial-gradient(circle, rgba(60,80,150,.18) 0%, transparent 68%); animation: mOrb 18s ease-in-out infinite; }
  .m-orb-2 { width: 360px; height: 360px; bottom: 22%; right: -80px; background: radial-gradient(circle, rgba(30,65,120,.14) 0%, transparent 68%); animation: mOrb 24s ease-in-out infinite reverse; }
  @keyframes mOrb { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-24px) scale(1.03)} }

  .m-glass { background: var(--m-glass); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); border: 1px solid var(--m-gb); border-radius: 18px; position: relative; overflow: hidden; }
  .m-glass::before { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(140deg,rgba(255,255,255,0.07) 0%,transparent 60%); pointer-events:none; }
  .m-glass-sm { background: var(--m-glass2); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--m-gb2); border-radius: 12px; }

  .m-topnav { position: fixed; top: 0; left: 0; right: 0; z-index: 200; height: calc(58px + var(--safe-t)); padding: var(--safe-t) 18px 0; display: flex; align-items: center; justify-content: space-between; background: rgba(8,10,15,.88); backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px); border-bottom: 1px solid var(--m-gb2); }
  .m-logo { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 17px; letter-spacing: .12em; color: var(--m-ink); }
  .m-live-pill { display: flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 100px; background: var(--m-glass); border: 1px solid var(--m-gb); font-size: 10.5px; color: var(--m-ink2); }
  .m-ldot { width: 6px; height: 6px; background: var(--m-green); border-radius: 50%; animation: mBreathe 2.5s ease-in-out infinite; }
  @keyframes mBreathe { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(52,211,153,.5)} 50%{opacity:.6;box-shadow:0 0 0 4px rgba(52,211,153,0)} }

  .m-bnav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 200; padding: 10px 14px calc(var(--safe-b) + 10px); background: rgba(8,10,15,.94); backdrop-filter: blur(36px); -webkit-backdrop-filter: blur(36px); border-top: 1px solid var(--m-gb2); }
  .m-bnav-inner { display: flex; justify-content: space-around; align-items: center; max-width: 420px; margin: 0 auto; }
  .m-bnav-btn { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 12px; border-radius: 10px; min-width: 48px; background: transparent; border: none; color: var(--m-ink4); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: color .2s, background .2s; }
  .m-bnav-btn.active { color: var(--m-ink); background: rgba(255,255,255,.07); }
  .m-bnav-btn svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .m-bnav-lbl { font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase; font-family: 'IBM Plex Mono', monospace; }

  .m-shell { position: relative; z-index: 1; padding-top: calc(58px + var(--safe-t)); padding-bottom: calc(var(--safe-b) + 76px); min-height: 100dvh; }
  .m-screen { display: none; padding: 0 15px 22px; max-width: 460px; margin: 0 auto; animation: mIn .28s ease forwards; }
  .m-screen.active { display: block; }
  @keyframes mIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }

  /* Price card */
  .m-price-card { border-radius: 18px; margin-bottom: 12px; overflow: hidden; background: var(--m-glass); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid var(--m-gb); position: relative; }
  .m-price-card::before { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(140deg,rgba(255,255,255,.07) 0%,transparent 60%); pointer-events:none; }
  .m-pc-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 15px 9px; border-bottom: 1px solid var(--m-gb2); }
  .m-pc-lbl { display: flex; align-items: center; gap: 6px; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-ink4); }
  .m-pc-live-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--m-green); animation: mBreathe 2.5s ease-in-out infinite; }
  .m-pc-dex { font-size: 9px; color: var(--m-ink4); }
  .m-pc-price-row { display: flex; align-items: baseline; justify-content: space-between; padding: 11px 15px 8px; }
  .m-pc-price { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; line-height: 1; color: var(--m-ink); }
  .m-pc-price-load { font-size: 12px; color: var(--m-ink4); animation: mPulse 1.5s ease-in-out infinite; }
  @keyframes mPulse { 0%,100%{opacity:.35} 50%{opacity:1} }
  .m-pc-chg { font-size: 11.5px; font-weight: 600; padding: 3px 8px; border-radius: 100px; }
  .m-pc-chg.pos { color: var(--m-green); background: var(--m-gdim); }
  .m-pc-chg.neg { color: rgba(255,90,90,.9); background: rgba(255,70,70,.09); }
  .m-pc-chg.neu { color: var(--m-ink3); background: var(--m-glass2); }
  .m-pc-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--m-gb2); }
  .m-pc-cell { padding: 9px 10px; border-right: 1px solid var(--m-gb2); display: flex; flex-direction: column; gap: 2px; }
  .m-pc-cell:last-child { border-right: none; }
  .m-pc-ck { font-size: 7.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--m-ink4); }
  .m-pc-cv { font-size: 11.5px; font-weight: 600; color: var(--m-ink); }
  .m-pc-tcs { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--m-gb2); }
  .m-pc-tc { padding: 7px 0; text-align: center; border-right: 1px solid var(--m-gb2); display: flex; flex-direction: column; gap: 2px; }
  .m-pc-tc:last-child { border-right: none; }
  .m-pc-tc-l { font-size: 7.5px; color: var(--m-ink4); letter-spacing: .1em; }
  .m-pc-tc-v { font-size: 10.5px; font-weight: 600; color: var(--m-ink3); }
  .m-pc-tc-v.pos { color: var(--m-green); }
  .m-pc-tc-v.neg { color: rgba(255,90,90,.85); }
  .m-pc-foot { padding: 7px 15px; border-top: 1px solid var(--m-gb2); display: flex; align-items: center; justify-content: space-between; }
  .m-pc-foot-up { font-size: 8.5px; color: var(--m-ink4); }
  .m-pc-foot-lnk { font-size: 8.5px; color: var(--m-ink3); text-decoration: none; display: flex; align-items: center; gap: 3px; }

  /* Stats */
  .m-s-head { padding: 26px 0 16px; }
  .m-s-eye { font-size: 9px; letter-spacing: .22em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 6px; }
  .m-s-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; line-height: 1.08; letter-spacing: -.02em; color: var(--m-ink); }
  .m-s-body { font-size: 12.5px; line-height: 1.7; color: var(--m-ink3); margin-top: 6px; }

  /* Hero */
  .m-hero-kicker { display: flex; align-items: center; gap: 10px; font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 16px; padding-top: 28px; }
  .m-kline { flex: 1; height: 1px; background: var(--m-gb); max-width: 30px; }
  .m-hero-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(50px,13vw,68px); line-height: .88; letter-spacing: -.03em; color: var(--m-ink); margin-bottom: 5px; }
  .m-hero-out { display: block; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.5); }
  .m-hero-tag { font-size: 12.5px; color: var(--m-ink4); margin-bottom: 22px; font-weight: 300; }

  .m-pgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 12px; }
  .m-pcard { padding: 16px 14px; display: flex; flex-direction: column; gap: 3px; }
  .m-pn { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; line-height: 1; color: var(--m-ink); }
  .m-pl { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-ink3); }
  .m-pt { font-size: 8.5px; color: var(--m-green); margin-top: 2px; }

  .m-buy-btn { width: 100%; padding: 17px 20px; border-radius: 18px; background: var(--m-ink); color: var(--m-bg0); font-family: 'Syne', sans-serif; font-weight: 800; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; border: none; display: flex; align-items: center; justify-content: space-between; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: opacity .14s; margin-bottom: 9px; position: relative; overflow: hidden; text-decoration: none; }
  .m-buy-btn::before { content:''; position:absolute; top:0; left:0; right:0; height:50%; background:linear-gradient(to bottom,rgba(255,255,255,.1),transparent); border-radius:18px 18px 0 0; pointer-events:none; }
  .m-buy-btn:active { opacity: .85; }
  .m-buy-arr { font-size: 20px; opacity: .7; }

  .m-sec-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 16px; }
  .m-sec-btn { padding: 13px 10px; border-radius: 12px; background: var(--m-glass2); border: 1px solid var(--m-gb2); font-size: 10.5px; color: var(--m-ink2); display: flex; align-items: center; justify-content: center; gap: 6px; -webkit-tap-highlight-color: transparent; text-decoration: none; }
  .m-sec-btn svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 1.8; flex-shrink: 0; }

  .m-loop { padding: 18px; border-radius: 12px; margin-bottom: 24px; }
  .m-loop-lbl { font-size: 8.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 10px; }
  .m-loop-flow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
  .m-lf-s { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 13.5px; color: var(--m-ink); }
  .m-lf-a { color: var(--m-ink4); font-size: 13px; }
  .m-lf-s.acc { color: var(--m-green); }
  .m-loop-desc { font-size: 10.5px; color: var(--m-ink4); line-height: 1.65; }

  .m-stats-list { display: flex; flex-direction: column; gap: 9px; margin-bottom: 16px; }
  .m-stat-row { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; }
  .m-stat-l { display: flex; flex-direction: column; gap: 2px; }
  .m-stat-lbl { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-ink3); }
  .m-stat-tag { font-size: 9.5px; color: var(--m-green); }
  .m-stat-val { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; color: var(--m-ink); line-height: 1; }

  .m-callout-g { padding: 16px 18px; border-radius: 12px; background: var(--m-gdim); border: 1px solid rgba(52,211,153,.16); font-size: 12.5px; color: var(--m-ink2); line-height: 1.7; margin-bottom: 16px; }
  .m-callout-g strong { color: var(--m-green); font-weight: 500; }

  .m-mech-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 18px; }
  .m-mech-card { padding: 14px 9px; border-radius: 12px; display: flex; flex-direction: column; gap: 4px; align-items: center; text-align: center; }
  .m-mech-sym { font-family: 'Syne', sans-serif; font-size: 22px; font-weight: 800; color: var(--m-ink); }
  .m-mech-name { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--m-ink2); }
  .m-mech-desc { font-size: 9.5px; color: var(--m-ink4); line-height: 1.55; }

  .m-vert-list { display: flex; flex-direction: column; gap: 9px; margin-bottom: 16px; }
  .m-vert-item { padding: 18px 16px; display: flex; align-items: flex-start; gap: 13px; }
  .m-vert-ico { width: 44px; height: 44px; border-radius: 12px; background: var(--m-glass); border: 1px solid var(--m-gb); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
  .m-vert-body { flex: 1; }
  .m-vert-pill { display: inline-flex; align-items: center; gap: 4px; font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--m-green); background: var(--m-gdim); border: 1px solid rgba(52,211,153,.18); border-radius: 100px; padding: 2px 9px; margin-bottom: 6px; }
  .m-vert-pill.fut { color: var(--m-ink4); background: var(--m-glass2); border-color: var(--m-gb2); }
  .m-vert-pd { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }
  .m-vert-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: var(--m-ink); margin-bottom: 4px; }
  .m-vert-desc { font-size: 11.5px; color: var(--m-ink3); line-height: 1.65; }

  .m-tok-row { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 18px; }
  .m-tok-cell { padding: 14px; border-radius: 12px; }
  .m-tok-key { font-size: 8.5px; letter-spacing: .15em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 4px; }
  .m-tok-val { font-family: 'Syne', sans-serif; font-size: 14px; font-weight: 700; color: var(--m-ink); }

  .m-timeline { display: flex; flex-direction: column; position: relative; margin-bottom: 20px; }
  .m-timeline::before { content:''; position:absolute; left:5px; top:14px; bottom:26px; width:1px; background:linear-gradient(to bottom, var(--m-green), rgba(255,255,255,.05) 40%, transparent); }
  .m-ph-entry { display: flex; gap: 16px; padding-bottom: 16px; }
  .m-ph-dot-col { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; padding-top: 3px; }
  .m-ph-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--m-gb2); background: var(--m-bg0); z-index: 1; }
  .m-ph-dot.active { border-color: var(--m-green); background: var(--m-green); box-shadow: 0 0 8px rgba(52,211,153,.5); }
  .m-ph-card { flex: 1; padding: 16px; border-radius: 12px; }
  .m-ph-card.cur { background: var(--m-glass); border: 1px solid var(--m-gb); }
  .m-ph-card.fut { background: transparent; border: 1px solid var(--m-gb2); }
  .m-ph-tag { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 2px; }
  .m-ph-name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 17px; color: var(--m-ink); margin-bottom: 2px; }
  .m-ph-period { font-size: 9.5px; color: var(--m-ink4); margin-bottom: 9px; }
  .m-ph-items { list-style: none; display: flex; flex-direction: column; gap: 5px; }
  .m-ph-items li { font-size: 11.5px; color: var(--m-ink3); display: flex; gap: 8px; align-items: flex-start; line-height: 1.5; }
  .m-ph-items li::before { content:''; width:3px; height:3px; background:var(--m-ink4); border-radius:50%; flex-shrink:0; margin-top:6px; }
  .m-ph-items li.done { color: var(--m-ink2); }
  .m-ph-items li.done::before { background: var(--m-green); }

  .m-comm-hero { padding: 30px 0 20px; text-align: center; }
  .m-comm-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 28px; line-height: 1.05; letter-spacing: -.02em; color: var(--m-ink); margin-bottom: 9px; }
  .m-comm-title span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.4); }
  .m-comm-sub { font-size: 12.5px; color: var(--m-ink3); line-height: 1.7; max-width: 260px; margin: 0 auto 22px; }
  .m-comm-links { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
  .m-comm-link { display: flex; align-items: center; gap: 13px; padding: 16px 16px; border-radius: 18px; -webkit-tap-highlight-color: transparent; transition: opacity .14s; cursor: pointer; border: none; width: 100%; text-align: left; text-decoration: none; }
  .m-comm-link:active { opacity: .8; }
  .m-comm-link.secondary { background: var(--m-glass); border: 1px solid var(--m-gb); }
  .m-comm-ico { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
  .m-comm-link.secondary .m-comm-ico { background: var(--m-glass); border: 1px solid var(--m-gb); }
  .m-comm-ico svg { width: 18px; height: 18px; }
  .m-comm-text { flex: 1; }
  .m-comm-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; }
  .m-comm-link.secondary .m-comm-name { color: var(--m-ink); }
  .m-comm-sub2 { font-size: 10.5px; margin-top: 1px; }
  .m-comm-link.secondary .m-comm-sub2 { color: var(--m-ink4); }
  .m-comm-arr { font-size: 17px; color: var(--m-ink4); }

  .m-contract { padding: 14px; border-radius: 12px; margin-bottom: 12px; }
  .m-contract-lbl { font-size: 8.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 5px; }
  .m-contract-addr { font-size: 10.5px; color: var(--m-ink2); word-break: break-all; line-height: 1.6; }
  .m-copy-btn { display: inline-flex; align-items: center; gap: 5px; margin-top: 7px; font-size: 9.5px; color: var(--m-ink4); font-family: 'IBM Plex Mono', monospace; background: none; border: none; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .m-copy-btn svg { width: 11px; height: 11px; stroke: currentColor; fill: none; stroke-width: 1.8; }
  .m-foot { text-align: center; font-size: 9.5px; color: var(--m-ink4); padding: 6px 0 2px; }

  /* Mobile sheet */
  .m-sheet-overlay { position: fixed; inset: 0; z-index: 900; background: rgba(0,0,0,.5); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); opacity: 0; pointer-events: none; transition: opacity .22s ease; }
  .m-sheet-overlay.open { opacity: 1; pointer-events: all; }
  .m-buy-sheet { position: fixed; bottom: 0; left: 0; right: 0; z-index: 901; border-radius: 26px 26px 0 0; background: rgba(11,14,22,.98); backdrop-filter: blur(36px); -webkit-backdrop-filter: blur(36px); border: 1px solid var(--m-gb); border-bottom: none; padding: 0 18px calc(var(--safe-b) + 22px); transform: translateY(100%); transition: transform .28s cubic-bezier(0.32,0.72,0,1); max-height: 88dvh; display: flex; flex-direction: column; overflow: hidden; }
  .m-buy-sheet.open { transform: translateY(0); }
  .m-sheet-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 6px; }
  .m-sheet-body::-webkit-scrollbar { display: none; }
  .m-sheet-topbar { flex-shrink: 0; }
  .m-sheet-handle { width: 34px; height: 4px; background: var(--m-gb); border-radius: 2px; margin: 12px auto 16px; }
  .m-sheet-title { font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--m-ink4); margin-bottom: 0; }
  .m-buy-opt { display: flex; align-items: center; gap: 13px; padding: 15px 16px; border-radius: 12px; background: var(--m-glass2); border: 1px solid var(--m-gb2); text-decoration: none; margin-bottom: 9px; -webkit-tap-highlight-color: transparent; transition: background .14s; }
  .m-buy-opt:active { background: var(--m-glass); }
  .m-buy-opt-ico { width: 42px; height: 42px; border-radius: 11px; background: var(--m-glass); border: 1px solid var(--m-gb); display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; }
  .m-buy-opt-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: var(--m-ink); }
  .m-buy-opt-sub { font-size: 10.5px; color: var(--m-ink4); margin-top: 2px; }
  .m-buy-opt-arr { color: var(--m-ink4); font-size: 17px; }
}
</style>

<!-- ══════════════════════
     DESKTOP
══════════════════════ -->
<div id="d-wrap">

  <div class="layout">

    <!-- HERO -->
    <div class="hero" id="overview">
      <div class="hero-main">
        <canvas class="hero-ascii-bg" id="hero-ascii"></canvas>
        <div class="hero-wm">A</div>
        <div class="hero-content">
        <div class="tag-row">
          <span class="tag live"><span class="tag-dot"></span>PLATFORM LIVE</span>
          <span class="tag">AGENTS &amp; TOOLS</span>
        </div>
        <div class="hero-ticker">APTUM</div>
        <div class="hero-sub">Agents, growth tools, analytics &amp; monetization — a data edge for builders in crypto and AI</div>
        <div class="metrics">
          <div class="metric">
            <div class="metric-val">7</div>
            <div class="metric-lbl">Live Tools</div>
            <div class="metric-chg">● all running</div>
          </div>
          <div class="metric">
            <div class="metric-val" id="d-impressions">—</div>
            <div class="metric-lbl">Impressions</div>
            <div class="metric-chg" id="d-impressions-chg">↑ organic</div>
          </div>
          <div class="metric">
            <div class="metric-val">3</div>
            <div class="metric-lbl">Revenue Streams</div>
            <div class="metric-chg">● earning now</div>
          </div>
          <div class="metric">
            <div class="metric-val">$0</div>
            <div class="metric-lbl">Ad Spend</div>
            <div class="metric-chg">→ fully organic</div>
          </div>
        </div>
        </div><!-- /hero-content -->
      </div>

      <div class="hero-side">
        <div class="side-hd">
          <span class="side-hd-lbl">TOOLS &amp; PLATFORM · LIVE</span>
          <span class="side-hd-r">7 ACTIVE</span>
        </div>
        <div class="mkt-grid">
          <a href="evaluate.php" class="mkt-cell"><div class="mkt-lbl">AI EVALUATOR</div><div class="mkt-val" style="font-size:11px;">Score any X account</div></a>
          <a href="feed.php" class="mkt-cell"><div class="mkt-lbl">SIGNAL FEED</div><div class="mkt-val" style="font-size:11px;">Curated crypto + AI</div></a>
          <a href="leaderboard.php" class="mkt-cell"><div class="mkt-lbl">LEADERBOARD</div><div class="mkt-val" style="font-size:11px;">Top ranked accounts</div></a>
          <a href="bangpost.php" class="mkt-cell"><div class="mkt-lbl">BANG POST</div><div class="mkt-val" style="font-size:11px;">Content pipeline</div></a>
          <a href="nsi.php" class="mkt-cell"><div class="mkt-lbl">NICHE INDEX</div><div class="mkt-val" style="font-size:11px;">Account clusters</div></a>
          <a href="catalog.php" class="mkt-cell"><div class="mkt-lbl">CATALOG</div><div class="mkt-val" style="font-size:11px;">Products &amp; merch</div></a>
        </div>
        <!-- hidden: keep JS targets alive -->
        <span id="side-dex" style="display:none"></span>
        <span id="hero-price" style="display:none"></span>
        <span id="hero-price-sub" style="display:none"></span>
        <span id="side-mcap" style="display:none"></span>
        <span id="chg24h" style="display:none"></span>
        <span id="side-liq" style="display:none"></span>
        <span id="side-vol" style="display:none"></span>
        <span id="side-fdv" style="display:none"></span>
        <span id="chg5m" style="display:none"></span>
        <span id="chg1h" style="display:none"></span>
        <span id="chg6h" style="display:none"></span>
        <span id="txn-buys" style="display:none"></span>
        <span id="txn-sells" style="display:none"></span>
        <div class="buy-panel">
          <a href="evaluate.php" class="btn-primary">
            TRY THE EVALUATOR
            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M7 17L17 7M7 7h10v10"/></svg>
          </a>
          <a href="catalog.php" class="btn-outline">
            BROWSE CATALOG
            <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
          </a>
        </div>
      </div>
    </div>

    <!-- TICKER TAPE -->
    <div class="tape">
      <div class="tape-track">
        <div class="tape-item"><span class="sym">APTUM</span><span style="color:var(--ink3);">PLATFORM</span></div>
        <div class="tape-item">EVALUATOR <span class="up">● LIVE</span></div>
        <div class="tape-item">SIGNAL FEED <span class="up">● LIVE</span></div>
        <div class="tape-item">LEADERBOARD <span class="up">● LIVE</span></div>
        <div class="tape-item">BANG POST <span class="up">● LIVE</span></div>
        <div class="tape-item">IMPRESSIONS <span class="up" id="tape-imp">—</span></div>
        <div class="tape-item">ENG RATE <span class="up" id="tape-eng">—</span></div>
        <div class="tape-item">$A PRICE <span class="up" id="tape-price">—</span></div>
        <div class="tape-item">24H <span id="tape-chg">—</span></div>
        <div class="tape-item">MCAP <span class="neu" id="tape-mcap">—</span></div>
        <div class="tape-item">LIQ <span class="neu" id="tape-liq">—</span></div>
        <div class="tape-item">VOL/24H <span class="neu" id="tape-vol">—</span></div>
        <div class="tape-item">CHAIN <span class="neu">BASE L2</span></div>
        <div class="tape-item">AD SPEND <span class="up">$0.00</span></div>
        <!-- dupe -->
        <div class="tape-item"><span class="sym">APTUM</span><span style="color:var(--ink3);">PLATFORM</span></div>
        <div class="tape-item">EVALUATOR <span class="up">● LIVE</span></div>
        <div class="tape-item">SIGNAL FEED <span class="up">● LIVE</span></div>
        <div class="tape-item">LEADERBOARD <span class="up">● LIVE</span></div>
        <div class="tape-item">BANG POST <span class="up">● LIVE</span></div>
        <div class="tape-item">IMPRESSIONS <span class="up">—</span></div>
        <div class="tape-item">$A PRICE <span class="up">—</span></div>
        <div class="tape-item">CHAIN <span class="neu">BASE L2</span></div>
        <div class="tape-item">AD SPEND <span class="up">$0.00</span></div>
      </div>
    </div>

    <!-- 3-COL BODY -->
    <div class="body">

      <!-- LEFT -->
      <div class="left">
        <div class="panel-hd"><span>NAVIGATION</span></div>
        <div class="left-nav">
          <button class="left-link active" onclick="goSection('overview',null,this)"><span>Overview</span><span class="left-link-arr">›</span></button>
          <button class="left-link" onclick="goSection('tools',null,this)"><span>Tools</span><span class="left-link-arr">›</span></button>
          <button class="left-link" onclick="goSection('products',null,this)"><span>Products</span><span class="left-link-arr">›</span></button>
          <button class="left-link" onclick="goSection('resources',null,this)"><span>Resources</span><span class="left-link-arr">›</span></button>
          <button class="left-link" onclick="goSection('roadmap',null,this)"><span>Roadmap</span><span class="left-link-arr">›</span></button>
          <button class="left-link" onclick="goSection('community',null,this)"><span>Community</span><span class="left-link-arr">›</span></button>
        </div>
        <div class="left-section">
          <div class="left-section-ttl">Quick Tools</div>
          <div class="left-kv"><span class="left-v"><a href="evaluate.php">◎ X Evaluator ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="feed.php">◈ Signal Feed ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="leaderboard.php">⊞ Leaderboard ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="bangpost.php">✎ Bang Post ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="nsi.php">◉ Niche Index ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="dune.php">◆ Analytics ↗</a></span></div>
        </div>
        <div class="left-section">
          <div class="left-section-ttl">Products</div>
          <div class="left-kv"><span class="left-v"><a href="catalog.php">⬡ Catalog ↗</a></span></div>
          <div class="left-kv"><span class="left-v"><a href="shop.php">◈ Shop ↗</a></span></div>
        </div>
        <!-- hidden: keep JS targets alive -->
        <span id="lp-price" style="display:none"></span>
        <span id="lp-chg" style="display:none"></span>
      </div>

      <!-- CENTER -->
      <div class="center">

        <!-- TOOLS -->
        <div class="section" id="tools">
          <div class="section-hd">
            <span class="section-num">01</span>
            <span class="section-pipe">|</span>
            <span class="section-title">TOOLS</span>
            <span class="section-sub">Agents, analytics, content generation &amp; growth — all running live</span>
            <span class="section-status ok">● 7 LIVE</span>
          </div>
          <div class="section-body">
            <div class="stats-grid">
              <a href="evaluate.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">X Evaluator</div>
                <div class="stat-lbl">AI Account Scoring</div>
                <div class="stat-chg">Score any X account across 5 dimensions — algo fit, authenticity, content, growth, monetization</div>
              </a>
              <a href="feed.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">Signal Feed</div>
                <div class="stat-lbl">Curated Content</div>
                <div class="stat-chg">High-signal crypto and AI posts filtered for quality, relevance, and builder utility</div>
              </a>
              <a href="leaderboard.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">Leaderboard</div>
                <div class="stat-lbl">Top X Accounts</div>
                <div class="stat-chg">Network graph of highest-scoring accounts — see who leads in your niche</div>
              </a>
              <a href="nsi.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">NSI</div>
                <div class="stat-lbl">Niche Strength Index</div>
                <div class="stat-chg">AI-clustered account niches — find your competitive position in the crypto/AI space</div>
              </a>
              <a href="bangpost.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">Bang Post</div>
                <div class="stat-lbl">Content Pipeline</div>
                <div class="stat-chg">Automated post generation with style presets, topic selection, and crypto/AI context</div>
              </a>
              <a href="dune.php" class="stat-cell" style="text-decoration:none;cursor:none;">
                <div class="stat-val" style="font-size:17px;line-height:1.2;">Analytics</div>
                <div class="stat-lbl">Dune Dashboard</div>
                <div class="stat-chg">On-chain data and platform metrics — builder analytics and activity dashboard</div>
              </a>
            </div>
            <div class="log">
              <div class="log-row"><span class="log-ts">TOOL</span><span class="log-msg"><span class="hl">X Evaluator</span> — paste any handle, get a full AI-scored breakdown instantly</span><span class="log-val"><a href="evaluate.php" style="color:var(--green);font-weight:700;">Try →</a></span></div>
              <div class="log-row"><span class="log-ts">TOOL</span><span class="log-msg"><span class="hl">Signal Feed</span> — <span class="gr" id="d-log-imp">—</span> impressions tracked · eng rate <span class="gr" id="d-log-engrate">—</span></span><span class="log-val"><a href="feed.php" style="color:var(--green);font-weight:700;">Open →</a></span></div>
              <div class="log-row"><span class="log-ts" id="d-log-ts">TOOL</span><span class="log-msg"><span class="hl">Bang Post</span> — generate high-quality posts with topic and style presets</span><span class="log-val"><a href="bangpost.php" style="color:var(--green);font-weight:700;">Build →</a></span></div>
            </div>
            <!-- hidden analytics targets -->
            <span id="d-stats-sub" style="display:none"></span>
            <span id="d-stat-imp" style="display:none"></span><span id="d-stat-imp-age" style="display:none"></span>
            <span id="d-stat-eng" style="display:none"></span><span id="d-stat-eng-rate" style="display:none"></span>
            <span id="d-stat-likes" style="display:none"></span><span id="d-stat-likes-sub" style="display:none"></span>
            <span id="d-stat-visits" style="display:none"></span><span id="d-stat-visits-sub" style="display:none"></span>
            <span id="d-stat-replies" style="display:none"></span><span id="d-stat-replies-sub" style="display:none"></span>
          </div>
        </div>

        <!-- PRODUCTS -->
        <div class="section" id="products">
          <div class="section-hd">
            <span class="section-num">02</span>
            <span class="section-pipe">|</span>
            <span class="section-title">PRODUCTS</span>
            <span class="section-sub">Merchandise, digital goods, and AI skill packs built by Aptum</span>
            <span class="section-status ok">● IN STOCK</span>
          </div>
          <div class="section-body">
            <table class="t-table" style="margin-bottom:16px;">
              <thead>
                <tr><th>#</th><th>Product</th><th>Description</th><th>Status</th><th>Link</th></tr>
              </thead>
              <tbody>
                <tr><td>01</td><td class="td-bold">Aptum Merch</td><td>Branded apparel and accessories — physical goods for builders in the ecosystem</td><td class="status-live">● AVAILABLE</td><td><a href="shop.php" style="color:var(--green);font-weight:700;text-decoration:none;">Shop →</a></td></tr>
                <tr><td>02</td><td class="td-bold">Digital Catalog</td><td>Tools, prompts, and AI automation resources — instant digital delivery</td><td class="status-live">● AVAILABLE</td><td><a href="catalog.php" style="color:var(--green);font-weight:700;text-decoration:none;">Catalog →</a></td></tr>
                <tr><td>03</td><td style="color:var(--ink3);font-weight:600;">Skill Packs</td><td>Modular AI automation skills built by Aptum — launching in Phase 02</td><td class="status-soon">○ Phase 02</td><td>—</td></tr>
                <tr><td>04</td><td style="color:var(--ink3);font-weight:600;">Games</td><td>AI-generated games with standalone revenue streams</td><td class="status-soon">○ Phase 02</td><td>—</td></tr>
                <tr><td>05</td><td class="status-tba">More TBA</td><td>New products released as the platform and community grows</td><td class="status-tba">— TBA</td><td>—</td></tr>
              </tbody>
            </table>
            <div class="callout">
              <span class="callout-pre">// PLATFORM</span>
              <span class="callout-text">Products ship from the Aptum platform — merch, digital goods, and AI tools. Revenue feeds back into building more tools and expanding the ecosystem.</span>
            </div>
          </div>
        </div>

        <!-- RESOURCES -->
        <div class="section" id="resources">
          <div class="section-hd">
            <span class="section-num">03</span>
            <span class="section-pipe">|</span>
            <span class="section-title">RESOURCES</span>
            <span class="section-sub">Documentation, research, analytics, and reference material</span>
          </div>
          <div class="section-body">
            <div class="mech-row">
              <a href="whitepaper.php" class="mech-cell" style="text-decoration:none;cursor:none;">
                <div class="mech-sym">📄</div>
                <div class="mech-name">Whitepaper</div>
                <div class="mech-desc">The full Aptum thesis — platform architecture, $A token mechanics, revenue model, and roadmap.</div>
              </a>
              <a href="links.php" class="mech-cell" style="text-decoration:none;cursor:none;">
                <div class="mech-sym">⬡</div>
                <div class="mech-name">Link Directory</div>
                <div class="mech-desc">All official Aptum links — socials, DEX, charts, community channels, and ecosystem resources.</div>
              </a>
              <a href="dune.php" class="mech-cell" style="text-decoration:none;cursor:none;">
                <div class="mech-sym">◈</div>
                <div class="mech-name">Analytics</div>
                <div class="mech-desc">On-chain data, platform metrics, and builder analytics via live Dune dashboards.</div>
              </a>
            </div>
            <div class="tok-grid" style="margin-top:16px;">
              <a href="pitchdeck.php" class="tok-cell" style="text-decoration:none;cursor:none;display:block;">
                <div class="tok-key">PITCH DECK</div>
                <div class="tok-val" style="font-size:13px;">Full Aptum pitch deck →</div>
              </a>
              <a href="x-connect.php" class="tok-cell" style="text-decoration:none;cursor:none;display:block;">
                <div class="tok-key">X-CONNECT</div>
                <div class="tok-val" style="font-size:13px;">X API connectivity showcase →</div>
              </a>
              <a href="https://x.com/aptum_" target="_blank" rel="noopener" class="tok-cell" style="text-decoration:none;cursor:none;display:block;">
                <div class="tok-key">X / TWITTER</div>
                <div class="tok-val" style="font-size:13px;">Follow @aptum_ ↗</div>
              </a>
              <a href="https://t.me/aptum" target="_blank" rel="noopener" class="tok-cell" style="text-decoration:none;cursor:none;display:block;">
                <div class="tok-key">TELEGRAM</div>
                <div class="tok-val" style="font-size:13px;">Join the community ↗</div>
              </a>
            </div>
          </div>
        </div>

        <!-- ROADMAP -->
        <div class="section" id="roadmap">
          <div class="section-hd">
            <span class="section-num">04</span>
            <span class="section-pipe">|</span>
            <span class="section-title">ROADMAP</span>
            <span class="section-sub">Four phases · Twelve months · One compounding loop</span>
            <span class="section-status ok">● PHASE 01 LIVE</span>
          </div>
          <div class="section-body">
            <div class="roadmap-grid">
              <div class="phase phase-active">
                <div class="phase-tag"><span class="dot"></span>PHASE 01 ← NOW</div>
                <div class="phase-name">Launch</div>
                <div class="phase-period">Q1–Q2 2026</div>
                <ul class="phase-items">
                  <li class="done">$A deployed on Base</li>
                  <li class="done">Core agent initialized</li>
                  <li class="done">Social growth active</li>
                  <li class="done">97K impressions, Day 2</li>
                  <li>Community building</li>
                </ul>
              </div>
              <div class="phase">
                <div class="phase-tag"><span class="dot"></span>PHASE 02</div>
                <div class="phase-name">Build</div>
                <div class="phase-period">Q3–Q4 2026</div>
                <ul class="phase-items">
                  <li>Skill marketplace live</li>
                  <li>First game released</li>
                  <li>Developer onboarding</li>
                  <li>First buyback &amp; burn</li>
                </ul>
              </div>
              <div class="phase">
                <div class="phase-tag"><span class="dot"></span>PHASE 03</div>
                <div class="phase-name">Expand</div>
                <div class="phase-period">Q1 2027</div>
                <ul class="phase-items">
                  <li>New revenue verticals</li>
                  <li>Third-party skill sales</li>
                  <li>Airdrop program live</li>
                  <li>Agent capabilities expand</li>
                </ul>
              </div>
              <div class="phase">
                <div class="phase-tag"><span class="dot"></span>PHASE 04</div>
                <div class="phase-name">Scale</div>
                <div class="phase-period">Q2 2027</div>
                <ul class="phase-items">
                  <li>Multi-game ecosystem</li>
                  <li>Skill library at scale</li>
                  <li>Partnerships &amp; integrations</li>
                  <li>Sustained burn cycle</li>
                  <li>Roadmap V2</li>
                </ul>
              </div>
            </div>
          </div>
        </div>

        <!-- CTA -->
        <div class="cta" id="community">
          <div>
            <div class="cta-title">Built on Base.<br><span>Open to builders.</span></div>
            <div class="cta-sub">Aptum is an AI platform for agents, growth tools, analytics, and monetization. The tools are live. The feed is running. Evaluate accounts, curate signals, generate content, and build with a data edge.</div>
            <div class="social-row">
              <a href="https://x.com/aptum_" target="_blank" rel="noopener" class="social-btn">
                <svg viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.748l7.73-8.835L1.254 2.25H8.08l4.258 5.63 5.906-5.63z"/></svg>
                X / Twitter
              </a>
              <a href="https://t.me/aptum" target="_blank" rel="noopener" class="social-btn">
                <svg viewBox="0 0 24 24"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>
                Telegram
              </a>
              <a href="whitepaper.php" class="social-btn">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/></svg>
                Whitepaper
              </a>
            </div>
          </div>
          <div class="cta-actions">
            <a href="evaluate.php" class="btn-primary" style="display:flex;align-items:center;justify-content:space-between;text-decoration:none;">
              TRY THE EVALUATOR
              <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M7 17L17 7M7 7h10v10"/></svg>
            </a>
            <a href="catalog.php" class="btn-outline">
              BROWSE PRODUCTS
              <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
            </a>
          </div>
        </div>

      </div><!-- /center -->

      <!-- RIGHT -->
      <div class="right">
        <div class="phase-mini">
          <div class="phase-mini-hd">PLATFORM PHASE</div>
          <div style="font-size:11.5px;color:var(--ink);margin-bottom:7px;font-weight:700;">Phase 01 — Launch</div>
          <div class="phase-bar"><div class="phase-bar-fill"></div></div>
          <div class="phase-progress"><span class="cur">4 / 5 complete</span><span>Q1–Q2 2026</span></div>
        </div>

        <div class="token-panel">
          <div class="token-panel-hd">QUICK ACCESS · TOOLS</div>
          <div class="token-row"><span class="token-key">X Evaluator</span><span class="token-val"><a href="evaluate.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <div class="token-row"><span class="token-key">Signal Feed</span><span class="token-val"><a href="feed.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <div class="token-row"><span class="token-key">Leaderboard</span><span class="token-val"><a href="leaderboard.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <div class="token-row"><span class="token-key">Niche Index</span><span class="token-val"><a href="nsi.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <div class="token-row"><span class="token-key">Bang Post</span><span class="token-val"><a href="bangpost.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <div class="token-row"><span class="token-key">Analytics</span><span class="token-val"><a href="dune.php" style="color:var(--green);font-weight:700;text-decoration:none;">Open →</a></span></div>
          <!-- hidden: keep JS targets alive -->
          <span id="rp-price" style="display:none"></span>
          <span id="rp-chg" style="display:none"></span>
          <span id="rp-mcap" style="display:none"></span>
          <span id="rp-liq" style="display:none"></span>
          <span id="rp-vol" style="display:none"></span>
          <span id="rp-updated" style="display:none"></span>
          <span id="rp-fdv" style="display:none"></span>
          <span id="rp-txns" style="display:none"></span>
        </div>
      </div>

    </div><!-- /body -->

    <footer class="footer">
      <div class="footer-cell">APTUM <span class="val">Platform · Base</span></div>
      <div class="footer-cell"><a href="evaluate.php">Evaluator ↗</a></div>
      <div class="footer-cell"><a href="feed.php">Feed ↗</a></div>
      <div class="footer-cell"><a href="catalog.php">Catalog ↗</a></div>
      <div class="footer-cell"><a href="whitepaper.php">Whitepaper ↗</a></div>
      <div class="footer-cell"><a href="https://x.com/aptum_" target="_blank">X ↗</a></div>
      <div class="footer-cell"><a href="https://t.me/aptum" target="_blank">Telegram ↗</a></div>
      <div class="footer-right">2026 · Built on Base</div>
    </footer>

  </div><!-- /layout -->
</div><!-- /d-wrap -->


<!-- ══════════════════════
     MOBILE
══════════════════════ -->
<div id="m-wrap">
  <div class="m-orb m-orb-1"></div>
  <div class="m-orb m-orb-2"></div>

  <nav class="m-topnav">
    <span class="m-logo">APTUM</span>
    <div class="m-live-pill"><div class="m-ldot"></div>Platform Live</div>
  </nav>

  <!-- Buy Sheet -->
  <div class="m-sheet-overlay" id="mOverlay" onclick="mCloseSheet()"></div>
  <div class="m-buy-sheet" id="mSheet">
    <div class="m-sheet-topbar">
      <div class="m-sheet-handle"></div>
      <div class="m-sheet-title">Choose where to buy $A</div>
    </div>
    <div class="m-sheet-body" style="padding-top:14px;">
      <a href="https://clanker.world/clanker/0xaa681b1D3dE076f2524c94Ceb2Db712878Bb6b07" target="_blank" rel="noopener" class="m-buy-opt">
        <div class="m-buy-opt-ico">⬡</div>
        <div style="flex:1"><div class="m-buy-opt-name">Buy on Clanker</div><div class="m-buy-opt-sub">Recommended · Base Network</div></div>
        <div class="m-buy-opt-arr">›</div>
      </a>
      <a href="https://dexscreener.com/base/0x23e52ed0f63f3663bc5a8b688ac0e1dbafabe928c5a2de552f5f67ac1b33cd4d" target="_blank" rel="noopener" class="m-buy-opt">
        <div class="m-buy-opt-ico">◈</div>
        <div style="flex:1"><div class="m-buy-opt-name">DEX Screener</div><div class="m-buy-opt-sub">Charts, price &amp; liquidity</div></div>
        <div class="m-buy-opt-arr">›</div>
      </a>
    </div>
  </div>

  <div class="m-shell">

    <!-- HOME -->
    <div class="m-screen active" id="ms-home">
      <div class="m-hero-kicker"><div class="m-kline"></div>AI Platform · Base Network<div class="m-kline"></div></div>
      <h1 class="m-hero-title">Build.<span class="m-hero-out">Evaluate. Create.</span></h1>
      <p class="m-hero-tag">Agents, growth tools, analytics &amp; monetization for crypto builders.</p>
      <div class="m-pgrid">
        <a href="evaluate.php" class="m-pcard m-glass" style="text-decoration:none;">
          <div class="m-pn" style="font-size:18px;line-height:1.2;">Evaluate</div>
          <div class="m-pl">AI X Scoring</div>
          <div class="m-pt">◎ Open →</div>
        </a>
        <a href="feed.php" class="m-pcard m-glass" style="text-decoration:none;">
          <div class="m-pn" style="font-size:18px;line-height:1.2;">Feed</div>
          <div class="m-pl">Signal Curation</div>
          <div class="m-pt">● Live now</div>
        </a>
        <a href="leaderboard.php" class="m-pcard m-glass" style="text-decoration:none;">
          <div class="m-pn" style="font-size:18px;line-height:1.2;">Rank</div>
          <div class="m-pl">Leaderboard</div>
          <div class="m-pt">⊞ Top accounts</div>
        </a>
        <a href="catalog.php" class="m-pcard m-glass" style="text-decoration:none;">
          <div class="m-pn" style="font-size:18px;line-height:1.2;">Shop</div>
          <div class="m-pl">Products</div>
          <div class="m-pt">◆ Browse →</div>
        </a>
      </div>
      <a href="evaluate.php" class="m-buy-btn" style="text-decoration:none;"><span>Try X Evaluator</span><span class="m-buy-arr">↗</span></a>
      <div class="m-sec-row">
        <a href="whitepaper.php" class="m-sec-btn"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/></svg>Whitepaper</a>
        <a href="https://t.me/aptum" target="_blank" class="m-sec-btn"><svg viewBox="0 0 24 24"><path d="M22 2L11 13M22 2L15 22l-4-9-9-4 20-7z"/></svg>Telegram</a>
      </div>
      <!-- hidden: keep JS targets alive -->
      <span id="m-pc-price" style="display:none"></span><span id="m-pc-mcap" style="display:none"></span>
      <span id="m-pc-liq" style="display:none"></span><span id="m-pc-vol" style="display:none"></span>
      <span id="m-pc-dex" style="display:none"></span><span id="m-pc-upd" style="display:none"></span>
      <span id="m-pc-chg" style="display:none"></span><span id="m-pc-5m" style="display:none"></span>
      <span id="m-pc-1h" style="display:none"></span><span id="m-pc-6h" style="display:none"></span>
      <span id="m-pc-24h" style="display:none"></span>
      <span id="m-pn-imp" style="display:none"></span><span id="m-pt-imp" style="display:none"></span>
      <span id="m-pn-eng" style="display:none"></span><span id="m-pt-eng" style="display:none"></span>
    </div>

    <!-- TOOLS -->
    <div class="m-screen" id="ms-stats">
      <div class="m-s-head"><div class="m-s-eye">Tools</div><div class="m-s-title">Every tool.<br>One platform.</div><div class="m-s-body">AI-powered tools for X analytics, content generation, growth, and signal curation.</div></div>
      <div class="m-vert-list">
        <a href="evaluate.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">◎</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Live</div><div class="m-vert-name">X Evaluator</div><div class="m-vert-desc">Score any X account across 5 dimensions — algo fit, authenticity, content, growth, monetization.</div></div>
        </a>
        <a href="feed.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">◈</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Live</div><div class="m-vert-name">Signal Feed</div><div class="m-vert-desc">Curated high-signal crypto and AI posts, filtered for quality and builder relevance.</div></div>
        </a>
        <a href="leaderboard.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">⊞</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Live</div><div class="m-vert-name">Leaderboard</div><div class="m-vert-desc">Network graph of the highest-scoring X accounts, ranked by AI evaluation score.</div></div>
        </a>
        <a href="bangpost.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">✎</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Live</div><div class="m-vert-name">Bang Post</div><div class="m-vert-desc">Automated content generation with style presets and topic selection for crypto/AI.</div></div>
        </a>
        <a href="nsi.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">◉</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Live</div><div class="m-vert-name">Niche Index</div><div class="m-vert-desc">AI-clustered account niches — find your competitive position in the crypto/AI space.</div></div>
        </a>
      </div>
      <!-- hidden analytics targets -->
      <span id="m-st-imp" style="display:none"></span><span id="m-st-imp-tag" style="display:none"></span>
      <span id="m-st-eng" style="display:none"></span><span id="m-st-eng-tag" style="display:none"></span>
      <span id="m-st-likes" style="display:none"></span><span id="m-st-likes-tag" style="display:none"></span>
      <span id="m-st-visits" style="display:none"></span><span id="m-st-visits-tag" style="display:none"></span>
      <span id="m-st-replies" style="display:none"></span><span id="m-st-replies-tag" style="display:none"></span>
    </div>

    <!-- PRODUCTS -->
    <div class="m-screen" id="ms-earn">
      <div class="m-s-head"><div class="m-s-eye">Products</div><div class="m-s-title">Merch.<br>Digital goods.</div><div class="m-s-body">Aptum-branded merchandise and digital products. Browse and buy directly from the platform.</div></div>
      <div class="m-vert-list">
        <a href="shop.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">◆</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Available</div><div class="m-vert-name">Aptum Merch</div><div class="m-vert-desc">Branded apparel and accessories — physical goods for builders in the ecosystem.</div></div>
        </a>
        <a href="catalog.php" class="m-vert-item m-glass" style="text-decoration:none;">
          <div class="m-vert-ico">⬡</div>
          <div class="m-vert-body"><div class="m-vert-pill"><div class="m-vert-pd"></div>Available</div><div class="m-vert-name">Digital Catalog</div><div class="m-vert-desc">Tools, prompts, and AI automation resources — instant digital delivery.</div></div>
        </a>
        <div class="m-vert-item m-glass" style="opacity:.5;">
          <div class="m-vert-ico" style="font-size:16px;color:var(--m-ink4);">+</div>
          <div class="m-vert-body"><div class="m-vert-pill fut"><div class="m-vert-pd"></div>Phase 02</div><div class="m-vert-name" style="color:var(--m-ink3);">Skill Packs</div><div class="m-vert-desc">Modular AI automation skills built by Aptum — coming in Phase 02.</div></div>
        </div>
      </div>
      <a href="catalog.php" class="m-buy-btn" style="text-decoration:none;"><span>Browse Catalog</span><span class="m-buy-arr">↗</span></a>
    </div>

    <!-- ROADMAP -->
    <div class="m-screen" id="ms-roadmap">
      <div class="m-s-head"><div class="m-s-eye">Roadmap</div><div class="m-s-title">4 phases.<br>1 loop.</div><div class="m-s-body">Revenue funds expansion. The loop grows.</div></div>
      <div class="m-timeline">
        <div class="m-ph-entry"><div class="m-ph-dot-col"><div class="m-ph-dot active"></div></div><div class="m-ph-card cur"><div class="m-ph-tag">Phase 01 ← Now</div><div class="m-ph-name">Launch</div><div class="m-ph-period">Q1–Q2 2026</div><ul class="m-ph-items"><li class="done">$A live on Base</li><li class="done">Core agent deployed</li><li class="done">Social growth active</li><li class="done">97K impressions, Day 2</li><li>Community building</li></ul></div></div>
        <div class="m-ph-entry"><div class="m-ph-dot-col"><div class="m-ph-dot"></div></div><div class="m-ph-card fut"><div class="m-ph-tag">Phase 02</div><div class="m-ph-name">Build</div><div class="m-ph-period">Q3–Q4 2026</div><ul class="m-ph-items"><li>Skill marketplace live</li><li>First game released</li><li>Developer onboarding</li><li>First buyback &amp; burn</li></ul></div></div>
        <div class="m-ph-entry"><div class="m-ph-dot-col"><div class="m-ph-dot"></div></div><div class="m-ph-card fut"><div class="m-ph-tag">Phase 03</div><div class="m-ph-name">Expand</div><div class="m-ph-period">Q1 2027</div><ul class="m-ph-items"><li>New revenue verticals</li><li>Third-party skill sales</li><li>Airdrop program live</li><li>Agent capabilities expand</li></ul></div></div>
        <div class="m-ph-entry"><div class="m-ph-dot-col"><div class="m-ph-dot"></div></div><div class="m-ph-card fut"><div class="m-ph-tag">Phase 04</div><div class="m-ph-name">Scale</div><div class="m-ph-period">Q2 2027</div><ul class="m-ph-items"><li>Multi-game ecosystem</li><li>Skill library at scale</li><li>Partnerships &amp; integrations</li><li>Sustained burn cycle</li><li>Roadmap V2</li></ul></div></div>
      </div>
      <a href="whitepaper.php" class="m-buy-btn" style="text-decoration:none;"><span>Read the Whitepaper</span><span class="m-buy-arr">↗</span></a>
    </div>

    <!-- COMMUNITY -->
    <div class="m-screen" id="ms-community">
      <div class="m-comm-hero">
        <div class="m-comm-title">Join the<br><span>Aptum ecosystem.</span></div>
        <div class="m-comm-sub">Tools live. Products available. Built on Base.</div>
      </div>
      <div class="m-comm-links">
        <a href="evaluate.php" class="m-comm-link secondary" style="text-decoration:none;">
          <div class="m-comm-ico"><svg viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,.65)" stroke-width="2" width="18" height="18"><circle cx="12" cy="12" r="10"/><path d="M9 12l2 2 4-4"/></svg></div>
          <div class="m-comm-text"><div class="m-comm-name">X Evaluator</div><div class="m-comm-sub2">Score any X account with AI</div></div>
          <div class="m-comm-arr">›</div>
        </a>
        <a href="https://x.com/aptum_" target="_blank" rel="noopener" class="m-comm-link secondary">
          <div class="m-comm-ico"><svg viewBox="0 0 24 24" fill="rgba(255,255,255,.65)" width="18" height="18"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.748l7.73-8.835L1.254 2.25H8.08l4.258 5.63 5.906-5.63z"/></svg></div>
          <div class="m-comm-text"><div class="m-comm-name">Follow on X</div><div class="m-comm-sub2">@aptum_</div></div>
          <div class="m-comm-arr">›</div>
        </a>
        <a href="https://t.me/aptum" target="_blank" rel="noopener" class="m-comm-link secondary">
          <div class="m-comm-ico"><svg viewBox="0 0 24 24" fill="rgba(255,255,255,.65)" width="18" height="18"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg></div>
          <div class="m-comm-text"><div class="m-comm-name">Telegram</div><div class="m-comm-sub2">Join the community</div></div>
          <div class="m-comm-arr">›</div>
        </a>
        <a href="whitepaper.php" class="m-comm-link secondary">
          <div class="m-comm-ico"><svg viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,.65)" stroke-width="1.8" width="18" height="18"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/></svg></div>
          <div class="m-comm-text"><div class="m-comm-name">Whitepaper</div><div class="m-comm-sub2">Read the full thesis</div></div>
          <div class="m-comm-arr">›</div>
        </a>
      </div>
      <div class="m-foot">APTUM · Built on Base · 2026</div>
    </div>

  </div><!-- /m-shell -->

  <nav class="m-bnav">
    <div class="m-bnav-inner">
      <button class="m-bnav-btn active" onclick="mGo('home',this)"><svg viewBox="0 0 24 24"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg><span class="m-bnav-lbl">Home</span></button>
      <button class="m-bnav-btn" onclick="mGo('stats',this)"><svg viewBox="0 0 24 24"><path d="M12 2L2 7l10 5 10-5-10-5z"/><path d="M2 17l10 5 10-5M2 12l10 5 10-5"/></svg><span class="m-bnav-lbl">Tools</span></button>
      <button class="m-bnav-btn" onclick="mGo('earn',this)"><svg viewBox="0 0 24 24"><path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"/><line x1="3" y1="6" x2="21" y2="6"/><path d="M16 10a4 4 0 0 1-8 0"/></svg><span class="m-bnav-lbl">Products</span></button>
      <button class="m-bnav-btn" onclick="mGo('community',this)"><svg viewBox="0 0 24 24"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"/></svg><span class="m-bnav-lbl">Join</span></button>
    </div>
  </nav>
</div><!-- /m-wrap -->


<script>
'use strict';

/* ── Scroll reveal ── */
new IntersectionObserver(entries => entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('visible'); }), { threshold:.04 })
  .observe && document.querySelectorAll('.section,.cta').forEach(el => new IntersectionObserver(entries => entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('visible'); }), { threshold:.04 }).observe(el));

/* ── Sparkline ── */
let priceHistory = [];
function drawSpark(pts) {
  const w=344, h=52, n=pts.length;
  if (n < 2) return;
  const mn=Math.min(...pts), mx=Math.max(...pts), rng=mx-mn||1;
  const xs=pts.map((_,i)=>(i/(n-1))*w);
  const ys=pts.map(p=>h-((p-mn)/rng)*h*.82-4);
  let d=`M ${xs[0]} ${ys[0]}`;
  for (let i=1;i<n;i++) { const cx=(xs[i-1]+xs[i])/2; d+=` C ${cx} ${ys[i-1]} ${cx} ${ys[i]} ${xs[i]} ${ys[i]}`; }
  const l=document.getElementById('sparkLine'), p=document.getElementById('sparkPath');
  if (l&&p) { l.setAttribute('d',d); p.setAttribute('d',d+` L ${xs[n-1]} ${h} L ${xs[0]} ${h} Z`); }
}

/* ── Helpers ── */
function fmtUSD(n) {
  if (!n && n!==0) return '—';
  if (n>=1e9) return '$'+(n/1e9).toFixed(2)+'B';
  if (n>=1e6) return '$'+(n/1e6).toFixed(2)+'M';
  if (n>=1e3) return '$'+(n/1e3).toFixed(1)+'K';
  return '$'+n.toFixed(2);
}
function fmtPrice(p) {
  if (!p && p!==0) return '—';
  const n=parseFloat(p);
  if (isNaN(n)||n===0) return '$0';
  if (n>=1) return '$'+n.toFixed(4);
  if (n>=0.001) return '$'+n.toFixed(6);
  const s=n.toFixed(20), m=s.match(/^0\.(0*)([1-9]\d*)/);
  if (!m) return '$'+n.toExponential(3);
  const z=m[1].length, sig=m[2].slice(0,4);
  const S='\u2080\u2081\u2082\u2083\u2084\u2085\u2086\u2087\u2088\u2089';
  if (z>=4) return '$0.0'+String(z).split('').map(d=>S[+d]).join('')+sig;
  return '$'+n.toFixed(z+4);
}
function fmtPct(n) { if (n==null) return '—'; return (n>=0?'+':'')+n.toFixed(2)+'%'; }
function setEl(id,v) { const e=document.getElementById(id); if(e) e.textContent=v; }
function setChg(id,v) {
  const e=document.getElementById(id); if(!e) return;
  e.textContent=fmtPct(v);
  e.className=e.className.replace(/\b(pos|neg)\b/g,'');
  if(v>0.05){e.classList.add('pos');e.style.color='var(--green)';e.style.fontWeight='700';}
  else if(v<-0.05){e.classList.add('neg');e.style.color='var(--red)';e.style.fontWeight='700';}
  else{e.style.color='var(--ink3)';e.style.fontWeight='600';}
}

/* ── DEX Data ── */
const CA='0xaa681b1D3dE076f2524c94Ceb2Db712878Bb6b07';
async function fetchDex() {
  try {
    const r=await fetch(`https://api.dexscreener.com/tokens/v1/base/${CA}`);
    if(!r.ok) return;
    const d=await r.json();
    const pairs=Array.isArray(d)?d:(d.pairs||[]);
    if(!pairs.length) return;
    const pair=pairs.reduce((b,p)=>(p.liquidity?.usd||0)>(b.liquidity?.usd||0)?p:b, pairs[0]);
    applyDex(pair);
  } catch(e) { console.warn('DEX:',e.message); }
}
function applyDex(p) {
  const pr=p.priceUsd, fdv=p.fdv, mc=p.marketCap, liq=p.liquidity?.usd, vol=p.volume?.h24;
  const c5=p.priceChange?.m5??null, c1=p.priceChange?.h1??null, c6=p.priceChange?.h6??null, c24=p.priceChange?.h24??null;
  const buys=p.txns?.h24?.buys||0, sells=p.txns?.h24?.sells||0;

  if(pr) { priceHistory.push(parseFloat(pr)); if(priceHistory.length>40) priceHistory.shift(); drawSpark(priceHistory); }

  setEl('hero-price', fmtPrice(pr));
  setEl('hero-price-sub', [c24!=null?fmtPct(c24)+' (24h)':null, p.priceNative?parseFloat(p.priceNative).toExponential(3)+' ETH':null].filter(Boolean).join(' · ')||'Live via DEX Screener');
  setEl('side-dex', (p.dexId||'DEX').toUpperCase());
  setEl('side-mcap', mc?fmtUSD(mc):'—'); setEl('side-fdv', fdv?fmtUSD(fdv):'—');
  setEl('side-liq', liq?fmtUSD(liq):'—'); setEl('side-vol', vol?fmtUSD(vol):'—');
  setChg('chg5m',c5); setChg('chg1h',c1); setChg('chg6h',c6); setChg('chg24h',c24);
  setEl('txn-buys', buys.toLocaleString()); setEl('txn-sells', sells.toLocaleString());

  setEl('sb-price', fmtPrice(pr));
  const sc=document.getElementById('sb-chg24'); if(sc){sc.textContent=fmtPct(c24);sc.className='sb-val '+(c24>=0?'pos':'neg');}
  setEl('sb-mcap', mc?fmtUSD(mc):'—'); setEl('sb-liq', liq?fmtUSD(liq):'—'); setEl('sb-vol', vol?fmtUSD(vol):'—');

  setEl('rp-price', fmtPrice(pr));
  const rc=document.getElementById('rp-chg'); if(rc){rc.textContent=fmtPct(c24);rc.style.color=c24>=0?'var(--green)':'var(--red)';rc.style.fontWeight='700';}
  setEl('rp-mcap',mc?fmtUSD(mc):'—'); setEl('rp-fdv',fdv?fmtUSD(fdv):'—');
  setEl('rp-liq',liq?fmtUSD(liq):'—'); setEl('rp-vol',vol?fmtUSD(vol):'—');
  setEl('rp-txns',buys.toLocaleString()+' / '+sells.toLocaleString());
  setEl('rp-updated', new Date().toUTCString().slice(17,25)+' UTC');

  setEl('lp-price',fmtPrice(pr));
  const lc=document.getElementById('lp-chg'); if(lc){lc.textContent=fmtPct(c24);lc.style.color=c24>=0?'var(--green)':'var(--red)';lc.style.fontWeight='700';}

  setEl('tape-price',fmtPrice(pr)); setEl('tape-mcap',mc?fmtUSD(mc):'—');
  setEl('tape-vol',vol?fmtUSD(vol):'—'); setEl('tape-liq',liq?fmtUSD(liq):'—');
  const tc=document.getElementById('tape-chg'); if(tc){tc.textContent=fmtPct(c24);tc.style.color=c24>=0?'var(--green)':'var(--red)';}

  setEl('m-pc-price',fmtPrice(pr));
  setEl('m-pc-mcap',mc?fmtUSD(mc):'—'); setEl('m-pc-liq',liq?fmtUSD(liq):'—'); setEl('m-pc-vol',vol?fmtUSD(vol):'—');
  setEl('m-pc-dex',(p.dexId||'BASE').toUpperCase());
  setEl('m-pc-upd',new Date().toUTCString().slice(17,25)+' UTC');
  const mchg=document.getElementById('m-pc-chg'); if(mchg){mchg.textContent=fmtPct(c24);mchg.className='m-pc-chg '+(c24>0.05?'pos':c24<-0.05?'neg':'neu');}
  const mChgCell=(id,v)=>{const e=document.getElementById(id);if(!e)return;e.textContent=v!=null?fmtPct(v):'—';e.className='m-pc-tc-v'+(v>0.05?' pos':v<-0.05?' neg':'');};
  mChgCell('m-pc-5m',c5); mChgCell('m-pc-1h',c1); mChgCell('m-pc-6h',c6); mChgCell('m-pc-24h',c24);
}
fetchDex(); setInterval(fetchDex, 30000);
window._dexReady = applyDex;

/* ── Analytics ── */
let analytics=[], lastTs=null;
function relTime(iso) { if(!iso) return 'recently'; const d=Date.now()-new Date(iso).getTime(), m=Math.floor(d/60000), h=Math.floor(d/3600000), dd=Math.floor(d/86400000); if(m<2)return 'just now'; if(m<60)return m+'m ago'; if(h<24)return h+'h ago'; return dd+'d ago'; }
function logTs(iso) { if(!iso) return 'NOW'; const h=Math.floor((Date.now()-new Date(iso).getTime())/3600000); return h<1?relTime(iso).toUpperCase():h+'H AGO'; }
async function fetchAnalytics() {
  try {
    const r=await fetch('https://aptum.fun/api/analytics.json?_='+Date.now());
    if(!r.ok) return;
    const raw=await r.json();
    if(!Array.isArray(raw)||!raw.length) return;
    analytics=raw.slice().sort((a,b)=>new Date(a.timestamp)-new Date(b.timestamp));
    const l=analytics[analytics.length-1];
    if(!l||lastTs===l.timestamp) return;
    lastTs=l.timestamp; applyAnalytics(l);
  } catch(e) { console.warn('Analytics:',e.message); }
}
function applyAnalytics(d) {
  const imp=d.impressions||'—', eng=d.engagements||'—', er=d.engagement_rate||'—';
  const likes=d.likes||'—', visits=d.profile_visits||'—', replies=d.replies||'—';
  const shares=d.shares||'—', reposts=d.reposts||'—', bmarks=d.bookmarks||'—';
  const age=relTime(d.timestamp), lt=logTs(d.timestamp);

  setEl('d-impressions',imp); setEl('d-impressions-chg','↑ '+age+' · X');
  setEl('d-stat-imp',imp); setEl('d-stat-imp-age','↑ updated '+age);
  setEl('d-stat-eng',eng); setEl('d-stat-eng-rate','rate: '+er);
  setEl('d-stat-likes',likes); setEl('d-stat-likes-sub','shares: '+shares+' · bk: '+bmarks);
  setEl('d-stat-visits',visits); setEl('d-stat-visits-sub','reposts: '+reposts);
  setEl('d-stat-replies',replies); setEl('d-stat-replies-sub','updated '+age);
  setEl('d-stats-sub','X metrics · updated '+age+' · no ad spend');
  setEl('d-log-ts',lt); setEl('d-log-engrate',er);
  setEl('d-log-imp',imp);
  setEl('tape-imp',imp); setEl('tape-eng',er);
  setEl('m-pn-imp',imp); setEl('m-pt-imp','↑ '+age+' · X');
  setEl('m-pn-eng',eng); setEl('m-pt-eng',er);
  setEl('m-st-imp',imp); setEl('m-st-imp-tag','↑ updated '+age);
  setEl('m-st-eng',eng); setEl('m-st-eng-tag','rate: '+er);
  setEl('m-st-likes',likes); setEl('m-st-likes-tag','shares: '+shares);
  setEl('m-st-visits',visits); setEl('m-st-visits-tag','reposts: '+reposts);
  setEl('m-st-replies',replies); setEl('m-st-replies-tag','bk: '+bmarks);
}
fetchAnalytics(); setInterval(fetchAnalytics, 60000);

/* ── Nav ── */
function goSection(id, tab, left) {
  const el=document.getElementById(id);
  if(el) window.scrollTo({top:el.getBoundingClientRect().top+window.scrollY-74,behavior:'smooth'});
  if(tab) { document.querySelectorAll('.nav-tab').forEach(t=>t.classList.remove('active')); tab.classList.add('active'); }
  if(left) { document.querySelectorAll('.left-link').forEach(l=>l.classList.remove('active')); left.classList.add('active'); }
}
function copyCA(btn) {
  navigator.clipboard.writeText(CA).then(()=>{
    const o=btn.textContent; btn.textContent='COPIED ✓';
    btn.style.cssText='color:#fff;background:var(--green);border-color:var(--green);';
    setTimeout(()=>{ btn.textContent=o; btn.style.cssText=''; },2000);
  });
}

/* ── Mobile ── */
function mGo(id,btn) {
  document.querySelectorAll('.m-screen').forEach(s=>s.classList.remove('active'));
  document.querySelectorAll('.m-bnav-btn').forEach(b=>b.classList.remove('active'));
  const s=document.getElementById('ms-'+id); if(s) s.classList.add('active');
  btn.classList.add('active'); window.scrollTo({top:0,behavior:'instant'});
}
function mOpenSheet() { document.getElementById('mOverlay').classList.add('open'); document.getElementById('mSheet').classList.add('open'); document.body.style.overflow='hidden'; }
function mCloseSheet() { document.getElementById('mOverlay').classList.remove('open'); document.getElementById('mSheet').classList.remove('open'); document.body.style.overflow=''; }

document.addEventListener('keydown', e=>{ if(e.key==='Escape') mCloseSheet(); });

(function(){
  const el=document.getElementById('mSheet'); if(!el) return;
  let sy=0;
  el.addEventListener('touchstart',e=>sy=e.touches[0].clientY,{passive:true});
  el.addEventListener('touchmove',e=>{ if(e.touches[0].clientY-sy>70) mCloseSheet(); },{passive:true});
})();

function mCopyAddr(btn) {
  if(!navigator.clipboard) return;
  navigator.clipboard.writeText(CA).then(()=>{ const s=btn.querySelector('span'); s.textContent='Copied!'; setTimeout(()=>s.textContent='Copy address',2200); });
}

/* ── Hero ASCII grid ── */
(function(){
  const canvas = document.getElementById('hero-ascii');
  if (!canvas) return;
  const ctx = canvas.getContext('2d');
  let lastT = 0, tick = 0;

  const CW = 13, CH = 18;
  const POOL = '$A/\\|01.-+#*:≈∑→∅BASE01ABCDEF'.split('');
  let cols, rows, cells;

  function resize() {
    const p = canvas.parentElement;
    const W = p.offsetWidth, H = p.offsetHeight;
    if (!W || !H) return;
    canvas.width = W; canvas.height = H;
    cols = Math.ceil(W / CW);
    rows = Math.ceil(H / CH);
    cells = Array.from({length: cols * rows}, () => ({
      c: POOL[Math.floor(Math.random() * POOL.length)],
      t: Math.random() * 120,
      s: 40 + Math.random() * 100
    }));
  }

  /* Returns 0–1: how strongly this cell overlaps the double-chevron logo */
  function logoWeight(col, row) {
    const cx = cols / 2, cy = rows / 2;
    const nx = (col - cx) / (cols * 0.22);  /* -1..1 range */
    const ny = (row - cy) / (rows * 0.44);

    /* Upper chevron — hollow ^ shape */
    const uOuter = Math.abs(nx) * 1.55 - 0.62;   /* outer edge at ny */
    const uInner = Math.abs(nx) * 1.55 - 0.38;   /* inner edge */
    const inUpper = (ny > uOuter && ny < uInner) && ny < 0.05;

    /* Lower chevron — wider flatter ^ */
    const lOuter = Math.abs(nx) * 1.05 - 0.46;
    const lInner = Math.abs(nx) * 1.05 - 0.28;
    const inLower = (ny > lOuter && ny < lInner) && ny > 0.08 && ny < 0.54;

    return (inUpper || inLower) ? 1 : 0;
  }

  function draw(t) {
    requestAnimationFrame(draw);
    if (t - lastT < 48) return;
    lastT = t; tick++;
    if (!canvas.width || !canvas.height || !cells) return;

    ctx.clearRect(0, 0, canvas.width, canvas.height);
    const dark = document.documentElement.getAttribute('data-theme') === 'dark';
    const [r, g, b] = dark ? [239,241,248] : [10,12,18];

    const fs = Math.min(CW * 0.82, CH * 0.68);
    ctx.font = `${fs}px monospace`;
    ctx.textBaseline = 'middle';
    ctx.textAlign = 'center';

    cells.forEach((cell, i) => {
      cell.t--;
      if (cell.t <= 0) {
        cell.c = POOL[Math.floor(Math.random() * POOL.length)];
        cell.t = cell.s * (0.6 + Math.random());
      }
      const col = i % cols, row = Math.floor(i / cols);
      const lw = logoWeight(col, row);

      /* Wave pulse sweeping diagonally */
      const wave = Math.sin(tick * 0.04 - (col + row) * 0.18) * 0.5 + 0.5;

      const bgAlpha  = 0.028 + 0.012 * Math.sin(tick * 0.015 + i * 0.07);
      const logoAlpha = lw * (0.18 + 0.10 * wave);
      const alpha = bgAlpha + logoAlpha;

      ctx.fillStyle = `rgba(${r},${g},${b},${alpha.toFixed(3)})`;
      ctx.fillText(cell.c, (col + 0.5) * CW, (row + 0.5) * CH);
    });
  }

  const ro = new ResizeObserver(resize);
  ro.observe(canvas.parentElement);
  resize();
  requestAnimationFrame(draw);
})();

/* ── Click sound ── */
(function(){
  const snd = new Audio('sounds/click.mp3');
  snd.preload = 'auto';
  const TAGS = new Set(['A','BUTTON','INPUT','SELECT','TEXTAREA','LABEL']);
  const CLASSES = ['left-link','m-bnav-btn','m-comm-link','m-buy-btn','m-sec-btn','mkt-cell','stat-cell','mech-cell','tok-cell','social-btn','btn-primary','btn-outline','ca-copy','m-buy-opt','tape-item'];
  document.addEventListener('pointerdown', e => {
    const el = e.target.closest(TAGS.size ? [...TAGS].map(t=>t.toLowerCase()).join(',') : '*') || e.target;
    const hit = TAGS.has(el.tagName) || CLASSES.some(c => e.target.closest('.'+c));
    if (!hit) return;
    snd.currentTime = 0;
    snd.play().catch(()=>{});
  }, { passive: true });
})();
</script>
</body>
</html>

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-HN3Z03MHCG"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-HN3Z03MHCG');
</script>