:root{--bg:#0b0b0b;--fg:#f3f3ef;--muted:#a3a39d;--line:rgba(255,255,255,.18);--panel:#131313;--pad:clamp(18px,2.4vw,38px);--display:clamp(50px,8.7vw,142px);--h2:clamp(34px,5vw,78px);--body:clamp(16px,1.25vw,20px);--tone-a:#111;--tone-b:#242424;--glow:rgba(255,255,255,.18)}
*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}html[data-lang="zh"] .lang-en,html[data-lang="en"] .lang-zh{display:none!important}body{margin:0;overflow-x:hidden;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,"PingFang SC","Microsoft YaHei",sans-serif;font-size:var(--body);line-height:1.4;letter-spacing:-.018em}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}::selection{background:var(--fg);color:var(--bg)}
.nav{position:fixed;z-index:20;left:0;right:0;top:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:15px var(--pad);mix-blend-mode:difference;color:#fff;pointer-events:none}.nav>*{pointer-events:auto}.brand{display:inline-flex;align-items:center;min-height:28px}.brand-mark{display:block;height:18px;width:auto}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.back{justify-self:center;display:inline-flex;align-items:center;min-height:38px;font-size:11px;text-transform:uppercase;letter-spacing:.055em}.back span{display:inline-block;transition:transform .25s}.back:hover span{transform:translateX(-5px)}.lang-switch{justify-self:end;display:flex;align-items:center;gap:7px;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.lang-switch button{appearance:none;border:0;background:none;padding:5px 0;cursor:pointer;opacity:.48}.lang-switch button.is-active{opacity:1}.lang-switch .divider{opacity:.35}
.hero{min-height:84svh;position:relative;overflow:hidden;padding:92px var(--pad) var(--pad);display:grid;grid-template-rows:auto 1fr auto;border-bottom:1px solid var(--line);isolation:isolate}.hero-media{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:center}.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.25) 66%,rgba(0,0,0,.52) 100%),linear-gradient(0deg,rgba(0,0,0,.74),transparent 58%),radial-gradient(circle at 70% 42%,var(--glow),transparent 34%)}.hero::after{content:"";position:absolute;z-index:-1;inset:8% 5%;border:1px solid rgba(255,255,255,.14);background:repeating-linear-gradient(90deg,transparent 0 8.2%,rgba(255,255,255,.035) 8.3% 8.4%);transform:perspective(900px) rotateX(5deg)}.hero-top,.hero-foot{display:flex;justify-content:space-between;gap:24px;font-size:11px;text-transform:uppercase;letter-spacing:.055em}.hero-title{align-self:center;margin:48px 0;font-size:var(--display);font-weight:500;line-height:.84;letter-spacing:-.08em;max-width:12ch;text-wrap:balance}.hero-title .en{display:block;margin-top:24px;font-size:.22em;line-height:1.12;letter-spacing:-.025em;color:#d0d0ca}.asset-state{padding:7px 10px;border:1px solid rgba(255,255,255,.45);border-radius:99px;background:rgba(0,0,0,.25);backdrop-filter:blur(8px)}
.summary{display:grid;grid-template-columns:1fr 2fr;gap:clamp(40px,8vw,150px);padding:clamp(70px,10vw,150px) var(--pad);border-bottom:1px solid var(--line)}.section-label{font-size:11px;text-transform:uppercase;letter-spacing:.055em}.intro{margin:0;max-width:25ch;font-size:clamp(28px,4.2vw,68px);line-height:1.04;letter-spacing:-.055em;text-wrap:pretty}.intro.long{font-size:clamp(24px,3.25vw,52px);max-width:31ch}
.facts{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}.fact{min-height:245px;padding:22px var(--pad);border-right:1px solid var(--line);display:grid;align-content:space-between;gap:28px}.fact:last-child{border-right:0}.fact-label{font-size:11px;text-transform:uppercase;letter-spacing:.055em;color:var(--muted)}.fact-value{font-size:clamp(20px,2vw,31px);line-height:1.12;letter-spacing:-.035em;text-wrap:pretty}
.media-section,.process,.credits,.text-section{padding:clamp(72px,9vw,140px) var(--pad);border-bottom:1px solid var(--line)}.media-head{display:flex;justify-content:space-between;gap:30px;margin-bottom:clamp(36px,6vw,80px)}.media-note{max-width:600px;margin:0;color:var(--muted);font-size:14px;line-height:1.55}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.media-slot{position:relative;min-height:clamp(300px,42vw,680px);overflow:hidden;background:linear-gradient(145deg,var(--tone-a),var(--tone-b));border:1px solid rgba(255,255,255,.08);margin:0}.media-slot.wide{grid-column:1/-1;min-height:clamp(320px,52vw,820px)}.media-slot.tall{min-height:clamp(440px,62vw,900px)}.media-slot img,.media-slot video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}.media-slot.contain img{object-fit:contain;background:#050505}.media-slot figcaption{display:none!important}
.text-section{display:grid;grid-template-columns:1fr 2fr;gap:clamp(40px,8vw,150px)}.text-body{max-width:920px;display:grid;gap:22px}.text-body h2{font-size:var(--h2);line-height:.94;letter-spacing:-.065em;font-weight:500;margin:0 0 18px}.text-body p{margin:0;color:#d0d0ca;font-size:clamp(17px,1.6vw,25px);line-height:1.45}.geometry{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:45px}.geometry-item{padding:20px 18px 0 0;border-right:1px solid var(--line)}.geometry-item:last-child{border-right:0;padding-left:18px}.geometry strong{display:block;font-size:clamp(28px,4vw,64px);letter-spacing:-.06em;font-weight:500}.geometry span{display:block;margin-top:8px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em}
.process{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}.process-visual{aspect-ratio:16/10;position:relative;overflow:hidden;background:linear-gradient(145deg,var(--tone-a),var(--tone-b))}.process-visual img{display:block;width:100%;height:100%;object-fit:cover}.process-copy h2{font-size:var(--h2);line-height:.9;letter-spacing:-.07em;font-weight:500;margin:18px 0 34px}.process-copy p{max-width:580px;margin:0;color:var(--muted);text-wrap:pretty}.credits-grid{margin-top:clamp(42px,7vw,90px);border-top:1px solid var(--line)}.credit{display:grid;grid-template-columns:minmax(190px,1fr) 2.25fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}.credit dt{font-size:11px;text-transform:uppercase;letter-spacing:.055em;color:var(--muted)}.credit dd{margin:0;line-height:1.55}.credit dd.names{font-size:clamp(16px,1.6vw,23px);line-height:1.5}
.project-nav{display:grid;grid-template-columns:1fr 1fr}.project-nav a{min-height:230px;padding:var(--pad);display:grid;align-content:space-between;border-right:1px solid var(--line);transition:background .25s,color .25s}.project-nav a:last-child{border-right:0;text-align:right}.project-nav a:hover{background:var(--fg);color:var(--bg)}.project-nav-label{font-size:10px;text-transform:uppercase;letter-spacing:.055em}.project-nav-title{font-size:clamp(26px,3.5vw,54px);line-height:.95;letter-spacing:-.055em}
.tone-ai{--tone-a:#03040a;--tone-b:#192141;--glow:rgba(116,151,255,.58)}.tone-crystal{--tone-a:#080604;--tone-b:#2a2119;--glow:rgba(231,185,113,.55)}.tone-ufo{--tone-a:#14030f;--tone-b:#3b0a30;--glow:rgba(255,120,216,.42)}.tone-matrix{--tone-a:#03111b;--tone-b:#0c4b59;--glow:rgba(52,222,244,.42)}.tone-titan{--tone-a:#160702;--tone-b:#441a08;--glow:rgba(255,128,48,.5)}.tone-xuanxin{--tone-a:#080808;--tone-b:#303030;--glow:rgba(255,255,255,.22)}.tone-ersha{--tone-a:#080807;--tone-b:#27231e;--glow:rgba(207,187,145,.34)}
@media(max-width:840px){.nav{grid-template-columns:1fr auto}.back{display:none}.hero{min-height:76svh}.hero-top,.hero-foot{align-items:flex-start}.hero-foot{flex-direction:column}.hero-title{margin:70px 0 48px}.summary,.text-section{grid-template-columns:1fr;gap:42px}.facts{grid-template-columns:1fr}.fact{min-height:190px;border-right:0;border-bottom:1px solid var(--line)}.fact:last-child{border-bottom:0}.gallery{grid-template-columns:1fr}.media-slot.wide{grid-column:auto}.process{grid-template-columns:1fr}.credit{grid-template-columns:1fr;gap:7px}.geometry{grid-template-columns:1fr}.geometry-item{border-right:0;border-bottom:1px solid var(--line);padding:18px 0}.project-nav{grid-template-columns:1fr}.project-nav a{min-height:180px;border-right:0;border-bottom:1px solid var(--line)}.project-nav a:last-child{text-align:left}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* 2026-07-27 R2: Chinese-primary bilingual titles and embedded project video */
html[data-lang="zh"] .bilingual-label .lang-zh,
html[data-lang="zh"] .bilingual-label .lang-en{display:block!important}
html[data-lang="zh"] .bilingual-label .lang-en{margin-top:5px;color:var(--muted);font-size:.78em;line-height:1.25;letter-spacing:.045em;font-weight:400}
html[data-lang="en"] .bilingual-label .lang-en{display:block!important}
.dual-title>.lang-zh,.dual-title>.lang-en{display:block}
html[data-lang="zh"] .dual-title>.lang-zh{display:block!important}
html[data-lang="zh"] .dual-title>.lang-en{display:block!important;margin-top:.22em;color:var(--muted);font-size:.3em;line-height:1.18;letter-spacing:.005em;font-weight:400}
html[data-lang="en"] .dual-title>.lang-zh{display:none!important}
html[data-lang="en"] .dual-title>.lang-en{display:block!important;margin-top:0;color:inherit;font-size:1em;line-height:inherit;letter-spacing:inherit;font-weight:inherit}
.external-video{width:min(100%,1180px);margin:0 auto clamp(22px,4vw,54px);aspect-ratio:16/9;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.1)}
.external-video iframe{display:block;width:100%;height:100%;border:0}
.hero-media.hero-media-contain{object-fit:cover;object-position:center}
.hero-media.round-hero-position{object-position:center 57%}
@media(max-width:840px){.external-video{width:100%;margin-bottom:28px}.hero-media.round-hero-position{object-position:center 55%}}


/* 2026-07-27 R3: editorial hierarchy and project-page consistency */
.adaptation-section{background:#101010}
.adaptation-section .text-body p{max-width:760px}
.credit dd>span{white-space:pre-line}
.tone-xuanxin .hero-media{object-position:center 54%}
.tone-matrix .hero-media{object-position:center 50%}
@media(max-width:840px){
  .adaptation-section{padding-top:72px;padding-bottom:72px}
  .tone-xuanxin .hero-media{object-position:center 50%}
}