/* ============================================================
   优博体育赛场 · 全站共享样式  /assets/site.css
   夜间战术板：炭黑 + 深墨绿基底，荧光青柠 / 高饱和橙 / 电光蓝
   ============================================================ */

/* ---------- 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, hr { margin: 0; }

ul, ol { list-style: none; padding: 0; }

img, svg, video { display: block; max-width: 100%; }

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

a { color: inherit; text-decoration: none; }

table { border-collapse: collapse; }

hr { border: 0; border-top: 1px solid var(--yb-wire); }

/* ---------- tokens ---------- */
:root {
  --yb-charcoal: #101412;
  --yb-deep: #0B1F1A;
  --yb-slate: #16261F;
  --yb-wire: #2E4038;
  --yb-lime: #C8FF3D;
  --yb-orange: #FF6A1F;
  --yb-blue: #35D0FF;
  --yb-amber: #FFC24B;
  --yb-paper: #F3F5EE;
  --yb-mute: #8FA39A;
  --yb-ink: #CBDBD2;

  --yb-rail-w: 224px;
  --yb-bar-h: 76px;

  --yb-r-s: 12px;
  --yb-r-l: 20px;
  --yb-cut-s: 10px;

  --yb-font-display: "Arial Narrow", "Helvetica Neue Condensed", "PingFang SC", "Microsoft YaHei", sans-serif;
  --yb-font-editorial: Georgia, "Songti SC", "SimSun", "Noto Serif SC", serif;
  --yb-font-data: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
  --yb-font-body: system-ui, -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;

  --yb-ease: cubic-bezier(.2, .7, .3, 1);
  --yb-shadow: 0 14px 34px rgba(0, 0, 0, .38);
}

/* ---------- 中文排版与页面基底 ---------- */
body {
  min-height: 100vh;
  padding-left: var(--yb-rail-w);
  padding-top: var(--yb-bar-h);
  font-family: var(--yb-font-body);
  font-size: 16px;
  line-height: 1.75;
  color: var(--yb-paper);
  letter-spacing: .01em;
  background-color: var(--yb-deep);
  background-image:
    radial-gradient(1200px 620px at 82% -12%, rgba(200, 255, 61, .07), transparent 62%),
    radial-gradient(900px 520px at -8% 24%, rgba(53, 208, 255, .06), transparent 60%),
    linear-gradient(180deg, #0B1F1A 0%, #101412 48%, #0B1F1A 100%);
}

p { line-height: 1.75; }

strong, b { font-weight: 700; }

:focus-visible {
  outline: 2px solid var(--yb-lime);
  outline-offset: 2px;
}

/* ---------- 跳转链接 ---------- */
.yb-skip {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 300;
  padding: 11px 18px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--yb-charcoal);
  background: var(--yb-lime);
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  transform: translateY(-220%);
  transition: transform .16s var(--yb-ease);
}
.yb-skip:focus { transform: none; }

/* ---------- 头部框架 ---------- */
.yb-header { position: relative; z-index: 100; }

.yb-header__rail {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: var(--yb-rail-w);
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 26px 22px 24px;
  background-image: linear-gradient(180deg, #0B1F1A 0%, #101412 58%, #0B1F1A 100%);
  border-right: 1px solid var(--yb-wire);
  z-index: 120;
}

.yb-header__rail::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 14%;
  width: 1px;
  height: 24%;
  background: linear-gradient(180deg, transparent, var(--yb-lime), transparent);
  opacity: .7;
}

/* 品牌 */
.yb-brand {
  display: flex;
  align-items: center;
  gap: 11px;
}

.yb-brand__mark {
  display: grid;
  gap: 3px;
  width: 26px;
  flex: none;
}
.yb-brand__mark i {
  display: block;
  height: 4px;
  background: var(--yb-lime);
  transform: skewX(-24deg);
}
.yb-brand__mark i:nth-child(2) { width: 78%; background: var(--yb-orange); }
.yb-brand__mark i:nth-child(3) { width: 56%; background: var(--yb-blue); }

.yb-brand__type {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.15;
}
.yb-brand__name {
  font-family: var(--yb-font-display);
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .07em;
  color: var(--yb-paper);
}
.yb-brand__sub {
  font-family: var(--yb-font-data);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--yb-mute);
}

