@font-face { font-family:ZaowuSans; src:url('/assets/shared/819685cb0ffe513874bd755f/vendor/zaowu-sans.woff2') format('woff2'); font-weight:400 800; font-display:swap; }
/* Engineering edition. Appended rules below retain the existing scene choreography. */
/* Integrated narrative: no ordinary content tail after the sticky stage. */
.ex-integrated .ex-chapter-0 { width:88%; max-width:none; }
.ex-opening-primary { width:43vw; max-width:650px; opacity:var(--opening-primary,1); }
.ex-opening-detail { position:absolute; left:53vw; top:0; width:39vw; max-width:650px; opacity:var(--opening-detail,0); }
.ex-opening-detail h2 { font-size:clamp(36px,4.6vw,72px); }
.ex-integrated[data-chapter="0"] .ex-assembly-labels { opacity:var(--opening-detail,0); }
.ex-integrated .ex-content-panel,.ex-integrated .ex-gallery-panel,.ex-integrated .ex-closing { top:50%; margin-top:0; width:40%; max-width:620px; translate:0 -50%; }
.ex-integrated .ex-content-right { left:auto; right:6%; }
.ex-integrated .ex-content-left { left:6%; right:auto; }
.ex-integrated .ex-content-panel h2 { font-size:clamp(30px,3.5vw,54px); line-height:1.24; }
.ex-integrated .ex-overline { margin-bottom:18px; }
.ex-project-subtitle { font-size:16px; margin:12px 0; color:#829da7; }
.ex-content-tags { display:flex; gap:8px; flex-wrap:wrap; font-size:10px; }
.ex-content-tags span { border:1px solid #879ca544; padding:5px 9px; border-radius:20px; }
.ex-integrated .ex-content-panel .ex-lead { margin-top:18px; font-size:14px; }
.ex-project-facts { margin-top:20px; display:grid; gap:16px; font-size:12px; line-height:1.85; }
.ex-project-facts div { padding-left:14px; border-left:1px solid #879ca55c; }
.ex-project-facts dt { color:#8aa4ad; font-size:10px; letter-spacing:.12em; margin-bottom:4px; }
.ex-project-facts dd { margin:0; opacity:.88; }
.ex-integrated .ex-content-panel .ex-cta { margin-top:20px; }
.ex-scene-position { margin-top:18px; font-size:10px; color:#81969e; }
.ex-scene-position span { display:block; margin-top:6px; opacity:.75; }
.ex-integrated .ex-gallery-panel h2 { font-size:clamp(30px,3.6vw,54px); }
.ex-gallery-index { display:grid; margin-top:20px; }
.ex-gallery-entry { display:flex; align-items:center; gap:16px; border-top:1px solid #94a6b33b; padding:11px 0; }
.ex-gallery-entry>span { font-size:10px; color:#91adba; }
.ex-gallery-entry div { flex:1; }
.ex-gallery-entry strong { display:block; font-size:14px; font-weight:500; }
.ex-gallery-entry small { display:block; font-size:10px; opacity:.65; margin-top:3px; }
.ex-gallery-entry b { font-weight:400; transition:translate .2s; }
.ex-gallery-entry:hover b { translate:3px -3px; }
.ex-integrated .ex-gallery-panel .ex-text-link { color:inherit; background:none; border:0; border-bottom:1px solid #879ca5; cursor:pointer; padding:0 0 5px; }
.ex-integrated .ex-concept-note { font-size:9px; margin:14px 0 0; }
.ex-integrated .ex-closing .ex-about { display:block; padding:0; margin:0; max-width:none; min-height:0; background:none; }
.ex-integrated .ex-closing .ex-about:before,.ex-integrated .ex-closing .ex-about:after,.ex-integrated .ex-closing .ex-footer:before,.ex-integrated .ex-closing .ex-footer:after { display:none; }
.ex-integrated .ex-closing .ex-about h2 { font-size:clamp(30px,3.4vw,50px); }
.ex-integrated .ex-closing .ex-about p:not(.ex-overline) { font-size:13px; line-height:1.9; margin-top:16px; }
.ex-integrated .ex-closing .ex-blueprint { display:none; }
.ex-integrated .ex-closing .ex-signature { margin-top:20px; }
.ex-integrated .ex-closing .ex-footer { padding:20px 0 0; margin-top:22px; min-height:0; display:block; background:none; border-top:1px solid #879ca555; color:inherit; }
.ex-integrated .ex-closing .ex-footer>div { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:10px; font-size:10px; }
.ex-integrated .ex-closing .ex-footer strong { font-size:14px; }
.ex-integrated .ex-closing .ex-footer small { width:100%; opacity:.55; }
.ex-integrated .ex-explore-overlay { position:absolute; inset:92px 5% 64px; z-index:8; padding:24px; margin:0; max-width:none; background:#12202cf5; color:#ecf1ef; border:1px solid #8da1ad55; border-radius:24px; display:block; }
.ex-integrated .ex-explore-overlay .ex-workshop-copy { display:none; }
.ex-integrated .ex-explore-overlay .ex-viewer { height:100%; min-height:0; width:100%; }
.ex-integrated.ex-exploring .ex-chapter { visibility:hidden; }
@media(max-width:759px) {
 .ex-integrated .ex-chapter-0 { width:auto; }
 .ex-integrated .ex-opening-primary,.ex-integrated .ex-opening-detail { left:0; width:100%; max-width:none; }
 .ex-integrated .ex-opening-detail h2 { font-size:clamp(35px,9.5vw,48px); }
 .ex-integrated .ex-content-panel,.ex-integrated .ex-gallery-panel,.ex-integrated .ex-closing { left:6%; right:6%; width:auto; max-width:none; top:43%; translate:0 0; margin:0; max-height:calc(57svh - 64px); overflow:auto; padding:12px 0 22px; scrollbar-width:thin; }
 .ex-integrated .ex-content-panel h2,.ex-integrated .ex-gallery-panel h2,.ex-integrated .ex-closing .ex-about h2 { font-size:26px; }
 .ex-integrated .ex-content-panel .ex-overline,.ex-integrated .ex-gallery-panel .ex-overline { margin-bottom:9px; font-size:9px; }
 .ex-integrated .ex-content-panel .ex-lead { margin-top:12px; font-size:12px; line-height:1.7; }
 .ex-integrated .ex-project-facts { font-size:11px; gap:10px; margin-top:12px; }
 .ex-integrated .ex-project-subtitle { font-size:12px; margin:8px 0; }
 .ex-integrated .ex-content-panel .ex-cta { margin-top:12px; padding:9px 16px; }
 .ex-integrated .ex-scene-position { display:none; }
 .ex-integrated .ex-gallery-index { margin-top:12px; grid-template-columns:1fr 1fr; gap:0 14px; }
 .ex-integrated .ex-gallery-entry { gap:8px; padding:9px 0; }
 .ex-integrated .ex-gallery-entry strong { font-size:11px; }
 .ex-integrated .ex-gallery-entry small { font-size:9px; }
 .ex-integrated .ex-closing .ex-about p:not(.ex-overline) { font-size:11px; margin-top:10px; }
 .ex-integrated .ex-explore-overlay { inset:82px 3% 58px; padding:8px; }
 .ex-integrated .ex-bottom { bottom:14px; }
 .ex-integrated:not([data-beat="0"]) .ex-canvas-wrap { top:0; bottom:auto; height:43%; }
 .ex-integrated:not([data-beat="0"]) .ex-canvas { height:100%; }
}
@media(min-width:760px) and (max-height:800px) {
 .ex-integrated .ex-content-panel,.ex-integrated .ex-gallery-panel,.ex-integrated .ex-closing { max-height:calc(100svh - 170px); overflow:auto; scrollbar-width:thin; }
}
.ex { --ex-ink:#252b30; --ex-soft:#747c81; --ex-paper:#f2f2ed; --ex-dark:0; background:var(--ex-paper); color:var(--ex-ink); font-family:ZaowuSans,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
.ex a:focus-visible,.ex button:focus-visible,.ex canvas:focus-visible,.ex input:focus-visible { outline:2px solid #789eac; outline-offset:6px; }
.ex button { font:inherit; }
.ex [hidden] { display:none!important; }
.ex-header { position:fixed; z-index:20; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; padding:28px 5%; pointer-events:none; color:#313b40; transition:color .5s; }
.ex-header>* { pointer-events:auto; }
.ex-brand { display:flex; gap:12px; align-items:center; font-size:18px; font-weight:600; letter-spacing:.1em; }
.ex-brand small { display:block; font-family:Georgia,serif; font-size:11px; font-weight:400; letter-spacing:.03em; margin-top:2px; }
.ex-monogram { border:1px solid currentColor; display:grid; place-items:center; width:37px; height:37px; font-size:20px; border-radius:50%; }
.ex-header nav { display:flex; align-items:center; gap:28px; font-size:12px; }
.ex-header button { border:1px solid #6e7a8166; color:inherit; background:#ecefe955; padding:6px 12px; border-radius:20px; font-size:11px; }
.ex-back { opacity:.65; }
.ex-story { height:420svh; position:relative; }
.ex-stage { height:100svh; position:sticky; top:0; overflow:hidden; isolation:isolate; background:#f2f2ed; }
.ex-light { position:absolute; inset:0; z-index:-2; background:radial-gradient(ellipse at 64% 50%,#c4d3d447,transparent 60%),linear-gradient(130deg,#f8f7f1,#e6e9e7); }
.ex-light:after { content:''; position:absolute; inset:0; opacity:var(--ex-dark); background:radial-gradient(ellipse at 67% 46%,#334b59,#101b25 75%); }
.ex-canvas-wrap { position:absolute; inset:0; z-index:-1; }
.ex-welding-trail { position:fixed; inset:0; width:100%; height:100%; z-index:15; pointer-events:none; }
.ex-welding-trail[hidden] { display:none; }
.ex-integrated.ex-welding-cursor,.ex-integrated.ex-welding-cursor * { cursor:none!important; }
.ex-weld-cursor { position:fixed; z-index:25; width:40px; height:40px; translate:-50% -50%; color:#a5e4f2; pointer-events:none; }
.ex-weld-cursor svg { display:block; width:100%; height:100%; overflow:visible; filter:drop-shadow(0 0 3px #15323c); }
.ex-weld-cursor path { fill:none; stroke:currentColor; stroke-width:1.1; }
.ex-weld-cursor circle { fill:currentColor; }
.ex-integrated[data-theme="light"] .ex-weld-cursor { color:#215870; }
.ex-weld-cursor.ex-weld-cursor-link { color:#e4bd77; }
.ex-integrated[data-theme="light"] .ex-weld-cursor.ex-weld-cursor-link { color:#856021; }
.ex-weld-cursor[hidden] { display:none; }
.ex-atmosphere i { animation:ex-soft-drift 22s ease-in-out infinite alternate; }
.ex-atmosphere i:nth-child(2) { animation-duration:29s; animation-delay:-8s; }
.ex-atmosphere i:nth-child(3) { animation-duration:34s; animation-delay:-17s; }
.ex-ambient-still .ex-atmosphere i { animation-play-state:paused; }
@keyframes ex-soft-drift { from { translate:-12px -8px; opacity:.65; } to { translate:18px 12px; opacity:1; } }
@media(prefers-reduced-motion:reduce) { .ex-atmosphere i { animation:none; } .ex-welding-trail { display:none; } }
@media(hover:none),(pointer:coarse),(max-width:759px) { .ex-welding-trail { display:none; } }
.ex-canvas { width:100%; height:100%; display:block; opacity:0; transition:opacity .75s ease; }
.ex-webgl-ready .ex-canvas { opacity:1; }
.ex-canvas-wrap:before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 68% 50%,#9ebec438,transparent 36%); opacity:1; transition:opacity .75s ease; pointer-events:none; }
.ex-webgl-ready .ex-canvas-wrap:before { opacity:0; }
.ex-static-sculpture { position:absolute; inset:0; display:none; align-items:center; justify-content:center; gap:0; transform:translateX(18%); }
.ex[data-webgl="fallback"] .ex-static-sculpture { display:flex; }
.ex-static-sculpture i { display:block; width:160px; height:190px; border:22px solid #b2c1c6; border-radius:45px; transform:rotate(-25deg); box-shadow:inset 5px 5px 10px #fff7,8px 13px 18px #8a9a9930; }
.ex-static-sculpture i:nth-child(2) { margin-left:-80px; transform:rotate(18deg); border-color:#e9e8e0; }
.ex-static-sculpture i:nth-child(3) { margin-left:-80px; transform:rotate(55deg); border-color:#677c88; }
.ex-webgl-ready .ex-static-sculpture { display:none; }
@media(prefers-reduced-motion:reduce) { .ex-canvas,.ex-canvas-wrap:before { transition:none; } }
.ex-paused .ex-canvas,.ex-paused .ex-canvas-wrap:before { transition:none; }
.ex-chapter { position:absolute; top:50%; left:6%; width:43%; max-width:650px; transform:translateY(0); margin-top:-200px; opacity:0; pointer-events:none; }
.ex-chapter-0 { opacity:1; pointer-events:auto; }
.ex-chapter-1,.ex-chapter-3 { left:auto; right:6%; width:39%; }
.ex-overline { font-size:11px; letter-spacing:.2em; margin-bottom:28px; font-weight:500; color:#78858b; }
.ex-overline i { display:inline-block; width:6px; height:6px; background:#738f99; border-radius:50%; margin-right:9px; }
.ex-chapter h1,.ex-chapter h2 { font-size:clamp(42px,5.4vw,86px); font-weight:550; line-height:1.2; letter-spacing:-.055em; }
.ex-chapter h1 span,.ex-chapter h2 span { color:#738f99; }
.ex-chapter-1 h2,.ex-chapter-3 h2 { font-size:clamp(36px,4.6vw,72px); }
.ex-lead { font-size:15px; line-height:2; color:#69777e; margin-top:28px; letter-spacing:.02em; }
.ex-cta { display:inline-flex; align-items:center; gap:35px; background:#273c45; color:#f8f8ee; padding:13px 20px; border:0; border-radius:28px; margin-top:30px; font-size:12px; transition:transform .25s,background .25s; }
.ex-cta:hover { background:#405b66; transform:translateY(-3px); }
.ex-cta span { font-size:19px; }
.ex-scroll-cue { display:flex; align-items:center; gap:12px; margin-top:45px; color:#78858b; font-size:10px; }
.ex-scroll-cue>span { display:block; width:18px; height:27px; border:1px solid #8d9a9e; border-radius:15px; position:relative; }
.ex-scroll-cue>span:after { content:''; position:absolute; width:2px; height:5px; left:7px; top:6px; background:#87969c; animation:ex-scroll 2s ease infinite; }
.ex-text-link { display:inline-block; margin-top:26px; font-size:12px; border-bottom:1px solid #869ba6; padding-bottom:5px; }
.ex-bottom { position:absolute; bottom:27px; left:5%; right:5%; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; font-size:9px; color:#7e8a90; letter-spacing:.04em; }
.ex-render-note { position:absolute; left:0; bottom:20px; opacity:.75; }
.ex-robot-status { position:absolute; z-index:4; left:73%; top:48%; transform:translate(-50%,-50%); max-width:280px; padding:20px; color:#d4e7ef; background:#152f3c; border:1px solid #759eaf; text-align:center; font-size:12px; line-height:1.8; }
.ex-robot-status[hidden] { display:none; }
.ex-robot-status button { display:block; margin:12px auto 0; padding:7px 12px; border:1px solid #759eaf; background:transparent; color:inherit; cursor:pointer; font:inherit; }
.ex-robot-status button[hidden] { display:none; }
@media(max-width:759px) { .ex-robot-status { left:50%; top:70%; width:230px; } }
.ex-chapter-progress { display:flex; align-items:center; gap:15px; }
.ex-chapter-progress i { --progress:0; display:block; height:2px; width:90px; background:#8c9ca733; position:relative; }
.ex-chapter-progress i:after { content:''; display:block; height:100%; width:100%; background:#748f9c; transform:scaleX(var(--progress)); transform-origin:left; }
.ex-dark-stage { color:#f1f3ed; }
.ex-dark-stage .ex-lead { color:#b6c6ce; }
.ex-dark-stage .ex-overline,.ex-dark-stage .ex-bottom { color:#9ab0bd; }
.ex-dark-stage h2 span { color:#a3bdc5; }
.ex-dark .ex-header { color:#e7efe9; }
.ex-projects { padding:110px 6% 100px; max-width:1720px; margin:auto; }
.ex-section-top { display:grid; grid-template-columns:1fr 2fr 1fr; gap:25px; align-items:end; margin-bottom:80px; }
.ex-section-top>span { align-self:start; font-size:11px; color:#879198; letter-spacing:.14em; padding-top:12px; }
.ex-section-top h2 { font-size:clamp(36px,4.4vw,68px); line-height:1.25; letter-spacing:-.05em; font-weight:500; }
.ex-section-top h2 em { font-style:normal; color:#81949d; }
.ex-section-top>p { font-size:12px; color:#7e898f; line-height:2; }
.ex-project-columns { display:grid; grid-template-columns:1fr 1fr; gap:8%; }
.ex-project-columns>section>header { display:flex; flex-wrap:wrap; align-items:center; gap:16px; padding-bottom:30px; }
.ex-project-columns>section>header>span { font-family:Georgia,serif; font-size:16px; color:#92a1a7; }
.ex-project-columns>section>header h2 { font-size:24px; font-weight:500; letter-spacing:-.04em; }
.ex-project-columns>section>header p { flex-basis:100%; font-size:11px; color:#879197; padding-left:35px; }
.ex-project-row { border-top:1px solid #d2d9d7; padding:28px 0; display:grid; grid-template-columns:27px 1fr 30px; gap:18px; align-items:start; transition:padding .3s,color .3s; }
.ex-project-row:hover { padding-left:12px; color:#486879; }
.ex-project-number { font-size:10px; color:#9ca6a9; padding-top:6px; }
.ex-project-type { font-size:10px; color:#8c969b; }
.ex-project-row h3 { font-size:23px; font-weight:500; letter-spacing:-.03em; margin:9px 0 12px; }
.ex-project-row p { font-size:12px; line-height:1.95; color:#829097; max-width:410px; }
.ex-project-arrow { font-size:25px; color:#748b96; transition:transform .3s; }
.ex-project-row:hover .ex-project-arrow { transform:translate(4px,-4px); }
.ex-workshop { background:#192831; color:#e8eeeb; padding:100px 6%; display:grid; grid-template-columns:1fr 1.45fr; gap:6%; align-items:center; }
.ex-workshop-copy h2 { font-size:clamp(36px,4.4vw,64px); font-weight:500; line-height:1.35; letter-spacing:-.05em; }
.ex-workshop-copy h2 span { color:#9bb8c2; }
.ex-workshop-copy>p:not(.ex-overline) { margin-top:28px; font-size:13px; line-height:2; color:#9fb5bf; }
.ex-workshop-copy small { display:block; color:#758f9d; font-size:10px; line-height:1.9; margin-top:27px; }
.ex-viewer { height:500px; position:relative; border:1px solid #67879855; border-radius:20px; background:radial-gradient(ellipse at 50% 50%,#435b67,#253b49 70%); overflow:hidden; }
.ex-viewer-canvas { width:100%; height:100%; display:block; }
.ex-viewer-poster { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; background:radial-gradient(ellipse at 50% 50%,#526c7866,transparent 70%); gap:12px; }
.ex-poster-symbol { font-size:110px; font-weight:400; font-family:"Songti SC",serif; line-height:1.2; color:#c6d8d9; text-shadow:0 5px 35px #afcdde20; }
.ex-viewer-poster>span:nth-child(2) { color:#95b1bf; font-size:11px; letter-spacing:.1em; }
.ex-viewer-poster .ex-cta { margin-top:20px; border:1px solid #87a3ae70; background:#ffffff0c; }
.ex-viewer-controls { position:absolute; inset:0; pointer-events:none; display:flex; flex-direction:column; justify-content:space-between; padding:20px; }
.ex-viewer-toolbar,.ex-viewer-bottom { display:flex; align-items:center; flex-wrap:wrap; gap:12px; font-size:10px; }
.ex-viewer-toolbar>span { margin-right:auto; }
.ex-viewer-controls button { border:1px solid #b6cbd56b; background:#22353eae; color:#d4e0e0; border-radius:20px; padding:7px 11px; font-size:10px; pointer-events:auto; }
.ex-viewer-controls label { display:flex; align-items:center; gap:10px; pointer-events:auto; }
.ex-viewer-controls input { width:90px; accent-color:#a1c2cd; }
.ex-viewer-bottom small { flex-basis:100%; font-size:9px; color:#9db6c2; }
.ex-exploring .ex-viewer-canvas { touch-action:none; cursor:grab; }
.ex-exploring .ex-viewer-canvas:active { cursor:grabbing; }
.ex-viewer-error { position:absolute; bottom:25px; left:20px; right:20px; color:#e2d2ac; font-size:12px; }
.ex-about { max-width:1620px; margin:auto; padding:120px 6%; display:grid; grid-template-columns:1.1fr 1fr; gap:12%; }
.ex-about h2 { font-size:clamp(32px,4vw,60px); letter-spacing:-.05em; font-weight:500; line-height:1.45; }
.ex-about h2 span { color:#78939e; }
.ex-about>div:last-child p { color:#7d8b92; font-size:13px; line-height:2; margin-bottom:18px; }
.ex-signature { display:block; font-family:Georgia,serif; font-size:32px; font-style:italic; margin-top:26px; color:#4d656f; }
.ex-footer { border-top:1px solid #d9dfdb; padding:40px 6%; display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; font-size:11px; }
.ex-footer strong { display:block; font-size:19px; font-weight:500; letter-spacing:.1em; margin-bottom:10px; }
.ex-footer span,.ex-footer small { color:#88959b; }
.ex-footer>div:last-child { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:20px; }
.ex-footer small { flex-basis:100%; text-align:right; font-size:9px; }
.ex-paused * { animation:none!important; }
@keyframes ex-scroll { 0%,100% { transform:translateY(0); opacity:.3; } 50% { transform:translateY(8px); opacity:1; } }
@media(min-width:1800px) { .ex-chapter { max-width:720px; } .ex-chapter h1,.ex-chapter h2 { font-size:94px; } .ex-chapter-1 h2,.ex-chapter-3 h2 { font-size:80px; } }
@media(max-width:1050px) { .ex-chapter h1,.ex-chapter h2 { font-size:56px; } .ex-chapter-1 h2,.ex-chapter-3 h2 { font-size:49px; } .ex-header nav { gap:20px; } .ex-section-top { grid-template-columns:1fr 2fr; } .ex-section-top>p { grid-column:2; } .ex-workshop { gap:25px; } .ex-viewer { height:430px; } }
@media(max-width:759px) { .ex-header { padding:19px 5%; gap:12px; align-items:flex-start; } .ex-brand { font-size:15px; gap:8px; } .ex-brand small { font-size:9px; } .ex-monogram { width:30px; height:30px; font-size:17px; } .ex-header nav { gap:12px; font-size:10px; flex-wrap:wrap; justify-content:flex-end; max-width:190px; } .ex-header nav>a { padding-top:7px; } .ex-header .ex-back { display:none; } .ex-header button { padding:7px 9px; } .ex-story { height:360svh; } .ex-chapter,.ex-chapter-1,.ex-chapter-3 { top:120px; left:7%; right:7%; width:auto; margin-top:0; max-width:none; } .ex-overline { font-size:9px; margin-bottom:20px; } .ex-chapter h1,.ex-chapter h2,.ex-chapter-1 h2,.ex-chapter-3 h2 { font-size:clamp(35px,9.5vw,48px); } .ex-lead { font-size:12px; line-height:1.85; margin-top:18px; } .ex-cta { margin-top:20px; padding:10px 16px; font-size:10px; gap:25px; } .ex-scroll-cue { display:none; } .ex-canvas-wrap { top:255px; bottom:45px; } .ex-static-sculpture { transform:none; } .ex-static-sculpture i { width:105px; height:125px; border-width:16px; border-radius:28px; } .ex-static-sculpture i:nth-child(2),.ex-static-sculpture i:nth-child(3) { margin-left:-50px; } .ex-bottom { font-size:8px; bottom:20px; } .ex-chapter-progress { gap:8px; } .ex-chapter-progress>span:last-child { display:none; } .ex-chapter-progress i { width:55px; } .ex-model-note { max-width:190px; } .ex-render-note { bottom:16px; font-size:8px; } .ex-projects { padding:65px 7%; } .ex-section-top { grid-template-columns:1fr; margin-bottom:45px; gap:18px; } .ex-section-top>p { grid-column:1; } .ex-section-top h2 { font-size:40px; } .ex-project-columns { grid-template-columns:1fr; gap:40px; } .ex-project-columns>section>header { padding-bottom:20px; } .ex-project-row { padding:22px 0; gap:12px; grid-template-columns:20px 1fr 25px; } .ex-project-row h3 { font-size:21px; } .ex-project-row p { font-size:11px; } .ex-workshop { grid-template-columns:1fr; padding:65px 7%; gap:35px; } .ex-workshop-copy h2 { font-size:41px; } .ex-workshop-copy>p:not(.ex-overline) { font-size:12px; margin-top:20px; } .ex-viewer { height:380px; border-radius:12px; } .ex-viewer-controls { padding:13px; } .ex-viewer-controls button { min-height:38px; } .ex-viewer-bottom small { font-size:8px; } .ex-about { grid-template-columns:1fr; padding:65px 7%; gap:35px; } .ex-about h2 { font-size:37px; } .ex-footer { padding:30px 7%; } .ex-footer>div:last-child { justify-content:flex-start; gap:12px; } .ex-footer small { text-align:left; } }
@media(max-height:650px) and (min-width:760px) { .ex-chapter { margin-top:-140px; } .ex-chapter h1,.ex-chapter h2 { font-size:48px; } .ex-overline { margin-bottom:15px; } .ex-lead { margin-top:18px; font-size:12px; } .ex-scroll-cue { display:none; } }
@media(prefers-reduced-motion:reduce) { .ex * { animation:none!important; transition:none!important; } }

/* V2: actual geometry is separated; these markings describe the assembly. */
.ex-assembly-labels { position:absolute; top:68%; left:7%; display:flex; gap:22px; color:#80949d; font-size:10px; letter-spacing:.08em; opacity:0; transition:opacity .3s; }
.ex-assembly-labels small { position:absolute; top:28px; left:0; font-size:9px; color:#8c9ba2; white-space:nowrap; }
.ex[data-chapter="0"] .ex-assembly-labels { opacity:1; }
.ex-project-row { grid-template-columns:22px 72px 1fr 26px; gap:17px; padding:30px 0; border-radius:2px; }
.ex-project-glyph { width:70px; height:74px; position:relative; display:block; border-radius:12px; background:linear-gradient(135deg,#e3e9e7,#eff1eb); overflow:hidden; transform:perspective(300px) rotateY(calc(var(--hover-x,0)*18deg)) rotateX(calc(var(--hover-y,0)*-14deg)); transition:transform .2s,background .3s; }
.ex-project-glyph i { position:absolute; border:1px solid #7f9ba5; border-radius:50%; width:42px; height:42px; left:14px; top:12px; transition:transform .7s; }
.ex-project-glyph i:nth-child(2) { width:30px; height:30px; left:20px; top:18px; border-color:#9facb1; }
.ex-project-glyph i:nth-child(3) { width:12px; height:12px; left:29px; top:27px; border:0; background:#8ba8b4; box-shadow:0 0 15px #7394a733; }
.ex-project-glyph b { position:absolute; bottom:4px; right:8px; font-weight:400; font-size:8px; color:#81969e; }
.ex-project-row:hover .ex-project-glyph i:first-child { transform:rotateY(55deg) rotateZ(35deg); }
.ex-project-row:hover .ex-project-glyph i:nth-child(2) { transform:rotateX(55deg) rotateZ(-20deg); }
.ex-project-glyph[data-symbol="interview-review"] i { border-radius:3px; height:4px; top:20px; }
.ex-project-glyph[data-symbol="interview-review"] i:nth-child(2) { top:30px; }
.ex-project-glyph[data-symbol="interview-review"] i:nth-child(3) { top:40px; width:25px; height:3px; left:14px; }
.ex-project-glyph[data-symbol="dsh"] i:first-child { border-radius:8px; transform:rotate(45deg); }
.ex-project-glyph[data-symbol="nexus"] i:nth-child(2) { transform:translate(9px,7px); }
.ex-project-glyph[data-symbol="space-assembly"] i:first-child { transform:rotateX(65deg); }
.ex-project-glyph[data-symbol="robomaster"] i { border-radius:8px; }
.ex-concept-note { margin-top:32px; text-align:right; font-size:10px; color:#8f9ba1; }
.ex-view-presets { flex-basis:100%; display:flex; gap:8px; margin-bottom:3px; }
.ex-viewer-bottom label { white-space:nowrap; }
.ex-viewer-bottom [data-ex="expansion"] { width:80px; }
.ex-motion-ready:not(.ex-paused) .ex-reveal { opacity:0; transform:translateY(28px); transition:opacity .75s,transform .75s,padding .3s; }
.ex-motion-ready:not(.ex-paused) .ex-revealed,.ex-motion-ready .ex-reveal:focus-within { opacity:1; transform:translateY(0); }
.ex-static-sculpture { display:none; }
.ex-static-sculpture i { position:absolute; top:50%; left:50%; width:240px; height:240px; border:11px solid #b2c1c6; border-radius:50%; transform:translate(-50%,-50%); }
.ex-static-sculpture i:nth-child(2) { width:170px; height:170px; margin:0; transform:translate(-50%,-50%); }
.ex-static-sculpture i:nth-child(3) { width:100px; height:100px; margin:0; transform:translate(-50%,-50%); }
@media(max-width:1050px) { .ex-project-row { grid-template-columns:18px 54px 1fr 20px; gap:12px; } .ex-project-glyph { width:54px; height:68px; } .ex-project-glyph i { left:6px; } .ex-project-glyph i:nth-child(2) { left:12px; } .ex-project-glyph i:nth-child(3) { left:21px; } }
@media(max-width:759px) { .ex-assembly-labels { top:auto; bottom:80px; left:7%; gap:18px; font-size:9px; } .ex-project-row { grid-template-columns:16px 54px 1fr 20px; gap:10px; } .ex-project-row h3 { font-size:18px; } .ex-concept-note { text-align:left; font-size:9px; } .ex-viewer { height:430px; } .ex-viewer-bottom { gap:10px; } .ex-viewer-bottom input { width:65px; } .ex-static-sculpture i { width:190px; height:190px; } .ex-static-sculpture i:nth-child(2) { width:130px; height:130px; } .ex-static-sculpture i:nth-child(3) { width:75px; height:75px; } }
@media(prefers-reduced-motion:reduce) { .ex-motion-ready .ex-reveal { opacity:1!important; transform:none!important; } }

/* V3: a continuous atelier journey, from its loading curtain to the closing mark. */
.ex { background:radial-gradient(ellipse at 85% 35%,#cbd9d750,transparent 48%),#f2f2ed; }
.ex-loader { position:fixed; inset:0; z-index:100; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; background:radial-gradient(ellipse at 60% 45%,#cadad978,transparent 58%),#f5f3ec; transition:opacity .8s,visibility .8s,transform .9s; }
.ex-loader:before { content:''; position:absolute; inset:0; background:var(--atelier-paper); opacity:.18; pointer-events:none; }
.ex-loader-mark { width:100px; height:100px; display:grid; place-items:center; border:1px solid #7e9c9a; border-radius:28px; color:#47696d; font-size:52px; box-shadow:0 0 80px #9fc6c333; animation:ex-load-breathe 3s ease-in-out infinite; }
.ex-loader>p { font-size:16px; letter-spacing:.22em; }
.ex-loader>p span { display:block; text-align:center; margin-top:10px; font:12px Georgia,serif; letter-spacing:.06em; color:#7b8b8d; }
.ex-load-line { width:min(240px,65vw); height:2px; background:#819b9630; overflow:hidden; }
.ex-load-line i { display:block; height:100%; transform-origin:left; transform:scaleX(var(--load,.12)); background:linear-gradient(90deg,#607f83,#a5bdaf); transition:transform .45s; }
.ex-load-status { font-size:11px; color:#617d7e; letter-spacing:.08em; }
.ex-loader button { padding:8px 16px; border:1px solid #819b9644; border-radius:20px; color:#637e80; background:transparent; font-size:11px; }
.ex-loader small { position:absolute; bottom:8%; font-size:10px; color:#95a2a0; letter-spacing:.16em; }
.ex-loader-done { opacity:0; visibility:hidden; transform:scale(1.025); pointer-events:none; }
@keyframes ex-load-breathe { 50% { box-shadow:0 0 110px #89b8b64d; border-color:#a7c6bf; } }
.ex-light { background:radial-gradient(ellipse at 73% 30%,#d8cdb638,transparent 42%),radial-gradient(ellipse at 64% 65%,#a9ced04d,transparent 54%),linear-gradient(130deg,#faf6ee,#e2e9e6); }
.ex-light:before { content:''; position:absolute; inset:0; background:var(--atelier-paper); opacity:.15; }
.ex-light:after { background:radial-gradient(ellipse at 69% 54%,#315f724d,transparent 40%),radial-gradient(ellipse at 88% 33%,#604c8152,transparent 45%),radial-gradient(ellipse at 50% 85%,#77715338,transparent 38%),linear-gradient(125deg,#111c29,#1c3240 58%,#182231); }
.ex[data-chapter="1"] .ex-chapter h2 span { color:#b2d8e2; text-shadow:0 0 34px #80a7ca35; }
.ex-story { height:680svh; }
@media(max-width:759px) { .ex-story { height:580svh; } }
.ex-projects { position:relative; overflow:hidden; background:radial-gradient(ellipse at 15% 0%,#a4c6c833,transparent 50%),radial-gradient(ellipse at 92% 75%,#e4cfab40,transparent 46%); }
.ex-project-columns>section { position:relative; isolation:isolate; padding:20px 18px; }
.ex-project-columns>section:before { content:''; position:absolute; width:310px; height:310px; top:60px; right:-90px; z-index:-1; border:1px solid #7eaaa62b; border-radius:50%; box-shadow:0 0 0 40px #9db4b40b,0 0 0 80px #9db4b407; transform:translateY(var(--drift,0px)) rotate(var(--turn,0deg)) scale(calc(.85 + var(--travel,.5)*.3)); }
.ex-project-columns>section:nth-child(2):before { border-radius:25%; border-color:#b49a6a33; transform:translateY(var(--drift,0px)) rotate(calc(35deg + var(--turn,0deg))); }
.ex-project-columns>section>header:after { content:''; display:block; height:1px; margin-top:22px; background:linear-gradient(90deg,#739fa7,#bca67b,transparent); transform:scaleX(var(--draw,0)); transform-origin:left; }
.ex-project-row { background:linear-gradient(115deg,#ffffff44,transparent); padding:30px 10px; border-bottom-color:#728c9426; }
.ex-project-glyph { transform:perspective(300px) translateY(calc(var(--drift,0px)*-.12)) rotateY(calc(var(--hover-x,0)*18deg)) rotateX(calc(var(--hover-y,0)*-14deg)); }
.ex-workshop { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 65% 55%,#47718366,transparent 65%),linear-gradient(140deg,#182b36,#304a59 65%,#273545); }
.ex-workshop:before { content:''; position:absolute; inset:0; z-index:-1; opacity:.32; background-image:linear-gradient(#89acb21a 1px,transparent 1px),linear-gradient(90deg,#89acb21a 1px,transparent 1px); background-size:72px 72px; transform:perspective(800px) rotateX(25deg) translateY(var(--drift,0px)) scale(1.25); }
.ex-workshop:after { content:''; position:absolute; width:680px; height:340px; border:1px solid #91b8c12b; border-radius:50%; right:-150px; top:22%; z-index:-1; transform:rotate(calc(-25deg + var(--turn,0deg))); box-shadow:0 0 60px #7191c01a; }
.ex-viewer { transform:translateY(calc(var(--drift,0px)*-.24)); box-shadow:0 20px 60px #08131d35,inset 0 0 40px #8fa3c414; }
.ex-about { position:relative; overflow:hidden; background:radial-gradient(ellipse at 0% 50%,#b8cdc742,transparent 48%),#f4f2e9; min-height:550px; }
.ex-about:before { content:''; position:absolute; inset:0; background:var(--atelier-paper); opacity:.15; pointer-events:none; }
.ex-about:after { content:''; position:absolute; width:310px; height:310px; bottom:-90px; left:5%; border:1px solid #819c9b3b; border-radius:50%; transform:translateY(var(--drift,0px)) rotate(var(--turn,0deg)); box-shadow:0 0 0 40px #a4b8ad10,0 0 0 90px #a4b8ad09; pointer-events:none; }
.ex-about>div { position:relative; z-index:1; }
.ex-signature { display:inline-block; transform:translateX(calc((1 - var(--draw,1))*25px)); }
.ex-footer { position:relative; overflow:hidden; min-height:260px; align-items:center; background:linear-gradient(160deg,#dae5df,#edf0e8); }
.ex-footer:before { content:'间'; position:absolute; left:40%; bottom:-45px; font-size:250px; font-weight:400; color:#7f9e961c; transform:translateY(var(--drift,0px)) scale(calc(.7 + var(--draw,1)*.3)); pointer-events:none; }
.ex-footer:after { content:''; position:absolute; top:0; left:6%; right:6%; height:1px; background:linear-gradient(90deg,#799991,transparent); transform:scaleX(var(--draw,0)); transform-origin:left; }
@media(max-width:759px) { .ex-project-columns>section { padding:12px 0; } .ex-about { min-height:520px; } .ex-footer { min-height:300px; flex-direction:column; align-items:flex-start; justify-content:center; gap:30px; } .ex-footer:before { left:45%; font-size:200px; } .ex-workshop:after { width:420px; } }
@media(prefers-reduced-motion:reduce) { .ex-loader { transition:none; } }
.ex-paused .ex-loader { transition:none; }
.ex-blueprint { position:absolute; width:360px; height:275px; left:4%; bottom:-25px; color:#729a9944; transform:translateY(var(--drift,0px)) rotate(var(--turn,0deg)); pointer-events:none; }
.ex-blueprint path { stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--draw,0)); }
.ex-blueprint circle { opacity:var(--draw,0); }
.ex-header { background:linear-gradient(#f4f3eabf,transparent); }
.ex-dark .ex-header { background:linear-gradient(#192c3abf,transparent); }
/* V5: one environment, user-selected themes, scroll-driven atmospheric layers. */
.ex-integrated { --ex-ink:#263b43; --ex-soft:#657e87; --ex-paper:#f0efe8; --accent:#547f8b; --gold:#b4976f; --glow:#92bac6; --ex-border:#6e929638; --panel-glass:#fbf8edb8; color:var(--ex-ink); background:var(--ex-paper); }
.ex-integrated[data-theme="dark"] { --ex-ink:#e7eee9; --ex-soft:#a0b8c2; --ex-paper:#14212c; --accent:#95c8d4; --gold:#cfb083; --glow:#557fbc; --ex-border:#a4c4d43b; --panel-glass:#21323ec9; }
.ex-integrated .ex-stage { color:var(--ex-ink); background:var(--ex-paper); }
.ex-integrated .ex-light { background:radial-gradient(ellipse at var(--scene-light-x,68%) var(--scene-light-y,46%),#adccd340,transparent 55%),radial-gradient(ellipse at 14% 78%,#cfb28828,transparent 48%),linear-gradient(140deg,#f7f3e9,#e4eeea); }
.ex-integrated[data-theme="dark"] .ex-light { background:radial-gradient(ellipse at var(--scene-light-x,68%) var(--scene-light-y,46%),#47697950,transparent 58%),radial-gradient(ellipse at 14% 78%,#66608825,transparent 50%),linear-gradient(145deg,#152532,#192733 65%,#1e2d36); }
.ex-integrated .ex-light:after { display:none; }
.ex-integrated .ex-light:before { opacity:.08; mix-blend-mode:soft-light; }
.ex-atmosphere { position:absolute; inset:-18%; opacity:.65; transform:rotate(var(--scene-turn,0deg)); pointer-events:none; }
.ex-atmosphere i { position:absolute; width:75%; height:45%; border-radius:50%; background:radial-gradient(ellipse,#87b8c123,transparent 65%); transform:rotate(-35deg) translateY(var(--scene-travel,0px)); }
.ex-atmosphere i:nth-child(1) { left:24%; top:12%; border-top:1px solid #8babb32c; box-shadow:0 -20px 60px #8dabad12; }
.ex-atmosphere i:nth-child(2) { left:-18%; top:48%; background:radial-gradient(ellipse,#c4a97e20,transparent 70%); transform:rotate(28deg) translateY(calc(var(--scene-travel,0px)*-.4)); border-bottom:1px solid #bda47e24; }
.ex-atmosphere i:nth-child(3) { left:40%; top:35%; width:35%; background:radial-gradient(ellipse,#9f9bc121,transparent 70%); }
.ex-ground { position:absolute; width:110%; height:70%; left:-5%; top:62%; background-image:linear-gradient(#7c9ba414 1px,transparent 1px),linear-gradient(90deg,#7c9ba414 1px,transparent 1px); background-size:85px 85px; transform:perspective(600px) rotateX(60deg) translateY(calc(var(--scene-travel,0px)*-.12)); mask-image:radial-gradient(ellipse,black,transparent 67%); opacity:.5; }
.ex-orbits { position:absolute; left:var(--scene-light-x,68%); top:48%; width:45vw; aspect-ratio:1; translate:-50% -50%; transform:rotate(calc(var(--scene-turn,0deg)*-1)); pointer-events:none; opacity:.4; }
.ex-orbits i { position:absolute; inset:8%; border:1px solid var(--ex-border); border-radius:50%; transform:rotateX(60deg) rotate(-20deg); }
.ex-orbits i:nth-child(2) { inset:0; transform:rotateX(70deg) rotate(45deg); border-style:dashed; opacity:.4; }
.ex-integrated .ex-header { color:var(--ex-ink); background:linear-gradient(var(--ex-paper),transparent); }
.ex-integrated .ex-header button { color:var(--ex-ink); background:var(--panel-glass); border-color:var(--ex-border); backdrop-filter:blur(8px); }
.ex-integrated .ex-header [data-ex="theme"] { border-color:var(--accent); }
.ex-integrated .ex-lead,.ex-integrated .ex-overline,.ex-integrated .ex-bottom,.ex-integrated .ex-scene-position,.ex-integrated .ex-concept-note { color:var(--ex-soft); }
.ex-integrated[data-theme] .ex-chapter h1 span,.ex-integrated[data-theme] .ex-chapter h2 span,.ex-integrated .ex-project-subtitle,.ex-integrated .ex-project-facts dt { color:var(--accent); text-shadow:none; }
.ex-integrated .ex-chapter h2 { letter-spacing:-.04em; }
.ex-integrated .ex-project-facts div { border-left-color:var(--ex-border); }
.ex-integrated .ex-content-tags span { border-color:var(--ex-border); background:var(--panel-glass); }
.ex-integrated .ex-cta { background:#2e535f; color:#f6f5e9; box-shadow:0 10px 28px #34556212; }
.ex-integrated[data-theme="dark"] .ex-cta { background:#a6c9ce; color:#142e39; }
.ex-integrated .ex-cta:hover { transform:translateY(-3px); box-shadow:0 12px 30px #547d8a26; }
.ex-integrated .ex-gallery-entry { border-color:var(--ex-border); transition:background .3s,padding .3s; border-radius:5px; }
.ex-integrated .ex-gallery-entry.ex-focused,.ex-integrated .ex-gallery-entry:hover { padding-left:10px; padding-right:10px; background:var(--panel-glass); }
.ex-integrated .ex-gallery-entry>span { color:var(--gold); }
.ex-integrated .ex-signature { color:var(--accent); }
.ex-integrated .ex-footer span,.ex-integrated .ex-footer small { color:var(--ex-soft); }
.ex-integrated .ex-loader { color:var(--ex-ink); background:radial-gradient(ellipse at 60% 45%,#8eafb825,transparent 60%),var(--ex-paper); }
.ex-integrated .ex-loader-mark { color:var(--accent); border-color:var(--ex-border); }
.ex-integrated .ex-loader>p span,.ex-integrated .ex-load-status,.ex-integrated .ex-loader small,.ex-integrated .ex-loader button { color:var(--ex-soft); }
.ex-integrated .ex-explore-overlay { background:var(--panel-glass); color:var(--ex-ink); border-color:var(--ex-border); backdrop-filter:blur(18px); box-shadow:0 30px 100px #122b3d25; }
.ex-integrated .ex-viewer { background:radial-gradient(ellipse,#9db4bf22,transparent 70%),var(--ex-paper); }
.ex-integrated .ex-viewer-controls { color:var(--ex-ink); }
.ex-integrated .ex-viewer-controls button { color:var(--ex-ink); background:var(--panel-glass); border-color:var(--ex-border); }
.ex-integrated .ex-viewer-bottom { background:var(--panel-glass); border:1px solid var(--ex-border); border-radius:16px; padding:12px; }
:root[data-ex-detail="true"] { --bg:#f2f0e9; --surface:#f9f7ef; --ink:#263b43; --muted:#657e87; --line:#ccdad9; --accent:#547f8b; --soft:#e4edeb; --blue:#e1ecee; --warm:#eee5d7; }
:root[data-ex-detail="true"][data-theme="dark"] { --bg:#14212c; --surface:#1e303c; --ink:#e7eee9; --muted:#a0b8c2; --line:#354c59; --accent:#95c8d4; --soft:#233c48; --blue:#233947; --warm:#3e3b35; }
:root[data-ex-detail="true"] body { font-family:ZaowuSans,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
:root[data-ex-detail="true"] .brand-mark { font-family:ZaowuSans,sans-serif; background:none; border:1px solid var(--accent); border-radius:50%; color:var(--ink); }
@media(max-width:759px) { .ex-integrated .ex-header nav { max-width:220px; gap:9px; } .ex-integrated .ex-header [data-ex="theme"] { padding:7px 9px; } .ex-orbits { width:85vw; top:22%; } .ex-ground { top:35%; opacity:.25; } .ex-integrated .ex-viewer-bottom { padding:9px; } }
@media(prefers-reduced-motion:reduce) { .ex-atmosphere,.ex-ground,.ex-orbits { transform:none; } }
@media(max-width:759px) { .ex-blueprint { width:250px; height:190px; bottom:0; left:20%; opacity:.6; } }
.ex { --atelier-paper:url("/assets/media/9e8dc8a4d50184856be1a015.webp"); }
.ex-loader:before,.ex-light:before,.ex-about:before { background-image:var(--atelier-paper); background-size:512px 512px; opacity:.12; mix-blend-mode:multiply; }

/* Original user assets: encoded web variants, not the large source PNGs. */
:root { --ey-badge:url("/assets/media/4c4cdac3b60694c38568eaa0.webp"); --ey-blueprint:url("/assets/media/903b0651121193fb72fe84af.webp"); }
/* V6 — CAD atelier: one travelling drawing sheet and two coherent palettes. */
.ex-integrated { --ex-ink:#203b4b; --ex-soft:#4f6e7e; --ex-paper:#dae5e9; --accent:#287187; --gold:#98703e; --ex-border:#557d8d55; --panel-glass:#edf4f3eb; --cad-ink:#416b80; --cad-opacity:.36; font-family:ZaowuSans,"Bahnschrift","Segoe UI","Microsoft YaHei",sans-serif; }
.ex-integrated[data-theme="dark"] { --ex-ink:#e3edf0; --ex-soft:#aac0cd; --ex-paper:#081721; --accent:#84c9dd; --gold:#d9ad7d; --ex-border:#80b4c54f; --panel-glass:#102330ed; --cad-ink:#90bac9; --cad-opacity:.35; }
.ex-integrated .ex-light,.ex-integrated[data-theme="dark"] .ex-light { background:radial-gradient(ellipse at 64% 43%,#4786a317,transparent 62%),linear-gradient(125deg,var(--ex-paper),var(--ex-paper)); }
.ex-integrated .ex-light:before { display:none; }
.ey-badge { display:inline-block; background:var(--ey-badge) center / contain no-repeat!important; border:0!important; border-radius:0!important; box-shadow:none!important; flex-shrink:0; }
.ex-integrated .ex-monogram.ey-badge { width:48px; height:48px; }
.brand-mark.ey-badge { width:48px; height:48px; }
.ex-integrated .ex-loader-mark.ey-badge { width:124px; height:124px; transform:none; }
.ex-integrated .ex-loader-mark { position:relative; width:min(164px,32vw); height:min(164px,32vw); border:0; border-radius:0; background:none; box-shadow:none; animation:none; flex-shrink:0; }
.ex-loading-ring,.ex-loading-core { position:absolute; inset:0; width:100%; height:100%; }
.ex-loading-ring { mask-image:radial-gradient(circle closest-side,transparent 69%,#000 70%); animation:ex-gear-loading 8s linear infinite; }
.ex-loading-core { mask-image:radial-gradient(circle closest-side,#000 69%,transparent 70%); }
/* Keep layout width unchanged when loading/exploration locks root scrolling. */
html { scrollbar-gutter:stable; background:#0b1c27; }
.ex-loader-flight { position:fixed; z-index:101; transform-origin:0 0; pointer-events:none; }
.ex-loader-flight .ex-loading-ring { animation:none; }
.ex-logo-arriving .ex-header .ex-monogram { animation:ex-logo-receive 1.25s linear forwards; }
.ex-loader-handoff { opacity:0; pointer-events:none; }
@keyframes ex-gear-loading { to { transform:rotate(360deg); } }
@keyframes ex-logo-receive { 0%,78% { opacity:0; } 100% { opacity:1; } }
@media(prefers-reduced-motion:reduce) { .ex-loading-ring,.ex-logo-arriving .ex-header .ex-monogram { animation:none; } }
.ex-integrated .ex-poster-symbol.ey-badge { width:150px; height:150px; }
.ex-cad-sheet { opacity:1; }
.ex-cad-sheet svg { opacity:var(--cad-opacity); }
.ex-integrated[data-chapter="0"] .ex-assembly-labels { opacity:var(--opening-detail,0); left:56%; top:74%; }
.ex-cad-sheet { position:absolute; top:0; left:0; width:100%; height:500svh; color:var(--cad-ink); opacity:var(--cad-opacity); transform:translate3d(0,var(--cad-offset,0svh),0); pointer-events:none; }
.ex-cad-sheet svg { width:100%; height:100%; display:block; }
.ex-cad-sheet text { fill:currentColor; stroke:none; font-family:"Cascadia Code","Consolas",monospace; font-size:13px; letter-spacing:1.2px; }
.ex-cad-grid { opacity:.48; }
.ex-cad-assembly { opacity:.86; }
.ex-cad-routing { stroke-width:2.5; opacity:.6; }
.ex-cad-title { fill:currentColor; }
.ex-cad-frame { position:absolute; inset:15px 17px; border:1px solid var(--ex-border); clip-path:polygon(0 24px,24px 0,calc(100% - 24px) 0,100% 24px,100% calc(100% - 24px),calc(100% - 24px) 100%,24px 100%,0 calc(100% - 24px)); pointer-events:none; }
.ex-cad-frame span { position:absolute; top:76px; font:9px "Consolas",monospace; letter-spacing:.14em; color:var(--ex-soft); opacity:.7; }
.ex-cad-frame span:first-child { left:25px; }
.ex-cad-frame span:last-child { right:25px; }
.ex-integrated .ex-ground,.ex-integrated .ex-orbits { display:none; }
.ex-integrated .ex-atmosphere { opacity:.32; }
.ex-integrated .ex-atmosphere i { border:0; box-shadow:none; }
.ex-integrated .ex-header { padding:24px 5%; background:linear-gradient(var(--ex-paper),transparent); }
.ex-integrated .ex-brand { letter-spacing:.15em; font-weight:700; }
.ex-integrated .ex-brand small { font:10px "Bahnschrift","Consolas",sans-serif; letter-spacing:.15em; margin-top:4px; }
.ex-integrated .ex-header nav { letter-spacing:.06em; }
.ex-integrated .ex-header button { border-radius:3px; background:linear-gradient(145deg,#b8d9e20e,transparent),var(--panel-glass); box-shadow:inset 0 1px #e7f4fc20; }
.ex-integrated .ex-monogram { border-radius:4px; border-color:var(--ex-border); background:linear-gradient(145deg,#cad6d923,transparent),var(--ex-paper); }
.ex-integrated .ex-chapter h1,.ex-integrated .ex-chapter h2,.ex-integrated .ex-closing .ex-about h2 { font-weight:700; letter-spacing:-.025em; }
.ex-integrated[data-theme] .ex-chapter h1 span,.ex-integrated[data-theme] .ex-chapter h2 span { color:var(--accent); text-shadow:0 1px #fff1; }
.ex-integrated .ex-overline,.ex-integrated .ex-bottom,.ex-integrated .ex-content-tags,.ex-integrated .ex-project-facts dt { font-variant-numeric:tabular-nums; letter-spacing:.12em; }
.ex-integrated .ex-overline { display:flex; align-items:center; gap:8px; }
.ex-integrated .ex-overline:before { content:''; display:block; width:18px; height:7px; border-left:3px solid var(--gold); border-right:1px solid var(--accent); transform:skewX(-25deg); }
.ex-integrated .ex-overline i { display:none; }
.ex-integrated .ex-content-panel,.ex-integrated .ex-gallery-panel,.ex-integrated .ex-closing { padding:22px 24px; background:linear-gradient(135deg,#8ab0c40c,transparent),var(--panel-glass); border:1px solid var(--ex-border); border-top:2px solid var(--accent); border-radius:2px; box-shadow:0 16px 50px #00000012,inset 0 1px #e7f4fc0d; }
.ex-integrated .ex-opening-detail { padding:24px; background:var(--panel-glass); border-left:2px solid var(--gold); }
.ex-integrated .ex-content-tags span { border-radius:2px; background:transparent; }
.ex-integrated .ex-project-facts div { border-left:2px solid var(--gold); }
.ex-integrated .ex-cta,.ex-integrated[data-theme="dark"] .ex-cta { border-radius:3px; background:linear-gradient(160deg,#385d70,#163242); color:#edf5f5; border:1px solid #86aeb76b; border-top-color:#acc9d38c; box-shadow:inset 0 1px #efffff26,0 8px 22px #0002; letter-spacing:.08em; }
.ex-integrated .ex-cta:hover { background:linear-gradient(160deg,#4b7b91,#214559); }
.ex-integrated .ex-gallery-entry { border-radius:0; }
.ex-integrated .ex-gallery-entry.ex-focused,.ex-integrated .ex-gallery-entry:hover { background:#79b7d018; }
.ex-integrated .ex-loader { background:linear-gradient(#75a2b810 1px,transparent 1px),linear-gradient(90deg,#75a2b810 1px,transparent 1px),var(--ex-paper); background-size:30px 30px; }
.ex-integrated .ex-loader:before { display:none; }
.ex-integrated .ex-explore-overlay,.ex-integrated .ex-viewer { border-radius:3px; }
.ex-integrated .ex-signature { font-family:"Bahnschrift","Segoe UI",sans-serif; font-weight:600; letter-spacing:.08em; }
:root[data-ex-detail="true"] { --bg:#dae5e9; --surface:#edf4f3; --ink:#203b4b; --muted:#4f6e7e; --line:#557d8d55; --accent:#287187; --soft:#cadce2; --blue:#d4e5ec; --warm:#e2dbce; }
:root[data-ex-detail="true"][data-theme="dark"] { --bg:#081721; --surface:#102330; --ink:#e3edf0; --muted:#aac0cd; --line:#80b4c54f; --accent:#84c9dd; --soft:#173446; --blue:#183849; --warm:#38352e; }
:root[data-ex-detail="true"] body { background-image:linear-gradient(#77a7bc0d 1px,transparent 1px),linear-gradient(90deg,#77a7bc0d 1px,transparent 1px); background-size:28px 28px; }
:root[data-ex-detail="true"] .serif { font-family:ZaowuSans,"Bahnschrift","Segoe UI",sans-serif; font-weight:700; }
:root[data-ex-detail="true"] .brand-mark,:root[data-ex-detail="true"] .theme-button,:root[data-ex-detail="true"] .project-card { border-radius:3px; }
.ex-cad-sheet { opacity:1; }
@media(max-width:759px) {
 .ex-integrated .ex-monogram.ey-badge { width:36px; height:36px; }
 .ex-integrated .ex-monogram.ey-badge { width:36px; height:36px; }
 .ex-cad-sheet { width:180%; left:-40%; --cad-opacity:.24; }
 .ex-cad-frame { inset:8px; }
 .ex-cad-frame span { display:none; }
 .ex-integrated .ex-header { padding:18px 5%; }
 .ex-integrated .ex-content-panel,.ex-integrated .ex-gallery-panel,.ex-integrated .ex-closing { padding:14px 16px 22px; }
 .ex-integrated .ex-opening-detail { padding:12px; }
 .ex-integrated .ex-brand { font-size:15px; }
 .ex-integrated .ex-header button { font-size:10px; padding:5px 7px; }
}

/* Selected digital direction: a continuous depth gallery, with real website link targets. */
.ex-digital-depth { --ds-soft:var(--ex-soft); position:absolute; inset:0; opacity:0; pointer-events:none; z-index:2; }
.ex-digital-depth .ex-depth-heading { position:absolute; top:95px; left:4%; right:4%; display:flex; justify-content:space-between; gap:6px; color:var(--accent); font-size:11px; letter-spacing:.1em; }
.ex-digital-depth .ex-depth-heading small { font-size:10px; color:var(--ex-soft); letter-spacing:0; }
.ex-depth-space { position:absolute; inset:0; perspective:1100px; perspective-origin:50% 44%; transform-style:preserve-3d; }
.ex-digital-depth .ex-depth-screen { top:46%; width:min(1120px,80vw,calc((100svh - 330px)*1.65)); pointer-events:auto; }
.ex-depth-browser { display:block; position:relative; text-decoration:none; outline-offset:5px; border-radius:2px; padding:12px; border:1px solid #7896a3; background:repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 4px),linear-gradient(135deg,#6c8795,#1a303c 12%,#162c38 76%,#718997); box-shadow:0 24px 55px #0004,inset 0 1px #e8f5ff66,inset 0 -1px #020b1477; }
.ex-depth-browser:before { content:''; position:absolute; inset:4px; border:1px solid #bad3de30; clip-path:polygon(0 12px,12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px)); pointer-events:none; }
.ex-depth-browser:after { content:''; position:absolute; inset:0; background:linear-gradient(#ad915f,#776239) left center/3px 38% no-repeat,linear-gradient(#ad915f,#776239) right center/3px 38% no-repeat; pointer-events:none; }
.ex-frame-fasteners { position:absolute; inset:0; pointer-events:none; z-index:2; }.ex-frame-fasteners i { position:absolute; width:6px; height:6px; border:1px solid #cfba8b; border-radius:50%; background:linear-gradient(45deg,#675632 40%,#cfb983 44% 53%,#675632 58%); box-shadow:0 0 0 2px #152c39; }.ex-frame-fasteners i:nth-child(1){top:4px;left:4px}.ex-frame-fasteners i:nth-child(2){top:4px;right:4px}.ex-frame-fasteners i:nth-child(3){bottom:4px;left:4px}.ex-frame-fasteners i:nth-child(4){bottom:4px;right:4px}
.ex-depth-browser .ex-frame-id { font-size:9px; font-weight:600; letter-spacing:.14em; color:#cfb37d; white-space:nowrap; }
.ex-depth-browser>header { padding:3px 10px 10px; gap:12px; }.ex-depth-browser>header>span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.ex-depth-browser>header>b { font-size:9px; white-space:nowrap; color:#97c6d7; }
.ex-integrated[data-theme="light"] .ex-depth-browser { background:repeating-linear-gradient(0deg,#ffffff20 0 1px,transparent 1px 4px),linear-gradient(135deg,#b9c9cf,#e5edef 18%,#c2d3db 80%,#839ba7); border-color:#7d99a5; box-shadow:0 24px 55px #304b5d24,inset 0 1px #fff; }.ex-integrated[data-theme="light"] .ex-depth-browser>header {color:#345765}.ex-integrated[data-theme="light"] .ex-frame-id{color:#7f612b}.ex-integrated[data-theme="light"] .ex-depth-browser>header>b{color:#426d7e}
.ex-depth-browser header { line-height:1.5; }
a.ex-depth-browser { cursor:pointer; transition:box-shadow .2s; }
a.ex-depth-browser:hover,a.ex-depth-browser:focus-visible { box-shadow:0 25px 75px #0005,0 0 28px #8dd6ec45; outline:2px solid var(--accent); }
.ex-preview-placeholder { position:relative; aspect-ratio:16/9; display:flex; flex-direction:column; justify-content:center; align-items:center; overflow:hidden; border:1px solid var(--ex-border); border-radius:4px; background:linear-gradient(135deg,#173646,#0c202b); color:#dfeaf0; text-align:center; }
.ex-preview-placeholder>span { font-size:10px; letter-spacing:.16em; color:#88bacb; }
.ex-preview-placeholder>strong { font-size:clamp(22px,3vw,38px); margin:10px 0 2px; font-weight:600; }
.ex-preview-placeholder>p { font-size:13px; opacity:.7; margin:0; }
.ex-preview-placeholder>small { font-size:10px; color:#cbb07a; margin-top:22px; }
.ex-preview-placeholder>img { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.ex-placeholder-grid { position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(#8bbdd31a 1px,transparent 1px),linear-gradient(90deg,#8bbdd31a 1px,transparent 1px); background-size:30px 30px; }
.ex-placeholder-grid i { position:absolute; width:18px; height:18px; border:1px solid #bfa57070; }.ex-placeholder-grid i:nth-child(1){top:12px;left:12px}.ex-placeholder-grid i:nth-child(2){top:12px;right:12px}.ex-placeholder-grid i:nth-child(3){bottom:12px;left:12px}.ex-placeholder-grid i:nth-child(4){bottom:12px;right:12px}
.ex-integrated[data-theme="light"] .ex-preview-placeholder { background:linear-gradient(135deg,#e4eff1,#cbdfe3); color:#224551; }
.ex-integrated[data-theme="light"] .ex-preview-placeholder>span { color:#507a8b; }.ex-integrated[data-theme="light"] .ex-preview-placeholder>small { color:#8a692f; }
.ex-integrated[data-theme="light"] .ex-placeholder-grid { background-image:linear-gradient(#487d9620 1px,transparent 1px),linear-gradient(90deg,#487d9620 1px,transparent 1px); }
.ex-depth-room { position:absolute; inset:16% 4% 22%; transform-style:preserve-3d; pointer-events:none; }
.ex-depth-room i { position:absolute; inset:0; border:1px solid var(--ex-border); box-shadow:inset 0 0 65px #8bd0df08; }.ex-depth-room i:nth-child(2){inset:13%;opacity:.65}.ex-depth-room i:nth-child(3){inset:26%;opacity:.4}
.ex-integrated .ex-digital-caption { top:auto; bottom:65px; left:50%; right:auto; width:min(680px,80%); max-width:none; margin:0 0 0 max(-340px,-40%); text-align:center; z-index:3; background:none; padding:0; }
.ex-digital-caption .ex-overline { justify-content:center; margin-bottom:8px; font-size:10px; }
.ex-integrated .ex-digital-caption h2 { font-size:28px; letter-spacing:.01em; margin:0 0 8px; }
.ex-digital-summary { font-size:12px; color:var(--ex-soft); line-height:1.7; margin:0 auto; max-width:560px; }
.ex-digital-meta { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px 18px; font-size:10px; color:var(--ex-soft); margin-top:10px; }.ex-digital-meta a { color:var(--accent); border-bottom:1px solid var(--ex-border); }
.ex-integrated .ex-static-sculpture { opacity:calc(1 - var(--depth-visibility,0)); }
.ex-depth-transition { position:absolute; inset:0; width:100%; height:100%; z-index:2; fill:none; stroke:var(--accent); stroke-width:1.5; opacity:0; pointer-events:none; overflow:visible; }
.ex-depth-transition polyline { vector-effect:non-scaling-stroke; stroke-linejoin:round; filter:drop-shadow(0 0 4px #87cde13a); }.ex-depth-transition polyline:nth-child(2){stroke:var(--gold);stroke-width:1}.ex-depth-transition polyline:nth-child(3){stroke-dasharray:8 6;stroke-width:1;opacity:.6}
@media(max-width:759px) {
 .ex-digital-depth .ex-depth-heading { top:110px; left:6%; font-size:10px; flex-direction:column; }.ex-digital-depth .ex-depth-heading small { font-size:9px; }
 .ex-digital-depth .ex-depth-screen { top:44%; width:94vw; }.ex-depth-browser {padding:8px}.ex-depth-browser>header{padding:3px 5px 8px;gap:6px}.ex-depth-browser .ex-frame-id{font-size:7px;letter-spacing:.04em}.ex-depth-browser>header>b{font-size:7px}.ex-preview-placeholder>strong { font-size:23px; }.ex-preview-placeholder>p { font-size:10px; }.ex-preview-placeholder>span,.ex-preview-placeholder>small { font-size:8px; }.ex-preview-placeholder>small { margin-top:16px; }
 .ex-integrated .ex-digital-caption { top:auto; bottom:90px; left:7%; right:7%; width:auto; margin:0; }.ex-integrated .ex-digital-caption h2 { font-size:23px; }.ex-digital-caption .ex-overline { font-size:9px; }.ex-digital-summary { font-size:11px; }.ex-digital-meta { gap:5px 12px; font-size:9px; }
}
@media(min-width:760px) and (max-height:700px) {.ex-digital-depth .ex-depth-screen {width:min(920px,80vw,calc((100svh - 300px)*1.65));top:45%}.ex-digital-depth .ex-depth-heading{top:85px}.ex-integrated .ex-digital-caption{bottom:55px}.ex-integrated .ex-digital-caption h2{font-size:22px}.ex-preview-placeholder>strong{font-size:26px}.ex-preview-placeholder>small{margin-top:12px}}
@media(min-width:760px) and (max-height:600px) {.ex-digital-summary{display:none}.ex-integrated .ex-digital-caption .ex-overline{margin-bottom:4px}.ex-integrated .ex-digital-caption{bottom:45px}}
/* Project atlas: semantic, clickable content sits directly on the projected 3D sheet. */
.ex-integrated .ex-gallery-panel.ex-atlas { inset:0; width:100%; max-width:none; height:100%; max-height:none; top:0; left:0; right:0; translate:none; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; overflow:visible; pointer-events:none!important; }
.ex-atlas .ex-atlas-heading { position:absolute; left:50%; top:20%; transform:translate(-50%,-50%); width:75%; text-align:center; }
.ex-atlas-hit { position:absolute; z-index:4; pointer-events:auto; cursor:zoom-in; border:0; background:transparent; color:var(--accent); padding:0; }
.ex-integrated[data-beat="7"] .ex-atlas-hit { z-index:0; }
.ex-integrated[data-atlas-expanded="true"] .ex-atlas-hit { visibility:hidden; pointer-events:none; }
.ex-integrated[data-beat="8"] .ex-atlas-actions { display:none; }
.ex-integrated[data-atlas-expanded="true"] .ex-atlas { z-index:5; }
.ex-atlas .ex-atlas-heading .ex-overline { justify-content:center; margin:0 0 8px; font-size:10px; }
.ex-integrated .ex-atlas .ex-atlas-heading h2 { font-size:clamp(22px,2vw,30px); }
.ex-atlas .ex-gallery-index { display:block; margin:0; }
.ex-integrated .ex-atlas .ex-atlas-card { position:absolute; display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:10px; padding:14px 18px; margin:0; border:1px solid var(--ex-border); border-top:2px solid var(--accent); border-radius:1px; background:#eef5f2d9; color:#203b4b; box-shadow:inset 0 1px #fff4; pointer-events:auto; overflow:hidden; }
.ex-integrated[data-theme="dark"] .ex-atlas .ex-atlas-card { background:#102b39de; color:#e3edf0; }
.ex-atlas .ex-atlas-card .ex-atlas-number { font:10px ZaowuSans,sans-serif; color:var(--gold); letter-spacing:.08em; }
.ex-atlas .ex-atlas-card strong { font-size:18px; font-weight:650; line-height:1.4; }
.ex-atlas .ex-atlas-card small { font-size:11px; opacity:.8; margin-top:5px; }
.ex-atlas .ex-atlas-card p { font-size:11px; opacity:.76; margin-top:8px; line-height:1.6; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.ex-atlas .ex-atlas-card b { font-size:10px; font-weight:400; color:var(--accent); }
.ex-atlas .ex-atlas-card:hover,.ex-atlas .ex-atlas-card:focus-visible { background:#d7e9ef; border-color:var(--gold); box-shadow:0 0 18px #7ec8dc25; }
.ex-integrated[data-theme="dark"] .ex-atlas .ex-atlas-card:hover { background:#1a4050; }
.ex-atlas .ex-atlas-actions { position:absolute; bottom:64px; left:50%; transform:translateX(-50%); text-align:center; white-space:nowrap; pointer-events:auto; }
.ex-atlas .ex-atlas-actions .ex-text-link { margin-top:0; font-size:11px; }
.ex-atlas .ex-atlas-actions .ex-concept-note { font-size:9px; margin-top:6px; }
/* No-WebGL / light mode keeps every project reachable on a flat blueprint. */
.ex-atlas:not([data-projected="true"]) .ex-gallery-index { position:absolute; inset:28% 8% 17%; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ex-atlas:not([data-projected="true"]) .ex-atlas-hit { left:8%; top:28%; width:84%; height:55%; }
.ex-integrated[data-beat="8"]:not([data-atlas-expanded="true"]) .ex-atlas:not([data-projected="true"]) .ex-gallery-index { left:54%; right:5%; top:20%; bottom:18%; grid-template-columns:repeat(2,1fr); }
.ex-integrated[data-beat="8"]:not([data-atlas-expanded="true"]) .ex-atlas:not([data-projected="true"]) .ex-atlas-hit { left:54%; top:20%; width:41%; height:62%; }
.ex-integrated .ex-atlas:not([data-projected="true"]) .ex-atlas-card { position:relative; width:auto; height:auto; }
@media(max-width:759px) {
 .ex-integrated[data-beat="7"] .ex-canvas-wrap,.ex-integrated[data-beat="8"] .ex-canvas-wrap { height:100%; bottom:0; }
 .ex-integrated[data-atlas-expanded="true"] .ex-canvas-wrap { height:100%; bottom:0; }
 .ex-atlas .ex-atlas-heading { width:88%; }
 .ex-integrated .ex-atlas .ex-atlas-heading h2 { font-size:20px; }
 .ex-atlas .ex-atlas-heading .ex-overline { font-size:8px; }
 .ex-integrated .ex-atlas .ex-atlas-card { padding:9px 10px; gap:5px; }
 .ex-atlas .ex-atlas-card strong { font-size:12px; }
 .ex-atlas .ex-atlas-card .ex-atlas-number,.ex-atlas .ex-atlas-card b { font-size:8px; }
 .ex-atlas .ex-atlas-actions { bottom:52px; }
 .ex-atlas:not([data-projected="true"]) .ex-gallery-index { grid-template-columns:repeat(2,1fr); }
}

/* Continuous printed atlas: compactness follows the pose rather than a toggle. */
.ex-integrated .ex-atlas .ex-atlas-card { gap:var(--atlas-gap,8px); padding:var(--atlas-pad,12px); background:#d5ddd21c; border:1px solid #476b7970; border-top:2px solid #66899790; box-shadow:none; }
.ex-integrated[data-theme="dark"] .ex-atlas .ex-atlas-card { background:#0b1d242b; border-color:#83a6b565; }
.ex-integrated .ex-atlas .ex-atlas-card strong { font-size:var(--atlas-title-size,16px); line-height:1.25; }
.ex-integrated .ex-atlas .ex-atlas-card[data-density="mini"] strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ex-integrated .ex-atlas .ex-atlas-card .ex-atlas-number { opacity:var(--atlas-number,1); max-height:calc(14px * var(--atlas-number,1)); overflow:hidden; }
.ex-integrated .ex-atlas .ex-atlas-card small { font-size:10px; margin:0; opacity:calc(.8 * var(--atlas-subtitle,1)); max-height:calc(28px * var(--atlas-subtitle,1)); overflow:hidden; }
.ex-integrated .ex-atlas .ex-atlas-card p { font-size:11px; margin:0; opacity:calc(.76 * var(--atlas-detail,1)); max-height:calc(36px * var(--atlas-detail,1)); overflow:hidden; }
.ex-integrated .ex-atlas .ex-atlas-card b { opacity:var(--atlas-link,1); max-height:calc(16px * var(--atlas-link,1)); overflow:hidden; }
.ex-integrated .ex-atlas .ex-atlas-heading h2 { font-size:calc(28px - 10px * var(--atlas-compact,0)); }
.ex-integrated .ex-atlas .ex-atlas-card:focus-visible { outline:2px solid var(--gold); outline-offset:-3px; }
@media(max-width:759px) {
 .ex-integrated .ex-atlas .ex-atlas-heading h2 { font-size:calc(20px - 7px * var(--atlas-compact,0)); }
 .ex-integrated .ex-atlas .ex-atlas-card { gap:var(--atlas-gap,4px); padding:var(--atlas-pad,6px); }
 .ex-integrated[data-beat="8"]:not([data-atlas-expanded="true"]) .ex-atlas:not([data-projected="true"]) .ex-gallery-index { inset:12% 5% 60%; grid-template-columns:repeat(2,1fr); gap:5px; }
 .ex-integrated[data-beat="8"]:not([data-atlas-expanded="true"]) .ex-atlas:not([data-projected="true"]) .ex-atlas-hit { left:5%; top:12%; width:90%; height:28%; }
 .ex-integrated[data-beat="8"]:not([data-atlas-expanded="true"]) .ex-atlas:not([data-projected="true"]) .ex-atlas-heading { top:9%; }
 .ex-integrated .ex-atlas:not([data-projected="true"]) .ex-atlas-card { --atlas-detail:0; --atlas-subtitle:0; --atlas-title-size:12px; }
}

/* Precision instrument UI: shared typography and controls, no scene choreography. */
:root { --ui-face:#e5eef1; --ui-edge:#6e939f; --ui-ink:#203b4b; --ui-soft:#4f6e7e; --ui-brass:#8d652f; --ui-focus:#146c8e; --ui-scan:#ffffff90; }
:root[data-theme="dark"] { --ui-face:#142e3e; --ui-edge:#729cae; --ui-ink:#e3edf0; --ui-soft:#aac0cd; --ui-brass:#dfb87d; --ui-focus:#a5e4f2; --ui-scan:#b8e6f326; }
.ex-integrated,:root[data-ex-detail="true"] body { font-family:var(--font-engineering); }
.ex-integrated h1,.ex-integrated h2,.ex-integrated h3,.detail-main h1,.detail-main h2,.project-card h3,.studio-heading h1 { font-family:var(--font-engineering); font-weight:700; letter-spacing:.015em; text-wrap:balance; }
.ex-integrated .ex-lead,.ex-integrated .ex-about p:not(.ex-overline),.story p,.detail-summary,.card-summary { font-family:var(--font-engineering); letter-spacing:.01em; }
.ex-integrated .ex-overline,.ex-integrated .ex-bottom,.ex-integrated .ex-frame-id,.ex-integrated .ex-depth-heading,.ex-atlas .ex-atlas-card .ex-atlas-number,.ex-integrated .ds-screen-label,.eyebrow,.card-index,.story-number,.project-meta span,.media-heading>span,.metric small { font-family:var(--font-engineering-mono); font-variant-numeric:tabular-nums; letter-spacing:.06em; }
.ex-integrated .ex-brand,.brand { font-family:var(--font-engineering); font-weight:700; letter-spacing:.09em; }
.ex-integrated .ex-brand small,.brand small,.ex-integrated .ex-loader>p span { font-family:var(--font-engineering-mono); letter-spacing:.06em; font-style:normal; }
.ex-integrated .ex-signature,:root[data-ex-detail="true"] .serif,.serif { font-family:var(--font-engineering); font-style:normal; font-weight:600; letter-spacing:.035em; }
.ex-integrated .ex-assembly-labels,.ex-integrated .ex-viewer-controls small,.ex-integrated .ex-load-status { font-family:var(--font-engineering-mono); font-variant-numeric:tabular-nums; }

:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child) {
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:40px; padding:10px 17px 10px 23px;
  border:1px solid var(--ui-edge); border-radius:0; color:var(--ui-ink); font:600 12px/1.35 var(--font-engineering); letter-spacing:.06em;
  background:repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 3px),linear-gradient(155deg,#ffffff10,transparent 55%),var(--ui-face);
  clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px));
  box-shadow:inset 0 1px #ffffff25,inset 0 -2px #00000012,0 4px 12px #00000012;
  transform:none; transition:background-color .2s,border-color .2s,box-shadow .2s,transform .12s; text-decoration:none; isolation:isolate;
}
:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child)::before {
  content:''; position:absolute; left:7px; top:9px; bottom:9px; width:2px; background:var(--ui-brass); pointer-events:none;
}
:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child)::after {
  content:''; position:absolute; inset:-40% -30%; background:linear-gradient(110deg,transparent 42%,var(--ui-scan) 49%,transparent 56%);
  transform:translateX(-115%); pointer-events:none; z-index:-1;
}
@media(hover:hover) {
  :is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child):not(:disabled):hover { border-color:var(--ui-focus); box-shadow:inset 0 1px #ffffff35,0 0 16px #4791aa1a; transform:none; }
  :is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child):not(:disabled):hover::after { animation:ex-control-scan .6s ease-out both; }
}
@keyframes ex-control-scan { to { transform:translateX(115%); } }
:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child):not(:disabled):active { transform:translateY(1px); box-shadow:inset 0 2px 5px #00000035; }
:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child):focus-visible { outline:none; box-shadow:inset 0 0 0 3px var(--ui-focus); text-decoration:underline; text-underline-offset:4px; }
:is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button):disabled { opacity:.5; box-shadow:none; cursor:not-allowed; }
.ex-integrated .ex-cta,.ex-integrated[data-theme="dark"] .ex-cta,.hero-actions a:first-child { background:repeating-linear-gradient(0deg,#ffffff04 0 1px,transparent 1px 3px),linear-gradient(135deg,#285a71,#102b3c); color:#eff6f8; border-color:#78a7ba; min-height:46px; padding:13px 22px 13px 27px; }
.ex-integrated .ex-cta span { display:inline-flex; align-items:center; justify-content:center; padding-left:14px; border-left:1px solid #a7c9d14d; font-size:18px; }
.ex-integrated .ex-cta:hover { background:repeating-linear-gradient(0deg,#ffffff04 0 1px,transparent 1px 3px),linear-gradient(135deg,#326e86,#163c51); }
.ex-integrated .ex-header nav { gap:9px; }
.ex-integrated .ex-header nav>a,.header-inner nav>a { position:relative; display:inline-flex; align-items:center; min-height:38px; padding:8px 11px; border:1px solid transparent; border-bottom-color:var(--ex-border,var(--line)); border-radius:0; letter-spacing:.05em; font-weight:600; transition:background .2s,border-color .2s; }
.ex-integrated .ex-header nav>a:hover,.header-inner nav>a:hover { color:var(--accent); border-color:var(--ex-border,var(--line)); background:#6fa8be12; text-decoration:none; }
.ex-integrated .ex-header nav>a:focus-visible,.header-inner nav>a:focus-visible { outline:2px solid var(--ui-focus); outline-offset:2px; }
.ex-integrated .ex-header button,.theme-button { padding-left:25px; white-space:nowrap; }
.ex-integrated .ex-header button::before,.theme-button::before { width:6px; height:6px; top:50%; bottom:auto; left:10px; translate:0 -50%; border-radius:50%; box-shadow:0 0 0 3px #7597a01a; }
.ex-integrated .ex-header [data-running="true"]::before { background:var(--accent); box-shadow:0 0 0 3px #7597a020,0 0 7px #75b4c343; }
.ex-integrated .ex-header [data-running="false"]::before { background:var(--ui-soft); box-shadow:none; }
.ex-integrated .ex-header [data-current-theme="light"]::before,.theme-button[data-current-theme="light"]::before { background:var(--ui-brass); }
.ex-integrated .ex-header [data-current-theme="dark"]::before,.theme-button[data-current-theme="dark"]::before { background:var(--accent); }
.ex-integrated .ex-text-link { font-family:var(--font-engineering); font-weight:600; letter-spacing:.04em; }
.ex-integrated .ex-gallery-panel .ex-text-link { min-height:40px; display:inline-flex; align-items:center; border-bottom:1px solid var(--gold); padding:7px 2px; }
.ex-integrated .ex-viewer-controls label { font-family:var(--font-engineering-mono); font-size:11px; }
.ex-integrated input[type="range"] { accent-color:var(--accent); min-height:28px; }
.ex-atlas .ex-atlas-card { border-top-color:var(--gold); }
.ex-atlas .ex-atlas-card strong { font-family:var(--font-engineering); font-weight:700; letter-spacing:.025em; }
.ex-atlas .ex-atlas-card b { font-family:var(--font-engineering-mono); }
.project-card,.media-slot,.panel,.metric,.editor-preview { border-radius:2px; border-top:2px solid var(--line); }
.project-card { background:linear-gradient(135deg,#88a8b308,transparent 50%),var(--surface); }
.project-card .card-category,.pill,.tags span { border-radius:2px; border:1px solid var(--line); font-family:var(--font-engineering); }
.story-grid>aside { border-left:2px solid var(--line); padding-left:18px; font-family:var(--font-engineering-mono); }
.story-grid>aside a { padding:8px 0; }
.story-number { display:inline-block; padding:3px 9px; border:1px solid var(--line); background:var(--soft); }
.brand-mark:not(.ey-badge) { border-radius:2px; }
.header-inner nav { gap:8px; }
.sidebar nav a { border-radius:1px; font-family:var(--font-engineering); }
.editor-fields input { border-radius:2px; font-family:var(--font-engineering); }
@media(max-width:759px) {
  .ex-integrated .ex-header { padding:14px 5%; gap:10px; }
  .ex-integrated .ex-brand { font-size:14px; letter-spacing:.04em; gap:7px; }
  .ex-integrated .ex-header nav { gap:3px; max-width:190px; min-width:0; flex:1; }
  .ex-integrated .ex-header nav>a { padding:7px 8px; min-height:44px; min-width:44px; justify-content:center; font-size:10px; }
  .ex-integrated .ex-header .ex-back { display:none; }
  .ex-integrated .ex-header button { min-height:44px; padding:8px 9px 8px 22px; font-size:10px; letter-spacing:0; }
  .ex-integrated .ex-cta,.theme-button,.button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button { min-height:44px; }
  .ex-integrated .ex-header button::before { left:8px; width:5px; height:5px; }
  .ex-integrated .ex-content-panel h2,.ex-integrated .ex-closing h2 { letter-spacing:0; }
  .ex-integrated .ex-gallery-panel .ex-text-link,.header-inner nav>a { min-height:44px; }
}
@media(prefers-reduced-motion:reduce) {
  :is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.ex-integrated .ex-loader button,.theme-button,.button,.hero-actions a:first-child)::after { animation:none!important; display:none; }
  :is(.ex-integrated .ex-cta,.ex-integrated .ex-header button,.ex-integrated .ex-viewer-controls button,.theme-button,.button):active { transform:none; }
}
