@font-face{font-family:"Noto Serif SC";src:url("../assets/fonts/noto-serif-sc-subset.woff2") format("woff2");
  font-weight:200 900;font-display:swap}
@font-face{font-family:Lora;src:url("../assets/fonts/lora-subset.woff2") format("woff2");
  font-weight:400 700;font-display:swap}

/* ========== tokens ========== */
:root{
  --wood:#26221c; --mat:#f2eee3;
  --bg:#141413; --bg-deep:#0e0d0c; --ink:#faf9f5; --ink-dim:#b0aea5;
  --accent:#ebdbbc; --accent-dim:rgba(235,219,188,.4); --hairline:rgba(235,219,188,.12);
  --hairline-strong:rgba(235,219,188,.18);
  --nav-bg:rgba(14,13,12,.82); --dust:rgba(250,249,245,.045);
  --panel:#171614; --panel-hi:#1a1917; --frame-bg:#1c1b18; --frame-border:#2b2925;
  --overlay:rgba(10,9,8,.96); --overlay-strong:rgba(8,7,6,.97);
  --map-stroke:rgba(235,219,188,.35); --map-fill:rgba(235,219,188,.04);
  --spot:rgba(235,219,188,.11); --shadow:0 22px 55px rgba(0,0,0,.6);
  --trail:rgba(250,249,245,.30);
  --story-glow:rgba(235,219,188,.16); --beam-head:#fff6df;
  --serif:"Noto Serif SC",Lora,Georgia,"Songti SC","SimSun",serif;
  --sans:"Noto Sans SC",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
  --lat-serif:Lora,Georgia,"Times New Roman",serif;
  --w:min(72rem,92vw);
}
:root[data-theme="light"]{
  --wood:#443b2f; --mat:#fffef9;
  --bg:#faf9f5; --bg-deep:#f1efe7; --ink:#141413; --ink-dim:#6f6d66;
  --accent:#9c7c47; --accent-dim:rgba(156,124,71,.45); --hairline:rgba(20,20,19,.12);
  --hairline-strong:rgba(20,20,19,.2);
  --nav-bg:rgba(250,249,245,.85); --dust:rgba(20,20,19,.05);
  --panel:#f3f1e9; --panel-hi:#f6f4ed; --frame-bg:#fffdf9; --frame-border:#e3dfd3;
  --overlay:rgba(250,249,245,.97); --overlay-strong:rgba(244,242,236,.98);
  --map-stroke:rgba(20,20,19,.4); --map-fill:rgba(20,20,19,.04);
  --spot:rgba(156,124,71,.10); --shadow:0 18px 45px rgba(20,20,19,.16);
  --trail:rgba(20,20,19,.22);
  --story-glow:rgba(156,124,71,.15); --beam-head:#6f5122;
}
html[lang^="en"]{--serif:Lora,"Noto Serif SC",Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
/* 横向溢出保险：任何元素越界都不产生横向平移/缩小空间（clip 不破坏 sticky） */
html,body{overflow-x:clip}
@supports not (overflow-x:clip){html,body{overflow-x:hidden}}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.95;
  -webkit-font-smoothing:antialiased;transition:background .5s ease,color .5s ease}
/* 极稀疏星点底纹，若有若无 */
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(var(--dust) 1px,transparent 1px);background-size:210px 190px}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.35}
button{font-family:inherit}
::selection{background:var(--accent);color:var(--bg)}

/* ========== nav ========== */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:flex-end;align-items:center;
  padding:1rem clamp(1rem,4vw,2.5rem);transition:background .4s ease}
.nav.scrolled{background:var(--nav-bg);backdrop-filter:blur(12px)}
.nav nav{display:flex;gap:clamp(.7rem,2vw,1.6rem);align-items:center;font-size:.84rem;color:var(--ink-dim)}
.nav nav a{padding:.15rem 0;border-bottom:1px solid transparent;transition:color .3s,border-color .3s;letter-spacing:.06em}
.nav nav a:hover{color:var(--ink)}
.nav nav a.active{color:var(--accent);border-color:var(--accent-dim)}
#langToggle,#themeToggle{background:none;border:1px solid var(--accent-dim);color:var(--accent);font-size:.72rem;
  padding:.18rem .6rem;border-radius:2px;cursor:pointer;letter-spacing:.1em;line-height:1.4}
#langToggle:hover,#themeToggle:hover{background:var(--accent);color:var(--bg)}

/* ========== hero ========== */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:var(--bg);
  padding:5.5rem 1rem 3rem;transition:background .5s ease}
