:root{
  --ink:#0B2B26;
  --ink-deep:#081F1B;
  --felt:#123B33;
  --gold:#C9A24B;
  --gold-soft:#E8CE92;
  --cyan:#35E0C8;
  --orange:#F08A3C;
  --paper:#F4EFE3;
  --char:#101512;
  --jade:#6E8F86;
  --brick:#A33A2E;
  --line:rgba(201,162,75,.28);
  --line-strong:rgba(201,162,75,.55);
  --text:rgba(244,239,227,.84);
  --text-dim:rgba(244,239,227,.7);
  --font-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC","WenQuanYi Micro Hei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:"JetBrains Mono","SFMono-Regular",ui-monospace,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --shell:1200px;
  --radius:4px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow-1:0 10px 26px rgba(0,0,0,.34);
  --shadow-2:0 18px 42px rgba(0,0,0,.46);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(900px 520px at 88% -8%,rgba(53,224,200,.10),transparent 62%),
    radial-gradient(720px 440px at -6% 14%,rgba(240,138,60,.09),transparent 60%),
    var(--ink);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.75;
  overflow-x:hidden;
}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img,picture,svg{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
a{color:inherit;text-decoration:none}
strong{font-weight:700;color:var(--paper)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ink-deep)}
::-webkit-scrollbar-thumb{background:rgba(201,162,75,.42);border-radius:6px}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
#main-content{scroll-margin-top:130px}

/* ---------- 容器与排版 ---------- */
.shell{width:100%;max-width:var(--shell);margin:0 auto;padding-left:20px;padding-right:20px}
.page-main{display:block;padding-top:36px;padding-bottom:72px}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase}
.lede{font-size:17px;line-height:1.8;color:var(--text);max-width:34em}
.prose{max-width:34em;font-size:16px;line-height:1.75;color:var(--text)}
.prose p+p{margin-top:.9em}
.prose h3{font-size:22px;font-weight:900;letter-spacing:.02em;color:var(--paper);margin-top:1.4em;margin-bottom:.5em}
.muted{color:var(--jade)}
.section-head{margin-bottom:24px}
.section-head__meta{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;color:var(--gold)}
.section-head__meta::after{content:"";width:46px;height:1px;background:var(--line-strong);flex:none}
.section-head__title{font-size:clamp(21px,3.4vw,32px);font-weight:900;letter-spacing:.02em;line-height:1.3;color:var(--paper)}

/* ---------- 网格 ---------- */
.grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid--tight{gap:12px}

/* ---------- 按钮与标签 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 18px;border-radius:3px;border:1px solid transparent;
  font-size:14px;font-weight:700;letter-spacing:.02em;line-height:1.4;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.btn--gold{background:var(--gold);color:#1F1706;border-color:var(--gold)}
.btn--gold:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
.btn--ghost{background:transparent;color:var(--gold-soft);border-color:rgba(232,206,146,.5)}
.btn--ghost:hover{background:rgba(232,206,146,.12);color:var(--paper);border-color:var(--gold-soft)}
.btn--primary{background:var(--orange);color:#1A1005;border-color:var(--orange)}
.btn--primary:hover{background:#FF9C52;border-color:#FF9C52}
.tag{
  display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:2px;
  border:1px solid var(--line-strong);color:var(--gold-soft);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;line-height:1.6;
}
.tag--cyan{border-color:rgba(53,224,200,.5);color:var(--cyan)}
.tag--orange{border-color:rgba(240,138,60,.55);color:var(--orange);background:rgba(240,138,60,.1)}
.tag--brick{border-color:rgba(163,58,46,.7);color:#E08C7D;background:rgba(163,58,46,.14)}

/* ---------- 卡片 ---------- */
.card{
  position:relative;border-radius:var(--radius);padding:20px 22px;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease),background-color .2s var(--ease);
}
.card--dark{background:var(--felt);border:1px solid rgba(201,162,75,.22);box-shadow:var(--shadow-1)}
.card--paper{background:var(--paper);color:rgba(16,21,18,.86);border:1px solid rgba(16,21,18,.14)}
.card--paper .muted,.card--paper .stat__label{color:rgba(16,21,18,.58)}
.card--paper .stat__num{color:#8A6A16}
.card--paper h3{color:var(--char)}
.card--outline{background:transparent;border:1px dashed var(--line-strong)}
.card--lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--line-strong)}
.stat{display:flex;flex-direction:column;gap:6px}
.stat__num{font-family:var(--font-mono);font-weight:700;font-size:clamp(30px,5vw,52px);line-height:1;letter-spacing:-.01em;color:var(--gold-soft)}
.stat__label{font-size:12.5px;letter-spacing:.05em;color:var(--jade)}

