/* Signal / Matter: original scenes, ordinary document scrolling, semantic content. */
:root {
  --cinematic-gutter: clamp(28px, 5.4vw, 90px);
  --cinematic-edge: #1b493522;
  --cinematic-emerald: #12634e;
}
:root[data-scene=liquid] { scroll-padding-top: 0; }
:root[data-scene=liquid] body { overflow-x: clip; }
:root[data-scene=liquid][data-theme=ice] {
  color-scheme: light;
  --world-rgb: 218 225 220;
  --chapter-rgb: 229 235 231;
  --ink: #14271f;
  --muted: #40594e;
  --accent: #12634e;
  --line: #23493632;
  --liquid-line: #23493632;
  --panel: #e5ebe6;
  --paper: #edf1ed;
  --fog: #dae1dc;
  --cinematic-edge: #23493625;
}
:root[data-scene=liquid][data-theme=night] {
  --world-rgb: 7 17 19;
  --chapter-rgb: 18 33 33;
  --ink: #edf2ec;
  --muted: #b0c7bd;
  --accent: #9de1bb;
  --line: #afddc632;
  --liquid-line: #afddc632;
  --panel: #122222;
  --paper: #142d29;
  --fog: #071113;
  --cinematic-edge: #a0dabc28;
  --cinematic-emerald: #9de1bb;
}
:root[data-scene=liquid] body[data-chapter=contact],
:root[data-scene=liquid] .contact-chapter {
  --world-rgb: 7 17 19;
  --chapter-rgb: 18 33 33;
  --ink: #e5eee9;
  --muted: #9bafa5;
  --accent: #a8e7c8;
  --line: #a8e7c833;
  --panel: #122222;
  --paper: #142d29;
  color: var(--ink);
}
:root[data-scene=orbital] { --world-rgb: 191 209 220; }
:root[data-scene=orbital][data-theme=night] { --world-rgb: 3 9 20; }
:root[data-scene=liquid] .grain { opacity: .018; }
:root[data-scene=liquid] .atmosphere { background: linear-gradient(90deg, rgb(var(--world-rgb) / .14), transparent 42%); }
:root[data-scene=liquid] .site-header { padding: 24px var(--cinematic-gutter); gap: 22px; }
:root[data-scene=liquid] .site-header::before { background: linear-gradient(rgb(var(--world-rgb) / .94), rgb(var(--world-rgb) / .7) 58%, transparent); }
:root[data-scene=liquid] .wordmark { font-size: 29px; letter-spacing: -.075em; }
:root[data-scene=liquid] .header-identity { font: 11px/1.55 var(--display); padding-left: 20px; }
:root[data-scene=liquid] .site-header nav { font: 11px/1.6 var(--mono); gap: 30px; }
:root[data-scene=liquid] .site-header nav a { min-height: 40px; display: inline-flex; align-items: center; gap: 5px; }
:root[data-scene=liquid] .site-header nav sup { font-size: 11px; opacity: .6; }
:root[data-scene=liquid] .world-caption { position: absolute; top: 118px; left: var(--cinematic-gutter); font: 11px/1.7 var(--mono); letter-spacing: .055em; }
:root[data-scene=liquid] .world-caption .coordinate { display: none; }
:root[data-scene=liquid] .scene-status { top: 119px; right: var(--cinematic-gutter); font-size: 11px; }
:root[data-scene=liquid] .chapter:not(.home-chapter) { padding-inline: var(--cinematic-gutter); }
:root[data-scene=liquid] .chapter-label { font: 11px/1.8 var(--mono); color: var(--accent); letter-spacing: .035em; margin-bottom: 26px; }
:root[data-scene=liquid] .chapter-label span { margin-right: 13px; }
:root[data-scene=liquid] .home-chapter { height: 120svh; min-height: 760px; padding: 0; }
.hero-frame { position: sticky; top: 0; width: 100%; height: 100svh; min-height: 630px; }
:root[data-scene=liquid] .intro-note,
:root[data-scene=liquid] .hero-footnote { display: none; }
:root[data-scene=liquid] .hero-name-block { left: var(--cinematic-gutter); bottom: 19svh; max-width: 500px; }
:root[data-scene=liquid] .hero-name-block > .micro-label { font-size: 11px; margin-bottom: 22px; letter-spacing: .045em; }
:root[data-scene=liquid] .hero-name-block h1 { font-size: clamp(70px, 7.7vw, 126px); font-weight: 500; line-height: .87; letter-spacing: -.075em; }
:root[data-scene=liquid] .hero-byline { font: 16px/1.7 var(--display); margin-top: 25px; max-width: 310px; }
.hero-material-note { font: 11px/1.7 var(--mono); color: var(--accent); margin-top: 13px; }
:root[data-scene=liquid] .sculpture-control { right: var(--cinematic-gutter); bottom: 15svh; top: auto; left: auto; align-items: flex-end; transform: none; gap: 12px; }
:root[data-scene=liquid] .sculpture-control button { font-size: 11px; min-height: 44px; padding: 11px 16px; background: rgb(var(--world-rgb) / .38); border-color: var(--line); border-radius: 0; backdrop-filter: blur(8px); }
:root[data-scene=liquid] .drag-hint { font-size: 11px; text-shadow: none; }
:root[data-scene=liquid] .scroll-invitation { left: var(--cinematic-gutter); bottom: 9svh; font-size: 11px; gap: 18px; }
:root[data-scene=liquid] .scroll-line { width: 40px; }
:root[data-scene=liquid] .about-chapter { display: block; min-height: 120svh; padding-block: 20svh 12svh; background: none; }
:root[data-scene=liquid] .about-chapter .chapter-copy { position: sticky; top: 19svh; max-width: 390px; }
:root[data-scene=liquid] .about-chapter h2 { font-size: clamp(44px, 4.5vw, 68px); line-height: .99; }
:root[data-scene=liquid] .lead-copy { font-size: 21px; line-height: 1.45; letter-spacing: -.035em; margin-top: 28px; }
:root[data-scene=liquid] .body-copy { font-size: 16px; line-height: 1.75; max-width: 38ch; margin-top: 18px; }
:root[data-scene=liquid] .perspective-details { font-size: 11px; gap: 18px; margin-top: 28px; padding-top: 20px; }
:root[data-scene=liquid] .perspective-details strong { font-size: 11px; }
:root[data-scene=liquid] .chapter-side-note { display: none; }

