/* =========================================================
   天博赛事 · 赛场控制台 Site Kit
   /assets/site.css
   ========================================================= */

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

:root{
  --tb-void:#03100e;
  --tb-ink:#071b17;
  --tb-ink-2:#0b2621;
  --tb-ink-3:#12332c;
  --tb-line:rgba(47,243,208,.16);
  --tb-line-soft:rgba(47,243,208,.08);
  --tb-line-strong:rgba(47,243,208,.38);
  --tb-teal:#2ff3d0;
  --tb-teal-bright:#66ffe0;
  --tb-teal-deep:#0f7c68;
  --tb-orange:#ff8a3d;
  --tb-red:#ff4159;
  --tb-text:#e6f4f0;
  --tb-text-2:#9dbcb4;
  --tb-text-3:#61857c;
  --tb-radius-lg:28px;
  --tb-radius:18px;
  --tb-radius-sm:12px;
  --tb-pill:999px;
  --tb-wrap:1200px;
  --tb-wrap-wide:1320px;
  --tb-gutter:clamp(16px,4vw,40px);
  --tb-font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --tb-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --tb-narrow:"Arial Narrow","Helvetica Neue Condensed","PingFang SC",system-ui,-apple-system,sans-serif;
  --tb-shadow:0 18px 48px rgba(0,0,0,.45);
  --tb-ease:cubic-bezier(.2,.75,.3,1);
}

/* ---------- 基础 ---------- */
html{scroll-padding-top:96px}
body{
  background-color:var(--tb-void);
  background-image:
    radial-gradient(900px 520px at 84% -8%,rgba(47,243,208,.10),transparent 62%),
    radial-gradient(680px 420px at -12% 22%,rgba(255,138,61,.07),transparent 60%);
  background-repeat:no-repeat;
  background-attachment:fixed;
  color:var(--tb-text);
  font-family:var(--tb-font);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--tb-teal);color:var(--tb-void)}
:focus-visible{outline:2px solid var(--tb-teal);outline-offset:3px;border-radius:6px}

/* ---------- 排版 ---------- */
.tb-h1{
  font-family:var(--tb-narrow);
  font-weight:800;
  font-size:clamp(38px,7.2vw,74px);
  line-height:1.02;
  letter-spacing:-.005em;
  color:var(--tb-text);
}
.tb-h2{
  font-family:var(--tb-narrow);
  font-weight:800;
  font-size:clamp(26px,3.6vw,40px);
  line-height:1.14;
  letter-spacing:.01em;
  color:var(--tb-text);
}
.tb-h3{
  font-family:var(--tb-narrow);
  font-weight:700;
  font-size:clamp(19px,2.2vw,24px);
  line-height:1.28;
  letter-spacing:.02em;
  color:var(--tb-text);
}
.tb-eyebrow{
  font-family:var(--tb-mono);
  font-size:11.5px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--tb-teal);
}
.tb-lede{
  font-size:clamp(15.5px,1.6vw,18px);
  line-height:1.85;
  color:var(--tb-text-2);
  max-width:62ch;
}
.tb-p{
  font-size:15.5px;
  line-height:1.85;
  color:var(--tb-text-2);
}
.tb-p + .tb-p{margin-top:14px}

/* ---------- 布局 ---------- */
.tb-wrap{
  width:100%;
  max-width:var(--tb-wrap);
  margin:0 auto;
  padding:0 var(--tb-gutter);
}
.tb-wrap--narrow{max-width:820px}
.tb-section{padding:clamp(52px,7vw,104px) 0}
.tb-section--tight{padding:clamp(30px,4vw,56px) 0}
.tb-grid{display:grid;gap:clamp(16px,2.2vw,28px)}
.tb-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.tb-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tb-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.tb-grid--split{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start}
.tb-rule{height:1px;background:var(--tb-line);border:0;margin:clamp(28px,4vw,52px) 0}

