/* ==========================================================================
   冠竞赛场 / 共享外壳样式表 — /assets/site.css
   框架式导航 + 堆叠面板 + 编辑部目录 + 主客场语义分区
   ========================================================================== */

/* ---------- 1. 重置 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd,ul,ol,pre{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
img,svg,video{display:block;max-width:100%}
table{border-collapse:collapse}
h1,h2,h3,h4,h5{font-weight:500}

/* ---------- 2. 变量 ---------- */
:root{
  --carbon-ink:#0D1412;
  --pitch-forest:#12271F;
  --panel-moss:#1B3A2F;
  --lime-home:#C8F24A;
  --bolt-orange:#FF6A2B;
  --steel-blue:#7FA3BE;
  --paper-bone:#F1EDE1;
  --wine-garnet:#5C1F2C;
  --indigo-slate:#1C2140;
  --hairline:#2E4A3F;
  --muted-sage:#93A79C;

  --signal:var(--lime-home);
  --signal-ink:var(--carbon-ink);

  --font-display:"Archivo Narrow","Oswald","Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono:"IBM Plex Mono","JetBrains Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --bar-h:60px;
  --rail-h:52px;
  --nav-w:0px;
  --frame-top:calc(var(--bar-h) + var(--rail-h));
  --gutter:clamp(14px,3vw,32px);
  --line:1px solid var(--hairline);
  --radius:2px;
}
html[data-venue="all"]{--signal:var(--lime-home)}
html[data-venue="home"]{--signal:var(--lime-home)}
html[data-venue="away"]{--signal:var(--bolt-orange)}
@media (min-width:1024px){
  :root{--bar-h:68px;--rail-h:56px;--nav-w:182px}
}

/* ---------- 3. 基础排版 ---------- */
body{
  background:var(--carbon-ink);
  color:var(--paper-bone);
  font-family:var(--font-body);
  font-size:15px;
  font-weight:500;
  line-height:1.62;
  min-height:100vh;
  padding-top:var(--frame-top);
  -webkit-font-smoothing:antialiased;
}
@media (min-width:1024px){
  body{padding-left:var(--nav-w)}
}
::selection{background:var(--lime-home);color:var(--carbon-ink)}
main{display:block}
:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-radius:1px}
a:focus-visible,button:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.08em}
.sem-home{color:var(--lime-home)}
.sem-away{color:var(--bolt-orange)}
.sem-meta{color:var(--steel-blue)}
.sem-muted{color:var(--muted-sage)}

