:root{
  --ink:#0F1B2D;
  --ink-soft:#1E2F45;
  --paper:#F5F0E6;
  --paper-deep:#EDE5D6;
  --paper-card:#FFFDF7;
  --signal:#FF6B35;
  --slate:#5A7D8C;
  --archive:#6B4F3A;
  --amber:#F2A65A;
  --rule:#D8D0C0;
  --live:#3F7D5B;
  --focus:#2F6FED;
  --font-display:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",Georgia,serif;
  --font-body:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --font-mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --radius-lg:22px;
  --radius-md:14px;
  --radius-pill:999px;
  --shell:1180px;
  --dur:200ms;
  --ease:ease-out;
  --on-ink-strong:#F5F0E6;
  --on-ink-soft:rgba(245,240,230,.72);
  --on-ink-faint:rgba(245,240,230,.5);
  --hairline:rgba(216,208,192,.18);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.75;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4,p,figure,blockquote{margin:0}
strong{font-weight:700}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px}
.section-head__index,[data-year]{font-variant-numeric:tabular-nums}

.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{
  position:absolute;left:1rem;top:-4.5rem;z-index:200;
  display:inline-block;padding:.6rem 1.1rem;
  background:var(--signal);color:var(--ink);
  font-size:.9rem;font-weight:700;
  border-radius:var(--radius-md);
  transition:top var(--dur) var(--ease);
}
.skip-link:focus{top:.75rem}

.container{width:100%;max-width:var(--shell);margin:0 auto;padding:0 1.25rem}
.lede{font-size:clamp(1.02rem,1.6vw,1.2rem);line-height:1.7;color:rgba(15,27,45,.78);max-width:62ch}
.prose{max-width:70ch}
.prose p + p{margin-top:1em}
.prose h2,.prose h3{font-family:var(--font-display);font-weight:900;margin:1.6em 0 .5em}
.prose a{color:var(--archive);text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:4px}
.prose a:hover{text-decoration-color:var(--signal)}

.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.06em;color:var(--slate);padding:.85rem 0}
.breadcrumbs__item{display:inline-flex;align-items:center}
.breadcrumbs__item + .breadcrumbs__item::before{content:"/";margin-right:.4rem;color:var(--rule)}
.breadcrumbs__link{color:var(--slate);transition:color var(--dur) var(--ease)}
.breadcrumbs__link:hover{color:var(--signal)}

.section-head{display:flex;align-items:flex-start;gap:1.1rem;border-top:1px solid var(--rule);padding-top:1rem;margin-bottom:1.6rem}
.section-head__index{font-family:var(--font-mono);font-weight:600;font-size:clamp(2.2rem,5vw,3.5rem);line-height:.88;color:var(--archive);opacity:.55;flex:0 0 auto}
.section-head__title{font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,2.6vw,1.95rem);line-height:1.25;letter-spacing:.005em}
.section-head__note{font-size:.88rem;color:var(--slate);margin-top:.35rem;max-width:52ch}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.7rem 1.35rem;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  font-size:.94rem;font-weight:600;line-height:1.2;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
.btn--signal{background:var(--signal);color:var(--ink)}
.btn--signal:hover{background:var(--amber);transform:translateY(-2px)}
.btn--ghost{background:transparent;border-color:rgba(245,240,230,.35);color:var(--on-ink-strong)}
.btn--ghost:hover{border-color:var(--signal);color:var(--amber);transform:translateY(-2px)}

.tag{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.2rem .65rem;
  border-radius:var(--radius-pill);
  border:1px solid rgba(90,125,140,.3);
  background:rgba(90,125,140,.14);
  color:var(--slate);
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;
}
.tag--amber{background:rgba(242,166,90,.22);border-color:rgba(242,166,90,.5);color:var(--archive)}
.tag--live{background:rgba(63,125,91,.14);border-color:rgba(63,125,91,.35);color:var(--live)}
.tag--live::before{content:"";width:.4rem;height:.4rem;border-radius:50%;background:var(--live)}

.card{
  background:var(--paper-card);
  border:1px solid var(--rule);
  border-radius:var(--radius-lg);
  padding:1.3rem;
  transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease);
}
.card:hover{transform:translateY(-3px);border-color:var(--signal);background:#FFFBF0;box-shadow:0 12px 26px rgba(15,27,45,.09)}
.card__meta{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.06em;color:var(--slate);margin-bottom:.5rem}
.card__title{font-family:var(--font-display);font-weight:900;font-size:1.1rem;line-height:1.35;margin-bottom:.45rem}
.card__text{font-size:.94rem;color:rgba(15,27,45,.74)}

.grid{display:grid;gap:1.25rem}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(1.25rem,3vw,2.6rem);align-items:start}