/* ---------- 卡片 / 按钮 / 标签 ---------- */
.tb-card{
  position:relative;
  background:linear-gradient(160deg,rgba(11,38,33,.94),rgba(5,22,19,.94));
  border:1px solid var(--tb-line);
  border-radius:var(--tb-radius-lg);
  padding:clamp(18px,2.4vw,28px);
  transition:border-color .25s var(--tb-ease),transform .25s var(--tb-ease);
}
.tb-card:hover{border-color:var(--tb-line-strong);transform:translateY(-2px)}
.tb-card--accent{border-color:rgba(47,243,208,.42)}
.tb-card--accent::before{
  content:"";
  position:absolute;left:clamp(18px,2.4vw,28px);top:0;
  width:56px;height:3px;border-radius:0 0 3px 3px;background:var(--tb-teal);
}

.tb-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 24px;
  border-radius:var(--tb-pill);
  border:1px solid var(--tb-line-strong);
  color:var(--tb-text);
  font-size:14.5px;
  font-weight:600;
  letter-spacing:.06em;
  transition:background .2s var(--tb-ease),color .2s var(--tb-ease),border-color .2s var(--tb-ease),transform .2s var(--tb-ease);
}
.tb-btn:hover{transform:translateY(-1px)}
.tb-btn--primary{background:var(--tb-teal);border-color:var(--tb-teal);color:#03100e}
.tb-btn--primary:hover{background:var(--tb-teal-bright);border-color:var(--tb-teal-bright)}
.tb-btn--ghost:hover{background:rgba(47,243,208,.09);border-color:var(--tb-teal)}
.tb-btn--warm{background:var(--tb-orange);border-color:var(--tb-orange);color:#1a0d03}
.tb-btn--warm:hover{background:#ffa363;border-color:#ffa363}
.tb-btn__arrow{font-family:var(--tb-mono);font-size:13px}

.tb-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 12px;
  border-radius:var(--tb-pill);
  border:1px solid var(--tb-line-strong);
  font-family:var(--tb-mono);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--tb-teal);
}
.tb-tag--warm{color:var(--tb-orange);border-color:rgba(255,138,61,.42)}
.tb-tag--alert{color:var(--tb-red);border-color:rgba(255,65,89,.45)}

.tb-note{
  padding:16px 18px;
  border-left:2px solid var(--tb-teal);
  background:rgba(47,243,208,.055);
  border-radius:0 var(--tb-radius-sm) var(--tb-radius-sm) 0;
  font-size:14px;
  line-height:1.8;
  color:var(--tb-text-2);
}
.tb-note--warm{border-left-color:var(--tb-orange);background:rgba(255,138,61,.06)}
.tb-note--alert{border-left-color:var(--tb-red);background:rgba(255,65,89,.07)}

/* ---------- 面包屑 ---------- */
.tb-crumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--tb-mono);
  font-size:11.5px;
  letter-spacing:.1em;
  color:var(--tb-text-3);
}
.tb-crumb a{color:var(--tb-text-3);transition:color .2s}
.tb-crumb a:hover{color:var(--tb-teal)}
.tb-crumb__sep{color:var(--tb-teal-deep)}
.tb-crumb [aria-current="page"]{color:var(--tb-text-2)}

/* ---------- 目录索引列表 ---------- */
.tb-index{display:flex;flex-direction:column;border-top:1px solid var(--tb-line)}
.tb-index__item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:clamp(12px,2vw,24px);
  align-items:baseline;
  padding:18px 4px;
  border-bottom:1px solid var(--tb-line);
  transition:background .22s var(--tb-ease),padding-left .22s var(--tb-ease);
}
.tb-index__item:hover{background:rgba(47,243,208,.05);padding-left:14px}
.tb-index__num{font-family:var(--tb-mono);font-size:12px;letter-spacing:.08em;color:var(--tb-teal)}
.tb-index__title{font-family:var(--tb-narrow);font-weight:700;font-size:clamp(17px,2vw,22px);line-height:1.3;color:var(--tb-text)}
.tb-index__meta{font-family:var(--tb-mono);font-size:11.5px;letter-spacing:.06em;color:var(--tb-text-3);white-space:nowrap}