/* Each exhibit holds a full composition, while its outer article remains scrollable. */
:root[data-scene=liquid] .work-chapter { background: none; padding-top: 100px; padding-bottom: 120px; }
:root[data-scene=liquid] .work-topline { border-top: 1px solid var(--line); padding-top: 22px; gap: 25px; margin-bottom: 30px; }
:root[data-scene=liquid] .work-topline .chapter-label { margin: 0; }
:root[data-scene=liquid] .work-topline > span { font-size: 11px; }
:root[data-scene=liquid] .work-title-row { display: block; align-items: flex-end; margin-bottom: 0; gap: 35px; }
:root[data-scene=liquid] .work-title-row h2 { font-size: clamp(43px, 5.2vw, 77px); line-height: .99; }
:root[data-scene=liquid] .work-title-row > p { font: 16px/1.7 var(--display); margin-top: 22px; max-width: 380px; }
.cinematic-exhibits { position: relative; }
.cinematic-exhibit { position: relative; min-height: 160svh; padding: 0; border: none; }
.exhibit-frame { position: sticky; top: 0; width: 100%; height: 100svh; min-height: 650px; }
.exhibit-stage { position: absolute; inset: 12svh -3vw 13svh 39%; pointer-events: none; display: flex; align-items: center; justify-content: center; }
.exhibit-fallback { display: none; width: 78%; max-height: 58svh; object-fit: contain; }
.exhibit-copy { position: absolute; top: 26svh; left: 0; width: min(34%, 340px); opacity: var(--copy-opacity, 1); }
.exhibit-copy:focus-within { opacity: 1; }
.exhibit-copy::before { content: ''; position: absolute; z-index: -1; inset: -45px -35px; pointer-events: none; background: radial-gradient(ellipse, rgb(var(--world-rgb) / .22), transparent 73%); }
.exhibit-kicker { display: flex; flex-wrap: wrap; gap: 7px 19px; color: var(--muted); font: 11px/1.7 var(--mono); letter-spacing: .025em; margin-bottom: 23px; }
.exhibit-kicker span { color: var(--accent); }
.exhibit-copy h3 { font: 500 clamp(40px, 4.3vw, 65px)/.98 var(--display); letter-spacing: -.065em; overflow-wrap: anywhere; }
.exhibit-copy h3 span { color: var(--accent); }
.exhibit-question { font-size: 19px; line-height: 1.45; letter-spacing: -.025em; margin-top: 25px; }
.exhibit-description { font-size: 16px; line-height: 1.75; color: var(--muted); margin-top: 18px; }
.exhibit-tags { display: flex; flex-wrap: wrap; gap: 6px 15px; list-style: none; padding: 0; margin: 18px 0 0; color: var(--muted); font: 11px/1.8 var(--mono); }
.exhibit-tags li { padding-left: 9px; position: relative; }
.exhibit-tags li::before { content: ''; width: 3px; height: 3px; position: absolute; left: 0; top: 8px; background: var(--accent); }
.exhibit-open { display: inline-flex; align-items: center; justify-content: space-between; gap: 35px; font: 12px/1.6 var(--mono); min-height: 48px; margin-top: 20px; padding: 13px 0; border-bottom: 1px solid var(--accent); }
.exhibit-open span { font: 22px/1 var(--display); transition: transform .2s; }
.exhibit-open:hover span { transform: translate(3px, -3px); }
.exhibit-open:hover { color: var(--accent); }
.exhibit-state { font: 11px/1.6 var(--mono); color: var(--muted); margin-top: 14px; }
.exhibit-coordinate { position: absolute; right: 0; bottom: 12svh; color: var(--muted); font: 11px/1.7 var(--mono); letter-spacing: .03em; }
.archive-projects { margin-top: 60px; border-block: 1px solid var(--line); background: rgb(var(--world-rgb) / .85); }
.archive-projects > summary { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 26px 0; cursor: pointer; list-style: none; }
.archive-projects > summary::-webkit-details-marker { display: none; }
.archive-projects > summary .micro-label { display: block; font-size: 11px; color: var(--accent); }
.archive-projects > summary strong { display: block; margin-top: 9px; font-size: clamp(23px, 2.7vw, 36px); font-weight: 400; letter-spacing: -.05em; }
.archive-count { display: flex; align-items: center; gap: 23px; white-space: nowrap; color: var(--muted); font: 11px/1.7 var(--mono); }
.archive-count .details-plus { display: inline-block; color: var(--ink); transition: transform .2s; }
.archive-projects[open] .details-plus { transform: rotate(45deg); }
:root[data-scene=liquid] .archive-projects .project-index { border-top-color: var(--line); background: transparent; }
:root[data-scene=liquid] .archive-projects .project-select { padding-block: 24px; }
:root[data-scene=liquid] .archive-projects .project-name { font-size: clamp(24px, 2.6vw, 36px); }
:root[data-scene=liquid] .work-footer { font-size: 11px; gap: 25px; line-height: 1.8; }
:root[data-scene=liquid] .work-footer .inline-link { font-size: 11px; flex-shrink: 0; }
:root[data-scene=liquid] .journey-chapter { padding-block: 100px 140px; background: linear-gradient(180deg, transparent, rgb(var(--world-rgb) / .92) 8%, rgb(var(--world-rgb) / .92) 92%, transparent); }
:root[data-scene=liquid] .journey-intro h2 { font-size: clamp(46px, 5.5vw, 78px); }
:root[data-scene=liquid] .journey-intro > p { font: 16px/1.7 var(--display); }
:root[data-scene=liquid] .build-stories { background: rgb(var(--world-rgb) / .72); }
:root[data-scene=liquid] .story-notes dd { font-size: 16px; }
:root[data-scene=liquid] .education-line { font-size: 12px; }

