:root{
  --bg-main:#141414;
  --bg-secondary:#1f1f1f;
  --bg-panel:#2a2a2a;
  --bg-deep:#0d0d0d;
  --accent:#39ff14;
  --accent-dim:rgba(57,255,20,.15);
  --warn:#b00020;
  --warn-dim:rgba(176,0,32,.15);
  --text-main:#e6e6e6;
  --text-secondary:#a0a0a0;
  --text-dim:#737373;
  --border:#3a3a3a;
  --gradient:linear-gradient(135deg,#39ff14 0%,#b00020 100%);
  --font-head:"Noto Sans SC","Microsoft YaHei",sans-serif;
  --font-body:"Noto Sans SC","Helvetica Neue",Arial,sans-serif;
  --font-mono:"JetBrains Mono","Courier New",monospace;
  --container-w:1200px;
  --radius:2px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.7;
  color:var(--text-main);
  background-color:var(--bg-main);
  background-image:
    radial-gradient(720px 360px at 85% -5%,rgba(57,255,20,.05),transparent 65%),
    radial-gradient(900px 420px at 10% 110%,rgba(176,0,32,.06),transparent 65%),
    linear-gradient(rgba(57,255,20,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(57,255,20,.02) 1px,transparent 1px);
  background-repeat:no-repeat,no-repeat,repeat,repeat;
  background-position:85% -5%,10% 110%,0 0,0 0;
  background-size:auto,auto,32px 32px,32px 32px;
  min-height:100vh;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);font-weight:900;line-height:1.2;color:var(--text-main)}
p{margin-bottom:1rem}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:4px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--accent);color:#000}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.container{width:100%;max-width:var(--container-w);margin-inline:auto;padding-inline:1.25rem}
@media (min-width:769px){.container{padding-inline:1.5rem}}
#main-content{outline:none}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.625rem 1.25rem;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.875rem;
  line-height:1.4;
  border:1px solid transparent;
  cursor:pointer;
  border-radius:var(--radius);
  text-decoration:none;
  transition:all .25s ease;
}
.btn:hover{text-decoration:none}
.btn--primary{background:var(--accent);color:#000}
.btn--primary:hover{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn--outline{background:transparent;color:var(--text-main);border-color:var(--border)}
.btn--outline:hover{border-color:var(--accent);color:var(--accent)}
.btn--warn{background:var(--warn);color:#fff}
.btn--warn:hover{background:transparent;color:var(--warn);border-color:var(--warn)}
.btn--sm{padding:.375rem .75rem;font-size:.8125rem}

/* ---------- 章节与栅格 ---------- */
.section{padding-block:3.5rem}
.section--alt{background:var(--bg-secondary)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.5rem}
.section-index{font-family:var(--font-mono);font-size:.8125rem;color:var(--accent);letter-spacing:.12em}
.section-title{font-size:clamp(1.5rem,2.5vw,2rem);font-weight:900;margin-bottom:.25rem}
.section-desc{color:var(--text-secondary);font-size:.9375rem;max-width:36rem}
.grid{display:grid;gap:1.5rem}
.grid-cols-2{grid-template-columns:repeat(2,1fr)}
.grid-cols-3{grid-template-columns:repeat(3,1fr)}
.page-hero{padding-block:3.5rem 2.5rem;border-bottom:1px solid var(--border);position:relative}
.page-hero__index{font-family:var(--font-mono);font-size:.8125rem;color:var(--accent);letter-spacing:.14em;display:block;margin-bottom:.5rem}
.page-hero__title{font-size:clamp(2rem,4vw,3.25rem);font-weight:900;line-height:1.1;margin-bottom:.75rem}
.page-hero__desc{font-size:1rem;color:var(--text-secondary);max-width:42rem;margin-bottom:0}

/* ---------- 头部 ---------- */
.site-header{position:relative;z-index:100;background:var(--bg-main);border-bottom:1px solid var(--border)}
.skip-link{
  position:fixed;
  top:-3rem;
  left:1rem;
  z-index:200;
  background:var(--accent);
  color:#000;
  padding:.5rem 1rem;
  font-weight:700;
  font-size:.875rem;
  border-radius:var(--radius);
}
.skip-link:focus-visible{top:.75rem}
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:300;pointer-events:none}
.scroll-progress__bar{display:block;height:100%;width:0;background:var(--gradient);box-shadow:0 0 12px rgba(57,255,20,.5)}
.header-topbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.75rem 1.25rem;
  padding-block:1rem;
}
.brand{display:inline-flex;align-items:center;gap:.875rem;min-width:0}
.brand:hover{text-decoration:none}
.brand__bracket{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  background:var(--bg-panel);
  border:1px solid var(--accent);
  color:var(--accent);
  position:relative;
  flex-shrink:0;
}
.brand__bracket::before{content:"";position:absolute;inset:2px;border:1px solid var(--border)}
.brand__glyph{font-family:var(--font-mono);font-size:1.25rem}
.brand__body{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.brand__name{font-family:var(--font-head);font-size:1.25rem;font-weight:900;color:var(--text-main);letter-spacing:.08em}
.brand__desc{font-size:.75rem;color:var(--text-secondary);font-family:var(--font-mono);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand__stamp{
  display:inline-block;
  margin-top:.15rem;
  font-size:.6875rem;
  color:var(--warn);
  border:1px solid var(--warn);
  padding:0 .35rem;
  line-height:1.4;
  letter-spacing:.12em;
  width:fit-content;
  transform:rotate(-1deg);
}
.header-actions{display:flex;align-items:center;gap:.875rem}
.search-console{
  position:relative;
  display:flex;
  align-items:center;
  min-width:280px;
  background:var(--bg-secondary);
  border:1px solid var(--border);
  transition:border-color .3s ease,box-shadow .3s ease;
}
.search-console:focus-within{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 16px rgba(57,255,20,.15)}
.search-console__icon{
  position:relative;
  width:.875rem;
  height:.875rem;
  margin-left:.75rem;
  border:2px solid var(--text-secondary);
  border-radius:50%;
  flex-shrink:0;
}
.search-console__icon::after{
  content:"";
  position:absolute;
  right:-.25rem;
  bottom:-.1875rem;
  width:.375rem;
  height:2px;
  background:var(--text-secondary);
  transform:rotate(45deg);
}
.search-console__input{
  background:transparent;
  border:none;
  outline:none;
  padding:.55rem .6rem;
  font-family:var(--font-body);
  font-size:.875rem;
  color:var(--text-main);
  flex:1;
  min-width:0;
}
.search-console__input::placeholder{color:var(--text-dim)}
.search-console__key{
  margin-right:.5rem;
  font-family:var(--font-mono);
  font-size:.6875rem;
  color:var(--text-dim);
  background:var(--bg-panel);
  border:1px solid var(--border);
  padding:0 .4rem;
  line-height:1.5;
  flex-shrink:0;
}
.nav-toggle{
  display:none;
  align-items:center;
  gap:.5rem;
  background:transparent;
  border:1px solid var(--border);
  padding:.5rem .75rem;
  cursor:pointer;
  color:var(--text-main);
  font-family:var(--font-body);
  font-size:.875rem;
  transition:border-color .3s ease,color .3s ease;
}
.nav-toggle:hover{border-color:var(--accent);color:var(--accent)}
.nav-toggle__label{font-weight:700}
.nav-toggle__bars{width:16px;height:12px;position:relative;display:inline-block}
.nav-toggle__bars i{
  position:absolute;
  left:0;
  display:block;
  width:100%;
  height:2px;
  background:currentColor;
  transition:transform .3s ease,opacity .3s ease,top .3s ease;
}
.nav-toggle__bars i:nth-child(1){top:0}
.nav-toggle__bars i:nth-child(2){top:5px}
.nav-toggle__bars i:nth-child(3){top:10px}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(1){top:5px;transform: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){top:5px;transform:rotate(-45deg)}
.nav-bar{background:var(--bg-secondary);border-top:1px solid var(--border)}
@media (min-width:769px){
  .nav-bar{position:sticky;top:3px;z-index:90}
}
.nav-bar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:3rem;
}
.nav-list{display:flex;list-style:none;gap:.25rem;flex-wrap:wrap}
.nav-item{margin:0}
.nav-link{
  position:relative;
  display:inline-block;
  padding:.5rem .75rem;
  font-size:.875rem;
  font-weight:700;
  color:var(--text-secondary);
  letter-spacing:.04em;
}
.nav-link::before{
  content:attr(data-index);
  font-family:var(--font-mono);
  font-size:.7rem;
  color:var(--text-dim);
  margin-right:.4rem;
}
.nav-link:hover{color:var(--accent);text-decoration:none}
.nav-link::after{
  content:"";
  position:absolute;
  left:.75rem;
  right:.75rem;
  bottom:.15rem;
  height:2px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}
.nav-link:hover::after,.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--text-main);background:var(--bg-panel)}
.nav-link[aria-current="page"]::before{color:var(--accent)}
.nav-status{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.6875rem;color:var(--text-dim);letter-spacing:.1em;white-space:nowrap}
.nav-status__dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent);animation:pulse-dot 2s infinite ease-in-out}
@keyframes pulse-dot{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.4;transform:scale(.8)}
}
.back-top{
  position:fixed;
  right:1.5rem;
  bottom:1.5rem;
  z-index:150;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.75rem;
  height:2.75rem;
  background:var(--bg-panel);
  border:1px solid var(--accent);
  color:var(--accent);
  font-size:1.25rem;
  cursor:pointer;
  transition:background .3s ease,color .3s ease;
}
.back-top:hover{background:var(--accent);color:#000}
.back-top[hidden]{display:none}
.back-top__arrow{font-family:var(--font-mono);line-height:1}

/* ---------- 页脚 ---------- */
.site-footer{position:relative;background:var(--bg-deep)}
.site-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2.5rem;padding-block:3rem 2rem}
.footer-col{min-width:0}
.footer-col--links,.footer-col--contact{padding-left:1.5rem;border-left:1px solid var(--border)}
.footer-brand{display:inline-flex;align-items:center;gap:.5rem}
.footer-brand:hover{text-decoration:none}
.footer-brand__glyph{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.75rem;
  height:1.75rem;
  background:var(--accent);
  color:#000;
  font-family:var(--font-mono);
  font-size:1rem;
}
.footer-brand__name{font-family:var(--font-head);font-weight:900;font-size:1.125rem;color:var(--text-main);transition:color .3s ease}
.footer-brand:hover .footer-brand__name{color:var(--accent)}
.footer-about{margin-top:1rem;font-size:.875rem;color:var(--text-secondary);max-width:34rem}
.footer-promise{
  margin-top:.75rem;
  font-size:.8125rem;
  color:var(--text-dim);
  border-left:2px solid var(--warn);
  padding-left:.875rem;
  max-width:34rem;
}
.footer-heading{
  font-size:.875rem;
  font-weight:900;
  letter-spacing:.14em;
  color:var(--accent);
  margin-bottom:1rem;
  padding-bottom:.5rem;
  border-bottom:1px solid var(--border);
  font-family:var(--font-head);
}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.footer-links a{font-size:.875rem;color:var(--text-secondary)}
.footer-links a:hover{color:var(--accent);text-decoration:none}
.footer-contact{list-style:none;display:flex;flex-direction:column;gap:.5rem;font-size:.8125rem;color:var(--text-secondary);word-break:break-all}
.footer-contact__label{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:.6875rem;
  color:var(--text-dim);
  margin-right:.5rem;
  letter-spacing:.08em;
}
.footer-note{margin-top:.75rem;font-size:.75rem;color:var(--text-dim)}
.footer-bottom{border-top:1px solid var(--border);padding-block:1.25rem}
.footer-bottom__inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.footer-copyright,.footer-icp{font-size:.8125rem;color:var(--text-dim);font-family:var(--font-mono)}

