*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0}
img,svg,video{display:block;max-width:100%}
button{font:inherit;color:inherit}
ul,ol,dl,dd,figure,p,h1,h2,h3,h4{margin:0}
ul,ol{padding:0;list-style:none}

:root{
  --ink-900:#081120;
  --ink-800:#0E1B2E;
  --ink-700:#16273E;
  --cyan:#1FE0C0;
  --cyan-deep:#0FA88F;
  --orange:#FF6A1F;
  --orange-soft:#FFA25C;
  --paper:#F5F0E6;
  --mist:#9FB2C6;
  --lime:#C8F24A;
  --hairline:rgba(31,224,192,.18);
  --shadow-hard:4px 4px 0 var(--ink-700);
  --shadow-hard-lift:6px 6px 0 var(--ink-700);
  --font-title:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;
  --font-body:'Noto Sans SC','Source Han Sans SC','PingFang SC',sans-serif;
  --font-mono:'JetBrains Mono','Roboto Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --measure:42em;
  --shell:min(1240px,100% - clamp(32px,8vw,96px));
  --ease:cubic-bezier(.2,.8,.2,1);
}

body{
  background:
    linear-gradient(180deg,rgba(31,224,192,.07),rgba(31,224,192,0) 420px),
    var(--ink-900);
  color:var(--paper);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.85;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4{font-family:var(--font-title);font-weight:800;line-height:1.18;letter-spacing:.02em}
a{color:var(--cyan);text-decoration:underline;text-decoration-color:rgba(31,224,192,.35);text-underline-offset:6px;text-decoration-thickness:1px;transition:color .18s var(--ease),text-underline-offset .18s var(--ease),text-decoration-color .18s var(--ease)}
a:hover{color:var(--paper);text-decoration-color:var(--cyan);text-underline-offset:3px}

:focus-visible{outline:2px solid var(--orange);outline-offset:2px;box-shadow:0 0 0 4px rgba(8,17,32,.9),0 0 0 6px rgba(255,106,31,.35);border-radius:2px}

/* ---------- skip link ---------- */
.bx-skip{
  position:fixed;top:10px;left:12px;z-index:200;
  transform:translateY(-160%);
  background:var(--paper);color:var(--ink-900);
  font-family:var(--font-mono);font-size:13px;letter-spacing:.1em;
  padding:10px 16px;border:2px solid var(--ink-900);text-decoration:none;
  box-shadow:4px 4px 0 var(--orange);
  transition:transform .2s var(--ease);
}
.bx-skip:focus-visible,.bx-skip:focus{transform:translateY(0);color:var(--ink-900);text-decoration:none}

/* ---------- header / masthead ---------- */
.bx-header{
  position:sticky;top:0;z-index:80;
  background:rgba(8,17,32,.95);
  border-bottom:2px solid var(--ink-700);
  transition:box-shadow .24s var(--ease),background .24s var(--ease);
}
.bx-header[data-condensed]{box-shadow:0 10px 0 -8px rgba(31,224,192,.35)}
.bx-progress{position:absolute;inset:0 0 auto 0;height:3px;background:rgba(22,39,62,.9);pointer-events:none}
.bx-progress__bar{
  display:block;height:100%;width:100%;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--cyan),var(--orange));
  will-change:transform;
}
.bx-header__inner{width:var(--shell);margin-inline:auto;padding-top:3px}

.bx-masthead{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;
  gap:clamp(12px,2vw,28px);
  padding:16px 0 14px;
  border-bottom:1px solid var(--ink-700);
  transition:padding .24s var(--ease);
}
.bx-header[data-condensed] .bx-masthead{padding:8px 0 8px}

.bx-brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:var(--paper);border:0}
.bx-brand:hover{color:var(--paper);text-decoration:none}
.bx-brand__mark{
  width:12px;height:22px;flex:none;align-self:center;
  background:linear-gradient(180deg,var(--cyan),var(--orange));
  box-shadow:3px 0 0 -1px var(--ink-700);
  transform:skewY(-8deg);
}
.bx-brand__name{font-family:var(--font-title);font-weight:800;font-size:clamp(19px,2.2vw,23px);letter-spacing:.14em;line-height:1}
.bx-brand__sub{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;color:var(--mist);text-transform:uppercase}

