/* ============================================================
   凡国网址中心 /assets/site.css
   共享外壳：reset、变量、中文排版、头部侧轨、页脚、通用组件
   ============================================================ */

/* ---------- 1. 变量 ---------- */
:root{
  --indigo:#101B3B;
  --indigo-2:#24345C;
  --saffron:#A61E2B;
  --gold:#D8A63C;
  --snow:#F6F4EF;
  --warmgray:#CFC8BB;
  --orange:#E07A3F;
  --ink:#14110F;
  --barley:#F2E4C4;

  --rail-w:232px;
  --edge:clamp(20px,4vw,64px);
  --maxw:1400px;

  --sans:"Source Han Sans SC","Source Han Sans","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono","SF Mono",Consolas,"Courier New",monospace;

  --hair-light:1px solid rgba(246,244,239,.16);
  --hair-dark:1px solid rgba(20,17,15,.14);
  --muted:#4A453D;
  --muted-2:#7A7265;
}
@media(min-width:1280px){ :root{ --rail-w:264px; } }

/* ---------- 2. Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd,hr{ margin:0; }
ul,ol{ padding:0; list-style:none; }
img,svg{ display:block; max-width:100%; }
button{ font-family:inherit; }
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }

/* ---------- 3. 基础中文排版 ---------- */
body{
  font-family:var(--sans);
  font-size:16px;
  line-height:1.75;
  letter-spacing:.01em;
  color:var(--ink);
  background:var(--snow);
  min-height:100vh;
  padding-top:60px;
}
@media(min-width:1024px){
  body{ padding-top:0; padding-left:var(--rail-w); }
}
h1,h2,h3,h4{ line-height:1.2; font-weight:800; letter-spacing:.02em; }
a{ color:var(--saffron); text-decoration:none; }
a:hover{ text-decoration:underline; }
:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }
#main-content:focus{ outline:2px solid var(--orange); outline-offset:4px; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link{
  position:fixed; top:0; left:0; z-index:200;
  transform:translateY(-130%);
  background:var(--snow); color:var(--ink);
  padding:12px 20px; font-size:14px; font-weight:700; letter-spacing:.08em;
  border:2px solid var(--saffron);
}
.skip-link:focus{ transform:translateY(0); }

/* ---------- 4. 通用文字与容器 ---------- */
.mono{ font-family:var(--mono); letter-spacing:.06em; }
.eyebrow{
  font-size:12px; letter-spacing:.16em; font-weight:700;
  color:var(--saffron); text-transform:uppercase;
}
.section--dark .eyebrow{ color:var(--gold); }
.display{
  font-size:clamp(2.4rem,7vw,5.4rem);
  line-height:1.04; font-weight:200; letter-spacing:.01em;
}
.display strong{ font-weight:800; }
.display .num{ font-family:var(--mono); font-weight:700; letter-spacing:0; }
.h2{ font-size:clamp(1.45rem,3vw,2.3rem); letter-spacing:.04em; }
.h3{ font-size:clamp(1.1rem,1.8vw,1.45rem); letter-spacing:.05em; }
.lede{ font-size:1.02rem; line-height:1.8; color:var(--muted); max-width:38em; }
.prose{ max-width:38em; font-size:15.5px; line-height:1.8; color:var(--muted); }
.prose p + p{ margin-top:1em; }
.prose ul{ list-style:square; padding-left:1.2em; margin-top:.8em; }
.prose li{ margin-top:.35em; }
.prose strong{ color:var(--ink); }

.container{
  width:100%; max-width:var(--maxw);
  margin:0 auto; padding-left:var(--edge); padding-right:var(--edge);
}
.section{ padding-top:clamp(48px,7vw,96px); padding-bottom:clamp(48px,7vw,96px); }
.section--dark{ background:var(--indigo); color:var(--snow); }
.section--dark .lede,
.section--dark .prose,
.section--dark p{ color:rgba(246,244,239,.78); }
.section--barley{ background:var(--barley); }
.section--snow{ background:var(--snow); }
.hairline{ border:0; border-top:var(--hair-dark); margin:0; .section--dark &{ border-top:var(--hair-light); } }
.section--dark .hairline{ border-top:var(--hair-light); }

