*,*::before,*::after{box-sizing:border-box}
:root{
--g:#00ff80;
--b:#0000ff;
--k:#000000;
--w:#eafff4;
--panel:#07090a;
--pad:clamp(14px,4vw,48px);
--bd:3px solid var(--g);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
margin:0;
background:var(--k);
color:var(--g);
font:400 17px/1.6 Inter,system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
letter-spacing:-.015em;
-webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:var(--g);text-decoration:none}
a:focus-visible{outline:4px solid var(--b);outline-offset:2px}
hr{border:0;height:6px;background:var(--b);margin:0 0 16px}
h1,h2,h3{text-wrap:balance}

/* 顶部：蓝条 + 品牌块 + 菜单 */
.mast{
display:flex;
flex-wrap:wrap;
align-items:center;
background:var(--k);
border-bottom:var(--bd);
position:relative;
z-index:30;
}
.tick{
flex:1 0 100%;
display:flex;
align-items:center;
gap:10px;
background:var(--b);
color:var(--g);
border-bottom:var(--bd);
padding:8px var(--pad);
font-size:16px;
font-weight:700;
letter-spacing:.22em;
}
.tick-sq{width:12px;height:12px;background:var(--g);flex:0 0 auto}
.tick-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand{
display:inline-flex;
align-items:center;
min-height:46px;
padding:8px var(--pad);
background:var(--g);
color:var(--k);
font-weight:900;
font-size:clamp(19px,4.4vw,28px);
letter-spacing:-.045em;
}
.brand:hover{background:var(--w)}
.menu{margin-left:auto;padding:6px var(--pad) 6px 0;max-width:100%}
.menu ul{
display:flex;
flex-wrap:wrap;
justify-content:flex-end;
gap:4px;
margin:0;
padding:0;
list-style:none;
}
.menu a{
display:inline-flex;
align-items:center;
gap:8px;
min-height:44px;
padding:8px 11px;
font-size:16px;
font-weight:700;
border:3px solid transparent;
}
.menu a::before{content:"";width:9px;height:9px;background:var(--b);flex:0 0 auto}
.menu a:hover,.menu a:focus-visible{background:var(--g);color:var(--k);border-color:var(--g)}
.menu a:hover::before,.menu a:focus-visible::before{background:var(--k)}

/* 头图区 */
.hero{
max-width:1180px;
margin:0 auto;
padding:clamp(20px,3.6vw,42px) var(--pad) 0;
display:flex;
flex-direction:column;
gap:18px;
min-height:45vh;
}
.hero-copy{max-width:840px;margin:0 0 auto}
h1{
margin:0 0 14px;
font-size:clamp(32px,7.4vw,66px);
line-height:1.02;
letter-spacing:-.05em;
font-weight:900;
}
.lead{
margin:0;
max-width:56ch;
font-size:clamp(17px,1.9vw,20px);
line-height:1.5;
color:var(--w);
border-left:6px solid var(--b);
padding-left:14px;
}
.hero-fig{
margin:6px 0 0;
border:var(--bd);
border-radius:28px;
box-shadow:10px 10px 0 var(--b);
overflow:hidden;
background:var(--panel);
}
.hero-fig img{width:100%;max-height:54vh;object-fit:cover}
.slash{
height:52px;
margin:22px calc(-1 * var(--pad)) 0;
background:var(--b);
clip-path:polygon(0 0,100% 0,100% 56%,0 100%);
}

