/* ==========================================================================
   ios_theme.css —— 客服台 iOS 视觉重塑（2026-10-14）
   --------------------------------------------------------------------------
   定位：只换皮，不动骨头。
     · 不改任何 DOM 契约：id / class / data-* / 表单字段 / 交互逻辑全部保持原样，
       本文件是「后加载的覆盖层」，把原来的青碧（teal）主题换成 iOS 语义色体系。
     · 加载位置：dashboard.php 里 assets/theme.css 之后（最后一个样式表）。
     · 深色模式跟随系统（prefers-color-scheme: dark）。

   设计依据（全部取自 iOS HIG / 系统语义色）：
     色   systemBlue #007AFF / label / secondaryLabel / tertiaryLabel /
          separator / fill / systemGroupedBackground / system{Green,Red,Orange,…}
     结构 大标题（Large Title）→ 内嵌分组列表（Inset Grouped）→ 底部抽屉（Sheet）
          → 分段控件（Segmented Control）→ 悬浮标签栏（Tab Bar，毛玻璃）
     度量 命中区 ≥44×44、圆角 26/20/16/14/9/7、发丝线 .5px、正文 17 / 辅助 13
     动效 cubic-bezier(.32,.72,0,1)（iOS 弹簧）、按压 scale(.97)、面板淡入位移
   ========================================================================== */

/* ── 1. 设计令牌 ───────────────────────────────────────────────────────── */
:root{
  color-scheme: light;

  /* 主色（与登录页同一套 systemBlue） */
  --ios-blue:#007AFF;
  --ios-blue-light:#0A84FF;
  --ios-blue-deep:#0070E0;
  --ios-blue-soft:rgba(0,122,255,.12);
  --ios-blue-ring:rgba(0,122,255,.24);

  /* 背景 / 卡片 */
  --ios-canvas:#F2F2F7;          /* systemGroupedBackground */
  --ios-card:#FFFFFF;            /* systemBackground */
  --ios-card-2:#F2F2F7;          /* secondarySystemGroupedBackground */
  --ios-card-shadow:0 1px 3px rgba(16,24,40,.05), 0 0 0 .5px rgba(16,24,40,.03);

  /* 文字 */
  --ios-label:#000000;
  --ios-label-2:rgba(60,60,67,.60);
  --ios-label-3:rgba(60,60,67,.30);

  /* 分隔线 / 填充 */
  --ios-separator:rgba(60,60,67,.20);
  --ios-fill:rgba(120,120,128,.12);
  --ios-fill-2:rgba(120,120,128,.18);

  /* 系统色 */
  --ios-green:#34C759;
  --ios-red:#FF3B30;
  --ios-orange:#FF9500;
  --ios-yellow:#FFCC00;
  --ios-teal:#30B0C7;
  --ios-indigo:#5856D6;
  --ios-purple:#AF52DE;
  --ios-pink:#FF2D55;
  --ios-gray:#8E8E93;
  --ios-brown:#A2845E;

  /* 圆角 / 动效 / 字体 */
  --ios-r-card:26px;
  --ios-r-sheet:20px;
  --ios-r-group:16px;
  --ios-r-ctl:14px;
  --ios-r-seg:9px;
  --ios-r-ico:7px;
  --ios-spring:cubic-bezier(.32,.72,0,1);
  --ios-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","PingFang SC","Helvetica Neue","Microsoft YaHei",system-ui,sans-serif;
  --ios-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}

@media (prefers-color-scheme: dark){
  :root{
    color-scheme: dark;
    --ios-canvas:#000000;
    --ios-card:#1C1C1E;
    --ios-card-2:#2C2C2E;
    --ios-card-shadow:0 1px 3px rgba(0,0,0,.5), 0 0 0 .5px rgba(255,255,255,.04);
    --ios-label:#FFFFFF;
    --ios-label-2:rgba(235,235,245,.60);
    --ios-label-3:rgba(235,235,245,.30);
    --ios-separator:rgba(84,84,88,.65);
    --ios-fill:rgba(120,120,128,.24);
    --ios-fill-2:rgba(120,120,128,.32);
    --ios-blue:#0A84FF;
    --ios-blue-light:#409CFF;
    --ios-blue-deep:#0060DF;
    --ios-blue-soft:rgba(10,132,255,.22);
    --ios-blue-ring:rgba(10,132,255,.34);
    --ios-yellow:#FFD60A;
  }
}

