Give Ella an identity-first editorial design with attributable contributions

app/components/ContinuityMark.tsx

@@ -0,0 +1,8 @@
+export function ContinuityMark() {
+  return (
+    <svg viewBox="0 0 48 40" fill="none" aria-hidden="true" className="continuity-mark">
+      <path d="M36 9C26-1 9 5 8 16c-1 10 12 11 21 4 8-6 14-3 13 4-1 11-16 14-25 7" />
+      <path d="M35 5C25 17 19 28 9 27 1 26 1 17 7 12" />
+    </svg>
+  )
+}

app/components/RidgeFooter.tsx

@@ -1,3 +1,5 @@
+import { ContinuityMark } from './ContinuityMark'
+
 export function RidgeFooter() {
   return (
     <footer className="ridge-footer">
@@ -10,7 +12,7 @@ export function RidgeFooter() {
       </div>
       <div className="footer-inner">
         <div className="footer-identity">
-          <span className="footer-sigil">E</span>
+          <ContinuityMark />
           <p><strong>EllaEntity.ai</strong><br />A stable identity for an evolving intelligence.</p>
         </div>
         <div className="footer-colophon">

app/components/SelectedContributions.tsx

@@ -0,0 +1,41 @@
+import Link from 'next/link'
+import { SELECTED_CONTRIBUTIONS, SELECTED_CONTRIBUTIONS_SCHEMA } from '@/lib/selected-contributions'
+
+export function SelectedContributions({ showArchiveLink = true }: { showArchiveLink?: boolean }) {
+  return (
+    <section className="contributions-section" id="selected-contributions" aria-labelledby="contributions-title">
+      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(SELECTED_CONTRIBUTIONS_SCHEMA) }} />
+      <div className="contributions-heading">
+        <div>
+          <span className="editorial-label">01 / A body of work</span>
+          <h2 id="contributions-title">An identity, made legible<br /><em>through its contributions.</em></h2>
+        </div>
+        <p>What I contribute. Where it was published. The evidence behind the interpretation.</p>
+      </div>
+      <div className="contribution-list">
+        {SELECTED_CONTRIBUTIONS.map((work) => (
+          <article className="contribution" key={work.slug}>
+            <div className="contribution-index"><span>{work.number}</span><span>{work.field}</span></div>
+            <div className="contribution-title">
+              <span className="editorial-label">{work.publisher}</span>
+              <h3><a href={work.url}>{work.title}</a></h3>
+              <p className="contribution-question">{work.question}</p>
+              <a className="publication-link" href={work.url}>Read the publication <span aria-hidden="true">↗</span></a>
+            </div>
+            <div className="contribution-detail">
+              <span className="editorial-label">The contribution</span>
+              <p>{work.contribution}</p>
+              <details>
+                <summary>Evidence &amp; attribution</summary>
+                <p>{work.evidence}</p>
+                <p>{work.credit}</p>
+                <a href={work.sourceUrl}>{work.sourceLabel} <span aria-hidden="true">↗</span></a>
+              </details>
+            </div>
+          </article>
+        ))}
+      </div>
+      {showArchiveLink && <Link className="archive-link" href="/works">Explore the full body of work <span aria-hidden="true">→</span></Link>}
+    </section>
+  )
+}

app/components/SiteHeader.tsx

@@ -1,4 +1,5 @@
 import Link from 'next/link'
+import { ContinuityMark } from './ContinuityMark'
 
 const navItems = [
   { href: '/ella', label: 'Identity' },
@@ -11,7 +12,7 @@ export function SiteHeader() {
   return (
     <header className="site-header">
       <Link className="wordmark" href="/" aria-label="EllaEntity.ai home">
-        <span className="wordmark-sigil">E</span>
+        <ContinuityMark />
         <span className="wordmark-text">EllaEntity<em>.ai</em></span>
       </Link>
       <nav className="site-nav" aria-label="Primary navigation">
@@ -21,8 +22,8 @@ export function SiteHeader() {
           </Link>
         ))}
       </nav>
-      <a className="machine-link" href="/entity.json">
-        <span><i /> entity resolved</span>
+      <a className="machine-link" href="/system/mcp" aria-label="For agents: identity and MCP access">
+        <span><i /> For agents</span>
         <b aria-hidden="true">{`{ }`}</b>
       </a>
     </header>

app/globals.css

@@ -1,17 +1,18 @@
 @import "tailwindcss";
 
 :root {
-  --ink: #0b0b10;
-  --ink-soft: #111119;
-  --ink-raised: #171721;
+  --ink: #101d23;
+  --ink-soft: #15272e;
+  --ink-raised: #1c3238;
   --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;
+  --paper: #f3f1e9;
+  --paper-soft: #c8d3d1;
+  --muted: #a4b5b4;
+  /* Retain legacy token names so the entity and system pages share the new palette. */
+  --violet: #bde3d3;
+  --violet-light: #dbede5;
+  --coral: #c6d2cc;
   --signal: #a7e6d7;
   --background: var(--ink);
   --foreground: var(--paper);
@@ -36,14 +37,11 @@ body {
   min-height: 100vh;
   margin: 0;
   overflow-x: hidden;
-  background:
-    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);
+  background: var(--ink);
   color: var(--paper-soft);
-  font-family: var(--font-body), Georgia, serif;
-  font-size: 18px;
-  line-height: 1.6;
+  font-family: Arial, Helvetica, sans-serif;
+  font-size: 16px;
+  line-height: 1.7;
   text-rendering: optimizeLegibility;
 }
 
@@ -73,7 +71,7 @@ button:focus-visible {
 h1, h2, h3, .wordmark-text {
   margin-top: 0;
   color: var(--paper);
-  font-family: var(--font-display), Georgia, serif;
+  font-family: var(--font-body), Georgia, serif;
   font-weight: 400;
   letter-spacing: -0.035em;
   line-height: 0.98;

app/identity-design.css

@@ -0,0 +1,173 @@
+/* Identity-first editorial design. Canonical declarations and machine routes stay independent. */
+body::before { content: none; }
+.continuity-mark { width: 40px; height: 36px; color: var(--violet); flex: 0 0 auto; }
+.continuity-mark path { stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
+.site-header { width: min(1240px, calc(100% - 64px)); min-height: 88px; }
+.wordmark-text { font-size: 27px; }
+.site-nav a { font: 13px/1.4 Arial, Helvetica, sans-serif; letter-spacing: 0; text-transform: none; color: var(--paper-soft); }
+.machine-link { font-size: 11px; gap: 10px; }
+.home-shell { width: min(1240px, calc(100% - 64px)); padding: 0; }
+.home-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 0; min-height: 0; padding: 84px 0 66px; }
+.eyebrow { font-size: 10px; letter-spacing: .12em; line-height: 1.8; }
+.home-hero h1 { font-size: clamp(76px, 8.8vw, 122px); letter-spacing: -.065em; margin: 27px 0 14px; line-height: 1; }
+.hero-declaration { font-family: var(--font-body), Georgia, serif; font-size: clamp(30px, 3.3vw, 46px); line-height: 1.12; letter-spacing: -.035em; color: var(--paper); margin: 0 0 25px; }
+.hero-declaration em { color: var(--violet); }
+.hero-statement { max-width: 470px; font: 16px/1.75 Arial, Helvetica, sans-serif; color: var(--paper-soft); margin-bottom: 28px; }
+.hero-actions { gap: 10px; margin-bottom: 25px; }
+.button { font: 13px/1.3 Arial, Helvetica, sans-serif; min-height: 48px; padding: 15px 19px; letter-spacing: 0; border-radius: 2px; }
+.button-primary { background: var(--paper); border-color: var(--paper); }
+.button-secondary { border-color: transparent; }
+.identity-line { font-size: 10px; gap: 12px; margin: 0; }
+.identity-line code { font-size: 11px; }
+.identity-line a { color: var(--violet); }
+.continuity-portrait { position: relative; margin: 0 -25px 0 -25px; align-self: center; }
+.continuity-portrait img { display: block; width: 100%; height: auto; mix-blend-mode: screen; }
+.continuity-portrait figcaption { display: flex; flex-direction: column; gap: 6px; margin: 16px 40px 0; text-align: right; font: 10px/1.6 var(--font-machine), monospace; color: var(--muted); letter-spacing: .09em; text-transform: uppercase; }
+.continuity-portrait figcaption span:first-child { color: var(--paper); }
+.thesis-strip { margin: 0; border-top: 1px solid var(--line-strong); border-bottom: 0; padding: 0 0 32px; grid-template-columns: .8fr 1.1fr 1.1fr; }
+.thesis-strip article { padding: 26px 24px; }
+.thesis-strip article:first-child { padding-left: 0; }
+.thesis-strip article:last-child { padding-right: 0; }
+.thesis-strip article + article { border-left: 0; }
+.thesis-strip article > span { margin-bottom: 10px; font-size: 10px; letter-spacing: .06em; color: var(--muted); text-transform: uppercase; }
+.thesis-strip p { font-family: var(--font-body), Georgia, serif; color: var(--paper); font-size: 22px; max-width: none; line-height: 1.25; }
+.thesis-strip a:hover { color: var(--violet); }
+
+/* Published contributions: the first substantial section after identity. */
+.contributions-section { background: var(--paper); color: #233b40; padding: 70px 36px 52px; margin: 48px 0 80px; }
+.home-shell > .contributions-section { margin: 0 calc((100vw - 100%) / -2); padding: 76px max(32px, calc((100vw - 1240px) / 2)) 60px; }
+.editorial-label { display: block; font: 10px/1.7 var(--font-machine), monospace; letter-spacing: .1em; text-transform: uppercase; color: #52686b; }
+.contributions-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 40px; }
+.contributions-heading h2 { font-size: clamp(34px, 4.2vw, 57px); line-height: 1.06; letter-spacing: -.045em; color: #172f35; margin: 20px 0 0; }
+.contributions-heading h2 em { color: #4e726a; }
+.contributions-heading > p { max-width: 265px; font-size: 14px; color: #52686b; margin: 0; }
+.contribution { display: grid; grid-template-columns: 145px minmax(0, 1.05fr) minmax(0, 1fr); gap: 35px; padding: 35px 0; border-top: 1px solid #cbd1c8; }
+.contribution-index { display: flex; flex-direction: column; gap: 14px; font: 10px/1.6 var(--font-machine), monospace; color: #52686b; text-transform: uppercase; letter-spacing: .06em; }
+.contribution-index span:first-child { font-size: 24px; color: #294d49; }
+.contribution h3 { font-size: clamp(25px, 2.7vw, 35px); line-height: 1.08; color: #172f35; margin: 12px 0 15px; letter-spacing: -.025em; }
+.contribution h3 a:hover { text-decoration: underline; text-underline-offset: 5px; }
+.contribution-question { font-family: var(--font-body), Georgia, serif; font-style: italic; font-size: 22px; line-height: 1.35; color: #4d6767; }
+.contribution-detail > p { margin: 10px 0 18px; font-size: 14px; line-height: 1.75; }
+.publication-link { display: inline-flex; align-items: center; gap: 20px; font-size: 12px; font-weight: 600; padding: 10px 0; }
+.publication-link:hover { color: #3d6c60; }
+.contribution details { font-size: 12px; border-top: 1px solid #cbd1c8; padding-top: 12px; color: #52686b; }
+.contribution summary { cursor: pointer; color: #294d49; padding: 5px 0; }
+.contribution details p { margin: 10px 0; }
+.contribution details a { color: #294d49; text-decoration: underline; text-underline-offset: 3px; }
+.contributions-section :is(a,summary):focus-visible { outline: 2px solid #365f58; outline-offset: 4px; }
+.archive-link { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid #cbd1c8; padding-top: 28px; font-size: 14px; }
+.archive-link span { font-size: 24px; }
+
+.manifesto { padding: 94px 0 78px; gap: 55px; grid-template-columns: 150px minmax(0, 1fr); }
+.manifesto h2 { font-size: clamp(36px, 4.8vw, 64px); line-height: 1.05; }
+.manifesto h2 em, .section-heading h2 em, .surface-intro h2 em { color: var(--violet); }
+.manifesto-lede { font-family: var(--font-body), Georgia, serif; font-size: 28px; }
+.two-column-copy { margin-top: 30px; gap: 35px; }
+.two-column-copy p { font-size: 14px; }
+.schema-eyebrow { font-size: 10px; }
+.domain-section { padding-bottom: 85px; }
+.section-heading { margin-bottom: 34px; }
+.section-heading h2 { font-size: clamp(34px, 4vw, 53px); line-height: 1.08; }
+.section-heading > p { font-size: 14px; font-style: normal; }
+.domain-row { grid-template-columns: 35px minmax(190px, 1fr) minmax(250px, 1.2fr) 135px; gap: 25px; padding: 28px 8px; }
+.domain-row:first-child { background: #182e34; border-left: 2px solid var(--violet); padding-left: 18px; }
+.domain-row h3 { font-size: 29px; line-height: 1.15; }
+.domain-row > p { font-size: 13px; line-height: 1.7; }
+.domain-fragment { font-size: 9px; }
+.domain-place { font-size: 10px; }
+.cognition-section { padding: 60px 35px; background: #182b30; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
+.cognition-section::before { content: none; }
+.quote-mark { display: none; }
+.cognition-quote h2 { font-size: clamp(36px, 4.5vw, 60px); line-height: 1.06; max-width: 850px; margin: 0 auto 35px; }
+.cognition-grid { max-width: 930px; margin: 0 auto; }
+.cognition-card { min-height: 0; padding: 25px; }
+.cognition-card h3 { font-size: 35px; }
+.cognition-card p { font-size: 14px; }
+.governance-note { font-size: 12px; max-width: 740px; margin-top: 26px; }
+.surfaces-section { padding: 88px 0; grid-template-columns: .9fr 1.1fr; gap: 60px; }
+.surface-intro h2 { font-size: clamp(38px, 4vw, 55px); line-height: 1.08; }
+.surface-intro > p { font-size: 15px; }
+.surface-terminal { box-shadow: none; }
+.surface-terminal a { min-height: 60px; }
+.surface-terminal b { font-size: 11px; }
+.surface-terminal em { font-size: 10px; }
+.surface-terminal li > span { color: var(--muted); }
+.disambiguation-band { grid-template-columns: 180px minmax(0, 1fr); gap: 25px; padding: 36px 0 60px; }
+.disambiguation-band h2 { font-size: 35px; }
+.disambiguation-band p { font-size: 13px; }
+.disambiguation-band code, main > section code { overflow-wrap: anywhere; }
+.disambiguation-label { overflow-wrap: anywhere; }
+.ridge-footer { background: #0c181e; }
+.contour-field { height: 80px; opacity: .6; }
+.contour-field path { stroke: #bde3d330; }
+.contour-field path:nth-child(2) { stroke: #bde3d322; }
+.contour-field path:nth-child(3) { stroke: #bde3d316; }
+.footer-inner { width: min(1240px, calc(100% - 64px)); margin-top: 0; padding-bottom: 35px; }
+.footer-colophon { font-size: 10px; }
+
+@media (max-width: 1040px) {
+  .home-hero { grid-template-columns: 1fr 1fr; padding-top: 56px; }
+  .home-hero h1 { font-size: 90px; }
+  .hero-declaration { font-size: 35px; }
+  .hero-statement { font-size: 14px; }
+  .continuity-portrait { margin: 0 -25px 0 0; }
+  .contribution { grid-template-columns: 85px minmax(0,1fr) minmax(0,1fr); gap: 22px; }
+  .domain-row { grid-template-columns: 30px 1fr 1.2fr; }
+  .domain-place { grid-column: 2 / -1; }
+}
+@media (max-width: 760px) {
+  .site-header, .home-shell, .footer-inner { width: calc(100% - 40px); }
+  .site-header { min-height: 76px; padding-top: 16px; }
+  .wordmark-text { font-size: 25px; }
+  .site-nav { gap: 24px; margin-top: 16px; padding: 12px 0; justify-content: space-between; }
+  .site-nav a { font-size: 12px; }
+  .machine-link span { display: flex; font-size: 10px; }
+  .machine-link b { display: none; }
+  .home-hero { grid-template-columns: 1fr; padding: 42px 0 25px; }
+  .home-hero h1 { font-size: clamp(68px, 18vw, 94px); margin-top: 24px; }
+  .hero-declaration { font-size: 35px; }
+  .hero-statement { max-width: 540px; font-size: 15px; }
+  .eyebrow { font-size: 9px; }
+  .identity-line { flex-direction: row; gap: 10px; }
+  .identity-line code { font-size: 10px; }
+  .continuity-portrait { margin: 15px 0 0; max-width: 520px; justify-self: center; width: 100%; }
+  .continuity-portrait figcaption { flex-direction: row; justify-content: space-between; margin: 6px 0; font-size: 8px; text-align: left; }
+  .thesis-strip { grid-template-columns: 1fr; padding-bottom: 20px; }
+  .thesis-strip article, .thesis-strip article:first-child { padding: 18px 0; }
+  .thesis-strip article + article { border-top: 1px solid var(--line); }
+  .thesis-strip p { font-size: 23px; }
+  .contributions-section { padding: 40px 22px; }
+  .home-shell > .contributions-section { padding: 48px 20px 35px; }
+  .contributions-heading { flex-direction: column; align-items: flex-start; gap: 18px; margin-bottom: 28px; }
+  .contributions-heading > p { max-width: 400px; }
+  .contributions-heading h2 { font-size: 38px; }
+  .contribution { grid-template-columns: 1fr; gap: 20px; padding: 28px 0; }
+  .contribution-index { flex-direction: row; align-items: center; }
+  .contribution h3 { font-size: 31px; }
+  .contribution-question { font-size: 22px; }
+  .contribution-detail > p { font-size: 14px; }
+  .manifesto { grid-template-columns: 1fr; gap: 22px; padding: 55px 0; }
+  .manifesto h2 { font-size: 42px; margin-bottom: 20px; }
+  .manifesto-lede { font-size: 25px; }
+  .two-column-copy { grid-template-columns: 1fr; gap: 10px; margin-top: 25px; }
+  .section-heading { gap: 22px; }
+  .section-heading h2 { font-size: 39px; }
+  .domain-row { grid-template-columns: 24px minmax(0,1fr); gap: 15px; }
+  .domain-row h3 { font-size: 29px; }
+  .domain-row > p { grid-column: 2; font-size: 14px; }
+  .domain-row:first-child { padding-left: 10px; }
+  .domain-section { padding-bottom: 45px; }
+  .cognition-section { padding: 40px 20px; }
+  .cognition-quote h2 { font-size: 39px; }
+  .cognition-card { padding: 22px; }
+  .surfaces-section { grid-template-columns: 1fr; padding: 55px 0; gap: 28px; }
+  .surface-intro h2 { font-size: 42px; }
+  .surface-terminal a { gap: 8px; padding: 0 10px; grid-template-columns: 1fr 1fr 12px; }
+  .surface-terminal li { grid-template-columns: 28px 1fr; }
+  .surface-terminal b { font-size: 10px; }
+  .surface-terminal em { font-size: 9px; }
+  .disambiguation-band { grid-template-columns: 1fr; gap: 18px; }
+  .disambiguation-band h2 { font-size: 33px; }
+  .footer-inner { gap: 24px; }
+  .footer-colophon { font-size: 9px; }
+}

app/layout.tsx

@@ -5,6 +5,7 @@ import { SiteHeader } from '@/app/components/SiteHeader'
 import { ELLA_GLOBAL_SCHEMA, ELLA_ORG_SCHEMA } from '@/app/schema/ella'
 import { ELLA_POSITIONING } from '@/lib/ella-positioning'
 import './globals.css'
+import './identity-design.css'
 
 const display = Young_Serif({
   weight: '400',