.bx-masthead__kicker{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;
  color:var(--mist);text-transform:uppercase;
  padding-left:16px;border-left:1px solid var(--ink-700);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.bx-status{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;border:1px solid var(--ink-700);border-radius:999px;
  background:var(--ink-800);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;color:var(--mist);
  white-space:nowrap;
}
.bx-status__dot{
  width:7px;height:7px;flex:none;border-radius:50%;background:var(--lime);
  box-shadow:0 0 0 0 rgba(200,242,74,.6);
  animation:bx-breathe 3.4s ease-in-out infinite;
}
.bx-status__text{line-height:1}
@keyframes bx-breathe{
  0%,100%{opacity:.55;box-shadow:0 0 0 0 rgba(200,242,74,.5)}
  50%{opacity:1;box-shadow:0 0 0 5px rgba(200,242,74,0)}
}

.bx-navtoggle{
  display:none;align-items:center;gap:9px;
  background:var(--ink-800);border:2px solid var(--ink-700);
  padding:8px 12px;cursor:pointer;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;color:var(--paper);
}
.bx-navtoggle:hover{border-color:var(--cyan)}
.bx-navtoggle__bars{display:grid;gap:3px;width:16px}
.bx-navtoggle__bars i{display:block;height:2px;background:var(--cyan);transition:transform .2s var(--ease),opacity .2s var(--ease)}
.bx-header[data-open] .bx-navtoggle__bars i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.bx-header[data-open] .bx-navtoggle__bars i:nth-child(2){opacity:0}
.bx-header[data-open] .bx-navtoggle__bars i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.bx-navtoggle__label{line-height:1}

.bx-nav{padding:10px 0 12px;border-top:1px dashed var(--hairline)}
.bx-nav__list{display:flex;justify-content:center;flex-wrap:wrap;gap:clamp(14px,2.6vw,34px)}
.bx-nav__item{display:block}
.bx-nav__link{
  display:inline-flex;align-items:baseline;gap:7px;
  font-size:14.5px;letter-spacing:.06em;color:var(--paper);text-decoration:none;
  padding:4px 0 6px;border-bottom:2px solid transparent;
  transition:color .18s var(--ease),border-color .18s var(--ease);
}
.bx-nav__num{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--mist);transition:color .18s var(--ease)}
.bx-nav__link:hover{color:var(--cyan);border-bottom-color:var(--cyan-deep)}
.bx-nav__link:hover .bx-nav__num{color:var(--orange)}
.bx-nav__link[aria-current="page"]{color:var(--paper);border-bottom-color:var(--cyan)}
.bx-nav__link[aria-current="page"] .bx-nav__num{color:var(--cyan)}

/* ---------- buttons ---------- */
.bx-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 22px;border:2px solid var(--ink-700);
  font-family:var(--font-title);font-weight:800;font-size:15px;letter-spacing:.05em;
  text-decoration:none;cursor:pointer;
  box-shadow:var(--shadow-hard);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease);
}
.bx-btn:hover,.bx-btn:focus-visible{transform:translate(-2px,-2px);box-shadow:var(--shadow-hard-lift);text-decoration:none}
.bx-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink-700)}
.bx-btn--flare{background:var(--orange);color:#12100D;border-color:#0B1421}
.bx-btn--flare:hover{background:var(--orange-soft);color:#12100D}
.bx-btn--pulse{background:var(--cyan);color:#04120F;border-color:#0B1421}
.bx-btn--pulse:hover{background:var(--cyan-deep);color:#04120F}
.bx-btn--ghost{background:transparent;color:var(--paper);border-color:var(--ink-700)}
.bx-btn--ghost:hover{color:var(--cyan);border-color:var(--cyan)}

/* ---------- layout ---------- */
.bx-container{width:var(--shell);margin-inline:auto}
.bx-container--narrow{width:min(760px,100% - clamp(32px,8vw,96px));margin-inline:auto}
.bx-section{padding-block:clamp(46px,7vw,92px)}
.bx-section__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 22px;margin-bottom:clamp(20px,3vw,34px)}
.bx-section__head h2{font-size:clamp(24px,3.4vw,36px);letter-spacing:.02em}
.bx-rule{height:0;border:0;border-top:1px solid var(--ink-700);margin:0}

.bx-grid{display:grid;gap:clamp(20px,2.6vw,36px)}
.bx-grid--split{grid-template-columns:repeat(12,1fr)}
.bx-grid__main{grid-column:1 / span 7;min-width:0}
.bx-grid__aside{grid-column:9 / span 4;min-width:0}
.bx-grid__full{grid-column:1 / -1;min-width:0}

/* ---------- text ---------- */
.bx-eyebrow{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--cyan);
}
.bx-display{
  font-family:var(--font-title);font-weight:800;
  font-size:clamp(40px,7vw,88px);line-height:1.02;letter-spacing:.04em;
}
.bx-lede{font-size:clamp(16px,1.6vw,19px);line-height:1.8;color:var(--paper);max-width:var(--measure)}
.bx-note{font-size:13px;line-height:1.6;color:var(--mist);max-width:38em}
.bx-mono{font-family:var(--font-mono);font-size:14px;letter-spacing:.12em}
.bx-prose{max-width:var(--measure)}
.bx-prose p{margin-bottom:1.1em;max-width:var(--measure)}
.bx-prose h3{margin:1.6em 0 .6em;font-size:clamp(20px,2.4vw,26px)}
.bx-prose ul{list-style:none;display:grid;gap:8px;margin:0 0 1.2em}
.bx-prose li{padding-left:18px;position:relative}
.bx-prose li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:2px;background:var(--cyan)}

/* ---------- panels / tags / pulse line ---------- */
.bx-panel{
  background:var(--ink-800);border:2px solid var(--ink-700);
  padding:clamp(18px,2.4vw,28px);
  box-shadow:var(--shadow-hard);
  transition:box-shadow .22s var(--ease),transform .22s var(--ease),border-color .22s var(--ease);
}
.bx-panel:hover{box-shadow:var(--shadow-hard-lift);transform:translate(-2px,-2px);border-color:var(--cyan-deep)}
.bx-panel__head{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mist);padding-bottom:10px;margin-bottom:14px;border-bottom:1px dashed var(--hairline);
}
.bx-tag{
  display:inline-block;padding:3px 9px;border:1px solid var(--cyan-deep);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;color:var(--cyan);
  text-transform:uppercase;
}
.bx-tag--flare{border-color:var(--orange);color:var(--orange)}
.bx-pulse-line{
  position:relative;padding-left:20px;
}
.bx-pulse-line::before{
  content:"";position:absolute;left:0;top:.3em;bottom:.3em;width:2px;
  background:linear-gradient(180deg,var(--cyan),rgba(31,224,192,.05));
}

