/* ============================================================
   KAIYUN 看台 · 共享层 /assets/site.css
   01 令牌 · 02 重置与中文排版 · 03 布局 · 04 组件 · 05 头部
   06 页脚 · 07 动效与响应式
   ============================================================ */

/* ---------- 01 令牌 ---------- */
:root{
  --kt-void:#0A1428;
  --kt-board:#101E38;
  --kt-line:#1E3A5F;
  --kt-cyan:#29F0D0;
  --kt-cyan-deep:#0E7A6B;
  --kt-orange:#FF6B2C;
  --kt-orange-soft:#FFA166;
  --kt-ice:#E8F1FA;
  --kt-mute:#8FA6BF;
  --kt-carbon:#060C16;
  --kt-max:1280px;
  --kt-gap:clamp(16px,2.4vw,28px);
  --kt-font-sans:"PingFang SC","Hiragino Sans GB","Source Han Sans SC","Noto Sans CJK SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --kt-font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --kt-hard:6px 6px 0 rgba(6,12,22,.9);
  --kt-hard-lg:8px 8px 0 rgba(6,12,22,.85);
}

/* ---------- 02 重置与中文排版 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background-color:var(--kt-void);
  color:var(--kt-ice);
  font-family:var(--kt-font-sans);
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  letter-spacing:.01em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    radial-gradient(760px 420px at 4% -6%,rgba(41,240,208,.10),transparent 62%),
    radial-gradient(900px 520px at 92% -12%,rgba(255,107,44,.13),transparent 64%),
    repeating-linear-gradient(0deg,rgba(30,58,95,.30) 0 1px,transparent 1px 96px),
    repeating-linear-gradient(90deg,rgba(30,58,95,.30) 0 1px,transparent 1px 96px);
}
h1,h2,h3,h4{line-height:1.15;letter-spacing:-.02em;color:var(--kt-ice);margin:0 0 .5em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
a{color:var(--kt-cyan);text-decoration:none;overflow-wrap:anywhere}
a:hover{color:var(--kt-orange-soft)}
ul,ol{margin:0 0 1em;padding-left:1.15em}
img,svg,video{max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
strong,b{font-weight:700}
[hidden]{display:none !important}
::selection{background:var(--kt-cyan);color:var(--kt-carbon)}
:focus-visible{outline:2px solid var(--kt-orange);outline-offset:2px}

.kt-mono{font-family:var(--kt-font-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.kt-eyebrow{margin:0 0 10px;font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--kt-cyan)}
.kt-display{margin:0;font-size:clamp(2.6rem,7vw,5.2rem);font-weight:200;line-height:1.02;letter-spacing:-.03em;color:var(--kt-ice)}
.kt-display__strong{font-weight:800;letter-spacing:-.045em;color:#fff}
.kt-display em{font-style:normal;font-weight:800;color:var(--kt-cyan)}

/* ---------- 03 布局 ---------- */
.kt-wrap{width:min(100% - 32px,var(--kt-max));margin-inline:auto}
.kt-main{display:block;min-height:55vh}
.kt-section{padding:clamp(34px,5vw,68px) 0}
.kt-section--tight{padding:clamp(14px,2vw,22px) 0}
.kt-rule{height:0;margin:0;border:0;border-top:2px solid var(--kt-carbon);box-shadow:0 1px 0 var(--kt-line)}

.kt-grid{display:grid;gap:var(--kt-gap)}
.kt-grid--12{grid-template-columns:repeat(12,minmax(0,1fr))}
.kt-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kt-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kt-grid--auto{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kt-col-3{grid-column:span 3}
.kt-col-4{grid-column:span 4}
.kt-col-6{grid-column:span 6}
.kt-col-8{grid-column:span 8}
.kt-col-9{grid-column:span 9}

.kt-sechead{margin:0 0 22px;padding-left:14px;border-left:3px solid var(--kt-orange)}
.kt-sechead__index{display:block;font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--kt-cyan)}
.kt-sechead__title{margin:6px 0 0;font-size:clamp(1.35rem,2.6vw,2rem);font-weight:600}
.kt-sechead__note{margin:6px 0 0;font-size:14px;color:var(--kt-mute)}

.kt-rail{position:relative;padding-right:18px;border-right:2px solid var(--kt-line)}

.kt-crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;list-style:none;margin:0;padding:14px 0;font-size:12px;letter-spacing:.08em}
.kt-crumbs__item{display:flex;align-items:center;gap:8px;color:var(--kt-mute)}
.kt-crumbs__item a{color:var(--kt-mute)}
.kt-crumbs__item a:hover{color:var(--kt-orange-soft)}
.kt-crumbs__item [aria-current="page"]{color:var(--kt-ice)}
.kt-crumbs__sep{color:var(--kt-line)}

