/* =========================================================
   大发体育方赛事 · 共享样式 /assets/site.css
   夜赛深蓝骨架 · 墨绿看台分区 · 橙红行动点 · 精密细线网格
   ========================================================= */

:root{
  --qd-night:#0B1B2B;
  --qd-green:#0E2A26;
  --qd-panel:#16283A;
  --qd-mid:#1D4E6B;
  --qd-gridc:#8FA3B0;
  --qd-paper:#F2EFE7;
  --qd-orange:#FF5A2B;
  --qd-amber:#FFB347;
  --qd-mint:#2FBFA0;
  --qd-alert:#E0453B;

  --qd-text:var(--qd-paper);
  --qd-dim:rgba(242,239,231,.74);
  --qd-muted:#8FA3B0;
  --qd-line:rgba(143,163,176,.26);
  --qd-line-strong:rgba(143,163,176,.55);

  --qd-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC",sans-serif;
  --qd-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;

  --qd-w:1200px;
  --qd-gutter:clamp(18px,4vw,44px);
  --qd-radius:2px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body,h1,h2,h3,h4,h5,p,ul,ol,li,figure,blockquote,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3,h4,h5{font-weight:800;letter-spacing:-.02em;line-height:1.2}
img,svg,video{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0}
table{border-collapse:collapse;border-spacing:0}
hr{border:0;border-top:1px solid var(--qd-line);margin:0}
a{color:inherit}

html{scroll-behavior:smooth}

body{
  background-color:var(--qd-night);
  color:var(--qd-text);
  font-family:var(--qd-sans);
  font-size:16px;
  line-height:1.85;
  font-weight:400;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

::selection{background:rgba(255,90,43,.32);color:#fff}

:focus-visible{
  outline:2px solid var(--qd-amber);
  outline-offset:2px;
  border-radius:2px;
}

/* ---------- 跳过链接 ---------- */
.qd-skip{
  position:absolute;
  left:12px;
  top:-70px;
  z-index:200;
  display:inline-block;
  padding:10px 16px;
  background:var(--qd-orange);
  color:var(--qd-night);
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  border-radius:var(--qd-radius);
  transition:top .16s ease;
}
.qd-skip:focus{top:12px}

/* ---------- 头部 ---------- */
.qd-header{
  position:sticky;
  top:0;
  z-index:60;
  background:rgba(11,27,43,.97);
  border-bottom:1px solid var(--qd-line);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
  backdrop-filter:blur(10px) saturate(140%);
  transition:box-shadow .18s ease;
}
.qd-header.is-scrolled{box-shadow:0 16px 36px -26px rgba(0,0,0,.95)}

.qd-header__bar{
  position:relative;
  max-width:var(--qd-w);
  margin:0 auto;
  padding:16px var(--qd-gutter) 12px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
}

.qd-header__note{
  grid-column:1;
  justify-self:start;
  font-family:var(--qd-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--qd-muted);
  line-height:1.5;
  white-space:nowrap;
}

.qd-brand{
  grid-column:2;
  justify-self:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  text-decoration:none;
  color:var(--qd-paper);
  padding:2px 6px;
}
.qd-brand__cn{
  font-size:clamp(20px,2.4vw,26px);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.12;
}
.qd-brand__sub{
  font-family:var(--qd-mono);
  font-size:10.5px;
  letter-spacing:.16em;
  color:var(--qd-orange);
  line-height:1.2;
}
.qd-brand:hover .qd-brand__cn{color:#fff}
.qd-brand:hover .qd-brand__sub{color:var(--qd-amber)}

.qd-quick{
  grid-column:3;
  justify-self:end;
  display:flex;
  align-items:center;
  gap:8px;
}
.qd-quick__link{
  display:inline-block;
  padding:7px 11px;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--qd-muted);
  text-decoration:none;
  border:1px solid var(--qd-line);
  border-radius:var(--qd-radius);
  white-space:nowrap;
  transition:color .12s ease,border-color .12s ease,background-color .12s ease;
}
.qd-quick__link:hover{
  color:var(--qd-paper);
  border-color:var(--qd-line-strong);
  background:rgba(29,78,107,.3);
}
.qd-quick__link--accent{
  color:var(--qd-orange);
  border-color:rgba(255,90,43,.45);
  background:rgba(255,90,43,.07);
}
.qd-quick__link--accent:hover{
  color:#FFD6C7;
  border-color:var(--qd-orange);
  background:rgba(255,90,43,.16);
}

.qd-navbtn{
  display:none;
  align-items:center;
  gap:9px;
  padding:9px 12px;
  border:1px solid var(--qd-line);
  border-radius:var(--qd-radius);
  color:var(--qd-paper);
  cursor:pointer;
  transition:border-color .12s ease,background-color .12s ease;
}
.qd-navbtn:hover{border-color:var(--qd-line-strong);background:rgba(29,78,107,.28)}
.qd-navbtn__bars{position:relative;display:block;width:16px;height:10px}
.qd-navbtn__bars::before,
.qd-navbtn__bars::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:1.5px;
  background:currentColor;
  transition:transform .18s ease,top .18s ease,bottom .18s ease;
}
.qd-navbtn__bars::before{top:0}
.qd-navbtn__bars::after{bottom:0}
.qd-navbtn[aria-expanded="true"] .qd-navbtn__bars::before{top:4px;transform:rotate(45deg)}
.qd-navbtn[aria-expanded="true"] .qd-navbtn__bars::after{bottom:4px;transform:rotate(-45deg)}
.qd-navbtn__text{font-family:var(--qd-mono);font-size:12px;letter-spacing:.12em}

.qd-nav{border-top:1px solid var(--qd-line)}
.qd-nav__list{
  max-width:var(--qd-w);
  margin:0 auto;
  padding:0 var(--qd-gutter);
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:clamp(2px,1.8vw,28px);
}
.qd-nav__item{display:block}
.qd-nav__link{
  display:block;
  padding:13px 8px;
  font-size:15px;
  color:var(--qd-muted);
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:color .12s ease,border-color .12s ease;
}
.qd-nav__link:hover{color:var(--qd-paper)}
.qd-nav__link[aria-current="page"]{
  color:var(--qd-paper);
  border-bottom-color:var(--qd-orange);
}

.qd-progress{
  position:absolute;
  left:0;
  bottom:-1px;
  height:2px;
  width:0;
  z-index:5;
  background:linear-gradient(90deg,var(--qd-orange),var(--qd-amber) 58%,var(--qd-mint));
  transition:width .1s linear;
}

/* ---------- 页脚 ---------- */
.qd-footer{
  position:relative;
  margin-top:clamp(56px,8vw,110px);
  background:
    radial-gradient(120% 90% at 8% 0%,rgba(29,78,107,.42),rgba(29,78,107,0) 62%),
    var(--qd-green);
  border-top:1px solid var(--qd-line);
  color:var(--qd-paper);
}
.qd-footer::before{
  content:"";
  position:absolute;
  left:0;right:0;top:-1px;
  height:2px;
  background:linear-gradient(90deg,var(--qd-orange),var(--qd-amber) 42%,rgba(47,191,160,.85) 78%,rgba(143,163,176,.2));
}
.qd-footer__inner{
  max-width:var(--qd-w);
  margin:0 auto;
  padding:clamp(40px,6vw,72px) var(--qd-gutter) 26px;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(26px,4vw,42px);
}
.qd-footer__lede{max-width:34em}
.qd-footer__brand{
  font-size:clamp(20px,2.2vw,24px);
  font-weight:800;
  letter-spacing:-.02em;
  margin-bottom:12px;
}
.qd-footer__summary{
  font-size:15.5px;
  line-height:1.85;
  color:var(--qd-dim);
}
.qd-footer__meta{
  margin-top:14px;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--qd-muted);
}
.qd-footer__cols{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,3vw,32px);
}
.qd-footer__title{
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.18em;
  color:var(--qd-amber);
  margin-bottom:14px;
  padding-bottom:10px;
  border-bottom:1px solid var(--qd-line);
}
.qd-footer__list{display:flex;flex-direction:column;gap:9px}
.qd-footer__link{
  font-size:14.5px;
  color:var(--qd-dim);
  text-decoration:none;
  transition:color .12s ease,translate .12s ease;
  display:inline-block;
}
.qd-footer__link:hover{color:var(--qd-orange);translate:2px 0}
.qd-footer__contact{
  display:flex;
  flex-wrap:wrap;
  gap:10px clamp(18px,3vw,38px);
  padding-top:clamp(20px,3vw,28px);
  border-top:1px solid var(--qd-line);
}
.qd-footer__contactitem{
  display:flex;
  align-items:baseline;
  gap:10px;
  font-size:14px;
  line-height:1.7;
  color:var(--qd-dim);
}
.qd-footer__label{
  font-family:var(--qd-mono);
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--qd-muted);
  white-space:nowrap;
}
.qd-footer__value{color:var(--qd-paper)}
.qd-footer__legal{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 20px;
  padding-top:16px;
  border-top:1px solid var(--qd-line);
}
.qd-footer__legalitem{
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--qd-muted);
}

