/* ============================================================
   盈嘉体育赛事 · 全站共享样式 /assets/site.css
   视觉体系：夜场转播控制室 —— 墨绿底 / 荧光青绿焦点 / 琥珀金标价
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root{
  --yj-night:#0C1E18;
  --yj-turf:#16332A;
  --yj-turf-deep:#0A1814;
  --yj-mint:#39F2B4;
  --yj-amber:#F0B542;
  --yj-volt:#5B6CFF;
  --yj-violet:#9A5CFF;
  --yj-slate:#8A978F;
  --yj-bone:#F4F0E6;
  --yj-clay:#B96A4B;
  --yj-mist:#C9E8DD;

  --yj-ink:#F4F0E6;
  --yj-muted:#8A978F;
  --yj-line:rgba(138,151,143,.22);
  --yj-line-mint:rgba(57,242,180,.38);
  --yj-panel:rgba(22,51,42,.72);

  --yj-font-body:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --yj-font-serif:"Noto Serif SC","Source Han Serif SC","Songti SC",Georgia,serif;
  --yj-font-mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --yj-font-squeeze:"Noto Sans SC","PingFang SC","Heiti SC",system-ui,sans-serif;

  --yj-r-sm:12px;
  --yj-r-md:20px;
  --yj-r-lg:36px;
  --yj-cap:999px;

  --yj-ease:cubic-bezier(.22,.61,.36,1);
  --yj-head:74px;
}

/* ---------- 2. 重置与基础排版 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth}
}
body{
  margin:0;
  background:
    radial-gradient(1100px 520px at 78% -8%, rgba(57,242,180,.10), transparent 62%),
    radial-gradient(900px 480px at 4% 3%, rgba(91,108,255,.10), transparent 60%),
    var(--yj-night);
  color:var(--yj-ink);
  font-family:var(--yj-font-body);
  font-size:17px;
  line-height:1.75;
  letter-spacing:.01em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none;margin:0;padding:0}
h1,h2,h3,h4,h5,p,figure,blockquote{margin:0}
:focus-visible{outline:2px solid var(--yj-mint);outline-offset:3px;border-radius:6px}
::selection{background:rgba(57,242,180,.3);color:var(--yj-bone)}

.yj-shell{
  width:100%;
  max-width:1400px;
  margin-inline:auto;
  padding-inline:clamp(1.15rem,4vw,3rem);
}
.yj-sr{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ---------- 3. 跳转链接 ---------- */
.yj-skip{
  position:absolute;left:1rem;top:-4.5rem;z-index:200;
  display:inline-flex;align-items:center;
  padding:.6rem 1.15rem;border-radius:var(--yj-cap);
  background:var(--yj-mint);color:#05231A;
  font-size:.9rem;font-weight:600;
  transition:top .22s var(--yj-ease);
}
.yj-skip:focus{top:.9rem}

/* ---------- 4. 页头 ---------- */
.yj-header{
  position:sticky;top:0;z-index:120;
  background:rgba(12,30,24,.84);
  border-bottom:1px solid var(--yj-line);
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  transition:background .3s var(--yj-ease);
}
.yj-header__rail{
  display:flex;
  align-items:center;
  gap:clamp(.9rem,2vw,2.2rem);
  min-height:var(--yj-head);
  padding-block:.7rem;
  transition:min-height .3s var(--yj-ease);
}
.yj-header[data-scrolled]{background:rgba(9,22,18,.95)}
.yj-header[data-scrolled] .yj-header__rail{min-height:62px}

.yj-brand{display:inline-flex;align-items:center;gap:.7rem;flex:0 0 auto}
.yj-brand__mark{
  position:relative;width:28px;height:28px;flex:0 0 auto;border-radius:9px;
  background:conic-gradient(from 150deg,var(--yj-mint),var(--yj-volt) 52%,var(--yj-violet) 100%);
}
.yj-brand__mark::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--yj-night)}
.yj-brand__mark::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--yj-amber)}
.yj-brand__type{display:flex;flex-direction:column;line-height:1.18}
.yj-brand__name{
  font-family:var(--yj-font-squeeze);
  font-weight:800;font-size:1.05rem;letter-spacing:.02em;color:var(--yj-bone);
}
.yj-brand__note{
  font-family:var(--yj-font-mono);
  font-size:.64rem;letter-spacing:.14em;color:var(--yj-slate);margin-top:.15rem;
}

