:root{
  --ink:#070D18;
  --slate:#101B2C;
  --deep:#0B1424;
  --steel:#22314A;
  --ember:#FF5A1F;
  --ember-soft:#FF9052;
  --gold:#F2B544;
  --jade:#2FD3AE;
  --bone:#F6F1E7;
  --fog:#9AA8BD;
  --glass:rgba(255,255,255,.08);
  --rail-w:264px;
  --gutter:clamp(16px,4vw,48px);
  --font-sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --font-serif:"Noto Serif SC","Songti SC","Song Ti SC","SimSun",serif;
  --font-mono:"JetBrains Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;
  padding-top:60px;
  background:var(--ink);
  color:var(--bone);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5,h6{
  margin:0 0 .55em;
  font-family:var(--font-sans);
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--bone);
}

p{margin:0 0 1em}
p:last-child{margin-bottom:0}

a{color:var(--jade);text-decoration:none;transition:color .16s ease}
a:hover{color:var(--ember-soft)}

img{max-width:100%;height:auto;display:block}

ul,ol{margin:0 0 1em;padding-left:1.25em}

hr{border:0;border-top:1px solid var(--steel);margin:2em 0}

button,input,select,textarea{font:inherit;color:inherit}

b,strong{font-weight:700}

::selection{background:var(--ember);color:var(--ink)}

:focus-visible{
  outline:3px solid var(--jade);
  outline-offset:2px;
  border-radius:2px;
}

/* ---------- 通用布局 ---------- */
.container{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 var(--gutter);
}

.section{
  position:relative;
  padding:clamp(40px,6vw,76px) 0;
}

.section--slate{background:var(--slate)}

.section--slant{border-top:1px solid var(--steel);border-bottom:1px solid var(--steel)}
.section--slant::before{
  content:"";
  position:absolute;
  top:-2px;
  left:0;
  width:min(240px,42%);
  height:4px;
  background:linear-gradient(90deg,var(--ember),var(--gold) 60%,transparent);
  transform:skewX(-24deg);
  transform-origin:0 0;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 14px;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--jade);
}
.eyebrow::before{
  content:"";
  display:block;
  width:26px;
  height:1px;
  background:var(--jade);
}

.lede{
  margin:0 0 1.2em;
  font-family:var(--font-serif);
  font-size:clamp(18px,2.2vw,24px);
  line-height:1.6;
  color:var(--bone);
  max-width:42ch;
}

.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 24px;
  padding:0;
  list-style:none;
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--fog);
}
.breadcrumb li{display:flex;align-items:center;gap:8px}
.breadcrumb li + li::before{content:"/";color:var(--steel)}
.breadcrumb a{color:var(--fog)}
.breadcrumb a:hover{color:var(--jade)}
.breadcrumb [aria-current="page"]{color:var(--gold)}

.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,36px);
}
@media (min-width:900px){
  .grid--7-5{grid-template-columns:7fr 5fr}
  .grid--8-4{grid-template-columns:8fr 4fr}
  .grid--9-3{grid-template-columns:9fr 3fr}
}

/* ---------- 图片容器基础规则 ---------- */
.media{
  position:relative;
  overflow:hidden;
  aspect-ratio:16 / 9;
  border:1px solid var(--steel);
  border-radius:2px;
  background:
    linear-gradient(150deg,rgba(255,90,31,.18) 0%,rgba(16,27,44,.9) 42%,rgba(7,13,24,1) 100%),
    var(--slate);
}
.media img{width:100%;height:100%;object-fit:cover;display:block}
.media--wide{aspect-ratio:21 / 9}
.media--tall{aspect-ratio:3 / 4}
.media--square{aspect-ratio:1 / 1}
.media__cap{
  position:absolute;
  left:0;
  bottom:0;
  padding:6px 10px;
  background:rgba(7,13,24,.78);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.04em;
  color:var(--fog);
}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 18px;
  border:1px solid transparent;
  border-radius:2px;
  font-family:var(--font-sans);
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease;
}
.btn--ember{
  background:var(--ember);
  border-color:var(--ember);
  color:var(--ink);
}
.btn--ember:hover,
.btn--ember:focus-visible{
  background:var(--ember-soft);
  border-color:var(--ember-soft);
  color:var(--ink);
}
.btn--ember:active{transform:translateY(1px)}
.btn--ghost{
  background:transparent;
  border-color:var(--steel);
  color:var(--bone);
}
.btn--ghost:hover,
.btn--ghost:focus-visible{
  border-color:var(--jade);
  color:var(--jade);
}