/* ---------- 4. 版式容器与栅格 ---------- */
.container{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
.grid{display:grid;gap:clamp(16px,2.4vw,28px);grid-template-columns:1fr}
@media (min-width:900px){
  .grid--5-7{grid-template-columns:5fr 7fr}
  .grid--4-8{grid-template-columns:4fr 8fr}
}
.rule{height:1px;background:var(--hairline);border:0;margin:clamp(20px,3vw,32px) 0}
.skew-edge{display:block;height:14px;background:var(--panel-moss);clip-path:polygon(0 0,100% 0,100% 20%,0 100%)}

/* ---------- 5. 头部外框 ---------- */
.site-header{position:relative;z-index:60}
.skip-link{
  position:fixed;left:var(--gutter);top:6px;z-index:200;
  transform:translateY(-220%);
  background:var(--paper-bone);color:var(--carbon-ink);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;
  padding:8px 14px;border:1px solid var(--carbon-ink);
  transition:transform .16s ease;
}
.skip-link:focus,.skip-link:focus-visible{transform:none}

.brand-bar{
  position:fixed;top:0;left:0;right:0;height:var(--bar-h);z-index:70;
  background:var(--carbon-ink);border-bottom:var(--line);
}
.brand-bar__inner{
  height:100%;display:flex;align-items:center;gap:clamp(10px,1.6vw,24px);
  padding:0 var(--gutter);min-width:0;
}
.wordmark{display:flex;align-items:baseline;gap:10px;flex:0 0 auto;padding-right:clamp(8px,1.4vw,18px);border-right:var(--line)}
.wordmark__mark{
  font-family:var(--font-display);font-weight:700;font-stretch:87.5%;
  font-size:clamp(17px,2.1vw,23px);letter-spacing:.18em;text-transform:uppercase;
  color:var(--paper-bone);white-space:nowrap;
}
.wordmark__sub{
  display:none;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  color:var(--muted-sage);white-space:nowrap;
}
@media (min-width:720px){.wordmark__sub{display:inline}}
.wordmark:hover .wordmark__mark{color:var(--signal)}

.frame-meta{display:none;gap:clamp(12px,1.8vw,26px);font-family:var(--font-mono);font-size:11px;letter-spacing:.1em}
@media (min-width:900px){.frame-meta{display:flex}}
.frame-meta__item{display:flex;flex-direction:column;line-height:1.35}
.frame-meta__label{color:var(--muted-sage);font-size:10px;letter-spacing:.14em}
.frame-meta__value{color:var(--paper-bone);font-variant-numeric:tabular-nums;white-space:nowrap}

.brand-bar__actions{margin-left:auto;display:flex;align-items:center;gap:clamp(8px,1.2vw,16px)}

.venue-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:var(--line);background:var(--pitch-forest)}
.venue-switch--bar{display:none}
.venue-switch--drawer{width:calc(100% - 32px);margin:0 16px}
@media (min-width:1024px){
  .venue-switch--bar{display:grid}
  .venue-switch--drawer{display:none}
}
.venue-switch__btn{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-align:center;
  padding:7px 10px;color:var(--muted-sage);border-right:var(--line);
  transition:color .16s ease,background-color .16s ease;
}
.venue-switch__btn:last-child{border-right:0}
.venue-switch__btn:hover{color:var(--paper-bone);background:var(--panel-moss)}
.venue-switch__btn[aria-pressed="true"]{color:var(--carbon-ink)}
.venue-switch__btn[data-venue="all"][aria-pressed="true"]{background:var(--steel-blue)}
.venue-switch__btn[data-venue="home"][aria-pressed="true"]{background:var(--lime-home)}
.venue-switch__btn[data-venue="away"][aria-pressed="true"]{background:var(--bolt-orange)}

.nav-toggle{
  display:flex;align-items:center;gap:8px;padding:8px 10px;
  border:1px solid var(--hairline);color:var(--paper-bone);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;
  transition:border-color .16s ease,color .16s ease;
}
@media (min-width:1024px){.nav-toggle{display:none}}
.nav-toggle:hover{border-color:var(--steel-blue)}
.nav-toggle__bars{display:block;width:16px}
.nav-toggle__bars span{display:block;height:2px;background:currentColor;margin:3px 0}
.nav-toggle[aria-expanded="true"]{border-color:var(--signal);color:var(--signal)}
.nav-toggle__label{white-space:nowrap}

.progress-line{position:absolute;left:0;right:0;bottom:-1px;height:2px;overflow:hidden;background:transparent}
.progress-line__bar{display:block;height:100%;width:100%;background:var(--signal);transform:scaleX(0);transform-origin:left center}

