:root {
  --ink: #070809;
  --paper: #f2f1ec;
  --muted: #8c9293;
  --line: rgba(242, 241, 236, .2);
  --line-soft: rgba(242, 241, 236, .1);
  --red: #ef3940;
  --lime: #c7efab;
  --orange: #ff7040;
  --page: min(1320px, calc(100vw - 72px));
  --display: "Space Grotesk", "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  --body: "Space Grotesk", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --industrial: "Barlow Condensed", "Arial Narrow", sans-serif;
  --editorial: "Syne", "Arial Black", sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--ink); scroll-behavior: auto; }
body { margin: 0; overflow-x: hidden; background: var(--ink); color: var(--paper); font-family: var(--body); font-size: 14px; }
body.motion-off *, body.motion-off *::before, body.motion-off *::after { animation: none !important; transition: none !important; }
body.is-low-power .environment-sheen,
body.is-low-power .environment-streaks,
body.is-low-power .environment-editorial,
body.is-low-power .environment-signal-field { opacity: .35; }
body.is-low-power .chapter-transition-orbit { animation-duration: 2.8s; }
body.is-mobile-experience .world-stage { min-height: 100svh; }
body.is-low-power .environment-sheen { filter: none; }
body.is-low-power .profile-badge-stage { filter: none; }
body.is-adaptive-light .environment-sheen,
body.is-adaptive-light .environment-streaks,
body.is-adaptive-light .environment-editorial { opacity: .2; }
.world-stage.webgl-paused #three-layer { visibility: hidden !important; }
.desktop-experience-note { position: fixed; z-index: 10030; right: 16px; bottom: 16px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 24px; align-items: center; gap: 10px; width: min(330px, calc(100vw - 32px)); padding: 12px 12px 12px 10px; border: 1px solid rgba(199, 239, 171, .34); background: rgba(7, 8, 9, .88); color: rgba(242, 241, 236, .82); box-shadow: 0 12px 36px rgba(0, 0, 0, .28); font-family: var(--mono); font-size: 10px; letter-spacing: .04em; line-height: 1.45; backdrop-filter: blur(12px); }
.desktop-experience-note[hidden] { display: none; }
.desktop-experience-mark { display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid var(--lime); color: var(--lime); font-size: 15px; }
.desktop-experience-note button { width: 24px; height: 24px; padding: 0; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 18px; line-height: 1; }
.desktop-experience-note button:hover { color: var(--paper); }
.xii-cursor { --cursor-angle: 0deg; --cursor-stretch: 1; --cursor-wheel: 1; --cursor-release: 0; --cursor-away: 0; --cursor-hint: 1; position: fixed; z-index: 10020; top: 0; left: 0; width: 38px; height: 58px; opacity: calc((1 - var(--cursor-release)) * (1 - var(--cursor-away)) * var(--cursor-hint)); pointer-events: none; transform: translate3d(-100px, -100px, 0); transition: opacity .28s ease; will-change: transform; }
.xii-cursor.is-away { opacity: 0 !important; }
.xii-cursor-ring, .xii-cursor-sweep, .xii-cursor-tick, .xii-cursor-dot { display: none; }
.xii-scroll-hint { position: absolute; top: calc(50% + 24px); left: 50%; width: 18px; height: 26px; transform: translateX(-50%); opacity: .86; }
.xii-scroll-hint b { position: absolute; left: 3px; width: 10px; height: 10px; border-right: 1px solid var(--lime); border-bottom: 1px solid var(--lime); transform: rotate(45deg); animation: cursor-scroll-chevron 1.5s ease-in-out infinite; }
.xii-scroll-hint b:nth-child(1) { top: 0; opacity: .35; animation-delay: -.9s; }
.xii-scroll-hint b:nth-child(2) { top: 7px; opacity: .62; animation-delay: -.45s; }
.xii-scroll-hint b:nth-child(3) { top: 14px; opacity: .95; }
.xii-cursor.is-wheel .xii-scroll-hint b { border-color: var(--paper); }
.xii-cursor.is-end .xii-scroll-hint, .xii-cursor.is-action .xii-scroll-hint { opacity: .18; }
.xii-cursor.is-pressed .xii-scroll-hint { transform: translateX(-50%) scale(.82); }

@media (pointer: fine) {
  body.has-custom-cursor:not(.is-cursor-released) * { cursor: auto; }
}

