/* ============================================================================
   客小帮 AI 智慧拓客平台 · 页面级样式
   包含：启动占位、登录页、工作台、官网落地页
   ========================================================================== */

/* ============================================================================
   0. 启动占位
   ========================================================================== */
.kx-boot {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--kx-sp-3);
  background: var(--kx-bg);
}
.kx-boot__logo { width: 56px; height: 56px; animation: kx-rise-in .5s var(--kx-ease) both; }
.kx-boot__title {
  font-size: var(--kx-fs-xl);
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--kx-text);
}
.kx-boot__tip {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-3);
}
.kx-boot__tip .kx-icon { color: var(--kx-primary); }

/* ============================================================================
   1. 登录页
   ========================================================================== */
.kx-login {
  display: flex;
  min-height: 100vh;
  background: var(--kx-surface);
}

/* 左侧品牌区 */
.kx-login__brand {
  position: relative;
  width: 55%;
  flex: none;
  overflow: hidden;
  background: var(--kx-gradient-deep);
  color: #fff;
  display: flex;
  align-items: center;
}
.kx-login__deco {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .95;
  pointer-events: none;
}
.kx-login__brand-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  padding: var(--kx-sp-10) var(--kx-sp-8);
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-8);
}
.kx-login__brand-top { display: flex; align-items: center; gap: var(--kx-sp-3); }
.kx-login__logo {
  width: 46px; height: 46px;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .28));
}
.kx-login__product {
  font-size: var(--kx-fs-2xl);
  font-weight: 700;
  letter-spacing: 3px;
  background: linear-gradient(135deg, #ffffff 25%, #7fe8ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.kx-login__slogan {
  font-size: var(--kx-fs-xs);
  color: rgba(255, 255, 255, .92);
  letter-spacing: 2px;
  margin-top: 2px;
}
.kx-login__hero { max-width: 520px; }
.kx-login__hero-title {
  font-size: var(--kx-fs-4xl);
  line-height: 1.32;
  font-weight: 700;
  letter-spacing: 1px;
  text-shadow: 0 4px 20px rgba(0, 0, 0, .18);
}
.kx-login__hero-accent {
  background: linear-gradient(135deg, #7fe8ff 0%, #00d4ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.kx-login__hero-desc {
  margin-top: var(--kx-sp-4);
  font-size: var(--kx-fs-md);
  line-height: 1.8;
  color: rgba(255, 255, 255, .95);
}
.kx-login__highlights { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-login__highlight {
  display: flex;
  align-items: flex-start;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: rgba(255, 255, 255, .15);
  border: 1px solid rgba(255, 255, 255, .22);
  backdrop-filter: blur(6px);
  transition: transform var(--kx-dur) var(--kx-ease), background var(--kx-dur) var(--kx-ease);
}
.kx-login__highlight:hover { transform: translateX(4px); background: rgba(255, 255, 255, .22); }
.kx-login__highlight-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px; height: 38px;
  border-radius: var(--kx-radius-sm);
  background: rgba(255, 255, 255, .24);
  color: #7fe8ff;
  flex: none;
}
.kx-login__highlight-title { font-size: var(--kx-fs); font-weight: 600; }
.kx-login__highlight-desc { font-size: var(--kx-fs-xs); color: rgba(255, 255, 255, .93); margin-top: 2px; line-height: 1.6; }
.kx-login__copyright { font-size: var(--kx-fs-xs); color: rgba(255, 255, 255, .8); }

/* 右侧表单区 */
.kx-login__panel {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--kx-sp-8) var(--kx-sp-6);
  background: var(--kx-surface);
}
.kx-login__card {
  width: 100%;
  max-width: 400px;
}
.kx-login__card-head { margin-bottom: var(--kx-sp-7); }
.kx-login__title {
  font-size: var(--kx-fs-3xl);
  font-weight: 700;
  color: var(--kx-text);
  letter-spacing: -.5px;
}
.kx-login__subtitle { margin-top: var(--kx-sp-2); font-size: var(--kx-fs-sm); color: var(--kx-text-3); }
.kx-login__form { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-login__field { display: flex; flex-direction: column; gap: 6px; }
.kx-login__label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
  font-weight: 500;
}
.kx-login__label .kx-icon { color: var(--kx-primary); }
.kx-login .kx-input {
  height: 44px;
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
  border-color: var(--kx-border-2);
}
.kx-login .kx-input:focus { background: var(--kx-surface); }
.kx-login .kx-input--prefix { padding-left: 38px; font-size: var(--kx-fs-md); }
.kx-login .kx-input__suffix { height: 40px; width: 36px; }

.kx-login__captcha { display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-login__captcha-input { flex: 1; }
.kx-login__captcha-box {
  width: 120px;
  height: 44px;
  border-radius: var(--kx-radius);
  overflow: hidden;
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface-2);
  flex: none;
  cursor: pointer;
}
.kx-login__captcha-img { width: 100%; height: 100%; object-fit: cover; }

.kx-login__options { display: flex; align-items: center; justify-content: space-between; }
.kx-login__forget { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-login__submit { margin-top: var(--kx-sp-2); letter-spacing: 4px; font-size: var(--kx-fs-lg); }
.kx-login__demo {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: var(--kx-sp-5);
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius);
  background: var(--kx-primary-50);
  border: 1px dashed var(--kx-primary-200);
  font-size: var(--kx-fs-xs);
  color: var(--kx-primary-dark);
}
.kx-login__demo .kx-icon { color: var(--kx-primary); }

@media (max-width: 900px) {
  .kx-login__brand { display: none; }
  .kx-login__panel { flex: 1; }
}

@media (max-width: 1200px) {
  .kx-login__brand-inner { padding: var(--kx-sp-8) var(--kx-sp-6); gap: var(--kx-sp-6); }
  .kx-login__hero-title { font-size: var(--kx-fs-3xl); }
}

/* ============================================================================
   2. 工作台
   ========================================================================== */
.kx-dash__card { display: flex; flex-direction: column; }
.kx-dash__body { flex: 1; min-height: 0; }
.kx-card--flush-body .kx-card__body { padding: 0; }
.kx-dash__skeleton { display: flex; flex-direction: column; gap: var(--kx-sp-3); padding: var(--kx-sp-2) 0; }
.kx-dash__chart { height: 300px; width: 100%; }
.kx-dash__chart--pie { height: 210px; }
.kx-dash__chart.is-loading { display: flex; align-items: center; }
.kx-dash__chart .kx-skeleton { width: 100%; }
.kx-dash__table { min-height: 120px; }
.kx-dash__list { display: flex; flex-direction: column; gap: var(--kx-sp-3); min-height: 120px; }
.kx-dash__list .kx-timeline { padding-top: var(--kx-sp-1); }

/* 时间范围切换 */
.kx-segmented {
  display: inline-flex;
  padding: 2px;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
}
.kx-segmented__item {
  padding: 0 12px;
  height: 26px;
  border-radius: 4px;
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-2);
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-segmented__item:hover { color: var(--kx-primary); }
.kx-segmented__item.is-active {
  background: var(--kx-surface);
  color: var(--kx-primary);
  font-weight: 600;
  box-shadow: var(--kx-shadow-xs);
}

/* 环形图图例 */
.kx-legend { display: flex; flex-direction: column; gap: var(--kx-sp-2); margin-top: var(--kx-sp-3); }
.kx-legend__summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: var(--kx-sp-2);
  border-bottom: 1px dashed var(--kx-border-2);
}
.kx-legend__rate { font-size: var(--kx-fs-xl); font-weight: 700; color: var(--kx-primary); font-variant-numeric: tabular-nums; }
.kx-legend__item { display: flex; align-items: center; gap: var(--kx-sp-2); font-size: var(--kx-fs-sm); color: var(--kx-text-2); }
.kx-legend__dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.kx-legend__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kx-legend__value { font-weight: 600; color: var(--kx-text); font-variant-numeric: tabular-nums; }
.kx-legend__percent { width: 52px; text-align: right; color: var(--kx-text-3); font-size: var(--kx-fs-xs); font-variant-numeric: tabular-nums; }

