/* ============================================================
   中科尚易 · 客户登记 —— 基础样式（H5）
   依赖 tokens.css；仅使用令牌，不硬编码色值
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;}

html,body{margin:0;padding:0;}

body{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  color:var(--color-text-primary);
  background:var(--color-bg-canvas);
  -webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;
}

/* 移动端单列画布 */
.page{
  max-width:var(--container-mobile-max);
  margin:0 auto;
  min-height:100dvh;
  background:var(--color-bg-canvas);
  display:flex;flex-direction:column;
}

/* ---------- 顶部栏（避让钉钉原生导航栏） ---------- */
.app-header{
  position:sticky;top:0;z-index:var(--z-sticky);
  padding-top:var(--dd-safe-top);
  background:var(--color-surface);
  border-bottom:var(--bw-hairline) solid var(--border-subtle);
}
.app-header__bar{
  height:var(--dd-nav-h);
  display:flex;align-items:center;gap:var(--space-2);
  padding:0 var(--page-pad-x);
}
.app-header__back{
  width:var(--touch-icon-btn);height:var(--touch-icon-btn);
  display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;cursor:pointer;
  color:var(--color-text-heading);
  border-radius:var(--radius-sm);
  margin-left:calc(var(--space-2) * -1);
  flex:0 0 auto;
}
.app-header__back:active{background:var(--green-50);}
.app-header__title{
  flex:1;min-width:0;
  font-size:var(--fs-title);font-weight:var(--fw-semibold);
  color:var(--color-text-heading);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.app-header__action{
  min-height:var(--touch-min);
  display:flex;align-items:center;
  border:0;background:transparent;cursor:pointer;
  font-size:var(--fs-label);font-weight:var(--fw-medium);
  color:var(--green-700);
  padding:0 var(--space-2);
  border-radius:var(--radius-sm);
}
.app-header__action:active{background:var(--green-50);}

/* ---------- 主体 ---------- */
.app-body{
  flex:1;
  padding:var(--space-4) var(--page-pad-x) var(--space-6);
}
.app-body--flush{padding-left:0;padding-right:0;}

/* ---------- 底部固定操作区 ---------- */
.app-footer{
  position:sticky;bottom:0;z-index:var(--z-sticky);
  padding:var(--space-3) var(--page-pad-x);
  padding-bottom:calc(var(--space-3) + var(--dd-safe-bottom));
  background:var(--color-surface);
  border-top:var(--bw-hairline) solid var(--border-subtle);
}
.app-footer__row{display:flex;gap:var(--space-3);}

/* ---------- 按钮 ---------- */
.btn{
  min-height:var(--btn-h);
  padding:0 var(--btn-pad-x-mobile);
  border-radius:var(--btn-radius);
  border:1px solid transparent;
  font-family:inherit;font-size:var(--fs-body);font-weight:var(--fw-medium);
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  cursor:pointer;text-decoration:none;
  transition:background-color .12s ease,border-color .12s ease;
  -webkit-tap-highlight-color:transparent;
}
.btn--block{width:100%;}
.btn--primary{
  background:var(--btn-primary-bg);color:var(--btn-primary-text);
  min-height:var(--btn-primary-h);
}
.btn--primary:active{background:var(--btn-primary-active);}
.btn--secondary{
  background:var(--btn-secondary-bg);color:var(--btn-secondary-text);
  border:var(--btn-secondary-bd);
}
.btn--secondary:active{background:var(--btn-secondary-hover-bg);}
.btn--ghost{background:var(--btn-ghost-bg);color:var(--btn-ghost-text);}
.btn--ghost:active{background:var(--btn-ghost-hover-bg);}
.btn--danger{background:var(--color-danger);color:var(--color-on-inverse);}
.btn[disabled],.btn[aria-disabled="true"]{
  background:var(--btn-disabled-bg);color:var(--btn-disabled-text);
  cursor:not-allowed;border-color:transparent;
}
.btn--flex1{flex:1;}

/* ---------- 表单 ---------- */
.field{margin-bottom:var(--space-5);}
.field__label{
  display:block;margin-bottom:var(--label-above-gap);
  font-size:var(--fs-label);font-weight:var(--fw-medium);
  color:var(--color-text-primary);
}
.field__label--required::after{content:" *";color:var(--color-danger);}
.field__hint{
  margin-top:var(--space-1);
  font-size:var(--fs-micro);color:var(--color-text-tertiary);
}
.field__error{
  margin-top:var(--space-1);
  font-size:var(--fs-micro);color:var(--color-danger);
}
.input,.textarea,.select{
  width:100%;
  min-height:var(--input-h);
  padding:0 var(--input-pad-x);
  font-family:inherit;font-size:var(--input-fs);
  color:var(--color-text-primary);
  background:var(--input-bg);
  border:var(--input-bd);
  border-radius:var(--input-radius);
  -webkit-appearance:none;appearance:none;
}
.input::placeholder,.textarea::placeholder{color:var(--input-placeholder);}
.input:focus,.textarea:focus,.select:focus{
  outline:none;border:var(--input-focus-bd);
}
.input--error{border:var(--input-error-bd);}
.input[readonly]{background:var(--input-readonly-bg);color:var(--input-readonly-text);}
.textarea{
  min-height:var(--textarea-min-h);max-height:var(--textarea-max-h);
  padding:12px var(--input-pad-x);line-height:var(--lh-body);resize:vertical;
}
.select{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23837C70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:38px;
}

/* ---------- 分段控件 ---------- */
.seg{
  display:flex;gap:0;
  background:var(--seg-bg);
  padding:var(--seg-pad);
  border-radius:var(--seg-radius);
}
.seg__item{
  flex:1;
  min-height:var(--seg-item-h);
  display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;cursor:pointer;
  font-family:inherit;font-size:var(--fs-label);font-weight:var(--fw-medium);
  color:var(--seg-item-text);
  border-radius:var(--seg-item-radius);
  padding:0 var(--space-2);
  -webkit-tap-highlight-color:transparent;
}
.seg__item[aria-pressed="true"]{
  background:var(--seg-item-active-bg);color:var(--seg-item-active-text);
  box-shadow:var(--seg-item-active-shadow);
}

/* ---------- chip（统一 44px 触控下限） ---------- */
.chips{display:flex;flex-wrap:wrap;gap:var(--chip-wrap-gap);}
.chip{
  height:var(--chip-h);
  padding:0 var(--chip-pad-x);
  display:inline-flex;align-items:center;gap:var(--space-1);
  background:var(--chip-bg);border:var(--chip-bd);
  border-radius:var(--chip-radius);
  font-family:inherit;font-size:var(--chip-fs);font-weight:var(--fw-medium);
  color:var(--chip-text);
  cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.chip:active{background:var(--chip-hover-bg);}
.chip[aria-pressed="true"]{
  background:var(--chip-selected-bg);
  border:var(--chip-selected-bd);
  color:var(--chip-selected-text);
}
/* 安全护栏：门控筛选与审计筛选必须保持触控下限，勿以"冗余"为由删除 */
.chips--gating .chip{height:var(--touch-min);}
.chips--filter .chip{height:var(--touch-min);}

/* 横向滚动筛选条 */
.chips--scroll{
  flex-wrap:nowrap;overflow-x:auto;
  padding-bottom:var(--space-1);
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.chips--scroll::-webkit-scrollbar{display:none;}
.chips--scroll .chip{flex:0 0 auto;}

/* ---------- 卡片选择器 ---------- */
.card-grid{
  display:grid;
  grid-template-columns:repeat(var(--card-select-grid-cols),1fr);
  gap:var(--card-select-gap);
}
.card-opt{
  min-height:var(--card-select-min-h);
  padding:var(--card-select-pad);
  background:var(--card-select-bg);
  border:var(--card-select-bd);
  border-radius:var(--card-select-radius);
  display:flex;flex-direction:column;justify-content:center;gap:var(--space-1);
  text-align:left;font-family:inherit;
  cursor:pointer;position:relative;
  -webkit-tap-highlight-color:transparent;
}
.card-opt:active{background:var(--card-select-hover-bg);border:var(--card-select-hover-bd);}
.card-opt[aria-pressed="true"]{
  background:var(--card-select-selected-bg);
  border:var(--card-select-selected-bd);
}
.card-opt__label{
  font-size:var(--card-select-label-fs);font-weight:var(--fw-medium);
  color:var(--color-text-primary);
}
.card-opt__hint{
  font-size:var(--card-select-hint-fs);color:var(--card-select-hint-color);
}
.card-opt__check{
  position:absolute;top:10px;right:10px;
  width:var(--card-select-check-size);height:var(--card-select-check-size);
  border-radius:var(--radius-full);
  background:var(--card-select-selected-check);
  color:var(--color-on-inverse);font-size:11px;
  display:none;align-items:center;justify-content:center;
}
.card-opt[aria-pressed="true"] .card-opt__check{display:flex;}

/* ---------- 徽章 ---------- */
.badge{
  display:inline-flex;align-items:center;gap:4px;
  height:var(--badge-h);padding:0 var(--badge-pad-x);
  border-radius:var(--badge-radius);border:1px solid transparent;
  font-size:var(--badge-fs);font-weight:var(--badge-fw);line-height:1;
  white-space:nowrap;
}
.badge--intent-high{background:var(--badge-intent-high-bg);color:var(--badge-intent-high-text);border-color:var(--badge-intent-high-bd);}
.badge--intent-medium{background:var(--badge-intent-mid-bg);color:var(--badge-intent-mid-text);border-color:var(--badge-intent-mid-bd);}
.badge--intent-low{background:var(--badge-intent-low-bg);color:var(--badge-intent-low-text);border-color:var(--badge-intent-low-bd);}
.badge--intent-watch{background:var(--badge-intent-low-bg);color:var(--badge-intent-low-text);border-color:var(--badge-intent-low-bd);}
.badge--owner-mine{background:var(--badge-owner-mine-bg);color:var(--badge-owner-mine-text);border-color:var(--badge-owner-mine-bd);}
.badge--owner-team{background:var(--badge-owner-other-bg);color:var(--badge-owner-other-text);border-color:var(--badge-owner-other-bd);}
.badge--owner-pending{background:var(--badge-owner-pool-bg);color:var(--badge-owner-pool-text);border-color:var(--badge-owner-pool-bd);}
.badge--owner-archived{background:var(--badge-owner-other-bg);color:var(--badge-owner-other-text);border-color:var(--badge-owner-other-bd);}
.badge--status{background:var(--badge-status-draft-bg);color:var(--badge-status-draft-text);border-color:var(--neutral-200);}

/* ---------- 徽章形状前缀（第二正交维度，服务色盲用户与黑白打印） ----------
   背景：三档配色中 --badge-intent-mid-* ≡ --badge-owner-pool-* 与
   --badge-intent-low-* ≡ --badge-owner-other-* 的刻意一致是编码合规红线
   （见 tokens.css 注释），不得拆分。其副作用是同档内「意向徽章」与「归属徽章」
   颜色完全相同，二者又在同一条目内并排渲染（如 my-customers / team-customers），
   仅靠颜色无法分辨。
   本组规则不触碰任何色值令牌，改用「几何 + 填充」双维度补偿：
     · 几何形状 = 语义档：圆 = 中性灰 / 菱形 = 暖金 / 方块 = 品牌绿
     · 空心 = 意向 · 实心 = 归属（因此同档内两枚徽章仍可区分）
   取色一律 currentColor，自动继承各档 --badge-*-text，无硬编码色值。
   尺寸 5–6px、flex:none、不设定位，靠 .badge 现有 gap 自然排布，不撑高徽章。 */

/* 品牌绿档：方块 */
.badge--intent-high::before,
.badge--owner-mine::before{
  content:"";flex:none;
  width:6px;height:6px;border-radius:1px;
}
.badge--intent-high::before{border:1.5px solid currentColor;}
.badge--owner-mine::before{background:currentColor;}

/* 暖金档：菱形 */
.badge--intent-medium::before,
.badge--owner-pending::before{
  content:"";flex:none;
  width:5px;height:5px;border-radius:1px;
  transform:rotate(45deg);
}
.badge--intent-medium::before{border:1.5px solid currentColor;}
.badge--owner-pending::before{background:currentColor;}

/* 中性灰档：圆点（低意向与待观察同档，共用同一形状） */
.badge--intent-low::before,
.badge--intent-watch::before,
.badge--owner-team::before{
  content:"";flex:none;
  width:6px;height:6px;border-radius:var(--radius-full);
}
.badge--intent-low::before,
.badge--intent-watch::before{border:1.5px solid currentColor;}
.badge--owner-team::before{background:currentColor;}

/* 已归档：横杠（中性历史事实，currentColor 即中性灰，非红色） */
.badge--owner-archived::before{
  content:"";flex:none;
  width:7px;height:1.5px;border-radius:1px;
  background:currentColor;
}

/* ---------- 卡片 ---------- */
.card{
  background:var(--color-surface);
  border:var(--bw-hairline) solid var(--border-subtle);
  border-radius:var(--radius-lg);
  padding:var(--space-4);
}
.card + .card{margin-top:var(--space-4);}
.card__title{
  font-size:var(--fs-h3);font-weight:var(--fw-semibold);
  color:var(--color-text-heading);
  margin:0 0 var(--space-3);
}
.section-title{
  font-size:var(--fs-label);font-weight:var(--fw-semibold);
  color:var(--color-text-heading);
  margin:var(--space-6) 0 var(--space-3);
}
.section-title:first-child{margin-top:0;}

/* ---------- 客户列表条目 ---------- */
.cust-list{display:flex;flex-direction:column;}
.cust-item{
  display:block;text-decoration:none;color:inherit;
  padding:var(--space-4) var(--page-pad-x);
  min-height:var(--touch-list-row-h);
  background:var(--color-surface);
  border-bottom:var(--list-item-divider);
  cursor:pointer;
}
.cust-item:active{background:var(--neutral-50);}
.cust-item__top{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);}
.cust-item__name{
  font-size:var(--fs-body);font-weight:var(--fw-semibold);
  color:var(--color-text-primary);
}
.cust-item__row{
  display:flex;align-items:center;gap:var(--space-2);
  font-size:var(--list-meta-fs);color:var(--list-meta-color);
  margin-top:2px;
}
.cust-item__row--wrap{flex-wrap:wrap;}
.cust-item__owner{
  display:flex;align-items:center;gap:var(--space-1);
  font-size:var(--fs-micro);color:var(--color-text-tertiary);
}
.avatar{
  width:var(--owner-avatar-size);height:var(--owner-avatar-size);
  border-radius:var(--owner-avatar-radius);
  background:var(--owner-avatar-bg);color:var(--owner-avatar-text);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:var(--owner-avatar-fs);font-weight:var(--fw-medium);
  flex:0 0 auto;
}
.avatar--lg{width:var(--owner-avatar-size-lg);height:var(--owner-avatar-size-lg);font-size:var(--fs-label);}

/* ---------- 搜索栏 ---------- */
.search{
  position:relative;
  padding:var(--space-3) var(--page-pad-x);
  background:var(--color-surface);
  border-bottom:var(--bw-hairline) solid var(--border-subtle);
}
.search__input{
  width:100%;min-height:var(--search-h);
  padding:0 var(--input-pad-x) 0 40px;
  background:var(--search-bg);border:var(--search-bd);
  border-radius:var(--search-radius);
  font-family:inherit;font-size:var(--fs-body);
  color:var(--color-text-primary);
  -webkit-appearance:none;appearance:none;
}
.search__input:focus{outline:none;border:var(--input-focus-bd);}
.search__icon{
  position:absolute;left:calc(var(--page-pad-x) + 12px);top:50%;
  transform:translateY(-50%);
  color:var(--search-icon);pointer-events:none;
}

/* ---------- 撞单提示条（暖金，非红色） ---------- */
.alert{
  display:flex;gap:var(--space-3);
  padding:var(--conflict-bar-pad);
  border-radius:var(--conflict-bar-radius);
  font-size:var(--conflict-bar-body-fs);
}
.alert--warn{background:var(--conflict-bar-bg);border:var(--conflict-bar-bd);color:var(--conflict-bar-text);}
.alert--info{background:var(--color-info-bg);border:1px solid var(--color-info-bd);color:var(--color-info-text);}
.alert--error{background:var(--color-danger-bg);border:1px solid var(--color-danger-bd);color:var(--color-danger-text);}
.alert__title{font-size:var(--conflict-bar-title-fs);font-weight:var(--fw-semibold);margin:0 0 2px;}
.alert__body{margin:0;line-height:var(--lh-tight);}
.alert__icon{flex:0 0 auto;margin-top:2px;}

/* ---------- 变更历史时间线 ---------- */
.timeline{position:relative;padding-left:var(--space-6);}
.timeline::before{
  content:"";position:absolute;left:6px;top:6px;bottom:6px;
  width:1px;background:var(--audit-timeline-line);
}
.audit-item{position:relative;padding-bottom:var(--space-5);}
.audit-item__dot{
  position:absolute;left:calc(var(--space-6) * -1 + 1px);top:6px;
  width:11px;height:11px;border-radius:var(--radius-full);
  background:var(--audit-dot-bg);
  border:2px solid var(--color-surface);
}
.audit-item--neutral .audit-item__dot{background:var(--audit-dot-bg-neutral);}
.audit-item__head{
  display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;
  margin-bottom:var(--space-2);
}
.audit-action{
  display:inline-flex;align-items:center;
  height:var(--badge-h);padding:0 var(--badge-pad-x);
  background:var(--audit-action-chip-bg);color:var(--audit-action-chip-text);
  border-radius:var(--badge-radius);
  font-size:var(--badge-fs);font-weight:var(--fw-medium);
}
.audit-item__meta{font-size:var(--fs-micro);color:var(--color-text-tertiary);}
.audit-diff{
  background:var(--color-surface-sunken);
  border-radius:var(--radius-md);
  padding:var(--space-3);
  display:flex;flex-direction:column;gap:var(--space-2);
}
.diff-row{font-size:var(--fs-small);line-height:var(--lh-tight);}
.diff-row__label{color:var(--color-text-tertiary);margin-right:var(--space-1);}
/* 旧值：中性历史事实，绝不用红色 */
.diff-row__old{color:var(--diff-old-color);text-decoration:line-through;}
.diff-row__new{color:var(--diff-new-color);font-weight:var(--fw-semibold);}
.diff-row__arrow{color:var(--color-text-tertiary);margin:0 var(--space-1);}
/* 敏感字段受限态：中性灰 + 锁 */
.diff-restricted{
  display:inline-flex;align-items:center;gap:4px;
  background:var(--diff-restricted-bg);color:var(--diff-restricted-color);
  border-radius:var(--radius-xs);padding:1px 6px;
  font-size:var(--fs-micro);
}

/* ---------- 空态 / 加载 / 错误 ---------- */
.empty{
  text-align:center;padding:var(--space-16) var(--space-6);
}
.empty__icon{color:var(--empty-icon-color);margin-bottom:var(--space-4);}
.empty__title{font-size:var(--fs-body);font-weight:var(--fw-medium);color:var(--empty-title);margin:0 0 var(--space-2);}
.empty__desc{font-size:var(--fs-small);color:var(--empty-desc);margin:0;line-height:var(--lh-body);}
.loading{text-align:center;padding:var(--space-10) 0;color:var(--color-text-tertiary);font-size:var(--fs-small);}
.spinner{
  width:22px;height:22px;margin:0 auto var(--space-3);
  border:2px solid var(--neutral-200);border-top-color:var(--green-600);
  border-radius:var(--radius-full);
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
.skeleton{
  background:linear-gradient(90deg,var(--neutral-100) 25%,var(--neutral-50) 50%,var(--neutral-100) 75%);
  background-size:200% 100%;
  animation:shimmer 1.3s ease-in-out infinite;
  border-radius:var(--radius-sm);
}
@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* ---------- Toast ---------- */
.toast-host{
  position:fixed;left:50%;bottom:calc(var(--footer-bar-h) + var(--space-4));
  transform:translateX(-50%);
  z-index:var(--z-toast);
  width:min(92vw,var(--container-mobile-max));
  pointer-events:none;
  display:flex;flex-direction:column;gap:var(--space-2);
}
.toast{
  background:var(--neutral-900);color:var(--color-on-inverse);
  border-radius:var(--radius-md);
  padding:var(--space-3) var(--space-4);
  font-size:var(--fs-small);line-height:var(--lh-tight);
  box-shadow:var(--shadow-lg);
  animation:toastIn .18s ease;
}
.toast--error{background:var(--color-danger);}
.toast--warn{background:var(--color-warning-text);}
@keyframes toastIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ---------- 底部弹层 ---------- */
.sheet-host{
  position:fixed;inset:0;z-index:var(--z-modal);
  display:none;
}
.sheet-host[data-open="true"]{display:block;}
.sheet__scrim{position:absolute;inset:0;background:var(--overlay-scrim);}
.sheet{
  position:absolute;left:0;right:0;bottom:0;
  max-width:var(--container-mobile-max);margin:0 auto;
  background:var(--color-surface);
  border-radius:var(--radius-xl) var(--radius-xl) 0 0;
  padding:var(--space-5) var(--page-pad-x);
  padding-bottom:calc(var(--space-5) + var(--dd-safe-bottom));
  max-height:88dvh;overflow-y:auto;
  animation:sheetUp .2s ease;
}
@keyframes sheetUp{from{transform:translateY(24px);opacity:.6;}to{transform:none;opacity:1;}}
.sheet__title{
  font-size:var(--fs-h3);font-weight:var(--fw-semibold);
  color:var(--color-text-heading);margin:0 0 var(--space-2);
}
.sheet__desc{font-size:var(--fs-small);color:var(--color-text-secondary);margin:0 0 var(--space-4);line-height:var(--lh-body);}
.sheet__actions{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4);}

/* ---------- 定义列表（详情页） ---------- */
.dl{display:flex;flex-direction:column;gap:var(--space-3);}
.dl__row{display:flex;gap:var(--space-4);font-size:var(--fs-label);}
.dl__k{flex:0 0 92px;color:var(--color-text-tertiary);}
.dl__v{flex:1;min-width:0;color:var(--color-text-primary);word-break:break-word;}
.dl__v--empty{color:var(--color-text-disabled);}

/* ---------- 工具类 ---------- */
.mt-1{margin-top:var(--space-1);}
.mt-2{margin-top:var(--space-2);}
.mt-3{margin-top:var(--space-3);}
.mt-4{margin-top:var(--space-4);}
.mt-6{margin-top:var(--space-6);}
.mb-2{margin-bottom:var(--space-2);}
.mb-3{margin-bottom:var(--space-3);}
.mb-4{margin-bottom:var(--space-4);}
.text-small{font-size:var(--fs-small);}
.text-micro{font-size:var(--fs-micro);}
.text-tertiary{color:var(--color-text-tertiary);}
.text-secondary{color:var(--color-text-secondary);}
.text-link{color:var(--color-text-link);}
.flex{display:flex;}
.flex-between{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);}
.flex-center{display:flex;align-items:center;gap:var(--space-2);}
.flex-wrap{flex-wrap:wrap;}
.grow{flex:1;min-width:0;}
.hidden{display:none !important;}
.mono{font-family:var(--font-numeric);font-variant-numeric:tabular-nums;}

/* 顶部加载进度条 */
.top-progress{
  position:fixed;top:0;left:0;height:2px;width:0;
  background:var(--green-600);z-index:var(--z-toast);
  transition:width .2s ease,opacity .3s ease;
}
.top-progress[data-done="true"]{opacity:0;}

/* 非钉钉环境提示 */
.env-warn{
  background:var(--color-warning-bg);
  border-bottom:1px solid var(--border-warn);
  color:var(--color-warning-text);
  padding:var(--space-2) var(--page-pad-x);
  font-size:var(--fs-micro);
  text-align:center;
}