#stars{position:absolute;inset:0;width:100%;height:100%}
.hero-inner{position:relative;text-align:center;max-width:var(--w);z-index:2}
/* 片头「快门未关」：曝光期间名字带长曝光重影 */
.hc{transition:text-shadow 1.2s ease}
.hc.gh{text-shadow:5px 8px 12px rgba(235,219,188,.3)}
:root[data-theme="light"] .hc.gh{text-shadow:5px 8px 12px rgba(156,124,71,.3)}
.hero-inner h1{font-size:clamp(2.5rem,6.5vw,4.4rem);letter-spacing:.2em;font-weight:600}
.hero-en{display:block;font-family:var(--lat-serif);font-size:.32em;letter-spacing:.55em;color:var(--ink-dim);margin-top:1.2rem;font-weight:400}
.tagline{margin-top:2.2rem;font-family:var(--serif);font-size:clamp(1rem,2vw,1.2rem);letter-spacing:.18em}
.tagline-sub{margin-top:.9rem;color:var(--ink-dim);font-size:.82rem;letter-spacing:.34em}
/* 片头期间次要文字自始隐藏（避免“先闪现再消失”），.lit 后淡入 */
.hero-en,.tagline,.tagline-sub{opacity:0;transition:opacity 1.2s ease}
.hero.lit .hero-en,.hero.lit .tagline,.hero.lit .tagline-sub{opacity:1}

/* 听听我的故事：首屏唯一入口。光精灵（wisp.js）落进文字的瞬间给 .hero 加 .lit，
   暖光绽放浮现 + 落光丝线随之启动 */
.hero-story{position:relative;display:inline-block;margin-top:clamp(4.5rem,11vh,7rem);
  font-family:var(--serif);font-size:clamp(1.8rem,4.4vw,3rem);letter-spacing:.24em;text-indent:.24em;
  transition:color .5s ease;opacity:0}
.hero.lit .hero-story{opacity:1;animation:storyenter 1.6s cubic-bezier(.22,.61,.36,1)}
.hero-story:hover{color:var(--accent)}
@keyframes storyenter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
/* 文字后的暖光：绽放入场，之后缓慢呼吸 */
.hero-story::before{content:"";position:absolute;left:50%;top:50%;width:190%;height:420%;z-index:-1;
  transform:translate(-50%,-50%);pointer-events:none;opacity:0;
  background:radial-gradient(ellipse closest-side,var(--story-glow) 0%,transparent 68%)}
.hero.lit .hero-story::before{
  animation:storybloom 2s cubic-bezier(.22,.61,.36,1) forwards,
            storybreathe 6.4s ease-in-out 2.2s infinite}
@keyframes storybloom{from{opacity:0;transform:translate(-50%,-50%) scale(.82)}to{opacity:.9;transform:translate(-50%,-50%) scale(1)}}
@keyframes storybreathe{0%,100%{opacity:.55}50%{opacity:1}}
/* 落光丝线：字底一条极细的光轨，一滴光珠周期性坠向画面下缘 */
.story-beam{position:absolute;left:50%;top:calc(100% + 1.3rem);width:1px;height:clamp(90px,17vh,160px);
  transform:translateX(-50%);pointer-events:none;
  background:linear-gradient(180deg,var(--accent-dim),transparent);
  opacity:0;transition:opacity 1.2s ease .5s}
.hero.lit .story-beam{opacity:.45}
.story-beam::after{content:"";position:absolute;left:-1.5px;top:0;width:4px;height:40px;border-radius:3px;
  background:linear-gradient(180deg,transparent,var(--accent) 55%,var(--beam-head));
  box-shadow:0 0 14px 1px var(--accent-dim);opacity:0}
