:root {
        --bg: #0b0b0b;
        --ink: #dcdcdc;
        --muted: #6f6f6f;
        --line: #262626;
        --green: #00c853;
        --pink: #feb4c1;
        --pink-soft: #feb4c1;
        --font:
          "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas,
          monospace;
        --w: 1920;
        --h: 1080;
      }

      * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      html,
      body {
        height: 100%;
        background: #000;
        color: var(--ink);
        overflow: hidden;
        font-family: var(--font);
      }

      .shell {
        position: fixed;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .stage {
        width: 1920px;
        height: 1080px;
        position: absolute;
        left: 50%;
        top: 50%;
        background: var(--bg);
        transform-origin: center center;
        border: 1px solid #1f1f1f;
        box-shadow:
          0 0 0 1px #000,
          0 0 80px rgba(254, 180, 193, 0.16);
      }

      .scanlines {
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 8;
        background: repeating-linear-gradient(
          to bottom,
          transparent 0,
          transparent 3px,
          rgba(0, 0, 0, 0.18) 3px,
          rgba(0, 0, 0, 0.18) 4px
        );
        opacity: 0.35;
      }

      .chrome {
        position: absolute;
        left: 200px;
        right: 200px;
        bottom: 36px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        font-size: 16px;
        color: var(--muted);
        z-index: 2;
        pointer-events: none;
      }

      .bar {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 2px;
        background: #1c1c1c;
        z-index: 3;
      }
      .bar > i {
        display: block;
        height: 100%;
        width: 0;
        background: var(--pink);
      }

      .slides {
        position: absolute;
        inset: 0;
      }
      .slide {
        position: absolute;
        inset: 0;
        padding: 100px 200px 110px;
        display: none;
        flex-direction: column;
        justify-content: flex-start;
      }
      .slide.active {
        display: flex;
      }

      .kicker {
        font-size: 20px;
        color: var(--green);
        margin-bottom: 18px;
      }
      .kicker::before {
        content: "$ ";
        color: var(--pink);
      }

      h1 {
        font-size: 76px;
        font-weight: 500;
        line-height: 1.15;
        letter-spacing: 0;
      }
      h2 {
        font-size: 52px;
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: 0;
        margin-bottom: 36px;
      }
      .sub {
        margin-top: 24px;
        font-size: 30px;
        line-height: 1.5;
        color: #bdbdbd;
        max-width: 22em;
      }
      .sub.lines {
        max-width: none;
        line-height: 1.55;
      }
      .meta {
        margin-top: 32px;
        font-size: 20px;
        color: var(--muted);
      }
      .meta a {
        color: var(--pink-soft);
        text-decoration: none;
      }
      .meta a:hover {
        text-decoration: underline;
      }

      .dfarchon-slide h2 {
        margin-bottom: 18px;
      }
      .who-lead {
        margin-bottom: 24px;
        font-size: 28px;
        line-height: 1.45;
        color: #bdbdbd;
      }
      .who-narrative {
        margin: 8px 0 40px;
        font-size: 22px;
        line-height: 1.45;
        color: #a9a9a9;
      }
      .dfarchon-slide .profile-label {
        font-size: 16px;
      }
      .proof-line a {
        color: var(--pink-soft);
        text-decoration: none;
      }
      .proof-line a:hover {
        text-decoration: underline;
      }
      .profile-body {
        display: flex;
        flex: 1;
        min-height: 0;
        flex-direction: column;
        justify-content: space-between;
        gap: 24px;
      }
      .profile-metrics {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
      }
      .profile-metric {
        padding: 20px 22px;
        border-right: 1px solid var(--line);
      }
      .profile-metric:first-child {
        padding-left: 0;
      }
      .profile-metric:last-child {
        border-right: 0;
      }
      .profile-metric b {
        display: block;
        color: #fff;
        font-size: 36px;
        font-weight: 500;
        line-height: 1;
      }
      .profile-metric span {
        display: block;
        margin-top: 10px;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.4;
        text-transform: uppercase;
      }
      .profile-label {
        color: var(--pink);
        font-size: 16px;
        text-transform: uppercase;
      }
      .project-track {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
      }
      .project {
        min-height: 280px;
        padding: 26px 22px;
        border: 1px solid var(--line);
        background: #0f0f0f;
      }
      .project .year {
        margin-bottom: 16px;
        color: var(--pink);
        font-size: 16px;
      }
      .project h3 {
        margin-bottom: 12px;
        color: #fff;
        font-size: 26px;
        font-weight: 500;
      }
      .project p {
        color: #a9a9a9;
        font-size: 20px;
        line-height: 1.45;
      }
      .profile-proof {
        display: flex;
        flex-direction: column;
        gap: 20px;
      }
      .profile-proof-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
      }
      .proof-line {
        padding-top: 14px;
        border-top: 1px solid var(--line);
      }
      .proof-line p {
        margin-top: 8px;
        color: #bdbdbd;
        font-size: 20px;
        line-height: 1.45;
      }
      .proof-line p.pink {
        color: var(--pink);
      }

      p,
      li {
        font-size: 30px;
        line-height: 1.5;
        color: #cfcfcf;
      }
      .muted {
        color: var(--muted);
      }
      .pink {
        color: var(--pink);
      }

      .body {
        flex: 1;
        min-height: 0;
      }

      .grid {
        display: grid;
        gap: 32px;
        height: 100%;
      }
      .grid.two {
        grid-template-columns: 1fr 1fr;
      }
      .grid.three {
        grid-template-columns: 1fr 1fr 1fr;
      }
      .grid.four {
        grid-template-columns: 1fr 1fr 1fr 1fr;
      }

      .card {
        border: 1px solid var(--line);
        padding: 32px 26px;
        background: #0f0f0f;
      }
      .card .idx {
        font-size: 16px;
        color: var(--pink);
        margin-bottom: 12px;
      }
      .card h3 {
        font-size: 30px;
        font-weight: 500;
        margin-bottom: 14px;
      }
      .card p {
        font-size: 24px;
        color: #b3b3b3;
      }
      .agenda-grid {
        flex: 0 0 420px;
        height: 420px;
        margin: auto 0;
      }
      .agenda-grid .card {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 44px 36px;
      }
      .agenda-grid .card .idx {
        margin-bottom: 18px;
        font-size: 18px;
      }
      .agenda-grid .card h3 {
        margin-bottom: 22px;
        font-size: 34px;
      }
      .agenda-grid .card p {
        font-size: 27px;
        line-height: 1.5;
      }

      ul.list {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 16px;
      }
      ul.list li {
        padding-left: 28px;
        position: relative;
      }
      ul.list li::before {
        content: ">";
        position: absolute;
        left: 0;
        top: 0;
        color: var(--pink);
      }
      ul.noir-list {
        gap: 12px;
      }
      ul.noir-list li {
        font-size: 22px;
        line-height: 1.42;
      }
      .noir-lead {
        max-width: 58em;
        margin: -10px 0 22px;
        font-size: 23px;
        line-height: 1.45;
        color: #bdbdbd;
      }
      .noir-timeline {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        margin-bottom: 12px;
        border: 1px solid var(--line);
      }
      .noir-timeline div {
        padding: 14px 18px;
        border-right: 1px solid var(--line);
      }
      .noir-timeline div:last-child {
        border-right: 0;
      }
      .noir-timeline b,
      .noir-timeline span {
        display: block;
      }
      .noir-timeline b {
        margin-bottom: 5px;
        color: var(--pink);
        font-size: 20px;
        font-weight: 500;
      }
      .noir-timeline span {
        color: #b3b3b3;
        font-size: 16px;
      }
      .aztec-timeline {
        margin-bottom: 28px;
      }
      .aztec-timeline div {
        padding: 16px 18px;
      }
      .aztec-timeline span {
        font-size: 15px;
        line-height: 1.4;
      }
      .aztec-now {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 24px;
        flex: 1;
        min-height: 0;
      }
      .aztec-now .card {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .aztec-now .card p {
        font-size: 20px;
        line-height: 1.45;
      }
      .aztec-contrib {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 24px;
        flex: 1;
        min-height: 0;
      }
      .aztec-contrib .card {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .aztec-contrib .card p {
        font-size: 20px;
        line-height: 1.45;
      }
      .v5-apps {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 20px;
        flex: 1;
        min-height: 0;
      }
      .v5-apps .card {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 28px 26px;
      }
      .v5-apps .card .idx {
        font-size: 14px;
        margin-bottom: 12px;
      }
      .v5-apps .card h3 {
        font-size: 28px;
        margin-bottom: 12px;
      }
      .v5-apps .card p {
        font-size: 20px;
        line-height: 1.42;
      }
      .noir-status {
        display: flex;
        gap: 28px;
        margin-bottom: 10px;
        color: var(--muted);
        font-size: 15px;
      }
      .noir-status span::before {
        content: ">";
        margin-right: 7px;
        color: var(--green);
      }
      table.noir-competition th,
      table.noir-competition td {
        padding: 11px 16px 11px 0;
      }
      table.noir-competition td {
        font-size: 19px;
        line-height: 1.3;
      }
      table.noir-competition td:first-child {
        width: 24%;
        color: #fff;
      }
      .noir-table-wrap {
        flex: 0 0 auto;
      }
      .noir-summary {
        margin-top: 38px;
      }
      .noir-stack {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        gap: 28px;
        flex: 1;
        min-height: 0;
      }
      .noir-layer {
        display: flex;
        min-height: 0;
        padding: 36px 40px;
        border: 1px solid var(--line);
        background: #0f0f0f;
        flex-direction: column;
        justify-content: center;
      }
      .noir-layer .idx,
      .noir-flywheel .idx {
        margin-bottom: 12px;
        color: var(--pink);
        font-size: 16px;
      }
      .noir-layer h3,
      .noir-flywheel h3 {
        margin-bottom: 12px;
        color: #fff;
        font-size: 30px;
        font-weight: 500;
      }
      .noir-layer p,
      .noir-flywheel p {
        color: #aaa;
        font-size: 22px;
        line-height: 1.45;
      }
      .noir-arrow {
        display: none;
      }
      .split-layer > div:not(.idx) {
        padding: 10px 0;
        border-top: 1px solid var(--line);
      }
      .split-layer b,
      .split-layer span {
        display: block;
      }
      .split-layer b {
        margin-bottom: 5px;
        color: #fff;
        font-size: 22px;
        font-weight: 500;
      }
      .split-layer span {
        color: #999;
        font-size: 18px;
        line-height: 1.35;
      }
      .noir-flywheel {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        margin-top: 30px;
      }
      .noir-flywheel article {
        padding: 22px;
        border-top: 1px solid var(--line);
      }
      .hybrid-lead {
        max-width: 48em;
        margin: -12px 0 22px;
        font-size: 23px;
        line-height: 1.45;
        color: #bdbdbd;
      }
      .hybrid-flow {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 22px;
        color: #fff;
        font-size: 20px;
      }
      .hybrid-flow i {
        color: var(--pink);
        font-style: normal;
      }
      .hybrid-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 28px;
        flex: 1;
        min-height: 0;
      }
      .hybrid-pane {
        display: flex;
        min-height: 0;
        padding: 28px 36px;
        border: 1px solid var(--line);
        background: #0f0f0f;
        flex-direction: column;
      }
      .hybrid-pane .idx {
        margin-bottom: 12px;
        color: var(--pink);
        font-size: 16px;
      }
      .hybrid-pane.public .idx {
        color: var(--green);
      }
      .hybrid-pane h3 {
        margin-bottom: 22px;
        color: #fff;
        font-size: 28px;
        font-weight: 500;
      }
      .hybrid-pane ul {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 16px;
      }
      .hybrid-pane li {
        padding-left: 28px;
        position: relative;
        font-size: 20px;
        line-height: 1.42;
        color: #b3b3b3;
      }
      .hybrid-pane li::before {
        content: ">";
        position: absolute;
        left: 0;
        top: 0;
        color: var(--pink);
      }
      .hybrid-pane.public li::before {
        color: var(--green);
      }
      .hybrid-pane code {
        font-family: inherit;
        color: #fff;
      }
      .hybrid-rule {
        display: flex;
        align-items: baseline;
        gap: 28px;
        margin-top: 28px;
        padding-top: 22px;
        border-top: 1px solid var(--line);
      }
      .hybrid-rule + .hybrid-rule {
        margin-top: 14px;
        padding-top: 16px;
      }
      .hybrid-rule b {
        flex: 0 0 auto;
        color: var(--pink);
        font-size: 24px;
        font-weight: 500;
      }
      .hybrid-rule span {
        color: #bdbdbd;
        font-size: 22px;
        line-height: 1.45;
      }
      .pxe-shot {
        position: relative;
        z-index: 9;
        display: flex;
        flex: 1;
        min-height: 0;
        align-items: center;
        justify-content: center;
        padding: 18px 28px;
        border: 1px solid var(--line);
        background: #f6f6f4;
      }
      .pxe-shot img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
      }
      .pxe-privacy {
        align-items: flex-start;
        margin-top: 18px;
        padding-top: 16px;
        gap: 24px;
      }
      .pxe-privacy b {
        width: 9.5em;
        font-size: 18px;
        line-height: 1.35;
      }
      .pxe-privacy span {
        font-size: 18px;
        line-height: 1.4;
      }
      .df-tech-slide h2 {
        margin-bottom: 18px;
      }
      .df-tech-slide .hybrid-lead {
        max-width: 52em;
        margin: -6px 0 18px;
      }
      .df-tech-slide .hybrid-flow {
        margin-bottom: 18px;
      }
      .df-tech-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr 1fr;
        gap: 18px;
        flex: 1;
        min-height: 0;
      }
      .df-tech-grid .card {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 22px 24px;
      }
      .df-tech-grid .card .idx {
        margin-bottom: 8px;
        font-size: 14px;
      }
      .df-tech-grid .card h3 {
        margin-bottom: 10px;
        font-size: 24px;
      }
      .df-tech-grid .card p {
        font-size: 18px;
        line-height: 1.4;
      }
      .df-tech-grid .card code {
        font-family: inherit;
        color: #fff;
      }
      .df-tech-slide .hybrid-rule {
        margin-top: 18px;
        padding-top: 16px;
      }

      .quote {
        font-size: 44px;
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: 0;
        max-width: 18em;
      }
      .quote::before {
        content: "> ";
        color: var(--pink);
      }

      table.sheet {
        width: 100%;
        border-collapse: collapse;
      }
      table.sheet th,
      table.sheet td {
        text-align: left;
        padding: 20px 16px 20px 0;
        border-bottom: 1px solid var(--line);
        font-size: 28px;
        vertical-align: top;
      }
      table.sheet th {
        font-size: 16px;
        font-weight: 400;
        color: var(--pink);
      }
      table.sheet.tight th,
      table.sheet.tight td {
        padding: 14px 16px 14px 0;
      }
      table.sheet.tight td:first-child {
        width: 28%;
        color: var(--muted);
      }

      pre.code {
        background: #080808;
        border: 1px solid var(--line);
        padding: 28px 32px;
        font-family: var(--font);
        font-size: 26px;
        line-height: 1.65;
        color: #d6d6d6;
        white-space: pre;
      }
      .code-slide .hybrid-lead code,
      .code-slide .hybrid-rule code {
        color: #fff;
      }

      .gh {
        flex: 0 0 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        background: #0d1117;
        border: 1px solid #30363d;
        border-radius: 6px;
        overflow: hidden;
      }
      .gh-bar {
        display: flex;
        align-items: center;
        gap: 12px;
        flex: 0 0 auto;
        padding: 12px 18px;
        border-bottom: 1px solid #30363d;
        background: #161b22;
        color: #e6edf3;
        font-size: 18px;
      }
      .gh-bar b {
        font-weight: 500;
      }
      .gh-bar span {
        color: #8b949e;
        font-size: 16px;
      }
      .gh-body {
        flex: 0 0 auto;
        overflow: auto;
      }
      .gh-blob {
        width: 100%;
        border-collapse: collapse;
        font-family: var(--font);
        font-size: 22px;
        line-height: 1.55;
      }
      .gh-ln {
        width: 1%;
        padding: 0 16px 0 22px;
        color: #6e7681;
        text-align: right;
        user-select: none;
        vertical-align: top;
        border-right: 1px solid #21262d;
        white-space: nowrap;
      }
      .gh-src {
        padding: 0 22px;
        color: #e6edf3;
        white-space: pre;
        vertical-align: top;
      }
      .gh-blob tr:first-child .gh-ln,
      .gh-blob tr:first-child .gh-src {
        padding-top: 18px;
      }
      .gh-blob tr:last-child .gh-ln,
      .gh-blob tr:last-child .gh-src {
        padding-bottom: 18px;
      }
      .gh-skip .gh-src {
        color: #6e7681;
      }
      .pl-c {
        color: #8b949e;
      }
      .pl-c1 {
        color: #79c0ff;
      }
      .pl-en {
        color: #d2a8ff;
      }
      .pl-k {
        color: #ff7b72;
      }
      .pl-s {
        color: #a5d6ff;
      }
      .pl-smi {
        color: #c9d1d9;
      }
      .pl-v {
        color: #ffa657;
      }

      .stat b {
        display: block;
        font-size: 64px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 1;
      }
      .stat span {
        display: block;
        margin-top: 12px;
        font-size: 20px;
        color: var(--muted);
      }

      .gate {
        position: absolute;
        inset: 0;
        z-index: 6;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 100px 200px 110px;
        background: var(--bg);
      }
      .gate[hidden] {
        display: none;
      }
      .gate-row {
        display: flex;
        align-items: baseline;
        gap: 16px;
        margin-top: 8px;
        font-size: 30px;
        color: #bdbdbd;
      }
      .gate-row input {
        flex: 1;
        max-width: 18em;
        background: transparent;
        border: none;
        border-bottom: 1px solid var(--line);
        color: var(--ink);
        font: inherit;
        font-size: 30px;
        outline: none;
        caret-color: var(--pink);
        padding: 4px 0;
      }
      .gate-row input:focus {
        border-bottom-color: var(--pink);
      }
      .gate-error {
        margin-top: 24px;
        font-size: 20px;
        color: var(--pink);
      }

      .title,
      .section,
      .center {
        justify-content: center;
      }

      .cover {
        align-items: flex-start;
        text-align: left;
      }
      .cover-lead {
        font-size: 36px;
        font-weight: 400;
        color: #cfcfcf;
        margin-bottom: 16px;
      }
      .cover h1 {
        font-size: 96px;
        font-weight: 500;
        color: #fff;
      }
      .cover h1.cursor::after {
        content: "█";
        margin-left: 12px;
        color: var(--pink);
        animation: blink 1.1s step-end infinite;
      }
      @keyframes blink {
        50% {
          opacity: 0;
        }
      }
      .cover-speaker {
        margin-top: 80px;
        font-size: 24px;
        color: #bdbdbd;
      }
      .cover-name {
        color: var(--ink);
      }
      .cover-handle {
        margin-top: 6px;
        color: var(--pink-soft);
      }
      .cover-handle a {
        color: inherit;
        text-decoration: none;
      }
      .cover-handle a:hover {
        text-decoration: underline;
      }
      .cover-date {
        margin-top: 20px;
        font-size: 20px;
        color: var(--muted);
      }

      .fragment {
        display: none;
      }
      .fragment.visible {
        display: list-item;
      }

      .todo {
        margin-left: 8px;
        font-size: 14px;
        color: var(--pink);
      }

      .help,
      .overview {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.82);
        z-index: 20;
        display: none;
        place-items: center;
      }
      .help.open,
      .overview.open {
        display: grid;
      }
      .help-card {
        width: min(640px, 90vw);
        background: #0e0e0e;
        border: 1px solid var(--line);
        padding: 32px 36px;
        font-family: var(--font);
        font-size: 14px;
        line-height: 1.9;
        color: #ddd;
      }
      .help-card h3 {
        font-size: 20px;
        font-weight: 500;
        margin-bottom: 12px;
        color: var(--pink-soft);
      }
      kbd {
        display: inline-block;
        min-width: 24px;
        padding: 0 6px;
        border: 1px solid #444;
        color: var(--green);
        text-align: center;
      }
      .overview-grid {
        width: min(1100px, 92vw);
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
      }
      .thumb {
        aspect-ratio: 16 / 9;
        border: 1px solid #333;
        background: #161616;
        color: #bbb;
        padding: 12px;
        text-align: left;
        font-family: var(--font);
        font-size: 12px;
        cursor: pointer;
      }
      .thumb.current,
      .thumb:hover {
        border-color: var(--pink);
        color: #fff;
      }