/* ---------- 面包屑 ---------- */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:0;margin-bottom:22px;font-family:var(--font-mono);font-size:12px;color:var(--jade)}
.breadcrumb li{display:flex;align-items:center}
.breadcrumb li::after{content:"/";margin:0 9px;color:rgba(110,143,134,.55)}
.breadcrumb li:last-child::after{display:none}
.breadcrumb a{border-bottom:1px solid rgba(110,143,134,.45);transition:color .18s var(--ease),border-color .18s var(--ease)}
.breadcrumb a:hover{color:var(--paper);border-color:var(--gold)}

/* ---------- 垂直索引条 ---------- */
.toc{font-size:14px}
.toc__title{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;color:var(--gold);margin-bottom:10px}
.toc__list{display:flex;flex-direction:column;gap:2px}
.toc__list a{display:block;padding:7px 14px;color:var(--jade);border-left:2px solid transparent;transition:color .18s var(--ease),background-color .18s var(--ease),border-color .18s var(--ease)}
.toc__list a:hover{color:var(--paper);background:rgba(53,224,200,.07)}
.toc__list a[aria-current="location"]{color:var(--paper);border-left-color:var(--cyan);background:rgba(53,224,200,.1)}

/* ---------- 图片容器基础 ---------- */
.media{
  position:relative;display:block;overflow:hidden;border-radius:var(--radius);
  background:linear-gradient(140deg,var(--felt),var(--ink-deep));
  border:1px solid rgba(201,162,75,.22);
}
.media>img,.media>picture>img{width:100%;height:100%;object-fit:cover}
.media::after{
  content:"";position:absolute;top:9px;right:9px;width:16px;height:16px;
  border-top:1px solid var(--gold);border-right:1px solid var(--gold);opacity:.72;pointer-events:none;
}
.media--wide{aspect-ratio:16/10}
.media--square{aspect-ratio:1/1}
.media--tall{aspect-ratio:3/4}
.media--banner{aspect-ratio:21/9}
.media__label{
  position:absolute;left:10px;bottom:10px;padding:3px 9px;border-radius:2px;
  background:rgba(16,21,18,.78);border:1px solid var(--line-strong);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--gold-soft);
}

/* ---------- 头部 ---------- */
.skip-link{
  position:fixed;left:12px;top:-70px;z-index:200;
  padding:10px 16px;border-radius:3px;
  background:var(--orange);color:#1A1005;font-size:14px;font-weight:700;
  transition:top .2s var(--ease);
}
.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:80}
.header-top{background:var(--char);border-bottom:1px solid var(--line)}
.header-top__inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:10px;padding-bottom:10px;min-height:60px;flex-wrap:wrap}
.brand{display:flex;align-items:baseline;gap:14px;min-width:0}
.brand__mark{font-size:19px;font-weight:900;letter-spacing:.03em;color:var(--paper);white-space:nowrap}
.brand__mark span{margin-left:6px;font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.18em;color:var(--gold)}
.brand__line{font-size:12.5px;letter-spacing:.02em;color:var(--jade)}
.header-meta{display:flex;align-items:center;gap:18px;margin-left:auto;font-family:var(--font-mono);font-size:12px;color:var(--jade)}
.header-meta__ver{display:inline-flex;align-items:center;gap:8px;color:var(--gold-soft);white-space:nowrap}
.header-meta__ver i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.header-meta__mail{border-bottom:1px dashed rgba(110,143,134,.6);transition:color .18s var(--ease),border-color .18s var(--ease)}
.header-meta__mail:hover{color:var(--paper);border-color:var(--gold)}
.header-cta{flex:none}
.header-bar{position:relative;background:rgba(11,43,38,.96);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.header-bar__inner{display:flex;align-items:center;gap:16px;min-height:54px}
.nav-toggle{
  display:none;align-items:center;gap:10px;
  padding:9px 14px;border:1px solid var(--line-strong);border-radius:3px;
  color:var(--gold-soft);font-size:13px;letter-spacing:.1em;
  transition:background-color .2s var(--ease),border-color .2s var(--ease);
}
.nav-toggle:hover{background:rgba(232,206,146,.1);border-color:var(--gold-soft)}
.nav-toggle__bars{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:16px}
.nav-toggle__bars i{display:block;height:1.5px;background:currentColor;transition:transform .2s var(--ease),opacity .2s var(--ease)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
.site-nav{flex:1 1 auto}
.site-nav__list{display:flex;align-items:stretch;gap:4px}
.site-nav__list a{
  position:relative;display:flex;align-items:center;min-height:54px;padding:0 16px;
  font-size:15px;color:var(--text-dim);
  border-bottom:2px solid transparent;
  transition:color .18s var(--ease),background-color .18s var(--ease),border-color .18s var(--ease);
}
.site-nav__list a:hover{color:var(--paper);background:rgba(53,224,200,.08)}
.site-nav__list a[aria-current="page"]{color:var(--paper);border-bottom-color:var(--cyan)}
.scroll-progress{
  position:absolute;left:0;bottom:0;width:100%;height:2px;z-index:5;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--cyan),var(--gold));
  pointer-events:none;
}

