*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol,li{margin:0;padding:0}
ul,ol{list-style:none}
img,svg,video{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit;background:none;border:none}
a{color:inherit;text-decoration:none}
:root{
  --c-bg:#0A1A3B;
  --c-bg-alt:#112A54;
  --c-accent:#FF6B1A;
  --c-cyan:#00E5FF;
  --c-warn:#FF2E63;
  --c-text:#F5F2EB;
  --c-text-subtle:#B0C4DE;
  --c-accent-soft:rgba(255,107,26,0.15);
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono","Cascadia Code",Consolas,"Courier New",monospace;
  --container-max:1440px;
  --container-gutter:clamp(1rem,3vw,2rem);
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:24px;
  --radius-pill:999px;
  --ease:cubic-bezier(0.2,0.8,0.2,1)
}
body{
  font-family:var(--font-sans);
  background:
    radial-gradient(ellipse at 15% 0%,rgba(17,42,84,0.55) 0%,transparent 55%),
    var(--c-bg);
  color:var(--c-text);
  line-height:1.7;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility
}
main{display:block;min-height:60vh}
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-gutter)}
.section-wrap{padding-block:clamp(2.5rem,6vw,5rem)}
.grid-editorial{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:linear-gradient(180deg,rgba(10,26,59,0.98) 0%,rgba(15,32,66,0.96) 100%);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(176,196,222,0.1);
  box-shadow:0 8px 32px rgba(0,0,0,0.18)
}
.read-progress{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:3px;
  z-index:200;
  background:rgba(176,196,222,0.12);
  pointer-events:none
}
.read-progress::after{
  content:"";
  display:block;
  width:var(--progress,0%);
  height:100%;
  background:linear-gradient(90deg,var(--c-cyan) 0%,var(--c-accent) 100%);
  box-shadow:0 0 10px rgba(0,229,255,0.45)
}
.skip-link{
  position:fixed;
  top:-100px;
  left:clamp(1rem,3vw,2rem);
  z-index:300;
  background:var(--c-accent);
  color:#fff;
  font-weight:700;
  font-size:0.9rem;
  padding:0.7rem 1.4rem;
  border-radius:var(--radius-pill);
  box-shadow:0 6px 20px rgba(255,107,26,0.4);
  transition:top 0.25s var(--ease)
}
.skip-link:focus-visible{top:clamp(1rem,3vw,2rem)}
.header-top{border-bottom:1px solid rgba(176,196,222,0.08);background:linear-gradient(90deg,rgba(255,107,26,0.07) 0%,transparent 60%)}
.header-top-inner{min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.header-bottom{background:rgba(17,42,84,0.35)}
.header-bottom-inner{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:nowrap}
.brand-logo{display:inline-flex;align-items:center;gap:0.65rem;flex-shrink:0}
.brand-mark{
  position:relative;
  display:inline-block;
  width:26px;
  height:26px;
  border-radius:8px;
  background:linear-gradient(135deg,#FF8F4A 0%,var(--c-accent) 60%,#E85500 100%);
  box-shadow:0 4px 14px rgba(255,107,26,0.4);
  flex-shrink:0
}
.brand-mark::after{
  content:"";
  position:absolute;
  top:4px;
  right:4px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--c-cyan);
  box-shadow:0 0 10px rgba(0,229,255,0.8)
}
.brand-name{font-size:1.35rem;font-weight:900;letter-spacing:0.02em;white-space:nowrap}
.header-tagline{font-size:0.8rem;color:var(--c-text-subtle);letter-spacing:0.12em;display:inline-flex;align-items:center;white-space:nowrap}
.header-tagline::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--c-cyan);
  box-shadow:0 0 8px rgba(0,229,255,0.6);
  margin-right:0.6rem;
  animation:ping 2.4s ease-out infinite
}
@keyframes ping{
  0%{box-shadow:0 0 0 0 rgba(0,229,255,0.35)}
  70%{box-shadow:0 0 0 7px rgba(0,229,255,0)}
  100%{box-shadow:0 0 0 0 rgba(0,229,255,0)}
}
.main-nav{display:block;overflow-x:auto;scrollbar-width:none}
.main-nav::-webkit-scrollbar{display:none}
.nav-list{display:flex;align-items:center;gap:0.4rem;min-width:max-content}
.nav-link{
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.45rem 1.15rem;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  font-size:0.92rem;
  font-weight:600;
  color:var(--c-text-subtle);
  white-space:nowrap;
  transition:background 0.2s var(--ease),color 0.2s var(--ease),border-color 0.2s var(--ease),box-shadow 0.2s var(--ease)
}
.nav-link:hover{color:var(--c-text);background:var(--c-accent-soft);border-color:rgba(255,107,26,0.3)}
.nav-link[aria-current="page"]{
  color:#fff;
  background:linear-gradient(135deg,var(--c-accent) 0%,#FF8F4A 100%);
  border-color:transparent;
  box-shadow:0 4px 18px rgba(255,107,26,0.4)
}
.nav-toggle{
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  padding:10px;
  border-radius:12px;
  border:1px solid rgba(176,196,222,0.2);
  cursor:pointer;
  flex-shrink:0;
  transition:border-color 0.2s var(--ease)
}
.nav-toggle:hover{border-color:rgba(255,107,26,0.4)}
.nav-toggle-line{display:block;width:100%;height:2px;border-radius:2px;background:var(--c-text);transition:transform 0.25s var(--ease),opacity 0.2s var(--ease)}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.site-footer{
  background:
    radial-gradient(ellipse at 15% 10%,rgba(0,229,255,0.08) 0%,transparent 50%),
    radial-gradient(ellipse at 85% 90%,rgba(255,107,26,0.06) 0%,transparent 45%),
    linear-gradient(180deg,#0D2149 0%,#060F22 100%);
  border-top:1px solid rgba(176,196,222,0.08)
}
.footer-main{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,0.8fr);
  gap:clamp(1.5rem,4vw,3rem);
  padding-block:clamp(2rem,5vw,3.5rem) clamp(1.5rem,4vw,2.5rem)
}
.footer-brand{display:flex;flex-direction:column;gap:0.9rem;align-items:flex-start}
.site-footer .brand-mark{width:32px;height:32px}
.site-footer .brand-name{font-size:1.5rem}
.footer-tagline{color:var(--c-text-subtle);font-size:0.85rem;letter-spacing:0.1em}
.footer-trust{
  color:var(--c-text-subtle);
  font-size:0.8rem;
  line-height:1.6;
  opacity:0.8;
  border-left:3px solid var(--c-accent);
  padding-left:1rem;
  max-width:36ch
}
.footer-col{display:flex;flex-direction:column;gap:0.8rem}
.footer-title{
  font-family:var(--font-mono);
  font-size:0.75rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--c-cyan)
}
.footer-list{display:flex;flex-direction:column;gap:0.35rem}
.footer-list li{color:var(--c-text-subtle);font-size:0.88rem;line-height:1.55}
.footer-links a{color:var(--c-text-subtle);font-size:0.88rem;transition:color 0.2s var(--ease)}
.footer-links a:hover{color:var(--c-accent)}
.footer-hours{font-size:0.76rem;line-height:1.6;color:var(--c-text-subtle);opacity:0.65;margin-top:0.25rem;max-width:34ch}
.footer-bottom{border-top:1px solid rgba(176,196,222,0.08);padding-block:1.1rem}
.footer-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-copy{color:var(--c-accent);font-size:0.85rem;font-weight:600}
.footer-icp{color:var(--c-text-subtle);font-size:0.75rem;opacity:0.7}

