/* =========================================================
   E星赛场 · 共享样式表 /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}
ul,ol{padding:0;list-style:none}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
table{border-collapse:collapse;width:100%}
::selection{background:var(--cyan);color:#04121A}

/* ---------- 2. Tokens ---------- */
:root{
  /* 色板 */
  --bg:#05070E;
  --ink:#0B1220;
  --slate:#151E30;
  --line:#22304A;
  --cyan:#2BE7E0;
  --cyan-soft:#8CF5EF;
  --orange:#FF7A2F;
  --orange-deep:#C74F13;
  --heat-1:#FFD08A;
  --heat-2:#FF9E4D;
  --heat-3:#E85D2A;
  --text:#E8EEF7;
  --muted:#93A3B8;
  --rule:#4A6B8A;
  --ok:#4ADE80;

  /* 字体 */
  --font-sans:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-cond:"Oswald","Barlow Condensed","Arial Narrow",var(--font-sans);
  --font-mono:"JetBrains Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* 字阶 */
  --fs-12:0.75rem;
  --fs-14:0.875rem;
  --fs-17:1.0625rem;
  --fs-22:1.375rem;
  --fs-32:2rem;
  --fs-48:3rem;
  --fs-72:4.5rem;
  --fs-104:6.5rem;

  /* 结构 */
  --wrap:1240px;
  --gap:1.5rem;
  --radius:2px;
  --ease:ease-out;
  --t-fast:180ms;
  --t-mid:240ms;
}

/* ---------- 3. Base ---------- */
body{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 84% -12%,rgba(43,231,224,.10),transparent 56%),
    radial-gradient(circle at 4% 6%,rgba(255,122,47,.07),transparent 44%);
  background-attachment:fixed;
  color:var(--text);
  font-family:var(--font-sans);
  font-size:var(--fs-17);
  line-height:1.75;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
[hidden]{display:none !important}

.wrap{width:min(var(--wrap),100% - 2.5rem);margin-inline:auto}
.lede{font-size:1.1875rem;line-height:1.85;color:#D7E1EF;max-width:46ch}
.muted{color:var(--muted)}
.mono{font-family:var(--font-mono);font-size:var(--fs-14);letter-spacing:.06em}

/* ---------- 4. 跳转链接 & 阅读进度 ---------- */
.skip-link{
  position:absolute;left:1rem;top:-4.5rem;z-index:120;
  background:var(--cyan);color:#04121A;
  padding:.6rem 1rem;border-radius:var(--radius);
  font-family:var(--font-mono);font-size:var(--fs-14);letter-spacing:.06em;
  transition:top var(--t-fast) var(--ease);
}
.skip-link:focus{top:.75rem}
.scroll-rail{
  position:fixed;inset:0 0 auto 0;height:2px;z-index:90;
  background:rgba(21,30,48,.65);pointer-events:none;
}
.scroll-rail__bar{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--cyan) 0%,var(--cyan-soft) 55%,var(--orange) 100%);
}

/* ---------- 5. Header：工具带 / 刊头 / 导航 ---------- */
.site-header{
  position:sticky;top:0;z-index:70;
  background:linear-gradient(180deg,#070A14 0%,#05070E 82%);
  border-bottom:1px solid var(--slate);
}
.header__utility{
  background:var(--ink);
  border-bottom:1px solid var(--slate);
}
.header__utility-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:.75rem 1.5rem;flex-wrap:wrap;
  min-height:38px;padding-block:.35rem;
}
.utility__stamp{
  display:flex;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.1em;color:var(--rule);
}
.utility__stamp-no{color:var(--cyan)}
.utility__stamp-sep{color:var(--slate)}
.utility__stamp-txt{color:var(--muted)}
.utility__list{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.utility__search,
.utility__folder,
.utility__toggle{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.32rem .7rem;border:1px solid var(--slate);border-radius:var(--radius);
  font-family:var(--font-mono);font-size:var(--fs-12);letter-spacing:.06em;
  color:var(--muted);
  transition:color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),background-color var(--t-fast) var(--ease);
}
.utility__search:hover,
.utility__folder:hover,
.utility__toggle:hover{color:var(--cyan-soft);border-color:var(--cyan);background:rgba(43,231,224,.06)}
.utility__search{min-width:15rem;justify-content:flex-start;border-style:dashed}
.utility__dot{
  width:6px;height:6px;border-radius:50%;background:var(--rule);
  transition:background-color var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease);
}
.utility__toggle[aria-pressed="true"]{color:var(--orange);border-color:var(--orange-deep)}
.utility__toggle[aria-pressed="true"] .utility__dot{background:var(--orange);box-shadow:0 0 0 3px rgba(255,122,47,.18)}

