/* ==========================================================================
   JZ主赛场 · 共享样式表 /assets/site.css
   基调：深夜赛场绿转播底 + 记分牌橙发光层 + 奶油纸面数据面板
   ========================================================================== */

/* ---------- 0. 设计令牌 ---------- */
:root{
  --pitch:#0B1F19;
  --deep:#06120E;
  --cream:#F2EAD9;
  --orange:#FF6A1F;
  --blue:#3C86F5;
  --blue-ink:#1D5FCB;
  --lime:#C6F24E;
  --brown:#1A1310;
  --grey:#8FA39B;
  --red:#E5443C;
  --ivory:#FFF7E8;

  --line:rgba(143,163,155,.26);
  --line-strong:rgba(143,163,155,.5);
  --glow-orange:0 0 12px rgba(255,106,31,.45);
  --glow-lime:0 0 10px rgba(198,242,78,.45);
  --glow-blue:0 0 10px rgba(60,134,245,.4);

  --rail-w:220px;
  --shell:clamp(18px,4vw,56px);

  --font-display:"Oswald","Barlow Condensed","Arial Narrow","HarmonyOS Sans SC","PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  --font-body:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --font-mono:ui-monospace,"JetBrains Mono","SFMono-Regular",Menlo,Consolas,"Courier New",monospace;

  --ease:cubic-bezier(.22,.68,.32,1);
  --cut:18px;
}

/* ---------- 1. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
img,svg,video,canvas{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
summary{list-style:none}
summary::-webkit-details-marker{display:none}

/* ---------- 2. 页面底 ---------- */
html{scroll-behavior:smooth}
body{
  min-height:100vh;
  background-color:var(--pitch);
  background-image:
    radial-gradient(1200px 620px at 80% -10%,rgba(60,134,245,.15),transparent 62%),
    radial-gradient(900px 520px at 2% 104%,rgba(198,242,78,.08),transparent 60%),
    repeating-linear-gradient(114deg,rgba(143,163,155,.045) 0 1px,transparent 1px 68px);
  color:var(--ivory);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.75;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}

/* ---------- 3. 排版 ---------- */
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.02em;
  margin:0 0 .45em;
}
h1{font-size:clamp(32px,4.6vw,58px)}
h2{font-size:clamp(24px,3.4vw,40px)}
h3{font-size:22px}
h4{font-size:18px}
.num,.stat__value,[data-count]{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
}
.eyebrow{
  display:inline-block;
  font-size:12px;
  letter-spacing:.16em;
  color:var(--lime);
  margin-bottom:10px;
}
.prose{max-width:36em}
.prose p{margin:0 0 1.05em}
.prose p:last-child{margin-bottom:0}
.muted{color:var(--grey)}
.small{font-size:13px;letter-spacing:.04em}

/* ---------- 4. 焦点与跳转 ---------- */
:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:2px;
  border-radius:2px;
}
.skip-link{
  position:fixed;
  top:-72px;
  left:12px;
  z-index:200;
  padding:11px 18px;
  background:var(--lime);
  color:var(--deep);
  font-size:14px;
  font-weight:700;
  letter-spacing:.06em;
  transition:top .15s var(--ease);
}
.skip-link:focus{top:12px}