/* ---------- 布局基元 ---------- */
.qd-container{
  width:100%;
  max-width:var(--qd-w);
  margin:0 auto;
  padding-inline:var(--qd-gutter);
}
.qd-section{padding-block:clamp(46px,7vw,88px)}
.qd-section--tight{padding-block:clamp(28px,4vw,52px)}
.qd-section--band{
  background:
    linear-gradient(180deg,rgba(29,78,107,.28),rgba(14,42,38,0) 70%),
    var(--qd-green);
  border-block:1px solid var(--qd-line);
}

/* ---------- 排版 ---------- */
.qd-eyebrow{
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.2em;
  color:var(--qd-amber);
  margin-bottom:12px;
  display:block;
}
.qd-title-xl{
  font-size:clamp(32px,5.2vw,66px);
  line-height:1.05;
  letter-spacing:-.02em;
  margin-bottom:18px;
}
.qd-title-lg{
  font-size:clamp(26px,3.2vw,38px);
  line-height:1.18;
  margin-bottom:14px;
}
.qd-title-md{
  font-size:clamp(19px,2vw,25px);
  line-height:1.32;
  margin-bottom:10px;
}
.qd-title-sm{
  font-size:17px;
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.45;
  margin-bottom:8px;
}
.qd-body{
  font-size:16.5px;
  line-height:1.85;
  color:var(--qd-dim);
}
.qd-prose{
  max-width:38em;
  font-size:17px;
  line-height:1.85;
  color:var(--qd-dim);
}
.qd-prose p + p{margin-top:1.1em}
.qd-prose strong{color:var(--qd-paper);font-weight:700}
.qd-lead{
  font-size:clamp(17px,1.6vw,19px);
  line-height:1.8;
  color:var(--qd-paper);
  max-width:40em;
}
.qd-data{
  font-family:var(--qd-mono);
  font-size:14px;
  letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
  color:var(--qd-paper);
}
.qd-data--lg{
  font-size:clamp(24px,3vw,34px);
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.15;
}
.qd-data--muted{
  font-size:13px;
  color:var(--qd-muted);
}
.qd-rule{height:1px;background:var(--qd-line);border:0;margin:0}