/* 导航轨道 */
.yb-nav { flex: 1 1 auto; min-height: 0; }

.yb-nav__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 14px;
  border-top: 1px solid var(--yb-wire);
}

.yb-nav__item { display: block; }

.yb-nav__link {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 12px;
  border-left: 2px solid transparent;
  font-size: 14px;
  color: var(--yb-mute);
  transition: color .16s var(--yb-ease), background .16s var(--yb-ease), border-color .16s var(--yb-ease);
}
.yb-nav__link:hover {
  color: var(--yb-paper);
  border-left-color: var(--yb-blue);
  background: rgba(53, 208, 255, .07);
}
.yb-nav__link[aria-current="page"] {
  color: var(--yb-paper);
  border-left-color: var(--yb-lime);
  background: linear-gradient(90deg, rgba(200, 255, 61, .16), rgba(200, 255, 61, 0));
}

.yb-nav__idx {
  font-family: var(--yb-font-data);
  font-size: 11px;
  letter-spacing: .1em;
  color: #4C6A5E;
  transition: color .16s var(--yb-ease);
}
.yb-nav__link[aria-current="page"] .yb-nav__idx { color: var(--yb-lime); }

.yb-nav__text { display: inline-block; }

/* 轨道底部注记 */
.yb-rail__note {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--yb-font-data);
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--yb-lime);
}

.yb-flag {
  display: inline-block;
  width: 9px;
  height: 11px;
  flex: none;
  background: var(--yb-lime);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 72%, 0 100%);
}

.yb-rail__link {
  align-self: flex-start;
  font-size: 12.5px;
  color: var(--yb-mute);
  padding-bottom: 2px;
  border-bottom: 1px solid var(--yb-wire);
  transition: color .16s var(--yb-ease), border-color .16s var(--yb-ease);
}
.yb-rail__link:hover { color: var(--yb-lime); border-bottom-color: var(--yb-lime); }

/* 顶部轮次条 */
.yb-header__bar {
  position: fixed;
  top: 0;
  left: var(--yb-rail-w);
  right: 0;
  height: var(--yb-bar-h);
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 22px;
  background: rgba(16, 20, 18, .94);
  border-bottom: 1px solid var(--yb-wire);
  backdrop-filter: blur(8px);
  z-index: 130;
}

.yb-header__bar::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: min(340px, 42%);
  height: 1px;
  background: linear-gradient(90deg, var(--yb-lime), rgba(200, 255, 61, 0));
}

.yb-rounds {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.yb-rounds::-webkit-scrollbar { display: none; }

.yb-bar__seg {
  flex: none;
  padding-right: 10px;
  margin-right: 2px;
  border-right: 1px solid var(--yb-wire);
  font-family: var(--yb-font-data);
  font-size: 10px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--yb-mute);
  white-space: nowrap;
}

.yb-round {
  flex: none;
  padding: 7px 11px;
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--yb-mute);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  transition: color .16s var(--yb-ease), background .16s var(--yb-ease), border-color .16s var(--yb-ease);
}
.yb-round:hover { color: var(--yb-paper); border-color: var(--yb-blue); }
.yb-round[aria-pressed="true"] {
  color: var(--yb-charcoal);
  background: var(--yb-lime);
  border-color: var(--yb-lime);
  font-weight: 700;
}

.yb-bar__readout {
  flex: none;
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--yb-mute);
  white-space: nowrap;
  transition: opacity .16s var(--yb-ease), transform .16s var(--yb-ease);
}
.yb-bar__readout[data-swap] {
  opacity: 0;
  transform: translateY(-4px);
}

.yb-bar__utils {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-left: auto;
}

.yb-util {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 1px;
  font-size: 12.5px;
  letter-spacing: .06em;
  color: var(--yb-mute);
  border-bottom: 1px solid transparent;
  transition: color .16s var(--yb-ease), border-color .16s var(--yb-ease);
}
.yb-util:hover { color: var(--yb-blue); border-bottom-color: var(--yb-blue); }
.yb-util--accent { color: var(--yb-lime); }
.yb-util--accent:hover { color: var(--yb-lime); border-bottom-color: var(--yb-lime); }

