*,*::before,*::after{box-sizing:border-box}
html{line-height:1.75;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
img,svg,video{max-width:100%;display:block}
input,button,textarea,select{font:inherit;color:inherit}
button{background:none;border:none;cursor:pointer}
a{color:var(--color-green);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--color-orange)}
:focus-visible{outline:2px solid var(--color-green);outline-offset:3px;border-radius:2px}

:root{
--color-base:#0B1B3B;
--color-panel:#12294F;
--color-rail:#0D1B2A;
--color-line:#2C3A5E;
--color-green:#00FF88;
--color-green-static:#00CC77;
--color-orange:#FF6B35;
--color-purple:#4A5CFF;
--color-text:#E5E9F0;
--color-muted:#8A94A6;
--font-heading:"Noto Serif SC","Source Han Serif SC","Songti SC",SimSun,serif;
--font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
--font-mono:"JetBrains Mono","IBM Plex Mono","SFMono-Regular",Consolas,monospace;
--rail-width:280px;
--space:8px;
--transition:250ms ease-out;
--radius:4px;
}

body{
font-family:var(--font-body);
background:var(--color-base);
color:var(--color-text);
background-image:
radial-gradient(1200px 600px at 80% -10%,rgba(74,92,255,.16),transparent),
radial-gradient(900px 500px at 100% 20%,rgba(0,255,136,.06),transparent);
background-attachment:fixed;
}

#main-content{min-height:70vh;padding-top:80px}
@media(min-width:1024px){
body{padding-left:var(--rail-width)}
#main-content{padding-top:0}
}

.skip-link{
position:fixed;top:8px;left:8px;z-index:2001;
transform:translateY(-180%);
background:var(--color-green);color:var(--color-base);
padding:8px 14px;font-weight:700;border-radius:var(--radius);
transition:transform var(--transition);
}
.skip-link:focus{transform:translateY(0);outline:2px solid var(--color-orange)}

.site-header{
position:fixed;top:0;left:0;right:0;z-index:1000;
background:rgba(13,27,42,.95);
backdrop-filter:blur(10px);
border-bottom:1px solid var(--color-line);
}
.site-header__inner{
display:flex;align-items:center;justify-content:space-between;
gap:16px;padding:12px 20px;max-width:1440px;margin-inline:auto;
}
.site-scroll-progress{
position:fixed;top:0;left:0;height:3px;width:0;
background:linear-gradient(90deg,var(--color-green),var(--color-purple));
z-index:1002;pointer-events:none;
}

.site-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--color-text)}
.site-brand__mark{
display:inline-grid;place-items:center;width:42px;height:42px;
background:var(--color-green);color:var(--color-base);
font-family:var(--font-mono);font-weight:700;font-size:16px;
clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,0 100%);
}
.site-brand__name{display:block;font-family:var(--font-heading);font-weight:700;font-size:20px;line-height:1.1}
.site-brand__tagline{display:block;color:var(--color-muted);font-size:11px;letter-spacing:.3em;text-transform:uppercase}

.site-nav-toggle{
display:inline-flex;align-items:center;gap:8px;
padding:8px 12px;border:1px solid var(--color-line);
color:var(--color-green);font-size:14px;line-height:1;
clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px));
}
.site-nav-toggle__icon{width:18px;height:2px;background:currentColor;display:inline-block;position:relative}
.site-nav-toggle__icon::before,.site-nav-toggle__icon::after{content:"";position:absolute;left:0;width:100%;height:2px;background:currentColor;transition:transform var(--transition)}
.site-nav-toggle__icon::before{top:-6px}
.site-nav-toggle__icon::after{top:6px}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle__icon::before{transform:translateY(8px) rotate(45deg)}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle__icon::after{transform:translateY(-8px) rotate(-45deg)}