/* ---------- 6. 34 轮时间轴 ---------- */
.round-rail{
  position:fixed;top:var(--bar-h);left:0;right:0;height:var(--rail-h);z-index:65;
  display:flex;align-items:center;gap:12px;padding:0 var(--gutter);overflow:hidden;
  background:var(--pitch-forest);border-bottom:var(--line);
}
.round-rail__label{
  display:none;font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--steel-blue);white-space:nowrap;
}
@media (min-width:768px){.round-rail__label{display:block}}
.round-rail__scroller{
  flex:1 1 auto;min-width:0;display:flex;gap:6px;overflow-x:auto;padding:6px 0;
  scrollbar-width:thin;scrollbar-color:var(--panel-moss) transparent;
}
.round-rail__scroller::-webkit-scrollbar{height:4px}
.round-rail__scroller::-webkit-scrollbar-track{background:transparent}
.round-rail__scroller::-webkit-scrollbar-thumb{background:var(--panel-moss)}
.round-rail__hint{
  display:none;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  color:var(--muted-sage);white-space:nowrap;
}
@media (min-width:1280px){.round-rail__hint{display:block}}
.round-chip{
  flex:0 0 auto;min-width:46px;height:28px;
  border:1px solid var(--hairline);color:var(--muted-sage);
  font-family:var(--font-mono);font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.04em;
  transition:color .16s ease,background-color .16s ease,border-color .16s ease;
}
.round-chip:hover{color:var(--paper-bone);border-color:var(--steel-blue);background:var(--panel-moss)}
.round-chip[aria-pressed="true"]{background:var(--signal);border-color:var(--signal);color:var(--signal-ink)}

/* ---------- 7. 框架式导航 ---------- */
.frame-nav{
  position:fixed;top:var(--frame-top);left:0;bottom:0;width:var(--nav-w);z-index:60;
  display:flex;flex-direction:column;gap:14px;padding:18px 0 24px;overflow-y:auto;
  background:var(--pitch-forest);border-right:var(--line);
}
.frame-nav__label{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;color:var(--steel-blue);padding:0 16px}
.frame-nav__list{display:flex;flex-direction:column;border-top:1px solid rgba(46,74,63,.6)}
.frame-nav__item{border-bottom:1px solid rgba(46,74,63,.6)}
.frame-nav__link{
  display:flex;align-items:baseline;gap:9px;padding:11px 16px;
  font-size:14px;color:var(--muted-sage);border-left:2px solid transparent;
  transition:color .16s ease,background-color .16s ease,border-color .16s ease;
}
.frame-nav__link:hover{color:var(--paper-bone);background:var(--panel-moss);border-left-color:var(--steel-blue)}
.frame-nav__link[aria-current="page"]{color:var(--paper-bone);background:var(--panel-moss);border-left-color:var(--steel-blue)}
.frame-nav__num{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;color:var(--steel-blue)}
.frame-nav__util-wrap{margin-top:auto;padding:0 16px}
.frame-nav__util{
  display:block;font-family:var(--font-mono);font-size:11px;line-height:1.5;letter-spacing:.08em;
  color:var(--steel-blue);border:1px dashed var(--hairline);padding:10px 12px;
  transition:color .16s ease,border-color .16s ease;
}
.frame-nav__util:hover{color:var(--paper-bone);border-color:var(--steel-blue)}
.frame-nav__note{padding:0 16px;font-size:12px;line-height:1.55;color:var(--muted-sage)}

@media (max-width:1023px){
  .frame-nav{
    top:var(--frame-top);left:0;right:0;bottom:0;width:auto;padding:16px 0 40px;
    border-right:0;border-top:var(--line);
    transform:translateX(-102%);visibility:hidden;
    transition:transform .18s ease,visibility .18s ease;
  }
  .frame-nav[data-open]{transform:none;visibility:visible}
}