.media{margin:0}
.media__frame{
  position:relative;overflow:hidden;
  border:1px solid var(--rule);
  border-radius:var(--radius-lg);
  background:linear-gradient(160deg,var(--paper-deep),(#E4DAC7));
  aspect-ratio:16/10;
}
.media__frame--tall{aspect-ratio:4/5}
.media__frame::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(15,27,45,.08) 1px,transparent 1px);
  background-size:4px 4px;opacity:.5;
}
.media__img{width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(.96)}
.media__caption{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.04em;color:var(--slate);margin-top:.5rem}

html.has-js [data-reveal]{opacity:.6;transform:translateY(10px);transition:opacity 220ms var(--ease),transform 220ms var(--ease)}
html.has-js [data-reveal].is-visible{opacity:1;transform:none}

/* ---------- 命令栏 ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:var(--ink);
  color:var(--on-ink-strong);
  border-bottom:1px solid var(--hairline);
  box-shadow:0 1px 0 rgba(15,27,45,.35);
}
.header__bar{
  max-width:var(--shell);margin:0 auto;
  padding:.55rem 1.25rem;
  display:flex;align-items:center;gap:1.25rem;
}
.brand{display:flex;align-items:center;gap:.65rem;flex:0 0 auto}
.brand__mark{
  position:relative;flex:0 0 auto;
  width:1.95rem;height:1.95rem;border-radius:8px;
  background:linear-gradient(135deg,var(--signal),var(--amber));
}
.brand__mark::after{
  content:"";position:absolute;inset:.42rem .38rem;
  border-left:2px solid rgba(15,27,45,.72);
  border-right:2px solid rgba(15,27,45,.72);
}
.brand__text{display:flex;flex-direction:column;line-height:1.15}
.brand__name{font-family:var(--font-display);font-weight:900;font-size:1.06rem;letter-spacing:.05em;color:var(--on-ink-strong)}
.brand__tagline{font-size:.68rem;letter-spacing:.09em;color:var(--on-ink-faint)}

.site-nav{display:flex;align-items:center;gap:1rem;margin-left:auto}
.nav-list{display:flex;align-items:center;gap:.15rem}
.nav-list__item{display:flex}
.nav-link{
  display:block;padding:.45rem .72rem;
  border-radius:var(--radius-pill);
  font-size:.9rem;color:var(--on-ink-soft);
  white-space:nowrap;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.nav-link:hover{background:rgba(245,240,230,.1);color:var(--paper)}
.nav-link[aria-current="page"]{background:var(--paper);color:var(--ink);font-weight:600}

.header__tools{display:flex;align-items:center;gap:.5rem;padding-left:1rem;border-left:1px solid var(--hairline)}
.tool-link{
  padding:.4rem .65rem;border-radius:var(--radius-pill);
  border:1px solid transparent;font-size:.82rem;color:var(--on-ink-soft);
  white-space:nowrap;
  transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.tool-link:hover{border-color:var(--amber);color:var(--paper);background:rgba(242,166,90,.1)}
.version-switch{
  display:flex;align-items:center;gap:.3rem;
  padding:.22rem .28rem .22rem .6rem;
  border-radius:var(--radius-pill);
  background:rgba(245,240,230,.08);
}
.version-switch__label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;color:var(--on-ink-faint)}
.version-switch__opt{
  padding:.26rem .62rem;border-radius:var(--radius-pill);
  font-size:.79rem;color:var(--on-ink-soft);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.version-switch__opt:hover{color:var(--paper);background:rgba(245,240,230,.12)}
.version-switch__opt.is-current{background:var(--signal);color:var(--ink);font-weight:700}

.nav-toggle{
  display:none;align-items:center;gap:.5rem;margin-left:auto;
  padding:.45rem .8rem;
  border:1px solid rgba(245,240,230,.32);border-radius:var(--radius-pill);
  color:var(--on-ink-strong);font-size:.85rem;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.nav-toggle:hover{border-color:var(--signal);background:rgba(255,107,53,.14)}
.nav-toggle__icon{
  width:16px;height:2px;border-radius:2px;background:currentColor;
  box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor;
}
.nav-toggle[aria-expanded="true"]{border-color:var(--signal);background:rgba(255,107,53,.2)}

/* ---------- 版本轴 ---------- */
.version-axis{position:relative;background:var(--ink-soft);border-top:1px solid var(--hairline)}
.version-axis__inner{
  max-width:var(--shell);margin:0 auto;
  padding:.3rem 1.25rem;
  display:flex;align-items:center;gap:1rem;
}
.version-axis__caption{
  flex:0 0 auto;
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.2em;
  color:var(--on-ink-faint);text-transform:uppercase;
}
.version-axis__list{
  display:flex;align-items:center;gap:.4rem;
  overflow-x:auto;padding:.15rem 0;
  scrollbar-width:thin;
}
.version-axis__item{display:flex;align-items:center;flex:0 0 auto}
.version-axis__item + .version-axis__item::before{
  content:"";display:block;width:.85rem;height:1px;background:rgba(245,240,230,.25);
}
.version-axis__node{
  display:flex;align-items:baseline;gap:.35rem;
  padding:.22rem .68rem;border-radius:var(--radius-pill);
  border:1px solid transparent;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.version-axis__ver{font-family:var(--font-mono);font-weight:600;font-size:.82rem;color:var(--on-ink-strong)}
.version-axis__year{font-family:var(--font-mono);font-size:.66rem;color:var(--on-ink-faint)}
.version-axis__node:hover{border-color:var(--amber);background:rgba(242,166,90,.16)}
.version-axis__node.is-current{background:var(--signal);border-color:var(--signal)}
.version-axis__node.is-current .version-axis__ver{color:var(--ink)}
.version-axis__node.is-current .version-axis__year{color:rgba(15,27,45,.72)}

.scroll-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(245,240,230,.12)}
.scroll-progress__bar{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--signal),var(--amber))}