/* 通用切角按钮 */
.yb-cta,
.yb-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  color: #140A02;
  background: var(--yb-orange);
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  transition: transform .16s var(--yb-ease), box-shadow .16s var(--yb-ease), background .16s var(--yb-ease);
}
.yb-cta:hover,
.yb-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(255, 106, 31, .28);
  background: #FF7C39;
}

.yb-btn--lime { background: var(--yb-lime); color: var(--yb-charcoal); }
.yb-btn--lime:hover { background: #D6FF6B; box-shadow: 0 12px 26px rgba(200, 255, 61, .22); }

.yb-btn--ghost {
  background: transparent;
  color: var(--yb-paper);
  border: 1px solid var(--yb-wire);
}
.yb-btn--ghost:hover {
  background: transparent;
  color: var(--yb-lime);
  border-color: var(--yb-lime);
  box-shadow: none;
}

/* 移动端抽屉按钮 */
.yb-burger {
  display: none;
  align-items: center;
  gap: 9px;
  padding: 9px 12px;
  color: var(--yb-paper);
  border: 1px solid var(--yb-wire);
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .16em;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  transition: border-color .16s var(--yb-ease), color .16s var(--yb-ease);
}
.yb-burger:hover { border-color: var(--yb-lime); color: var(--yb-lime); }

.yb-burger__bars { display: grid; gap: 4px; width: 16px; flex: none; }
.yb-burger__bars i {
  display: block;
  height: 2px;
  background: var(--yb-lime);
  transition: transform .16s var(--yb-ease), opacity .16s var(--yb-ease);
}

.yb-burger__text { display: inline-block; }

.yb-header[data-open] .yb-burger__bars i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.yb-header[data-open] .yb-burger__bars i:nth-child(2) { opacity: 0; }
.yb-header[data-open] .yb-burger__bars i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- 页脚 ---------- */
.yb-footer {
  position: relative;
  margin-top: 88px;
  padding: 58px 26px 28px;
  border-top: 1px solid var(--yb-wire);
  background-image:
    linear-gradient(180deg, #0B1F1A 0%, #101412 100%);
}
.yb-footer::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 26px;
  width: 190px;
  height: 2px;
  background: linear-gradient(90deg, var(--yb-lime), rgba(200, 255, 61, 0));
}
.yb-footer::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 220px;
  height: 100%;
  background: linear-gradient(215deg, rgba(53, 208, 255, .05), transparent 62%);
  pointer-events: none;
}

.yb-footer__grid {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.5fr .85fr .85fr .75fr 1.35fr;
  gap: 34px 28px;
}

.yb-footer__brand { min-width: 0; }
.yb-brand--footer { margin-bottom: 16px; }

.yb-footer__line {
  max-width: 34ch;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--yb-mute);
}

.yb-tagrow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.yb-tag {
  padding: 4px 9px;
  font-family: var(--yb-font-data);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--yb-mute);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(5px 0, 100% 0, 100% 100%, 0 100%, 0 5px);
}

.yb-footer__col { min-width: 0; }

.yb-footer__title {
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--yb-wire);
  font-family: var(--yb-font-data);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--yb-mute);
}

.yb-footer__list { display: grid; gap: 9px; }

.yb-footer__link {
  display: inline-block;
  font-size: 14px;
  color: var(--yb-ink);
  transition: color .16s var(--yb-ease), padding-left .16s var(--yb-ease);
}
.yb-footer__link:hover { color: var(--yb-lime); padding-left: 4px; }

.yb-footer__contact { min-width: 0; }
.yb-footer__list--contact { gap: 12px; }

.yb-footer__contact-item { display: grid; gap: 2px; }

.yb-footer__k {
  font-family: var(--yb-font-data);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--yb-mute);
}

.yb-footer__v {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--yb-ink);
}
.yb-footer__v--data {
  font-family: var(--yb-font-data);
  letter-spacing: .03em;
  color: var(--yb-paper);
}

.yb-footer__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--yb-lime);
  border: 1px solid rgba(200, 255, 61, .5);
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  transition: background .16s var(--yb-ease), color .16s var(--yb-ease), transform .16s var(--yb-ease);
}
.yb-footer__cta:hover {
  background: var(--yb-lime);
  color: var(--yb-charcoal);
  transform: translateY(-2px);
}

.yb-footer__base {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 46px auto 0;
  padding-top: 18px;
  border-top: 1px solid var(--yb-wire);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 26px;
  font-size: 12px;
  color: var(--yb-mute);
}