/* ---------- 04 组件 ---------- */
.kt-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 16px;border:2px solid var(--kt-line);background:var(--kt-board);
  color:var(--kt-ice);font-size:14px;font-weight:600;letter-spacing:.05em;
  text-align:center;cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.kt-btn:hover,.kt-btn:focus-visible{transform:translateY(-2px);border-color:var(--kt-cyan);color:var(--kt-cyan);box-shadow:var(--kt-hard)}
.kt-btn--cta{background:var(--kt-orange);border-color:var(--kt-orange);color:var(--kt-carbon)}
.kt-btn--cta:hover,.kt-btn--cta:focus-visible{background:var(--kt-orange-soft);border-color:var(--kt-orange-soft);color:var(--kt-carbon)}
.kt-btn--ghost{background:transparent;color:var(--kt-ice);border-color:var(--kt-line)}
.kt-btn--sm{padding:6px 11px;font-size:12px;letter-spacing:.08em}

.kt-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border:1px solid var(--kt-line);background:rgba(41,240,208,.06);color:var(--kt-cyan);font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.kt-tag--warn{color:var(--kt-orange-soft);border-color:rgba(255,107,44,.5);background:rgba(255,107,44,.08)}

.kt-chip{position:relative;display:inline-flex;align-items:center;padding:7px 12px;border:1px solid var(--kt-line);background:var(--kt-board);color:var(--kt-ice);font-size:13px;letter-spacing:.04em;cursor:pointer;user-select:none;transition:border-color .16s ease,background .16s ease,color .16s ease}
.kt-chip:hover{border-color:var(--kt-cyan);color:var(--kt-cyan)}
.kt-chip__input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.kt-chip__label{pointer-events:none}
.kt-chip__input:checked + .kt-chip__label{color:var(--kt-carbon);font-weight:600}
.kt-chip:has(.kt-chip__input:checked){background:var(--kt-cyan);border-color:var(--kt-cyan);color:var(--kt-carbon)}
.kt-chip:focus-within{outline:2px solid var(--kt-orange);outline-offset:2px}

.kt-card{position:relative;padding:18px;background:var(--kt-board);border:2px solid var(--kt-line);box-shadow:var(--kt-hard);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.kt-card:hover{border-color:var(--kt-cyan);transform:translateY(-2px);box-shadow:var(--kt-hard-lg)}
.kt-card__head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid var(--kt-line)}
.kt-card__title{margin:0;font-size:1.05rem;font-weight:700}
.kt-card__meta{font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--kt-mute)}
.kt-card__body{margin-top:12px;font-size:15px;color:var(--kt-ice)}
.kt-card__foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px solid var(--kt-line);font-size:12px;color:var(--kt-mute)}

.kt-panel{padding:16px;background:var(--kt-board);border:2px solid var(--kt-line)}
.kt-panel__label{margin:0 0 10px;font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--kt-mute)}
.kt-datalist{list-style:none;margin:0;padding:0}
.kt-datalist__row{display:flex;gap:12px;justify-content:space-between;padding:9px 0;border-bottom:1px dashed var(--kt-line);font-size:13px}
.kt-datalist__row:last-child{border-bottom:0}
.kt-datalist__key{color:var(--kt-mute)}
.kt-datalist__val{font-family:var(--kt-font-mono);color:var(--kt-ice)}

