Buckets:
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> | |
| <meta name="referrer" content="strict-origin-when-cross-origin"> | |
| <title>Rewriting the Code of Aging</title> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=JetBrains+Mono:wght@400;500;600&family=Inter+Tight:wght@300;400;500;600;700&display=swap" rel="stylesheet"> | |
| <style> | |
| /* ========================================================== | |
| ROOT TOKENS | |
| ========================================================== */ | |
| :root { | |
| --bg-0: #050a14; | |
| --bg-1: #0a1428; | |
| --ink: #f8fafc; | |
| --ink-dim: #cbd5e1; | |
| --ink-faint: #64748b; | |
| --teal: #0ea5a4; | |
| --teal-glow: #14d6d3; | |
| --teal-deep: #0f766e; | |
| --amber: #f59e0b; | |
| --amber-glow: #fcd34d; | |
| --red: #ef4444; | |
| --red-deep: #b91c1c; | |
| --hairline: rgba(148, 163, 184, 0.18); | |
| --grid: rgba(20, 214, 211, 0.06); | |
| } | |
| * { box-sizing: border-box; margin: 0; padding: 0; } | |
| html, body { height: 100%; overflow: hidden; } | |
| body { | |
| background: var(--bg-0); | |
| color: var(--ink); | |
| font-family: 'Inter Tight', sans-serif; | |
| background-image: | |
| radial-gradient(ellipse at 30% 20%, rgba(14, 165, 164, 0.10) 0%, transparent 60%), | |
| radial-gradient(ellipse at 80% 80%, rgba(245, 158, 11, 0.06) 0%, transparent 50%), | |
| linear-gradient(180deg, var(--bg-1) 0%, var(--bg-0) 100%); | |
| background-attachment: fixed; | |
| } | |
| body::before { | |
| content: ''; | |
| position: fixed; | |
| inset: 0; | |
| background-image: | |
| linear-gradient(var(--grid) 1px, transparent 1px), | |
| linear-gradient(90deg, var(--grid) 1px, transparent 1px); | |
| background-size: 40px 40px; | |
| pointer-events: none; | |
| z-index: 0; | |
| mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%); | |
| -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%); | |
| } | |
| /* ========================================================== | |
| STAGE | |
| ========================================================== */ | |
| .stage { | |
| position: fixed; | |
| inset: 0; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| z-index: 1; | |
| } | |
| .slide-wrapper { | |
| width: 1600px; | |
| height: 900px; | |
| transform-origin: center center; | |
| position: relative; | |
| } | |
| .slide { | |
| position: absolute; | |
| inset: 0; | |
| opacity: 0; | |
| transform: translateX(40px); | |
| transition: opacity 0.5s ease, transform 0.55s ease; | |
| pointer-events: none; | |
| } | |
| .slide.active { | |
| opacity: 1; | |
| transform: translateX(0); | |
| pointer-events: auto; | |
| } | |
| .slide.before-active { | |
| transform: translateX(-40px); | |
| } | |
| .slide-frame { | |
| width: 100%; | |
| height: 100%; | |
| padding: 60px 80px 80px; /* bottom padding for slide-foot space */ | |
| display: flex; | |
| flex-direction: column; | |
| position: relative; | |
| } | |
| .slide-frame::before, .slide-frame::after { | |
| content: ''; | |
| position: absolute; | |
| width: 24px; height: 24px; | |
| border: 1px solid var(--teal); | |
| opacity: 0.5; | |
| } | |
| .slide-frame::before { top: 24px; left: 24px; border-right: none; border-bottom: none; } | |
| .slide-frame::after { bottom: 24px; right: 24px; border-left: none; border-top: none; } | |
| .slide-foot { | |
| position: absolute; | |
| bottom: 36px; | |
| left: 80px; | |
| right: 80px; | |
| display: flex; | |
| justify-content: space-between; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.15em; | |
| text-transform: uppercase; | |
| } | |
| /* ========================================================== | |
| TYPOGRAPHY | |
| ========================================================== */ | |
| h1, h2, h3 { | |
| font-family: 'Fraunces', serif; | |
| color: var(--ink); | |
| text-transform: none; | |
| letter-spacing: -0.01em; | |
| line-height: 1.05; | |
| } | |
| em.glow { font-style: italic; color: var(--teal-glow); font-weight: 400; } | |
| em.amber { font-style: italic; color: var(--amber-glow); font-weight: 400; } | |
| p { line-height: 1.5; color: var(--ink-dim); } | |
| .mono { font-family: 'JetBrains Mono', monospace; } | |
| strong { color: var(--ink); font-weight: 500; } | |
| /* shared content header */ | |
| .eyebrow-line { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--teal); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 18px; | |
| text-transform: uppercase; | |
| } | |
| .content-title { | |
| font-size: 48px; | |
| font-weight: 600; | |
| margin-bottom: 10px; | |
| } | |
| .content-sub { | |
| font-size: 18px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| margin-bottom: 32px; | |
| } | |
| /* ========================================================== | |
| SLIDE 1: Title cover | |
| ========================================================== */ | |
| .cv-eyebrow { | |
| display: flex; | |
| align-items: center; | |
| gap: 14px; | |
| margin-top: 60px; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 13px; | |
| font-weight: 500; | |
| letter-spacing: 0.28em; | |
| color: var(--amber); | |
| text-transform: uppercase; | |
| } | |
| .cv-dot { | |
| display: inline-block; | |
| width: 12px; height: 12px; | |
| background: var(--amber); | |
| border-radius: 50%; | |
| } | |
| .cv-h1 { | |
| font-size: 96px; | |
| font-weight: 600; | |
| line-height: 1; | |
| margin-top: 80px; | |
| } | |
| .cv-sub { | |
| font-size: 28px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| margin-top: 28px; | |
| max-width: 1200px; | |
| line-height: 1.4; | |
| } | |
| .cv-rule { | |
| width: 80px; | |
| height: 3px; | |
| background: var(--amber); | |
| margin-top: 80px; | |
| } | |
| .cv-byline { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| letter-spacing: 0.1em; | |
| margin-top: 18px; | |
| } | |
| /* ========================================================== | |
| SLIDE 2: The moment | |
| ========================================================== */ | |
| .moment-eyebrow { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 13px; | |
| font-weight: 500; | |
| letter-spacing: 0.28em; | |
| color: var(--amber); | |
| margin-top: 60px; | |
| } | |
| .moment-line1 { | |
| font-family: 'Fraunces', serif; | |
| font-size: 56px; | |
| font-weight: 400; | |
| color: var(--ink); | |
| line-height: 1.15; | |
| letter-spacing: -0.01em; | |
| margin-top: 100px; | |
| max-width: 1320px; | |
| } | |
| .moment-pull { | |
| font-family: 'Fraunces', serif; | |
| font-size: 36px; | |
| font-style: italic; | |
| color: var(--amber-glow); | |
| margin-top: 60px; | |
| } | |
| .moment-foot { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 14px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.1em; | |
| margin-top: auto; | |
| margin-bottom: 40px; | |
| } | |
| /* ========================================================== | |
| SLIDE 3: Roadmap | |
| ========================================================== */ | |
| .rm-list { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 14px; | |
| margin-top: 12px; | |
| } | |
| .rm-item { | |
| display: flex; | |
| gap: 28px; | |
| align-items: baseline; | |
| } | |
| .rm-num { | |
| font-family: 'Fraunces', serif; | |
| font-size: 32px; | |
| font-weight: 600; | |
| color: var(--teal); | |
| min-width: 60px; | |
| } | |
| .rm-text { flex: 1; } | |
| .rm-title { | |
| font-size: 22px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| } | |
| .rm-desc { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| margin-top: 2px; | |
| } | |
| /* ========================================================== | |
| SLIDE 4 / 8 / 11 / 16 / 18 / 21: Section dividers | |
| ========================================================== */ | |
| .section-divider .sd-frame { | |
| justify-content: center; | |
| } | |
| .sd-rule { | |
| width: 60px; | |
| height: 4px; | |
| background: var(--amber); | |
| margin-bottom: 32px; | |
| } | |
| .sd-part { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 18px; | |
| font-weight: 600; | |
| color: var(--amber); | |
| letter-spacing: 0.4em; | |
| margin-bottom: 24px; | |
| } | |
| .sd-title { | |
| font-size: 96px; | |
| font-weight: 600; | |
| line-height: 1; | |
| margin-bottom: 28px; | |
| } | |
| .sd-title-huge { font-size: 140px; } | |
| .sd-sub { | |
| font-size: 26px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| max-width: 1200px; | |
| line-height: 1.4; | |
| } | |
| /* ========================================================== | |
| Two-column compare (slides 5, 10) | |
| ========================================================== */ | |
| .cmp-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| gap: 26px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .cmp-col { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| padding: 30px 36px; | |
| position: relative; | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| .cmp-bar { | |
| position: absolute; | |
| top: 0; left: 0; bottom: 0; | |
| width: 5px; | |
| } | |
| .cmp-red .cmp-bar { background: var(--red); } | |
| .cmp-teal .cmp-bar { background: var(--teal-glow); } | |
| .cmp-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| letter-spacing: 0.25em; | |
| margin-bottom: 14px; | |
| text-transform: uppercase; | |
| } | |
| .cmp-red .cmp-label { color: var(--red); } | |
| .cmp-teal .cmp-label { color: var(--teal); } | |
| .cmp-heading { | |
| font-size: 30px; | |
| font-weight: 600; | |
| margin-bottom: 22px; | |
| line-height: 1.15; | |
| } | |
| .cmp-body { | |
| font-size: 17px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| margin-bottom: 28px; | |
| flex: 1; | |
| } | |
| .cmp-body p { font-size: 17px; } | |
| .cmp-image { | |
| width: 100%; | |
| height: 210px; | |
| margin: 0 0 22px; | |
| padding: 12px; | |
| background: rgba(15, 29, 58, 0.32); | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| } | |
| .cmp-image img { | |
| max-width: 100%; | |
| max-height: 100%; | |
| object-fit: contain; | |
| display: block; | |
| } | |
| .cmp-image.cmp-image-pair { | |
| gap: 14px; | |
| } | |
| .cmp-image.cmp-image-pair img { | |
| max-width: calc(50% - 7px); | |
| } | |
| .cmp-tagline { | |
| font-family: 'Fraunces', serif; | |
| font-size: 18px; | |
| font-style: italic; | |
| margin-top: auto; | |
| font-weight: 500; | |
| } | |
| .cmp-red .cmp-tagline { color: var(--red); } | |
| .cmp-teal .cmp-tagline { color: var(--teal-glow); } | |
| /* ========================================================== | |
| Timeline (slide 6) | |
| ========================================================== */ | |
| .tl-track-wrap { | |
| position: relative; | |
| flex: 1; | |
| display: flex; | |
| align-items: center; | |
| padding: 0 40px; | |
| } | |
| .tl-grid { | |
| display: flex; | |
| align-items: stretch; | |
| width: 100%; | |
| position: relative; | |
| } | |
| .tl-milestone { | |
| flex: 1; | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| text-align: center; | |
| padding: 0 10px; | |
| position: relative; | |
| z-index: 2; | |
| } | |
| .tl-milestone:not(:last-child)::after { | |
| /* connector line to next milestone */ | |
| content: ''; | |
| position: absolute; | |
| top: 64px; /* aligns with dot center: year(32px) + margin(18px) + half dot(9px) */ | |
| left: 50%; | |
| right: -50%; | |
| height: 2px; | |
| background: var(--teal); | |
| opacity: 0.5; | |
| z-index: 1; | |
| } | |
| .tl-year { | |
| font-family: 'Fraunces', serif; | |
| font-size: 32px; | |
| font-weight: 600; | |
| color: var(--teal); | |
| margin-bottom: 18px; | |
| line-height: 1; | |
| } | |
| .tl-dot-wrap { | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| margin-bottom: 18px; | |
| height: 18px; | |
| position: relative; | |
| z-index: 3; | |
| /* small bg circle to break the line cleanly */ | |
| } | |
| .tl-dot { | |
| width: 18px; | |
| height: 18px; | |
| background: var(--amber); | |
| border: 2px solid var(--teal); | |
| border-radius: 50%; | |
| position: relative; | |
| z-index: 3; | |
| box-shadow: 0 0 0 6px var(--bg-0); /* mask the line under the dot */ | |
| } | |
| .tl-who { | |
| font-size: 16px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 4px; | |
| } | |
| .tl-what { | |
| font-size: 14px; | |
| color: var(--teal-glow); | |
| font-style: italic; | |
| margin-bottom: 14px; | |
| } | |
| .tl-desc { | |
| font-size: 13px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| /* ========================================================== | |
| Numbered steps (slide 7) | |
| ========================================================== */ | |
| .ns-list { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 22px; | |
| margin-bottom: 28px; | |
| } | |
| .ns-step { | |
| display: flex; | |
| gap: 24px; | |
| align-items: flex-start; | |
| } | |
| .ns-num { | |
| flex-shrink: 0; | |
| width: 56px; height: 56px; | |
| border-radius: 50%; | |
| background: var(--teal); | |
| color: var(--bg-0); | |
| font-family: 'Fraunces', serif; | |
| font-size: 28px; | |
| font-weight: 600; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| } | |
| .ns-title { | |
| font-size: 22px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 4px; | |
| } | |
| .ns-desc { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| .ns-foot { | |
| background: var(--bg-0); | |
| padding: 14px 24px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 14px; | |
| font-style: italic; | |
| color: var(--ink-dim); | |
| text-align: center; | |
| margin-top: auto; | |
| border-radius: 2px; | |
| } | |
| /* ========================================================== | |
| Four stat cards (slide 9) | |
| ========================================================== */ | |
| .fs-grid { | |
| display: grid; | |
| grid-template-columns: repeat(4, 1fr); | |
| gap: 18px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .fs-card { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| border-top: 3px solid var(--teal); | |
| padding: 28px 26px; | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| .fs-stat { | |
| font-family: 'Fraunces', serif; | |
| font-size: 38px; | |
| font-weight: 600; | |
| color: var(--teal); | |
| margin-bottom: 12px; | |
| } | |
| .fs-label { | |
| font-size: 18px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 14px; | |
| } | |
| .fs-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| .fs-insight { | |
| background: var(--bg-0); | |
| padding: 18px 28px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 17px; | |
| font-style: italic; | |
| color: var(--ink); | |
| margin-top: 26px; | |
| border-radius: 2px; | |
| } | |
| /* ========================================================== | |
| ER-100 overview (slide 12) | |
| ========================================================== */ | |
| .er-grid { | |
| display: grid; | |
| grid-template-columns: 380px 1fr; | |
| gap: 36px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .er-bigstat { | |
| background: var(--bg-0); | |
| padding: 30px 36px; | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| .er-bigstat-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| color: var(--amber); | |
| letter-spacing: 0.3em; | |
| margin-bottom: 16px; | |
| } | |
| .er-bigstat-value { | |
| font-family: 'Fraunces', serif; | |
| font-size: 64px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| line-height: 1; | |
| margin-bottom: 14px; | |
| } | |
| .er-bigstat-desc { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| margin-bottom: auto; | |
| line-height: 1.45; | |
| } | |
| .er-bigstat-rule { | |
| width: 36px; | |
| height: 2px; | |
| background: var(--amber); | |
| margin: 22px 0 10px; | |
| } | |
| .er-bigstat-clinid { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| color: var(--ink-dim); | |
| letter-spacing: 0.05em; | |
| margin-bottom: 14px; | |
| } | |
| .er-bigstat-foot { | |
| font-family: 'Fraunces', serif; | |
| font-size: 12px; | |
| color: var(--ink-faint); | |
| font-style: italic; | |
| line-height: 1.5; | |
| } | |
| .er-details { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 11px; | |
| } | |
| .er-detail { | |
| background: linear-gradient(90deg, rgba(15, 29, 58, 0.7) 0%, rgba(10, 20, 40, 0.4) 100%); | |
| border: 1px solid var(--hairline); | |
| display: flex; | |
| align-items: stretch; | |
| border-radius: 2px; | |
| } | |
| .er-bar { | |
| width: 4px; | |
| background: var(--teal); | |
| flex-shrink: 0; | |
| } | |
| .er-detail-text { padding: 14px 22px; flex: 1; } | |
| .er-detail-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--teal); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 6px; | |
| } | |
| .er-detail-value { | |
| font-size: 16px; | |
| color: var(--ink); | |
| line-height: 1.4; | |
| } | |
| /* ========================================================== | |
| Six-tile grid (slide 13) | |
| ========================================================== */ | |
| .st-grid { | |
| display: grid; | |
| grid-template-columns: repeat(3, 1fr); | |
| grid-template-rows: 1fr 1fr; | |
| gap: 18px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .st-tile { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| padding: 26px 28px; | |
| } | |
| .st-tile-head { | |
| display: flex; | |
| align-items: center; | |
| gap: 12px; | |
| margin-bottom: 14px; | |
| } | |
| .st-dot { | |
| width: 12px; height: 12px; | |
| background: var(--amber); | |
| border-radius: 50%; | |
| flex-shrink: 0; | |
| } | |
| .st-title { | |
| font-size: 20px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| } | |
| .st-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| } | |
| /* ========================================================== | |
| Two-column outcomes (slide 14) | |
| ========================================================== */ | |
| .oc-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| gap: 26px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .oc-col { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| padding: 30px 36px; | |
| position: relative; | |
| } | |
| .oc-bar { | |
| position: absolute; | |
| top: 0; left: 0; bottom: 0; | |
| width: 4px; | |
| } | |
| .oc-teal .oc-bar { background: var(--teal); } | |
| .oc-gray .oc-bar { background: var(--ink-faint); } | |
| .oc-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| letter-spacing: 0.25em; | |
| margin-bottom: 14px; | |
| text-transform: uppercase; | |
| } | |
| .oc-teal .oc-label { color: var(--teal); } | |
| .oc-gray .oc-label { color: var(--ink-faint); } | |
| .oc-heading { | |
| font-size: 30px; | |
| font-weight: 600; | |
| margin-bottom: 28px; | |
| line-height: 1.15; | |
| } | |
| .oc-bullets { | |
| list-style: none; | |
| display: flex; | |
| flex-direction: column; | |
| gap: 16px; | |
| } | |
| .oc-bullets li { | |
| font-size: 16px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| padding-left: 20px; | |
| position: relative; | |
| } | |
| .oc-bullets li::before { | |
| content: '→'; | |
| position: absolute; | |
| left: 0; | |
| color: var(--teal-glow); | |
| font-weight: bold; | |
| } | |
| .oc-gray .oc-bullets li::before { | |
| color: var(--ink-faint); | |
| } | |
| /* ========================================================== | |
| Comparison table (slide 15) | |
| ========================================================== */ | |
| .tbl { | |
| flex: 1; | |
| display: flex; | |
| flex-direction: column; | |
| border: 1px solid var(--hairline); | |
| border-radius: 2px; | |
| overflow: hidden; | |
| min-height: 0; | |
| } | |
| .tbl-row { | |
| display: grid; | |
| grid-template-columns: 250px 1fr 1fr; | |
| border-bottom: 1px solid var(--hairline); | |
| } | |
| .tbl-row:last-child { border-bottom: none; } | |
| .tbl-row.tbl-head { | |
| background: var(--bg-0); | |
| } | |
| .tbl-row.tbl-head .tbl-cell { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| color: var(--ink); | |
| letter-spacing: 0.15em; | |
| text-transform: uppercase; | |
| font-weight: 600; | |
| padding: 16px 22px; | |
| } | |
| .tbl-cell { | |
| padding: 16px 22px; | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| border-right: 1px solid var(--hairline); | |
| } | |
| .tbl-cell:last-child { border-right: none; } | |
| .tbl-cell-key { | |
| background: rgba(14, 165, 164, 0.06); | |
| color: var(--teal); | |
| font-weight: 600; | |
| } | |
| .tbl-foot { | |
| margin-top: 18px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| text-align: center; | |
| line-height: 1.5; | |
| } | |
| .delivery-table .tbl-row { | |
| grid-template-columns: 1.05fr 1.25fr 1fr 1.45fr; | |
| } | |
| .delivery-table .tbl-cell { | |
| font-size: 16px; | |
| } | |
| .delivery-table .tbl-row.tbl-head .tbl-cell { | |
| font-size: 11px; | |
| } | |
| .delivery-table .tbl-cell-key { | |
| color: var(--amber); | |
| } | |
| /* ========================================================== | |
| Companies table (slide 17) | |
| ========================================================== */ | |
| .ct { | |
| flex: 1; | |
| display: flex; | |
| flex-direction: column; | |
| min-height: 0; | |
| } | |
| .ct-row { | |
| display: grid; | |
| grid-template-columns: 220px 1fr 200px 230px; | |
| border-bottom: 1px solid var(--hairline); | |
| align-items: center; | |
| } | |
| .ct-row.ct-head { | |
| background: var(--bg-0); | |
| border-bottom: 2px solid var(--teal); | |
| } | |
| .ct-cell { | |
| padding: 14px 20px; | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.4; | |
| } | |
| .ct-row.ct-head .ct-cell { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink); | |
| letter-spacing: 0.2em; | |
| font-weight: 600; | |
| padding: 14px 20px; | |
| } | |
| .ct-c1 { | |
| font-weight: 600; | |
| color: var(--ink); | |
| font-size: 15px; | |
| } | |
| .ct-stage { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| letter-spacing: 0.05em; | |
| font-weight: 600; | |
| } | |
| .ct-row.ct-hi .ct-stage { color: var(--teal-glow); } | |
| .ct-row:not(.ct-hi):not(.ct-head) .ct-stage { color: var(--ink-faint); } | |
| .ct-c4 { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| color: var(--ink-faint); | |
| font-style: italic; | |
| } | |
| /* ========================================================== | |
| Nine-tile grid (slide 19) | |
| ========================================================== */ | |
| .nt-grid { | |
| display: grid; | |
| grid-template-columns: repeat(3, 1fr); | |
| grid-template-rows: repeat(3, 1fr); | |
| gap: 12px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .nt-tile { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| padding: 18px 22px; | |
| position: relative; | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| } | |
| .nt-bar { | |
| position: absolute; | |
| top: 0; left: 0; bottom: 0; | |
| width: 3px; | |
| background: var(--teal); | |
| } | |
| .nt-title { | |
| font-size: 17px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 6px; | |
| } | |
| .nt-what { | |
| font-size: 13px; | |
| color: var(--ink-dim); | |
| line-height: 1.4; | |
| flex: 1; | |
| margin-bottom: 8px; | |
| } | |
| .nt-meta { | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| font-family: 'JetBrains Mono', monospace; | |
| } | |
| .nt-meta strong { color: var(--teal); font-weight: 600; } | |
| /* ========================================================== | |
| Three-stage flow (slide 20) | |
| ========================================================== */ | |
| .tsf-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 50px 1.2fr 50px 1fr; | |
| gap: 0; | |
| flex: 1; | |
| min-height: 0; | |
| align-items: stretch; | |
| } | |
| .tsf-stage { | |
| padding: 28px 30px; | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| .tsf-light { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| } | |
| .tsf-dark { | |
| background: var(--bg-0); | |
| color: var(--ink); | |
| } | |
| .tsf-arrow { | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| font-size: 28px; | |
| color: var(--teal); | |
| font-weight: 600; | |
| } | |
| .tsf-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 12px; | |
| } | |
| .tsf-label-amber { color: var(--amber); } | |
| .tsf-heading { | |
| font-size: 24px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 18px; | |
| } | |
| .tsf-heading-light { color: var(--ink); } | |
| .tsf-items { | |
| list-style: none; | |
| display: flex; | |
| flex-direction: column; | |
| gap: 10px; | |
| } | |
| .tsf-items li { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| padding-left: 18px; | |
| position: relative; | |
| } | |
| .tsf-items li::before { | |
| content: '•'; | |
| position: absolute; | |
| left: 0; | |
| color: var(--teal); | |
| } | |
| .tsf-body { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| margin-bottom: 18px; | |
| flex: 1; | |
| } | |
| .tsf-stage.has-video .tsf-body { | |
| flex: 0 0 auto; | |
| font-size: 14px; | |
| margin-bottom: 14px; | |
| line-height: 1.45; | |
| } | |
| .tsf-video { | |
| flex: 1; | |
| min-height: 0; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| margin-bottom: 12px; | |
| } | |
| .tsf-video-link { | |
| width: 100%; | |
| aspect-ratio: 16 / 9; | |
| max-height: 100%; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: #000; | |
| display: block; | |
| overflow: hidden; | |
| } | |
| .tsf-video-link img { | |
| width: 100%; | |
| height: 100%; | |
| object-fit: cover; | |
| display: block; | |
| } | |
| .tsf-tagline { | |
| font-family: 'Fraunces', serif; | |
| font-size: 14px; | |
| font-style: italic; | |
| color: var(--amber); | |
| margin-top: auto; | |
| } | |
| .tsf-insight { | |
| margin-top: 22px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 17px; | |
| font-style: italic; | |
| color: var(--teal-glow); | |
| text-align: center; | |
| line-height: 1.4; | |
| } | |
| /* ========================================================== | |
| Pyramid (slide 22) | |
| ========================================================== */ | |
| .py-stack { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| gap: 10px; | |
| flex: 1; | |
| justify-content: center; | |
| } | |
| .py-layer { | |
| padding: 18px 32px; | |
| border-radius: 2px; | |
| color: white; | |
| text-align: left; | |
| } | |
| .py-name { | |
| font-size: 17px; | |
| font-weight: 700; | |
| margin-bottom: 6px; | |
| } | |
| .py-desc { | |
| font-size: 13px; | |
| line-height: 1.45; | |
| opacity: 0.95; | |
| } | |
| .py-insight { | |
| margin-top: 22px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 14px; | |
| font-style: italic; | |
| color: var(--ink-dim); | |
| text-align: center; | |
| } | |
| /* ========================================================== | |
| Longevity Genes — slide 23 (defense system) | |
| ========================================================== */ | |
| .lg-eyebrow { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 13px; | |
| font-weight: 500; | |
| letter-spacing: 0.28em; | |
| color: var(--amber); | |
| text-transform: uppercase; | |
| margin-bottom: 28px; | |
| display: flex; | |
| align-items: center; | |
| gap: 14px; | |
| } | |
| .lg-dot { | |
| display: inline-block; | |
| width: 12px; height: 12px; | |
| background: var(--amber); | |
| border-radius: 50%; | |
| } | |
| .lg-h1-big { | |
| font-size: 70px; | |
| font-weight: 600; | |
| margin-bottom: 24px; | |
| line-height: 1.05; | |
| } | |
| .lg-h1-mid { | |
| font-size: 48px; | |
| font-weight: 600; | |
| margin-bottom: 12px; | |
| line-height: 1.05; | |
| } | |
| .lg-lede { | |
| font-size: 22px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| max-width: 1200px; | |
| margin-bottom: 36px; | |
| } | |
| .lg-defense-slide .lg-lede { | |
| margin-bottom: 18px; | |
| } | |
| .lg-defense-image { | |
| width: min(760px, 100%); | |
| margin: 0 auto 20px; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: rgba(5, 10, 20, 0.45); | |
| padding: 10px; | |
| } | |
| .lg-defense-image img { | |
| display: block; | |
| width: 100%; | |
| max-height: 180px; | |
| object-fit: contain; | |
| border-radius: 3px; | |
| } | |
| .lg-sub { | |
| font-size: 17px; | |
| color: var(--ink-dim); | |
| margin-bottom: 30px; | |
| font-style: italic; | |
| } | |
| .lg-stat-row { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr 1fr; | |
| gap: 22px; | |
| margin-bottom: 24px; | |
| } | |
| .lg-stat { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.5) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| border-top: 2px solid var(--teal); | |
| padding: 22px 26px; | |
| } | |
| .lg-stat-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.2em; | |
| margin-bottom: 12px; | |
| } | |
| .lg-stat-heading { | |
| font-family: 'Fraunces', serif; | |
| font-size: 26px; | |
| color: var(--ink); | |
| margin-bottom: 10px; | |
| line-height: 1.15; | |
| } | |
| .lg-stat-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| .lg-insight-banner { | |
| margin-top: auto; | |
| margin-bottom: 8px; | |
| padding: 22px 30px; | |
| background: linear-gradient(90deg, rgba(20, 214, 211, 0.1) 0%, rgba(20, 214, 211, 0) 100%); | |
| border-left: 3px solid var(--teal-glow); | |
| } | |
| .lg-insight-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--teal-glow); | |
| letter-spacing: 0.3em; | |
| margin-bottom: 8px; | |
| } | |
| .lg-insight-text { | |
| font-family: 'Fraunces', serif; | |
| font-size: 20px; | |
| color: var(--ink); | |
| font-style: italic; | |
| line-height: 1.4; | |
| } | |
| /* ========================================================== | |
| Longevity Genes — slide 24 (three families) | |
| ========================================================== */ | |
| .lg-gene-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr 1fr; | |
| gap: 20px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .lg-gene-col { | |
| background: linear-gradient(180deg, rgba(15, 29, 58, 0.55) 0%, rgba(10, 20, 40, 0.3) 100%); | |
| border: 1px solid var(--hairline); | |
| padding: 26px 26px; | |
| display: flex; | |
| flex-direction: column; | |
| position: relative; | |
| } | |
| .lg-gene-col::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; left: 0; right: 0; | |
| height: 2px; | |
| background: var(--teal); | |
| } | |
| .lg-gene-col[data-gene="sirtuins"]::before { background: var(--teal-glow); } | |
| .lg-gene-col[data-gene="ampk"]::before { background: var(--teal); } | |
| .lg-gene-col[data-gene="mtor"]::before { background: var(--teal-deep); } | |
| .lg-gene-num { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 10px; | |
| } | |
| .lg-gene-name { | |
| font-family: 'Fraunces', serif; | |
| font-size: 36px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| line-height: 1; | |
| margin-bottom: 6px; | |
| } | |
| .lg-gene-full { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--teal-glow); | |
| letter-spacing: 0.05em; | |
| margin-bottom: 14px; | |
| } | |
| .lg-gene-image { | |
| margin-bottom: 16px; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| overflow: hidden; | |
| background: rgba(5, 10, 20, 0.45); | |
| } | |
| .lg-gene-image img { | |
| display: block; | |
| width: 100%; | |
| height: 130px; | |
| object-fit: cover; | |
| } | |
| .lg-gene-role { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| margin-bottom: 22px; | |
| } | |
| .lg-gene-act { | |
| margin-top: auto; | |
| padding-top: 16px; | |
| border-top: 1px dashed var(--hairline); | |
| } | |
| .lg-gene-act-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 9px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.2em; | |
| margin-bottom: 6px; | |
| } | |
| .lg-gene-act-text { | |
| font-family: 'Fraunces', serif; | |
| font-size: 15px; | |
| color: var(--amber-glow); | |
| font-style: italic; | |
| line-height: 1.4; | |
| } | |
| .lg-pattern-strip { | |
| margin-top: 22px; | |
| padding: 16px 26px; | |
| background: rgba(245, 158, 11, 0.05); | |
| border-left: 3px solid var(--amber); | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| font-style: italic; | |
| line-height: 1.5; | |
| } | |
| .lg-pattern-strip strong { color: var(--amber-glow); font-weight: 600; font-style: normal; } | |
| /* ========================================================== | |
| Longevity Genes — slide 25 (treadmill story) | |
| ========================================================== */ | |
| .lg-treadmill-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| gap: 50px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .lg-tm-left, .lg-tm-right { | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: center; | |
| } | |
| .lg-quote-block { | |
| position: relative; | |
| padding: 30px 36px 30px 56px; | |
| background: linear-gradient(135deg, rgba(20, 214, 211, 0.08) 0%, rgba(15, 29, 58, 0.4) 100%); | |
| border-left: 3px solid var(--teal-glow); | |
| } | |
| .lg-quote-block::before { | |
| content: '"'; | |
| position: absolute; | |
| top: -8px; | |
| left: 16px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 80px; | |
| color: var(--teal-glow); | |
| line-height: 1; | |
| opacity: 0.5; | |
| } | |
| .lg-quote-text { | |
| font-family: 'Fraunces', serif; | |
| font-size: 21px; | |
| line-height: 1.45; | |
| color: var(--ink); | |
| font-style: italic; | |
| margin-bottom: 18px; | |
| } | |
| .lg-attrib { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.15em; | |
| text-transform: uppercase; | |
| } | |
| .lg-attrib::before { | |
| content: '— '; | |
| color: var(--teal-glow); | |
| } | |
| .lg-stat-stack { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 12px; | |
| } | |
| .lg-stat-big { | |
| display: flex; | |
| align-items: baseline; | |
| gap: 16px; | |
| padding: 18px 0; | |
| border-bottom: 1px solid var(--hairline); | |
| } | |
| .lg-stat-big:last-child { border-bottom: none; } | |
| .lg-stat-num { | |
| font-family: 'Fraunces', serif; | |
| font-size: 52px; | |
| font-weight: 600; | |
| color: var(--teal-glow); | |
| line-height: 1; | |
| flex-shrink: 0; | |
| min-width: 110px; | |
| } | |
| .lg-stat-num.amber { color: var(--amber-glow); } | |
| .lg-stat-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| .lg-takeaway { | |
| margin-top: 22px; | |
| padding: 16px 22px; | |
| background: rgba(245, 158, 11, 0.08); | |
| border: 1px solid rgba(245, 158, 11, 0.3); | |
| } | |
| .lg-tk-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--amber); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 6px; | |
| } | |
| .lg-tk-text { | |
| font-family: 'Fraunces', serif; | |
| font-size: 15px; | |
| font-style: italic; | |
| color: var(--ink); | |
| line-height: 1.4; | |
| } | |
| /* ========================================================== | |
| Age vision (slide 26) | |
| ========================================================== */ | |
| .av-list { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 18px; | |
| flex: 1; | |
| justify-content: center; | |
| } | |
| .av-item { | |
| display: flex; | |
| gap: 28px; | |
| align-items: center; | |
| } | |
| .av-circle { | |
| flex-shrink: 0; | |
| width: 80px; height: 80px; | |
| border-radius: 50%; | |
| background: var(--teal); | |
| color: var(--ink); | |
| font-family: 'Fraunces', serif; | |
| font-size: 18px; | |
| font-weight: 600; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| } | |
| .av-text { flex: 1; } | |
| .av-what { | |
| font-size: 22px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 4px; | |
| } | |
| .av-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| /* ========================================================== | |
| Closing (slide 27) | |
| ========================================================== */ | |
| .cl-eyebrow { | |
| display: flex; | |
| align-items: center; | |
| gap: 14px; | |
| margin-top: 60px; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 13px; | |
| font-weight: 500; | |
| letter-spacing: 0.28em; | |
| color: var(--amber); | |
| } | |
| .cl-line { | |
| font-family: 'Fraunces', serif; | |
| font-size: 28px; | |
| color: var(--ink-dim); | |
| margin-top: 28px; | |
| line-height: 1.4; | |
| } | |
| .cl-line:first-of-type { margin-top: 80px; } | |
| .cl-headline { | |
| font-family: 'Fraunces', serif; | |
| font-size: 62px; | |
| font-weight: 600; | |
| font-style: italic; | |
| color: var(--ink); | |
| margin-top: 60px; | |
| line-height: 1.1; | |
| letter-spacing: -0.01em; | |
| } | |
| .cl-rule { | |
| width: 80px; | |
| height: 3px; | |
| background: var(--amber); | |
| margin-top: 50px; | |
| } | |
| .cl-thanks { | |
| font-family: 'Fraunces', serif; | |
| font-size: 38px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-top: 24px; | |
| } | |
| .cl-sub { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| letter-spacing: 0.1em; | |
| font-style: italic; | |
| margin-top: 12px; | |
| } | |
| /* ========================================================== | |
| Horvath Clock dedicated slide | |
| ========================================================== */ | |
| .hc-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1.05fr; | |
| gap: 50px; | |
| flex: 1; | |
| min-height: 0; | |
| align-items: center; | |
| } | |
| .hc-image-col { | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| height: 100%; | |
| } | |
| .hc-image-col img { | |
| max-width: 100%; | |
| max-height: 540px; | |
| object-fit: contain; | |
| border-radius: 6px; | |
| box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6), | |
| 0 0 0 1px var(--hairline); | |
| } | |
| .hc-points { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 22px; | |
| } | |
| .hc-point { | |
| border-left: 3px solid var(--teal); | |
| padding-left: 22px; | |
| } | |
| .hc-point-label { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--amber); | |
| letter-spacing: 0.25em; | |
| margin-bottom: 6px; | |
| } | |
| .hc-point-title { | |
| font-family: 'Fraunces', serif; | |
| font-size: 22px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 8px; | |
| line-height: 1.2; | |
| } | |
| .hc-point-desc { | |
| font-size: 15px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| } | |
| .hc-point-desc strong { color: var(--teal-glow); font-weight: 600; } | |
| .hc-point-desc em { color: var(--amber-glow); font-style: italic; } | |
| /* ========================================================== | |
| IMAGE INTEGRATION — shared & per-slide-type | |
| ========================================================== */ | |
| /* Numbered-steps with image (slide 7 Yamanaka) */ | |
| .numbered-slide.has-image .ns-body { | |
| display: grid; | |
| grid-template-columns: 1.4fr 1fr; | |
| gap: 36px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .numbered-slide:not(.has-image) .ns-body { | |
| flex: 1; | |
| } | |
| .ns-image-col { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| justify-content: center; | |
| gap: 12px; | |
| } | |
| .ns-image-col img { | |
| max-width: 100%; | |
| max-height: 400px; | |
| object-fit: contain; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: rgba(15, 29, 58, 0.4); | |
| padding: 12px; | |
| } | |
| .ns-image-caption { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| text-align: center; | |
| max-width: 320px; | |
| line-height: 1.4; | |
| letter-spacing: 0.05em; | |
| } | |
| /* Four-stat cards with image strip (slide 10 Horvath) */ | |
| .four-stat-slide.has-image .fs-grid { | |
| flex: 0 0 auto; | |
| } | |
| .fs-image-strip { | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| gap: 18px; | |
| margin: 18px 0 12px; | |
| padding: 10px 16px; | |
| background: rgba(15, 29, 58, 0.3); | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| } | |
| .fs-image-strip img { | |
| max-height: 90px; | |
| max-width: 280px; | |
| object-fit: contain; | |
| } | |
| .fs-image-caption { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.05em; | |
| line-height: 1.4; | |
| flex: 1; | |
| max-width: 540px; | |
| } | |
| /* Three-stage flow with image in upstream stage (slide 22 Info Theory) */ | |
| .tsf-image { | |
| margin-top: 14px; | |
| padding: 8px; | |
| background: rgba(15, 29, 58, 0.4); | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| display: flex; | |
| justify-content: center; | |
| } | |
| .tsf-image img { | |
| max-height: 110px; | |
| max-width: 100%; | |
| object-fit: contain; | |
| opacity: 0.85; | |
| } | |
| .tsf-support-row { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| gap: 8px; | |
| margin-top: 10px; | |
| } | |
| .tsf-support-image { | |
| background: rgba(15, 29, 58, 0.32); | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| padding: 6px; | |
| min-height: 0; | |
| } | |
| .tsf-support-image img { | |
| width: 100%; | |
| height: 123px; | |
| object-fit: contain; | |
| display: block; | |
| opacity: 0.85; | |
| } | |
| .tsf-downstream-image { | |
| margin-top: auto; | |
| padding: 8px; | |
| background: rgba(15, 29, 58, 0.32); | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| } | |
| .tsf-downstream-image img { | |
| width: 100%; | |
| height: 150px; | |
| object-fit: contain; | |
| display: block; | |
| opacity: 0.9; | |
| } | |
| /* ========================================================== | |
| Epigenome intro slide (NEW slide 9) | |
| ========================================================== */ | |
| .ei-grid { | |
| display: grid; | |
| grid-template-columns: 1fr 1.3fr; | |
| gap: 36px; | |
| flex: 0 0 auto; | |
| min-height: 0; | |
| align-items: center; | |
| } | |
| .ei-image-col { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| gap: 14px; | |
| } | |
| .ei-image-col img { | |
| max-width: 100%; | |
| max-height: 330px; | |
| object-fit: contain; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: rgba(15, 29, 58, 0.4); | |
| padding: 16px; | |
| } | |
| .ei-image-caption { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 11px; | |
| color: var(--ink-faint); | |
| text-align: center; | |
| max-width: 320px; | |
| line-height: 1.4; | |
| letter-spacing: 0.05em; | |
| } | |
| .ei-points { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 28px; | |
| } | |
| .ei-point { | |
| border-left: 3px solid var(--teal); | |
| padding-left: 22px; | |
| } | |
| .ei-point-title { | |
| font-family: 'Fraunces', serif; | |
| font-size: 26px; | |
| font-weight: 600; | |
| color: var(--ink); | |
| margin-bottom: 8px; | |
| } | |
| .ei-point-desc { | |
| font-size: 16px; | |
| color: var(--ink-dim); | |
| line-height: 1.55; | |
| } | |
| /* ========================================================== | |
| Embedded simulator slide | |
| ========================================================== */ | |
| .simulator-slide .slide-frame { | |
| padding: 34px 48px 64px; | |
| } | |
| .simulator-iframe { | |
| width: 100%; | |
| height: 100%; | |
| flex: 1; | |
| min-height: 0; | |
| border: 1px solid var(--hairline); | |
| border-radius: 6px; | |
| background: var(--bg-0); | |
| box-shadow: 0 18px 60px rgba(0, 0, 0, 0.38); | |
| } | |
| /* ========================================================== | |
| Pipeline showcase slide (NEW slide 19 Retro) | |
| ========================================================== */ | |
| .ps-grid { | |
| display: grid; | |
| grid-template-columns: 1.4fr 1fr; | |
| gap: 40px; | |
| flex: 1; | |
| min-height: 0; | |
| align-items: center; | |
| } | |
| .ps-image-col { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| gap: 12px; | |
| } | |
| .ps-image-col img { | |
| max-width: 100%; | |
| max-height: 480px; | |
| object-fit: contain; | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: #fff; /* roadmap is light; let it breathe */ | |
| padding: 8px; | |
| } | |
| .ps-image-caption { | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.05em; | |
| } | |
| .ps-bullets { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 18px; | |
| } | |
| .ps-bullet { | |
| border-left: 2px solid var(--amber); | |
| padding-left: 18px; | |
| } | |
| .ps-bullet-name { | |
| font-family: 'Fraunces', serif; | |
| font-size: 22px; | |
| font-weight: 600; | |
| color: var(--amber-glow); | |
| margin-bottom: 4px; | |
| } | |
| .ps-bullet-desc { | |
| font-size: 14px; | |
| color: var(--ink-dim); | |
| line-height: 1.5; | |
| } | |
| .ps-insight { | |
| margin-top: 22px; | |
| font-family: 'Fraunces', serif; | |
| font-size: 16px; | |
| font-style: italic; | |
| color: var(--teal-glow); | |
| text-align: center; | |
| line-height: 1.4; | |
| } | |
| .ai-retro-grid { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 18px; | |
| flex: 1; | |
| min-height: 0; | |
| } | |
| .ai-retro-left { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 8px; | |
| } | |
| .ai-retro-text { | |
| font-size: 16px; | |
| color: var(--ink-dim); | |
| line-height: 1.45; | |
| } | |
| .ai-retro-text strong { color: var(--ink); font-weight: 600; } | |
| .ai-retro-cards { | |
| display: grid; | |
| grid-template-columns: repeat(3, 1fr); | |
| gap: 18px; | |
| } | |
| .ai-retro-card { | |
| border: 1px solid var(--hairline); | |
| border-radius: 4px; | |
| background: rgba(15, 29, 58, 0.38); | |
| padding: 14px; | |
| display: flex; | |
| flex-direction: column; | |
| gap: 10px; | |
| } | |
| .ai-retro-image-wrap { | |
| position: relative; | |
| border-radius: 3px; | |
| overflow: hidden; | |
| background: rgba(5, 10, 20, 0.5); | |
| } | |
| .ai-retro-image-wrap img { | |
| width: 100%; | |
| height: 255px; | |
| object-fit: contain; | |
| display: block; | |
| } | |
| .ai-retro-video-link { | |
| display: block; | |
| color: inherit; | |
| text-decoration: none; | |
| } | |
| .ai-retro-overlay { | |
| position: absolute; | |
| top: 12px; | |
| left: 12px; | |
| right: 12px; | |
| padding: 8px 12px; | |
| background: rgba(5, 10, 20, 0.78); | |
| border: 1px solid rgba(20, 214, 211, 0.45); | |
| border-radius: 3px; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 12px; | |
| color: var(--teal-glow); | |
| letter-spacing: 0.12em; | |
| text-transform: uppercase; | |
| text-align: center; | |
| } | |
| .ai-retro-card-title { | |
| font-family: 'Fraunces', serif; | |
| font-size: 20px; | |
| color: var(--ink); | |
| } | |
| .ai-retro-card-copy { | |
| font-size: 13px; | |
| color: var(--ink-dim); | |
| line-height: 1.45; | |
| } | |
| .ai-retro-source { | |
| margin-top: 14px; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.08em; | |
| text-transform: uppercase; | |
| } | |
| /* ========================================================== | |
| UI overlays (chrome) | |
| ========================================================== */ | |
| .controls { | |
| position: fixed; | |
| bottom: 24px; | |
| right: 24px; | |
| display: flex; | |
| gap: 8px; | |
| z-index: 10; | |
| } | |
| .ctrl-btn { | |
| width: 44px; | |
| height: 44px; | |
| background: rgba(15, 29, 58, 0.7); | |
| border: 1px solid var(--hairline); | |
| color: var(--teal-glow); | |
| font-size: 18px; | |
| cursor: pointer; | |
| backdrop-filter: blur(4px); | |
| transition: all 0.2s; | |
| border-radius: 2px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| font-family: 'JetBrains Mono', monospace; | |
| } | |
| .ctrl-btn:hover { background: rgba(20, 214, 211, 0.15); border-color: var(--teal-glow); } | |
| .ctrl-btn:disabled { opacity: 0.3; cursor: not-allowed; } | |
| .progress { | |
| position: fixed; | |
| bottom: 0; | |
| left: 0; | |
| right: 0; | |
| height: 2px; | |
| background: rgba(20, 214, 211, 0.1); | |
| z-index: 10; | |
| } | |
| .progress-fill { | |
| height: 100%; | |
| background: var(--teal-glow); | |
| box-shadow: 0 0 12px var(--teal-glow); | |
| transition: width 0.4s ease; | |
| width: 3.7%; | |
| } | |
| .hint { | |
| position: fixed; | |
| bottom: 24px; | |
| left: 24px; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| color: var(--ink-faint); | |
| letter-spacing: 0.1em; | |
| text-transform: uppercase; | |
| z-index: 10; | |
| } | |
| .hint kbd { | |
| display: inline-block; | |
| padding: 2px 7px; | |
| margin: 0 3px; | |
| background: rgba(20, 214, 211, 0.08); | |
| border: 1px solid var(--hairline); | |
| border-radius: 3px; | |
| color: var(--teal-glow); | |
| font-size: 10px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="stage"> | |
| <div class="slide-wrapper" id="wrapper"> | |
| <section class="slide active cv-title"> | |
| <div class="slide-frame full-bleed"> | |
| <div class="cv-eyebrow"> | |
| <span class="cv-dot"></span> | |
| A SCIENTIFIC BRIEFING | |
| </div> | |
| <h1 class="cv-h1">Rewriting the Code of Aging</h1> | |
| <p class="cv-sub">From Yamanaka's discovery to the first human trial of cellular rejuvenation</p> | |
| <div class="cv-rule"></div> | |
| <div class="cv-byline">Hossein · May 2026</div> | |
| </div> | |
| </section> | |
| <section class="slide moment-slide"> | |
| <div class="slide-frame full-bleed"> | |
| <div class="moment-eyebrow">THE MOMENT</div> | |
| <p class="moment-line1">This year, for the first time in history, a human being will receive a therapy designed to reverse cellular age.</p> | |
| <p class="moment-pull">Not slow it. Not mask it. Reverse it.</p> | |
| <div class="moment-foot">The trial began enrollment in early 2026. Results expected late 2026 / early 2027.</div> | |
| </div> | |
| </section> | |
| <section class="slide roadmap-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">ROADMAP</div> | |
| <h1 class="content-title">What we'll cover</h1> | |
| <p class="content-sub">A 30-minute journey through the science, the trial, and the future</p> | |
| <div class="rm-list"> | |
| <div class="rm-item"> | |
| <div class="rm-num">01</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">The discovery</div> | |
| <div class="rm-desc">How Yamanaka cracked open cell identity</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">02</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">From pluripotency to rejuvenation</div> | |
| <div class="rm-desc">The unexpected age-reversal observation</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">03</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">The Sinclair trial: ER-100</div> | |
| <div class="rm-desc">First human test of partial reprogramming</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">04</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">Two roads: gene therapy vs. small molecule</div> | |
| <div class="rm-desc">Trade-offs for the next generation of therapies</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">05</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">The competitive landscape</div> | |
| <div class="rm-desc">Companies, billionaires, and timelines</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">06</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">Beyond Yamanaka</div> | |
| <div class="rm-desc">Other major theories and complementary approaches</div> | |
| </div> | |
| </div> | |
| <div class="rm-item"> | |
| <div class="rm-num">07</div> | |
| <div class="rm-text"> | |
| <div class="rm-title">What this means for us</div> | |
| <div class="rm-desc">Lifestyle, drugs, and the layered future of aging medicine</div> | |
| </div> | |
| </div></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>03 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART ONE</div> | |
| <h1 class="sd-title ">The Discovery</h1> | |
| <p class="sd-sub">How four genes overturned a century of dogma</p> | |
| </div> | |
| </section> | |
| <section class="slide compare-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 1 · THE DISCOVERY</div> | |
| <h1 class="content-title">The dogma that fell</h1> | |
| <p class="content-sub">For most of the 20th century, biology held a simple rule</p> | |
| <div class="cmp-grid"> | |
| <div class="cmp-col cmp-red"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">THE OLD VIEW</div> | |
| <h3 class="cmp-heading">Differentiation is irreversible</h3> | |
| <div class="cmp-image"> | |
| <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b4/Gluehlampe_01_KMJ.png/250px-Gluehlampe_01_KMJ.png" | |
| alt="Incandescent light bulb"> | |
| </div> | |
| <div class="cmp-body"><p>Once a cell becomes a skin cell, neuron, or liver cell, it's locked into that fate forever. Adult cells permanently lose access to the genetic programs of other cell types.</p></div> | |
| <div class="cmp-tagline">"A cell's fate is its destiny."</div> | |
| </div> | |
| <div class="cmp-col cmp-teal"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">WHAT YAMANAKA PROVED</div> | |
| <h3 class="cmp-heading">Cell identity is a program, not a destiny</h3> | |
| <div class="cmp-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/The_Centennial_Light_Bulb.png" | |
| alt="The Centennial Light Bulb"> | |
| </div> | |
| <div class="cmp-body"><p>Just four transcription factors, delivered to an adult skin cell, can erase that cell's identity and return it to an embryonic-like state. The genome doesn't change — only its regulation.</p></div> | |
| <div class="cmp-tagline">Nobel Prize, 2012.</div> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>05 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide timeline-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 1 · THE DISCOVERY</div> | |
| <h1 class="content-title">Standing on three sets of shoulders</h1> | |
| <p class="content-sub">The 50-year arc that made cellular reprogramming possible</p> | |
| <div class="tl-track-wrap"> | |
| <div class="tl-grid"> | |
| <div class="tl-milestone"> | |
| <div class="tl-year">1962</div> | |
| <div class="tl-dot-wrap"><div class="tl-dot"></div></div> | |
| <div class="tl-who">John Gurdon</div> | |
| <div class="tl-what">Frog nucleus transfer</div> | |
| <div class="tl-desc">Adult cell DNA still contains everything needed to build an organism. Identity is reversible — but only via an egg.</div> | |
| </div> | |
| <div class="tl-milestone"> | |
| <div class="tl-year">1996</div> | |
| <div class="tl-dot-wrap"><div class="tl-dot"></div></div> | |
| <div class="tl-who">Ian Wilmut</div> | |
| <div class="tl-what">Dolly the sheep</div> | |
| <div class="tl-desc">Mammalian cloning proves reprogramming works in our biology. Still requires the mysterious "something" inside an egg.</div> | |
| </div> | |
| <div class="tl-milestone"> | |
| <div class="tl-year">2006</div> | |
| <div class="tl-dot-wrap"><div class="tl-dot"></div></div> | |
| <div class="tl-who">Shinya Yamanaka</div> | |
| <div class="tl-what">Four factors. iPSCs.</div> | |
| <div class="tl-desc">Identifies the 'something' — just OSKM (Oct4, Sox2, Klf4, c-Myc). No egg needed.</div> | |
| </div> | |
| <div class="tl-milestone"> | |
| <div class="tl-year">2016+</div> | |
| <div class="tl-dot-wrap"><div class="tl-dot"></div></div> | |
| <div class="tl-who">Ocampo / Sinclair</div> | |
| <div class="tl-what">Partial reprogramming</div> | |
| <div class="tl-desc">Pulse OSK transiently — get the rejuvenation without losing cell identity.</div> | |
| </div></div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>06 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide numbered-slide has-image"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 1 · THE DISCOVERY</div> | |
| <h1 class="content-title">How Yamanaka actually did it</h1> | |
| <p class="content-sub">The experimental design was as elegant as the result</p> | |
| <div class="ns-body"> | |
| <div class="ns-list"> | |
| <div class="ns-step"> | |
| <div class="ns-num">1</div> | |
| <div> | |
| <div class="ns-title">Compile candidates</div> | |
| <div class="ns-desc">24 transcription factors known to be highly expressed in embryonic stem cells but not in adult cells.</div> | |
| </div> | |
| </div> | |
| <div class="ns-step"> | |
| <div class="ns-num">2</div> | |
| <div> | |
| <div class="ns-title">Build a reporter system</div> | |
| <div class="ns-desc">Engineer mouse skin cells to glow green when a pluripotency marker (Fbx15) is activated.</div> | |
| </div> | |
| </div> | |
| <div class="ns-step"> | |
| <div class="ns-num">3</div> | |
| <div> | |
| <div class="ns-title">Deliver all 24, see if anything works</div> | |
| <div class="ns-desc">Use retroviruses to introduce all candidate genes simultaneously. Some cells turn green — reprogramming is happening.</div> | |
| </div> | |
| </div> | |
| <div class="ns-step"> | |
| <div class="ns-num">4</div> | |
| <div> | |
| <div class="ns-title">Subtract until you find the minimum</div> | |
| <div class="ns-desc">Remove genes one by one. If green disappears, that gene was essential. The answer: just four — Oct4, Sox2, Klf4, c-Myc.</div> | |
| </div> | |
| </div></div> | |
| <div class="ns-image-col"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/yamanka_factors.png" alt="OSKM — Oct4, Sox2, Klf4, c-Myc" | |
| onerror="this.parentElement.style.display='none'"/> | |
| <div class="ns-image-caption">OSKM — Oct4, Sox2, Klf4, c-Myc</div> | |
| </div> | |
| </div> | |
| <div class="ns-foot">Takahashi & Yamanaka, Cell, 2006 — published in mouse. Extended to human cells in 2007.</div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>07 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART TWO</div> | |
| <h1 class="sd-title ">The Unexpected Gift</h1> | |
| <p class="sd-sub">Reprogrammed cells weren't just identity-reset. They were age-reset.</p> | |
| </div> | |
| </section> | |
| <section class="slide tsf-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 2 · THE UNEXPECTED GIFT</div> | |
| <h1 class="content-title">Sinclair's claim: epigenetics is the master switch</h1> | |
| <p class="content-sub">The Information Theory of Aging unifies many of the other hallmarks</p> | |
| <div class="tsf-grid"> | |
| <div class="tsf-stage tsf-light"> | |
| <div class="tsf-label">UPSTREAM</div> | |
| <h3 class="tsf-heading">Damage accumulates</h3> | |
| <ul class="tsf-items"><li>DNA damage</li><li>Oxidative stress</li><li>Replication errors</li><li>Time itself</li></ul> | |
| <div class="tsf-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/dna_damage.png" alt="" | |
| onerror="this.parentElement.style.display='none'"/> | |
| </div> | |
| <div class="tsf-support-row"> | |
| <div class="tsf-support-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/DNA_make_protein.png" | |
| alt="DNA makes protein molecular illustration" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="tsf-support-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/protein_fight_infection.png" | |
| alt="Protein fighting infection molecular illustration" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="tsf-arrow">→</div> | |
| <div class="tsf-stage tsf-dark has-video"> | |
| <div class="tsf-label tsf-label-amber">THE MASTER SWITCH</div> | |
| <h3 class="tsf-heading tsf-heading-light">Epigenetic disruption</h3> | |
| <p class="tsf-body">Chromatin gets pulled to repair sites and resets imperfectly. Information about which genes should be on or off is gradually lost.</p> | |
| <div class="tsf-video"> | |
| <a class="tsf-video-link" | |
| href="https://www.youtube.com/watch?v=PYjPqq8P70s" | |
| target="_blank" | |
| rel="noopener noreferrer" | |
| aria-label="Play epigenetic disruption video on YouTube"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/Sinclr_you_tube.png" | |
| alt="Video thumbnail for epigenetic disruption explainer"> | |
| </a> | |
| </div> | |
| <div class="tsf-tagline">← Reverse this, reverse aging</div> | |
| </div> | |
| <div class="tsf-arrow">→</div> | |
| <div class="tsf-stage tsf-light"> | |
| <div class="tsf-label">DOWNSTREAM</div> | |
| <h3 class="tsf-heading">Hallmarks emerge</h3> | |
| <ul class="tsf-items"><li>Senescent cells</li><li>Mitochondrial decline</li><li>Stem cell exhaustion</li><li>Inflammaging</li><li>Tissue dysfunction</li></ul> | |
| <div class="tsf-downstream-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/Mitochondria.png" | |
| alt="Mitochondria illustration" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="tsf-insight">If Sinclair is right, ER-100's mechanism doesn't just treat one thing — it reaches upstream of many of the other hallmarks at once.</div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>22 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide epigenome-intro-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 2 · THE UNEXPECTED GIFT</div> | |
| <h1 class="content-title">A quick detour: what is the epigenome?</h1> | |
| <p class="content-sub">Same DNA in every cell. Different epigenetic settings — different cells.</p> | |
| <div class="ei-grid"> | |
| <div class="ei-image-col"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/methyl_groups.png" alt="Methyl groups — small chemical tags on DNA that switch genes on or off" | |
| onerror="this.parentElement.style.display='none'"/> | |
| <div class="ei-image-caption">Methyl groups — small chemical tags on DNA that switch genes on or off</div> | |
| </div> | |
| <div class="ei-points"> | |
| <div class="ei-point"> | |
| <div class="ei-point-title">The genome</div> | |
| <div class="ei-point-desc">Your DNA — 3 billion base pairs, identical in every cell of your body. The hardware. Doesn't change.</div> | |
| </div> | |
| <div class="ei-point"> | |
| <div class="ei-point-title">The epigenome</div> | |
| <div class="ei-point-desc">A regulatory layer on top — methylation marks on DNA, modifications on histones. Tells each cell which genes to read. The operating system.</div> | |
| </div> | |
| <div class="ei-point"> | |
| <div class="ei-point-title">Why it matters for aging</div> | |
| <div class="ei-point-desc">A skin cell and a neuron have the same DNA but different epigenomes. Over time, those settings drift. The hardware stays fine — the operating system corrupts.</div> | |
| </div></div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>09 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide horvath-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 2 · THE UNEXPECTED GIFT</div> | |
| <h1 class="content-title">How do we even <em class="glow">measure</em> biological age?</h1> | |
| <p class="content-sub">Steve Horvath, 2013 — a single algorithm that reads your age from blood, more accurately than any clinical test that came before.</p> | |
| <div class="hc-grid"> | |
| <div class="hc-image-col"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/Horvath_clock.png" | |
| alt="Horvath Clock — chronological vs epigenetic age scatter plot"> | |
| </div> | |
| <div class="hc-points"> | |
| <div class="hc-point"> | |
| <div class="hc-point-label">THE PATTERN</div> | |
| <div class="hc-point-title">A near-perfect correlation</div> | |
| <div class="hc-point-desc">Each pink dot is a person. Their chronological age plotted against their epigenetic age predicted from 353 methylation sites. The line is the perfect-prediction diagonal.</div> | |
| </div> | |
| <div class="hc-point"> | |
| <div class="hc-point-label">THE ACCURACY</div> | |
| <div class="hc-point-title">±3.6 years from a blood draw</div> | |
| <div class="hc-point-desc">Median absolute error of 3.6 years across thousands of samples. More accurate than telomere length, more accurate than physician visual estimates, and portable across tissue types.</div> | |
| </div> | |
| <div class="hc-point"> | |
| <div class="hc-point-label">THE SIGNAL</div> | |
| <div class="hc-point-title">The dots above and below</div> | |
| <div class="hc-point-desc">Points above the line are <strong>biologically older</strong> than their chronological age — accelerated aging. Points below are biologically younger. <em>This deviation is what every longevity therapy is now trying to move.</em></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>11 / 30</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide four-stat-slide has-image"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 2 · THE UNEXPECTED GIFT</div> | |
| <h1 class="content-title">The observation that changed the field</h1> | |
| <p class="content-sub">When old cells were reprogrammed, they didn't just lose their identity</p> | |
| <div class="fs-grid"> | |
| <div class="fs-card"> | |
| <div class="fs-stat">Reset</div> | |
| <div class="fs-label">Epigenetic clock</div> | |
| <div class="fs-desc">DNA methylation patterns return to embryonic state</div> | |
| </div> | |
| <div class="fs-card"> | |
| <div class="fs-stat">Restored</div> | |
| <div class="fs-label">Telomere length</div> | |
| <div class="fs-desc">Chromosome end-caps re-extended to youthful length</div> | |
| </div> | |
| <div class="fs-card"> | |
| <div class="fs-stat">Renewed</div> | |
| <div class="fs-label">Mitochondrial function</div> | |
| <div class="fs-desc">Energy production returns to youthful efficiency</div> | |
| </div> | |
| <div class="fs-card"> | |
| <div class="fs-stat">Cleared</div> | |
| <div class="fs-label">Cellular damage markers</div> | |
| <div class="fs-desc">Senescence and damage signatures wiped</div> | |
| </div></div> | |
| <div class="fs-image-strip"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/Horvath_clock.png" alt="The epigenetic clock — biological age read directly from methylation patterns" | |
| onerror="this.parentElement.style.display='none'"/> | |
| <div class="fs-image-caption">The epigenetic clock — biological age read directly from methylation patterns</div> | |
| </div> | |
| <div class="fs-insight"><span>Pluripotency reprogramming is also rejuvenation. Cell identity and biological age are written in the same epigenetic ink.</span></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>10 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide compare-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 2 · THE UNEXPECTED GIFT</div> | |
| <h1 class="content-title">The problem — and the breakthrough fix</h1> | |
| <p class="content-sub">Full reprogramming would kill you. The trick is to stop short.</p> | |
| <div class="cmp-grid"> | |
| <div class="cmp-col cmp-red"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">THE PROBLEM</div> | |
| <h3 class="cmp-heading">Full reprogramming = teratomas</h3> | |
| <div class="cmp-body"><p>If you turn a retinal cell, a neuron, or a liver cell into a stem cell, you don't get a younger retinal cell — you get a stem cell. In a living organism, that means tumors.</p></div> | |
| <div class="cmp-tagline">The Yamanaka effect needed a brake.</div> | |
| </div> | |
| <div class="cmp-col cmp-teal"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">THE FIX — PARTIAL REPROGRAMMING</div> | |
| <h3 class="cmp-heading">Stop short of pluripotency</h3> | |
| <div class="cmp-body"><strong>Drop c-Myc</strong> (the most oncogenic factor) — use only OSK<br/><br/><strong>Pulse, don't sustain</strong> — express factors briefly, then off<br/><br/><strong>Result:</strong> cells stay themselves but get younger</div> | |
| <div class="cmp-tagline">Ocampo et al. 2016 (Salk) · Lu et al. 2020 (Sinclair)</div> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>11 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide simulator-slide"> | |
| <div class="slide-frame"> | |
| <iframe class="simulator-iframe" | |
| src="Cell_Rejuvenation_Slider_BioReal.html" | |
| title="Interactive partial reprogramming sweet spot simulator"></iframe> | |
| <div class="slide-foot"> | |
| <span>Partial Reprogramming Simulator</span> | |
| <span>12 / 31</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART THREE</div> | |
| <h1 class="sd-title sd-title-huge">ER-100</h1> | |
| <p class="sd-sub">Sinclair's lab. Life Biosciences. The first human trial.</p> | |
| </div> | |
| </section> | |
| <section class="slide er100-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 3 · THE TRIAL</div> | |
| <h1 class="content-title">What ER-100 is, in one slide</h1> | |
| <p class="content-sub">FDA-cleared January 2026 — first-in-human partial reprogramming therapy</p> | |
| <div class="er-grid"> | |
| <div class="er-bigstat"> | |
| <div class="er-bigstat-label">THE FIRST</div> | |
| <div class="er-bigstat-value">Phase 1</div> | |
| <div class="er-bigstat-desc">First-in-human cellular rejuvenation trial</div> | |
| <div class="er-bigstat-rule"></div> | |
| <div class="er-bigstat-clinid">NCT07290244</div> | |
| <div class="er-bigstat-foot">Enrollment underway 2026.<br/>Results expected late 2026 / early 2027.</div> | |
| </div> | |
| <div class="er-details"> | |
| <div class="er-detail"> | |
| <div class="er-bar"></div> | |
| <div class="er-detail-text"> | |
| <div class="er-detail-label">MECHANISM</div> | |
| <div class="er-detail-value">Partial epigenetic reprogramming via OSK (Oct4 + Sox2 + Klf4)</div> | |
| </div> | |
| </div> | |
| <div class="er-detail"> | |
| <div class="er-bar"></div> | |
| <div class="er-detail-text"> | |
| <div class="er-detail-label">DELIVERY</div> | |
| <div class="er-detail-value">AAV gene therapy, intravitreal injection (directly into the eye)</div> | |
| </div> | |
| </div> | |
| <div class="er-detail"> | |
| <div class="er-bar"></div> | |
| <div class="er-detail-text"> | |
| <div class="er-detail-label">INDICATIONS</div> | |
| <div class="er-detail-value">Open-angle glaucoma + non-arteritic anterior ischemic optic neuropathy (NAION)</div> | |
| </div> | |
| </div> | |
| <div class="er-detail"> | |
| <div class="er-bar"></div> | |
| <div class="er-detail-text"> | |
| <div class="er-detail-label">ENDPOINT</div> | |
| <div class="er-detail-value">Safety + tolerability primary; visual function as secondary signal</div> | |
| </div> | |
| </div> | |
| <div class="er-detail"> | |
| <div class="er-bar"></div> | |
| <div class="er-detail-text"> | |
| <div class="er-detail-label">SPONSOR</div> | |
| <div class="er-detail-value">Life Biosciences — co-founded by David Sinclair, Harvard</div> | |
| </div> | |
| </div></div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>13 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide table-slide delivery-methods-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 3 · THE TRIAL</div> | |
| <h1 class="content-title">How long does the reprogramming signal last?</h1> | |
| <p class="content-sub">Delivery method controls the central safety trade-off: enough OSK exposure to rejuvenate, not so much that identity is erased.</p> | |
| <div class="tbl delivery-table"> | |
| <div class="tbl-row tbl-head"> | |
| <div class="tbl-cell">Method</div> | |
| <div class="tbl-cell">Material Delivered</div> | |
| <div class="tbl-cell">Integrates Into DNA?</div> | |
| <div class="tbl-cell">Persistence</div> | |
| </div> | |
| <div class="tbl-row"> | |
| <div class="tbl-cell tbl-cell-key">Retrovirus</div> | |
| <div class="tbl-cell">RNA → converted to DNA</div> | |
| <div class="tbl-cell">Yes</div> | |
| <div class="tbl-cell">Often permanent</div> | |
| </div> | |
| <div class="tbl-row"> | |
| <div class="tbl-cell tbl-cell-key">Sendai virus</div> | |
| <div class="tbl-cell">RNA virus</div> | |
| <div class="tbl-cell">No</div> | |
| <div class="tbl-cell">Temporary but relatively persistent</div> | |
| </div> | |
| <div class="tbl-row"> | |
| <div class="tbl-cell tbl-cell-key">mRNA transfection</div> | |
| <div class="tbl-cell">Synthetic mRNA</div> | |
| <div class="tbl-cell">No</div> | |
| <div class="tbl-cell">Very short-lived</div> | |
| </div> | |
| </div> | |
| <div class="tbl-foot">Partial reprogramming is a dosing problem as much as a gene problem: duration and reversibility determine the safety window.</div> | |
| <div class="slide-foot"> | |
| <span>Reprogramming delivery methods</span> | |
| <span>14 / 32</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide six-tile-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 3 · THE TRIAL</div> | |
| <h1 class="content-title">Why the eye, why now</h1> | |
| <p class="content-sub">The choice of organ is as strategic as the choice of mechanism</p> | |
| <div class="st-grid"> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Compartmentalized</div> | |
| </div> | |
| <div class="st-desc">The eye is immunologically privileged — therapy stays put rather than circulating systemically. Lower risk of off-target effects.</div> | |
| </div> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Accessible</div> | |
| </div> | |
| <div class="st-desc">Intravitreal injection is a standard, low-risk procedure performed millions of times per year. No surgery required.</div> | |
| </div> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Measurable</div> | |
| </div> | |
| <div class="st-desc">Vision recovery is unambiguous. You either see better or you don't. Speeds clinical readout.</div> | |
| </div> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Untreatable today</div> | |
| </div> | |
| <div class="st-desc">NAION has no approved treatment. Glaucoma vision loss is permanent. The therapeutic gap justifies first-in-human risk.</div> | |
| </div> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Preclinical proof</div> | |
| </div> | |
| <div class="st-desc">Sinclair's 2020 Nature paper showed OSK restored vision in mice with optic nerve injury. Replicated in non-human primates.</div> | |
| </div> | |
| <div class="st-tile"> | |
| <div class="st-tile-head"> | |
| <span class="st-dot"></span> | |
| <div class="st-title">Regulatory path</div> | |
| </div> | |
| <div class="st-desc">Eye indications have a well-trodden FDA path. The regulators know how to evaluate this organ.</div> | |
| </div></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>14 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide outcomes-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 3 · THE TRIAL</div> | |
| <h1 class="content-title">Sinclair calls it a 'Wright brothers moment'</h1> | |
| <p class="content-sub">What ER-100's results will mean for the entire field</p> | |
| <div class="oc-grid"> | |
| <div class="oc-col oc-teal"> | |
| <div class="oc-bar"></div> | |
| <div class="oc-label">IF IT WORKS</div> | |
| <h3 class="oc-heading">Aging becomes treatable</h3> | |
| <ul class="oc-bullets"><li><strong>Vision loss</strong> in age-related eye diseases gets a true reversal therapy</li><li><strong>Reprogramming pipeline</strong> expands to liver, brain, heart</li><li><strong>Investor floodgates</strong> open for cellular rejuvenation broadly</li><li><strong>The Information Theory of Aging</strong> is validated as therapeutic</li></ul> | |
| </div> | |
| <div class="oc-col oc-gray"> | |
| <div class="oc-bar"></div> | |
| <div class="oc-label">IF IT FAILS</div> | |
| <h3 class="oc-heading">The field resets, doesn't end</h3> | |
| <ul class="oc-bullets"><li><strong>Safety setbacks</strong> (e.g. tumor signals) would chill in vivo reprogramming for years</li><li><strong>Modality competition</strong> — small molecule and senolytic approaches gain ground</li><li><strong>Mechanism remains real</strong> — animal models won't be invalidated</li><li><strong>Lessons learned</strong> feed the next generation of safer factor cocktails</li></ul> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>15 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide table-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 4 · TWO ROADS</div> | |
| <h1 class="content-title">Two strategies, two trade-offs</h1> | |
| <p class="content-sub">ER-100 is gene therapy. A small-molecule version is right behind it.</p> | |
| <div class="tbl"><div class="tbl-row tbl-head"><div class="tbl-cell tbl-cell-0"></div><div class="tbl-cell tbl-cell-1">Gene Therapy (ER-100)</div><div class="tbl-cell tbl-cell-2">Small Molecule (the pill)</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">What it delivers</div><div class="tbl-cell tbl-cell-1">AAV virus carrying OSK genes; cells make the proteins themselves</div><div class="tbl-cell tbl-cell-2">Three-molecule cocktail; nudges cells into a younger epigenetic state</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">Precision</div><div class="tbl-cell tbl-cell-1">Targeted to a specific tissue (eye, via injection)</div><div class="tbl-cell tbl-cell-2">Reaches every tissue via bloodstream — for better and worse</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">Cost</div><div class="tbl-cell tbl-cell-1">$500K – $2M per patient (AAV manufacturing)</div><div class="tbl-cell tbl-cell-2">Pennies per dose at scale</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">Reversibility</div><div class="tbl-cell tbl-cell-1">Genetic payload is in the cells — hard to undo</div><div class="tbl-cell tbl-cell-2">Stop the pill, drug clears in days</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">Stage</div><div class="tbl-cell tbl-cell-1">Phase 1 underway, 2026</div><div class="tbl-cell tbl-cell-2">Mouse-stage; entering trials soon</div></div><div class="tbl-row"><div class="tbl-cell tbl-cell-0 tbl-cell-key">The bet</div><div class="tbl-cell tbl-cell-1">Maximum potency for specific diseases</div><div class="tbl-cell tbl-cell-2">Massive scale for systemic aging</div></div></div> | |
| <div class="tbl-foot">These aren't competitors — they're complementary bets on different timelines. Gene therapy gets to the clinic first; small molecule scales to billions.</div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>16 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART FIVE</div> | |
| <h1 class="sd-title ">Who's Building This</h1> | |
| <p class="sd-sub">Bezos. Altman. Armstrong. Page. The race is on.</p> | |
| </div> | |
| </section> | |
| <section class="slide companies-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 5 · THE LANDSCAPE</div> | |
| <h1 class="content-title">The companies racing toward rejuvenation</h1> | |
| <p class="content-sub">Ranked by clinical maturity, not by hype or funding</p> | |
| <div class="ct"> | |
| <div class="ct-row ct-head"> | |
| <div class="ct-cell ct-c1">COMPANY</div> | |
| <div class="ct-cell ct-c2">FOCUS</div> | |
| <div class="ct-cell ct-c3">STAGE</div> | |
| <div class="ct-cell ct-c4">BACKING</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">Life Biosciences</div> | |
| <div class="ct-cell ct-c2">Gene therapy · Eye → Liver, Brain</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 1 ACTIVE</div> | |
| <div class="ct-cell ct-c4">Sinclair / Harvard</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">BlueRock (Bayer)</div> | |
| <div class="ct-cell ct-c2">iPSC cell therapy · Parkinson's, Cardiac</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 1/2</div> | |
| <div class="ct-cell ct-c4">Bayer</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">Verve Therapeutics</div> | |
| <div class="ct-cell ct-c2">CRISPR base editing · Cardiovascular</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 2/3</div> | |
| <div class="ct-cell ct-c4">Acquired by Lilly $1.3B</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">Unity Biotechnology</div> | |
| <div class="ct-cell ct-c2">Senolytics · Eye, age-related</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 2</div> | |
| <div class="ct-cell ct-c4">Public</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">Insilico Medicine</div> | |
| <div class="ct-cell ct-c2">AI-discovered small molecules · Fibrosis</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 2</div> | |
| <div class="ct-cell ct-c4">AI-driven</div> | |
| </div> | |
| <div class="ct-row ct-hi"> | |
| <div class="ct-cell ct-c1">Calico (Alphabet)</div> | |
| <div class="ct-cell ct-c2">Small molecules · Neuro, kidney</div> | |
| <div class="ct-cell ct-c3 ct-stage">Phase 1-2</div> | |
| <div class="ct-cell ct-c4">Google · post-AbbVie</div> | |
| </div> | |
| <div class="ct-row"> | |
| <div class="ct-cell ct-c1">Altos Labs</div> | |
| <div class="ct-cell ct-c2">Cellular reprogramming · Broad</div> | |
| <div class="ct-cell ct-c3 ct-stage">Pre-clinical</div> | |
| <div class="ct-cell ct-c4">Bezos · $3B launch</div> | |
| </div> | |
| <div class="ct-row"> | |
| <div class="ct-cell ct-c1">NewLimit</div> | |
| <div class="ct-cell ct-c2">AI-discovered reprogramming factors · Liver</div> | |
| <div class="ct-cell ct-c3 ct-stage">Pre-clinical</div> | |
| <div class="ct-cell ct-c4">Brian Armstrong · $1.62B val</div> | |
| </div> | |
| <div class="ct-row"> | |
| <div class="ct-cell ct-c1">Retro Biosciences</div> | |
| <div class="ct-cell ct-c2">Reprogramming + plasma + autophagy</div> | |
| <div class="ct-cell ct-c3 ct-stage">Pre-clinical</div> | |
| <div class="ct-cell ct-c4">Sam Altman · $180M personal</div> | |
| </div> | |
| <div class="ct-row"> | |
| <div class="ct-cell ct-c1">YouthBio</div> | |
| <div class="ct-cell ct-c2">Brain reprogramming (full OSKM) · Alzheimer's</div> | |
| <div class="ct-cell ct-c3 ct-stage">Pre-IND</div> | |
| <div class="ct-cell ct-c4">Yuri Deigin</div> | |
| </div></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>18 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide pipeline-showcase-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 5 · THE LANDSCAPE</div> | |
| <h1 class="content-title">What a longevity pipeline actually looks like</h1> | |
| <p class="content-sub">Retro Biosciences (Sam Altman-backed) — four programs across modalities. A snapshot of how multiple bets get placed.</p> | |
| <div class="ps-grid"> | |
| <div class="ps-image-col"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/Retro_Bioscience_Roadmap.png" alt="" | |
| onerror="this.parentElement.style.display='none'"/> | |
| <div class="ps-image-caption">Source: Retro Biosciences (publicly disclosed pipeline)</div> | |
| </div> | |
| <div class="ps-bullets"> | |
| <div class="ps-bullet"> | |
| <div class="ps-bullet-name">Autophagy</div> | |
| <div class="ps-bullet-desc">Small-molecule inducer of cellular cleanup. Lead indication: Alzheimer's.</div> | |
| </div> | |
| <div class="ps-bullet"> | |
| <div class="ps-bullet-name">iMG (microglia)</div> | |
| <div class="ps-bullet-desc">iPSC-derived microglia for neuroinflammation. Aims to deliver "plasmapheresis-style" rejuvenation at scale.</div> | |
| </div> | |
| <div class="ps-bullet"> | |
| <div class="ps-bullet-name">iHSC (hematopoietic)</div> | |
| <div class="ps-bullet-desc">iPSC-derived blood stem cells. Bridges to existing transplant infrastructure.</div> | |
| </div> | |
| <div class="ps-bullet"> | |
| <div class="ps-bullet-name">Tissue reprogramming</div> | |
| <div class="ps-bullet-desc">AAV-delivered factors for OA and age-related hearing loss. Direct in-vivo rejuvenation.</div> | |
| </div></div> | |
| </div> | |
| <div class="ps-insight">Same playbook as ER-100 — but with four shots on goal, each at a different stage. This is what the next decade looks like.</div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>19 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide ai-retro-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 5 · THE LANDSCAPE</div> | |
| <h1 class="content-title">AI is starting to redesign the reprogramming proteins</h1> | |
| <p class="content-sub">OpenAI + Retro Biosciences used GPT-4b micro to engineer Yamanaka-factor variants with stronger wet-lab signals.</p> | |
| <div class="ai-retro-grid"> | |
| <div class="ai-retro-left"> | |
| <p class="ai-retro-text"><strong>RetroSOX</strong> and <strong>RetroKLF</strong> variants outperformed wild-type SOX2/KLF4 in reprogramming screens, with replication across donors, cell types, and delivery methods.</p> | |
| <p class="ai-retro-text">The second signal matters for this talk: engineered variants also showed enhanced DNA-damage repair, connecting protein design back to rejuvenation rather than just pluripotency.</p> | |
| </div> | |
| <div class="ai-retro-cards"> | |
| <div class="ai-retro-card"> | |
| <div class="ai-retro-image-wrap"> | |
| <a class="ai-retro-video-link" | |
| href="https://youtube.com/shorts/IzuyBXyvQxc?si=T3pdOREzFViAOLeH" | |
| target="_blank" | |
| rel="noopener noreferrer" | |
| aria-label="Play OpenAI and Retro Biosciences reprogramming protein video on YouTube"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/50-fold_higher_expression.png" | |
| alt="OpenAI and Retro Biosciences 50-fold reprogramming comparison" | |
| onerror="this.closest('.ai-retro-image-wrap').style.display='none'"> | |
| <div class="ai-retro-overlay">50 fold higher expression</div> | |
| </a> | |
| </div> | |
| <div class="ai-retro-card-title">More colonies</div> | |
| <div class="ai-retro-card-copy">Engineered variants produced visibly stronger reprogramming marker expression than standard factors.</div> | |
| </div> | |
| <div class="ai-retro-card"> | |
| <div class="ai-retro-image-wrap"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/two_new_factors.png" | |
| alt="Two new engineered Yamanaka-factor variants" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="ai-retro-card-title">Two new factors</div> | |
| <div class="ai-retro-card-copy">GPT-4b micro proposed RetroSOX and RetroKLF variants rather than only using wild-type SOX2 and KLF4.</div> | |
| </div> | |
| <div class="ai-retro-card"> | |
| <div class="ai-retro-image-wrap"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/measure_dna_damage.png" | |
| alt="DNA damage assay measurement" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="ai-retro-card-title">Measure repair</div> | |
| <div class="ai-retro-card-copy">The useful endpoint is not just stemness; it is whether stressed cells show less DNA-damage signal.</div> | |
| </div> | |
| </div> | |
| <div class="ai-retro-source">Source: OpenAI, “Accelerating life sciences research,” Aug 2025</div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>OpenAI + Retro Biosciences</span> | |
| <span>20 / 33</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART SIX</div> | |
| <h1 class="sd-title ">Beyond Yamanaka</h1> | |
| <p class="sd-sub">Aging is multi-layered. Reprogramming is one tool — not the only one.</p> | |
| </div> | |
| </section> | |
| <section class="slide nine-tile-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 6 · BEYOND YAMANAKA</div> | |
| <h1 class="content-title">The other major theories of aging</h1> | |
| <p class="content-sub">Each addresses a different layer — reprogramming targets just one</p> | |
| <div class="nt-grid"> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Senolytics</div> | |
| <div class="nt-what">Clear 'zombie' senescent cells driving inflammation</div> | |
| <div class="nt-meta"><em>Unity, Mayo (Kirkland)</em> · <strong>Phase 2</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Mitochondrial rejuvenation</div> | |
| <div class="nt-what">Restore cellular energy production</div> | |
| <div class="nt-meta"><em>Mitopure (Urolithin A), MOTS-c, SS-31</em> · <strong>Approved (Barth)</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Telomere extension</div> | |
| <div class="nt-what">Restore chromosome end-caps</div> | |
| <div class="nt-meta"><em>Various (cancer risk gates therapies)</em> · <strong>Limited</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Young blood factors / TPE</div> | |
| <div class="nt-what">Add youthful, remove aged circulating factors</div> | |
| <div class="nt-meta"><em>Conboy lab, Alkahest</em> · <strong>Phase 1-2</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Stem cell / iPSC therapy</div> | |
| <div class="nt-what">Replace exhausted cells with new ones</div> | |
| <div class="nt-meta"><em>BlueRock, Vertex</em> · <strong>Phase 1-2</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Inflammaging reduction</div> | |
| <div class="nt-what">Suppress chronic low-grade inflammation</div> | |
| <div class="nt-meta"><em>GLP-1, IL-6 inhibitors, colchicine</em> · <strong>On-market</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Proteostasis / autophagy</div> | |
| <div class="nt-what">Clear damaged proteins, induce cellular cleanup</div> | |
| <div class="nt-meta"><em>Spermidine, rapamycin</em> · <strong>Off-label</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">Microbiome restoration</div> | |
| <div class="nt-what">Restore youthful gut bacteria composition</div> | |
| <div class="nt-meta"><em>FMT, Akkermansia</em> · <strong>Early clinical</strong></div> | |
| </div> | |
| <div class="nt-tile"> | |
| <div class="nt-bar"></div> | |
| <div class="nt-title">ECM cross-link breakers</div> | |
| <div class="nt-what">Restore tissue elasticity (skin, vessels)</div> | |
| <div class="nt-meta"><em>Revel Pharma, others</em> · <strong>Pre-clinical</strong></div> | |
| </div></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>21 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide section-divider"> | |
| <div class="slide-frame full-bleed sd-frame"> | |
| <div class="sd-rule"></div> | |
| <div class="sd-part">PART SEVEN</div> | |
| <h1 class="sd-title ">The Layered Future</h1> | |
| <p class="sd-sub">Lifestyle, drugs, and reprogramming — different layers, different jobs</p> | |
| </div> | |
| </section> | |
| <section class="slide pyramid-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 7 · THE LAYERED FUTURE</div> | |
| <h1 class="content-title">The honest hierarchy of impact today</h1> | |
| <p class="content-sub">Lifestyle has stronger human evidence than any longevity drug currently available</p> | |
| <div class="py-stack"> | |
| <div class="py-layer" style="width: 38%; background: #9333EA;"> | |
| <div class="py-name">Frontier (years away)</div> | |
| <div class="py-desc">Partial reprogramming therapies (ER-100 and successors). Potentially transformative — if they work.</div> | |
| </div> | |
| <div class="py-layer" style="width: 58%; background: #DC2626;"> | |
| <div class="py-name">Speculative</div> | |
| <div class="py-desc">Senolytics, NAD precursors, plasma exchange. Promising but unproven in humans at scale.</div> | |
| </div> | |
| <div class="py-layer" style="width: 78%; background: #F59E0B;"> | |
| <div class="py-name">Established off-label drugs</div> | |
| <div class="py-desc">GLP-1 agonists, metformin, low-dose rapamycin, statins. Real but modest additive benefit.</div> | |
| </div> | |
| <div class="py-layer" style="width: 100%; background: #0EA5A4;"> | |
| <div class="py-name">Foundation: lifestyle</div> | |
| <div class="py-desc">Don't smoke. Exercise (cardio + resistance). Mediterranean-style diet. Sleep. Manage stress. Time-restricted eating. Social connection.</div> | |
| </div></div> | |
| <div class="py-insight">Each layer multiplies the next. Reprogramming on a damaged metabolic substrate is a worse bet than on a maintained one.</div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>24 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide lg-defense-slide"> | |
| <div class="slide-frame"> | |
| <div class="lg-eyebrow"><span class="lg-dot"></span>SUB-SECTION · LIFESTYLE MECHANISMS</div> | |
| <h1 class="lg-h1-big">Your cells already know <em class="glow">how to be young</em>.</h1> | |
| <p class="lg-lede">Inside every one of your cells is an evolved network of defense machinery. When you fast, when you run hard, when you're a little too cold or a little too hot — your cells receive a signal: <span class="mono" style="color: var(--teal-glow);">conditions are difficult, prepare to survive</span>.</p> | |
| <div class="lg-defense-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/c0394202852fd0c93c4e3afecb20b3d235a513e6/images/genes_for_growth_or_protect.png" | |
| alt="Genes switching between growth and protection programs" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="lg-stat-row"> | |
| <div class="lg-stat"> | |
| <div class="lg-stat-label">WHAT ACTIVATES</div> | |
| <div class="lg-stat-heading">Stress signals</div> | |
| <div class="lg-stat-desc">Fasting. Exercise. Cold. Heat. Amino acid restriction. The body's signal that resources are scarce.</div> | |
| </div> | |
| <div class="lg-stat"> | |
| <div class="lg-stat-label">WHAT IT TRIGGERS</div> | |
| <div class="lg-stat-heading">Repair mode</div> | |
| <div class="lg-stat-desc">Cells switch from grow-and-reproduce into repair-and-protect. Misfolded proteins recycled, organelles cleared.</div> | |
| </div> | |
| <div class="lg-stat"> | |
| <div class="lg-stat-label">WHAT GETS DEFENDED</div> | |
| <div class="lg-stat-heading">The epigenome</div> | |
| <div class="lg-stat-desc">The same chemical tags that determine cellular identity — actively maintained against drift.</div> | |
| </div></div> | |
| <div class="lg-insight-banner"> | |
| <div class="lg-insight-label">THE CONNECTION TO ER-100</div> | |
| <div class="lg-insight-text">The same epigenetic information that the Yamanaka factors externally <em class="glow">rewrite</em> is what your body's longevity genes try to <em class="glow">protect</em>. Lifestyle is not generic health advice. It is a switch.</div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>25 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide lg-genes-slide"> | |
| <div class="slide-frame"> | |
| <div class="lg-eyebrow"><span class="lg-dot"></span>THE THREE FAMILIES</div> | |
| <h1 class="lg-h1-mid">Three groups of genes do <em class="glow">most of the work</em></h1> | |
| <p class="lg-sub">Each family senses a different kind of cellular stress — and switches on a different facet of the defense program.</p> | |
| <div class="lg-gene-grid"> | |
| <div class="lg-gene-col" data-gene="sirtuins"> | |
| <div class="lg-gene-num">FAMILY 01</div> | |
| <div class="lg-gene-name">Sirtuins</div> | |
| <div class="lg-gene-full">SILENT INFORMATION REGULATORS · SIR2</div> | |
| <div class="lg-gene-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/11dbb8b9255569adc61fa1143c92152ac0637e2b/images/Longevity_Genes_-_Sirtuins.png" | |
| alt="Longevity genes: Sirtuins" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="lg-gene-role">Maintain epigenetic information directly. Sirtuins move to sites of DNA damage to assist repair, then return to their posts. Sinclair's work suggests <strong>age-related sirtuin distraction</strong> — being repeatedly pulled away and not returning correctly — is a primary driver of epigenetic drift.</div> | |
| <div class="lg-gene-act"> | |
| <div class="lg-gene-act-label">ACTIVATED BY</div> | |
| <div class="lg-gene-act-text">NAD+ · rises with fasting and exercise · falls with age</div> | |
| </div> | |
| </div> | |
| <div class="lg-gene-col" data-gene="ampk"> | |
| <div class="lg-gene-num">FAMILY 02</div> | |
| <div class="lg-gene-name">AMPK</div> | |
| <div class="lg-gene-full">AMP-ACTIVATED PROTEIN KINASE</div> | |
| <div class="lg-gene-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/c92beb5d7b0aa3ad508e6a75e3f8336dac6990f3/images/Longevity_Genes_-_AMPK.png" | |
| alt="Longevity genes: AMPK" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="lg-gene-role">The cellular fuel gauge. Senses the AMP-to-ATP ratio. When energy runs low, AMPK fires and triggers <strong>autophagy</strong> — cellular cleanup — plus mitochondrial renewal and a metabolic pivot toward burning stored fuel rather than building new tissue.</div> | |
| <div class="lg-gene-act"> | |
| <div class="lg-gene-act-label">ACTIVATED BY</div> | |
| <div class="lg-gene-act-text">Caloric restriction · fasting · exercise · metformin</div> | |
| </div> | |
| </div> | |
| <div class="lg-gene-col" data-gene="mtor"> | |
| <div class="lg-gene-num">FAMILY 03</div> | |
| <div class="lg-gene-name">mTOR</div> | |
| <div class="lg-gene-full">MECHANISTIC TARGET OF RAPAMYCIN</div> | |
| <div class="lg-gene-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/mTor.png" | |
| alt="Longevity genes: mTOR" | |
| onerror="this.parentElement.style.display='none'"> | |
| </div> | |
| <div class="lg-gene-role">The growth-versus-maintenance switch. Highly active mTOR means cells grow and divide. <strong>Suppress mTOR</strong> and cells switch to repair, autophagy, conservation. Transient suppression extends lifespan in every model organism tested.</div> | |
| <div class="lg-gene-act"> | |
| <div class="lg-gene-act-label">SUPPRESSED BY</div> | |
| <div class="lg-gene-act-text">Amino acid restriction · methionine restriction · rapamycin</div> | |
| </div> | |
| </div></div> | |
| <div class="lg-pattern-strip"><strong>The pattern.</strong> All three families respond to scarcity or stress. Modern life — constant eating, controlled temperature, low movement — keeps them mostly silent. Activating them deliberately is what lifestyle interventions are actually doing.</div> | |
| <div class="slide-foot"> | |
| <span>Sirtuins · AMPK · mTOR</span> | |
| <span>26 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide lg-treadmill-slide"> | |
| <div class="slide-frame"> | |
| <div class="lg-treadmill-grid"> | |
| <div class="lg-tm-left"> | |
| <div class="lg-eyebrow"><span class="lg-dot"></span>THE TREADMILL INCIDENT</div> | |
| <h1 class="lg-h1-mid">An old mouse <em class="amber">broke the lab equipment</em>.</h1> | |
| <p class="lg-sub">NMN raises NAD+. NAD+ activates sirtuins. The sirtuins, restored, did what they evolved to do — and the result surprised the people running the experiment.</p> | |
| <div class="lg-quote-block"> | |
| <div class="lg-quote-text">We had a bit of an incident. The mice we gave NMN to ran fifty percent further. But some of them ran so far that the treadmill stopped working. We had to reprogram the software, because the program had never seen a mouse run more than three kilometers.</div> | |
| <div class="lg-attrib">David Sinclair</div> | |
| </div> | |
| </div> | |
| <div class="lg-tm-right"> | |
| <div class="lg-stat-stack"> | |
| <div class="lg-stat-big"> | |
| <div class="lg-stat-num">+50%</div> | |
| <div class="lg-stat-desc"><strong>Distance run</strong> by aged mice given NMN compared with untreated aged controls.</div> | |
| </div> | |
| <div class="lg-stat-big"> | |
| <div class="lg-stat-num amber">3 km</div> | |
| <div class="lg-stat-desc">The <strong>distance ceiling</strong> the lab software had been built for. Aged mice exceeded it.</div> | |
| </div> | |
| <div class="lg-stat-big"> | |
| <div class="lg-stat-num">∞</div> | |
| <div class="lg-stat-desc">In the human equivalent, Sinclair has said: a 70-year-old <strong>outrunning a 20-year-old</strong>.</div> | |
| </div></div> | |
| <div class="lg-takeaway"> | |
| <div class="lg-tk-label">HONEST CAVEAT</div> | |
| <div class="lg-tk-text">Mice tell us the mechanism is real. Whether the effect translates to humans is what current trials are testing. Don't oversell.</div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>NAD+ · Sirtuins · NMN</span> | |
| <span>27 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide age-vision-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">PART 7 · THE LAYERED FUTURE</div> | |
| <h1 class="content-title">A reasonable vision of aging medicine in 2040</h1> | |
| <p class="content-sub">Not science fiction — straightforward extrapolation from 2026 trial pipelines</p> | |
| <div class="av-list"> | |
| <div class="av-item"> | |
| <div class="av-circle">30s</div> | |
| <div class="av-text"> | |
| <div class="av-what">Continuous biomarker monitoring</div> | |
| <div class="av-desc">Wearables and home tests track epigenetic age, inflammation, mitochondrial markers. Lifestyle calibrated against actual biology.</div> | |
| </div> | |
| </div> | |
| <div class="av-item"> | |
| <div class="av-circle">40s-50s</div> | |
| <div class="av-text"> | |
| <div class="av-what">Personalized GLP-1 + metabolic protection</div> | |
| <div class="av-desc">Standard of care for managing inflammation, weight, cardiovascular risk. Periodic senolytic cycles begin.</div> | |
| </div> | |
| </div> | |
| <div class="av-item"> | |
| <div class="av-circle">50s-60s</div> | |
| <div class="av-text"> | |
| <div class="av-what">Tissue-specific reprogramming therapies</div> | |
| <div class="av-desc">Eye reprogramming for vision diseases. Liver reprogramming for metabolic disease. Cartilage reprogramming for joints. Pay-per-organ rejuvenation.</div> | |
| </div> | |
| </div> | |
| <div class="av-item"> | |
| <div class="av-circle">60s+</div> | |
| <div class="av-text"> | |
| <div class="av-what">Systemic small-molecule reprogramming</div> | |
| <div class="av-desc">If trials succeed, daily pills that nudge cells toward youthful epigenetic states across the whole body. Cost: pennies per dose.</div> | |
| </div> | |
| </div></div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>28 / 29</span> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="slide closing-slide"> | |
| <div class="slide-frame full-bleed"> | |
| <div class="cl-eyebrow"><span class="cv-dot"></span>CLOSING</div> | |
| <p class="cl-line">In 2006, four genes overturned the dogma that aging is irreversible.</p> | |
| <p class="cl-line">In 2026, those same genes enter the human body for the first time.</p> | |
| <h1 class="cl-headline">We are watching biology become engineering.</h1> | |
| <div class="cl-rule"></div> | |
| <h2 class="cl-thanks">Thank you.</h2> | |
| <p class="cl-sub">Questions welcome.</p> | |
| </div> | |
| </section> | |
| <section class="slide compare-slide"> | |
| <div class="slide-frame"> | |
| <div class="eyebrow-line">CLOSING · THE DEEPER TRADE</div> | |
| <h1 class="content-title">The dogma that fell</h1> | |
| <p class="content-sub">Aging may be nature's brutal innovation engine</p> | |
| <div class="cmp-grid"> | |
| <div class="cmp-col cmp-red"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">THE BIOLOGICAL BARGAIN</div> | |
| <h3 class="cmp-heading">Turnover creates innovation</h3> | |
| <div class="cmp-image cmp-image-pair"> | |
| <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b4/Gluehlampe_01_KMJ.png/250px-Gluehlampe_01_KMJ.png" | |
| alt="Incandescent light bulb"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/latest_light_bulb.png" | |
| alt="Modern LED light bulb"> | |
| </div> | |
| <div class="cmp-body"><p>A lamp that burns out creates demand for the next lamp. In biology, aging makes room for new genomes, new combinations, new minds, and new answers to changing worlds.</p></div> | |
| <div class="cmp-tagline">Death is the cost of renewal.</div> | |
| </div> | |
| <div class="cmp-col cmp-teal"> | |
| <div class="cmp-bar"></div> | |
| <div class="cmp-label">THE LONGEVITY TEMPTATION</div> | |
| <h3 class="cmp-heading">Survival can freeze the system</h3> | |
| <div class="cmp-image"> | |
| <img src="https://huggingface.co/datasets/foundation-models/images/resolve/main/images/The_Centennial_Light_Bulb.png" | |
| alt="The Centennial Light Bulb"> | |
| </div> | |
| <div class="cmp-body"><p>A lamp that never dies is a triumph for that lamp, but a problem for the workshop. If the old never leave, the young get less space to update the species, the culture, and the ideas.</p></div> | |
| <div class="cmp-tagline">Immortality may preserve life while slowing change.</div> | |
| </div> | |
| </div> | |
| <div class="slide-foot"> | |
| <span>Rewriting the Code of Aging</span> | |
| <span>30 / 30</span> | |
| </div> | |
| </div> | |
| </section> | |
| </div> | |
| </div> | |
| <div class="progress"><div class="progress-fill" id="progressFill"></div></div> | |
| <div class="hint"> | |
| <kbd>←</kbd><kbd>→</kbd> navigate · <kbd>F</kbd> fullscreen · <kbd>1</kbd>–<kbd>9</kbd> jump | |
| </div> | |
| <div class="controls"> | |
| <button class="ctrl-btn" id="prevBtn" aria-label="Previous slide">◀</button> | |
| <button class="ctrl-btn" id="nextBtn" aria-label="Next slide">▶</button> | |
| </div> | |
| <script> | |
| const wrapper = document.getElementById('wrapper'); | |
| function fitToViewport() { | |
| const sx = window.innerWidth / 1600; | |
| const sy = window.innerHeight / 900; | |
| const s = Math.min(sx, sy); | |
| wrapper.style.transform = `scale(${s})`; | |
| } | |
| fitToViewport(); | |
| window.addEventListener('resize', fitToViewport); | |
| const slides = document.querySelectorAll('.slide'); | |
| const total = slides.length; | |
| slides.forEach((slide, i) => { | |
| const footerNumber = slide.querySelector('.slide-foot span:last-child'); | |
| if (footerNumber) footerNumber.textContent = `${String(i + 1).padStart(2, '0')} / ${total}`; | |
| }); | |
| let current = 0; | |
| function goTo(idx) { | |
| idx = Math.max(0, Math.min(total - 1, idx)); | |
| if (idx === current) return; | |
| slides.forEach((s, i) => { | |
| s.classList.remove('active', 'before-active'); | |
| if (i === idx) s.classList.add('active'); | |
| else if (i < idx) s.classList.add('before-active'); | |
| }); | |
| current = idx; | |
| document.getElementById('progressFill').style.width = | |
| (((idx + 1) / total) * 100) + '%'; | |
| document.getElementById('prevBtn').disabled = (idx === 0); | |
| document.getElementById('nextBtn').disabled = (idx === total - 1); | |
| history.replaceState(null, '', '#/' + (idx + 1)); | |
| } | |
| document.addEventListener('keydown', (e) => { | |
| if (['ArrowRight', 'PageDown', ' ', 'n'].includes(e.key)) { | |
| e.preventDefault(); | |
| goTo(current + 1); | |
| } else if (['ArrowLeft', 'PageUp', 'p'].includes(e.key)) { | |
| e.preventDefault(); | |
| goTo(current - 1); | |
| } else if (e.key === 'f' || e.key === 'F') { | |
| e.preventDefault(); | |
| if (!document.fullscreenElement) document.documentElement.requestFullscreen?.(); | |
| else document.exitFullscreen?.(); | |
| } else if (e.key === 'Home') { e.preventDefault(); goTo(0); } | |
| else if (e.key === 'End') { e.preventDefault(); goTo(total - 1); } | |
| else if (e.key >= '1' && e.key <= '9') { | |
| const n = parseInt(e.key, 10) - 1; | |
| if (n < total) goTo(n); | |
| } | |
| }); | |
| document.getElementById('prevBtn').addEventListener('click', () => goTo(current - 1)); | |
| document.getElementById('nextBtn').addEventListener('click', () => goTo(current + 1)); | |
| const initialMatch = location.hash.match(/#\/(\d+)/); | |
| if (initialMatch) { | |
| const n = parseInt(initialMatch[1], 10) - 1; | |
| if (n >= 0 && n < total) goTo(n); | |
| } | |
| document.getElementById('prevBtn').disabled = true; | |
| // Set initial progress | |
| document.getElementById('progressFill').style.width = (1 / total * 100) + '%'; | |
| let touchStartX = null; | |
| document.addEventListener('touchstart', (e) => { touchStartX = e.touches[0].clientX; }); | |
| document.addEventListener('touchend', (e) => { | |
| if (touchStartX === null) return; | |
| const dx = e.changedTouches[0].clientX - touchStartX; | |
| if (Math.abs(dx) > 60) { | |
| if (dx < 0) goTo(current + 1); else goTo(current - 1); | |
| } | |
| touchStartX = null; | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Xet Storage Details
- Size:
- 107 kB
- Xet hash:
- 241586e63d97b134a0da48b92e29b17c86dced7bb1a876586f527d3ed273f9dc
·
Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.