@keyframes cursor-scroll-chevron { 0%, 100% { transform: translateY(-3px) rotate(45deg); } 50% { transform: translateY(3px) rotate(45deg); } }
body::before { content: ""; position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .045; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.site-nav { position: fixed; z-index: 40; top: 0; left: 50%; width: var(--page); transform: translateX(-50%); display: flex; align-items: center; justify-content: space-between; padding: 22px 0; color: var(--muted); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; mix-blend-mode: screen; transition: opacity .28s ease, transform .28s ease; }
.brand { display: flex; align-items: baseline; gap: 12px; }
.brand strong { color: var(--red); font-family: var(--display); font-size: 24px; font-weight: 700; letter-spacing: 0; text-shadow: 0 0 8px rgba(239, 57, 64, .7), 0 0 26px rgba(239, 57, 64, .28); }
.brand span { color: var(--muted); transition: opacity .28s ease, transform .28s ease; }
.nav-state { display: flex; align-items: center; gap: 9px; transition: opacity .28s ease, transform .28s ease; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px var(--lime); }
.nav-actions { display: flex; align-items: center; gap: 24px; transition: opacity .28s ease, transform .28s ease; }
.nav-actions a, .nav-actions button { color: var(--muted); transition: color .25s ease; }
.nav-actions a:hover, .nav-actions button:hover { color: var(--paper); }
.nav-actions button { padding: 0; border: 0; background: transparent; cursor: pointer; letter-spacing: .14em; text-transform: uppercase; }
body.is-content-focus .brand span,
body.is-content-focus .nav-state,
body.is-content-focus .nav-actions { opacity: 0; transform: translateY(-7px); pointer-events: none; }
body.is-end-frame .site-nav { opacity: 0; transform: translate(-50%, -8px); pointer-events: none; }

.scroll-world { position: relative; height: 3200vh; }
.world-stage {
  --env-base-rgb: 7 8 9;
  --env-surface-rgb: 27 29 31;
  --env-accent-rgb: 185 38 42;
  --env-secondary-rgb: 72 20 22;
  --env-opacity: .64;
  --env-material-opacity: .34;
  --env-sheen-opacity: .08;
  --env-streak-opacity: .02;
  --env-measure-opacity: .02;
  --env-editorial-opacity: .02;
  --env-panel-rgb: 27 29 31;
  --env-panel-opacity: .08;
  --env-angle: -18deg;
  --env-scale: 1;
  --env-x: 0px;
  --env-y: 0px;
  --env-shift: 0px;
  --env-editorial-shift: 0px;
  --env-editorial-shift-reverse: 0px;
  position: sticky;
  top: 0;
  width: 100%;
  height: 100svh;
  min-height: 620px;
  overflow: hidden;
  background: rgb(var(--env-base-rgb));
}
.world-stage::before { content: ""; position: absolute; z-index: 5; inset: 0; pointer-events: none; border: 1px solid rgba(242, 241, 236, .14); }
.video-layer, .video-shade, #three-layer, .film-ui { position: absolute; inset: 0; }
.environment-layer { position: absolute; z-index: 0; inset: -12%; overflow: hidden; pointer-events: none; opacity: var(--env-opacity); background: rgb(var(--env-base-rgb)); isolation: isolate; transition: opacity .32s ease; will-change: opacity; }
.environment-layer::before { content: ""; position: absolute; inset: 0; z-index: 6; background: linear-gradient(90deg, rgb(var(--env-base-rgb)) 0%, transparent 18%, transparent 82%, rgb(var(--env-base-rgb)) 100%), linear-gradient(180deg, rgba(0, 0, 0, .34), transparent 30%, transparent 70%, rgba(0, 0, 0, .5)); }
.environment-material { position: absolute; z-index: 1; inset: -18%; opacity: var(--env-material-opacity); background: linear-gradient(var(--env-angle), rgb(var(--env-surface-rgb) / .36) 0%, transparent 25%, rgb(var(--env-surface-rgb) / .16) 54%, transparent 76%), linear-gradient(180deg, rgb(var(--env-accent-rgb) / .08), transparent 34%, rgb(var(--env-secondary-rgb) / .15)); transform: translate3d(var(--env-x), var(--env-y), 0) scale(var(--env-scale)); transform-origin: center; will-change: transform; }
.environment-sheen { position: absolute; z-index: 2; left: -22%; right: -22%; top: 34%; height: 26%; opacity: var(--env-sheen-opacity); background: linear-gradient(180deg, transparent, rgb(var(--env-accent-rgb) / .24) 39%, rgb(var(--env-surface-rgb) / .3) 52%, transparent); filter: blur(16px); transform: translate3d(var(--env-x), var(--env-shift), 0) skewY(var(--env-angle)); mix-blend-mode: screen; will-change: transform; }
.environment-streaks { position: absolute; z-index: 3; inset: -10% -20%; opacity: var(--env-streak-opacity); background: repeating-linear-gradient(180deg, transparent 0 19px, rgb(var(--env-accent-rgb) / .62) 20px, transparent 21px 46px); transform: translate3d(var(--env-shift), 0, 0) skewY(var(--env-angle)); mix-blend-mode: screen; will-change: transform; }
.environment-measure { position: absolute; z-index: 4; inset: 7% 10%; opacity: var(--env-measure-opacity); background: linear-gradient(90deg, transparent 0 19%, rgb(var(--env-accent-rgb) / .58) 19% 19.1%, transparent 19.1% 76%, rgb(var(--env-accent-rgb) / .38) 76% 76.1%, transparent 76.1%), linear-gradient(180deg, transparent 0 28%, rgb(var(--env-surface-rgb) / .7) 28% 28.1%, transparent 28.1% 72%, rgb(var(--env-surface-rgb) / .48) 72% 72.1%, transparent 72.1%); transform: translate3d(var(--env-x), var(--env-y), 0); }
.environment-measure::before, .environment-measure::after { content: ""; position: absolute; width: 42px; height: 42px; border: 1px solid rgb(var(--env-accent-rgb) / .5); }
.environment-measure::before { left: 18.8%; top: 27.5%; border-right: 0; border-bottom: 0; }
.environment-measure::after { right: 23.8%; bottom: 27.5%; border-left: 0; border-top: 0; }
.environment-editorial { position: absolute; z-index: 5; inset: 0; opacity: var(--env-editorial-opacity); transform: translate3d(var(--env-editorial-shift), 0, 0); will-change: transform; }
.environment-editorial i { position: absolute; display: block; border: 1px solid rgb(var(--env-accent-rgb) / .42); background: rgb(var(--env-panel-rgb, 255 255 255) / var(--env-panel-opacity)); }
.environment-editorial i:nth-child(1) { left: 8%; top: 14%; width: 24%; height: 66%; border-left: 0; }
.environment-editorial i:nth-child(2) { right: 8%; top: 24%; width: 38%; height: 1px; border-right: 0; border-left: 0; border-bottom: 0; }
.environment-editorial i:nth-child(3) { right: 15%; bottom: 13%; width: 27%; height: 24%; border-bottom: 0; border-right: 0; }
.environment-object-stage,
.environment-signal-field { position: absolute; z-index: 5; inset: 0; opacity: 0; transition: opacity .45s ease; pointer-events: none; }
.environment-object-stage::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -31%;
  width: 118%;
  height: 72%;
  background-image: linear-gradient(rgba(220, 176, 122, .18) 1px, transparent 1px), linear-gradient(90deg, rgba(220, 176, 122, .13) 1px, transparent 1px);
  background-size: 62px 42px;
  mask-image: linear-gradient(to bottom, transparent 0, #000 28%, #000 74%, transparent 100%);
  transform: translateX(-50%) perspective(620px) rotateX(62deg);
  transform-origin: center top;
}
.environment-object-stage::after {
  content: "03";
  position: absolute;
  right: 8%;
  top: 11%;
  color: transparent;
  font-family: var(--industrial);
  font-size: 172px;
  font-weight: 700;
  line-height: 1;
  -webkit-text-stroke: 1px rgba(220, 176, 122, .15);
}
.environment-object-stage i { position: absolute; left: 50%; border: 1px solid rgba(220, 176, 122, .2); transform: translateX(-50%) rotateX(68deg); }
.environment-object-stage i:nth-child(1) { bottom: 5%; width: 46%; height: 18%; border-radius: 50%; box-shadow: 0 0 42px rgba(220, 176, 122, .06); }
.environment-object-stage i:nth-child(2) { bottom: 1%; width: 63%; height: 24%; border-radius: 50%; opacity: .45; }
.environment-layer[data-theme="box"] .environment-object-stage,
.environment-layer[data-theme="modeling-other"] .environment-object-stage { opacity: .72; }
.environment-signal-field {
  inset: 7% 5%;
  overflow: hidden;
  border-left: 1px solid rgba(199, 239, 171, .14);
  border-right: 1px solid rgba(199, 239, 171, .14);
  background-image: linear-gradient(90deg, transparent 24.9%, rgba(199, 239, 171, .08) 25%, transparent 25.1%, transparent 49.9%, rgba(199, 239, 171, .08) 50%, transparent 50.1%, transparent 74.9%, rgba(199, 239, 171, .08) 75%, transparent 75.1%);
}
.environment-signal-field::before {
  content: "IMAGE / SYSTEMS / 04";
  position: absolute;
  left: 2%;
  bottom: 7%;
  color: rgba(199, 239, 171, .1);
  font-family: var(--editorial);
  font-size: 76px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: .9;
  white-space: nowrap;
  transform: translate3d(var(--env-editorial-shift), 0, 0);
}
.environment-signal-field::after { content: ""; position: absolute; top: 9%; bottom: 9%; left: 50%; width: 1px; background: rgba(199, 239, 171, .13); transform: skewX(-18deg); }
.environment-signal-field i { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, rgba(199, 239, 171, .2), transparent); transform: translate3d(var(--env-editorial-shift), 0, 0); }
.environment-signal-field i:nth-child(1) { top: 24%; left: -12%; width: 76%; }
.environment-signal-field i:nth-child(2) { top: 49%; right: -9%; width: 58%; transform: translate3d(var(--env-editorial-shift-reverse), 0, 0); }
.environment-signal-field i:nth-child(3) { top: 72%; left: 8%; width: 84%; }
.environment-layer[data-theme="homepage"] .environment-signal-field,
.environment-layer[data-theme="banner"] .environment-signal-field,
.environment-layer[data-theme="detail"] .environment-signal-field,
.environment-layer[data-theme="posters"] .environment-signal-field,
.environment-layer[data-theme="archive-other"] .environment-signal-field { opacity: .78; }
.video-layer { z-index: 1; overflow: hidden; background: transparent; }
.timeline-video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; opacity: 0; object-fit: cover; object-position: center; filter: none; transition: none; will-change: opacity; background: transparent; }
.timeline-video[data-active="true"] { opacity: 1; }
.video-shade { z-index: 2; pointer-events: none; background: rgba(7, 8, 9, .12); box-shadow: inset 0 -180px 220px rgba(7, 8, 9, .75), inset 0 0 160px rgba(7, 8, 9, .32); transition: background .28s ease, box-shadow .28s ease; }
.world-stage.is-content-focus .video-shade { background: rgba(7, 8, 9, .035); box-shadow: inset 0 -90px 140px rgba(7, 8, 9, .34), inset 0 0 100px rgba(7, 8, 9, .16); }
#three-layer { z-index: 3; display: block; width: 100%; height: 100%; outline: none; cursor: default; }
#three-layer.is-artwork-hover { cursor: zoom-in; }
.film-ui { z-index: 10; pointer-events: none; }

.asset-watermark {
  position: absolute;
  z-index: 8;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 max(36px, calc((100vw - 1320px) / 2));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .28s ease, visibility 0s linear .28s;
  mix-blend-mode: screen;
}
.asset-watermark.is-visible {
  opacity: .34;
  visibility: visible;
  transition-delay: 0s;
}
.asset-watermark span {
  color: rgba(242, 241, 236, .55);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}
.asset-watermark span:last-child {
  transform: rotate(-90deg);
  transform-origin: right center;
}

