:root {
  --field: #08111f;
  --field-deep: #050b14;
  --panel: #102035;
  --panel-light: #162943;
  --paper: #f2eee6;
  --muted: #91a1b4;
  --muted-dark: #526278;
  --coral: #ff6b4a;
  --cyan: #87d9df;
  --ochre: #d9b77a;
  --rule: rgba(242, 238, 230, 0.16);
  --rule-soft: rgba(242, 238, 230, 0.08);
  --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --sans: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --display: "Syne", "Arial Black", sans-serif;
  --rail-width: 220px;
  --gutter: clamp(1.25rem, 4vw, 4rem);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--field);
  color: var(--paper);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
}

body::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(var(--rule-soft) 1px, transparent 1px), linear-gradient(90deg, var(--rule-soft) 1px, transparent 1px);
  background-size: 96px 96px;
  content: "";
  opacity: 0.18;
  pointer-events: none;
}

a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }

:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
}

.site-frame { min-height: 100vh; }

.rail {
  position: fixed;
  z-index: 5;
  top: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: var(--rail-width);
  padding: 2rem 1.8rem;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid var(--rule);
  background: rgba(8, 17, 31, 0.84);
  backdrop-filter: blur(16px);
}

.wordmark { display: flex; gap: 0.7rem; align-items: center; width: fit-content; }
.wordmark-mark, .footer-mark {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid var(--coral);
  color: var(--coral);
  font: 500 0.7rem/1 var(--mono);
  letter-spacing: -0.08em;
}
.wordmark-mark { overflow: hidden; border-radius: 0; }
.wordmark-avatar { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 24%; }
.wordmark-name { color: var(--paper); font: 600 0.72rem/1.15 var(--mono); letter-spacing: 0.03em; text-transform: uppercase; }

.section-nav { display: grid; gap: 0.85rem; margin-top: auto; margin-bottom: auto; }
.section-nav a { width: fit-content; color: var(--muted); font: 400 0.72rem/1 var(--mono); letter-spacing: 0.04em; transition: color 180ms ease, transform 180ms ease; }
.section-nav a::before { display: inline-block; width: 0; color: var(--coral); content: "→"; opacity: 0; transition: width 180ms ease, opacity 180ms ease; }
.section-nav a:hover { color: var(--paper); transform: translateX(3px); }
.section-nav a:hover::before { width: 1.15rem; opacity: 1; }

.rail-foot { display: flex; gap: 0.55rem; align-items: flex-start; color: var(--muted); font: 400 0.62rem/1.45 var(--mono); text-transform: uppercase; }
.rail-foot strong { color: var(--coral); font-weight: 500; }
.cooking-indicator { position: relative; display: block; flex: none; width: 0.8rem; height: 0.8rem; margin-top: 0.15rem; border: 1px solid var(--cyan); border-radius: 50%; animation: cooking-spin 4s linear infinite; }
.cooking-indicator::before { position: absolute; top: 0.18rem; left: 0.18rem; width: 0.22rem; height: 0.22rem; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 3px rgba(255, 107, 74, 0.12); content: ""; animation: cooking-bubble 1.6s ease-in-out infinite; }
.cooking-indicator i { position: absolute; display: block; width: 0.18rem; height: 0.18rem; border-radius: 50%; background: var(--cyan); animation: cooking-bubble 1.6s ease-in-out infinite; }
.cooking-indicator i:nth-child(1) { top: -0.28rem; right: -0.08rem; animation-delay: -0.9s; }.cooking-indicator i:nth-child(2) { top: 0.12rem; left: -0.32rem; animation-delay: -0.35s; }.cooking-indicator i:nth-child(3) { right: 0.06rem; bottom: -0.28rem; animation-delay: -1.25s; }
.typing-cursor { color: var(--cyan); animation: cursor-blink 1.1s steps(1, end) infinite; }

@keyframes cooking-spin { to { transform: rotate(360deg); } }
@keyframes cooking-bubble { 0%, 100% { opacity: 0.45; transform: translateY(0) scale(0.75); } 50% { opacity: 1; transform: translateY(-0.18rem) scale(1); } }
@keyframes cursor-blink { 50% { opacity: 0; } }
.availability-dot, .system-state i { display: inline-block; flex: none; width: 0.45rem; height: 0.45rem; margin-top: 0.2rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 4px rgba(135, 217, 223, 0.1); }

main, .site-footer { min-width: 0; margin-left: var(--rail-width); }
.section-pad { padding: clamp(4rem, 7vw, 6.5rem) var(--gutter); }