/* The finale is a single authored composition, with the full contact flow intact. */
:root[data-scene=liquid] .contact-chapter { display: block; min-height: 150svh; padding-top: 0; padding-bottom: 0; background: none; }
.finale-frame { position: sticky; top: 0; height: 100svh; min-height: 690px; }
.particle-stage { position: absolute; inset: 10svh -3vw 20svh 28%; pointer-events: none; display: grid; place-items: center; }
.particle-fallback { display: none; color: var(--accent); font: 300 clamp(150px, 25vw, 360px)/1 var(--display); opacity: .45; }
.contact-copy { position: absolute; left: 0; top: 28svh; width: min(34%, 345px); }
.contact-copy::before { content: ''; position: absolute; z-index: -1; inset: -45px -40px; background: radial-gradient(ellipse, rgb(var(--world-rgb) / .6), transparent 75%); pointer-events: none; }
:root[data-scene=liquid] .contact-copy .chapter-label { margin-bottom: 30px; }
:root[data-scene=liquid] .contact-chapter h2 { font-size: clamp(59px, 6.8vw, 99px); line-height: 1; letter-spacing: -.065em; }
.finale-byline { font-size: 24px; line-height: 1.4; letter-spacing: -.045em; margin-top: 21px; }
:root[data-scene=liquid] .contact-bottom { display: block; margin-top: 35px; }
:root[data-scene=liquid] .contact-bottom p { font: 16px/1.6 var(--display); margin-bottom: 13px; }
:root[data-scene=liquid] .contact-email { font-size: clamp(21px, 2.1vw, 29px); line-height: 1.4; letter-spacing: -.045em; }
:root[data-scene=liquid] .contact-email span { margin-left: 8px; }
:root[data-scene=liquid] #copy-email { font-size: 11px; min-height: 40px; }
:root[data-scene=liquid] .contact-links { display: flex; flex-direction: row; flex-wrap: wrap; gap: 7px 23px; margin-top: 19px; font-size: 11px; }
:root[data-scene=liquid] .contact-links a { min-height: 35px; display: inline-flex; align-items: center; }
.particle-form-controls { position: absolute; right: -30px; bottom: 15svh; width: 52%; text-align: center; }
.particle-stage-label { color: var(--accent); font: 11px/1.6 var(--mono); letter-spacing: .045em; margin-bottom: 14px; }
.particle-forms { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.particle-forms button { min-height: 44px; border: 1px solid transparent; border-bottom-color: var(--line); font: 11px/1.6 var(--mono); padding: 10px 14px; background: rgb(var(--world-rgb) / .26); transition: color .2s, border-color .2s; }
.particle-forms button[aria-pressed=true], .particle-forms button:hover { color: var(--accent); border-bottom-color: var(--accent); }
.particle-hint { color: var(--muted); font: 11px/1.8 var(--mono); margin-top: 12px; }
.particle-technical { color: var(--muted); font: 11px/1.8 var(--mono); margin-top: 3px; opacity: .8; }
.particle-count-compact { display: none; }
.aircraft-inspection { position: absolute; right: -30px; top: 12svh; width: 52%; display: flex; align-items: flex-start; justify-content: center; gap: 6px; text-align: center; pointer-events: auto; }
.aircraft-inspection[hidden], #aircraft-inspection-views[hidden] { display: none; }
.aircraft-inspection button { min-height: 44px; min-width: 44px; padding: 10px; border: 1px solid var(--line); background: rgb(var(--world-rgb) / .82); color: var(--muted); font: 11px/1.6 var(--mono); cursor: pointer; }
.aircraft-inspection button:hover, .aircraft-inspection button[aria-pressed=true], #aircraft-inspect-toggle[aria-expanded=true] { color: var(--accent); border-color: var(--accent); }
.aircraft-inspection button:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
#aircraft-inspect-toggle { flex-shrink: 0; white-space: nowrap; }
#aircraft-inspection-views { min-width: 0; }
.aircraft-view-buttons { display: flex; justify-content: center; flex-wrap: wrap; gap: 5px; }
#aircraft-inspection-views p { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:root[data-scene=liquid] .contact-chapter footer { position: absolute; left: var(--cinematic-gutter); right: var(--cinematic-gutter); bottom: 8svh; margin: 0; padding-top: 19px; font-size: 11px; line-height: 1.7; }

/* Sound is opt-in and remains reachable throughout the journey. */
:root[data-scene=liquid] .sound-controls { left: var(--cinematic-gutter); bottom: 16px; gap: 14px; }
:root[data-scene=liquid] #sound-toggle { min-height: 44px; padding: 10px 15px; border: 1px solid var(--line); background: rgb(var(--world-rgb) / .7); backdrop-filter: blur(10px); font-size: 11px; }
:root[data-scene=liquid] .sound-volume { padding-inline: 10px; background: rgb(var(--world-rgb) / .85); }
:root[data-scene=liquid] .sound-credit { display: none; }
#sound-player-toggle { min-height: 44px; padding: 10px 0; font: 11px/1.6 var(--mono); color: var(--muted); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 5px; white-space: nowrap; }
#sound-player-toggle:hover, #sound-player-toggle[aria-expanded=true] { color: var(--accent); }
#sound-player-panel { position: absolute; left: 0; bottom: 57px; width: min(355px, calc(100vw - 40px)); padding: 15px; background: var(--panel); border: 1px solid var(--line); box-shadow: 0 12px 40px #10291f24; pointer-events: auto; }
#sound-player-panel audio { display: block; width: 100%; min-height: 44px; margin-top: 8px; }
#sound-player-panel button { display: block; min-height: 44px; padding: 8px 0; margin-left: auto; font: 11px/1.6 var(--mono); }
#sound-player-panel p { font: 12px/1.6 var(--display); color: var(--muted); }
#sound-player-panel .sound-player-title { color: var(--ink); padding-right: 35px; }
#sound-player-panel .sound-player-note { display: block; color: var(--muted); font: 11px/1.6 var(--mono); margin-top: 10px; }
#sound-player-close { position: absolute; top: 0; right: 12px; width: 35px; font-size: 20px !important; }
:root[data-scene=liquid] .world-controls { right: var(--cinematic-gutter); bottom: 16px; gap: 20px; }
:root[data-scene=liquid] .world-controls button { font-size: 11px; min-height: 44px; }
:root[data-scene=liquid] .world-controls::before { height: 72px; background: linear-gradient(transparent, rgb(var(--world-rgb) / .92) 85%); }
:root[data-scene=liquid] .chapter-dots { right: 13px; }
:root[data-scene=liquid] .chapter-dots a { min-height: 30px; }
:root[data-scene=liquid] .mobile-menu { font-size: 11px; min-height: 44px; }
:root[data-scene=liquid] .mobile-links span { font-size: 11px; }
:root[data-scene=liquid] .project-dialog-visual > span { font-size: 11px; line-height: 1.6; }
:root[data-scene=liquid] .project-dialog-copy h2 { font-size: clamp(34px, 4vw, 51px); }
:root[data-scene=liquid] .project-dialog-copy #project-dialog-description { font-size: 16px; }

/* Featured details use the native dialog over the live scene; other projects keep the standard modal. */
:root[data-scene=liquid] body[data-detail=true] #tech-content,
:root[data-scene=liquid] body[data-detail=true] .site-header,
:root[data-scene=liquid] body[data-detail=true] .world-caption,
:root[data-scene=liquid] body[data-detail=true] .chapter-dots { visibility: hidden; }
:root[data-scene=liquid].scene-ready body[data-detail=true] #project-dialog {
  width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0;
  border: none; box-shadow: none; background: linear-gradient(90deg, transparent 45%, rgb(var(--world-rgb) / .84) 61%, rgb(var(--world-rgb) / .97));
  overflow-y: auto; overflow-x: hidden; animation: none;
}
:root[data-scene=liquid].scene-ready body[data-detail=true] #project-dialog::backdrop { background: rgb(var(--world-rgb) / .06); backdrop-filter: none; }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-header { position: sticky; top: 0; z-index: 2; border: none; padding: 19px var(--cinematic-gutter); background: linear-gradient(rgb(var(--world-rgb) / .82), transparent); font-size: 11px; }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-grid { display: block; }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-visual { display: none; }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-copy { width: 45%; min-height: calc(100dvh - 90px); margin-left: 55%; padding: 9svh var(--cinematic-gutter) 40px 28px; }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-copy h2 { font-size: clamp(39px, 4vw, 61px); }
:root[data-scene=liquid].scene-ready body[data-detail=true] .project-pagination { padding-top: 36px; }

