*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html.nav-open{overflow:hidden}
body,h1,h2,h3,h4,p,ul,ol,dl,dd,dt,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0}
:root{
  --ink-900:#0B1E33;
  --ink-800:#122A44;
  --ink-700:#17334F;
  --white:#F8F9FA;
  --cyan:#00F0FF;
  --orange:#FF6B35;
  --red:#E63946;
  --violet:#7C4DFF;
  --grey:#8A9BB0;
  --grid:#1F4E5F;
  --rail-w:212px;
  --topline-h:56px;
  --bar-h:58px;
  --maxw:1180px;
  --line:1px solid var(--grid);
  --font-display:"Oswald","Bebas Neue","Arial Narrow",Impact,"Noto Sans SC",sans-serif;
  --font-body:"IBM Plex Sans","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --font-serif:"Noto Serif SC","Songti SC",Georgia,serif;
}
body{
  min-height:100vh;
  padding-left:var(--rail-w);
  padding-top:var(--topline-h);
  background-color:var(--ink-900);
  background-image:
    linear-gradient(rgba(31,78,95,.26) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,78,95,.20) 1px,transparent 1px),
    radial-gradient(circle at 78% 10%,rgba(0,240,255,.10),transparent 42%),
    radial-gradient(circle at 10% 84%,rgba(124,77,255,.10),transparent 46%);
  background-size:64px 64px,64px 64px,100% 100%,100% 100%;
  background-attachment:fixed;
  color:var(--white);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.75;
  overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;
}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
a:focus-visible,button:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
::selection{background:var(--orange);color:var(--ink-900)}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,4vw,44px)}
.section{position:relative;padding:clamp(48px,7vw,96px) 0}
.section--tight{padding:clamp(26px,4vw,52px) 0}
.section--band{
  background:linear-gradient(180deg,rgba(18,42,68,.78),rgba(18,42,68,.30));
  border-top:1px solid var(--grid);
  border-bottom:1px solid var(--grid);
}
.grid{display:grid;gap:clamp(16px,2.4vw,28px)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--aside{grid-template-columns:minmax(0,2.1fr) minmax(0,1fr)}
.stack{display:flex;flex-direction:column;gap:clamp(16px,2vw,28px)}

/* ---------- typography ---------- */
.eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan)}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--cyan)}
.display{font-family:var(--font-display);font-weight:700;line-height:.92;letter-spacing:.01em;text-transform:uppercase;color:var(--white)}
.display--xl{font-size:clamp(46px,10vw,120px)}
.display--lg{font-size:clamp(32px,6vw,66px)}
.display em{font-style:italic;color:var(--orange)}
.lede{max-width:56ch;font-size:clamp(15px,1.5vw,18px);line-height:1.78;color:#C7D4E2}
.prose{font-size:15.5px;line-height:1.9;color:#B9C8D8}
.prose p+p{margin-top:1em}
.prose h2,.prose h3{margin:1.4em 0 .5em;font-family:var(--font-serif);font-weight:600;color:var(--white);line-height:1.35}
.mono{font-family:var(--font-mono)}
.serif{font-family:var(--font-serif)}
.section-head{display:flex;flex-direction:column;gap:12px;margin-bottom:clamp(24px,3vw,40px)}
.section-head__idx{font-family:var(--font-mono);font-style:italic;font-size:12px;letter-spacing:.24em;color:var(--orange)}
.section-head__title{margin:0;font-family:var(--font-serif);font-weight:600;font-size:clamp(24px,3.4vw,40px);line-height:1.25;color:var(--white)}
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--grey)}
.breadcrumbs__item{color:var(--grey)}
.breadcrumbs__item:hover{color:var(--cyan)}
.breadcrumbs__item[aria-current="page"]{color:var(--white)}
.breadcrumbs__sep{color:var(--grid)}

