THE RESONANCE ENGINE
A Functional Tool for Transcultural Axioms
The Lemniscate Descends
Personal Resilience (Resolve)
0
Global Dysregulation (CP)
10
Active Object Hieroglyph:
// NEURO-SOMATIC ANOMALY DETECTED //
// ENGINE INITIATED. AXIOM READY. //
The Resonance Engine
@import url(‘https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap’);
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: ‘Inter’, sans-serif;
background-color: #0d0d10;
color: #e0e0e0;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 1rem;
}
.container {
max-width: 36rem;
width: 100%;
background-color: #1c1c20;
padding: 2rem;
border-radius: 0.75rem;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
border: 1px solid rgba(99, 102, 241, 0.5);
}
header {
text-align: center;
margin-bottom: 2rem;
}
h1 {
font-size: 2.25rem;
font-weight: 800;
color: #818cf8;
}
.subtitle {
font-size: 1.125rem;
color: #9ca3af;
margin-top: 0.25rem;
}
.subtext {
font-size: 0.875rem;
color: #4b5563;
margin-top: 0.5rem;
}
.grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin-bottom: 2rem;
}
.metric {
padding: 0.75rem;
border-radius: 0.5rem;
text-align: center;
}
.metric-resolve {
background-color: rgba(20, 83, 45, 0.4);
border: 1px solid rgba(21, 128, 61, 0.5);
}
.metric-cp {
background-color: rgba(127, 29, 29, 0.4);
border: 1px solid rgba(185, 28, 28, 0.5);
}
.metric-cp.critical {
background-color: rgba(153, 27, 27, 0.6);
border-color: rgba(239, 68, 68, 1);
}
.metric-label {
font-size: 0.875rem;
font-weight: 300;
}
.metric-resolve .metric-label {
color: #86efac;
}
.metric-cp .metric-label {
color: #fca5a5;
}
.metric-value {
font-size: 1.875rem;
font-weight: 700;
margin-top: 0.25rem;
}
.metric-resolve .metric-value {
color: #4ade80;
}
.metric-cp .metric-value {
color: #f87171;
}
.anomaly-section {
text-align: center;
margin-bottom: 2rem;
}
.anomaly-label {
font-size: 0.875rem;
color: #6b7280;
margin-bottom: 0.5rem;
}
.glitch-text {
font-size: 2.5rem;
color: #fbbf24;
min-height: 2.5rem;
text-shadow: 1px 0 0 #ff00ff, -1px 0 0 #00ffff;
animation: glitch-animation 1s infinite step-end;
}
@keyframes glitch-animation {
0% {
text-shadow: 1px 0 0 #ff00ff, -1px 0 0 #00ffff;
transform: translate(0);
}
10% {
text-shadow: 2px 0 0 #ff00ff, -2px 0 0 #00ffff;
transform: translate(-2px);
}
20% {
text-shadow: -1px 0 0 #ff00ff, 1px 0 0 #00ffff;
transform: translate(1px);
}
30% {
text-shadow: 3px 0 0 #ff00ff, -3px 0 0 #00ffff;
transform: translate(-3px);
}
100% {
text-shadow: 1px 0 0 #ff00ff, -1px 0 0 #00ffff;
transform: translate(0);
}
}
#log-display {
height: 4rem;
margin-bottom: 1.5rem;
overflow-y: auto;
padding: 0.5rem;
font-size: 0.875rem;
background-color: #252528;
border-radius: 0.25rem;
border: 1px solid rgba(75, 85, 99, 0.5);
}
.log-system {
color: #9ca3af;
}
.log-success {
color: #4ade80;
}
.log-failure {
color: #f87171;
}
.log-resource {
color: #fbbf24;
}
.button-container {
display: flex;
justify-content: center;
}
button {
width: 100%;
padding: 0.75rem 1.5rem;
background-color: #4f46e5;
color: white;
font-weight: 600;
border-radius: 0.5rem;
border: none;
cursor: pointer;
transition: background-color 0.2s;
box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.5);
}
button:hover:not(:disabled) {
background-color: #4338ca;
}
button:disabled {
background-color: #374151;
box-shadow: none;
cursor: not-allowed;
}
footer {
margin-top: 2rem;
font-size: 0.875rem;
color: #4b5563;
text-align: center;
}
let resolve = 0;
let globalCP = 10;
let rollCounter = 0;
const TARGET_DIFFICULTY = 15;
const resolveCount = document.getElementById(‘resolve-count’);
const cpCount = document.getElementById(‘cp-count’);
const anomalyText = document.getElementById(‘anomaly-text’);
const logDisplay = document.getElementById(‘log-display’);
const actionButton = document.getElementById(‘action-button’);
function updateDisplay() {
resolveCount.textContent = resolve;
cpCount.textContent = globalCP;
const cpDisplay = document.getElementById(‘cp-display’);
if (globalCP >= 25) {
cpDisplay.classList.add(‘critical’);
} else {
cpDisplay.classList.remove(‘critical’);
}
}
function log(message, type) {
const p = document.createElement(‘p’);
p.textContent = ‘[T=’ + rollCounter + ‘] ‘ + message;
p.className = ‘log-‘ + type;
logDisplay.prepend(p);
while (logDisplay.children.length > 50) {
logDisplay.removeChild(logDisplay.lastChild);
}
}
function attemptSomaticDischarge() {
rollCounter++;
actionButton.disabled = true;
const roll = Math.floor(Math.random() * 20) + 1;
const success = roll >= TARGET_DIFFICULTY;
const failureMargin = TARGET_DIFFICULTY – roll;
let resultMessage = ‘// D20 ROLL: ‘ + roll + ‘. Target: ‘ + TARGET_DIFFICULTY + ‘. // ‘;
if (success) {
log(resultMessage + ‘DISCHARGE STABLE. Anomaly temporarily contained.’, ‘success’);
anomalyText.textContent = ‘// ANOMALY STABILIZED (‘ + roll + ‘). Global Dysregulation reduced. //’;
globalCP = Math.max(0, globalCP – 2);
log(‘[SYSTEM] Global Dysregulation reduced by 2.’, ‘system’);
} else {
globalCP += 5;
log(resultMessage + ‘DISCHARGE FAILED. Anomaly intensified.’, ‘failure’);
anomalyText.textContent = ‘// ANOMALY INTENSIFIED (‘ + roll + ‘). The wound persists. //’;
if (failureMargin >= 5) {
resolve += 1;
log(‘[RESOURCE] Failure Margin ‘ + failureMargin + ‘. +1 RESOLVE GAINED. The only way out is through.’, ‘resource’);
} else {
log(‘[SYSTEM] Global Dysregulation increased by 5.’, ‘system’);
}
}
if (globalCP >= 40) {
log(‘!!! CATASTROPHIC DYSREGULATION. THE LEMNISCATE DESCENDS. !!!’, ‘failure’);
anomalyText.textContent = ‘// CRITICAL FAILURE. THE LEMNISCATE DESCENDS. SYSTEM OVERLOAD. //’;
actionButton.textContent = ‘SYSTEM OVERLOAD (RESTART REQUIRED)’;
actionButton.disabled = true;
actionButton.onclick = function() {
window.location.reload();
};
} else {
setTimeout(function() {
actionButton.disabled = false;
}, 1000);
}
updateDisplay();
}
actionButton.addEventListener(‘click’, attemptSomaticDischarge);
updateDisplay();
ORGA SPIRAL PODCASTS 