@media (max-width: 1100px) and (min-width: 761px) {
  :root[data-scene=liquid] .header-identity { display: none; }
  :root[data-scene=liquid] .site-header nav { gap: 23px; }
  .exhibit-copy { width: 37%; }
  .exhibit-copy h3 { font-size: 46px; }
  .exhibit-kicker { gap: 5px 13px; }
  .contact-copy { width: 38%; }
  .particle-form-controls { width: 52%; }
  .particle-forms button { padding-inline: 10px; }
  :root[data-scene=liquid] .about-chapter .chapter-copy { max-width: 350px; }
}
@media (max-width: 760px), (max-width: 1000px) and (max-aspect-ratio: 1/1) {
  :root[data-scene=liquid] { --cinematic-gutter: 28px; }
  :root[data-scene=liquid] .site-header { padding: 20px var(--cinematic-gutter); }
  :root[data-scene=liquid] .header-identity { display: none; }
  :root[data-scene=liquid] .site-header nav { gap: 17px; }
  :root[data-scene=liquid] .site-header nav sup { display: none; }
  :root[data-scene=liquid] .world-caption { top: 112px; }
  :root[data-scene=liquid] .home-chapter { height: 120svh; min-height: 820px; }
  .hero-frame { min-height: 700px; }
  :root[data-scene=liquid] .hero-name-block { bottom: 16svh; max-width: calc(100% - 56px); }
  :root[data-scene=liquid] .hero-name-block h1 { font-size: clamp(63px, 13vw, 92px); }
  :root[data-scene=liquid] .hero-name-block > .micro-label { margin-bottom: 17px; }
  :root[data-scene=liquid] .hero-byline { margin-top: 19px; }
  .hero-material-note { display: none; }
  :root[data-scene=liquid] .sculpture-control { top: 42svh; bottom: auto; right: var(--cinematic-gutter); gap: 8px; }
  :root[data-scene=liquid] .sculpture-control button { padding: 9px 12px; }
  :root[data-scene=liquid] .drag-hint { max-width: 180px; white-space: normal; text-align: right; }
  :root[data-scene=liquid] .scroll-invitation { bottom: 9svh; }
  :root[data-scene=liquid] .about-chapter { min-height: 130svh; padding-top: 47svh; padding-bottom: 15svh; }
  :root[data-scene=liquid] .about-chapter .chapter-copy { position: relative; top: auto; max-width: 540px; padding-block: 22px 0; }
  :root[data-scene=liquid] .about-chapter .chapter-copy::before { content: ''; position: absolute; z-index: -1; inset: -35px auto -20px calc(-1 * var(--cinematic-gutter)); width: 100vw; background: linear-gradient(transparent, rgb(var(--world-rgb) / .8) 16%, rgb(var(--world-rgb) / .92)); }
  :root[data-scene=liquid] .about-chapter h2 { font-size: clamp(39px, 7.7vw, 52px); }
  :root[data-scene=liquid] .about-chapter .chapter-label { margin-bottom: 20px; }
  :root[data-scene=liquid] .lead-copy { margin-top: 22px; }
  :root[data-scene=liquid] .perspective-details { margin-top: 23px; flex-direction: row; flex-wrap: wrap; }
  :root[data-scene=liquid] .work-chapter { padding-top: 70px; padding-bottom: 90px; }
  :root[data-scene=liquid] .work-title-row { display: block; }
  :root[data-scene=liquid] .work-title-row h2 { font-size: clamp(40px, 8.5vw, 60px); }
  :root[data-scene=liquid] .work-title-row > p { margin-top: 20px; }
  .cinematic-exhibit { min-height: 160svh; }
  .exhibit-frame { min-height: 700px; }
  .exhibit-stage { inset: 9svh calc(-1 * var(--cinematic-gutter)) auto; height: 39svh; min-height: 230px; }
  .exhibit-copy { top: auto; bottom: 12svh; width: 100%; max-width: 500px; }
  .exhibit-copy::before { inset: -40px auto -25px calc(-1 * var(--cinematic-gutter)); width: 100vw; background: linear-gradient(transparent, rgb(var(--world-rgb) / .82) 15%, rgb(var(--world-rgb) / .9) 85%, transparent); }
  .exhibit-copy h3 { font-size: clamp(39px, 9vw, 54px); }
  .exhibit-kicker { margin-bottom: 17px; }
  .exhibit-question { display: none; }
  .exhibit-description { max-width: 43ch; margin-top: 17px; line-height: 1.65; }
  .exhibit-tags { display: none; }
  .exhibit-state { display: none; }
  .exhibit-open { margin-top: 15px; }
  .exhibit-coordinate { display: none; }
  .archive-projects { margin-top: 30px; }
  .archive-projects > summary { gap: 17px; }
  .archive-count { gap: 12px; }
  :root[data-scene=liquid] .journey-chapter { padding-block: 70px 100px; }
  :root[data-scene=liquid] .contact-chapter { min-height: 150svh; }
  .finale-frame { min-height: 850px; }
  .particle-stage { inset: 6svh calc(-1 * var(--cinematic-gutter)) auto; height: 44svh; min-height: 240px; }
  .contact-copy { top: auto; bottom: 26svh; width: 100%; max-width: none; }
  :root[data-scene=liquid] .contact-copy .chapter-label { display: none; }
  :root[data-scene=liquid] .contact-chapter h2 { font-size: clamp(48px, 10vw, 70px); }
  .finale-byline { font-size: 18px; line-height: 1.35; margin-top: 10px; }
  .finale-byline br { display: none; }
  .finale-byline br::after { content: ' '; }
  :root[data-scene=liquid] .contact-bottom { margin-top: 18px; }
  :root[data-scene=liquid] .contact-bottom p { display: none; }
  :root[data-scene=liquid] .contact-email { font-size: 25px; }
  :root[data-scene=liquid] .contact-links { margin-top: 8px; gap: 6px 23px; }
  .particle-form-controls { right: 0; width: 100%; bottom: 14svh; }
  .aircraft-inspection { right: 0; top: 10svh; width: 100%; }
  .aircraft-inspection button { padding-inline: 10px; }
  .particle-stage-label, .particle-technical { display: none; }
  .particle-forms button { padding-inline: 6px; }
  .particle-hint { margin-top: 6px; }
  .particle-count-desktop { display: none; }
  .particle-count-compact { display: inline; }
  :root[data-scene=liquid] .contact-chapter footer { bottom: 8svh; padding-top: 10px; gap: 12px; font-size: 11px; }
  :root[data-scene=liquid] .contact-chapter footer > span:last-child { display: none; }
  :root[data-scene=liquid].scene-ready body[data-detail=true] #project-dialog { background: linear-gradient(180deg, transparent 15%, rgb(var(--world-rgb) / .1) 31%, rgb(var(--world-rgb) / .97) 47%); }
  :root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-copy { width: 100%; margin-left: 0; margin-top: 35svh; min-height: 60svh; padding: 20px var(--cinematic-gutter) 40px; }
  :root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-header { padding: 14px var(--cinematic-gutter); background: linear-gradient(rgb(var(--world-rgb) / .96), rgb(var(--world-rgb) / .65) 70%, transparent); }
  :root[data-scene=liquid].scene-ready body[data-detail=true] .project-dialog-copy h2 { font-size: 41px; }
}
@media (max-width: 600px) {
  :root[data-scene=liquid] { --cinematic-gutter: 24px; }
  :root[data-scene=liquid] .site-header { padding-block: 19px; gap: 15px; }
  :root[data-scene=liquid] .header-identity { display: block; font-size: 11px; padding-left: 14px; }
  :root[data-scene=liquid] .world-caption { top: 102px; }
  :root[data-scene=liquid] .hero-name-block { bottom: 16svh; }
  :root[data-scene=liquid] .hero-name-block h1 { font-size: clamp(57px, 15vw, 82px); }
  :root[data-scene=liquid] .hero-byline { font-size: 16px; max-width: 270px; line-height: 1.6; }
  :root[data-scene=liquid] .hero-name-block > .micro-label { font-size: 11px; }
  :root[data-scene=liquid] .sculpture-control { top: 42svh; }
  :root[data-scene=liquid] .work-topline { margin-bottom: 27px; gap: 15px; }
  :root[data-scene=liquid] .work-topline .chapter-label { font-size: 11px; }
  .exhibit-copy h3 { max-width: 340px; }
  .exhibit-description { max-width: 37ch; }
  .archive-count { flex-direction: column; gap: 4px; }
  :root[data-scene=liquid] .archive-projects .project-name { font-size: 25px; }
  :root[data-scene=liquid] .work-footer { flex-direction: column; align-items: flex-start; gap: 5px; }
  :root[data-scene=liquid] .journey-intro > p { font-size: 16px; }
  :root[data-scene=liquid] .contact-chapter footer { flex-wrap: nowrap; font-size: 10px; }
  :root[data-scene=liquid] .contact-chapter footer a { max-width: 17ch; text-align: right; }
  :root[data-scene=liquid] .world-controls { right: 18px; bottom: 12px; gap: 14px; }
  :root[data-scene=liquid] .sound-controls { left: 18px; bottom: 12px; gap: 8px; }
  :root[data-scene=liquid] #sound-toggle { padding-inline: 10px; }
  :root[data-scene=liquid] .sound-volume { left: 107px; bottom: 49px; }
  #sound-player-toggle { position: absolute; left: 0; bottom: 48px; min-height: 36px; }
  #sound-player-panel { bottom: 93px; width: min(355px, calc(100vw - 36px)); }
  :root[data-scene=liquid] .chapter-dots { right: 3px; }
}
@media (max-height: 700px) and (min-width: 761px) {
  .hero-frame, .exhibit-frame, .finale-frame { min-height: 620px; }
  :root[data-scene=liquid] .hero-name-block { bottom: 20svh; }
  :root[data-scene=liquid] .hero-name-block h1 { font-size: 73px; }
  :root[data-scene=liquid] .hero-material-note { display: none; }
  .exhibit-copy { top: 22svh; }
  .exhibit-copy h3 { font-size: 43px; }
  .exhibit-kicker { margin-bottom: 15px; }
  .exhibit-question { font-size: 17px; margin-top: 17px; }
  .exhibit-description { line-height: 1.6; margin-top: 13px; }
  .exhibit-tags, .exhibit-state { display: none; }
  .exhibit-open { margin-top: 13px; }
  .contact-copy { top: 23svh; }
  :root[data-scene=liquid] .contact-chapter h2 { font-size: 65px; }
  .finale-byline { font-size: 20px; margin-top: 14px; }
  :root[data-scene=liquid] .contact-bottom { margin-top: 20px; }
  .particle-form-controls { bottom: 17svh; }
}
@media (max-width: 360px) {
  .aircraft-inspection, .aircraft-view-buttons { gap: 4px; }
  .aircraft-inspection button { padding-inline: 8px; }
  :root[data-scene=liquid] .header-identity { font-size: 10px; }
  :root[data-scene=liquid] .sound-controls { bottom: 58px; }
  :root[data-scene=liquid] .world-controls::before { height: 112px; }
  :root[data-scene=liquid] .scroll-invitation { bottom: 17svh; }
  :root[data-scene=liquid] .hero-name-block { bottom: 24svh; }
  .exhibit-copy { bottom: 20svh; }
  .particle-forms button { padding-inline: 7px; }
  /* Stack the short contact copy and sculpture controls together. Independent
     bottom offsets inside the 850px frame collided with the fixed sound rows. */
  :root[data-scene=liquid] .finale-frame { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 12px; padding-top: 42svh; }
  :root[data-scene=liquid] .contact-copy { position: relative; top: auto; bottom: auto; grid-row: 1; min-width: 0; }
  :root[data-scene=liquid] .contact-chapter h2 { font-size: 44px; }
  :root[data-scene=liquid] .finale-byline { font-size: 16px; margin-top: 8px; }
  :root[data-scene=liquid] .contact-bottom { margin-top: 12px; }
  :root[data-scene=liquid] .contact-email { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; font-size: 22px; margin-bottom: 4px; }
  :root[data-scene=liquid] .contact-email span { margin-left: 0; }
  :root[data-scene=liquid] #copy-email { padding-block: 8px; }
  :root[data-scene=liquid] .contact-links { margin-top: 4px; gap: 4px 12px; }
  :root[data-scene=liquid] .contact-links a { white-space: nowrap; }
  :root[data-scene=liquid] .particle-form-controls { position: relative; inset: auto; grid-row: 2; align-self: start; }
  :root[data-scene=liquid] .particle-hint { line-height: 1.5; }
  :root[data-scene=liquid] body[data-chapter=contact] #sound-player-toggle { position: static; min-height: 44px; }
  :root[data-scene=liquid] body[data-chapter=contact] .sound-volume { left: 0; bottom: -46px; padding: 0; border: 0; background: transparent; }
}
:root[data-scene=orbital] .exhibit-fallback,
:root[data-scene=orbital] .particle-fallback,
:root[data-scene=liquid].scene-unavailable .exhibit-fallback,
:root[data-scene=liquid].scene-error .exhibit-fallback,
:root[data-scene=liquid].scene-unavailable .particle-fallback,
:root[data-scene=liquid].scene-error .particle-fallback { display: block; }
:root[data-scene=orbital] .particle-form-controls,
:root[data-scene=liquid].scene-unavailable .particle-form-controls,
:root[data-scene=liquid].scene-error .particle-form-controls { display: none; }
@media (prefers-reduced-motion: reduce) {
  .exhibit-open span, .particle-forms button, .archive-count .details-plus { transition: none; }
}
@media print {
  .exhibit-stage, .exhibit-coordinate, .particle-stage, .particle-form-controls, .hero-material-note { display: none; }
  .hero-frame, .exhibit-frame, .finale-frame { position: static; height: auto; min-height: 0; }
  .cinematic-exhibit { min-height: 0; padding: 35px 0; break-inside: avoid; }
  .exhibit-copy, .contact-copy { position: static; width: 100%; max-width: none; }
  .exhibit-copy::before { display: none; }
  .exhibit-description, .exhibit-state, .exhibit-kicker { color: #333; }
  :root[data-scene=liquid] .about-chapter .chapter-copy { position: static; max-width: none; }
  :root[data-scene=liquid] .contact-chapter footer { position: static; margin-top: 35px; }
}

/* The close study resolves into the reading composition; scrolling skips it. */
:root[data-scene=liquid].scene-ready .hero-name-block,
:root[data-scene=liquid].scene-ready .sculpture-control,
:root[data-scene=liquid].scene-ready .scroll-invitation { opacity: var(--intro-copy, 1); }
:root[data-scene=liquid] body[data-intro=revealing] .hero-name-block { transform: translateY(calc((1 - var(--intro-copy, 1)) * 16px)); }
:root[data-scene=liquid] .hero-name-block:focus-within,
:root[data-scene=liquid] .sculpture-control:focus-within,
:root[data-scene=liquid] .scroll-invitation:focus { opacity: 1; }
:root[data-scene=liquid][data-theme=night] { --world-rgb: 8 13 16; --chapter-rgb: 16 24 25; --muted: #aebeb9; --accent: #97d9ba; }
@media (prefers-reduced-motion: reduce) {
  :root[data-scene=liquid].scene-ready .hero-name-block,
  :root[data-scene=liquid].scene-ready .sculpture-control,
  :root[data-scene=liquid].scene-ready .scroll-invitation { opacity: 1; transform: none; }
}

@media (max-width: 760px), (max-width: 1000px) and (max-aspect-ratio: 1/1) {
  :root[data-scene=liquid] .hero-name-block { top: 60svh; bottom: auto; }
  :root[data-scene=liquid] .hero-name-block h1 { font-size: clamp(57px, 11vw, 82px); }
  :root[data-scene=liquid] .sculpture-control { top: 52svh; left: var(--cinematic-gutter); right: var(--cinematic-gutter); flex-direction: row; align-items: center; justify-content: space-between; }
  :root[data-scene=liquid] .drag-hint { max-width: 145px; }
  :root[data-scene=liquid] .scroll-invitation { left: auto; right: var(--cinematic-gutter); }
  .contact-copy::before { inset: -45px auto -40px calc(-1 * var(--cinematic-gutter)); width: 100vw; }
}
@media (max-width: 760px), (max-width: 1000px) and (max-aspect-ratio: 1/1) {
  /* The full navigation remains in the header/menu; tiny edge dots conflict
     with touch scrolling and persistent browser scrollbars on narrow views. */
  :root[data-scene=liquid] .chapter-dots { display: none; }
}

@media (max-width: 760px), (max-width: 1000px) and (max-aspect-ratio: 1/1) {
  .particle-forms { flex-wrap: nowrap; gap: 4px; }
  .particle-forms button { padding-inline: 4px; white-space: normal; line-height: 1.4; }
}

/* The transformation has a clear screen of its own, before the contact UI. */
.emergence-chapter { pointer-events: none; position: relative; height: 190svh; min-height: 1100px; color: #edf2ec; }
.emergence-frame { position: sticky; top: 0; height: 100svh; min-height: 650px; }
.emergence-title { position: absolute; left: var(--cinematic-gutter); bottom: 16svh; opacity: var(--emergence-copy, 0); pointer-events: none; }
.emergence-title .micro-label { color: #9de1bb; font: 11px/1.7 var(--mono); margin-bottom: 18px; letter-spacing: .04em; }
:root[data-scene=liquid] .emergence-title h2 { font: 500 clamp(25px,3.15vw,46px)/1.03 var(--display); letter-spacing: -.045em; }
.emergence-cue { position: absolute; bottom: 10svh; right: var(--cinematic-gutter); display: flex; align-items: center; gap: 18px; font: 11px/1.7 var(--mono); color: #aebeb9; opacity: var(--emergence-copy, 0); }
.emergence-track { width: 100px; height: 1px; background: #a8e7c82c; }
.emergence-track i { display: block; width: 100%; height: 100%; background: #9de1bb; transform: scaleX(var(--emergence-progress, 0)); transform-origin: left; }
.emergence-skip { pointer-events: auto; position: absolute; right: var(--cinematic-gutter); top: 14svh; font: 11px/1.7 var(--mono); color: #aebeb9; padding: 12px 0; opacity: var(--emergence-copy, 0); }
.emergence-skip:focus-visible { opacity: 1; }
.replay-emergence { display: inline-block; color: var(--accent); margin-left: 10px; text-underline-offset: 4px; text-decoration: underline; text-decoration-color: var(--line); }
:root[data-scene=orbital] .emergence-chapter,
:root.scene-unavailable .emergence-chapter,
:root.scene-error .emergence-chapter { display: none; }
@media (max-width:760px), (max-width:1000px) and (max-aspect-ratio:1/1) {
  .emergence-chapter { height: 170svh; }
  .emergence-title { bottom: 22svh; }
  :root[data-scene=liquid] .emergence-title h2 { font-size: clamp(27px,6vw,40px); }
  .emergence-cue { bottom: 14svh; left: var(--cinematic-gutter); right: auto; }
  .emergence-skip { top: 14svh; }
}
@media print { .emergence-chapter { display: none; } }

/* Readiness follows real preparation milestones, with no artificial delay. */
.scene-loader[hidden] { display: none; }
.scene-loader { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; overflow: auto; padding: 32px 24px; background: #080d10; color: #edf2ec; }
.scene-loader-card { width: min(100%, 420px); padding: 20px 0; }
.scene-loader .micro-label { color: #97d9ba; letter-spacing: .14em; }
.scene-loader-mark { color: #97d9ba; font: 72px/1 var(--display); margin: 28px 0; }
.scene-loader h2 { font: 500 clamp(44px, 10vw, 64px)/1.02 var(--display); letter-spacing: -.055em; }
.scene-loader p { font: 15px/1.7 var(--display); color: #aebeb9; margin: 22px 0; max-width: 330px; }
.scene-loader progress { display: block; width: 100%; height: 3px; border: 0; background: #263634; accent-color: #97d9ba; }
.scene-loader progress::-webkit-progress-bar { background: #263634; }
.scene-loader progress::-webkit-progress-value { background: #97d9ba; }
.scene-loader progress::-moz-progress-bar { background: #97d9ba; }
.scene-loader #scene-load-step { font: 12px/1.6 var(--mono); min-height: 20px; }
.scene-loader a, .scene-loader button { display: inline-flex; align-items: center; min-height: 44px; font: 12px/1.6 var(--mono); color: #edf2ec; text-decoration: underline; text-underline-offset: 6px; }
.scene-loader button { margin-right: 20px; }
.scene-loader button[hidden], .scene-status button[hidden] { display: none; }
.scene-status button { pointer-events: auto; min-height: 44px; font: inherit; color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.scene-loading .world canvas { visibility: hidden; }
:root.scene-unavailable .scene-status { display: flex; left: var(--cinematic-gutter, 24px); right: var(--cinematic-gutter, 24px); top: 105px; justify-content: flex-end; font-size: 11px; }
:root.scene-unavailable .world-caption { visibility: hidden; }
@media print { .scene-loader { display: none; } }