/* ---------- atomic controls ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 18px;border:1px solid var(--cyan);border-radius:0;
  background:transparent;color:var(--cyan);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;line-height:1.2;
  cursor:pointer;transition:background-color .18s ease,color .18s ease,border-color .18s ease
}
.btn:hover{background:var(--cyan);color:var(--ink-900)}
.btn--primary{background:var(--orange);border-color:var(--orange);color:#180D07}
.btn--primary:hover{background:#FF8558;border-color:#FF8558;color:#180D07}
.btn--ghost{border-color:rgba(0,240,255,.45);color:var(--grey)}
.btn--ghost:hover{background:rgba(0,240,255,.14);border-color:var(--cyan);color:var(--white)}
.btn--sm{padding:7px 12px;font-size:11px}
.btn--block{width:100%}
.link-arrow{display:inline-flex;align-items:center;gap:8px;padding-bottom:3px;border-bottom:1px solid rgba(0,240,255,.4);font-family:var(--font-mono);font-size:12.5px;letter-spacing:.14em;color:var(--cyan)}
.link-arrow::after{content:"→";transition:transform .18s ease}
.link-arrow:hover{color:var(--white);border-bottom-color:var(--white)}
.link-arrow:hover::after{transform:translateX(4px)}
.tag{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid currentColor;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;color:var(--cyan)}
.tag--orange{color:var(--orange)}
.tag--red{color:var(--red)}
.tag--violet{color:var(--violet)}
.tag--grey{color:var(--grey)}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid var(--grid);background:rgba(11,30,51,.7);font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;color:var(--grey)}
.badge__dot{width:6px;height:6px;background:var(--red)}
.is-hidden{display:none !important}
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
[data-reveal].is-visible{opacity:1;transform:none}

/* ---------- data components ---------- */
.stat{display:flex;flex-direction:column;gap:6px;padding:18px 0;border-top:1px solid var(--grid)}
.stat__num{font-family:var(--font-mono);font-style:italic;font-variant-numeric:tabular-nums;font-size:clamp(34px,5vw,72px);line-height:1;letter-spacing:-.02em;color:var(--cyan)}
.stat--orange .stat__num{color:var(--orange)}
.stat--red .stat__num{color:var(--red)}
.stat__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--grey)}
.panel{position:relative;border:1px solid var(--grid);background:linear-gradient(180deg,rgba(18,42,68,.92),rgba(11,30,51,.92))}
.panel::before{content:"";position:absolute;top:-1px;left:-1px;width:14px;height:14px;border-top:2px solid var(--cyan);border-left:2px solid var(--cyan)}
.panel__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--grid)}
.panel__title{margin:0;font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;color:var(--white)}
.panel__body{padding:18px}
.card{display:flex;flex-direction:column;gap:10px;padding:20px;border:1px solid var(--grid);border-left:2px solid var(--cyan);background:rgba(18,42,68,.6)}
.card--orange{border-left-color:var(--orange)}
.card--red{border-left-color:var(--red)}
.card--violet{border-left-color:var(--violet)}
.card__title{margin:0;font-family:var(--font-serif);font-weight:600;font-size:19px;line-height:1.4;color:var(--white)}
.card__meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--grey)}
.card__text{font-size:14.5px;line-height:1.85;color:#B9C8D8}
.timeline{position:relative;padding:0;list-style:none}
.timeline::before{content:"";position:absolute;top:0;bottom:0;left:7px;width:1px;background:linear-gradient(180deg,var(--cyan),rgba(31,78,95,.2))}
.timeline__item{position:relative;padding:0 0 24px 30px}
.timeline__item::before{content:"";position:absolute;left:2px;top:6px;width:11px;height:11px;background:var(--ink-900);border:1px solid var(--cyan)}
.timeline__stamp{display:block;font-family:var(--font-mono);font-style:italic;font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:.1em;color:var(--orange)}
.timeline__title{margin:4px 0 0;font-family:var(--font-serif);font-weight:600;font-size:16px;line-height:1.5;color:var(--white)}
.meter{display:flex;align-items:center;gap:12px}
.meter__track{position:relative;flex:1 1 auto;height:6px;background:rgba(31,78,95,.7);overflow:hidden}
.meter__bar{display:block;height:100%;width:var(--w,0);background:linear-gradient(90deg,var(--cyan),var(--violet));transition:width .9s cubic-bezier(.2,.7,.2,1)}
.meter--orange .meter__bar{background:linear-gradient(90deg,var(--orange),var(--red))}
.meter__value{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12px;color:var(--white)}
.note{padding:16px 18px;border-left:2px solid var(--cyan);background:rgba(0,240,255,.06);font-size:14px;line-height:1.85;color:#C7D4E2}
.note--orange{border-left-color:var(--orange);background:rgba(255,107,53,.08)}
.note--red{border-left-color:var(--red);background:rgba(230,57,70,.10)}
.filter-bar{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0;border-top:1px solid var(--grid);border-bottom:1px solid var(--grid)}
.filter-btn{padding:8px 14px;border:1px solid var(--grid);background:transparent;color:var(--grey);font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;cursor:pointer;transition:color .18s ease,border-color .18s ease,background-color .18s ease}
.filter-btn:hover{color:var(--white);border-color:var(--cyan)}
.filter-btn[aria-pressed="true"]{background:var(--violet);border-color:var(--violet);color:var(--white)}
.figure{display:flex;flex-direction:column;gap:10px;margin:0}
.figure__media{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--grid);background:linear-gradient(135deg,rgba(18,42,68,.95),rgba(11,30,51,.95))}
.figure__media img{width:100%;height:100%;object-fit:cover}
.figure__media::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,240,255,.06) 0 1px,transparent 1px 4px)}
.figure--tall .figure__media{aspect-ratio:3/4}
.figure--square .figure__media{aspect-ratio:1/1}
.figure--wide .figure__media{aspect-ratio:21/9}
.figure__caption{font-family:var(--font-mono);font-size:11.5px;line-height:1.7;letter-spacing:.06em;color:var(--grey)}