/* 排行序号 */
.kx-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  color: var(--kx-text-3);
  font-size: var(--kx-fs-xs);
  font-weight: 600;
}
.kx-rank--1 { background: var(--kx-gradient-primary); color: #fff; box-shadow: var(--kx-shadow-primary); }
.kx-rank--2 { background: var(--kx-gradient-accent); color: #00384a; box-shadow: var(--kx-shadow-accent); }
.kx-rank--3 { background: linear-gradient(135deg, #6b7280, #c9cdd4); color: #fff; }

/* 进度条单元格 */
.kx-progress-cell { display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-progress-cell .kx-progress { flex: 1; min-width: 46px; }
.kx-progress-cell__text { font-size: var(--kx-fs-xs); color: var(--kx-text-2); font-variant-numeric: tabular-nums; width: 44px; text-align: right; }

/* 异常预警 */
.kx-alert {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-3) var(--kx-sp-3) var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-alert:hover { transform: translateX(3px); box-shadow: var(--kx-shadow-sm); background: var(--kx-surface); }
.kx-alert__bar {
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
}
.kx-alert--danger .kx-alert__bar { background: var(--kx-danger); }
.kx-alert--warning .kx-alert__bar { background: var(--kx-warning); }
.kx-alert--info .kx-alert__bar { background: var(--kx-info); }
.kx-alert__main { flex: 1; min-width: 0; }
.kx-alert__title { display: flex; align-items: center; gap: var(--kx-sp-2); font-size: var(--kx-fs); color: var(--kx-text); font-weight: 500; }
.kx-alert__count { font-size: var(--kx-fs-lg); font-weight: 700; color: var(--kx-text); font-variant-numeric: tabular-nums; }
.kx-alert--danger .kx-alert__count { color: var(--kx-danger); }
.kx-alert--warning .kx-alert__count { color: var(--kx-warning); }
.kx-alert__tip { margin-top: 2px; font-size: var(--kx-fs-xs); color: var(--kx-text-3); line-height: 1.6; }

/* 顶部栏扩展：个人资料 / 公告列表 */
.kx-profile { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-profile__head { display: flex; align-items: center; gap: var(--kx-sp-3); }
.kx-profile__name { font-size: var(--kx-fs-lg); font-weight: 600; }
.kx-profile__meta { font-size: var(--kx-fs-xs); color: var(--kx-text-3); margin-top: 2px; }
.kx-profile__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
}
.kx-profile__cell { display: flex; flex-direction: column; gap: 3px; font-size: var(--kx-fs-sm); }
.kx-notice-list { min-height: 80px; }

@media (max-width: 1440px) {
  .kx-dash__chart { height: 280px; }
}

@media (max-width: 768px) {
  .kx-dash__chart { height: 240px; }
  .kx-profile__grid { grid-template-columns: 1fr; }
}

/* ============================================================================
   3. 官网落地页
   ========================================================================== */
.kx-landing {
  background: var(--kx-surface);
  color: var(--kx-text);
  overflow-x: hidden;
}
.kx-landing__container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 var(--kx-sp-6);
}

/* 导航 */
.kx-landing__nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--kx-border-2);
}
.kx-landing__nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kx-sp-5);
  height: 64px;
}
.kx-landing__brand { display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-landing__brand img { width: 32px; height: 32px; }
.kx-landing__brand-name {
  font-size: var(--kx-fs-xl);
  font-weight: 700;
  letter-spacing: 1px;
  background: var(--kx-gradient-primary);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.kx-landing__links { display: flex; align-items: center; gap: var(--kx-sp-6); }
.kx-landing__link {
  font-size: var(--kx-fs);
  color: var(--kx-text-2);
  transition: color var(--kx-dur) var(--kx-ease);
  position: relative;
}
.kx-landing__link::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 2px;
  border-radius: 2px;
  background: var(--kx-gradient-primary);
  transform: scaleX(0);
  transition: transform var(--kx-dur) var(--kx-ease);
}
.kx-landing__link:hover { color: var(--kx-primary); }
.kx-landing__link:hover::after { transform: scaleX(1); }

/* Hero */
.kx-landing__hero {
  position: relative;
  padding: var(--kx-sp-9) 0 var(--kx-sp-8);
  background: var(--kx-gradient-deep);
  color: #fff;
  overflow: hidden;
}
.kx-landing__hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: var(--kx-sp-8);
  align-items: center;
}
.kx-landing__hero-title {
  font-size: 44px;
  line-height: 1.24;
  font-weight: 700;
  letter-spacing: 1px;
}
.kx-landing__hero-title em {
  font-style: normal;
  background: linear-gradient(135deg, #7fe8ff 0%, #00d4ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.kx-landing__hero-desc {
  margin-top: var(--kx-sp-5);
  font-size: var(--kx-fs-lg);
  line-height: 1.85;
  color: rgba(255, 255, 255, .95);
  max-width: 520px;
}
.kx-landing__hero-actions { display: flex; align-items: center; gap: var(--kx-sp-3); margin-top: var(--kx-sp-7); flex-wrap: wrap; }
.kx-landing__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--kx-sp-2);
  height: 48px;
  padding: 0 var(--kx-sp-6);
  border-radius: var(--kx-radius-full);
  font-size: var(--kx-fs-md);
  font-weight: 600;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-landing__btn--primary {
  background: #fff;
  color: var(--kx-primary);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}
.kx-landing__btn--primary:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, .28); color: var(--kx-primary-dark); }
.kx-landing__btn--ghost {
  background: rgba(255, 255, 255, .12);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .32);
}
.kx-landing__btn--ghost:hover { background: rgba(255, 255, 255, .2); transform: translateY(-2px); color: #fff; }
.kx-landing__hero-badges {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-5);
  margin-top: var(--kx-sp-7);
  flex-wrap: wrap;
  font-size: var(--kx-fs-sm);
  color: rgba(255, 255, 255, .93);
}
.kx-landing__hero-badge { display: inline-flex; align-items: center; gap: 6px; }
.kx-landing__hero-badge .kx-icon { color: var(--kx-accent-light); }

/* Hero 右侧抽象产品面板 */
.kx-panel {
  position: relative;
  height: 340px;
  border-radius: var(--kx-radius-xl);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .28);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
  backdrop-filter: blur(10px);
  overflow: hidden;
  padding: var(--kx-sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-3);
}
.kx-panel__bar { display: flex; align-items: center; gap: 6px; }
.kx-panel__bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .34); }
.kx-panel__bar i:first-child { background: rgba(127, 232, 255, .9); }
.kx-panel__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--kx-sp-2); }
.kx-panel__tile {
  padding: 10px;
  border-radius: var(--kx-radius-sm);
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .22);
}
.kx-panel__tile-label { font-size: 11px; color: #fff; }
.kx-panel__tile-value { font-size: var(--kx-fs-xl); font-weight: 700; margin-top: 2px; font-variant-numeric: tabular-nums; }
.kx-panel__chart {
  flex: 1;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .2);
}
.kx-panel__bar-item {
  flex: 1;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, #7fe8ff 0%, rgba(127, 232, 255, .22) 100%);
  animation: kx-bar-rise .9s var(--kx-ease) both;
}
.kx-panel__rows { display: flex; flex-direction: column; gap: 6px; }
.kx-panel__row {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 7px 10px;
  border-radius: var(--kx-radius-sm);
  background: rgba(255, 255, 255, .1);
  font-size: var(--kx-fs-xs);
  color: #fff;
}
.kx-panel__dot { width: 6px; height: 6px; border-radius: 50%; background: #00a63e; box-shadow: 0 0 8px rgba(0, 166, 62, .9); }
.kx-panel__row span:nth-child(2) { flex: 1; }
.kx-panel__row b { font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }

@keyframes kx-bar-rise {
  from { height: 6px; opacity: 0; }
}

/* 通用区块标题 */
.kx-landing__section { padding: var(--kx-sp-9) 0; }
.kx-landing__section--alt { background: var(--kx-surface-2); }
.kx-landing__section-head { text-align: center; max-width: 640px; margin: 0 auto var(--kx-sp-8); }
.kx-landing__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: var(--kx-radius-full);
  background: var(--kx-primary-50);
  color: var(--kx-primary);
  font-size: var(--kx-fs-xs);
  font-weight: 600;
  letter-spacing: 1px;
}
.kx-landing__title { font-size: var(--kx-fs-3xl); font-weight: 700; margin-top: var(--kx-sp-4); letter-spacing: -.5px; }
.kx-landing__desc { margin-top: var(--kx-sp-3); font-size: var(--kx-fs-md); color: var(--kx-text-3); line-height: 1.8; }

