site/deviant/index.html

940 lines
38 KiB
HTML
Raw Permalink Normal View History

Sweep: mobile Ariadne updates, Deviant brand + sites, Hephaestus bootstrap, snappymail Broad-scope commit sweeping in work from parallel sessions plus this session's dev-only utilities. No single unifying theme — this is the "commit everything that's ready" pass. Grouped by area below. AriadneResolver / mobile * Small updates to BchFetcher, Bns, MainActivity, AriadneVpnService, and the Android manifest — from a parallel mobile-resolver session. * AriadneResolver/mobile/webpreview/ — new local dev webview (index.html + server.mjs) for iterating on the mobile UI without a device. Email / SnappyMail * Email/snappymail-plugin/silentmode-addresses — new SnappyMail plugin (README, CSS, PHP entry, JS) for surfacing @silentmode.st address management inside the webmail UI. Hephaestus (Forgejo + auth-proxy) * auth-proxy/src/oidc.ts + docker-compose.yml updates. * scripts/bootstrap-auth.sh — idempotent script that registers the wallet auth-proxy as Forgejo's OIDC provider after `docker compose up -d`. All secrets read from .env — no literals in the script. TheseusNavigator / dev tools * dev/list-tlds.mjs — enumerate every registered BNS name grouped by TLD via our own indexer. * dev/show-tlds-bch.mjs — dump the full records payload of the legacy tlds.bch name (kept as a diagnostic for the list-in-one-NFT era). Deviant sites + brand * site/deviant/ — new microsites (anthemus, potidaea, brand, mindmap, main index) plus the full brand kit under site/deviant/brand/ (logos, icons, palette, social exports as SVG source + PNG renders). * site-sirius-x/portal.html — updates. Coordination * _coordination/sessions/mobile-resolver.md — parallel-session notes. Deliberately excluded from this commit: * scratchpad/ — this session's temp drafts (Sia doc mockups, tlds UPD payloads). * TheseusNavigator/_prev/ — ~372 MB of prior release binaries; belongs in a separate artefacts store, not the git tree. Add to .gitignore next pass.
2026-08-30 10:38:49 +02:00
<!DOCTYPE html>
<html lang="en" data-theme="signal">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Deviant — Power Your Ideas</title>
<meta name="description" content="Deviant exists to enable resistance — by giving users on-chain experience that intermediation cannot mediate.">
<script>
(function(){try{var t=localStorage.getItem('deviant-theme');if(t==='editorial'){document.documentElement.removeAttribute('data-theme');}else{document.documentElement.setAttribute('data-theme','signal');}}catch(e){document.documentElement.setAttribute('data-theme','signal');}})();
</script>
<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=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=JetBrains+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700;800&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet">
<style>
:root {
--header-h: 58px;
--sky-deep: #050810;
--sky-mid: #0a0f1c;
--sky-rim: #131a2a;
--star-faint: rgba(255, 255, 255, 0.22);
--star-mid: rgba(255, 255, 255, 0.38);
--star-bright: rgba(255, 255, 255, 0.58);
--ink-soft: #b8c2d4;
--ink: #d6dde9;
--ink-bright: #f1f4fa;
--muted: #6a7488;
--acid: #d6ff3d;
--acid-glow: rgba(214, 255, 61, 0.55);
--acid-halo: rgba(214, 255, 61, 0.22);
--acid-dim: rgba(214, 255, 61, 0.08);
--rust-deep: #6b2a1c;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
background: var(--sky-deep);
color: var(--ink);
font-family: 'Fraunces', Georgia, serif;
font-weight: 400;
font-feature-settings: "ss01", "ss02";
font-synthesis: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
min-height: 100vh;
}
body { padding-top: var(--header-h); }
html { scroll-padding-top: calc(var(--header-h) + 14px); }
body {
background:
radial-gradient(ellipse at top, var(--sky-rim) 0%, transparent 60%),
radial-gradient(ellipse at bottom right, var(--sky-mid) 0%, transparent 50%),
radial-gradient(ellipse at bottom left, #0c1424 0%, transparent 55%),
var(--sky-deep);
background-attachment: fixed;
position: relative;
}
/* Starfield */
.stars {
position: fixed;
inset: 0;
overflow: hidden;
pointer-events: none;
z-index: 0;
}
.starfield {
position: absolute;
top: 50%; left: 50%;
width: 150vmax; height: 150vmax;
margin: -75vmax 0 0 -75vmax;
transform-origin: center center;
will-change: transform;
animation: skyspin 240s linear infinite;
}
.star {
position: absolute;
background: var(--star-faint);
border-radius: 50%;
animation: twinkle var(--twinkle-duration, 12s) ease-in-out infinite;
animation-delay: var(--twinkle-delay, 0s);
}
@keyframes twinkle {
0%, 100% { opacity: 0.35; }
50% { opacity: 0.85; }
}
@keyframes skyspin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
.star { animation: none; opacity: 0.4; }
.starfield { animation: none; }
}
/* Layout */
.container {
position: relative;
z-index: 1;
max-width: 1180px;
margin: 0 auto;
padding: 0 32px;
}
/* Top bar */
.site-header {
position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 100;
background: rgba(5,8,16,0.80);
backdrop-filter: blur(10px) saturate(120%);
-webkit-backdrop-filter: blur(10px) saturate(120%);
border-bottom: 1px solid rgba(255,255,255,0.06);
}
.topbar {
max-width: 1180px; margin: 0 auto;
padding: 16px 32px;
display: flex;
justify-content: space-between;
align-items: center;
}
.topbar-right { display: flex; align-items: center; gap: 28px; }
.wordmark {
font-family: 'Fraunces', serif;
font-weight: 500;
font-size: 22px;
letter-spacing: -0.01em;
color: var(--ink-bright);
text-decoration: none;
line-height: 1;
}
.wordmark::after {
content: "";
display: inline-block;
width: 5px;
height: 5px;
background: var(--acid);
border-radius: 50%;
margin-left: 7px;
vertical-align: middle;
transform: translateY(-2px);
box-shadow:
0 0 6px var(--acid-glow),
0 0 14px var(--acid-halo);
}
.nav {
display: flex;
gap: 36px;
font-family: 'JetBrains Mono', monospace;
font-size: 11px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--muted);
}
.nav a {
color: var(--muted);
text-decoration: none;
transition: color 0.4s ease;
}
.nav a:hover { color: var(--ink-bright); }
/* Hero */
.hero {
min-height: calc(100vh - var(--header-h) - 24px);
display: flex;
flex-direction: column;
justify-content: center;
padding: 64px 0 96px;
position: relative;
}
/* Hero two-column layout */
.hero-grid{
display:grid;
grid-template-columns:minmax(0,1.18fr) minmax(0,0.82fr);
gap:clamp(36px,5vw,72px);
align-items:center;
width:100%;
}
.hero-left .opening{max-width:none;}
.hero-left .opening p{font-size:clamp(17px,2.295vw,26.35px);margin-bottom:0;}
.hero-left .response{margin-top:32px;}
.hero-right{display:flex;flex-direction:column;gap:30px;}
.traj{width:100%;height:auto;display:block;overflow:visible;}
.traj .traj-default{stroke:var(--muted);stroke-width:1.4;fill:none;opacity:.6;stroke-dasharray:3 6;stroke-linecap:round;}
.traj .traj-dev{stroke:var(--acid);stroke-width:2.4;fill:none;stroke-linecap:round;filter:drop-shadow(0 0 5px var(--acid-halo));}
.traj .traj-node{fill:var(--acid);filter:drop-shadow(0 0 7px var(--acid-glow));}
.traj .traj-branch{fill:var(--muted);}
.traj text{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;}
.traj .traj-lbl-muted{fill:var(--muted);}
.traj .traj-lbl-acid{fill:var(--acid);}
.hero-cta{display:flex;flex-direction:column;gap:12px;}
.btn{
font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
text-decoration:none;padding:15px 18px;border-radius:11px;
display:flex;align-items:center;justify-content:space-between;gap:12px;
transition:border-color .25s ease,color .25s ease,box-shadow .25s ease,background .25s ease;
}
.btn-primary{color:var(--sky-deep);background:var(--acid);font-weight:600;box-shadow:0 0 16px var(--acid-dim);}
.btn-primary:hover{box-shadow:0 0 28px var(--acid-halo);}
.btn-ghost{color:var(--ink);background:transparent;border:1px solid rgba(184,194,212,0.22);}
.btn-ghost:hover{border-color:var(--acid);color:var(--ink-bright);}
@media (max-width:880px){
.hero-grid{grid-template-columns:1fr;gap:40px;}
.hero-right{order:2;max-width:440px;}
}
.label {
font-family: 'JetBrains Mono', monospace;
font-size: 10px;
letter-spacing: 0.28em;
text-transform: uppercase;
color: var(--muted);
margin-bottom: 48px;
display: flex;
align-items: center;
gap: 12px;
}
.label::before {
content: "";
width: 22px;
height: 1px;
background: var(--muted);
}
.opening {
max-width: 920px;
}
.opening p {
font-family: 'Fraunces', serif;
font-weight: 300;
font-size: clamp(22px, 3.2vw, 36px);
line-height: 1.42;
letter-spacing: -0.012em;
color: var(--ink);
margin-bottom: 28px;
font-variation-settings: "opsz" 96;
}
.opening p:last-child {
margin-bottom: 0;
}
.opening .o2 {
color: var(--ink);
}
.opening .o3 {
color: var(--ink-bright);
}
/* The rotating word */
.rot-wrap {
display: inline-block;
position: relative;
vertical-align: baseline;
text-align: left;
}
.rot-word {
display: inline-block;
position: relative;
color: var(--ink-bright);
font-style: italic;
font-weight: 400;
}
.rot-word::after {
content: '';
position: absolute;
left: calc(100% + 3px);
top: 0.14em;
width: 2px; height: 0.84em;
background: var(--acid);
box-shadow: 0 0 6px var(--acid-halo);
animation: caretBlink 1s step-end infinite;
}
@keyframes caretBlink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
.rot-word::after { animation: none; opacity: 0; }
}
/* Deviation glow — acid green luminescence */
.deviation {
color: var(--acid);
font-style: italic;
font-weight: 500;
text-shadow:
0 0 4px var(--acid-glow),
0 0 14px var(--acid-halo),
0 0 32px var(--acid-dim);
}
/* Response line — slim mark, no box */
.response {
margin-top: 56px;
max-width: 760px;
position: relative;
padding-left: 24px;
}
.response::before {
content: "";
position: absolute;
left: 0;
top: 6px;
bottom: 6px;
width: 2px;
background: var(--acid);
box-shadow:
0 0 6px var(--acid-glow),
0 0 14px var(--acid-halo);
}
.response p {
font-family: 'Fraunces', serif;
font-weight: 400;
font-size: clamp(18px, 1.9vw, 22px);
line-height: 1.55;
letter-spacing: -0.005em;
color: var(--ink);
}
.response strong {
color: var(--ink-bright);
font-weight: 500;
}
/* Pathways */
.pathways {
padding: 112px 0 96px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.pathways-label {
font-family: 'JetBrains Mono', monospace;
font-size: 10px;
letter-spacing: 0.28em;
text-transform: uppercase;
color: var(--muted);
margin-bottom: 56px;
}
.path-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 48px;
}
.path {
text-decoration: none;
color: inherit;
display: block;
transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.path:hover {
transform: translateY(-4px);
}
.path-num {
font-family: 'JetBrains Mono', monospace;
font-size: 11px;
letter-spacing: 0.22em;
color: var(--muted);
margin-bottom: 18px;
}
.path-title {
font-family: 'Fraunces', serif;
font-weight: 400;
font-size: 26px;
line-height: 1.25;
letter-spacing: -0.012em;
color: var(--ink-bright);
margin-bottom: 14px;
font-variation-settings: "opsz" 72;
}
.path-desc {
font-family: 'Fraunces', serif;
font-weight: 300;
font-size: 15px;
line-height: 1.6;
color: var(--ink-soft);
font-variation-settings: "opsz" 14;
}
.path-arrow {
display: inline-block;
margin-top: 18px;
font-family: 'JetBrains Mono', monospace;
font-size: 11px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--muted);
transition: color 0.4s ease, gap 0.4s ease;
}
.path:hover .path-arrow { color: var(--acid); }
.path-arrow::after {
content: " →";
display: inline-block;
transition: transform 0.4s ease;
}
.path:hover .path-arrow::after { transform: translateX(4px); }
/* Footer */
footer {
padding: 56px 0 48px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 32px;
flex-wrap: wrap;
}
.footer-mark {
font-family: 'Fraunces', serif;
font-weight: 400;
font-size: 15px;
color: var(--muted);
max-width: 480px;
line-height: 1.55;
}
.footer-mark strong {
color: var(--ink);
font-weight: 500;
}
.footer-meta {
font-family: 'JetBrains Mono', monospace;
font-size: 10px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--muted);
text-align: right;
}
.footer-meta div { margin-bottom: 6px; }
.footer-meta div:last-child { margin-bottom: 0; }
/* Positioning — what Deviant is */
.positioning {
padding: 112px 0 96px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.pos-statement { max-width: 980px; margin-top: 8px; }
.surfaces {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 44px 48px;
margin-top: 80px;
}
.surface-name {
font-family: 'Fraunces', serif; font-weight: 400; font-size: 22px;
color: var(--ink-bright); margin-bottom: 8px; letter-spacing: -0.012em;
font-variation-settings: "opsz" 72;
}
.surface-desc {
font-family: 'Fraunces', serif; font-weight: 300; font-size: 15px;
line-height: 1.6; color: var(--ink-soft); font-variation-settings: "opsz" 14;
}
.clean-note { margin-top: 80px; }
.clean-tags { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.clean-tags span {
font-family: 'JetBrains Mono', monospace; font-size: 11px;
letter-spacing: 0.18em; text-transform: uppercase; color: var(--acid);
}
.clean-note p {
margin-top: 24px; max-width: 720px;
font-family: 'Fraunces', serif; font-weight: 300; font-size: 16px;
line-height: 1.62; color: var(--ink-soft);
}
.slogan-closing { text-align: center; margin: 120px 0 8px; }
.slogan-line {
margin-top: 88px;
font-family: 'Fraunces', serif; font-style: italic; font-weight: 500;
font-size: clamp(26px, 4vw, 44px); letter-spacing: -0.01em;
color: var(--acid);
text-shadow: 0 0 6px var(--acid-glow), 0 0 18px var(--acid-halo), 0 0 40px var(--acid-dim);
}
/* Mobile */
@media (max-width: 880px) {
.container { padding: 0 22px; }
.topbar { padding: 12px 20px; }
.nav { display: none; }
.opening p { font-size: clamp(20px, 5.4vw, 28px); }
.hero { min-height: calc(100vh - var(--header-h)); padding: 40px 0 72px; }
.response { margin-top: 56px; padding-left: 22px; }
.response p { font-size: 17px; }
.pathways { padding: 88px 0 72px; }
.path-grid { grid-template-columns: 1fr; gap: 56px; }
.pathways-label { margin-bottom: 40px; }
footer { flex-direction: column; align-items: flex-start; }
.footer-meta { text-align: left; }
.positioning { padding: 88px 0 72px; }
.surfaces { grid-template-columns: 1fr; gap: 44px; margin-top: 56px; }
.clean-note { margin-top: 56px; }
.slogan-line { margin-top: 64px; }
}
@media (max-width: 480px) {
.container { padding: 0 18px; }
.label { font-size: 9px; margin-bottom: 32px; }
.label::before { width: 14px; }
.opening p { font-size: 19px; line-height: 1.45; }
.response p { font-size: 16px; }
.path-title { font-size: 22px; }
}
/* Skip-link for accessibility */
.skip { position: absolute; left: -9999px; }
.skip:focus {
left: 12px; top: 12px; z-index: 100;
padding: 8px 14px; background: var(--ink-bright); color: var(--sky-deep);
font-family: 'JetBrains Mono', monospace; font-size: 11px;
letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none;
}
/* Proof metrics */
.metrics {
display: grid; grid-template-columns: repeat(4, 1fr);
gap: 28px; margin-top: 64px;
border-top: 1px solid rgba(255,255,255,0.06);
border-bottom: 1px solid rgba(255,255,255,0.06);
padding: 36px 0;
}
.metric-n {
font-family: 'Fraunces', serif; font-weight: 400;
font-size: clamp(30px, 4vw, 46px); line-height: 1;
color: var(--acid);
text-shadow: 0 0 6px var(--acid-glow), 0 0 18px var(--acid-halo);
font-variation-settings: "opsz" 96;
}
.metric-l {
margin-top: 12px;
font-family: 'JetBrains Mono', monospace; font-size: 10px;
letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted);
}
/* Contrast grid (positioning) */
.vs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 44px 48px; margin-top: 72px; }
.vs-col .vs-head {
font-family: 'JetBrains Mono', monospace; font-size: 10px;
letter-spacing: 0.2em; text-transform: uppercase;
color: var(--muted); margin-bottom: 14px;
}
.vs-col.is-mba .vs-head { color: var(--acid); }
.vs-col .vs-body {
font-family: 'Fraunces', serif; font-weight: 300; font-size: 16px;
line-height: 1.62; color: var(--ink-soft);
}
.vs-col .vs-body strong { color: var(--ink-bright); font-weight: 500; }
@media (max-width: 880px) {
.metrics { grid-template-columns: repeat(2, 1fr); gap: 28px 20px; }
.vs-grid { grid-template-columns: 1fr; gap: 36px; }
.surfaces { grid-template-columns: 1fr !important; }
}
/* ===== Style switch: Signal theme (sans / glow, mindmap aesthetic) ===== */
[data-theme="signal"] {
--sky-deep:#050505; --sky-mid:#0a0a0a; --sky-rim:#161616;
--ink:#f2f2f2; --ink-bright:#ffffff; --ink-soft:#d2d2d2; --muted:#9a9a9a;
--acid:#c6ff00;
--acid-glow:rgba(198,255,0,0.60); --acid-halo:rgba(198,255,0,0.34); --acid-dim:rgba(198,255,0,0.16);
}
[data-theme="signal"] * { font-family:'DM Sans', system-ui, "Segoe UI", sans-serif !important; font-style: normal !important; }
[data-theme="signal"] body { line-height:1.62; -webkit-font-smoothing:antialiased; }
/* uppercase labels in mono — the v6 treatment */
[data-theme="signal"] .label,
[data-theme="signal"] .pathways-label,
[data-theme="signal"] .nav,
[data-theme="signal"] .nav a,
[data-theme="signal"] .vs-head,
[data-theme="signal"] .metric-l,
[data-theme="signal"] .clean-tags span,
[data-theme="signal"] .kicker,
[data-theme="signal"] .footer-meta,
[data-theme="signal"] .theme-toggle { font-family:'DM Mono', ui-monospace, monospace !important; letter-spacing:0.12em; }
[data-theme="signal"] .btn { font-family:'DM Mono', ui-monospace, monospace !important; }
[data-theme="signal"] body {
background:
radial-gradient(1200px 600px at 50% -10%, rgba(198,255,0,0.06), transparent 60%),
radial-gradient(900px 500px at 100% 120%, rgba(198,255,0,0.04), transparent 60%),
#050505;
}
[data-theme="signal"] .label,
[data-theme="signal"] .pathways-label,
[data-theme="signal"] .nav,
[data-theme="signal"] .vs-head,
[data-theme="signal"] .metric-l,
[data-theme="signal"] .clean-tags span,
[data-theme="signal"] .opening p { font-weight: 700 !important; }
[data-theme="signal"] .wordmark,
[data-theme="signal"] .path-title,
[data-theme="signal"] .surface-name,
[data-theme="signal"] .slogan-line,
[data-theme="signal"] .metric-n,
[data-theme="signal"] .footer-mark strong { font-weight: 800 !important; }
[data-theme="signal"] .deviation,
[data-theme="signal"] .slogan-line,
[data-theme="signal"] .metric-n {
text-shadow: 0 0 6px rgba(198,255,0,0.55), 0 0 18px rgba(198,255,0,0.35), 0 0 40px rgba(198,255,0,0.18) !important;
}
/* Style-switch button */
.theme-toggle {
font-family: 'JetBrains Mono', monospace; font-size: 10px;
letter-spacing: 0.16em; text-transform: uppercase;
color: var(--acid); background: rgba(214,255,61,0.06);
border: 1px solid var(--acid-halo); padding: 8px 13px; border-radius: 999px;
cursor: pointer; white-space: nowrap;
transition: border-color 0.3s ease, color 0.3s ease, background 0.3s ease;
}
.theme-toggle:hover { border-color: var(--acid); background: rgba(214,255,61,0.10); }
[data-theme="signal"] .site-header { background: rgba(5,5,5,0.82); }
[data-theme="signal"] .theme-toggle { background: rgba(198,255,0,0.07); }
</style>
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
Sweep: mobile Ariadne updates, Deviant brand + sites, Hephaestus bootstrap, snappymail Broad-scope commit sweeping in work from parallel sessions plus this session's dev-only utilities. No single unifying theme — this is the "commit everything that's ready" pass. Grouped by area below. AriadneResolver / mobile * Small updates to BchFetcher, Bns, MainActivity, AriadneVpnService, and the Android manifest — from a parallel mobile-resolver session. * AriadneResolver/mobile/webpreview/ — new local dev webview (index.html + server.mjs) for iterating on the mobile UI without a device. Email / SnappyMail * Email/snappymail-plugin/silentmode-addresses — new SnappyMail plugin (README, CSS, PHP entry, JS) for surfacing @silentmode.st address management inside the webmail UI. Hephaestus (Forgejo + auth-proxy) * auth-proxy/src/oidc.ts + docker-compose.yml updates. * scripts/bootstrap-auth.sh — idempotent script that registers the wallet auth-proxy as Forgejo's OIDC provider after `docker compose up -d`. All secrets read from .env — no literals in the script. TheseusNavigator / dev tools * dev/list-tlds.mjs — enumerate every registered BNS name grouped by TLD via our own indexer. * dev/show-tlds-bch.mjs — dump the full records payload of the legacy tlds.bch name (kept as a diagnostic for the list-in-one-NFT era). Deviant sites + brand * site/deviant/ — new microsites (anthemus, potidaea, brand, mindmap, main index) plus the full brand kit under site/deviant/brand/ (logos, icons, palette, social exports as SVG source + PNG renders). * site-sirius-x/portal.html — updates. Coordination * _coordination/sessions/mobile-resolver.md — parallel-session notes. Deliberately excluded from this commit: * scratchpad/ — this session's temp drafts (Sia doc mockups, tlds UPD payloads). * TheseusNavigator/_prev/ — ~372 MB of prior release binaries; belongs in a separate artefacts store, not the git tree. Add to .gitignore next pass.
2026-08-30 10:38:49 +02:00
</head>
<body>
<a href="#main" class="skip">Skip to content</a>
<div class="stars" aria-hidden="true" id="stars"></div>
<header class="site-header">
<div class="topbar">
<a href="./" class="wordmark">Deviant</a>
<div class="topbar-right">
<nav class="nav" aria-label="Primary">
<a href="#what">What</a>
<a href="#mechanism">Mechanism</a>
<a href="#proof">Proof</a>
<a href="https://deviant.navigate.st/" target="_blank" rel="noopener noreferrer">Wallet</a>
<a href="./potidaea/">Potidaea</a>
<a href="./anthemus/">Anthemus</a>
</nav>
</div>
</div>
</header>
<div class="container">
<main id="main" class="hero">
<div class="hero-grid">
<div class="hero-left">
<div class="label">A response to a default trajectory</div>
<div class="opening">
<p class="o-lead">When the institutional, technical, economic, and rhetorical forces all point in the same direction, the outcome they point toward becomes the default trajectory. <span class="deviation">Deviation</span> from the trajectory requires active resistance. In a <span class="rot-wrap"><span class="rot-word" id="rot">captured</span></span> information environment with limited resistance capacity, the default trajectory is what occurs.</p>
</div>
<div class="response">
<p><strong>Deviant</strong> exists to enable that resistance — by giving users on-chain experience that <em>intermediation cannot mediate</em>.</p>
</div>
</div>
<aside class="hero-right" aria-label="Trajectory and entry points">
<svg class="traj" viewBox="0 0 380 240" role="img" aria-label="A default trajectory drifting down, and a deviation breaking upward">
<path class="traj-default" d="M 12 70 C 110 96, 150 120, 200 138 C 255 158, 305 176, 368 198"/>
<circle class="traj-branch" cx="200" cy="138" r="3.4"/>
<path class="traj-dev" d="M 200 138 C 250 120, 300 84, 368 44"/>
<circle class="traj-node" cx="368" cy="44" r="5"/>
<text class="traj-lbl-muted" x="12" y="216">Default trajectory</text>
<text class="traj-lbl-acid" x="368" y="30" text-anchor="end">Deviation</text>
</svg>
<div class="hero-cta">
<a class="btn btn-primary" href="https://deviant.navigate.st/" target="_blank" rel="noopener noreferrer">Open Deviant Wallet <span aria-hidden="true">&rarr;</span></a>
<a class="btn btn-ghost" href="https://deviant.navigate.st/" target="_blank" rel="noopener noreferrer">Create Your Own Asset <span aria-hidden="true">&rarr;</span></a>
<a class="btn btn-ghost" href="#agora">Agora &mdash; Potidaea ASM &amp; Anthemus DEX <span aria-hidden="true">&rarr;</span></a>
</div>
</aside>
</div>
</main>
<section class="positioning" id="what" aria-label="What Deviant is">
<div class="pathways-label">What this is</div>
<div class="opening pos-statement">
<p>Deviant is the first wallet for an asset class that exists <span class="deviation">nowhere else</span> — a Bitcoin&#8209;Cash&#8209;backed asset you can redeem at a fixed rate, at any time, with no issuer, no custodian, and no counterparty. Enforced by mathematics, not trust.</p>
</div>
<div class="response">
<p>Permissionless mint, fixed rate, unlimited reservoir — the contract replaces the market maker, the liquidity provider, and the counterparty at once. Mint from a permissionless covenant; exit by burning your output back to its Bitcoin&#8209;Cash floor; swap to any other permissionless&#8209;mint asset in a single atomic transaction. <strong>No pool. No oracle. No one to ask.</strong></p>
</div>
<div class="surfaces">
<div class="surface"><div class="surface-name">Artemision</div><div class="surface-desc">Create. Genesis in one transaction — core parameters sealed, irreversible.</div></div>
<div class="surface"><div class="surface-name">Katalogos</div><div class="surface-desc">The asset list. Every class, filterable across the backed ↔ non-backed spectrum and by use-case.</div></div>
<div class="surface"><div class="surface-name">Agora</div><div class="surface-desc">The market hub. Home to Potidaea — a counterparty-free automated swap mechanism — and Anthemus, a decentralized exchange.</div></div>
</div>
<div class="clean-note">
<div class="clean-tags"><span>No issuer</span><span>No custodian</span><span>No counterparty</span><span>No token sale</span></div>
<p>Not a fundraise, not a pre&#8209;mine. The contract is small enough to read end to end in an evening — read it, replay the chain, break it or trust it. The wallet reports facts the chain has already settled; it never asks you to trust it.</p>
</div>
</section>
<section class="positioning" id="mechanism" aria-label="The mechanism">
<div class="pathways-label">The mechanism · ASM</div>
<div class="opening pos-statement">
<p>Every unit is <span class="deviation">self&#8209;backed</span> — it carries its own Bitcoin Cash inside the UTXO at a fixed rate. Redemption is a plain spend; a swap is a single atomic transaction, settled by consensus.</p>
</div>
<div class="response">
<p>The <strong>Automated Swap Mechanism</strong> prices every exchange by the Universal Exchange Rate — rate&#8202;A ÷ rate&#8202;B — derived from genesis constants alone. No DEX, no AMM, no oracle, no operator. There is no <em>approximately</em>: the floor is an equality the contract enforces at consensus level. <strong>Deterministic, not probabilistic.</strong></p>
</div>
<div class="clean-note">
<div class="clean-tags"><span>No counterparty</span><span>No oracle</span><span>No pool</span><span>No operator</span></div>
</div>
</section>
<section class="positioning" id="agora" aria-label="Agora">
<div class="pathways-label">Agora — the market hub</div>
<div class="opening pos-statement">
<p>Two markets under one roof. <strong>Potidaea</strong> is the native-BCH ASM — counterparty-free swaps priced by the Universal Exchange Rate, backing enforced at consensus level. <strong>Anthemus</strong> is the DEX — order-book and AMM for token-class assets and cross-chain price discovery. Together they cover every asset the wallet can hold.</p>
</div>
<div class="response">
<p>Potidaea's market exists the moment an MBA does — no order book, no listing gate; a founder can <strong>create an asset and earn without ever selling it</strong>. Anthemus adds the trading floor for everything the mechanism can't price alone — Token-class assets, wrapped foreign coins, cross-chain settlement.</p>
</div>
</section>
<section class="positioning" id="proof" aria-label="The proof">
<div class="pathways-label">The proof</div>
<div class="opening pos-statement">
<p>Not a hypothesis — a working mechanism, validated on the Bitcoin Cash <span class="deviation">chipnet</span> across 287 snapshots.</p>
</div>
<div class="metrics">
<div><div class="metric-n">564</div><div class="metric-l">Tests passing</div></div>
<div><div class="metric-n">52,998</div><div class="metric-l">Chipnet swaps</div></div>
<div><div class="metric-n">0</div><div class="metric-l">Exploits</div></div>
<div><div class="metric-n">100%</div><div class="metric-l">Peg integrity</div></div>
</div>
<div class="response" style="margin-top:56px;">
<p>The early atomic swaps proved the mechanism works; the bulk of the suite then exercised MBAs across <strong>use cases, configurations, and adversarial scenarios</strong> — what the assets can do, and whether they break. The wallet core is feature&#8209;complete and a <strong>PWA beta is live</strong> on chipnet. The contract is small enough to read in an evening: verify it, replay the chain, break it or trust it.</p>
</div>
</section>
<section class="positioning" id="positioning" aria-label="Why it is different">
<div class="pathways-label">Why it is different</div>
<div class="opening pos-statement">
<p>A conventional token is <span class="deviation">disconnected</span> from its base layer; an MBA is tied to it — so one asset's success amplifies the whole ecosystem.</p>
</div>
<div class="vs-grid">
<div class="vs-col"><div class="vs-head">Conventional tokens · ERC-20, BEP-20, …</div><div class="vs-body">No locked peg. Value rests on issuer reputation, demand, and traded liquidity — disconnected from any base&#8209;layer floor.</div></div>
<div class="vs-col is-mba"><div class="vs-head">The MBA</div><div class="vs-body">Value <strong>enforced by the protocol, not promised by an issuer</strong>. Price cannot fall below the mathematical floor.</div></div>
<div class="vs-col"><div class="vs-head">Stablecoins</div><div class="vs-body">When the issuer fails, a conventional stablecoin recovers $0. An MBA carries an on&#8209;chain <strong>bankruptcy&#8209;protection floor</strong>.</div></div>
<div class="vs-col is-mba"><div class="vs-head">DEX / exchanges</div><div class="vs-body">No order matching, no liquidity to bootstrap, no counterparty to wait for — the protocol is the exchange.</div></div>
</div>
<div class="clean-note">
<p>The <strong>volatility paradox</strong>: the asset marketed as "safe" fails its advertised property under stress. An MBA promises nothing it cannot keep — and because supply expands only against locked Bitcoin Cash, every asset launched <em>amplifies</em> the scarcity of the base layer rather than diluting it.</p>
</div>
</section>
<section class="positioning" id="economics" aria-label="The economics">
<div class="pathways-label">The economics — no fundraise</div>
<div class="opening pos-statement">
<p>Revenue is <span class="deviation">earned from real activity</span>, never raised. Like Bitcoin's own launch: no pre&#8209;mine, no token sale.</p>
</div>
<div class="surfaces">
<div class="surface"><div class="surface-name">Founder revenue</div><div class="surface-desc">A mint&#8209;only fee, immutable after genesis. Set at 1% on both sides, it creates a mathematically enforced ~2% round&#8209;trip spread — automated revenue from activity, not from selling the asset.</div></div>
<div class="surface"><div class="surface-name">Platform revenue</div><div class="surface-desc">Three streams: a voluntary marketing revenue&#8209;share on the Olympic tier ladder (Free → Bronze → Silver → Gold → Laurel), a ~0.5% wallet swap fee, and premium features.</div></div>
</div>
</section>
<section class="positioning" id="alignment" aria-label="Bitcoin Cash alignment">
<div class="pathways-label">Bitcoin Cash alignment</div>
<div class="opening pos-statement">
<p>Most projects extract from their chain. Deviant <span class="deviation">inverts</span> that — a public commitment of 2550% of platform revenue to Bitcoin Cash infrastructure, scaling toward the higher figure.</p>
</div>
<div class="response">
<p>Structural recognition of dependency, not philanthropy. The base layer is the <strong>environment</strong> — predetermined, permanent, unaffected by what evolves within it. Stars hang without visible support; planets wander yet hold their courses, bound by an unseen force. So here: <em>mathematics, not authority, holds the system together.</em></p>
</div>
</section>
<section class="pathways" id="pathways" aria-label="Project pathways">
<div class="pathways-label">Where to begin</div>
<div class="path-grid">
<a href="https://deviant.navigate.st/" target="_blank" rel="noopener noreferrer" class="path">
<div class="path-num">— 01</div>
<div class="path-title">The Wallet</div>
<div class="path-desc">On-chain experience without intermediation. Send, receive, and mint value-bearing assets the captured layer cannot mediate. Chipnet beta today — real testnet, no real funds.</div>
<div class="path-arrow">Open the wallet</div>
</a>
<a href="./potidaea/" class="path">
<div class="path-num">— 02</div>
<div class="path-title">Potidaea · Automated Swap Mechanism</div>
<div class="path-desc">Counterparty-free by design. Swaps between BCH and backing-anchored assets are priced by the covenant — the mechanism that makes an MBA economy possible without pooled liquidity.</div>
<div class="path-arrow">Enter Potidaea</div>
</a>
<a href="./anthemus/" class="path">
<div class="path-num">— 03</div>
<div class="path-title">Anthemus · Decentralized Exchange</div>
<div class="path-desc">Order-book plus AMM for token-class assets and cross-chain price discovery. Participants price the market; the interchain settlement hub's public trading floor.</div>
<div class="path-arrow">Enter Anthemus</div>
</a>
</div>
</section>
<div class="slogan-line slogan-closing">Power Your Ideas.</div>
<footer>
<div class="footer-mark">
<strong>Deviant</strong> is built on Bitcoin Cash because, measured against the whitepaper, BCH retains the structural properties the original specification depends on. The base layer matters.
</div>
<div class="footer-meta">
<div>Version 0.1 · Deviant</div>
<div>Last updated · August 2026</div>
</div>
</footer>
</div>
<script>
// Generate starfield
(function generateStars() {
const container = document.getElementById('stars');
if (!container) return;
const field = document.createElement('div'); field.className = 'starfield';
const count = window.innerWidth < 700 ? 260 : 520;
const frag = document.createDocumentFragment();
for (let i = 0; i < count; i++) {
const s = document.createElement('div');
s.className = 'star';
// Most stars are tiny and faint
const roll = Math.random();
let size, opacity, twinkleDur;
if (roll < 0.78) {
size = 1 + Math.random() * 0.4; // mostly tiny
opacity = 0.18 + Math.random() * 0.22;
twinkleDur = 14 + Math.random() * 8;
} else if (roll < 0.95) {
size = 1.4 + Math.random() * 0.6;
opacity = 0.32 + Math.random() * 0.22;
twinkleDur = 10 + Math.random() * 6;
} else {
size = 1.8 + Math.random() * 0.8;
opacity = 0.45 + Math.random() * 0.25;
twinkleDur = 8 + Math.random() * 5;
}
s.style.width = size + 'px';
s.style.height = size + 'px';
s.style.left = Math.random() * 100 + '%';
s.style.top = Math.random() * 100 + '%';
s.style.opacity = opacity;
s.style.setProperty('--twinkle-duration', twinkleDur + 's');
s.style.setProperty('--twinkle-delay', (Math.random() * twinkleDur) + 's');
frag.appendChild(s);
}
field.appendChild(frag);
container.appendChild(field);
})();
// Rotating word — typewriter: type -> hold 5s -> delete -> next
(function typeWord() {
const el = document.getElementById('rot');
if (!el) return;
const words = ['captured', 'compromised', 'constrained'];
const wrap = el.parentElement;
// Reserve a fixed slot = widest word so the text after it never reflows.
function reserve() {
if (!wrap) return;
const prev = el.textContent;
let max = 0;
words.forEach(function (w) { el.textContent = w; if (el.offsetWidth > max) max = el.offsetWidth; });
el.textContent = prev;
wrap.style.minWidth = (max + 8) + 'px';
}
reserve();
if (document.fonts && document.fonts.ready) document.fonts.ready.then(reserve);
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
el.textContent = words[0];
return;
}
let wi = 0, ci = 0, deleting = false;
const typeMs = 95, delMs = 45, holdMs = 5000, gapMs = 500;
el.textContent = '';
function tick() {
const w = words[wi];
if (!deleting) {
ci++; el.textContent = w.slice(0, ci);
if (ci === w.length) { deleting = true; setTimeout(tick, holdMs); return; }
setTimeout(tick, typeMs);
} else {
ci--; el.textContent = w.slice(0, ci);
if (ci === 0) { deleting = false; wi = (wi + 1) % words.length; setTimeout(tick, gapMs); return; }
setTimeout(tick, delMs);
}
}
setTimeout(tick, 700);
})();
// Style switch: Signal (default) <-> Editorial, persisted across pages
(function themeSwitch(){
var btn = document.getElementById('themeToggle');
var name = document.getElementById('themeName');
if (!btn || !name) return;
function sync(){ name.textContent = document.documentElement.getAttribute('data-theme') === 'signal' ? 'CosmoGenesis' : 'Editorial'; }
sync();
btn.addEventListener('click', function(){
var isSignal = document.documentElement.getAttribute('data-theme') === 'signal';
if (isSignal) { document.documentElement.removeAttribute('data-theme'); try{localStorage.setItem('deviant-theme','editorial');}catch(e){} }
else { document.documentElement.setAttribute('data-theme','signal'); try{localStorage.setItem('deviant-theme','signal');}catch(e){} }
sync();
});
})();
</script>
</body>
</html>