.hero.lit .story-beam::after{animation:beamfall 4.4s cubic-bezier(.5,.05,.65,.9) 1.8s infinite}
@keyframes beamfall{0%{transform:translateY(-48px);opacity:0}14%{opacity:1}60%{opacity:.95}90%,100%{transform:translateY(170px);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .hero.lit .hero-story,.hero.lit .hero-story::before{animation:none}
  .hero.lit .hero-story::before{opacity:.8}
  .hero.lit .story-beam::after{animation:none;opacity:.7;top:26%}
}

/* 首屏下滑引导：固定在视口右下角的竖排提示（不受首屏内容高度影响），
   竖线内一颗下坠光点，滚动即隐，闲置片刻轻微提亮 */
.scroll-cue{position:fixed;right:clamp(1rem,2.5vw,2rem);bottom:1.3rem;z-index:30;
  display:flex;flex-direction:column;align-items:center;gap:.7rem;
  color:var(--ink-dim);font-size:.66rem;text-transform:uppercase;
  opacity:0;transition:opacity .9s ease,color .6s ease;pointer-events:none}
.scroll-cue .sc-text{writing-mode:vertical-rl;letter-spacing:.4em}
.hero.cue-on .scroll-cue{opacity:.8;pointer-events:auto}
.scroll-cue .sc-line{width:1px;height:44px;background:var(--hairline-strong);position:relative;overflow:hidden}
.scroll-cue .sc-line::after{content:"";position:absolute;left:-1.5px;top:-9px;width:4px;height:9px;border-radius:2px;
  background:var(--accent);animation:scdrop 2.1s cubic-bezier(.45,.05,.6,.9) infinite}
@keyframes scdrop{0%{transform:translateY(0);opacity:0}14%{opacity:1}72%{opacity:1}100%{transform:translateY(62px);opacity:0}}
.scroll-cue:hover{color:var(--accent)}
.hero.cue-urge .scroll-cue{opacity:1;color:var(--accent)}
.hero.cue-urge .sc-line{background:var(--accent-dim)}
@media (prefers-reduced-motion:reduce){.scroll-cue .sc-line::after{animation:none;top:40%;opacity:1}}

/* ========== 章节 / title card / 暗场 ========== */
.chapter{position:relative;max-width:var(--w);margin:0 auto;padding:6rem 0 4.5rem}
/* 章节过渡带：与页面同色，铺一层细星（浅色主题下为纸上墨点星） */
.fade-band{height:18vh;background:var(--bg);position:relative;overflow:hidden}
.fade-band canvas{position:absolute;inset:0;width:100%;height:100%}
.titlecard{display:flex;align-items:baseline;gap:1.2rem;margin-bottom:4.2rem}
.tc-num{font-family:var(--lat-serif);color:var(--accent);font-size:.95rem;letter-spacing:.22em}
.tc-line{flex:0 0 clamp(2.5rem,8vw,6rem);height:1px;background:var(--accent-dim);align-self:center}
.titlecard h2{font-size:clamp(1.6rem,3.4vw,2.3rem);letter-spacing:.22em}
.tc-en{font-family:Lora,"Noto Serif SC",Georgia,serif;font-size:.52em;letter-spacing:.5em;color:var(--ink-dim);margin-left:1.1rem;font-weight:400}
html[lang^="en"] .tc-en{letter-spacing:.3em}

/* ========== reveal 入场 ========== */
.reveal{opacity:0;transform:translateY(24px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.reveal.on{opacity:1;transform:none}

/* ========== 颗粒桥（无痕融入）& AIGC ========== */
.grain-bridge{height:32vh;position:relative;background:transparent;
  -webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);
  mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}
.grain-bridge canvas{position:absolute;inset:0;width:100%;height:100%}
.aigc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}
.aigc-card{border:1px solid var(--hairline);padding:2.2rem;background:linear-gradient(170deg,var(--panel-hi),var(--bg))}
.aigc-tag{color:var(--accent);font-size:.7rem;letter-spacing:.28em;font-family:var(--lat-serif)}
.aigc-card h3{font-size:1.05rem;letter-spacing:.06em;margin-top:.9rem}
.aigc-card p{color:var(--ink-dim);font-size:.85rem;margin-top:.8rem}

/* ========== films ========== */
.films{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2.6rem}
.film{cursor:pointer}
.film-poster{aspect-ratio:2/3;overflow:hidden;background:var(--bg-deep);border:1px solid var(--hairline);position:relative}
.film-poster img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.film:hover .film-poster img{transform:scale(1.04)}
.film-poster.typo{display:grid;place-items:center;text-align:center;padding:1rem;
  background:linear-gradient(165deg,var(--panel-hi),var(--bg-deep))}
.film-poster.typo span{font-family:var(--serif);font-size:1.5rem;letter-spacing:.3em;color:var(--accent);writing-mode:vertical-rl}
.film-meta{margin-top:1.1rem}
.film-title{font-size:1.08rem;letter-spacing:.1em}
.film-sub{color:var(--ink-dim);font-size:.79rem;margin-top:.35rem;letter-spacing:.04em}
/* 影片卡可点提示 */
.film-open{display:inline-block;margin-top:.55rem;color:var(--accent);font-size:.74rem;
  letter-spacing:.1em;border-bottom:1px solid var(--accent-dim);padding-bottom:.1rem;
  transition:border-color .3s ease}
.film:hover .film-open{border-color:var(--accent)}
.badge{display:inline-block;font-size:.7rem;color:var(--accent);border:1px solid var(--accent-dim);
  padding:.06rem .55rem;margin:.55rem .4rem 0 0;border-radius:2px;letter-spacing:.05em}

/* ========== 影片详情浮层 ========== */
.overlay{position:fixed;inset:0;z-index:80;background:var(--overlay);overflow:auto;
  display:grid;place-items:center;padding:4.5rem 1.5rem 3rem}
.film-sheet{max-width:58rem;display:grid;gap:2.8rem;grid-template-columns:minmax(200px,300px) 1fr;align-items:start}
.sheet-poster img{border:1px solid var(--hairline)}
.film-poster.typo.tall{aspect-ratio:2/3}
.sheet-info h3{font-size:1.6rem;letter-spacing:.12em}
.sheet-syn{color:var(--ink-dim);font-size:.9rem;margin-top:1.4rem;text-align:justify}
/* 影片技术规格：目录页式小注 */
.sheet-specs{margin:1.6rem 0 0;border-top:1px solid var(--hairline);padding-top:1.2rem;
  display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.6rem}
.sheet-specs div{display:contents}
.sheet-specs dt{color:var(--accent);font-size:.72rem;letter-spacing:.18em;white-space:nowrap;line-height:1.9}
.sheet-specs dd{margin:0;color:var(--ink-dim);font-size:.8rem;letter-spacing:.02em;line-height:1.9}
.sheet-label{color:var(--accent);font-size:.72rem;letter-spacing:.25em;margin-top:1.8rem;margin-bottom:.7rem}
.sheet-close{position:fixed;top:1.1rem;right:1.4rem;z-index:81;font-size:1.9rem;color:var(--ink-dim);
  background:none;border:none;cursor:pointer}
.sheet-close:hover{color:var(--accent)}
/* 详情页底部返回（手机上叉太小的兜底出口） */
.sheet-back{display:block;margin:2.6rem auto 0;background:none;border:1px solid var(--accent-dim);
  color:var(--accent);font:inherit;font-size:.88rem;letter-spacing:.14em;
  padding:.55rem 2.2rem;border-radius:3px;cursor:pointer;transition:background .3s,color .3s}
.sheet-back:hover{background:var(--accent);color:var(--bg)}
@media (max-width:700px){.film-sheet{grid-template-columns:1fr}}

/* ========== research ========== */
.resume-bar{margin:-1.8rem 0 3rem}
.resume-bar a{display:inline-block;border:1px solid var(--accent-dim);color:var(--accent);
  padding:.45rem 1.3rem;font-size:.8rem;letter-spacing:.14em;transition:background .3s,color .3s}
.resume-bar a:hover{background:var(--accent);color:var(--bg)}
.timeline{border-left:1px solid var(--hairline-strong);padding-left:2.2rem;display:flex;flex-direction:column;gap:2.6rem;max-width:46rem}
.tl-item{position:relative}
.tl-item::before{content:"";position:absolute;left:calc(-2.2rem - 3.5px);top:.6rem;width:7px;height:7px;border-radius:50%;background:var(--accent)}
.tl-time{color:var(--accent);font-size:.74rem;letter-spacing:.18em;font-family:var(--lat-serif)}
.tl-title{font-size:1.05rem;margin-top:.3rem;letter-spacing:.05em}
.tl-desc{color:var(--ink-dim);font-size:.85rem;margin-top:.3rem}
.papers{margin-top:3.6rem;max-width:46rem}
.paper{display:block;padding:1.1rem 0;border-top:1px solid var(--hairline);color:var(--ink-dim);font-size:.82rem;transition:color .3s;line-height:1.7}
.paper:hover{color:var(--ink)}
.paper .p-title{color:var(--ink);font-size:.92rem}

/* ========== The World I See 画展厅（两排画墙） ========== */
.exhibit{display:grid;grid-template-columns:minmax(240px,330px) 1fr;gap:3.5rem;align-items:start}
.exhibit-intro{position:sticky;top:6rem;padding:2.4rem;border:1px solid var(--hairline);
  background:linear-gradient(160deg,var(--panel-hi),var(--bg))}
.exhibit-intro h3{font-size:1.45rem;letter-spacing:.28em}
.exhibit-intro .en-title{font-family:var(--lat-serif);color:var(--ink-dim);letter-spacing:.22em;font-size:.8rem;margin-top:.6rem}
.exhibit-intro .credit{color:var(--accent);font-size:.76rem;margin:1.5rem 0 1.2rem;letter-spacing:.16em}
.exhibit-intro p{color:var(--ink-dim);font-size:.83rem;line-height:2.15;text-align:justify;margin-top:.6rem}
.exhibit-wall{display:flex;flex-direction:column;gap:clamp(3rem,5vh,4.5rem);padding-top:1.5rem}
.wall-row{display:flex;align-items:flex-start;gap:clamp(1.6rem,3vw,2.6rem)}
/* 对齐画廊行：flex-grow = 宽高比（JS 内联），basis 抵消画框固定内边距，每行等高铺满 */
.artwork{position:relative;margin:0;min-width:0;text-align:center;flex-shrink:1;flex-basis:56px}
/* 射灯光锥 */
.artwork::before{content:"";position:absolute;left:50%;top:-3.5rem;transform:translateX(-50%);
  width:135%;height:calc(100% + 7rem);pointer-events:none;
  background:radial-gradient(ellipse 48% 42% at 50% 13%,var(--spot),transparent 68%)}
/* 真实画框：深木外框 + 卡纸内衬，保持原始宽高 */
.artwork .frame{position:relative;display:block;padding:clamp(7px,.8vw,12px);background:var(--wood);
  border-radius:2px;cursor:pointer;transition:transform .6s ease;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),inset 0 0 0 2px rgba(0,0,0,.35),
    0 26px 48px rgba(0,0,0,.55),0 8px 16px rgba(0,0,0,.35)}