/* 特性卡片 */
.kx-landing__features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--kx-sp-5); }
.kx-feature {
  padding: var(--kx-sp-6);
  border-radius: var(--kx-radius-lg);
  background: var(--kx-surface);
  border: 1px solid var(--kx-border-2);
  box-shadow: var(--kx-shadow-sm);
  transition: transform var(--kx-dur) var(--kx-ease), box-shadow var(--kx-dur) var(--kx-ease);
}
.kx-feature:hover { transform: translateY(-4px); box-shadow: var(--kx-shadow-lg); }
.kx-feature__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px; height: 48px;
  border-radius: var(--kx-radius);
  background: var(--kx-gradient-primary);
  color: #fff;
  box-shadow: var(--kx-shadow-primary);
  margin-bottom: var(--kx-sp-4);
}
.kx-feature__icon--accent { background: var(--kx-gradient-accent); box-shadow: var(--kx-shadow-accent); color: #00384a; }
.kx-feature__title { font-size: var(--kx-fs-lg); font-weight: 600; }
.kx-feature__desc { margin-top: var(--kx-sp-2); font-size: var(--kx-fs-sm); color: var(--kx-text-3); line-height: 1.8; }

/* 数据区 */
.kx-landing__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--kx-sp-5);
}
.kx-landing__stat {
  text-align: center;
  padding: var(--kx-sp-6) var(--kx-sp-4);
  border-radius: var(--kx-radius-lg);
  background: var(--kx-gradient-deep);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .06);
}
.kx-landing__stat-value {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -.5px;
  background: linear-gradient(135deg, #ffffff 20%, #7fe8ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-variant-numeric: tabular-nums;
}
.kx-landing__stat-value small { font-size: var(--kx-fs-lg); margin-left: 2px; }
.kx-landing__stat-label { margin-top: var(--kx-sp-2); font-size: var(--kx-fs-sm); color: rgba(255, 255, 255, .9); }

/* CTA */
.kx-landing__cta {
  position: relative;
  padding: var(--kx-sp-8) var(--kx-sp-7);
  border-radius: var(--kx-radius-xl);
  background: var(--kx-gradient-primary);
  color: #fff;
  text-align: center;
  overflow: hidden;
  box-shadow: var(--kx-shadow-lg);
}
.kx-landing__cta-title { font-size: var(--kx-fs-3xl); font-weight: 700; }
.kx-landing__cta-desc { margin-top: var(--kx-sp-3); color: rgba(255, 255, 255, .95); font-size: var(--kx-fs-md); }
.kx-landing__cta-actions { margin-top: var(--kx-sp-6); display: flex; justify-content: center; gap: var(--kx-sp-3); flex-wrap: wrap; }

/* 页脚 */
.kx-landing__footer {
  padding: var(--kx-sp-7) 0 var(--kx-sp-6);
  background: #14161f;
  color: rgba(255, 255, 255, .6);
  font-size: var(--kx-fs-sm);
}
.kx-landing__footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: var(--kx-sp-6);
  padding-bottom: var(--kx-sp-6);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.kx-landing__footer h4 { color: #fff; font-size: var(--kx-fs); margin-bottom: var(--kx-sp-3); font-weight: 600; }
.kx-landing__footer li { margin-bottom: var(--kx-sp-2); }
.kx-landing__footer a { color: rgba(255, 255, 255, .6); }
.kx-landing__footer a:hover { color: #7fe8ff; }
.kx-landing__footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kx-sp-3);
  flex-wrap: wrap;
  padding-top: var(--kx-sp-4);
  font-size: var(--kx-fs-xs);
  color: rgba(255, 255, 255, .42);
}

@media (max-width: 1024px) {
  .kx-landing__hero-grid { grid-template-columns: 1fr; }
  .kx-landing__hero-title { font-size: 34px; }
  .kx-landing__features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kx-landing__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kx-landing__footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kx-landing__links { display: none; }
}

@media (max-width: 640px) {
  .kx-landing__container { padding: 0 var(--kx-sp-4); }
  .kx-landing__hero-title { font-size: 28px; }
  .kx-landing__features,
  .kx-landing__stats { grid-template-columns: 1fr; }
  .kx-landing__section { padding: var(--kx-sp-8) 0; }
  .kx-landing__title { font-size: var(--kx-fs-2xl); }
  .kx-landing__footer-grid { grid-template-columns: 1fr; }
}

/* ============================================================================
   4. 业务管理页面通用骨架（设备 / 账号 / 资源 / 数据中心共用，勿在此硬编码色值）
   命名前缀 kx-bp__（business page），页面私有样式请使用 kx-页面名__ 前缀
   ========================================================================== */

/* ---------------------------------------------------------------- 筛选区 */
.kx-bp__filter-grid {
  display: grid;
  gap: var(--kx-sp-3) var(--kx-sp-4);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.kx-bp__filter-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kx-bp__filter-item { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.kx-bp__filter-label { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-bp__filter-collapse.is-collapsed { display: none; }
.kx-bp__filter-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--kx-sp-2);
  margin-top: var(--kx-sp-4);
  padding-top: var(--kx-sp-4);
  border-top: 1px dashed var(--kx-border-2);
}
.kx-bp__filter-foot .kx-btn--text { margin-right: auto; }
.kx-stat-date { min-width: 240px; }

/* ---------------------------------------------------------------- 工具栏 */
.kx-bp__toolbar {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  flex-wrap: wrap;
  padding: var(--kx-sp-4) var(--kx-sp-5);
  border-bottom: 1px solid var(--kx-border-2);
}
.kx-bp__toolbar-main { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-bp__selinfo {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-2);
}
.kx-bp__selinfo b { color: var(--kx-primary); }
.kx-bp__selinfo .kx-icon { color: var(--kx-primary); }

/* ---------------------------------------------------------------- 表格卡片 */
.kx-bp__table-card .kx-card__body { padding: 0; }
.kx-bp__table-card .kx-table__footer { background: var(--kx-surface-2); }

/* ---------------------------------------------------------------- 操作列 */
.kx-bp__op { display: inline-flex; align-items: center; justify-content: flex-end; gap: 2px; }
.kx-bp__opbtn { width: 28px; height: 28px; padding: 0; justify-content: center; }
.kx-bp__rowmenu { min-width: 152px; }

/* ---------------------------------------------------------------- 分组 / 卡片网格 */
.kx-bp__cards,
.kx-device-group__grid,
.kx-account-group__grid {
  display: grid;
  gap: var(--kx-sp-4);
  grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
}
.kx-bp__cards.is-empty,
.kx-device-group__grid.is-empty,
.kx-account-group__grid.is-empty { grid-template-columns: minmax(0, 1fr); }

.kx-bp__gcard {
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-5);
}
.kx-bp__gcard:hover {
  transform: translateY(-2px);
  box-shadow: var(--kx-shadow);
  border-color: var(--kx-primary-200);
}
.kx-bp__gcard-head { display: flex; align-items: center; gap: var(--kx-sp-3); min-width: 0; }
.kx-bp__gcard-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex: none;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-primary-50);
  color: var(--kx-primary);
}
.kx-bp__gcard-title { font-size: var(--kx-fs); font-weight: 600; color: var(--kx-text); }
.kx-bp__gcard-tools { display: flex; align-items: center; opacity: 0; transition: opacity var(--kx-dur) var(--kx-ease); }
.kx-bp__gcard:hover .kx-bp__gcard-tools { opacity: 1; }
.kx-bp__gcard-meta { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-bp__gcard-desc { font-size: var(--kx-fs-xs); color: var(--kx-text-3); line-height: 1.7; min-height: 34px; }

/* ---------------------------------------------------------------- 键值信息（抽屉详情） */
.kx-bp__detail { display: flex; flex-direction: column; }
.kx-bp__section + .kx-bp__section {
  margin-top: var(--kx-sp-5);
  padding-top: var(--kx-sp-5);
  border-top: 1px solid var(--kx-border-2);
}
.kx-bp__section-title {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: var(--kx-sp-3);
  font-size: var(--kx-fs-sm);
  font-weight: 600;
  color: var(--kx-text);
}
.kx-bp__section-title .kx-icon { color: var(--kx-primary); }
.kx-bp__kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--kx-sp-3) var(--kx-sp-5);
}
.kx-bp__kv-item { display: flex; gap: var(--kx-sp-2); min-width: 0; font-size: var(--kx-fs-sm); }
.kx-bp__kv-item--full { grid-column: 1 / -1; }
.kx-bp__kv-label { flex: none; min-width: 78px; color: var(--kx-text-3); }
.kx-bp__kv-value { color: var(--kx-text); word-break: break-all; }

/* ---------------------------------------------------------------- 状态与脉冲点 */
.kx-bp__status { display: inline-flex; align-items: center; gap: 6px; }
.kx-bp__pulse {
  position: relative;
  display: inline-block;
  width: 8px;
  height: 8px;
  flex: none;
  border-radius: 50%;
  background: var(--kx-success);
}
.kx-bp__pulse::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 1px solid var(--kx-success);
  animation: kx-pulse 1.8s var(--kx-ease) infinite;
}