/* ---------- 通用组件 ---------- */
.card{
  background:var(--bg-secondary);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease;
}
.card:hover{border-color:var(--accent);box-shadow:0 0 24px rgba(57,255,20,.08);transform:translateY(-2px)}
.card--accent{border-top:3px solid var(--accent)}
.card__title{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}
.card__text{font-size:.875rem;color:var(--text-secondary);margin-bottom:0}
.card__meta{
  font-family:var(--font-mono);
  font-size:.75rem;
  color:var(--text-dim);
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-top:.75rem;
  margin-bottom:0;
}
.panel{background:var(--bg-panel);border:1px solid var(--border);padding:1.5rem}
.tag{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:.6875rem;
  letter-spacing:.1em;
  padding:.2rem .5rem;
  border:1px solid var(--border);
  color:var(--text-secondary);
}
.tag--ok{color:var(--accent);border-color:var(--accent)}
.tag--warn{color:var(--warn);border-color:var(--warn)}
.divider{
  height:1px;
  background:var(--border);
  border:none;
  margin-block:2rem;
  position:relative;
  overflow:visible;
}
.divider::after{content:"";position:absolute;left:0;top:-1px;width:5rem;height:3px;background:var(--gradient)}
.note{
  background:var(--bg-secondary);
  border-left:3px solid var(--accent);
  padding:1rem 1.25rem;
  font-size:.875rem;
  color:var(--text-secondary);
}
.note--warn{border-left-color:var(--warn)}
.meta{font-family:var(--font-mono);font-size:.75rem;color:var(--text-dim);letter-spacing:.05em}
.breadcrumb{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  font-size:.8125rem;
  color:var(--text-dim);
  padding-block:.75rem;
  border-bottom:1px solid var(--border);
  margin-bottom:0;
}
.breadcrumb li+li::before{content:"/";margin-right:.5rem;color:var(--text-dim)}
.breadcrumb a{color:var(--text-secondary)}
.breadcrumb a:hover{color:var(--accent);text-decoration:none}
.breadcrumb [aria-current]{color:var(--accent)}

