/* System fonts keep the neutral template independent of external font services. */
:root{color-scheme:dark;--bg:#101617;--panel:#1c2526;--ink:#e5e9e5;--muted:#a9b8b3;--copper:#c99868;--line:#3b4b48;font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;background:var(--bg);color:var(--ink)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}a{color:inherit;text-decoration:none}button{font:inherit}::selection{background:var(--copper);color:#0e1415}.eyebrow,.opening-label,.opening-foot,.evidence,.stage-caption,.chapter-rail,.wordmark small,.head-index,.site-foot,.fact-line,.frame-no,.frame-bottom,.inner-model>span,.next-links a>span{font:500 11px/1.5 'IBM Plex Mono',Consolas,monospace;letter-spacing:.15em;text-transform:uppercase}.eyebrow,.opening-label{color:var(--copper)}.scroll-line{position:fixed;z-index:30;top:0;left:0;right:0;height:3px;background:transparent}.scroll-line span{display:block;height:100%;width:0;background:var(--copper)}
.site-head{position:absolute;z-index:20;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px clamp(24px,4.4vw,76px);border-bottom:1px solid rgba(229,233,229,.12)}.wordmark{display:flex;gap:15px;align-items:center;font:600 18px/1 'IBM Plex Mono',Consolas,monospace;letter-spacing:-.04em;white-space:nowrap}.wordmark small{display:block;color:var(--muted);font-size:8px;letter-spacing:.18em;margin-top:7px}.wordmark-mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--copper);color:var(--copper);font-size:25px;position:relative}.wordmark-mark>span{position:absolute;right:-4px;top:5px;width:7px;height:7px;background:var(--copper)}.top-nav{display:flex;gap:clamp(18px,3vw,48px);margin-left:auto}.top-nav a{font-size:12px;color:var(--muted);transition:color .2s}.top-nav a:hover,.top-nav a[aria-current]{color:var(--ink)}.top-nav a[aria-current]:after{content:'';display:block;height:1px;margin-top:8px;background:var(--copper)}.head-index{color:var(--muted);padding-left:clamp(10px,3vw,55px)}
.opening{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:120px clamp(28px,11vw,200px) 110px;overflow:hidden;background:radial-gradient(circle at 74% 39%,#283433 0,#172021 31%,#101617 69%)}.opening:before,.opening:after{content:'';position:absolute;border:1px solid rgba(201,152,104,.15);border-radius:50%;pointer-events:none}.opening:before{width:min(67vw,870px);aspect-ratio:1;right:-8%;top:11%}.opening:after{width:min(44vw,580px);aspect-ratio:1;right:2%;top:24%}.opening-label{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.pulse{width:7px;height:7px;border-radius:50%;background:var(--copper);box-shadow:0 0 22px var(--copper)}h1,h2,p{margin-top:0}.opening h1,.inner-hero h1,.accessory-intro h1{position:relative;z-index:1;font-weight:500;font-size:clamp(56px,8vw,138px);letter-spacing:-.075em;line-height:1.06;margin:28px 0}.opening h1 em,.chapter h2 em,.inner-hero h1 em,.accessory-intro h1 em{font-style:normal;color:var(--copper)}.opening p{position:relative;z-index:1;font-size:clamp(14px,1.3vw,18px);line-height:1.95;color:var(--muted);max-width:43ch}.text-link{display:inline-flex;align-items:center;gap:44px;border-bottom:1px solid var(--copper);padding:12px 0;margin-top:34px;font-size:13px;font-weight:600}.text-link span{color:var(--copper)}.opening-foot{position:absolute;left:clamp(28px,11vw,200px);right:clamp(28px,4.4vw,76px);bottom:35px;display:flex;justify-content:space-between;gap:20px;color:#758985}
.opening-model{position:absolute;z-index:0;right:-8%;top:8%;width:66%;height:88%;border:0;pointer-events:none;opacity:.72;filter:contrast(1.08) brightness(.8);mask-image:linear-gradient(90deg,transparent,#000 25%)}.opening .text-link{position:relative;z-index:1}
.story{position:relative;isolation:isolate}.story-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:radial-gradient(circle at 64% 45%,#33413f 0,#1b2626 40%,#111819 78%)}.story-stage iframe{width:100%;height:100%;border:0;display:block;pointer-events:none}.stage-glow{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(16,22,23,.85),rgba(16,22,23,.26) 42%,transparent 75%)}.stage-crosshair{position:absolute;left:68%;top:50%;width:min(58vw,740px);height:min(58vw,740px);transform:translate(-50%,-50%);border:1px solid rgba(201,152,104,.16);border-radius:50%;pointer-events:none}.stage-crosshair:before{content:'';position:absolute;inset:16%;border:1px dashed rgba(201,152,104,.13);border-radius:50%}.stage-crosshair span:first-child{position:absolute;left:50%;top:-10px;height:20px;border-left:1px solid var(--copper)}.stage-crosshair span:last-child{position:absolute;left:50%;bottom:-10px;height:20px;border-left:1px solid var(--copper)}.stage-caption{position:absolute;bottom:36px;left:clamp(28px,8vw,130px);right:clamp(28px,4.4vw,76px);display:flex;justify-content:space-between;color:#849793;pointer-events:none}.story-veil{position:absolute;z-index:0;top:0;bottom:0;left:0;width:43%;pointer-events:none;background:linear-gradient(90deg,#101617b8,transparent)}.story-copy{position:relative;z-index:2;margin-top:-100svh;pointer-events:none}.chapter{min-height:115svh;padding:130px clamp(28px,8vw,130px);display:flex;align-items:center}.chapter-copy{max-width:500px;opacity:.18;transform:translateY(35px);transition:opacity .55s,transform .55s}.chapter.is-active .chapter-copy{opacity:1;transform:translateY(0)}.chapter h2{font-size:clamp(46px,5.8vw,91px);font-weight:500;letter-spacing:-.065em;line-height:1.11;margin:20px 0 26px}.chapter p{font-size:clamp(14px,1.25vw,18px);line-height:1.9;color:#b9c7c1;max-width:38ch}.evidence{display:block;color:#819590;border-top:1px solid rgba(201,152,104,.32);padding-top:18px;margin-top:42px;letter-spacing:.03em;text-transform:none}.chapter.pending .eyebrow{color:#97a8a1}.chapter.pending h2 em{color:#9cac9f}.chapter-rail{position:sticky;z-index:5;float:right;top:50%;transform:translateY(-50%);margin-top:calc(50svh - 102px);margin-right:clamp(24px,4vw,70px);display:grid;gap:11px;color:#7d918c}.chapter-rail a{display:flex;align-items:center;gap:14px;opacity:.5;transition:opacity .25s,color .25s}.chapter-rail a:before{content:'';width:19px;height:1px;background:currentColor;transition:width .25s}.chapter-rail a.is-active{opacity:1;color:var(--copper)}.chapter-rail a.is-active:before{width:36px}.chapter-rail b{font-weight:500}.chapter-rail span{font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;font-size:10px;letter-spacing:0}
.next-pages{min-height:78svh;background:#d9dfd8;color:#15201e;padding:clamp(80px,12vw,180px) clamp(28px,8vw,130px);display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.next-pages h2{font-size:clamp(50px,6vw,94px);line-height:1.13;font-weight:500;letter-spacing:-.065em;margin:25px 0}.next-pages .eyebrow{color:#806043}.next-links{border-top:1px solid #81908a}.next-links a{display:grid;grid-template-columns:1fr auto;gap:13px;padding:30px 0;border-bottom:1px solid #81908a}.next-links a>span{grid-column:1/-1;color:#63736b}.next-links strong{font-size:clamp(23px,3vw,42px);font-weight:500;letter-spacing:-.04em}.next-links b{font-size:27px;font-weight:400}.site-foot{display:flex;justify-content:space-between;gap:20px;padding:38px clamp(28px,4.4vw,76px);color:#8da19a;border-top:1px solid var(--line)}.site-foot a{color:var(--ink)}
.inner-page{padding-top:99px}.inner-hero{display:grid;grid-template-columns:43% 57%;min-height:calc(100svh - 99px)}.inner-copy{padding:clamp(65px,10vw,160px) clamp(28px,5vw,85px);display:flex;flex-direction:column;justify-content:center}.inner-hero h1{font-size:clamp(52px,5.6vw,88px);margin:24px 0}.inner-copy p{font-size:15px;line-height:1.9;color:var(--muted);max-width:41ch}.fact-line{display:flex;flex-wrap:wrap;gap:12px 30px;color:var(--copper);margin-top:48px;letter-spacing:.02em}.inner-model{position:relative;min-height:600px;background:radial-gradient(circle,#34423f,#172021 65%,#111819);overflow:hidden}.inner-model iframe{width:100%;height:100%;min-height:600px;border:0}.inner-model>span{position:absolute;bottom:30px;left:35px;color:#8da19a}.inner-content{min-height:45svh;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:80px clamp(28px,8vw,130px);background:#d9dfd8;color:#14201d}.inner-content .eyebrow{color:#806043}.inner-content h2,.accessory-text h2{font-size:clamp(36px,4vw,64px);letter-spacing:-.05em;line-height:1.18;font-weight:500;margin:22px 0}.inner-content p{font-size:16px;line-height:1.9;max-width:42ch}.wide-link{padding:42px clamp(28px,8vw,130px);display:flex;align-items:center;gap:25px}.wide-link span{font-size:13px;color:var(--muted)}.wide-link strong{font-size:clamp(26px,3vw,44px);font-weight:500;margin-right:auto}.wide-link b{font-size:30px;color:var(--copper);font-weight:400}
.accessory-intro{min-height:73svh;padding:130px clamp(28px,11vw,200px) 100px;background:radial-gradient(circle at 85% 60%,#293635,#101617 60%)}.accessory-intro h1{font-size:clamp(62px,8vw,122px)}.accessory-intro p{font-size:17px;line-height:1.9;color:var(--muted);max-width:47ch}.accessory-layout{display:grid;grid-template-columns:1.1fr .9fr;min-height:72svh}.accessory-frame{position:relative;min-height:520px;display:grid;place-items:center;background:#253230;overflow:hidden}.frame-no,.frame-bottom{position:absolute;color:#9caea6;left:38px}.frame-no{top:35px}.frame-bottom{bottom:35px}.abstract-orbit{position:relative;width:min(55%,390px);aspect-ratio:1;border:1px solid rgba(201,152,104,.4);border-radius:50%;display:grid;place-items:center}.abstract-orbit i{position:absolute;width:78%;height:78%;border:1px solid rgba(201,152,104,.25);border-radius:50%;transform:rotateX(65deg) rotate(-30deg)}.abstract-orbit i:nth-child(2){transform:rotateY(65deg) rotate(20deg)}.abstract-orbit i:nth-child(3){width:45%;height:45%;transform:none}.abstract-orbit b{font:300 80px/1 'IBM Plex Mono',Consolas,monospace;color:var(--copper)}.accessory-text{padding:clamp(60px,8vw,130px);display:flex;flex-direction:column;justify-content:center}.accessory-text p{max-width:38ch;color:var(--muted);line-height:1.9;font-size:15px}
@media(max-width:900px){.chapter-rail{display:none}.story-veil{width:60%}.chapter{padding-left:7vw;padding-right:7vw}.next-pages{grid-template-columns:1fr;gap:30px}.inner-hero{grid-template-columns:1fr}.inner-copy{padding:80px 7vw}.inner-model{height:65svh;min-height:460px}.inner-model iframe{min-height:460px}.accessory-layout{grid-template-columns:1fr}.accessory-text{padding:80px 7vw}.accessory-frame{min-height:450px}}
@media(max-width:650px){.site-head{padding:18px 20px}.wordmark{font-size:14px;gap:9px}.wordmark-mark{width:31px;height:31px;font-size:21px}.wordmark small{font-size:6px}.top-nav{gap:13px}.top-nav a{font-size:11px}.head-index{display:none}.opening{padding:140px 25px 115px;justify-content:flex-end}.opening:before{width:115vw;right:-60vw;top:18%}.opening:after{width:90vw;right:-48vw;top:28%}.opening-model{width:120%;height:66%;right:-25%;top:8%;opacity:.55;mask-image:linear-gradient(0deg,transparent,#000 30%)}.opening h1{font-size:clamp(57px,13vw,87px)}.opening p{font-size:14px;max-width:32ch}.opening-foot{left:25px;right:25px;bottom:28px;font-size:8px}.opening-foot span:last-child{display:none}.story-stage iframe{transform:scale(1.05)}.stage-glow{background:linear-gradient(0deg,rgba(16,22,23,.96),rgba(16,22,23,.34) 48%,transparent 86%)}.stage-crosshair{width:86vw;height:86vw;left:50%;top:35%}.stage-caption{left:25px;right:25px;bottom:18px;font-size:8px}.story-veil{width:100%;background:none}.chapter{min-height:108svh;align-items:flex-end;padding:90px 25px 105px}.chapter-copy{max-width:100%}.chapter h2{font-size:clamp(47px,11vw,68px);margin:14px 0 16px}.chapter p{font-size:13px;line-height:1.7;max-width:30ch}.evidence{margin-top:20px;padding-top:12px;font-size:9px}.next-pages{min-height:65svh;padding:80px 25px}.next-pages h2{font-size:57px}.next-links a{padding:20px 0}.site-foot{padding:28px 25px;flex-wrap:wrap;font-size:9px;line-height:1.7}.site-foot span:nth-child(2){width:100%;order:3}.inner-page{padding-top:68px}.inner-copy{padding:85px 25px 65px}.inner-hero h1{font-size:clamp(50px,11vw,70px)}.inner-copy p{font-size:14px}.inner-model{height:62svh;min-height:420px}.inner-model iframe{min-height:420px}.inner-content{grid-template-columns:1fr;gap:10px;padding:70px 25px}.inner-content p{font-size:14px}.wide-link{padding:28px 25px}.accessory-intro{min-height:68svh;padding:95px 25px 80px}.accessory-intro h1{font-size:clamp(55px,12vw,80px)}.accessory-intro p{font-size:14px}.accessory-frame{min-height:380px}.accessory-text{padding:70px 25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chapter-copy,.chapter-rail a,.top-nav a{transition:none!important}.chapter .chapter-copy{opacity:1;transform:none}}

/* Original scene plate: physical space behind the live STEP geometry. */
.opening{isolation:isolate;background:#15120f}
.scene-backdrop{position:absolute;inset:-4%;pointer-events:none;background-image:url('./assets/scene-studio-v2.png');background-size:cover;background-position:center 54%;will-change:transform}
.opening-scene{z-index:0}
.opening::before{display:block;inset:0;width:auto;height:auto;right:0;top:0;border:0;border-radius:0;z-index:1;background:linear-gradient(90deg,rgba(11,16,17,.91) 0%,rgba(11,16,17,.75) 31%,rgba(11,16,17,.19) 67%,rgba(11,16,17,.12) 100%)}
.opening::after{display:none}
.opening-model{z-index:2;opacity:.96;filter:contrast(1.14) brightness(.83);mask-image:linear-gradient(90deg,transparent,#000 22%)}
.opening>:not(.scene-backdrop):not(.opening-model){z-index:3}
.opening-foot{color:#d5c9b9}
.story-stage{background:#171512}
.story-scene{z-index:0;background-position:center 58%}
.story-stage::before{content:'';position:absolute;z-index:1;left:52%;bottom:8%;width:31%;height:7%;border-radius:50%;background:rgba(0,0,0,.42);filter:blur(25px);pointer-events:none}
.story-stage iframe{position:relative;z-index:2}
.stage-glow{z-index:3;background:linear-gradient(90deg,rgba(10,15,16,.93),rgba(10,15,16,.63) 34%,rgba(10,15,16,.08) 66%,transparent 90%),rgba(7,12,12,var(--scene-dim,.05))}
.stage-crosshair{display:none}
.stage-caption{z-index:4;color:#dcc8aa}
.chapter p{color:#d4d0c6}
.evidence{color:#bba98f}
.story-veil{background:linear-gradient(90deg,rgba(9,13,13,.33),transparent)}
@media(max-width:650px){
  .scene-backdrop{background-position:62% center}
  .opening::before{background:linear-gradient(0deg,rgba(11,15,16,.97) 0%,rgba(11,15,16,.78) 40%,rgba(11,15,16,.13) 76%)}
  .opening-model{opacity:.93;filter:contrast(1.12) brightness(.88)}
  .story-scene{background-position:62% center}
  .stage-glow{background:linear-gradient(0deg,rgba(9,13,14,.96),rgba(9,13,14,.69) 42%,rgba(9,13,14,.11) 77%),rgba(7,12,12,var(--scene-dim,.05))}
  .story-stage::before{left:23%;bottom:32%;width:54%}
}
@media(prefers-reduced-motion:reduce){.scene-backdrop{will-change:auto}}

/* Cool architectural light for the international technology direction. */
:root{--bg:#0d151b;--panel:#1a2830;--ink:#eaf4f7;--muted:#a9c0c9;--copper:#9bd6e4;--line:#3c5360}
.opening,.story-stage{background:#0c151e}
.opening-foot,.stage-caption{color:#bad3e0}
.evidence{color:#a8c4ce}
.chapter.pending h2 em{color:#b3c8cd}
.next-pages,.inner-content{background:#dce7eb;color:#14232b}
.next-pages .eyebrow,.inner-content .eyebrow{color:#477986}
.next-links{border-color:#879fa8}
.next-links a{border-color:#879fa8}
.story-stage canvas{position:relative;z-index:2;display:block;width:100%;height:100%;pointer-events:none}
@media(max-width:650px){.story-stage canvas{transform:scale(1.05)}}
.inner-model{background:linear-gradient(90deg,rgba(8,17,23,.14),rgba(8,17,23,.26)),url('./assets/scene-studio-v2.png') center/cover}
.inner-model canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.inner-model canvas:active{cursor:grabbing}
.inner-model>span{z-index:2;color:#c0d9e0}
.accessory-intro{background:linear-gradient(90deg,rgba(8,17,24,.92),rgba(8,17,24,.55) 60%,rgba(8,17,24,.28)),url('./assets/scene-studio-v2.png') center/cover}
.accessory-frame{background:#192833}
.abstract-orbit,.abstract-orbit i{border-color:rgba(155,214,228,.35)}

/* One persistent scene spans the opening and every story chapter. */
:root{font-family:'Helvetica Neue',Arial,sans-serif}
.experience{position:relative;isolation:isolate}
.experience-visual{position:sticky;top:0;height:100svh;overflow:hidden;z-index:0;background:#101924}
.experience-scene{z-index:0;background-position:center 54%}
.experience-visual canvas{position:absolute;inset:0;z-index:2;width:100%;height:100%;display:block;pointer-events:none}
.experience-visual .stage-glow{z-index:3}
.experience-visual .stage-caption{z-index:4;opacity:0}
.object-shadow{position:absolute;left:0;top:0;z-index:1;width:25vw;height:6vh;max-width:320px;border-radius:50%;background:#000;filter:blur(22px);will-change:transform;pointer-events:none}
.opening{z-index:2;margin-top:-100svh;background:transparent;isolation:auto}
.opening::before,.opening::after{display:none}
.opening h1{font-size:clamp(80px,10vw,164px);line-height:.98;letter-spacing:-.07em;font-weight:500}
.opening p{font-size:15px;line-height:1.9;max-width:34ch}
.story{z-index:2}
.story-copy{margin-top:0}
.story-veil{display:none}
.chapter h2{font-size:clamp(64px,6.9vw,108px);line-height:1;letter-spacing:-.065em}
.chapter p{font-size:15px;line-height:1.8;max-width:30ch}
.chapter-copy{max-width:450px}
.chapter.pending h2 em{color:var(--copper)}
.chapter-rail{font-family:Consolas,monospace}
.chapter-rail span{font-family:Arial,sans-serif;font-size:10px}
.scroll-line span{width:100%;transform:scaleX(0);transform-origin:left center;will-change:transform}
.next-pages h2,.inner-content h2{letter-spacing:-.055em}
.inner-model canvas{touch-action:pan-y}
@media(max-width:900px){
  .opening{justify-content:flex-end;padding:140px 7vw 115px}
  .opening h1{font-size:clamp(72px,12vw,106px);max-width:6.8ch}
  .opening p{font-size:14px;max-width:31ch}
  .chapter{align-items:flex-end;padding:90px 7vw 105px;min-height:110svh}
  .chapter h2{font-size:clamp(58px,10vw,82px)}
  .chapter p{max-width:37ch;font-size:14px}
  .chapter-copy{max-width:100%}
  .stage-glow{background:linear-gradient(0deg,rgba(9,13,14,.96),rgba(9,13,14,.68) 40%,rgba(9,13,14,.08) 78%),rgba(7,12,12,var(--scene-dim,.05))}
  .evidence{margin-top:20px;padding-top:12px;font-size:9px}
  .opening-foot{left:7vw;font-size:8px}
  .opening-foot span:last-child{display:none}
  .object-shadow{width:42vw;height:4vh}
  .experience-visual .stage-caption{top:20px;bottom:auto;font-size:7px}
}
@media(max-width:650px){
  .site-head{gap:12px}.wordmark{font-size:13px}.top-nav{gap:12px}.top-nav a{font-size:10px}
  .opening h1{font-size:clamp(69px,16.7vw,92px)}
  .opening-label{font-size:9px;letter-spacing:.10em}
  .opening .text-link{margin-top:22px}
  .chapter h2{font-size:clamp(58px,14vw,75px)}
  .chapter p{font-size:13px;line-height:1.7;max-width:32ch}
  .next-pages h2{font-size:58px}
  .inner-hero h1{font-size:clamp(62px,14vw,82px)}
}
@media(prefers-reduced-motion:reduce){.scene-backdrop,.object-shadow{will-change:auto}}