/* ---------------------------------------------------------------- 提示 / 导入 / 激活码 */
.kx-bp__hint {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius);
  background: var(--kx-primary-50);
  border: 1px dashed var(--kx-primary-200);
  font-size: var(--kx-fs-xs);
  line-height: 1.7;
  color: var(--kx-primary-dark);
}
.kx-bp__hint .kx-icon { flex: none; margin-top: 2px; color: var(--kx-primary); }
.kx-bp__import { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-bp__import-tools { display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-bp__import-result { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-bp__import-summary { display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-bp__import-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 240px;
  overflow-y: auto;
  padding: var(--kx-sp-1);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
}
.kx-bp__import-row {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  padding: 7px 10px;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface);
  border-left: 3px solid var(--kx-border);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
}
.kx-bp__import-row.is-ok { border-left-color: var(--kx-success); }
.kx-bp__import-row.is-fail { border-left-color: var(--kx-danger); }
.kx-bp__import-line { flex: none; color: var(--kx-text-3); font-size: var(--kx-fs-xs); }

.kx-bp__code-wrap { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-bp__code {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--kx-sp-5);
  border-radius: var(--kx-radius-lg);
  background: var(--kx-surface-2);
  border: 1px dashed var(--kx-border);
}
.kx-bp__code-value {
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-4xl);
  font-weight: 700;
  letter-spacing: 8px;
  color: var(--kx-primary);
}

/* ---------------------------------------------------------------- 加载 / 列表行 / 指标 */
.kx-bp__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--kx-sp-2);
  padding: var(--kx-sp-7) 0;
  color: var(--kx-text-3);
  font-size: var(--kx-fs-sm);
}
.kx-bp__listrow {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  margin-bottom: var(--kx-sp-2);
}
.kx-bp__running {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 10px var(--kx-sp-3);
  margin-bottom: var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-primary-50);
  font-size: var(--kx-fs-sm);
  color: var(--kx-primary-dark);
}
.kx-bp__metrics { display: flex; gap: var(--kx-sp-3); flex-wrap: wrap; margin-bottom: var(--kx-sp-4); }
.kx-bp__metric {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 92px;
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
}
.kx-bp__metric-value { font-size: var(--kx-fs-xl); font-weight: 700; color: var(--kx-text); font-variant-numeric: tabular-nums; }
.kx-bp__metric-label { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-bp__metric--success .kx-bp__metric-value { color: var(--kx-success); }
.kx-bp__metric--danger .kx-bp__metric-value { color: var(--kx-danger); }
.kx-bp__metric--info .kx-bp__metric-value { color: var(--kx-info); }

.kx-bp__pagefoot { display: flex; align-items: center; justify-content: flex-end; gap: var(--kx-sp-4); }
.kx-bp__batch-bind-form { margin-top: var(--kx-sp-3); }

/* ============================================================================
   5. 设备列表 / 设备分组
   ========================================================================== */
.kx-device-list__stats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kx-device-list__stat { cursor: pointer; }
.kx-device-list__stat.is-active {
  border-color: var(--kx-primary);
  box-shadow: 0 0 0 2px var(--kx-primary-100), var(--kx-shadow-sm);
}
.kx-device-list__table { min-height: 120px; }
.kx-device-group__list { display: block; }

/* ============================================================================
   6. 账号列表 / 账号分组 / 账号健康
   ========================================================================== */
.kx-account-list__stats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kx-account-list__platform { display: flex; align-items: center; gap: 6px; min-width: 0; }
.kx-account-list__platform-icon { display: inline-flex; flex: none; color: var(--kx-text-3); }
.kx-account-list__secret {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--kx-sp-5);
  border-radius: var(--kx-radius-lg);
  background: var(--kx-surface-2);
  border: 1px dashed var(--kx-border);
}
.kx-account-list__secret-value {
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-2xl);
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--kx-primary);
  word-break: break-all;
}
.kx-account-group__list { display: block; }

.kx-account-health__top {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: 1.15fr 0.85fr;
}
.kx-account-health__overview { display: flex; align-items: center; gap: var(--kx-sp-4); }
.kx-account-health__chart { flex: 1; min-width: 0; height: 230px; }
.kx-account-health__legend { width: 236px; flex: none; }
.kx-account-health__risk { display: flex; flex-direction: column; gap: var(--kx-sp-2); max-height: 262px; overflow-y: auto; }
.kx-account-health__risk-item {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  padding: 8px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  border-left: 3px solid var(--kx-border);
}
.kx-account-health__risk-item.is-danger { border-left-color: var(--kx-danger); }
.kx-account-health__risk-item.is-warning { border-left-color: var(--kx-warning); }
.kx-account-health__risk-item.is-success { border-left-color: var(--kx-success); }
.kx-account-health__risk-score {
  flex: none;
  min-width: 34px;
  text-align: center;
  font-size: var(--kx-fs-lg);
  font-weight: 700;
  color: var(--kx-text);
  font-variant-numeric: tabular-nums;
}
.kx-account-health__curve { height: 250px; margin-bottom: var(--kx-sp-4); }

/* ============================================================================
   7. 素材库
   ========================================================================== */
.kx-material__layout {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: 264px minmax(0, 1fr);
  align-items: start;
}
.kx-material__aside .kx-card__body { padding: var(--kx-sp-3); }
.kx-material__groups { display: flex; flex-direction: column; gap: 2px; }
.kx-material__group { display: flex; align-items: center; border-radius: var(--kx-radius-sm); }
.kx-material__group-main {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  flex: 1;
  min-width: 0;
  padding: 8px 10px;
  border-radius: var(--kx-radius-sm);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-material__group-main .kx-icon { flex: none; color: var(--kx-text-3); }
.kx-material__group-main:hover { background: var(--kx-primary-50); color: var(--kx-primary); }
.kx-material__group.is-active .kx-material__group-main {
  background: var(--kx-primary-100);
  color: var(--kx-primary-dark);
  font-weight: 600;
}
.kx-material__group.is-active .kx-material__group-main .kx-icon { color: var(--kx-primary); }
.kx-material__group-tools { display: none; align-items: center; }
.kx-material__group:hover .kx-material__group-tools { display: flex; }

.kx-material__grid {
  display: grid;
  gap: var(--kx-sp-4);
  grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
}
.kx-material__grid.is-empty { grid-template-columns: minmax(0, 1fr); }
.kx-material__card {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--kx-radius);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  transition: box-shadow var(--kx-dur) var(--kx-ease), transform var(--kx-dur) var(--kx-ease);
}
.kx-material__card:hover { transform: translateY(-2px); box-shadow: var(--kx-shadow); border-color: var(--kx-primary-200); }
.kx-material__thumb {
  position: relative;
  height: 134px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--kx-surface-2);
}
.kx-material__thumb img { width: 100%; height: 100%; object-fit: cover; }
.kx-material__thumb--text { align-items: flex-start; padding: var(--kx-sp-3); }
.kx-material__thumb--media { background: var(--kx-primary-50); }
.kx-material__thumb-icon { color: var(--kx-text-4); }
.kx-material__text {
  font-size: var(--kx-fs-xs);
  line-height: 1.75;
  color: var(--kx-text-2);
  white-space: pre-line;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  -webkit-box-orient: vertical;
}
.kx-material__duration {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 1px 7px;
  border-radius: var(--kx-radius-full);
  background: var(--kx-text);
  color: var(--kx-surface);
  font-size: 11px;
}
.kx-material__actions {
  position: absolute;
  top: 6px;
  right: 6px;
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface);
  box-shadow: var(--kx-shadow-sm);
  opacity: 0;
  transition: opacity var(--kx-dur) var(--kx-ease);
}
.kx-material__card:hover .kx-material__actions { opacity: 1; }
.kx-material__actions .kx-btn { width: 28px; height: 28px; padding: 0; justify-content: center; }
.kx-material__body { display: flex; flex-direction: column; gap: 6px; padding: var(--kx-sp-3); flex: 1; }
.kx-material__name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-material__meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kx-material__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--kx-sp-2); margin-top: auto; }
.kx-material__table { min-height: 120px; }
.kx-material__upload { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-material__upload-preview {
  width: 132px;
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--kx-radius-sm);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface-2);
}
.kx-material__upload-preview img { width: 100%; height: 100%; object-fit: cover; }
.kx-material__upload-actions { display: flex; align-items: center; gap: var(--kx-sp-3); flex-wrap: wrap; }

/* ============================================================================
   8. 代理 IP 池
   ========================================================================== */
.kx-proxy__addr { font-family: var(--kx-font-mono); font-size: var(--kx-fs-sm); color: var(--kx-text); }
.kx-proxy__check-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 320px;
  overflow-y: auto;
  padding: var(--kx-sp-1);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
}

/* ============================================================================
   9. 数据中心（总览 / 任务 / 账号 / 设备 / 触达明细）
   ========================================================================== */
.kx-stat-overview__metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.kx-stat-overview__chart { height: 300px; width: 100%; }
.kx-stat-overview__funnel { height: 268px; width: 100%; }
.kx-stat-overview__funnel-legend {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-5);
  flex-wrap: wrap;
  margin-top: var(--kx-sp-3);
  padding-top: var(--kx-sp-3);
  border-top: 1px dashed var(--kx-border-2);
}
.kx-stat-overview__funnel-rate { display: flex; align-items: center; gap: 6px; }
.kx-stat-overview__rank { min-height: 268px; }
.kx-stat-overview__daterange { min-width: 260px; }
.kx-stat-device__chart { height: 260px; width: 100%; }

/* ============================================================================
   10. 业务页面响应式
   ========================================================================== */
@media (max-width: 1440px) {
  .kx-stat-overview__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kx-bp__filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1200px) {
  .kx-device-list__stats,
  .kx-account-list__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kx-account-health__top { grid-template-columns: minmax(0, 1fr); }
  .kx-material__layout { grid-template-columns: minmax(0, 1fr); }
  .kx-material__groups { flex-direction: row; flex-wrap: wrap; }
}

@media (max-width: 1024px) {
  .kx-bp__filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kx-account-health__overview { flex-direction: column; align-items: stretch; }
  .kx-account-health__legend { width: 100%; }
}