/* ---------- 5. 容器与网格 ---------- */
.wrap{
  width:100%;
  max-width:1180px;
  margin-inline:auto;
  padding-inline:var(--shell);
}
.section{padding:clamp(42px,5.6vw,86px) 0;position:relative}
.section--tight{padding:clamp(28px,3.4vw,52px) 0}
.section--rule{border-top:2px solid rgba(60,134,245,.42)}
.section--cream{
  background:var(--cream);
  color:var(--brown);
}
.section--cream .eyebrow{color:#B4440F}
.section--cream .muted{color:#6B5B4E}
.section--cream a{color:var(--blue-ink);text-decoration:underline;text-underline-offset:3px}
.section--cream a:hover{color:#0F3E8C}

.grid{display:grid;gap:20px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

/* ---------- 6. 按钮 ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 18px;
  font-size:14px;
  letter-spacing:.07em;
  border:1px solid transparent;
  clip-path:polygon(0 0,100% 0,100% 70%,91% 100%,0 100%);
  transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease);
}
.btn--primary{
  background:var(--orange);
  color:var(--deep);
  font-weight:700;
  box-shadow:var(--glow-orange);
}
.btn--primary:hover,.btn--primary:focus-visible{
  background:var(--lime);
  box-shadow:var(--glow-lime);
  transform:translateY(-2px);
}
.btn--ghost{
  background:transparent;
  color:var(--ivory);
  border-color:var(--line-strong);
}
.btn--ghost:hover,.btn--ghost:focus-visible{
  border-color:var(--blue);
  color:var(--blue);
  box-shadow:var(--glow-blue);
  transform:translateY(-2px);
}
.btn--block{width:100%}

/* ---------- 7. 面包屑 ---------- */
.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 20px;
  font-size:12px;
  letter-spacing:.12em;
  color:var(--grey);
}
.breadcrumb li{display:inline-flex;align-items:center;gap:8px}
.breadcrumb li + li::before{content:"/";color:var(--line-strong)}
.breadcrumb a{color:var(--grey);transition:color .18s var(--ease)}
.breadcrumb a:hover{color:var(--lime)}
.breadcrumb [aria-current="page"]{color:var(--ivory)}

/* ---------- 8. 卡片与面板 ---------- */
.card{
  position:relative;
  background:linear-gradient(180deg,rgba(255,247,232,.045),rgba(255,247,232,.012));
  border:1px solid var(--line);
  padding:20px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%);
  transition:transform .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.card--hoverable:hover,.card--hoverable:focus-within{
  transform:translateY(-4px);
  border-color:rgba(198,242,78,.5);
  box-shadow:0 12px 32px rgba(0,0,0,.45);
}
.card__title{
  font-family:var(--font-display);
  font-size:20px;
  letter-spacing:-.01em;
  margin:0 0 6px;
}
.card__meta{
  font-size:12px;
  letter-spacing:.12em;
  color:var(--grey);
}
.panel-cream{
  background:var(--cream);
  color:var(--brown);
  padding:clamp(20px,3vw,34px);
  border-radius:2px;
}
.panel-cream h2,.panel-cream h3{color:var(--brown)}
.panel-cream a{color:var(--blue-ink);text-decoration:underline;text-underline-offset:3px}
.panel-cream a:hover{color:#0F3E8C}

/* ---------- 9. 数据元件 ---------- */
.stat{display:block}
.stat__value{
  display:block;
  font-size:clamp(48px,6vw,112px);
  line-height:.92;
  color:var(--orange);
  text-shadow:0 0 26px rgba(255,106,31,.32);
}
.stat__label{
  display:block;
  margin-top:8px;
  font-size:12px;
  letter-spacing:.14em;
  color:var(--grey);
}
.tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 10px;
  font-size:11.5px;
  letter-spacing:.1em;
  border-radius:999px;
  background:var(--lime);
  color:var(--deep);
}
.tag--orange{background:var(--orange);color:var(--deep)}
.tag--outline{background:transparent;color:var(--grey);border:1px solid var(--line)}
.dot{
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--grey);
  flex:0 0 auto;
}
.dot--live{
  background:var(--lime);
  animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(198,242,78,.55)}
  70%{box-shadow:0 0 0 9px rgba(198,242,78,0)}
  100%{box-shadow:0 0 0 0 rgba(198,242,78,0)}
}

/* ---------- 10. 表格 ---------- */
.table-scroll{
  position:relative;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--line);
  background:linear-gradient(90deg,rgba(60,134,245,.06),transparent 30%);
}
.data-table{
  width:100%;
  min-width:520px;
  font-size:14.5px;
}
.data-table th{
  position:sticky;
  top:0;
  text-align:left;
  padding:11px 13px;
  font-family:var(--font-display);
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--grey);
  background:#08201A;
  border-bottom:1px solid var(--line-strong);
  white-space:nowrap;
}
.data-table td{
  padding:11px 13px;
  border-bottom:1px solid var(--line);
  color:var(--ivory);
  vertical-align:top;
}
.data-table th:first-child,
.data-table td:first-child{
  position:sticky;
  left:0;
  z-index:1;
  background:#0A1B15;
}
.data-table tbody tr:hover td{background:rgba(198,242,78,.06)}
.data-table tbody tr:hover td:first-child{background:#12261F}

/* ---------- 11. 折叠 ---------- */
details.fold{
  position:relative;
  border:1px solid var(--line);
  background:rgba(255,247,232,.028);
  margin-bottom:12px;
}
details.fold summary{
  position:relative;
  display:block;
  padding:15px 18px 15px 20px;
  cursor:pointer;
  font-size:16px;
  color:var(--ivory);
  transition:color .18s var(--ease),background .18s var(--ease);
}
details.fold summary::before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  bottom:9px;
  width:3px;
  background:var(--orange);
  transform:scaleY(0);
  transform-origin:top;
  transition:transform .2s var(--ease);
}
details.fold summary:hover{color:var(--lime);background:rgba(198,242,78,.05)}
details.fold[open] summary{
  color:var(--lime);
  border-bottom:1px solid var(--line);
}
details.fold[open] summary::before{transform:scaleY(1)}
details.fold[open] summary::after{
  content:"−";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--orange);
  font-family:var(--font-mono);
}
details.fold summary::after{
  content:"+";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--grey);
  font-family:var(--font-mono);
}
details.fold[open] summary::after{content:"−"}
.fold__body{padding:16px 18px 18px;font-size:16px;color:var(--grey)}
.fold__body p{margin:0 0 .9em}
.fold__body p:last-child{margin-bottom:0}