/* ---------- 图片容器 ---------- */
.figure{
  position:relative;
  background:var(--bg-panel);
  border:1px solid var(--border);
  overflow:hidden;
  aspect-ratio:16/9;
}
.figure--portrait{aspect-ratio:3/4}
.figure--square{aspect-ratio:1/1}
.figure img{width:100%;height:100%;object-fit:cover}
.figure::after{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0,rgba(0,0,0,.25) 1px,transparent 1px,transparent 3px);
  pointer-events:none;
  mix-blend-mode:overlay;
}

/* ---------- 时间轴 ---------- */
.timeline{padding-left:0}
.timeline__item{
  position:relative;
  padding-left:1.75rem;
  padding-bottom:1.75rem;
  border-left:1px solid var(--border);
  margin-left:.3438rem;
}
.timeline__item::before{
  content:"";
  position:absolute;
  left:-.3438rem;
  top:.35rem;
  width:.6875rem;
  height:.6875rem;
  background:var(--bg-main);
  border:2px solid var(--accent);
  border-radius:50%;
}
.timeline__item:last-child{border-left-color:transparent}
.timeline__date{font-family:var(--font-mono);font-size:.75rem;color:var(--accent);letter-spacing:.06em}
.timeline__body{margin-top:.25rem;font-size:.9375rem;color:var(--text-main)}
.timeline__meta{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-dim);margin-top:.25rem}