@media (max-width: 768px) {
  .kx-bp__filter-grid,
  .kx-bp__filter-grid--2 { grid-template-columns: minmax(0, 1fr); }
  .kx-bp__kv { grid-template-columns: minmax(0, 1fr); }
  .kx-device-list__stats,
  .kx-account-list__stats,
  .kx-stat-overview__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kx-stat-overview__chart { height: 240px; }
  .kx-bp__pagefoot { justify-content: center; }
}

/* ============================================================================
   11. 系统管理（用户 / 角色 / 部门 / 字典 / 区域 / 配置 / 公告 / 应用 / 日志）
   仅允许使用 CSS 变量，禁止硬编码色值
   ========================================================================== */

/* ---------------------------------------------------------------- 通用布局 */
.kx-sys__split {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
}
.kx-sys__aside {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - var(--kx-topbar-h) - var(--kx-sp-8));
  overflow: hidden;
  border-radius: var(--kx-radius-lg);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  box-shadow: var(--kx-shadow-xs);
}
.kx-sys__aside-head {
  padding: var(--kx-sp-4) var(--kx-sp-4) var(--kx-sp-3);
  border-bottom: 1px solid var(--kx-border-2);
}
.kx-sys__aside-title {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  font-size: var(--kx-fs-md);
  font-weight: 600;
  color: var(--kx-text);
}
.kx-sys__aside-title .kx-icon { color: var(--kx-primary); }
.kx-sys__aside-search { padding: var(--kx-sp-3) var(--kx-sp-4) 0; }
.kx-sys__aside-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--kx-sp-3) var(--kx-sp-4) var(--kx-sp-4);
}
.kx-sys__main { display: flex; flex-direction: column; gap: var(--kx-sp-5); min-width: 0; }
.kx-sys__tree { min-height: 60px; }
.kx-sys__mono { font-family: var(--kx-font-mono); font-size: var(--kx-fs-sm); }
.kx-sys__tags { display: flex; align-items: center; gap: var(--kx-sp-1); flex-wrap: wrap; }
.kx-sys__form-wrap { display: flex; flex-direction: column; gap: var(--kx-sp-3); }

/* ---------------------------------------------------------------- 用户管理 */
.kx-sys__user { display: flex; align-items: center; gap: var(--kx-sp-2); min-width: 0; }

/* ---------------------------------------------------------------- 角色权限 */
.kx-sys__rolelist { display: flex; flex-direction: column; gap: var(--kx-sp-2); }
.kx-sys__role {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  border: 1px solid transparent;
  background: var(--kx-surface-2);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-sys__role:hover { border-color: var(--kx-primary-200); background: var(--kx-primary-50); }
.kx-sys__role.is-active {
  border-color: var(--kx-primary);
  background: var(--kx-primary-100);
  box-shadow: 0 0 0 1px var(--kx-primary-200);
}
.kx-sys__role-top { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-sys__role-name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-sys__role-code { font-family: var(--kx-font-mono); font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-sys__role-meta {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  flex-wrap: wrap;
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-3);
}
.kx-sys__role-meta > span { display: inline-flex; align-items: center; gap: 4px; }
.kx-sys__perm-card { min-height: 320px; }
.kx-sys__perm-toolbar {
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-3);
  padding-bottom: var(--kx-sp-4);
  border-bottom: 1px dashed var(--kx-border-2);
}
.kx-sys__perm-tools { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-sys__perm-module { min-width: 190px; }
.kx-sys__perm-tree { max-height: 520px; overflow-y: auto; padding-top: var(--kx-sp-2); }

/* ---------------------------------------------------------------- 部门管理 */
.kx-sys__deptcard .kx-card__body { padding: var(--kx-sp-3) var(--kx-sp-5) var(--kx-sp-5); }
.kx-sys__depttable { min-height: 120px; overflow-x: auto; }
.kx-sys__tt-head,
.kx-sys__tt-row {
  display: grid;
  grid-template-columns: minmax(240px, 1.6fr) 120px 140px 80px 92px 260px;
  align-items: center;
  gap: var(--kx-sp-2);
  min-width: 940px;
}
.kx-sys__tt-head {
  padding: 10px var(--kx-sp-3);
  border-bottom: 1px solid var(--kx-border-2);
  background: var(--kx-surface-2);
  border-radius: var(--kx-radius-sm) var(--kx-radius-sm) 0 0;
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-3);
  font-weight: 500;
}
.kx-sys__tt-row {
  padding: 8px var(--kx-sp-3);
  border-bottom: 1px solid var(--kx-border-2);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
  transition: background var(--kx-dur) var(--kx-ease);
}
.kx-sys__tt-row:hover { background: var(--kx-primary-50); }
.kx-sys__tt-cell { min-width: 0; display: flex; align-items: center; gap: var(--kx-sp-2); }
.kx-sys__tt-cell--name { gap: 2px; }
.kx-sys__tt-cell--op { justify-content: flex-end; }
.kx-sys__tt-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: none;
  border-radius: var(--kx-radius-sm);
  color: var(--kx-text-3);
  cursor: pointer;
  transition: transform var(--kx-dur) var(--kx-ease), color var(--kx-dur) var(--kx-ease);
}
.kx-sys__tt-arrow:hover { color: var(--kx-primary); background: var(--kx-primary-100); }
.kx-sys__tt-arrow.is-expanded { transform: rotate(90deg); }
.kx-sys__tt-arrow.is-empty { visibility: hidden; }
.kx-sys__tt-name { display: flex; align-items: center; gap: var(--kx-sp-2); min-width: 0; }

/* ---------------------------------------------------------------- 数据字典 */
.kx-sys__dictlist { display: flex; flex-direction: column; gap: 2px; }
.kx-sys__dictitem {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 8px 10px;
  border-radius: var(--kx-radius-sm);
  cursor: pointer;
  transition: background var(--kx-dur) var(--kx-ease);
}
.kx-sys__dictitem:hover { background: var(--kx-primary-50); }
.kx-sys__dictitem.is-active { background: var(--kx-primary-100); }
.kx-sys__dictitem-main { flex: 1; min-width: 0; }
.kx-sys__dictitem-name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-sys__dictitem.is-active .kx-sys__dictitem-name { color: var(--kx-primary-dark); }
.kx-sys__dictitem-code { font-family: var(--kx-font-mono); font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-sys__dictitem-meta { display: flex; align-items: center; gap: 4px; flex: none; }
.kx-sys__dictitem-tools { display: none; align-items: center; position: absolute; right: 8px; padding: 2px; border-radius: var(--kx-radius-sm); background: var(--kx-surface); box-shadow: var(--kx-shadow-sm); }
.kx-sys__dictitem:hover .kx-sys__dictitem-tools { display: flex; }
.kx-sys__dictlabel { display: flex; align-items: center; gap: var(--kx-sp-2); }

/* ---------------------------------------------------------------- 城市区域 */
.kx-sys__treeview { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-sys__hotbox {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  flex-wrap: wrap;
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-accent-50);
  border: 1px dashed var(--kx-accent);
}
.kx-sys__hotbox-title { display: inline-flex; align-items: center; gap: 4px; font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-accent-deep); }
.kx-sys__hot { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-sys__hotitem { display: inline-flex; align-items: center; gap: 3px; }
.kx-sys__area-tree {
  max-height: 560px;
  overflow-y: auto;
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
}
.kx-sys__listview { min-height: 120px; }

/* ---------------------------------------------------------------- 系统配置 */
.kx-sys__nav { display: flex; flex-direction: column; gap: 2px; }
.kx-sys__navitem {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 9px 10px;
  border-radius: var(--kx-radius-sm);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-sys__navitem:hover { background: var(--kx-primary-50); color: var(--kx-primary); }
.kx-sys__navitem.is-active { background: var(--kx-primary-100); color: var(--kx-primary-dark); font-weight: 600; }
.kx-sys__navicon { display: inline-flex; flex: none; color: var(--kx-text-3); }
.kx-sys__navitem.is-active .kx-sys__navicon { color: var(--kx-primary); }
.kx-sys__navtext { flex: 1; min-width: 0; }
.kx-sys__config-card .kx-card__body { display: flex; flex-direction: column; gap: var(--kx-sp-5); }
.kx-sys__form { min-height: 120px; }
.kx-sys__aitest { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-sys__aitest-loading {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
}
.kx-sys__aitest-loading .kx-icon { color: var(--kx-primary); }
.kx-sys__aitest-box {
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-4);
  border-radius: var(--kx-radius);
  border: 1px solid var(--kx-border-2);
  border-left: 3px solid var(--kx-border);
  background: var(--kx-surface-2);
}
.kx-sys__aitest-box.is-ok { border-left-color: var(--kx-success); background: var(--kx-success-bg); }
.kx-sys__aitest-box.is-fail { border-left-color: var(--kx-danger); background: var(--kx-danger-bg); }
.kx-sys__aitest-head { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; font-size: var(--kx-fs-sm); }
.kx-sys__aitest-box.is-ok .kx-sys__aitest-head > .kx-icon { color: var(--kx-success); }
.kx-sys__aitest-box.is-fail .kx-sys__aitest-head > .kx-icon { color: var(--kx-danger); }
.kx-sys__aitest-row { display: flex; gap: var(--kx-sp-3); font-size: var(--kx-fs-sm); }
.kx-sys__aitest-label { flex: none; min-width: 68px; color: var(--kx-text-3); }
.kx-sys__aitest-value { flex: 1; min-width: 0; color: var(--kx-text); word-break: break-all; }

/* ---------------------------------------------------------------- 开放应用 */
.kx-sys__secretcell { display: flex; align-items: center; gap: 4px; min-width: 0; }
.kx-sys__masked { color: var(--kx-text-3); letter-spacing: 1px; }
.kx-sys__secret-wrap { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-sys__secret-alert {
  display: flex;
  align-items: flex-start;
  gap: var(--kx-sp-2);
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  border-left: 3px solid var(--kx-warning);
  background: var(--kx-warning-bg);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text);
  line-height: 1.7;
}
.kx-sys__secret-alert .kx-icon { flex: none; margin-top: 2px; color: var(--kx-warning); }
.kx-sys__secret-row {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-3);
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
}
.kx-sys__secret-label { flex: none; width: 88px; font-size: var(--kx-fs-sm); color: var(--kx-text-3); }
.kx-sys__secret-value {
  flex: 1;
  min-width: 0;
  font-size: var(--kx-fs-sm);
  color: var(--kx-text);
  word-break: break-all;
  user-select: all;
}

/* ---------------------------------------------------------------- 操作日志 / 登录日志 */
.kx-sys__duration { display: inline-flex; align-items: baseline; gap: 1px; font-variant-numeric: tabular-nums; }
.kx-sys__duration.is-slow { color: var(--kx-danger); font-weight: 600; }
.kx-sys__logdetail { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-sys__code {
  margin: 0;
  padding: var(--kx-sp-3);
  max-height: 260px;
  overflow: auto;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-xs);
  line-height: 1.7;
  color: var(--kx-text-2);
  white-space: pre-wrap;
  word-break: break-all;
}
.kx-sys__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kx-stat__icon--danger { background: linear-gradient(135deg, var(--kx-danger) 0%, var(--kx-primary-light) 100%); box-shadow: var(--kx-shadow-primary); }
.kx-sys__logincard .kx-table__row.is-fail > td { background: var(--kx-danger-bg); }
.kx-sys__logincard .kx-table__row.is-fail:hover > td { background: var(--kx-danger-bg); }

/* ---------------------------------------------------------------- 响应式 */
@media (max-width: 1200px) {
  .kx-sys__split { grid-template-columns: minmax(0, 1fr); }
  .kx-sys__aside { position: static; max-height: none; }
  .kx-sys__aside-body { max-height: 320px; }
  .kx-sys__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .kx-sys__stats { grid-template-columns: minmax(0, 1fr); }
  .kx-sys__secret-row { flex-wrap: wrap; }
  .kx-sys__secret-label { width: auto; }
}



/* ============================================================================
   14. 脚本工场（脚本库 / 动作积木 / AI 工场 / 联调测试）
   命名前缀 kx-script__ / kx-block__ / kx-ai__
   ========================================================================== */

/* ---------------------------------------------------------------- 脚本库 */
.kx-script__stats,
.kx-biz__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kx-script__table,
.kx-script-test__table,
.kx-task__table,
.kx-task__job-table,
.kx-task-log__table,
.kx-biz__table { min-height: 120px; }

.kx-script__code-text {
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-2);
  word-break: break-all;
}
.kx-script__code-text.is-current { color: var(--kx-primary); font-weight: 600; }