/* ---------- 图片容器 ---------- */
.tb-media{
  position:relative;
  overflow:hidden;
  border-radius:var(--tb-radius-lg);
  border:1px solid var(--tb-line);
  background:linear-gradient(140deg,var(--tb-ink-2),var(--tb-void));
  isolation:isolate;
}
.tb-media::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(115deg,rgba(47,243,208,.07) 0 1px,transparent 1px 16px),
    radial-gradient(62% 70% at 28% 18%,rgba(47,243,208,.13),transparent 70%);
}
.tb-media > img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:cover;
}
.tb-media__cap{
  position:absolute;
  z-index:2;
  left:0;right:0;bottom:0;
  padding:14px 18px;
  font-family:var(--tb-mono);
  font-size:11.5px;
  letter-spacing:.08em;
  color:var(--tb-text-2);
  background:linear-gradient(0deg,rgba(3,16,14,.94),rgba(3,16,14,0));
}
.tb-media--16x9{aspect-ratio:16/9}
.tb-media--4x3{aspect-ratio:4/3}
.tb-media--1x1{aspect-ratio:1/1}
.tb-media--21x9{aspect-ratio:21/9}
.tb-media--tall{aspect-ratio:3/4}
.tb-media--fill{height:100%}

/* ---------- 滚动显现 ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .7s var(--tb-ease),transform .7s var(--tb-ease);
  transition-delay:calc(var(--i,0) * 70ms);
}
[data-reveal].is-in{opacity:1;transform:none}
html:not(.tb-js) [data-reveal]{opacity:1;transform:none}

/* =========================================================
   头部控制条
   ========================================================= */
.tb-header{
  position:sticky;
  top:0;
  z-index:60;
  background:linear-gradient(180deg,rgba(4,18,15,.97),rgba(4,18,15,.87));
  border-bottom:1px solid var(--tb-line);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  transition:box-shadow .3s var(--tb-ease);
}
.tb-header::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:2px;
  background:linear-gradient(90deg,var(--tb-teal),rgba(47,243,208,.05) 52%,var(--tb-orange));
  opacity:.75;
}
.tb-header.is-stuck{box-shadow:0 16px 40px rgba(0,0,0,.5)}

.tb-skip{
  position:absolute;
  left:var(--tb-gutter);
  top:6px;
  z-index:80;
  padding:10px 18px;
  border-radius:0 0 var(--tb-radius-sm) var(--tb-radius-sm);
  background:var(--tb-teal);
  color:#03100e;
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  transform:translateY(-180%);
  transition:transform .2s var(--tb-ease);
}
.tb-skip:focus{transform:translateY(0)}

.tb-header__rail{
  position:relative;
  display:flex;
  align-items:center;
  gap:clamp(14px,2vw,26px);
  width:100%;
  max-width:var(--tb-wrap-wide);
  margin:0 auto;
  padding:0 var(--tb-gutter);
  height:72px;
}

/* 品牌 */
.tb-brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.tb-brand__mark{
  position:relative;
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:11px;
  background:linear-gradient(150deg,var(--tb-teal),var(--tb-teal-deep));
  box-shadow:0 0 0 1px rgba(47,243,208,.3),0 10px 24px rgba(47,243,208,.14);
}
.tb-brand__pulse{
  width:11px;height:11px;
  border-radius:50%;
  background:var(--tb-void);
  box-shadow:0 0 0 4px rgba(3,16,14,.32);
}
.tb-brand__text{display:flex;flex-direction:column;line-height:1.15}
.tb-brand__name{
  font-family:var(--tb-narrow);
  font-weight:800;
  font-size:19px;
  letter-spacing:.07em;
  color:var(--tb-text);
}
.tb-brand__meta{
  font-family:var(--tb-mono);
  font-size:9.5px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--tb-text-3);
}

