:root{
  --ink:#0E1116;
  --panel:#151B22;
  --band:#1E2830;
  --lime:#B6FF3B;
  --orange:#FF6B35;
  --steel:#8DA3B8;
  --paper:#E8E6E1;
  --moss:#6F8F3A;
  --edge:#2E3A44;
  --bright:#F2F5F7;
  --font-head:"Archivo Narrow","Arial Narrow","Helvetica Neue","PingFang SC","Noto Sans SC",system-ui,sans-serif;
  --font-body:"Inter","Helvetica Neue","PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --shadow-hard:8px 8px 0 var(--edge);
  --shadow-hard-lg:12px 12px 0 var(--edge);
  --ease:150ms cubic-bezier(.2,.7,.3,1);
  --gutter:clamp(16px,3vw,28px);
  --shell:min(1240px,100% - 2.5rem);
}

*,*::before,*::after{box-sizing:border-box}
html{margin:0;padding:0;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  padding:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  letter-spacing:.01em;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:800;line-height:1.08;letter-spacing:.015em;margin:0 0 .5em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
a{color:var(--lime);text-decoration:none}
a:hover{color:var(--paper)}
img,picture,video{max-width:100%}
ul,ol{margin:0 0 1em;padding-left:1.15em}
button{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px}

/* ---------- 布局工具 ---------- */
.wrap{width:var(--shell);margin-inline:auto}
.stack{display:grid;gap:var(--gutter)}
.stack--tight{display:grid;gap:12px}
.grid{display:grid;gap:var(--gutter)}
.grid--7-5{grid-template-columns:7fr 5fr}
.grid--8-4{grid-template-columns:8fr 4fr}
.grid--5-4-3{grid-template-columns:5fr 4fr 3fr}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

/* ---------- 跳转链接 ---------- */
.skip-link{
  position:absolute;
  left:12px;
  top:-80px;
  z-index:120;
  background:var(--lime);
  color:var(--ink);
  font-weight:800;
  font-size:.86rem;
  padding:.6rem 1rem;
  border:2px solid var(--ink);
  transition:top var(--ease);
}
.skip-link:focus{top:12px;color:var(--ink)}

/* ---------- 头部 ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:60;
  background:rgba(14,17,22,.94);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border-bottom:2px solid var(--edge);
}
.header-inner{
  width:var(--shell);
  margin-inline:auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:clamp(10px,1.6vw,20px);
  padding:.7rem 0;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  flex:0 0 auto;
  padding:.45rem .9rem .45rem .7rem;
  background:var(--panel);
  border:2px solid var(--edge);
  border-radius:6px;
  box-shadow:4px 4px 0 var(--edge);
  color:var(--paper);
  transition:border-color var(--ease),box-shadow var(--ease),transform var(--ease);
}
.brand:hover{
  color:var(--paper);
  border-color:var(--moss);
  box-shadow:6px 6px 0 rgba(182,255,59,.28);
  transform:translate(-1px,-1px);
}
.brand-mark{
  width:13px;
  height:13px;
  background:var(--lime);
  display:block;
  box-shadow:0 0 0 2px var(--ink);
  flex:0 0 auto;
}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-name{font-family:var(--font-head);font-weight:800;font-size:1.02rem;letter-spacing:.04em}
.brand-tag{font-size:.66rem;color:var(--steel);letter-spacing:.1em;margin-top:2px}

.nav-toggle{
  display:none;
  align-items:center;
  gap:.6rem;
  margin-left:auto;
  padding:.55rem .9rem;
  background:var(--panel);
  border:2px solid var(--edge);
  border-radius:999px;
  color:var(--paper);
  font-weight:700;
  font-size:.82rem;
  letter-spacing:.08em;
  cursor:pointer;
  transition:border-color var(--ease),box-shadow var(--ease);
}
.nav-toggle:hover{border-color:var(--lime);box-shadow:4px 4px 0 var(--edge)}
.nav-toggle-lines{position:relative;display:block;width:18px;height:2px;background:var(--lime)}
.nav-toggle-lines::before,
.nav-toggle-lines::after{
  content:"";
  position:absolute;
  left:0;
  width:18px;
  height:2px;
  background:var(--lime);
  transition:transform var(--ease);
}
.nav-toggle-lines::before{top:-6px}
.nav-toggle-lines::after{top:6px}
.nav-toggle[aria-expanded="true"] .nav-toggle-lines{background:transparent}
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::before{transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::after{transform:translateY(-6px) rotate(-45deg)}
.nav-toggle-text{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.16em;font-size:.68rem}

.nav-capsule{
  margin-left:auto;
  max-width:100%;
  background:var(--panel);
  border:2px solid var(--edge);
  border-radius:999px;
  padding:.28rem;
}
.nav-list{
  display:flex;
  align-items:center;
  gap:.15rem;
  list-style:none;
  margin:0;
  padding:0;
  overflow-x:auto;
  scroll-snap-type:x proximity;
  scrollbar-width:thin;
  scrollbar-color:var(--moss) transparent;
}
.nav-list::-webkit-scrollbar{height:4px}
.nav-list::-webkit-scrollbar-thumb{background:var(--moss)}
.nav-link{
  display:block;
  white-space:nowrap;
  scroll-snap-align:start;
  padding:.45rem .88rem;
  border:2px solid transparent;
  border-radius:999px;
  color:var(--steel);
  font-size:.86rem;
  font-weight:600;
  letter-spacing:.03em;
  transition:color var(--ease),border-color var(--ease),background-color var(--ease);
}
.nav-link:hover{color:var(--paper);border-color:var(--moss)}
.nav-link[aria-current="page"]{
  background:var(--lime);
  border-color:var(--lime);
  color:var(--ink);
  font-weight:800;
}
.scroll-meter{position:absolute;left:0;right:0;bottom:-2px;height:3px;pointer-events:none;background:transparent}
.scroll-meter-bar{display:block;height:100%;width:0;background:var(--lime);transition:width 120ms linear}

/* ---------- 页脚 ---------- */
.site-footer{
  margin-top:clamp(56px,8vw,120px);
  background:var(--panel);
  border-top:2px solid var(--edge);
}
.footer-inner{
  width:var(--shell);
  margin-inline:auto;
  padding:clamp(34px,4.6vw,64px) 0 26px;
}
.footer-brand{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.8rem;
  padding-bottom:1.3rem;
  border-bottom:2px solid var(--edge);
  margin-bottom:clamp(22px,3vw,36px);
}
.footer-brand-name{font-family:var(--font-head);font-weight:800;font-size:1.1rem;letter-spacing:.05em;color:var(--paper)}
.footer-claim{font-size:.86rem;color:var(--steel);letter-spacing:.04em}

.footer-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,3vw,44px);
}
.footer-title{
  font-family:var(--font-mono);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--lime);
  margin:0 0 .9rem;
}
.footer-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.footer-list a{
  display:inline-block;
  color:var(--paper);
  font-size:.92rem;
  border-bottom:1px solid transparent;
  padding-bottom:1px;
  transition:color var(--ease),border-color var(--ease);
}
.footer-list a:hover{color:var(--lime);border-bottom-color:var(--lime)}