/* 刊头：居中报头 + 左印章 + 右 CTA */
.masthead{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:.75rem 1.25rem;padding-block:1.35rem .95rem;
}
.masthead__stamp{
  grid-column:1;grid-row:1;justify-self:start;
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.12em;color:var(--rule);white-space:nowrap;
}
.masthead__stamp-dot{
  width:6px;height:6px;border-radius:50%;background:var(--cyan);
  animation:pulse 2.4s ease-in-out infinite;
}
.masthead__cta{grid-column:3;grid-row:1;justify-self:end}

.brand{
  grid-column:2;grid-row:1;justify-self:center;
  display:inline-flex;align-items:center;gap:.7rem;
}
.brand__mark{
  display:grid;place-items:center;
  width:42px;height:42px;flex:0 0 auto;
  background:linear-gradient(140deg,var(--cyan) 0%,#0E6E7A 100%);
  color:#04121A;font-family:var(--font-cond);font-weight:700;
  font-size:1.5rem;line-height:1;
  clip-path:polygon(0 0,100% 0,100% 76%,76% 100%,0 100%);
}
.brand__text{display:block}
.brand__name{
  display:block;
  font-weight:900;font-size:clamp(1.45rem,2.6vw,2.125rem);
  letter-spacing:-.02em;line-height:1;
}
.brand__sub{
  display:block;margin-top:.4rem;
  font-family:var(--font-mono);font-size:.6875rem;
  letter-spacing:.16em;color:var(--muted);
}
.brand--footer{justify-self:start}

/* 汉堡 */
.nav-toggle{
  grid-column:1;grid-row:1;justify-self:start;
  display:none;align-items:center;gap:.5rem;
  padding:.5rem .7rem;border:1px solid var(--slate);border-radius:var(--radius);
  font-family:var(--font-mono);font-size:var(--fs-12);letter-spacing:.08em;color:var(--muted);
  transition:color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease);
}
.nav-toggle:hover{color:var(--text);border-color:var(--line)}
.nav-toggle[aria-expanded="true"]{color:var(--cyan);border-color:var(--cyan)}
.nav-toggle__bars{position:relative;width:16px;height:10px;display:block}
.nav-toggle__bars::before,
.nav-toggle__bars::after{
  content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;
  transition:transform var(--t-fast) var(--ease),top var(--t-fast) var(--ease),bottom var(--t-fast) var(--ease);
}
.nav-toggle__bars::before{top:0}
.nav-toggle__bars::after{bottom:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before{top:4px;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after{bottom:4.5px;transform:rotate(-45deg)}

/* 导航：居中刊物目录 */
.site-nav{position:relative;border-top:1px solid var(--slate)}
.site-nav__list{
  display:flex;justify-content:center;flex-wrap:wrap;
  gap:.2rem;padding-block:.45rem;
}
.site-nav__link{
  position:relative;display:block;
  padding:.55rem .95rem;border:1px solid transparent;border-radius:var(--radius);
  font-size:.9375rem;color:var(--muted);letter-spacing:.02em;
  transition:color var(--t-fast) var(--ease),background-color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease);
}
.site-nav__link:hover{color:var(--text);background:var(--slate);border-color:var(--line)}
.site-nav__link[aria-current="page"]{
  color:var(--cyan);background:rgba(43,231,224,.07);border-color:rgba(43,231,224,.35);
}
.site-nav__link[aria-current="page"]::before{
  content:"";position:absolute;left:50%;top:-1px;width:18px;height:2px;
  background:var(--orange);transform:translateX(-50%);
}
/* 3° 斜切色块：刊头动势切口 */
.site-nav::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;
  background:linear-gradient(90deg,rgba(43,231,224,0) 0%,rgba(43,231,224,.55) 28%,rgba(43,231,224,.14) 58%,rgba(255,122,47,.65) 100%);
  clip-path:polygon(0 0,100% 0,100% 22%,0 100%);
  pointer-events:none;
}