/* 导航 */
.tb-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex:1 1 auto;
  min-width:0;
}
.tb-nav__list{display:flex;align-items:center;gap:2px;flex-wrap:nowrap}
.tb-nav__item{flex:0 0 auto}
.tb-nav__link{
  display:flex;
  align-items:baseline;
  gap:7px;
  padding:9px 13px;
  border-radius:var(--tb-pill);
  border:1px solid transparent;
  color:var(--tb-text-2);
  transition:color .2s var(--tb-ease),background .2s var(--tb-ease),border-color .2s var(--tb-ease);
}
.tb-nav__link:hover{color:var(--tb-text);background:rgba(47,243,208,.07);border-color:var(--tb-line)}
.tb-nav__link[aria-current="page"]{
  color:#03100e;
  background:var(--tb-teal);
  border-color:var(--tb-teal);
}
.tb-nav__index{
  font-family:var(--tb-mono);
  font-size:10px;
  letter-spacing:.06em;
  color:var(--tb-teal-deep);
}
.tb-nav__link[aria-current="page"] .tb-nav__index{color:rgba(3,16,14,.55)}
.tb-nav__label{font-size:14px;letter-spacing:.04em}
.tb-nav__foot{display:none}

/* 状态通道 */
.tb-header__status{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  padding-left:18px;
  border-left:1px dashed var(--tb-line-strong);
  font-family:var(--tb-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--tb-text-3);
}
.tb-status__dot{
  width:7px;height:7px;
  border-radius:50%;
  background:var(--tb-teal);
  animation:tb-pulse 2.4s ease-out infinite;
}
@keyframes tb-pulse{
  0%{box-shadow:0 0 0 0 rgba(47,243,208,.55)}
  70%{box-shadow:0 0 0 9px rgba(47,243,208,0)}
  100%{box-shadow:0 0 0 0 rgba(47,243,208,0)}
}
.tb-status__label{color:var(--tb-text-3)}
.tb-status__value{color:var(--tb-teal);letter-spacing:.08em}

/* 移动端目录按钮 */
.tb-navtoggle{
  display:none;
  align-items:center;
  gap:9px;
  flex:0 0 auto;
  padding:9px 14px;
  border-radius:var(--tb-pill);
  border:1px solid var(--tb-line-strong);
  color:var(--tb-text);
  font-size:13px;
  letter-spacing:.1em;
}
.tb-navtoggle__bars{display:grid;gap:4px;width:16px}
.tb-navtoggle__bars span{
  display:block;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transition:transform .25s var(--tb-ease),opacity .2s var(--tb-ease);
}
.tb-navtoggle[aria-expanded="true"] .tb-navtoggle__bars span:first-child{transform:translateY(3px) rotate(45deg)}
.tb-navtoggle[aria-expanded="true"] .tb-navtoggle__bars span:last-child{transform:translateY(-3px) rotate(-45deg)}

/* 滚动进度 */
.tb-header__progress{
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;
  transform:scaleX(0);
  transform-origin:0 50%;
  background:linear-gradient(90deg,var(--tb-teal),var(--tb-orange));
  pointer-events:none;
}

/* =========================================================
   页脚
   ========================================================= */
.tb-footer{
  position:relative;
  margin-top:clamp(48px,7vw,96px);
  border-top:1px solid var(--tb-line);
  background:
    linear-gradient(180deg,rgba(7,27,23,.72),var(--tb-void) 60%),
    repeating-linear-gradient(90deg,rgba(47,243,208,.05) 0 1px,transparent 1px 88px);
}
.tb-footer__inner{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.2fr;
  gap:clamp(24px,3vw,48px);
  width:100%;
  max-width:var(--tb-wrap-wide);
  margin:0 auto;
  padding:clamp(44px,6vw,72px) var(--tb-gutter) clamp(28px,4vw,44px);
}
.tb-footer__lead{max-width:38em}
.tb-footer__brand{
  font-family:var(--tb-narrow);
  font-weight:800;
  font-size:26px;
  letter-spacing:.08em;
  color:var(--tb-text);
}
.tb-footer__tag{
  margin-top:10px;
  font-family:var(--tb-mono);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--tb-teal);
}
.tb-footer__note{
  margin-top:14px;
  font-size:13px;
  line-height:1.85;
  color:var(--tb-text-3);
}
.tb-footer__col{min-width:0}
.tb-footer__title{
  margin-bottom:16px;
  font-family:var(--tb-mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--tb-text-3);
}
.tb-footer__list li + li{margin-top:10px}
.tb-footer__list a{
  font-size:14px;
  color:var(--tb-text-2);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color .2s var(--tb-ease),border-color .2s var(--tb-ease);
}
.tb-footer__list a:hover{color:var(--tb-teal);border-bottom-color:var(--tb-teal)}
.tb-footer__list--meta{
  font-family:var(--tb-mono);
  font-size:12.5px;
  line-height:1.7;
  letter-spacing:.02em;
  color:var(--tb-text-2);
  word-break:break-word;
}
.tb-footer__base{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:10px 24px;
  width:100%;
  max-width:var(--tb-wrap-wide);
  margin:0 auto;
  padding:20px var(--tb-gutter) 30px;
  border-top:1px solid var(--tb-line);
  font-family:var(--tb-mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--tb-text-3);
}