/* ---------- 12. 媒体容器 ---------- */
.media{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
  background-color:#08170F;
  border:1px solid var(--line);
}
.media--tall{aspect-ratio:4 / 5}
.media--wide{aspect-ratio:21 / 9}
.media--square{aspect-ratio:1 / 1}
.media--placeholder{
  background-image:repeating-linear-gradient(135deg,rgba(143,163,155,.11) 0 6px,transparent 6px 15px);
}
.media > img,
.media > svg,
.media > picture > img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.media--scrim::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:60%;
  background:linear-gradient(180deg,transparent,rgba(6,18,14,.86));
  pointer-events:none;
}
.media__caption{
  position:absolute;
  left:14px;
  right:14px;
  bottom:12px;
  z-index:1;
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--ivory);
}

/* ---------- 13. 头部 / 侧边轨道 ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:60;
  width:100%;
  background:var(--deep);
  border-bottom:1px solid var(--line);
}
.site-header::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:1;
  background:rgba(255,106,31,.22);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s linear;
}
.site-header[data-open]::after{opacity:1;pointer-events:auto}

.topbar{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  min-height:58px;
}
.topbar__brand{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ivory);
  font-family:var(--font-display);
  font-size:16px;
  letter-spacing:.02em;
}
.topbar__mark{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  background:var(--orange);
  color:var(--deep);
  font-size:13px;
  font-weight:700;
  clip-path:polygon(0 0,100% 0,100% 68%,74% 100%,0 100%);
  box-shadow:var(--glow-orange);
}
.topbar__name{white-space:nowrap}
.topbar__cta{
  margin-left:auto;
  padding:7px 12px;
  font-size:12.5px;
  letter-spacing:.1em;
  color:var(--lime);
  border:1px solid rgba(198,242,78,.42);
  clip-path:polygon(0 0,100% 0,100% 68%,86% 100%,0 100%);
  transition:background .18s var(--ease),color .18s var(--ease);
}
.topbar__cta:hover{background:var(--lime);color:var(--deep)}

.nav-toggle{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  color:var(--ivory);
  font-size:13px;
  letter-spacing:.1em;
  border:1px solid var(--line-strong);
  clip-path:polygon(0 0,100% 0,100% 66%,84% 100%,0 100%);
  transition:color .18s var(--ease),border-color .18s var(--ease),background .18s var(--ease);
}
.nav-toggle:hover{color:var(--lime);border-color:var(--lime)}
.nav-toggle__glyph{display:grid;gap:4px;width:16px}
.nav-toggle__glyph i{display:block;height:2px;background:currentColor;transition:transform .18s var(--ease)}
.nav-toggle__glyph i:nth-child(2){width:70%}
.nav-toggle[aria-expanded="true"]{color:var(--deep);background:var(--orange);border-color:var(--orange);box-shadow:var(--glow-orange)}
.nav-toggle[aria-expanded="true"] .nav-toggle__glyph i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__glyph i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__glyph i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.rail{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  gap:18px;
  width:min(86vw,330px);
  padding:20px 18px 26px;
  background:var(--deep);
  border-right:1px solid var(--line);
  overflow-y:auto;
  overscroll-behavior:contain;
  transform:translateX(-104%) rotate(-1deg);
  transform-origin:left top;
  visibility:hidden;
  transition:transform .18s var(--ease),visibility .18s linear;
}
.rail[data-open]{transform:none;visibility:visible}

.rail__head{flex:0 0 auto}
.rail__nav{flex:1 1 auto;min-height:0}
.rail__axis{flex:0 0 auto}
.rail__foot{flex:0 0 auto}

.brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:var(--ivory);
}
.brand__mark{
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  background:var(--orange);
  color:var(--deep);
  font-family:var(--font-display);
  font-size:20px;
  font-weight:700;
  letter-spacing:0;
  clip-path:polygon(0 0,100% 0,100% 70%,76% 100%,0 100%);
  box-shadow:var(--glow-orange);
}
.brand__text{display:block;min-width:0}
.brand__name{
  display:block;
  font-family:var(--font-display);
  font-size:19px;
  font-weight:700;
  letter-spacing:.01em;
  color:var(--ivory);
}
.brand__tag{
  display:block;
  font-size:11.5px;
  letter-spacing:.08em;
  color:var(--grey);
}
.rail__kicker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:11px;
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--lime);
}
.rail__label{
  font-size:10.5px;
  letter-spacing:.2em;
  color:var(--grey);
  margin:0 0 8px;
}
.nav-list{display:grid;gap:2px}
.nav-link{
  position:relative;
  display:flex;
  align-items:baseline;
  gap:9px;
  padding:9px 10px 9px 12px;
  color:var(--ivory);
  font-size:15px;
  letter-spacing:.02em;
  border-left:2px solid transparent;
  transition:color .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease);
}
.nav-link__idx{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--grey);
  transition:color .18s var(--ease);
}
.nav-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:1px;
  height:1px;
  background:var(--lime);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .22s var(--ease);
}
.nav-link:hover{color:var(--lime);background:rgba(198,242,78,.06)}
.nav-link:hover .nav-link__idx{color:var(--lime)}
.nav-link:hover::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{
  color:var(--orange);
  border-left-color:var(--orange);
  background:rgba(255,106,31,.09);
}
.nav-link[aria-current="page"] .nav-link__idx{color:var(--orange)}
.nav-link[aria-current="page"]::after{background:var(--orange);transform:scaleX(1)}

.rail__axis{margin-top:4px}
.axis{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:14px;
}
.axis__input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.axis__pill{
  cursor:pointer;
  padding:4px 10px;
  font-size:12px;
  letter-spacing:.08em;
  color:var(--grey);
  border:1px solid var(--line);
  border-radius:999px;
  transition:color .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.axis__pill:hover{color:var(--ivory);border-color:var(--line-strong)}
.axis__input:checked + .axis__pill{
  color:var(--deep);
  background:var(--lime);
  border-color:var(--lime);
  box-shadow:var(--glow-lime);
}
.axis__input:focus-visible + .axis__pill{
  outline:2px solid var(--lime);
  outline-offset:2px;
}
.rail__status{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  font-size:11.5px;
  letter-spacing:.12em;
  color:var(--grey);
}

/* ---------- 14. 页脚 ---------- */
.site-footer{
  position:relative;
  background:var(--deep);
  border-top:1px solid var(--line);
  padding:clamp(38px,5vw,64px) var(--shell) 26px;
}
.site-footer::before{
  content:"";
  position:absolute;
  top:-1px;
  left:var(--shell);
  width:min(340px,42%);
  height:2px;
  background:linear-gradient(90deg,var(--orange),rgba(255,106,31,0));
}
.footer__grid{
  max-width:1180px;
  margin-inline:auto;
  display:grid;
  grid-template-columns:1.5fr repeat(3,minmax(110px,1fr));
  gap:36px 30px;
}
.footer__brand .brand--footer .brand__mark{flex:0 0 38px;width:38px;height:38px;font-size:17px}
.footer__note{
  margin-top:16px;
  font-size:13.5px;
  line-height:1.7;
  color:var(--grey);
  max-width:26em;
}
.footer__domain{
  margin-top:12px;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.08em;
  color:var(--lime);
}
.footer__title{
  font-family:var(--font-display);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.2em;
  color:var(--orange);
  margin:0 0 14px;
}
.footer__list{display:grid;gap:6px}
.footer__list a{
  position:relative;
  display:inline-block;
  padding:2px 0;
  font-size:14.5px;
  color:var(--grey);
  transition:color .18s var(--ease);
}
.footer__list a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  height:1px;
  width:100%;
  background:var(--lime);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .22s var(--ease);
}
.footer__list a:hover{color:var(--ivory)}
.footer__list a:hover::after{transform:scaleX(1)}

