*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:clamp(110px,16vw,152px)}
body{margin:0}
:where(h1,h2,h3,h4,h5,p,ul,ol,figure,blockquote){margin:0}
:where(ul,ol){padding:0;list-style:none}
img,svg,video{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid #FF6A2A;outline-offset:3px}

:root{
  --deep-space:#070B1A;
  --nebula:#0F1733;
  --nebula-soft:#0B1228;
  --mist:#DDE3F2;
  --white:#FFFFFF;
  --neon-orange:#FF6A2A;
  --electric-purple:#7A5CFF;
  --cyan:#2ED3F7;
  --peach:#FFD7C4;
  --steel:#8C96B8;
  --green:#37D67A;
  --line:rgba(221,227,242,.14);
  --line-strong:rgba(221,227,242,.30);
  --cut:22px;
  --gutter:clamp(20px,7vw,96px);
  --shell:min(1280px,calc(100% - var(--gutter) * 2));
  --ease:cubic-bezier(.2,.8,.2,1);
  --z-header:60;
  --font-sans:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

body{
  background-color:var(--deep-space);
  background-image:
    radial-gradient(1100px 620px at 88% -8%,rgba(122,92,255,.20),transparent 68%),
    radial-gradient(820px 520px at -6% 3%,rgba(46,211,247,.12),transparent 66%);
  background-repeat:no-repeat;
  color:var(--mist);
  font-family:var(--font-sans);
  font-size:clamp(16px,.35vw + 14.6px,17.5px);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{font-weight:800;line-height:1.16;letter-spacing:-.01em;color:var(--white);margin-bottom:.6em}
h1{font-size:clamp(2.5rem,7vw,6rem);line-height:1.02;font-weight:900;letter-spacing:-.02em}
h2{font-size:clamp(1.55rem,2.4vw,2rem)}
h3{font-size:clamp(1.15rem,1.6vw,1.4rem)}
p{max-width:68ch}

/* ---------- 排版与装饰 ---------- */
.display{
  font-family:var(--font-sans);
  font-size:clamp(2.5rem,7vw,6rem);
  line-height:1.02;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--white);
  text-wrap:balance;
  margin:0;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .display{
    background-image:linear-gradient(180deg,#FFFFFF 0%,#E7ECFA 58%,#B9C3E0 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .display .accent{
    background-image:none;
    color:var(--neon-orange);
    -webkit-text-fill-color:var(--neon-orange);
    -webkit-text-stroke:1px rgba(255,106,42,.9);
  }
}
.accent{color:var(--neon-orange)}
.mono{font-family:var(--font-mono);font-size:.8125rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}
.eyebrow{display:flex;align-items:center;gap:.9ch;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--steel)}
.eyebrow::before{content:"";width:clamp(24px,4vw,56px);height:1px;background:linear-gradient(90deg,var(--neon-orange),transparent);flex:none}
.side-note{writing-mode:vertical-rl;text-orientation:mixed;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--steel)}
.rule-diagonal{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--line-strong) 18%,rgba(255,106,42,.65) 50%,var(--line-strong) 82%,transparent)}

/* ---------- 布局骨架 ---------- */
.container{width:var(--shell);margin-inline:auto}
.section{padding-block:clamp(44px,6.5vw,92px)}
.band-nebula{
  background-image:linear-gradient(180deg,rgba(15,23,51,0),rgba(15,23,51,.9) 16%,rgba(15,23,51,.9) 84%,rgba(15,23,51,0));
  border-block:1px solid var(--line);
  padding-block:clamp(44px,6.5vw,92px);
}
.stack > * + *{margin-top:clamp(14px,2vw,26px)}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.2vw,32px)}
.span-3{grid-column:span 3}
.span-4{grid-column:span 4}
.span-5{grid-column:span 5}
.span-6{grid-column:span 6}
.span-7{grid-column:span 7}
.span-8{grid-column:span 8}
.span-9{grid-column:span 9}
.span-12{grid-column:span 12}