.kt-figure{position:relative;margin:0;overflow:hidden;background:linear-gradient(140deg,#0d1c33 0%,#14294a 55%,#0b1a30 100%);border:2px solid var(--kt-carbon);box-shadow:var(--kt-hard-lg)}
.kt-figure__img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#0d1c33}
.kt-figure--wide .kt-figure__img{aspect-ratio:21/9}
.kt-figure--tall .kt-figure__img{aspect-ratio:4/5}
.kt-figure--square .kt-figure__img{aspect-ratio:1/1}
.kt-figure__grid{position:absolute;inset:0;pointer-events:none;opacity:.55;background-image:repeating-linear-gradient(0deg,rgba(41,240,208,.10) 0 1px,transparent 1px 34px),repeating-linear-gradient(90deg,rgba(41,240,208,.10) 0 1px,transparent 1px 34px)}
.kt-figure__cap{position:absolute;left:0;right:0;bottom:0;padding:10px 14px;font-size:12px;letter-spacing:.08em;color:var(--kt-ice);background:linear-gradient(0deg,rgba(6,12,22,.94),rgba(6,12,22,0))}

.kt-status{position:fixed;right:16px;bottom:16px;z-index:70;display:grid;gap:4px;min-width:216px;padding:12px 14px;background:rgba(6,12,22,.95);border:2px solid var(--kt-line);box-shadow:var(--kt-hard);font-size:12px}
.kt-status__row{display:flex;gap:10px;justify-content:space-between}
.kt-status__key{color:var(--kt-mute);letter-spacing:.12em}
.kt-status__val{font-family:var(--kt-font-mono);color:var(--kt-ice)}
.kt-status__val--live{color:var(--kt-cyan)}

.kt-skip{position:absolute;top:-64px;left:12px;z-index:200;padding:10px 16px;background:var(--kt-orange);color:var(--kt-carbon);font-weight:700;text-decoration:none;transition:top .16s ease}
.kt-skip:focus{top:10px;color:var(--kt-carbon)}

/* ---------- 05 头部 ---------- */
.kt-header{position:sticky;top:0;z-index:60;background:linear-gradient(180deg,rgba(10,20,40,.98),rgba(10,20,40,.92));border-bottom:2px solid var(--kt-carbon);box-shadow:0 2px 0 var(--kt-line)}
.kt-header__bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 0}
.kt-brand{display:inline-flex;align-items:center;gap:10px;color:var(--kt-ice);text-decoration:none}
.kt-brand:hover{color:var(--kt-ice)}
.kt-brand__mark{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--kt-cyan);background:var(--kt-board);color:var(--kt-cyan);font-family:var(--kt-font-mono);font-size:12px;letter-spacing:.06em}
.kt-brand__name{font-size:15px;font-weight:700;letter-spacing:.05em;white-space:nowrap}
.kt-brand__sub{padding-left:9px;border-left:1px solid var(--kt-line);font-family:var(--kt-font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--kt-mute);white-space:nowrap}
.kt-header__note{margin:0;font-family:var(--kt-font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--kt-mute)}
.kt-header__meta{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;justify-self:end}

.kt-live{display:inline-flex;align-items:center;gap:6px;margin:0;padding:5px 10px;border:1px solid var(--kt-line);background:var(--kt-board);font-size:12px;color:var(--kt-mute)}
.kt-live__dot{width:7px;height:7px;border-radius:50%;background:var(--kt-cyan);animation:kt-pulse 1s steps(1,end) infinite}
.kt-live__label{letter-spacing:.14em}
.kt-live__num{min-width:2ch;text-align:right;color:var(--kt-cyan);font-weight:600}
.kt-live__unit{color:var(--kt-mute)}
.kt-live.is-refreshing .kt-live__num{color:var(--kt-orange-soft)}
@keyframes kt-pulse{0%,100%{box-shadow:0 0 0 0 rgba(41,240,208,.55)}50%{box-shadow:0 0 0 5px rgba(41,240,208,0)}}

.kt-header__count{margin:0;font-size:12px;letter-spacing:.08em;color:var(--kt-mute)}
.kt-header__count b{color:var(--kt-orange-soft)}

.kt-navtoggle{display:none;align-items:center;gap:8px;padding:8px 12px;background:var(--kt-board);border:2px solid var(--kt-line);color:var(--kt-ice);font-size:12px;letter-spacing:.14em;cursor:pointer}
.kt-navtoggle:hover{border-color:var(--kt-cyan);color:var(--kt-cyan)}
.kt-navtoggle__bar{width:16px;height:2px;background:var(--kt-cyan);box-shadow:0 -5px 0 var(--kt-cyan),0 5px 0 var(--kt-cyan)}
.kt-navtoggle[aria-expanded="true"]{border-color:var(--kt-orange);color:var(--kt-orange-soft)}
.kt-navtoggle[aria-expanded="true"] .kt-navtoggle__bar{background:var(--kt-orange);box-shadow:0 -5px 0 var(--kt-orange),0 5px 0 var(--kt-orange)}

.kt-nav{border-top:1px solid var(--kt-line);background:rgba(16,30,56,.72)}
.kt-nav__list{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.kt-nav__item{flex:0 0 auto}
.kt-nav__link{position:relative;display:block;padding:12px 16px;border-right:1px solid var(--kt-line);color:var(--kt-mute);font-size:14px;letter-spacing:.06em;text-decoration:none;transition:color .18s ease,background .18s ease}
.kt-nav__link::before{content:attr(data-index);display:inline-block;margin-right:8px;font-family:var(--kt-font-mono);font-size:10px;letter-spacing:.1em;color:var(--kt-cyan-deep)}
.kt-nav__link:hover,.kt-nav__link:focus-visible{color:var(--kt-ice);background:rgba(41,240,208,.08)}
.kt-nav__link:hover::before{color:var(--kt-cyan)}
.kt-nav__link[aria-current="page"]{color:var(--kt-ice);background:rgba(255,107,44,.14)}
.kt-nav__link[aria-current="page"]::before{color:var(--kt-orange-soft)}
.kt-nav__link[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--kt-orange)}