.yj-nav{flex:1 1 auto;min-width:0}
.yj-nav__list{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(.5rem,1.6vw,1.5rem)}
.yj-nav__link{
  position:relative;display:inline-block;
  padding:.45rem .1rem;
  font-size:.94rem;color:var(--yj-mist);
  transition:color .24s var(--yj-ease);
}
.yj-nav__link::after{
  content:"";position:absolute;left:0;right:100%;bottom:.12rem;height:2px;
  background:linear-gradient(90deg,var(--yj-mint),var(--yj-volt));
  transition:right .3s var(--yj-ease);
}
.yj-nav__link:hover{color:var(--yj-bone)}
.yj-nav__link:hover::after,
.yj-nav__link[aria-current="page"]::after{right:0}
.yj-nav__link[aria-current="page"]{color:var(--yj-mint)}

.yj-util{display:flex;align-items:center;gap:.6rem;flex:0 0 auto}
.yj-pill{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.5rem 1.15rem;border-radius:var(--yj-cap);
  border:1px solid transparent;
  background:var(--yj-mint);color:#05231A;
  font-size:.88rem;font-weight:600;white-space:nowrap;
  transition:transform .24s var(--yj-ease),box-shadow .24s var(--yj-ease),color .24s,border-color .24s,background .24s;
}
.yj-pill:hover{transform:translateY(-2px);box-shadow:0 14px 30px -16px rgba(57,242,180,.9)}
.yj-pill--ghost{background:transparent;border-color:var(--yj-line);color:var(--yj-mist)}
.yj-pill--ghost:hover{border-color:var(--yj-mint);color:var(--yj-bone);box-shadow:none}

.yj-nav-toggle{
  display:none;align-items:center;gap:.55rem;
  padding:.45rem .9rem;border-radius:var(--yj-cap);
  border:1px solid var(--yj-line);color:var(--yj-mist);
  transition:border-color .24s,color .24s;
}
.yj-nav-toggle:hover{border-color:var(--yj-mint);color:var(--yj-bone)}
.yj-nav-toggle__bars{display:grid;gap:4px;width:16px}
.yj-nav-toggle__bars i{
  display:block;height:2px;border-radius:2px;background:currentColor;
  transition:transform .26s var(--yj-ease);
}
.yj-nav-toggle[aria-expanded="true"] .yj-nav-toggle__bars i:first-child{transform:translateY(3px) rotate(45deg)}
.yj-nav-toggle[aria-expanded="true"] .yj-nav-toggle__bars i:last-child{transform:translateY(-3px) rotate(-45deg)}
.yj-nav-toggle__text{font-size:.86rem}

.yj-header__progress{
  position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:rgba(138,151,143,.16);pointer-events:none;
}
.yj-header__progress span{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--yj-volt),var(--yj-mint));
  transition:width .12s linear;
}

/* ---------- 5. 通用组件 ---------- */
.yj-main{display:block;min-height:50vh}
.yj-section{padding-block:clamp(3rem,8vw,6.5rem)}
.yj-section--tight{padding-block:clamp(1.6rem,4vw,3rem)}

.yj-eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--yj-font-mono);font-size:.72rem;
  letter-spacing:.26em;text-transform:uppercase;color:var(--yj-mint);
}
.yj-eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.7}

.yj-title{
  font-family:var(--yj-font-serif);font-weight:600;
  font-size:clamp(1.7rem,4.4vw,3rem);line-height:1.24;
  letter-spacing:.01em;color:var(--yj-bone);
}
.yj-display{
  font-family:var(--yj-font-squeeze);font-weight:900;
  font-size:clamp(2.4rem,8vw,6rem);line-height:.96;
  letter-spacing:-.02em;color:var(--yj-bone);
}
.yj-display--nums{font-family:var(--yj-font-mono);font-weight:700;font-variant-numeric:tabular-nums}
.yj-lede{max-width:62ch;color:var(--yj-muted);font-size:1.02rem}

.yj-grid{display:grid;gap:clamp(1rem,2.4vw,1.8rem)}
.yj-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.yj-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.yj-grid--split{grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr)}

.yj-card{
  position:relative;
  padding:clamp(1.1rem,2.2vw,1.7rem);
  border:1px solid var(--yj-line);
  border-radius:var(--yj-r-md);
  background:var(--yj-panel);
}
.yj-card--slab{border-radius:var(--yj-r-lg)}
.yj-card--mint{border-color:var(--yj-line-mint)}
.yj-card--amber{border-color:rgba(240,181,66,.42)}

.yj-stat{display:flex;flex-direction:column;gap:.25rem}
.yj-stat__value{
  font-family:var(--yj-font-mono);font-weight:700;
  font-size:clamp(2.1rem,6vw,4.2rem);line-height:1;
  color:var(--yj-mint);font-variant-numeric:tabular-nums;
}
.yj-stat__value--amber{color:var(--yj-amber)}
.yj-stat__label{
  font-family:var(--yj-font-mono);font-size:.7rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--yj-slate);
}

