*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0a1628;
  --grid:#1a4a6e;
  --grid-fine:rgba(26,74,110,.35);
  --cyan:#00d4ff;
  --cyan-dim:#4db8d4;
  --text:#c8e6f0;
  --muted:#6a8fa8;
  --label:#5a9ab8;
  --accent:#00e5a0;
  --warn:#ffb347;
  --border:1px solid var(--grid);
  --mono:"Consolas","Courier New",monospace;
  --sans:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --tab-h:52px;
}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--bg);
  color:var(--text);
  line-height:1.7;
  min-height:100vh;
  overflow-x:hidden;
  background-image:
    linear-gradient(var(--grid-fine) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-fine) 1px,transparent 1px);
  background-size:24px 24px;
}
a{color:var(--cyan);text-decoration:none;transition:color .2s}
a:hover{color:var(--accent)}
img{max-width:100%;height:auto;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 1.25rem}

/* ── Blueprint tab bar ── */
.bp-header{
  position:sticky;top:0;z-index:1000;
  background:var(--bg);
  border-bottom:2px solid var(--grid);
}
.bp-header::after{
  content:"";
  display:block;height:4px;
  background:repeating-linear-gradient(90deg,var(--grid) 0,var(--grid) 8px,transparent 8px,transparent 16px);
}
.header-row{
  display:flex;align-items:stretch;justify-content:space-between;
  min-height:var(--tab-h);gap:.5rem;
}
.bp-brand{
  display:flex;align-items:center;gap:.6rem;
  padding:.65rem 1rem;
  font-family:var(--mono);
  font-size:.78rem;
  color:var(--label);
  letter-spacing:.08em;
  text-transform:uppercase;
  border-right:var(--border);
  white-space:nowrap;
}
.bp-brand img{width:32px;height:32px;flex-shrink:0}
.bp-brand strong{color:var(--cyan);font-weight:600}
.bp-tabs{
  display:flex;align-items:stretch;flex:1;overflow-x:auto;
  scrollbar-width:none;
}
.bp-tabs::-webkit-scrollbar{display:none}
.bp-tabs a{
  display:flex;align-items:center;
  padding:0 1.1rem;
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
  border-right:var(--border);
  border-bottom:3px solid transparent;
  white-space:nowrap;
  transition:border-color .2s,color .2s,background .2s;
}
.bp-tabs a:hover{color:var(--cyan);background:rgba(26,74,110,.25)}
.bp-tabs a.active{
  color:var(--cyan);
  border-bottom-color:var(--cyan);
  background:rgba(0,212,255,.06);
}
.bp-tabs a.tab-dl{
  margin-left:auto;
  background:rgba(0,229,160,.12);
  color:var(--accent)!important;
  border-left:2px solid var(--accent);
  font-weight:700;
}
.bp-tabs a.tab-dl:hover{background:rgba(0,229,160,.22)}

/* ── Corner bracket sections ── */
.bp-section{
  position:relative;
  margin:2rem 0;
  padding:1.75rem 1.5rem 1.5rem;
  border:var(--border);
  background:rgba(10,22,40,.85);
}
.bp-section::before,.bp-section::after,
.bp-section .bp-corners::before,.bp-section .bp-corners::after{
  content:"";
  position:absolute;
  width:14px;height:14px;
  border-color:var(--cyan);
  border-style:solid;
  pointer-events:none;
}
.bp-section::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.bp-section::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.bp-section .bp-corners::before{top:-1px;right:-1px;border-width:2px 2px 0 0}
.bp-section .bp-corners::after{bottom:-1px;left:-1px;border-width:0 0 2px 2px}
.bp-section .bp-corners{position:absolute;inset:0;pointer-events:none}

.bp-label{
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--label);
  margin-bottom:.35rem;
}
.bp-label::before{content:"[ ";color:var(--grid)}
.bp-label::after{content:" ]";color:var(--grid)}