:root[data-theme="light"] .artwork .frame{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),inset 0 0 0 2px rgba(0,0,0,.2),
    0 20px 38px rgba(20,20,19,.22),0 6px 12px rgba(20,20,19,.14)}
.artwork .frame:hover{transform:scale(1.018)}
.artwork .mat{display:block;background:var(--mat);padding:clamp(10px,1.4vw,20px);
  box-shadow:inset 0 1px 5px rgba(0,0,0,.28);font-size:0}
.artwork .frame img{display:block;width:100%;height:auto}
.artwork figcaption{margin-top:1rem;text-align:center;color:var(--ink-dim);font-size:.71rem;letter-spacing:.2em}
.art-num{color:var(--accent);margin-right:.8rem;font-family:var(--lat-serif)}
@media (max-width:860px){
  .exhibit{grid-template-columns:1fr}
  .exhibit-intro{position:static}
}

/* ========== 画展 → 地图：向下引导 + 飞机（右下 → 左上，尾迹云） ========== */
.travel-bridge{position:relative;left:50%;transform:translateX(-50%);width:100vw;height:26vh;
  margin:2.5rem 0 1rem;overflow:hidden;pointer-events:none}
/* 前言墙底部的地图跳转引导 */
.map-cue{display:flex;align-items:baseline;justify-content:center;gap:.7rem;
  margin-top:1.8rem;padding-top:1.4rem;border-top:1px solid var(--hairline);
  font-family:var(--serif);font-size:.98rem;letter-spacing:.18em;color:var(--ink);
  transition:color .35s ease}
