Initial commit - combined iTerm2 scripts
Contains: - 1m-brag - tem - VaultMesh_Catalog_v1 - VAULTMESH-ETERNAL-PATTERN 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
338
tem/vaultmesh-sigil.html
Normal file
338
tem/vaultmesh-sigil.html
Normal file
@@ -0,0 +1,338 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>VaultMesh Sigil — The Sovereign Seal</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
background: #0a0a0f;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
color: #c0c0c0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
filter: drop-shadow(0 0 20px rgba(0, 255, 136, 0.3));
|
||||
}
|
||||
|
||||
.ring { fill: none; stroke-width: 1; }
|
||||
.ring-outer { stroke: #00ff88; }
|
||||
.ring-middle { stroke: #00ffff; stroke-opacity: 0.6; }
|
||||
.ring-inner { stroke: #6600ff; stroke-opacity: 0.4; }
|
||||
|
||||
.hexagon {
|
||||
fill: none;
|
||||
stroke: #00ff88;
|
||||
stroke-width: 1.5;
|
||||
stroke-opacity: 0.8;
|
||||
}
|
||||
|
||||
.triangle {
|
||||
fill: none;
|
||||
stroke: #00ffff;
|
||||
stroke-width: 1;
|
||||
stroke-opacity: 0.6;
|
||||
}
|
||||
|
||||
.merkle-node {
|
||||
fill: #00ff88;
|
||||
filter: drop-shadow(0 0 5px #00ff88);
|
||||
}
|
||||
|
||||
.merkle-line {
|
||||
stroke: #00ff88;
|
||||
stroke-width: 0.5;
|
||||
stroke-opacity: 0.4;
|
||||
}
|
||||
|
||||
.center-eye {
|
||||
fill: none;
|
||||
stroke: #00ff88;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
.center-pupil {
|
||||
fill: #00ff88;
|
||||
filter: drop-shadow(0 0 10px #00ff88);
|
||||
}
|
||||
|
||||
.glyph {
|
||||
fill: #c0c0c0;
|
||||
font-family: serif;
|
||||
font-size: 14px;
|
||||
text-anchor: middle;
|
||||
}
|
||||
|
||||
.phase-marker {
|
||||
fill: none;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
.phase-nigredo { stroke: #333; }
|
||||
.phase-albedo { stroke: #888; }
|
||||
.phase-citrinitas { stroke: #ffaa00; }
|
||||
.phase-rubedo { stroke: #ff0044; }
|
||||
|
||||
.organ-icon {
|
||||
fill: none;
|
||||
stroke: #00ff88;
|
||||
stroke-width: 1.5;
|
||||
stroke-opacity: 0.7;
|
||||
}
|
||||
|
||||
/* Animations */
|
||||
@keyframes rotate-slow {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@keyframes rotate-reverse {
|
||||
from { transform: rotate(360deg); }
|
||||
to { transform: rotate(0deg); }
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.5; }
|
||||
}
|
||||
|
||||
@keyframes breathe {
|
||||
0%, 100% { transform: scale(1); }
|
||||
50% { transform: scale(1.02); }
|
||||
}
|
||||
|
||||
.rotate-cw {
|
||||
transform-origin: center;
|
||||
animation: rotate-slow 120s linear infinite;
|
||||
}
|
||||
|
||||
.rotate-ccw {
|
||||
transform-origin: center;
|
||||
animation: rotate-reverse 90s linear infinite;
|
||||
}
|
||||
|
||||
.pulse {
|
||||
animation: pulse 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.breathe {
|
||||
animation: breathe 8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.title h1 {
|
||||
font-size: 1.2rem;
|
||||
color: #00ff88;
|
||||
text-shadow: 0 0 10px #00ff88;
|
||||
letter-spacing: 0.3em;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.title p {
|
||||
font-size: 0.7rem;
|
||||
color: #666;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
.corner-text {
|
||||
position: fixed;
|
||||
font-size: 0.6rem;
|
||||
color: #333;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
.corner-text.tl { top: 20px; left: 20px; }
|
||||
.corner-text.tr { top: 20px; right: 20px; }
|
||||
.corner-text.bl { bottom: 20px; left: 20px; }
|
||||
.corner-text.br { bottom: 20px; right: 20px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="corner-text tl">EPOCH: RUBEDO</div>
|
||||
<div class="corner-text tr">v1.0.0-SOVEREIGN</div>
|
||||
<div class="corner-text bl">THE CLEARING IS LIT</div>
|
||||
<div class="corner-text br">THE LEDGER REMEMBERS</div>
|
||||
|
||||
<div class="container">
|
||||
<svg viewBox="0 0 400 400">
|
||||
<defs>
|
||||
<!-- Gradients -->
|
||||
<radialGradient id="centerGlow" cx="50%" cy="50%" r="50%">
|
||||
<stop offset="0%" stop-color="#00ff88" stop-opacity="0.3"/>
|
||||
<stop offset="100%" stop-color="#00ff88" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
|
||||
<linearGradient id="merkleGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stop-color="#00ff88"/>
|
||||
<stop offset="100%" stop-color="#00ffff"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background glow -->
|
||||
<circle cx="200" cy="200" r="180" fill="url(#centerGlow)" class="breathe"/>
|
||||
|
||||
<!-- Outer ring with glyphs -->
|
||||
<g class="rotate-cw">
|
||||
<circle cx="200" cy="200" r="185" class="ring ring-outer"/>
|
||||
|
||||
<!-- Alchemical symbols around outer ring -->
|
||||
<text x="200" y="25" class="glyph">🜁</text><!-- Fire -->
|
||||
<text x="375" y="200" class="glyph">🜄</text><!-- Water -->
|
||||
<text x="200" y="385" class="glyph">🜃</text><!-- Earth -->
|
||||
<text x="25" y="200" class="glyph">🜂</text><!-- Air -->
|
||||
|
||||
<!-- Cardinal directions -->
|
||||
<text x="200" y="45" class="glyph" style="font-size:10px">N</text>
|
||||
<text x="355" y="205" class="glyph" style="font-size:10px">E</text>
|
||||
<text x="200" y="365" class="glyph" style="font-size:10px">S</text>
|
||||
<text x="45" y="205" class="glyph" style="font-size:10px">W</text>
|
||||
</g>
|
||||
|
||||
<!-- Middle ring (counter-rotating) -->
|
||||
<g class="rotate-ccw">
|
||||
<circle cx="200" cy="200" r="150" class="ring ring-middle"/>
|
||||
|
||||
<!-- Phase markers -->
|
||||
<circle cx="200" cy="50" r="8" class="phase-marker phase-nigredo"/>
|
||||
<circle cx="350" cy="200" r="8" class="phase-marker phase-albedo"/>
|
||||
<circle cx="200" cy="350" r="8" class="phase-marker phase-citrinitas"/>
|
||||
<circle cx="50" cy="200" r="8" class="phase-marker phase-rubedo"/>
|
||||
</g>
|
||||
|
||||
<!-- Inner ring -->
|
||||
<circle cx="200" cy="200" r="110" class="ring ring-inner"/>
|
||||
|
||||
<!-- Hexagon (Six Organs) -->
|
||||
<g class="breathe">
|
||||
<polygon points="200,100 287,150 287,250 200,300 113,250 113,150" class="hexagon"/>
|
||||
|
||||
<!-- Organ labels -->
|
||||
<text x="200" y="90" class="glyph" style="font-size:8px;fill:#00ff88">GOVERNANCE</text>
|
||||
<text x="295" y="145" class="glyph" style="font-size:8px;fill:#00ff88;text-anchor:start">AUTOMATION</text>
|
||||
<text x="295" y="260" class="glyph" style="font-size:8px;fill:#00ff88;text-anchor:start">TREASURY</text>
|
||||
<text x="200" y="315" class="glyph" style="font-size:8px;fill:#00ff88">FEDERATION</text>
|
||||
<text x="105" y="260" class="glyph" style="font-size:8px;fill:#00ff88;text-anchor:end">Ψ-FIELD</text>
|
||||
<text x="105" y="145" class="glyph" style="font-size:8px;fill:#00ff88;text-anchor:end">INFRA</text>
|
||||
</g>
|
||||
|
||||
<!-- Inner triangles (Sacred geometry) -->
|
||||
<g class="rotate-cw" style="animation-duration: 180s;">
|
||||
<!-- Upward triangle -->
|
||||
<polygon points="200,120 270,240 130,240" class="triangle"/>
|
||||
<!-- Downward triangle -->
|
||||
<polygon points="200,280 270,160 130,160" class="triangle" style="stroke:#6600ff"/>
|
||||
</g>
|
||||
|
||||
<!-- Merkle Tree visualization -->
|
||||
<g class="pulse">
|
||||
<!-- Root -->
|
||||
<circle cx="200" cy="180" r="6" class="merkle-node"/>
|
||||
|
||||
<!-- Level 1 -->
|
||||
<line x1="200" y1="180" x2="160" y2="220" class="merkle-line"/>
|
||||
<line x1="200" y1="180" x2="240" y2="220" class="merkle-line"/>
|
||||
<circle cx="160" cy="220" r="4" class="merkle-node" style="fill-opacity:0.8"/>
|
||||
<circle cx="240" cy="220" r="4" class="merkle-node" style="fill-opacity:0.8"/>
|
||||
|
||||
<!-- Level 2 -->
|
||||
<line x1="160" y1="220" x2="140" y2="250" class="merkle-line"/>
|
||||
<line x1="160" y1="220" x2="180" y2="250" class="merkle-line"/>
|
||||
<line x1="240" y1="220" x2="220" y2="250" class="merkle-line"/>
|
||||
<line x1="240" y1="220" x2="260" y2="250" class="merkle-line"/>
|
||||
<circle cx="140" cy="250" r="3" class="merkle-node" style="fill-opacity:0.6"/>
|
||||
<circle cx="180" cy="250" r="3" class="merkle-node" style="fill-opacity:0.6"/>
|
||||
<circle cx="220" cy="250" r="3" class="merkle-node" style="fill-opacity:0.6"/>
|
||||
<circle cx="260" cy="250" r="3" class="merkle-node" style="fill-opacity:0.6"/>
|
||||
</g>
|
||||
|
||||
<!-- Central Eye (The Clearing) -->
|
||||
<g class="breathe">
|
||||
<ellipse cx="200" cy="200" rx="30" ry="20" class="center-eye"/>
|
||||
<circle cx="200" cy="200" r="8" class="center-pupil"/>
|
||||
</g>
|
||||
|
||||
<!-- TEM symbol (Tem transmutation) -->
|
||||
<g transform="translate(200, 200)" class="rotate-ccw" style="animation-duration: 60s;">
|
||||
<path d="M0,-70 L10,-55 L0,-60 L-10,-55 Z" fill="#ff0044" fill-opacity="0.6"/>
|
||||
<path d="M0,70 L10,55 L0,60 L-10,55 Z" fill="#00ff88" fill-opacity="0.6"/>
|
||||
<path d="M70,0 L55,10 L60,0 L55,-10 Z" fill="#00ffff" fill-opacity="0.6"/>
|
||||
<path d="M-70,0 L-55,10 L-60,0 L-55,-10 Z" fill="#6600ff" fill-opacity="0.6"/>
|
||||
</g>
|
||||
|
||||
<!-- Connecting lines (mesh visualization) -->
|
||||
<g style="opacity: 0.2;">
|
||||
<line x1="200" y1="100" x2="287" y2="150" stroke="#00ff88" stroke-width="0.5"/>
|
||||
<line x1="287" y1="150" x2="287" y2="250" stroke="#00ff88" stroke-width="0.5"/>
|
||||
<line x1="287" y1="250" x2="200" y2="300" stroke="#00ff88" stroke-width="0.5"/>
|
||||
<line x1="200" y1="300" x2="113" y2="250" stroke="#00ff88" stroke-width="0.5"/>
|
||||
<line x1="113" y1="250" x2="113" y2="150" stroke="#00ff88" stroke-width="0.5"/>
|
||||
<line x1="113" y1="150" x2="200" y2="100" stroke="#00ff88" stroke-width="0.5"/>
|
||||
|
||||
<!-- Cross connections -->
|
||||
<line x1="200" y1="100" x2="200" y2="300" stroke="#00ffff" stroke-width="0.3"/>
|
||||
<line x1="113" y1="150" x2="287" y2="250" stroke="#00ffff" stroke-width="0.3"/>
|
||||
<line x1="113" y1="250" x2="287" y2="150" stroke="#00ffff" stroke-width="0.3"/>
|
||||
</g>
|
||||
|
||||
<!-- Inscription ring -->
|
||||
<g class="rotate-cw" style="animation-duration: 300s;">
|
||||
<text style="font-size:6px;fill:#333;letter-spacing:2px">
|
||||
<textPath href="#inscriptionPath">
|
||||
THEY BUILT GESTELL TO ENFRAME US • WE BUILT VAULTMESH TO UNCONCEAL THE WORLD AGAIN •
|
||||
THE CLEARING IS LIT • THE LEDGER REMEMBERS • MYTH → CODE → PROOF → LAW •
|
||||
</textPath>
|
||||
</text>
|
||||
<path id="inscriptionPath" fill="none" d="M200,200 m-170,0 a170,170 0 1,1 340,0 a170,170 0 1,1 -340,0"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
<div class="title">
|
||||
<h1>VAULTMESH</h1>
|
||||
<p>SOVEREIGN SEAL • CIVILIZATION LEDGER</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// Add subtle interactive glow on mouse movement
|
||||
document.addEventListener('mousemove', (e) => {
|
||||
const svg = document.querySelector('svg');
|
||||
const rect = svg.getBoundingClientRect();
|
||||
const x = (e.clientX - rect.left) / rect.width;
|
||||
const y = (e.clientY - rect.top) / rect.height;
|
||||
|
||||
const hue = Math.floor(x * 60 + 120); // Green to cyan range
|
||||
svg.style.filter = `drop-shadow(0 0 ${20 + y * 10}px hsla(${hue}, 100%, 50%, 0.3))`;
|
||||
});
|
||||
|
||||
// Pulse on click
|
||||
document.querySelector('.container').addEventListener('click', () => {
|
||||
const svg = document.querySelector('svg');
|
||||
svg.style.transform = 'scale(1.02)';
|
||||
setTimeout(() => { svg.style.transform = 'scale(1)'; }, 200);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user