/* ── Hero schematic ── */
.bp-hero{
  padding:2.5rem 0 1rem;
  border-bottom:var(--border);
}
.bp-hero-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  align-items:center;
}
.bp-hero h1{
  font-size:clamp(1.6rem,4vw,2.4rem);
  font-weight:700;
  line-height:1.25;
  margin-bottom:.75rem;
  color:#e8f4fa;
}
.bp-hero h1 span{color:var(--cyan);font-family:var(--mono)}
.bp-hero .lead{color:var(--muted);font-size:1rem;margin-bottom:1.25rem;max-width:520px}
.bp-meta-row{
  display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;
}
.bp-tag{
  font-family:var(--mono);
  font-size:.65rem;
  letter-spacing:.05em;
  padding:.25rem .55rem;
  border:1px dashed var(--grid);
  color:var(--cyan-dim);
  background:rgba(26,74,110,.2);
}
.bp-cta-row{display:flex;flex-wrap:wrap;gap:.75rem}
.btn-dl-primary,.btn-dl-secondary{
  font-family:var(--mono);
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:.7rem 1.4rem;
  border:2px solid;
  transition:background .2s,transform .15s;
  display:inline-flex;align-items:center;gap:.4rem;
}
.btn-dl-primary{
  background:rgba(0,229,160,.15);
  border-color:var(--accent);
  color:var(--accent)!important;
  font-weight:700;
}
.btn-dl-primary:hover{background:rgba(0,229,160,.3);transform:translateY(-1px);color:var(--accent)!important}
.btn-dl-secondary{
  background:transparent;
  border-color:var(--cyan);
  color:var(--cyan)!important;
}
.btn-dl-secondary:hover{background:rgba(0,212,255,.1);color:var(--cyan)!important}
.bp-hero-viz{
  border:var(--border);
  padding:.5rem;
  background:rgba(26,74,110,.12);
  position:relative;
}
.bp-hero-viz::before{
  content:"FIG.01 — DEPLOYMENT SCHEMATIC";
  position:absolute;top:-.55rem;left:1rem;
  font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;
  color:var(--label);background:var(--bg);padding:0 .4rem;
}

/* ── Spec table (download matrix) ── */
.bp-spec-table{
  width:100%;
  border-collapse:collapse;
  font-size:.9rem;
  margin-top:1rem;
}
.bp-spec-table th,.bp-spec-table td{
  border:var(--border);
  padding:.65rem .85rem;
  text-align:left;
  vertical-align:top;
}
.bp-spec-table th{
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cyan);
  background:rgba(26,74,110,.35);
}
.bp-spec-table td code{
  font-family:var(--mono);
  font-size:.78rem;
  color:var(--accent);
  background:rgba(0,229,160,.08);
  padding:.1rem .35rem;
}
.bp-spec-table .size{font-family:var(--mono);color:var(--warn);white-space:nowrap}
.bp-spec-table tr:hover td{background:rgba(26,74,110,.15)}

/* ── Platform cards ── */
.bp-platforms{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.25rem;
}
.bp-platform{
  border:var(--border);
  padding:1.25rem;
  background:rgba(10,22,40,.6);
  position:relative;
}
.bp-platform .plat-id{
  font-family:var(--mono);
  font-size:.62rem;
  color:var(--label);
  letter-spacing:.1em;
  margin-bottom:.5rem;
}
.bp-platform h3{
  font-size:1.05rem;
  color:var(--cyan);
  margin-bottom:.5rem;
  font-family:var(--mono);
}
.bp-platform ul{
  list-style:none;
  font-size:.88rem;
  color:var(--muted);
}
.bp-platform li{
  padding:.25rem 0 .25rem 1rem;
  position:relative;
}
.bp-platform li::before{
  content:"▸";
  position:absolute;left:0;
  color:var(--grid);
  font-family:var(--mono);
}
.bp-platform .plat-dl{
  display:block;
  margin-top:1rem;
  text-align:center;
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.06em;
  padding:.55rem;
  border:1px solid var(--accent);
  color:var(--accent)!important;
  background:rgba(0,229,160,.08);
}
.bp-platform .plat-dl:hover{background:rgba(0,229,160,.2)}

