7e44748295
Nav sitewide: Litepaper, Miner, App, Wallet, Live devnet, Ledger and the Download button; the rest in the sheet and the footer. /miner is the product page for the installers: the shipped app in its frame, the card picker with the live time to a block, the downloads with sizes, HiveOS, the fee in full view, three real shots. /app is new: the Igneum Ember app page by page (Overview, Cards with Ember, the chain drawn live by the module the app ships, Earnings, Prove, Settings, phone width, what keeps it mining), light and dark, every shot a real capture or a render from the RTX 5090 Windows rig's live state with the hostname painted out. /live is redrawn to show the system working: the step scene, six live cells, finality in plain words, miner lanes, provers paid, recent blocks landing, the light client in one line, the DAG below. site.css carries the shared product components (frames, download list, lines, your-card line, phone download bar); yourcard.js reads the network rate. The ledger and wallet pages no longer overflow at 390 px. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
214 lines
17 KiB
HTML
214 lines
17 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<title>Igneum scenes, a lab</title>
|
|
<meta name="description" content="Three animated views of the same live devnet feed: Forge, Lattice and Pulse. An unlinked lab page.">
|
|
<meta name="robots" content="noindex">
|
|
<meta name="theme-color" content="#0C0C0E" media="(prefers-color-scheme: dark)">
|
|
<meta name="theme-color" content="#F4F1EC" media="(prefers-color-scheme: light)">
|
|
<link rel="icon" href="/favicon.ico" sizes="48x48">
|
|
<!-- head:start -->
|
|
<link rel="preload" href="/fonts/unbounded-900.woff2" as="font" type="font/woff2" crossorigin>
|
|
<link rel="preload" href="/fonts/plex-sans-400.woff2" as="font" type="font/woff2" crossorigin>
|
|
<link rel="stylesheet" href="/site.css">
|
|
<style>
|
|
/* Shared by every page: the head partial, injected by the build between the head markers. Edit the partial, not the page. */
|
|
/* Fonts, self-hosted (latin subsets, OFL): Unbounded 500/700/900, IBM Plex Sans 400/500/600, IBM Plex Mono 400/500. Fallbacks carry size and ascent overrides so the swap does not move the layout. The tokens, type and components are in /site.css (docs/plans/site-ui-3.md). */
|
|
@font-face{font-family:'Unbounded';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/unbounded-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'Unbounded';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/unbounded-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'Unbounded';font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/unbounded-900.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/plex-sans-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/plex-sans-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/plex-sans-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/plex-mono-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/plex-mono-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
|
|
@font-face{font-family:'Unbounded Fallback';src:local('Arial Black'),local('Arial-Black'),local('Impact');size-adjust:114%;ascent-override:87.5%;descent-override:21.5%;line-gap-override:0%}
|
|
@font-face{font-family:'Plex Sans Fallback';src:local('Arial'),local('Helvetica Neue'),local('Helvetica');size-adjust:100.5%;ascent-override:102%;descent-override:27.4%;line-gap-override:0%}
|
|
@font-face{font-family:'Plex Mono Fallback';src:local('Courier New'),local('Menlo');size-adjust:100%;ascent-override:102.5%;descent-override:27.5%;line-gap-override:0%}
|
|
</style>
|
|
<script>
|
|
/* theme before first paint: the footer control stores "light" or "dark" under igneum-theme; nothing stored means the system setting */
|
|
(function(){try{var t=localStorage.getItem("igneum-theme");if(t==="light"||t==="dark")document.documentElement.setAttribute("data-theme",t);}catch(e){}})();
|
|
</script>
|
|
<!-- head:end -->
|
|
<style>
|
|
/* scenes lab block; tokens, type and components are in /site.css */
|
|
.lab{padding:calc(var(--sec) * .5) 0 var(--sec)}
|
|
.lab-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
|
|
.scenes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)}
|
|
.scenes.only{grid-template-columns:1fr}
|
|
.scene-card{display:flex;flex-direction:column;gap:var(--s-3)}
|
|
.scene-card .head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3)}
|
|
.scene-card .head .eyebrow{margin:0;text-align:right}
|
|
.scene-card .head h3{white-space:nowrap}
|
|
.scene-card canvas{width:100%;height:420px;border-radius:var(--r-row);background:var(--row);border:1px solid var(--line);display:block}
|
|
.scenes.only .scene-card canvas{height:560px}
|
|
.scene-card p{margin:0;color:var(--ink-2);font-size:var(--t-base)}
|
|
@media (max-width:1000px){.scenes{grid-template-columns:1fr}.scene-card canvas{height:320px}.scenes.only .scene-card canvas{height:420px}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- nav:start -->
|
|
<a class="skip" href="#main">Skip to content</a>
|
|
<nav class="nav" aria-label="Main">
|
|
<div class="wrap">
|
|
<a href="/" class="brand" aria-label="Igneum home">
|
|
<svg class="mark" viewBox="0 0 1024 1024" width="28" height="28" aria-hidden="true"><rect width="1024" height="1024" rx="160" fill="#0C0C0E"></rect><g transform="translate(166.95 166.95) scale(6.901)"><polygon points="50,4 74,34 67,58 80,54 61,96 39,96 20,54 33,58 26,34" fill="#F2541B"></polygon><polygon points="50,42 59,58 50,82 41,58" fill="#0C0C0E"></polygon></g></svg>
|
|
<span class="word">IGNEUM</span>
|
|
</a>
|
|
<div class="links" id="nav-links">
|
|
<a href="/litepaper" data-nav="litepaper">Litepaper</a>
|
|
<a href="/miner" data-nav="miner">Miner</a>
|
|
<a href="/app" data-nav="app">App</a>
|
|
<a href="/wallet" data-nav="wallet">Wallet</a>
|
|
<a href="/live" data-nav="live">Live devnet</a>
|
|
<a href="/ledger" data-nav="ledger">Ledger</a>
|
|
</div>
|
|
<a href="/miner#get" class="btn primary small cta">Download</a>
|
|
<button class="burger" id="nav-burger" type="button" aria-expanded="false" aria-controls="nav-sheet" aria-label="Menu"><span class="bars"></span></button>
|
|
<div class="nav-sheet" id="nav-sheet">
|
|
<a href="/litepaper" data-nav="litepaper">Litepaper</a>
|
|
<a href="/miner" data-nav="miner">Miner</a>
|
|
<a href="/app" data-nav="app">App</a>
|
|
<a href="/wallet" data-nav="wallet">Wallet</a>
|
|
<a href="/live" data-nav="live">Live devnet</a>
|
|
<a href="/ledger" data-nav="ledger">Ledger</a>
|
|
<a href="/bench" data-nav="bench">Engineering log</a>
|
|
<a href="/evidence" data-nav="evidence">Evidence</a>
|
|
<a href="/explorer">Explorer</a>
|
|
<a href="https://github.com/igneum-network/spec" rel="noopener">GitHub</a>
|
|
<a href="/miner#get" class="btn primary">Download the miner</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<script>
|
|
(function(){
|
|
// the menu: open on the button, closed by any link, Escape (focus back on the button) or a resize past 900 px
|
|
var n=document.querySelector('.nav'),b=document.getElementById('nav-burger'),s=document.getElementById('nav-sheet');if(!n||!b||!s)return;
|
|
function set(o){n.classList.toggle('open',o);b.setAttribute('aria-expanded',o?'true':'false');document.documentElement.style.overflow=o?'hidden':'';}
|
|
b.addEventListener('click',function(){set(!n.classList.contains('open'));});
|
|
s.addEventListener('click',function(e){if(e.target.closest('a'))set(false);});
|
|
document.addEventListener('keydown',function(e){if(e.key==='Escape'&&n.classList.contains('open')){set(false);b.focus();}});
|
|
var mq=window.matchMedia('(min-width:901px)');if(mq.addEventListener)mq.addEventListener('change',function(){set(false);});
|
|
})();
|
|
</script>
|
|
<!-- nav:end -->
|
|
<main id="main">
|
|
<section class="lab">
|
|
<div class="wrap">
|
|
<div class="lab-head">
|
|
<div>
|
|
<div class="eyebrow">A lab, not linked</div>
|
|
<h1>Three scenes, one feed</h1>
|
|
<p class="lead" style="margin-top:var(--s-3)">The same live devnet reply, drawn three ways. Every mark is a block the observer stored; the words are the ledger's.</p>
|
|
</div>
|
|
<div class="state" id="feed-state"><span class="dot off"></span>connecting to the devnet observer</div>
|
|
</div>
|
|
<div class="scenes" id="scenes">
|
|
<div class="scene-card card" data-scene="a">
|
|
<div class="head"><h3>A · Forge</h3><div class="eyebrow">embers rise</div></div>
|
|
<canvas id="sc-a" aria-label="Forge: blocks rise as embers from the bottom and cool from molten to bone as they go from pending to included to proven; a dark band sweeps up at the lock"></canvas>
|
|
<p>Blocks arrive as embers from the hearth, one column per miner, and cool as they go: pending molten, included ember, proven bone. A lock is the dark band sweeping up; everything under it is final.</p>
|
|
</div>
|
|
<div class="scene-card card" data-scene="b">
|
|
<div class="head"><h3>B · Lattice</h3><div class="eyebrow">a slow isometric DAG</div></div>
|
|
<canvas id="sc-b" aria-label="Lattice: an isometric DAG with parents behind children, the selected chain a lit spine, checkpoints as rings closing around it"></canvas>
|
|
<p>Time runs left to right, each miner one step deeper, so parents stand behind their children. The selected chain is the lit spine; a checkpoint is a ring that closes around it when it locks. The camera drifts at chain speed.</p>
|
|
</div>
|
|
<div class="scene-card card" data-scene="c">
|
|
<div class="head"><h3>C · Pulse</h3><div class="eyebrow">the tip at the centre</div></div>
|
|
<canvas id="sc-c" aria-label="Pulse: the tip at the centre, time outward in rings, each block a bead on its miner's ray, proofs filling beads, locks as a ring hardening"></canvas>
|
|
<p>The tip is the centre and time runs outward, a ring every 30 seconds. Each miner is a ray; a block is a bead on it that drifts outward, filling when proven. A lock is a ring that hardens from dashed to solid.</p>
|
|
</div>
|
|
</div>
|
|
<div class="legend" style="margin-top:var(--s-5)">
|
|
<span><i class="sw" style="border:2px solid var(--molten);border-radius:50%"></i>pending</span>
|
|
<span><i class="sw" style="background:var(--ember);border-radius:50%"></i>included</span>
|
|
<span><i class="sw" style="border:2px solid var(--line-2);border-radius:50%;opacity:.45"></i>excluded</span>
|
|
<span><i class="sw" style="background:var(--bone);border-radius:50%"></i>proven</span>
|
|
<span><i class="sw" style="border:3px solid var(--ember);border-radius:50%;background:transparent"></i>locked checkpoint</span>
|
|
</div>
|
|
<p class="note">One node is read every 2 s; the window is the last 120 s. Under reduced motion each scene draws a still frame on every reply. Add <code>?only=a</code>, <code>b</code> or <code>c</code> to the address for one scene full width.</p>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<!-- footer:start -->
|
|
<footer class="foot">
|
|
<div class="wrap">
|
|
<div class="foot-grid">
|
|
<div class="foot-brand">
|
|
<a href="/" class="brand" aria-label="Igneum home"><svg class="mark" viewBox="0 0 1024 1024" width="26" height="26" aria-hidden="true"><rect width="1024" height="1024" rx="160" fill="#0C0C0E"></rect><g transform="translate(166.95 166.95) scale(6.901)"><polygon points="50,4 74,34 67,58 80,54 61,96 39,96 20,54 33,58 26,34" fill="#F2541B"></polygon><polygon points="50,42 59,58 50,82 41,58" fill="#0C0C0E"></polygon></g></svg><span class="word">IGNEUM</span></a>
|
|
<p>Mined by GPUs. Proven by fire.</p>
|
|
</div>
|
|
<nav class="foot-col" aria-label="Read">
|
|
<div class="eyebrow">Read</div>
|
|
<a href="/litepaper">Litepaper</a>
|
|
<a href="/litepaper#limits">What Igneum does not claim</a>
|
|
<a href="/litepaper#randomx">Igneum vs RandomX</a>
|
|
<a href="/litepaper#shoulders">Built on the shoulders</a>
|
|
<a href="/bench">Engineering log</a>
|
|
<a href="/evidence">Evidence</a>
|
|
<a href="/ledger">Ledger: every criticism</a>
|
|
</nav>
|
|
<nav class="foot-col" aria-label="Run">
|
|
<div class="eyebrow">Run</div>
|
|
<a href="/miner">The miner</a>
|
|
<a href="/app">The app</a>
|
|
<a href="/wallet">The wallet</a>
|
|
<a href="/miners">GPU bench table</a>
|
|
<a href="/miner#fee">The dev fee</a>
|
|
<a href="/faucet">Testnet faucet</a>
|
|
</nav>
|
|
<nav class="foot-col" aria-label="Follow">
|
|
<div class="eyebrow">Follow</div>
|
|
<a href="/live">Live devnet</a>
|
|
<a href="/explorer">Explorer</a>
|
|
<a href="/litepaper#roadmap">Journey</a>
|
|
<a href="/metamask">Add Igneum to MetaMask</a>
|
|
<a href="https://github.com/igneum-network/spec" rel="noopener"><svg viewBox="0 0 24 24" width="15" height="15" fill="currentColor" aria-hidden="true"><path d="M12 .5C5.7.5.5 5.7.5 12c0 5.1 3.3 9.4 7.9 10.9.6.1.8-.3.8-.6v-2.1c-3.2.7-3.9-1.4-3.9-1.4-.5-1.3-1.3-1.7-1.3-1.7-1-.7.1-.7.1-.7 1.2.1 1.8 1.2 1.8 1.2 1 1.8 2.7 1.3 3.4 1 .1-.8.4-1.3.7-1.6-2.6-.3-5.3-1.3-5.3-5.7 0-1.3.5-2.3 1.2-3.1-.1-.3-.5-1.5.1-3.1 0 0 1-.3 3.2 1.2.9-.3 1.9-.4 2.9-.4s2 .1 2.9.4c2.2-1.5 3.2-1.2 3.2-1.2.6 1.6.2 2.8.1 3.1.8.8 1.2 1.8 1.2 3.1 0 4.4-2.7 5.4-5.3 5.7.4.4.8 1.1.8 2.2v3.2c0 .3.2.7.8.6 4.6-1.5 7.9-5.8 7.9-10.9C23.5 5.7 18.3.5 12 .5z"></path></svg>GitHub, spec and vectors</a>
|
|
<a href="/miner#get">Miner downloads: devnet build</a>
|
|
<a href="mailto:hello@igneum.network">Report a flaw: hello@igneum.network</a>
|
|
<a href="https://github.com/igneum-network/spec/issues" rel="noopener">Or open an issue on the spec</a>
|
|
</nav>
|
|
</div>
|
|
<div class="foot-base">
|
|
<span class="foot-imprint">Igneum Labs LTD · Unit IH-00-01-01-OF-01, Level 01, Innovation One, Dubai International Financial Centre · <a href="mailto:hello@igneum.network">hello@igneum.network</a></span>
|
|
<span>© 2026 Igneum. Nothing on this page is an offer to sell anything.</span>
|
|
<span class="theme" role="group" aria-label="Theme"><button type="button" data-theme-set="system" aria-pressed="true">System</button><button type="button" data-theme-set="light" aria-pressed="false">Light</button><button type="button" data-theme-set="dark" aria-pressed="false">Dark</button></span>
|
|
<span class="mono">igneum.network</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
(function(){
|
|
// theme control: stores light or dark under igneum-theme; system clears it. The head applied the stored value before paint.
|
|
var bs=document.querySelectorAll('[data-theme-set]');if(!bs.length)return;
|
|
function cur(){try{var t=localStorage.getItem('igneum-theme');return t==='light'||t==='dark'?t:'system';}catch(e){return 'system';}}
|
|
function paint(){var c=cur();bs.forEach(function(b){b.setAttribute('aria-pressed',b.getAttribute('data-theme-set')===c?'true':'false');});}
|
|
bs.forEach(function(b){b.addEventListener('click',function(){var v=b.getAttribute('data-theme-set');try{if(v==='system')localStorage.removeItem('igneum-theme');else localStorage.setItem('igneum-theme',v);}catch(e){}
|
|
if(v==='system')document.documentElement.removeAttribute('data-theme');else document.documentElement.setAttribute('data-theme',v);paint();});});
|
|
paint();
|
|
})();
|
|
</script>
|
|
<!-- footer:end -->
|
|
<script src="/scenes/feed.js"></script>
|
|
<script src="/scenes/forge.js"></script>
|
|
<script src="/scenes/lattice.js"></script>
|
|
<script src="/scenes/pulse.js"></script>
|
|
<script>
|
|
(function(){
|
|
var only=new URLSearchParams(location.search).get('only'),grid=document.getElementById('scenes');
|
|
if(only){grid.classList.add('only');Array.prototype.slice.call(grid.children).forEach(function(c){if(c.getAttribute('data-scene')!==only)c.remove();});}
|
|
var subs=[];
|
|
if(document.getElementById('sc-a'))subs.push(IgneumForge.mount(document.getElementById('sc-a'),{}));
|
|
if(document.getElementById('sc-b'))subs.push(IgneumLattice.mount(document.getElementById('sc-b'),{window:120,compact:window.innerWidth<700}));
|
|
if(document.getElementById('sc-c'))subs.push(IgneumPulse.mount(document.getElementById('sc-c'),{window:120}));
|
|
var st=document.getElementById('feed-state');
|
|
IgneumFeed.start({window:120,subs:subs,onState:function(s,r){st.className='state '+(s==='live'?'live':s==='failed'?'bad':'');st.innerHTML='<span class="dot '+(s==='live'?'live':s==='failed'?'bad':'off')+'"></span>'+(s==='live'?'live devnet':s==='connecting'?'connecting to the devnet observer':(r||'live feed unavailable'));}});
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|