/* ---------- 页脚 ---------- */
.site-footer{
  margin-top:clamp(3rem,8vw,6rem);
  background:var(--ink);color:var(--on-ink-strong);
  border-top:1px solid var(--hairline);
}
.footer__inner{
  max-width:var(--shell);margin:0 auto;
  padding:clamp(2rem,5vw,3.5rem) 1.25rem 1.9rem;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2.1fr) minmax(0,1.15fr);
  gap:clamp(1.5rem,4vw,3rem);
}
.footer__brand{display:flex;flex-direction:column}
.footer__logo{font-family:var(--font-display);font-weight:900;font-size:1.3rem;letter-spacing:.05em}
.footer__tagline{margin-top:.5rem;font-size:.85rem;color:var(--on-ink-soft);max-width:24ch}
.footer__legal{margin-top:1rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;color:var(--on-ink-faint)}
.footer__nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem}
.footer__col{display:flex;flex-direction:column}
.footer__col-title{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--amber);margin-bottom:.85rem;
}
.footer__list{display:flex;flex-direction:column;gap:.45rem}
.footer__link{
  font-size:.9rem;color:var(--on-ink-soft);
  transition:color var(--dur) var(--ease);
}
.footer__link:hover{color:var(--paper);text-decoration:underline;text-decoration-color:var(--signal);text-underline-offset:4px}
.footer__contact{display:flex;flex-direction:column}
.footer__contact-item{font-size:.85rem;line-height:1.65;color:var(--on-ink-soft)}
.footer__actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.1rem}
.footer__base{
  max-width:var(--shell);margin:0 auto;
  padding:1rem 1.25rem 1.6rem;
  border-top:1px solid var(--hairline);
  display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:space-between;
}
.footer__base-text{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.04em;color:var(--on-ink-faint)}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .brand__tagline{display:none}
  .nav-link{padding:.45rem .55rem;font-size:.86rem}
  .tool-link{font-size:.78rem;padding:.38rem .5rem}
}
@media (max-width:960px){
  .nav-toggle{display:inline-flex}
  .site-nav{
    position:absolute;top:100%;left:0;right:0;
    display:none;flex-direction:column;align-items:stretch;gap:0;
    margin:0;padding:.85rem 1.25rem 1.15rem;
    background:var(--ink-soft);
    border-top:1px solid var(--hairline);
    box-shadow:0 18px 30px rgba(15,27,45,.35);
    max-height:calc(100vh - 6rem);overflow-y:auto;
  }
  .site-nav[data-open]{display:flex}
  .nav-list{flex-direction:column;align-items:stretch;gap:.2rem;width:100%}
  .nav-link{padding:.65rem .85rem;border-radius:var(--radius-md);font-size:.98rem}
  .nav-link[aria-current="page"]{background:var(--signal);color:var(--ink)}
  .header__tools{
    flex-direction:column;align-items:stretch;gap:.45rem;
    margin-top:.85rem;padding:.85rem 0 0;
    border-left:0;border-top:1px solid var(--hairline);
  }
  .tool-link{padding:.6rem .85rem;border-color:rgba(245,240,230,.2);font-size:.9rem}
  .version-switch{justify-content:space-between;padding:.3rem .3rem .3rem .85rem}
  .version-switch__opt{padding:.35rem .8rem}
  .footer__inner{grid-template-columns:1fr;gap:1.9rem}
  .footer__nav{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .grid--2,.grid--3{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
}
@media (max-width:560px){
  .header__bar{padding:.5rem 1rem}
  .container{padding:0 1rem}
  .version-axis__inner{padding:.3rem 1rem;gap:.6rem}
  .version-axis__caption{display:none}
  .footer__nav{grid-template-columns:1fr}
  .footer__base{flex-direction:column}
  .section-head{gap:.75rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  html.has-js [data-reveal]{opacity:1;transform:none}
  .card:hover,.btn:hover{transform:none}
}