.btn-primary,.btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.5rem;
  min-height:44px;
  padding:0.7rem 1.8rem;
  border-radius:var(--radius-pill);
  font-size:0.95rem;
  font-weight:700;
  line-height:1.2;
  cursor:pointer;
  transition:transform 0.2s var(--ease),box-shadow 0.2s var(--ease),background 0.2s var(--ease),border-color 0.2s var(--ease)
}
.btn-primary{
  background:linear-gradient(135deg,var(--c-accent) 0%,#FF8F4A 100%);
  color:#fff;
  box-shadow:0 6px 20px rgba(255,107,26,0.35)
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(255,107,26,0.45)}
.btn-outline{border:1px solid rgba(176,196,222,0.35);color:var(--c-text)}
.btn-outline:hover{border-color:var(--c-accent);color:var(--c-accent);background:rgba(255,107,26,0.08)}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  font-family:var(--font-mono);
  font-size:0.75rem;
  letter-spacing:0.15em;
  color:var(--c-cyan);
  text-transform:uppercase;
  padding:0.3rem 0.85rem;
  border:1px solid rgba(0,229,255,0.25);
  border-radius:var(--radius-pill);
  margin-bottom:1rem
}
.section-title{font-size:clamp(1.8rem,4vw,3rem);font-weight:900;line-height:1.15;letter-spacing:-0.01em;color:var(--c-text)}
.side-note{
  writing-mode:vertical-rl;
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.3em;
  color:var(--c-text-subtle);
  border-left:1px solid rgba(176,196,222,0.2);
  padding-left:0.75rem;
  white-space:nowrap;
  text-transform:uppercase
}
.data-tag{
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.3rem 0.9rem;
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:0.8rem;
  background:rgba(0,229,255,0.08);
  border:1px solid rgba(0,229,255,0.2);
  color:var(--c-cyan)
}

