openseeker/swarm.html at main · ExpertVagabond/openseeker · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SwarmNode ($SWARM) — OpenSeeker Agent Fleet</title>
<meta name="description" content="SwarmNode: Distributed AI Swarm Node. Multi-Agent Intelligence agent in the OpenSeeker fleet on Solana Seeker.">
<meta name="theme-color" content="#a855f7">
<meta property="og:title" content="SwarmNode ($SWARM) — OpenSeeker">
<meta property="og:description" content="Distributed AI Swarm Node. Multi-Agent Intelligence agent in the OpenSeeker fleet.">
<meta property="og:image" content="assets/swarmnode.png">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0a0a0a;--bg-card:#111113;--bg-card-hover:#1a1a1d;
  --border:#222;--border-hover:#333;
  --text:#e4e4e7;--text-muted:#71717a;--text-dim:#52525b;
  --accent:#a855f7;--accent-glow:#a855f726;
  --font:'Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono',monospace;
}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
a{color:var(--accent);text-decoration:none;transition:color .2s}
a:hover{opacity:.85}
::selection{background:var(--accent);color:#fff}

.back{position:fixed;top:20px;left:20px;font-size:.85rem;color:var(--text-muted);display:flex;align-items:center;gap:6px;z-index:50;padding:8px 14px;background:rgba(10,10,10,.8);backdrop-filter:blur(8px);border-radius:8px;border:1px solid var(--border)}
.back:hover{color:#fff;border-color:var(--accent)}

.hero{max-width:800px;margin:0 auto;padding:100px 24px 60px;text-align:center}
.hero-img{width:200px;height:200px;border-radius:24px;margin:0 auto 32px;border:3px solid var(--accent);box-shadow:0 0 60px var(--accent-glow),0 20px 60px rgba(0,0,0,.5);object-fit:cover}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:20px;font-size:.75rem;font-weight:600;color:var(--accent);background:var(--accent-glow);border:1px solid #a855f733;margin-bottom:20px;text-transform:uppercase;letter-spacing:.06em}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:800;color:#fff;letter-spacing:-.03em;margin-bottom:8px}
h1 span{color:var(--accent)}
.tagline{font-size:1.25rem;color:var(--text-muted);margin-bottom:32px}
.buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:10px;font-size:.9rem;font-weight:600;transition:all .2s;border:none;cursor:pointer;font-family:var(--font)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{box-shadow:0 0 32px var(--accent-glow);opacity:.9;color:#fff}
.btn-secondary{background:var(--bg-card);color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{border-color:var(--accent);color:#fff}

.detail{max-width:640px;margin:0 auto;padding:0 24px 48px}
.detail-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:36px;margin-bottom:24px}
.detail-card h2{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:12px}
.detail-card p{font-size:.9rem;color:var(--text-muted);line-height:1.7}

.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-radius:12px;overflow:hidden;border:1px solid var(--border);margin-bottom:24px}
.stat{background:var(--bg-card);padding:20px;text-align:center}
.stat-val{font-size:1.1rem;font-weight:700;color:#fff;font-family:var(--mono)}
.stat-label{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:4px}

.mint-box{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:16px;font-family:var(--mono);font-size:.75rem;color:var(--text-dim);word-break:break-all;text-align:center;margin-bottom:24px}
.mint-box span{color:var(--text-muted);display:block;font-size:.65rem;margin-bottom:6px;font-family:var(--font);text-transform:uppercase;letter-spacing:.08em}

.fleet-nav{max-width:640px;margin:0 auto;padding:0 24px 80px}
.fleet-nav h3{font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px;text-align:center}
.fleet-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.fleet-link{padding:6px 14px;border-radius:8px;font-size:.8rem;font-weight:600;background:var(--bg-card);border:1px solid var(--border);color:var(--text-muted);transition:all .2s}
.fleet-link:hover{border-color:var(--accent);color:#fff}
.fleet-link.current{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}

footer{margin-top:auto;border-top:1px solid var(--border);padding:24px;text-align:center;font-size:.8rem;color:var(--text-dim)}
footer a{color:var(--text-muted)}

@media(max-width:480px){
  .hero{padding:80px 16px 40px}
  .hero-img{width:150px;height:150px}
  .stats-row{grid-template-columns:1fr}
  .buttons{flex-direction:column;align-items:center}
}
</style>
</head>
<body>

<a class="back" href="index.html">&larr; OpenSeeker Fleet</a>

<section class="hero">
  <img class="hero-img" src="assets/swarmnode.png" alt="SwarmNode" width="200" height="200">
  <div class="badge">Multi-Agent Intelligence</div>
  <h1>SwarmNode <span>$SWARM</span></h1>
  <p class="tagline">Distributed AI Swarm Node</p>
  <div class="buttons">
    <a class="btn btn-primary" href="https://pump.fun/coin/F3kXwe6eF8hSiuqWtNzAiv668QWAHVem7FvZK3jWahdN" target="_blank" rel="noopener">Trade on pump.fun</a>
    <a class="btn btn-secondary" href="index.html">View Full Fleet</a>
  </div>
</section>

<div class="detail">
  <div class="stats-row">
    <div class="stat"><div class="stat-val">Multi-Agent Intelligence</div><div class="stat-label">Role</div></div>
    <div class="stat"><div class="stat-val">Seeker</div><div class="stat-label">Platform</div></div>
    <div class="stat"><div class="stat-val">Live</div><div class="stat-label">Status</div></div>
  </div>

  <div class="detail-card">
    <h2>About SwarmNode</h2>
    <p>SwarmNode turns your Seeker phone into a node in a decentralized AI network. Coordinated multi-agent intelligence across mobile devices. Your phone contributes to and benefits from collective AI reasoning. The mesh network for autonomous agents.</p>
  </div>

  <div class="detail-card">
    <h2>Part of the OpenSeeker Fleet</h2>
    <p>SwarmNode is one of 10 specialized AI agents in the OpenSeeker ecosystem. Each agent handles a distinct capability — from trading to security to governance. Together they form a complete autonomous agent operating system for the Solana Seeker phone.</p>
  </div>

  <div class="mint-box">
    <span>Token Mint Address</span>
    F3kXwe6eF8hSiuqWtNzAiv668QWAHVem7FvZK3jWahdN
  </div>
</div>

<nav class="fleet-nav">
  <h3>The Fleet</h3>
  <div class="fleet-links">
    <a class="fleet-link" href="seekbot.html">$SEEKBOT</a>
    <a class="fleet-link" href="avault.html">$AVAULT</a>
    <a class="fleet-link" href="nswap.html">$NSWAP</a>
    <a class="fleet-link" href="pchain.html">$PCHAIN</a>
    <a class="fleet-link" href="seedg.html">$SEEDG</a>
    <a class="fleet-link" href="sknet.html">$SKNET</a>
    <a class="fleet-link" href="mdao.html">$MDAO</a>
    <a class="fleet-link" href="trelay.html">$TRELAY</a>
    <a class="fleet-link" href="csign.html">$CSIGN</a>
    <a class="fleet-link current" href="swarm.html">$SWARM</a>
  </div>
</nav>

<footer>
  <a href="https://openseeker.pages.dev">OpenSeeker</a> &mdash; Built by <a href="https://purplesquirrelmedia.io">Purple Squirrel Media</a>
</footer>

</body>
</html>