/* ---------- 归档表格 ---------- */
.archive-table{
  width:100%;
  border-collapse:collapse;
  font-size:.875rem;
  background:var(--bg-secondary);
}
.archive-table th,.archive-table td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--border)}
.archive-table th{
  font-family:var(--font-mono);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.1em;
  color:var(--accent);
  background:var(--bg-panel);
}
.archive-table tr:hover{background:var(--bg-panel)}

/* ---------- 搜索过滤状态 ---------- */
.is-search-hidden{display:none!important}

/* ---------- 响应式 ---------- */
@media (min-width:769px) and (max-width:1024px){
  .search-console{min-width:200px}
  .brand__desc{font-size:.6875rem}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-col--about{grid-column:1/-1}
  .footer-col--links,.footer-col--contact{padding-left:0;border-left:0}
}
@media (max-width:768px){
  .section{padding-block:2.5rem}
  .page-hero{padding-block:2.5rem 1.75rem}
  .header-topbar{gap:.5rem;padding-block:.75rem}
  .header-actions{flex:1;justify-content:flex-end}
  .search-console{order:3;flex-basis:100%;min-width:0}
  .nav-toggle{display:inline-flex}
  .nav-bar{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:120;
    background:var(--bg-secondary);
    max-height:0;
    overflow:hidden;
    border:0 solid var(--border);
    box-shadow:0 12px 24px rgba(0,0,0,.4);
    transition:max-height .4s ease;
  }
  .nav-bar[data-open]{max-height:440px;border-bottom-width:1px}
  .nav-bar__inner{flex-direction:column;align-items:stretch;padding-block:1rem}
  .nav-list{flex-direction:column;gap:.5rem}
  .nav-link{
    display:block;
    padding:.625rem .75rem;
    border-left:2px solid transparent;
  }
  .nav-link::after{display:none}
  .nav-link[aria-current="page"],.nav-link:hover{border-left-color:var(--accent);background:var(--bg-panel)}
  .nav-status{margin-top:1rem;border-top:1px solid var(--border);padding-top:.75rem}
  .back-top{bottom:1rem;right:1rem;width:2.5rem;height:2.5rem}
  .footer-grid{grid-template-columns:1fr;gap:1.75rem;padding-block:2rem 1.25rem}
  .footer-col--links,.footer-col--contact{padding-left:0;border-left:0;padding-top:1rem;border-top:1px solid var(--border)}
  .footer-bottom__inner{flex-direction:column;text-align:center}
}
@media (max-width:480px){
  .brand__desc{font-size:.625rem;letter-spacing:.02em}
  .brand__stamp{font-size:.625rem}
}
@media (min-width:769px){
  .grid-cols-3{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1024px) and (min-width:769px){
  .grid-cols-3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .grid-cols-2,.grid-cols-3{grid-template-columns:1fr}
}

/* ---------- 动效偏好 ---------- */
@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}