.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.stat-card{
  position:relative;
  background:linear-gradient(135deg,var(--c-bg-alt) 0%,rgba(17,42,84,0.6) 100%);
  border:1px solid rgba(176,196,222,0.12);
  border-radius:var(--radius-lg);
  padding:1.4rem 1.5rem;
  overflow:hidden;
  transition:border-color 0.2s var(--ease),transform 0.2s var(--ease)
}
.stat-card:hover{border-color:rgba(255,107,26,0.35);transform:translateY(-2px)}
.stat-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--c-accent),#FFB347);
  border-radius:0 3px 3px 0
}
.stat-label{font-size:0.78rem;color:var(--c-text-subtle);letter-spacing:0.08em;margin-bottom:0.5rem}
.stat-value{font-family:var(--font-mono);font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:var(--c-text);line-height:1.2}
.stat-delta{font-family:var(--font-mono);font-size:0.78rem;color:var(--c-cyan);margin-top:0.35rem;display:inline-block}

.compare-panel{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:1rem;
  background:linear-gradient(135deg,var(--c-bg-alt) 0%,rgba(17,42,84,0.6) 100%);
  border:1px solid rgba(176,196,222,0.12);
  border-radius:var(--radius-lg);
  padding:clamp(1rem,3vw,2rem);
  margin-block:1.25rem
}
.compare-team-box{padding-block:0.75rem}
.compare-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;padding-inline:1rem}
.score-pill{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:clamp(1.5rem,4vw,2.25rem);
  font-weight:800;
  padding:0.4rem 1.25rem;
  border-radius:var(--radius-lg);
  background:var(--c-accent-soft);
  border:1px solid rgba(255,107,26,0.35);
  color:var(--c-accent);
  white-space:nowrap
}