.footer__contact{
  max-width:1180px;
  margin:34px auto 0;
  padding-top:22px;
  border-top:1px dashed var(--line);
}
.footer__label{
  font-size:10.5px;
  letter-spacing:.2em;
  color:var(--grey);
  margin-bottom:12px;
}
.contact-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:center;
}
.copy-btn{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  font-size:13.5px;
  letter-spacing:.03em;
  color:var(--ivory);
  border:1px solid var(--line);
  background:rgba(255,247,232,.03);
  clip-path:polygon(0 0,100% 0,100% 68%,93% 100%,0 100%);
  transition:border-color .18s var(--ease),color .18s var(--ease),box-shadow .18s var(--ease);
}
.copy-btn:hover{border-color:var(--blue);color:var(--blue);box-shadow:var(--glow-blue)}
.copy-btn__icon{color:var(--orange);font-size:13px}
.copy-btn__hint{
  font-size:11px;
  letter-spacing:.1em;
  color:var(--grey);
  padding-left:9px;
  border-left:1px solid var(--line);
}
.copy-btn__hint.is-ok{color:var(--lime)}
.contact-list__addr{
  font-size:13.5px;
  color:var(--grey);
  letter-spacing:.02em;
}
.footer__legal{
  max-width:1180px;
  margin:26px auto 0;
  padding-top:16px;
  border-top:1px solid var(--line);
  display:flex;
  flex-wrap:wrap;
  gap:8px 20px;
  align-items:baseline;
  justify-content:space-between;
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--grey);
}
.footer__legal-main{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.footer__icp{color:var(--ivory)}
.sep{color:var(--line-strong)}
.footer__copy{font-family:var(--font-mono);letter-spacing:.04em}

/* ---------- 15. 显现与数字动画 ---------- */
html.js [data-reveal]{
  opacity:0;
  transform:translateY(14px);
}
html.js [data-reveal].is-visible{
  opacity:1;
  transform:none;
  transition:opacity .5s var(--ease),transform .5s var(--ease);
}

/* ---------- 16. 断点 ---------- */
@media (min-width:1024px){
  body{padding-left:var(--rail-w)}
  .site-header{
    position:fixed;
    top:0;
    left:0;
    width:var(--rail-w);
    height:100vh;
    height:100dvh;
    border-bottom:0;
  }
  .site-header::after{display:none}
  .topbar{display:none}
  .rail{
    position:static;
    width:auto;
    height:100%;
    transform:none;
    visibility:visible;
    transition:none;
    padding:24px 18px 26px;
  }
  .footer__grid{grid-template-columns:1.5fr repeat(3,minmax(110px,1fr))}
}

@media (min-width:1024px) and (max-width:1280px){
  .rail__axis{display:none}
}

@media (max-width:1023px){
  .rail{gap:16px}
  .rail__nav{flex:0 0 auto}
  .brand__mark{flex:0 0 40px;width:40px;height:40px;font-size:18px}
}

@media (max-width:900px){
  .grid--3,.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__grid{grid-template-columns:1fr 1fr;gap:30px 22px}
  .footer__brand{grid-column:1 / -1}
}

@media (max-width:560px){
  body{font-size:16.5px}
  .grid--2,.grid--3,.grid--4{grid-template-columns:minmax(0,1fr)}
  .footer__grid{grid-template-columns:minmax(0,1fr)}
  .footer__legal{flex-direction:column;align-items:flex-start}
  .topbar__cta{display:none}
  .card{padding:17px}
  .section{padding:34px 0}
}

/* ---------- 17. 降低动效 ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  html.js [data-reveal]{opacity:1;transform:none}
  .dot--live{animation:none;box-shadow:0 0 0 3px rgba(198,242,78,.22)}
  .btn:hover,.card--hoverable:hover{transform:none}
  .nav-link:hover::after,.footer__list a:hover::after{transform:scaleX(1)}
}