.hero { display: grid; min-height: min(92vh, 850px); max-width: 1500px; padding-top: clamp(5rem, 10vh, 7.5rem); padding-bottom: clamp(3rem, 6vh, 5rem); grid-template-columns: minmax(280px, 0.92fr) minmax(420px, 1.08fr); grid-template-rows: auto auto; column-gap: clamp(2.5rem, 6vw, 8rem); row-gap: clamp(1rem, 2vw, 2rem); align-items: start; }
.hero-heading { grid-column: 1 / -1; grid-row: 1; }
.hero-heading h1 { max-width: none; margin-bottom: 0; text-wrap: balance; }
.hero-copy { max-width: 600px; min-width: 0; }
.hero-copy { grid-column: 1; grid-row: 2; }
.eyebrow, .section-index, .work-meta, .system-state, .trajectory-readout, .trajectory-controls, .text-button { font: 400 0.66rem/1.35 var(--mono); letter-spacing: 0.09em; text-transform: uppercase; }
.eyebrow { margin: 0 0 1.5rem; color: var(--muted); }
.eyebrow span { color: var(--coral); padding: 0 0.3rem; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--display); font-weight: 600; letter-spacing: -0.055em; }
h1 { max-width: 660px; margin-bottom: 2rem; font-size: clamp(3.6rem, 7vw, 7.5rem); line-height: 0.96; }
h1 em, h2 em { color: var(--coral); font-style: normal; }
.hero-lede { max-width: 450px; margin-bottom: 1rem; color: var(--muted); font-size: clamp(1rem, 1.35vw, 1.16rem); line-height: 1.65; }
.hero-tags { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.hero-tags span { padding: 0.45rem 0.65rem; border: 1px solid var(--rule); color: var(--paper); font: 400 0.62rem/1 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }
.profile-links { display: flex; max-width: 520px; margin-bottom: 1.25rem; flex-wrap: wrap; gap: 0.55rem 0.9rem; align-items: center; }
.profile-links-label { color: var(--muted); font: 400 0.6rem/1.3 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; }
.profile-link { color: var(--paper); border-bottom: 1px solid var(--rule); font: 400 0.64rem/1.35 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; transition: color 180ms ease, border-color 180ms ease; }.profile-link span { color: var(--coral); }.profile-link:hover { color: var(--coral); border-color: var(--coral); }

.mobile-break { display: none; }

.open-source-note { display: grid; max-width: 520px; margin-top: 1.25rem; padding-top: 1rem; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; gap: 0.75rem 1rem; align-items: end; border-top: 1px solid var(--rule); }
.open-source-kicker { color: var(--coral); font: 400 0.66rem/1.35 var(--mono); letter-spacing: 0.09em; text-transform: uppercase; }
.open-source-note p { max-width: 360px; margin: 0.35rem 0 0; color: var(--muted); font-size: 0.78rem; line-height: 1.45; }
.open-source-copy { grid-row: 1 / span 2; }
.open-source-note > a:not(.open-source-impact) { grid-column: 2; grid-row: 2; justify-self: start; color: var(--paper); border-bottom: 1px solid var(--coral); font: 400 0.64rem/1.35 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; }.open-source-note > a:not(.open-source-impact) span { color: var(--coral); }
.open-source-impact { display: grid; min-width: 5.8rem; padding-left: 1rem; grid-column: 2; grid-row: 1; align-self: stretch; align-content: end; border-left: 1px solid var(--rule); color: var(--paper); text-decoration: none; }.open-source-impact-value { color: var(--coral); font: 600 1.6rem/0.9 var(--display); letter-spacing: -0.06em; }.open-source-impact-label { margin-top: 0.35rem; color: var(--muted); font: 400 0.55rem/1.25 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; }.open-source-impact:hover .open-source-impact-value { color: var(--paper); }

.portrait-card { position: relative; grid-column: 2; grid-row: 2; width: min(100%, 500px); margin: 0; align-self: center; justify-self: end; padding: 1rem; border: 1px solid var(--rule); background: var(--panel); box-shadow: 20px 20px 0 rgba(5, 11, 20, 0.22); transform: rotate(1.1deg); }
.portrait-card::before { position: absolute; top: 0; right: 0; width: 48%; height: 1px; background: var(--coral); content: ""; }
.portrait-placeholder { position: relative; display: grid; aspect-ratio: 4 / 3; overflow: hidden; place-items: center; background: #172b45; }
.portrait-image { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.82) contrast(1.04); }
.portrait-placeholder::before { position: absolute; z-index: 1; inset: 0; background: linear-gradient(115deg, transparent 48%, rgba(242, 238, 230, 0.05) 49%, transparent 50%), linear-gradient(0deg, transparent 49%, rgba(242, 238, 230, 0.06) 50%, transparent 51%); background-size: 100% 100%, 100% 8rem; content: ""; mix-blend-mode: screen; }
.portrait-grid { position: absolute; z-index: 2; inset: 12% 12% 12% 12%; border: 1px solid rgba(242, 238, 230, 0.4); background-image: linear-gradient(rgba(242, 238, 230, 0.11) 1px, transparent 1px), linear-gradient(90deg, rgba(242, 238, 230, 0.11) 1px, transparent 1px); background-size: 25% 25%; }
.portrait-placeholder strong { position: relative; z-index: 1; color: var(--coral); font: 700 clamp(5rem, 14vw, 10rem)/1 var(--display); letter-spacing: -0.12em; }
.portrait-note { position: absolute; z-index: 3; right: 1.4rem; bottom: 1.2rem; color: var(--paper); font: 400 0.63rem/1.35 var(--mono); letter-spacing: 0.07em; text-align: right; text-shadow: 0 1px 8px rgba(5, 11, 20, 0.75); text-transform: uppercase; }
.portrait-card figcaption { display: flex; padding-top: 0.9rem; justify-content: space-between; color: var(--muted); font: 400 0.63rem/1.35 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }.portrait-card figcaption span:first-child { color: var(--paper); }

.trajectory-card { position: relative; overflow: hidden; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid var(--rule); background: rgba(16, 32, 53, 0.88); box-shadow: 20px 20px 0 rgba(5, 11, 20, 0.22); }
.trajectory-card::before { position: absolute; top: 0; right: 0; width: 45%; height: 1px; background: var(--coral); content: ""; }
.trajectory-head, .trajectory-readout, .trajectory-controls { display: flex; justify-content: space-between; }
.trajectory-head { gap: 1rem; align-items: flex-start; }
.trajectory-head .eyebrow { margin-bottom: 0.6rem; }
.trajectory-head h2 { margin-bottom: 0; font-size: clamp(1.25rem, 2vw, 1.7rem); letter-spacing: -0.03em; }
.system-state { display: flex; gap: 0.45rem; align-items: center; color: var(--cyan); white-space: nowrap; }
.system-state i { width: 0.35rem; height: 0.35rem; margin-top: 0; box-shadow: none; }
.canvas-wrap { position: relative; height: clamp(290px, 38vw, 500px); margin: 1.4rem 0 0; border: 1px solid var(--rule-soft); background: var(--field-deep); }
#trajectory-canvas { display: block; width: 100%; height: 100%; cursor: crosshair; }
.canvas-axis { position: absolute; color: var(--muted-dark); font: 400 0.65rem var(--mono); pointer-events: none; }
.canvas-axis-x { right: 0.8rem; bottom: 0.55rem; }
.canvas-axis-y { top: 0.65rem; left: 0.7rem; }
.trajectory-readout { gap: 1rem; padding: 0.85rem 0 0.8rem; border-bottom: 1px solid var(--rule); }
.trajectory-readout p { margin: 0; }
#trajectory-status { color: var(--cyan); }
.readout-note { color: var(--muted); letter-spacing: 0.02em; text-transform: none; }
.trajectory-controls { gap: 1.5rem; align-items: end; padding-top: 1rem; }
.trajectory-controls label { display: flex; min-width: min(260px, 58%); gap: 0.75rem; align-items: center; color: var(--muted); }
.trajectory-controls label span { white-space: nowrap; }
input[type="range"] { width: 100%; height: 1rem; accent-color: var(--coral); cursor: ew-resize; }
.text-button { padding: 0; border: 0; background: transparent; color: var(--paper); cursor: pointer; white-space: nowrap; }
.text-button span { display: inline-block; margin-left: 0.3rem; color: var(--coral); transition: transform 180ms ease; }
.text-button:hover span { transform: translate(3px, -3px); }
.noscript-note { margin: 1rem 0 0; color: var(--muted); font: 400 0.75rem/1.4 var(--mono); }

.section-index { display: flex; gap: 0.9rem; margin-bottom: 0; color: var(--coral); }
.section-index span { color: var(--muted); }

.focus-section, .work-section { max-width: 1400px; }
.section-heading { display: grid; grid-template-columns: 1fr 2fr; gap: 2rem; align-items: start; }
.section-heading h2 { margin-bottom: 0; font-size: clamp(2.7rem, 5.5vw, 5.6rem); line-height: 0.98; }
.focus-interface { margin-top: clamp(3rem, 7vw, 6rem); }
.focus-tabs { display: flex; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.focus-tab { position: relative; flex: 1; padding: 1.25rem 1rem 1.15rem; border: 0; border-right: 1px solid var(--rule); background: transparent; color: var(--muted); font: 400 0.75rem var(--mono); text-align: left; cursor: pointer; transition: color 180ms ease, background 180ms ease; }
.focus-tab:first-child { border-left: 1px solid var(--rule); }
.focus-tab span { margin-right: 0.7rem; color: var(--muted-dark); }
.focus-tab::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--coral); content: ""; opacity: 0; transition: opacity 180ms ease; }
.focus-tab:hover, .focus-tab.is-active { color: var(--paper); background: rgba(16, 32, 53, 0.6); }
.focus-tab.is-active::after { opacity: 1; }
.focus-panel { display: grid; min-height: 320px; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 8vw, 9rem); align-items: center; padding: 2.5rem 0 1rem; }
.focus-panel[hidden] { display: none; }
.focus-visual { position: relative; overflow: hidden; height: 270px; border: 1px solid var(--rule); background: var(--field-deep); }
.focus-visual::after { position: absolute; inset: 1rem; border: 1px solid var(--rule-soft); content: ""; pointer-events: none; }
.focus-copy { max-width: 460px; }
.focus-copy .eyebrow { margin-bottom: 0.8rem; }
.focus-copy h3 { margin-bottom: 1rem; font: 600 clamp(1.7rem, 3vw, 2.7rem)/1.05 var(--display); letter-spacing: -0.045em; }
.focus-copy > p:last-child { margin-bottom: 0; color: var(--muted); font-size: 1rem; line-height: 1.7; }