/* ---------- 面包屑 ---------- */
.qd-crumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--qd-muted);
}
.qd-crumbs__item{display:inline-flex;align-items:center;gap:8px}
.qd-crumbs a{color:var(--qd-muted);text-decoration:none;transition:color .12s ease}
.qd-crumbs a:hover{color:var(--qd-paper)}
.qd-crumbs__item[aria-current="page"]{color:var(--qd-amber)}
.qd-crumbs__sep{color:rgba(143,163,176,.45)}

/* ---------- 按钮 ---------- */
.qd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 20px;
  font-family:var(--qd-sans);
  font-size:15px;
  font-weight:700;
  letter-spacing:.01em;
  line-height:1.4;
  text-decoration:none;
  border:1px solid transparent;
  border-radius:var(--qd-radius);
  cursor:pointer;
  transition:background-color .12s ease,border-color .12s ease,color .12s ease,translate .12s ease;
}
.qd-btn--primary{
  background:var(--qd-orange);
  color:var(--qd-night);
}
.qd-btn--primary:hover{background:#FF7A52;translate:0 -1px}
.qd-btn--ghost{
  background:transparent;
  border-color:var(--qd-line-strong);
  color:var(--qd-paper);
}
.qd-btn--ghost:hover{
  border-color:var(--qd-orange);
  color:var(--qd-orange);
  translate:0 -1px;
}

/* ---------- 矩阵与卡片 ---------- */
.qd-grid{
  display:grid;
  gap:1px;
  background:var(--qd-line);
  border:1px solid var(--qd-line);
  border-radius:var(--qd-radius);
  overflow:hidden;
}
.qd-grid > *{background:var(--qd-panel)}
.qd-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.qd-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.qd-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

.qd-card{
  display:block;
  padding:clamp(18px,2.4vw,28px);
  background:var(--qd-panel);
  color:inherit;
  text-decoration:none;
  transition:background-color .12s ease;
}
.qd-card:hover{background:#1B3049}
.qd-card__kicker{
  display:block;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.14em;
  color:var(--qd-amber);
  margin-bottom:10px;
}
.qd-card__title{
  font-size:19px;
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.45;
  margin-bottom:8px;
}
.qd-card__note{
  font-size:15px;
  line-height:1.75;
  color:var(--qd-dim);
}

/* ---------- 标签与状态 ---------- */
.qd-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--qd-muted);
  border:1px solid var(--qd-line-strong);
  border-radius:999px;
  white-space:nowrap;
}
.qd-tag--accent{
  color:var(--qd-orange);
  border-color:rgba(255,90,43,.5);
  background:rgba(255,90,43,.08);
}
.qd-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-family:var(--qd-mono);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--qd-dim);
}
.qd-status::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--qd-gridc);
  flex:none;
}
.qd-status--ok::before{background:var(--qd-mint)}
.qd-status--warn::before{background:var(--qd-amber)}
.qd-status--alert::before{background:var(--qd-alert)}