/* ---------- header frame ---------- */
.site-header{position:fixed;inset:0;z-index:90;pointer-events:none}
.site-header>*{pointer-events:auto}
.skip-link{
  position:fixed;top:8px;left:8px;z-index:200;
  padding:10px 16px;background:var(--cyan);color:var(--ink-900);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;
  transform:translateY(-180%);transition:transform .18s ease
}
.skip-link:focus{transform:translateY(0)}
.scroll-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:95;background:rgba(31,78,95,.5);pointer-events:none}
.scroll-progress__bar{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--cyan),var(--orange));box-shadow:0 0 12px rgba(0,240,255,.65)}

.rail{
  position:absolute;top:0;left:0;bottom:0;width:var(--rail-w);
  display:flex;flex-direction:column;gap:22px;
  padding:22px 18px 20px;overflow-y:auto;
  background:linear-gradient(180deg,#0A1B2E 0%,#0B1E33 55%,#0A1728 100%);
  border-right:1px solid var(--grid);
  box-shadow:1px 0 0 rgba(0,240,255,.14),28px 0 70px -50px rgba(0,240,255,.6)
}
.rail::after{
  content:"";position:absolute;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  opacity:.55;animation:rail-scan 7s linear infinite
}
@keyframes rail-scan{0%{top:6%}50%{top:92%}100%{top:6%}}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.28}}

.brand{display:block;padding-bottom:16px;border-bottom:1px solid var(--grid)}
.brand__glyph{display:block;font-family:var(--font-display);font-style:italic;font-size:44px;line-height:.9;letter-spacing:.02em;color:var(--orange)}
.brand__name{display:block;margin-top:8px;font-family:var(--font-serif);font-weight:600;font-size:17px;letter-spacing:.26em;color:var(--white)}
.brand__sub{display:block;margin-top:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--cyan)}