.grid{ display:grid; gap:clamp(16px,2vw,28px); }
.grid--2{ grid-template-columns:1fr; }
.grid--3{ grid-template-columns:1fr; }
.grid--asym{ grid-template-columns:1fr; }
@media(min-width:720px){
  .grid--2{ grid-template-columns:repeat(2,1fr); }
  .grid--3{ grid-template-columns:repeat(2,1fr); }
}
@media(min-width:980px){
  .grid--3{ grid-template-columns:repeat(3,1fr); }
  .grid--asym{ grid-template-columns:7fr 5fr; }
}

/* ---------- 5. 按钮与链接 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:14px; font-weight:700; letter-spacing:.1em; line-height:1.2;
  padding:12px 20px; border:1px solid transparent; border-radius:0;
  text-decoration:none; cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover{ text-decoration:none; }
.btn-accent{ background:var(--saffron); border-color:var(--saffron); color:var(--snow); }
.btn-accent:hover{ background:var(--orange); border-color:var(--orange); color:var(--ink); }
.btn-ghost{ background:transparent; border-color:rgba(246,244,239,.4); color:var(--snow); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--gold); }
.btn-line{ background:transparent; border-color:rgba(20,17,15,.4); color:var(--ink); }
.btn-line:hover{ background:var(--ink); border-color:var(--ink); color:var(--snow); }

.link-more{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:700; letter-spacing:.1em;
  color:var(--saffron); border-bottom:1px solid transparent; padding-bottom:2px;
  transition:border-color .2s ease, color .2s ease;
}
.link-more::after{ content:"→"; }
.link-more:hover{ text-decoration:none; border-bottom-color:var(--saffron); }

/* ---------- 6. 页头：侧边索引轨道 ---------- */
.site-header{
  position:fixed; z-index:60;
  background:var(--indigo); color:var(--snow);
  border-right:var(--hair-light);
  display:flex; flex-direction:column;
  padding-left:0;
}
.site-header::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--saffron);
}
@media(min-width:1024px){
  .site-header{ top:0; left:0; bottom:0; width:var(--rail-w); padding:0; }
}
@media(max-width:1023px){
  .site-header{
    top:0; left:0; right:0; height:60px;
    flex-direction:row; align-items:center; justify-content:space-between;
    padding:0 14px; border-right:0; border-bottom:var(--hair-light);
  }
}

.rail-top{ border-bottom:var(--hair-light); padding:32px 24px 22px; }
@media(max-width:1023px){
  .rail-top{ flex:1 1 auto; min-width:0; padding:0; border-bottom:0; display:flex; align-items:center; }
}

.brand{ display:block; color:inherit; text-decoration:none; }
.brand:hover{ text-decoration:none; }
.brand-mark{
  display:block; width:44px; height:13px; margin-bottom:16px;
  background-image:
    linear-gradient(var(--saffron),var(--saffron)),
    linear-gradient(var(--gold),var(--gold)),
    linear-gradient(var(--snow),var(--snow));
  background-repeat:no-repeat;
  background-size:60% 3px, 100% 3px, 34% 2px;
  background-position:0 0, 0 5px, 0 11px;
}
.brand-name{
  display:block; font-size:22px; font-weight:800; letter-spacing:.14em; line-height:1.25;
  transition:color .2s ease;
}
.brand:hover .brand-name{ color:var(--gold); }
.brand-tagline{
  display:block; margin-top:8px;
  font-size:12px; letter-spacing:.16em; color:var(--warmgray);
}
@media(max-width:1023px){
  .brand{ display:flex; align-items:center; gap:10px; }
  .brand-mark{
    width:26px; height:10px; margin-bottom:0;
    background-size:60% 2px, 100% 2px, 34% 2px;
    background-position:0 0, 0 4px, 0 8px;
  }
  .brand-name{ font-size:17px; letter-spacing:.1em; white-space:nowrap; }
  .brand-tagline{ display:none; }
}

