/* ==========================================================
   开云安装 · 共享样式表 /assets/site.css
   reset · 变量 · 中文排版 · 头部 · 页脚 · 通用组件
   ========================================================== */

:root{
  --ky-ink:#0B1120;
  --ky-ink-2:#111A2E;
  --ky-line:#263349;
  --ky-line-soft:rgba(38,51,73,.55);
  --ky-snow:#F5F7FA;
  --ky-mist:#94A3B8;
  --ky-cyan:#22D3EE;
  --ky-cyan-deep:#0E7490;
  --ky-amber:#F59E0B;
  --ky-amber-deep:#92400E;
  --ky-verify:#34D399;
  --ky-fog:#E2E8F0;

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

  --ky-w:1440px;
  --ky-pad:96px;
  --ky-header-h:88px;
  --ky-header-h-sm:56px;
  --ky-mobile-h:64px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;}
h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
img,svg,video{display:block;max-width:100%;}
button,input,select,textarea{font:inherit;color:inherit;}
table{border-collapse:collapse;width:100%;}

/* ---------- 基础排版与底纹 ---------- */
body{
  background-color:var(--ky-ink);
  background-image:
    linear-gradient(var(--ky-line-soft) 1px,transparent 1px),
    linear-gradient(90deg,var(--ky-line-soft) 1px,transparent 1px);
  background-size:64px 64px;
  background-attachment:fixed;
  color:var(--ky-snow);
  font-family:var(--ky-font-sans);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3{font-family:var(--ky-font-serif);line-height:1.25;font-weight:600;}
a{color:var(--ky-cyan);text-decoration:none;}
a:hover{color:var(--ky-snow);}
strong{font-weight:600;color:var(--ky-snow);}

:focus-visible{
  outline:2px solid var(--ky-cyan);
  outline-offset:3px;
  border-radius:2px;
}

.ky-main{display:block;position:relative;}

/* ---------- skip link ---------- */
.ky-skip{
  position:fixed;
  left:16px;
  top:-120px;
  z-index:400;
  padding:12px 20px;
  background:var(--ky-cyan);
  color:#04121A;
  font-family:var(--ky-font-mono);
  font-size:13px;
  letter-spacing:.08em;
  transition:top .18s ease;
}
.ky-skip:focus{top:16px;color:#04121A;}

/* ---------- 容器与布局原子 ---------- */
.ky-container{
  width:100%;
  max-width:var(--ky-w);
  margin-inline:auto;
  padding-inline:var(--ky-pad);
}
.ky-container--narrow{max-width:900px;}

.ky-section{padding-block:72px;}

.ky-rule{border:0;border-top:1px solid var(--ky-line);margin:0;}

.ky-stack{display:flex;flex-direction:column;gap:24px;}

.ky-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:24px;
}
.ky-span-3{grid-column:span 3;}
.ky-span-4{grid-column:span 4;}
.ky-span-6{grid-column:span 6;}
.ky-span-8{grid-column:span 8;}
.ky-span-9{grid-column:span 9;}
.ky-span-12{grid-column:span 12;}

/* ---------- 排版原子 ---------- */
.ky-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.2em;
  color:var(--ky-cyan);
}
.ky-eyebrow::before{
  content:"";
  display:block;
  width:20px;
  height:2px;
  background:currentColor;
}

.ky-display{
  font-family:var(--ky-font-mono);
  font-weight:700;
  letter-spacing:-.02em;
  line-height:.95;
  color:var(--ky-snow);
}

.ky-num{
  font-family:var(--ky-font-mono);
  font-weight:700;
  line-height:.9;
  letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
  color:var(--ky-snow);
}

.ky-lead{
  font-size:17px;
  line-height:1.8;
  color:var(--ky-mist);
  max-width:62ch;
}

.ky-code{
  display:inline-block;
  font-family:var(--ky-font-mono);
  font-size:13px;
  letter-spacing:.1em;
  color:var(--ky-snow);
  background:rgba(38,51,73,.45);
  border:1px solid var(--ky-line);
  padding:2px 8px;
}

/* ---------- 状态点与标签 ---------- */
.ky-dot{
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--ky-verify);
  box-shadow:0 0 0 3px rgba(52,211,153,.16);
  animation:ky-pulse 2.4s ease-in-out infinite;
  vertical-align:middle;
}
.ky-dot--cyan{background:var(--ky-cyan);box-shadow:0 0 0 3px rgba(34,211,238,.16);}
.ky-dot--amber{background:var(--ky-amber);box-shadow:0 0 0 3px rgba(245,158,11,.18);}