/* ---------- data strip ---------- */
.bx-data-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));
  background:var(--ink-800);border:2px solid var(--ink-700);border-left:4px solid var(--cyan);
  margin-block:clamp(24px,4vw,48px);
}
.bx-data-strip__item{padding:14px 18px;border-left:1px solid var(--ink-700);min-width:0}
.bx-data-strip__item:first-child{border-left:0}
.bx-data-strip__label{font-size:13px;line-height:1.6;color:var(--mist);letter-spacing:.06em}
.bx-data-strip__value{
  display:block;font-family:var(--font-mono);font-size:clamp(18px,2.2vw,24px);
  letter-spacing:.08em;color:var(--paper);line-height:1.3;
}
.bx-data-strip__value em{font-style:normal;color:var(--orange)}

/* ---------- index list ---------- */
.bx-index-list{display:grid;border-top:2px solid var(--ink-700)}
.bx-index-list__row{
  display:grid;grid-template-columns:56px 1fr;gap:6px 18px;
  padding:16px 12px 16px 0;border-bottom:1px solid var(--ink-700);
  text-decoration:none;color:var(--paper);position:relative;
  transition:background .2s var(--ease),color .2s var(--ease);
}
.bx-index-list__row::before{
  content:"";position:absolute;left:-14px;top:16px;bottom:16px;width:3px;
  background:var(--cyan);transform:scaleY(0);transform-origin:top;
  transition:transform .24s var(--ease);
}
.bx-index-list__row:hover{background:rgba(22,39,62,.55);color:var(--paper);text-decoration:none}
.bx-index-list__row:hover::before{transform:scaleY(1)}
.bx-index-list__num{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.12em;color:var(--mist);padding-top:3px}
.bx-index-list__row:hover .bx-index-list__num{color:var(--cyan)}
.bx-index-list__title{font-family:var(--font-title);font-weight:800;font-size:clamp(17px,2vw,21px);letter-spacing:.02em}
.bx-index-list__desc{grid-column:2;font-size:13.5px;line-height:1.7;color:var(--mist)}

/* ---------- breadcrumb ---------- */
.bx-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:var(--mist);padding-block:18px}
.bx-breadcrumb__item{display:inline-flex;align-items:center;gap:8px}
.bx-breadcrumb__item + .bx-breadcrumb__item::before{content:"/";color:var(--ink-700)}
.bx-breadcrumb__link{color:var(--mist);text-decoration:none}
.bx-breadcrumb__link:hover{color:var(--cyan);text-decoration:underline}

/* ---------- note block ---------- */
.bx-note-block{
  border:1px solid var(--ink-700);border-left:3px solid var(--orange);
  background:rgba(22,39,62,.45);padding:14px 16px;
  font-size:13px;line-height:1.7;color:var(--mist);
}
.bx-note-block strong{color:var(--paper)}