.yb-footer__legal {
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--yb-mute);
}

.yb-footer__meta { flex: 1 1 260px; font-size: 12px; color: var(--yb-mute); }

/* ---------- 页面通用件 ---------- */
.yb-main { display: block; }

.yb-container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 26px;
}

.yb-section { padding: 56px 0; }
.yb-section--tight { padding: 30px 0; }

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

.yb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 12px;
  font-family: var(--yb-font-data);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--yb-lime);
}
.yb-eyebrow::before {
  content: "";
  width: 22px;
  height: 1px;
  background: var(--yb-lime);
}

.yb-display {
  font-family: var(--yb-font-display);
  font-size: clamp(38px, 7vw, 84px);
  font-weight: 800;
  line-height: .95;
  letter-spacing: .015em;
  text-transform: uppercase;
  color: var(--yb-paper);
}

.yb-h2 {
  font-family: var(--yb-font-display);
  font-size: clamp(24px, 3.2vw, 38px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: .02em;
  color: var(--yb-paper);
}

.yb-h3 {
  font-family: var(--yb-font-body);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--yb-paper);
}

.yb-lede {
  max-width: 62ch;
  font-size: 16.5px;
  line-height: 1.8;
  color: var(--yb-ink);
}

.yb-editorial {
  font-family: var(--yb-font-editorial);
  font-size: 16px;
  line-height: 1.9;
  color: var(--yb-ink);
}

.yb-data {
  font-family: var(--yb-font-data);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}

.yb-tone-lime { color: var(--yb-lime); }
.yb-tone-orange { color: var(--yb-orange); }
.yb-tone-blue { color: var(--yb-blue); }
.yb-tone-amber { color: var(--yb-amber); }
.yb-tone-mute { color: var(--yb-mute); }

.yb-panel {
  position: relative;
  padding: 22px;
  background: var(--yb-slate);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(var(--yb-r-s) 0, 100% 0, 100% calc(100% - var(--yb-r-s)), calc(100% - var(--yb-r-s)) 100%, 0 100%, 0 var(--yb-r-s));
}

.yb-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--yb-mute);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  transition: color .16s var(--yb-ease), border-color .16s var(--yb-ease), background .16s var(--yb-ease);
}
.yb-chip:hover { color: var(--yb-paper); border-color: var(--yb-blue); }
.yb-chip--on {
  color: var(--yb-charcoal);
  background: var(--yb-lime);
  border-color: var(--yb-lime);
  font-weight: 700;
}

/* 数据表 */
.yb-table__scroll {
  overflow-x: auto;
  background: var(--yb-slate);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(var(--yb-r-s) 0, 100% 0, 100% calc(100% - var(--yb-r-s)), calc(100% - var(--yb-r-s)) 100%, 0 100%, 0 var(--yb-r-s));
}
.yb-table {
  width: 100%;
  min-width: 560px;
  font-size: 14px;
}
.yb-table th {
  padding: 12px 14px;
  background: rgba(11, 31, 26, .68);
  border-bottom: 1px solid var(--yb-wire);
  font-family: var(--yb-font-data);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-align: left;
  color: var(--yb-mute);
  white-space: nowrap;
}
.yb-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(46, 64, 56, .6);
  color: var(--yb-ink);
}
.yb-table tbody tr { transition: background .16s var(--yb-ease); }
.yb-table tbody tr:hover { background: rgba(200, 255, 61, .06); }
.yb-table__num {
  font-family: var(--yb-font-data);
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--yb-paper);
}

/* 面包屑 */
.yb-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  font-family: var(--yb-font-data);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--yb-mute);
}
.yb-crumbs__item { display: inline-flex; align-items: center; gap: 8px; }
.yb-crumbs__item[aria-current="page"] { color: var(--yb-paper); }
.yb-crumbs__link {
  color: var(--yb-mute);
  border-bottom: 1px solid transparent;
  transition: color .16s var(--yb-ease), border-color .16s var(--yb-ease);
}
.yb-crumbs__link:hover { color: var(--yb-blue); border-bottom-color: var(--yb-blue); }
.yb-crumbs__sep { color: var(--yb-wire); }

