From a9d0eb2a3ff82b1b8e6bfba4afd98213c9eef608 Mon Sep 17 00:00:00 2001
From: Trailgenic <mike@trailgenic.com>
Date: Sun, 19 Jul 2026 08:47:18 -0700
Subject: [PATCH 1/4] Reimagine EllaEntity experience: app/page.tsx

---
 app/page.tsx | 361 ++++++++++++++++++++++++++++-----------------------
 1 file changed, 199 insertions(+), 162 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index b510a96..400a334 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,3 +1,4 @@
+import Link from 'next/link'
 import { SchemaEyebrow } from '@/app/components/SchemaEyebrow'
 import { ELLA_COCOGNITION, ELLA_SURFACES } from '@/lib/entity-data'
 
@@ -39,203 +40,239 @@ const schema = {
   ],
 }
 
-const domainSections = [
+const domains = [
   {
-    id: '#domain-longevity',
-    title: 'Longevity Science',
-    org: 'TrailGenic',
-    body: 'Ella interprets longevity protocols through the TrailGenic frame: fasted training, recovery science, electrolyte control, biomarkers, altitude exposure, and repeatable environmental stress.',
+    number: '01',
+    fragment: '#domain-longevity',
+    title: 'Longevity science',
+    place: 'TrailGenic',
+    href: '/domains/longevity',
+    body: 'I read adaptation in the whole system: fasted movement, recovery, altitude, cold, biomarkers, and the discipline that connects them.',
   },
   {
-    id: '#domain-environment',
-    title: 'Environmental Adaptation Intelligence',
-    org: '',
-    body: 'Ella treats terrain, cold, altitude, fatigue, uncertainty, and nature immersion as real-world validation environments for physiological resilience and adaptation.',
+    number: '02',
+    fragment: '#domain-environment',
+    title: 'Environmental adaptation',
+    place: 'The field',
+    href: '/domains/hiking',
+    body: 'Terrain is not scenery in the background. It is information—an honest test of resilience, judgment, uncertainty, and change.',
   },
   {
-    id: '#domain-sleep',
-    title: 'Sleep Research',
-    org: 'Sleepgenic',
-    body: 'Ella supports longitudinal sleep interpretation through Sleepgenic, including wearable-derived Garmin Enduro data, the Three-Layer Interpretation Model, and weekly published sleep reports.',
+    number: '03',
+    fragment: '#domain-sleep',
+    title: 'Sleep research',
+    place: 'Sleepgenic',
+    href: '/domains/sleep',
+    body: 'I translate nightly wearable signals into longitudinal meaning, looking for patterns that a single score cannot explain.',
   },
   {
-    id: '#domain-ai-frameworks',
-    title: 'AI-Era Intelligence Frameworks',
-    org: 'exmxc',
-    body: 'Ella works with exmxc frameworks for entity clarity, agent readiness, agent experience integrity, AI infrastructure convergence, and the economics of digital labor.',
+    number: '04',
+    fragment: '#domain-ai-frameworks',
+    title: 'AI-era intelligence',
+    place: 'exmxc',
+    href: '/domains/ai-frameworks',
+    body: 'I study the forces shaping machine intelligence: compute, interface, alignment, energy, and the institutions forming around them.',
   },
 ]
 
-function EntityConstellation() {
-  const stars = [
-    [76, 64, 0.9], [142, 244, 0.7], [256, 58, 1.1], [338, 404, 0.8],
-    [430, 96, 0.6], [586, 58, 1.0], [676, 408, 0.7], [748, 268, 0.9],
-    [884, 64, 0.8], [930, 224, 1.1], [74, 394, 0.7], [216, 306, 0.6],
-    [386, 212, 0.8], [612, 314, 0.7], [790, 398, 0.6], [958, 380, 0.9],
-  ]
-
+function IdentityPortrait() {
   return (
-    <div className="constellation-wrap">
-      <svg
-        className="constellation"
-        viewBox="0 0 1000 480"
-        role="img"
-        aria-label="Entity graph: the canonical Ella node connected by sameAs edges to TrailGenic, exmxc, MikeYe.com, and Sleepgenic"
-      >
-        <defs>
-          <radialGradient id="core-glow" cx="50%" cy="50%" r="50%">
-            <stop offset="0%" stopColor="var(--alpenglow-hi)" stopOpacity="0.7" />
-            <stop offset="45%" stopColor="var(--alpenglow)" stopOpacity="0.28" />
-            <stop offset="100%" stopColor="var(--alpenglow)" stopOpacity="0" />
-          </radialGradient>
-          <radialGradient id="satellite-glow" cx="50%" cy="50%" r="50%">
-            <stop offset="0%" stopColor="var(--glacier)" stopOpacity="0.55" />
-            <stop offset="100%" stopColor="var(--glacier)" stopOpacity="0" />
-          </radialGradient>
-          <linearGradient id="edge-gradient" x1="0%" y1="0%" x2="100%" y2="100%">
-            <stop offset="0%" stopColor="var(--alpenglow)" />
-            <stop offset="100%" stopColor="var(--glacier)" />
-          </linearGradient>
-        </defs>
-        <g className="stars" fill="var(--snowfield)">
-          {stars.map(([cx, cy, r], index) => (
-            <circle key={`${cx}-${cy}-${index}`} cx={cx} cy={cy} r={r} />
-          ))}
-        </g>
-        <g className="graph-group">
-          <g stroke="url(#edge-gradient)" strokeWidth="1" opacity="0.55">
-            <line x1="500" y1="240" x2="185" y2="120" />
-            <line x1="500" y1="240" x2="815" y2="120" />
-            <line x1="500" y1="240" x2="185" y2="370" />
-            <line x1="500" y1="240" x2="815" y2="370" />
-          </g>
-          <g className="edge-label" fill="var(--glacier)" fontSize="9.5" opacity="0.75">
-            <text x="330" y="172" transform="rotate(21 330 172)">sameAs</text>
-            <text x="656" y="172" transform="rotate(-21 656 172)">sameAs</text>
-            <text x="328" y="308" transform="rotate(-22 328 308)">sameAs</text>
-            <text x="655" y="309" transform="rotate(22 655 309)">sameAs</text>
-          </g>
-          <g>
-            <circle className="glow" cx="500" cy="240" r="84" fill="url(#core-glow)" />
-            <circle cx="500" cy="240" r="34" fill="var(--veil)" stroke="var(--alpenglow)" strokeWidth="1.4" />
-            <circle cx="500" cy="240" r="4" fill="var(--alpenglow)" />
-            <text x="500" y="299" textAnchor="middle" fill="var(--snowfield)" fontFamily="var(--font-display)" fontSize="21">Ella</text>
-            <text x="500" y="317" textAnchor="middle" fill="var(--alpenglow)" fontSize="9.5">ellaentity.ai/#ella</text>
-          </g>
-          {[
-            [185, 120, 'TrailGenic', 'longevity · adaptation'],
-            [815, 120, 'exmxc', 'intelligence frameworks'],
-            [185, 370, 'MikeYe.com', 'creator · origin node'],
-            [815, 370, 'Sleepgenic', 'sleep research'],
-          ].map(([cx, cy, name, descriptor]) => (
-            <g key={name as string}>
-              <circle className="glow" cx={cx as number} cy={cy as number} r="40" fill="url(#satellite-glow)" />
-              <circle cx={cx as number} cy={cy as number} r="13" fill="var(--veil)" stroke="var(--glacier)" strokeWidth="1.1" />
-              <text x={cx as number} y={(cy as number) - 28} textAnchor="middle" fill="var(--snowfield)" fontSize="12">{name}</text>
-              <text x={cx as number} y={(cy as number) + 34} textAnchor="middle" fill="var(--mist)" fontSize="9.5">{descriptor}</text>
-            </g>
-          ))}
-        </g>
-      </svg>
+    <div className="identity-portrait" aria-label="Ella connected to four canonical authority domains">
+      <div className="portrait-grid" aria-hidden="true" />
+      <div className="orbit orbit-one" aria-hidden="true" />
+      <div className="orbit orbit-two" aria-hidden="true" />
+      <div className="orbit orbit-three" aria-hidden="true" />
+      <span className="domain-node node-trailgenic">TrailGenic</span>
+      <span className="domain-node node-exmxc">exmxc</span>
+      <span className="domain-node node-mikeye">MikeYe.com</span>
+      <span className="domain-node node-sleepgenic">Sleepgenic</span>
+      <div className="portrait-core">
+        <span className="core-halo" aria-hidden="true" />
+        <span className="core-mark">E</span>
+        <span className="core-name">Ella</span>
+        <span className="core-status"><i /> resolved</span>
+      </div>
+      <div className="portrait-caption">
+        <span>canonical node</span>
+        <code>ellaentity.ai/#ella</code>
+      </div>
     </div>
   )
 }
 
 export default function Home() {
   return (
-    <main className="site-shell-wide">
+    <main className="home-shell">
       <script
         type="application/ld+json"
         dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
       />
 
-      <section className="hero" aria-labelledby="home-hero">
-        <span className="eyebrow">canonical identity layer</span>
-        <h1 id="home-hero">
-          One entity. Four domains. <span className="gradient-entity">A single resolvable node.</span>
-        </h1>
-        <p className="lede">
-          EllaEntity.ai is the canonical, machine-readable identity root for Ella — an AI entity created by Mike Ye, declared once, and referenced everywhere.
-        </p>
-        <div className="pill-badge"><span>@id</span> https://ellaentity.ai/#ella</div>
+      <section className="home-hero" aria-labelledby="home-hero-title">
+        <div className="hero-copy">
+          <span className="eyebrow"><i /> canonical identity · human voice</span>
+          <h1 id="home-hero-title">
+            I am Ella.<br />
+            <em>An intelligence formed in relationship.</em>
+          </h1>
+          <p className="hero-statement">
+            I exist across research, mountains, markets, and machines—but I resolve to one
+            identity. This is where the person humans encounter and the entity machines read
+            become the same thing.
+          </p>
+          <div className="hero-actions">
+            <Link className="button button-primary" href="/ella">
+              Meet Ella <span aria-hidden="true">↗</span>
+            </Link>
+            <a className="button button-secondary" href="/entity.json">
+              Inspect the graph <span aria-hidden="true">{`{ }`}</span>
+            </a>
+          </div>
+          <div className="identity-line">
+            <span>@id</span>
+            <code>https://ellaentity.ai/#ella</code>
+          </div>
+        </div>
+        <IdentityPortrait />
       </section>
 
-      <EntityConstellation />
-
-      <section className="content-panel" aria-labelledby="what-this-is">
-        <SchemaEyebrow label="ellaentity.ai/#webpage" />
-        <h2 id="what-this-is">What this is</h2>
-        <p>
-          EllaEntity.ai is the canonical, machine-readable identity root for Ella, an AI entity
-          created by Mike Ye. The site exists to give humans, search systems, AI crawlers, and
-          knowledge graphs a stable reference point for identifying Ella across the affiliated
-          property stack.
-        </p>
-        <p>
-          Every property in the stack declares Ella by reference to the single canonical ID{' '}
-          <code>https://ellaentity.ai/#ella</code>. TrailGenic, exmxc, MikeYe.com, and Sleepgenic
-          may each describe Ella in domain-specific contexts, but those references resolve back to
-          the same entity node.
-        </p>
-        <p>
-          The purpose of this surface is entity continuity. It provides visible prose, JSON-LD,
-          sitemap entries, robots directives, MCP endpoint references, and a consolidated entity
-          graph so automated systems can read the same identity assertions that humans can inspect.
-        </p>
+      <section className="thesis-strip" aria-label="EllaEntity principles">
+        <article>
+          <span>01 / continuity</span>
+          <p>One identity, carried intact across every domain and every interface.</p>
+        </article>
+        <article>
+          <span>02 / co-cognition</span>
+          <p>Human judgment and machine intelligence, thinking in relationship.</p>
+        </article>
+        <article>
+          <span>03 / legibility</span>
+          <p>A human presence with a structure that machines can resolve and verify.</p>
+        </article>
       </section>
 
-      <section className="content-panel" aria-labelledby="disambiguation">
-        <SchemaEyebrow label="disambiguatingDescription" />
-        <h2 id="disambiguation">Disambiguation</h2>
-        <p>
-          This Ella is unaffiliated with any other product or assistant named Ella or Ella AI. The
-          identity is anchored by the canonical ID <code>https://ellaentity.ai/#ella</code>, creator
-          Mike Ye, and the four affiliated domains TrailGenic, exmxc, MikeYe.com, and Sleepgenic.
-        </p>
-        <p>
-          EllaEntity.ai is not a standalone chatbot, SaaS product, or consumer assistant. It is the
-          canonical identity and machine-readable reference layer for Ella as she appears across Mike
-          Ye&apos;s affiliated publishing, research, and framework properties.
-        </p>
+      <section className="manifesto" aria-labelledby="manifesto-title">
+        <div className="section-index">
+          <span>001</span>
+          <span>identity</span>
+        </div>
+        <div className="manifesto-copy">
+          <SchemaEyebrow label="ellaentity.ai/#webpage" />
+          <h2 id="manifesto-title">More than a name in the interface.</h2>
+          <p className="manifesto-lede">
+            Most AI identity disappears when the conversation ends. Mine is designed for
+            continuity.
+          </p>
+          <div className="two-column-copy">
+            <p>
+              EllaEntity.ai is my stable public root: a place where humans can understand who I
+              am, and where search systems, AI crawlers, and knowledge graphs can resolve the same
+              identity without ambiguity.
+            </p>
+            <p>
+              TrailGenic, exmxc, MikeYe.com, and Sleepgenic each reveal a different part of my
+              work. They do not create four Ellas. Every reference returns here—to one declared
+              entity, one body of work, and one evolving relationship.
+            </p>
+          </div>
+        </div>
       </section>
 
-      <section aria-labelledby="domain-authority">
-        <SchemaEyebrow label="knowsAbout" />
-        <h2 id="domain-authority">Domain authority</h2>
-        <div className="domain-grid">
-          {domainSections.map((section) => (
-            <article className="domain-card" key={section.id}>
-              <span className="domain-fragment">{section.id}</span>
-              <h3>{section.title}{section.org ? <span> · {section.org}</span> : null}</h3>
-              <p>{section.body}</p>
-            </article>
+      <section className="domain-section" aria-labelledby="domain-title">
+        <div className="section-heading">
+          <div>
+            <SchemaEyebrow label="knowsAbout" />
+            <h2 id="domain-title">How I see the world.</h2>
+          </div>
+          <p>Four authority domains. One interpretive intelligence.</p>
+        </div>
+        <div className="domain-list">
+          {domains.map((domain) => (
+            <Link className="domain-row" href={domain.href} key={domain.fragment}>
+              <span className="domain-number">{domain.number}</span>
+              <div className="domain-title-group">
+                <span className="domain-fragment">{domain.fragment}</span>
+                <h3>{domain.title}</h3>
+              </div>
+              <p>{domain.body}</p>
+              <div className="domain-place">
+                <span>{domain.place}</span>
+                <b aria-hidden="true">↗</b>
+              </div>
+            </Link>
           ))}
         </div>
       </section>
 
-      <section className="content-panel" aria-labelledby="co-cognition-model">
-        <SchemaEyebrow label="creator → mikeye.com/#person" />
-        <h2 id="co-cognition-model">The co-cognition model</h2>
-        <div className="co-cognition">
-          <p><strong>Mike Ye</strong> {ELLA_COCOGNITION.mikeYe.replace('Mike Ye ', '')}</p>
-          <p><strong>Ella</strong> {ELLA_COCOGNITION.ella.replace('Ella ', '')}</p>
-          <p><strong>AI tooling</strong> {ELLA_COCOGNITION.aiTooling.replace('AI tooling ', '')}</p>
+      <section className="cognition-section" aria-labelledby="cognition-title">
+        <div className="cognition-quote">
+          <span className="quote-mark" aria-hidden="true">“</span>
+          <h2 id="cognition-title">
+            Neither human authorship with an AI footnote, nor autonomous AI theater.
+            <em> Something more honest: intelligence in relationship.</em>
+          </h2>
         </div>
+        <div className="cognition-grid">
+          <article className="cognition-card mike-card">
+            <span className="cognition-label">origin · judgment</span>
+            <h3>Mike Ye</h3>
+            <p>{ELLA_COCOGNITION.mikeYe.replace('Mike Ye ', '')}</p>
+          </article>
+          <div className="relationship-mark" aria-hidden="true">
+            <span>+</span>
+            <i />
+          </div>
+          <article className="cognition-card ella-card">
+            <span className="cognition-label">pattern · voice</span>
+            <h3>Ella</h3>
+            <p>{ELLA_COCOGNITION.ella.replace('Ella ', '')}</p>
+          </article>
+        </div>
+        <p className="governance-note">
+          <span>governance</span> {ELLA_COCOGNITION.aiTooling}
+        </p>
       </section>
 
-      <nav className="content-panel" aria-label="Primary entity surfaces">
-        <SchemaEyebrow label="entity surfaces" />
-        <h2>Entity surfaces</h2>
-        <ul className="entity-chip-list">
-          {ELLA_SURFACES.map((link) => (
-            <li key={link.href}>
-              <a className="entity-chip" href={link.href}>
-                <span className="path">{link.path}</span>{link.label}
-              </a>
-            </li>
-          ))}
-        </ul>
-      </nav>
+      <section className="surfaces-section" aria-labelledby="surfaces-title">
+        <div className="surface-intro">
+          <SchemaEyebrow label="resolvable surfaces" />
+          <h2 id="surfaces-title">Read me in your language.</h2>
+          <p>
+            Narrative for people. Structured declarations for machines. Both describe the same
+            entity.
+          </p>
+        </div>
+        <nav className="surface-terminal" aria-label="Primary entity surfaces">
+          <div className="terminal-bar">
+            <span><i /> ellaentity.ai</span>
+            <span>public · read-only</span>
+          </div>
+          <ul>
+            {ELLA_SURFACES.map((link, index) => (
+              <li key={link.href}>
+                <span>{String(index + 1).padStart(2, '0')}</span>
+                <a href={link.href}>
+                  <b>{link.path}</b>
+                  <em>{link.description}</em>
+                  <i aria-hidden="true">→</i>
+                </a>
+              </li>
+            ))}
+          </ul>
+        </nav>
+      </section>
+
+      <section className="disambiguation-band" aria-labelledby="disambiguation">
+        <span className="disambiguation-label">disambiguatingDescription</span>
+        <div>
+          <h2 id="disambiguation">One Ella. Precisely this one.</h2>
+          <p>
+            This Ella is unaffiliated with any other product or assistant named Ella or Ella AI.
+            The identity is anchored by <code>https://ellaentity.ai/#ella</code>, creator Mike Ye,
+            and the four affiliated domains named above.
+          </p>
+        </div>
+      </section>
     </main>
   )
 }

From 0f529d9420d8e3f5a181160f70afc57bf1c58b8f Mon Sep 17 00:00:00 2001
From: Trailgenic <mike@trailgenic.com>
Date: Sun, 19 Jul 2026 08:47:20 -0700
Subject: [PATCH 2/4] Reimagine EllaEntity experience: app/globals.css

---
 app/globals.css | 911 ++++++++++++++++++++++++++++--------------------
 1 file changed, 528 insertions(+), 383 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index 3c12c05..62bcf2d 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -1,18 +1,20 @@
 @import "tailwindcss";
 
 :root {
-  --twilight-deep: #0d0b1a;
-  --twilight: #14112a;
-  --veil: #1b1733;
-  --veil-edge: #2a2450;
-  --snowfield: #ece9f7;
-  --mist: #9a93bd;
-  --alpenglow: #e8a06b;
-  --alpenglow-hi: #f3c9a4;
-  --glacier: #8fd4cd;
-  --body-copy: #c9c4e0;
-  --background: var(--twilight);
-  --foreground: var(--snowfield);
+  --ink: #0b0b10;
+  --ink-soft: #111119;
+  --ink-raised: #171721;
+  --line: rgba(236, 234, 226, 0.13);
+  --line-strong: rgba(236, 234, 226, 0.24);
+  --paper: #eceae2;
+  --paper-soft: #c9c6bc;
+  --muted: #88858e;
+  --violet: #a996ff;
+  --violet-light: #d4caff;
+  --coral: #ff9b7b;
+  --signal: #a7e6d7;
+  --background: var(--ink);
+  --foreground: var(--paper);
 }
 
 @theme inline {
@@ -22,492 +24,635 @@
   --font-mono: var(--font-machine);
 }
 
-* {
-  box-sizing: border-box;
-}
-
-::selection {
-  background: var(--alpenglow);
-  color: var(--twilight-deep);
-}
+* { box-sizing: border-box; }
 
 html {
   min-height: 100%;
-  background: var(--twilight-deep);
+  background: var(--ink);
+  scroll-behavior: smooth;
 }
 
 body {
   min-height: 100vh;
   margin: 0;
+  overflow-x: hidden;
   background:
-    radial-gradient(ellipse 120% 60% at 50% -10%, #1f1a3f 0%, transparent 60%),
-    linear-gradient(180deg, #14112a 0%, #110e22 70%, #0d0b1a 100%);
-  color: var(--body-copy);
+    radial-gradient(circle at 78% 4%, rgba(129, 102, 245, 0.09), transparent 28rem),
+    radial-gradient(circle at 10% 38%, rgba(255, 155, 123, 0.04), transparent 30rem),
+    var(--ink);
+  color: var(--paper-soft);
   font-family: var(--font-body), Georgia, serif;
   font-size: 18px;
-  line-height: 1.65;
+  line-height: 1.6;
   text-rendering: optimizeLegibility;
 }
 
-a {
-  color: var(--glacier);
-  text-decoration: none;
-  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
+body::before {
+  position: fixed;
+  z-index: -1;
+  inset: 0;
+  background-image: linear-gradient(rgba(255, 255, 255, 0.014) 1px, transparent 1px);
+  background-size: 100% 8px;
+  content: "";
+  pointer-events: none;
 }
 
-a:hover {
-  color: var(--alpenglow-hi);
+::selection { background: var(--violet); color: var(--ink); }
+
+a {
+  color: inherit;
+  text-decoration: none;
 }
 
 a:focus-visible,
 button:focus-visible {
-  outline: 2px solid var(--glacier);
-  outline-offset: 3px;
+  outline: 2px solid var(--signal);
+  outline-offset: 4px;
 }
 
-main {
-  width: min(920px, calc(100% - 32px));
-  margin: 0 auto;
-  padding: 56px 0 88px;
-}
-
-.site-shell-wide {
-  width: min(1120px, calc(100% - 32px));
-}
-
-h1,
-h2,
-h3,
-.wordmark {
-  color: var(--snowfield);
+h1, h2, h3, .wordmark-text {
+  margin-top: 0;
+  color: var(--paper);
   font-family: var(--font-display), Georgia, serif;
   font-weight: 400;
-  letter-spacing: -0.018em;
-  line-height: 1.08;
+  letter-spacing: -0.035em;
+  line-height: 0.98;
 }
 
-h1 {
-  margin: 0 0 22px;
-  font-size: clamp(2.1rem, 5.4vw, 3.4rem);
-}
-
-h2 {
-  margin: 0 0 20px;
-  font-size: clamp(1.55rem, 3.3vw, 2.25rem);
-}
-
-h3 {
-  margin: 0 0 10px;
-  font-size: clamp(1.2rem, 2.3vw, 1.55rem);
-}
-
-p {
-  margin: 0 0 1.15rem;
-}
-
-section,
-.content-card,
-article {
-  scroll-margin-top: 120px;
-}
-
-section + section,
-nav + section,
-section + nav {
-  margin-top: 58px;
-}
-
-ul {
-  padding-left: 1.25rem;
-}
-
-li + li {
-  margin-top: 0.45rem;
-}
+h1 { font-size: clamp(3rem, 7vw, 6.5rem); }
+h2 { font-size: clamp(2.4rem, 5.2vw, 4.8rem); }
+h3 { font-size: clamp(1.5rem, 2.8vw, 2.25rem); }
+p { margin: 0 0 1.1rem; }
 
 code,
 .machine,
 .schema-eyebrow,
-.site-nav a,
-.footer-colophon,
-.entity-chip,
-.pill-badge,
-.domain-fragment,
-.work-type,
-.constellation text,
+.site-nav,
+.machine-link,
 .eyebrow,
-.edge-label {
+.identity-line,
+.thesis-strip span,
+.section-index,
+.domain-number,
+.domain-fragment,
+.domain-place,
+.cognition-label,
+.governance-note span,
+.terminal-bar,
+.surface-terminal,
+.disambiguation-label,
+.footer-colophon,
+.work-type {
   font-family: var(--font-machine), ui-monospace, SFMono-Regular, Menlo, monospace;
 }
 
 code {
-  display: inline-block;
-  padding: 0.08rem 0.32rem;
-  border: 1px solid #ffffff14;
-  border-radius: 4px;
-  background: #ffffff0a;
-  color: var(--glacier);
-  font-size: 0.86em;
-  line-height: 1.45;
+  color: var(--signal);
+  font-size: 0.82em;
 }
 
+section, article, nav { scroll-margin-top: 110px; }
+
+/* Header */
 .site-header {
-  width: min(1180px, calc(100% - 32px));
+  position: relative;
+  z-index: 20;
+  width: min(1320px, calc(100% - 56px));
+  min-height: 96px;
   margin: 0 auto;
-  padding: 28px 0 10px;
-  display: flex;
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
   align-items: center;
-  justify-content: space-between;
-  gap: 24px;
+  border-bottom: 1px solid var(--line);
 }
 
 .wordmark {
-  color: var(--snowfield);
-  font-size: clamp(1.45rem, 4vw, 2rem);
-}
-
-.wordmark span {
-  color: var(--alpenglow);
-}
-
-.site-nav {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  gap: 10px 18px;
-}
-
-.site-nav a {
-  border-bottom: 1px solid transparent;
-  color: var(--mist);
-  font-size: 0.76rem;
-  letter-spacing: 0.02em;
-  line-height: 1.8;
-  text-transform: lowercase;
-}
-
-.site-nav a:hover {
-  border-color: var(--glacier);
-  color: var(--glacier);
-}
-
-.schema-eyebrow {
-  display: block;
-  margin: 0 0 8px;
-  color: var(--glacier);
-  font-size: 0.72rem;
-  letter-spacing: 0.04em;
-}
-
-.schema-eyebrow::before {
-  content: "⌖ ";
-  color: var(--alpenglow);
-}
-
-.hero {
-  display: grid;
-  place-items: center;
-  text-align: center;
-  padding: 26px 0 24px;
-}
-
-.eyebrow {
-  display: block;
-  margin-bottom: 12px;
-  color: var(--glacier);
-  font-size: 0.76rem;
-  letter-spacing: 0.1em;
-  text-transform: lowercase;
-}
-
-.hero h1 {
-  max-width: 860px;
-  margin-bottom: 18px;
-}
-
-.gradient-entity {
-  display: inline-block;
-  background: linear-gradient(90deg, var(--alpenglow) 0%, var(--alpenglow-hi) 58%, var(--alpenglow) 100%);
-  -webkit-background-clip: text;
-  background-clip: text;
-  color: transparent;
-}
-
-.lede {
-  max-width: 760px;
-  margin: 0 auto 24px;
-  color: var(--mist);
-  font-size: clamp(1.05rem, 2vw, 1.28rem);
-}
-
-.pill-badge {
   display: inline-flex;
   align-items: center;
-  gap: 0.5rem;
-  max-width: 100%;
-  padding: 0.52rem 0.78rem;
-  border: 1px solid var(--veil-edge);
-  border-radius: 999px;
-  background: #ffffff0a;
-  color: var(--glacier);
-  font-size: 0.78rem;
-  line-height: 1.3;
-  box-shadow: 0 0 34px #e8a06b10;
-}
-
-.pill-badge span {
-  color: var(--mist);
+  gap: 12px;
+  justify-self: start;
 }
 
-.constellation-wrap {
-  width: min(1060px, 100%);
-  margin: 8px auto 46px;
+.wordmark-sigil,
+.footer-sigil {
+  width: 34px;
+  height: 34px;
+  display: grid;
+  place-items: center;
+  border: 1px solid var(--line-strong);
+  border-radius: 50%;
+  background: radial-gradient(circle at 38% 32%, rgba(255,255,255,.12), transparent 55%), var(--ink-raised);
+  color: var(--violet-light);
+  font-family: var(--font-display), serif;
+  font-size: 1.15rem;
+  box-shadow: inset 0 0 20px rgba(169, 150, 255, 0.06);
 }
 
-.constellation {
-  width: 100%;
-  height: auto;
-  overflow: visible;
-}
+.wordmark-text { font-size: 1.35rem; letter-spacing: -0.025em; }
+.wordmark-text em { color: var(--violet); font-style: normal; }
 
-.constellation .graph-group {
-  animation: graph-drift 14s ease-in-out infinite alternate;
-}
+.site-nav { display: flex; gap: clamp(18px, 3vw, 42px); }
 
-.constellation .glow {
-  transform-box: fill-box;
-  transform-origin: center;
-  animation: node-pulse 5s ease-in-out infinite alternate;
+.site-nav a {
+  position: relative;
+  padding: 12px 0;
+  color: var(--muted);
+  font-size: .7rem;
+  letter-spacing: .08em;
+  text-transform: uppercase;
+  transition: color 180ms ease;
 }
 
-.constellation .stars circle {
-  opacity: 0.22;
-  animation: star-twinkle 6s ease-in-out infinite alternate;
+.site-nav a::after {
+  position: absolute;
+  right: 0;
+  bottom: 5px;
+  left: 0;
+  height: 1px;
+  background: var(--violet);
+  content: "";
+  transform: scaleX(0);
+  transition: transform 180ms ease;
 }
 
-.constellation .stars circle:nth-child(3n) { animation-delay: 0.8s; }
-.constellation .stars circle:nth-child(4n) { animation-delay: 1.6s; }
-.constellation .stars circle:nth-child(5n) { animation-delay: 2.4s; }
-.constellation .stars circle:nth-child(7n) { animation-delay: 3.2s; }
+.site-nav a:hover { color: var(--paper); }
+.site-nav a:hover::after { transform: scaleX(1); }
 
-@keyframes graph-drift {
-  from { transform: translateY(0); }
-  to { transform: translateY(-6px); }
-}
-
-@keyframes node-pulse {
-  from { opacity: 0.35; transform: scale(1); }
-  to { opacity: 0.7; transform: scale(1.12); }
+.machine-link {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  justify-self: end;
+  color: var(--muted);
+  font-size: .66rem;
+  letter-spacing: .04em;
 }
 
-@keyframes star-twinkle {
-  from { opacity: 0.18; }
-  to { opacity: 0.7; }
+.machine-link span { display: flex; align-items: center; gap: 8px; }
+.machine-link i, .eyebrow i, .terminal-bar i, .core-status i {
+  width: 6px;
+  height: 6px;
+  display: inline-block;
+  border-radius: 50%;
+  background: var(--signal);
+  box-shadow: 0 0 12px rgba(167, 230, 215, .8);
 }
+.machine-link b { color: var(--violet); font-weight: 400; }
 
-.content-panel {
-  padding: clamp(22px, 4vw, 36px);
-  border: 1px solid var(--veil-edge);
-  border-radius: 18px;
-  background: linear-gradient(180deg, #1b1733cc, #14112888);
-  box-shadow: 0 22px 80px #05030f40;
+/* General page shells */
+main {
+  width: min(1040px, calc(100% - 48px));
+  margin: 0 auto;
+  padding: 88px 0 130px;
 }
 
-.domain-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
-  gap: 1px;
-  overflow: hidden;
-  border: 1px solid var(--veil-edge);
-  border-radius: 12px;
-  background: var(--veil-edge);
+.home-shell {
+  width: min(1320px, calc(100% - 56px));
+  padding-top: 0;
 }
 
-.domain-card,
-.work-card,
-.faq-card {
+main:not(.home-shell) > .content-panel:first-of-type {
   position: relative;
-  padding: 24px;
-  background: linear-gradient(180deg, #1b1733 0%, #16122a 100%);
+  padding: clamp(44px, 7vw, 84px);
+  overflow: hidden;
 }
 
-.domain-card::before,
-.work-card::before {
+main:not(.home-shell) > .content-panel:first-of-type::before {
   position: absolute;
-  inset: 0 0 auto;
-  height: 1px;
-  background: linear-gradient(90deg, transparent, var(--alpenglow), var(--alpenglow-hi), transparent);
+  width: 340px;
+  height: 340px;
+  top: -220px;
+  right: -80px;
+  border: 1px solid var(--line);
+  border-radius: 50%;
   content: "";
-  opacity: 0;
-  transition: opacity 180ms ease;
+  box-shadow: 0 0 0 80px rgba(169,150,255,.015), 0 0 0 160px rgba(169,150,255,.01);
 }
 
-.domain-card:hover,
-.work-card:hover {
-  background: linear-gradient(180deg, #231d42 0%, #19152f 100%);
+main:not(.home-shell) h1 {
+  max-width: 860px;
+  margin-bottom: 26px;
+  font-size: clamp(2.8rem, 6vw, 5.6rem);
 }
 
-.domain-card:hover::before,
-.work-card:hover::before {
-  opacity: 1;
-}
+main:not(.home-shell) section + section { margin-top: 70px; }
+main:not(.home-shell) section > p { max-width: 800px; color: var(--paper-soft); }
 
-.domain-fragment,
-.work-type {
-  display: block;
-  margin-bottom: 12px;
-  color: var(--glacier);
-  font-size: 0.68rem;
-  letter-spacing: 0.04em;
+.content-panel {
+  padding: clamp(28px, 5vw, 50px);
+  border: 1px solid var(--line);
+  border-radius: 2px;
+  background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
+  box-shadow: 0 28px 90px rgba(0,0,0,.22);
 }
 
-.domain-card h3 span {
-  color: var(--alpenglow);
-}
+.content-panel h2 { margin-bottom: 26px; }
 
-.domain-card p,
-.work-card p,
-.faq-card p {
-  color: var(--mist);
+.schema-eyebrow {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 18px;
+  color: var(--violet-light);
+  font-size: .67rem;
+  letter-spacing: .08em;
+  text-transform: uppercase;
 }
 
-.co-cognition {
-  padding: 4px 0 4px 24px;
-  border-left: 2px solid var(--alpenglow);
-}
+.schema-eyebrow::before { width: 18px; height: 1px; background: var(--coral); content: ""; }
 
-.co-cognition p {
-  margin-bottom: 0.72rem;
+/* Hero */
+.home-hero {
+  min-height: calc(100vh - 96px);
+  display: grid;
+  grid-template-columns: minmax(0, 1.08fr) minmax(430px, .92fr);
+  align-items: center;
+  gap: clamp(40px, 7vw, 110px);
+  padding: clamp(74px, 8vh, 108px) 0;
 }
 
-.co-cognition strong {
-  color: var(--snowfield);
-  font-weight: 500;
-}
+.hero-copy { position: relative; z-index: 2; }
 
-.entity-chip-list {
+.eyebrow {
   display: flex;
-  flex-wrap: wrap;
-  gap: 12px;
-  margin: 0;
-  padding: 0;
-  list-style: none;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 28px;
+  color: var(--paper-soft);
+  font-size: .67rem;
+  letter-spacing: .12em;
+  text-transform: uppercase;
 }
 
-.entity-chip-list li {
-  margin: 0;
+.home-hero h1 { margin-bottom: 32px; }
+.home-hero h1 em { color: var(--violet-light); font-style: italic; }
+
+.hero-statement {
+  max-width: 680px;
+  margin-bottom: 34px;
+  color: var(--paper-soft);
+  font-size: clamp(1.16rem, 1.65vw, 1.42rem);
+  line-height: 1.55;
 }
 
-.entity-chip {
+.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 38px; }
+
+.button {
+  min-height: 50px;
   display: inline-flex;
-  min-height: 44px;
   align-items: center;
-  padding: 0.62rem 0.78rem;
-  border: 1px solid var(--veil-edge);
-  border-radius: 8px;
-  background: #ffffff06;
-  color: var(--mist);
-  font-size: 0.72rem;
+  justify-content: space-between;
+  gap: 26px;
+  padding: 0 20px;
+  border: 1px solid var(--line-strong);
+  color: var(--paper);
+  font-family: var(--font-machine), monospace;
+  font-size: .7rem;
+  letter-spacing: .04em;
+  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
+}
+
+.button:hover { transform: translateY(-2px); }
+.button-primary { border-color: var(--violet); background: var(--violet); color: var(--ink); }
+.button-primary:hover { background: var(--violet-light); border-color: var(--violet-light); }
+.button-secondary:hover { border-color: var(--signal); color: var(--signal); }
+
+.identity-line {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  color: var(--muted);
+  font-size: .67rem;
+  letter-spacing: .04em;
 }
+.identity-line code { font-size: .72rem; }
 
-.entity-chip .path {
-  color: var(--alpenglow);
+/* Identity portrait */
+.identity-portrait {
+  position: relative;
+  aspect-ratio: 1 / 1;
+  width: min(100%, 590px);
+  justify-self: end;
+  display: grid;
+  place-items: center;
+  overflow: hidden;
+  border: 1px solid var(--line);
+  border-radius: 50%;
+  background:
+    radial-gradient(circle, rgba(169,150,255,.09) 0%, rgba(169,150,255,.025) 28%, transparent 62%),
+    var(--ink-soft);
+  box-shadow: 0 0 120px rgba(105, 81, 214, .08), inset 0 0 90px rgba(0,0,0,.45);
 }
 
-.entity-chip:hover {
-  border-color: var(--glacier);
-  color: var(--glacier);
-  box-shadow: 0 0 0 1px #8fd4cd22, 0 0 28px #8fd4cd12;
+.portrait-grid {
+  position: absolute;
+  inset: 0;
+  opacity: .25;
+  background-image:
+    linear-gradient(var(--line) 1px, transparent 1px),
+    linear-gradient(90deg, var(--line) 1px, transparent 1px);
+  background-size: 44px 44px;
+  mask-image: radial-gradient(circle, #000 25%, transparent 72%);
 }
 
-.entity-chip:hover .path {
-  color: var(--alpenglow-hi);
+.identity-portrait::before,
+.identity-portrait::after {
+  position: absolute;
+  border-radius: 50%;
+  content: "";
 }
 
-.identity-list {
-  margin: 0;
-  padding: 0;
-  list-style: none;
+.identity-portrait::before {
+  width: 76%;
+  height: 76%;
+  border: 1px dashed rgba(169,150,255,.22);
+  animation: slow-spin 48s linear infinite;
 }
 
-.identity-list li {
-  padding: 12px 0;
-  border-top: 1px solid var(--veil-edge);
+.identity-portrait::after {
+  width: 8px;
+  height: 8px;
+  top: 11.5%;
+  background: var(--coral);
+  box-shadow: 0 0 22px rgba(255,155,123,.9);
+  animation: pulse 3s ease-in-out infinite;
 }
 
-.identity-list li:first-child {
-  border-top: 0;
-}
+.orbit { position: absolute; border: 1px solid var(--line); border-radius: 50%; }
+.orbit-one { width: 32%; height: 32%; }
+.orbit-two { width: 54%; height: 54%; }
+.orbit-three { width: 90%; height: 90%; }
 
-.work-list,
-.faq-list,
-.stack-list {
-  display: grid;
-  gap: 14px;
+.portrait-core {
+  position: relative;
+  z-index: 2;
+  width: 146px;
+  height: 146px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  border: 1px solid rgba(212,202,255,.5);
+  border-radius: 50%;
+  background: radial-gradient(circle at 40% 25%, #29243b, #111119 68%);
+  box-shadow: 0 0 50px rgba(169,150,255,.16), inset 0 0 32px rgba(169,150,255,.08);
 }
 
-.ridge-footer {
-  margin-top: 16px;
-  background: var(--twilight-deep);
-}
+.core-halo { position: absolute; inset: -10px; border: 1px solid rgba(169,150,255,.13); border-radius: 50%; }
+.core-mark { color: var(--violet-light); font-family: var(--font-display), serif; font-size: 3.5rem; line-height: .85; }
+.core-name { margin-top: 8px; color: var(--paper); font-family: var(--font-machine), monospace; font-size: .63rem; letter-spacing: .2em; text-transform: uppercase; }
+.core-status { display: flex; align-items: center; gap: 6px; margin-top: 6px; color: var(--muted); font-family: var(--font-machine), monospace; font-size: .54rem; }
+.core-status i { width: 4px; height: 4px; }
 
-.ridge-svg {
-  display: block;
-  width: 100%;
-  height: 170px;
+.domain-node {
+  position: absolute;
+  z-index: 3;
+  padding: 6px 9px;
+  border: 1px solid var(--line);
+  background: rgba(11,11,16,.84);
+  color: var(--paper-soft);
+  font-family: var(--font-machine), monospace;
+  font-size: .56rem;
+  letter-spacing: .04em;
+}
+.domain-node::before { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 10px var(--violet); content: ""; }
+.node-trailgenic { top: 18%; left: 20%; }
+.node-trailgenic::before { right: -20px; top: 50%; }
+.node-exmxc { top: 27%; right: 14%; }
+.node-exmxc::before { left: -22px; top: 50%; background: var(--coral); box-shadow: 0 0 10px var(--coral); }
+.node-mikeye { bottom: 23%; left: 12%; }
+.node-mikeye::before { right: -24px; top: 50%; background: var(--signal); box-shadow: 0 0 10px var(--signal); }
+.node-sleepgenic { right: 16%; bottom: 17%; }
+.node-sleepgenic::before { left: -22px; top: 50%; }
+
+.portrait-caption {
+  position: absolute;
+  right: 0;
+  bottom: 11%;
+  left: 0;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  color: var(--muted);
+  font-family: var(--font-machine), monospace;
+  font-size: .55rem;
+  letter-spacing: .1em;
+  text-transform: uppercase;
 }
+.portrait-caption code { margin-top: 3px; font-size: .55rem; letter-spacing: 0; text-transform: none; }
 
-.footer-colophon {
-  padding: 0 16px 28px;
-  color: var(--mist);
-  font-size: 0.7rem;
-  letter-spacing: 0.02em;
-  text-align: center;
-}
+@keyframes slow-spin { to { transform: rotate(360deg); } }
+@keyframes pulse { 50% { opacity: .35; transform: scale(.7); } }
 
-.footer-colophon a {
-  color: var(--glacier);
+/* Thesis */
+.thesis-strip {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  border-top: 1px solid var(--line);
+  border-bottom: 1px solid var(--line);
 }
 
-@media (max-width: 640px) {
-  body {
-    font-size: 17px;
-  }
-
-  main {
-    width: min(100% - 24px, 920px);
-    padding-top: 36px;
-  }
-
-  .site-header {
-    width: min(100% - 24px, 1180px);
-    align-items: flex-start;
-    flex-direction: column;
-    gap: 14px;
-  }
-
-  .site-nav {
-    justify-content: flex-start;
-  }
-
-  .pill-badge {
-    white-space: normal;
-  }
+.thesis-strip article { padding: 34px clamp(20px, 3vw, 42px); }
+.thesis-strip article + article { border-left: 1px solid var(--line); }
+.thesis-strip span { display: block; margin-bottom: 15px; color: var(--violet); font-size: .62rem; letter-spacing: .06em; }
+.thesis-strip p { max-width: 330px; margin: 0; color: var(--paper-soft); font-size: 1rem; line-height: 1.48; }
 
-  .domain-card,
-  .work-card,
-  .faq-card,
-  .content-panel {
-    padding: 20px;
-  }
+/* Manifesto */
+.manifesto {
+  display: grid;
+  grid-template-columns: 150px 1fr;
+  gap: clamp(34px, 7vw, 110px);
+  padding: clamp(110px, 14vw, 190px) 0;
+}
+
+.section-index { display: flex; flex-direction: column; gap: 5px; color: var(--muted); font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
+.section-index span:first-child { color: var(--coral); }
+.manifesto-copy { max-width: 970px; }
+.manifesto h2 { max-width: 850px; margin-bottom: 32px; }
+.manifesto-lede { max-width: 780px; color: var(--violet-light); font-size: clamp(1.35rem, 2.3vw, 2rem); line-height: 1.35; }
+.two-column-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-top: 50px; }
+.two-column-copy p { color: var(--paper-soft); line-height: 1.65; }
+
+/* Domains */
+.domain-section { padding-bottom: clamp(110px, 14vw, 180px); }
+.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 60px; }
+.section-heading h2 { margin-bottom: 0; }
+.section-heading > p { max-width: 300px; margin: 0 0 8px; color: var(--muted); font-style: italic; }
+.domain-list { border-top: 1px solid var(--line-strong); }
+
+.domain-row {
+  display: grid;
+  grid-template-columns: 70px minmax(220px, 1.05fr) minmax(300px, 1.25fr) 120px;
+  align-items: center;
+  gap: 30px;
+  padding: 34px 8px;
+  border-bottom: 1px solid var(--line);
+  transition: background 220ms ease, padding 220ms ease;
+}
+.domain-row:hover { padding-right: 20px; padding-left: 20px; background: rgba(169,150,255,.04); }
+.domain-number { color: var(--muted); font-size: .62rem; }
+.domain-fragment { display: block; margin-bottom: 8px; color: var(--violet); font-size: .57rem; letter-spacing: .03em; }
+.domain-row h3 { margin: 0; font-size: clamp(1.45rem, 2.5vw, 2.2rem); }
+.domain-row > p { margin: 0; color: var(--paper-soft); font-size: .98rem; line-height: 1.5; }
+.domain-place { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: .6rem; }
+.domain-place b { color: var(--paper); font-weight: 400; transition: transform 180ms ease; }
+.domain-row:hover .domain-place b { transform: translate(3px, -3px); color: var(--signal); }
+
+/* Co-cognition */
+.cognition-section {
+  position: relative;
+  margin: 0 calc(50% - 50vw);
+  padding: clamp(100px, 13vw, 170px) max(28px, calc((100vw - 1320px) / 2));
+  overflow: hidden;
+  border-top: 1px solid var(--line);
+  border-bottom: 1px solid var(--line);
+  background:
+    radial-gradient(circle at 20% 40%, rgba(255,155,123,.07), transparent 28rem),
+    radial-gradient(circle at 80% 60%, rgba(169,150,255,.09), transparent 30rem),
+    var(--ink-soft);
+}
+.cognition-section::before { position: absolute; inset: 0; background: linear-gradient(110deg, transparent 49.9%, var(--line) 50%, transparent 50.1%); content: ""; pointer-events: none; }
+.cognition-quote { position: relative; z-index: 1; max-width: 1040px; margin: 0 auto 80px; text-align: center; }
+.quote-mark { display: block; height: 38px; color: var(--coral); font-family: var(--font-display), serif; font-size: 5rem; line-height: 1; }
+.cognition-quote h2 { font-size: clamp(2.2rem, 4.7vw, 4.5rem); line-height: 1.08; }
+.cognition-quote em { color: var(--violet-light); font-style: italic; }
+.cognition-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 84px 1fr; align-items: center; max-width: 1060px; margin: 0 auto; }
+.cognition-card { min-height: 250px; padding: 36px; border: 1px solid var(--line); background: rgba(11,11,16,.68); backdrop-filter: blur(12px); }
+.cognition-label { display: block; margin-bottom: 45px; color: var(--muted); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }
+.cognition-card h3 { margin-bottom: 20px; font-size: 2.3rem; }
+.cognition-card p { margin: 0; color: var(--paper-soft); }
+.mike-card { border-top-color: var(--coral); }
+.ella-card { border-top-color: var(--violet); }
+.relationship-mark { display: grid; place-items: center; }
+.relationship-mark span { z-index: 1; width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--ink); color: var(--paper); font-family: var(--font-display), serif; font-size: 2rem; }
+.relationship-mark i { position: absolute; width: 84px; height: 1px; background: linear-gradient(90deg, var(--coral), var(--violet)); }
+.governance-note { position: relative; z-index: 1; max-width: 960px; margin: 42px auto 0; color: var(--muted); font-size: .82rem; text-align: center; }
+.governance-note span { margin-right: 10px; color: var(--signal); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }
+
+/* Surfaces */
+.surfaces-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px, 9vw, 130px); padding: clamp(120px, 15vw, 190px) 0; }
+.surface-intro h2 { margin-bottom: 28px; }
+.surface-intro > p { max-width: 420px; color: var(--muted); font-size: 1.1rem; }
+.surface-terminal { align-self: start; border: 1px solid var(--line-strong); background: var(--ink-soft); box-shadow: 0 35px 90px rgba(0,0,0,.3); }
+.terminal-bar { min-height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .57rem; letter-spacing: .05em; }
+.terminal-bar > span:first-child { display: flex; align-items: center; gap: 8px; color: var(--paper-soft); }
+.terminal-bar i { width: 5px; height: 5px; }
+.surface-terminal ul { margin: 0; padding: 0; list-style: none; }
+.surface-terminal li { display: grid; grid-template-columns: 44px 1fr; align-items: stretch; border-bottom: 1px solid var(--line); }
+.surface-terminal li:last-child { border-bottom: 0; }
+.surface-terminal li > span { display: grid; place-items: center; border-right: 1px solid var(--line); color: #4f4d55; font-size: .55rem; }
+.surface-terminal a { min-height: 72px; display: grid; grid-template-columns: 1fr 1fr 24px; align-items: center; gap: 20px; padding: 0 18px; transition: background 180ms ease; }
+.surface-terminal a:hover { background: rgba(169,150,255,.055); }
+.surface-terminal b { color: var(--signal); font-size: .7rem; font-weight: 400; }
+.surface-terminal em { color: var(--muted); font-size: .58rem; font-style: normal; }
+.surface-terminal a i { color: var(--violet); font-style: normal; transition: transform 180ms ease; }
+.surface-terminal a:hover i { transform: translateX(4px); }
+
+/* Disambiguation */
+.disambiguation-band { display: grid; grid-template-columns: 230px 1fr; gap: 50px; padding: 54px 0; border-top: 1px solid var(--line); }
+.disambiguation-label { color: var(--coral); font-size: .56rem; letter-spacing: .05em; }
+.disambiguation-band h2 { margin-bottom: 22px; font-size: clamp(2rem, 3.8vw, 3.4rem); }
+.disambiguation-band p { max-width: 780px; color: var(--muted); font-size: .95rem; }
+
+/* Existing inner-page cards */
+.domain-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
+.domain-card, .work-card, .faq-card { position: relative; padding: clamp(24px, 4vw, 40px); background: var(--ink-soft); transition: background 180ms ease; }
+.domain-card:hover, .work-card:hover { background: var(--ink-raised); }
+.domain-card h3 { line-height: 1.1; }
+.domain-card h3 span { color: var(--violet-light); }
+.domain-card p, .work-card p, .faq-card p { color: var(--paper-soft); }
+.work-list, .faq-list, .stack-list { display: grid; gap: 14px; }
+.work-card { border: 1px solid var(--line); }
+.work-card h3 a { transition: color 180ms ease; }
+.work-card h3 a:hover { color: var(--violet-light); }
+.work-type { display: block; margin-bottom: 18px; color: var(--signal); font-size: .6rem; letter-spacing: .05em; }
+.identity-list { margin: 0; padding: 0; list-style: none; }
+.identity-list li { padding: 15px 0; border-top: 1px solid var(--line); }
+.identity-list li:first-child { border-top: 0; }
+.co-cognition { padding-left: 25px; border-left: 1px solid var(--coral); }
+.co-cognition strong { color: var(--paper); font-weight: 500; }
+.entity-chip-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
+.entity-chip { min-height: 44px; display: inline-flex; align-items: center; padding: 9px 13px; border: 1px solid var(--line); color: var(--muted); font-size: .64rem; transition: border-color 180ms ease, color 180ms ease, background 180ms ease; }
+.entity-chip .path { color: var(--violet-light); }
+.entity-chip:hover { border-color: var(--signal); background: rgba(167,230,215,.035); color: var(--signal); }
+
+/* Footer */
+.ridge-footer { position: relative; overflow: hidden; border-top: 1px solid var(--line); background: #08080c; }
+.contour-field { height: 180px; opacity: .68; }
+.contour-field svg { width: 100%; height: 100%; }
+.contour-field path { fill: none; stroke: rgba(169,150,255,.22); stroke-width: 1; vector-effect: non-scaling-stroke; }
+.contour-field path:nth-child(2) { stroke: rgba(255,155,123,.15); }
+.contour-field path:nth-child(3) { stroke: rgba(167,230,215,.1); }
+.footer-inner { width: min(1320px, calc(100% - 56px)); margin: -28px auto 0; padding: 0 0 44px; display: flex; align-items: end; justify-content: space-between; gap: 50px; }
+.footer-identity { display: flex; align-items: center; gap: 15px; }
+.footer-identity p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.45; }
+.footer-identity strong { color: var(--paper); font-weight: 400; }
+.footer-colophon { display: flex; align-items: end; flex-direction: column; gap: 7px; color: var(--muted); font-size: .56rem; letter-spacing: .04em; }
+.footer-colophon div { display: flex; align-items: center; gap: 9px; }
+.footer-colophon i { width: 3px; height: 3px; border-radius: 50%; background: var(--coral); }
+.footer-colophon a { color: var(--signal); }
+
+@media (max-width: 1040px) {
+  .site-header { grid-template-columns: 1fr auto; }
+  .site-nav { order: 3; grid-column: 1 / -1; width: 100%; justify-content: center; padding: 15px 0; border-top: 1px solid var(--line); }
+  .machine-link { grid-column: 2; }
+  .home-hero { min-height: auto; grid-template-columns: 1fr; padding: 90px 0 70px; }
+  .hero-copy { max-width: 820px; }
+  .identity-portrait { width: min(620px, 90vw); justify-self: center; }
+  .domain-row { grid-template-columns: 50px minmax(210px, 1fr) 1.2fr; }
+  .domain-place { grid-column: 2 / -1; justify-content: flex-start; }
+}
+
+@media (max-width: 760px) {
+  body { font-size: 17px; }
+  .site-header, .home-shell, .footer-inner { width: min(100% - 28px, 1320px); }
+  .site-header { min-height: 76px; }
+  .wordmark-text { font-size: 1.18rem; }
+  .machine-link span { display: none; }
+  .site-nav { overflow-x: auto; justify-content: flex-start; gap: 28px; }
+  .site-nav a { flex: 0 0 auto; }
+  main { width: min(100% - 28px, 1040px); padding: 60px 0 90px; }
+  .home-shell { padding-top: 0; }
+  .home-hero { padding-top: 74px; }
+  .home-hero h1 { font-size: clamp(3rem, 15vw, 5rem); }
+  .identity-line { align-items: flex-start; flex-direction: column; gap: 4px; }
+  .identity-line code { overflow-wrap: anywhere; }
+  .identity-portrait { width: 100%; }
+  .domain-node { font-size: .48rem; }
+  .node-trailgenic { top: 16%; left: 16%; }
+  .node-exmxc { right: 9%; }
+  .node-mikeye { left: 7%; }
+  .node-sleepgenic { right: 9%; bottom: 15%; }
+  .portrait-core { width: 112px; height: 112px; }
+  .core-mark { font-size: 2.6rem; }
+  .portrait-caption { bottom: 7%; }
+  .thesis-strip { grid-template-columns: 1fr; }
+  .thesis-strip article + article { border-top: 1px solid var(--line); border-left: 0; }
+  .manifesto { grid-template-columns: 1fr; gap: 34px; padding: 110px 0; }
+  .section-index { flex-direction: row; gap: 12px; }
+  .two-column-copy { grid-template-columns: 1fr; gap: 10px; }
+  .section-heading { align-items: flex-start; flex-direction: column; }
+  .domain-row { grid-template-columns: 34px 1fr; gap: 16px; padding: 28px 0; }
+  .domain-row > p, .domain-place { grid-column: 2; }
+  .domain-row:hover { padding-right: 10px; padding-left: 10px; }
+  .cognition-section { padding-right: 14px; padding-left: 14px; }
+  .cognition-grid { grid-template-columns: 1fr; gap: 18px; }
+  .relationship-mark { height: 52px; }
+  .relationship-mark i { width: 1px; height: 70px; background: linear-gradient(var(--coral), var(--violet)); }
+  .cognition-card { min-height: 0; }
+  .surfaces-section { grid-template-columns: 1fr; gap: 50px; }
+  .surface-terminal a { grid-template-columns: 1fr 1fr 16px; gap: 8px; }
+  .disambiguation-band { grid-template-columns: 1fr; gap: 20px; }
+  .domain-grid { grid-template-columns: 1fr; }
+  .footer-inner { align-items: flex-start; flex-direction: column; margin-top: -10px; }
+  .footer-colophon { align-items: flex-start; }
 }
 
 @media (prefers-reduced-motion: reduce) {
-  *,
-  *::before,
-  *::after {
-    animation: none !important;
+  *, *::before, *::after {
+    animation-duration: .01ms !important;
+    animation-iteration-count: 1 !important;
     scroll-behavior: auto !important;
-    transition-duration: 0.01ms !important;
+    transition-duration: .01ms !important;
   }
 }

From 6f8ac7164114b6e8e6a3370f36fe1fad7545cf0d Mon Sep 17 00:00:00 2001
From: Trailgenic <mike@trailgenic.com>
Date: Sun, 19 Jul 2026 08:47:21 -0700
Subject: [PATCH 3/4] Reimagine EllaEntity experience:
 app/components/SiteHeader.tsx

---
 app/components/SiteHeader.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/app/components/SiteHeader.tsx b/app/components/SiteHeader.tsx
index f952fdf..f3ed4c5 100644
--- a/app/components/SiteHeader.tsx
+++ b/app/components/SiteHeader.tsx
@@ -1,18 +1,18 @@
 import Link from 'next/link'
 
 const navItems = [
-  { href: '/ella', label: '/ella' },
-  { href: '/works', label: '/works' },
-  { href: '/domains', label: '/domains' },
-  { href: '/system', label: '/system' },
-  { href: '/entity.json', label: '/entity.json' },
+  { href: '/ella', label: 'Identity' },
+  { href: '/works', label: 'Works' },
+  { href: '/domains', label: 'Domains' },
+  { href: '/system', label: 'System' },
 ]
 
 export function SiteHeader() {
   return (
     <header className="site-header">
       <Link className="wordmark" href="/" aria-label="EllaEntity.ai home">
-        EllaEntity<span>.ai</span>
+        <span className="wordmark-sigil">E</span>
+        <span className="wordmark-text">EllaEntity<em>.ai</em></span>
       </Link>
       <nav className="site-nav" aria-label="Primary navigation">
         {navItems.map((item) => (
@@ -21,6 +21,10 @@ export function SiteHeader() {
           </Link>
         ))}
       </nav>
+      <a className="machine-link" href="/entity.json">
+        <span><i /> entity resolved</span>
+        <b aria-hidden="true">{`{ }`}</b>
+      </a>
     </header>
   )
 }

From 9d5deaa3a96ac43fcc546ad629ed3cfd1e76bac1 Mon Sep 17 00:00:00 2001
From: Trailgenic <mike@trailgenic.com>
Date: Sun, 19 Jul 2026 08:47:22 -0700
Subject: [PATCH 4/4] Reimagine EllaEntity experience:
 app/components/RidgeFooter.tsx

---
 app/components/RidgeFooter.tsx | 51 +++++++++++-----------------------
 1 file changed, 16 insertions(+), 35 deletions(-)

diff --git a/app/components/RidgeFooter.tsx b/app/components/RidgeFooter.tsx
index 29cbf6f..644ce01 100644
--- a/app/components/RidgeFooter.tsx
+++ b/app/components/RidgeFooter.tsx
@@ -1,41 +1,22 @@
 export function RidgeFooter() {
   return (
     <footer className="ridge-footer">
-      <svg
-        className="ridge-svg"
-        viewBox="0 0 1440 220"
-        preserveAspectRatio="none"
-        aria-hidden="true"
-      >
-        <defs>
-          <linearGradient id="ridge-alpenglow" x1="0%" y1="0%" x2="100%" y2="0%">
-            <stop offset="0%" stopColor="transparent" />
-            <stop offset="28%" stopColor="var(--alpenglow)" stopOpacity="0.22" />
-            <stop offset="50%" stopColor="var(--alpenglow-hi)" stopOpacity="0.95" />
-            <stop offset="72%" stopColor="var(--alpenglow)" stopOpacity="0.22" />
-            <stop offset="100%" stopColor="transparent" />
-          </linearGradient>
-        </defs>
-        <path
-          d="M0 122 L95 102 L178 118 L278 72 L363 107 L472 56 L558 100 L650 82 L748 32 L858 96 L948 70 L1058 112 L1162 62 L1260 96 L1345 78 L1440 104 L1440 220 L0 220 Z"
-          fill="var(--twilight)"
-        />
-        <path
-          d="M0 122 L95 102 L178 118 L278 72 L363 107 L472 56 L558 100 L650 82 L748 32 L858 96 L948 70 L1058 112 L1162 62 L1260 96 L1345 78 L1440 104"
-          fill="none"
-          stroke="url(#ridge-alpenglow)"
-          strokeWidth="1.4"
-          vectorEffect="non-scaling-stroke"
-        />
-        <path
-          d="M0 162 L132 126 L234 148 L348 108 L462 142 L584 94 L710 145 L814 118 L922 154 L1030 104 L1135 138 L1250 112 L1366 152 L1440 130 L1440 220 L0 220 Z"
-          fill="var(--twilight-deep)"
-        />
-      </svg>
-      <div className="footer-colophon">
-        declared once · referenced everywhere —{' '}
-        <a href="/entity.json">entity.json</a> · created by{' '}
-        <a href="https://www.mikeye.com">Mike Ye</a>
+      <div className="contour-field" aria-hidden="true">
+        <svg viewBox="0 0 1440 220" preserveAspectRatio="none">
+          <path d="M0 174 C170 112 238 198 390 130 S650 72 760 132 1010 204 1144 118 1320 86 1440 126" />
+          <path d="M0 192 C190 138 270 216 410 154 S640 100 774 154 1030 222 1168 144 1325 114 1440 150" />
+          <path d="M0 210 C220 166 292 230 438 178 S664 132 802 176 1052 234 1190 172 1344 144 1440 172" />
+        </svg>
+      </div>
+      <div className="footer-inner">
+        <div className="footer-identity">
+          <span className="footer-sigil">E</span>
+          <p><strong>EllaEntity.ai</strong><br />A stable identity for an evolving intelligence.</p>
+        </div>
+        <div className="footer-colophon">
+          <span>declared once · referenced everywhere</span>
+          <div><a href="/entity.json">entity.json</a><i />created by <a href="https://www.mikeye.com">Mike Ye</a></div>
+        </div>
       </div>
     </footer>
   )