.site-nav{ padding-top:18px; flex:1 1 auto; overflow-y:auto; }
.nav-label{
  padding:0 24px 10px; font-size:12px; font-weight:700;
  letter-spacing:.16em; color:var(--gold);
}
.nav-list{ display:flex; flex-direction:column; }
.nav-link{
  position:relative; display:flex; align-items:baseline; gap:12px;
  padding:11px 24px; color:var(--warmgray); text-decoration:none;
  font-size:15px; font-weight:500; letter-spacing:.06em; line-height:1.4;
  border-top:1px solid rgba(246,244,239,.08);
  transition:color .2s ease, background-color .2s ease;
}
.nav-link:hover{ text-decoration:none; color:var(--snow); background:rgba(36,52,92,.65); }
.nav-link::after{
  content:""; position:absolute; left:24px; right:24px; bottom:0; height:1px;
  background:var(--orange); transform:scaleX(0); transform-origin:left center;
  transition:transform .24s ease;
}
.nav-link:hover::after{ transform:scaleX(1); }
.nav-link::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--saffron); transform:scaleY(0); transform-origin:top;
  transition:transform .24s ease;
}
.nav-link[aria-current="page"]{
  color:var(--snow); background:var(--indigo-2); font-weight:700;
}
.nav-link[aria-current="page"]::before{ transform:scaleY(1); }
.nav-link[aria-current="page"] .nav-num{ color:var(--gold); }
.nav-link:focus-visible{ outline:2px solid var(--orange); outline-offset:-2px; }
.nav-num{
  font-family:var(--mono); font-size:11px; letter-spacing:.08em;
  color:rgba(216,166,60,.75);
}
.nav-text{ min-width:0; }
.nav-note{
  padding:18px 24px 0; font-family:var(--mono);
  font-size:11px; letter-spacing:.12em; color:rgba(207,200,187,.6);
}

.rail-foot{
  flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  padding:18px 24px 26px; border-top:var(--hair-light);
  background:var(--indigo);
}
.version-badge{
  font-family:var(--mono); font-size:12px; letter-spacing:.12em;
  color:var(--gold); border:1px solid rgba(216,166,60,.5); padding:4px 8px;
}
.rail-cta{ width:100%; }

.nav-toggle{ display:none; }
@media(max-width:1023px){
  .nav-toggle{
    position:relative; z-index:80;
    display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
    width:44px; height:44px; flex:0 0 auto;
    background:transparent; border:1px solid rgba(246,244,239,.35);
    cursor:pointer; padding:0;
  }
  .nav-toggle:hover{ border-color:var(--gold); }
  .nav-toggle-bar{
    display:block; width:20px; height:1.5px; background:var(--snow);
    transition:transform .24s ease, opacity .24s ease;
  }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

  .nav-scrim{
    position:fixed; inset:0; z-index:65;
    background:rgba(16,27,59,.62);
    opacity:0; pointer-events:none;
    transition:opacity .28s ease;
  }
  body[data-nav-open] .nav-scrim{ opacity:1; pointer-events:auto; }

  .site-nav{
    position:fixed; top:0; right:0; bottom:0; z-index:70;
    width:min(86vw,360px); padding:76px 0 170px;
    background:var(--indigo); border-left:var(--hair-light);
    overflow-y:auto; flex:none;
    transform:translateX(101%);
    transition:transform .28s ease;
  }
  .site-nav[data-open]{ transform:translateX(0); }
  .site-nav .nav-link{ font-size:16px; padding:13px 24px; }

  .rail-foot{
    position:fixed; top:auto; right:0; bottom:0; z-index:71;
    width:min(86vw,360px); border-left:var(--hair-light);
    padding:18px 24px 24px;
    transform:translateX(101%);
    transition:transform .28s ease;
  }
  body[data-nav-open] .rail-foot{ transform:translateX(0); }
}
@media(min-width:1024px){
  .nav-scrim{ display:none; }
}