/* ── News grid ── */
.bp-news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:1.25rem;
}
.bp-news-card{
  border:var(--border);
  background:rgba(10,22,40,.7);
  display:flex;
  flex-direction:column;
  transition:border-color .2s;
}
.bp-news-card:hover{border-color:var(--cyan)}
.bp-news-card img{
  border-bottom:var(--border);
  aspect-ratio:16/9;
  object-fit:cover;
  background:rgba(26,74,110,.2);
}
.bp-news-card .card-body{padding:1rem 1.1rem 1.2rem;flex:1;display:flex;flex-direction:column}
.bp-news-card .date{
  font-family:var(--mono);
  font-size:.62rem;
  color:var(--label);
  letter-spacing:.08em;
  margin-bottom:.4rem;
}
.bp-news-card h3{font-size:1rem;margin-bottom:.45rem;color:#e0f0f8}
.bp-news-card p{font-size:.86rem;color:var(--muted);flex:1;margin-bottom:.75rem}
.bp-news-card .read-more{
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* ── Article page ── */
.bp-article{padding:2rem 0 3rem}
.bp-article h1{font-size:clamp(1.4rem,3.5vw,2rem);margin-bottom:.5rem;color:#e8f4fa}
.bp-article .article-meta{
  font-family:var(--mono);
  font-size:.68rem;
  color:var(--label);
  letter-spacing:.06em;
  margin-bottom:1.5rem;
  padding-bottom:1rem;
  border-bottom:1px dashed var(--grid);
}
.bp-article .article-cover{
  border:var(--border);
  margin-bottom:1.5rem;
  background:rgba(26,74,110,.15);
}
.bp-article h2{
  font-family:var(--mono);
  font-size:.95rem;
  color:var(--cyan);
  margin:1.75rem 0 .65rem;
  letter-spacing:.04em;
}
.bp-article p,.bp-article li{color:var(--muted);font-size:.92rem;margin-bottom:.75rem}
.bp-article ul,.bp-article ol{margin:.5rem 0 1rem 1.25rem}
.bp-article ol li::marker{color:var(--cyan);font-family:var(--mono)}
.bp-article pre,.bp-article .cmd-block{
  font-family:var(--mono);
  font-size:.78rem;
  background:rgba(26,74,110,.25);
  border:var(--border);
  padding:1rem;
  overflow-x:auto;
  color:var(--accent);
  margin:1rem 0;
  line-height:1.5;
}
.bp-breadcrumb{
  font-family:var(--mono);
  font-size:.65rem;
  letter-spacing:.05em;
  color:var(--label);
  padding:1rem 0 .5rem;
}
.bp-breadcrumb a{color:var(--muted)}
.bp-breadcrumb a:hover{color:var(--cyan)}
.bp-breadcrumb span{color:var(--cyan)}

/* ── Tutorial steps ── */
.bp-steps{counter-reset:step}
.bp-step{
  border-left:2px solid var(--grid);
  padding:.75rem 0 .75rem 1.25rem;
  margin-bottom:.5rem;
  position:relative;
}
.bp-step::before{
  counter-increment:step;
  content:counter(step,decimal-leading-zero);
  position:absolute;left:-2.1rem;top:.75rem;
  font-family:var(--mono);
  font-size:.62rem;
  color:var(--cyan);
  background:var(--bg);
  padding:0 .2rem;
}

/* ── CTA banner ── */
.bp-cta-banner{
  border:2px solid var(--accent);
  padding:1.5rem;
  text-align:center;
  background:rgba(0,229,160,.06);
  margin:2rem 0;
  position:relative;
}
.bp-cta-banner::before,.bp-cta-banner::after{
  content:"+";position:absolute;
  font-family:var(--mono);color:var(--accent);font-size:1rem;
}
.bp-cta-banner::before{top:4px;left:8px}
.bp-cta-banner::after{bottom:4px;right:8px}
.bp-cta-banner h3{font-family:var(--mono);color:var(--accent);margin-bottom:.5rem;font-size:1rem}
.bp-cta-banner p{color:var(--muted);font-size:.88rem;margin-bottom:1rem}

/* ── Footer ── */
.bp-footer{
  border-top:2px solid var(--grid);
  margin-top:3rem;
  padding:2rem 0;
  background:rgba(10,22,40,.95);
}
.bp-footer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1.5rem;
  margin-bottom:1.5rem;
}
.bp-footer h4{
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cyan);
  margin-bottom:.65rem;
}
.bp-footer ul{list-style:none}
.bp-footer li{margin-bottom:.35rem;font-size:.85rem}
.bp-footer a{color:var(--muted)}
.bp-footer a:hover{color:var(--cyan)}
.bp-friends{
  border:1px dashed var(--grid);
  padding:1rem 1.25rem;
  margin-bottom:1.25rem;
}
.bp-friends .bp-label{margin-bottom:.5rem}
.bp-friends-links{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem}
.bp-friends-links a{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.04em;
}
.bp-copy{
  font-family:var(--mono);
  font-size:.62rem;
  color:var(--label);
  letter-spacing:.05em;
  text-align:center;
  padding-top:1rem;
  border-top:1px dashed var(--grid);
}

/* ── Page title block ── */
.bp-title-block{
  border-bottom:var(--border);
  padding:1.5rem 0;
  margin-bottom:1rem;
}
.bp-title-block h1{
  font-size:clamp(1.3rem,3vw,1.8rem);
  font-family:var(--mono);
  color:var(--cyan);
  letter-spacing:.04em;
}
.bp-title-block .rev{
  font-family:var(--mono);
  font-size:.62rem;
  color:var(--label);
  margin-top:.35rem;
}

/* ── Responsive ── */
@media(max-width:768px){
  .bp-hero-grid{grid-template-columns:1fr}
  .bp-hero-viz{order:-1}
  .header-row{flex-wrap:wrap}
  .bp-brand{border-right:none;border-bottom:var(--border);width:100%;justify-content:center}
  .bp-tabs{width:100%}
  .bp-spec-table{font-size:.8rem}
  .bp-spec-table th,.bp-spec-table td{padding:.45rem .5rem}
}