@keyframes ky-pulse{
  0%,100%{opacity:1;}
  50%{opacity:.32;}
}

.ky-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:var(--ky-font-mono);
  font-size:11px;
  letter-spacing:.1em;
  padding:3px 9px;
  border:1px solid var(--ky-line);
  color:var(--ky-mist);
  background:rgba(38,51,73,.28);
  white-space:nowrap;
}
.ky-tag--cyan{color:var(--ky-cyan);border-color:rgba(34,211,238,.42);background:rgba(34,211,238,.08);}
.ky-tag--amber{color:var(--ky-amber);border-color:rgba(245,158,11,.45);background:rgba(146,64,14,.35);}
.ky-tag--verify{color:var(--ky-verify);border-color:rgba(52,211,153,.42);background:rgba(52,211,153,.1);}

/* ---------- 面板 ---------- */
.ky-panel{
  border:2px solid var(--ky-line);
  background:rgba(17,26,46,.72);
  padding:28px;
}
.ky-panel--focus{
  box-shadow:8px 8px 0 0 rgba(34,211,238,.14);
  border-color:rgba(34,211,238,.38);
}

/* ---------- 按钮 ---------- */
.ky-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-family:var(--ky-font-mono);
  font-size:13px;
  letter-spacing:.06em;
  line-height:1;
  padding:12px 20px;
  border:2px solid transparent;
  background:transparent;
  color:var(--ky-snow);
  cursor:pointer;
  text-decoration:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.ky-btn--solid{
  background:var(--ky-cyan);
  border-color:var(--ky-cyan);
  color:#04121A;
  box-shadow:4px 4px 0 rgba(14,116,144,.6);
}
.ky-btn--solid:hover{
  background:var(--ky-cyan-deep);
  border-color:var(--ky-cyan-deep);
  color:var(--ky-snow);
  box-shadow:4px 4px 0 rgba(34,211,238,.32);
  transform:translate(-1px,-1px);
}
.ky-btn--ghost{
  border-color:var(--ky-line);
  color:var(--ky-snow);
}
.ky-btn--ghost:hover{
  border-color:var(--ky-cyan);
  color:var(--ky-cyan);
  background:rgba(34,211,238,.07);
}
.ky-btn--compact{padding:9px 15px;font-size:12px;}

.ky-btn[data-copied],
.ky-btn[data-copied]:hover{
  border-color:var(--ky-verify);
  color:var(--ky-verify);
  background:rgba(52,211,153,.1);
  box-shadow:none;
}

.ky-icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:2px solid var(--ky-line);
  color:var(--ky-mist);
  transition:border-color .18s ease,color .18s ease,background .18s ease;
}
.ky-icon-btn:hover{
  color:var(--ky-snow);
  border-color:var(--ky-cyan);
  background:rgba(34,211,238,.08);
}
.ky-icon-btn__glyph{
  position:relative;
  display:block;
  width:18px;
  height:13px;
  border:1.5px solid currentColor;
}
.ky-icon-btn__glyph::after{
  content:"";
  position:absolute;
  top:3px;
  left:50%;
  width:9px;
  height:9px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateX(-50%) rotate(45deg);
}

/* ---------- 面包屑 ---------- */
.ky-breadcrumb{padding-block:24px 0;}
.ky-breadcrumb__list{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--ky-mist);
}
.ky-breadcrumb__item{display:inline-flex;align-items:center;gap:8px;}
.ky-breadcrumb__link{color:var(--ky-mist);}
.ky-breadcrumb__link:hover{color:var(--ky-cyan);}
.ky-breadcrumb__sep{color:var(--ky-line);}
.ky-breadcrumb__item[aria-current="page"]{color:var(--ky-snow);}

/* ---------- 图片容器基础规则 ---------- */
.ky-media{
  position:relative;
  display:block;
  overflow:hidden;
  border:2px solid var(--ky-line);
  background:var(--ky-ink-2);
}
.ky-media__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:filter .2s ease,transform .2s ease;
}
.ky-media--16x9{aspect-ratio:16/9;}
.ky-media--4x3{aspect-ratio:4/3;}
.ky-media--3x2{aspect-ratio:3/2;}
.ky-media--1x1{aspect-ratio:1/1;}

.ky-media--placeholder{
  display:grid;
  place-items:center;
  padding:24px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--ky-mist);
  text-align:center;
  background-image:
    repeating-linear-gradient(135deg,rgba(38,51,73,.55) 0 1px,transparent 1px 14px);
}