/* ---------- 面板 / 标签 / 按钮 ---------- */
.panel{
  position:relative;
  padding:clamp(18px,2.4vw,32px);
  background-image:linear-gradient(160deg,rgba(15,23,51,.96),rgba(11,18,41,.94));
  border:1px solid var(--line);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.panel-cut{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}
.panel:hover{border-color:rgba(255,106,42,.55);box-shadow:0 22px 48px -34px rgba(255,106,42,.6)}
.panel-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.panel-body{color:var(--mist)}

.tag-list{display:flex;flex-wrap:wrap;gap:8px}
.tag{
  display:inline-flex;align-items:center;gap:.5ch;
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.14em;
  padding:.4em .8em;border:1px solid var(--line-strong);
  background:rgba(46,211,247,.08);color:var(--mist);
  transition:background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease);
}
.tag--orange{background:var(--neon-orange);color:var(--deep-space);border-color:transparent}
.tag--peach{background:var(--peach);color:var(--deep-space);border-color:transparent}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6ch;
  padding:.85em 1.5em;font-family:var(--font-sans);font-size:.95rem;font-weight:700;letter-spacing:.04em;
  border:1px solid transparent;cursor:pointer;
  transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease);
}
.btn-primary{background:var(--neon-orange);color:var(--deep-space)}
.btn-primary:hover,.btn-primary:focus-visible{background:#FF824F}
.btn-ghost{background:transparent;color:var(--mist);border-color:var(--line-strong)}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--neon-orange);color:var(--white)}

/* ---------- 面包屑 / 正文 ---------- */
.breadcrumb{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.14em;color:var(--steel)}
.breadcrumb-list{display:flex;flex-wrap:wrap;align-items:center;gap:.2ch;list-style:none;margin:0;padding:0}
.breadcrumb-item{display:inline-flex;align-items:center}
.breadcrumb-item + .breadcrumb-item::before{content:"/";margin-inline:.9ch;color:var(--line-strong)}
.breadcrumb-link{color:var(--mist);transition:color .18s var(--ease)}
.breadcrumb-link:hover,.breadcrumb-link:focus-visible{color:var(--neon-orange)}
.breadcrumb-current{color:var(--cyan)}

.prose{max-width:68ch}
.prose p{margin:0 0 1.2em}
.prose > :last-child{margin-bottom:0}
.prose h2,.prose h3{margin-top:1.6em}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.2em;list-style:disc}
.prose ol{list-style:decimal}
.prose li{margin-bottom:.5em}
.prose a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose a:hover{color:var(--neon-orange)}
.prose strong{color:var(--white);font-weight:700}
.prose code{font-family:var(--font-mono);font-size:.9em;color:var(--peach)}