.yj-tag{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.22rem .75rem;border-radius:var(--yj-cap);
  border:1px solid var(--yj-line);background:rgba(201,232,221,.05);
  font-size:.76rem;letter-spacing:.06em;color:var(--yj-mist);
}
.yj-tag--amber{border-color:rgba(240,181,66,.5);color:var(--yj-amber)}
.yj-tag--clay{border-color:rgba(185,106,75,.55);color:#E1A489}
.yj-tag--volt{border-color:rgba(91,108,255,.5);color:#B7C0FF}

.yj-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.8rem 1.6rem;border-radius:var(--yj-cap);
  border:1px solid transparent;background:var(--yj-mint);color:#05231A;
  font-size:.95rem;font-weight:600;
  transition:transform .25s var(--yj-ease),box-shadow .25s var(--yj-ease),background .25s,color .25s,border-color .25s;
}
.yj-btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -18px rgba(57,242,180,.9)}
.yj-btn--ghost{background:transparent;border-color:var(--yj-line);color:var(--yj-bone)}
.yj-btn--ghost:hover{border-color:var(--yj-mint);color:var(--yj-mint);box-shadow:none}
.yj-btn--amber{background:var(--yj-amber);color:#2A1A02}
.yj-btn--amber:hover{box-shadow:0 16px 34px -18px rgba(240,181,66,.9)}
.yj-btn--sm{padding:.5rem 1.1rem;font-size:.86rem}

.yj-crumb{padding-top:1.4rem;font-size:.84rem;color:var(--yj-slate)}
.yj-crumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem}
.yj-crumb li{display:flex;align-items:center;gap:.55rem}
.yj-crumb li+li::before{content:"/";color:rgba(138,151,143,.5)}
.yj-crumb a{color:var(--yj-mist);transition:color .2s}
.yj-crumb a:hover{color:var(--yj-mint)}
.yj-crumb [aria-current="page"]{color:var(--yj-mint)}

.yj-index{border-top:1px solid var(--yj-line)}
.yj-index__item{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  gap:1rem;align-items:baseline;
  padding:.95rem 0;border-bottom:1px solid var(--yj-line);
  transition:background .25s var(--yj-ease),padding-left .25s var(--yj-ease);
}
.yj-index__item:hover{background:rgba(57,242,180,.05);padding-left:.6rem}
.yj-index__num{font-family:var(--yj-font-mono);font-size:.8rem;letter-spacing:.08em;color:var(--yj-amber)}
.yj-index__text{color:var(--yj-bone)}
.yj-index__meta{font-family:var(--yj-font-mono);font-size:.78rem;color:var(--yj-slate)}

.yj-rule{height:1px;border:0;margin-block:clamp(1.6rem,4vw,3rem);background:linear-gradient(90deg,transparent,var(--yj-line),transparent)}
.yj-gauge{
  height:9px;
  background-image:repeating-linear-gradient(90deg,rgba(138,151,143,.45) 0 1px,transparent 1px 16px);
  -webkit-mask-image:linear-gradient(90deg,#000,transparent);
  mask-image:linear-gradient(90deg,#000,transparent);
}

.yj-media{
  position:relative;overflow:hidden;
  border:1px solid var(--yj-line);border-radius:var(--yj-r-lg);
  background:linear-gradient(150deg,var(--yj-turf),var(--yj-turf-deep));
}
.yj-media__inner{
  position:relative;aspect-ratio:16/9;
  background:
    radial-gradient(120% 120% at 20% 8%, rgba(57,242,180,.16), transparent 62%),
    repeating-linear-gradient(90deg, rgba(138,151,143,.12) 0 1px, transparent 1px 28px);
}
.yj-media--wide .yj-media__inner{aspect-ratio:21/9}
.yj-media--portrait .yj-media__inner{aspect-ratio:4/5}
.yj-media__inner img{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.04)}
.yj-media__stamp{
  position:absolute;left:1rem;bottom:1rem;z-index:2;
  padding:.28rem .72rem;border-radius:var(--yj-cap);
  border:1px solid var(--yj-line);
  background:rgba(12,30,24,.72);
  font-family:var(--yj-font-mono);font-size:.7rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--yj-mist);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}