/* 正文 + 右栏 */
.board{
max-width:1180px;
margin:0 auto;
padding:clamp(24px,4vw,46px) var(--pad);
display:grid;
grid-template-columns:minmax(0,1fr);
gap:32px;
}
.prose{overflow-wrap:break-word;min-width:0}
.prose>section{
scroll-margin-top:150px;
border-top:3px solid var(--b);
padding:clamp(22px,3vw,34px) 0;
}
.prose>section:first-child{border-top:0;padding-top:0}
.prose h2{
margin:0 0 10px;
font-size:clamp(23px,3.8vw,36px);
line-height:1.08;
letter-spacing:-.04em;
font-weight:900;
color:var(--g);
}
.prose h3{
margin:26px 0 8px;
font-size:clamp(19px,2.3vw,23px);
font-weight:700;
letter-spacing:-.03em;
color:var(--w);
}
.prose p{margin:0 0 14px;max-width:70ch;color:var(--w)}
.prose ul,.prose ol{margin:0 0 16px;padding-left:22px;max-width:70ch;color:var(--w)}
.prose li{margin:0 0 8px}
.prose strong{color:var(--g);font-weight:700}
.prose a{color:var(--g);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.prose blockquote{
margin:0 0 18px;
padding:12px 16px;
border-left:6px solid var(--g);
background:#0b0e0f;
color:var(--g);
}
.prose figure{margin:18px 0}
.prose img{border:var(--bd);border-radius:28px;margin:14px 0;box-shadow:8px 8px 0 var(--b)}
.prose table{width:100%;border-collapse:collapse;font-size:16px;display:block;overflow-x:auto;margin:0 0 16px}
.prose th,.prose td{border:2px solid var(--g);padding:8px 10px;text-align:left}
.prose pre{overflow-x:auto;border:var(--bd);padding:12px;background:#0b0e0f}

/* 右栏 */
.rail{display:flex;flex-direction:column;gap:16px}
.rail-card{
border:var(--bd);
border-radius:28px;
background:var(--panel);
padding:18px;
box-shadow:8px 8px 0 var(--b);
}
.rail-t{margin:0 0 10px;font-size:20px;font-weight:900;letter-spacing:-.03em}
.rail-card hr{height:4px;margin:0 0 12px}
.rail-list{list-style:none;margin:0;padding:0}
.rail-list a{
display:flex;
align-items:center;
min-height:44px;
padding:8px 4px;
font-size:16px;
font-weight:700;
border-bottom:2px dashed rgba(0,255,128,.4);
}
.rail-list li:last-child a{border-bottom:0}
.rail-list a:hover{background:var(--b);color:var(--w)}
.rail-foot{padding:16px 18px}
.rail-brand{
margin:0;
font-weight:900;
font-size:20px;
line-height:1.1;
letter-spacing:-.045em;
}

/* 页脚 */
footer{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:26px;
border-top:6px solid var(--g);
background:#050607;
padding:clamp(24px,4vw,44px) var(--pad);
}
.foot-mark{
margin:0 0 12px;
font-weight:900;
font-size:clamp(34px,7.6vw,68px);
line-height:.95;
letter-spacing:-.055em;
color:var(--g);
}
.foot-blurb{margin:0;max-width:46ch;color:var(--w);font-size:16px}
.foot-t{margin:0 0 10px;font-size:16px;font-weight:700;letter-spacing:.12em}
.foot-b hr{height:4px;margin:0 0 14px}
.foot-b ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.foot-b a{
display:inline-flex;
align-items:center;
min-height:44px;
padding:8px 12px;
border:var(--bd);
font-size:16px;
font-weight:700;
}
.foot-b a:hover{background:var(--g);color:var(--k)}
.foot-bot{
grid-column:1/-1;
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:12px;
border-top:3px solid var(--b);
padding-top:14px;
font-size:16px;
}
.foot-cr{font-weight:700;letter-spacing:-.02em}
.to-top{
display:inline-flex;
align-items:center;
min-height:44px;
padding:8px 14px;
background:var(--b);
color:var(--w);
font-weight:700;
}
.to-top:hover{background:var(--g);color:var(--k)}

/* 动效：无缓动感的即时揭示 */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .16s linear,transform .16s linear;transition-delay:var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none}

@media (min-width:960px){
.mast{position:sticky;top:0}
.board{grid-template-columns:minmax(0,1fr) 290px;gap:48px;align-items:start}
.rail{position:sticky;top:150px}
}
@media (min-width:780px){
footer{grid-template-columns:1.5fr 1fr}
}
@media (max-width:700px){
.hero{min-height:0}
.menu{padding:0 var(--pad) 10px;flex:1 0 100%;margin-left:0}
.menu ul{justify-content:flex-start}
.prose>section{scroll-margin-top:24px}
.slash{height:38px}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
.js .reveal{opacity:1;transform:none;transition:none}
}

button[aria-expanded]{min-width:44px;min-height:44px}