.footer-contact{display:grid;gap:.85rem}
.contact-line{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:.3rem .6rem;
  padding-bottom:.6rem;
  border-bottom:1px dashed var(--edge);
}
.contact-line--plain{grid-template-columns:minmax(0,1fr)}
.contact-label{
  grid-column:1 / -1;
  font-family:var(--font-mono);
  font-size:.62rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--steel);
}
.contact-value{
  font-family:var(--font-mono);
  font-size:.84rem;
  color:var(--bright);
  overflow-wrap:anywhere;
  letter-spacing:.02em;
}
.contact-value--text{font-family:var(--font-body);font-size:.86rem;color:var(--paper);letter-spacing:.01em}
.copy-btn{
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:.25rem .55rem;
  background:transparent;
  border:2px solid var(--edge);
  color:var(--steel);
  cursor:pointer;
  transition:color var(--ease),border-color var(--ease),background-color var(--ease);
}
.copy-btn:hover{border-color:var(--lime);color:var(--lime)}
.copy-btn[data-copied="true"]{background:var(--lime);border-color:var(--lime);color:var(--ink)}

.footer-note{
  margin-top:clamp(22px,2.8vw,34px);
  max-width:62ch;
  font-size:.84rem;
  line-height:1.75;
  color:var(--steel);
}
.footer-legal{
  margin-top:clamp(22px,2.8vw,34px);
  padding-top:1.1rem;
  border-top:2px solid var(--edge);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem 1.6rem;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.05em;
  color:var(--steel);
}
.legal-brand{color:var(--paper);font-weight:700}
.legal-icp{color:var(--lime)}
.legal-meta{color:var(--steel)}