/* ---------- 6. Footer ---------- */
.site-footer{
  position:relative;margin-top:6rem;
  background:linear-gradient(180deg,#070A14 0%,#05070E 100%);
  border-top:1px solid var(--slate);
  color:var(--muted);
}
.footer__cut{
  height:6px;
  background:linear-gradient(90deg,var(--cyan) 0%,rgba(43,231,224,.15) 42%,rgba(255,122,47,.85) 100%);
  clip-path:polygon(0 0,100% 0,100% 26%,0 100%);
}
.footer__inner{
  display:grid;grid-template-columns:1.1fr 2fr;
  gap:2.5rem 3rem;padding-block:3.25rem 2rem;
}
.footer__brand{display:flex;flex-direction:column;gap:.9rem}
.footer__slogan{
  color:var(--text);font-size:var(--fs-17);line-height:1.7;
  padding-left:.85rem;border-left:2px solid var(--cyan);max-width:24ch;
}
.footer__stamp{
  align-self:flex-start;
  font-family:var(--font-mono);font-size:var(--fs-12);letter-spacing:.1em;
  color:var(--rule);border:1px solid var(--slate);
  padding:.25rem .55rem;border-radius:var(--radius);
}
.footer__nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.footer__title{
  display:flex;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:var(--fs-12);font-weight:400;
  letter-spacing:.16em;color:var(--cyan);
  padding-bottom:.6rem;margin-bottom:.85rem;
  border-bottom:1px solid var(--slate);
}
.footer__title-no{color:var(--rule)}
.footer__list li+li{margin-top:.1rem}
.footer__link{
  display:inline-block;padding:.32rem 0;
  font-size:.9375rem;color:var(--text);opacity:.84;
  transition:color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease),opacity var(--t-fast) var(--ease);
}
.footer__link:hover{color:var(--cyan);opacity:1;transform:translateX(3px)}
.footer__meta{
  display:grid;gap:.35rem;
  padding-block:1.25rem;
  border-top:1px solid var(--slate);
}
.footer__contact{font-family:var(--font-mono);font-size:var(--fs-14);color:var(--muted);letter-spacing:.04em}
.footer__address{font-family:var(--font-mono);font-size:var(--fs-12);color:var(--rule);letter-spacing:.06em}
.footer__bottom{
  display:flex;align-items:center;justify-content:space-between;
  gap:.75rem 1.5rem;flex-wrap:wrap;
  padding-block:1.1rem 2.25rem;
  border-top:1px dashed rgba(74,107,138,.35);
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.08em;color:var(--rule);
}
.footer__legal{color:var(--rule)}