/* ---------- 8. 面板与编辑部组件 ---------- */
.panel{
  position:relative;background:var(--pitch-forest);border:var(--line);border-radius:var(--radius);
  padding:clamp(18px,2.6vw,34px);
  box-shadow:0 1px 0 0 rgba(0,0,0,.55),0 26px 42px -34px rgba(0,0,0,.95);
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.panel + .panel{margin-top:clamp(20px,3vw,36px)}
.panel:hover{border-color:var(--panel-moss)}
.panel--paper{background:var(--paper-bone);color:var(--carbon-ink);border-color:rgba(13,20,18,.22)}
.panel--paper:hover{border-color:rgba(13,20,18,.45)}
.panel--wine{background:var(--wine-garnet);border-color:#7A2B3B}
.panel--indigo{background:var(--indigo-slate);border-color:#2B3363}
.panel__label{
  display:inline-flex;align-items:center;gap:8px;padding-bottom:6px;margin-bottom:clamp(12px,1.8vw,20px);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel-blue);border-bottom:1px solid var(--hairline);
}
.panel__label::before{content:"";width:10px;height:1px;background:currentColor}
.panel__title{
  font-family:var(--font-display);font-weight:600;font-stretch:87.5%;
  font-size:clamp(28px,4.2vw,72px);line-height:1.02;letter-spacing:.02em;
  text-transform:uppercase;color:var(--paper-bone);
}
.panel--paper .panel__title{color:var(--carbon-ink)}
.panel__foot{
  margin-top:clamp(18px,2.4vw,28px);padding-top:12px;border-top:var(--line);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--muted-sage);
}

.num-anchor{
  font-family:var(--font-mono);font-weight:400;font-variant-numeric:tabular-nums;
  font-size:clamp(48px,9vw,128px);line-height:.88;letter-spacing:-.02em;color:var(--paper-bone);
}
.num-anchor--home{color:var(--lime-home)}
.num-anchor--away{color:var(--bolt-orange)}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}

.tag{
  display:inline-block;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  padding:4px 8px;border:1px solid var(--hairline);border-radius:1px;color:var(--muted-sage);
}
.tag--home{border-color:var(--lime-home);color:var(--lime-home)}
.tag--away{border-color:var(--bolt-orange);color:var(--bolt-orange)}
.tag--meta{border-color:var(--steel-blue);color:var(--steel-blue)}

.note{
  font-size:14px;line-height:1.6;color:var(--muted-sage);
  border-left:2px solid var(--hairline);padding-left:12px;
}
.panel--paper .note{color:#3F4A44}

.index-list{display:grid;border-top:var(--line)}
.index-row{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:baseline;
  padding:12px 4px;border-bottom:var(--line);color:var(--paper-bone);
  transition:background-color .16s ease,padding-left .16s ease;
}
.index-row:hover{background:var(--panel-moss);padding-left:12px}
.index-row__num{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--steel-blue)}
.index-row__label{font-size:15px;min-width:0}
.index-row__meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--muted-sage)}

/* ---------- 9. 按钮 / 面包屑 / 图片容器 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;white-space:nowrap;
  padding:10px 16px;border:1px solid var(--hairline);background:var(--pitch-forest);color:var(--paper-bone);
  transition:background-color .16s ease,color .16s ease,border-color .16s ease;
}
.btn:hover{border-color:var(--steel-blue);background:var(--panel-moss)}
.btn--signal{background:var(--signal);border-color:var(--signal);color:var(--signal-ink)}
.btn--signal:hover{background:var(--paper-bone);border-color:var(--paper-bone);color:var(--carbon-ink)}
.btn--ghost{background:transparent;color:var(--steel-blue)}

.breadcrumb{
  display:flex;flex-wrap:wrap;gap:8px;padding:14px 0;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--muted-sage);
}
.breadcrumb__item{display:inline-flex;align-items:center;gap:8px}
.breadcrumb__link{color:var(--steel-blue)}
.breadcrumb__link:hover{color:var(--paper-bone);text-decoration:underline;text-underline-offset:3px}
.breadcrumb__sep{color:var(--hairline)}
.breadcrumb__current{color:var(--paper-bone)}

.media{position:relative;margin:0}
.media__frame{
  position:relative;overflow:hidden;border:var(--line);aspect-ratio:16/10;
  background:
    repeating-linear-gradient(0deg,rgba(127,163,190,.10) 0 1px,transparent 1px 32px),
    repeating-linear-gradient(90deg,rgba(127,163,190,.10) 0 1px,transparent 1px 32px),
    var(--pitch-forest);
}
.media--pitch .media__frame{aspect-ratio:16/10}
.media--wide .media__frame{aspect-ratio:21/9}
.media--portrait .media__frame{aspect-ratio:3/4}
.media__img{width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.05)}
.media__cap{margin-top:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--muted-sage)}

/* ---------- 10. 页脚 ---------- */
.site-footer{
  position:relative;z-index:10;margin-top:clamp(48px,7vw,96px);
  background:var(--carbon-ink);border-top:3px solid var(--panel-moss);
}
.footer-update{background:var(--indigo-slate);border-bottom:var(--line)}
.footer-update__inner{
  max-width:1280px;margin-inline:auto;padding:12px var(--gutter);
  display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline;
}
.footer-update__label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--steel-blue);white-space:nowrap;
}
.footer-update__text{font-size:13px;line-height:1.6;color:var(--muted-sage)}

