/* ============================================================
   高研田野 · 共生   —  设计系统（沿用日程海报视觉语言）
   ============================================================ */
:root{
  --paper:#F1ECE0; --paper-2:#EAE3D3; --card:#F6F2E9; --line:#D8CFBB;
  --ink:#2B302A; --ink-2:#4A4E43; --ink-soft:#6B6E60;
  --cinnabar:#AF3F2C; --celadon:#6E9166;
  /* 品牌主色：深墨绿（沿用「共生」主题封面基调） */
  --pine:#1B4A3A; --pine-2:#123845; --pine-deep:#0E2C22; --gold:#C7A24E; --cream:#F1ECE0;
  --hero-grad:linear-gradient(155deg,#123A46 0%,#184A3B 52%,#123F2F 100%);
  --on-pine:#F1ECE0; --on-pine-soft:#BFCabd;
  --d1:#C29B41; --d2:#6E9166; --d3:#AE7285; --d4:#537A9A; --d5:#7772AE; --d6:#BE6B3B;
  --shadow:0 1px 0 rgba(43,48,42,.04), 0 18px 40px -28px rgba(43,48,42,.4);
  --serif:"Source Han Serif SC","Noto Serif SC","Songti SC","STSong","SimSun",serif;
  --sans:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
  --latin:"Baskerville","Hoefler Text","Iowan Old Style","Georgia",serif;
}
:root[data-theme="dark"]{
  --paper:#10231C; --paper-2:#15291F; --card:#182C21; --line:#2C3B31;
  --ink:#ECE7D8; --ink-2:#C7C3B4; --ink-soft:#93917F;
  --cinnabar:#DE7259; --celadon:#93B487;
  --pine:#16382B; --pine-2:#0F2C34; --pine-deep:#0A211A; --gold:#D8B662; --cream:#F1ECE0;
  --hero-grad:linear-gradient(155deg,#0E2A33 0%,#123829 55%,#0C271E 100%);
  --on-pine:#F1ECE0; --on-pine-soft:#B6C4B8;
  --d1:#D6B45B; --d2:#93B487; --d3:#C990A3; --d4:#7BA0C0; --d5:#9B96D2; --d6:#D98B5B;
  --shadow:0 1px 0 rgba(0,0,0,.2), 0 22px 46px -28px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); line-height:1.7; -webkit-font-smoothing:antialiased;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='0.035'/></svg>");
}
h1,h2,h3{font-family:var(--serif); font-weight:600; text-wrap:balance; margin:0; line-height:1.3}
p{margin:0 0 1em}
.wrap{max-width:1080px; margin:0 auto; padding:0 28px}
.eyebrow{font-family:var(--latin); font-style:italic; letter-spacing:.05em; color:var(--cinnabar); font-size:.92rem; margin:0}
.kicker{font-family:var(--sans); letter-spacing:.32em; text-transform:uppercase; font-size:.66rem; color:var(--ink-soft); font-weight:600}
.en{font-family:var(--latin); font-style:italic; color:var(--ink-soft)}

/* seal */
.seal{display:inline-grid; place-items:center; width:34px; height:34px; border-radius:5px;
  background:var(--cinnabar); color:#F1ECE0; font-family:var(--serif); font-weight:700; font-size:1.05rem;
  box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--cinnabar) 60%, #000 22%)}

/* ---------- top bar（品牌深绿）---------- */
.topbar{position:sticky; top:0; z-index:30; backdrop-filter:blur(8px);
  background:color-mix(in srgb,var(--pine) 92%, transparent); border-bottom:1px solid color-mix(in srgb,var(--gold) 26%, transparent)}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; height:58px; max-width:none; padding:0 26px}
.brand{display:flex; align-items:center; gap:11px; font-family:var(--serif); font-weight:600; letter-spacing:.12em; color:var(--on-pine)}
.brand small{display:block; font-family:var(--latin); font-style:italic; font-weight:400; letter-spacing:.02em; color:var(--on-pine-soft); font-size:.66rem}
/* 官方 logo（白色横版，压顶栏/页脚深绿底） */
.brand-logo{height:24px; width:auto; display:block}
footer.site-footer .brand-logo{height:26px}
/* hero 主办单位行内的官方 logo */
.hero-logo{height:30px; width:auto; display:inline-block; filter:drop-shadow(0 1px 6px rgba(0,0,0,.25))}
.navlinks{display:flex; gap:22px; align-items:center; font-size:.82rem}
.navlinks a{color:var(--on-pine-soft); text-decoration:none}
.navlinks a:hover{color:var(--gold)}
.tt{background:transparent; border:1px solid color-mix(in srgb,var(--cream) 40%, transparent); color:var(--on-pine); border-radius:20px; padding:5px 12px; font-size:.72rem; cursor:pointer; font-family:var(--sans)}
.tt:hover{border-color:var(--gold); color:var(--gold)}
.tt:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
/* 顶栏内印章：绿底上用金描朱印 */
.topbar .seal{background:var(--cinnabar); box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--cinnabar) 50%, #000 30%), 0 0 0 1px color-mix(in srgb,var(--gold) 40%, transparent)}
@media(max-width:720px){.navlinks a:not(.tt){display:none}}