.nav-toggle{display:none;align-items:center;gap:9px;padding:8px 12px;border:1px solid var(--grid);color:var(--white);font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;cursor:pointer}
.nav-toggle__bars{position:relative;display:block;width:18px;height:12px}
.nav-toggle__bars i{position:absolute;left:0;right:0;height:1.5px;background:var(--cyan);transition:transform .22s ease,opacity .22s ease}
.nav-toggle__bars i:nth-child(1){top:0}
.nav-toggle__bars i:nth-child(2){top:5px}
.nav-toggle__bars i:nth-child(3){top:10px}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.nav-toggle__text{white-space:nowrap}

.rail-nav{flex:1 1 auto;min-height:0}
.rail-nav__list{display:flex;flex-direction:column;gap:4px}
.rail-nav__link{
  display:flex;align-items:baseline;gap:10px;
  padding:10px 10px 10px 12px;
  border-left:2px solid transparent;
  color:var(--grey);font-size:14px;letter-spacing:.06em;
  transition:color .18s ease,background-color .18s ease,border-color .18s ease
}
.rail-nav__num{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;color:#4E6D80}
.rail-nav__link:hover{color:var(--white);background:rgba(0,240,255,.06);border-left-color:var(--cyan)}
.rail-nav__link[aria-current="page"]{color:var(--white);background:linear-gradient(90deg,rgba(0,240,255,.16),transparent);border-left-color:var(--cyan)}
.rail-nav__link[aria-current="page"] .rail-nav__num{color:var(--orange)}
.rail-nav__extra{display:none}
.rail-nav__status{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--cyan)}

.rail-foot{display:flex;flex-direction:column;gap:8px;padding-top:14px;border-top:1px solid var(--grid)}
.rail-foot__stat{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--cyan)}
.rail-foot__dot{width:7px;height:7px;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:pulse-dot 1.9s ease-in-out infinite}
.rail-foot__meta{font-family:var(--font-mono);font-size:11px;line-height:1.7;color:var(--grey)}