.site-footer__inner{
  max-width:1280px;margin-inline:auto;padding:clamp(28px,4vw,52px) var(--gutter);
  display:grid;gap:clamp(24px,3vw,44px);grid-template-columns:minmax(0,1fr);
}
@media (min-width:760px){
  .site-footer__inner{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1080px){
  .site-footer__inner{grid-template-columns:minmax(220px,1fr) minmax(0,1.6fr) minmax(250px,1.1fr)}
}

.footer-brand{border-left:3px solid var(--steel-blue);padding-left:14px}
.footer-brand__line{
  font-family:var(--font-display);font-weight:600;font-stretch:87.5%;
  font-size:clamp(16px,2vw,20px);letter-spacing:.06em;line-height:1.3;color:var(--paper-bone);
}
.footer-brand__note{margin-top:10px;font-size:13px;line-height:1.6;color:var(--muted-sage)}
.footer-brand__stamp{
  margin-top:14px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--steel-blue);
}

.footer-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
@media (max-width:520px){.footer-nav{grid-template-columns:repeat(2,minmax(0,1fr))}}
.footer-nav__group{min-width:0}
.footer-nav__title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;font-weight:500;
  color:var(--steel-blue);padding-bottom:8px;margin-bottom:10px;border-bottom:var(--line);
}
.footer-nav__list{display:grid;gap:8px}
.footer-nav__link{
  font-size:14px;color:var(--muted-sage);
  transition:color .16s ease;
}
.footer-nav__link:hover{color:var(--paper-bone)}
.footer-nav__link[aria-current="page"]{color:var(--paper-bone);text-decoration:underline;text-underline-offset:3px}

.footer-contact{display:flex;flex-direction:column;gap:12px}
.footer-contact__list{display:grid;gap:12px}
.footer-contact__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center}
.footer-contact__label{
  grid-column:1/-1;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--steel-blue);
}
.footer-contact__value{font-size:13px;line-height:1.5;color:var(--paper-bone);word-break:break-all}
.footer-contact__note{
  font-size:12px;line-height:1.6;color:var(--muted-sage);
  border-left:2px solid var(--hairline);padding-left:10px;
}

.copy-btn{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;
  padding:4px 8px;border:1px solid var(--hairline);color:var(--steel-blue);
  transition:color .16s ease,border-color .16s ease,background-color .16s ease;
}
.copy-btn:hover{color:var(--paper-bone);border-color:var(--steel-blue)}
.copy-btn[data-copied="true"]{background:var(--paper-bone);border-color:var(--paper-bone);color:var(--carbon-ink)}

.footer-legal{border-top:var(--line);background:var(--carbon-ink)}
.footer-legal__inner{
  max-width:1280px;margin-inline:auto;padding:14px var(--gutter) 22px;
  display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--muted-sage);
}
.footer-legal__icp{color:var(--steel-blue)}
.footer-legal__copy{color:var(--muted-sage)}
.footer-legal__code{margin-left:auto;color:var(--muted-sage)}

/* ---------- 11. 动效与降级 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    transition-duration:.001ms !important;
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
  }
  .panel:hover{transform:none}
  .progress-line__bar{transition:none}
}