/* ---------- hero（深绿主题封面）---------- */
.hero{padding:96px 0 84px; text-align:center; position:relative; overflow:hidden;
  background:var(--hero-grad); color:var(--on-pine)}
/* 禑印水印（左）与蝶形留白（右） */
.hero::before{content:"禑"; position:absolute; left:3%; top:50%; transform:translateY(-50%);
  font-family:var(--serif); font-weight:700; font-size:min(42vw,440px); line-height:1;
  color:color-mix(in srgb,var(--cream) 7%, transparent); pointer-events:none; user-select:none}
.hero::after{content:""; position:absolute; right:-6%; top:50%; transform:translateY(-50%);
  width:min(46vw,520px); aspect-ratio:1;
  background:radial-gradient(circle at 60% 40%, color-mix(in srgb,var(--gold) 9%, transparent), transparent 62%);
  pointer-events:none}
.hero .wrap{position:relative; z-index:2}
.hero .eyebrow{margin-bottom:20px; color:var(--gold)}
.hero-logos{display:flex; gap:20px; justify-content:center; align-items:center; margin-bottom:34px;
  font-family:var(--serif); font-size:.78rem; letter-spacing:.04em; color:var(--on-pine-soft); flex-wrap:wrap}
.hero-logos span{position:relative}
.hero-logos span+span::before{content:"｜"; position:absolute; left:-13px; color:color-mix(in srgb,var(--cream) 26%, transparent)}
.hero-title{font-family:var(--serif); font-weight:700; font-size:clamp(3.8rem,17vw,8rem); letter-spacing:.24em; line-height:1;
  margin:.04em 0 .16em; padding-left:.24em; color:var(--cream);
  text-shadow:0 2px 30px rgba(0,0,0,.25)}