/* ---------- 7. 通用组件 ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.68rem 1.05rem;border:1px solid var(--slate);border-radius:var(--radius);
  background:var(--ink);color:var(--text);
  font-family:var(--font-mono);font-size:.8125rem;letter-spacing:.06em;
  transition:background-color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),
             color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn--primary{background:var(--orange);border-color:var(--orange);color:#180800;font-weight:700}
.btn--primary:hover{background:#FF9350;border-color:#FF9350}
.btn--primary:active{background:var(--orange-deep);border-color:var(--orange-deep)}
.btn--ghost{background:transparent;border-color:rgba(43,231,224,.45);color:var(--cyan)}
.btn--ghost:hover{background:rgba(43,231,224,.08)}
.btn--quiet{background:transparent;border-color:transparent;color:var(--muted)}
.btn--quiet:hover{color:var(--cyan)}

.crumbs{
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.08em;color:var(--muted);
}
.crumbs__sep{color:var(--rule)}
.crumbs a{transition:color var(--t-fast) var(--ease)}
.crumbs a:hover{color:var(--cyan)}

.section{padding-block:3.5rem}
.section__head{display:grid;gap:.6rem;max-width:62ch;margin-bottom:1.75rem}
.eyebrow{
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.2em;color:var(--cyan);text-transform:uppercase;
}
.section__title{
  font-weight:900;font-size:clamp(1.65rem,3.1vw,2.75rem);
  line-height:1.16;letter-spacing:-.02em;
}

.grid{display:grid;gap:var(--gap)}
.grid--12{grid-template-columns:repeat(12,minmax(0,1fr))}
.span-3{grid-column:span 3}
.span-4{grid-column:span 4}
.span-5{grid-column:span 5}
.span-6{grid-column:span 6}
.span-7{grid-column:span 7}
.span-8{grid-column:span 8}
.span-12{grid-column:span 12}

.card{
  position:relative;padding:1.15rem 1.25rem;
  background:var(--ink);border:1px solid var(--slate);border-radius:var(--radius);
  transition:transform var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease);
}
.card:hover{transform:translateY(-2px);border-color:var(--cyan);box-shadow:0 8px 24px -18px rgba(43,231,224,.6)}
.card__label{
  font-family:var(--font-mono);font-size:.6875rem;
  letter-spacing:.16em;color:var(--cyan);text-transform:uppercase;
}
.card__title{margin-top:.45rem;font-size:var(--fs-22);font-weight:900;letter-spacing:-.01em;line-height:1.3}
.card__meta{margin-top:.55rem;font-size:var(--fs-14);color:var(--muted)}

.tag{
  display:inline-block;padding:.18rem .5rem;border:1px solid var(--rule);border-radius:var(--radius);
  font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.08em;color:var(--muted);
}
.tag--cyan{border-color:rgba(43,231,224,.42);color:var(--cyan)}
.tag--orange{border-color:var(--orange-deep);color:var(--orange)}

.stat{display:grid;gap:.3rem}
.stat__value{
  font-family:var(--font-cond);font-weight:700;
  font-size:clamp(2.5rem,6vw,var(--fs-72));
  line-height:.92;letter-spacing:-.01em;color:var(--text);
}
.stat__label{
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.14em;color:var(--muted);
}

.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{
  padding:.4rem .7rem;border:1px solid var(--slate);border-radius:var(--radius);
  font-family:var(--font-mono);font-size:var(--fs-12);letter-spacing:.06em;color:var(--muted);
  transition:color var(--t-mid) var(--ease),border-color var(--t-mid) var(--ease),background-color var(--t-mid) var(--ease);
}
.chip:hover{color:var(--cyan-soft);border-color:var(--cyan)}
.chip[aria-pressed="true"]{background:var(--cyan);border-color:var(--cyan);color:#04121A;font-weight:700}

.rail{position:relative;padding-left:1.6rem;border-left:1px solid var(--rule)}
.rail__item{position:relative;padding-bottom:1.6rem}
.rail__item::before{
  content:"";position:absolute;left:-1.6rem;top:.6rem;
  width:9px;height:9px;border-radius:50%;transform:translateX(-50%);
  background:var(--bg);border:1px solid var(--rule);
}
.rail__item--done::before{background:var(--cyan);border-color:var(--cyan)}

.heat{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;
  padding:6px;background:var(--ink);border:1px solid var(--slate);border-radius:var(--radius);
}
.heat__cell{
  aspect-ratio:1/1;display:grid;place-items:center;
  border:1px solid rgba(43,231,224,.16);
  font-family:var(--font-mono);font-size:var(--fs-12);color:#2A1405;
}
.heat--l1{background:rgba(255,208,138,.22)}
.heat--l2{background:rgba(255,208,138,.45)}
.heat--l3{background:rgba(255,158,77,.65)}
.heat--l4{background:rgba(232,93,42,.8);color:#1B0900}
.heat--l5{background:rgba(232,93,42,.96);color:#1B0900}

.index-panel{
  position:relative;padding:1.2rem 1.25rem;
  background:var(--ink);border:1px solid var(--slate);border-radius:var(--radius);
}
.index-panel__title{
  padding-bottom:.65rem;margin-bottom:.85rem;
  border-bottom:1px solid var(--slate);
  font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.16em;color:var(--cyan);text-transform:uppercase;
}
.index-panel__list li{
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding:.45rem 0;font-size:.9375rem;
  border-bottom:1px dashed rgba(74,107,138,.35);
}
.index-panel__list li:last-child{border-bottom:0}
.index-panel__list a{transition:color var(--t-fast) var(--ease)}
.index-panel__list a:hover{color:var(--cyan)}
.index-panel__count{font-family:var(--font-mono);font-size:var(--fs-12);color:var(--rule)}

/* 图片占位容器 */
.figure{margin:0}
.figure__media{
  position:relative;overflow:hidden;aspect-ratio:4/5;
  background:linear-gradient(158deg,var(--ink) 0%,#0E1728 100%);
  border:1px solid var(--slate);border-radius:var(--radius);
}
.figure__media img{width:100%;height:100%;object-fit:cover}
.figure__mask{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(43,231,224,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(43,231,224,.13) 1px,transparent 1px);
  background-size:32px 32px;
}
.figure--portrait .figure__media::after{
  content:"";position:absolute;inset:auto 0 0 0;height:46%;
  background:linear-gradient(180deg,transparent,rgba(5,7,14,.92));
}
.figure--square .figure__media{aspect-ratio:1/1}
.figure--wide .figure__media{aspect-ratio:16/9}
.figure--pitch .figure__media{aspect-ratio:3/2;background:linear-gradient(180deg,#0A1220,#060B14)}
.figure__cap{
  margin-top:.6rem;font-family:var(--font-mono);font-size:var(--fs-12);
  letter-spacing:.06em;color:var(--muted);
}

/* ---------- 8. 动效 ---------- */
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes nav-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.is-pulse{animation:pulse 2.4s ease-in-out infinite}
html.js [data-reveal]{
  opacity:0;transform:translateY(14px);
  transition:opacity .5s var(--ease),transform .5s var(--ease);
}
html.js [data-reveal].is-in{opacity:1;transform:none}

/* ---------- 9. 响应式 ---------- */
@media (max-width:1024px){
  .grid--12{grid-template-columns:repeat(6,minmax(0,1fr))}
  .span-3,.span-4,.span-5{grid-column:span 6}
  .span-7,.span-8{grid-column:span 6}
  .footer__inner{grid-template-columns:1fr;gap:2.25rem}
  .footer__nav{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .nav-toggle{display:inline-flex}
  .masthead__stamp{display:none}
  .site-nav{display:none}
  .site-nav[data-open]{
    display:block;background:var(--ink);
    border-top:1px solid var(--slate);
    animation:nav-in var(--t-fast) var(--ease);
  }
  .site-nav__list{flex-direction:column;flex-wrap:nowrap;padding:.4rem 0 1rem;gap:0}
  .site-nav__link{
    padding:.85rem 1.25rem;border:0;border-bottom:1px solid #131C2C;border-radius:0;
  }
  .site-nav__link[aria-current="page"]{background:rgba(43,231,224,.08)}
  .site-nav__link[aria-current="page"]::before{left:0;top:50%;width:3px;height:20px;transform:translateY(-50%)}
  .utility__search{min-width:100%;justify-content:center}
}
@media (max-width:760px){
  body{font-size:1rem}
  .wrap{width:min(var(--wrap),100% - 1.75rem)}
  .masthead{grid-template-columns:auto 1fr auto;padding-block:1rem .75rem}
  .brand__mark{width:36px;height:36px;font-size:1.25rem}
  .brand__sub{letter-spacing:.1em}
  .masthead__cta{padding:.55rem .75rem;font-size:.75rem}
  .footer__nav{grid-template-columns:1fr 1fr}
  .footer__bottom{flex-direction:column;align-items:flex-start}
  .section{padding-block:2.5rem}
}
@media (max-width:520px){
  .header__utility-inner{justify-content:center}
  .utility__stamp{width:100%;justify-content:center}
  .utility__list{width:100%;justify-content:center}
  .brand{flex-direction:column;gap:.45rem;text-align:center}
  .brand__sub{margin-top:.2rem}
  .footer__nav{grid-template-columns:1fr}
}

/* ---------- 10. 减弱动效 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .is-pulse,.masthead__stamp-dot{animation:none}
  html.js [data-reveal]{opacity:1;transform:none}
  .btn:hover,.card:hover,.footer__link:hover{transform:none}
}