.ky-media::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-8%;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(34,211,238,.85),transparent);
  opacity:0;
  pointer-events:none;
  z-index:2;
}
.ky-media:hover::before{opacity:1;animation:ky-scan 1.2s linear infinite;}
.ky-media:hover .ky-media__img{filter:brightness(1.04);}

@keyframes ky-scan{
  from{top:-4%;}
  to{top:104%;}
}

/* ---------- 头部 ---------- */
.ky-header{
  position:sticky;
  top:0;
  z-index:120;
  background:rgba(11,17,32,.96);
  border-bottom:1px solid var(--ky-line);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.ky-header__inner{
  max-width:var(--ky-w);
  margin-inline:auto;
  padding-inline:var(--ky-pad);
  height:var(--ky-header-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  transition:height .26s ease;
}
.ky-header[data-shrink] .ky-header__inner{height:var(--ky-header-h-sm);}

.ky-progress{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:transparent;
  overflow:hidden;
  pointer-events:none;
  z-index:2;
}
.ky-progress__bar{
  display:block;
  height:100%;
  width:0;
  background:var(--ky-cyan);
  transition:width .1s linear;
}

.ky-brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--ky-snow);
  flex:0 0 auto;
}
.ky-brand:hover{color:var(--ky-snow);}
.ky-brand__mark{
  width:10px;
  height:10px;
  background:var(--ky-cyan);
  box-shadow:0 0 0 3px rgba(34,211,238,.18);
  animation:ky-pulse 2.4s ease-in-out infinite;
  flex:0 0 auto;
}
.ky-brand__name{
  font-family:var(--ky-font-serif);
  font-size:20px;
  font-weight:700;
  letter-spacing:.02em;
}
.ky-brand__version{
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.12em;
  padding:2px 9px;
  border:1px solid rgba(34,211,238,.45);
  color:var(--ky-cyan);
  border-radius:999px;
  line-height:1.5;
}

.ky-header__right{
  display:flex;
  align-items:center;
  gap:28px;
}

/* 导航 */
.ky-nav{
  display:flex;
  align-items:center;
  gap:28px;
}
.ky-nav__list{
  display:flex;
  align-items:center;
  gap:28px;
}
.ky-nav__item{display:block;}
.ky-nav__link{
  position:relative;
  display:inline-block;
  padding:6px 0;
  font-size:15px;
  line-height:1.5;
  color:var(--ky-mist);
  transition:color .18s ease;
}
.ky-nav__link:hover{color:var(--ky-snow);}
.ky-nav__link[aria-current="page"]{color:var(--ky-snow);}
.ky-nav__link[aria-current="page"]::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:2px;
  background:var(--ky-cyan);
}
.ky-nav__foot{display:none;}

.ky-actions{display:flex;align-items:center;gap:12px;}

/* 移动端按钮 */
.ky-nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  padding:0 10px;
  background:transparent;
  border:2px solid var(--ky-line);
  cursor:pointer;
  transition:border-color .18s ease;
}
.ky-nav-toggle:hover{border-color:var(--ky-cyan);}
.ky-nav-toggle__bar{
  display:block;
  height:2px;
  width:100%;
  background:var(--ky-snow);
  transition:transform .2s ease,opacity .2s ease;
}
.ky-nav-toggle[aria-expanded="true"] .ky-nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ky-nav-toggle[aria-expanded="true"] .ky-nav-toggle__bar:nth-child(2){opacity:0;}
.ky-nav-toggle[aria-expanded="true"] .ky-nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- 页脚 ---------- */
.ky-footer{
  margin-top:96px;
  border-top:2px solid var(--ky-line);
  background:linear-gradient(180deg,rgba(17,26,46,.72),rgba(11,17,32,.98));
  padding-block:64px 28px;
}
.ky-footer__grid{
  max-width:var(--ky-w);
  margin-inline:auto;
  padding-inline:var(--ky-pad);
  display:grid;
  grid-template-columns:1.7fr 1.1fr 1fr 1.5fr;
  gap:48px 40px;
}
.ky-footer__col{min-width:0;}
.ky-footer__brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--ky-font-serif);
  font-size:22px;
  font-weight:700;
  color:var(--ky-snow);
}
.ky-footer__mark{
  width:10px;
  height:10px;
  background:var(--ky-cyan);
  box-shadow:0 0 0 3px rgba(34,211,238,.18);
  flex:0 0 auto;
}
.ky-footer__tagline{
  margin-top:16px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.14em;
  color:var(--ky-mist);
}
.ky-footer__icp{
  margin-top:10px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--ky-mist);
}
.ky-footer__col-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:18px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  font-weight:400;
  letter-spacing:.18em;
  color:var(--ky-mist);
  line-height:1.6;
}
.ky-footer__col-title::before{
  content:"";
  display:block;
  width:16px;
  height:2px;
  background:var(--ky-cyan);
  flex:0 0 auto;
}
.ky-footer__list{display:flex;flex-direction:column;gap:10px;}
.ky-footer__link{
  font-size:14px;
  color:var(--ky-mist);
  transition:color .16s ease;
}
.ky-footer__link:hover{color:var(--ky-snow);}
.ky-footer__meta{
  font-size:14px;
  line-height:1.9;
  color:var(--ky-mist);
  margin-bottom:12px;
  overflow-wrap:anywhere;
}
.ky-footer__meta strong{
  font-family:var(--ky-font-mono);
  font-size:11px;
  letter-spacing:.14em;
  font-weight:400;
  color:var(--ky-mist);
}
.ky-footer__legal{
  max-width:var(--ky-w);
  margin:48px auto 0;
  padding:20px var(--ky-pad) 0;
  border-top:1px solid var(--ky-line);
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 24px;
  font-family:var(--ky-font-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--ky-mist);
}