.site-nav{
position:fixed;top:60px;left:0;bottom:0;
width:var(--rail-width);background:var(--color-rail);
transform:translateX(-100%);transition:transform var(--transition);
z-index:1001;padding:32px 24px;overflow-y:auto;
}
.site-nav[data-open]{transform:translateX(0)}
.site-nav__list{display:grid;gap:4px}
.site-nav__link{
display:flex;align-items:center;gap:12px;
padding:10px 12px;color:var(--color-text);text-decoration:none;
border-left:2px solid transparent;
transition:background var(--transition),color var(--transition),border-color var(--transition);
}
.site-nav__link::before{content:attr(data-index);font-family:var(--font-mono);font-size:12px;color:var(--color-muted);width:24px}
.site-nav__link:hover{background:rgba(0,255,136,.06);color:var(--color-green);border-left-color:var(--color-green-static)}
.site-nav__link[aria-current="page"]{
background:linear-gradient(90deg,rgba(0,255,136,.12),transparent);
color:var(--color-green);border-left-color:var(--color-green);
}

.site-header__contact{display:none;flex-direction:column;gap:4px}
.site-header__contact span{display:block;color:var(--color-muted);font-size:13px}

@media(min-width:1024px){
.site-header{
top:0;left:0;bottom:0;right:auto;width:var(--rail-width);
border-right:1px solid var(--color-line);border-bottom:none;
background:var(--color-rail);
}
.site-header__inner{
flex-direction:column;align-items:stretch;justify-content:flex-start;
height:100%;padding:32px 28px;max-width:none;margin:0;
}
.site-brand{margin-bottom:48px}
.site-nav{position:static;transform:none;overflow:visible;padding:0;background:transparent}
.site-nav-toggle{display:none}
.site-header__contact{display:flex;margin-top:auto}
.site-scroll-progress{left:var(--rail-width);height:2px}
}

.site-footer{
background:linear-gradient(135deg,var(--color-rail) 0%,var(--color-base) 60%,rgba(74,92,255,.12) 150%);
border-top:1px solid var(--color-line);padding:48px 0 0;position:relative;
}
.site-footer::before{
content:"";position:absolute;top:0;left:0;right:0;height:2px;
background:linear-gradient(90deg,var(--color-green),var(--color-purple),var(--color-orange));
opacity:.5;
}
.site-footer__inner{display:grid;gap:32px;padding-bottom:32px}
.site-footer__brand .site-brand{margin-bottom:12px}
.site-footer__claim{color:var(--color-muted);font-size:14px;max-width:28em}
.site-footer__title{font-family:var(--font-heading);font-size:16px;margin-bottom:12px;color:var(--color-text);font-weight:700}
.site-footer__links{display:grid;gap:8px}
.site-footer__links a{color:var(--color-muted);text-decoration:none;font-size:14px;transition:color var(--transition)}
.site-footer__links a:hover{color:var(--color-green)}
.site-footer__contact p{color:var(--color-muted);font-size:14px;margin-bottom:4px}
.site-footer__bottom{
display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;
padding:16px 0;border-top:1px solid var(--color-line);
font-size:12px;color:var(--color-muted);
}
@media(min-width:768px){
.site-footer__inner{grid-template-columns:2fr 1fr 1fr}
}
@media(min-width:1024px){
.site-footer{padding-top:64px}
}

.container{width:100%;max-width:1440px;margin-inline:auto;padding-inline:clamp(16px,4vw,48px)}
.content-section{padding-block:clamp(48px,8vw,80px)}
.section-head{max-width:720px;margin-bottom:32px}
.kicker{
display:inline-block;font-family:var(--font-mono);font-size:12px;
letter-spacing:.2em;text-transform:uppercase;color:var(--color-green);
border-left:3px solid var(--color-green);padding-left:8px;margin-bottom:8px;
}
.section-title{font-family:var(--font-heading);font-weight:900;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.15;color:var(--color-text)}
.section-desc{color:var(--color-muted);font-size:16px;margin-top:8px}

