@font-face {
  font-family: "KMR Waldenburg";
  src:
    url("./font/KMRWaldenburg-Medium.woff2") format("woff2"),
    url("./font/KMRWaldenburg-Medium.woff") format("woff"),
    url("./font/KMRWaldenburg-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: block;
}

:root {
  --site-font-size: 12px;
  --paper: #fff;
  --ink: #111;
  --muted: rgba(17, 17, 17, 0.18);
  --blue: #1557ff;
  --green: #19e829;
  --red: #940f0f;
  --blue-p3: color(display-p3 0.055 0.28 1);
  --green-p3: color(display-p3 0.06 0.94 0.12);
  --red-p3: color(display-p3 0.56 0.035 0.035);
  --category-choreography: var(--red);
  --category-research: var(--green);
  --category-performance: var(--blue);
  --line: #111;
  --line-picker-color: #111;
  --panel-bg: #111;
  --panel-ink: #fff;
  --panel-muted: rgba(255, 255, 255, 0.36);
  --node-w: clamp(92px, 9.4vw, 178px);
  --node-w-wide: clamp(118px, 12.4vw, 224px);
  --node-w-small: clamp(72px, 7.1vw, 126px);
  color: var(--ink);
  background: var(--paper);
  font-family: "KMR Waldenburg", Arial, Helvetica, sans-serif;
  font-weight: 500;
}

@supports (color: color(display-p3 1 0 0)) {
  :root {
    --blue: var(--blue-p3);
    --green: var(--green-p3);
    --red: var(--red-p3);
  }
}

.is-dark {
  --paper: #050505;
  --ink: #f4f4ef;
  --muted: rgba(244, 244, 239, 0.2);
  --line: #f4f4ef;
  --line-picker-color: #f4f4ef;
  --panel-bg: #f4f4ef;
  --panel-ink: #050505;
  --panel-muted: rgba(5, 5, 5, 0.38);
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html {
  background-color: var(--paper);
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  scrollbar-width: none;
}

html.is-route-transitioning {
  scroll-behavior: auto !important;
}

body {
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  background-color: var(--paper);
  font-size: var(--site-font-size);
}

body :where(*) {
  font-size: var(--site-font-size);
}

@view-transition {
  navigation: auto;
}

::view-transition-group(root) {
  animation-duration: 620ms;
  animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
}

::view-transition-image-pair(root) {
  isolation: isolate;
}

::view-transition-old(root),
::view-transition-new(root) {
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  z-index: 1;
  animation: shared-page-out 620ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

::view-transition-new(root) {
  z-index: 2;
  animation: shared-page-in 620ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

::view-transition-group(jamuna-menu),
::view-transition-group(jamuna-menu-toggle) {
  z-index: 2000;
  animation: none;
}

::view-transition-image-pair(jamuna-menu),
::view-transition-image-pair(jamuna-menu-toggle) {
  isolation: isolate;
}

::view-transition-old(jamuna-menu),
::view-transition-old(jamuna-menu-toggle) {
  opacity: 0;
  animation: none;
}

::view-transition-new(jamuna-menu),
::view-transition-new(jamuna-menu-toggle) {
  opacity: 1;
  animation: none;
}

::view-transition-group(jamuna-menu-jamuna),
::view-transition-group(jamuna-menu-projects),
::view-transition-group(jamuna-menu-vision),
::view-transition-group(jamuna-menu-close) {
  z-index: 1002;
  animation-duration: 1ms;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

html.menu-route-transition::view-transition-group(jamuna-menu-jamuna),
html.menu-route-transition::view-transition-group(jamuna-menu-projects),
html.menu-route-transition::view-transition-group(jamuna-menu-vision),
html.menu-route-transition::view-transition-group(jamuna-menu-close) {
  animation-duration: 380ms;
}

html.project-detail-forward::view-transition-group(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-group(jamuna-menu-projects),
html.project-detail-forward::view-transition-group(jamuna-menu-vision),
html.project-detail-forward::view-transition-group(jamuna-menu-close),
html.project-detail-back::view-transition-group(jamuna-menu-jamuna),
html.project-detail-back::view-transition-group(jamuna-menu-projects),
html.project-detail-back::view-transition-group(jamuna-menu-vision),
html.project-detail-back::view-transition-group(jamuna-menu-close) {
  animation-duration: 540ms;
}

::view-transition-image-pair(jamuna-menu-jamuna),
::view-transition-image-pair(jamuna-menu-projects),
::view-transition-image-pair(jamuna-menu-vision),
::view-transition-image-pair(jamuna-menu-close) {
  isolation: isolate;
}

::view-transition-old(jamuna-menu-jamuna),
::view-transition-new(jamuna-menu-jamuna),
::view-transition-old(jamuna-menu-projects),
::view-transition-new(jamuna-menu-projects),
::view-transition-old(jamuna-menu-vision),
::view-transition-new(jamuna-menu-vision),
::view-transition-old(jamuna-menu-close),
::view-transition-new(jamuna-menu-close) {
  animation: none;
  mix-blend-mode: normal;
}

html.menu-route-transition::view-transition-old(jamuna-menu-jamuna),
html.menu-route-transition::view-transition-old(jamuna-menu-projects),
html.menu-route-transition::view-transition-old(jamuna-menu-vision),
html.menu-route-transition::view-transition-old(jamuna-menu-close) {
  animation: menu-segment-state-out 190ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

html.menu-route-transition::view-transition-new(jamuna-menu-jamuna),
html.menu-route-transition::view-transition-new(jamuna-menu-projects),
html.menu-route-transition::view-transition-new(jamuna-menu-vision),
html.menu-route-transition::view-transition-new(jamuna-menu-close) {
  animation: menu-segment-state-in 300ms 55ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

::view-transition-group(jamuna-menu-project) {
  z-index: 1001;
  animation-duration: 1ms;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

html.project-detail-forward::view-transition-group(jamuna-menu-project),
html.project-detail-back::view-transition-group(jamuna-menu-project) {
  animation-duration: 500ms;
}

::view-transition-image-pair(jamuna-menu-project) {
  isolation: isolate;
}

::view-transition-old(jamuna-menu-project) {
  transform-origin: 100% 50%;
  animation: none;
}

::view-transition-new(jamuna-menu-project) {
  transform-origin: 100% 50%;
  animation: none;
}

html.project-detail-back::view-transition-old(jamuna-menu-project) {
  animation: menu-project-segment-out 220ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

html.project-detail-forward::view-transition-new(jamuna-menu-project) {
  animation: menu-project-segment-in 500ms 30ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

html.project-detail-forward::view-transition-old(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-old(jamuna-menu-projects),
html.project-detail-forward::view-transition-old(jamuna-menu-vision),
html.project-detail-back::view-transition-old(jamuna-menu-jamuna),
html.project-detail-back::view-transition-old(jamuna-menu-projects),
html.project-detail-back::view-transition-old(jamuna-menu-vision),
html.project-detail-back::view-transition-old(jamuna-menu-close) {
  animation: menu-segment-state-out 260ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

html.project-detail-forward::view-transition-new(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-new(jamuna-menu-projects),
html.project-detail-forward::view-transition-new(jamuna-menu-vision),
html.project-detail-forward::view-transition-new(jamuna-menu-close),
html.project-detail-back::view-transition-new(jamuna-menu-jamuna),
html.project-detail-back::view-transition-new(jamuna-menu-projects),
html.project-detail-back::view-transition-new(jamuna-menu-vision) {
  animation: menu-segment-state-in 420ms 90ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

html.project-detail-back::view-transition-new(jamuna-primary-view) {
  animation: project-primary-return-in 780ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes shared-page-out {
  0% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    opacity: 1;
    transform: translate3d(-1vw, 0, 0) scale(0.995);
  }
}

@keyframes shared-page-in {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 100%);
    transform: translate3d(1.4vw, 0, 0) scale(1.008);
  }
  100% {
    opacity: 1;
    clip-path: inset(0);
    transform: translate3d(0, 0, 0) scale(1);
  }
}

html[data-astro-transition-fallback="old"] body {
  animation: shared-fallback-out 220ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

html[data-astro-transition-fallback="new"] body {
  animation: shared-fallback-in 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.legacy-transition-layer {
  position: fixed;
  z-index: 400;
  inset: 0;
  display: none;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.legacy-transition-layer.is-captured {
  display: block;
}

.legacy-transition-layer > main {
  animation: none !important;
  transition: none !important;
  pointer-events: none !important;
  transform: translate3d(0, calc(var(--legacy-scroll-y, 0px) * -1), 0);
}

html.is-legacy-transition[data-astro-transition-fallback="old"] body,
html.is-legacy-transition[data-astro-transition-fallback="new"] body {
  animation: none !important;
}

html.is-legacy-transition[data-astro-transition-fallback="new"] body > main {
  animation: legacy-page-horizontal-in 440ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

html.is-legacy-transition.project-detail-forward[data-astro-transition-fallback="new"] body > main {
  animation-name: legacy-page-vertical-forward-in;
}

html.is-legacy-transition.project-detail-back[data-astro-transition-fallback="new"] body > main {
  animation-name: legacy-page-vertical-back-in;
}

html.is-legacy-transition.to-vision[data-astro-transition-fallback="new"] body > main {
  position: relative;
  z-index: 90;
  animation: legacy-vision-overlay-in 520ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.is-legacy-transition.from-vision[data-astro-transition-fallback="new"] body > main {
  position: relative;
  z-index: 80;
  animation: none;
}

html.is-legacy-transition.legacy-vision-entering body > main {
  position: relative;
  z-index: 90;
  animation: legacy-vision-overlay-in 520ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

.legacy-transition-layer[data-motion="horizontal-forward"].is-releasing {
  animation: legacy-layer-horizontal-forward-out 440ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

.legacy-transition-layer[data-motion="horizontal-back"].is-releasing {
  animation: legacy-layer-horizontal-back-out 440ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

.legacy-transition-layer[data-motion="vertical-forward"].is-releasing {
  animation: legacy-layer-vertical-forward-out 440ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

.legacy-transition-layer[data-motion="vertical-back"].is-releasing {
  animation: legacy-layer-vertical-back-out 440ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

html.to-vision .legacy-transition-layer[data-motion="vision-overlay"] {
  z-index: 80;
}

.legacy-transition-layer[data-motion="vision-overlay"].is-releasing {
  animation: none;
}

html.from-vision .legacy-transition-layer[data-motion="vision-overlay-out"] {
  z-index: 90;
}

.legacy-transition-layer[data-motion="vision-overlay-out"].is-releasing {
  animation: legacy-vision-overlay-out 520ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

@keyframes legacy-page-horizontal-in {
  from { opacity: 0.72; transform: translate3d(3.5vw, 0, 0) scale(1.006); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes legacy-page-horizontal-back-in {
  from { opacity: 0.72; transform: translate3d(-3.5vw, 0, 0) scale(1.006); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes legacy-vision-overlay-in {
  from { transform: translate3d(100vw, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@keyframes legacy-vision-overlay-out {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(100vw, 0, 0); }
}

@keyframes legacy-page-vertical-forward-in {
  from { opacity: 0.72; transform: translate3d(0, 4vh, 0) scale(1.006); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes legacy-page-vertical-back-in {
  from { opacity: 0.72; transform: translate3d(0, -4vh, 0) scale(1.006); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes legacy-layer-horizontal-forward-out {
  to { opacity: 0; transform: translate3d(-3vw, 0, 0) scale(0.994); }
}

@keyframes legacy-layer-horizontal-back-out {
  to { opacity: 0; transform: translate3d(3vw, 0, 0) scale(0.994); }
}

@keyframes legacy-layer-vertical-forward-out {
  to { opacity: 0; transform: translate3d(0, -3vh, 0) scale(0.994); }
}

@keyframes legacy-layer-vertical-back-out {
  to { opacity: 0; transform: translate3d(0, 3vh, 0) scale(0.994); }
}

html.is-safari.is-legacy-transition[data-astro-transition-fallback="new"] body > main {
  animation: legacy-safari-horizontal-forward-in 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

html.is-safari.is-legacy-transition.projects-to-landing[data-astro-transition-fallback="new"] body > main {
  animation-name: legacy-safari-horizontal-back-in;
}

html.is-safari.is-legacy-transition.project-detail-forward[data-astro-transition-fallback="new"] body > main {
  animation-name: legacy-safari-vertical-forward-in;
}

html.is-safari.is-legacy-transition.project-detail-back[data-astro-transition-fallback="new"] body > main {
  animation-name: legacy-safari-vertical-back-in;
}

html.is-safari.is-legacy-transition.to-vision[data-astro-transition-fallback="new"] body > main {
  animation: legacy-vision-overlay-in 460ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.is-safari.is-legacy-transition.from-vision[data-astro-transition-fallback="new"] body > main {
  animation: none;
}

html.is-safari.is-legacy-transition.legacy-vision-entering body > main {
  animation: legacy-vision-overlay-in 460ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.is-safari .legacy-transition-layer[data-motion="horizontal-forward"].is-releasing {
  animation: legacy-safari-horizontal-forward-out 320ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

html.is-safari .legacy-transition-layer[data-motion="horizontal-back"].is-releasing {
  animation: legacy-safari-horizontal-back-out 320ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

html.is-safari .legacy-transition-layer[data-motion="vertical-forward"].is-releasing {
  animation: legacy-safari-vertical-forward-out 320ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

html.is-safari .legacy-transition-layer[data-motion="vertical-back"].is-releasing {
  animation: legacy-safari-vertical-back-out 320ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

html.is-safari .legacy-transition-layer[data-motion="vision-overlay-out"].is-releasing {
  animation: legacy-vision-overlay-out 460ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.is-page-transition-disabled[data-astro-transition-fallback="old"] body,
html.is-page-transition-disabled[data-astro-transition-fallback="new"] body,
html.is-page-transition-disabled[data-astro-transition-fallback="old"] body > main,
html.is-page-transition-disabled[data-astro-transition-fallback="new"] body > main {
  opacity: 1 !important;
  clip-path: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}

html.is-page-transition-disabled .legacy-transition-layer {
  display: none !important;
}

html.is-legacy-transition.project-detail-to-landing[data-astro-transition-fallback="new"] body > main {
  animation: legacy-media-return-in 320ms linear both;
}

html.project-detail-to-landing .legacy-transition-layer[data-motion="vertical-back"].is-releasing {
  animation: legacy-media-return-out 260ms linear both;
}

@keyframes legacy-media-return-in {
  from { opacity: 0.78; transform: translate3d(0, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-media-return-out {
  from { opacity: 1; transform: translate3d(0, 0, 0); }
  to { opacity: 0; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-safari-horizontal-forward-in {
  from { opacity: 0.86; transform: translate3d(12px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-safari-horizontal-back-in {
  from { opacity: 0.86; transform: translate3d(-12px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-safari-vertical-forward-in {
  from { opacity: 0.86; transform: translate3d(0, 9px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-safari-vertical-back-in {
  from { opacity: 0.86; transform: translate3d(0, -9px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes legacy-safari-horizontal-forward-out {
  to { opacity: 0; transform: translate3d(-8px, 0, 0); }
}

@keyframes legacy-safari-horizontal-back-out {
  to { opacity: 0; transform: translate3d(8px, 0, 0); }
}

@keyframes legacy-safari-vertical-forward-out {
  to { opacity: 0; transform: translate3d(0, -6px, 0); }
}

@keyframes legacy-safari-vertical-back-out {
  to { opacity: 0; transform: translate3d(0, 6px, 0); }
}

@keyframes shared-fallback-out {
  to {
    opacity: 0.82;
    transform: translate3d(-1vw, 0, 0) scale(0.995);
  }
}

@keyframes shared-fallback-in {
  from {
    opacity: 0.82;
    transform: translate3d(1vw, 0, 0) scale(1.006);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes shared-menu-out {
  to {
    opacity: 0;
  }
}

@keyframes shared-menu-in {
  from {
    opacity: 0;
  }
}

@keyframes project-primary-return-in {
  from {
    opacity: 0.72;
    transform: translate3d(0, -1.2vh, 0) scale(0.996);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes jamuna-primary-view-forward-out {
  from {
    transform: translate3d(0, 0, 0);
    clip-path: inset(0);
    opacity: 1;
  }
  to {
    transform: translate3d(-12vw, 0, 0);
    clip-path: inset(0 12% 0 0);
    opacity: 1;
  }
}

@keyframes jamuna-primary-view-forward-in {
  from {
    transform: translate3d(18vw, 0, 0);
    clip-path: inset(0 0 0 100%);
    opacity: 1;
  }
  to {
    transform: translate3d(0, 0, 0);
    clip-path: inset(0);
    opacity: 1;
  }
}

@keyframes menu-project-segment-in {
  from {
    opacity: 0;
    transform: translate3d(18px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes menu-project-segment-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(14px, 0, 0);
  }
}

@keyframes menu-segment-state-out {
  to { opacity: 0; }
}

@keyframes menu-segment-state-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

html.project-detail-forward::view-transition-group(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-group(jamuna-menu-projects),
html.project-detail-forward::view-transition-group(jamuna-menu-vision),
html.project-detail-forward::view-transition-group(jamuna-menu-project),
html.project-detail-forward::view-transition-group(jamuna-menu-close),
html.project-detail-back::view-transition-group(jamuna-menu-jamuna),
html.project-detail-back::view-transition-group(jamuna-menu-projects),
html.project-detail-back::view-transition-group(jamuna-menu-vision),
html.project-detail-back::view-transition-group(jamuna-menu-project),
html.project-detail-back::view-transition-group(jamuna-menu-close) {
  animation-duration: 500ms;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

html.project-detail-forward::view-transition-old(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-old(jamuna-menu-projects),
html.project-detail-forward::view-transition-old(jamuna-menu-vision),
html.project-detail-back::view-transition-old(jamuna-menu-jamuna),
html.project-detail-back::view-transition-old(jamuna-menu-projects),
html.project-detail-back::view-transition-old(jamuna-menu-vision) {
  animation: menu-label-snapshot-old 500ms linear both;
}

html.project-detail-forward::view-transition-new(jamuna-menu-jamuna),
html.project-detail-forward::view-transition-new(jamuna-menu-projects),
html.project-detail-forward::view-transition-new(jamuna-menu-vision),
html.project-detail-back::view-transition-new(jamuna-menu-jamuna),
html.project-detail-back::view-transition-new(jamuna-menu-projects),
html.project-detail-back::view-transition-new(jamuna-menu-vision) {
  animation: menu-label-snapshot-new 500ms linear both;
}

html.project-detail-forward::view-transition-new(jamuna-menu-project),
html.project-detail-forward::view-transition-new(jamuna-menu-close) {
  transform-origin: 100% 50%;
  animation: menu-project-segment-in 500ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

html.project-detail-back::view-transition-old(jamuna-menu-project),
html.project-detail-back::view-transition-old(jamuna-menu-close) {
  transform-origin: 100% 50%;
  animation: menu-project-segment-out 260ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

@keyframes jamuna-vision-forward-in {
  from { transform: translate3d(100vw, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@keyframes jamuna-vision-forward-out {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(100vw, 0, 0); }
}

html.to-vision::view-transition-old(jamuna-primary-view) {
  z-index: 1;
  opacity: 1;
  animation: none;
  transform: none;
}

html.to-vision::view-transition-new(jamuna-primary-view) {
  z-index: 2;
  animation: jamuna-vision-forward-in 620ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.to-vision::view-transition-old(root) {
  opacity: 1;
  animation: none;
  transform: none;
}

html.to-vision::view-transition-new(root) {
  opacity: 0;
  animation: none;
}

html.from-vision::view-transition-old(jamuna-primary-view) {
  z-index: 2;
  animation: jamuna-vision-forward-out 620ms cubic-bezier(0.65, 0, 0.35, 1) both;
}

html.from-vision::view-transition-new(jamuna-primary-view) {
  z-index: 1;
  animation: none;
}

html.from-vision::view-transition-old(root) {
  opacity: 0;
  animation: none;
}

html.from-vision::view-transition-new(root) {
  opacity: 1;
  animation: none;
}

html.project-detail-to-landing::view-transition-new(root) {
  animation: project-landing-network-in 420ms linear both;
}

html.project-detail-to-landing::view-transition-old(root) {
  animation: project-landing-detail-out 280ms linear both;
}

html.project-detail-to-landing::view-transition-new(jamuna-primary-view) {
  animation: project-landing-network-in 420ms linear both;
}

@keyframes project-landing-detail-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes project-landing-network-in {
  from {
    opacity: 0.78;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes jamuna-primary-view-back-out {
  from {
    transform: translate3d(0, 0, 0);
    clip-path: inset(0);
  }
  to {
    transform: translate3d(12vw, 0, 0);
    clip-path: inset(0 0 0 12%);
  }
}

@keyframes jamuna-primary-view-back-in {
  from {
    transform: translate3d(-18vw, 0, 0);
    clip-path: inset(0 100% 0 0);
  }
  to {
    transform: translate3d(0, 0, 0);
    clip-path: inset(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(root),
  ::view-transition-group(jamuna-menu),
  ::view-transition-group(jamuna-menu-jamuna),
  ::view-transition-group(jamuna-menu-projects),
  ::view-transition-group(jamuna-menu-vision),
  ::view-transition-group(jamuna-menu-project),
  ::view-transition-group(jamuna-menu-close) {
    animation-duration: 1ms !important;
  }

  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-old(jamuna-menu),
  ::view-transition-new(jamuna-menu),
  ::view-transition-old(jamuna-menu-jamuna),
  ::view-transition-new(jamuna-menu-jamuna),
  ::view-transition-old(jamuna-menu-projects),
  ::view-transition-new(jamuna-menu-projects),
  ::view-transition-old(jamuna-menu-vision),
  ::view-transition-new(jamuna-menu-vision),
  ::view-transition-old(jamuna-menu-project),
  ::view-transition-new(jamuna-menu-project),
  ::view-transition-old(jamuna-menu-close),
  ::view-transition-new(jamuna-menu-close) {
    animation: none !important;
  }
}

.page-enter body {
  animation: landing-page-in 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.page-leave body {
  animation: landing-page-out 180ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

.page-leave-detail body {
  animation: landing-to-detail 320ms cubic-bezier(0.55, 0, 1, 0.45) both;
}

@keyframes landing-page-in {
  from {
    opacity: 0;
    transform: scale(1.012);
  }
}

@keyframes landing-page-out {
  to {
    opacity: 0;
    transform: scale(0.99);
  }
}

@keyframes landing-to-detail {
  to {
    opacity: 0;
    transform: scale(1.035);
  }
}

.stage {
  position: fixed;
  inset: 0;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background-color: var(--paper);
  cursor: default;
  isolation: isolate;
  perspective: 680px;
  perspective-origin: 48% 44%;
}

.landing-category-sentence {
  --landing-category-text-inset: 8px;
  position: fixed;
  z-index: 130;
  top: calc(max(14px, env(safe-area-inset-top, 0px)) + var(--landing-category-text-inset));
  left: calc(max(14px, env(safe-area-inset-left, 0px)) + var(--landing-category-text-inset));
  display: flex;
  gap: clamp(12px, 1.35vw, 20px);
  align-items: baseline;
  margin: 0;
  color: var(--ink);
  line-height: 1;
  text-transform: uppercase;
  opacity: 1;
  transform: none;
  pointer-events: auto;
  transition: filter 180ms linear;
}

.landing-category-sentence[hidden] {
  display: none !important;
}

.landing-category-token {
  --landing-category-index: 0;
  display: inline-block;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  animation:
    landing-category-token-in
    520ms
    calc(150ms + var(--landing-category-index) * 58ms)
    cubic-bezier(0.16, 1, 0.3, 1)
    backwards;
  transition:
    opacity 180ms linear calc(var(--landing-category-index) * 34ms),
    transform 300ms cubic-bezier(0.55, 0, 0.35, 1) calc(var(--landing-category-index) * 34ms);
}

.landing-category-brand {
  --landing-category-index: 0;
}

.landing-category-word {
  cursor: default;
}

.landing-category-word.is-choreography {
  --landing-category-index: 1;
  color: var(--category-choreography);
}

.landing-category-word.is-research {
  --landing-category-index: 2;
  color: var(--category-research);
}

.landing-category-word.is-performance {
  --landing-category-index: 3;
  color: var(--category-performance);
}

@media (hover: hover) and (pointer: fine) and (min-width: 761px) {
  .landing-category-word {
    cursor: pointer;
  }

  .landing-category-sentence:has(.landing-category-word:hover) .landing-category-word {
    transition-delay: 0ms, 0ms;
  }

  .landing-category-sentence:has(.landing-category-word:hover) .landing-category-word:not(:hover) {
    opacity: 0.28;
  }

  .stage[data-hover-category="choreography"] .work-node:not([data-main-category="choreography"]),
  .stage[data-hover-category="research"] .work-node:not([data-main-category="research"]),
  .stage[data-hover-category="performance"] .work-node:not([data-main-category="performance"]) {
    opacity: min(var(--opacity, 1), 0.12);
  }
}

@keyframes landing-category-token-in {
  from {
    opacity: 0;
    transform: translate3d(-8px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-category-sentence {
    opacity: 1;
    transform: none;
    animation: none;
  }

  .landing-category-token {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }

}

:root.has-focused-work .stage {
  cursor: pointer;
}

:root.has-focused-work .landing-category-sentence {
  filter: opacity(0.28);
  pointer-events: none;
}

:root.has-focused-work .landing-features {
  filter: opacity(0.28);
  pointer-events: none;
}

:root.has-focused-work .landing-category-word {
  cursor: default;
}

.landing-transition-preview {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: none;
  overflow: hidden;
  pointer-events: none;
  background: var(--paper);
}

.landing-transition-preview.is-releasing {
  opacity: 0;
  transition: opacity 200ms linear;
}

.projects-to-landing {
  --network-intro: 1;
}

.project-detail-to-landing {
  --network-intro: 1;
}

.project-detail-to-landing .landing-transition-preview,
.is-landing-media-return-pending .landing-transition-preview {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.project-detail-to-landing:not(.is-landing-media-return-ready),
.project-detail-to-landing:not(.is-landing-media-return-ready) body,
.is-landing-media-return-pending,
.is-landing-media-return-pending body {
  --paper: #050505;
  --ink: #f4f4ef;
  --muted: rgba(244, 244, 239, 0.2);
  --line: #f4f4ef;
  --line-picker-color: #f4f4ef;
  --panel-bg: #f4f4ef;
  --panel-ink: #050505;
  --panel-muted: rgba(5, 5, 5, 0.38);
  background-color: #050505 !important;
}

.project-detail-to-landing:not(.is-landing-media-return-ready) .stage,
.is-landing-media-return-pending .stage {
  background-color: #050505 !important;
}

.project-detail-to-landing:not(.is-landing-media-return-ready) .landing-category-sentence,
.project-detail-to-landing:not(.is-landing-media-return-ready) .landing-features,
.project-detail-to-landing:not(.is-landing-media-return-ready) .landing-feature,
.is-landing-media-return-pending .landing-category-sentence,
.is-landing-media-return-pending .landing-features,
.is-landing-media-return-pending .landing-feature {
  opacity: 0 !important;
  visibility: hidden !important;
  filter: none !important;
  animation: none !important;
  transition: none !important;
}

.projects-to-landing:not(.runtime-connections-ready) .network,
.vision-to-landing:not(.runtime-connections-ready) .network,
.from-archive:not(.runtime-connections-ready) .network,
.project-detail-to-landing:not(.runtime-connections-ready) .network {
  opacity: 0;
}

.is-landing-media-return-pending .network,
.is-landing-media-return-pending .network-depth-blur {
  opacity: 0 !important;
  transition: none !important;
}

.is-return-connections-pending .landing-transition-preview,
.is-return-connections-revealing .landing-transition-preview {
  display: none;
}

.landing-transition-preview > svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.landing-transition-preview path {
  fill: none;
  stroke: rgba(17, 17, 17, 0.64);
  stroke-width: 0.48;
  vector-effect: non-scaling-stroke;
}

.landing-transition-preview path.is-secondary {
  stroke: rgba(17, 17, 17, 0.44);
}

.landing-transition-lines-mobile {
  display: none;
}

@media (max-width: 760px) {
  .landing-transition-lines-desktop {
    display: none;
  }

  .landing-transition-lines-mobile {
    display: inline;
  }
}

.theme-fade-overlay {
  position: fixed;
  z-index: 4;
  inset: 0;
  opacity: 0;
  background-color: var(--paper);
  pointer-events: none;
  transition: opacity 620ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity;
}

.is-theme-transitioning,
.is-theme-transitioning body,
.is-theme-transitioning .stage {
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.graph-mark {
  position: fixed;
  z-index: 6;
  top: clamp(18px, 2.4vw, 38px);
  left: clamp(22px, 2.7vw, 46px);
  width: clamp(104px, 7.7vw, 142px);
  height: auto;
  opacity: var(--splash-mark-opacity, 0);
  transform:
    translate3d(
      calc((1 - var(--splash-mark-opacity, 0)) * -10px),
      calc((1 - var(--splash-mark-opacity, 0)) * -8px),
      0
    )
    scale(calc(0.94 + var(--splash-mark-opacity, 0) * 0.06));
  transition:
    opacity 180ms linear,
    transform 180ms linear;
  pointer-events: none;
}

.site-menu {
  position: fixed;
  z-index: 120;
  top: clamp(14px, 1.8vw, 28px);
  left: clamp(14px, 1.8vw, 28px);
  display: grid;
  gap: 8px;
  min-width: clamp(116px, 7.4vw, 148px);
  padding: 19px 23px;
  border-radius: 20px;
  background: #000;
  color: rgba(255, 255, 255, 0.28);
  text-align: center;
  line-height: 1;
  text-transform: uppercase;
  opacity: var(--network-intro, 0);
  font-size: var(--site-font-size);
  transform: translate3d(0, calc((1 - var(--network-intro, 0)) * 12px), 0);
  transition:
    opacity 180ms linear,
    transform 180ms linear;
  pointer-events: auto;
  view-transition-name: jamuna-menu;
}

.site-menu-shell {
  display: contents;
}

.mobile-menu-toggle,
.mobile-menu-surface {
  display: none;
}

.mobile-menu-toggle {
  view-transition-name: jamuna-menu-toggle;
}

html.projects-to-landing .site-menu,
html.vision-to-landing .site-menu,
html.projects-to-landing .mobile-menu-toggle,
html.vision-to-landing .mobile-menu-toggle {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition: none;
}

.site-menu-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.site-menu-link.is-active,
.site-menu-link:hover {
  color: #fff;
}

.landing-features {
  position: fixed;
  z-index: 110;
  left: clamp(10px, 1.1vw, 18px);
  bottom: clamp(10px, 1.1vw, 18px);
  display: flex;
  gap: 8px;
  align-items: flex-end;
  max-width: calc(100vw - 32px);
  opacity: var(--network-intro, 0);
  font-size: var(--site-font-size);
  transform: translate3d(calc((1 - var(--network-intro, 0)) * -16px), 0, 0);
  transition:
    opacity 180ms linear,
    transform 180ms linear,
    filter 180ms linear;
}

.landing-feature {
  --landing-feature-index: 0;
  display: grid;
  grid-template-columns: max-content minmax(0, max-content) 8px;
  gap: clamp(14px, 1.1vw, 22px);
  align-items: start;
  flex: 0 0 auto;
  width: fit-content;
  min-width: 0;
  max-width: min(680px, calc(100vw - 28px));
  min-height: 34px;
  padding: 7px 9px 7px 12px;
  border-radius: 6px;
  background: rgba(132, 132, 132, 0.72);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  color: #fff;
  line-height: 1.02;
  text-decoration: none;
  text-transform: uppercase;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  animation:
    landing-feature-in
    620ms
    calc(230ms + var(--landing-feature-index) * 115ms)
    cubic-bezier(0.16, 1, 0.3, 1)
    backwards;
  transition:
    background 180ms linear,
    opacity 240ms linear,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.landing-feature--no-date {
  grid-template-columns: minmax(0, max-content) 8px;
  gap: 10px;
}

.landing-feature-date {
  color: rgba(255, 255, 255, 0.42);
  white-space: nowrap;
}

.landing-feature-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.landing-feature strong {
  display: block;
  min-width: 0;
  font-style: normal;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.landing-feature-dot {
  width: 8px;
  height: 8px;
  margin-top: 2px;
  border-radius: 999px;
  background: var(--landing-feature-color, #19e829);
  justify-self: end;
  animation:
    landing-feature-dot-blink
    3.2s
    calc(0.7s + var(--landing-feature-index) * 0.72s)
    linear
    infinite;
}

@supports (background: color(display-p3 1 0 0)) {
  .landing-feature-dot {
    background: var(--landing-feature-color-p3, var(--landing-feature-color, var(--green)));
  }
}

.landing-feature:hover {
  background: rgba(92, 92, 92, 0.82);
}

@keyframes landing-feature-in {
  from {
    opacity: 0;
    transform: translate3d(-18px, 12px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes landing-feature-dot-blink {
  0%,
  68%,
  74%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  70%,
  72% {
    opacity: 0.24;
    transform: scale(0.78);
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-feature {
    opacity: 1;
    transform: none;
    animation: none;
    transition: background 180ms linear;
  }

  .landing-feature-dot {
    animation: none;
  }
}

.is-surface-dark .graph-mark {
  filter: invert(1) grayscale(1) contrast(1.18);
}

.dev-console {
  position: fixed;
  z-index: 240;
  top: clamp(16px, 2vw, 28px);
  right: clamp(16px, 2vw, 28px);
  display: grid;
  width: min(286px, calc(100vw - 32px));
  max-height: calc(100vh - clamp(32px, 4vw, 56px));
  max-height: calc(100dvh - clamp(32px, 4vw, 56px));
  padding: 12px;
  border: 1px solid var(--panel-muted);
  border-radius: 6px;
  background: var(--panel-bg);
  color: var(--panel-ink);
  opacity: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--panel-muted) transparent;
  touch-action: pan-y;
  pointer-events: none;
  transform: translate3d(0, -10px, 0);
  transition:
    opacity 160ms linear,
    transform 220ms cubic-bezier(0.16, 1, 0.3, 1),
    background 520ms cubic-bezier(0.16, 1, 0.3, 1),
    color 520ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 180ms linear;
}

.is-dev-console-open .dev-console {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
}

.dev-console-header,
.dev-console-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dev-console-header {
  position: sticky;
  z-index: 2;
  top: -12px;
  min-height: 24px;
  padding: 12px 0 8px;
  border-bottom: 1px solid var(--panel-muted);
  background: var(--panel-bg);
  font-size: var(--site-font-size);
  text-transform: uppercase;
}

.dev-console::-webkit-scrollbar {
  width: 5px;
}

.dev-console::-webkit-scrollbar-thumb {
  background: var(--panel-muted);
}

.dev-console-close {
  display: grid;
  width: 24px;
  height: 24px;
  padding: 0;
  place-items: center;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: var(--site-font-size);
  line-height: 1;
}

.dev-console-row {
  min-height: 34px;
  padding: 6px 0;
  border-bottom: 1px solid var(--panel-muted);
  font-size: var(--site-font-size);
  text-transform: uppercase;
}

.dev-console-row > span:first-child {
  flex: 0 0 74px;
}

.dev-console output {
  color: var(--panel-muted);
}

:root:not([data-connection-mode="web"]) .web-branching-control {
  opacity: 0.42;
}

.dev-console input[type="range"] {
  width: 128px;
  height: 18px;
  margin: 0;
  accent-color: var(--panel-ink);
  cursor: pointer;
}

.connection-modes,
.arrangement-modes,
.anchor-modes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  flex: 1 1 auto;
  border: 1px solid var(--panel-muted);
}

.connection-modes button,
.arrangement-modes button,
.anchor-modes button {
  min-width: 0;
  padding: 5px 4px;
  border: 0;
  border-right: 1px solid var(--panel-muted);
  border-bottom: 1px solid var(--panel-muted);
  background: transparent;
  color: var(--panel-muted);
  cursor: pointer;
  font: inherit;
  font-size: var(--site-font-size);
  text-transform: uppercase;
}

.connection-modes button:nth-child(2n),
.connection-modes button:last-child,
.arrangement-modes button:nth-child(2n),
.arrangement-modes button:last-child,
.anchor-modes button:nth-child(2n),
.anchor-modes button:last-child {
  border-right: 0;
}

.connection-modes button:nth-last-child(-n + 1),
.arrangement-modes button:nth-last-child(-n + 2),
.anchor-modes button {
  border-bottom: 0;
}

.connection-modes button.is-active,
.arrangement-modes button.is-active,
.anchor-modes button.is-active {
  background: var(--panel-ink);
  color: var(--panel-bg);
}

.anchor-modes button:nth-child(-n + 2) {
  border-bottom: 1px solid var(--panel-muted);
}

.anchor-modes button:last-child {
  grid-column: 1 / -1;
  border-right: 0;
  border-bottom: 0;
}

.connection-modes .alpine-mode-button,
.arrangement-modes .alpine-arrangement-button {
  grid-column: 1 / -1;
  border-right: 0;
  border-bottom: 0;
}

.arrangement-modes button:nth-last-child(2) {
  border-bottom: 1px solid var(--panel-muted);
}

.dev-console-toggle input {
  width: 30px;
  height: 16px;
  margin: 0;
  accent-color: var(--panel-ink);
  cursor: pointer;
}

.color-swatches {
  display: flex;
  align-items: center;
  gap: 8px;
}

.color-swatch,
.color-custom {
  display: block;
  width: 18px;
  height: 18px;
  border: 1px solid var(--panel-muted);
  border-radius: 50%;
  background: var(--swatch);
  cursor: pointer;
}

.line-color-input {
  width: 30px;
  height: 22px;
  padding: 2px;
  border: 1px solid var(--panel-muted);
  background: transparent;
  cursor: pointer;
}

.dev-console-reset {
  justify-self: end;
  margin-top: 9px;
  padding: 5px 8px;
  border: 1px solid var(--panel-muted);
  border-radius: 3px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: var(--site-font-size);
  text-transform: uppercase;
}

.color-swatch {
  padding: 0;
}

.color-swatch.is-active {
  outline: 1px solid var(--panel-ink);
  outline-offset: 3px;
}

.color-custom {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, #940f0f, #004dff 50%, #04f200);
}

.color-input {
  position: absolute;
  inset: -6px;
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  border: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
}

.network,
.nodes {
  position: absolute;
  inset: 0;
}

.warp-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

.network {
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: var(--network-intro, 0);
}

.network-depth-blur {
  image-rendering: auto;
  will-change: filter;
  transition: opacity 140ms linear;
}

.is-focus-motion .network-depth-blur {
  opacity: 0;
}

.is-low-power .network-depth-blur {
  display: none;
}

.nodes {
  z-index: 7;
  pointer-events: none;
  transform-style: flat;
  opacity: var(--network-intro, 0);
}

.nodes::before {
  content: "";
  position: absolute;
  z-index: 80;
  inset: 0;
  background-color: var(--paper);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 240ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

:root.has-node-hover:not(.is-theme-transitioning) .nodes::before {
  opacity: 0.64;
}

:root.has-node-hover:not(.is-theme-transitioning) .landing-features {
  filter: opacity(0.28);
}

:root.has-focused-work .nodes::before {
  background-color: #000;
  opacity: 0.76;
  transition:
    opacity 240ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 0ms linear;
}

.work-node {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--w, var(--node-w));
  opacity: var(--opacity, 0);
  transform: translate3d(var(--tx, 0), var(--ty, 0), 0);
  transform-origin: center;
  transform-style: flat;
  backface-visibility: hidden;
  contain: layout style;
  color: var(--label-color, var(--blue));
  cursor: pointer;
  pointer-events: auto;
  user-select: none;
  will-change: transform, opacity, filter;
  transition: opacity 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

@media (max-width: 760px) {
  .nodes,
  .work-node,
  .work-media {
    touch-action: none;
  }
}

.work-node[data-landing-ssr] {
  left: var(--ssr-x);
  top: var(--ssr-y);
  --opacity: 1;
  transform: translate3d(-50%, -50%, 0);
}

:root:is(.projects-to-landing, .vision-to-landing, .project-detail-to-landing, .from-archive)
  .work-node[data-landing-ssr] {
  --opacity: 0;
  pointer-events: none;
}

@media (max-width: 760px) {
  .landing-category-sentence {
    top: auto;
    bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 16px));
    left: max(7px, env(safe-area-inset-left, 0px));
    right: max(7px, env(safe-area-inset-right, 0px));
    max-width: none;
    gap: 7px;
    flex-wrap: wrap;
    pointer-events: none;
  }

  .work-node[data-landing-ssr] {
    left: var(--ssr-mobile-x);
    top: var(--ssr-mobile-y);
  }
}

.is-scatter-exiting .work-node {
  opacity: 0;
  transform:
    translate3d(
      calc(var(--scatter-exit-base-x, var(--tx, 0px)) + var(--scatter-exit-x, 0px)),
      calc(var(--scatter-exit-base-y, var(--ty, 0px)) + var(--scatter-exit-y, 0px)),
      0
    )
    scale(var(--scatter-exit-scale, 0.76));
  pointer-events: none;
  transition:
    opacity 230ms linear calc(var(--scatter-delay, 0ms) + 80ms),
    transform 560ms cubic-bezier(0.18, 0.9, 0.22, 1) var(--scatter-delay, 0ms);
}

.is-scatter-exiting .stage[data-hover-category] .work-node {
  opacity: 0;
}

.is-scatter-entering .work-node {
  opacity: 0;
  transform:
    translate3d(
      calc(var(--scatter-entry-base-x, var(--tx, 0px)) + var(--scatter-entry-x, 0px)),
      calc(var(--scatter-entry-base-y, var(--ty, 0px)) + var(--scatter-entry-y, 0px)),
      0
    )
    scale(var(--scatter-entry-scale, 0.76));
  pointer-events: none;
  transition: none;
}

.is-landing-media-return-ready.is-scatter-entering .work-node:is(.is-focus-target, .is-focused) {
  opacity: 1;
  transform: translate3d(var(--tx, 0), var(--ty, 0), 0);
  pointer-events: auto;
}

.is-scatter-entry-releasing .work-node {
  transform:
    translate3d(
      var(--scatter-entry-base-x, var(--tx, 0px)),
      var(--scatter-entry-base-y, var(--ty, 0px)),
      0
    );
  transition:
    opacity 360ms linear var(--scatter-entry-delay, 0ms),
    transform 760ms cubic-bezier(0.16, 1, 0.3, 1) var(--scatter-entry-delay, 0ms);
}

.project-detail-to-landing.is-scatter-entry-releasing .work-node:is(.is-focus-target, .is-focused),
.is-returning-to-landing.is-scatter-entry-releasing .work-node:is(.is-focus-target, .is-focused) {
  opacity: 1;
  transition: transform 760ms cubic-bezier(0.16, 1, 0.3, 1) var(--scatter-entry-delay, 0ms);
}

.projects-to-landing .landing-feature,
.vision-to-landing .landing-feature,
.from-archive .landing-feature,
.project-detail-to-landing .landing-feature,
.is-returning-to-landing .landing-feature {
  animation: none;
}

.projects-to-landing:not(.is-scatter-entry-releasing) .landing-features,
.vision-to-landing:not(.is-scatter-entry-releasing) .landing-features,
.from-archive:not(.is-scatter-entry-releasing) .landing-features,
.project-detail-to-landing:not(.is-scatter-entry-releasing) .landing-features {
  pointer-events: none;
}

.projects-to-landing:not(.is-scatter-entry-releasing) .landing-feature,
.vision-to-landing:not(.is-scatter-entry-releasing) .landing-feature,
.from-archive:not(.is-scatter-entry-releasing) .landing-feature,
.project-detail-to-landing:not(.is-scatter-entry-releasing) .landing-feature {
  opacity: 0;
  transform: translate3d(-26px, 14px, 0);
  transition: none;
}

.is-returning-to-landing .landing-features {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition: filter 180ms linear;
}

.is-returning-to-landing.has-focused-work .landing-features {
  transition: none;
}

.is-scatter-entering .landing-feature {
  opacity: 0;
  transform: translate3d(-26px, 14px, 0);
  animation: none;
  transition: none;
}

.is-scatter-entry-releasing .landing-feature {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  animation: none;
  transition:
    opacity 420ms linear calc(220ms + var(--landing-feature-index) * 115ms),
    transform 760ms cubic-bezier(0.16, 1, 0.3, 1) calc(220ms + var(--landing-feature-index) * 115ms);
}

.is-scatter-entering .network,
.is-scatter-entering .network-depth-blur {
  opacity: 0;
}

.is-scatter-entry-releasing .network,
.is-scatter-entry-releasing .network-depth-blur {
  transition: opacity 300ms linear 260ms;
}

.is-return-connections-pending .network,
.is-return-connections-pending .network-depth-blur {
  opacity: 0 !important;
  transition: none !important;
}

.is-return-connections-revealing .network,
.is-return-connections-revealing .network-depth-blur {
  transition: none;
}

.is-scatter-exiting .network,
.is-scatter-exiting .network-depth-blur {
  opacity: 0;
  transform: scale(1.055);
  transition:
    opacity 240ms linear,
    transform 440ms cubic-bezier(0.55, 0, 0.35, 1);
}

.is-scatter-exiting .landing-features {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: none;
  transition:
    opacity 190ms linear,
    transform 320ms cubic-bezier(0.55, 0, 0.35, 1),
    filter 180ms linear;
}

.is-scatter-exiting .landing-feature {
  opacity: 0;
  transform: translate3d(-24px, 12px, 0);
  animation: none;
  transition:
    opacity 260ms linear calc(var(--landing-feature-index) * 85ms),
    transform 460ms cubic-bezier(0.55, 0, 0.35, 1) calc(var(--landing-feature-index) * 85ms);
}

.is-scatter-exiting .landing-category-token {
  opacity: 0;
  transform: translate3d(-18px, 0, 0);
  animation: none;
  pointer-events: none;
  transition-delay:
    calc(var(--landing-category-index) * 34ms),
    calc(var(--landing-category-index) * 34ms);
}

.work-node.is-wide {
  width: var(--node-w-wide);
}

.work-node.is-small {
  width: var(--node-w-small);
}

.work-node.is-floating .work-media {
  visibility: hidden;
  opacity: 0;
}

.work-node.is-floating {
  width: clamp(84px, 7vw, 130px);
}

.work-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  contain: paint;
  background-color: transparent;
  background-image: var(--poster-image, none);
  background-position: center;
  background-size: cover;
  backface-visibility: hidden;
  clip-path: none;
  opacity: var(--media-depth-opacity, 1);
  transform:
    translate3d(0, var(--media-y, 0), 0)
    scale(var(--scale, 1));
  transform-origin: center;
  will-change: transform, opacity;
  transition:
    opacity 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.is-video-warp .work-node.is-warp-active .work-media {
  filter: var(--media-warp-filter, none);
  will-change: transform, filter, opacity;
}

.work-node.is-focused .work-media,
:root:not(.is-theme-transitioning) .work-node.is-hovered .work-media {
  --media-y: -2px;
  --depth-sat: 1.05;
  --depth-contrast: 1.04;
  --media-depth-opacity: 1;
  --warp-cover-scale: 0;
  --warp-top: 0%;
  --warp-right: 0%;
  --warp-bottom: 0%;
  --warp-left: 0%;
  filter: none;
  clip-path: none;
}

.work-node:is(.is-focus-target, .is-focused) .work-media video,
.work-node:is(.is-focus-target, .is-focused) .work-media .work-image {
  filter: none;
}

.work-node.is-dimmed .work-media {
  opacity: 0.24;
}

.work-node.is-dimmed .work-meta {
  opacity: 0.24;
}

:root.has-focused-work .work-node.is-dimmed .work-media {
  opacity: var(--media-depth-opacity, 1);
}

:root.has-focused-work .work-node.is-dimmed .work-meta {
  opacity: 1;
}

@media (max-width: 760px) {
  :root.has-focused-work .work-node.is-dimmed .work-media,
  :root.has-focused-work .work-node.is-dimmed .work-media video,
  :root.has-focused-work .work-node.is-dimmed .work-media .work-image {
    opacity: 1;
  }
}

.work-node.is-dimmed,
.work-node.is-dimmed .work-media,
.work-node.is-dimmed .work-media video,
.work-node.is-dimmed .work-media .work-image {
  will-change: auto;
}

.work-node.is-dimmed .work-media video,
.work-node.is-dimmed .work-media .work-image {
  filter: none;
}

:root.is-compositor-focus-opening .network,
:root.is-compositor-focus-opening .network-depth-blur {
  opacity: 0 !important;
  transition: opacity 90ms linear;
}

:root.is-compositor-focus-opening .work-node:not(.is-compositor-focus-target) {
  pointer-events: none !important;
}

:root.is-compositor-focus-opening .work-node.is-compositor-focus-target .work-meta {
  opacity: 0;
  transition: opacity 120ms linear;
}

.is-low-power .work-node,
.is-low-power .work-media {
  will-change: auto;
}

.is-low-power.is-scatter-exiting .work-node {
  transition-duration: 210ms, 460ms;
}

.is-low-power.is-scatter-entry-releasing .work-node {
  transition-duration: 240ms, 520ms;
}

.is-low-power .work-media {
  clip-path: none;
}

.work-media video,
.work-media .work-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--media-focus-x, 50%) var(--media-focus-y, 50%);
  filter:
    saturate(var(--depth-sat, 0.86))
    contrast(var(--depth-contrast, 0.95));
  transform: scale(calc(1.012 + var(--warp-cover-scale, 0)));
  transform-origin: center;
  backface-visibility: hidden;
  will-change: transform;
}

.work-media video,
.work-media .work-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  transition: none;
}

.work-node.is-frame-ready .work-media video,
.work-node.is-frame-ready .work-media .work-image {
  opacity: 1;
  transition: opacity 120ms linear;
}

.is-low-power video {
  filter: none;
  will-change: auto;
}

.work-meta {
  position: relative;
  z-index: 2;
  display: grid;
  grid-auto-rows: min-content;
  width: max-content;
  max-width: min(17rem, 74vw);
  margin-top: clamp(3px, 0.34vw, 6px);
  font-size: var(--site-font-size);
  font-weight: 500;
  line-height: 1.01;
  text-transform: uppercase;
  transform: none;
  transform-origin: top left;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  transition:
    color 520ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.work-node.is-focus-target .work-meta {
  max-width: min(22rem, 36vw);
  font-size: var(--site-font-size);
}

.work-title {
  color: var(--label-color, var(--blue));
  font-weight: 500;
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

@supports (color: color(display-p3 1 0 0)) {
  .work-title {
    color: var(--label-color-p3, var(--label-color, var(--blue)));
  }
}

.work-heading {
  display: contents;
}

.work-year,
.work-type {
  color: var(--muted);
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.work-type {
  font-weight: 500;
}

.work-durations {
  display: none;
  color: var(--ink);
}

.work-node.has-project-context .work-meta {
  grid-template-columns: max-content;
}

.work-node.has-project-context .work-heading {
  display: inline-flex;
  grid-column: 1;
  grid-row: 1;
  align-items: baseline;
  gap: clamp(3px, 0.32vw, 6px);
  width: max-content;
}

.work-node.has-project-context .work-durations {
  display: block;
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 2px;
  color: var(--ink);
  white-space: nowrap;
}

.work-node.has-project-context .work-type {
  display: none;
}

.work-project-link {
  display: none;
}

.work-node.is-focused .work-year,
.work-node.is-focused .work-type,
:root:not(.is-theme-transitioning) .work-node.is-hovered .work-year,
:root:not(.is-theme-transitioning) .work-node.is-hovered .work-type {
  color: rgba(17, 17, 17, 0.34);
}

.is-dark .work-node.is-focused .work-year,
.is-dark .work-node.is-focused .work-type,
.is-dark:not(.is-theme-transitioning) .work-node.is-hovered .work-year,
.is-dark:not(.is-theme-transitioning) .work-node.is-hovered .work-type {
  color: rgba(244, 244, 239, 0.42);
}

.is-video-warp.is-scrolling .work-node.is-warp-active.is-hovered:not(.is-focused) .work-media {
  --media-y: 0;
  --depth-sat: inherit;
  --depth-contrast: inherit;
  --media-depth-opacity: inherit;
  --warp-cover-scale: inherit;
  filter: var(--media-warp-filter, none);
}

.is-scrolling .work-node.is-hovered:not(.is-focused) .work-year,
.is-scrolling .work-node.is-hovered:not(.is-focused) .work-type {
  color: var(--muted);
}

.is-video-warp.is-theme-transitioning .work-node.is-warp-active.is-hovered:not(.is-focused) .work-media {
  --media-y: 0;
  --depth-sat: inherit;
  --depth-contrast: inherit;
  --media-depth-opacity: inherit;
  --warp-cover-scale: inherit;
  filter: var(--media-warp-filter, none);
}

.is-theme-transitioning .work-node.is-hovered:not(.is-focused) .work-year,
.is-theme-transitioning .work-node.is-hovered:not(.is-focused) .work-type {
  color: var(--muted);
}

.scroll-field {
  display: none;
}

@keyframes mobile-menu-ribbon-open {
  0% {
    opacity: 1;
    clip-path: inset(calc(100% - 46px) 0 0 calc(100% - 46px) round 23px);
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
    animation-timing-function: cubic-bezier(0.42, 0, 0.2, 1);
  }
  18% {
    clip-path: inset(calc(100% - 50px) 0 0 46% round 25px);
    transform: translate3d(-2px, -1px, 22px) rotateX(-1deg) rotateY(7deg) rotateZ(-1deg);
    animation-timing-function: cubic-bezier(0.34, 0, 0.18, 1);
  }
  43% {
    clip-path: inset(58% 0 0 16% round 18px);
    transform: translate3d(-3px, -4px, 34px) rotateX(-5deg) rotateY(9deg) rotateZ(-0.6deg);
    animation-timing-function: cubic-bezier(0.28, 0, 0.17, 1);
  }
  70% {
    clip-path: inset(12% 0 0 0 round 18px);
    transform: translate3d(-2px, -3px, 24px) rotateX(-6deg) rotateY(2.5deg) rotateZ(0);
    animation-timing-function: cubic-bezier(0.2, 0.68, 0.2, 1);
  }
  88% {
    clip-path: inset(0 0 0 0 round 14px);
    transform: translate3d(0, 0, 7px) rotateX(1deg) rotateY(-0.5deg);
    animation-timing-function: cubic-bezier(0.2, 0.72, 0.2, 1);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0 round 14px);
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
  }
}

@keyframes mobile-menu-ribbon-close {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0 round 14px);
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
    animation-timing-function: cubic-bezier(0.44, 0, 0.34, 1);
  }
  30% {
    clip-path: inset(10% 0 0 0 round 18px);
    transform: translate3d(-2px, -2px, 18px) rotateX(-4deg) rotateY(2deg);
    animation-timing-function: cubic-bezier(0.48, 0, 0.3, 1);
  }
  60% {
    clip-path: inset(58% 0 0 18% round 18px);
    transform: translate3d(-3px, -4px, 28px) rotateX(-5deg) rotateY(9deg) rotateZ(-0.6deg);
    animation-timing-function: cubic-bezier(0.52, 0, 0.38, 1);
  }
  84% {
    opacity: 1;
    clip-path: inset(calc(100% - 50px) 0 0 46% round 25px);
    transform: translate3d(-2px, -1px, 18px) rotateX(-1deg) rotateY(7deg) rotateZ(-1deg);
    animation-timing-function: cubic-bezier(0.58, 0, 0.62, 1);
  }
  100% {
    opacity: 0;
    clip-path: inset(calc(100% - 46px) 0 0 calc(100% - 46px) round 23px);
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
  }
}

@media (max-width: 760px) {
  :root {
    --site-font-size: 11px;
  }

  :root {
    --node-w: clamp(120px, 40vw, 190px);
    --node-w-wide: clamp(152px, 52vw, 236px);
    --node-w-small: clamp(98px, 34vw, 148px);
  }

  .stage {
    cursor: default;
    perspective: 520px;
    perspective-origin: 50% 42%;
  }

  .network-depth-blur {
    display: none;
  }

  .work-media,
  .work-media video {
    filter: none !important;
  }

  .graph-mark {
    top: 15px;
    left: 15px;
    width: clamp(68px, 20vw, 86px);
  }

  .site-menu {
    z-index: 300;
    right: 10px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    min-width: 94px;
    gap: 6px;
    padding: 13px 15px;
    border-radius: 16px;
    font-size: var(--site-font-size);
  }

  .landing-features {
    left: 0;
    right: 0;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    flex-direction: row;
    align-items: flex-end;
    gap: 8px;
    width: auto;
    max-width: none;
    box-sizing: border-box;
    padding: 0 10px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scroll-padding-inline: 10px;
    touch-action: pan-x;
  }

  .landing-features::-webkit-scrollbar {
    display: none;
  }

  .landing-feature {
    grid-template-columns: max-content minmax(0, max-content) 8px;
    gap: 10px;
    flex: 0 0 auto;
    width: fit-content;
    min-width: 0;
    max-width: calc(100vw - 20px);
    min-height: 32px;
    padding: 7px 9px 7px 10px;
    border-radius: 6px;
    font-size: var(--site-font-size);
  }

  .dev-console {
    top: 10px;
    right: 10px;
    width: min(286px, calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
    overflow-y: auto;
  }

  .color-swatch,
  .color-custom,
  .line-color-input {
    width: 17px;
    height: 17px;
  }

  .work-meta {
    max-width: 38vw;
    margin-top: 3px;
    font-size: var(--site-font-size);
    line-height: 1;
  }

  .work-node.is-focus-target .work-meta {
    max-width: 46vw;
    font-size: var(--site-font-size);
  }

  .work-media {
    filter: none;
    transition:
      opacity 260ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, opacity;
  }

  video {
    will-change: transform;
  }

}

.work-node .work-meta {
  position: absolute;
  top: calc(100% + clamp(5px, 0.46vw, 8px) + var(--meta-y, 0px));
  right: auto;
  bottom: auto;
  left: var(--meta-x, 0px);
  margin: 0;
  transform: none;
  transform-origin: top left;
}

.work-node:is(.is-focus-target, .is-focused) .work-meta {
  position: absolute;
  top: calc(100% + clamp(5px, 0.46vw, 8px) + var(--meta-y, 0px));
  right: auto;
  bottom: auto;
  left: var(--meta-x, 0px);
  display: grid;
  grid-template-columns: max-content;
  margin: 0;
  transform: none;
  transform-origin: top left;
}

.work-node:is(.is-focus-target, .is-focused) .work-heading {
  display: inline-flex;
  grid-column: 1;
  grid-row: 1;
  align-items: baseline;
  gap: clamp(3px, 0.32vw, 6px);
  width: max-content;
}

.work-node:is(.is-focus-target, .is-focused) .work-durations {
  display: block;
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 2px;
  color: var(--ink);
  white-space: nowrap;
}

.work-node:is(.is-focus-target, .is-focused) .work-type {
  display: none;
}

.work-node:is(.is-focus-target, .is-focused) .work-project-link {
  display: inline-flex;
  grid-column: 1 / -1;
  grid-row: 3;
  align-items: center;
  justify-self: start;
  margin-top: clamp(5px, 0.42vw, 7px);
  padding: 2px 5px 2px 4px;
  border-radius: 3px;
  color: #111;
  background: #fff;
  font-size: var(--site-font-size);
  line-height: 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(-9px, 2px, 0);
  text-decoration: none;
  white-space: nowrap;
  transition:
    opacity 190ms ease-out,
    transform 340ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 340ms,
    color 70ms ease-out,
    background-color 70ms ease-out;
}

.work-node.is-project-action-ready:is(.is-focus-target, .is-focused) .work-project-link {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
  transition-delay: 70ms, 70ms, 0s, 0s, 0s;
}

.work-node:is(.is-focus-target, .is-focused) .work-project-link::before {
  content: "\2192";
  margin-right: 4px;
}

.work-node:is(.is-focus-target, .is-focused) .work-project-link:hover {
  color: #fff;
  background: var(--label-color, var(--blue));
}

@supports (background: color(display-p3 1 0 0)) {
  .work-node:is(.is-focus-target, .is-focused) .work-project-link:hover {
    background: var(--label-color-p3, var(--label-color, var(--blue)));
  }
}

@media (hover: none), (pointer: coarse) {
  .is-video-warp .work-node.is-warp-active.is-hovered:not(.is-focused) .work-media {
    --media-y: 0;
    --depth-sat: inherit;
    --depth-contrast: inherit;
    --media-depth-opacity: inherit;
    --warp-cover-scale: inherit;
    filter: var(--media-warp-filter, none);
  }

  .work-node.is-hovered:not(.is-focused) .work-year,
  .work-node.is-hovered:not(.is-focused) .work-type {
    color: var(--muted);
  }
}

@media (max-width: 420px) {
  :root {
    --node-w: clamp(104px, 34vw, 148px);
    --node-w-wide: clamp(132px, 44vw, 184px);
    --node-w-small: clamp(86px, 29vw, 126px);
  }

  .work-meta {
    max-width: 36vw;
    font-size: var(--site-font-size);
  }
}

@media (min-width: 761px) {
  .site-menu-shell {
    position: fixed;
    z-index: 120;
    inset: 0;
    display: block;
    pointer-events: none;
  }

  .site-menu {
    top: clamp(14px, 1.5vw, 24px);
    left: auto;
    right: clamp(14px, 1.5vw, 24px);
    bottom: auto;
    display: grid;
    min-width: 0;
    padding: 0;
    gap: clamp(3px, 0.28vw, 5px);
    border-radius: 0;
    background: transparent;
    transform: translate3d(
      0,
      calc((1 - var(--network-intro, 0)) * 12px),
      0
    );
    pointer-events: auto;
  }

  .site-menu-link {
    display: grid;
    place-items: center;
    width: clamp(104px, 7.8vw, 132px);
    min-height: clamp(25px, 1.9vw, 30px);
    padding: 5px 12px;
    border-radius: 7px;
    background: #000;
    color: rgba(255, 255, 255, 0.28);
    text-transform: uppercase;
    transition:
      color 180ms linear,
      transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .site-menu-link:hover {
    transform: scale(1.025);
  }
}

@media (max-width: 760px) {
  html.mobile-menu-open,
  html.mobile-menu-open body {
    overflow: hidden;
  }

  .site-menu-shell {
    position: fixed;
    z-index: 400;
    inset: 0;
    display: block;
    perspective: 920px;
    perspective-origin: calc(100% - 28px) calc(100% - 28px);
    pointer-events: none;
  }

  .mobile-menu-surface {
    position: absolute;
    z-index: 1;
    inset: 10px;
    display: block;
    border-radius: 14px;
    background: #000;
    opacity: 0;
    visibility: hidden;
    clip-path: inset(calc(100% - 46px) 0 0 calc(100% - 46px) round 23px);
    transform: translate3d(0, 0, 0);
    transform-origin: calc(100% - 23px) calc(100% - 23px);
    transform-style: preserve-3d;
    backface-visibility: hidden;
    will-change: transform, clip-path;
    pointer-events: none;
  }

  .site-menu-shell.is-open .mobile-menu-surface {
    visibility: visible;
    animation: mobile-menu-ribbon-open 620ms linear both;
  }

  .site-menu-shell.is-closing .mobile-menu-surface {
    visibility: visible;
    animation: mobile-menu-ribbon-close 340ms linear both;
  }

  .mobile-menu-toggle {
    position: absolute;
    z-index: 3;
    right: 14px;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    display: flex;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #000;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    color: #fff;
    cursor: pointer;
    opacity: var(--network-intro, 0);
    pointer-events: auto;
    transition:
      opacity 180ms linear,
      transform 480ms cubic-bezier(0.16, 1, 0.3, 1),
      background 220ms linear;
  }

  .mobile-menu-toggle span {
    width: 16px;
    height: 1px;
    background: currentColor;
    transform-origin: center;
    transition:
      transform 420ms cubic-bezier(0.16, 1, 0.3, 1),
      opacity 180ms linear;
  }

  .mobile-menu-toggle:focus:not(:focus-visible) {
    outline: none;
  }

  .mobile-menu-toggle:focus-visible {
    outline: 1px solid #fff;
    outline-offset: 3px;
  }

  .site-menu-shell.is-open .mobile-menu-toggle {
    background: transparent;
    transform: translate3d(0, -3px, 32px) scale(1.04);
  }

  .site-menu-shell.is-open .mobile-menu-toggle span:nth-child(1) {
    transform: translateY(4px) rotate(45deg);
  }

  .site-menu-shell.is-open .mobile-menu-toggle span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
  }

  .site-menu-shell.is-open .mobile-menu-toggle span:nth-child(3) {
    transform: translateY(-4px) rotate(-45deg);
  }

  .site-menu {
    position: absolute;
    z-index: 2;
    inset: 10px;
    right: 10px;
    bottom: 10px;
    display: flex;
    min-width: 0;
    padding: max(76px, env(safe-area-inset-top, 0px)) 24px max(76px, env(safe-area-inset-bottom, 0px));
    border-radius: 14px;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
    gap: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.3);
    font-size: var(--site-font-size);
    opacity: 0;
    visibility: hidden;
    transform: none;
    pointer-events: none;
    transition:
      opacity 120ms linear,
      visibility 0s linear 480ms;
  }

  .site-menu-link {
    opacity: 0;
    transform: translateY(12px) scale(0.985);
    transition:
      color 180ms linear,
      opacity 240ms linear,
      transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .site-menu-shell.is-open .site-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
      opacity 120ms linear,
      visibility 0s linear;
  }

  .site-menu-shell.is-open .site-menu-link {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 440ms;
  }

  .site-menu-shell.is-open .site-menu-link:nth-child(2) {
    transition-delay: 490ms;
  }

  .site-menu-shell.is-open .site-menu-link:nth-child(3) {
    transition-delay: 540ms;
  }

  .site-menu-shell.is-closing .site-menu {
    visibility: visible;
  }

  .site-menu-shell.is-closing .site-menu-link {
    opacity: 0;
    transform: translateY(8px) scale(0.99);
    transition-duration: 100ms;
    transition-delay: 0ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  .work-node,
  .work-media,
  video,
  .site-menu,
  .mobile-menu-surface,
  .mobile-menu-toggle,
  .mobile-menu-toggle span,
  .site-menu-link {
    transition-duration: 1ms;
  }

  .site-menu-shell.is-open .mobile-menu-surface {
    visibility: visible;
    animation: none;
    opacity: 1;
    clip-path: inset(0 round 14px);
    transform: none;
  }

  .site-menu-shell.is-closing .mobile-menu-surface {
    display: none;
    animation: none;
  }
}
/* Compact segmented navigation */
.site-menu-shell {
  --menu-inactive-bg: rgba(0, 0, 0, 0.08);
  --menu-rail-bg: rgba(0, 0, 0, 0.03);
  --menu-inactive-ink: #000;
  --menu-active-bg: #000;
  --menu-active-ink: #fff;
  --menu-hover-bg: #000;
  --menu-hover-ink: #fff;
  --menu-project-bg: #fff;
  --menu-project-muted: #000;
  --menu-close-bg: #000;
  --menu-close-ink: #fff;
  --menu-blur: 18px;
}

.site-menu-shell.is-media {
  --menu-inactive-bg: rgba(255, 255, 255, 0.14);
  --menu-rail-bg: rgba(255, 255, 255, 0.001);
  --menu-inactive-ink: #fff;
  --menu-active-bg: #fff;
  --menu-active-ink: #000;
  --menu-hover-bg: #fff;
  --menu-hover-ink: #000;
  --menu-project-bg: rgba(255, 255, 255, 0.92);
  --menu-project-muted: #000;
  --menu-close-bg: #fff;
  --menu-close-ink: #000;
  --menu-blur: 9px;
}

html.is-dark .site-menu-shell,
html[data-theme="dark"] .site-menu-shell {
  --menu-inactive-bg: rgba(255, 255, 255, 0.14);
  --menu-rail-bg: rgba(255, 255, 255, 0.001);
  --menu-inactive-ink: #fff;
  --menu-active-bg: #fff;
  --menu-active-ink: #000;
  --menu-hover-bg: #fff;
  --menu-hover-ink: #000;
  --menu-project-bg: rgba(255, 255, 255, 0.92);
  --menu-project-muted: #000;
  --menu-close-bg: #fff;
  --menu-close-ink: #000;
  --menu-blur: 9px;
}

.site-menu-shell [data-menu-contrast="light"] {
  --menu-inactive-bg: rgba(0, 0, 0, 0.08);
  --menu-rail-bg: rgba(0, 0, 0, 0.03);
  --menu-inactive-ink: #000;
  --menu-active-bg: #000;
  --menu-active-ink: #fff;
  --menu-hover-bg: #000;
  --menu-hover-ink: #fff;
  --menu-project-bg: #fff;
  --menu-project-muted: #000;
  --menu-close-bg: #000;
  --menu-close-ink: #fff;
  --menu-blur: 18px;
}

.site-menu-shell [data-menu-contrast="dark"] {
  --menu-inactive-bg: rgba(255, 255, 255, 0.14);
  --menu-rail-bg: rgba(255, 255, 255, 0.001);
  --menu-inactive-ink: #fff;
  --menu-active-bg: #fff;
  --menu-active-ink: #000;
  --menu-hover-bg: #fff;
  --menu-hover-ink: #000;
  --menu-project-bg: rgba(255, 255, 255, 0.92);
  --menu-project-muted: #000;
  --menu-close-bg: #fff;
  --menu-close-ink: #000;
  --menu-blur: 9px;
}

.site-menu-shell,
.site-menu-shell.landing-site-menu-shell {
  position: fixed;
  z-index: 500;
  inset: 0;
  display: block;
  pointer-events: none;
  view-transition-name: none;
}

.site-menu-shell .site-menu {
  --site-menu-gap: 4px;
  position: absolute;
  top: max(9px, env(safe-area-inset-top, 0px));
  right: max(9px, env(safe-area-inset-right, 0px));
  bottom: auto;
  left: max(9px, env(safe-area-inset-left, 0px));
  display: flex;
  width: auto;
  min-width: 0;
  max-width: none;
  padding: 0;
  gap: var(--site-menu-gap);
  border-radius: 0;
  background: transparent;
  color: inherit;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
  font-size: var(--site-font-size);
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  isolation: isolate;
  transition: none;
  view-transition-name: none !important;
}

.site-menu-shell .site-menu-link {
  flex: 0 0 auto;
}

.site-menu-shell .site-menu-link,
.site-menu-project,
.site-menu-close {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  display: flex;
  width: auto;
  min-width: 0;
  min-height: 28px;
  padding: 6px 12px;
  border: 0;
  border-radius: 0;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--menu-inactive-ink);
  opacity: 1;
  overflow: hidden;
  white-space: nowrap;
  text-decoration: none;
  transform: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transition:
    background-color 280ms cubic-bezier(0.22, 1, 0.36, 1),
    color 240ms linear;
  will-change: color;
}

.site-menu-shell .site-menu-link,
.site-menu-close {
  position: relative;
  isolation: isolate;
  --menu-item-bg: var(--menu-inactive-bg);
  --menu-item-backdrop: blur(var(--menu-blur, 9px));
  background-color: var(--menu-item-bg);
  -webkit-backdrop-filter: var(--menu-item-backdrop);
  backdrop-filter: var(--menu-item-backdrop);
}

.site-menu-shell .site-menu-link::before,
.site-menu-close::before {
  content: none;
}

.site-menu-label,
.site-menu-close span {
  position: relative;
  z-index: 1;
  display: block;
}

.site-menu-shell .site-menu-link.is-active {
  color: var(--menu-active-ink);
  --menu-item-bg: var(--menu-active-bg);
  --menu-item-backdrop: none;
}

.site-menu-link-jamuna {
  view-transition-name: none !important;
}

.site-menu-link-projects {
  margin-left: auto;
  view-transition-name: none !important;
}

.site-menu-link-archive {
  view-transition-name: none !important;
}

.site-menu-link-vision {
  view-transition-name: none !important;
}

.landing-site-menu-shell.is-first-entry-pending .site-menu {
  pointer-events: none;
}

.landing-site-menu-shell.is-first-entry-pending .site-menu-link,
.landing-site-menu-shell.is-first-entry-pending .site-menu-project,
.landing-site-menu-shell.is-first-entry-pending .site-menu-close {
  opacity: 0;
  transform: translate3d(0, -8px, 0) scale(0.96);
}

.site-menu-shell.is-first-entry .site-menu-link,
.site-menu-shell.is-first-entry .site-menu-project,
.site-menu-shell.is-first-entry .site-menu-close {
  animation: site-menu-first-entry 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.site-menu-shell.is-first-entry .site-menu-link-projects {
  animation-delay: 55ms;
}

.site-menu-shell.is-first-entry .site-menu-link-archive {
  animation-delay: 110ms;
}

.site-menu-shell.is-first-entry .site-menu-link-vision {
  animation-delay: 165ms;
}

.site-menu-shell.is-first-entry .site-menu-project {
  animation-delay: 220ms;
}

.site-menu-shell.is-first-entry .site-menu-close {
  animation-delay: 275ms;
}

@keyframes site-menu-first-entry {
  from {
    opacity: 0;
    transform: translate3d(0, -8px, 0) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-menu-shell.is-first-entry .site-menu-link,
  .site-menu-shell.is-first-entry .site-menu-project,
  .site-menu-shell.is-first-entry .site-menu-close {
    animation: none;
  }
}

.site-menu-shell.is-media .site-menu-link:not(.is-active) {
  color: var(--menu-inactive-ink);
}

.site-menu-shell.has-project-context .site-menu-link:not(.is-active),
.site-menu-shell.has-project-context .site-menu-close,
.site-menu-shell.has-project-context .site-menu-close span {
  color: var(--menu-inactive-ink);
}

.site-menu-shell.is-media .site-menu-link:not(.is-active) {
  --menu-item-bg: var(--menu-inactive-bg);
  --menu-item-backdrop: blur(var(--menu-blur, 9px));
}

.site-menu-shell.has-project-context .site-menu-link:not(.is-active),
.site-menu-shell.has-project-context .site-menu-close {
  --menu-item-bg: rgba(218, 218, 218, 0.33);
}

.site-menu-shell .site-menu-link:hover {
  color: var(--menu-hover-ink);
  transform: none;
}

.site-menu-shell .site-menu-link:hover {
  --menu-item-bg: var(--menu-hover-bg);
  --menu-item-backdrop: none;
}

.site-menu-project {
  max-width: min(340px, 32vw);
  gap: 10px;
  background: var(--project-title-color, #1557ff);
  color: #fff;
  text-align: left;
  view-transition-name: none;
}

.site-menu-project-context {
  display: flex;
  min-width: 0;
  max-width: min(386px, calc(100vw - 18px));
  gap: 0;
  align-items: stretch;
  justify-content: flex-end;
  overflow: visible;
  white-space: nowrap;
  view-transition-name: none;
}

.site-menu-project-context > .site-menu-project,
.site-menu-project-context > .site-menu-close {
  flex: 0 0 auto;
}

.site-menu-project-context[data-menu-context-motion="enter"] > .site-menu-project,
.site-menu-project-context[data-menu-context-motion="enter"] > .site-menu-close {
  animation: menu-project-context-item-enter 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.site-menu-project-context[data-menu-context-motion="enter"] > .site-menu-close {
  animation-delay: 35ms;
}

.site-menu-project-context[data-menu-context-motion="exit"] > .site-menu-project,
.site-menu-project-context[data-menu-context-motion="exit"] > .site-menu-close {
  animation: menu-project-context-item-exit 340ms cubic-bezier(0.55, 0, 0.35, 1) both;
}

.site-menu-project-context[data-menu-context-motion="exit"] > .site-menu-close {
  animation-delay: 0ms;
}

.site-menu-project-context[data-menu-context-motion="exit"] > .site-menu-project {
  animation-delay: 25ms;
}

.site-menu-shell.is-media .site-menu-project {
  background: var(--project-title-color, #1557ff);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.site-menu-project-title {
  min-width: 0;
  overflow: hidden;
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 240ms linear;
}

.site-menu-project-year {
  flex: 0 0 auto;
  color: rgba(255, 255, 255, 0.66);
  transition: color 240ms linear;
}

.site-menu-project[data-menu-contrast="dark"] {
  background: var(--project-title-color, #1557ff);
  color: #fff;
}

.site-menu-project[data-menu-contrast="dark"] .site-menu-project-title {
  color: #fff;
}

.site-menu-project[data-menu-contrast="dark"] .site-menu-project-year {
  color: rgba(255, 255, 255, 0.66);
}

.site-menu-project[data-menu-contrast="light"] {
  background: var(--project-title-color, #1557ff);
  color: #fff;
}

.site-menu-project[data-menu-contrast="light"] .site-menu-project-title {
  color: #fff;
}

.site-menu-project[data-menu-contrast="light"] .site-menu-project-year {
  color: rgba(255, 255, 255, 0.66);
}

@supports (background: color(display-p3 1 0 0)) {
  .site-menu-project,
  .site-menu-shell.is-media .site-menu-project,
  .site-menu-project[data-menu-contrast="dark"],
  .site-menu-project[data-menu-contrast="light"] {
    background: var(--project-title-color-p3, var(--project-title-color, var(--blue)));
  }
}

.site-menu-close {
  width: 42px;
  padding: 0;
  color: var(--menu-inactive-ink);
  font-size: var(--site-font-size);
  line-height: 1;
  view-transition-name: none;
}

.site-menu-project + .site-menu-close {
  margin-left: 0;
}

.site-menu-shell.is-context-entering .site-menu-link {
  animation: menu-context-link-shift 500ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.site-menu-shell.is-context-entering .site-menu-project,
.site-menu-shell.is-context-entering .site-menu-close {
  animation: menu-project-segment-in 500ms 30ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

html.is-legacy-transition .site-menu-shell.is-route-entering .site-menu-link {
  animation: menu-route-legacy-in 340ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes menu-context-link-shift {
  from { transform: translate3d(10px, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@keyframes menu-route-legacy-in {
  from { opacity: 0; transform: translate3d(6px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes menu-project-context-item-enter {
  from {
    opacity: 0;
    transform: translate3d(-18px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes menu-project-context-item-exit {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(14px, 0, 0);
  }
}

.site-menu-close span {
  font-family: "KMR Waldenburg", Arial, Helvetica, sans-serif;
  font-size: var(--site-font-size);
  font-weight: 500;
  line-height: 1;
}

.site-menu-close:hover {
  --menu-item-bg: var(--menu-hover-bg);
  --menu-item-backdrop: none;
  color: var(--menu-hover-ink);
  filter: none;
}

html.is-route-transitioning .site-menu-shell .site-menu {
  pointer-events: none;
}

html.is-route-transitioning .site-menu-shell .site-menu-link:not(.is-active):hover,
html.is-route-transitioning .site-menu-shell .site-menu-link:not(.is-active):focus-visible,
html.is-route-transitioning .site-menu-shell .site-menu-close:hover,
html.is-route-transitioning .site-menu-shell .site-menu-close:focus-visible {
  --menu-item-bg: var(--menu-inactive-bg);
  --menu-item-backdrop: blur(var(--menu-blur, 9px));
  color: var(--menu-inactive-ink);
}

html.is-route-transitioning .site-menu-shell.has-project-context .site-menu-link:not(.is-active):hover,
html.is-route-transitioning .site-menu-shell.has-project-context .site-menu-link:not(.is-active):focus-visible,
html.is-route-transitioning .site-menu-shell.has-project-context .site-menu-close:hover,
html.is-route-transitioning .site-menu-shell.has-project-context .site-menu-close:focus-visible {
  --menu-item-bg: rgba(218, 218, 218, 0.33);
  --menu-item-backdrop: blur(18px);
  color: var(--menu-inactive-ink);
}

html.is-route-transitioning .site-menu-shell .site-menu-link:not(.is-active):hover .site-menu-label,
html.is-route-transitioning .site-menu-shell .site-menu-link:not(.is-active):focus-visible .site-menu-label,
html.is-route-transitioning .site-menu-shell .site-menu-close:hover span,
html.is-route-transitioning .site-menu-shell .site-menu-close:focus-visible span {
  color: var(--menu-inactive-ink);
}

.mobile-menu-toggle,
.mobile-menu-surface {
  display: none !important;
}

@media (min-width: 761px) {
  .site-menu-shell .site-menu {
    --site-menu-gap: 3px;
    top: max(14px, env(safe-area-inset-top, 0px));
    right: max(14px, env(safe-area-inset-right, 0px));
    left: max(14px, env(safe-area-inset-left, 0px));
  }
}

@media (max-width: 760px) {
  .site-menu-shell,
  .site-menu-shell.landing-site-menu-shell {
    z-index: 500;
    perspective: none;
  }

  .site-menu-shell .site-menu {
    --site-menu-gap: 2px;
    top: max(7px, env(safe-area-inset-top, 0px));
    right: max(7px, env(safe-area-inset-right, 0px));
    left: max(7px, env(safe-area-inset-left, 0px));
    max-width: none;
    gap: var(--site-menu-gap);
    font-size: var(--site-font-size);
    isolation: auto;
    transform: none;
  }

  .site-menu-shell .site-menu-link,
  .site-menu-project,
  .site-menu-close {
    min-height: 25px;
    padding: 5px 6px;
  }

  .site-menu-shell .site-menu-link,
  .site-menu-close {
    isolation: auto;
    overflow: visible;
  }

  .site-menu-shell .site-menu-link::after,
  .site-menu-close::after {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    background: transparent;
    -webkit-backdrop-filter: var(--menu-item-backdrop);
    backdrop-filter: var(--menu-item-backdrop);
    pointer-events: none;
  }

  .site-menu-project {
    max-width: min(27vw, 108px);
    gap: 6px;
  }

  .site-menu-close {
    width: 31px;
    padding: 0;
    font-size: var(--site-font-size);
  }

  .site-menu-project + .site-menu-close {
    margin-left: -3px;
  }
}