/* ---------- 动效与显现 ---------- */
.ky-motion .ky-reveal{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .5s ease,transform .5s ease;
}
.ky-motion .ky-reveal[data-visible]{
  opacity:1;
  transform:none;
}

/* ---------- 响应式 ---------- */
@media (max-width:1280px){
  :root{--ky-pad:40px;}
  .ky-nav__list{gap:20px;}
  .ky-nav__link{font-size:14px;}
  .ky-header__right{gap:20px;}
}

@media (max-width:1080px){
  :root{--ky-pad:24px;}

  .ky-header__inner,
  .ky-header[data-shrink] .ky-header__inner{
    height:var(--ky-mobile-h);
    gap:16px;
  }
  .ky-actions{display:none;}
  .ky-nav-toggle{display:inline-flex;}

  .ky-nav{
    position:fixed;
    top:var(--ky-mobile-h);
    left:0;
    right:0;
    height:calc(100vh - var(--ky-mobile-h));
    height:calc(100dvh - var(--ky-mobile-h));
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:16px 24px 48px;
    background:var(--ky-ink-2);
    border-top:1px solid var(--ky-line);
    overflow-y:auto;
    z-index:110;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    pointer-events:none;
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
  }
  .ky-nav[data-open]{
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
  }
  .ky-nav__list{
    flex-direction:column;
    align-items:stretch;
    gap:0;
  }
  .ky-nav__item{border-bottom:1px solid var(--ky-line);}
  .ky-nav__link{
    display:block;
    padding:16px 4px;
    font-size:18px;
  }
  .ky-nav__link[aria-current="page"]::after{
    left:4px;
    right:auto;
    width:32px;
    bottom:10px;
  }
  .ky-nav__foot{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:32px;
  }
  .ky-nav__foot .ky-btn{width:100%;}

  .ky-nav-open,
  .ky-nav-open body{overflow:hidden;}

  .ky-footer__grid{grid-template-columns:1fr 1fr;gap:40px 32px;}
  .ky-footer__legal{padding-inline:var(--ky-pad);}

  .ky-span-3,
  .ky-span-4,
  .ky-span-6,
  .ky-span-8,
  .ky-span-9{grid-column:span 12;}
  .ky-grid{gap:16px;}
  .ky-section{padding-block:48px;}
  .ky-footer{margin-top:64px;}
}

@media (max-width:640px){
  :root{--ky-pad:18px;}
  body{font-size:15px;line-height:1.7;}
  .ky-brand__name{font-size:18px;}
  .ky-brand__version{font-size:11px;padding:2px 7px;}
  .ky-footer__grid{grid-template-columns:1fr;gap:36px;}
  .ky-footer{padding-block:48px 24px;}
  .ky-footer__legal{flex-direction:column;margin-top:32px;}
  .ky-lead{font-size:16px;}
  .ky-panel{padding:20px;}
}

/* ---------- 减弱动效 ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .ky-motion .ky-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }
  .ky-media:hover::before{animation:none;opacity:0;}
  .ky-media:hover .ky-media__img{filter:none;}
}