.project-list { margin-top: clamp(2rem, 4.5vw, 4rem); border-top: 1px solid var(--rule); }
.project-card { position: relative; display: grid; min-height: 245px; grid-template-columns: minmax(250px, 0.82fr) 5rem minmax(0, 1.4fr) auto; gap: clamp(1.25rem, 3.5vw, 3.5rem); align-items: start; padding: 1.5rem 0; border-bottom: 1px solid var(--rule); overflow: hidden; transition: background 220ms ease; }
.project-card::after { position: absolute; z-index: -1; top: 0; right: -10%; bottom: 0; width: 46%; background: radial-gradient(circle, rgba(135, 217, 223, 0.1), transparent 68%); content: ""; opacity: 0; transition: opacity 220ms ease; }
.project-card:hover { background: rgba(16, 32, 53, 0.48); }.project-card:hover::after { opacity: 1; }
#work-maskedmimic { cursor: pointer; }
#work-maskedmimic .project-thread-body { cursor: pointer; }
.project-masked { --project-accent: var(--coral); --project-accent-rule: rgba(255, 107, 74, 0.42); --signal-one-x: 0.24rem; --signal-one-y: 0.15rem; --signal-two-x: 0.5rem; --signal-two-y: -0.1rem; --signal-three-x: 0.95rem; --signal-three-y: 0.1rem; border-top: 2px solid var(--coral); }.project-gpc { --project-accent: var(--cyan); --project-accent-rule: rgba(135, 217, 223, 0.42); --signal-one-x: -0.1rem; --signal-one-y: 0.15rem; --signal-two-x: 1.4rem; --signal-two-y: 0.12rem; --signal-three-x: 0.15rem; --signal-three-y: -0.12rem; border-top: 2px solid var(--cyan); }.project-kimodo { --project-accent: #d9b77a; --project-accent-rule: rgba(217, 183, 122, 0.42); --signal-one-x: 0.42rem; --signal-one-y: -0.14rem; --signal-two-x: 0.2rem; --signal-two-y: 0.17rem; --signal-three-x: 1.15rem; --signal-three-y: -0.1rem; border-top: 2px solid #d9b77a; }
.project-media { position: relative; min-width: 0; }
.media-kicker { display: flex; padding-bottom: 0.55rem; justify-content: space-between; gap: 0.75rem; border-bottom: 1px solid var(--rule); color: var(--muted); font: 400 0.58rem/1.3 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; }
.media-kicker span:first-child { color: var(--paper); }
.project-video { display: block; width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--rule-soft); background: var(--field-deep); object-fit: cover; }
.video-embed { position: relative; overflow: hidden; }
.video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.media-link { display: flex; padding-top: 0.55rem; justify-content: space-between; color: var(--muted); font: 400 0.58rem/1.3 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; }
.media-link span { color: var(--coral); transition: transform 180ms ease; }
.media-link:hover { color: var(--paper); }.media-link:hover span { transform: translate(2px, -2px); }
.project-signal { position: relative; display: flex; min-height: 160px; padding-top: 0.15rem; flex-direction: column; justify-content: space-between; color: var(--muted); font: 400 0.7rem var(--mono); }
.project-signal::after { position: absolute; top: 2rem; bottom: 0; left: 0.2rem; width: 1px; background: linear-gradient(var(--coral), transparent); content: ""; opacity: 0.75; }.project-gpc .project-signal::after { background: linear-gradient(var(--cyan), transparent); }.project-kimodo .project-signal::after { background: linear-gradient(#d9b77a, transparent); }
.project-signal i { position: relative; z-index: 1; display: block; width: 0.42rem; height: 0.42rem; border: 1px solid var(--coral); border-radius: 50%; background: var(--field); }.project-signal i:nth-of-type(1) { transform: translate(var(--signal-one-x, 0), var(--signal-one-y, 0)); }.project-signal i:nth-of-type(2) { margin-left: 1.2rem; transform: translate(var(--signal-two-x, 0), var(--signal-two-y, 0)); }.project-signal i:nth-of-type(3) { margin-left: 0.55rem; transform: translate(var(--signal-three-x, 0), var(--signal-three-y, 0)); }.project-gpc .project-signal i { border-color: var(--cyan); }.project-kimodo .project-signal i { border-color: #d9b77a; }
.project-content { max-width: 650px; }.project-content .eyebrow { margin-bottom: 0.75rem; }.project-content h3 { max-width: 570px; margin-bottom: 0.85rem; font: 600 clamp(1.7rem, 3.8vw, 3.4rem)/1 var(--display); letter-spacing: -0.055em; }.project-content > p:not(.eyebrow) { max-width: 560px; margin-bottom: 1.4rem; color: var(--muted); font-size: 1rem; line-height: 1.65; }.project-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; }.project-tags span { padding: 0.38rem 0.55rem; border: 1px solid var(--rule); color: var(--muted); font: 400 0.6rem var(--mono); text-transform: uppercase; }.project-status { padding-top: 0.2rem; color: var(--muted); font: 400 0.6rem var(--mono); letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; }
.project-thread { grid-column: 1 / -1; border-top: 1px solid var(--rule); }
.project-thread summary { display: flex; padding: 0.78rem 0 0.15rem; align-items: center; justify-content: space-between; color: var(--muted); cursor: pointer; font: 400 0.6rem/1.3 var(--mono); letter-spacing: 0.08em; list-style: none; text-transform: uppercase; }
.project-thread summary::-webkit-details-marker { display: none; }
.project-thread summary:focus-visible { outline: 1px solid var(--project-accent); outline-offset: 0.3rem; }
.project-thread-chevron { color: var(--project-accent); font-size: 1rem; line-height: 0.8; transition: transform 180ms ease; }
.project-thread[open] .project-thread-chevron { transform: rotate(180deg); }
.project-thread-body { display: grid; grid-template-columns: minmax(12rem, 0.6fr) minmax(0, 1.4fr); gap: 1.5rem clamp(2rem, 5vw, 5rem); padding: 1.35rem 0 0.65rem; }
.project-thread-intro .eyebrow { margin-bottom: 0.55rem; color: var(--project-accent); }
.project-thread-intro p:last-child { max-width: 240px; margin: 0; color: var(--muted); font-size: 0.82rem; line-height: 1.5; }
.project-thread-path { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; background: var(--rule); list-style: none; }
.project-thread-node { position: relative; min-width: 0; padding: 0.85rem 1rem 0.8rem; background: var(--field); }
.project-thread-node + .project-thread-node::before { position: absolute; top: 0.82rem; left: -0.56rem; z-index: 1; width: 1.05rem; height: 1.05rem; color: var(--project-accent); content: "→"; font: 400 0.75rem/1.05rem var(--mono); text-align: center; }
.project-thread-stage { display: block; margin-bottom: 0.55rem; color: var(--project-accent); font: 400 0.56rem/1.3 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; }
.project-thread-node a, .project-thread-node strong { display: block; margin-bottom: 0.45rem; color: var(--paper); font: 500 1rem/1.05 var(--display); letter-spacing: -0.025em; }
.project-thread-node a span { color: var(--project-accent); font: 400 0.75rem var(--mono); }
.project-thread-node a:hover { color: var(--project-accent); }
.project-thread-node p { margin: 0; color: var(--muted); font-size: 0.72rem; line-height: 1.5; }
.project-thread-next { border: 1px dashed var(--project-accent-rule); background: transparent; }

.lab-section { border-top: 1px solid var(--rule); }.wasm-placeholder { display: grid; min-height: 260px; margin-top: clamp(3rem, 6vw, 5rem); grid-template-columns: 10rem 1fr auto; gap: clamp(1.5rem, 7vw, 8rem); align-items: center; padding: 2rem; border: 1px solid var(--rule); background: linear-gradient(105deg, rgba(16, 32, 53, 0.9), rgba(16, 32, 53, 0.36)); }.wasm-mark { position: relative; display: grid; height: 8rem; place-items: center; border: 1px dashed var(--muted-dark); color: var(--muted); font: 400 0.72rem var(--mono); }.wasm-mark::before, .wasm-mark::after { position: absolute; top: 50%; width: 1.5rem; height: 1px; background: var(--coral); content: ""; }.wasm-mark::before { left: -0.75rem; }.wasm-mark::after { right: -0.75rem; }.wasm-mark i { position: absolute; width: 0.3rem; height: 0.3rem; border: 1px solid var(--cyan); border-radius: 50%; }.wasm-mark i:nth-of-type(1) { top: 1rem; left: 1rem; }.wasm-mark i:nth-of-type(2) { right: 1.2rem; bottom: 1.5rem; }.wasm-mark i:nth-of-type(3) { right: 1rem; top: 1.5rem; background: var(--coral); border: 0; }.wasm-placeholder .eyebrow { margin-bottom: 0.75rem; }.wasm-placeholder h3 { margin-bottom: 0.75rem; font: 600 clamp(1.5rem, 3vw, 2.6rem)/1.05 var(--display); letter-spacing: -0.04em; }.wasm-placeholder p:last-child { max-width: 480px; margin-bottom: 0; color: var(--muted); }.wasm-state { align-self: start; color: var(--muted-dark); font: 400 0.62rem var(--mono); letter-spacing: 0.08em; text-transform: uppercase; }

.visual-motion svg { position: absolute; inset: 16% 8% 14%; width: 84%; height: 70%; overflow: visible; }
.visual-motion path { fill: none; stroke: var(--cyan); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.visual-motion path + path { stroke: var(--coral); stroke-dasharray: 4 7; opacity: 0.72; }
.visual-point { position: absolute; z-index: 1; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 6px rgba(255, 107, 74, 0.12); }
.point-a { top: 68%; left: 10%; }.point-b { top: 36%; left: 45%; background: var(--cyan); box-shadow: 0 0 0 6px rgba(135, 217, 223, 0.12); }.point-c { top: 28%; right: 11%; }
.visual-control { background-image: linear-gradient(90deg, transparent 49.8%, var(--rule) 50%, transparent 50.2%), linear-gradient(transparent 49.8%, var(--rule) 50%, transparent 50.2%); background-size: 50% 50%; }
.control-axis { position: absolute; z-index: 1; left: 50%; top: 15%; height: 70%; border-left: 1px dashed var(--muted-dark); transform: rotate(38deg); transform-origin: center; }
.axis-two { transform: rotate(-38deg); }.control-cursor { position: absolute; z-index: 2; top: 38%; left: 57%; width: 3rem; height: 3rem; border: 1px solid var(--coral); border-radius: 50%; box-shadow: 0 0 0 12px rgba(255, 107, 74, 0.08); }
.control-cursor::after { position: absolute; top: 50%; left: 50%; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--coral); content: ""; transform: translate(-50%, -50%); }
.control-ring { position: absolute; border: 1px solid var(--cyan); border-radius: 50%; opacity: 0.5; }.ring-one { top: 28%; left: 28%; width: 5rem; height: 5rem; }.ring-two { right: 17%; bottom: 18%; width: 2rem; height: 2rem; }
.visual-learning { background-image: linear-gradient(125deg, transparent 49.8%, var(--rule-soft) 50%, transparent 50.2%); }
.learning-line { position: absolute; z-index: 1; height: 1px; background: var(--cyan); transform-origin: left center; }.line-one { top: 32%; left: 22%; width: 46%; transform: rotate(32deg); }.line-two { top: 68%; left: 22%; width: 47%; transform: rotate(-29deg); }.line-three { top: 50%; left: 38%; width: 42%; transform: rotate(0deg); background: var(--coral); }
.learning-node { position: absolute; z-index: 2; width: 1.15rem; height: 1.15rem; border: 1px solid var(--cyan); border-radius: 50%; background: var(--field-deep); }.node-one { top: 24%; left: 18%; }.node-two { top: 44%; left: 34%; border-color: var(--coral); }.node-three { top: 45%; right: 14%; }

.work-heading { margin-bottom: clamp(3rem, 6vw, 5rem); }
.work-list { border-top: 1px solid var(--rule); }
.work-item { display: grid; grid-template-columns: 1fr 2fr 1.8rem; gap: 2rem; align-items: start; padding: 1.6rem 0; border-bottom: 1px solid var(--rule); transition: padding 220ms var(--ease), background 220ms ease; }
.work-item:hover { padding-right: 0.8rem; padding-left: 0.8rem; background: rgba(16, 32, 53, 0.55); }
.work-meta { display: flex; gap: 1rem; color: var(--muted); }.work-meta span:first-child { color: var(--coral); }
.work-body h3 { margin-bottom: 0.45rem; font: 500 clamp(1.15rem, 2.2vw, 1.75rem)/1.15 var(--display); letter-spacing: -0.035em; }.work-body p { margin-bottom: 0; color: var(--muted); font-size: 0.9rem; }
.work-mark { color: var(--coral); font-size: 1.2rem; transition: transform 220ms var(--ease); }.work-item:hover .work-mark { transform: translate(3px, -3px); }

.publications-section { max-width: 1400px; border-top: 1px solid var(--rule); }
.publication-intro { display: flex; margin-top: clamp(2rem, 4vw, 3.5rem); padding-bottom: 0.8rem; justify-content: space-between; gap: 2rem; border-bottom: 1px solid var(--rule); color: var(--muted); }
.publication-intro p { max-width: 500px; margin: 0; font-size: 0.95rem; }.publication-intro span { color: var(--coral); font: 400 0.62rem/1.35 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }

@media (min-width: 821px) {
  .hero { min-height: auto; padding-bottom: clamp(1.25rem, 2.5vw, 2rem); }
  .profile-links { margin-top: 0; padding-top: clamp(0.75rem, 1.2vw, 1rem); }
  .focus-section { padding-top: clamp(1.75rem, 2.5vw, 2.75rem); }
  .focus-section { padding-bottom: clamp(2.5rem, 4vw, 4rem); }
  .publications-section { padding-top: clamp(2.5rem, 4vw, 4rem); }
}

.publication-list { border-top: 0; }
.publication-group { --group-accent: var(--coral); --group-rule: rgba(255, 107, 74, 0.34); border-top: 1px solid var(--group-rule); }
.publication-group[data-group="learning"] { --group-accent: var(--cyan); --group-rule: rgba(135, 217, 223, 0.34); }
.publication-group[data-group="applied"] { --group-accent: var(--ochre); --group-rule: rgba(217, 183, 122, 0.34); }
.publication-group-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: end; padding: 1.8rem 0 0.9rem; border-bottom: 1px solid var(--rule); }
.publication-group-label { margin-bottom: 0.55rem; color: var(--group-accent); font: 400 0.62rem/1.35 var(--mono); letter-spacing: 0.09em; text-transform: uppercase; }
.publication-group-heading h3 { margin-bottom: 0.3rem; color: var(--paper); font: 600 clamp(1.35rem, 2.6vw, 2.2rem)/1.05 var(--display); letter-spacing: -0.04em; }
.publication-group-heading p:last-child { max-width: 560px; margin: 0; color: var(--muted); font-size: 0.82rem; line-height: 1.45; }
.publication-group-count { padding-bottom: 0.2rem; color: var(--group-accent); font: 400 0.62rem/1.35 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
.publication-item { display: grid; grid-template-columns: 8rem minmax(0, 1fr) 8rem; gap: clamp(1rem, 3vw, 2.5rem); align-items: start; padding: 1.1rem 0; border-bottom: 1px solid var(--rule); }
.publication-thumb { position: relative; display: grid; width: 8rem; aspect-ratio: 4 / 3; overflow: hidden; place-items: center; border: 1px solid var(--rule); background-color: var(--panel); }
.publication-thumb::before { position: absolute; inset: 0; background-image: linear-gradient(rgba(242, 238, 230, 0.09) 1px, transparent 1px), linear-gradient(90deg, rgba(242, 238, 230, 0.09) 1px, transparent 1px); background-size: 25% 50%; content: ""; opacity: 0.55; }
.publication-thumb::after { position: absolute; right: 12%; bottom: 20%; left: 12%; height: 1px; background: var(--coral); content: ""; transform: rotate(-22deg); transform-origin: center; }
.publication-thumb span { position: relative; z-index: 1; color: var(--paper); font: 600 0.7rem/1 var(--mono); letter-spacing: 0.08em; }
.publication-thumb i { position: absolute; z-index: 1; width: 0.35rem; height: 0.35rem; border: 1px solid var(--cyan); border-radius: 50%; }.publication-thumb i:first-of-type { top: 20%; left: 20%; }.publication-thumb i:last-of-type { right: 18%; bottom: 24%; background: var(--coral); border: 0; }
.thumb-kimodo, .thumb-manipulator { background: linear-gradient(135deg, #19384b, #132b35 45%, #07131b); }.thumb-kimodo::after { background: #d9b77a; transform: rotate(18deg); }.thumb-gpc { background: linear-gradient(135deg, #102b3c, #16284b 45%, #08111f); }.thumb-gpc::after { background: var(--cyan); transform: rotate(-6deg); }.thumb-masked { background: linear-gradient(135deg, #392a35, #172b45 46%, #08111f); }.thumb-manipulator::after { background: var(--cyan); transform: rotate(36deg); }.thumb-counter { background: linear-gradient(135deg, #3a2c2a, #202b40 46%, #08111f); }.thumb-calm { background: linear-gradient(135deg, #2a2340, #172c44 46%, #08111f); }.thumb-calm::after { background: var(--cyan); transform: rotate(12deg); }.thumb-network, .thumb-context { background: linear-gradient(135deg, #162e3a, #102035 46%, #08111f); }.thumb-network::after { background: var(--cyan); transform: rotate(0); }.thumb-stable, .thumb-policy { background: linear-gradient(135deg, #352f27, #1d2940 46%, #08111f); }.thumb-stable::after { background: #d9b77a; transform: rotate(-42deg); }.thumb-robust { background: linear-gradient(135deg, #3a292b, #172d42 46%, #08111f); }.thumb-robust::after { background: var(--coral); transform: rotate(42deg); }.thumb-minecraft { background: linear-gradient(135deg, #273a2e, #152c3c 46%, #08111f); }.thumb-minecraft::after { background: var(--cyan); transform: rotate(-28deg); }
.thumb-hil, .thumb-sports { background: linear-gradient(135deg, #3d2d32, #1c3146 46%, #08111f); }.thumb-hil::after { background: var(--coral); transform: rotate(30deg); }.thumb-gradient { background: linear-gradient(135deg, #263b32, #1b2d44 46%, #08111f); }.thumb-gradient::after { background: #d9b77a; transform: rotate(-15deg); }.thumb-token, .thumb-language { background: linear-gradient(135deg, #202e48, #352b42 46%, #08111f); }.thumb-token::after { background: var(--cyan); transform: rotate(18deg); }.thumb-perception { background: linear-gradient(135deg, #183b43, #172a43 46%, #08111f); }.thumb-perception::after { background: var(--cyan); transform: rotate(48deg); }.thumb-research { background: linear-gradient(135deg, #392d38, #24334a 46%, #08111f); }.thumb-research::after { background: #d9b77a; transform: rotate(-34deg); }.thumb-plamo { background: linear-gradient(135deg, #283d3d, #1c2e46 46%, #08111f); }.thumb-plamo::after { background: var(--coral); transform: rotate(4deg); }.thumb-open-source { background: linear-gradient(135deg, #163d42, #193149 46%, #08111f); }.thumb-open-source::after { background: var(--cyan); transform: rotate(-48deg); }.thumb-earth { background: linear-gradient(135deg, #39422b, #1a3140 46%, #08111f); }.thumb-earth::after { background: #d9b77a; transform: rotate(8deg); }.thumb-ensemble { background: linear-gradient(135deg, #28364c, #2c2942 46%, #08111f); }.thumb-ensemble::after { background: var(--cyan); transform: rotate(-12deg); }.thumb-horizon { background: linear-gradient(135deg, #3a2b2b, #193449 46%, #08111f); }.thumb-horizon::after { background: var(--coral); transform: rotate(0); }.thumb-assembly { background: linear-gradient(135deg, #213b43, #2e2c49 46%, #08111f); }.thumb-assembly::after { background: var(--cyan); transform: rotate(-8deg); }
.publication-copy h3 { margin-bottom: 0.4rem; font: 500 clamp(1rem, 1.5vw, 1.35rem)/1.12 var(--display); letter-spacing: -0.035em; }.publication-authors { margin-bottom: 0.45rem; color: var(--paper); font-size: 0.74rem; line-height: 1.45; }.publication-summary { max-width: 640px; margin: 0; color: var(--muted); font-size: 0.82rem; line-height: 1.5; }
.publication-meta { margin: 0; color: var(--group-accent, var(--coral)); font: 400 0.62rem/1.45 var(--mono); letter-spacing: 0.07em; text-align: right; text-transform: uppercase; }.publication-meta > span:not(.publication-links) { color: var(--muted); }.publication-links { display: flex; margin-top: 0.42rem; flex-wrap: wrap; gap: 0.42rem; justify-content: flex-end; }.publication-links a { color: var(--group-accent, var(--coral)); border-bottom: 1px solid var(--group-rule, rgba(255, 107, 74, 0.34)); font: 400 0.56rem/1.25 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; transition: color 180ms ease, border-color 180ms ease; }.publication-links a:hover { color: var(--paper); border-color: var(--paper); }

.site-footer { display: flex; padding-top: 1.5rem; padding-bottom: 1.5rem; border-top: 1px solid var(--rule); justify-content: space-between; color: var(--muted); font: 400 0.65rem var(--mono); text-transform: uppercase; }.site-footer p { margin: 0; }.site-footer > p:first-child { display: flex; gap: 0.55rem; align-items: center; color: var(--paper); }.footer-mark { width: 1.35rem; height: 1.35rem; font-size: 0.5rem; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity 700ms var(--ease), transform 700ms var(--ease); }.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1000px) {
  :root { --rail-width: 170px; }
  .hero { gap: 3rem; grid-template-columns: 0.9fr 1.1fr; }
  .readout-note { display: none; }
  .work-item { grid-template-columns: 0.8fr 2fr 1.3rem; gap: 1rem; }
}

@media (max-width: 820px) {
  :root { --rail-width: 0px; }
  .rail { position: relative; width: auto; height: 4.5rem; padding: 1rem var(--gutter); flex-direction: row; align-items: center; border-right: 0; border-bottom: 1px solid var(--rule); }
  .section-nav { display: flex; margin: 0; gap: 1rem; }.section-nav a { font-size: 0.58rem; }.section-nav a::before { display: none; }.rail-foot { display: none; }
  main, .site-footer { margin-left: 0; }
  .hero { width: 100%; min-height: auto; padding-top: clamp(1.5rem, 5vw, 3rem); padding-bottom: clamp(1.25rem, 4vw, 2rem); grid-template-columns: 1fr; grid-template-rows: auto; }
  .hero-heading h1 { font-size: clamp(2.35rem, 10.2vw, 4.8rem); }
  .hero-heading { grid-column: 1; grid-row: 1; }.hero-copy { display: contents; max-width: 720px; }.hero-lede { grid-column: 1; grid-row: 2; max-width: 560px; }.portrait-card { grid-column: 1; grid-row: 3; justify-self: start; width: 100%; max-width: 620px; }.profile-links { grid-column: 1; grid-row: 4; }.open-source-note { grid-column: 1; grid-row: 5; }
  .profile-links { margin-bottom: 0.25rem; }.open-source-note { margin-top: 0.25rem; }
  .focus-section { padding-top: clamp(2rem, 5vw, 3rem); }
  .section-heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .focus-panel { grid-template-columns: 1fr; gap: 2rem; }.focus-visual { height: 220px; }
  .project-card { grid-template-columns: 5rem minmax(0, 1fr); gap: 1.5rem; }.project-content { grid-column: 1 / -1; grid-row: 1; }.project-media { grid-column: 1 / -1; grid-row: 2; }.project-signal { grid-column: 1 / -1; grid-row: 3; }.project-status { grid-column: 1 / -1; grid-row: 4; }
  .project-thread-body { grid-template-columns: 1fr; gap: 1.25rem; }.project-thread-intro p:last-child { max-width: none; }
  .wasm-placeholder { grid-template-columns: 7rem 1fr; gap: 2rem; }.wasm-state { grid-column: 2; }
  .publication-item { grid-template-columns: 3.4rem minmax(0, 1fr); gap: 1rem; }.publication-thumb { width: 3.4rem; aspect-ratio: 1; }.publication-copy { display: contents; }.publication-copy h3 { grid-column: 2; grid-row: 1; }.publication-authors { grid-column: 1 / -1; grid-row: 2; }.publication-summary { grid-column: 1 / -1; grid-row: 3; }.publication-meta { grid-column: 1 / -1; grid-row: 4; text-align: left; }
  .project-signal, .project-status { display: none; }
  .publication-meta { display: grid; max-width: 100%; grid-template-columns: auto auto minmax(0, max-content); column-gap: 0.35rem; align-items: center; overflow-x: auto; text-align: left; white-space: nowrap; scrollbar-width: none; }
  .publication-meta::-webkit-scrollbar { display: none; }
  .publication-meta br { display: none !important; }
  .publication-meta > span:not(.publication-links)::before, .publication-meta .publication-links::before { margin: 0 0.45rem; color: var(--muted-dark); content: "·"; }
  .publication-meta .publication-links { display: inline-flex; margin-top: 0; flex-wrap: nowrap; gap: 0.5rem; justify-content: flex-start; }
}

@media (max-width: 560px) {
  body::before { background-size: 56px 56px; }
  .rail { height: 4rem; min-width: 0; }.wordmark { flex: none; }.wordmark-mark { width: 1.7rem; height: 1.7rem; }.wordmark-name { font-size: 0.58rem; }.section-nav { position: absolute; top: 0; right: var(--gutter); display: flex; width: calc(100% - 8.5rem); height: 4rem; min-width: 0; gap: 0.65rem; align-items: center; justify-content: flex-end; overflow: visible; }.section-nav a { flex: none; font-size: 0.5rem; }.hero { min-width: 0; }.hero-copy { min-width: 0; }
  .section-nav { display: none; }.rail-foot { display: flex; position: absolute; z-index: 2; top: 0.55rem; right: var(--gutter); max-width: 9rem; gap: 0.55rem; align-items: center; font: 400 0.46rem/1.3 var(--mono); }.cooking-indicator { width: 0.62rem; height: 0.62rem; margin-top: 0; }.hero { width: 100%; max-width: 100vw; }.hero-heading, .hero-copy { width: calc(100vw - (2 * var(--gutter))); max-width: calc(100vw - (2 * var(--gutter))); }.hero-lede { width: 18rem; max-width: 18rem; overflow-wrap: anywhere; }.portrait-card { width: 20rem; max-width: calc(100vw - (2 * var(--gutter))); }.portrait-placeholder, .project-content { width: 100%; min-width: 0; max-width: 100%; }.project-content h3, .project-content > p:not(.eyebrow) { overflow-wrap: anywhere; }.mobile-break { display: inline; }
  .hero .eyebrow { max-width: 17rem; line-height: 1.55; overflow-wrap: anywhere; }
  .profile-links { display: grid; width: 100%; max-width: none; margin-bottom: 1.25rem; grid-template-columns: minmax(0, 1fr) minmax(2rem, 0.55fr) minmax(0, 1.45fr); gap: 0.6rem; align-items: end; }.profile-links-label { grid-column: 1 / -1; padding-bottom: 0.15rem; }.profile-link { display: inline-flex; min-width: 0; justify-content: space-between; gap: 0.25rem; padding-bottom: 0.38rem; white-space: nowrap; }
  .profile-links { margin-bottom: 0.25rem; }.open-source-note { margin-top: 0.25rem; }
  .open-source-note { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 0.8rem 1rem; align-items: center; }.open-source-copy { grid-column: 1 / -1; grid-row: 1; }.open-source-note p { max-width: 18rem; }.open-source-impact { min-width: 0; padding: 0.8rem 0 0; grid-column: 1; grid-row: 2; align-self: center; border-top: 1px solid var(--rule); border-left: 0; }.open-source-note > a:not(.open-source-impact) { width: fit-content; grid-column: 2; grid-row: 2; align-self: center; justify-self: end; }
  h1 { max-width: 100%; font-size: clamp(2.85rem, 12.8vw, 5.2rem); overflow-wrap: anywhere; }.hero-tags span { font-size: 0.55rem; }.portrait-card figcaption { gap: 0.35rem; flex-direction: column; }
  .trajectory-readout { flex-direction: column; gap: 0.3rem; }.trajectory-controls { align-items: flex-start; flex-direction: column; gap: 1rem; }.trajectory-controls label { width: 100%; max-width: none; }
  .focus-tabs { display: grid; grid-template-columns: 1fr; }.focus-tab, .focus-tab:first-child { border-left: 1px solid var(--rule); border-bottom: 1px solid var(--rule); border-right: 1px solid var(--rule); }.focus-tab:last-child { border-bottom: 0; }.focus-tab::after { right: auto; width: 2px; top: 0; bottom: 0; }
  .project-card { grid-template-columns: 1fr; gap: 1.2rem; }.project-signal { min-height: 2rem; padding: 0; flex-direction: row; align-items: center; }.project-signal::after { top: 0.2rem; right: 0; bottom: auto; left: 2rem; width: auto; height: 1px; background: linear-gradient(90deg, var(--coral), transparent); }.project-gpc .project-signal::after { background: linear-gradient(90deg, var(--cyan), transparent); }.project-kimodo .project-signal::after { background: linear-gradient(90deg, #d9b77a, transparent); }.project-signal i:nth-of-type(2), .project-signal i:nth-of-type(3) { margin-left: 0.65rem; }.project-status { grid-column: 1 / -1; }
  .project-thread-path { grid-template-columns: 1fr; }.project-thread-node + .project-thread-node::before { display: none; }
  .wasm-placeholder { grid-template-columns: 1fr; gap: 1.5rem; }.wasm-mark { width: 100%; height: 6rem; }.wasm-state { grid-column: auto; }
  .publication-intro { align-items: flex-start; flex-direction: column; gap: 0.8rem; }.publication-item { grid-template-columns: 3.4rem minmax(0, 1fr); gap: 0.9rem; }.publication-thumb { width: 3.4rem; aspect-ratio: 1; }.publication-meta { grid-column: 1 / -1; text-align: left; }.publication-links { justify-content: flex-start; }.publication-copy h3 { overflow-wrap: anywhere; }
  .publication-group-heading { grid-template-columns: 1fr; gap: 0.7rem; }.publication-group-count { padding-bottom: 0; }
  .work-item { grid-template-columns: 1fr 1.2rem; gap: 0.8rem; }.work-meta { grid-column: 1 / -1; }.work-mark { grid-column: 2; grid-row: 2; }.work-body { grid-column: 1; grid-row: 2; }
  .site-footer { gap: 1rem; align-items: flex-start; flex-wrap: wrap; }.footer-note { order: 3; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
  .cooking-indicator, .cooking-indicator i, .cooking-indicator::before, .typing-cursor { animation: none !important; }
  .reveal { opacity: 1; transform: none; }
}