.hero-rule{display:flex; align-items:center; justify-content:center; gap:16px; margin:0 auto 22px; max-width:440px; color:var(--on-pine-soft)}
.hero-rule::before,.hero-rule::after{content:""; height:1px; flex:1; background:color-mix(in srgb,var(--gold) 55%, transparent)}
.hero-rule span{font-family:var(--serif); letter-spacing:.14em; font-size:clamp(1rem,2.6vw,1.25rem)}
.hero-sub{font-family:var(--serif); font-size:clamp(1.02rem,2.6vw,1.3rem); color:var(--cream); letter-spacing:.06em; margin-bottom:22px; opacity:.94}
.hero-thesis{max-width:46ch; margin:0 auto 32px; color:var(--on-pine-soft); font-size:1.02rem}
.hero-thesis b{color:var(--gold); font-weight:600}
.spectrum{display:grid; grid-template-columns:repeat(6,1fr); gap:5px; max-width:520px; margin:0 auto}
.spectrum span{height:7px; border-radius:2px; box-shadow:0 1px 8px rgba(0,0,0,.2)}
.hero-meta{display:flex; gap:8px 26px; justify-content:center; flex-wrap:wrap; margin-top:26px; font-size:.82rem; color:var(--on-pine-soft)}
.hero-meta b{color:var(--cream)}
.scroll-cue{margin-top:38px; font-size:.72rem; letter-spacing:.2em; color:var(--on-pine-soft); text-transform:uppercase}
.scroll-cue::after{content:"↓"; display:block; margin-top:6px; font-size:1rem; color:var(--gold); animation:bob 1.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media(prefers-reduced-motion:reduce){.scroll-cue::after{animation:none}}

/* ---------- scrolly: map + steps ---------- */
.scrolly{position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:0}
@media(max-width:860px){.scrolly{grid-template-columns:1fr}}
.map-col{position:sticky; top:58px; height:calc(100vh - 58px); align-self:start}
@media(max-width:860px){.map-col{top:58px; height:64vh; z-index:5; box-shadow:var(--shadow)}}
#map{width:100%; height:100%; background:var(--paper-2)}
/* 常显点位名称（随滚动只显当天）*/
.site-label{position:absolute; left:19px; top:50%; transform:translateY(-50%); white-space:nowrap;
  font-family:var(--serif); font-size:.82rem; letter-spacing:.02em; color:var(--ink);
  background:color-mix(in srgb,var(--card) 90%, transparent); padding:2px 9px 2px 8px; border-radius:6px;
  border:1px solid var(--line); border-left:3px solid var(--c, var(--cinnabar)); box-shadow:var(--shadow);
  opacity:0; transform-origin:left center; pointer-events:none; transition:opacity .22s ease;}
.site-label.on{opacity:1; font-size:.98rem; font-weight:600; letter-spacing:.04em; padding:3px 12px 3px 10px}
/* 标签方位变体：密集点位防叠（左挂 / 上挂 / 下挂） */
.site-label--left{left:auto; right:24px; border-left:1px solid var(--line); border-right:3px solid var(--c, var(--cinnabar))}
.site-label--top{left:50%; top:auto; bottom:26px; transform:translateX(-50%);
  border-left:1px solid var(--line); border-bottom:3px solid var(--c, var(--cinnabar))}
.site-label--bottom{left:50%; top:26px; transform:translateX(-50%);
  border-left:1px solid var(--line); border-top:3px solid var(--c, var(--cinnabar))}

/* 极简地点标签（点位弹窗）*/
.pop-mini .maplibregl-popup-content{background:var(--card); color:var(--ink); border-radius:20px;
  padding:7px 14px 7px 11px; box-shadow:var(--shadow); border:1px solid var(--line); font-family:var(--sans)}
.pop-mini .maplibregl-popup-tip{border-top-color:var(--card)}
.pop-label{display:flex; align-items:center; gap:9px}
.pop-dot{width:9px; height:9px; border-radius:50%; flex:none; box-shadow:0 0 0 3px color-mix(in srgb,var(--card) 60%, transparent)}
.pop-text{display:flex; flex-direction:column; line-height:1.2}
.pop-name{font-family:var(--serif); font-size:1rem; letter-spacing:.02em; color:var(--ink)}
.pop-en{font-family:var(--latin); font-style:italic; font-size:.7rem; color:var(--ink-soft)}

/* map overlays */
.map-overlay{position:absolute; z-index:6; pointer-events:none}
.mo-title{top:16px; left:16px; max-width:60%}
.mo-title .kicker{color:var(--ink-2)}
.mo-daytheme{font-family:var(--serif); font-size:1.25rem; letter-spacing:.05em; margin-top:2px;
  background:color-mix(in srgb,var(--paper) 78%, transparent); padding:2px 10px; border-radius:6px; display:inline-block}
.mo-daytheme .en{font-size:.66rem; margin-left:.5em}
.chips{position:absolute; z-index:7; left:16px; bottom:76px; display:flex; flex-wrap:wrap; gap:6px; max-width:calc(100% - 32px); pointer-events:auto}
.chip{font-family:var(--sans); font-size:.74rem; border:1px solid var(--line); background:color-mix(in srgb,var(--card) 92%, transparent);
  color:var(--ink-2); border-radius:20px; padding:4px 12px; cursor:pointer; display:flex; align-items:center; gap:6px; backdrop-filter:blur(4px)}
.chip .dot{width:9px; height:9px; border-radius:50%}
.chip[aria-pressed="true"]{color:#fff; border-color:transparent; font-weight:600}
.slider-box{position:absolute; z-index:7; left:16px; right:16px; bottom:18px; pointer-events:auto;
  background:color-mix(in srgb,var(--card) 90%, transparent); border:1px solid var(--line); border-radius:24px;
  padding:8px 16px; display:flex; align-items:center; gap:12px; backdrop-filter:blur(6px); box-shadow:var(--shadow)}
.slider-box label{font-size:.7rem; color:var(--ink-soft); white-space:nowrap; font-family:var(--serif); letter-spacing:.08em}
.slider-box input{flex:1; accent-color:var(--cinnabar)}
@media(max-width:860px){.chips{bottom:70px} .slider-box{left:12px; right:12px}}

/* 地图侧「当日纪录片」播放按钮 */
.map-play{position:absolute; z-index:8; right:16px; top:74px; pointer-events:auto; cursor:pointer;
  display:flex; align-items:center; gap:9px; font-family:var(--serif); letter-spacing:.04em; font-size:.86rem;
  color:var(--cream); background:var(--c, var(--cinnabar)); border:0; border-radius:24px; padding:8px 15px 8px 11px;
  box-shadow:var(--shadow); transition:transform .15s ease, filter .15s ease}
.map-play:hover{transform:translateY(-1px); filter:brightness(1.06)}
.map-play[hidden]{display:none}
.map-play .mp-ico{display:grid; place-items:center; width:22px; height:22px; border-radius:50%;
  background:rgba(255,255,255,.22); font-size:.7rem; padding-left:2px}
@media(max-width:860px){.map-play{top:auto; bottom:120px; right:12px}}

/* 视频弹窗 */
.vm-backdrop{position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px;
  background:rgba(12,20,16,.72); backdrop-filter:blur(6px)}
.vm-backdrop[hidden]{display:none}
.vm-box{position:relative; width:min(960px, 94vw)}
.vm-title{color:var(--cream); font-family:var(--serif); letter-spacing:.05em; font-size:.98rem; margin-bottom:10px; text-align:center}
.vm-stage{border-radius:12px; overflow:hidden; background:#000; box-shadow:0 30px 80px -30px rgba(0,0,0,.8); border:1px solid rgba(255,255,255,.12)}
.vm-stage video,.vm-stage iframe{width:100%; aspect-ratio:16/9; display:block; border:0}
.vm-close{position:absolute; top:-42px; right:0; width:34px; height:34px; border-radius:50%; cursor:pointer;
  background:rgba(255,255,255,.14); color:var(--cream); border:1px solid rgba(255,255,255,.25); font-size:.9rem}
.vm-close:hover{background:rgba(255,255,255,.26)}

/* steps / 时间轴 */
.steps{padding:0}
.step{min-height:82vh; display:flex; flex-direction:column; justify-content:flex-start;
  scroll-margin-top:58px;
  padding:96px 40px 56px 44px; border-left:3px solid var(--day-color, var(--line))}
.step--cover{justify-content:center; padding-top:56px}
.step.intro{justify-content:center}
@media(max-width:860px){.step{min-height:auto; padding:44px 24px; border-left:0; border-top:1px solid var(--line)}
  .step:first-child{border-top:0}}
.step .eyebrow{margin-bottom:10px; color:var(--day-color, var(--cinnabar))}
.step-theme{font-family:var(--serif); font-size:clamp(1.5rem,3.6vw,2rem); letter-spacing:.06em; margin-bottom:4px; color:var(--pine)}
:root[data-theme="dark"] .step-theme{color:var(--cream)}
.step-theme .en{display:block; font-size:.7rem; letter-spacing:.04em; margin-top:6px; color:var(--ink-soft)}
.step-detail{color:var(--ink-2); max-width:44ch; margin:14px 0 22px}
.step.intro .hero-title{font-size:clamp(2.4rem,7vw,3.4rem); color:var(--pine); letter-spacing:.1em}
:root[data-theme="dark"] .step.intro .hero-title{color:var(--cream)}
.step.intro .step-theme{color:var(--pine)}

/* 当日视频 */
.tl-video{margin:0 0 20px; border-radius:12px; overflow:hidden; background:#000; box-shadow:var(--shadow); border:1px solid var(--line)}
.tl-video video,.tl-video iframe{width:100%; aspect-ratio:16/9; display:block; border:0}
.tl-vcap{background:var(--card); color:var(--ink-soft); font-size:.72rem; letter-spacing:.06em; padding:7px 12px; font-family:var(--latin); font-style:italic}
.tl-vlink{display:inline-block; margin:0 0 20px; background:var(--pine); color:var(--cream); text-decoration:none;
  padding:10px 18px; border-radius:22px; font-size:.86rem; letter-spacing:.04em; box-shadow:var(--shadow)}
.tl-vlink:hover{background:var(--cinnabar)}

/* ===== 图集时间轴：到访地点=轴线节点，图集突出、文字辅助 ===== */
.tl-axis{position:relative; margin-top:6px; padding-left:26px}
/* 竖轴 */
.tl-axis::before{content:""; position:absolute; left:6px; top:8px; bottom:8px; width:2px;
  background:linear-gradient(var(--day-color, var(--celadon)), color-mix(in srgb,var(--day-color,var(--celadon)) 25%, transparent))}
.tl-node{position:relative; margin-bottom:34px; cursor:pointer}
.tl-node:last-child{margin-bottom:6px}
/* 轴上的圆点标记 */
.tl-node::before{content:""; position:absolute; left:-26px; top:6px; width:15px; height:15px; border-radius:50%;
  background:var(--day-color, var(--celadon)); border:3px solid var(--paper);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--day-color,var(--celadon)) 45%, transparent); transition:transform .15s}
.tl-node:hover::before{transform:scale(1.25)}
.tl-node--hl::before{background:var(--paper); box-shadow:0 0 0 2px var(--day-color,var(--celadon))}
/* 标题=轴上标记文字（主，但克制） */
.tl-node-head{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:9px}
.tl-title{font-family:var(--serif); font-size:1.12rem; letter-spacing:.03em; color:var(--pine); display:flex; align-items:center; gap:8px}
:root[data-theme="dark"] .tl-title{color:var(--cream)}
.tl-count{font-family:var(--sans); font-weight:600; font-size:.6rem; color:#fff; background:var(--day-color,var(--celadon));
  border-radius:11px; min-width:18px; height:16px; padding:0 5px; display:inline-grid; place-items:center}
.tl-en{font-family:var(--latin); font-style:italic; font-size:.76rem; color:var(--ink-soft)}
/* 图集（主角） */
.tl-media{max-width:320px; border-radius:11px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line); background:var(--card); transition:transform .18s, box-shadow .18s}
.tl-node:hover .tl-media{transform:translateY(-2px); box-shadow:0 1px 0 rgba(0,0,0,.04), 0 24px 46px -26px rgba(43,48,42,.5)}
.tl-media--1 img,.tl-media-feat{width:100%; display:block; aspect-ratio:3/2; object-fit:cover}
.tl-media--set{display:block}
.tl-media-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line)}
.tl-media-cell{position:relative; aspect-ratio:1; overflow:hidden; background:var(--paper-2)}
.tl-media-cell img{width:100%; height:100%; object-fit:cover; display:block}
.tl-more{position:absolute; inset:0; display:grid; place-items:center; background:rgba(15,33,26,.62);
  color:#fff; font-family:var(--serif); font-size:1.05rem; letter-spacing:.03em}
/* 待传占位（图片位置留白，气质统一） */
.tl-media--empty{aspect-ratio:3/2; display:grid; place-items:center; box-shadow:none;
  background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--c) 9%, transparent) 0 9px, transparent 9px 18px);
  border:1px dashed color-mix(in srgb,var(--c) 50%, var(--line))}