/* ---------- 7. 页脚 ---------- */
.site-footer{
  background:var(--indigo); color:var(--warmgray);
  border-top:1px solid var(--gold);
}
.foot-inner{
  max-width:var(--maxw); margin:0 auto;
  padding:clamp(40px,6vw,64px) var(--edge) 32px;
}
.foot-top{ display:grid; gap:36px; grid-template-columns:1fr; }
@media(min-width:900px){
  .foot-top{ grid-template-columns:minmax(230px,1fr) 2.5fr; gap:64px; }
}
.brand-mark--foot{
  width:60px; height:16px; margin-bottom:18px;
  background-size:60% 3px, 100% 3px, 34% 2px;
  background-position:0 0, 0 6px, 0 13px;
}
.foot-brand-name{
  font-size:20px; font-weight:800; letter-spacing:.14em; color:var(--snow);
}
.foot-brand-tag{ margin-top:8px; font-size:12px; letter-spacing:.16em; color:var(--warmgray); }
.foot-version{
  margin-top:14px; font-family:var(--mono); font-size:12px; letter-spacing:.12em;
  color:var(--gold); display:inline-block;
  border:1px solid rgba(216,166,60,.5); padding:4px 8px;
}
.foot-cols{ display:grid; gap:26px; grid-template-columns:1fr; }
@media(min-width:620px){ .foot-cols{ grid-template-columns:repeat(3,1fr); } }
.foot-col{ border-top:var(--hair-light); padding-top:16px; }
.foot-col-title{
  font-size:13px; font-weight:700; letter-spacing:.16em; color:var(--gold);
  margin-bottom:10px;
}
.foot-col p{ font-size:14px; line-height:1.75; color:var(--warmgray); }
.foot-link{
  display:inline-block; margin-top:12px;
  font-size:12px; font-weight:700; letter-spacing:.12em;
  color:var(--snow); border-bottom:1px solid rgba(246,244,239,.35); padding-bottom:2px;
}
.foot-link:hover{ text-decoration:none; color:var(--gold); border-bottom-color:var(--gold); }

.foot-contact{
  margin-top:40px; padding-top:20px; border-top:var(--hair-light);
  display:grid; gap:8px;
}
.foot-contact-line{ font-size:14px; letter-spacing:.04em; color:var(--snow); word-break:break-word; }
.foot-contact-note{ font-size:13px; line-height:1.7; color:rgba(207,200,187,.8); max-width:52em; }
.foot-update{
  margin-top:16px; font-family:var(--mono); font-size:12px; letter-spacing:.08em;
  color:rgba(207,200,187,.62);
}
.foot-bar{
  margin-top:26px; padding-top:20px; border-top:var(--hair-light);
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 28px;
}
.foot-icp{ font-family:var(--mono); font-size:12px; letter-spacing:.08em; color:var(--warmgray); }
.foot-legal{ display:flex; flex-wrap:wrap; gap:8px 20px; }
.foot-legal a{
  font-size:12.5px; letter-spacing:.1em; color:var(--warmgray);
  border-bottom:1px solid transparent; padding-bottom:1px;
  transition:color .2s ease, border-color .2s ease;
}
.foot-legal a:hover{ text-decoration:none; color:var(--snow); border-bottom-color:var(--gold); }
.foot-copy{ margin-left:auto; font-size:12.5px; letter-spacing:.1em; color:rgba(207,200,187,.7); }
@media(max-width:640px){ .foot-copy{ margin-left:0; } }

/* ---------- 8. 通用组件 ---------- */
.breadcrumb{ padding-top:20px; }
.breadcrumb-list{ display:flex; flex-wrap:wrap; gap:8px; font-size:12px; letter-spacing:.12em; color:var(--muted-2); }
.breadcrumb-link{ color:inherit; border-bottom:1px solid transparent; }
.breadcrumb-link:hover{ text-decoration:none; color:var(--saffron); border-bottom-color:var(--saffron); }
.breadcrumb-sep{ color:var(--warmgray); }

.page-head{
  padding-top:clamp(28px,4vw,56px); padding-bottom:clamp(22px,3vw,38px);
  border-bottom:var(--hair-dark);
}
.section--dark .page-head{ border-bottom:var(--hair-light); }
.page-title{ font-size:clamp(1.9rem,5vw,3.4rem); line-height:1.06; letter-spacing:.02em; }
.page-lede{ margin-top:18px; max-width:38em; font-size:1rem; color:var(--muted); }
.section--dark .page-lede{ color:rgba(246,244,239,.78); }