.kx-script-test__no {
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-2);
}

/* 代码块 */
.kx-script__codeblock,
.kx-ai__codeblock {
  display: flex;
  flex-direction: column;
  border-radius: var(--kx-radius);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface-2);
  overflow: hidden;
}
.kx-script__codeblock + .kx-script__codeblock,
.kx-ai__codeblock { margin-top: var(--kx-sp-4); }
.kx-script__codeblock-bar,
.kx-ai__codeblock-bar {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 6px var(--kx-sp-3);
  border-bottom: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  color: var(--kx-text-3);
}
.kx-script__codeblock-title,
.kx-ai__codeblock-title { font-size: var(--kx-fs-xs); color: var(--kx-text-2); }
.kx-script__code,
.kx-ai__code {
  margin: 0;
  padding: var(--kx-sp-4);
  max-height: 420px;
  overflow: auto;
  font-family: var(--kx-font-mono);
  font-size: var(--kx-fs-xs);
  line-height: 1.75;
  color: var(--kx-text);
  white-space: pre-wrap;
  word-break: break-word;
}
.kx-script__code-empty,
.kx-ai__code-empty { padding: var(--kx-sp-5); text-align: center; font-size: var(--kx-fs-sm); color: var(--kx-text-3); }

/* 步骤时间线 */
.kx-script__tree,
.kx-ai__tree { display: flex; flex-direction: column; gap: var(--kx-sp-2); }
.kx-script__tree--child,
.kx-ai__tree--child {
  margin: var(--kx-sp-2) 0 var(--kx-sp-2) var(--kx-sp-5);
  padding-left: var(--kx-sp-4);
  border-left: 2px dashed var(--kx-border);
}
.kx-script__node,
.kx-ai__node { display: flex; align-items: flex-start; gap: var(--kx-sp-3); }
.kx-script__node-index,
.kx-ai__node-index {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: var(--kx-radius-full);
  background: var(--kx-border-2);
  color: var(--kx-text-2);
  font-size: var(--kx-fs-xs);
  font-variant-numeric: tabular-nums;
}
.kx-script__node-index.is-risk-1,
.kx-ai__node.is-risk-1 .kx-ai__node-index { background: var(--kx-success-bg); color: #00891f; }
.kx-script__node-index.is-risk-2,
.kx-ai__node.is-risk-2 .kx-ai__node-index { background: var(--kx-warning-bg); color: #c15d00; }
.kx-script__node-index.is-risk-3,
.kx-ai__node.is-risk-3 .kx-ai__node-index { background: var(--kx-danger-bg); color: #cb2634; }
.kx-script__node-main,
.kx-ai__node-main {
  flex: 1;
  min-width: 0;
  padding: var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
}
.kx-script__node-head,
.kx-ai__node-head { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-script__node-name,
.kx-ai__node-name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-script__node-code,
.kx-ai__node-code { font-family: var(--kx-font-mono); font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-script__node-params,
.kx-ai__node-params { margin-top: 4px; font-size: var(--kx-fs-xs); color: var(--kx-text-2); line-height: 1.7; word-break: break-all; }
.kx-ai__dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--kx-success); }
.kx-ai__dot.is-risk-2 { background: var(--kx-warning); }
.kx-ai__dot.is-risk-3 { background: var(--kx-danger); }

/* 校验结果 */
.kx-script__validate,
.kx-ai__validate { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-script__validate-empty,
.kx-ai__validate-empty { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-script__messages,
.kx-ai__messages { display: flex; flex-direction: column; gap: 6px; }
.kx-script__message,
.kx-ai__message {
  padding: 8px 10px;
  border-radius: var(--kx-radius-sm);
  border-left: 3px solid var(--kx-border);
  background: var(--kx-surface-2);
  font-size: var(--kx-fs-sm);
  line-height: 1.7;
  color: var(--kx-text-2);
  word-break: break-all;
}
.kx-script__message.is-error,
.kx-ai__message.is-error { border-left-color: var(--kx-danger); background: var(--kx-danger-bg); color: #cb2634; }
.kx-script__message.is-warning,
.kx-ai__message.is-warning { border-left-color: var(--kx-warning); background: var(--kx-warning-bg); color: #c15d00; }

.kx-script__test,
.kx-script__test-result { display: flex; flex-direction: column; gap: var(--kx-sp-3); }

/* ---------------------------------------------------------------- 动作积木库 */
.kx-block__search { display: grid; gap: var(--kx-sp-3); grid-template-columns: minmax(0, 1fr) 220px; }
.kx-block__search-input { position: relative; }
.kx-block__search-input .kx-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--kx-text-3);
}
.kx-block__search-input .kx-input { padding-left: 34px; }
.kx-block__layout {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: 264px minmax(0, 1fr);
  align-items: start;
}
.kx-block__aside .kx-card__body { padding: var(--kx-sp-3); }
.kx-block__groups { display: flex; flex-direction: column; gap: 2px; }
.kx-block__group {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  padding: 9px 10px;
  border-radius: var(--kx-radius-sm);
  font-size: var(--kx-fs-sm);
  color: var(--kx-text-2);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-block__group .kx-icon { color: var(--kx-text-3); }
.kx-block__group-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kx-block__group:hover { background: var(--kx-primary-50); color: var(--kx-primary); }
.kx-block__group.is-active { background: var(--kx-primary-100); color: var(--kx-primary-dark); font-weight: 600; }
.kx-block__group.is-active .kx-icon { color: var(--kx-primary); }
.kx-block__title { font-size: var(--kx-fs); font-weight: 600; color: var(--kx-text); }
.kx-block__grid {
  display: grid;
  gap: var(--kx-sp-4);
  grid-template-columns: repeat(auto-fill, minmax(252px, 1fr));
}
.kx-block__card {
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-2);
  padding: var(--kx-sp-4);
  border-radius: var(--kx-radius);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  cursor: pointer;
  transition: box-shadow var(--kx-dur) var(--kx-ease), transform var(--kx-dur) var(--kx-ease), border-color var(--kx-dur) var(--kx-ease);
}
.kx-block__card:hover { transform: translateY(-2px); box-shadow: var(--kx-shadow); border-color: var(--kx-primary-200); }
.kx-block__card-head { display: flex; align-items: flex-start; gap: var(--kx-sp-3); }
.kx-block__card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: none;
  border-radius: var(--kx-radius-sm);
  background: var(--kx-primary-50);
  color: var(--kx-primary);
}
.kx-block__card-name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-block__card-code { font-family: var(--kx-font-mono); font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-block__card-desc { font-size: var(--kx-fs-xs); color: var(--kx-text-3); line-height: 1.7; min-height: 34px; }
.kx-block__card-foot { display: flex; align-items: center; justify-content: space-between; gap: var(--kx-sp-2); }
.kx-block__card-params { display: inline-flex; align-items: center; gap: 4px; font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-block__params { border: 1px solid var(--kx-border-2); border-radius: var(--kx-radius-sm); overflow: hidden; }

/* ---------------------------------------------------------------- AI 脚本工场 */
.kx-ai {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: 280px minmax(0, 1fr) 380px;
  align-items: stretch;
}
.kx-ai .kx-card { display: flex; flex-direction: column; height: calc(100vh - 220px); min-height: 560px; }
.kx-ai .kx-card__body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.kx-ai__aside .kx-card__body { padding: var(--kx-sp-3); }
.kx-ai__model-badge { display: inline-flex; align-items: center; gap: 6px; font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-ai__sessions { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.kx-ai__session {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-ai__session:hover { background: var(--kx-primary-50); }
.kx-ai__session.is-active { background: var(--kx-primary-100); border-color: var(--kx-primary-200); }
.kx-ai__session-title { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-ai__session-meta { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.kx-ai__session-time { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-ai__session-del {
  position: absolute;
  top: 8px;
  right: 8px;
  display: none;
  color: var(--kx-text-3);
}
.kx-ai__session:hover .kx-ai__session-del { display: inline-flex; }
.kx-ai__session-del:hover { color: var(--kx-danger); }

.kx-ai__stage { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.kx-ai__messages-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-4);
  padding-right: 4px;
}
.kx-ai__bubble {
  max-width: 86%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: var(--kx-sp-3) var(--kx-sp-4);
  border-radius: var(--kx-radius);
  font-size: var(--kx-fs-sm);
  line-height: 1.75;
}
.kx-ai__bubble.is-user {
  align-self: flex-end;
  background: var(--kx-gradient-primary);
  color: #fff;
  box-shadow: var(--kx-shadow-primary);
}
.kx-ai__bubble.is-user .kx-ai__bubble-head { color: rgba(255, 255, 255, .92); }
.kx-ai__bubble.is-ai {
  align-self: flex-start;
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
  color: var(--kx-text);
}
.kx-ai__bubble-head { display: flex; align-items: center; gap: 6px; font-size: var(--kx-fs-xs); }
.kx-ai__bubble-text { white-space: pre-wrap; word-break: break-word; }
.kx-ai__bubble .kx-ai__codeblock { background: var(--kx-surface); }

.kx-ai__thinking {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: var(--kx-sp-3);
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-primary-50);
  border: 1px dashed var(--kx-primary-200);
}
.kx-ai__thinking.is-hide { display: none; }
.kx-ai__thinking-main { display: flex; align-items: center; gap: var(--kx-sp-2); font-size: var(--kx-fs-sm); color: var(--kx-primary-dark); }
.kx-ai__thinking-text { flex: 1; min-width: 0; }
.kx-ai__thinking-time { font-variant-numeric: tabular-nums; color: var(--kx-primary); }
.kx-ai__thinking-tip { display: flex; align-items: center; gap: 4px; font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-ai__dots { display: inline-flex; align-items: center; gap: 3px; }
.kx-ai__dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--kx-primary);
  animation: kx-ai-bounce 1s var(--kx-ease) infinite;
}
.kx-ai__dots i:nth-child(2) { animation-delay: .15s; }
.kx-ai__dots i:nth-child(3) { animation-delay: .3s; }

.kx-ai__input { display: flex; flex-direction: column; gap: var(--kx-sp-2); margin-top: var(--kx-sp-3); }
.kx-ai__textarea { resize: vertical; }
.kx-ai__quick { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kx-ai__quick-btn { font-size: var(--kx-fs-xs); }
.kx-ai__input-tools { display: flex; align-items: center; gap: var(--kx-sp-2); flex-wrap: wrap; }
.kx-ai__select { width: 190px; }
.kx-ai__input-tip { display: flex; align-items: center; gap: 4px; font-size: var(--kx-fs-xs); color: var(--kx-text-3); }

.kx-ai__guide { flex: 1; min-height: 0; overflow-y: auto; display: flex; align-items: center; justify-content: center; }
.kx-ai__guide:empty { display: none; }
.kx-ai__guide-inner { display: flex; flex-direction: column; align-items: center; gap: var(--kx-sp-3); text-align: center; padding: var(--kx-sp-4); }
.kx-ai__guide-icon { color: var(--kx-primary); }
.kx-ai__guide-title { font-size: var(--kx-fs-lg); font-weight: 600; color: var(--kx-text); }
.kx-ai__guide-desc { font-size: var(--kx-fs-sm); color: var(--kx-text-3); line-height: 1.8; }
.kx-ai__examples { display: grid; gap: var(--kx-sp-3); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--kx-sp-3); text-align: left; }
.kx-ai__example {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 10px var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  font-size: var(--kx-fs-xs);
  line-height: 1.7;
  color: var(--kx-text-2);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-ai__example .kx-icon { flex: none; margin-top: 2px; color: var(--kx-primary); }
.kx-ai__example:hover { border-color: var(--kx-primary-200); background: var(--kx-primary-50); transform: translateY(-2px); }

.kx-ai__preview-body { flex: 1; min-height: 0; overflow-y: auto; }
.kx-ai__pane { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-ai__preview-actions {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-2);
  flex-wrap: wrap;
  margin-top: var(--kx-sp-3);
  padding-top: var(--kx-sp-3);
  border-top: 1px solid var(--kx-border-2);
}
.kx-ai__run-result,
.kx-ai__test,
.kx-ai__publish { display: flex; flex-direction: column; gap: var(--kx-sp-3); }

/* ============================================================================
   15. 任务中心（任务列表 / 任务实例 / 执行日志）
   ========================================================================== */
.kx-task__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kx-task__job-stats { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.kx-task__fail-chart { height: 300px; width: 100%; }

.kx-task__report-bar { margin-bottom: var(--kx-sp-4); }
.kx-task__report-summary { display: block; }
.kx-task__report-chart { height: 260px; width: 100%; margin-bottom: var(--kx-sp-4); }

/* 分步表单 */
.kx-task__wizard { display: flex; flex-direction: column; gap: var(--kx-sp-5); }
.kx-task__wizard-steps { padding-top: var(--kx-sp-2); }
.kx-task__wizard-form { min-height: 220px; }
.kx-task__wizard-dynamic { margin-top: var(--kx-sp-3); }
.kx-task__wizard-sub {
  margin-top: var(--kx-sp-4);
  padding-top: var(--kx-sp-4);
  border-top: 1px dashed var(--kx-border-2);
}
.kx-task__wizard-sub-title {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: var(--kx-sp-4);
  padding-top: var(--kx-sp-4);
  border-top: 1px dashed var(--kx-border-2);
  font-size: var(--kx-fs-sm);
  font-weight: 600;
  color: var(--kx-text);
}
.kx-task__wizard-sub-title .kx-icon { color: var(--kx-primary); }

/* 预估结果 */
.kx-task__preview { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-task__preview-summary { display: grid; gap: var(--kx-sp-3) var(--kx-sp-5); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kx-task__preview-item { display: flex; gap: var(--kx-sp-2); font-size: var(--kx-fs-sm); min-width: 0; }
.kx-task__preview-label { flex: none; min-width: 92px; color: var(--kx-text-3); }
.kx-task__preview-value { color: var(--kx-text); word-break: break-all; }
.kx-task__preview-result { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-task__preview-accounts { display: flex; flex-direction: column; max-height: 280px; overflow-y: auto; }

/* 实例详情 */
.kx-task__thumb {
  width: 40px;
  height: 28px;
  object-fit: cover;
  border-radius: var(--kx-radius-sm);
  border: 1px solid var(--kx-border-2);
  cursor: zoom-in;
}
.kx-task__image-wrap { display: flex; align-items: center; justify-content: center; }
.kx-task__image-wrap img { max-width: 100%; border-radius: var(--kx-radius); }

/* 执行日志（行内展开） */
.kx-task-log__pane { display: block; }
.kx-task-log__expand { position: relative; }
.kx-task-log__expand-summary {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: var(--kx-radius-sm);
  font-size: var(--kx-fs-xs);
  color: var(--kx-primary);
  cursor: pointer;
  list-style: none;
}
.kx-task-log__expand-summary::-webkit-details-marker { display: none; }
.kx-task-log__expand-summary:hover { background: var(--kx-primary-50); }
.kx-task-log__expand[open] .kx-task-log__expand-summary .kx-icon { transform: rotate(180deg); }
.kx-task-log__io {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  padding: var(--kx-sp-3);
  border-radius: var(--kx-radius-sm);
  background: var(--kx-surface);
  border: 1px solid var(--kx-border-2);
  max-width: 420px;
}
.kx-task-log__io-item { display: flex; gap: var(--kx-sp-2); font-size: var(--kx-fs-xs); }
.kx-task-log__io-label { flex: none; min-width: 34px; color: var(--kx-text-3); }
.kx-task-log__io-value { color: var(--kx-text-2); word-break: break-all; line-height: 1.7; }

/* ============================================================================
   16. 商业化（租户 / 套餐 / 订单 / 资金流水）
   ========================================================================== */
.kx-biz__notice {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: var(--kx-sp-5);
  padding: 10px var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-warning-bg);
  border: 1px dashed var(--kx-warning);
  font-size: var(--kx-fs-sm);
  color: #c15d00;
}
.kx-biz__money {
  color: var(--kx-accent-deep);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.kx-biz__amount-up { color: var(--kx-success); font-weight: 600; font-variant-numeric: tabular-nums; }
.kx-biz__amount-down { color: var(--kx-danger); font-weight: 600; font-variant-numeric: tabular-nums; }
.kx-biz__form { display: flex; flex-direction: column; gap: var(--kx-sp-4); }
.kx-biz__confirm { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-biz__children { display: flex; flex-direction: column; }

/* 租户层级树 */
.kx-tenant__tree { display: flex; flex-direction: column; gap: var(--kx-sp-2); }
.kx-tenant__tree-level { display: flex; flex-direction: column; gap: var(--kx-sp-2); }
.kx-tenant__tree-level--child { margin-left: var(--kx-sp-6); padding-left: var(--kx-sp-4); border-left: 2px dashed var(--kx-border); }
.kx-tenant__node {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kx-sp-3);
  padding: 10px var(--kx-sp-4);
  border-radius: var(--kx-radius-sm);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  cursor: pointer;
  transition: all var(--kx-dur) var(--kx-ease);
}
.kx-tenant__node:hover { border-color: var(--kx-primary-200); box-shadow: var(--kx-shadow-sm); }
.kx-tenant__node-main { display: flex; align-items: center; gap: var(--kx-sp-2); min-width: 0; }
.kx-tenant__node-name { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-tenant__node-meta { display: flex; align-items: center; gap: var(--kx-sp-4); font-size: var(--kx-fs-xs); color: var(--kx-text-3); flex-wrap: wrap; }
.kx-tenant__node-meta > span { display: inline-flex; align-items: center; gap: 4px; }

/* 配额进度条组 */
.kx-biz__quota { display: flex; flex-direction: column; gap: var(--kx-sp-3); }
.kx-biz__quota-item { display: flex; flex-direction: column; gap: 6px; }
.kx-biz__quota-head { display: flex; align-items: center; justify-content: space-between; font-size: var(--kx-fs-sm); color: var(--kx-text-2); }
.kx-biz__quota-head .kx-text-3 { font-variant-numeric: tabular-nums; }
.kx-biz__quota-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: var(--kx-radius-full);
  background: var(--kx-border-2);
  font-size: var(--kx-fs-xs);
  color: var(--kx-text-2);
}

/* 余额 / 续期 */
.kx-biz__balance {
  display: flex;
  align-items: baseline;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-accent-50);
  border: 1px dashed var(--kx-accent);
}
.kx-biz__balance-label { font-size: var(--kx-fs-sm); color: var(--kx-text-2); }
.kx-biz__balance-value { font-size: var(--kx-fs-2xl); font-weight: 700; color: var(--kx-accent-deep); }
.kx-biz__renew {
  display: flex;
  align-items: center;
  gap: var(--kx-sp-4);
  padding: var(--kx-sp-4);
  border-radius: var(--kx-radius);
  background: var(--kx-surface-2);
  border: 1px solid var(--kx-border-2);
}
.kx-biz__renew-item { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.kx-biz__renew-label { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-biz__renew-value { font-size: var(--kx-fs-sm); font-weight: 600; color: var(--kx-text); }
.kx-biz__renew-arrow { color: var(--kx-primary); }

/* 套餐卡片 */
.kx-biz__packages {
  display: grid;
  gap: var(--kx-sp-5);
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.kx-biz__package {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--kx-sp-3);
  padding: var(--kx-sp-5);
  border-radius: var(--kx-radius-lg);
  border: 1px solid var(--kx-border-2);
  background: var(--kx-surface);
  box-shadow: var(--kx-shadow-xs);
  transition: box-shadow var(--kx-dur) var(--kx-ease), transform var(--kx-dur) var(--kx-ease), border-color var(--kx-dur) var(--kx-ease);
}
.kx-biz__package:hover { transform: translateY(-3px); box-shadow: var(--kx-shadow); border-color: var(--kx-accent-light); }
.kx-biz__package.is-recommend { border-color: var(--kx-accent); box-shadow: var(--kx-shadow-accent); }
.kx-biz__package-flag {
  position: absolute;
  top: -10px;
  right: var(--kx-sp-4);
  padding: 2px 10px;
  border-radius: var(--kx-radius-full);
  background: var(--kx-gradient-accent);
  color: #00384a;
  font-size: var(--kx-fs-xs);
  font-weight: 600;
}
.kx-biz__package-head { display: flex; align-items: center; justify-content: space-between; gap: var(--kx-sp-2); }
.kx-biz__package-name { font-size: var(--kx-fs-lg); font-weight: 700; color: var(--kx-text); }
.kx-biz__package-code { font-family: var(--kx-font-mono); font-size: var(--kx-fs-xs); color: var(--kx-text-3); margin-top: -6px; }
.kx-biz__package-price { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.kx-biz__package-amount { font-size: var(--kx-fs-3xl); font-weight: 700; color: var(--kx-accent-deep); font-variant-numeric: tabular-nums; }
.kx-biz__package-origin { font-size: var(--kx-fs-sm); color: var(--kx-text-3); text-decoration: line-through; }
.kx-biz__package-unit { font-size: var(--kx-fs-xs); color: var(--kx-text-3); }
.kx-biz__package-quota { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kx-biz__package-features {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: var(--kx-sp-3);
  border-top: 1px dashed var(--kx-border-2);
}
.kx-biz__feature { display: flex; align-items: center; gap: 6px; font-size: var(--kx-fs-sm); color: var(--kx-text-3); }
.kx-biz__feature.is-on { color: var(--kx-text); }
.kx-biz__feature.is-on .kx-icon { color: var(--kx-success); }
.kx-biz__package-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kx-sp-3);
  margin-top: auto;
  padding-top: var(--kx-sp-3);
  border-top: 1px solid var(--kx-border-2);
}
.kx-biz__package-foot > div:first-child { display: inline-flex; align-items: center; gap: var(--kx-sp-2); }
.kx-biz__package-remark { font-size: var(--kx-fs-xs); color: var(--kx-text-3); line-height: 1.7; }

/* 订单趋势 */
.kx-biz__order-trend { height: 280px; width: 100%; }

/* 动画 */
@keyframes kx-ai-bounce {
  0%, 100% { transform: translateY(0); opacity: .45; }
  50% { transform: translateY(-4px); opacity: 1; }
}

/* ---------------------------------------------------------------- 响应式 */
@media (max-width: 1600px) {
  .kx-ai { grid-template-columns: 244px minmax(0, 1fr) 340px; }
  .kx-task__job-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1440px) {
  .kx-script__stats,
  .kx-task__stats,
  .kx-biz__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1200px) {
  .kx-ai { grid-template-columns: 220px minmax(0, 1fr); }
  .kx-ai__preview { grid-column: 1 / -1; }
  .kx-ai .kx-card { height: auto; min-height: 0; }
  .kx-ai__messages-scroll { max-height: 420px; }
  .kx-block__layout { grid-template-columns: minmax(0, 1fr); }
  .kx-block__groups { flex-direction: row; flex-wrap: wrap; }
  .kx-task__job-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .kx-ai { grid-template-columns: minmax(0, 1fr); }
  .kx-ai__examples { grid-template-columns: minmax(0, 1fr); }
  .kx-block__search { grid-template-columns: minmax(0, 1fr); }
  .kx-task__preview-summary,
  .kx-biz__stats,
  .kx-script__stats,
  .kx-task__stats,
  .kx-task__job-stats { grid-template-columns: minmax(0, 1fr); }
  .kx-tenant__node { flex-direction: column; align-items: flex-start; }
}