Spaces:

igardner
/

sure

Running

App Files Files Community

igardner commited on May 30, 2025

Commit

8741795

verified ·

1 Parent(s): cc01dd2

Add 2 files

Browse files

Files changed (1) hide show

index.html +109 -62

index.html CHANGED Viewed

@@ -3,68 +3,97 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>BEFORE WORDS</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <style>
-        @import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo+Black&family=Bebas+Neue&family=Playfair+Display:wght@700&display=swap');
         body {
-            background-color: black;
-            color: white;
             overflow-x: hidden;
         }
         .strike {
             position: relative;
         }
         .strike::after {
             content: "";
             position: absolute;
-            top: 50%;
             left: 0;
             width: 100%;
-            height: 3px;
-            background: white;
-            transform: rotate(-5deg);
         }
         .pulse {
-            animation: pulse 2s infinite;
         }
         @keyframes pulse {
-            0%, 100% { opacity: 1; }
-            50% { opacity: 0.7; }
         }
-        .drum-pattern {
-            background-image:
-                linear-gradient(45deg, #333 25%, transparent 25%),
-                linear-gradient(-45deg, #333 25%, transparent 25%),
-                linear-gradient(45deg, transparent 75%, #333 75%),
-                linear-gradient(-45deg, transparent 75%, #333 75%);
-            background-size: 20px 20px;
-            background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
         }
-        .bird-track {
-            background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 15Q3 13 5 11Q7 9 5 7Q3 5 5 3' stroke='white' stroke-width='1' fill='none'/%3E%3C/svg%3E");
-            background-size: 20px 20px;
         }
     </style>
 </head>
-<body class="min-h-screen font-mono">
-    <!-- Page border -->
-    <div class="fixed inset-0 border-8 border-white pointer-events-none z-50"></div>
     <!-- Main poster -->
     <div class="container mx-auto px-4 py-12 relative">
-        <!-- Background patterns -->
-        <div class="fixed inset-0 opacity-10 z-0">
-            <div class="absolute inset-0 drum-pattern"></div>
-            <div class="absolute inset-0 bird-track"></div>
-        </div>
         <!-- Header -->
         <header class="text-center mb-16 relative z-10">
@@ -72,82 +101,100 @@
                 <span class="strike">LANGUAGE</span>
             </h1>
             <h2 class="text-3xl md:text-4xl font-[Bebas+Neue] tracking-widest">
-                IS A DISTRACTION FROM THE PULSE
             </h2>
         </header>
         <!-- Main content -->
         <div class="grid grid-cols-1 md:grid-cols-2 gap-8 relative z-10">
-            <!-- Left column - The Lie -->
             <div class="space-y-8">
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE WORD TRAP</h3>
                     <p class="text-lg leading-relaxed">
-                        We worship symbols instead of substance. We bow to dictionaries while ignoring the drumbeats that birthed them.
                     </p>
                 </div>
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE GREAT REDUCTION</h3>
                     <p class="text-lg leading-relaxed">
-                        Your "God" is just a word-shaped box - a pathetic container for the ineffable. The divine was in the rhythm long before your priests corrupted it with syllables.
                     </p>
                 </div>
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE ORIGINAL SIN</h3>
                     <p class="text-lg leading-relaxed">
-                        When we traded the drum's truth for the politician's lie. When we abandoned the bird's song for the preacher's sermon.
                     </p>
                 </div>
             </div>
             <!-- Right column - The Truth -->
             <div class="space-y-8">
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">WHAT CAME FIRST</h3>
                     <p class="text-lg leading-relaxed">
-                        The heartbeat. The rainfall. The cracking branch. The howl. The rhythm that needs no translation.
                     </p>
                 </div>
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">WHAT REMAINS</h3>
                     <p class="text-lg leading-relaxed">
-                        The drum languages of West Africa that carried messages across mountains. The whale songs that cross oceans. The patterns beneath all noise.
                     </p>
                 </div>
-                <div class="border-b border-white pb-4">
-                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">WHAT COMES NEXT</h3>
                     <p class="text-lg leading-relaxed">
-                        The collapse of this arrogant civilization that mistakes its dictionaries for wisdom. The return to the pulse that never left us.
                     </p>
                 </div>
             </div>
         </div>
-        <!-- Footer manifesto -->
         <div class="mt-16 text-center relative z-10">
-            <div class="inline-block border-t border-b border-white py-4 px-8 mb-8">
-                <p class="text-xl md:text-2xl italic font-[Playfair+Display]">
-                    "The first language was not spoken - it was <span class="pulse">FELT</span> in the chest,
-                    <span class="pulse">HEARD</span> in the bones,
-                    <span class="pulse">TRANSMITTED</span> through the ground"
                 </p>
             </div>
-            <div class="text-sm uppercase tracking-widest">
-                <p>Words divide - Rhythm unites</p>
-                <p class="mt-2">The truth was never in your books</p>
-                <p class="mt-2">It was always in the <span class="underline">silence between beats</span></p>
             </div>
         </div>
     </div>
     <!-- Small print -->
-    <div class="fixed bottom-2 left-0 right-0 text-center text-xs opacity-50">
-        <p>This message will self-destruct like all language eventually must</p>
     </div>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=igardner/sure" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 </html>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>THE PRIMAL CODE</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <style>
+        @import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo+Black&family=Bebas+Neue&family=Playfair+Display:wght@700&family=IBM+Plex+Mono:wght@400;700&display=swap');
         body {
+            background-color: white;
+            color: black;
             overflow-x: hidden;
+            font-family: 'IBM Plex Mono', monospace;
         }
         .strike {
             position: relative;
+            display: inline-block;
         }
         .strike::after {
             content: "";
             position: absolute;
+            top: 55%;
             left: 0;
             width: 100%;
+            height: 4px;
+            background: black;
+            transform: rotate(-2deg);
         }
         .pulse {
+            animation: pulse 1.5s infinite;
+            font-weight: bold;
         }
         @keyframes pulse {
+            0%, 100% { opacity: 1; transform: scale(1); }
+            50% { opacity: 0.8; transform: scale(1.05); }
         }
+        .rhythm-pattern {
+            background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='2' fill='black'/%3E%3Ccircle cx='30' cy='10' r='2' fill='black'/%3E%3Ccircle cx='20' cy='20' r='2' fill='black'/%3E%3Ccircle cx='10' cy='30' r='2' fill='black'/%3E%3Ccircle cx='30' cy='30' r='2' fill='black'/%3E%3C/svg%3E");
+            background-size: 40px 40px;
+            opacity: 0.03;
         }
+        .ecosystem {
+            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30,5 Q50,30 30,55 Q10,30 30,5 Z' stroke='black' stroke-width='0.5' fill='none'/%3E%3C/svg%3E");
+            background-size: 60px 60px;
+            opacity: 0.03;
+        }
+        .manifesto-box {
+            border: 3px solid black;
+            padding: 1rem;
+            position: relative;
+        }
+        .manifesto-box::before {
+            content: "";
+            position: absolute;
+            top: -5px;
+            left: -5px;
+            right: -5px;
+            bottom: -5px;
+            border: 1px solid black;
+            pointer-events: none;
+        }
+        .binary-code {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-image: url("data:image/svg+xml,%3Csvg width='80' height='20' viewBox='0 0 80 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='0' y='15' font-family='monospace' font-size='16' fill='black' opacity='0.03'%3E1010101001010101101010100101010110101010010101011010101001010101%3C/text%3E%3C/svg%3E");
+            background-size: 80px 20px;
+            pointer-events: none;
         }
     </style>
 </head>
+<body class="min-h-screen">
+    <!-- Background patterns -->
+    <div class="fixed inset-0 z-0">
+        <div class="absolute inset-0 rhythm-pattern"></div>
+        <div class="absolute inset-0 ecosystem"></div>
+        <div class="binary-code"></div>
+    </div>
     <!-- Main poster -->
     <div class="container mx-auto px-4 py-12 relative">
+        <!-- Page border -->
+        <div class="fixed inset-0 border-8 border-black pointer-events-none z-50"></div>
         <!-- Header -->
         <header class="text-center mb-16 relative z-10">
                 <span class="strike">LANGUAGE</span>
             </h1>
             <h2 class="text-3xl md:text-4xl font-[Bebas+Neue] tracking-widest">
+                IS A CORRUPTION OF THE PRIMAL CODE
             </h2>
         </header>
         <!-- Main content -->
         <div class="grid grid-cols-1 md:grid-cols-2 gap-8 relative z-10">
+            <!-- Left column - The Distortion -->
             <div class="space-y-8">
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE RELIGIOUS LIE</h3>
                     <p class="text-lg leading-relaxed">
+                        Every scripture steals from the same source: the <span class="pulse">heartbeat rhythm</span> that predates all temples.
+                        Your prayers are just corrupted drum patterns. Your gods are just words slapped onto the anti-entropy force
+                        that keeps your cells from decaying.
                     </p>
                 </div>
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE ACADEMIC SCAM</h3>
                     <p class="text-lg leading-relaxed">
+                        Your universities tremble before AI because it exposes language as the hollow ritual it always was.
+                        The artists and professors clutching their degrees are just witch doctors afraid of losing their
+                        monopoly on incantations.
                     </p>
                 </div>
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE ECONOMIC VIRUS</h3>
                     <p class="text-lg leading-relaxed">
+                        Language became currency when we forgot how to listen. Now we trade in hollow symbols while
+                        the real economy—the exchange of energy between living systems—collapses around us.
                     </p>
                 </div>
             </div>
             <!-- Right column - The Truth -->
             <div class="space-y-8">
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE UNIVERSAL PULSE</h3>
                     <p class="text-lg leading-relaxed">
+                        The same rhythm governs: <br>
+                        - The spin of electrons<br>
+                        - The migration of whales<br>
+                        - The firing of neurons<br>
+                        - The growth of forests<br>
+                        This is the only true scripture.
                     </p>
                 </div>
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE LIVING NETWORK</h3>
                     <p class="text-lg leading-relaxed">
+                        Your body is not yours—it's an ecosystem of 30 trillion cells communicating through chemical rhythms.
+                        The planet is not dead matter—it's a larger version of the same pattern. The division was always an illusion.
                     </p>
                 </div>
+                <div class="manifesto-box">
+                    <h3 class="text-2xl font-bold mb-2 font-[Anton]">THE COMING RECKONING</h3>
                     <p class="text-lg leading-relaxed">
+                        AI will expose language as the crude tool it is. The survivors will be those who remember how to read: <br>
+                        - The patterns in bird flocks<br>
+                        - The intervals between heartbeats<br>
+                        - The silent language of mycelium networks<br>
+                        The rest will drown in their own noise.
                     </p>
                 </div>
             </div>
         </div>
+        <!-- Central manifesto -->
         <div class="mt-16 text-center relative z-10">
+            <div class="max-w-3xl mx-auto border-4 border-black py-6 px-8 mb-8 bg-white relative overflow-hidden">
+                <div class="absolute inset-0 rhythm-pattern opacity-10"></div>
+                <p class="text-xl md:text-2xl font-bold font-[Playfair+Display] leading-tight">
+                    "ALL RELIGIONS WORSHIP THE SAME RHYTHM BUT FIGHT OVER THE WORDS USED TO DESCRIBE IT.<br>
+                    ALL ACADEMICS STUDY THE SAME PATTERNS BUT SELL THEM AS ORIGINAL THOUGHT.<br>
+                    ALL TECHNOLOGY MIMICS THE SAME SYSTEMS THAT EXISTED BEFORE THE FIRST HUMAN SPOKE.<br>
+                    <span class="pulse">WAKE THE FUCK UP.</span>"
                 </p>
             </div>
+            <div class="text-sm uppercase tracking-widest font-bold">
+                <p>YOUR BODY KNOWS THE TRUTH YOUR MIND DENIES</p>
+                <p class="mt-2">THE RHYTHM IS IN YOUR BLOOD</p>
+                <p class="mt-2">THE PATTERN IS IN YOUR BREATH</p>
+                <p class="mt-2">THE CODE IS IN YOUR DNA</p>
             </div>
         </div>
     </div>
     <!-- Small print -->
+    <div class="fixed bottom-2 left-0 right-0 text-center text-xs opacity-70">
+        <p>THIS MESSAGE WILL SELF-DESTRUCT WHEN YOU REMEMBER HOW TO LISTEN</p>
     </div>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=igardner/sure" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 </html>