.map-cue:hover{color:var(--accent)}
.map-cue .story-arrow{font-size:.8em;color:var(--accent);animation:storydip 2.4s ease-in-out infinite}
@keyframes storydip{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(.35em);opacity:1}}
.flight{position:absolute;left:0;top:0;width:42px;height:42px;opacity:0;will-change:transform}
.flight .plane{width:42px;height:42px;fill:var(--accent);transform:rotate(90deg)}
.flight .trail{position:absolute;right:34px;top:13px;width:34vw;height:1.6px;border-radius:2px;
  background:linear-gradient(270deg,var(--trail),transparent 88%)}
.flight .trail.t2{top:27px;width:27vw}

/* ========== 星空章节背景（全宽星空，不占文档流） ========== */
/* 星空章节上叠进宇宙序列尾部：画出的银河下落，与第一张照片重合后淡出 */
#astro{overflow:visible;z-index:2;margin-top:-92vh}
#astroWrap{position:absolute;inset:0;left:50%;width:100vw;transform:translateX(-50%);z-index:-1;overflow:hidden}
#astroWrap canvas{width:100%;height:100%}

/* ========== 大图滑动组件（Swiper：中间亮、两侧露出压暗、原始宽高） ========== */
.viewer{margin:0 auto;max-width:100%}
.viewer-main{position:relative;height:clamp(300px,54vh,560px);overflow:hidden}
.viewer-main .swiper-wrapper{align-items:center;height:100%}
.viewer-main .swiper-slide{width:auto;height:100%;display:flex;align-items:center;cursor:pointer;
  opacity:.35;filter:brightness(.85);transition:opacity .5s ease,filter .5s ease}
/* 尺寸由 JS 按宽高比显式计算（加载前后一致，保证居中精确、原比例不裁切） */
.viewer-main .swiper-slide img{display:block;border-radius:clamp(12px,1.6vw,22px);
  border:1px solid var(--hairline-strong);box-shadow:var(--shadow)}
.viewer-main .swiper-slide-active{opacity:1;filter:none;cursor:zoom-in}
.vw-arr{position:absolute;top:50%;transform:translateY(-50%);width:2.6rem;height:2.6rem;border-radius:50%;
  border:none;cursor:pointer;background:rgba(10,9,8,.45);color:#faf9f5;
  display:grid;place-items:center;padding:0;font-size:1.45rem;line-height:0;text-indent:0;
  opacity:0;transition:opacity .35s,background .3s;backdrop-filter:blur(6px);z-index:2}
.vw-arr span{display:block;transform:translateY(-1px)}
.viewer-main:hover .vw-arr{opacity:1}
.vw-arr:hover{background:rgba(10,9,8,.72)}
.vw-prev{left:.9rem}.vw-next{right:.9rem}
.vw-dock{display:flex;gap:.5rem;justify-content:flex-start;width:fit-content;margin:1.2rem auto 0;
  padding:.45rem;max-width:100%;overflow-x:auto;scrollbar-width:none;
  background:rgba(10,9,8,.42);backdrop-filter:blur(8px);border-radius:14px}
:root[data-theme="light"] .vw-dock{background:rgba(20,20,19,.08)}
.vw-dock::-webkit-scrollbar{display:none}
.vw-th{width:3.2rem;height:2.3rem;flex:0 0 auto;object-fit:cover;border-radius:9px;cursor:pointer;
  border:1px solid rgba(255,255,255,.25);opacity:.72;transition:opacity .3s,transform .3s,border-color .3s}