/* ---------- 标题与文本组件 ---------- */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  margin:0 0 .85rem;
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--orange);
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--orange);display:block}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1.2rem;
  margin-bottom:clamp(18px,2.6vw,32px);
}
.section-title{font-size:clamp(1.5rem,3.2vw,2.5rem);margin:0}
.lede{max-width:38ch;font-size:clamp(1rem,1.5vw,1.12rem);line-height:1.75;color:var(--steel);margin:0}
.crumbs{
  display:flex;
  flex-wrap:wrap;
  gap:.5em;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--steel);
  margin-bottom:1.2rem;
}
.crumbs a{color:var(--steel)}
.crumbs a:hover{color:var(--lime)}
.crumbs span[aria-current]{color:var(--paper)}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  padding:.7em 1.25em;
  background:var(--panel);
  border:2px solid var(--edge);
  color:var(--paper);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.03em;
  border-radius:2px;
  transition:transform var(--ease),border-color var(--ease),background-color var(--ease),color var(--ease),box-shadow var(--ease);
}
.btn:hover{color:var(--paper);border-color:var(--moss);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--edge)}
.btn--primary{background:var(--lime);border-color:var(--lime);color:var(--ink);box-shadow:5px 5px 0 rgba(182,255,59,.25)}
.btn--primary:hover{background:var(--lime);border-color:var(--lime);color:var(--ink);box-shadow:7px 7px 0 rgba(182,255,59,.35)}
.btn--ghost{background:transparent;color:var(--lime);border-color:var(--moss)}
.btn--ghost:hover{color:var(--lime);border-color:var(--lime);background:rgba(182,255,59,.08)}
.btn--signal{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.btn--signal:hover{background:var(--orange);border-color:var(--orange);color:var(--ink)}

/* ---------- 面板与主题带 ---------- */
.panel{
  position:relative;
  background:var(--panel);
  border:2px solid var(--edge);
  border-radius:2px;
  box-shadow:var(--shadow-hard);
  padding:clamp(18px,2.4vw,32px);
}
.panel--lift{transition:box-shadow var(--ease),border-color var(--ease),transform var(--ease)}
.panel--lift:hover{box-shadow:var(--shadow-hard-lg);border-color:var(--moss);transform:translate(-2px,-2px)}
.panel__head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.6rem 1rem;
  padding-bottom:.7rem;
  margin-bottom:1rem;
  border-bottom:2px solid var(--edge);
}
.panel__title{font-size:clamp(1.05rem,1.6vw,1.35rem);margin:0}
.panel__meta{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--steel)}
.band{
  background:var(--band);
  border-top:2px solid var(--edge);
  border-bottom:2px solid var(--edge);
  padding:clamp(24px,3.4vw,44px) 0;
}
.band__title{font-size:clamp(1.2rem,2.2vw,1.8rem);margin:0 0 .4rem}

/* ---------- 数据与标签 ---------- */
.stat{display:grid;gap:.35rem;padding-left:.9rem;border-left:3px solid var(--lime)}
.stat-value{font-family:var(--font-mono);font-size:clamp(1.7rem,4vw,3rem);line-height:1;color:var(--bright);letter-spacing:-.01em}
.stat-label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--steel)}
.time{font-family:var(--font-mono);font-size:1rem;letter-spacing:.06em;color:var(--lime)}
.tag{
  display:inline-flex;
  align-items:center;
  gap:.42em;
  padding:.24em .62em;
  background:var(--band);
  border:2px solid var(--edge);
  color:var(--steel);
  font-family:var(--font-mono);
  font-size:.64rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.tag--signal{border-color:var(--orange);color:var(--orange)}
.tag--lime{border-color:var(--lime);color:var(--lime)}
.tag--live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange);display:block}