.btn{
display:inline-flex;align-items:center;justify-content:center;gap:8px;
padding:10px 20px;font-family:var(--font-body);font-weight:600;font-size:14px;
border:1px solid var(--color-line);background:transparent;color:var(--color-text);
text-decoration:none;cursor:pointer;
clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
transition:background var(--transition),color var(--transition),border-color var(--transition),transform var(--transition);
}
.btn--primary{background:var(--color-green);color:var(--color-base);border-color:var(--color-green);font-weight:700}
.btn--primary:hover{background:var(--color-green-static);border-color:var(--color-green-static);transform:translateY(-2px)}
.btn--ghost:hover{color:var(--color-green);border-color:var(--color-green-static);background:rgba(0,255,136,.06)}

.card{
background:var(--color-panel);border:1px solid var(--color-line);
padding:24px;position:relative;
transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);
}
.card--outline{background:transparent;border-color:var(--color-line)}
.card--outline::before{
content:"";position:absolute;inset:0;
background:linear-gradient(135deg,rgba(74,92,255,.12),rgba(0,255,136,.04));
opacity:0;transition:opacity var(--transition);pointer-events:none;
}
.card--outline:hover{border-color:var(--color-green-static);transform:translateY(-4px)}
.card--outline:hover::before{opacity:1}

.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px}
.stat{
background:var(--color-panel);border:1px solid var(--color-line);
padding:20px;position:relative;
clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%);
}
.stat__value{font-family:var(--font-mono);font-size:2rem;font-weight:700;color:var(--color-green);line-height:1.2}
.stat__label{color:var(--color-muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}

.tag{
display:inline-block;background:rgba(0,255,136,.08);color:var(--color-green);
font-family:var(--font-mono);font-size:12px;padding:4px 10px;
border:1px solid var(--color-green-static);margin-right:8px;
}
.tag--hot{background:rgba(255,107,53,.12);color:var(--color-orange);border-color:var(--color-orange)}
.tag--new{background:rgba(74,92,255,.15);color:#AFC2FF;border-color:var(--color-purple)}

.breadcrumb{display:flex;flex-wrap:wrap;gap:4px;font-size:13px;color:var(--color-muted);margin-bottom:24px}
.breadcrumb a{color:var(--color-muted);text-decoration:none}
.breadcrumb a:hover{color:var(--color-green)}
.breadcrumb__sep{margin:0 4px;color:var(--color-line)}

.table-wrap{overflow-x:auto;border:1px solid var(--color-line);background:var(--color-panel)}
.table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
.table th,.table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--color-line)}
.table th{font-family:var(--font-mono);font-size:12px;color:var(--color-green);text-transform:uppercase;letter-spacing:.08em;background:rgba(0,255,136,.04)}
.table td{color:var(--color-text)}
.table tbody tr:last-child td{border-bottom:none}
.table tbody tr:hover td{background:rgba(74,92,255,.08)}

.callout{
display:flex;gap:16px;padding:20px 24px;background:rgba(0,255,136,.06);
border-left:3px solid var(--color-green);font-size:15px;color:var(--color-text);
}
.callout--orange{border-left-color:var(--color-orange);background:rgba(255,107,53,.08)}

[data-filter]{
display:inline-flex;align-items:center;gap:8px;
padding:8px 16px;font-family:var(--font-mono);font-size:13px;
border:1px solid var(--color-line);background:transparent;color:var(--color-muted);
cursor:pointer;transition:background var(--transition),color var(--transition),border-color var(--transition);
}
[data-filter].is-active{background:var(--color-orange);color:var(--color-base);border-color:var(--color-orange);font-weight:700}
.is-hidden{display:none!important}

.js [data-reveal]{opacity:0;transform:translateY(16px);transition:opacity var(--transition),transform var(--transition)}
.js [data-reveal].is-visible{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
.js [data-reveal]{opacity:1;transform:none}
}