/* ---------- 表格 ---------- */
.qd-table-wrap{
  position:relative;
  border:1px solid var(--qd-line);
  border-radius:var(--qd-radius);
  background:var(--qd-panel);
  overflow:hidden;
}
.qd-table-wrap::after{
  content:"";
  position:absolute;
  top:0;right:0;bottom:0;
  width:38px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(22,40,58,0),rgba(22,40,58,.96));
}
.qd-table-scroll{
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scrollbar-color:rgba(143,163,176,.5) transparent;
}
.qd-table{
  width:100%;
  min-width:520px;
  font-size:15px;
}
.qd-table caption{
  text-align:left;
  padding:14px 16px 0;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.14em;
  color:var(--qd-amber);
}
.qd-table th,
.qd-table td{
  padding:13px 16px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--qd-line);
}
.qd-table th{
  font-family:var(--qd-mono);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:.1em;
  color:var(--qd-muted);
  white-space:nowrap;
  background:rgba(11,27,43,.4);
}
.qd-table td{color:var(--qd-dim)}
.qd-table td.qd-data{color:var(--qd-paper)}
.qd-table tbody tr:last-child td{border-bottom:0}
.qd-table tbody tr:hover td{background:rgba(29,78,107,.2)}

/* ---------- 图像容器 ---------- */
.qd-media{
  position:relative;
  display:block;
  aspect-ratio:16 / 10;
  border:1px solid var(--qd-line);
  border-radius:var(--qd-radius);
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(29,78,107,.6),rgba(14,42,38,.92) 58%,rgba(11,27,43,.98));
}
.qd-media::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(143,163,176,.14) 1px,transparent 1px),
    linear-gradient(90deg,rgba(143,163,176,.14) 1px,transparent 1px);
  background-size:34px 34px;
}
.qd-media > img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:cover;
}
.qd-media--wide{aspect-ratio:21 / 9}
.qd-media--tall{aspect-ratio:4 / 5}
.qd-media--square{aspect-ratio:1 / 1}
.qd-media__cap{
  position:absolute;
  left:0;right:0;bottom:0;
  z-index:2;
  padding:12px 14px;
  font-family:var(--qd-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--qd-paper);
  background:linear-gradient(180deg,rgba(11,27,43,0),rgba(11,27,43,.9));
}

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

/* ---------- 平板 ---------- */
@media (max-width:1140px){
  .qd-header__note{display:none}
  .qd-quick__link{padding:6px 9px;font-size:11px}
}

@media (max-width:1024px){
  .qd-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:899px){
  .qd-header__bar{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
    padding:12px var(--qd-gutter) 10px;
  }
  .qd-brand{
    order:1;
    flex:1 1 auto;
    align-items:flex-start;
    padding-left:0;
  }
  .qd-navbtn{display:inline-flex;order:2;margin-left:auto}
  .qd-quick{
    order:3;
    flex:1 0 100%;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:8px;
    overflow-x:auto;
    padding-bottom:6px;
    scrollbar-width:none;
  }
  .qd-quick::-webkit-scrollbar{height:0}
  .qd-quick__link{flex:none}

  .qd-nav{display:none;background:rgba(14,42,38,.98)}
  .qd-nav[data-open]{display:block}
  .qd-nav__list{
    flex-direction:column;
    flex-wrap:nowrap;
    gap:0;
    padding:4px var(--qd-gutter) 16px;
  }
  .qd-nav__link{
    padding:13px 2px;
    font-size:16px;
    border-bottom:1px solid var(--qd-line);
  }
  .qd-nav__link[aria-current="page"]{
    border-bottom-color:var(--qd-orange);
    color:var(--qd-paper);
  }

  .qd-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qd-footer__cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- 手机 ---------- */
@media (max-width:599px){
  body{font-size:16px;line-height:1.8}
  .qd-brand__cn{font-size:19px}
  .qd-grid--2,
  .qd-grid--3,
  .qd-grid--4{grid-template-columns:minmax(0,1fr)}
  .qd-footer__cols{grid-template-columns:minmax(0,1fr)}
  .qd-footer__legal{justify-content:flex-start}
  .qd-footer__contactitem{flex-direction:column;gap:2px}
  .qd-btn{width:100%}
  .qd-table{min-width:460px}
}

/* ---------- 桌面：页脚两栏骨架 ---------- */
@media (min-width:900px){
  .qd-footer__inner{
    grid-template-columns:minmax(240px,1fr) minmax(0,2fr);
    align-items:start;
  }
  .qd-footer__lede{grid-column:1}
  .qd-footer__cols{grid-column:2}
  .qd-footer__contact,
  .qd-footer__legal{grid-column:1 / -1}
}

/* ---------- 减弱动态 ---------- */
@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.qd-js [data-reveal]{
    opacity:1 !important;
    transform:none !important;
  }
  .qd-progress{display:none}
}