/* ---------- 横向比分牌轨道 ---------- */
.rail{
  display:flex;
  gap:14px;
  margin:0;
  padding:0 0 .8rem;
  list-style:none;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:thin;
  scrollbar-color:var(--moss) var(--panel);
}
.rail::-webkit-scrollbar{height:5px}
.rail::-webkit-scrollbar-thumb{background:var(--moss)}
.rail__item{
  position:relative;
  flex:0 0 clamp(230px,26vw,300px);
  scroll-snap-align:start;
  background:var(--panel);
  border:2px solid var(--edge);
  padding:1rem 1.1rem;
  transition:border-color var(--ease),box-shadow var(--ease);
}
.rail__item:hover{border-color:var(--lime);box-shadow:6px 6px 0 var(--edge)}
.rail__item:hover::before{content:"";position:absolute;left:-2px;top:0;bottom:0;width:3px;background:var(--lime)}

/* ---------- 纵向赛程行 ---------- */
.row{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(10px,2vw,20px);
  padding:.85rem clamp(.6rem,1.4vw,1.1rem);
  border-bottom:2px solid var(--edge);
  transition:background-color var(--ease);
}
.row:hover{background:var(--band)}
.row:hover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--lime)}

/* ---------- 折叠条目 ---------- */
.fold{
  background:var(--panel);
  border:2px solid var(--edge);
  transition:border-color var(--ease);
}
.fold + .fold{margin-top:-2px}
.fold[open]{border-color:var(--lime)}
.fold summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.9rem 1.1rem;
  font-weight:700;
  cursor:pointer;
  list-style:none;
}
.fold summary::-webkit-details-marker{display:none}
.fold summary::after{content:"＋";font-family:var(--font-mono);color:var(--steel)}
.fold[open] summary::after{content:"－";color:var(--lime)}
.fold__body{padding:0 1.1rem 1.05rem;font-size:.94rem;color:var(--steel);line-height:1.75}

/* ---------- 图片容器基础规则（页面阶段放置占位图） ---------- */
.media-frame{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/9;
  background:var(--band);
  border:2px solid var(--edge);
  box-shadow:10px 10px 0 var(--edge);
}
.media-frame img,
.media-frame picture img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.85) contrast(1.06);
}
.media-frame::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:6px;
  background:linear-gradient(90deg,var(--lime) 0%,var(--orange) 100%);
}
.media-frame--tall{aspect-ratio:3/4}
.media-frame--square{aspect-ratio:1/1}
.media-frame--plain::after{display:none}
.media-frame--diag{transform:rotate(-1.2deg)}
.media-frame__tag{
  position:absolute;
  top:0;left:0;
  z-index:2;
  padding:.3em .7em;
  background:var(--orange);
  color:var(--ink);
  font-family:var(--font-mono);
  font-size:.64rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.media-caption{
  margin-top:.6rem;
  font-family:var(--font-mono);
  font-size:.7rem;
  line-height:1.6;
  letter-spacing:.06em;
  color:var(--steel);
}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .grid--5-4-3{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  .grid--7-5,
  .grid--8-4{grid-template-columns:1fr}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lede{max-width:none}
}
@media (max-width:880px){
  .nav-toggle{display:inline-flex}
  .nav-capsule{
    flex:0 0 100%;
    width:100%;
    margin-left:0;
    border-radius:12px;
    padding:0 .3rem;
    max-height:0;
    opacity:0;
    visibility:hidden;
    overflow:hidden;
    transition:max-height 220ms ease,opacity 180ms ease,padding 220ms ease;
  }
  .nav-capsule[data-open]{
    max-height:62vh;
    padding:.4rem .3rem;
    opacity:1;
    visibility:visible;
    overflow-y:auto;
  }
  .nav-list{flex-direction:column;align-items:stretch;overflow:visible}
  .nav-link{border-radius:8px;padding:.62rem .85rem;font-size:.95rem}
  .nav-link[aria-current="page"]{border-radius:8px}
}
@media (max-width:600px){
  .grid--5-4-3,
  .grid--4{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .row{grid-template-columns:auto minmax(0,1fr)}
  .row > .row__end{grid-column:1 / -1}
  .panel{box-shadow:6px 6px 0 var(--edge)}
  .media-frame{box-shadow:6px 6px 0 var(--edge)}
}
@media (max-width:480px){
  .brand-tag{display:none}
  .footer-claim{font-size:.82rem}
}

/* ---------- 无障碍动效降级 ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .panel--lift:hover{transform:none}
  .btn:hover{transform:none}
  .media-frame--diag{transform:none}
  .scroll-meter-bar{transition:none}
}