/* =========================================================
   响应式
   ========================================================= */
html.tb-nav-open{overflow:hidden}

@media (min-width:901px){
  .tb-nav-open{overflow:visible}
}

@media (max-width:1080px){
  .tb-nav__link{padding:9px 10px}
  .tb-nav__label{font-size:13.5px}
}

@media (max-width:980px){
  .tb-grid--3,
  .tb-grid--4,
  .tb-grid--split{grid-template-columns:minmax(0,1fr)}
  .tb-footer__inner{grid-template-columns:1fr 1fr}
}

@media (max-width:900px){
  .tb-header__rail{height:62px;gap:12px}
  .tb-brand__meta{display:none}
  .tb-header__status{display:none}
  .tb-navtoggle{display:inline-flex;margin-left:auto}

  .tb-nav{
    position:fixed;
    inset:62px 0 0 0;
    z-index:55;
    display:flex;
    flex-direction:column;
    padding:28px var(--tb-gutter) 40px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    background:linear-gradient(180deg,#041411,#061c18 62%,#081f1a);
    opacity:0;
    visibility:hidden;
    transform:translateY(-12px);
    transition:opacity .26s var(--tb-ease),transform .3s var(--tb-ease),visibility .26s linear;
  }
  .tb-nav[data-open]{opacity:1;visibility:visible;transform:none}

  .tb-nav__list{
    flex-direction:column;
    align-items:stretch;
    gap:0;
    width:100%;
    border-top:1px solid var(--tb-line);
  }
  .tb-nav__item{border-bottom:1px solid var(--tb-line)}
  .tb-nav__link{
    justify-content:flex-start;
    gap:16px;
    padding:19px 4px 19px 14px;
    border:0;
    border-left:2px solid transparent;
    border-radius:0;
    color:var(--tb-text-2);
  }
  .tb-nav__link:hover{background:rgba(47,243,208,.05);border-radius:0}
  .tb-nav__link[aria-current="page"]{
    background:rgba(47,243,208,.09);
    border-left-color:var(--tb-teal);
    color:var(--tb-teal);
  }
  .tb-nav__link[aria-current="page"] .tb-nav__index{color:var(--tb-teal)}
  .tb-nav__index{width:26px;font-size:12px;color:var(--tb-teal-deep)}
  .tb-nav__label{font-family:var(--tb-narrow);font-weight:800;font-size:23px;letter-spacing:.06em}

  .tb-nav__foot{
    display:block;
    margin-top:auto;
    padding-top:26px;
    font-family:var(--tb-mono);
    font-size:11px;
    letter-spacing:.16em;
    color:var(--tb-text-3);
  }
}

@media (max-width:720px){
  .tb-grid--2{grid-template-columns:minmax(0,1fr)}
  .tb-index__item{grid-template-columns:auto minmax(0,1fr);row-gap:4px}
  .tb-index__meta{grid-column:2;white-space:normal}
}

@media (max-width:560px){
  .tb-footer__inner{grid-template-columns:minmax(0,1fr)}
  .tb-footer__base{flex-direction:column;gap:8px}
  .tb-brand__name{font-size:17px}
}

/* ---------- 焦点与动效偏好 ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  [data-reveal]{opacity:1;transform:none}
  .tb-card:hover{transform:none}
  .tb-btn:hover{transform:none}
  .tb-header__progress{transition:none}
}