/* ---------- 返回顶部 ---------- */
.to-top{
  position:fixed;right:18px;bottom:18px;z-index:70;
  width:46px;height:46px;display:grid;place-items:center;
  border-radius:3px;background:var(--orange);color:#1A1005;
  border:1px solid rgba(16,21,18,.35);box-shadow:var(--shadow-1);
  font-family:var(--font-mono);font-size:15px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s var(--ease),background-color .2s var(--ease);
}
.to-top[data-visible]{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:#FF9C52}

/* ---------- 页脚 ---------- */
.site-footer{
  margin-top:72px;background:var(--char);color:var(--text-dim);
  border-top:1px solid var(--line-strong);
  box-shadow:inset 0 1px 0 rgba(232,206,146,.14);
}
.footer-main{display:grid;grid-template-columns:1fr;gap:34px;padding-top:52px;padding-bottom:36px}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.footer-brand__note{font-size:14px;line-height:1.75;color:var(--jade);max-width:32em}
.footer-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:28px}
.footer-col__title{font-family:var(--font-mono);font-size:11.5px;font-weight:500;letter-spacing:.18em;color:var(--gold);margin-bottom:12px}
.footer-col__list{display:flex;flex-direction:column;gap:9px}
.footer-col__list a{
  display:inline-block;font-size:14px;color:var(--text-dim);
  border-bottom:1px solid transparent;
  transition:color .18s var(--ease),border-color .18s var(--ease);
}
.footer-col__list a:hover{color:var(--paper);border-color:var(--gold)}
.footer-contact{border-top:1px dashed var(--line);padding-top:18px;padding-bottom:18px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.footer-contact__line,.footer-contact__note{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.02em;color:var(--jade)}
.footer-contact__label{display:inline-block;margin-right:10px;padding:2px 8px;border:1px solid var(--line-strong);border-radius:2px;color:var(--gold-soft);font-size:11px;letter-spacing:.12em}
.footer-legal{
  border-top:1px solid rgba(201,162,75,.18);padding-top:16px;padding-bottom:22px;
  display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.02em;color:rgba(110,143,134,.85);
}

/* ---------- 平板 ---------- */
@media (min-width:768px){
  .shell{padding-left:32px;padding-right:32px}
  .page-main{padding-top:48px;padding-bottom:88px}
}
@media (min-width:880px){
  .footer-main{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:56px}
}

/* ---------- 移动端导航抽屉 ---------- */
@media (max-width:900px){
  .nav-toggle{display:inline-flex}
  .site-nav{
    position:absolute;left:0;right:0;top:100%;z-index:60;
    background:var(--felt);border-bottom:1px solid var(--line-strong);
    box-shadow:var(--shadow-2);
    padding:8px 0 14px;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s var(--ease);
  }
  .site-nav[data-open]{opacity:1;visibility:visible;transform:none}
  .site-nav__list{flex-direction:column;gap:0}
  .site-nav__list a{
    width:100%;min-height:48px;padding:0 24px;
    border-bottom:1px solid rgba(201,162,75,.14);
    border-left:2px solid transparent;
  }
  .site-nav__list a:hover{background:rgba(53,224,200,.09)}
  .site-nav__list a[aria-current="page"]{border-bottom-color:rgba(201,162,75,.14);border-left-color:var(--cyan);background:rgba(53,224,200,.1)}
}
@media (max-width:900px){
  .header-meta{display:none}
}
@media (max-width:720px){
  .brand__line{display:none}
  .header-top__inner{min-height:56px}
  .header-cta{padding:8px 13px;font-size:13px}
  .footer-main{padding-top:40px}
}
@media (max-width:420px){
  .nav-toggle__label{display:none}
  .nav-toggle{padding:9px 11px}
}

/* ---------- 减弱动效 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .card--lift:hover,.to-top[data-visible]{transform:none}
  .card--lift:hover{box-shadow:var(--shadow-1)}
}
