:root{
  --color-ice:#E3F4FD;
  --color-white:#FFFFFF;
  --color-navy:#1E3A8A;
  --color-orange:#FF6B35;
  --color-glacier:#B0C4DE;
  --color-teal:#00B3A4;
  --color-ink:#0F172A;
  --color-warm:#F5F5F4;
  --text-main:#26364A;
  --font-heading:'Noto Sans SC','Source Han Sans CN','Microsoft YaHei',sans-serif;
  --font-body:'Inter','Noto Sans SC','Helvetica Neue',Arial,sans-serif;
  --font-mono:'Roboto Mono','Consolas',monospace;
  --radius:3px;
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);
  --shadow-md:0 8px 30px rgba(30,58,138,.1);
  --header-h:76px;
  --gutter:clamp(16px,4vw,48px);
  --content-max:1440px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,p,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--color-navy);text-underline-offset:3px}
body{
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  color:var(--text-main);
  background:var(--color-ice);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{
  font-family:var(--font-heading);
  font-weight:900;
  color:var(--color-navy);
  line-height:1.15;
}
:focus-visible{outline:3px solid var(--color-orange);outline-offset:2px;border-radius:2px}
.skip-link{
  position:fixed;
  top:8px;
  left:8px;
  z-index:2000;
  padding:.6rem 1.1rem;
  background:var(--color-orange);
  color:#fff;
  font-family:var(--font-heading);
  font-weight:700;
  text-decoration:none;
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  transform:translateY(-160%);
  transition:transform .18s ease;
}
.skip-link:focus{transform:translateY(0)}
.site-header{
  position:relative;
  background:linear-gradient(180deg,#F0F9FE 0%,var(--color-ice) 40%,var(--color-white) 100%);
  border-bottom:1px solid var(--color-glacier);
  box-shadow:var(--shadow-sm);
  z-index:100;
}
.site-header::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg,var(--color-navy) 0%,var(--color-teal) 55%,var(--color-orange) 100%);
  pointer-events:none;
}
.header-frame{
  position:relative;
  display:flex;
  align-items:stretch;
  gap:clamp(12px,2vw,28px);
  max-width:var(--content-max);
  margin-inline:auto;
  padding-inline:var(--gutter);
  min-height:var(--header-h);
}
.brand-link{
  display:inline-flex;
  align-items:center;
  gap:.75rem;
  flex:0 0 auto;
  text-decoration:none;
}
.brand-link-inverse{color:var(--color-ice)}
.brand-mark{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  flex:0 0 auto;
  background:var(--color-navy);
  color:#fff;
  font-family:var(--font-heading);
  font-weight:900;
  font-size:1.1rem;
  letter-spacing:.02em;
  clip-path:polygon(0 0,100% 0,100% 74%,78% 100%,0 100%);
}
.brand-slash{
  position:absolute;
  left:5px;
  bottom:6px;
  width:18px;
  height:4px;
  background:var(--color-orange);
  transform:skewX(-22deg);
}
.brand-text{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.brand-name{
  font-family:var(--font-heading);
  font-weight:900;
  font-size:1.3rem;
  color:var(--color-navy);
  letter-spacing:.01em;
  white-space:nowrap;
}
.brand-desc{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.04em;
  color:var(--color-navy);
  opacity:.72;
  white-space:nowrap;
}
.header-nav{
  flex:1 1 auto;
  display:flex;
  justify-content:center;
  align-items:center;
  min-width:0;
}
.nav-list{display:flex;align-items:stretch}
.nav-item{display:flex}
.nav-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.55rem .8rem;
  font-family:var(--font-heading);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.01em;
  color:var(--color-navy);
  text-decoration:none;
  border-left:1px solid rgba(176,196,222,.55);
  white-space:nowrap;
}
.nav-item:first-child .nav-link{border-left:0}
.nav-link:hover{color:var(--color-orange);background:rgba(255,255,255,.55)}
.nav-link[aria-current="page"]{
  background:var(--color-white);
  box-shadow:inset 0 -3px 0 var(--color-orange);
}
.nav-index{
  font-family:var(--font-mono);
  font-size:.68rem;
  color:var(--color-teal);
  font-weight:500;
}
.nav-link[aria-current="page"] .nav-index{color:var(--color-orange)}
.header-meta{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  border-left:1px solid var(--color-glacier);
  padding-left:clamp(10px,1.5vw,24px);
}
.batch-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.42rem .8rem;
  background:rgba(255,255,255,.8);
  border:1px solid var(--color-glacier);
  border-radius:999px;
  font-family:var(--font-mono);
  font-size:.76rem;
  color:var(--color-navy);
  box-shadow:var(--shadow-sm);
  white-space:nowrap;
}
.batch-label{color:var(--color-navy);opacity:.7}
.batch-value{font-weight:700;color:var(--color-teal)}
.batch-value::before{content:"#";opacity:.5}
.batch-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--color-teal);
  animation:batch-pulse 2.2s ease-out infinite;
}
@keyframes batch-pulse{
  0%,100%{box-shadow:0 0 0 3px rgba(0,179,164,.16)}
  50%{box-shadow:0 0 0 7px rgba(0,179,164,0)}
}
.nav-toggle{display:none}
.nav-cta{display:none}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.68rem 1.35rem;
  border-radius:var(--radius);
  border:1px solid transparent;
  font-family:var(--font-heading);
  font-weight:700;
  font-size:.95rem;
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.btn-accent{background:var(--color-orange);color:#fff;box-shadow:0 2px 14px rgba(255,107,53,.28)}
.btn-accent:hover{background:#E8551F;color:#fff;box-shadow:0 4px 22px rgba(255,107,53,.4)}
.btn-ghost{background:transparent;color:var(--color-navy);border-color:var(--color-glacier)}
.btn-ghost:hover{border-color:var(--color-orange);color:var(--color-orange)}
.btn-sm{padding:.45rem .9rem;font-size:.85rem}
.container-main{
  width:100%;
  max-width:var(--content-max);
  margin-inline:auto;
  padding:clamp(1.5rem,4vw,2.75rem) var(--gutter) 0;
}
.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem;
  margin-bottom:1.5rem;
  font-size:.9rem;
}
.breadcrumbs a{color:var(--color-navy);text-decoration:none;font-weight:600}
.breadcrumbs a:hover{color:var(--color-orange)}
.breadcrumbs .sep{color:var(--color-glacier);font-family:var(--font-mono)}
.breadcrumbs [aria-current="page"]{color:var(--text-main);font-weight:700}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1.5rem;
  flex-wrap:wrap;
}
.section-kicker{
  font-family:var(--font-mono);
  font-size:.8rem;
  letter-spacing:.12em;
  color:var(--color-orange);
  text-transform:uppercase;
  margin-bottom:.35rem;
}
.section-title{
  font-family:var(--font-heading);
  font-weight:900;
  font-size:clamp(1.6rem,3vw,2.25rem);
  color:var(--color-navy);
  line-height:1.2;
}
.grid{display:grid;gap:1.5rem}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.panel{
  background:var(--color-white);
  border:1px solid var(--color-glacier);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
}
.panel-pad{padding:clamp(1.25rem,3vw,2.25rem)}
.tag{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.28rem .65rem;
  font-family:var(--font-mono);
  font-size:.76rem;
  line-height:1.4;
  background:var(--color-warm);
  border:1px solid var(--color-glacier);
  color:var(--color-navy);
  border-radius:999px;
}
.tag-teal{background:rgba(0,179,164,.08);border-color:rgba(0,179,164,.35);color:#00877C}
.tag-orange{background:rgba(255,107,53,.1);border-color:rgba(255,107,53,.42);color:#E8551F}
.data-num{font-family:var(--font-mono);font-weight:700;color:var(--color-teal)}
.text-mono{font-family:var(--font-mono)}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}
.figure-frame{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:180px;
  background:var(--color-glacier);
  border:1px solid var(--color-glacier);
  border-radius:var(--radius);
}
.figure-frame::before{
  content:attr(data-caption);
  position:relative;
  z-index:1;
  font-family:var(--font-mono);
  font-size:.82rem;
  color:var(--color-navy);
  opacity:.62;
  padding:1rem;
  text-align:center;
  max-width:80%;
}
.figure-frame img{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
}
.figure-frame::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    linear-gradient(rgba(227,244,253,.28) 1px,transparent 1px),
    linear-gradient(90deg,rgba(227,244,253,.28) 1px,transparent 1px);
  background-size:18px 18px;
  mix-blend-mode:screen;
  opacity:.55;
}
.tabs{margin:1.5rem 0}
.tablist{
  display:flex;
  flex-wrap:wrap;
  gap:.25rem;
  border-bottom:1px solid var(--color-glacier);
}
.tab{
  appearance:none;
  -webkit-appearance:none;
  background:transparent;
  border:1px solid transparent;
  border-bottom:none;
  border-radius:var(--radius) var(--radius) 0 0;
  padding:.7rem 1.2rem;
  font-family:var(--font-heading);
  font-weight:700;
  font-size:.95rem;
  color:var(--color-navy);
  cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.tab:hover{color:var(--color-orange);background:var(--color-warm)}
.tab[aria-selected="true"]{
  background:var(--color-white);
  border-color:var(--color-glacier);
  border-bottom-color:var(--color-white);
  box-shadow:inset 0 3px 0 var(--color-orange);
}
.tabpanel{
  background:var(--color-white);
  border:1px solid var(--color-glacier);
  border-top:0;
  padding:clamp(1.25rem,3vw,2rem);
}
.tabpanel[hidden]{display:none}
.site-footer{
  position:relative;
  margin-top:clamp(4rem,9vw,8rem);
  background-color:var(--color-ink);
  background-image:
    linear-gradient(rgba(176,196,222,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(176,196,222,.06) 1px,transparent 1px);
  background-size:36px 36px;
  color:var(--color-ice);
}
.site-footer::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg,var(--color-orange) 0%,var(--color-teal) 55%,var(--color-navy) 100%);
  pointer-events:none;
}
.footer-main{
  max-width:var(--content-max);
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(2rem,4vw,3.5rem);
  padding:clamp(2.8rem,5vw,4.5rem) var(--gutter) 2.5rem;
}
.footer-col,.footer-brand-col,.footer-links-col,.footer-policy-col{min-width:0}
.site-footer .brand-name{color:var(--color-ice)}
.site-footer .brand-desc{color:var(--color-glacier)}
.brand-mark-inverse{background:var(--color-white);color:var(--color-navy)}
.footer-trust{
  margin-top:1.4rem;
  max-width:52ch;
  padding-left:1rem;
  border-left:3px solid var(--color-orange);
  font-size:.9rem;
  line-height:1.7;
  color:rgba(227,244,253,.72);
}
.footer-title{
  display:flex;
  align-items:center;
  gap:.55rem;
  margin-bottom:1.1rem;
  padding-bottom:.6rem;
  border-bottom:1px solid rgba(176,196,222,.2);
  font-family:var(--font-heading);
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--color-orange);
  text-transform:uppercase;
}
.footer-title::before{
  content:"";
  width:18px;
  height:3px;
  background:var(--color-orange);
  display:inline-block;
}
.footer-links,.footer-policy-list{display:grid;gap:.55rem}
.footer-links a,.footer-policy-list a{
  color:var(--color-glacier);
  text-decoration:none;
  font-size:.95rem;
  transition:color .2s ease,padding-left .2s ease;
}
.footer-links a:hover,.footer-policy-list a:hover{
  color:var(--color-orange);
  padding-left:.25rem;
}
.footer-contact{
  margin-top:1.4rem;
  display:grid;
  gap:.65rem;
  font-size:.9rem;
}
.contact-item{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.6rem;
  padding-left:.9rem;
  border-left:1px solid rgba(176,196,222,.25);
}
.contact-item dt{
  color:var(--color-glacier);
  font-family:var(--font-mono);
  font-size:.78rem;
  padding-top:.1rem;
}
.contact-item dd{color:rgba(227,244,253,.86);margin:0}
.footer-bottom{
  max-width:var(--content-max);
  margin-inline:auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
  padding:1.2rem var(--gutter) 2.2rem;
  border-top:1px solid rgba(176,196,222,.16);
  color:var(--color-glacier);
  font-size:.88rem;
}
.footer-copyright{color:inherit}
.footer-icp{color:inherit;font-family:var(--font-mono)}
@media (max-width:1079px){
  :root{--header-h:64px}
  .header-frame{
    flex-wrap:nowrap;
    align-items:center;
    gap:10px;
  }
  .site-header .header-nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    align-items:stretch;
    background:var(--color-white);
    border-bottom:1px solid var(--color-glacier);
    box-shadow:var(--shadow-md);
    padding:.5rem var(--gutter) 1rem;
  }
  .site-header .header-nav[data-open]{display:flex}
  .nav-list{flex-direction:column;width:100%}
  .nav-item{width:100%}
  .nav-link{
    width:100%;
    border-left:0;
    border-bottom:1px solid rgba(176,196,222,.35);
    padding:.85rem .4rem;
    font-size:1rem;
  }
  .nav-item:first-child .nav-link{border-top:1px solid rgba(176,196,222,.35)}
  .nav-link[aria-current="page"]{
    box-shadow:inset 3px 0 0 var(--color-orange);
    background:var(--color-warm);
  }
  .header-meta{
    display:flex;
    margin-left:auto;
    border-left:0;
    padding-left:0;
  }
  .brand-link{margin-right:auto}
  .nav-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:42px;
    min-height:42px;
    padding:.45rem .55rem;
    background:var(--color-white);
    border:1px solid var(--color-glacier);
    border-radius:var(--radius);
    color:var(--color-navy);
    cursor:pointer;
  }
  .nav-toggle-label{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip-path:inset(50%);
    white-space:nowrap;
  }
  .nav-toggle-icon{
    position:relative;
    width:18px;
    height:2px;
    background:currentColor;
    border-radius:1px;
    transition:background .2s ease;
  }
  .nav-toggle-icon::before,
  .nav-toggle-icon::after{
    content:"";
    position:absolute;
    left:0;
    width:100%;
    height:2px;
    background:currentColor;
    border-radius:1px;
    transition:transform .2s ease,top .2s ease;
  }
  .nav-toggle-icon::before{top:-6px}
  .nav-toggle-icon::after{top:6px}
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon{background:transparent}
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon::before{top:0;transform:rotate(45deg)}
  .nav-toggle[aria-expanded="true"] .nav-toggle-icon::after{top:0;transform:rotate(-45deg)}
  .nav-cta{display:flex;width:100%;margin-top:.9rem}
  .footer-main{grid-template-columns:1fr 1fr}
  .footer-brand-col{grid-column:1 / -1}
}
@media (max-width:899px){
  .grid-2,.grid-3{grid-template-columns:1fr}
  .footer-main{grid-template-columns:1fr;gap:2rem}
}
@media (min-width:900px) and (max-width:1199px){
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:420px){
  .brand-desc{display:none}
  .batch-badge{display:none}
  .header-meta{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .batch-dot{animation:none}
}