.data-bar{
  display:flex;
  gap:3px;
  height:10px;
  border-radius:var(--radius-pill);
  background:rgba(176,196,222,0.12);
  overflow:hidden
}
.data-bar>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--c-accent),#FFB347)}
.data-bar>span.a{background:linear-gradient(90deg,var(--c-cyan),#66F0FF)}
.data-bar>span.b{background:linear-gradient(90deg,var(--c-accent),#FFB347)}

.table-wrap{
  overflow-x:auto;
  border-radius:var(--radius-lg);
  border:1px solid rgba(176,196,222,0.12);
  background:rgba(17,42,84,0.35)
}
.table-wrap table{width:100%;border-collapse:collapse;min-width:640px}
.table-wrap th,.table-wrap td{padding:0.85rem 1.1rem;text-align:left;font-size:0.92rem;border-bottom:1px solid rgba(176,196,222,0.1)}
.table-wrap th{
  font-family:var(--font-mono);
  font-size:0.75rem;
  letter-spacing:0.12em;
  color:var(--c-cyan);
  background:rgba(17,42,84,0.7);
  white-space:nowrap
}
.table-wrap td{color:var(--c-text-subtle)}
.table-wrap tr:last-child td{border-bottom:none}
.table-wrap tbody tr:hover td{background:rgba(255,107,26,0.05)}

.note-callout{
  position:relative;
  padding:1.25rem 1.5rem 1.25rem 2rem;
  background:rgba(0,229,255,0.06);
  border:1px solid rgba(0,229,255,0.15);
  border-radius:0 var(--radius-md) var(--radius-md) 0;
  color:var(--c-text-subtle);
  font-size:0.9rem;
  line-height:1.7
}
.note-callout::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:var(--c-cyan);
  border-radius:0 2px 2px 0
}

.img-media{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:linear-gradient(135deg,rgba(17,42,84,0.5) 0%,rgba(10,26,59,0.7) 100%);
  border:1px solid rgba(176,196,222,0.12)
}
.img-media::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(45deg,rgba(176,196,222,0.05) 25%,transparent 25%),linear-gradient(-45deg,rgba(176,196,222,0.05) 25%,transparent 25%);
  background-size:32px 32px;
  background-position:0 0,16px 16px
}
.img-media::after{
  content:attr(data-caption);
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:2.5rem 1rem 0.75rem;
  background:linear-gradient(transparent,rgba(10,26,59,0.85));
  color:var(--c-text-subtle);
  font-size:0.8rem;
  letter-spacing:0.05em
}

.spy-wrap{
  display:flex;
  flex-direction:column;
  gap:0.35rem;
  padding:1.25rem;
  background:var(--c-bg-alt);
  border:1px solid rgba(176,196,222,0.12);
  border-radius:var(--radius-lg);
  position:sticky;
  top:8rem
}
.spy-link{
  display:block;
  padding:0.6rem 1rem;
  border-radius:var(--radius-md);
  border-left:2px solid rgba(176,196,222,0.2);
  color:var(--c-text-subtle);
  font-size:0.9rem;
  transition:background 0.2s var(--ease),color 0.2s var(--ease),border-left-color 0.2s var(--ease)
}
.spy-link:hover{color:var(--c-text);background:var(--c-accent-soft)}
.spy-link.is-active{
  color:var(--c-text);
  border-left-color:var(--c-cyan);
  background:rgba(0,229,255,0.08)
}

.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.5rem;
  padding-block:1rem 0;
  font-size:0.85rem;
  color:var(--c-text-subtle)
}
.breadcrumb a:hover{color:var(--c-accent)}
.breadcrumb .sep{opacity:0.5}

.privacy-block{
  max-width:72ch;
  margin-inline:auto;
  padding-block:clamp(2rem,5vw,4rem);
  color:var(--c-text-subtle);
  line-height:1.9
}
.privacy-block h1{font-size:clamp(1.8rem,4vw,2.6rem);color:var(--c-text);margin-bottom:1rem}
.privacy-block h2{font-size:1.2rem;color:var(--c-text);margin-block:2rem 0.75rem;padding-top:0.5rem;border-top:1px solid rgba(176,196,222,0.15)}
.privacy-block p{margin-bottom:1rem}
.privacy-block a{color:var(--c-cyan)}
.privacy-block a:hover{color:var(--c-accent);text-decoration:underline}

:focus-visible{outline:3px solid var(--c-cyan);outline-offset:3px;border-radius:6px}

@media (max-width:991px){
  .nav-toggle{display:inline-flex}
  .main-nav{order:3;flex-basis:100%;display:none}
  .main-nav[data-open]{display:block}
  .header-bottom-inner{flex-wrap:wrap}
  .nav-list{flex-direction:column;gap:0;min-width:0;padding-block:0.5rem}
  .nav-item+.nav-item{border-top:1px solid rgba(176,196,222,0.08)}
  .nav-link{width:100%;padding:0.85rem 1.1rem;border-radius:var(--radius-md);border-color:transparent}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .grid-editorial{grid-template-columns:minmax(0,1fr)}
  .spy-wrap{position:static;top:auto}
  .footer-main{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}

@media (max-width:767px){
  .compare-panel{grid-template-columns:1fr}
  .compare-mid{flex-direction:row}
  .footer-main{grid-template-columns:1fr}
  .footer-brand{grid-column:auto}
  .footer-bottom-inner{flex-direction:column;align-items:flex-start}
}

@media (max-width:575px){
  .header-tagline{display:none}
  .brand-name{font-size:1.15rem}
  .stat-grid{gap:0.75rem}
  .stat-card{padding:1rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}
}