:root[data-theme="light"] .vw-th{border-color:rgba(20,20,19,.2)}
.vw-th:hover{opacity:1}
.vw-th.on{opacity:1;border-color:var(--accent);transform:scale(1.08)}
.vw-cap{margin-top:1rem;text-align:center;color:var(--ink-dim);font-size:.85rem;letter-spacing:.22em}
.viewer.small .viewer-main{height:clamp(200px,34vh,340px)}
.viewer.small .vw-th{width:2.6rem;height:1.9rem}

/* ========== 通用画廊（备用） & 空状态 ========== */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.2rem}
.gallery a{position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--bg-deep);cursor:pointer}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.gallery a:hover img{transform:scale(1.05)}
.gallery .cap{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .8rem .6rem;color:#faf9f5;
  background:linear-gradient(transparent,rgba(10,9,8,.82));font-size:.72rem;letter-spacing:.16em;opacity:0;transition:opacity .4s}
.gallery a:hover .cap{opacity:1}
.empty-state{border:1px dashed var(--accent-dim);padding:3.6rem 1rem;text-align:center;
  color:var(--ink-dim);letter-spacing:.22em;font-size:.85rem}

/* ========== about（左文右照，撑满章节宽度） ========== */
.about-main{display:grid;grid-template-columns:1fr auto;gap:clamp(3rem,8vw,7rem);align-items:start}
.bio p{max-width:46rem}
/* 照片：2:3 竖裁，高度由 JS 精确设为左栏高度（标题顶、按钮底对齐） */
.about-photo{margin:0;padding:6px;border:1px solid var(--hairline-strong);border-radius:14px;
  display:flex}
.about-photo img{height:100%;width:auto;aspect-ratio:2/3;object-fit:cover;border-radius:9px;display:block}
@media (max-width:760px){.about-main{grid-template-columns:1fr}
  .about-photo{max-width:300px;margin:0 auto;height:auto!important}
  .about-photo img{width:100%;height:auto}}
.bio p{color:var(--ink-dim);text-align:justify;font-size:.95rem}
.contact-row{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:2.6rem}
.contact-row a{border:1px solid var(--accent-dim);color:var(--accent);padding:.5rem 1.4rem;
  font-size:.8rem;letter-spacing:.14em;transition:background .3s,color .3s}
.contact-row a:hover{background:var(--accent);color:var(--bg)}

/* ========== footer ========== */
footer{padding:4rem 1rem 3rem;text-align:center;color:var(--ink-dim);font-size:.74rem;letter-spacing:.22em}

/* ========== 世界地图（全幅沉浸舞台） ========== */
.worldmap{margin-top:4rem}
.map-hint{color:var(--ink-dim);font-size:.82rem;letter-spacing:.2em;margin-bottom:1.2rem;text-align:center}
.map-wrap{position:relative;width:100vw;margin-left:calc(50% - 50vw);
  height:clamp(420px,72vh,780px)}
.map-wrap svg{width:100%;height:100%;display:block;touch-action:pan-y}
.map-wrap svg.zoomed{cursor:grab;touch-action:none}
.map-wrap svg.zoomed:active{cursor:grabbing}
.map-outline{fill:var(--map-fill);stroke:var(--map-stroke);stroke-width:.8;stroke-linejoin:round;stroke-linecap:round}
/* 图钉：呼吸光环圆点 */
.pin{cursor:pointer}
.pin .core{fill:var(--accent);transition:transform .4s cubic-bezier(.22,.61,.36,1);
  transform-box:fill-box;transform-origin:center}
.pin:hover .core{transform:scale(1.7)}
.pin .halo{fill:none;stroke:var(--accent);stroke-width:1;opacity:0;
  transform-box:fill-box;transform-origin:center;animation:halo 3.2s ease-out infinite}
@keyframes halo{0%{transform:scale(.4);opacity:.6}70%{transform:scale(1.5);opacity:0}100%{opacity:0}}
/* 聚合点 */
.cluster{cursor:pointer}
.cluster circle{fill:var(--panel);stroke:var(--accent-dim);stroke-width:1;
  transition:transform .4s cubic-bezier(.22,.61,.36,1);transform-box:fill-box;transform-origin:center}
.cluster:hover circle{transform:scale(1.15)}
.cluster text{fill:var(--accent);font-family:var(--lat-serif);font-size:11px;text-anchor:middle;dominant-baseline:central}
/* 返回全图 */
.map-reset{position:absolute;top:1rem;right:max(1rem,calc((100vw - min(72rem,92vw))/2));z-index:6;
  border:1px solid var(--accent-dim);color:var(--accent);
  background:var(--nav-bg);backdrop-filter:blur(8px);border-radius:3px;
  font-size:.74rem;letter-spacing:.12em;padding:.4rem 1rem;cursor:pointer;
  opacity:0;pointer-events:none;transition:opacity .5s ease,background .3s,color .3s}