/* ---------- 视觉容器（页面阶段放置图像占位） ---------- */
.figure-frame{
  position:relative;overflow:hidden;
  aspect-ratio:16/10;
  background-image:linear-gradient(150deg,#101A3D,#0A1024 55%,#141C3C);
  border:1px solid var(--line);
}
.figure-frame--wide{aspect-ratio:21/9}
.figure-frame--tall{aspect-ratio:4/5}
.figure-frame > img,.figure-frame > svg{width:100%;height:100%;object-fit:cover}
.figure-plate{
  position:absolute;inset:0;display:grid;place-items:center;
  background-image:
    radial-gradient(60% 60% at 22% 18%,rgba(46,211,247,.28),transparent 70%),
    radial-gradient(55% 55% at 82% 76%,rgba(122,92,255,.30),transparent 72%),
    repeating-linear-gradient(135deg,rgba(221,227,242,.07) 0 1px,transparent 1px 18px);
}

/* ---------- 显现 ---------- */
.reveal{opacity:1;transform:none}
.has-js .reveal{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.has-js .reveal.is-visible{opacity:1;transform:none}

/* ================= 头部 ================= */
.site-header{
  position:sticky;top:0;z-index:var(--z-header);
  background-image:linear-gradient(180deg,#080D1F 0%,#0A1128 100%);
  box-shadow:0 1px 0 rgba(221,227,242,.12),0 22px 48px -38px rgba(0,0,0,.95);
}
.skip-link{
  position:absolute;left:clamp(12px,3vw,32px);top:-120px;z-index:99;
  padding:.7em 1.1em;background:var(--neon-orange);color:var(--deep-space);
  font-weight:700;transition:top .18s var(--ease);
}
.skip-link:focus{top:8px}

.header-rail{
  border-bottom:1px solid var(--line);
  background-image:linear-gradient(90deg,rgba(122,92,255,.18),rgba(46,211,247,.09) 48%,rgba(255,106,42,.14));
}
.rail-inner{
  width:var(--shell);margin-inline:auto;
  display:flex;align-items:center;gap:clamp(10px,1.6vw,26px);
  min-height:46px;padding-block:6px;font-size:.75rem;letter-spacing:.08em;
}
.rail-brand{
  display:inline-flex;align-items:center;gap:.7ch;flex:none;
  font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--mist);
  white-space:nowrap;
}
.brand-mark{width:9px;height:9px;flex:none;background:var(--neon-orange);clip-path:polygon(0 0,100% 0,100% 70%,70% 100%,0 100%);box-shadow:0 0 0 3px rgba(255,106,42,.18)}
.brand-name{color:var(--white);font-weight:600}
.brand-suffix{color:var(--cyan)}
.rail-brand:hover .brand-suffix,.rail-brand:focus-visible .brand-suffix{color:var(--neon-orange)}
.rail-tagline{color:var(--steel);font-size:.78rem;letter-spacing:.06em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:24ch}
.rail-status{
  margin-left:auto;display:inline-flex;align-items:center;gap:.6ch;
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;color:var(--steel);white-space:nowrap;
}
.status-dot{width:6px;height:6px;flex:none;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(55,214,122,.18)}
.quick-nav{display:flex;align-items:center;gap:clamp(10px,1.2vw,20px)}
.quick-link{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;color:var(--mist);
  padding-block:4px;border-bottom:1px solid transparent;
  transition:color .18s var(--ease),border-color .18s var(--ease);
}
.quick-link:hover,.quick-link:focus-visible{color:var(--neon-orange);border-bottom-color:var(--neon-orange)}

.header-main{position:relative;border-bottom:1px solid var(--line)}
.header-inner{
  width:var(--shell);margin-inline:auto;
  display:flex;align-items:center;gap:clamp(14px,2vw,36px);
  min-height:clamp(58px,6.5vw,72px);
}
.primary-nav{display:flex;align-items:center;gap:clamp(12px,2vw,28px);flex:1 1 auto;min-width:0}
.nav-list{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(10px,1.6vw,26px)}
.nav-link{
  position:relative;display:inline-block;padding:6px 2px 10px;
  font-size:.95rem;letter-spacing:.04em;color:var(--mist);white-space:nowrap;
  transition:color .18s var(--ease);
}
.nav-link::after{
  content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;
  background:linear-gradient(90deg,var(--neon-orange),var(--electric-purple));
  transform:scaleX(0);transform-origin:left center;
  transition:transform .24s var(--ease);
}
.nav-link:hover,.nav-link:focus-visible{color:var(--white)}
.nav-link:hover::after,.nav-link:focus-visible::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--white);font-weight:700}
.nav-link[aria-current="page"]::after{transform:scaleX(1);background:linear-gradient(90deg,var(--neon-orange),var(--cyan))}
.nav-foot{display:none;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;color:var(--steel)}

.header-cta{flex:none;padding:.62em 1.15em;font-size:.85rem}

.nav-toggle{
  display:none;align-items:center;gap:.7ch;
  padding:.55em .8em;border:1px solid var(--line-strong);background:rgba(46,211,247,.08);
  color:var(--mist);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;cursor:pointer;
  transition:border-color .18s var(--ease),color .18s var(--ease),background-color .18s var(--ease);
}
.nav-toggle:hover,.nav-toggle[aria-expanded="true"]{border-color:var(--neon-orange);color:var(--white);background:rgba(255,106,42,.16)}
.nav-toggle-bars{display:inline-flex;flex-direction:column;gap:4px;width:16px}
.nav-toggle-bar{display:block;height:1px;background:currentColor;transition:transform .2s var(--ease)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:first-child{transform:translateY(2.5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:last-child{transform:translateY(-2.5px) rotate(-45deg)}
.nav-toggle-text{white-space:nowrap}

.scroll-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:rgba(221,227,242,.08);overflow:hidden;pointer-events:none}
.scroll-progress-bar{
  display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--cyan),var(--electric-purple) 55%,var(--neon-orange));
  transition:transform .12s linear;
}

/* ================= 页脚 ================= */
.site-footer{
  position:relative;
  margin-top:clamp(64px,10vw,140px);
  border-top:1px solid var(--line);
  background-image:linear-gradient(180deg,#080D20 0%,#05080F 100%);
  color:var(--mist);
}
.footer-version{
  border-bottom:1px solid var(--line);
  background-image:linear-gradient(90deg,rgba(255,106,42,.16),rgba(122,92,255,.12) 55%,rgba(46,211,247,.06));
}
.footer-version-inner{
  width:var(--shell);margin-inline:auto;
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(10px,2vw,26px);
  padding-block:14px;
}
.version-label{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--neon-orange);border:1px solid rgba(255,106,42,.5);padding:.25em .7em;
}
.version-text{font-size:.85rem;color:var(--steel);max-width:none}
.version-mono{margin-left:auto;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.16em;color:var(--cyan)}