.topline{
  position:absolute;top:0;left:var(--rail-w);right:0;height:var(--topline-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 clamp(18px,4vw,44px);
  background:rgba(11,30,51,.88);
  border-bottom:1px solid var(--grid)
}
.topline__ticker{display:flex;align-items:center;gap:14px;min-width:0}
.topline__tag{flex:0 0 auto;padding:3px 7px;background:var(--orange);color:var(--ink-900);font-family:var(--font-mono);font-size:10px;letter-spacing:.2em}
.topline__roll{position:relative;display:block;width:min(52vw,460px);height:20px;overflow:hidden}
.topline__roll span{position:absolute;inset:0;display:flex;align-items:center;font-size:12.5px;letter-spacing:.04em;color:var(--grey);opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.topline__roll span.is-active{opacity:1;transform:translateY(0)}
.topline__right{display:flex;align-items:center;gap:16px}
.topline__clock{font-family:var(--font-mono);font-style:italic;font-variant-numeric:tabular-nums;font-size:15px;letter-spacing:.1em;color:var(--cyan)}

/* ---------- footer ---------- */
.site-footer{
  position:relative;margin-top:clamp(64px,9vw,140px);
  border-top:1px solid var(--grid);
  background:
    repeating-linear-gradient(90deg,rgba(31,78,95,.28) 0 1px,transparent 1px 72px),
    linear-gradient(180deg,rgba(18,42,68,.62),rgba(11,30,51,1) 62%)
}
.site-footer::before{content:"";position:absolute;top:-1px;left:0;width:132px;height:2px;background:var(--orange)}
.footer__frame{max-width:var(--maxw);margin:0 auto;padding:clamp(36px,5vw,64px) clamp(18px,4vw,44px) 30px;display:grid;gap:36px;grid-template-columns:1.1fr 1fr 1.4fr}
.footer__col{display:flex;flex-direction:column;gap:12px}
.footer__glyph{font-family:var(--font-display);font-style:italic;font-size:40px;line-height:.9;color:var(--orange)}
.footer__brandname{font-family:var(--font-serif);font-weight:600;font-size:19px;letter-spacing:.22em;color:var(--white)}
.footer__tagline{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;color:var(--grey)}
.footer__stamp{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--cyan)}
.footer__dot{width:6px;height:6px;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:pulse-dot 1.9s ease-in-out infinite}
.footer__label{margin:0;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.24em;color:#5C7C91}
.footer__nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.footer__nav a{font-size:14px;color:var(--grey);border-bottom:1px solid transparent;padding-bottom:2px;transition:color .18s ease,border-color .18s ease}
.footer__nav a:hover{color:var(--cyan);border-bottom-color:var(--cyan)}
.footer__links{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;color:var(--grid)}
.footer__links a{color:var(--grey)}
.footer__links a:hover{color:var(--cyan)}
.footer__list{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:13.5px}
.footer__list dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:#5C7C91;white-space:nowrap}
.footer__list dd{color:var(--white);overflow-wrap:anywhere}
.footer__note{font-size:12.5px;line-height:1.8;color:var(--grey)}
.footer__base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;max-width:var(--maxw);margin:0 auto;padding:16px clamp(18px,4vw,44px) 26px;border-top:1px solid var(--grid);font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--grey)}
.footer__copy{color:var(--grey)}
.footer__legal{color:#5C7C91}

/* ---------- responsive ---------- */
@media (max-width:1023px){
  body{padding-left:0;padding-top:var(--bar-h)}
  .site-header{inset:0 0 auto 0;pointer-events:auto}
  .rail{
    position:relative;top:auto;left:auto;bottom:auto;
    width:100%;height:var(--bar-h);flex-direction:row;align-items:center;justify-content:space-between;
    gap:12px;padding:0 16px;overflow:visible;
    border-right:0;border-bottom:1px solid var(--grid);
    background:rgba(9,24,41,.96)
  }
  .rail::after{display:none}
  .brand{display:flex;align-items:center;gap:10px;padding:0;border-bottom:0}
  .brand__glyph{font-size:24px}
  .brand__name{margin:0;font-size:14px;letter-spacing:.2em}
  .brand__sub{margin:0;font-size:9.5px}
  .nav-toggle{display:inline-flex}
  .rail-foot{display:none}
  .topline{display:none}
  .rail-nav{
    position:absolute;top:var(--bar-h);left:0;right:0;
    max-height:calc(100vh - var(--bar-h));overflow-y:auto;
    padding:10px 16px 20px;
    background:#0A1B2E;border-bottom:1px solid var(--grid);
    box-shadow:0 28px 55px -30px rgba(0,0,0,.95);
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);
    transition:opacity .22s ease,transform .22s ease,visibility .22s
  }
  .rail-nav[data-open]{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .rail-nav__list{gap:0}
  .rail-nav__link{padding:15px 12px;font-size:15.5px;border-top:1px solid rgba(31,78,95,.55)}
  .rail-nav__list li:first-child .rail-nav__link{border-top:0}
  .rail-nav__extra{display:flex;flex-direction:column;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--grid)}
  .footer__frame{grid-template-columns:1fr 1fr}
  .footer__col--meta{grid-column:1 / -1}
}
@media (max-width:900px){
  .grid--2,.grid--3,.grid--aside{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  body{font-size:15px}
  .brand__sub{display:none}
  .footer__frame{grid-template-columns:1fr;gap:28px}
  .footer__list{grid-template-columns:1fr;gap:2px 0}
  .footer__list dt{margin-top:10px}
  .footer__base{flex-direction:column;align-items:flex-start}
  .topline__roll{width:44vw}
}
@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}
  .topline__roll span{transform:none}
}