/* ── 2. 画布 / 字体 / 滚动条 ───────────────────────────────────────────── */
html,body{
  background:var(--ios-canvas) !important;
  color:var(--ios-label);
  font-family:var(--ios-font);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body{
  background-color:var(--ios-canvas) !important;
  background-image:
    radial-gradient(120% 70% at 8% -8%, rgba(0,122,255,.10), transparent 60%),
    radial-gradient(110% 65% at 96% 2%, rgba(88,86,214,.09), transparent 62%) !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}
@media (prefers-color-scheme: dark){
  body{ background-image:
    radial-gradient(120% 70% at 8% -8%, rgba(10,132,255,.16), transparent 58%),
    radial-gradient(110% 65% at 96% 2%, rgba(94,92,230,.12), transparent 60%) !important; }
}
*{ -webkit-tap-highlight-color:transparent; }
::selection{ background:var(--ios-blue-soft); }
:focus-visible{ outline:none; box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important; }

.container{ padding-bottom:calc(104px + env(safe-area-inset-bottom)) !important; }
.dashboard-tab-content .hp-wrap,
.dashboard-tab-content .pf-wrap{ padding-top:2px; }
.hp-wrap{ gap:16px; }

/* ── 3. 首页：大标题 + 主操作 ───────────────────────────────────────────── */
/* 原来的青碧渐变 hero 卡 → iOS 大标题（标题直接落在画布上，右上角身份圆标） */
.hp-hero{
  position:relative; overflow:visible !important;
  border-radius:0 !important; padding:6px 0 0 !important;
  background:none !important; box-shadow:none !important; color:var(--ios-label) !important;
}
.hp-hero::before,.hp-hero::after{ display:none !important; content:none !important; }
.hp-hi{ margin:0 0 3px !important; font-size:13px !important; font-weight:600 !important;
  letter-spacing:0 !important; color:var(--ios-label-2) !important; }
.hp-name{ margin:0 !important; font-size:32px !important; font-weight:700 !important;
  letter-spacing:-.7px !important; line-height:1.12 !important; color:var(--ios-label) !important; }
.hp-sub{ margin:9px 0 0 !important; font-size:15px !important; line-height:1.42 !important;
  color:var(--ios-label-2) !important; max-width:76%; }
.hp-hero-badge{
  position:absolute !important; right:0 !important; top:0 !important;
  width:46px !important; height:46px !important; border-radius:50% !important;
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  border:.5px solid rgba(0,122,255,.16) !important; box-shadow:none !important;
  backdrop-filter:none !important; font-size:20px !important; overflow:hidden; z-index:1;
}
.hp-hero-badge img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* 主按钮：iOS 填充式（与登录页按钮同一套渐变与内高光） */
.hp-cta{
  gap:12px !important; min-height:58px; padding:0 16px !important;
  border-radius:var(--ios-r-ctl) !important;
  background:linear-gradient(180deg,var(--ios-blue-light) 0%,var(--ios-blue-deep) 100%) !important;
  box-shadow:0 8px 22px rgba(0,122,255,.26), inset 0 .5px 0 rgba(255,255,255,.34) !important;
  transition:transform .22s var(--ios-spring), box-shadow .22s var(--ios-spring), filter .18s ease !important;
}
.hp-cta:hover{ filter:brightness(1.03); }
.hp-cta:active{ transform:scale(.978) !important; box-shadow:0 4px 12px rgba(0,122,255,.22) !important; }
.hp-cta-ico{ width:36px !important; height:36px !important; border-radius:10px !important;
  background:rgba(255,255,255,.22) !important; color:#fff !important; font-size:16px !important; }
.hp-cta-txt b{ font-size:17px !important; font-weight:600 !important; letter-spacing:-.2px !important; }
.hp-cta-txt small{ font-size:13px !important; color:rgba(255,255,255,.80) !important; margin-top:1px; }
.hp-cta-arrow{ color:rgba(255,255,255,.62) !important; font-size:14px !important; }

/* ── 4. 分组列表骨架（内嵌分组：标题在外，卡片包住行） ─────────────────── */
.hp-group{
  background:transparent !important; box-shadow:none !important;
  padding:0 !important; border-radius:0 !important;
}
/* 分节头与卡片左边对齐（iOS 分组列表的 header 与卡片同一条左基线，不额外缩进） */
.hp-group-t{
  margin:0 0 8px !important; padding:0 !important;
  font-size:13px !important; font-weight:600 !important; letter-spacing:0 !important;
  color:var(--ios-label-2) !important;
}
.hp-group-t:not(:first-child){ margin-top:22px !important; }
.hp-more{ display:block !important; }
.hp-more>summary{ display:none !important; }
.hp-list{
  display:block !important; padding:0 !important;
  background:var(--ios-card) !important; border-radius:var(--ios-r-group) !important;
  overflow:hidden; box-shadow:var(--ios-card-shadow) !important;
}

/* 工具区行：iOS 设置式（彩色圆角图标 + 17 号标题 + 13 号说明 + 发丝分隔线） */
.hp-item{
  position:relative; display:flex; align-items:center !important; gap:12px !important;
  width:100% !important; min-height:48px; padding:11px 16px !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  font-family:inherit !important; color:var(--ios-label) !important;
  text-align:left !important; cursor:pointer;
  transition:background-color .12s ease !important;
}
.hp-item:hover{ background:transparent !important; }
.hp-item:active{ background:var(--ios-fill) !important; }
.hp-item + .hp-item::before{
  content:''; position:absolute; left:57px; right:0; top:0; height:.5px;
  background:var(--ios-separator); pointer-events:none;
}
.hp-ico{
  width:29px !important; height:29px !important; border-radius:var(--ios-r-ico) !important;
  font-size:14px !important; color:#fff !important; flex:0 0 auto !important;
}
.i-teal  { background:var(--ios-teal) !important;   color:#fff !important; }
.i-blue  { background:var(--ios-blue) !important;   color:#fff !important; }
.i-purple{ background:var(--ios-purple) !important; color:#fff !important; }
.i-orange{ background:var(--ios-orange) !important; color:#fff !important; }
.i-yellow{ background:var(--ios-yellow) !important; color:#fff !important; }
.i-gray  { background:var(--ios-gray) !important;   color:#fff !important; }
.hp-item-t{ gap:1px !important; }
.hp-item-t b{ font-size:16px !important; font-weight:400 !important; letter-spacing:0 !important;
  color:var(--ios-label) !important; line-height:1.28 !important; }
.hp-item-t small{ font-size:13px !important; color:var(--ios-label-2) !important; }
.hp-item > i.fa-angle-right{
  font-size:12px !important; color:var(--ios-label-3) !important; flex:0 0 auto;
}
.hp-item > i.fa-angle-right::before{ content:"\f054"; font-weight:900; }
.hp-item .badge-dot,.hp-item .data-count-badge{
  right:40px !important; top:50% !important; transform:translateY(-50%);
  background:var(--ios-red) !important; border-color:var(--ios-card) !important;
  box-shadow:none !important; font-weight:600 !important;
}

/* ── 5. 客服台列表（一行一个台 → iOS 分组行 + 就地展开） ────────────────── */
#kfDeskGroup .share-page-list{
  display:block !important; gap:0 !important; padding:0 !important; grid-template-columns:none !important;
  background:var(--ios-card) !important; border-radius:var(--ios-r-group) !important;
  overflow:hidden; box-shadow:var(--ios-card-shadow) !important;
}
.kf-desk-card{
  position:relative; display:block !important; width:100% !important;
  min-height:0 !important; padding:0 !important; margin:0 !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  box-shadow:none !important; text-align:left !important; overflow:visible !important;
  transition:background-color .12s ease !important;
}
.kf-desk-card:hover{ transform:none !important; }
.kf-desk-card:active{ background:var(--ios-fill) !important; }
.kf-desk-card + .kf-desk-card::before{
  content:''; position:absolute; left:68px; right:0; top:0; height:.5px;
  background:var(--ios-separator); pointer-events:none;
}
.kf-desk-row{
  display:flex !important; align-items:center !important; gap:12px !important;
  width:100% !important; min-height:60px; padding:10px 16px !important;
  box-sizing:border-box; text-align:left !important;
}
.kf-desk-row .share-page-text{ flex:1 1 auto !important; width:auto !important;
  min-width:0 !important; text-align:left !important; }
.kf-desk-row .share-page-main{
  display:block !important; font-size:16px !important; font-weight:400 !important;
  line-height:1.25 !important; letter-spacing:0 !important;
  color:var(--ios-label) !important; text-align:left !important;
}
.kf-desk-ava{ width:40px !important; height:40px !important; border-radius:12px !important;
  flex:0 0 auto; object-fit:cover; background:var(--ios-fill);
  box-shadow:0 0 0 .5px rgba(0,0,0,.06); }
.kf-desk-ava-fb{
  width:40px !important; height:40px !important; border-radius:12px !important;
  flex:0 0 auto; display:inline-flex !important; align-items:center; justify-content:center;
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; font-size:16px !important;
}
.kf-desk-ava-fb i{ font-size:16px !important; }

/* 行上的基础按钮：主（复制链接）= 填充胶囊；次（获取链接）= 淡色胶囊；二维码 = 圆形 */
.kf-desk-quick{
  flex:0 0 auto; display:inline-flex !important; align-items:center !important; justify-content:center;
  gap:6px !important; height:32px !important; padding:0 13px !important; border-radius:999px !important;
  background:var(--ios-blue) !important; color:#fff !important;
  font-size:14px !important; font-weight:600 !important; letter-spacing:-.1px; white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,122,255,.26) !important;
  transition:transform .16s var(--ios-spring), filter .16s ease !important;
}
.kf-desk-quick:active{ transform:scale(.955); filter:brightness(.96); }
.kf-desk-quick.quiet{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; box-shadow:none !important;
}
.kf-desk-quick[data-kf-qr]{
  width:32px !important; padding:0 !important; border-radius:999px !important;
  background:var(--ios-fill) !important; color:var(--ios-blue) !important; box-shadow:none !important;
}
.kf-desk-quick i{ font-size:13px !important; }
.kf-desk-chev-btn{
  flex:0 0 auto; width:30px; height:34px; padding:0; margin-left:-2px;
  display:inline-flex; align-items:center; justify-content:center;
  border:0 !important; background:transparent !important; cursor:pointer;
  color:var(--ios-label-3) !important; font-size:13px !important;
  transition:color .2s ease;
}
.kf-desk-chev-btn i{ font-weight:900; transition:transform .3s var(--ios-spring); }
.kf-desk-card.on .kf-desk-chev-btn{ color:var(--ios-blue) !important; }
.kf-desk-card.on .kf-desk-chev-btn i{ transform:rotate(90deg); }
/* 展开时，那一行与面板之间补一条发丝线（iOS 分组列表的分段感） */
.kf-desk-card.on .kf-desk-row{ box-shadow:inset 0 -.5px 0 var(--ios-separator); }

/* 就地展开的面板：高度动画（不用 JS 量高），标题在卡内做小节头 */
.kf-desk-panel{
  display:block !important; width:100% !important; box-sizing:border-box !important;
  max-height:0; opacity:0; overflow:hidden;
  padding:0 16px !important; border-top:0 !important; text-align:left !important;
  transition:max-height .42s var(--ios-spring), opacity .24s ease, padding .42s var(--ios-spring);
}
.kf-desk-card.on .kf-desk-panel{ max-height:1600px; opacity:1; padding:0 16px 14px !important; }
.kf-desk-shelf{
  margin:12px 0 4px !important; font-size:13px !important; font-weight:600 !important;
  letter-spacing:0 !important; color:var(--ios-label-2) !important;
}
.kf-desk-card.on .kf-desk-panel > .kf-desk-shelf:first-child{ margin-top:6px !important; }

/* 面板里的动作行：纯 iOS 行（无边框无底色，发丝线，图标方块 + 说明 + 指示箭头） */
.kf-desk-act{
  position:relative; display:flex !important; align-items:center !important; gap:12px !important;
  width:100% !important; min-height:48px; margin:0 !important; padding:9px 0 !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  font-family:inherit !important; text-align:left !important; cursor:pointer;
  transition:background-color .12s ease !important;
}
.kf-desk-act:active{ background:var(--ios-fill) !important; }
.kf-desk-act + .kf-desk-act::before{
  content:''; position:absolute; left:41px; right:0; top:0; height:.5px;
  background:var(--ios-separator); pointer-events:none;
}
.kf-desk-act .kf-desk-ico{
  flex:0 0 auto !important; width:29px !important; height:29px !important;
  border-radius:var(--ios-r-ico) !important; font-size:13px !important;
  background:var(--ios-gray) !important; color:#fff !important;
  display:inline-flex !important; align-items:center !important; justify-content:center;
}
.kf-desk-act .kf-desk-ico.tone-blue  { background:var(--ios-blue) !important; }
.kf-desk-act .kf-desk-ico.tone-indigo{ background:var(--ios-indigo) !important; }
.kf-desk-act .kf-desk-ico.tone-teal  { background:var(--ios-teal) !important; }
.kf-desk-act .kf-desk-ico.tone-green { background:var(--ios-green) !important; }
.kf-desk-act .kf-desk-ico.tone-orange{ background:var(--ios-orange) !important; }
.kf-desk-act .kf-desk-ico.tone-yellow{ background:var(--ios-yellow) !important; }
.kf-desk-act .kf-desk-ico.tone-purple{ background:var(--ios-purple) !important; }
.kf-desk-act .kf-desk-ico.tone-pink  { background:var(--ios-pink) !important; }
.kf-desk-act .kf-desk-ico.tone-gray  { background:var(--ios-gray) !important; }
.kf-desk-act .kf-desk-tx{ flex:1 1 auto !important; min-width:0 !important; }
.kf-desk-act .kf-desk-tx b{
  display:block !important; font-size:16px !important; font-weight:400 !important;
  letter-spacing:0 !important; color:var(--ios-label) !important; line-height:1.3 !important;
}
.kf-desk-act .kf-desk-tx small{
  display:block !important; margin-top:1px !important; font-size:13px !important;
  line-height:1.38 !important; color:var(--ios-label-2) !important;
}
.kf-desk-act .kf-desk-tag{
  display:inline-block !important; margin-right:5px !important; padding:0 6px !important;
  border-radius:6px !important; background:var(--ios-blue-soft) !important;
  color:var(--ios-blue) !important; font-size:11px !important; font-weight:600 !important;
}
.kf-desk-act .kf-desk-chev{
  flex:0 0 auto; margin-left:auto; font-size:12px; font-weight:900;
  color:var(--ios-label-3);
}
.kf-desk-act.kf-desk-primary .kf-desk-tx b{ font-weight:500 !important; color:var(--ios-blue) !important; }
.kf-desk-act.kf-desk-primary .kf-desk-ico{ background:var(--ios-blue) !important; }
.kf-desk-act.kf-desk-primary .kf-desk-tag{ background:var(--ios-blue) !important; color:#fff !important; }

/* ── 6. 折叠教程（三步就上手） ─────────────────────────────────────────── */
.hp-guide{
  margin:0 !important; border:0 !important; border-radius:var(--ios-r-group) !important;
  background:var(--ios-card) !important; box-shadow:var(--ios-card-shadow) !important; overflow:hidden;
}
.hp-guide>summary{
  list-style:none; cursor:pointer; display:flex !important; align-items:center; gap:10px !important;
  padding:14px 16px !important; font-size:16px !important; font-weight:500 !important;
  color:var(--ios-label) !important; border-bottom:0 !important;
}
.hp-guide>summary::-webkit-details-marker{ display:none; }
.hp-guide>summary:before{
  content:"?"; width:22px !important; height:22px !important; border-radius:50% !important;
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  font-size:13px !important; font-weight:700 !important; flex:0 0 auto;
}
.hp-guide>summary::after{
  content:"\f054"; font-family:"Font Awesome 5 Free"; font-weight:900; font-size:12px;
  color:var(--ios-label-3); margin-left:auto; transition:transform .3s var(--ios-spring);
}
.hp-guide[open]>summary{ border-bottom:.5px solid var(--ios-separator) !important; }
.hp-guide[open]>summary::after{ transform:rotate(90deg); }
.hp-guide ol{
  margin:0 !important; padding:12px 16px 2px 38px !important;
  font-size:15px !important; line-height:1.62 !important; color:var(--ios-label-2) !important;
}
.hp-guide li{ margin-bottom:8px !important; }
.hp-guide li::marker{ color:var(--ios-blue); font-weight:600; }
.hp-guide-tip{
  margin:0 !important; padding:2px 16px 15px 38px !important;
  font-size:13px !important; font-weight:600 !important; color:var(--ios-blue) !important;
}

/* ── 7. 底部标签栏（悬浮毛玻璃，选中态 systemBlue） ─────────────────────── */
.bottom-tabs{
  left:50% !important; right:auto !important; transform:translateX(-50%) !important;
  width:min(420px,calc(100% - 24px)) !important;
  bottom:calc(10px + env(safe-area-inset-bottom)) !important;
  border:0 !important; border-top:0 !important; border-radius:26px !important;
  background:rgba(255,255,255,.72) !important;
  -webkit-backdrop-filter:blur(30px) saturate(180%) !important;
  backdrop-filter:blur(30px) saturate(180%) !important;
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.55), 0 12px 34px rgba(16,24,40,.16) !important;
  padding:6px !important; gap:6px !important;
}
@media (prefers-color-scheme: dark){
  .bottom-tabs{ background:rgba(28,28,30,.74) !important;
    box-shadow:inset 0 0 0 .5px rgba(255,255,255,.10), 0 12px 34px rgba(0,0,0,.55) !important; }
}
.bottom-tab{
  flex:1 1 0 !important; min-width:0 !important; max-width:none !important;
  gap:2px !important; padding:7px 4px !important; border-radius:20px !important;
  color:var(--ios-label-2) !important; font-size:10.5px !important; font-weight:500 !important;
  transition:background-color .18s ease, color .18s ease !important;
}
.bottom-tab i{ font-size:19px !important; }
.bottom-tab.active{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  box-shadow:none !important; font-weight:600 !important;
}
.bottom-tab.active .badge-dot{ border-color:transparent !important; }
.bottom-tab .badge-dot{
  right:16px !important; top:1px !important;
  background:var(--ios-red) !important; border-color:var(--ios-card) !important;
  min-width:17px !important; height:17px !important; font-size:10px !important; font-weight:600 !important;
  box-shadow:none !important;
}

/* ── 8. 弹窗：底部抽屉（Sheet） ────────────────────────────────────────── */
.m-mask{
  background:rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask){
  align-items:flex-end !important; padding:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card,
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card.share-card,
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card.qr-card,
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card.xyos-card{
  display:flex !important; flex-direction:column !important;
  width:100% !important; max-width:560px !important; margin:0 auto !important;
  border:none !important; border-radius:var(--ios-r-sheet) var(--ios-r-sheet) 0 0 !important;
  background:var(--ios-card) !important;
  box-shadow:0 -1px 0 var(--ios-separator), 0 -20px 60px rgba(0,0,0,.28) !important;
  max-height:92vh !important; overflow:hidden !important;
  animation:kfIosSheetIn .40s var(--ios-spring);
}
@keyframes kfIosSheetIn{ from{ transform:translateY(26px) scale(.994); opacity:.4; } to{ transform:none; opacity:1; } }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card::before{
  content:""; display:block !important; width:36px !important; height:5px !important;
  border-radius:3px !important; background:var(--ios-label-3) !important;
  margin:6px auto 0 !important; flex:0 0 auto;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-top{
  flex:0 0 auto !important; display:block !important; padding:12px 20px 2px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-title{
  font-size:17px !important; font-weight:600 !important; letter-spacing:-.2px !important;
  color:var(--ios-label) !important; gap:9px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-ico{
  width:28px !important; height:28px !important; border-radius:8px !important;
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; font-size:13px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-sub{
  display:block !important; margin:6px 0 0 !important; font-size:13px !important;
  line-height:1.5 !important; color:var(--ios-label-2) !important; font-weight:400 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-body{
  flex:1 1 auto !important; min-height:0 !important; max-height:none !important;
  overflow-y:auto !important; -webkit-overflow-scrolling:touch;
  padding:12px 20px 16px !important; overscroll-behavior:contain;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-actions{
  flex:0 0 auto !important; display:flex !important; align-items:center !important;
  padding:6px 20px calc(16px + env(safe-area-inset-bottom)) !important; gap:10px !important;
  border-top:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card > form{
  display:flex !important; flex-direction:column !important; flex:1 1 auto !important; min-height:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-card > *{ min-width:0; }

/* 通用弹窗卡（公告等非抽屉弹窗） */
.m-card,.m-overlay .m-card{
  border-radius:var(--ios-r-sheet) !important; background:var(--ios-card) !important;
  border:0 !important; box-shadow:0 24px 70px rgba(0,0,0,.32) !important;
}
.m-mask .m-card .m-head,.m-overlay .m-head{ padding:16px 20px 6px !important; }
.m-overlay{ background:rgba(0,0,0,.30) !important; }

/* 按钮：填充（primary）/ 淡色（默认）/ 纯文字（ghost） —— iOS 三件套 */
.m-btn{
  border-radius:var(--ios-r-ctl) !important; min-height:50px !important;
  padding:0 18px !important; font-family:inherit !important; font-size:17px !important;
  font-weight:600 !important; letter-spacing:-.2px; box-shadow:none !important;
  /* display 不加 !important：页面上有按钮是「先隐藏、走到某一步才显示」的
     （#shareBack / #editBack / #posterShareBack 用行内 style="display:none" 控制），
     !important 会把行内隐藏盖掉，让「上一步」在第一步就冒出来。 */
  display:inline-flex; align-items:center !important; justify-content:center !important;
  gap:8px !important; cursor:pointer;
  transition:transform .18s var(--ios-spring), filter .16s ease, background-color .16s ease !important;
}
.m-btn:active{ transform:scale(.972); filter:brightness(.97); }
.m-btn.primary{
  background:linear-gradient(180deg,var(--ios-blue-light) 0%,var(--ios-blue-deep) 100%) !important;
  color:#fff !important; border:0 !important;
  box-shadow:0 6px 18px rgba(0,122,255,.26), inset 0 .5px 0 rgba(255,255,255,.32) !important;
}
.m-btn.primary:disabled{ opacity:.42 !important; cursor:not-allowed; box-shadow:none !important; }
.m-btn.ghost{
  background:transparent !important; border:0 !important; color:var(--ios-blue) !important;
  min-height:44px !important; font-weight:500 !important; padding:0 10px !important;
}
.m-btn.hot{ background:var(--ios-orange) !important; color:#fff !important; }
.m-btn:not(.primary):not(.ghost):not(.hot){
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; border:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-actions .m-btn.primary{ flex:1 1 auto !important; }

/* 抽屉里的列表行（选择页 / 链接类型 / 身份）—— iOS 单选列表 */
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-wrap{ margin-bottom:14px !important; }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-label{
  font-size:13px !important; font-weight:600 !important; color:var(--ios-label-2) !important;
  margin:0 0 8px !important; letter-spacing:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-note{
  font-size:13px !important; line-height:1.5 !important; color:var(--ios-label-2) !important; margin:0 0 10px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-list{
  display:block !important; grid-template-columns:none !important; gap:0 !important;
  background:var(--ios-card) !important; border-radius:var(--ios-r-group) !important;
  overflow:hidden auto; max-height:52vh; -webkit-overflow-scrolling:touch;
  box-shadow:inset 0 0 0 .5px var(--ios-separator); padding:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip{
  position:relative !important; display:flex !important; flex-direction:row !important;
  align-items:center !important; justify-content:flex-start !important;
  width:100% !important; min-height:52px !important; margin:0 !important; padding:10px 14px !important;
  gap:12px !important; text-align:left !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  box-shadow:none !important; transition:background-color .12s ease !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip:hover{ transform:none !important; }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip:active{ background:var(--ios-fill) !important; }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip + .share-page-chip::before{
  content:''; position:absolute; left:66px; right:0; top:0; height:.5px; background:var(--ios-separator);
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip.active{ background:transparent !important; }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip::after{
  content:"\f054"; font-family:"Font Awesome 5 Free"; font-weight:900; font-size:12px;
  color:var(--ios-label-3) !important; margin-left:auto !important; flex:0 0 auto !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip.active::after{
  content:"\f00c"; color:var(--ios-blue) !important; font-size:14px;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-avatar{
  width:40px !important; height:40px !important; border-radius:10px !important;
  flex:0 0 auto !important; object-fit:cover !important; box-shadow:0 0 0 .5px rgba(0,0,0,.06);
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-avatar-fallback{
  width:40px !important; height:40px !important; border-radius:10px !important;
  flex:0 0 auto !important; font-size:15px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-text{
  flex:1 1 auto !important; width:auto !important; min-width:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-main{
  font-size:16px !important; font-weight:400 !important; text-align:left !important;
  color:var(--ios-label) !important; letter-spacing:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip.active .share-page-main{
  color:var(--ios-blue) !important; font-weight:500 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-desc{
  margin-top:1px !important; font-size:13px !important; line-height:1.35 !important;
  text-align:left !important; color:var(--ios-label-2) !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-tag{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  border-radius:5px !important; font-size:11px !important; font-weight:600 !important; padding:0 5px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip.mode-double.active .share-page-main,
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip.mode-proxy3.active .share-page-main{ color:var(--ios-blue) !important; }

/* 身份选择弹窗（对方身份） */
.m-mask#customerPosterRolePickerMask .customer-poster-picker-option{
  position:relative; display:flex !important; align-items:center !important; justify-content:space-between !important;
  width:100% !important; min-height:52px !important; height:auto !important;
  margin:0 !important; padding:12px 14px !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  font-size:16px !important; font-weight:400 !important; color:var(--ios-label) !important;
  transition:background-color .12s ease !important;
}
.m-mask#customerPosterRolePickerMask .customer-poster-picker-option:active{ background:var(--ios-fill) !important; }
.m-mask#customerPosterRolePickerMask .customer-poster-picker-option + .customer-poster-picker-option::before{
  content:''; position:absolute; left:14px; right:0; top:0; height:.5px; background:var(--ios-separator);
}
.m-mask#customerPosterRolePickerMask .customer-poster-picker-option.active{ color:var(--ios-blue) !important; background:transparent !important; }
.m-mask#customerPosterRolePickerMask .customer-poster-picker-list{
  background:var(--ios-card) !important; border-radius:var(--ios-r-group) !important;
  overflow:hidden; box-shadow:inset 0 0 0 .5px var(--ios-separator);
}

/* 链接卡（复制 / 二维码那一排 === iOS 淡色按钮） */
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone{ gap:9px !important; margin-top:10px !important; }
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-title{
  font-size:13px !important; font-weight:600 !important; color:var(--ios-label-2) !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-card{
  background:var(--ios-fill) !important; border:0 !important; border-radius:var(--ios-r-ctl) !important;
  box-shadow:none !important; transform:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-card:hover{
  transform:none !important; border:0 !important; box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-badge{
  background:var(--ios-card) !important; color:var(--ios-blue) !important; border-radius:6px !important;
  font-weight:600 !important; box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-url{
  color:var(--ios-label) !important; font-family:var(--ios-mono) !important; font-size:12.5px !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-act{
  border-radius:999px !important; min-height:38px !important; border:0 !important;
  font-size:15px !important; font-weight:500 !important; box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-act[data-slz-copy],
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-act[data-cplp-pick]{
  background:var(--ios-blue) !important; color:#fff !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask) .share-link-zone .slz-act[data-slz-qr]{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
}
#shareMask .share-actions .btn{ border-radius:var(--ios-r-ctl) !important; min-height:50px !important; }
#shareMask #shareCopy{ background:var(--ios-blue) !important; color:#fff !important; border:none !important; border-radius:var(--ios-r-ctl) !important; }
#shareMask #shareQR{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; border:0 !important; border-radius:var(--ios-r-ctl) !important; }
#shareMask #shareQR:active{ background:var(--ios-fill-2) !important; }

/* 覆盖层加固：老样式表里这一批选择器带「ID + !important」（例：#shareMask .m-btn.ghost），
   特异性比裸类名高，所以这里必须用同样带 ID 的 :is() 选择器 + !important 才能压过去。 */
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-btn{
  border-radius:var(--ios-r-ctl) !important; min-height:50px !important;
  padding:0 18px !important; font-size:17px !important; font-weight:600 !important;
  letter-spacing:-.2px !important; box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-btn.primary{
  background:linear-gradient(180deg,var(--ios-blue-light) 0%,var(--ios-blue-deep) 100%) !important;
  color:#fff !important; border:0 !important;
  box-shadow:0 6px 18px rgba(0,122,255,.26), inset 0 .5px 0 rgba(255,255,255,.32) !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-btn.ghost{
  background:transparent !important; color:var(--ios-blue) !important; border:0 !important;
  min-height:44px !important; font-weight:500 !important; padding:0 10px !important;
  box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-btn.primary:disabled{
  opacity:.42 !important; box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-btn:not(.primary):not(.ghost):not(.hot){
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; border:0 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-in{
  border-radius:10px !important; border:0 !important; background:var(--ios-fill) !important;
  padding:11px 13px !important; font-size:16px !important; color:var(--ios-label) !important;
  box-shadow:none !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-in:focus{
  background:var(--ios-fill-2) !important; box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) input:not([type="file"]):not([type="radio"]):not([type="checkbox"]),
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) select,
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) textarea{
  border-radius:10px !important; font-size:16px !important; font-family:inherit !important;
  border:0 !important; background:var(--ios-fill) !important; color:var(--ios-label) !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) .m-hint{
  font-size:13px !important; color:var(--ios-label-2) !important; line-height:1.5 !important;
}
.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) input[type="file"]::file-selector-button{
  border:0 !important; background:var(--ios-card) !important; color:var(--ios-blue) !important;
  font-weight:600 !important; font-size:13px !important; border-radius:999px !important;
  padding:6px 13px !important; margin-right:10px !important; cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.10) !important;
}

/* ── 9. 顶部「获取客服链接」选择弹窗（分段控件 + 胶囊换台） ─────────────── */
.kfl-seg{
  position:relative; display:grid !important; grid-template-columns:1fr 1fr; gap:2px !important;
  padding:2px !important; margin:2px 0 12px !important;
  background:var(--ios-fill) !important; border-radius:var(--ios-r-seg) !important;
}
.kfl-seg.kfl-seg-3{ grid-template-columns:1fr 1fr; }
.kfl-seg .kfl-seg-thumb{
  position:absolute; top:2px; left:2px; width:calc(50% - 2px); height:calc(100% - 4px);
  border-radius:7px; background:var(--ios-card);
  box-shadow:0 3px 8px rgba(0,0,0,.12), 0 1px 1px rgba(0,0,0,.04);
  transition:transform .28s var(--ios-spring);
}
.kfl-seg[data-sel="b"] .kfl-seg-thumb{ transform:translateX(100%); }
@media (prefers-color-scheme: dark){
  .kfl-seg .kfl-seg-thumb{ background:#48484A; box-shadow:0 3px 8px rgba(0,0,0,.4); }
}
.kfl-seg button{
  position:relative; z-index:1; height:32px !important; border:0 !important; border-radius:7px !important;
  background:transparent !important; color:var(--ios-label) !important;
  font-family:inherit !important; font-size:13px !important; font-weight:500 !important;
  cursor:pointer; transition:color .18s ease;
}
.kfl-seg button.active{ color:var(--ios-label) !important; font-weight:600 !important; }
.kfl-tip{
  margin:0 0 12px !important; font-size:13px !important; line-height:1.55 !important;
  color:var(--ios-label-2) !important;
}
.kfl-tip b{ color:var(--ios-blue) !important; font-weight:600 !important; }
.kfl-go{ display:grid !important; grid-template-columns:1fr auto !important; gap:9px !important; }
.kfl-go button{
  border:0 !important; border-radius:var(--ios-r-ctl) !important; min-height:50px !important;
  padding:0 18px !important; font-family:inherit !important; font-size:17px !important;
  font-weight:600 !important; letter-spacing:-.2px; cursor:pointer;
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important;
  transition:transform .18s var(--ios-spring), filter .16s ease !important;
}
.kfl-go button:active{ transform:scale(.972); }
.kfl-go .kfl-copy{
  background:linear-gradient(180deg,var(--ios-blue-light),var(--ios-blue-deep)) !important; color:#fff !important;
  box-shadow:0 6px 18px rgba(0,122,255,.26), inset 0 .5px 0 rgba(255,255,255,.32) !important;
}
.kfl-go .kfl-qr{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  padding:0 20px !important; box-shadow:none !important;
}
.kfl-go button:disabled{ opacity:.42 !important; cursor:not-allowed; }
.kfl-one{
  display:block !important; width:100% !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important; min-height:50px !important; padding:0 18px !important;
  margin:0 0 10px !important;
  background:linear-gradient(180deg,var(--ios-blue-light),var(--ios-blue-deep)) !important; color:#fff !important;
  font-family:inherit !important; font-size:17px !important; font-weight:600 !important;
  box-shadow:0 6px 18px rgba(0,122,255,.26) !important; cursor:pointer;
  transition:transform .18s var(--ios-spring) !important;
}
.kfl-one:active{ transform:scale(.972); }
#kfLinkPickMask .kfl-desk-list{
  display:flex !important; gap:8px !important; overflow-x:auto !important;
  padding:2px 0 8px !important; -webkit-overflow-scrolling:touch; scrollbar-width:none;
}
#kfLinkPickMask .kfl-desk-list::-webkit-scrollbar{ display:none; }
#kfLinkPickMask .kfl-desk{
  flex:0 0 auto !important; display:inline-flex !important; align-items:center !important; gap:7px !important;
  height:36px; padding:0 14px !important; border-radius:999px !important;
  border:0 !important; background:var(--ios-fill) !important; color:var(--ios-label) !important;
  font-family:inherit !important; font-size:14px !important; font-weight:500 !important;
  cursor:pointer; white-space:nowrap;
  transition:background-color .18s ease, color .18s ease, transform .18s var(--ios-spring) !important;
}
#kfLinkPickMask .kfl-desk:active{ transform:scale(.96); }
#kfLinkPickMask .kfl-desk img{ width:22px !important; height:22px !important; border-radius:6px !important; object-fit:cover; }
#kfLinkPickMask .kfl-desk.active{
  background:var(--ios-blue) !important; color:#fff !important; font-weight:600 !important; box-shadow:none !important;
}
#kfLinkPickMask .hp-group-t{ margin:14px 0 6px !important; }
#kfLinkPickMask .m-btn.ghost{ width:100% !important; margin-top:12px !important; }

/* ── 10. 抽屉里的表单控件 ─────────────────────────────────────────────── */
.m-in{
  border-radius:10px !important; border:0 !important; background:var(--ios-fill) !important;
  padding:11px 13px !important; font-family:inherit !important; font-size:16px !important;
  color:var(--ios-label) !important; outline:none !important; box-shadow:none !important;
  transition:box-shadow .18s ease, background-color .18s ease !important;
}
.m-in::placeholder{ color:var(--ios-label-3) !important; }
.m-in:focus{ background:var(--ios-fill-2) !important; box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important; }
textarea.m-in{ line-height:1.45 !important; resize:vertical; }
select.m-in{ appearance:none; -webkit-appearance:none; background-image:none !important; }
.m-mask:is(#gfGoofishOrderMask,#roleAvatarMask,#posterEditMask,#customerPosterEditMask) .m-in{ font-size:16px !important; }
.m-mask:is(#gfGoofishOrderMask,#roleAvatarMask,#posterEditMask,#customerPosterEditMask) input,
.m-mask:is(#gfGoofishOrderMask,#roleAvatarMask,#posterEditMask,#customerPosterEditMask) select,
.m-mask:is(#gfGoofishOrderMask,#roleAvatarMask,#posterEditMask,#customerPosterEditMask) textarea{
  border-radius:10px !important; font-size:16px !important;
}
.m-hint{ font-size:13px !important; color:var(--ios-label-2) !important; margin-top:2px !important; }
.m-mask:is(#gfGoofishOrderMask,#roleAvatarMask,#posterEditMask,#customerPosterEditMask) .m-hint{
  font-size:13px !important; color:var(--ios-label-2) !important;
}
input[type="file"].m-in,.m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterLinkPickerMask,#customerPosterRolePickerMask,#gfGoofishOrderMask,#roleAvatarMask,#xyOrderSnapshotMask,#pangxieOrderSnapshotMask,#posterEditMask,#customerPosterEditMask,#qrMask,#kfLinkPickMask) input[type="file"]{
  width:100% !important; padding:9px 12px !important; font-size:13px !important;
  color:var(--ios-label-2) !important; background:var(--ios-fill) !important;
  border:0 !important; border-radius:10px !important;
}
input[type="file"]::file-selector-button{
  border:0 !important; background:var(--ios-card) !important; color:var(--ios-blue) !important;
  font-weight:600 !important; font-size:13px !important; border-radius:999px !important;
  padding:6px 13px !important; margin-right:10px !important; cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.10) !important;
}
input[type="radio"],input[type="checkbox"]{ accent-color:var(--ios-blue); }

/* ── 11. 提示条（Toast）与二维码 / 海报（保持白底成品外观） ─────────────── */
.toast{
  left:50% !important; top:auto !important;
  bottom:calc(112px + env(safe-area-inset-bottom)) !important;
  transform:translateX(-50%) scale(.94) !important;
  background:rgba(28,28,30,.86) !important; color:#fff !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border-radius:16px !important; padding:12px 18px !important;
  font-family:var(--ios-font) !important; font-size:15px !important; font-weight:500 !important;
  max-width:78vw; text-align:center; box-shadow:0 10px 30px rgba(0,0,0,.28);
  transition:opacity .22s ease, transform .30s var(--ios-spring) !important;
}
.toast.show{ opacity:1 !important; top:auto !important; transform:translateX(-50%) scale(1) !important; }
.qrPoster,.poster-edit-preview-row{ color:#0b1324; }
.m-card.qr-card{ --ios-card:#FFFFFF; }
.m-mask#qrMask .m-card{ background:#fff !important; }

/* ── 12. 窄屏 / 横屏 / 降级 ───────────────────────────────────────────── */
@media (max-width:420px){
  .hp-name{ font-size:29px !important; }
  .hp-sub{ font-size:14px !important; }
  .hp-item-t b{ font-size:15.5px !important; }
  .kf-desk-row .share-page-main{ font-size:15.5px !important; }
  .kf-desk-quick{ height:31px !important; padding:0 11px !important; font-size:13.5px !important; }
  .bottom-tabs{ width:calc(100% - 20px) !important; }
  .m-mask:is(#shareMask,#posterShareMask,#editMask,#customerPosterRolePickerMask) .share-page-chip{ padding:10px 12px !important; }
}
@media (max-width:370px){
  .kf-desk-quick[data-kf-qr]{ display:none !important; }
  .kf-desk-quick{ padding:0 10px !important; font-size:13px !important; }
  .hp-cta-txt small{ display:none !important; }
  .hp-cta{ min-height:52px !important; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .bottom-tabs{ background:rgba(255,255,255,.97) !important; }
  .toast{ background:rgba(28,28,30,.95) !important; }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ── 13. 「我的」页（profile_mine.php，pf-*）────────────────────────────── */
.pf-wrap{ width:min(560px,100%) !important; gap:16px !important; padding:0 !important; }
/* 身份区：与首页大标题同一做法（头像圆 + 名字 + 副标题，落在画布上） */
.pf-hero{
  position:relative !important; overflow:visible !important;
  border-radius:0 !important; padding:2px 0 0 !important;
  background:none !important; box-shadow:none !important; color:var(--ios-label) !important;
  gap:14px !important;
}
.pf-hero:after{ display:none !important; content:none !important; }
.pf-ava{
  width:64px !important; height:64px !important; border-radius:50% !important;
  border:.5px solid rgba(0,0,0,.06) !important; background:var(--ios-fill) !important;
  box-shadow:0 1px 3px rgba(16,24,40,.10) !important;
}
@media (prefers-color-scheme: dark){ .pf-ava{ border-color:rgba(255,255,255,.10) !important; } }
.pf-name{
  font-size:24px !important; font-weight:700 !important; letter-spacing:-.5px !important;
  line-height:1.18 !important; color:var(--ios-label) !important;
}
.pf-remain{
  margin-top:6px !important; font-size:13px !important; font-weight:500 !important;
  letter-spacing:0 !important; color:var(--ios-label-2) !important;
}
.pf-remain:before{
  width:7px !important; height:7px !important;
  background:var(--ios-green) !important; box-shadow:0 0 0 3px rgba(52,199,89,.18) !important;
}
/* 分组卡：内嵌分组列表 */
.pf-card{
  background:var(--ios-card) !important; border-radius:var(--ios-r-group) !important;
  box-shadow:var(--ios-card-shadow) !important; overflow:hidden !important;
}
.pf-card-t{
  padding:16px 16px 4px !important; font-size:13px !important; font-weight:600 !important;
  letter-spacing:0 !important; color:var(--ios-label-2) !important;
}
.pf-row{
  position:relative !important; min-height:50px !important; padding:11px 16px !important;
  gap:12px !important; color:var(--ios-label) !important;
}
.pf-row:active{ background:var(--ios-fill) !important; }
.pf-row + .pf-row{ border-top:0 !important; }
.pf-row + .pf-row:before{
  content:''; position:absolute; left:57px; right:0; top:0; height:.5px;
  background:var(--ios-separator); pointer-events:none;
}
.pf-ico{
  width:29px !important; height:29px !important; border-radius:var(--ios-r-ico) !important;
  font-size:14px !important; color:#fff !important;
}
.pf-ico.i-red { background:var(--ios-red) !important;  color:#fff !important; }
.pf-ico.i-teal{ background:var(--ios-blue) !important; color:#fff !important; }
.pf-ico.i-gray{ background:var(--ios-gray) !important; color:#fff !important; }
.pf-row-t{
  font-size:16px !important; font-weight:400 !important; letter-spacing:0 !important;
  color:var(--ios-label) !important;
}
.pf-count{
  min-width:22px !important; height:22px !important; padding:0 7px !important;
  border-radius:999px !important; background:var(--ios-fill) !important;
  color:var(--ios-label-2) !important; font-size:12px !important; font-weight:600 !important;
}
.pf-arrow{ font-size:12px !important; color:var(--ios-label-3) !important; }
.pf-arrow:before{ content:"\f054"; font-weight:900; }
/* 已拉黑：底部抽屉 */
.pf-mask{
  align-items:flex-end !important; padding:0 !important;
  background:rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.pf-mask-card{
  width:100% !important; max-width:560px !important; margin:0 auto !important;
  max-height:92vh !important;
  border-radius:var(--ios-r-sheet) var(--ios-r-sheet) 0 0 !important;
  background:var(--ios-card) !important;
  box-shadow:0 -1px 0 var(--ios-separator), 0 -20px 60px rgba(0,0,0,.28) !important;
  animation:kfIosSheetIn .40s var(--ios-spring);
}
.pf-mask-card:before{
  content:''; display:block; width:36px; height:5px; border-radius:3px;
  background:var(--ios-label-3); margin:6px auto 0;
}
.pf-mask-hd{ padding:12px 20px 8px !important; border-bottom:0 !important; }
.pf-mask-t{ font-size:17px !important; font-weight:600 !important; color:var(--ios-label) !important; }
.pf-mask-x{
  width:30px !important; height:30px !important; border:0 !important;
  background:var(--ios-fill) !important; color:var(--ios-label-2) !important; font-size:12px !important;
}
.pf-mask-bd{
  background:transparent !important; gap:0 !important;
  padding:4px 18px calc(18px + env(safe-area-inset-bottom)) !important;
}
.pf-bl{
  background:transparent !important; border:0 !important; border-radius:0 !important;
  padding:12px 2px !important; gap:12px !important;
}
.pf-bl + .pf-bl{ border-top:.5px solid var(--ios-separator) !important; }
.pf-bl-ip{ font-size:16px !important; font-weight:500 !important; color:var(--ios-label) !important; }
.pf-bl-meta{ font-size:13px !important; color:var(--ios-label-2) !important; }
/* 「解除」= iOS 破坏性文字按钮；二次确认时才变实心红 */
.pf-bl-btn{
  height:34px !important; padding:0 8px !important; border:0 !important;
  background:transparent !important; color:var(--ios-red) !important;
  font-size:16px !important; font-weight:400 !important; border-radius:999px !important;
}
.pf-bl-btn[data-armed="1"]{
  background:var(--ios-red) !important; color:#fff !important;
  padding:0 14px !important; font-weight:600 !important;
}
.pf-bl-empty{ padding:30px 10px !important; color:var(--ios-label-2) !important; font-weight:400 !important; }
.pf-toast{
  border-radius:var(--ios-r-ctl) !important; background:rgba(28,28,30,.94) !important;
  font-size:14px !important; font-weight:500 !important; padding:11px 16px !important;
  bottom:calc(96px + env(safe-area-inset-bottom)) !important;
}

/* ── 14. 对话中心（chat_center.php）───────────────────────────────────── */
.ios-chat-center{ background:var(--ios-canvas) !important; }
.ios-chat-center .page{ width:min(100%,780px) !important; }
.ios-chat-center .top{
  background:transparent !important; border-bottom:0 !important;
  padding:calc(14px + env(safe-area-inset-top)) 16px 10px !important; gap:12px !important;
}
.ios-chat-center .top-icon{
  width:44px !important; height:44px !important; border-radius:var(--ios-r-ctl) !important;
  border:0 !important; background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  box-shadow:none !important; font-size:19px !important;
}
.ios-chat-center .hrow{ gap:8px !important; }
.ios-chat-center .h1{
  font-size:28px !important; font-weight:700 !important; letter-spacing:-.6px !important;
  color:var(--ios-label) !important;
}
.ios-chat-center .sub{ font-size:13px !important; color:var(--ios-label-2) !important; }
.ios-chat-center .pill{
  height:20px !important; min-width:20px !important; padding:0 6px !important;
  background:var(--ios-red) !important; box-shadow:none !important;
  font-size:12px !important; font-weight:600 !important;
}
.ios-chat-center .list{ padding:4px 16px 14px !important; }
.ios-chat-center .list::-webkit-scrollbar-thumb{ background:var(--ios-label-3) !important; }
/* 会话行 → iOS 消息列表卡片行 */
.ios-chat-center .item{
  grid-template-columns:52px minmax(0,1fr) 0 !important;
  gap:12px !important; align-items:center !important;
  padding:12px 14px !important; margin-bottom:10px !important;
  border:0 !important; border-radius:var(--ios-r-group) !important;
  background:var(--ios-card) !important; box-shadow:var(--ios-card-shadow) !important;
  transform:none !important;
}
.ios-chat-center .item:before{ display:none !important; }
.ios-chat-center .item:hover{
  background:var(--ios-card) !important; border:0 !important;
  box-shadow:var(--ios-card-shadow) !important; transform:none !important;
}
.ios-chat-center .item:active{ transform:scale(.988) !important; }
.ios-chat-center .item.unread{ background:var(--ios-card) !important; border:0 !important; }
.ios-chat-center .ava{
  width:52px !important; height:52px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important; box-shadow:none !important;
  color:var(--ios-label-2) !important;
}
.ios-chat-center .ava img{ border-radius:50% !important; }
.ios-chat-center .dot{
  right:-2px !important; top:-2px !important; border-color:var(--ios-card) !important;
  background:var(--ios-red) !important; box-shadow:none !important; font-weight:600 !important;
}
.ios-chat-center .itemChevron{ display:none !important; }
.ios-chat-center .main{ padding-top:0 !important; }
.ios-chat-center .name{
  font-size:16px !important; font-weight:600 !important; color:var(--ios-label) !important;
}
.ios-chat-center .item.unread .name{ color:var(--ios-label) !important; font-weight:700 !important; }
.ios-chat-center .addr{ margin-top:2px !important; font-size:12px !important; color:var(--ios-label-3) !important; }
.ios-chat-center .preview{ margin-top:3px !important; font-size:14px !important; color:var(--ios-label-2) !important; }
.ios-chat-center .preview .me{
  border-radius:5px !important; background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
}
.ios-chat-center .item.unread .preview,
.ios-chat-center .preview.is-unread{ color:var(--ios-label) !important; font-weight:500 !important; }
.ios-chat-center .rightMeta{ padding-top:2px !important; }
.ios-chat-center .time{ font-size:13px !important; font-weight:400 !important; color:var(--ios-label-3) !important; }
.ios-chat-center .presence{
  height:auto !important; padding:0 !important; border:0 !important;
  background:transparent !important; box-shadow:none !important;
  font-size:12px !important; font-weight:500 !important;
}
.ios-chat-center .presence:before{ width:6px !important; height:6px !important; margin-right:5px !important; }
.ios-chat-center .presence.online { color:var(--ios-green) !important; }
.ios-chat-center .presence.recent { color:var(--ios-orange) !important; }
.ios-chat-center .presence.offline{ color:var(--ios-label-3) !important; }
.ios-chat-center .peerTag{ background:var(--ios-fill) !important; color:var(--ios-label-2) !important; font-weight:600 !important; }
.ios-chat-center .peerTag.role-seller{ background:rgba(255,149,0,.16) !important; color:var(--ios-orange) !important; }
/* 空态 */
.ios-chat-center .empty{
  min-height:0 !important; padding:60px 16px !important;
  border:0 !important; background:transparent !important; color:var(--ios-label-2) !important;
}
.ios-chat-center .empty-ico{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
.ios-chat-center .empty-t{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-chat-center .empty-s{ color:var(--ios-label-2) !important; font-weight:400 !important; }
.ios-chat-center .empty-btn{
  height:44px !important; padding:0 24px !important; font-size:16px !important;
  font-weight:600 !important; background:var(--ios-blue) !important;
  box-shadow:0 6px 18px rgba(0,122,255,.26) !important;
}
.ios-chat-center .toast{
  top:auto !important; bottom:calc(96px + env(safe-area-inset-bottom)) !important;
  border-radius:var(--ios-r-ctl) !important; background:rgba(28,28,30,.94) !important;
  font-size:14px !important; font-weight:500 !important;
}

/* ── 15. 二级页：数据列表 / 商品库 / 编辑客服页面 ──────────────────────── */
:is(.ios-data,.ios-seller,.ios-cs-settings){ background:var(--ios-canvas) !important; color:var(--ios-label) !important; }
:is(.ios-data,.ios-seller) .page{ max-width:820px !important; padding:0 16px 32px !important; color:var(--ios-label) !important; }
:is(.ios-data,.ios-seller,.ios-cs-settings) .top{
  background:rgba(242,242,247,.82) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border-bottom:.5px solid var(--ios-separator) !important;
  padding:calc(12px + env(safe-area-inset-top)) 4px 10px !important; gap:10px !important;
}
@media (prefers-color-scheme: dark){
  :is(.ios-data,.ios-seller,.ios-cs-settings) .top{ background:rgba(0,0,0,.72) !important; }
}
:is(.ios-data,.ios-seller) .h1{
  font-size:22px !important; font-weight:700 !important; letter-spacing:-.5px !important;
  color:var(--ios-label) !important;
}
:is(.ios-data,.ios-seller) .sub{ font-size:12.5px !important; color:var(--ios-label-2) !important; }
:is(.ios-data,.ios-seller) .back,
:is(.ios-data,.ios-seller) .refresh{
  width:34px !important; height:34px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important; color:var(--ios-blue) !important;
  box-shadow:none !important; font-size:15px !important;
}
:is(.ios-data,.ios-seller) .stat{ font-size:12.5px !important; color:var(--ios-label-2) !important; }
:is(.ios-data,.ios-seller) .stat b{ color:var(--ios-blue) !important; }
:is(.ios-data,.ios-seller) .card{
  background:var(--ios-card) !important; border:0 !important;
  border-radius:var(--ios-r-group) !important; box-shadow:var(--ios-card-shadow) !important;
  padding:14px 16px !important; margin-bottom:10px !important;
}
:is(.ios-data,.ios-seller) .empty{ color:var(--ios-label-2) !important; font-weight:400 !important; }
:is(.ios-data,.ios-seller) .toast{
  border-radius:var(--ios-r-ctl) !important; background:rgba(28,28,30,.94) !important;
  font-size:14px !important; font-weight:500 !important;
}
:is(.ios-data,.ios-seller) .search{
  background:var(--ios-fill) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important; box-shadow:none !important;
}
:is(.ios-data,.ios-seller) .search input{ color:var(--ios-label) !important; }
:is(.ios-data,.ios-seller) .search i,
:is(.ios-data,.ios-seller) .search .clear{ color:var(--ios-label-2) !important; }
:is(.ios-data,.ios-seller) .chips{ gap:8px !important; }
:is(.ios-data,.ios-seller) .chip{
  background:var(--ios-card) !important; border:0 !important; color:var(--ios-label-2) !important;
  border-radius:999px !important; font-weight:500 !important; box-shadow:var(--ios-card-shadow) !important;
}
:is(.ios-data,.ios-seller) .chip.on{
  background:var(--ios-blue) !important; color:#fff !important;
  box-shadow:0 4px 12px rgba(0,122,255,.24) !important; font-weight:600 !important;
}
/* 数据列表细节 */
.ios-data .badge{ border-radius:7px !important; font-weight:600 !important; }
.ios-data .badge.pay  { background:rgba(255,149,0,.16) !important; color:var(--ios-orange) !important; }
.ios-data .badge.qq   { background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
.ios-data .badge.other{ background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
.ios-data .meta{ color:var(--ios-label-2) !important; }
.ios-data .meta .t{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-data .copy-all{
  border-radius:999px !important; background:var(--ios-blue) !important;
  color:#fff !important; box-shadow:none !important; font-weight:600 !important;
}
.ios-data .copy-all.ok{ background:var(--ios-green) !important; }
.ios-data .field{
  background:var(--ios-fill) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important;
}
.ios-data .field .k{ color:var(--ios-label-2) !important; }
.ios-data .field .v{ color:var(--ios-label) !important; }
.ios-data .field.long:not(.open) .v:after{
  background:var(--ios-fill) !important; color:var(--ios-blue) !important;
}
.ios-data .detail-toggle{ color:var(--ios-blue) !important; font-weight:600 !important; }
.ios-data .pager button{
  background:var(--ios-card) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important; color:var(--ios-label) !important;
  box-shadow:var(--ios-card-shadow) !important; font-weight:500 !important;
}
.ios-data .pager .pg{ color:var(--ios-label-2) !important; }
/* 商品库细节 */
.ios-seller .tip{
  background:var(--ios-card) !important; border:0 !important;
  border-radius:var(--ios-r-group) !important; box-shadow:var(--ios-card-shadow) !important;
  color:var(--ios-label-2) !important; font-size:12.5px !important;
}
.ios-seller .thumb{
  border-radius:var(--ios-r-ctl) !important; border:0 !important;
  background:var(--ios-fill) !important; color:var(--ios-label-3) !important;
}
.ios-seller .title{ font-size:16px !important; font-weight:600 !important; color:var(--ios-label) !important; }
.ios-seller .tag{ border-radius:999px !important; font-weight:600 !important; background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
.ios-seller .tag.game{ background:rgba(255,149,0,.16) !important; color:var(--ios-orange) !important; }
.ios-seller .tag.on  { background:rgba(52,199,89,.16) !important; color:#1FA84A !important; }
.ios-seller .tag.chat{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
.ios-seller .price{ color:var(--ios-red) !important; font-weight:700 !important; }
.ios-seller .meta{ color:var(--ios-label-2) !important; }
.ios-seller .kv span{ color:var(--ios-label-2) !important; }
.ios-seller .kv b{ color:var(--ios-label) !important; }
.ios-seller .btn{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  box-shadow:none !important; font-weight:600 !important;
}
.ios-seller .btn.primary,.ios-seller .btn.teal{ background:var(--ios-blue) !important; color:#fff !important; }
.ios-seller .btn.ghost{ background:var(--ios-fill) !important; color:var(--ios-label) !important; }
.ios-seller .btn.danger{ background:rgba(255,59,48,.14) !important; color:var(--ios-red) !important; }
.ios-seller .group{ border-top:.5px solid var(--ios-separator) !important; }
.ios-seller .gtitle{ color:var(--ios-orange) !important; font-weight:600 !important; }
.ios-seller .link{
  background:var(--ios-fill) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important;
}
.ios-seller .link .lb{ color:var(--ios-label-2) !important; }
.ios-seller .link .u{ color:var(--ios-label-2) !important; }
.ios-seller .link button{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
/* 编辑客服页面 */
.ios-cs-settings{ font-family:var(--ios-font) !important; }
.ios-cs-settings .wrap{ max-width:980px !important; padding:calc(16px + env(safe-area-inset-top)) 16px 40px !important; }
.ios-cs-settings .wrap > h2{
  margin:6px 0 14px !important; font-size:28px !important; font-weight:700 !important;
  letter-spacing:-.6px !important; color:var(--ios-label) !important; line-height:1.2 !important;
}
.ios-cs-settings .wrap > h2 span{ color:var(--ios-green) !important; }
.ios-cs-settings .wrap > div[style]{ color:var(--ios-label-2) !important; }
.ios-cs-settings .card{
  background:var(--ios-card) !important; border:0 !important;
  border-radius:var(--ios-r-group) !important; box-shadow:var(--ios-card-shadow) !important;
  padding:18px 16px !important;
}
.ios-cs-settings .card + .card{ margin-top:16px !important; }
.ios-cs-settings label{
  font-size:13px !important; font-weight:600 !important; color:var(--ios-label-2) !important;
  padding-left:0 !important; margin:16px 0 7px !important;
}
.ios-cs-settings label:before{ display:none !important; content:none !important; }
.ios-cs-settings input[type=text],
.ios-cs-settings input[type=url],
.ios-cs-settings input[type=number],
.ios-cs-settings textarea{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-fill) !important; color:var(--ios-label) !important;
  padding:13px 14px !important; font-size:16px !important;
  -webkit-appearance:none; appearance:none;
}
.ios-cs-settings input[type=text]:focus,
.ios-cs-settings input[type=url]:focus,
.ios-cs-settings input[type=number]:focus,
.ios-cs-settings textarea:focus{
  box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important; border:0 !important;
}
.ios-cs-settings .preview img{
  width:60px !important; height:60px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important;
}
.ios-cs-settings .hint,.ios-cs-settings .note{ color:var(--ios-label-2) !important; }
.ios-cs-settings .btnline{ gap:10px !important; }
.ios-cs-settings .btn{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-fill) !important; color:var(--ios-blue) !important;
  font-weight:600 !important; padding:13px 18px !important; box-shadow:none !important;
}
.ios-cs-settings .btn.primary{ background:var(--ios-blue) !important; color:#fff !important; }
.ios-cs-settings .btn:hover{ transform:none !important; }
.ios-cs-settings .btn:active{ transform:scale(.98) !important; }
.ios-cs-settings .msg{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:rgba(52,199,89,.12) !important; color:#1FA84A !important; font-weight:500 !important;
}
.ios-cs-settings .err{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:rgba(255,59,48,.12) !important; color:var(--ios-red) !important; font-weight:500 !important;
}
.ios-cs-settings .grid2{ gap:14px !important; }

/* ── 16. 聊天页（chat_talk.php）───────────────────────────────────────── */
/* 用 body 作用域把聊天页自己的青碧变量整体换成 iOS 语义色 */
.ios-chat-talk{
  --primary:var(--ios-blue);
  --primary-soft:var(--ios-blue-soft);
  --primary-text:#ffffff;
  --radius:14px;
  --page-bg:var(--ios-canvas);
  --page-bg2:var(--ios-canvas);
  --surface:var(--ios-card);
  --line:var(--ios-separator);
  --text:var(--ios-label);
  --muted:var(--ios-label-2);
  --head-bg:var(--ios-card);
  --notice-bg:var(--ios-card);
  --csk-tk:var(--ios-blue);
  --csk-tk-deep:var(--ios-blue-deep);
  --csk-tk-soft:var(--ios-blue-soft);
  --csk-ink:var(--ios-label);
  --csk-muted:var(--ios-label-2);
  --csk-muted-soft:var(--ios-label-3);
  --csk-line:var(--ios-separator);
  --csk-line-solid:var(--ios-separator);
  --csk-text:var(--ios-label);
  --csk-shadow:var(--ios-card-shadow);
  --csk-shadow-soft:var(--ios-card-shadow);
  --csk-wash:var(--ios-canvas);
  background:var(--ios-canvas) !important; color:var(--ios-label) !important;
  font-family:var(--ios-font) !important;
}
.ios-chat-talk .page{ background:var(--ios-canvas) !important; }
.ios-chat-talk .topcard{
  background:rgba(242,242,247,.82) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border-bottom:.5px solid var(--ios-separator) !important;
  padding:calc(8px + env(safe-area-inset-top)) 12px 9px !important;
}
@media (prefers-color-scheme: dark){
  .ios-chat-talk .topcard{ background:rgba(0,0,0,.72) !important; }
}
.ios-chat-talk .backbtn{
  color:var(--ios-blue) !important; font-size:15px !important; font-weight:500 !important;
}
.ios-chat-talk .headava{
  width:40px !important; height:40px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important; object-fit:cover;
}
.ios-chat-talk .title{ font-size:17px !important; font-weight:600 !important; letter-spacing:-.3px !important; color:var(--ios-label) !important; }
.ios-chat-talk .online{ font-size:13px !important; font-weight:400 !important; color:var(--ios-label-2) !important; }
.ios-chat-talk .addr{ font-size:12px !important; color:var(--ios-label-3) !important; margin-top:3px !important; }
.ios-chat-talk .morebtn{
  width:34px !important; height:34px !important; border-radius:50% !important;
  border:0 !important; background:transparent !important; color:var(--ios-blue) !important;
  font-size:18px !important;
}
.ios-chat-talk .role-switch-label{ color:var(--ios-label-2) !important; font-weight:500 !important; }
.ios-chat-talk .role-switch-btn{
  border:0 !important; background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
  border-radius:999px !important; font-weight:500 !important;
}
/* 2026-10-15：高亮类名对不上 —— 脚本加的是 .active（见 js/chat_talk.js 的 renderRoleSwitch），
   这里原来只写了 .on，于是三个按钮永远一个样：点了身份切换，屏幕上毫无变化
   （站长报的「上面的切换没有效果，点击没有任何效果」）。两个类名一起认。 */
.ios-chat-talk .role-switch-btn.on,
.ios-chat-talk .role-switch-btn.active{ background:var(--ios-blue) !important; color:#fff !important; }
/* 消息区 */
.ios-chat-talk .msgs,.ios-chat-talk .panel{ background:transparent !important; }
.ios-chat-talk .divider{
  display:inline-block !important; margin:14px auto !important;
  font-size:11px !important; font-weight:500 !important;
  color:var(--ios-label-2) !important; background:transparent !important;
}
.ios-chat-talk .mrow{ gap:9px !important; margin-bottom:9px !important; }
.ios-chat-talk .ava{
  width:36px !important; height:36px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important;
}
.ios-chat-talk .ava img{ border-radius:50% !important; }
.ios-chat-talk .bubblewrap{ max-width:76% !important; }
.ios-chat-talk .bubble{
  border:0 !important; border-radius:20px !important;
  padding:10px 14px !important; font-size:16px !important; line-height:1.4 !important;
  box-shadow:none !important;
}
.ios-chat-talk .mrow.client .bubble{
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  border-bottom-left-radius:6px !important; box-shadow:var(--ios-card-shadow) !important;
}
.ios-chat-talk .mrow.me .bubble{
  background:var(--ios-blue) !important; color:#fff !important;
  border-bottom-right-radius:6px !important;
}
.ios-chat-talk .topmeta{ font-size:11px !important; color:var(--ios-label-3) !important; }
.ios-chat-talk .msg-status{ font-size:11px !important; color:var(--ios-label-3) !important; }
.ios-chat-talk .rolebadge{ border-radius:7px !important; font-weight:600 !important; }
/* 工具行 → iOS 快捷回复胶囊 */
.ios-chat-talk .toolrow{ gap:8px !important; padding:8px 12px 2px !important; }
.ios-chat-talk .toolbtn{
  padding:8px 14px !important; border:.5px solid var(--ios-separator) !important;
  border-radius:999px !important; background:var(--ios-card) !important;
  color:var(--ios-blue) !important; box-shadow:var(--ios-card-shadow) !important;
  font-size:14px !important; font-weight:500 !important;
}
.ios-chat-talk .toolbtn .toolbtn-icon{ color:inherit !important; }
.ios-chat-talk .toolbtn:active{ transform:scale(.97) !important; }
/* 输入区 */
.ios-chat-talk .composer{
  background:rgba(242,242,247,.86) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border-top:.5px solid var(--ios-separator) !important;
  padding:8px 10px calc(8px + env(safe-area-inset-bottom)) !important; gap:8px !important;
}
@media (prefers-color-scheme: dark){
  .ios-chat-talk .composer{ background:rgba(28,28,30,.82) !important; }
}
.ios-chat-talk .ipt{
  background:var(--ios-card) !important; border:0 !important;
  border-radius:20px !important; color:var(--ios-label) !important;
  padding:10px 14px !important; font-size:16px !important;
  box-shadow:inset 0 0 0 .5px var(--ios-separator) !important;
}
.ios-chat-talk .ipt:focus{ box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important; }
/* 2026-10-16 修「输入的字只看到第一个」：
   被 @提及 包起来的输入框（.ipt-wrap > .ipt）是一层**透明**的 textarea ——
   真正显示文字的是它下面那层 .ipt-mirror（为了给 @人名 上色）。
   上面那条规则给它刷了不透明卡片底 + 内阴影，等于把镜像层的字整个盖住；
   当时只有第一个字可见，是因为它正好露在输入框左边界外面。
   这里把「包裹内的那一层」还原成透明，光标颜色保留。 */
.ios-chat-talk .ipt-wrap > .ipt{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
  outline:none !important;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  caret-color:var(--ios-label) !important;
}
.ios-chat-talk .ipt-wrap > .ipt::placeholder{
  color:var(--ios-label-3) !important;
  -webkit-text-fill-color:var(--ios-label-3) !important;
  opacity:1 !important;
}
/* 聚焦光圈改画在包裹层上（内层是透明的，画在它身上看不见） */
.ios-chat-talk .ipt-wrap:focus-within{
  box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important;
}
.ios-chat-talk .iconfile{ color:var(--ios-blue) !important; }
.ios-chat-talk .sendbtn{
  border:0 !important; border-radius:999px !important;
  background:var(--ios-blue) !important; color:#fff !important;
  font-weight:600 !important; box-shadow:none !important;
}
.ios-chat-talk .sendbtn:active{ transform:scale(.96) !important; }
/* 弹窗：底部抽屉 / iOS 弹窗卡 */
.ios-chat-talk .dialog-mask,.ios-chat-talk .ui-modal{
  background:rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.ios-chat-talk .dialog-card,.ios-chat-talk .ui-card{
  border-radius:var(--ios-r-sheet) !important; border:0 !important;
  background:var(--ios-card) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.32) !important;
}
.ios-chat-talk .dialog-hd,.ios-chat-talk .ui-hd{
  font-size:17px !important; font-weight:600 !important; color:var(--ios-label) !important;
  border-bottom:.5px solid var(--ios-separator) !important;
}
.ios-chat-talk .dialog-label,.ios-chat-talk .dialog-action span{ color:var(--ios-label) !important; }
.ios-chat-talk .dialog-textarea,.ios-chat-talk .trade-input,.ios-chat-talk .trade-textarea,
.ios-chat-talk .trade-select,.ios-chat-talk .amount-input{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-fill) !important; color:var(--ios-label) !important;
  font-size:16px !important; -webkit-appearance:none; appearance:none;
}
.ios-chat-talk .dialog-btn,.ios-chat-talk .ui-btn{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-fill) !important; color:var(--ios-blue) !important;
  font-weight:500 !important; min-height:46px !important;
}
.ios-chat-talk .dialog-btn.primary,.ios-chat-talk .ui-btn.primary{
  background:var(--ios-blue) !important; color:#fff !important; font-weight:600 !important;
}
.ios-chat-talk .dialog-action.danger,.ios-chat-talk .dialog-action.soft-danger{
  color:var(--ios-red) !important; background:transparent !important;
}
.ios-chat-talk .toast{
  border-radius:var(--ios-r-ctl) !important; background:rgba(28,28,30,.94) !important;
  font-size:14px !important; font-weight:500 !important;
}
/* 聊天里的卡片气泡跟随 iOS 圆角与阴影 */
.ios-chat-talk .img{ border-radius:var(--ios-r-ctl) !important; }
.ios-chat-talk .linkcard,.ios-chat-talk .paycard,.ios-chat-talk .tradecard,
.ios-chat-talk .goofish-order-card,.ios-chat-talk .paid-bubble{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  box-shadow:var(--ios-card-shadow) !important;
}

/* ── 17. 账号到期页（expired.php，ios-expired）────────────────────────── */
.ios-expired{
  background:var(--ios-canvas) !important; color:var(--ios-label) !important;
  font-family:var(--ios-font) !important;
}
.ios-expired .card{
  width:min(380px,100%) !important; background:var(--ios-card) !important;
  border:0 !important; border-radius:var(--ios-r-card) !important;
  box-shadow:0 12px 44px rgba(16,24,40,.10) !important; padding:34px 26px 28px !important;
}
.ios-expired .ico{
  width:72px !important; height:72px !important; border-radius:50% !important;
  background:var(--ios-red) !important; box-shadow:0 10px 24px rgba(255,59,48,.26) !important;
  font-size:30px !important;
}
.ios-expired h1{
  font-size:22px !important; font-weight:700 !important; letter-spacing:-.3px !important;
  color:var(--ios-label) !important;
}
.ios-expired p{ font-size:14px !important; color:var(--ios-label-2) !important; line-height:1.6 !important; }
.ios-expired .hint{
  background:var(--ios-fill) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important; color:var(--ios-label-2) !important; font-weight:500 !important;
}
.ios-expired .btn{
  background:var(--ios-blue) !important; color:#fff !important;
  border-radius:var(--ios-r-ctl) !important; box-shadow:none !important;
  min-height:50px !important; font-size:16px !important; font-weight:600 !important;
}
.ios-expired .btn:active{ transform:scale(.98) !important; }
.ios-expired .ghost{
  background:var(--ios-fill) !important; color:var(--ios-blue) !important; border:0 !important;
}
.ios-expired .ghost:active{ background:var(--ios-fill-2) !important; }

/* ── 18. 访客经典客服聊天页（cs.php，ios-cs）─────────────────────────── */
/* 用 body 作用域把本页青碧变量整体映射到 iOS 语义色（:root 原值只作用于本页） */
.ios-cs{
  --bg:var(--ios-canvas);
  --surface:var(--ios-card);
  --surface2:var(--ios-card);
  --border:var(--ios-separator);
  --border2:var(--ios-separator);
  --text:var(--ios-label);
  --muted:var(--ios-label-2);
  --b1:var(--ios-blue);
  --b2:var(--ios-blue-deep);
  --b3:var(--ios-blue-light);
  --shadow:var(--ios-card-shadow);
  --shadow2:var(--ios-card-shadow);
  --r:var(--ios-r-group);
  --r2:var(--ios-r-card);
  background-color:var(--ios-canvas) !important;
  color:var(--ios-label) !important;
  font-family:var(--ios-font) !important;
}
.ios-cs .page{ background:var(--ios-canvas) !important; gap:10px !important; }
/* 顶栏 → iOS 毛玻璃条 */
.ios-cs .header{
  margin-bottom:0 !important;
  border:0 !important;
  border-radius:var(--ios-r-sheet) !important;
  background:rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  box-shadow:var(--ios-card-shadow) !important;
  padding:10px 12px !important;
  min-height:0 !important;
}
@media (prefers-color-scheme: dark){
  .ios-cs .header{ background:rgba(28,28,30,.82) !important; }
}
.ios-cs .header::before{ display:none !important; content:none !important; }   /* 去青碧光斑 */
.ios-cs .header::after{ display:none !important; content:none !important; }    /* 去底部渐变线 */
.ios-cs .header .edge{ display:none !important; }                              /* 去动态描边扫光 */
.ios-cs .h-ava{
  width:46px !important; height:46px !important; border-radius:50% !important;
  border:.5px solid var(--ios-separator) !important; background:var(--ios-fill) !important;
}
.ios-cs .v-badge{
  background:var(--ios-blue) !important; border-color:var(--ios-card) !important;
  box-shadow:0 2px 8px rgba(0,122,255,.28) !important;
}
.ios-cs .h-title{ color:var(--ios-label) !important; font-weight:700 !important; letter-spacing:-.2px !important; }
.ios-cs .h-title .company{ font-weight:700 !important; }
/* 认证徽标 → iOS 蓝底描边 pill（去绿色/呼吸动画） */
.ios-cs .official-badge{
  border:0 !important; background:var(--ios-blue-soft) !important;
  box-shadow:none !important; animation:none !important;
}
.ios-cs .official-badge.anim::after{ display:none !important; content:none !important; }
.ios-cs .official-badge .wx{ background:var(--ios-blue) !important; box-shadow:none !important; }
.ios-cs .official-badge .ob-txt,
.ios-cs .ob-txt{ color:var(--ios-blue) !important; font-weight:600 !important; }
.ios-cs .official-badge.anim .sun{ background:var(--ios-blue) !important; animation:none !important; }
/* 副标题行 / 在线胶囊 */
.ios-cs .h-sub{ color:var(--ios-label-2) !important; font-weight:500 !important; gap:8px !important; }
.ios-cs .subline{ color:var(--ios-label-2) !important; font-weight:500 !important; }
.ios-cs .hmeta{ color:var(--ios-label-3) !important; font-weight:500 !important; }
.ios-cs .status-pill{
  border:0 !important; background:rgba(52,199,89,.14) !important;
  color:#1FA84A !important; font-weight:600 !important;
}
.ios-cs .status-pill i{ background:var(--ios-green) !important; box-shadow:none !important; animation:none !important; }
/* 顶栏信息胶囊 */
.ios-cs .chip{
  border:0 !important; background:var(--ios-fill) !important;
  color:var(--ios-label-2) !important; box-shadow:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.ios-cs .chip::after{ display:none !important; content:none !important; }
.ios-cs .chip::before{ background:var(--ios-gray) !important; box-shadow:none !important; }
.ios-cs .chip.c1{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
.ios-cs .chip.c1::before{ background:var(--ios-blue) !important; box-shadow:none !important; }
.ios-cs .chip.c2{ background:rgba(255,149,0,.16) !important; color:var(--ios-orange) !important; }
.ios-cs .chip.c2::before{ background:var(--ios-orange) !important; box-shadow:none !important; }
/* 中介身份条 → 内嵌分组卡 */
.ios-cs .proxy-participants{
  border:0 !important; background:var(--ios-card) !important;
  border-radius:var(--ios-r-group) !important; box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .proxy-role-avatar{ border:0 !important; background:var(--ios-fill) !important; }
.ios-cs .proxy-role-name{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-cs .proxy-role-tag{ background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
.ios-cs .proxy-role-tag.official{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
/* 聊天区：画布直铺气泡 */
.ios-cs .chatbox{
  margin-top:0 !important; border:0 !important;
  border-radius:var(--ios-r-card) !important;
  background:transparent !important; box-shadow:none !important;
}
.ios-cs .list{
  background:transparent !important;
  padding:14px 12px !important;
}
.ios-cs .list::-webkit-scrollbar-thumb{ background:var(--ios-label-3) !important; }
.ios-cs .mrow{ gap:9px !important; margin:10px 0 !important; }
.ios-cs .ava{
  width:36px !important; height:36px !important; border-radius:50% !important;
  border:0 !important; background:var(--ios-fill) !important;
}
.ios-cs .name{ color:var(--ios-label-2) !important; font-weight:500 !important; }
.ios-cs .name-role-tag{ border-radius:999px !important; background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
.ios-cs .name-role-tag.official{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
/* 气泡：client 白底卡阴影 / me 蓝底白字，圆角 20 */
.ios-cs .bubble{
  border:0 !important; border-radius:20px !important;
  padding:10px 14px !important; font-size:16px !important; line-height:1.4 !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .mrow:not(.me) .bubble{ border-bottom-left-radius:6px !important; }
.ios-cs .mrow:not(.me) .bubble::before{ display:none !important; content:none !important; }
.ios-cs .mrow.me .bubble{
  background:var(--ios-blue) !important; color:#fff !important;
  box-shadow:none !important; border-bottom-right-radius:6px !important;
}
/* 卡片类气泡去掉外层气泡内边距/背景，保持原件贴边渲染 */
.ios-cs .bubble.payment-bubble,
.ios-cs .bubble.link-bubble,
.ios-cs .bubble.hp-bubble{
  padding:0 !important; background:transparent !important;
  box-shadow:none !important; border:0 !important;
}
.ios-cs .meta, .ios-cs .mrow.me .meta{ color:var(--ios-label-3) !important; }
.ios-cs .img{ border:0 !important; border-radius:var(--ios-r-ctl) !important; }
/* 链接卡 */
.ios-cs .linkcard{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-card) !important; box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .lc-ava{ border:0 !important; border-radius:var(--ios-r-ctl) !important; background:var(--ios-fill) !important; }
.ios-cs .lc-name{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-cs .lc-go{ color:var(--ios-label-3) !important; font-weight:600 !important; }
.ios-cs .lc-cta{ color:var(--ios-blue) !important; font-weight:600 !important; }
.ios-cs .lc-spark{ background:var(--ios-blue) !important; box-shadow:none !important; }
.ios-cs .lc-pill{ background:var(--ios-fill) !important; }
/* 收款卡 */
.ios-cs .paycard{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .paycard-title{ color:var(--ios-label) !important; }
.ios-cs .paycard-line,.ios-cs .paycard-label,.ios-cs .paycard-value{ color:var(--ios-label-2) !important; }
.ios-cs .paycard-line.amount-line{ border-top:.5px solid var(--ios-separator) !important; }
.ios-cs .paycard-value.amount{ color:var(--ios-orange) !important; }
/* 交易卡 */
.ios-cs .tradecard{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .tradecard-title,.ios-cs .tradecard-name,.ios-cs .tradecard-value{ color:var(--ios-label) !important; }
.ios-cs .tradecard-price{ color:var(--ios-red) !important; }
.ios-cs .tradecard-tip,.ios-cs .tradecard-label{ color:var(--ios-label-2) !important; }
.ios-cs .tradecard-info{ border-top:.5px solid var(--ios-separator) !important; }
.ios-cs .tradecard-img{ background:var(--ios-fill) !important; }
.ios-cs .tradecard-tag.game{ background:rgba(255,149,0,.16) !important; color:var(--ios-orange) !important; }
.ios-cs .tradecard-tag.type{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }
.ios-cs .tradecard-status{ color:var(--ios-orange) !important; }
.ios-cs .tradecard-auth{ background:var(--ios-blue) !important; border-radius:var(--ios-r-ico) !important; }
.ios-cs .tradecard-auth.tradecard-auth-bound,
.ios-cs .chat-tradecard-auth.tradecard-auth-bound{
  background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
}
/* 已付款黄条 */
.ios-cs .paid-bubble{ border-radius:var(--ios-r-ctl) !important; }
/* 信息收集卡 */
.ios-cs .info-collect-card{
  border:0 !important; border-radius:var(--ios-r-ctl) !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  box-shadow:var(--ios-card-shadow) !important;
}
.ios-cs .info-collect-line{ border-left:.5px solid var(--ios-separator) !important; }
.ios-cs .info-collect-tip{ color:var(--ios-label-2) !important; }
.ios-cs .info-collect-btn{ background:var(--ios-blue) !important; border-radius:var(--ios-r-ico) !important; }
.ios-cs .info-collect-btn.pending,
.ios-cs .info-collect-btn.done{ background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
.ios-cs .info-collect-tip.done{ color:var(--ios-blue) !important; }
/* 输入区 → 毛玻璃条 + 灰底 pill 输入框 */
.ios-cs .composer{
  background:rgba(242,242,247,.86) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border-top:.5px solid var(--ios-separator) !important;
  padding:8px 10px calc(8px + env(safe-area-inset-bottom)) !important; gap:8px !important;
}
@media (prefers-color-scheme: dark){
  .ios-cs .composer{ background:rgba(28,28,30,.82) !important; }
}
.ios-cs .ipt{
  height:44px !important; border:0 !important; border-radius:20px !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  padding:0 14px !important; font-size:16px !important;
  box-shadow:inset 0 0 0 .5px var(--ios-separator) !important;
}
.ios-cs .ipt:focus{ border:0 !important; box-shadow:0 0 0 3.5px var(--ios-blue-ring) !important; }
.ios-cs .iconbtn{
  width:44px !important; height:44px !important; border:0 !important;
  border-radius:50% !important; background:transparent !important;
  box-shadow:none !important; color:var(--ios-blue) !important;
}
.ios-cs .iconbtn svg{ stroke:var(--ios-blue) !important; }
.ios-cs .iconbtn i{ color:var(--ios-blue) !important; }
.ios-cs .iconbtn:hover{ box-shadow:none !important; }
.ios-cs .iconbtn:active{ transform:scale(.94) !important; }
.ios-cs .sendbtn{
  height:44px !important; border-radius:999px !important; padding:0 20px !important;
  background:var(--ios-blue) !important; color:#fff !important;
  font-weight:600 !important; letter-spacing:0 !important; box-shadow:none !important;
}
.ios-cs .sendbtn:active{ transform:scale(.96) !important; }
/* 提示 Toast */
.ios-cs .toast{
  top:auto !important; bottom:calc(96px + env(safe-area-inset-bottom)) !important;
  left:50% !important; transform:translateX(-50%) !important;
  background:rgba(28,28,30,.94) !important; border:0 !important;
  border-radius:var(--ios-r-ctl) !important; color:#fff !important;
  font-size:14px !important; font-weight:500 !important; box-shadow:none !important;
}
/* 提交完成弹窗（本页兜底） */
.ios-cs .info-done-mask,.ios-cs .xy-info-done-mask{
  background:rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.ios-cs .info-done-card,.ios-cs .xy-info-done-card{
  border:0 !important; border-radius:var(--ios-r-sheet) !important;
  background:var(--ios-card) !important; color:var(--ios-label) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.32) !important;
}
.ios-cs .info-done-icon,.ios-cs .xy-info-done-icon{ background:rgba(52,199,89,.14) !important; }
.ios-cs .info-done-icon i,.ios-cs .xy-info-done-icon i{ color:var(--ios-green) !important; }
.ios-cs .info-done-title,.ios-cs .xy-info-done-title{ color:var(--ios-label) !important; }
/* 小屏微调 */
@media (max-width:420px){
  .ios-cs .header{ padding:9px 11px !important; }
  .ios-cs .h-ava,.ios-cs .h-ava-wrap{ width:44px !important; height:44px !important; }
}

/* =========================================================
   §19 访客 fly 版聊天页（pz / sjk / xya / jym / zz1）
   覆盖 css/fly_chat_adapter.css，作用域 .ios-fly
   ========================================================= */
/* 变量重映射：把各页品牌色统一到 iOS 语义色 */
.ios-fly{
  --primary: var(--ios-blue);
  --primary-soft: var(--ios-blue-soft);
  --bg1: var(--ios-canvas);
  --bg2: var(--ios-canvas);
  --text: var(--ios-label);
  --muted: var(--ios-label-2);
  --line: var(--ios-separator);
  --surface: var(--ios-card);
  --head-bg: rgba(255,255,255,.78);
  --notice-bg: var(--ios-blue-soft);
  --my-bubble: var(--ios-blue);
  --my-bubble-text: #ffffff;
  --radius: 18px;
  background: var(--ios-canvas) !important;
}
.ios-fly .page{ max-width:560px; }

/* 顶部栏：毛玻璃 */
.ios-fly .topbar{
  background:rgba(255,255,255,.78) !important;
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:0.5px solid var(--ios-separator) !important;
  padding:calc(env(safe-area-inset-top) + 10px) 16px 11px !important;
  gap:12px !important;
  box-shadow:none !important;
}
.ios-fly .back{
  border:0 !important; border-radius:50% !important;
  background:var(--ios-fill) !important; color:var(--ios-label) !important;
  width:36px !important; height:36px !important;
}
.ios-fly .h-avatar{
  width:44px !important; height:44px !important; border-radius:50% !important;
  border:0 !important; box-shadow:0 0 0 .5px var(--ios-separator) !important;
}
.ios-fly .h-brand{ font-size:16px !important; font-weight:600 !important; letter-spacing:-.2px; color:var(--ios-label) !important; }
.ios-fly .h-badge{
  background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important;
  border-radius:999px !important; font-weight:600 !important; font-size:11px !important;
}
.ios-fly .h-sub{ margin-top:3px !important; color:var(--ios-label-2) !important; }
.ios-fly .h-dot{ background:var(--ios-green) !important; box-shadow:0 0 0 3px rgba(52,199,89,.18); }

/* 公告卡片 */
.ios-fly .notice{
  background:var(--ios-card) !important;
  border:0.5px solid var(--ios-separator) !important;
  border-radius:var(--ios-r-group) !important;
  box-shadow:var(--ios-card-shadow) !important;
  padding:12px 14px !important;
}
.ios-fly .notice-title{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-fly .notice-sub{ color:var(--ios-label-2) !important; }

/* 多客服参与者条 */
.ios-fly .proxy-participants{
  background:var(--ios-card) !important;
  border:0.5px solid var(--ios-separator) !important;
  border-radius:var(--ios-r-group) !important;
}
.ios-fly .proxy-role-avatar{ border:0 !important; box-shadow:0 0 0 .5px var(--ios-separator) !important; }
.ios-fly .proxy-role-name{ color:var(--ios-label) !important; font-weight:600 !important; }
.ios-fly .proxy-role-tag{
  background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
  border-radius:999px !important; font-weight:600 !important;
}
.ios-fly .proxy-role-tag.official{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }

/* 消息列表 */
.ios-fly .mrow{ gap:10px !important; margin:0 0 16px !important; }
.ios-fly .ava{
  width:36px !important; height:36px !important; border-radius:50% !important;
  border:0 !important; box-shadow:0 0 0 .5px var(--ios-separator) !important;
}
.ios-fly .name{ color:var(--ios-label-2) !important; font-size:12px !important; }
.ios-fly .name-role-tag{
  background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
  border-radius:999px !important; font-weight:600 !important;
}
.ios-fly .name-role-tag.official{ background:var(--ios-blue-soft) !important; color:var(--ios-blue) !important; }

/* 文本气泡 */
.ios-fly .bubble{
  background:var(--ios-card) !important;
  color:var(--ios-label) !important;
  border:0.5px solid var(--ios-separator) !important;
  border-radius:18px !important;
  box-shadow:var(--ios-card-shadow) !important;
}
.ios-fly .mrow.me .bubble{
  background:var(--ios-blue) !important;
  color:#ffffff !important;
  border-color:transparent !important;
}
.ios-fly .meta{ color:var(--ios-label-3) !important; }

/* 欢迎/空态卡片 */
.ios-fly .empty-card{
  background:var(--ios-card) !important;
  color:var(--ios-label) !important;
  border:0.5px solid var(--ios-separator) !important;
  border-radius:var(--ios-r-group) !important;
  box-shadow:var(--ios-card-shadow) !important;
}

/* 快捷短语 */
.ios-fly .quick{ padding:0 16px 10px !important; gap:8px !important; }
.ios-fly .quick button{
  background:var(--ios-card) !important;
  color:var(--ios-blue) !important;
  border:0.5px solid var(--ios-separator) !important;
  border-radius:999px !important;
  font-weight:500 !important;
  padding:8px 14px !important;
  transition:transform .18s var(--ios-spring);
}
.ios-fly .quick button:active{ transform:scale(.95); }

/* 底部输入区：毛玻璃 */
.ios-fly .composer{
  background:rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-top:0.5px solid var(--ios-separator) !important;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
}
.ios-fly .inputrow{ gap:8px !important; }
.ios-fly .ipt{
  background:var(--ios-fill) !important;
  border:0 !important;
  border-radius:20px !important;
  color:var(--ios-label) !important;
  padding:11px 16px !important;
  font-size:16px !important;
  min-height:44px !important;
}
.ios-fly .ipt::placeholder{ color:var(--ios-label-3) !important; }
.ios-fly .iconbtn{
  border:0 !important; border-radius:50% !important;
  background:var(--ios-fill) !important; color:var(--ios-label-2) !important;
  transition:transform .18s var(--ios-spring);
}
.ios-fly .iconbtn:active{ transform:scale(.94); }
.ios-fly .sendbtn{
  background:var(--ios-blue) !important; color:#ffffff !important;
  border-radius:22px !important;
  box-shadow:0 4px 14px rgba(0,122,255,.28) !important;
  transition:transform .18s var(--ios-spring);
}
.ios-fly .sendbtn:active{ transform:scale(.95); }
.ios-fly .footerhint{ color:var(--ios-label-3) !important; }

/* Toast */
.ios-fly .toast{
  background:rgba(28,28,30,.92) !important; color:#ffffff !important;
  border-radius:14px !important;
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:0 10px 40px rgba(0,0,0,.28) !important;
  padding:11px 16px !important;
}

/* 结构化卡片气泡：恢复透明外框（避免被 .ios-fly .bubble 覆盖） */
.ios-fly .bubble.payment-bubble,
.ios-fly .bubble.link-bubble,
.ios-fly .bubble.image-bubble{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  box-shadow:none !important;
}
.ios-fly .bubble.link-bubble{ white-space:normal !important; }
.ios-fly .img{ border-radius:16px !important; }

/* 深色模式 */
@media (prefers-color-scheme: dark){
  .ios-fly{ --head-bg:rgba(28,28,30,.72); }
  .ios-fly{ background:var(--ios-canvas) !important; }
  .ios-fly .topbar{ background:rgba(28,28,30,.72) !important; border-bottom-color:var(--ios-separator) !important; }
  .ios-fly .composer{ background:rgba(28,28,30,.82) !important; border-top-color:var(--ios-separator) !important; }
  .ios-fly .bubble{ background:var(--ios-card) !important; color:var(--ios-label) !important; border-color:transparent !important; }
  .ios-fly .mrow.me .bubble{ background:var(--ios-blue) !important; color:#ffffff !important; }
  .ios-fly .ipt{ background:var(--ios-fill) !important; color:var(--ios-label) !important; }
  .ios-fly .iconbtn{ background:var(--ios-fill) !important; color:var(--ios-label-2) !important; }
  .ios-fly .quick button{ background:var(--ios-card-2) !important; color:var(--ios-blue) !important; }
  .ios-fly .toast{ background:rgba(58,58,60,.94) !important; }
}