/* ---------- 跳至正文 ---------- */
.skip-link{
  position:fixed;
  top:8px;
  left:8px;
  z-index:300;
  padding:10px 16px;
  background:var(--jade);
  color:var(--ink);
  font-weight:700;
  font-size:14px;
  border-radius:2px;
  transform:translateY(-240%);
  transition:transform .18s ease;
}
.skip-link:focus{
  transform:translateY(0);
  color:var(--ink);
}

/* ---------- 滚动进度光带 ---------- */
.read-progress{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:3px;
  z-index:120;
  pointer-events:none;
  background:rgba(34,49,74,.5);
}
.read-progress__bar{
  display:block;
  height:100%;
  width:100%;
  transform:scaleX(0);
  transform-origin:0 50%;
  background:linear-gradient(90deg,var(--ember) 0%,var(--gold) 58%,var(--jade) 100%);
}

/* ---------- 移动顶部条 ---------- */
.topbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:110;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  height:60px;
  padding:0 16px;
  background:rgba(7,13,24,.94);
  border-bottom:1px solid var(--steel);
  backdrop-filter:blur(10px);
}
.topbar__brand{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--bone);
  text-decoration:none;
}
.topbar__brand:hover{color:var(--bone)}
.topbar__mark{
  width:16px;
  height:16px;
  flex:0 0 auto;
  background:linear-gradient(140deg,var(--ember),var(--gold));
  clip-path:polygon(50% 0,100% 30%,100% 70%,50% 100%,0 70%,0 30%);
}
.topbar__name{
  font-size:16px;
  font-weight:800;
  letter-spacing:.02em;
}
.topbar__toggle{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  background:transparent;
  border:1px solid var(--steel);
  border-radius:2px;
  color:var(--bone);
  font-size:13px;
  font-weight:600;
  letter-spacing:.1em;
  cursor:pointer;
  transition:border-color .16s ease,color .16s ease;
}
.topbar__toggle:hover,
.topbar__toggle:focus-visible{
  border-color:var(--ember);
  color:var(--ember-soft);
}
.topbar__toggle-bars{
  display:block;
  width:16px;
  height:2px;
  background:var(--ember);
  box-shadow:0 5px 0 var(--ember),0 -5px 0 var(--ember);
}
.topbar__toggle-text{line-height:1}

/* ---------- 侧边轨道 / 抽屉 ---------- */
.rail{
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  z-index:130;
  width:min(86vw,320px);
  display:flex;
  flex-direction:column;
  gap:20px;
  padding:22px 16px 20px;
  overflow-y:auto;
  background:linear-gradient(180deg,#0C1728 0%,var(--ink) 62%);
  border-right:1px solid var(--steel);
  transform:translateX(-101%);
  transition:transform .28s cubic-bezier(.22,.61,.36,1);
}
.rail[data-open]{transform:translateX(0)}

.rail__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding-bottom:16px;
  border-bottom:1px solid var(--steel);
}
.rail__brand{
  display:inline-flex;
  align-items:center;
  gap:11px;
  color:var(--bone);
  text-decoration:none;
}
.rail__brand:hover{color:var(--bone)}
.rail__mark{
  width:26px;
  height:26px;
  flex:0 0 auto;
  background:linear-gradient(140deg,var(--ember) 0%,var(--gold) 72%);
  clip-path:polygon(50% 0,100% 30%,100% 70%,50% 100%,0 70%,0 30%);
}
.rail__brand-text{display:flex;flex-direction:column;gap:2px}
.rail__name{
  font-size:17px;
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.2;
}
.rail__brand-sub{
  font-family:var(--font-mono);
  font-size:9.5px;
  letter-spacing:.2em;
  color:var(--fog);
  line-height:1.2;
}
.rail__close{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  background:transparent;
  border:1px solid var(--steel);
  border-radius:2px;
  color:var(--fog);
  font-size:12px;
  letter-spacing:.1em;
  cursor:pointer;
  transition:border-color .16s ease,color .16s ease;
}
.rail__close:hover,
.rail__close:focus-visible{
  border-color:var(--ember);
  color:var(--ember-soft);
}
.rail__close-label{line-height:1}

.rail__nav{flex:1 1 auto;min-height:0}
.rail__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:2px;
}
.rail__item{display:block}
.rail__link{
  position:relative;
  display:grid;
  grid-template-columns:32px 1fr;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border-bottom:1px solid var(--steel);
  color:var(--bone);
  font-size:15px;
  font-weight:500;
  text-decoration:none;
  transition:background .18s ease,color .18s ease;
}
.rail__link::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  height:1px;
  width:0;
  background:var(--jade);
  transition:width .18s ease;
}
.rail__link:hover,
.rail__link:focus-visible{
  background:var(--glass);
  color:var(--bone);
}
.rail__link:hover::after,
.rail__link:focus-visible::after{width:100%}
.rail__link:hover .rail__num,
.rail__link:focus-visible .rail__num{color:var(--ember-soft)}