/* ---------- 6. 页脚 ---------- */
.yj-footer{
  position:relative;
  margin-top:clamp(3rem,8vw,7rem);
  border-top:1px solid var(--yj-line);
  background:linear-gradient(180deg,var(--yj-turf) 0%,var(--yj-turf-deep) 100%);
  color:var(--yj-muted);font-size:.94rem;
}
.yj-footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:8px;
  background-image:repeating-linear-gradient(90deg,rgba(57,242,180,.42) 0 1px,transparent 1px 16px);
  -webkit-mask-image:linear-gradient(90deg,#000,transparent);
  mask-image:linear-gradient(90deg,#000,transparent);
  pointer-events:none;
}
.yj-footer__top{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1.85fr);
  gap:clamp(1.6rem,4vw,3.5rem);
  padding-block:clamp(2.6rem,6vw,4.4rem) clamp(1.6rem,3vw,2.4rem);
}
.yj-footer__brand{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem}
.yj-footer__name{
  font-family:var(--yj-font-serif);font-weight:600;
  font-size:1.25rem;color:var(--yj-bone);letter-spacing:.02em;
}
.yj-footer__claim{max-width:34ch;color:var(--yj-mist);opacity:.86;line-height:1.8}
.yj-footer__nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.5vw,2rem)}
.yj-footer__col-title{
  margin-bottom:.85rem;
  font-family:var(--yj-font-mono);font-size:.7rem;
  font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--yj-amber);
}
.yj-footer__list{display:grid;gap:.55rem}
.yj-footer__link{color:var(--yj-mist);transition:color .2s var(--yj-ease),padding-left .2s var(--yj-ease)}
.yj-footer__link:hover{color:var(--yj-mint);padding-left:.28rem}
.yj-footer__base{
  display:flex;flex-wrap:wrap;justify-content:space-between;
  gap:1rem 2.5rem;align-items:flex-start;
  padding-block:clamp(1.2rem,3vw,1.9rem);
  border-top:1px solid var(--yj-line);
}
.yj-footer__contact{display:grid;gap:.5rem;font-size:.9rem;line-height:1.7}
.yj-footer__contact li{max-width:52ch;word-break:break-word}
.yj-footer__key{
  display:inline-block;min-width:5.2rem;margin-right:.55rem;
  font-family:var(--yj-font-mono);font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--yj-slate);
}
.yj-footer__legal{
  display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;
  font-size:.84rem;text-align:right;color:var(--yj-slate);
}

/* ---------- 7. 动效协议 ---------- */
html[data-motion="on"] [data-reveal]{
  opacity:0;transform:translateY(20px);
  transition:opacity .72s var(--yj-ease),transform .72s var(--yj-ease);
}
html[data-motion="on"] [data-reveal].is-in{opacity:1;transform:none}
html[data-motion="on"] [data-reveal][data-step="1"]{transition-delay:.06s}
html[data-motion="on"] [data-reveal][data-step="2"]{transition-delay:.12s}
html[data-motion="on"] [data-reveal][data-step="3"]{transition-delay:.18s}
html[data-motion="on"] [data-reveal][data-step="4"]{transition-delay:.24s}
html[data-motion="on"] [data-reveal][data-step="5"]{transition-delay:.3s}

/* ---------- 8. 响应式 ---------- */
@media (max-width:1080px){
  .yj-nav__list{gap:.9rem}
  .yj-nav__link{font-size:.9rem}
}
@media (max-width:900px){
  .yj-header__rail{flex-wrap:nowrap;justify-content:space-between}
  .yj-brand{order:1}
  .yj-util{order:2;margin-left:auto}
  .yj-nav-toggle{order:3;display:inline-flex}
  .yj-brand__note{display:none}

  .yj-nav{
    position:absolute;left:0;right:0;top:100%;
    padding:1rem clamp(1.15rem,4vw,3rem) 1.6rem;
    border-top:1px solid var(--yj-line);
    border-bottom:1px solid var(--yj-line);
    background:linear-gradient(180deg,rgba(22,51,42,.98),rgba(10,24,20,.99));
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .28s var(--yj-ease),transform .28s var(--yj-ease),visibility .28s;
    max-height:calc(100vh - var(--yj-head));
    overflow-y:auto;
  }
  .yj-nav[data-open]{opacity:1;visibility:visible;transform:none}
  .yj-nav__list{flex-direction:column;align-items:stretch;gap:0}
  .yj-nav__link{display:block;padding:.85rem .2rem;font-size:1rem;border-bottom:1px solid var(--yj-line)}
  .yj-nav__link::after{display:none}
  .yj-nav__link[aria-current="page"]{
    padding-left:.8rem;border-left:2px solid var(--yj-mint);color:var(--yj-mint);
  }

  .yj-grid--split,.yj-grid--2,.yj-grid--3{grid-template-columns:minmax(0,1fr)}
  .yj-footer__top{grid-template-columns:minmax(0,1fr)}
  .yj-footer__base{flex-direction:column;align-items:flex-start}
  .yj-footer__legal{align-items:flex-start;text-align:left}
}
@media (max-width:600px){
  body{font-size:16px}
  .yj-util .yj-pill--ghost{display:none}
  .yj-footer__nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yj-footer__key{display:block;min-width:0;margin-right:0;margin-bottom:.15rem}
}

/* ---------- 9. 减少动效 ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  html[data-motion="on"] [data-reveal]{opacity:1 !important;transform:none !important}
  .yj-pill:hover,.yj-btn:hover,.yj-nav__link:hover{transform:none}
}