/* Directed depth. Content and navigation remain fully visible without enhancement. */
.opening-identity,.connecting-thread,.original-feature,.systems-section{isolation:isolate}
.connecting-thread,.original-feature,.systems-section{position:relative}
.opening-identity::before,.connecting-thread::before,.original-feature::before,.systems-section::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:0}
.opening-identity::before{z-index:0;background:radial-gradient(ellipse at 80% 25%,#e8edc72b,transparent 65%);mix-blend-mode:screen}
.opening-identity h1,.opening-identity .opening-kicker{z-index:1}
.connecting-thread::before{background:linear-gradient(115deg,#61773530,transparent 65%)}
.original-feature::before{inset:8% -2%;background:radial-gradient(ellipse at 35% 50%,#86995a17,transparent 65%)}
.systems-section::before{background:radial-gradient(ellipse at 85% 25%,#30596e36,transparent 65%)}

.depth-ready .opening-portrait{transform:translate3d(0,var(--portrait-y,0px),0) scale(1.08);transform-origin:60% 35%}
.depth-ready .opening-identity h1{transform:translate3d(0,var(--name-y,0px),0)}
.depth-ready .opening-identity::before{opacity:var(--light,.3)}
.depth-ready .world-door{transform:translate3d(0,var(--door-y,0px),0)}
.depth-ready .world-photo{transform:translate3d(0,var(--photo-y,0px),0) scale(1.08);transition:filter .4s}
.depth-ready .world-door:hover .world-photo{filter:saturate(1.1) brightness(1.08)}

/* Short photographic holds give the next chapter a foreground edge. */
.depth-ready .music-photo{transform:translate3d(0,var(--photo-y,0px),0) scale(1.13)}
.depth-ready .music-opening-copy{transform:translate3d(0,var(--copy-y,0px),0)}
.depth-ready .music-work{position:relative;z-index:1;margin-top:-42px;padding-top:52px;background:var(--ink,#10120f);box-shadow:0 -30px 50px #10120f80}
.live-panorama{overflow:visible;isolation:auto;height:120svh;min-height:880px;max-height:none}
.live-frame{position:sticky;top:64px;height:calc(100svh - 64px);min-height:680px;overflow:hidden;isolation:isolate;background:#10120f}
.live-frame .live-landscape{inset:-7% 0;height:114%;transform:scale(1.06)}
.depth-ready .live-frame{clip-path:inset(0 var(--frame-inset,0%) 0)}
.depth-ready .live-frame .live-landscape{transform:translate3d(0,var(--photo-y,0px),0) scale(var(--photo-scale,1.08))}
.depth-ready .live-opening{transform:translate3d(0,var(--copy-y,0px),0)}
.depth-ready .live-atmosphere{opacity:var(--atmosphere,1)}
.live-credit-grid{margin-top:-42px}
.depth-ready .connecting-thread::before,.depth-ready .original-feature::before,.depth-ready .systems-section::before{opacity:var(--light,0)}
.depth-ready .original-art{transform:translate3d(0,var(--art-y,0px),0);clip-path:inset(0 var(--art-inset,0%) 0 0);transition:border-color .25s,box-shadow .25s}
.depth-ready .original-copy{transform:translate3d(0,var(--copy-y,0px),0)}
.depth-ready .original-art:focus-visible{clip-path:none}
.depth-ready .systems-board{transform:translate3d(0,var(--board-y,0px),0)}
.depth-ready .system-product{transform:translate3d(0,var(--product-y,0px),0)}
.systems-board .system-product{background-color:inherit}

/* The approved dotless symbol completes WHAT. WOW. as the chapter enters. */
.thread-signature{display:flex;align-items:center;gap:20px}
.thread-symbol{display:block;position:relative;padding-bottom:17px}
.thread-symbol img{display:block;width:100%;height:auto}
.thread-symbol-dot{position:absolute;bottom:0;width:16%;aspect-ratio:1;border-radius:50%;background:var(--lime);opacity:0}
.thread-symbol-dot:first-of-type{left:21%}.thread-symbol-dot:last-of-type{left:73%}
.thread-wordmark{font:800 36px/.92 var(--display);letter-spacing:-.015em;white-space:nowrap;color:var(--cream)}
.thread-period{color:var(--lime);display:inline-block}
.bw-thread-heading{flex-wrap:wrap;column-gap:28px;row-gap:18px}
.bw-thread-heading .eyebrow{max-width:150px}
.depth-ready .thread-symbol-dot{opacity:var(--symbol-dots,0)}
.depth-ready .thread-period{opacity:var(--word-dots,1);transform:translate3d(0,var(--period-y,0px),0)}
.depth-ready .thread-skills>div{transform:translate3d(0,var(--skill-y,0px),0)}
.depth-ready .thread-skills>div::before{content:"";position:absolute;top:-1px;left:0;width:100%;height:1px;background:var(--lime);transform:scaleX(var(--connection,1));transform-origin:left;opacity:.65}

.credit-dialog .credit-flight{position:fixed;z-index:10;margin:0;pointer-events:none;max-width:none;object-fit:contain;background:#111410;transform-origin:0 0;border:0}
.credit-dialog[data-in-flight] .dialog-copy{position:relative}

@media(max-width:760px){
 .live-panorama{height:112svh;min-height:780px}
 .live-frame{top:66px;height:calc(100svh - 66px);min-height:620px}
 .live-credit-grid{margin-top:-22px}
 .depth-ready .music-work{margin-top:-24px;padding-top:34px}
 .thread-signature{gap:16px}.thread-wordmark{font-size:31px}
 .thread-symbol{padding-bottom:12px}
 .bw-thread-heading{column-gap:22px}.bw-thread-heading .eyebrow{max-width:116px}
}
@media(max-width:360px){.topbar .nav{gap:9px}.topbar .nav>a[href="/contact"]{display:none}}
/* A pause is a composed still, including any transition already in progress. */
.paused .live-panorama,.reduced .live-panorama{height:auto;min-height:0}
.paused .live-frame,.reduced .live-frame{position:relative;top:0;clip-path:none}
:is(.paused,.reduced) :is(.opening-portrait,.opening-identity h1,.world-door,.world-photo,.music-photo,.music-opening-copy,.live-landscape,.live-opening,.original-art,.original-copy,.systems-board,.system-product,.thread-skills>div,.thread-period){transform:none!important;clip-path:none!important;transition:none!important}
:is(.paused,.reduced) .thread-symbol-dot{opacity:0!important}
:is(.paused,.reduced) .thread-period{opacity:1!important}
:is(.paused,.reduced) .live-atmosphere{opacity:1!important}
:is(.paused,.reduced) .thread-skills>div::before{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){
 .live-panorama{height:auto;min-height:0}.live-frame{position:relative;top:0;clip-path:none}
 .depth-ready :is(.opening-portrait,.opening-identity h1,.world-door,.world-photo,.music-photo,.music-opening-copy,.live-landscape,.live-opening,.original-art,.original-copy,.systems-board,.system-product,.thread-skills>div,.thread-period){transform:none!important;clip-path:none!important;transition:none!important}
 .depth-ready .thread-symbol-dot{opacity:0!important}.depth-ready .thread-period{opacity:1!important}
}
@media print{.live-panorama,.live-frame{height:auto;min-height:0;position:relative;top:0;clip-path:none}.thread-signature{display:none}.depth-ready *{transform:none!important;clip-path:none!important}}