.kt-progress{height:2px;background:var(--kt-line)}
.kt-progress__fill{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--kt-cyan),var(--kt-orange));transition:width .12s linear}

/* ---------- 06 页脚 ---------- */
.kt-footer{margin-top:clamp(48px,7vw,88px);background:var(--kt-carbon);border-top:2px solid var(--kt-line);color:var(--kt-mute)}
.kt-footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px;padding:44px 0 30px}
.kt-footer__col{min-width:0}
.kt-footer__title{margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid var(--kt-line);font-family:var(--kt-font-mono);font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--kt-cyan)}
.kt-footer__list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.kt-footer__list a{color:var(--kt-ice);font-size:14px;text-decoration:none;border-bottom:1px solid transparent;transition:color .16s ease,border-color .16s ease}
.kt-footer__list a:hover,.kt-footer__list a:focus-visible{color:var(--kt-orange-soft);border-bottom-color:var(--kt-orange)}
.kt-footer__tagline{margin:14px 0 0;font-size:15px;color:var(--kt-ice)}
.kt-footer__note{margin:8px 0 0;font-size:13px;color:var(--kt-mute)}
.kt-footer__contact{display:grid;gap:10px;padding:20px 0;border-top:1px solid var(--kt-line)}
.kt-footer__contactlist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px;font-size:13px}
.kt-footer__contactlist b{color:var(--kt-ice);font-weight:600}
.kt-footer__key{color:var(--kt-cyan);letter-spacing:.1em}
.kt-footer__bottom{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;align-items:center;padding:16px 0 30px;border-top:1px solid var(--kt-line);font-size:12px;letter-spacing:.06em}
.kt-footer__slogan{margin:0;color:var(--kt-ice)}
.kt-footer__icp{margin:0;color:var(--kt-mute)}
.kt-footer__copy{margin:0;color:var(--kt-mute)}

/* ---------- 07 动效与响应式 ---------- */
[data-reveal]{opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}
[data-reveal].is-in{opacity:1;transform:none}

@media (max-width:1100px){
  .kt-footer__grid{grid-template-columns:1fr 1fr;gap:24px}
}
@media (max-width:980px){
  .kt-header__bar{grid-template-columns:auto auto;justify-content:space-between}
  .kt-header__note{display:none}
  .kt-navtoggle{display:inline-flex}
  .kt-nav{display:none;border-top:2px solid var(--kt-carbon)}
  .kt-nav[data-open]{display:block;animation:kt-drop .18s ease-out}
  .kt-nav__list{display:block;padding:6px 0 12px}
  .kt-nav__link{border-right:0;border-bottom:1px solid var(--kt-line);padding:14px 4px;font-size:15px}
  .kt-nav__item:last-child .kt-nav__link{border-bottom:0}
  .kt-grid--12{grid-template-columns:repeat(6,minmax(0,1fr))}
  .kt-col-3,.kt-col-4{grid-column:span 3}
  .kt-col-6,.kt-col-8,.kt-col-9{grid-column:span 6}
  .kt-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kt-rail{padding:0 0 18px;border-right:0;border-bottom:2px solid var(--kt-line)}
}
@keyframes kt-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

@media (max-width:760px){
  .kt-live{display:none}
  .kt-header__count{display:none}
  .kt-grid--2,.kt-grid--3{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
  .kt-wrap{width:min(100% - 24px,var(--kt-max))}
  .kt-brand__sub{padding-left:0;border-left:0}
  .kt-status{left:12px;right:12px;bottom:12px;min-width:0}
  .kt-footer__grid{grid-template-columns:1fr;padding:34px 0 24px}
  .kt-footer__bottom{justify-content:flex-start}
  .kt-grid--12{grid-template-columns:minmax(0,1fr)}
  [class*="kt-col-"]{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}
  [data-reveal]{opacity:1;transform:none}
  .kt-live__dot{animation:none;box-shadow:0 0 0 3px rgba(41,240,208,.28)}
  .kt-btn:hover,.kt-card:hover{transform:none}
}