.artwork-viewer {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: grid;
  place-items: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s ease, visibility 0s linear .24s;
}
.artwork-viewer.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}
.artwork-viewer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 8, 9, .84);
  backdrop-filter: blur(16px);
}
.artwork-viewer-dialog {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(1120px, calc(100% - 72px));
  height: min(92svh, 920px);
  padding: 22px 26px 20px;
  border: 1px solid rgba(242, 241, 236, .22);
  background: rgba(17, 19, 19, .72);
  box-shadow: 0 26px 90px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(242, 241, 236, .1);
  transform: translateY(12px) scale(.985);
  transition: transform .34s cubic-bezier(.22, .61, .36, 1);
}
.artwork-viewer.is-open .artwork-viewer-dialog { transform: translateY(0) scale(1); }
.artwork-viewer-header, .artwork-viewer-footer { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; }
.artwork-viewer-kicker, .artwork-viewer-position { margin: 0; color: var(--lime); font-family: var(--mono); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.artwork-viewer-header h2 { max-width: min(65vw, 700px); margin: 9px 0 0; overflow: hidden; color: var(--paper); font-family: var(--display); font-size: clamp(21px, 2.1vw, 31px); font-weight: 500; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.viewer-icon-button { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid rgba(242, 241, 236, .24); background: rgba(7, 8, 9, .24); color: var(--paper); cursor: pointer; font-family: var(--mono); font-size: 20px; line-height: 1; transition: border-color .2s ease, color .2s ease, background .2s ease, transform .2s ease; }
.viewer-icon-button:hover, .viewer-icon-button:focus-visible { border-color: var(--lime); background: rgba(199, 239, 171, .08); color: var(--lime); outline: none; transform: translateY(-2px); }
.viewer-icon-button:disabled { opacity: .36; cursor: default; transform: none; }
.artwork-viewer-frame { position: relative; display: block; align-self: stretch; min-height: 0; height: auto; aspect-ratio: auto; margin: 20px 0; padding: 0; overflow: hidden; overscroll-behavior: contain; isolation: isolate; border: 1px solid rgba(242, 241, 236, .13); background: rgba(7, 8, 9, .48); }
.artwork-viewer-frame::before { content: "XII / ORIGINAL WORK"; position: absolute; top: 15px; left: 17px; z-index: 3; color: rgba(242, 241, 236, .48); font-family: var(--mono); font-size: 8px; letter-spacing: .14em; pointer-events: none; }
.artwork-viewer-frame::after { content: "XII"; position: absolute; top: 50%; left: 50%; z-index: 2; color: rgba(242, 241, 236, .18); font-family: var(--display); font-size: clamp(52px, 9vw, 132px); font-weight: 600; letter-spacing: .08em; line-height: 1; pointer-events: none; text-shadow: 0 2px 24px rgba(0, 0, 0, .35); transform: translate(-50%, -50%) rotate(-16deg); white-space: nowrap; }
.artwork-viewer-frame img { position: absolute; top: 50%; left: 50%; z-index: 1; display: block; width: auto; height: auto; max-width: calc(100% - 36px); max-height: calc(100% - 46px); object-fit: contain; object-position: center; user-select: none; -webkit-user-drag: none; transform: translate(-50%, -50%) scale(1); transform-origin: center; transition: transform .22s cubic-bezier(.22, .61, .36, 1); }
.artwork-viewer-footer { justify-content: space-between; gap: 15px; }
.artwork-viewer-nav, .artwork-viewer-zoom { display: flex; align-items: center; gap: 10px; }
.artwork-viewer-position { min-width: 60px; text-align: center; }
.viewer-zoom-reset { min-width: 47px; height: 36px; padding: 0 7px; border: 1px solid rgba(242, 241, 236, .24); background: rgba(7, 8, 9, .24); color: var(--paper); cursor: pointer; font-family: var(--mono); font-size: 9px; letter-spacing: .05em; transition: border-color .2s ease, color .2s ease, background .2s ease; }
.viewer-zoom-reset:hover, .viewer-zoom-reset:focus-visible { border-color: var(--lime); background: rgba(199, 239, 171, .08); color: var(--lime); outline: none; }
body.is-viewer-open { overflow: hidden; }

.info-modal { position: absolute; z-index: 36; inset: 0; display: grid; place-items: center; padding: 36px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .24s ease, visibility 0s linear .24s; }
.info-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.info-modal-backdrop { position: absolute; inset: 0; background: rgba(4, 5, 6, .84); backdrop-filter: blur(18px) saturate(.72); }
.info-modal-dialog { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(300px, .82fr) minmax(0, 1.18fr); grid-template-rows: auto minmax(0, 1fr); width: min(1180px, calc(100% - 72px)); height: min(86svh, 820px); overflow: hidden; border: 1px solid rgba(242, 241, 236, .2); background: rgba(11, 13, 14, .94); box-shadow: 0 32px 100px rgba(0, 0, 0, .56), inset 0 1px 0 rgba(242, 241, 236, .08); transform: translateY(18px) scale(.985); transition: transform .34s cubic-bezier(.22, .61, .36, 1); }
.info-modal-dialog::before { content: "XII"; position: absolute; right: -16px; bottom: -28px; color: transparent; font-family: var(--display); font-size: clamp(140px, 24vw, 310px); font-weight: 700; line-height: .72; opacity: .09; pointer-events: none; -webkit-text-stroke: 1px var(--paper); }
.info-modal.is-open .info-modal-dialog { transform: translateY(0) scale(1); }
.info-modal-header { position: relative; z-index: 2; grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; padding: 22px 26px; border-bottom: 1px solid rgba(242, 241, 236, .12); }
.info-modal-kicker { margin: 0 0 7px; color: var(--red); font-family: var(--mono); font-size: 8px; letter-spacing: .16em; }
.info-modal-header h2 { margin: 0; color: var(--paper); font-family: var(--display); font-size: clamp(25px, 3vw, 38px); font-weight: 500; letter-spacing: 0; }
.info-modal-body { position: relative; z-index: 1; grid-column: 2; grid-row: 2; min-height: 0; padding: 32px 34px 36px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; border-left: 1px solid rgba(242, 241, 236, .1); scrollbar-color: rgba(199, 239, 171, .34) transparent; }
.paper-stage { position: relative; z-index: 2; grid-column: 1; grid-row: 2; min-width: 0; min-height: 0; overflow: hidden; background: radial-gradient(circle at 50% 42%, rgba(199, 239, 171, .08), transparent 48%), linear-gradient(145deg, rgba(242, 241, 236, .025), transparent 52%); isolation: isolate; }
.paper-stage::before { content: ""; position: absolute; inset: 8%; border: 1px solid rgba(242, 241, 236, .07); pointer-events: none; }
.paper-stage::after { content: ""; position: absolute; z-index: -1; right: 8%; bottom: 10%; left: 8%; height: 16%; border-radius: 50%; background: rgba(0, 0, 0, .66); filter: blur(28px); transform: perspective(300px) rotateX(68deg); pointer-events: none; }
.paper-canvas { position: absolute; z-index: 1; inset: 0; display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; }
.paper-canvas.is-dragging { cursor: grabbing; }
.paper-stage-label { position: absolute; z-index: 2; right: 22px; bottom: 18px; left: 22px; display: flex; justify-content: space-between; gap: 16px; margin: 0; color: rgba(242, 241, 236, .3); font-family: var(--mono); font-size: 7px; letter-spacing: .13em; pointer-events: none; }
.contact-intro { max-width: 620px; margin-bottom: 38px; }
.contact-intro p, .resume-lead p { margin: 0 0 12px; color: var(--lime); font-family: var(--mono); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.contact-intro strong, .resume-lead strong { display: block; color: var(--paper); font-family: var(--display); font-size: clamp(25px, 3.5vw, 46px); font-weight: 500; letter-spacing: 0; line-height: 1.08; }
.contact-list { margin: 0; border-top: 1px solid rgba(242, 241, 236, .16); }
.contact-list div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 20px; padding: 17px 0; border-bottom: 1px solid rgba(242, 241, 236, .11); }
.contact-list dt { color: rgba(242, 241, 236, .42); font-family: var(--mono); font-size: 8px; letter-spacing: .13em; text-transform: uppercase; }
.contact-list dd { margin: 0; color: rgba(242, 241, 236, .82); font-size: 13px; }
.contact-list a { color: var(--lime); }
.contact-status { display: inline-block; width: 6px; height: 6px; margin-right: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px rgba(199, 239, 171, .7); }
.info-modal-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 28px; }
.info-primary-action, .info-secondary-action { min-height: 40px; padding: 0 16px; border: 1px solid rgba(242, 241, 236, .2); cursor: pointer; font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.info-primary-action { display: inline-flex; align-items: center; gap: 22px; border-color: var(--red); background: var(--red); color: #fff; }
.info-secondary-action { background: transparent; color: var(--paper); }
.info-primary-action:hover, .info-primary-action:focus-visible, .info-secondary-action:hover, .info-secondary-action:focus-visible { border-color: var(--lime); outline: none; }
.info-secondary-action:hover, .info-secondary-action:focus-visible { color: var(--lime); }
.resume-modal-body { padding-bottom: 50px; }
.resume-lead { max-width: 760px; margin-bottom: 42px; }
.resume-section { padding: 27px 0; border-top: 1px solid rgba(242, 241, 236, .13); }
.resume-section h3 { margin: 0 0 20px; color: var(--red); font-family: var(--mono); font-size: 9px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; }
.resume-section h4 { margin: 0; color: var(--paper); font-size: 15px; font-weight: 500; }
.resume-section h5 { margin: 24px 0 10px; color: var(--lime); font-family: var(--mono); font-size: 9px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.resume-section p, .resume-section li { color: rgba(242, 241, 236, .62); font-size: 12px; line-height: 1.72; }
.resume-section p { max-width: 800px; margin: 9px 0 0; }
.resume-section ul { margin: 10px 0 0; padding-left: 17px; }
.resume-facts, .resume-tag-list { display: flex; flex-wrap: wrap; gap: 8px; }
.resume-facts span, .resume-facts a, .resume-tag-list span { padding: 7px 9px; border: 1px solid rgba(199, 239, 171, .18); color: rgba(199, 239, 171, .74); font-family: var(--mono); font-size: 8px; letter-spacing: .06em; }
.resume-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 27px 38px; }
.resume-columns article { min-width: 0; }
.resume-experience article > header, .resume-education { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.resume-experience header p, .resume-education p { margin-top: 5px; color: rgba(242, 241, 236, .42); font-family: var(--mono); font-size: 9px; }
.resume-experience time, .resume-education time { flex: 0 0 auto; color: rgba(242, 241, 236, .42); font-family: var(--mono); font-size: 9px; letter-spacing: .08em; }
.resume-result { padding-left: 12px; border-left: 1px solid var(--red); color: rgba(242, 241, 236, .45) !important; }
body.is-info-modal-open { overflow: hidden; }

.info-modal.is-paper-mode .info-modal-dialog { display: block; width: min(720px, calc(100% - 72px)); height: min(90svh, 880px); overflow: visible; border: 0; background: transparent; box-shadow: none; }
.info-modal.is-paper-mode .info-modal-dialog::before { display: none; }
.info-modal.is-paper-mode .info-modal-header { position: absolute; z-index: 5; top: 0; right: -54px; display: block; padding: 0; border: 0; }
.info-modal.is-paper-mode .info-modal-header > div { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.info-modal.is-paper-mode .paper-stage { position: absolute; inset: 0; min-width: 0; min-height: 0; background: radial-gradient(circle at 50% 48%, rgba(199, 239, 171, .09), transparent 42%); }
.info-modal.is-paper-mode .paper-stage::before { display: none; }
.info-modal.is-paper-mode .paper-stage::after { right: 15%; bottom: 1%; left: 15%; }
.info-modal.is-paper-mode .paper-stage-label { display: none; }
.info-modal.is-paper-mode .info-modal-body { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; border: 0; clip: rect(0 0 0 0); white-space: nowrap; }

.profile-badge-layer { position: absolute; z-index: 7; inset: 0; overflow: hidden; pointer-events: none; perspective: 1400px; opacity: 0; visibility: hidden; transition: opacity .12s linear, visibility 0s linear .12s; }
.profile-badge-layer.is-active { opacity: 1; visibility: visible; transition-delay: 0s; }
.profile-badge-layer.is-active.is-drop .profile-badge-stage { animation: profile-badge-autonomous-drop 1.42s cubic-bezier(.16, .72, .2, 1) both; }
.world-stage.is-video-focus:not(.is-profile-physics) .profile-badge-layer { opacity: 0 !important; visibility: hidden !important; }
/* The DOM badge is only an offline fallback. Keep it hidden while WebGL is
   loading as well as after it paints, so refresh can never flash a second
   badge design. It becomes available only after boot marks Three.js failed. */
.world-stage:not(.no-three) .profile-badge-layer { opacity: 0 !important; visibility: hidden !important; }
.profile-badge-stage { position: absolute; top: -2vh; left: 62%; width: clamp(238px, 24vw, 330px); transform: translate3d(-50%, var(--badge-y, -620px), 0) rotateZ(var(--badge-rz, -12deg)) rotateX(var(--badge-rx, 0deg)) rotateY(var(--badge-ry, 0deg)); transform-style: preserve-3d; transform-origin: 50% 0; filter: drop-shadow(0 28px 28px rgba(0, 0, 0, .42)) drop-shadow(0 0 calc(var(--physics-hit, 0) * 10px) rgba(199, 239, 171, .18)); will-change: transform, filter; }
.badge-cord { position: relative; width: 54px; height: clamp(116px, 17vh, 174px); margin: 0 auto; }
.badge-cord::before, .badge-cord::after { content: ""; position: absolute; top: -10px; bottom: 0; width: 10px; border: 1px solid rgba(242, 241, 236, .12); background: repeating-linear-gradient(135deg, #161b1d 0 5px, #2d3537 5px 7px, #191e20 7px 12px); box-shadow: inset 1px 0 rgba(239, 57, 64, .5), inset -1px 0 rgba(7, 8, 9, .8); }
.badge-cord::before { left: 13px; transform: rotate(4deg); }
.badge-cord::after { right: 13px; transform: rotate(-4deg); }
.badge-cord span { position: absolute; z-index: 1; left: 50%; bottom: -7px; width: 32px; height: 18px; border: 1px solid rgba(239, 57, 64, .54); border-radius: 4px 4px 3px 3px; background: linear-gradient(180deg, #596164, #171b1d); box-shadow: 0 5px 10px rgba(0, 0, 0, .28); transform: translateX(-50%); }
.badge-cord span::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 8px; height: 8px; border: 1px solid rgba(242, 241, 236, .42); border-radius: 50%; transform: translateX(-50%); }
.profile-badge { position: relative; width: 100%; aspect-ratio: .68; padding: 13px; overflow: hidden; border: 1px solid rgba(242, 241, 236, .34); border-radius: 12px; background: #14181a; box-shadow: inset 1px 1px 0 rgba(242, 241, 236, .12), inset -8px -12px 20px rgba(0, 0, 0, .28), 0 0 0 1px rgba(10, 15, 16, .74), 0 18px 38px rgba(0, 0, 0, .42); transform-style: preserve-3d; }
.profile-badge::before { content: ""; position: absolute; z-index: -1; inset: 6px -8px -8px 6px; border: 1px solid rgba(242, 241, 236, .16); border-radius: 13px; background: rgba(20, 24, 26, .72); transform: translateZ(-9px); }
.profile-badge::after { content: ""; position: absolute; z-index: 6; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(112deg, rgba(242, 241, 236, .2), transparent 17% 55%, rgba(239, 57, 64, .1) 72%, transparent 88%); mix-blend-mode: screen; }
.badge-glass { position: absolute; z-index: 5; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(118deg, rgba(242, 241, 236, .12), transparent 22% 62%, rgba(242, 241, 236, .05) 82%, transparent 94%); mix-blend-mode: screen; }
.badge-header, .badge-footer { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; color: rgba(242, 241, 236, .72); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.badge-header b { color: #ef3940; font-size: 9px; font-weight: 600; }
.badge-status { position: relative; z-index: 1; display: flex; align-items: center; gap: 6px; margin-top: 11px; color: rgba(242, 241, 236, .58); font-family: var(--mono); font-size: 7px; letter-spacing: .09em; }
.badge-status i { width: 5px; height: 5px; border-radius: 50%; background: #c7efab; box-shadow: 0 0 8px rgba(199, 239, 171, .55); }
.badge-status em { margin-left: auto; color: rgba(242, 241, 236, .62); font-style: normal; }
.badge-photo-frame { position: relative; z-index: 1; margin: 12px 0 10px; overflow: hidden; aspect-ratio: 1.425; border: 1px solid rgba(242, 241, 236, .24); background: #202729; box-shadow: 0 10px 20px rgba(0, 0, 0, .34); }
.badge-photo-frame picture { display: block; width: 100%; height: 100%; }
.badge-photo-frame::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(242, 241, 236, .3); box-shadow: inset 0 0 18px rgba(0, 0, 0, .24); pointer-events: none; }
.badge-photo-frame img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 26%; filter: saturate(.86) contrast(1.04); }

@keyframes profile-badge-autonomous-drop {
  0% { opacity: 0; transform: translate3d(-50%, -430px, 0) rotateZ(-13deg) rotateX(-12deg) rotateY(-7deg); }
  48% { opacity: 1; transform: translate3d(-50%, 13px, 0) rotateZ(5deg) rotateX(4deg) rotateY(4deg); }
  68% { transform: translate3d(-50%, -6px, 0) rotateZ(-2.2deg) rotateX(-1.5deg) rotateY(-1.5deg); }
  82% { transform: translate3d(-50%, 3px, 0) rotateZ(1deg) rotateX(.8deg) rotateY(.8deg); }
  100% { opacity: 1; transform: translate3d(-50%, 0, 0) rotateZ(-1.5deg) rotateX(0deg) rotateY(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .profile-badge-layer.is-active .profile-badge-stage { animation: none; opacity: 1; transform: translate3d(-50%, 0, 0) rotateZ(-1.5deg) rotateX(0deg) rotateY(0deg); }
}
body.motion-off .profile-badge-layer.is-active .profile-badge-stage { animation: none; opacity: 1; transform: translate3d(-50%, 0, 0) rotateZ(-1.5deg) rotateX(0deg) rotateY(0deg); }
.badge-name { position: relative; z-index: 1; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding-bottom: 9px; border-bottom: 1px solid rgba(242, 241, 236, .14); }
.badge-name strong { color: var(--paper); font-family: var(--display); font-size: clamp(24px, 2.4vw, 34px); font-weight: 700; letter-spacing: 0; }
.badge-name span { color: rgba(242, 241, 236, .68); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-align: right; }
.badge-skills { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 5px; padding: 10px 0 13px; }
.badge-skills i { padding: 4px 6px; border: 1px solid rgba(242, 241, 236, .22); border-radius: 2px; color: rgba(242, 241, 236, .76); font-family: var(--mono); font-size: 7px; font-style: normal; letter-spacing: .08em; }
.badge-footer { padding-top: 9px; border-top: 1px solid rgba(242, 241, 236, .16); color: rgba(242, 241, 236, .56); font-size: 7px; }
.badge-footer span:last-child { max-width: 58%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.badge-idline { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; color: rgba(242, 241, 236, .42); font-family: var(--mono); font-size: 6px; letter-spacing: .11em; text-transform: uppercase; }
.badge-idline b { color: rgba(239, 57, 64, .76); font-weight: 400; }

.chapter-transition {
  position: absolute;
  z-index: 9;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  opacity: var(--transition-visibility, 0);
  visibility: hidden;
  pointer-events: none;
  isolation: isolate;
  transition: visibility 0s linear .18s;
}
.chapter-transition.is-active { animation: chapter-transition-hold .18s ease-out both; }
@keyframes chapter-transition-hold { from { opacity: .72; } to { opacity: 1; } }
.chapter-transition.is-active {
  visibility: visible;
  transition-delay: 0s;
}
.chapter-transition::before,
.chapter-transition::after {
  content: "";
  position: absolute;
  left: 7%;
  right: 7%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(144, 224, 226, .42) 20%, rgba(242, 241, 236, .1) 50%, rgba(144, 224, 226, .42) 80%, transparent);
  transform: scaleX(var(--transition-in, 0));
  transform-origin: center;
}
.chapter-transition::before { top: 34%; }
.chapter-transition::after { bottom: 34%; opacity: .5; }
.chapter-transition-core {
  position: relative;
  z-index: 2;
  display: grid;
  justify-items: center;
  width: min(720px, calc(100vw - 72px));
  text-align: center;
  transform: translate3d(0, calc((1 - var(--transition-in, 0)) * 18px), 0) scale(calc(.94 + var(--transition-in, 0) * .06));
  transform-origin: center;
}
.chapter-transition-kicker,
.chapter-transition-meta {
  margin: 0;
  color: rgba(144, 224, 226, .72);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.chapter-transition-kicker { opacity: var(--transition-in, 0); }
.chapter-transition-core h2 {
  display: grid;
  gap: 0;
  margin: 18px 0 21px;
  color: var(--paper);
  font-family: var(--display);
  font-size: clamp(52px, 8.2vw, 132px);
  font-weight: 600;
  letter-spacing: 0;
  line-height: .78;
  text-transform: uppercase;
}
.chapter-transition-core h2 span,
.chapter-transition-core h2 em {
  display: block;
  opacity: var(--transition-in, 0);
  transform: translate3d(calc((1 - var(--transition-in, 0)) * 34px), 0, 0);
}
.chapter-transition-core h2 span:nth-child(2) { transition-delay: .04s; }
.chapter-transition-core h2 em {
  color: var(--lime);
  font-style: normal;
  text-shadow: 0 0 12px rgba(199, 239, 171, .32), 0 0 38px rgba(144, 224, 226, .18);
  transition-delay: .08s;
}
.chapter-transition-meta {
  display: flex;
  gap: 20px;
  color: rgba(242, 241, 236, .46);
  opacity: var(--transition-in, 0);
}
.chapter-transition-meta span + span::before {
  content: "/";
  margin-right: 20px;
  color: rgba(144, 224, 226, .42);
}
.chapter-transition-orbit {
  position: absolute;
  z-index: 1;
  width: min(76vw, 920px);
  aspect-ratio: 1;
  border: 1px solid rgba(144, 224, 226, .12);
  border-radius: 50%;
  opacity: calc(var(--transition-in, 0) * .9);
  transform: rotateX(67deg) rotateZ(calc(var(--transition-progress, 0) * 18deg)) scale(calc(.7 + var(--transition-in, 0) * .3));
  box-shadow: 0 0 80px rgba(82, 187, 197, .06), inset 0 0 80px rgba(82, 187, 197, .04);
}
.chapter-transition-orbit::before,
.chapter-transition-orbit::after,
.chapter-transition-orbit i {
  content: "";
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(144, 224, 226, .1);
  border-radius: 50%;
}
.chapter-transition-orbit::after { inset: 27%; opacity: .72; }
.chapter-transition-orbit i:nth-child(1) { inset: 42%; border-color: rgba(199, 239, 171, .26); }
.chapter-transition-orbit i:nth-child(2) { inset: 3% 28%; transform: rotate(58deg); }
.chapter-transition-orbit i:nth-child(3) { inset: 3% 28%; transform: rotate(-58deg); }
.chapter-transition-scan {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 14%;
  right: 14%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(199, 239, 171, .75) 48%, transparent);
  box-shadow: 0 0 18px rgba(199, 239, 171, .42);
  opacity: var(--transition-in, 0);
  transform: translateX(calc((var(--transition-progress, 0) - .5) * 420px));
}
.chapter-transition-signal::before,
.chapter-transition-signal::after {
  background: linear-gradient(90deg, transparent, rgba(220, 176, 122, .34) 18%, rgba(242, 241, 236, .12) 50%, rgba(199, 239, 171, .48) 82%, transparent);
}
.chapter-transition-signal .chapter-transition-kicker { color: rgba(220, 176, 122, .72); }
.chapter-transition-signal .chapter-transition-core h2 em {
  color: var(--lime);
  text-shadow: 0 0 12px rgba(199, 239, 171, .38), 0 0 42px rgba(220, 176, 122, .12);
}
.chapter-transition-signal .chapter-transition-orbit {
  border-radius: 0;
  border-color: rgba(199, 239, 171, .13);
  transform: rotateX(70deg) rotateZ(calc(-5deg + var(--transition-progress, 0) * 11deg)) scale(calc(.72 + var(--transition-in, 0) * .28));
  box-shadow: 0 0 80px rgba(199, 239, 171, .05), inset 0 0 80px rgba(220, 176, 122, .04);
}
.chapter-transition-signal .chapter-transition-orbit::before,
.chapter-transition-signal .chapter-transition-orbit::after,
.chapter-transition-signal .chapter-transition-orbit i {
  border-radius: 0;
  border-color: rgba(199, 239, 171, .1);
}
.chapter-transition-signal .chapter-transition-orbit i:nth-child(1) { border-color: rgba(220, 176, 122, .28); }
.chapter-transition-signal .chapter-transition-scan {
  background: linear-gradient(90deg, transparent, rgba(220, 176, 122, .52), rgba(199, 239, 171, .8), transparent);
  box-shadow: 0 0 18px rgba(199, 239, 171, .38);
  transform: translateX(calc((.5 - var(--transition-progress, 0)) * 420px));
}
.chapter-transition-object { place-items: center start; padding-left: max(7vw, calc((100vw - 1320px) / 2)); }
.chapter-transition-object::before,
.chapter-transition-object::after { right: 8%; left: 8%; background: linear-gradient(90deg, rgba(220, 176, 122, .62), rgba(220, 176, 122, .08) 42%, transparent 78%); transform-origin: left; }
.chapter-transition-object::before { top: 27%; }
.chapter-transition-object::after { bottom: 22%; }
.chapter-transition-object .chapter-transition-core { justify-items: start; width: min(860px, 78vw); text-align: left; transform: translate3d(calc((1 - var(--transition-in, 0)) * -42px), 0, 0); }
.chapter-transition-object .chapter-transition-kicker { color: rgba(220, 176, 122, .78); font-family: var(--industrial); font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.chapter-transition-object .chapter-transition-core h2 { display: block; margin: 12px 0 20px; font-family: var(--industrial); font-size: 136px; font-weight: 700; line-height: .7; }
.chapter-transition-object .chapter-transition-core h2 span,
.chapter-transition-object .chapter-transition-core h2 em { transform: translate3d(0, calc((1 - var(--transition-in, 0)) * 28px), 0); }
.chapter-transition-object .chapter-transition-core h2 span:nth-child(2) { margin-left: 10%; color: rgba(242, 241, 236, .58); }
.chapter-transition-object .chapter-transition-core h2 em { margin-left: 27%; color: transparent; -webkit-text-stroke: 1px rgba(220, 176, 122, .92); text-shadow: 0 0 34px rgba(220, 176, 122, .12); }
.chapter-transition-object .chapter-transition-meta { color: rgba(242, 241, 236, .45); font-family: var(--industrial); font-size: 11px; font-weight: 600; letter-spacing: .07em; }
.chapter-transition-object .chapter-transition-meta span + span::before { color: rgba(220, 176, 122, .54); }
.chapter-transition-object .chapter-transition-orbit { right: 8%; width: min(34vw, 520px); border-radius: 0; border-color: rgba(220, 176, 122, .14); transform: rotateX(65deg) rotateZ(calc(-8deg + var(--transition-progress, 0) * 4deg)) scale(calc(.72 + var(--transition-in, 0) * .28)); box-shadow: 0 0 70px rgba(220, 176, 122, .05), inset 0 0 70px rgba(220, 176, 122, .03); }
.chapter-transition-object .chapter-transition-orbit::before,
.chapter-transition-object .chapter-transition-orbit::after,
.chapter-transition-object .chapter-transition-orbit i { border-radius: 0; border-color: rgba(220, 176, 122, .12); }
.chapter-transition-object .chapter-transition-scan { right: 18%; left: 8%; background: linear-gradient(90deg, rgba(220, 176, 122, .8), transparent); box-shadow: 0 0 18px rgba(220, 176, 122, .24); transform: translateY(calc((var(--transition-progress, 0) - .5) * 240px)); }
.chapter-transition-signal { place-items: center end; padding-right: max(7vw, calc((100vw - 1320px) / 2)); }
.chapter-transition-signal .chapter-transition-core { justify-items: end; width: min(970px, 82vw); text-align: right; transform: translate3d(calc((1 - var(--transition-in, 0)) * 42px), 0, 0); }
.chapter-transition-signal .chapter-transition-kicker { font-family: var(--editorial); font-size: 9px; font-weight: 600; letter-spacing: .04em; }
.chapter-transition-signal .chapter-transition-core h2 { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 22px; margin: 22px 0 24px; font-family: var(--editorial); font-size: 94px; font-weight: 700; line-height: .82; }
.chapter-transition-signal .chapter-transition-core h2 span,
.chapter-transition-signal .chapter-transition-core h2 em { transform: translate3d(calc((1 - var(--transition-in, 0)) * 55px), 0, 0); }
.chapter-transition-signal .chapter-transition-core h2 span:nth-child(2) { width: 100%; color: rgba(242, 241, 236, .48); }
.chapter-transition-signal .chapter-transition-core h2 em { padding: 0 8px 7px; border-bottom: 1px solid rgba(199, 239, 171, .5); }
.chapter-transition-signal .chapter-transition-meta { justify-content: flex-end; color: rgba(242, 241, 236, .45); font-family: var(--editorial); font-size: 8px; font-weight: 600; letter-spacing: .03em; }
.chapter-transition-signal .chapter-transition-orbit { left: 7%; width: min(42vw, 640px); }

.scene-copy { position: absolute; left: max(36px, calc((100vw - 1320px) / 2)); top: 22%; width: min(480px, 40vw); text-shadow: 0 2px 28px rgba(0, 0, 0, .35); will-change: opacity, transform; }
.eyebrow, .scene-counter, .scene-caption, .profile-line { margin: 0; font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--muted); }
.eyebrow-mark { display: inline-block; width: 7px; height: 7px; background: var(--red); box-shadow: 0 0 12px rgba(239, 57, 64, .8); }
.scene-copy::before { content: ""; position: absolute; left: -17px; top: 1.5em; width: 1px; height: 0; background: var(--red); box-shadow: 0 0 10px var(--red), 0 0 26px rgba(239, 57, 64, .7); opacity: 0; pointer-events: none; }
.scene-copy.is-changing::before { animation: copy-scan .7s cubic-bezier(.22, .61, .36, 1) both; }
.scene-copy h1 { position: relative; margin: 20px 0 16px; color: var(--paper); font-family: var(--display); font-size: clamp(54px, 7.2vw, 118px); font-weight: 600; letter-spacing: 0; line-height: .87; text-transform: uppercase; }
.scene-copy h1 em, .archive-head h2 em { color: var(--red); font-style: normal; text-shadow: 0 0 7px rgba(239, 57, 64, .65), 0 0 28px rgba(239, 57, 64, .25); }
.scene-copy.is-changing h1 { animation: title-glitch .36s steps(2, end) both; }
.scene-description { max-width: 300px; margin: 0; color: rgba(242, 241, 236, .7); line-height: 1.55; }
.world-stage[data-scene="object-studies"] .scene-copy { top: 17%; width: min(430px, 38vw); }
.world-stage[data-scene="object-studies"] .eyebrow { color: rgba(220, 176, 122, .78); font-family: var(--industrial); font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.world-stage[data-scene="object-studies"] .eyebrow-mark { width: 25px; height: 2px; background: #dcb07a; box-shadow: 0 0 14px rgba(220, 176, 122, .48); }
.world-stage[data-scene="object-studies"] .scene-copy h1 { margin: 14px 0 18px; font-family: var(--industrial); font-size: 118px; font-weight: 700; line-height: .71; }
.world-stage[data-scene="object-studies"] .scene-copy h1::after { content: "03 / MATERIAL LAB"; display: block; width: fit-content; margin-top: 18px; padding: 4px 7px; border: 1px solid rgba(220, 176, 122, .28); color: rgba(220, 176, 122, .68); font-family: var(--mono); font-size: 8px; font-weight: 400; letter-spacing: .12em; line-height: 1; }
.world-stage[data-scene="object-studies"] .scene-copy h1 em { color: transparent; -webkit-text-stroke: 1px rgba(220, 176, 122, .88); text-shadow: 0 0 24px rgba(220, 176, 122, .12); }
.world-stage[data-scene="object-studies"] .scene-description { padding-left: 14px; border-left: 2px solid rgba(220, 176, 122, .44); color: rgba(242, 241, 236, .62); }
.world-stage[data-scene="object-studies"] .scene-counter .asset-progress { color: #dcb07a; font-family: var(--industrial); font-size: 12px; font-weight: 600; letter-spacing: .06em; }
.world-stage[data-scene="image-systems"] .scene-copy { top: 15%; right: max(36px, calc((100vw - 1320px) / 2)); left: auto; width: min(570px, 46vw); text-align: right; }
.world-stage[data-scene="image-systems"] .eyebrow { justify-content: flex-end; color: rgba(199, 239, 171, .8); font-family: var(--editorial); font-size: 9px; font-weight: 600; letter-spacing: .04em; }
.world-stage[data-scene="image-systems"] .eyebrow-mark { order: 2; width: 7px; height: 7px; background: var(--lime); box-shadow: 0 0 16px rgba(199, 239, 171, .5); }
.world-stage[data-scene="image-systems"] .scene-copy::before { right: -17px; left: auto; background: var(--lime); box-shadow: 0 0 10px rgba(199, 239, 171, .8), 0 0 26px rgba(199, 239, 171, .32); }
.world-stage[data-scene="image-systems"] .scene-copy h1 { display: inline-block; margin: 20px 0 17px; font-family: var(--editorial); font-size: 92px; font-weight: 700; line-height: .78; }
.world-stage[data-scene="image-systems"] .scene-copy h1::before,
.world-stage[data-scene="image-systems"] .scene-copy h1::after { content: ""; position: absolute; right: 0; width: 128%; height: 1px; background: linear-gradient(90deg, transparent, rgba(199, 239, 171, .42)); }
.world-stage[data-scene="image-systems"] .scene-copy h1::before { top: -11px; }
.world-stage[data-scene="image-systems"] .scene-copy h1::after { bottom: -13px; }
.world-stage[data-scene="image-systems"] .scene-copy h1 em { color: var(--lime); font-style: normal; text-shadow: 0 0 11px rgba(199, 239, 171, .38), 0 0 34px rgba(199, 239, 171, .14); }
.world-stage[data-scene="image-systems"] .scene-description { max-width: 360px; margin-left: auto; color: rgba(242, 241, 236, .64); }
.world-stage[data-scene="image-systems"] .scene-counter .asset-progress { color: var(--lime); font-family: var(--editorial); font-size: 9px; font-weight: 600; letter-spacing: .02em; }
.scene-caption { position: absolute; bottom: 25px; left: max(36px, calc((100vw - 1320px) / 2)); color: var(--muted); transition: opacity .24s ease, transform .24s ease; }
.scene-caption::before { content: ""; display: inline-block; width: 28px; height: 1px; margin: 0 10px 3px 0; background: var(--red); }
.scene-counter { position: absolute; right: max(36px, calc((100vw - 1320px) / 2)); bottom: 25px; display: flex; gap: 24px; color: var(--muted); transition: opacity .24s ease; }
.scene-counter span:first-child { color: var(--paper); }
.scene-counter .asset-progress { max-width: min(34vw, 330px); overflow: hidden; color: var(--lime); font-family: var(--mono); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.chapter-rail { position: absolute; top: 50%; right: max(36px, calc((100vw - 1320px) / 2)); display: grid; gap: 14px; transform: translateY(-50%); pointer-events: auto; transition: opacity .24s ease, transform .24s ease; }
.chapter-stop { display: grid; grid-template-columns: 25px 1fr; gap: 10px; align-items: center; min-width: 122px; padding: 5px 0; border: 0; background: transparent; color: rgba(242, 241, 236, .38); cursor: pointer; font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-align: left; transition: color .25s ease, transform .25s ease; }
.chapter-stop span { position: relative; color: inherit; }
.chapter-stop span::after { content: ""; position: absolute; top: 50%; left: 27px; width: 0; height: 1px; background: var(--red); transition: width .25s ease; }
.chapter-stop b { font-weight: 400; transition: opacity .24s ease; }
.chapter-stop:hover, .chapter-stop.is-active { color: var(--paper); transform: translateX(-5px); }
.chapter-stop.is-active span { color: var(--red); }
.chapter-stop.is-active span::after { width: 20px; }
.world-stage.is-content-focus .scene-caption { opacity: 0; transform: translateY(7px); }
.world-stage.is-content-focus .scene-counter { opacity: .38; }
.world-stage.is-content-focus .chapter-rail { opacity: .18; transform: translateY(-50%) translateX(10px); }
.world-stage.is-content-focus .chapter-rail .chapter-stop b { opacity: 0; }
.world-stage.is-content-focus .chapter-rail:hover { opacity: 1; transform: translateY(-50%); }
.world-stage.is-content-focus .chapter-rail:hover .chapter-stop b { opacity: 1; }
.world-stage.is-text-transition .chapter-rail,
.world-stage.is-text-transition .scene-counter,
.world-stage.is-text-transition .scene-caption { opacity: 0; visibility: hidden; pointer-events: none; }
.world-stage.is-hero-profile-handoff .chapter-rail,
.world-stage.is-hero-profile-handoff .scene-counter,
.world-stage.is-hero-profile-handoff .scene-caption { opacity: 0; visibility: hidden; pointer-events: none; }
.world-stage.is-project-video-focus .scene-copy { pointer-events: none; }
.world-stage.is-reveal-dwell .scene-counter { opacity: .58; }
.profile-snapshot { --profile-impact: 0; position: absolute; z-index: 8; left: max(36px, calc((100vw - 1320px) / 2)); bottom: 10%; width: min(600px, 48vw); padding-top: 14px; border-top: 1px solid var(--line); opacity: 0; visibility: hidden; transform: translateY(20px); box-shadow: 0 0 calc(var(--profile-impact) * 24px) rgba(199, 239, 171, calc(var(--profile-impact) * .2)); transition: opacity .28s ease, transform .36s ease, visibility 0s linear .36s, box-shadow .16s ease; }
.profile-snapshot.is-visible { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }
.world-stage.is-video-focus:not(.is-profile-physics) .profile-snapshot { opacity: 0 !important; visibility: hidden !important; transition: none; }
.profile-line { display: flex; justify-content: space-between; color: var(--muted); }
.profile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 20px; margin: 21px 0 18px; }
.profile-grid div { display: grid; gap: 7px; }
.profile-grid small { color: var(--red); font-size: 10px; }
.profile-grid strong { font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .07em; }
.profile-snapshot p { max-width: 540px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.profile-tools { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.profile-tools span { padding: 5px 7px; border: 1px solid rgba(199, 239, 171, .2); color: rgba(199, 239, 171, .64); font-family: var(--mono); font-size: 8px; letter-spacing: .08em; }
.profile-contact { display: flex; justify-content: space-between; gap: 14px; margin-top: 18px; color: rgba(242, 241, 236, .42); font-family: var(--mono); font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.profile-contact a { color: rgba(199, 239, 171, .72); }
.world-stage.is-end-frame .scene-caption,
.world-stage.is-end-frame .scene-counter,
.world-stage.is-end-frame .chapter-rail { opacity: 0; visibility: hidden; pointer-events: none; }

.end-epilogue {
  --end-progress: 0;
  --end-lines: 0;
  --end-character: 0;
  --end-copy: 0;
  --end-meta: 0;
  --end-pointer-x: 0px;
  --end-pointer-y: 0px;
  --portrait-rotate-x: 0deg;
  --portrait-rotate-y: 0deg;
  --face-light-x: 50%;
  --face-light-y: 20%;
  --face-reveal: 0;
  --end-particle-energy: 0;
  --end-particle-x: 68%;
  --end-particle-y: 42%;
  position: absolute;
  z-index: 14;
  inset: 0;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
  background: radial-gradient(circle at 68% 48%, rgb(77 79 82 / calc(var(--end-cover, 0) * .16)), transparent 34%), linear-gradient(104deg, rgb(7 8 9 / calc(var(--end-cover, 0) * .98)) 0 36%, rgb(7 8 9 / calc(var(--end-cover, 0) * .92)) 51%, rgb(7 8 9 / calc(var(--end-cover, 0) * .72)) 100%);
}
.end-epilogue.is-active { visibility: visible; }
.end-epilogue.is-interactive { pointer-events: auto; }
.end-epilogue::before {
  content: "";
  position: absolute;
  z-index: 5;
  inset: 0;
  pointer-events: none;
  opacity: calc(var(--end-character) * .44);
  background: linear-gradient(90deg, rgba(7, 8, 9, .98) 0 28%, rgba(7, 8, 9, .66) 43%, transparent 65%), linear-gradient(180deg, rgba(7, 8, 9, .42), transparent 23% 76%, rgba(7, 8, 9, .92));
}
.end-epilogue::after {
  content: "";
  position: absolute;
  z-index: 10;
  inset: 13px;
  border: 1px solid rgba(242, 241, 236, calc(var(--end-meta) * .09));
  pointer-events: none;
}
.end-signal-network { position: absolute; z-index: 1; inset: 0; overflow: hidden; }
.end-signal-network::before { content: ""; position: absolute; z-index: 2; inset: 0; opacity: calc(var(--end-particle-energy) * .72); background: radial-gradient(circle at var(--end-particle-x) var(--end-particle-y), rgba(199, 239, 171, .2) 0, rgba(199, 239, 171, .07) 9%, transparent 25%); mix-blend-mode: screen; pointer-events: none; }
.end-signal-network::after { content: ""; position: absolute; z-index: 2; inset: 0; opacity: calc(var(--end-particle-energy) * .18); background-image: radial-gradient(circle, rgba(242, 241, 236, .7) 0 1px, transparent 1.5px); background-size: 19px 19px; mask-image: radial-gradient(circle at var(--end-particle-x) var(--end-particle-y), #000 0, transparent 35%); pointer-events: none; }
.end-signal-network span {
  position: absolute;
  top: 48%;
  left: 58%;
  width: min(78vw, 1120px);
  height: 1px;
  opacity: calc(var(--end-lines) * .28);
  background: linear-gradient(90deg, transparent, rgba(242, 241, 236, .2) 24%, rgba(242, 241, 236, .65) 50%, rgba(242, 241, 236, .15) 76%, transparent);
  box-shadow: 0 0 12px rgba(242, 241, 236, .1);
  transform: translate3d(-50%, calc(-50% + (1 - var(--end-lines)) * var(--line-y)), 0) rotate(calc((1 - var(--end-lines)) * var(--line-r))) scaleX(calc(.28 + var(--end-lines) * .72));
  will-change: transform, opacity;
}
.end-signal-network strong {
  position: absolute;
  top: 50%;
  right: 1.5%;
  color: transparent;
  font-family: var(--display);
  font-size: min(29vw, 430px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .7;
  opacity: calc(var(--end-lines) * .25);
  -webkit-text-stroke: 1px rgba(242, 241, 236, .48);
  text-shadow: 0 0 44px rgba(239, 57, 64, .12);
  transform: translate3d(calc((1 - var(--end-lines)) * 7vw), -50%, 0);
  will-change: transform, opacity;
}
.end-character {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: auto;
  margin: 0;
  overflow: hidden;
  opacity: var(--end-character);
  transform: translate3d(calc((1 - var(--end-character)) * 7vw + var(--end-pointer-x)), calc((1 - var(--end-character)) * 18px + var(--end-pointer-y)), 0) scale(calc(.965 + var(--end-character) * .035));
  transform-origin: 68% 54%;
  will-change: transform, opacity;
}
.end-character::before,
.end-character::after { content: ""; position: absolute; z-index: 2; pointer-events: none; }
.end-character::before { display: none; }
.end-character::after { right: 0; bottom: 0; left: 0; height: 23%; background: linear-gradient(180deg, transparent, #070809); }
.end-portrait { position: absolute; top: 0; right: 4%; bottom: 0; width: 62%; mix-blend-mode: screen; -webkit-mask-image: radial-gradient(ellipse 54% 68% at 53% 38%, #000 0 46%, rgba(0, 0, 0, .8) 62%, transparent 100%); mask-image: radial-gradient(ellipse 54% 68% at 53% 38%, #000 0 46%, rgba(0, 0, 0, .8) 62%, transparent 100%); transform: perspective(1250px) rotateX(var(--portrait-rotate-x)) rotateY(var(--portrait-rotate-y)); transform-origin: 52% 18%; will-change: transform; }
.end-portrait::before { content: ""; position: absolute; z-index: 3; inset: 0; pointer-events: none; background: radial-gradient(ellipse at var(--face-light-x) var(--face-light-y), rgba(199, 239, 171, .24) 0, rgba(199, 239, 171, .09) 8%, transparent 25%); opacity: calc(var(--end-character) * .72); mix-blend-mode: screen; transform: translateZ(1px); }
.end-portrait::after { content: ""; position: absolute; z-index: 4; inset: 0; pointer-events: none; background: linear-gradient(90deg, #070809 0%, rgba(7, 8, 9, .94) 10%, rgba(7, 8, 9, .48) 28%, transparent 50%), radial-gradient(ellipse at 50% 17%, transparent 0 17%, rgba(7, 8, 9, .26) 34%, rgba(7, 8, 9, .78) 68%, #070809 100%); opacity: calc(.72 - var(--face-reveal) * .42); mix-blend-mode: multiply; }
.end-character img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; transform: scale(calc(1.015 + var(--end-character) * .025)); transform-origin: 50% 14%; filter: brightness(calc(.62 + var(--end-character) * .22)) contrast(.94) saturate(.78); user-select: none; }
.end-portrait-canvas { position: absolute; z-index: 1; inset: 0; display: block; width: 100%; height: 100%; opacity: 0; filter: brightness(calc(.62 + var(--end-character) * .22)) contrast(.94) saturate(.78); transform: scale(calc(1.015 + var(--end-character) * .025)); transform-origin: 50% 14%; transition: opacity .24s ease; }
.end-portrait.has-particle-canvas .end-portrait-canvas { opacity: 1; }
.end-portrait.has-particle-canvas > img,
.end-portrait.has-particle-canvas > picture > img { opacity: 0; }
[data-protected-media],
[data-protected-media] img,
img,
canvas,
video { -webkit-touch-callout: none; -webkit-user-drag: none; user-select: none; }
.end-face-light { position: absolute; z-index: 5; inset: 0; pointer-events: none; background: linear-gradient(108deg, transparent 28%, rgba(242, 241, 236, .1) 45%, rgba(199, 239, 171, .22) 50%, transparent 66%); opacity: calc(var(--end-character) * var(--face-reveal) * .72); mix-blend-mode: screen; transform: translateX(calc((1 - var(--face-reveal)) * -28%)); }
.end-face-shadow { position: absolute; z-index: 6; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(7, 8, 9, .82) 0 10%, transparent 28%), linear-gradient(90deg, rgba(7, 8, 9, .78), transparent 34% 69%, rgba(7, 8, 9, .5)); opacity: calc(var(--end-character) * (1 - var(--face-reveal)) * .8); }
.end-copy {
  position: absolute;
  z-index: 8;
  top: 22%;
  left: max(36px, calc((100vw - 1320px) / 2));
  width: min(470px, 36vw);
  opacity: var(--end-copy);
  transform: translate3d(0, calc((1 - var(--end-copy)) * 24px), 0);
  will-change: transform, opacity;
}
.end-kicker { display: flex; align-items: center; gap: 11px; margin: 0 0 24px; color: rgba(242, 241, 236, .52); font-family: var(--mono); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.end-kicker span { width: 7px; height: 7px; background: var(--red); box-shadow: 0 0 14px rgba(239, 57, 64, .72); }
.end-copy h2 { margin: 0; color: var(--paper); font-family: var(--display); font-size: clamp(52px, 5.8vw, 88px); font-weight: 600; letter-spacing: 0; line-height: .86; text-transform: uppercase; }
.end-copy h2 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px rgba(242, 241, 236, .76); text-shadow: 0 0 26px rgba(239, 57, 64, .14); }
.end-statement { margin: 25px 0 7px; color: rgba(242, 241, 236, .78); font-family: var(--mono); font-size: 10px; letter-spacing: .12em; }
.end-statement-cn { margin: 0; color: rgba(242, 241, 236, .47); font-size: 12px; letter-spacing: .08em; }
.end-actions { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 31px; opacity: 0; transform: translateY(12px); transition: opacity .28s ease, transform .28s ease; pointer-events: none; }
.end-actions.is-visible { opacity: 1; transform: translateY(0); }
.end-epilogue.is-interactive .end-actions.is-visible { pointer-events: auto; }
.end-action { position: relative; padding: 9px 19px 9px 0; border: 0; border-bottom: 1px solid rgba(242, 241, 236, .28); background: transparent; color: var(--paper); cursor: pointer; font-family: var(--mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; transition: border-color .22s ease, color .22s ease; }
.end-action::after { content: "↗"; position: absolute; right: 0; color: var(--red); }
.end-action[data-replay]::after { content: "↺"; }
.end-action:hover,
.end-action:focus-visible { border-color: var(--red); color: #fff; outline: none; }
.end-meta { position: absolute; z-index: 8; right: max(36px, calc((100vw - 1320px) / 2)); bottom: 27px; left: max(36px, calc((100vw - 1320px) / 2)); display: flex; justify-content: space-between; gap: 24px; color: rgba(242, 241, 236, .32); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; opacity: var(--end-meta); transform: translateY(calc((1 - var(--end-meta)) * 8px)); }
.nav-state, .nav-actions button, .brand span { font-family: var(--mono); }

@keyframes copy-scan {
  0% { top: 1.5em; height: 0; opacity: 0; }
  18% { height: 1px; opacity: .95; }
  58% { top: 8.5em; height: 1px; opacity: .78; }
  100% { top: 11em; height: 0; opacity: 0; }
}

@keyframes title-glitch {
  0% { opacity: .35; transform: translateX(5px); text-shadow: 4px 0 rgba(239, 57, 64, .32); }
  45% { opacity: .9; transform: translateX(-1px); text-shadow: -2px 0 rgba(199, 239, 171, .18); }
  100% { opacity: 1; transform: translateX(0); text-shadow: none; }
}
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.scroll-track { position: absolute; inset: 0; pointer-events: none; }

@media (max-width: 800px) {
  :root { --page: calc(100vw - 36px); }
  .site-nav { padding: 17px 0; }
  .brand span, .nav-state, .motion-toggle { display: none; }
  .nav-actions { gap: 0; }
  .scroll-world { height: 2900vh; }
  .world-stage { min-height: 620px; }
  .scene-copy { left: 18px; top: 17%; width: calc(100% - 36px); }
  .scene-copy::before { left: -9px; }
  .scene-copy h1 { margin: 18px 0 14px; font-size: clamp(46px, 15vw, 80px); }
  .world-stage[data-scene="object-studies"] .scene-copy,
  .world-stage[data-scene="image-systems"] .scene-copy { top: 15%; right: auto; left: 18px; width: calc(100% - 70px); text-align: left; }
  .world-stage[data-scene="object-studies"] .scene-copy h1 { font-size: 70px; }
  .world-stage[data-scene="image-systems"] .scene-copy h1 { font-size: 53px; }
  .world-stage[data-scene="image-systems"] .eyebrow { justify-content: flex-start; }
  .world-stage[data-scene="image-systems"] .eyebrow-mark { order: 0; }
  .world-stage[data-scene="image-systems"] .scene-copy::before { right: auto; left: -9px; }
  .world-stage[data-scene="image-systems"] .scene-copy h1::before,
  .world-stage[data-scene="image-systems"] .scene-copy h1::after { right: auto; left: 0; width: 100%; }
  .world-stage[data-scene="image-systems"] .scene-description { margin-left: 0; }
  .environment-object-stage::after { right: 4%; font-size: 112px; }
  .environment-signal-field::before { font-size: 42px; }
  .scene-description { max-width: 250px; }
  .chapter-rail { top: auto; right: 18px; bottom: 68px; gap: 7px; transform: none; }
  .chapter-stop { min-width: 26px; grid-template-columns: 26px; padding: 3px 0; }
  .chapter-stop b { display: none; }
  .chapter-stop span::after { left: 25px; }
  .profile-snapshot { left: 18px; right: 18px; bottom: 14px; width: auto; }
  .profile-badge-stage { top: -1vh; left: 62%; width: min(238px, calc(100vw - 116px)); }
  .badge-cord { height: clamp(92px, 14vh, 136px); }
  .profile-badge { padding: 11px; }
  .badge-photo-frame { margin: 9px 0 8px; }
  .profile-contact { display: none; }
  .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 12px; margin-top: 17px; }
  .profile-grid strong { font-size: 9px; letter-spacing: .03em; }
  .profile-snapshot p { font-size: 10px; line-height: 1.45; }
  .profile-tools { gap: 5px; margin-top: 13px; }
  .profile-tools span { padding: 4px 5px; font-size: 7px; }
  .profile-contact { margin-top: 13px; font-size: 7px; }
  .chapter-transition-core { width: calc(100vw - 36px); }
  .chapter-transition-core h2 { font-size: clamp(47px, 15vw, 82px); }
  .chapter-transition-meta { gap: 8px; font-size: 7px; letter-spacing: .12em; }
  .chapter-transition-meta span + span::before { margin-right: 8px; }
  .chapter-transition-orbit { width: 112vw; }
  .chapter-transition-object,
  .chapter-transition-signal { place-items: center; padding-right: 18px; padding-left: 18px; }
  .chapter-transition-object .chapter-transition-core,
  .chapter-transition-signal .chapter-transition-core { justify-items: start; width: calc(100vw - 36px); text-align: left; }
  .chapter-transition-object .chapter-transition-core h2 { font-size: 76px; }
  .chapter-transition-object .chapter-transition-core h2 span:nth-child(2) { margin-left: 5%; }
  .chapter-transition-object .chapter-transition-core h2 em { margin-left: 14%; }
  .chapter-transition-signal .chapter-transition-core h2 { justify-content: flex-start; gap: 0 9px; font-size: 50px; }
  .chapter-transition-signal .chapter-transition-meta { justify-content: flex-start; }
  .chapter-transition-object .chapter-transition-orbit,
  .chapter-transition-signal .chapter-transition-orbit { right: auto; left: -8%; width: 112vw; }
  .end-epilogue { background: linear-gradient(180deg, rgb(7 8 9 / calc(var(--end-cover, 0) * .98)) 0 36%, rgb(7 8 9 / calc(var(--end-cover, 0) * .86)) 58%, rgb(7 8 9 / var(--end-cover, 0)) 100%); }
  .end-epilogue::before { opacity: calc(var(--end-character) * .62); background: linear-gradient(180deg, transparent 0 30%, rgba(7, 8, 9, .3) 43%, #070809 59%); }
  .end-epilogue::after { inset: 8px; }
  .end-signal-network span { left: 50%; width: 130vw; }
  .end-signal-network strong { top: 27%; right: -4%; font-size: 42vw; }
  .end-character { inset: 0; width: auto; height: auto; }
  .end-portrait { top: 0; right: -16%; bottom: auto; width: 132%; height: 49%; -webkit-mask-image: linear-gradient(180deg, #000 0 64%, transparent 100%); mask-image: linear-gradient(180deg, #000 0 64%, transparent 100%); }
  .end-character::before { width: 35%; background: linear-gradient(90deg, #070809 0 30%, rgba(7, 8, 9, .84) 64%, transparent); }
  .end-character::after { height: 31%; }
  .end-character img { object-position: 50% 8%; transform-origin: 50% 13%; }
  .end-copy { top: 46%; left: 18px; width: calc(100% - 36px); }
  .end-kicker { margin-bottom: 16px; font-size: 8px; }
  .end-copy h2 { font-size: clamp(38px, 11.5vw, 51px); line-height: .86; }
  .end-statement { margin-top: 18px; font-size: 8px; }
  .end-statement-cn { max-width: 310px; font-size: 11px; }
  .end-actions { gap: 8px 17px; margin-top: 19px; }
  .end-action { padding-right: 16px; font-size: 8px; }
  .end-meta { right: 18px; bottom: 14px; left: 18px; gap: 14px; align-items: flex-end; font-size: 6px; line-height: 1.45; }
  .end-meta span:first-child { max-width: 48%; }
  .end-meta span:last-child { max-width: 46%; text-align: right; }
  .scene-caption { left: 18px; bottom: 18px; }
  .scene-counter { right: 18px; bottom: 18px; gap: 12px; }
  .scene-counter .asset-progress { position: absolute; right: 0; bottom: 20px; max-width: calc(100vw - 36px); }
  .scene-counter span:last-child { display: none; }
  .world-stage.is-content-focus .chapter-rail { transform: translateX(6px); }
  .world-stage.is-content-focus .chapter-rail:hover { transform: none; }
  .environment-layer { inset: -10%; }
  .asset-watermark { padding: 0 18px; }
  .asset-watermark span { font-size: 7px; letter-spacing: .12em; }
  .artwork-viewer-dialog { width: calc(100% - 24px); height: min(88svh, 760px); padding: 16px 14px 14px; }
  .artwork-viewer-frame { aspect-ratio: auto; margin: 15px 0; padding: 0; }
  .artwork-viewer-header h2 { max-width: calc(100vw - 100px); font-size: 19px; }
  .viewer-icon-button { width: 34px; height: 34px; }
  .artwork-viewer-footer { gap: 10px; }
  .artwork-viewer-nav, .artwork-viewer-zoom { gap: 6px; }
  .artwork-viewer-position { min-width: 48px; }
  .viewer-zoom-reset { min-width: 42px; height: 34px; }
  .info-modal { padding: 12px; }
  .info-modal-dialog { grid-template-columns: 1fr; grid-template-rows: auto minmax(210px, 31svh) minmax(0, 1fr); width: 100%; height: 92svh; max-height: 92svh; }
  .info-modal-header { padding: 17px 16px; }
  .paper-stage { grid-column: 1; grid-row: 2; }
  .paper-stage::before { inset: 7px; }
  .paper-stage-label { right: 14px; bottom: 10px; left: 14px; }
  .info-modal-body { grid-column: 1; grid-row: 3; padding: 24px 17px 30px; border-top: 1px solid rgba(242, 241, 236, .1); border-left: 0; }
  .contact-intro { margin-bottom: 27px; }
  .contact-list div { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
  .resume-lead { margin-bottom: 30px; }
  .resume-columns { grid-template-columns: 1fr; gap: 24px; }
  .resume-experience article > header, .resume-education { display: grid; gap: 7px; }
  .info-modal.is-paper-mode { padding: 44px 18px 34px; }
  .info-modal.is-paper-mode .info-modal-dialog { width: 100%; height: min(78svh, 680px); }
  .info-modal.is-paper-mode .info-modal-header { top: -40px; right: 0; }
  .info-modal.is-paper-mode .paper-stage { grid-column: auto; grid-row: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .intro-signal, .xii-cursor { display: none; }
  .timeline-video { transition: none; }
  .scene-copy.is-changing::before, .scene-copy.is-changing h1 { animation: none; }
  .end-character,
  .end-copy,
  .end-meta,
  .end-signal-network span,
  .end-signal-network strong { transition: none; will-change: auto; }
}

@media (max-width: 800px), (pointer: coarse) {
  .xii-cursor { display: none; }
  .desktop-experience-note { bottom: max(16px, env(safe-area-inset-bottom)); }
  .intro-beacon { width: 88px; height: 88px; }
  .intro-beacon-core { inset: 24px; }
  .intro-beacon-needle { top: 78px; }
  .intro-beacon-arrow { top: 80px; }
  .intro-depth { right: 18px; bottom: 20px; left: 18px; gap: 5px; }
}