.map-reset.show{opacity:1;pointer-events:auto}
.map-reset:hover{background:var(--accent);color:var(--bg)}
/* 图钉 hover 小卡片：柔和缓入 */
.pin-card{position:absolute;z-index:5;pointer-events:none;min-width:8.5rem;max-width:16rem;padding:.75rem 1.05rem;
  background:var(--nav-bg);backdrop-filter:blur(10px);border:1px solid var(--hairline-strong);border-radius:12px;
  box-shadow:var(--shadow);opacity:0;transform:translate(-50%,4px);transform-origin:bottom center;
  transition:opacity .5s ease .05s,transform .6s cubic-bezier(.22,.61,.36,1) .05s}
.pin-card.show{opacity:1;transform:translate(-50%,-16px)}
.pin-card h5{font-family:var(--serif);font-size:.92rem;letter-spacing:.12em;line-height:1.5}
.pin-card p{color:var(--ink-dim);font-size:.7rem;letter-spacing:.1em;margin-top:.15rem}
/* 近邻城市选择卡 */
.pin-chooser{position:absolute;z-index:7;display:flex;flex-direction:column;min-width:7.5rem;
  background:var(--nav-bg);backdrop-filter:blur(10px);border:1px solid var(--accent-dim);
  border-radius:12px;overflow:hidden;box-shadow:var(--shadow);
  opacity:0;transform:translate(-50%,calc(-100% - 2px));
  transition:opacity .35s ease,transform .45s cubic-bezier(.22,.61,.36,1)}
.pin-chooser.show{opacity:1;transform:translate(-50%,calc(-100% - 14px))}
.pin-chooser button{background:none;border:none;color:var(--ink);font:inherit;font-size:.88rem;
  letter-spacing:.12em;padding:.6rem 1.2rem;cursor:pointer;border-bottom:1px solid var(--hairline)}
.pin-chooser button:last-child{border-bottom:none}
.pin-chooser button:hover{background:var(--accent);color:var(--bg)}
.loc-panel{margin-top:2rem;border:1px solid var(--hairline);padding:2rem;background:var(--panel)}
.loc-panel h4{letter-spacing:.2em;font-size:1.05rem}
.loc-empty{color:var(--ink-dim);letter-spacing:.16em;font-size:.83rem;margin-top:.8rem}
.loc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin-top:1.2rem}
.loc-grid img,.loc-grid video{width:100%;aspect-ratio:3/2;object-fit:cover;cursor:pointer;border:1px solid var(--hairline)}

/* ========== 首访引导：右上角开关的光亮提示（位置由 JS 实测按钮定位） ========== */
.onboard{position:fixed;inset:0;z-index:48;cursor:pointer;
  background:radial-gradient(circle 170px at var(--obx,calc(100% - 92px)) var(--oby,38px),transparent 45%,rgba(5,4,3,.62) 100%);
  opacity:0;transition:opacity .7s ease}
.onboard.show{opacity:1}
.onboard-ring{position:absolute;border:1.5px solid var(--accent);border-radius:999px;
  box-shadow:0 0 34px 8px var(--accent-dim),inset 0 0 18px rgba(235,219,188,.15);
  animation:onbpulse 1.9s ease-in-out infinite}
@keyframes onbpulse{0%,100%{transform:scale(1);opacity:.95}50%{transform:scale(1.1);opacity:.45}}
.onboard-tip{position:absolute;max-width:16rem;text-align:right;
  color:#faf9f5;font-family:var(--serif);font-size:.9rem;letter-spacing:.12em;line-height:1.9;
  text-shadow:0 2px 14px rgba(0,0,0,.7)}

/* ========== 宇宙缩放序列（地图->地球->太阳系->银河->星空） ========== */
/* 负上边距让定幕时刻恰好等于地图居中时刻（86vh = 50vh + 地图半高 36vh，4.5rem = 章节底留白）；
   pointer-events:none 让下方真实地图保持可交互 */
.cosmos{position:relative;width:100vw;margin-left:calc(50% - 50vw);height:560vh;
  margin-top:calc(-86vh - 4.5rem);pointer-events:none}
.cosmos-stage{position:sticky;top:0;height:100vh;overflow:hidden}
.cosmos-stage canvas{width:100%;height:100%;display:block}
.cosmos-cap{position:absolute;left:0;right:0;bottom:12vh;text-align:center;pointer-events:none;
  font-family:var(--serif);font-size:clamp(1rem,2.2vw,1.4rem);letter-spacing:.4em;color:var(--ink-dim);
  opacity:0;transition:opacity .3s linear}