.footer-main{
  width:var(--shell);margin-inline:auto;
  display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,.75fr)) minmax(0,1.35fr);
  gap:clamp(20px,3vw,48px);
  padding-block:clamp(36px,5vw,64px);
}
.footer-lockup{font-weight:900;font-size:1.15rem;letter-spacing:.02em;color:var(--white)}
.footer-summary{margin-top:12px;max-width:34ch;font-size:.9rem;line-height:1.8;color:var(--steel)}
.footer-brand .btn{margin-top:20px}
.footer-col-title{
  font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.2em;
  text-transform:uppercase;color:var(--cyan);margin-bottom:14px;
}
.footer-list li + li{margin-top:9px}
.footer-link{
  font-size:.92rem;color:var(--mist);padding-bottom:1px;border-bottom:1px solid transparent;
  transition:color .18s var(--ease),border-color .18s var(--ease);
}
.footer-link:hover,.footer-link:focus-visible{color:var(--neon-orange);border-bottom-color:var(--neon-orange)}
.footer-contact-line{display:flex;flex-wrap:wrap;gap:.8ch;font-size:.9rem;margin-bottom:10px;color:var(--mist)}
.footer-contact-key{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;color:var(--steel);min-width:3.2em;padding-top:.28em}
.footer-contact-note{font-size:.8rem;line-height:1.7;color:var(--steel);margin-top:6px}

.footer-legal{
  width:var(--shell);margin-inline:auto;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 28px;
  padding-block:18px;border-top:1px solid var(--line);
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;color:var(--steel);
}
.footer-icp,.footer-copy{margin:0}

.to-top{
  position:fixed;right:clamp(14px,3vw,32px);bottom:clamp(14px,3vw,32px);z-index:70;
  display:inline-flex;align-items:center;gap:.6ch;
  padding:.7em 1em;border:1px solid var(--line-strong);background:rgba(15,23,51,.94);
  color:var(--mist);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;cursor:pointer;
  opacity:0;visibility:hidden;transform:translateY(10px);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
}
.to-top[data-visible]{opacity:1;visibility:visible;transform:none}
.to-top:hover,.to-top:focus-visible{border-color:var(--neon-orange);color:var(--white)}

/* ================= 响应式 ================= */
@media (max-width:1180px){
  .rail-tagline{display:none}
  .nav-list{gap:clamp(8px,1.2vw,18px)}
  .nav-link{font-size:.9rem}
}
@media (max-width:1023px){
  .grid-12 > *{grid-column:1/-1}
  .footer-main{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-brand{grid-column:1/-1}
}
@media (max-width:899px){
  .quick-nav{display:none}
  .nav-toggle{display:inline-flex}
  .header-cta{margin-left:auto}
  .primary-nav{
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:0;
    padding:6px var(--gutter) 22px;
    background-image:linear-gradient(180deg,rgba(9,14,32,.99),rgba(7,11,26,.99));
    border-bottom:1px solid var(--line);
    box-shadow:0 30px 50px -34px rgba(0,0,0,.95);
    opacity:0;visibility:hidden;transform:translateY(-10px);
    max-height:calc(100vh - 110px);overflow-y:auto;
    transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s var(--ease);
  }
  .primary-nav[data-open]{opacity:1;visibility:visible;transform:none}
  .nav-list{flex-direction:column;align-items:stretch;gap:0}
  .nav-item + .nav-item{border-top:1px solid var(--line)}
  .nav-link{display:block;padding:14px 2px;font-size:1rem}
  .nav-link::after{display:none}
  .nav-link[aria-current="page"]{color:var(--neon-orange)}
  .nav-foot{display:block;margin-top:16px}
  .footer-main{padding-block:clamp(28px,6vw,44px)}
}
@media (max-width:639px){
  :root{--cut:16px}
  .rail-status{display:none}
  .footer-main{grid-template-columns:1fr;gap:26px}
  .footer-legal{justify-content:flex-start}
  .to-top{font-size:.68rem;padding:.6em .85em}
}
@media (max-width:479px){
  .header-cta{display:none}
  .version-mono{margin-left:0}
}

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