/* 图像容器（页面阶段放图片或内联 SVG） */
.yb-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background-image: linear-gradient(135deg, #16261F, #0B1F1A 70%);
  border: 1px solid var(--yb-wire);
  clip-path: polygon(var(--yb-r-s) 0, 100% 0, 100% calc(100% - var(--yb-r-s)), calc(100% - var(--yb-r-s)) 100%, 0 100%, 0 var(--yb-r-s));
}
.yb-media img,
.yb-media svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.yb-media--wide { aspect-ratio: 21 / 9; }
.yb-media--tall { aspect-ratio: 3 / 4; }
.yb-media--cut { clip-path: polygon(0 0, 100% 0, 100% 76%, 70% 100%, 0 100%); }
.yb-media__cap {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 8px 12px;
  font-family: var(--yb-font-data);
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--yb-mute);
  background: rgba(16, 20, 18, .78);
  border-top: 1px solid var(--yb-wire);
}

/* 滚动进度 */
.yb-progress {
  position: fixed;
  top: var(--yb-bar-h);
  left: var(--yb-rail-w);
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--yb-lime), var(--yb-orange));
  transform: scaleX(0);
  transform-origin: 0 50%;
  z-index: 90;
  pointer-events: none;
}

/* 滚动显现（仅在脚本就绪时隐藏） */
html.yb-js [data-reveal] {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .4s var(--yb-ease), transform .4s var(--yb-ease);
}
html.yb-js [data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* ---------- 平板 ---------- */
@media (max-width: 1180px) {
  .yb-footer__grid { grid-template-columns: 1.4fr .9fr .9fr 1.4fr; }
  .yb-footer__contact { grid-column: span 4; }
}

@media (max-width: 1024px) {
  :root {
    --yb-rail-w: 0px;
    --yb-bar-h: 64px;
  }

  body { padding-left: 0; padding-top: var(--yb-bar-h); }

  .yb-header__bar {
    left: 0;
    gap: 12px;
    padding: 0 14px;
  }

  .yb-burger { display: inline-flex; flex: none; }

  .yb-header__rail {
    top: auto;
    right: 0;
    bottom: 0;
    width: auto;
    max-height: 82vh;
    overflow-y: auto;
    gap: 18px;
    padding: 28px 20px 30px;
    border-right: 0;
    border-top: 1px solid var(--yb-lime);
    background-image: linear-gradient(180deg, #10241D 0%, #0B1F1A 100%);
    clip-path: polygon(0 22px, 100% 0, 100% 100%, 0 100%);
    transform: translateY(112%);
    transition: transform .22s var(--yb-ease);
    z-index: 120;
  }

  .yb-header[data-open] .yb-header__rail { transform: none; }

  .yb-header::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 110;
    background: rgba(6, 12, 10, .68);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s var(--yb-ease), visibility .2s var(--yb-ease);
  }
  .yb-header[data-open]::after { opacity: 1; visibility: visible; }

  .yb-nav__list { gap: 4px; }
  .yb-nav__link { padding: 13px 12px; font-size: 15.5px; }

  .yb-offset-1 { grid-column-start: auto; }
  .yb-span-3,
  .yb-span-4,
  .yb-span-5,
  .yb-span-6,
  .yb-span-7,
  .yb-span-8 { grid-column: span 12; }

  .yb-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yb-footer__contact { grid-column: span 2; }
}

/* ---------- 手机 ---------- */
@media (max-width: 640px) {
  body { font-size: 15.5px; }

  .yb-header__bar { gap: 10px; padding: 0 12px; }
  .yb-bar__seg { display: none; }
  .yb-bar__readout { display: none; }
  .yb-util:not(.yb-util--accent) { display: none; }
  .yb-cta { padding: 9px 13px; font-size: 12.5px; }
  .yb-burger { padding: 8px 10px; }
  .yb-burger__text { display: none; }

  .yb-container { padding: 0 18px; }
  .yb-section { padding: 40px 0; }

  .yb-footer { padding: 44px 18px 24px; }
  .yb-footer::before { left: 18px; width: 130px; }
  .yb-footer__grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .yb-footer__contact { grid-column: span 1; }
  .yb-footer__base { margin-top: 34px; }
}

/* ---------- 可访问性：减少动效 ---------- */
@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.yb-js [data-reveal] { opacity: 1; transform: none; }
  .yb-header__rail { transition: none; }
  .yb-progress { transition: none; }
}