/* ============================================================
   四喜体育官网 · 共享外壳样式 /assets/site.css
   矿物色体系 · 粗野主义硬阴影 · 侧边轨道导航
   ============================================================ */

/* ---------- 1. reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body,h1,h2,h3,h4,h5,p,ul,ol,li,figure,blockquote,dl,dd{ margin:0; padding:0; }
ul,ol{ list-style:none; }
img,svg,video{ 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; width:100%; }

/* ---------- 2. 变量 ---------- */
:root{
  --cinnabar:#D8332A;
  --indigo:#23386B;
  --bamboo-1:#E7EFE3;
  --bamboo-2:#C9DCC6;
  --cyan:#2FF0C8;
  --gold:#F2B23E;
  --clay:#A65A3A;
  --moss:#6E8B5A;
  --stone:#4A4E52;
  --cream:#F7F3EA;
  --ink:#101726;

  --rail-w:88px;
  --topbar-h:64px;

  --font-num:"Barlow Condensed","DIN Alternate","DIN Condensed",Impact,"Arial Narrow",system-ui,sans-serif;
  --font-sans:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans SC",sans-serif;

  --shadow-hard:6px 6px 0 var(--ink);
  --shadow-hard-sm:3px 3px 0 var(--ink);
  --shadow-hard-clay:6px 6px 0 var(--clay);
  --edge:2px solid var(--ink);
}