/* ========== lightbox ========== */
.lightbox{position:fixed;inset:0;z-index:90;background:var(--overlay-strong);display:grid;place-items:center}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:84vh;object-fit:contain}
.lb-cap{position:absolute;bottom:1.6rem;left:0;right:0;text-align:center;color:var(--ink-dim);font-size:.8rem;letter-spacing:.16em}
.lb-btn{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--ink-dim);font-size:2.4rem;cursor:pointer;padding:1rem;line-height:1}
.lb-btn:hover{color:var(--accent)}
.lb-prev{left:.4rem}.lb-next{right:.4rem}
.lb-close{top:1.4rem;right:1rem;transform:none;font-size:1.9rem}
/* 大图底部返回：默认隐藏，触屏显示 */
.lb-back{position:absolute;left:50%;bottom:3.4rem;transform:translateX(-50%);display:none;
  background:rgba(10,9,8,.5);border:1px solid var(--accent-dim);color:var(--accent);
  font:inherit;font-size:.9rem;letter-spacing:.14em;padding:.5rem 2rem;border-radius:999px;cursor:pointer}
@media (hover: none){
  .lb-back{display:block}
  .lb-close{font-size:2.5rem;padding:1.2rem;top:.6rem;right:.4rem}
}

/* ========== 移动端 ========== */
@media (max-width:640px){
  /* 移动端滚动性能：去掉全屏 fixed 星尘层与导航毛玻璃（两大滚动重绘源） */
  body::after{display:none}
  .nav.scrolled{backdrop-filter:none;background:var(--bg)}
  .nav{padding:.8rem .7rem}
  .nav nav{gap:.5rem;font-size:.72rem;letter-spacing:0}
  .nav nav a{letter-spacing:.02em}
  #langToggle,#themeToggle{padding:.14rem .4rem;font-size:.66rem}
  .nav nav a[href="#astro"]{display:none} /* 窄屏收纳次要锚点 */
  /* 移动端全面压紧板块间距 */
  .chapter{padding:2.6rem 0 2.2rem}
  .fade-band{height:7vh}
  .titlecard{flex-wrap:wrap;gap:.8rem;margin-bottom:2rem}
  .travel-bridge{height:13vh;margin:1.2rem 0 .5rem}
  .worldmap{margin-top:2rem}
  .map-wrap{height:clamp(380px,62vh,600px)}
  .cosmos{height:460vh;margin-top:calc(-81vh - 2.2rem)}
  #astro{margin-top:-78vh}
  .exhibit-wall{gap:2rem}
  .exhibit{gap:2rem}
  .films{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1.4rem}
  .overlay{padding:3.5rem 1rem 2rem}
  /* 手机上详情页文字加大一档 */
  .sheet-syn{font-size:.98rem;line-height:2.05}
  .sheet-label{font-size:.8rem}
  .sheet-specs dt{font-size:.78rem}
  .sheet-specs dd{font-size:.88rem}
  .film-sub{font-size:.88rem}
  .hero{padding-top:6rem}
  .story-beam{height:clamp(70px,12vh,110px)}
}

/* ========== 英文排版适配：拉丁文本收字距、长文左对齐 ========== */
html[lang^="en"] body{line-height:1.8}
html[lang^="en"] p{letter-spacing:.01em}
html[lang^="en"] .bio p,
html[lang^="en"] .exhibit-intro p,
html[lang^="en"] .sheet-syn{text-align:left;letter-spacing:.01em}
html[lang^="en"] .sheet-specs dt{letter-spacing:.08em}
html[lang^="en"] .titlecard h2{letter-spacing:.06em}
html[lang^="en"] .tagline{letter-spacing:.05em}
html[lang^="en"] .tagline-sub{letter-spacing:.2em}
html[lang^="en"] .hero-story{letter-spacing:.08em;text-indent:.08em}
/* 英文版整体去中文：拉丁姓名缩字号、章节副标（中文小字）隐藏 */
html[lang^="en"] .hero-inner h1{font-size:clamp(1.9rem,4.8vw,3.3rem);letter-spacing:.05em}
html[lang^="en"] .tc-en{display:none}
html[lang^="en"] .map-cue{letter-spacing:.05em}
html[lang^="en"] .map-hint{letter-spacing:.08em}
html[lang^="en"] .film-title{letter-spacing:.02em}
html[lang^="en"] .film-sub{letter-spacing:0}
html[lang^="en"] .tl-title{letter-spacing:.01em}
html[lang^="en"] .tl-desc,html[lang^="en"] .aigc-card p{letter-spacing:0}
html[lang^="en"] .exhibit-intro h3{letter-spacing:.12em}
html[lang^="en"] .onboard-tip{letter-spacing:.04em}
html[lang^="en"] .loc-panel h4{letter-spacing:.05em}
html[lang^="en"] .sheet-info h3{letter-spacing:.04em}

/* ========== reduced motion ========== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .pin .halo{animation:none}
  .onboard-ring{animation:none}
  .hero-story .story-arrow,.map-cue .story-arrow{animation:none}
  .viewer-main .swiper-slide{transition:none}
  .flight{display:none}
}