.rail__num{
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--fog);
  transition:color .18s ease;
}
.rail__label{display:block;line-height:1.3}

.rail__link[aria-current="page"]{
  background:linear-gradient(90deg,rgba(255,90,31,.2) 0%,rgba(255,90,31,.04) 62%,transparent 100%);
  color:var(--gold);
  font-weight:700;
}
.rail__link[aria-current="page"]::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  bottom:6px;
  width:3px;
  background:var(--ember);
}
.rail__link[aria-current="page"] .rail__num{color:var(--ember)}

.rail__foot{
  margin-top:auto;
  display:grid;
  gap:12px;
  padding-top:16px;
  border-top:1px solid var(--steel);
}
.rail__status{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  line-height:1.65;
  letter-spacing:.02em;
  color:var(--fog);
}
.rail__dot{
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:6px;
  border-radius:50%;
  background:var(--jade);
  box-shadow:0 0 0 3px rgba(47,211,174,.16);
  vertical-align:middle;
}
.rail__batch{color:var(--gold);font-weight:700}
.rail__cta{width:100%}

.nav-scrim{
  position:fixed;
  inset:0;
  z-index:125;
  background:rgba(7,13,24,.72);
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
}
.nav-scrim[data-open]{opacity:1;visibility:visible}

/* ---------- 页脚 ---------- */
.site-footer{
  position:relative;
  margin-top:clamp(48px,8vw,96px);
  padding:clamp(40px,6vw,72px) var(--gutter) 32px;
  background:linear-gradient(180deg,var(--deep) 0%,var(--ink) 100%);
  border-top:1px solid var(--steel);
}
.site-footer::before{
  content:"";
  position:absolute;
  top:-1px;
  left:0;
  width:min(320px,50%);
  height:3px;
  background:linear-gradient(90deg,var(--ember),var(--gold) 55%,transparent);
  transform:skewX(-24deg);
  transform-origin:0 0;
}
.footer__inner{
  max-width:1240px;
  margin:0 auto;
  display:grid;
  gap:clamp(26px,4vw,44px);
}
.footer__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:14px 24px;
  padding-bottom:20px;
  border-bottom:1px solid var(--steel);
}
.footer__brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--bone);
  text-decoration:none;
}
.footer__brand:hover{color:var(--bone)}
.footer__mark{
  width:22px;
  height:22px;
  flex:0 0 auto;
  background:linear-gradient(140deg,var(--ember),var(--gold));
  clip-path:polygon(50% 0,100% 30%,100% 70%,50% 100%,0 70%,0 30%);
}
.footer__brand-name{
  font-size:20px;
  font-weight:800;
  letter-spacing:.04em;
}
.footer__claim{
  margin:0;
  font-family:var(--font-serif);
  font-size:clamp(15px,1.8vw,19px);
  color:var(--fog);
}
.footer__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(22px,3vw,36px);
}
.footer__col{min-width:0}
.footer__col--wide{grid-column:auto}
.footer__title{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--ember-soft);
}
.footer__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.footer__list--contact{gap:10px}
.footer__link{
  display:inline-block;
  font-size:14.5px;
  color:var(--fog);
  background-image:linear-gradient(var(--jade),var(--jade));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:0 1px;
  transition:background-size .18s ease,color .16s ease;
}
.footer__link:hover,
.footer__link:focus-visible{
  color:var(--jade);
  background-size:100% 1px;
}
.footer__text{
  display:inline-block;
  font-size:14.5px;
  line-height:1.7;
  color:var(--fog);
  word-break:break-word;
}
.footer__meta{
  display:grid;
  gap:8px;
  padding-top:20px;
  border-top:1px solid var(--steel);
}
.footer__note{
  margin:0;
  font-size:13px;
  color:var(--fog);
}
.footer__legal{
  margin:0;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.02em;
  color:var(--fog);
}

/* ---------- 断点 ---------- */
@media (min-width:720px){
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer__col--wide{grid-column:1 / -1}
}

@media (min-width:1024px){
  body{padding-top:0;padding-left:var(--rail-w)}

  .topbar{display:none}

  .rail{
    width:var(--rail-w);
    transform:none;
    padding:26px 18px 22px;
    background:linear-gradient(180deg,#0C1728 0%,var(--ink) 58%);
  }
  .rail__close{display:none}

  .nav-scrim{display:none}

  .read-progress{left:var(--rail-w)}

  .footer__grid{grid-template-columns:1fr 1fr 1.3fr}
  .footer__col--wide{grid-column:auto}

  .site-footer{padding-left:calc(var(--gutter) + 8px)}
}

@media (min-width:1280px){
  :root{--rail-w:288px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .rail{transition:none}
}