/* ---------- 3. 基础排版 ---------- */
body{
  font-family:var(--font-sans);
  font-size:16.5px;
  line-height:1.75;
  color:var(--stone);
  min-height:100vh;
  padding-left:var(--rail-w);
  background-color:var(--bamboo-1);
  background-image:
    repeating-linear-gradient(135deg, rgba(35,56,107,.045) 0 1px, transparent 1px 14px),
    linear-gradient(165deg, #E7EFE3 0%, #DCE7D8 46%, #C9DCC6 100%);
}
h1,h2,h3,h4{ color:var(--ink); font-weight:800; line-height:1.22; letter-spacing:.01em; }
h1{ font-size:clamp(30px,4.2vw,58px); }
h2{ font-size:clamp(24px,2.6vw,34px); }
h3{ font-size:clamp(19px,1.6vw,24px); }
h4{ font-size:17px; }
strong{ color:var(--ink); }
::selection{ background:var(--cinnabar); color:var(--cream); }

:focus-visible{ outline:3px solid var(--cinnabar); outline-offset:3px; border-radius:2px; }
.site-footer :focus-visible,
.rail :focus-visible,
.topbar :focus-visible{ outline-color:var(--gold); }

#main-content{ display:block; }

.visually-hidden{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ---------- 4. 跳过链接 ---------- */
.skip-link{
  position:absolute; top:-120px; left:16px; z-index:120;
  pointer-events:auto;
  padding:11px 18px;
  background:var(--gold); color:var(--ink);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-weight:800; font-size:14px; letter-spacing:.08em;
  transition:top .2s ease;
}
.skip-link:focus{ top:14px; }

/* ---------- 5. 页头外壳 ---------- */
.site-header{
  position:fixed; inset:0; z-index:80;
  pointer-events:none;
}

/* 5.1 移动顶栏（桌面隐藏） */
.topbar{ display:none; }
.topbar__brand{ display:flex; align-items:center; gap:9px; min-height:44px; }
.topbar__live{
  width:9px; height:9px; border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 0 4px rgba(47,240,200,.18);
  flex:0 0 auto;
}
.topbar__mark{ font-size:17px; font-weight:800; letter-spacing:.16em; color:var(--cream); }
.topbar__tag{ font-size:11px; letter-spacing:.16em; color:var(--gold); }

/* 5.2 菜单按钮 */
.nav-toggle{
  display:inline-flex; align-items:center; gap:9px;
  min-height:44px; padding:0 14px;
  background:var(--cinnabar); color:var(--cream);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-size:13px; font-weight:800; letter-spacing:.14em;
  transition:background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.nav-toggle:hover{ box-shadow:5px 5px 0 var(--ink); }
.nav-toggle__icon{ display:flex; flex-direction:column; gap:3px; width:18px; }
.nav-toggle__icon i{ display:block; height:2px; background:currentColor; transition:transform .22s ease, opacity .22s ease; }
.site-header[data-open] .nav-toggle{ background:var(--gold); color:var(--ink); }
.site-header[data-open] .nav-toggle__icon i:nth-child(1){ transform:translateY(5px) rotate(45deg); }
.site-header[data-open] .nav-toggle__icon i:nth-child(2){ opacity:0; }
.site-header[data-open] .nav-toggle__icon i:nth-child(3){ transform:translateY(-5px) rotate(-45deg); }

/* 5.3 遮罩 */
.rail-scrim{
  position:absolute; inset:0;
  background:rgba(16,23,38,.62);
  opacity:0; pointer-events:none;
  transition:opacity .3s ease;
}

/* 5.4 侧边轨道 / 抽屉 */
.rail{
  position:absolute; top:0; left:0; bottom:0; width:var(--rail-w);
  display:flex; flex-direction:column; gap:14px;
  padding:16px 8px 18px;
  background:var(--indigo);
  border-right:3px solid var(--ink);
  box-shadow:6px 0 0 rgba(16,23,38,.16);
  overflow:hidden;
  pointer-events:auto;
}
.rail__progress{
  position:absolute; top:0; right:0; bottom:0; width:5px;
  background:linear-gradient(180deg, var(--cyan) 0%, var(--gold) 60%, var(--cinnabar) 100%);
  transform:scaleY(var(--scroll-progress,0));
  transform-origin:top center;
}
.rail__top{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.rail__brand{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.rail__mark{
  writing-mode:vertical-rl;
  padding:11px 6px;
  background:var(--cinnabar); color:var(--cream);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-size:15px; font-weight:800; letter-spacing:.2em;
}
.rail__tag{
  width:100%; text-align:center;
  font-size:10px; line-height:1.5; letter-spacing:.1em;
  color:rgba(247,243,234,.6);
}
.rail__close{
  display:none; align-items:center; gap:7px;
  min-height:40px; padding:0 12px;
  color:var(--cream);
  border:2px solid rgba(247,243,234,.4); border-radius:2px;
  font-size:13px; font-weight:700; letter-spacing:.1em;
  transition:border-color .18s ease, color .18s ease;
}
.rail__close:hover{ border-color:var(--gold); color:var(--gold); }

.rail__nav{
  flex:1 1 auto; min-height:0;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(247,243,234,.32) transparent;
}
.rail__nav::-webkit-scrollbar{ width:5px; }
.rail__nav::-webkit-scrollbar-thumb{ background:rgba(247,243,234,.32); }
.rail__menu{ display:flex; flex-direction:column; align-items:center; gap:9px; }
.rail__item{ width:100%; display:flex; justify-content:center; }
.rail__link{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  min-width:44px; min-height:44px; padding:9px 5px;
  color:rgba(247,243,234,.78);
  border-radius:2px;
  transition:background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.rail__num{
  font-family:var(--font-num); font-size:11.5px; font-weight:700;
  letter-spacing:.1em; color:var(--gold); opacity:.9;
}
.rail__label{
  writing-mode:vertical-rl;
  font-size:12.5px; font-weight:700; letter-spacing:.12em;
}
.rail__link:hover{ color:var(--cream); background:rgba(247,243,234,.09); }
.rail__link[aria-current="page"]{
  color:var(--cream); background:var(--cinnabar);
  box-shadow:inset 4px 0 0 var(--cyan);
}
.rail__link[aria-current="page"] .rail__num{ color:var(--cream); }

.rail__foot{
  margin-top:auto; padding-top:13px;
  border-top:2px solid rgba(247,243,234,.18);
  display:flex; flex-direction:column; align-items:center; gap:11px;
}
.rail__status{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  font-size:10px; letter-spacing:.14em;
  color:rgba(247,243,234,.72);
}
.rail__status-text{ writing-mode:horizontal-tb; text-align:center; }
.status-dot{
  width:10px; height:10px; border-radius:50%;
  background:var(--cyan); flex:0 0 auto;
  animation:status-pulse 2.4s ease-out infinite;
}
@keyframes status-pulse{
  0%{ box-shadow:0 0 0 0 rgba(47,240,200,.65); }
  70%{ box-shadow:0 0 0 10px rgba(47,240,200,0); }
  100%{ box-shadow:0 0 0 0 rgba(47,240,200,0); }
}
.rail__cta{
  display:block; width:100%; text-align:center;
  padding:10px 4px;
  background:var(--gold); color:var(--ink);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-size:12px; font-weight:800; line-height:1.35; letter-spacing:.08em;
  transition:background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.rail__cta:hover{ background:var(--cinnabar); color:var(--cream); box-shadow:5px 5px 0 var(--ink); }

/* ---------- 6. 页脚 ---------- */
.site-footer{
  position:relative;
  margin-top:72px;
  background:var(--ink);
  color:var(--cream);
  border-top:6px solid var(--cinnabar);
}
@supports (margin-top:1px){ .site-footer{ margin-top:clamp(48px,7vw,88px); } }
.footer-stripe{
  height:10px;
  background:repeating-linear-gradient(90deg,
    var(--cinnabar) 0 28px, var(--gold) 28px 40px,
    var(--cyan) 40px 48px, var(--indigo) 48px 76px);
}
.footer-inner{
  width:100%; max-width:1180px; margin-inline:auto;
  padding:clamp(36px,5vw,60px) 22px 28px;
  display:grid; grid-template-columns:1.05fr 1.7fr;
  gap:36px 48px;
}
.footer-brand__mark{
  font-size:26px; font-weight:800; letter-spacing:.18em; color:var(--cream);
  display:inline-block;
  padding-bottom:8px;
  border-bottom:4px solid var(--cinnabar);
}
.footer-brand__tag{
  margin-top:14px;
  font-size:13px; font-weight:700; letter-spacing:.2em; color:var(--gold);
}
.footer-brand__desc{
  margin-top:12px; max-width:34ch;
  font-size:14.5px; line-height:1.8; color:rgba(247,243,234,.72);
}
.footer-nav{
  display:grid; grid-template-columns:repeat(4,minmax(120px,1fr)); gap:26px;
}
.footer-col__title{
  font-size:12px; font-weight:800; letter-spacing:.18em;
  color:var(--gold); text-transform:uppercase;
  padding-bottom:9px; margin-bottom:12px;
  border-bottom:2px solid rgba(242,178,62,.35);
}
.footer-col__list{ display:flex; flex-direction:column; gap:9px; }
.footer-col__link{
  display:inline-block; min-height:28px;
  font-size:14.5px; color:rgba(247,243,234,.82);
  border-bottom:2px solid transparent;
  transition:color .18s ease, border-color .18s ease;
}
.footer-col__link:hover{ color:var(--cyan); border-bottom-color:var(--cyan); }
.footer-col__link[aria-current="page"]{ color:var(--gold); border-bottom-color:var(--gold); }

.footer-contact{
  grid-column:1 / -1;
  padding:22px 24px;
  background:rgba(35,56,107,.6);
  border:2px solid var(--clay);
  border-radius:2px;
  box-shadow:6px 6px 0 rgba(216,51,42,.32);
}
.footer-contact__title{
  font-size:13px; font-weight:800; letter-spacing:.2em; color:var(--cream);
  margin-bottom:14px;
}
.footer-contact__list{ display:flex; flex-wrap:wrap; gap:14px 34px; }
.footer-contact__item{ display:flex; align-items:baseline; gap:10px; min-width:0; }
.footer-contact__k{
  flex:0 0 auto;
  padding:2px 8px;
  background:var(--gold); color:var(--ink);
  border:2px solid var(--ink); border-radius:2px;
  font-size:11.5px; font-weight:800; letter-spacing:.1em;
}
.footer-contact__v{
  font-family:var(--font-num), var(--font-sans);
  font-size:16px; font-weight:700; letter-spacing:.03em;
  color:var(--cream); word-break:break-all;
}
.footer-contact__note{
  margin-top:14px; max-width:70ch;
  font-size:13px; line-height:1.8; color:rgba(247,243,234,.66);
}
.footer-bottom{
  grid-column:1 / -1;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px;
  padding-top:20px;
  border-top:2px solid rgba(247,243,234,.16);
}
.footer-service{ font-size:13px; color:rgba(247,243,234,.62); }
.footer-legal{
  font-size:13px; letter-spacing:.06em; color:rgba(247,243,234,.82);
}

/* ---------- 7. 通用布局 ---------- */
.container{ width:100%; max-width:1180px; margin-inline:auto; padding-inline:22px; }
.container--wide{ max-width:1360px; }
.section{ padding-block:clamp(40px,6vw,80px); }
.section--lined{ border-top:2px solid var(--clay); }
.section__head{ max-width:66ch; margin-bottom:clamp(20px,3vw,34px); }
.section__eyebrow{
  display:inline-block; margin-bottom:12px;
  padding:4px 11px;
  background:var(--indigo); color:var(--gold);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-size:12px; font-weight:800; letter-spacing:.16em;
}
.section__title{ font-size:clamp(26px,3.4vw,44px); }
.section__lead{ margin-top:14px; font-size:16.5px; line-height:1.8; color:var(--stone); }

.grid{ display:grid; gap:24px; }
.grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid--split{ grid-template-columns:1.35fr 1fr; align-items:start; }

.prose{ max-width:74ch; }
.prose p + p{ margin-top:16px; }
.prose h2{ margin-top:34px; margin-bottom:12px; }
.prose h3{ margin-top:26px; margin-bottom:10px; }

/* ---------- 8. 卡片 / 展签 / 标签 ---------- */
.card{
  background:var(--cream);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard);
  padding:22px;
  transition:box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.card:hover{ box-shadow:10px 10px 0 var(--ink); border-color:var(--cinnabar); transform:translate(-2px,-2px); }
.card--dark{ background:var(--indigo); color:var(--cream); }
.card--dark .card__title{ color:var(--cream); }
.card--flush{ padding:0; overflow:hidden; }
.card__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.card__title{ font-size:19px; font-weight:800; color:var(--ink); }
.card__meta{ font-size:12.5px; letter-spacing:.1em; color:var(--clay); }
.card__body{ font-size:15.5px; }

.plate{
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 11px;
  background:var(--indigo); color:var(--gold);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard-sm);
  font-size:12px; font-weight:800; letter-spacing:.14em;
}
.plate__num{ font-family:var(--font-num); font-size:13.5px; color:var(--cyan); }
.plate__text{ color:var(--cream); }

.tag{
  display:inline-block; padding:3px 9px;
  background:var(--cream); color:var(--clay);
  border:2px solid var(--clay); border-radius:2px;
  font-size:12px; font-weight:800; letter-spacing:.1em;
}
.tag--gold{ background:var(--gold); color:var(--ink); border-color:var(--ink); }
.tag--cyan{ background:var(--cyan); color:var(--ink); border-color:var(--ink); }
.tag--clay{ background:var(--clay); color:var(--cream); border-color:var(--ink); }
.tag--live{ background:var(--cinnabar); color:var(--cream); border-color:var(--ink); }

/* ---------- 9. 按钮 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:0 22px;
  border:var(--edge); border-radius:2px;
  box-shadow:4px 4px 0 var(--ink);
  font-size:15px; font-weight:800; letter-spacing:.05em;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}
.btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink); }
.btn:active{ transform:translate(1px,1px); box-shadow:2px 2px 0 var(--ink); }
.btn--primary{ background:var(--cinnabar); color:var(--cream); }
.btn--gold{ background:var(--gold); color:var(--ink); }
.btn--ghost{ background:var(--cream); color:var(--ink); }
.btn--indigo{ background:var(--indigo); color:var(--cream); }
.btn-group{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 10. 面包屑 ---------- */
.breadcrumb{ margin-bottom:20px; }
.breadcrumb__list{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; font-size:13px; }
.breadcrumb__item{ display:flex; align-items:center; gap:12px; letter-spacing:.06em; color:var(--stone); }
.breadcrumb__item + .breadcrumb__item::before{ content:"／"; color:var(--clay); }
.breadcrumb__item a{ border-bottom:2px solid transparent; transition:color .18s ease, border-color .18s ease; }
.breadcrumb__item a:hover{ color:var(--cinnabar); border-bottom-color:var(--cinnabar); }

/* ---------- 11. 分段切换 ---------- */
.tabs{ margin-block:24px; }
.tablist{
  position:relative;
  display:flex; flex-wrap:wrap; gap:4px;
  border-bottom:3px solid var(--ink);
}
.tab{
  position:relative; z-index:1;
  min-height:46px; padding:0 18px;
  background:transparent; color:var(--indigo);
  border:2px solid transparent; border-bottom:0; border-radius:2px 2px 0 0;
  font-size:14.5px; font-weight:800; letter-spacing:.06em;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease;
}
.tab:hover{ background:rgba(216,51,42,.12); }
.tab[aria-selected="true"]{ background:var(--cream); border-color:var(--ink); color:var(--ink); }
.tablist__indicator{
  position:absolute; bottom:-3px; left:0;
  width:0; height:6px;
  background:var(--cinnabar);
  transition:transform .24s ease, width .24s ease;
}
.tabpanel{ padding-top:22px; }
.tabpanel:focus{ outline:none; }
.tabpanel[hidden]{ display:none; }

/* ---------- 12. 数据组件 ---------- */
.stat-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(148px,1fr)); gap:18px; }
.stat{
  padding:16px 18px;
  background:var(--cream);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard);
}
.stat__value{
  font-family:var(--font-num);
  font-variant-numeric:tabular-nums;
  font-size:clamp(34px,4.6vw,54px);
  font-weight:800; line-height:1; color:var(--indigo);
  letter-spacing:.01em;
}
.stat__label{ margin-top:8px; font-size:12.5px; font-weight:700; letter-spacing:.12em; color:var(--clay); }

.meter{ height:12px; background:var(--bamboo-2); border:var(--edge); border-radius:2px; overflow:hidden; }
.meter__fill{ display:block; height:100%; background:var(--moss); transition:width .3s ease; }
.meter__fill--live{ background:var(--cyan); }

/* ---------- 13. 图片容器 ---------- */
.figure{
  position:relative; display:block;
  overflow:hidden;
  background:var(--indigo);
  border:var(--edge); border-radius:2px;
  box-shadow:var(--shadow-hard);
  aspect-ratio:4 / 3;
}
.figure > img,
.figure > .figure__ph{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover;
}
.figure__ph{
  display:flex; align-items:center; justify-content:center;
  background-image:
    repeating-linear-gradient(45deg, rgba(247,243,234,.09) 0 2px, transparent 2px 12px),
    linear-gradient(150deg, var(--indigo), #16223F);
  color:rgba(247,243,234,.55);
  font-size:12px; font-weight:700; letter-spacing:.18em;
}
.figure::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(150deg, rgba(216,51,42,.3) 0%, rgba(16,23,38,0) 62%);
}
.figure--wide{ aspect-ratio:16 / 9; }
.figure--square{ aspect-ratio:1 / 1; }
.figure--tall{ aspect-ratio:3 / 4; }
.figure__cap{
  position:absolute; left:0; bottom:0; z-index:2;
  max-width:88%;
  padding:7px 12px;
  background:rgba(16,23,38,.86); color:var(--cream);
  border-top:2px solid var(--gold); border-right:2px solid var(--gold);
  font-size:12px; font-weight:700; letter-spacing:.1em;
}

/* ---------- 14. 滚动显现 ---------- */
html.js-ready [data-reveal]{
  opacity:0; transform:translateY(10px);
  transition:opacity .5s ease, transform .5s ease;
}
html.js-ready [data-reveal].is-in{ opacity:1; transform:none; }

/* ---------- 15. 平板 ---------- */
@media (max-width:1100px){
  .footer-inner{ grid-template-columns:1fr; gap:34px; }
  .grid--split{ grid-template-columns:1fr; }
  .grid--3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ---------- 16. 移动端：轨道收为抽屉 ---------- */
@media (max-width:900px){
  body{ padding-left:0; padding-top:var(--topbar-h); }

  .topbar{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    position:absolute; top:0; left:0; right:0; height:var(--topbar-h);
    padding:0 14px;
    background:var(--indigo);
    border-bottom:3px solid var(--ink);
    pointer-events:auto;
  }
  .topbar__brand{ min-width:0; }
  .topbar__tag{ display:none; }

  .rail{
    top:0; left:auto; right:0; bottom:0;
    width:min(86vw,340px);
    border-right:0; border-left:3px solid var(--ink);
    box-shadow:-8px 0 0 rgba(16,23,38,.28);
    padding:16px 18px 22px;
    transform:translateX(105%);
    transition:transform .32s cubic-bezier(.22,.8,.2,1);
    overflow-y:auto;
  }
  .site-header[data-open] .rail{ transform:translateX(0); }
  .site-header[data-open] .rail-scrim{ opacity:1; pointer-events:auto; }

  .rail__progress{ display:none; }
  .rail__top{ flex-direction:row; align-items:center; justify-content:space-between; width:100%; gap:12px; }
  .rail__brand{ flex-direction:row; align-items:center; gap:10px; }
  .rail__mark{ writing-mode:horizontal-tb; padding:8px 12px; font-size:17px; letter-spacing:.16em; }
  .rail__tag{ width:auto; text-align:left; font-size:10.5px; letter-spacing:.14em; }
  .rail__close{ display:inline-flex; }

  .rail__nav{ width:100%; padding-top:6px; }
  .rail__menu{ align-items:stretch; gap:8px; }
  .rail__item{ justify-content:flex-start; }
  .rail__link{
    flex-direction:row; align-items:center; justify-content:flex-start;
    gap:12px; width:100%; padding:12px 14px;
    color:rgba(247,243,234,.86);
    border-left:4px solid transparent;
    font-size:16px;
  }
  .rail__num{ font-size:13px; }
  .rail__label{ writing-mode:horizontal-tb; font-size:16px; font-weight:700; letter-spacing:.1em; }
  .rail__link:hover{ background:rgba(247,243,234,.1); border-left-color:rgba(247,243,234,.35); }
  .rail__link[aria-current="page"]{
    background:var(--cinnabar); box-shadow:none;
    border-left-color:var(--cyan);
  }

  .rail__foot{ flex-direction:row; align-items:center; justify-content:space-between; width:100%; gap:14px; }
  .rail__status{ flex-direction:row; align-items:center; gap:8px; font-size:11px; }
  .rail__cta{ width:auto; padding:11px 16px; font-size:13px; }

  .footer-nav{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .grid--2, .grid--3{ grid-template-columns:1fr; }
}

@media (max-width:420px){
  .topbar__mark{ font-size:15.5px; letter-spacing:.1em; }
  .footer-nav{ grid-template-columns:1fr; }
  .figure{ box-shadow:4px 4px 0 var(--ink); }
}

/* ---------- 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;
  }
  .status-dot{ animation:none; }
  html.js-ready [data-reveal]{ opacity:1; transform:none; transition:none; }
  .card:hover, .btn:hover, .btn:active{ transform:none; }
}