/* ---------- media ---------- */
.bx-media{
  position:relative;overflow:hidden;aspect-ratio:16/10;
  border:2px solid var(--ink-700);box-shadow:var(--shadow-hard);
  background:
    radial-gradient(120% 80% at 18% 0%,rgba(31,224,192,.26),rgba(31,224,192,0) 62%),
    radial-gradient(90% 70% at 100% 100%,rgba(255,106,31,.24),rgba(255,106,31,0) 60%),
    linear-gradient(140deg,#0E1B2E 0%,#16273E 52%,#0A1526 100%);
}
.bx-media--wide{aspect-ratio:21/9}
.bx-media--tall{aspect-ratio:4/5}
.bx-media--cut{clip-path:polygon(0 0,100% 0,100% 86%,0 100%)}
.bx-media__img{width:100%;height:100%;object-fit:cover;filter:saturate(1.06) contrast(1.04)}
.bx-media__tag{
  position:absolute;left:0;bottom:0;
  background:var(--ink-900);border-top:2px solid var(--cyan);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;color:var(--cyan);
  padding:6px 11px;
}

/* ---------- reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
[data-reveal].is-visible{opacity:1;transform:none}

/* ---------- footer ---------- */
.bx-footer{
  margin-top:clamp(48px,7vw,96px);
  background:var(--ink-800);
  border-top:1px solid var(--ink-700);
  position:relative;
}
.bx-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--ink-700) 46%,var(--orange));
}
.bx-footer__inner{padding-block:clamp(30px,4vw,52px) clamp(24px,3vw,34px)}

.bx-feedback{
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px 28px;
  padding:clamp(18px,2.6vw,26px);
  background:var(--ink-900);
  border:2px solid var(--ink-700);
  box-shadow:var(--shadow-hard);
}
.bx-feedback__title{font-family:var(--font-title);font-weight:800;font-size:clamp(18px,2.4vw,25px);letter-spacing:.02em;line-height:1.4}
.bx-feedback__note{margin-top:6px;font-size:13px;line-height:1.7;color:var(--mist)}
.bx-feedback .bx-eyebrow{margin-bottom:8px;color:var(--orange)}

.bx-index{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,3vw,40px);
  padding-block:clamp(26px,4vw,44px);
  margin-top:clamp(26px,4vw,44px);
  border-top:1px solid var(--ink-700);
}
.bx-index__col{min-width:0}
.bx-index__title{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mist);padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid var(--ink-700);
}
.bx-index__list{display:grid;gap:9px}
.bx-index__link{font-size:14.5px;color:var(--paper);text-decoration:none;letter-spacing:.02em}
.bx-index__link:hover{color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
.bx-index__data{display:grid;gap:9px;font-size:13px}
.bx-index__row{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:baseline}
.bx-index__key{color:var(--mist);font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em}
.bx-index__val{color:var(--paper);font-family:var(--font-mono);font-size:12.5px;letter-spacing:.04em;word-break:break-word}

.bx-meta{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;
  padding-top:18px;border-top:1px solid var(--ink-700);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;color:var(--mist);
}
.bx-meta__brand,.bx-meta__row{margin:0}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .bx-grid__main{grid-column:1 / span 12}
  .bx-grid__aside{grid-column:1 / span 12}
  .bx-index{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  html{scroll-padding-top:88px}
  .bx-masthead{grid-template-columns:auto 1fr auto;padding:12px 0}
  .bx-masthead__kicker{display:none}
  .bx-status{padding:5px 11px;font-size:10.5px}
  .bx-navtoggle{display:inline-flex}
  .bx-nav{display:none;border-top:1px solid var(--ink-700);padding:6px 0 16px}
  .bx-header[data-open] .bx-nav{display:block}
  .bx-nav__list{display:grid;gap:0;justify-content:stretch}
  .bx-nav__item{border-bottom:1px solid var(--ink-700)}
  .bx-nav__link{
    display:flex;width:100%;padding:13px 0;border-bottom:0;
    font-size:16px;letter-spacing:.04em;
  }
  .bx-nav__link[aria-current="page"]{border-bottom:0;color:var(--cyan)}
  .bx-nav__link[aria-current="page"] .bx-nav__num{color:var(--orange)}
  .bx-feedback{grid-template-columns:1fr;align-items:start}
  .bx-feedback .bx-btn{justify-self:start}
}
@media (max-width:640px){
  body{font-size:16px}
  .bx-index{grid-template-columns:1fr;gap:22px}
  .bx-data-strip{grid-template-columns:1fr 1fr}
  .bx-data-strip__item{border-left:0;border-top:1px solid var(--ink-700)}
  .bx-data-strip__item:first-child,.bx-data-strip__item:nth-child(2){border-top:0}
  .bx-meta{flex-direction:column}
  .bx-index-list__row{grid-template-columns:44px 1fr}
}
@media (max-width:420px){
  .bx-brand__sub{display:none}
  .bx-status__text{font-size:10px}
}

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