.card{
  display:flex; flex-direction:column; gap:12px;
  background:var(--snow); border:1px solid var(--warmgray); padding:24px;
}
.card--dark{ background:var(--indigo-2); border-color:rgba(246,244,239,.16); color:var(--snow); }
.card-head{
  display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  border-bottom:1px solid rgba(20,17,15,.12); padding-bottom:10px;
}
.card--dark .card-head{ border-bottom-color:rgba(246,244,239,.16); }
.card-title{ font-size:1.05rem; letter-spacing:.04em; }
.card-meta{ font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--muted-2); }
.card--dark .card-meta{ color:rgba(216,166,60,.85); }
.card-body{ font-size:14.5px; line-height:1.75; color:var(--muted); }
.card--dark .card-body{ color:rgba(246,244,239,.78); }

.tag-list{ display:flex; flex-wrap:wrap; gap:8px; }
.tag{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; letter-spacing:.12em;
  padding:4px 8px; border:1px solid currentColor;
}
.tag--gold{ color:#7E5C18; background:var(--barley); border-color:var(--gold); }
.tag--red{ color:var(--saffron); background:rgba(166,30,43,.06); border-color:var(--saffron); }
.tag--ink{ color:var(--ink); border-color:rgba(20,17,15,.3); }

.index-list{ border-top:var(--hair-dark); }
.section--dark .index-list{ border-top:var(--hair-light); }
.index-row{
  display:grid; grid-template-columns:1fr auto; gap:16px; align-items:baseline;
  padding:14px 4px; border-bottom:var(--hair-dark);
  color:inherit; text-decoration:none;
  transition:background-color .2s ease, padding-left .2s ease;
}
.section--dark .index-row{ border-bottom-color:rgba(246,244,239,.16); }
.index-row:hover{ text-decoration:none; background:var(--barley); padding-left:12px; }
.section--dark .index-row:hover{ background:var(--indigo-2); }
.index-key{ font-weight:700; letter-spacing:.04em; }
.index-val{ font-family:var(--mono); font-size:12px; color:var(--muted-2); }
.section--dark .index-val{ color:rgba(207,200,187,.75); }

.stat-row{
  display:grid; gap:1px; background:rgba(20,17,15,.16);
  border:var(--hair-dark);
}
.section--dark .stat-row{ background:rgba(246,244,239,.18); border-color:rgba(246,244,239,.18); }
.stat{ background:var(--snow); padding:20px; }
.section--dark .stat{ background:var(--indigo-2); }
.stat-num{
  display:block; font-family:var(--mono); font-weight:700; line-height:1;
  font-size:clamp(1.5rem,3vw,2.3rem); color:var(--saffron);
}
.section--dark .stat-num{ color:var(--gold); }
.stat-label{ display:block; margin-top:10px; font-size:12px; letter-spacing:.16em; color:var(--muted-2); }
.section--dark .stat-label{ color:var(--warmgray); }

.accordion{ border-top:var(--hair-dark); }
.section--dark .accordion{ border-top:var(--hair-light); }
.accordion-item{ border-bottom:var(--hair-dark); }
.section--dark .accordion-item{ border-bottom-color:rgba(246,244,239,.16); }
.accordion-btn{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px;
  background:transparent; border:0; padding:18px 4px;
  font-size:15.5px; font-weight:700; letter-spacing:.04em; color:inherit;
  text-align:left; cursor:pointer;
  transition:background-color .2s ease, padding-left .2s ease;
}
.accordion-btn:hover{ background:var(--barley); padding-left:12px; }
.section--dark .accordion-btn:hover{ background:var(--indigo-2); }
.accordion-sign{ flex:0 0 auto; font-family:var(--mono); font-size:16px; color:var(--saffron); }
.section--dark .accordion-sign{ color:var(--gold); }
.accordion-sign::before{ content:"+"; }
.accordion-item[data-open] .accordion-sign::before{ content:"–"; }
.accordion-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
.accordion-item[data-open] .accordion-panel{ grid-template-rows:1fr; }
.accordion-panel > div{ overflow:hidden; }
.accordion-inner{ padding:0 4px 20px; max-width:38em; font-size:14.5px; line-height:1.8; color:var(--muted); }
.section--dark .accordion-inner{ color:rgba(246,244,239,.78); }

.filter-bar{
  display:flex; flex-wrap:wrap; gap:8px;
  border-top:var(--hair-dark); border-bottom:var(--hair-dark); padding:12px 0;
}
.section--dark .filter-bar{ border-color:rgba(246,244,239,.18); }
.filter-btn{
  font-size:13px; font-weight:700; letter-spacing:.1em;
  padding:7px 12px; border:1px solid rgba(20,17,15,.25);
  background:transparent; color:var(--ink); cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.filter-btn:hover{ border-color:var(--saffron); color:var(--saffron); }
.filter-btn[aria-pressed="true"]{ background:var(--saffron); border-color:var(--saffron); color:var(--snow); }
.section--dark .filter-btn{ color:var(--snow); border-color:rgba(246,244,239,.3); }
.section--dark .filter-btn:hover{ border-color:var(--gold); color:var(--gold); }
.section--dark .filter-btn[aria-pressed="true"]{ background:var(--saffron); border-color:var(--saffron); color:var(--snow); }

.toc{ border-left:2px solid var(--warmgray); padding-left:16px; }
.section--dark .toc{ border-left-color:var(--indigo-2); }
.toc-title{ font-size:12px; font-weight:700; letter-spacing:.16em; color:var(--gold); margin-bottom:10px; }
.toc-link{
  display:block; padding:6px 0; font-size:13.5px; letter-spacing:.03em;
  color:var(--muted-2); border-bottom:1px solid transparent;
}
.toc-link:hover{ text-decoration:none; color:var(--ink); }
.toc-link[aria-current="true"]{ color:var(--saffron); font-weight:700; }
.section--dark .toc-link{ color:rgba(246,244,239,.7); }
.section--dark .toc-link[aria-current="true"]{ color:var(--gold); }

/* ---------- 9. 图片容器 ---------- */
.media{
  position:relative; overflow:hidden;
  background:var(--indigo-2);
  border:1px solid var(--warmgray);
}
.media img{ width:100%; height:100%; object-fit:cover; }
.media--panorama{ aspect-ratio:3/1; }
.media--wide{ aspect-ratio:21/9; }
.media--fill{ aspect-ratio:16/10; }
.media--tall{ aspect-ratio:3/4; }
.media--square{ aspect-ratio:1/1; }
.media--grain::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:repeating-linear-gradient(0deg,rgba(16,27,59,.08) 0 1px,transparent 1px 3px);
}
.media-caption{ margin-top:10px; font-size:12px; letter-spacing:.12em; color:var(--muted-2); }

/* ---------- 10. 动效、进度与返回顶部 ---------- */
body.js-ready [data-reveal]{
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
}
body.js-ready [data-reveal].is-visible{ opacity:1; transform:none; }

.scroll-progress{
  position:fixed; top:0; left:0; right:0; height:2px; z-index:120;
  background:var(--orange); transform:scaleX(0); transform-origin:left center;
  pointer-events:none;
}
@media(min-width:1024px){ .scroll-progress{ left:var(--rail-w); } }

.back-to-top{
  position:fixed; right:18px; bottom:18px; z-index:110;
  display:inline-flex; align-items:center; gap:8px;
  background:var(--indigo); color:var(--snow);
  border:1px solid var(--gold); font-size:13px; font-weight:700; letter-spacing:.1em;
  padding:10px 14px; cursor:pointer;
  opacity:0; visibility:hidden;
  transition:opacity .24s ease, visibility .24s ease, background-color .2s ease;
}
.back-to-top.is-shown{ opacity:1; visibility:visible; }
.back-to-top:hover{ background:var(--indigo-2); }
@media(min-width:1024px){ .back-to-top{ right:28px; bottom:28px; } }

/* ---------- 11. 降低动效偏好 ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  body.js-ready [data-reveal]{ opacity:1; transform:none; }
  .accordion-panel{ transition:none; }
}