.tl-media--empty span{font-size:.74rem; letter-spacing:.14em; color:var(--ink-soft)}
/* 辅助文字 */
.tl-text{font-size:.82rem; color:var(--ink-soft); line-height:1.6; margin:9px 0 0; max-width:52ch;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.tl-hl{font-size:.8rem; color:var(--day-color,var(--cinnabar)); margin:6px 0 0; font-weight:500}

/* 地图弹窗照片 */
.pop-photo{position:relative; margin:2px 0 10px; border-radius:8px; overflow:hidden; border:1px solid var(--line)}
.pop-photo img{width:100%; display:block; aspect-ratio:4/3; object-fit:cover}
.pop-count{position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.6); color:#fff; font-size:.66rem; padding:2px 8px; border-radius:12px}

/* ---------- posters gallery ---------- */
.sec{padding:72px 0; border-top:1px solid var(--line)}
.sec-head{display:flex; align-items:baseline; gap:14px; margin-bottom:28px}
.sec-no{font-family:var(--latin); font-style:italic; color:var(--gold); font-size:1.1rem}
.sec-head h2{font-size:clamp(1.5rem,3.4vw,2rem); letter-spacing:.03em; color:var(--pine)}
:root[data-theme="dark"] .sec-head h2{color:var(--celadon)}
.sec-head h2 .en{font-size:.62em; margin-left:.5em}
.posters{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:860px){.posters{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.posters{grid-template-columns:1fr}}
.poster{background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; box-shadow:var(--shadow)}
.poster img{width:100%; display:block; aspect-ratio:3/4.24; object-fit:cover; object-position:top}
.poster-cap{padding:12px 14px}
.poster-cap .d{font-family:var(--latin); font-style:italic; font-size:.78rem}
.poster-cap .t{font-family:var(--serif); font-size:1rem; letter-spacing:.03em; margin-top:1px}

/* ---------- about / threads ---------- */
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:860px){.grid3{grid-template-columns:1fr}}
.thread{border-left:3px solid; padding:4px 0 4px 18px}
.thread.t1{border-color:var(--d2)} .thread.t2{border-color:var(--d4)} .thread.t3{border-color:var(--d6)}
.thread h3{font-size:1.05rem} .thread p{font-size:.88rem; color:var(--ink-2); margin:6px 0 0}
.about-lead{font-size:1.08rem; color:var(--ink-2); max-width:60ch}
.note{background:var(--card); border:1px solid var(--line); border-left:3px solid var(--cinnabar); border-radius:8px;
  padding:16px 18px; font-size:.86rem; color:var(--ink-2); margin-top:24px}
.note b{color:var(--ink)}

footer.site-footer{background:var(--pine-deep); color:var(--on-pine-soft); padding:52px 0 64px; font-size:.8rem}
footer.site-footer .brand{margin-bottom:12px; color:var(--cream)}
footer.site-footer .brand .seal{background:var(--cinnabar); box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--cinnabar) 50%, #000 30%), 0 0 0 1px color-mix(in srgb,var(--gold) 40%, transparent)}
footer.site-footer .logos{display:flex; gap:10px 24px; flex-wrap:wrap; margin-top:10px; font-family:var(--serif); color:var(--cream); font-size:.82rem}
footer.site-footer a{color:var(--gold)}

/* ===== 时空专题 · 沙田淤长（叠加在行程主图上的海岸线 morph）===== */
/* 控制条：占原 slider-box 位置，含 演进按钮 + 年代滑块 + 刻度 */
.dm-controls{position:absolute; z-index:7; left:16px; right:16px; bottom:16px; pointer-events:auto;
  display:flex; align-items:center; gap:14px;
  background:color-mix(in srgb,var(--card) 90%, transparent); border:1px solid var(--line);
  border-radius:22px; padding:9px 16px; backdrop-filter:blur(6px); box-shadow:var(--shadow)}
.dm-play{flex:none; display:inline-flex; align-items:center; gap:7px; font-family:var(--serif);
  font-size:.84rem; letter-spacing:.06em; padding:6px 14px; border-radius:20px; cursor:pointer;
  color:var(--cream); background:var(--pine); border:1px solid color-mix(in srgb,var(--gold) 40%, transparent);
  transition:.2s; white-space:nowrap}
.dm-play:hover{background:var(--pine-2); border-color:var(--gold)}
.dm-play.on{background:var(--cinnabar)}
.dm-play .pl-ico{font-size:.66rem}
.dm-play .pl-ico::before{content:"▶"}
.dm-play.on .pl-ico::before{content:"❚❚"; font-size:.6rem; letter-spacing:-2px}
.dm-play.on .pl-txt::before{content:"暂停"}
.dm-play.on .pl-txt{font-size:0}
.dm-play.on .pl-txt::before{font-size:.84rem}
.dm-slider{flex:1; min-width:0}
#dm-range{width:100%; accent-color:var(--gold); cursor:pointer}
.dm-ticks{display:flex; justify-content:space-between; margin-top:3px}
.dm-tick{background:none; border:0; cursor:pointer; font-family:var(--serif); font-size:.76rem;
  letter-spacing:.03em; color:var(--ink-soft); padding:1px 3px; transition:.15s; position:relative; white-space:nowrap}
.dm-tick:hover{color:var(--pine)}
.dm-tick.on{color:var(--cinnabar); font-weight:700}
.dm-tick.on::after{content:""; position:absolute; left:50%; top:-7px; transform:translateX(-50%);
  width:5px; height:5px; border-radius:50%; background:var(--cinnabar)}

/* 史解题签：morph 进行时显现，浮于左下、控制条与筛选之上 */
.dm-caption{position:absolute; z-index:7; left:16px; bottom:118px; max-width:min(360px,72%);
  pointer-events:none; background:color-mix(in srgb,var(--card) 92%, transparent); backdrop-filter:blur(4px);
  border:1px solid var(--line); border-left:3px solid var(--gold); border-radius:12px;
  padding:11px 15px; box-shadow:var(--shadow); animation:dmFade .3s ease}
.dm-caption[hidden]{display:none}
@keyframes dmFade{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
.dm-caption .dm-era{display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 10px; margin-bottom:5px}
.dm-kicker{font-family:var(--sans); letter-spacing:.14em; font-size:.6rem; text-transform:uppercase;
  color:var(--cinnabar); flex-basis:100%; font-weight:600}
.dm-year{font-family:var(--serif); font-weight:700; font-size:1.35rem; letter-spacing:.06em; color:var(--pine)}
:root[data-theme="dark"] .dm-year{color:var(--gold)}
.dm-span{font-family:var(--latin); font-style:italic; font-size:.76rem; color:var(--ink-soft)}
.dm-note{margin:0; font-size:.84rem; line-height:1.65; color:var(--ink-2)}

/* 让「全部/D1…D6」筛选上移，给控制条腾出高度 */
.chips{bottom:92px}
@media(max-width:860px){
  .chips{bottom:96px}
  .dm-caption{bottom:150px; max-width:78%}
  .dm-controls{left:12px; right:12px; gap:10px}
  .dm-play::after{content:none} .dm-play.on::after{content:none}
}

/* ===== 点位浮动详情卡（贴地图左下，筛选条之上）===== */
.site-card{position:absolute; z-index:9; left:16px; bottom:132px; width:304px;
  max-height:calc(100% - 250px); overflow-y:auto; overscroll-behavior:contain;
  background:color-mix(in srgb,var(--card) 96%, transparent); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--c, var(--celadon)); border-radius:14px;
  box-shadow:var(--shadow);
  opacity:0; transform:translateY(14px); transition:opacity .28s ease, transform .28s ease}
.site-card[hidden]{display:none}
.site-card.on{opacity:1; transform:none}
.site-card.swap{animation:scSwap .3s ease}
@keyframes scSwap{0%{transform:translateX(-10px); opacity:.2}100%{transform:none; opacity:1}}
.sc-close{position:absolute; top:8px; right:8px; z-index:2; width:26px; height:26px; border-radius:50%;
  border:1px solid rgba(255,255,255,.4); background:rgba(15,33,26,.55); color:#fff; font-size:.72rem; cursor:pointer}
.sc-close:hover{background:rgba(15,33,26,.8)}
.sc-banner{position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:11px 11px 0 0; background:var(--paper-2)}
.sc-banner img{width:100%; height:100%; object-fit:cover; display:block}
.sc-banner--empty{display:grid; place-items:center;
  background:linear-gradient(135deg, color-mix(in srgb,var(--c) 82%, #000 6%), color-mix(in srgb,var(--c) 55%, #000 22%))}
.sc-banner--empty span{font-family:var(--serif); font-size:1.5rem; letter-spacing:.3em; padding-left:.3em;
  color:color-mix(in srgb,#fff 88%, transparent); text-shadow:0 1px 8px rgba(0,0,0,.3)}
.sc-body{padding:11px 14px 13px}
.sc-daytag{margin:0 0 2px; font-size:.68rem; letter-spacing:.08em; font-weight:600}
.sc-name{font-size:1.06rem; letter-spacing:.03em; color:var(--pine)}
:root[data-theme="dark"] .sc-name{color:var(--cream)}
.sc-en{font-family:var(--latin); font-style:italic; font-size:.68rem; color:var(--ink-soft); font-weight:400}
.sc-blurb{font-size:.8rem; color:var(--ink-2); line-height:1.65; margin:7px 0 0}
.sc-hl{font-size:.78rem; color:var(--c, var(--cinnabar)); font-weight:500; line-height:1.6; margin:7px 0 0}
.sc-gallery{margin-top:10px; width:100%; border:1px solid var(--line); border-radius:9px; cursor:pointer;
  background:var(--paper-2); color:var(--ink-2); font-size:.76rem; letter-spacing:.05em; padding:6px 0;
  font-family:var(--sans); transition:.15s}
.sc-gallery:hover{border-color:var(--c); color:var(--c)}
/* 田野之声：学者头像 chips + hover 引文 */
.sc-scholars{display:flex; align-items:center; gap:7px; margin-top:10px; flex-wrap:wrap}
.sc-slabel{font-size:.66rem; letter-spacing:.14em; color:var(--ink-soft); margin-right:1px}
.sc-chip{position:relative}
.sc-avatar{display:block; width:30px; height:30px; border-radius:50%; overflow:hidden; cursor:default;
  border:2px solid #fff; box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 55%, transparent), 0 1px 4px rgba(0,0,0,.25)}
.sc-avatar img{width:100%; height:100%; object-fit:cover; display:block}
.sc-avatar--i{display:grid; place-items:center; background:var(--c)}
.sc-avatar--i i{font-style:normal; font-family:var(--serif); font-size:.86rem; color:#fff}
.sc-tip{position:absolute; left:50%; bottom:calc(100% + 9px); transform:translate(-50%,4px); width:220px;
  background:var(--pine); color:var(--cream); font-size:.72rem; line-height:1.6; border-radius:9px; padding:8px 11px;
  box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:.18s; z-index:3}
.sc-tip b{color:var(--gold)}
.sc-tip::after{content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--pine)}
.sc-chip:hover .sc-tip{opacity:1; transform:translate(-50%,0)}
@media(max-width:860px){
  .site-card{left:12px; right:12px; bottom:12px; width:auto; max-height:54vh}
}

/* ===== 图集 lightbox ===== */
.lb{position:fixed; inset:0; z-index:110; display:grid; place-items:center;
  background:rgba(12,20,16,.86); backdrop-filter:blur(6px)}
.lb[hidden]{display:none}
.lb-img{max-width:min(1080px,92vw); max-height:82vh; border-radius:8px; display:block;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.8); border:1px solid rgba(255,255,255,.12)}
.lb-cap{position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
  color:var(--cream); font-family:var(--serif); font-size:.84rem; letter-spacing:.08em}
.lb-close{position:absolute; top:18px; right:22px; width:36px; height:36px; border-radius:50%; cursor:pointer;
  background:rgba(255,255,255,.14); color:var(--cream); border:1px solid rgba(255,255,255,.25); font-size:.95rem}
.lb-close:hover{background:rgba(255,255,255,.26)}
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%;
  cursor:pointer; background:rgba(255,255,255,.12); color:var(--cream); border:1px solid rgba(255,255,255,.22);
  font-size:1.5rem; line-height:0; padding-bottom:4px}
.lb-nav:hover{background:rgba(255,255,255,.26)}
.lb-prev{left:20px} .lb-next{right:20px}

/* ===== 时间线学者观点（引文体 · 田野之声）===== */
.tl-quotes{display:flex; flex-direction:column; gap:12px; margin:-10px 0 34px}
.tl-quote{position:relative; margin:0; max-width:430px; cursor:pointer;
  background:color-mix(in srgb,var(--day-color, var(--celadon)) 7%, var(--card));
  border:1px solid color-mix(in srgb,var(--day-color, var(--celadon)) 20%, transparent);
  border-radius:13px; padding:15px 17px 12px;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease}
.tl-quote:hover{transform:translateY(-2px); box-shadow:var(--shadow);
  background:color-mix(in srgb,var(--day-color, var(--celadon)) 11%, var(--card))}
.tq-text{font-family:var(--serif); font-size:.93rem; line-height:1.78; color:var(--ink); margin:0}
.tq-mark{font-family:var(--serif); font-weight:700; font-size:1.15em; line-height:0;
  color:var(--day-color, var(--celadon)); margin:0 .1em}
.tq-foot{display:flex; align-items:center; gap:9px; margin-top:11px}
.tq-avatar{flex:none; width:30px; height:30px; border-radius:50%; overflow:hidden;
  border:2px solid #fff; box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 55%, transparent), 0 1px 4px rgba(0,0,0,.2)}
.tq-avatar img{width:100%; height:100%; object-fit:cover; display:block}
.tq-avatar--i{display:grid; place-items:center; background:var(--c)}
.tq-avatar--i i{font-style:normal; font-family:var(--serif); font-size:.9rem; color:#fff}
.tq-who{display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; min-width:0}
.tq-who b{font-family:var(--serif); font-size:.88rem; letter-spacing:.03em; color:var(--pine)}
:root[data-theme="dark"] .tq-who b{color:var(--cream)}
.tq-disc{font-style:normal; font-size:.6rem; letter-spacing:.06em; white-space:nowrap;
  color:var(--day-color, var(--celadon)); border:1px solid color-mix(in srgb,var(--day-color, var(--celadon)) 55%, transparent);
  border-radius:10px; padding:0 7px; line-height:1.7}
.tq-aff{font-size:.68rem; color:var(--ink-soft)}
.tq-scene{margin-left:auto; flex:none; font-family:var(--latin); font-style:italic;
  font-size:.66rem; color:var(--ink-soft); text-align:right; max-width:38%}
@media(max-width:860px){.tl-quotes{margin:-6px 0 26px} .tl-quote{max-width:none} .tq-scene{display:none}}

/* ===== 单图轮播（右栏图集）===== */
.tl-car{position:relative; max-width:340px; border-radius:12px; overflow:hidden;
  box-shadow:var(--shadow); border:1px solid var(--line); background:var(--card)}

/* ===== 宽屏适配：右栏内容随屏加宽，减少留白 ===== */
@media(min-width:1400px){
  .step{padding:110px 72px 72px 60px}
  .step-detail{max-width:52ch; font-size:1rem}
  .tl-car{max-width:440px}
  .tl-quote{max-width:520px}
  .tq-text{font-size:.98rem}
  .tl-text{max-width:60ch; -webkit-line-clamp:3; font-size:.88rem}
  .tl-hl{font-size:.86rem}
  .tl-doc-pill .tl-doc-t{font-size:1rem}
  .site-card{width:340px}
}
@media(min-width:1700px){
  .step{padding:120px 96px 80px 72px}
  .tl-car{max-width:500px}
  .tl-quote{max-width:580px}
}
.tl-car-img{width:100%; display:block; aspect-ratio:3/2; object-fit:cover; cursor:zoom-in;
  transition:opacity .18s ease}
.tlc-nav{position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:30px; height:30px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(15,33,26,.5); color:#fff; font-size:1.05rem; line-height:0; padding-bottom:3px;
  opacity:0; transition:opacity .18s ease}
.tl-car:hover .tlc-nav{opacity:1}
.tlc-prev{left:8px} .tlc-next{right:8px}
.tlc-nav:hover{background:rgba(15,33,26,.78)}
.tlc-dots{position:absolute; left:0; right:0; bottom:8px; display:flex; justify-content:center; gap:5px; z-index:2}
.tlc-dots i{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.55); transition:.2s}
.tlc-dots i.on{background:#fff; transform:scale(1.25)}

/* ===== 当日纪录片胶囊（右栏，点击弹窗播放）===== */
.tl-doc{margin-top:8px}
.tl-doc-pill{display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  background:var(--card); border:1px solid var(--line); border-radius:24px; padding:7px 18px 7px 9px;
  box-shadow:var(--shadow); font-family:var(--sans); transition:transform .16s ease, border-color .16s ease}
.tl-doc-pill:hover{transform:translateY(-1px); border-color:var(--day-color, var(--cinnabar))}
.tl-doc-ico{display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%;
  background:var(--day-color, var(--cinnabar)); color:#fff; font-size:.62rem; padding-left:2px}
.tl-doc-t{font-family:var(--serif); font-size:.94rem; letter-spacing:.06em; color:var(--pine)}
:root[data-theme="dark"] .tl-doc-t{color:var(--cream)}
.tl-doc-en{font-family:var(--latin); font-style:italic; font-size:.7rem; color:var(--ink-soft)}

/* ===== marker 脉冲光环（选中点位 / 观点卡 hover 联动）===== */
.site-dot{position:relative}
.site-marker.pulse .site-dot::after{content:""; position:absolute; inset:-7px; border-radius:50%;
  border:2px solid var(--gold); animation:pulseRing 1.3s ease-out infinite; pointer-events:none}
@keyframes pulseRing{0%{transform:scale(.6); opacity:.9}100%{transform:scale(1.5); opacity:0}}
@media(prefers-reduced-motion:reduce){.site-marker.pulse .site-dot::after{animation:none; transform:none; opacity:.7}}
/* 照片 marker：标签让位 */
.site-marker.photo .site-label{left:41px}
.site-marker .site-dot{background-repeat:no-repeat}

/* 三城地名标注（城市级锚点，常显） */
.city-label{pointer-events:none; white-space:nowrap; text-align:center; user-select:none;
  font-family:var(--serif); font-size:1.25rem; font-weight:600; letter-spacing:.42em; padding-left:.42em;
  color:var(--pine); opacity:.5;
  text-shadow:0 0 7px var(--paper), 0 0 3px var(--paper), 0 0 3px var(--paper)}
.city-label small{display:block; font-family:var(--latin); font-style:italic; font-weight:400;
  font-size:.58rem; letter-spacing:.12em; padding-left:0; color:var(--ink-soft); margin-top:1px}
:root[data-theme="dark"] .city-label{color:var(--cream)}