/* ============================================================
 * 智采行车 · 测绘作业平台 — 全局样式
 * 设计方向：深空科技 2.0 · 深蓝基底 + 青色光效 · 玻璃拟态 HUD
 * 统一圆角 14px · 统一辉光阴影 · 5 Tab 页面风格一致
 * ============================================================ */

/* ===== 基础重置 ===== */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;background:#050914;color:#e6f0ff;overflow-x:hidden;}
#app{max-width:420px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse 95% 42% at 50% -6%, rgba(6,182,212,.13), transparent 62%),
    radial-gradient(ellipse 85% 38% at 50% 106%, rgba(59,130,246,.12), transparent 60%),
    linear-gradient(180deg,#0a1128 0%,#0b1426 46%,#0a1128 100%);
  position:relative;box-shadow:0 0 80px rgba(0,0,0,.65);overflow-x:hidden;}
#mainApp{flex:1;min-height:0;display:flex;flex-direction:column;position:relative;z-index:1;}

/* ===== 科技背景层：网格 + 辉光 + 扫描线（纯 CSS / GPU 合成层） ===== */
#app::before{
  content:'';position:fixed;top:0;bottom:0;z-index:0;pointer-events:none;
  left:max(0px,calc(50% - 210px));right:max(0px,calc(50% - 210px));
  background-image:
    linear-gradient(rgba(56,189,248,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(56,189,248,.045) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:radial-gradient(ellipse 120% 70% at 50% 0%,#000 0%,rgba(0,0,0,.55) 55%,transparent 92%);
  mask-image:radial-gradient(ellipse 120% 70% at 50% 0%,#000 0%,rgba(0,0,0,.55) 55%,transparent 92%);
}
#app::after{
  content:'';position:fixed;top:0;bottom:0;z-index:0;pointer-events:none;
  left:max(0px,calc(50% - 210px));right:max(0px,calc(50% - 210px));
  background:
    radial-gradient(circle 260px at 12% 18%,rgba(6,182,212,.07),transparent 70%),
    radial-gradient(circle 300px at 88% 72%,rgba(139,92,246,.06),transparent 70%);
  animation:bgHaloDrift 16s ease-in-out infinite alternate;
}
@keyframes bgHaloDrift{0%{transform:translate3d(0,0,0);}100%{transform:translate3d(-10px,-14px,0);}}
@media (prefers-reduced-motion:reduce){
  #app::after{animation:none;}
}

/* ===== 设计令牌（深空科技 2.0 · Deep Space Tech） ===== */
:root{
  --brand:#06b6d4;       /* 青色 · 主强调 */
  --brand-l:#22d3ee;     /* 亮青 · hover/渐变亮端 */
  --brand-d:#0e7490;     /* 深青 · 渐变暗端 */
  --brand-glow:rgba(34,211,238,.35);
  --brand-soft:rgba(34,211,238,.10);  /* 淡青底 · 图标/胶囊 */
  --accent:#3b82f6;      /* 亮蓝 · 次强调 */
  --accent-2:#8b5cf6;    /* 霓虹紫 · 少量点缀 */
  --accent-warm:#fbbf24; /* 琥珀金 · 收益等暖色强调 */
  --success:#34d399;
  --warn:#fbbf24;
  --danger:#f87171;

  --text:#e6f0ff;
  --text2:#9fb3d1;
  --text3:#6b7fa3;
  --text4:#46587a;

  --border:rgba(148,197,255,.13);
  --border-soft:rgba(148,197,255,.07);
  --bg:#0a1128;
  --card:rgba(22,35,63,.72);
  --card-hover:rgba(31,49,86,.85);

  --r-card:14px;
  --r-sm:10px;
  --r-pill:20px;

  --sh-card:0 2px 10px rgba(2,6,20,.55);
  --sh-card-hover:0 6px 22px rgba(2,8,26,.6),0 0 0 1px rgba(56,189,248,.18);
  --sh-glass:0 16px 44px rgba(2,8,26,.62),inset 0 1px 0 rgba(148,210,255,.10);
  --sh-top:0 2px 12px rgba(2,8,26,.5);
}

/* ===== Toast ===== */
.toast{position:fixed;top:42%;left:50%;transform:translate(-50%,-50%);background:rgba(20,25,35,0.94);color:#fff;padding:13px 26px;border-radius:var(--r-sm);font-size:14px;z-index:100000;display:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);letter-spacing:0.5px;max-width:80vw;text-align:center;line-height:1.5;box-shadow:0 6px 24px rgba(0,0,0,0.28);border:1px solid rgba(255,255,255,0.08);}
.toast.show{display:block;animation:ti .28s cubic-bezier(.2,.7,.2,1);}
.toast-success{background:rgba(21,101,192,0.94);border-color:rgba(128,203,196,0.45);box-shadow:0 6px 24px rgba(21,101,192,0.4);}
.toast-success::before{content:'✓';display:inline-block;margin-right:6px;font-weight:800;font-size:15px;}
.toast-warn{background:rgba(230,81,0,0.94);border-color:rgba(255,183,77,0.45);}
.toast-error{background:rgba(183,28,28,0.94);border-color:rgba(255,138,128,0.45);}
@keyframes ti{from{opacity:0;transform:translate(-50%,-50%) scale(0.86);}to{opacity:1;transform:translate(-50%,-50%) scale(1);}}
@keyframes toast-out{from{opacity:1;transform:translate(-50%,-50%) scale(1);}to{opacity:0;transform:translate(-50%,-50%) scale(0.94);}}

/* ===== Modal ===== */
.modal-mask{position:fixed;inset:0;background:rgba(20,30,55,0.45);display:none;align-items:center;justify-content:center;z-index:1100;padding:20px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);touch-action:none;overscroll-behavior:none;}
.modal-mask .modal-body,.modal-mask .modal{touch-action:pan-y;overscroll-behavior:contain;}
.modal-mask.show{display:flex;}
.modal{background:#fff;border-radius:var(--r-card);padding:0;width:100%;max-width:340px;position:relative;animation:mu .28s cubic-bezier(.2,.7,.2,1);box-shadow:var(--sh-glass);display:flex;flex-direction:column;max-height:90vh;overflow:hidden;}
.modal .m-title{flex:0 0 auto;padding:18px 20px 12px;font-size:17px;font-weight:700;text-align:center;color:var(--text);letter-spacing:.5px;border-bottom:1px solid #eef2f5;}
.modal .m-body{flex:1 1 auto;min-height:0;font-size:13px;color:#4a5568;line-height:1.8;padding:16px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.modal .m-actions{flex:0 0 auto;padding:12px 20px 16px;display:flex;gap:10px;border-top:1px solid #eef2f5;background:#fafbfd;}
@keyframes mu{from{opacity:0;transform:translateY(18px) scale(0.96);}to{opacity:1;transform:translateY(0) scale(1);}}
.modal .m-close{position:absolute;top:10px;right:14px;font-size:22px;color:#b0b8c1;cursor:pointer;width:28px;height:28px;text-align:center;line-height:26px;border-radius:50%;transition:all .15s;}
.modal .m-close:hover{background:#f4f6fa;color:#4a5568;}
.modal .m-actions .btn{flex:1;justify-content:center;}
.modal-title{font-size:16px;font-weight:700;margin-bottom:4px;text-align:center;color:var(--text);}
.modal-sub{font-size:12px;color:var(--text3);margin-bottom:14px;text-align:center;}
.modal-actions{display:flex;gap:10px;margin-top:14px;}
.modal-actions .btn{flex:1;justify-content:center;}
.sat-key-input{width:100%;min-height:70px;border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 12px;font-size:13px;font-family:monospace;resize:vertical;outline:none;background:#fafbfd;transition:all .15s;}
.sat-key-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(21,101,192,0.1);background:#fff;}

/* ===== 按钮 ===== */
.btn-brand{
  border:none;border-radius:10px;
  padding:12px 22px;font-size:15px;font-weight:700;
  cursor:pointer;letter-spacing:2px;font-family:inherit;position:relative;overflow:hidden;
  /* 更亮更鲜艳的绿色渐变：亮青绿 → 深青绿 → 墨绿 */
  background:linear-gradient(135deg,#4fc3f7 0%,#1e88e5 35%,#1565c0 70%,#0d47a1 100%);
  color:#fff;
  box-shadow:
    0 4px 14px rgba(0,169,157,0.45),
    0 2px 4px rgba(13,71,161,0.20),
    inset 0 1px 0 rgba(255,255,255,0.35),
    inset 0 -1px 0 rgba(0,0,0,0.15);
  user-select:none;
  transition:transform .08s cubic-bezier(.2,.7,.2,1),
              box-shadow .10s,
              filter .08s;
}
/* 顶部高光层 */
.btn-brand::before{
  content:'';position:absolute;top:0;left:0;right:0;height:50%;
  background:linear-gradient(180deg,rgba(255,255,255,0.28),transparent);
  pointer-events:none;
}
/* 点击光波扩散层 */
.btn-brand::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at center,rgba(255,255,255,0.7) 0%,transparent 70%);
  opacity:0;transform:scale(2);
  transition:opacity .25s,transform .25s;
}
.btn-brand:active{
  transform:translateY(2px) scale(0.96);
  filter:brightness(0.92) saturate(1.1);
  box-shadow:
    0 1px 3px rgba(0,169,157,0.35),
    inset 0 3px 10px rgba(0,0,0,0.30),
    inset 0 0 0 1px rgba(255,255,255,0.15);
}
.btn-brand:active::after{
  opacity:1;transform:scale(0.5);
  transition:opacity 0s,transform 0s;
}
.btn-brand:disabled{opacity:0.45;cursor:not-allowed;box-shadow:none;transform:none;filter:none;}
.btn-brand.btn-loading{opacity:0.7;cursor:wait;pointer-events:none;animation:btn-pulse 1s linear infinite;}
@keyframes btn-pulse{0%,100%{filter:brightness(1);}50%{filter:brightness(1.08);}}
/* 取景设备扫描动画 */
/* ===== 取景设备专业连接面板 v2 ===== */
.devpanel{
  background:#ffffff;
  border:1px solid #e4e8ef;
  border-radius:20px;
  padding:22px 18px 18px;
  margin-bottom:6px;
  position:relative;
  overflow:hidden;
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 4px 16px rgba(15,23,42,.06);
}
.modal-title .title-icon{vertical-align:-4px;color:#1976d2;margin-right:4px;}
.devpanel::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:linear-gradient(90deg,#1976d2 0%,#4fc3f7 50%,#1976d2 100%);
}

/* —— 步骤进度条 —— */
.dev-steps{
  display:flex;
  justify-content:space-between;
  margin:4px 8px 24px;
  position:relative;
}
.dev-step{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  position:relative;
  z-index:2;
  flex:1;
}
.dev-step-dot{
  width:28px;height:28px;
  border-radius:50%;
  background:#f0f3f7;
  border:2px solid #d8dde6;
  color:#9aa3ae;
  font-size:12px;
  font-weight:700;
  font-family:-apple-system,BlinkMacSystemFont,sans-serif;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .35s cubic-bezier(.4,0,.2,1);
}
.dev-step-dot svg{display:none;}
.dev-step-dot span{display:block;line-height:1;}
.dev-step-label{
  font-size:12px;
  color:#9aa3ae;
  font-weight:500;
  letter-spacing:.3px;
  transition:all .3s;
  white-space:nowrap;
}
/* 激活态（当前步骤）*/
.dev-step.active .dev-step-dot{
  background:#1976d2;
  border-color:#1976d2;
  color:#fff;
  box-shadow:0 3px 10px rgba(0,137,123,.4);
  transform:scale(1.08);
}
.dev-step.active .dev-step-dot span{display:block;}
.dev-step.active .dev-step-dot svg{display:none;}
.dev-step.active .dev-step-label{
  color:#1976d2;
  font-weight:600;
}
/* 完成态 */
.dev-step.done .dev-step-dot{
  background:#1565c0;
  border-color:#1565c0;
  color:#fff;
}
.dev-step.done .dev-step-dot span{display:none;}
.dev-step.done .dev-step-dot svg{display:block;}
.dev-step.done .dev-step-label{
  color:#1565c0;
  font-weight:600;
}
/* 连接线 */
.dev-step-bar{
  position:absolute;
  top:13px;
  left:14px;
  right:14px;
  height:2px;
  background:#e4e8ef;
  z-index:1;
  border-radius:2px;
}
.dev-step-bar::before{
  content:'';
  position:absolute;
  top:0;left:0;height:100%;
  background:linear-gradient(90deg,#1565c0,#1976d2);
  border-radius:2px;
  transition:width .5s cubic-bezier(.4,0,.2,1);
}
.devpanel[data-step="1"] .dev-step-bar::before{width:0%;}
.devpanel[data-step="2"] .dev-step-bar::before{width:33.3%;}
.devpanel[data-step="3"] .dev-step-bar::before{width:66.6%;}
.devpanel[data-step="4"] .dev-step-bar::before{width:100%;}

/* —— 主图标区 —— */
.dev-main{
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  height:136px;
  margin-bottom:14px;
}
.dev-icon-wrap{
  position:relative;
  width:72px;height:72px;
  border-radius:50%;
  background:linear-gradient(135deg,#1976d2 0%,#1565c0 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 16px rgba(0,137,123,.28),inset 0 -2px 4px rgba(0,0,0,.08);
  z-index:2;
  transition:all .35s cubic-bezier(.4,0,.2,1);
  color:#fff;
}
.dev-icon-svg{
  width:40px;height:40px;
  color:#fff;
  transition:opacity .25s, transform .3s;
}
.dev-icon-svg.ok{width:36px;height:36px;}
.dev-icon-svg.fail{width:36px;height:36px;}
.dev-main.connecting .dev-icon-wrap{
  animation:devPulse 2s ease-in-out infinite;
}
.dev-main.connecting .dev-icon-svg{
  animation:devBreathe 2s ease-in-out infinite;
}
@keyframes devPulse{
  0%,100%{box-shadow:0 4px 16px rgba(0,137,123,.28),inset 0 -2px 4px rgba(0,0,0,.08);}
  50%{box-shadow:0 4px 28px rgba(0,137,123,.5),inset 0 -2px 4px rgba(0,0,0,.08);}
}
@keyframes devBreathe{
  0%,100%{transform:scale(1);opacity:.95;}
  50%{transform:scale(1.12);opacity:1;}
}

/* —— 扫描进度环 —— */
.dev-progress-ring{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:128px;height:128px;
  z-index:1;
}
.dev-progress-ring svg{
  width:100%;height:100%;
  transform:rotate(-90deg);
}
.dev-progress-ring .ring-bg{
  fill:none;stroke:#eef1f5;stroke-width:3;
}
.dev-progress-ring .ring-fg{
  fill:none;stroke:#1976d2;stroke-width:3;stroke-linecap:round;
  stroke-dasharray:201;stroke-dashoffset:201;
  animation:devRing 2.2s ease-out infinite;
}
@keyframes devRing{
  0%{stroke-dashoffset:201;}
  50%{stroke-dashoffset:60;}
  100%{stroke-dashoffset:201;}
}

/* —— 状态文字 —— */
.devscan-text{
  margin-bottom:14px;
  font-size:15px;
  color:#263238;
  font-weight:500;
  text-align:center;
  line-height:1.5;
  min-height:24px;
}

/* —— 设备列表 —— */
.devscan-list{
  max-height:160px;
  overflow-y:auto;
  margin-bottom:10px;
}
.devscan-list::-webkit-scrollbar{width:4px;}
.devscan-list::-webkit-scrollbar-thumb{background:#d8dde6;border-radius:2px;}
.devscan-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  background:#fafbfd;
  border:1px solid #e4e8ef;
  border-radius:12px;
  margin-bottom:8px;
  cursor:pointer;
  transition:all .2s ease;
}
.devscan-item:active{transform:scale(.97);}
.devscan-item:hover{
  background:#f0fbf9;
  border-color:#1976d2;
  box-shadow:0 2px 12px rgba(0,137,123,.12);
}
.devscan-item .di-icon{
  font-size:18px;
  width:40px;height:40px;
  border-radius:10px;
  background:linear-gradient(135deg,#e3f2fd,#bbdefb);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.devscan-item .di-info{flex:1;min-width:0;}
.devscan-item .di-name{
  font-size:14px;
  font-weight:600;
  color:#1a2835;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.devscan-item .di-rssi{
  font-size:11px;
  color:#7b8794;
  margin-top:3px;
  font-family:-apple-system,BlinkMacSystemFont,sans-serif;
  letter-spacing:.2px;
}
.devscan-item .di-rssi.ok{color:#1565c0;font-weight:500;}
.devscan-item .di-rssi.weak{color:#e65100;font-weight:500;}
.devscan-item .di-select{
  font-size:12px;
  color:#fff;
  background:#1976d2;
  padding:6px 14px;
  border-radius:16px;
  font-weight:600;
  flex-shrink:0;
  transition:all .2s;
}
.devscan-item:hover .di-select{background:#1565c0;}

/* —— 底部信息条 —— */
.dev-info-bar{
  background:#e8f5e9;
  border:1px solid #a5d6a7;
  border-radius:10px;
  padding:10px 14px;
  font-size:13px;
  color:#1565c0;
  text-align:center;
  font-weight:500;
}
.btn-block{width:100%;display:flex;align-items:center;justify-content:center;letter-spacing:1px;}
.btn-outline{
  background:#fff;color:#1565c0;border:1.5px solid #64b5f6;
  border-radius:12px;padding:11px 16px;font-size:14px;font-weight:600;
  cursor:pointer;font-family:inherit;letter-spacing:1px;position:relative;overflow:hidden;
  box-shadow:0 1px 4px rgba(0,169,157,0.08);
  transition:transform .10s cubic-bezier(.2,.7,.2,1),filter .10s,box-shadow .10s,background .10s;
}
.btn-outline:active{
  transform:translateY(1px) scale(0.96);filter:none;
  background:#e0f7fa;box-shadow:inset 0 2px 4px rgba(21,101,192,0.08);
}
.btn-ghost{background:#f4f6fa;color:var(--text2);border:1px solid var(--border);border-radius:var(--r-sm);padding:11px 16px;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .15s;}
.btn-ghost:active{background:#e8ebf0;}
.btn-sm{padding:8px 16px;font-size:13px;border-radius:9px;letter-spacing:1px;}

/* ===== 登录注册 ===== */
.auth-wrap{position:absolute;inset:0;z-index:100;background:linear-gradient(160deg,#002a6c 0%,#0d47a1 50%,#1565c0 100%);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;}
.auth-wrap::-webkit-scrollbar{display:none;}

.splash{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;z-index:3;background:linear-gradient(160deg,#002a6c 0%,#0d47a1 45%,#1565c0 100%);}
.splash-decor{position:absolute;inset:0;pointer-events:none;}
.geo-dot{position:absolute;width:6px;height:6px;background:#80cbc4;border-radius:50%;box-shadow:0 0 12px #4dd0e1;animation:dotPulse 2s infinite;}
.geo-dot.d1{top:18%;left:22%;animation-delay:0s;}
.geo-dot.d2{top:68%;left:18%;animation-delay:0.5s;}
.geo-dot.d3{top:32%;right:20%;animation-delay:1s;}
.geo-dot.d4{top:78%;right:22%;animation-delay:1.5s;}
@keyframes dotPulse{0%,100%{transform:scale(1);opacity:0.5;}50%{transform:scale(1.8);opacity:1;}}
.geo-line{position:absolute;background:rgba(100,181,246,0.2);animation:lineFade 3s infinite;}
.geo-line.l1{width:100px;height:2px;top:28%;left:20%;transform:rotate(-18deg);animation-delay:0s;}
.geo-line.l2{width:80px;height:2px;top:62%;right:22%;transform:rotate(12deg);animation-delay:1s;}
.geo-line.l3{width:60px;height:2px;bottom:32%;left:42%;transform:rotate(-8deg);animation-delay:2s;}
@keyframes lineFade{0%,100%{opacity:0.12;}50%{opacity:0.6;}}
.splash-inner{text-align:center;z-index:2;}
.brand-logo{margin-bottom:20px;}
.app-logo{width:120px;height:120px;border-radius:24px;margin:0 auto;display:block;filter:drop-shadow(0 8px 32px rgba(0,212,255,0.5));}
.brand-name{font-size:28px;font-weight:700;letter-spacing:6px;margin-bottom:8px;text-shadow:0 2px 12px rgba(0,0,0,0.3);}
.brand-slogan{font-size:13px;opacity:0.75;letter-spacing:3px;}
.loader-bar{width:150px;height:3px;background:rgba(255,255,255,0.15);border-radius:2px;margin-top:36px;overflow:hidden;}
.loader-fill{height:100%;background:linear-gradient(90deg,#80cbc4,#fff);width:0%;animation:loadFill 1.6s forwards;border-radius:2px;}
@keyframes loadFill{to{width:100%;}}

/* Auth 页布局 */
.auth-page{position:relative;min-height:100%;width:100%;display:flex;flex-direction:column;}
.auth-bg{position:absolute;inset:0;overflow:hidden;}
.bg-circle{position:absolute;border-radius:50%;background:rgba(255,255,255,0.05);}
.bg-circle.c1{width:280px;height:280px;top:-80px;right:-80px;}
.bg-circle.c2{width:200px;height:200px;bottom:-50px;left:-50px;background:rgba(255,255,255,0.03);}
.bg-circle.c3{width:120px;height:120px;top:36%;left:-30px;background:rgba(255,255,255,0.04);}
.auth-body{position:relative;z-index:2;color:#fff;padding:40px 24px 24px;flex:1;display:flex;flex-direction:column;}
.auth-header{margin-bottom:26px;text-align:center;}
.mini-logo{width:64px;height:64px;border-radius:16px;margin:0 auto 14px;display:block;filter:drop-shadow(0 4px 16px rgba(0,212,255,0.4));}
.auth-header h1{font-size:24px;font-weight:700;margin-bottom:4px;letter-spacing:2px;}
.auth-header p{font-size:13px;opacity:0.7;}
.auth-lang-btn{position:absolute;top:16px;right:16px;display:flex;align-items:center;gap:4px;padding:6px 12px;background:rgba(255,255,255,0.2);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.3);border-radius:20px;font-size:13px;color:#fff;cursor:pointer;transition:all .2s;z-index:10;}
.auth-lang-btn:hover{background:rgba(255,255,255,0.35);transform:scale(1.05);}
.auth-lang-btn:active{transform:scale(0.97);}
.auth-lang-btn #authLangFlag{font-size:15px;}

.auth-form{flex:1;max-width:360px;margin:0 auto;width:100%;background:rgba(255,255,255,0.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:18px;padding:24px 20px 20px;border:1px solid rgba(255,255,255,0.12);}

.av2-field{margin-bottom:14px;}
.av2-label{display:block;font-size:13px;color:rgba(255,255,255,0.65);margin-bottom:6px;font-weight:500;letter-spacing:0.5px;}
.av2-input-row{position:relative;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:12px;overflow:hidden;transition:all .15s;height:52px;}
.av2-input-row:focus-within{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.4);box-shadow:0 0 0 3px rgba(255,255,255,0.08);}
.av2-input-row input,
.av2-input-row select{width:100%;height:52px;background:transparent;border:none;color:#fff;font-size:16px;font-weight:400;padding:0 14px;outline:none;font-family:inherit;appearance:none;-webkit-appearance:none;}
.av2-input-row select{cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'><path d='M1 1l5 5 5-5' stroke='%23ffffff70' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
.av2-input-row select option{background:#1a2332;color:#fff;padding:8px 12px;font-size:15px;font-weight:400;}
.av2-input-row input::placeholder{color:rgba(255,255,255,0.4);font-size:16px;}
.av2-input-row select:disabled{opacity:0.5;}

.av2-phone{display:flex;height:52px;border-radius:12px;overflow:hidden;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);transition:all .15s;}
.av2-phone:focus-within{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.4);box-shadow:0 0 0 3px rgba(255,255,255,0.08);}
.av2-phone .av2-prefix{flex-shrink:0;height:52px;background:transparent;color:#fff;border:none;border-right:1px solid rgba(255,255,255,0.1);padding:0 10px 0 12px;font-size:16px;font-weight:400;appearance:none;-webkit-appearance:none;cursor:pointer;font-family:inherit;white-space:nowrap;line-height:52px;min-width:110px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23ffffff60' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right 4px center;}
.av2-phone .av2-prefix option{background:#1a2332;color:#fff;font-size:15px;font-weight:400;padding:6px 10px;}
.av2-phone .av2-phone-input{flex:1;height:52px;background:transparent;border:none;color:#fff;font-size:16px;font-weight:400;padding:0 14px;outline:none;font-family:inherit;min-width:0;}
.av2-phone .av2-phone-input::placeholder{color:rgba(255,255,255,0.4);font-size:16px;}
.av2-phone-hint{font-size:12px;color:#ffd54f;margin-top:6px;padding-left:4px;line-height:1.4;}

.av2-loc-title{display:block;font-size:13px;color:rgba(255,255,255,0.8);font-weight:600;margin:18px 0 12px;letter-spacing:0.5px;}
.av2-loc-title::before{content:'';display:inline-block;width:3px;height:12px;background:#80cbc4;border-radius:2px;margin-right:6px;vertical-align:middle;}

.av2-btn{width:100%;height:50px;border:none;border-radius:14px;background:linear-gradient(135deg,#ffd54f,#ffb300);color:#1a2332;font-size:17px;font-weight:700;letter-spacing:5px;cursor:pointer;margin-top:10px;transition:all .15s;font-family:inherit;box-shadow:0 6px 18px rgba(255,179,0,0.35);}
.av2-btn:active{transform:scale(0.98);box-shadow:0 2px 8px rgba(255,179,0,0.3);}
.av2-btn:disabled{opacity:0.45;cursor:not-allowed;}

.av2-switch{text-align:center;font-size:13px;color:rgba(255,255,255,0.55);margin-top:16px;}
.av2-switch a{color:#ffd54f;text-decoration:none;font-weight:500;cursor:pointer;}
.av2-switch a:active{opacity:0.7;}
.av2-remember{display:flex;align-items:center;justify-content:center;margin-top:10px;font-size:12px;color:rgba(255,255,255,0.5);gap:6px;}
.av2-remember label{display:flex;align-items:center;gap:6px;cursor:pointer;}
.av2-remember input{width:14px;height:14px;accent-color:#ffd54f;}

/* ===== 状态栏 + 问候条（取景接单页专用优化） ===== */
.status-bar{
  height:46px;background:#fff;display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;color:var(--text2);font-size:13px;flex-shrink:0;border-bottom:1px solid var(--border-soft);
}
.status-bar .time{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;}
.status-bar .status-title{font-size:13px;font-weight:600;color:var(--brand);letter-spacing:1px;}
.status-bar .icons{opacity:0.9;}
.sat-indicator{display:inline-flex;align-items:center;justify-content:center;transition:all .3s;width:16px;height:16px;line-height:1;position:relative;vertical-align:middle;color:#607d8b;}
.sat-indicator svg{width:100%;height:100%;display:block;}
/* 白底 status-bar 默认三态 */
.sat-indicator.gray{opacity:0.5;color:#90a4ae;}
.sat-indicator.pending{opacity:0.9;color:#ff9800;}
.sat-indicator.green{opacity:1;color:#42a5f5;filter:drop-shadow(0 0 3px rgba(66,165,245,0.5));animation:satPulse 2s ease-in-out infinite;}
@keyframes satPulse{0%,100%{opacity:1;}50%{opacity:0.55;}}

.signal-icon{display:inline-flex;align-items:flex-end;gap:1.5px;height:12px;vertical-align:-1px;}
.signal-icon span{display:block;width:3px;border-radius:2px;background:#bbdefb;opacity:0.2;transition:opacity .3s,background .3s;}
.signal-icon span:nth-child(1){height:25%;}
.signal-icon span:nth-child(2){height:50%;}
.signal-icon span:nth-child(3){height:75%;}
.signal-icon span:nth-child(4){height:100%;}
.signal-icon.s-none span{opacity:0.18;background:#bbdefb;}
.signal-icon.s-pending span{opacity:0.55;background:#ffcc80;}
.signal-icon.s-pending span:nth-child(1){opacity:0.7;}
.signal-icon.s-confirmed span{opacity:1;background:#66ffdb;}

/* ===== 顶部问候条（紧凑白色风） ===== */
.top-greet{background:#fff;color:var(--text);padding:10px 16px 12px;display:flex;align-items:center;position:relative;border-bottom:1px solid var(--border-soft);}

/* ============ 取景接单页（#page-hall）专用：整体排版重构 ============ */
/* 设计原则：白色为主，绿色点缀。status-bar/top-greet 退化为轻量文字行，location-bar 是唯一的"卡" */

/* 1. status-bar：透明背景 + 32px 高度 + 灰色小字 → 退化为页面呼吸区 */
#app:has(#page-hall.active) .status-bar{
  background:transparent !important;height:32px !important;border-bottom:none !important;
  padding:0 12px !important;color:#90a4ae;
}
#app:has(#page-hall.active) .status-bar .time{color:#78909c;font-weight:500;font-size:12px;}
#app:has(#page-hall.active) .status-bar .status-title{color:#546e7a;font-size:12px;letter-spacing:0.5px;font-weight:600;}
#app:has(#page-hall.active) .status-bar .icons{opacity:0.55;}

/* 2. top-greet：透明 + 极小 padding + 无框 → 副标题 */
#app:has(#page-hall.active) .top-greet{
  background:transparent !important;border-bottom:none !important;
  padding:0 12px 2px !important;margin-bottom:0 !important;
}
#app:has(#page-hall.active) .top-greet .tg-sub{font-size:12px;color:#b0bec5;font-weight:400;letter-spacing:0.3px;}
/* profile 页：status-bar / top-greet 已合并进 db-hero，隐藏原条 */
/* chat 页：隐藏顶栏占位，让聊天区铺满屏幕 */
#app:has(.page-profile.active) .status-bar,
#app:has(.page-profile.active) .top-greet,
#app:has(.page-chat.active) .status-bar,
#app:has(.page-chat.active) .top-greet,
.status-bar.is-hidden,
.top-greet.is-hidden{display:none;}
.tg-info{flex:1;position:relative;z-index:1;}
.tg-info .tg-sub{font-size:12px;color:var(--text3);}
.tg-hidden{display:none;}
.avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#e3f2fd,#bbdefb);border:2px solid #fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;flex-shrink:0;color:var(--brand);box-shadow:0 2px 8px rgba(21,101,192,0.15);}

/* ===== 内容区 ===== */
.content{flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto;padding-bottom:64px;}
.content::-webkit-scrollbar{display:none;}
/* 所有页面统一：白底 + 无顶部 padding，底部由 .content 的 padding-bottom 给 tab bar 让位 */
.page{display:none;background:#fff;padding:0;min-height:100%;}
.page.active{display:block;animation:pfade .32s cubic-bezier(.2,.7,.2,1);}
/* profile 专属：无侧 padding（db-hero 顶到左右边缘），其他页面保留 12px 侧 padding */
#page-hall,#page-nav,#page-upload{padding:0 12px;}
@keyframes pfade{from{opacity:0;transform:translateY(8px) scale(.99);}to{opacity:1;transform:translateY(0) scale(1);}}

.section-title{font-size:15px;font-weight:700;margin:16px 4px 12px;display:flex;align-items:center;gap:10px;color:#1a1a1a;letter-spacing:0.5px;}
.section-title .st-bar{width:4px;height:16px;background:linear-gradient(180deg,#1565c0,#64b5f6);border-radius:2px;box-shadow:0 0 6px rgba(21,101,192,0.3);}

/* ===== 客服咨询 ===== */
.chat-header{flex-shrink:0;height:48px;background:#f7f7f7;display:flex;align-items:center;padding:0 8px;border-bottom:1px solid #e0e0e0;}
.chat-hd-left{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#333;cursor:pointer;}
.chat-hd-title{flex:1;text-align:center;font-size:16px;font-weight:600;color:#222;}
.chat-hd-right{width:40px;}
.chat-messages{flex:1;overflow-y:auto;padding:12px 10px;display:flex;flex-direction:column;gap:10px;}
.chat-empty{text-align:center;color:#999;font-size:13px;padding:40px 0;}
.chat-msg{display:flex;gap:8px;max-width:88%;}
.chat-msg.system{align-self:center;max-width:90%;}
.chat-msg .chat-avatar{width:36px;height:36px;border-radius:6px;flex-shrink:0;background:linear-gradient(135deg,#64b5f6,#1565c0);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;}
.chat-msg.me .chat-avatar{background:linear-gradient(135deg,#66bb6a,#2e7d32);}
.chat-msg-bubble{position:relative;padding:9px 12px;font-size:14px;line-height:1.45;color:#222;background:#fff;border-radius:4px;word-break:break-word;white-space:pre-wrap;}
.chat-msg.bubble-me{flex-direction:row-reverse;align-self:flex-end;}
.chat-msg.bubble-me .chat-msg-bubble{background:#95ec69;color:#1a3a0a;}
.chat-msg.bubble-agent .chat-msg-bubble{background:#fff;}
.chat-msg.bubble-system .chat-msg-bubble{background:transparent;color:#999;font-size:12px;padding:4px 12px;text-align:center;max-width:none;}
.chat-msg-time{font-size:11px;color:#aaa;margin-top:3px;}
.chat-input-bar{flex-shrink:0;display:flex;flex-direction:column;gap:6px;padding:10px;background:#f7f7f7;border-top:1px solid #e0e0e0;}
.chat-input-row{display:flex;align-items:flex-end;gap:8px;}
.chat-attach-btn{width:36px;height:36px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:20px;cursor:pointer;border-radius:6px;background:#fff;border:1px solid #ddd;transition:background .15s;}
.chat-attach-btn:hover{background:#e3f2fd;border-color:#bbdefb;}
.chat-input{flex:1;border:1px solid #ddd;border-radius:6px;padding:8px 10px;font-size:14px;background:#fff;outline:none;resize:none;max-height:100px;line-height:1.4;font-family:inherit;min-height:36px;}
.chat-input:focus{border-color:#1565c0;}
.chat-send{flex-shrink:0;background:#1565c0;color:#fff;border:none;border-radius:6px;padding:8px 14px;font-size:14px;font-weight:600;cursor:pointer;height:36px;}
.chat-send:disabled{background:#bbdefb;cursor:not-allowed;}

.chat-attach-bar{display:flex;align-items:center;gap:8px;padding:6px 8px;background:#fff3e0;border:1px solid #ffe0b2;border-radius:6px;margin-bottom:2px;}
.chat-attach-item{flex:1;font-size:13px;color:#e65100;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.chat-attach-cancel{background:none;border:none;color:#e53935;cursor:pointer;font-size:16px;padding:2px 6px;border-radius:4px;}
.chat-attach-cancel:hover{background:#ffebee;}

.chat-msg .chat-media-img{max-width:220px;max-height:220px;border-radius:6px;cursor:pointer;display:block;}
.chat-msg .chat-media-video{max-width:260px;max-height:220px;border-radius:6px;display:block;}
.chat-msg .chat-media-filename{font-size:12px;color:#666;margin-top:4px;}
.chat-msg.bubble-me .chat-media-filename{color:#1a3a0a;opacity:.7;}

/* ===== 底部 Tab ===== */
.tab-bar{height:62px;background:#fff;border-top:1px solid var(--border-soft);display:flex;flex-shrink:0;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -2px 10px rgba(20,35,70,0.04);}
.tab-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#b0b8c1;font-size:10px;gap:3px;cursor:pointer;transition:color .2s cubic-bezier(.2,.7,.2,1);position:relative;user-select:none;-webkit-tap-highlight-color:transparent;}
.tab-item:active .ticon{transform:scale(0.85);}
.tab-item.active{color:var(--brand);font-weight:600;}
.ticon{width:24px;height:22px;position:relative;display:block;transition:transform .2s cubic-bezier(.2,.7,.2,1);color:#607d8b;}
.ticon i{position:absolute;inset:0;}
.ticon svg{position:absolute;inset:0;width:100%;height:100%;display:block;color:inherit;}
/* home */
.tic-home i{border:2px solid currentColor;border-radius:4px 4px 0 0;bottom:3px;}
.tic-home i::before{content:'';position:absolute;top:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:8px solid currentColor;}
.tic-home i::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:6px;height:9px;background:#fff;border:2px solid currentColor;border-top:none;border-radius:0 0 1px 1px;}
.tab-item.active .tic-home i::after{background:var(--brand);}
/* list */
.tic-list i{border:2px solid currentColor;border-radius:2px;top:3px;bottom:3px;}
.tic-list i::before{content:'';position:absolute;top:4px;left:4px;right:4px;height:2px;background:currentColor;}
.tic-list i::after{content:'';position:absolute;bottom:4px;left:4px;right:10px;height:2px;background:currentColor;}

.tic-headset i{top:4px;left:50%;transform:translateX(-50%);width:16px;height:12px;border:2px solid currentColor;border-bottom:none;border-radius:10px 10px 0 0;}
.tic-headset i::before{content:'';position:absolute;bottom:-2px;left:-2px;width:5px;height:8px;border:2px solid currentColor;border-radius:0 0 2px 2px;top:auto;}
.tic-headset i::after{content:'';position:absolute;bottom:-2px;right:-2px;width:5px;height:8px;border:2px solid currentColor;border-radius:0 0 2px 2px;top:auto;}
/* nav */
.tic-nav i{border:2px solid currentColor;border-radius:50%;}
.tic-nav i::before{content:'';position:absolute;top:2px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:8px solid currentColor;}
.tic-nav i::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:3px;height:3px;background:currentColor;border-radius:50%;}
/* hall */
.tic-hall i{border:2px solid currentColor;border-radius:3px;bottom:2px;top:2px;}
.tic-hall i::before{content:'';position:absolute;top:-3px;left:50%;transform:translateX(-50%);width:10px;height:5px;border:2px solid currentColor;border-bottom:none;border-radius:3px 3px 0 0;background:#fff;}
.tic-hall i::after{content:'';position:absolute;top:50%;left:3px;right:3px;height:2px;background:currentColor;opacity:0.5;box-shadow:0 4px 0 0 currentColor;}
/* sat */
.tic-sat i{top:4px;bottom:6px;border:2px solid currentColor;border-radius:50% 50% 0 0;}
.tic-sat i::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:3px;height:3px;background:currentColor;border-radius:50%;}
.tic-sat i::after{content:'';position:absolute;bottom:-6px;left:50%;transform:translateX(-50%) rotate(-30deg);width:2px;height:8px;background:currentColor;}

/* ===== 定位栏（专业版 v4 · 白色为主+绿色点缀） ===== */
.location-bar{
  display:flex;align-items:center;gap:0;
  background:#fff;
  border-radius:14px;padding:12px 14px;margin:4px 0 12px;
  box-shadow:0 2px 8px rgba(15,40,65,0.06),0 1px 2px rgba(15,40,65,0.03);
  border:1px solid #eceff3;
  position:relative;overflow:visible;
}
/* 删除了左侧竖色条 ::before —— 太突兀，让卡片更干净 */

/* 左侧区域 */
.lb-left{
  display:flex;align-items:center;gap:10px;
  flex:1;min-width:0;padding:0;
}
/* 定位 pin：纯 CSS 线性 SVG 图标（无圆形底，无emoji） */
.lb-ico{
  width:28px;height:28px;flex-shrink:0;
  position:relative;display:flex;align-items:center;justify-content:center;
  /* 纯 SVG pin 图标，line 20% 透明度，stroke 1.5px，专业干净 */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231565c0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5S5.5 14.8 5.5 9.5a6.5 6.5 0 1 1 13 0c0 5.3-6.5 12-6.5 12z'/%3E%3Ccircle cx='12' cy='9.5' r='2.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:22px;
  animation:pin-breathe 3s ease-in-out infinite;
}
@keyframes pin-breathe{
  0%,100%{filter:drop-shadow(0 0 0 transparent);}
  50%{filter:drop-shadow(0 0 4px rgba(21,101,192,0.25));}
}
/* 卫星/信号状态时的 icon 替换（由 JS 动态改 class） */
.lb-ico.ic-sat{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23546e7a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5-5M12 5l5 5M2 14c1.5-2 3.5-3.5 6-4M22 14c-1.5-2-3.5-3.5-6-4M12 22v-6M9.5 22h5'/%3E%3C/svg%3E");
}
.lb-ico.ic-manual{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e65100' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E");
}

.lb-info{display:flex;flex-direction:column;min-width:0;gap:2px;flex:1;}
.lb-text{font-size:13.5px;font-weight:500;color:#37474f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-text b{color:#1565c0;font-weight:600;font-size:14px;}
.lb-sub{
  font-size:11px;color:#90a4ae;line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;
  font-variant-numeric:tabular-nums;
}

/* 右侧按钮组 */
.lb-right{
  display:flex;align-items:center;gap:6px;flex-shrink:0;
  padding:0;margin-left:10px;
}
.lb-refresh{
  font-size:12px;color:#fff;cursor:pointer;
  padding:7px 12px;border-radius:10px;
  background:linear-gradient(135deg,#1e88e5 0%,#1565c0 100%);
  white-space:nowrap;display:inline-flex;align-items:center;gap:4px;
  font-weight:600;letter-spacing:0.3px;
  box-shadow:0 1px 4px rgba(0,169,157,0.25),inset 0 1px 0 rgba(255,255,255,0.2);
  transition:transform .10s cubic-bezier(.2,.7,.2,1),filter .10s,box-shadow .10s;
  user-select:none;
}
.lb-refresh::before{content:'↻';font-size:13px;font-weight:700;line-height:1;}
.lb-refresh:active{
  transform:translateY(1px) scale(0.96);
  filter:brightness(0.9);
  box-shadow:0 1px 2px rgba(21,101,192,0.15),inset 0 2px 4px rgba(0,0,0,0.2);
}
/* 手动按钮：绿色 outline —— 覆盖继承的 ::before{content:'↻'}  */
.lb-manual{
  color:#1565c0;background:#fff;border:1px solid #bbdefb;
  box-shadow:none;font-weight:500;padding:7px 12px;
}
.lb-manual::before{content:'✎';font-size:12px;font-weight:700;line-height:1;}
.lb-manual:active{background:#e3f2fd;transform:translateY(1px) scale(0.96);filter:none;}

/* ===== Hero 统计卡 ===== */
.card{background:var(--card);border-radius:var(--r-card);margin-bottom:12px;box-shadow:var(--sh-card);position:relative;overflow:hidden;border:1px solid var(--border-soft);}
.card.hero{padding:0;background:linear-gradient(135deg,#1e88e5 0%,#1565c0 60%,#0d47a1 100%);border:none;box-shadow:0 6px 18px rgba(13,71,161,0.25),0 2px 5px rgba(13,71,161,0.12);}
.hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 80% 0%,rgba(255,255,255,0.14),transparent 55%),radial-gradient(circle at 0% 100%,rgba(100,181,246,0.18),transparent 50%);}
.hero-body{position:relative;z-index:2;color:#fff;padding:18px 18px 12px;}
.hero-title{font-size:12px;opacity:0.85;margin-bottom:4px;letter-spacing:0.5px;}
.hero-num{font-size:36px;font-weight:800;letter-spacing:-0.5px;text-shadow:0 2px 6px rgba(0,0,0,0.12);}
.hero-num .unit{font-size:15px;font-weight:500;margin-left:4px;opacity:0.85;}
.hero-sub{font-size:12px;opacity:0.85;margin-top:6px;line-height:1.6;}
.hero-sub b{font-weight:700;color:#fff;padding:0 2px;}
.hero-sub .dot-sep{margin:0 6px;opacity:0.5;}
.hero-side{position:relative;z-index:2;background:rgba(255,255,255,0.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;padding:10px;color:#fff;border-top:1px solid rgba(255,255,255,0.12);}
.hs-item{flex:1;text-align:center;}
.hs-ico{width:22px;height:22px;margin-bottom:3px;position:relative;}
.hs-ico.ic-money{color:#ffd54f;}
.hs-ico.ic-target{color:#ffcc80;}
.hs-val{font-size:17px;font-weight:700;}
.hs-lbl{font-size:10px;opacity:0.75;}

/* ===== 里程碑 ===== */
.milestone-bar{background:#fff;border-radius:var(--r-card);padding:14px 16px;margin-bottom:12px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);}
.ms-head{display:flex;justify-content:space-between;font-size:13px;margin-bottom:10px;}
.ms-title{font-weight:600;color:var(--text);}
.ms-cur{color:var(--brand);font-weight:600;font-size:12px;}
.ms-track{height:6px;background:#eef1f6;border-radius:3px;overflow:hidden;}
.ms-fill{height:100%;background:linear-gradient(90deg,#64b5f6,#1565c0);border-radius:3px;transition:width .5s;width:0%;}
.milestone-bar.completed .ms-fill{background:linear-gradient(90deg,#ff9800,#ff6f00);}
.ms-foot{display:flex;justify-content:space-between;font-size:12px;color:var(--text3);margin-top:8px;}
.ms-gift{color:var(--accent);font-weight:600;display:inline-flex;align-items:center;gap:6px;}
.ms-gift .ic-gift{width:16px;height:16px;color:var(--accent);position:relative;}
.ms-got{color:var(--text4);}
.ms-got.active{color:var(--success);font-weight:600;}

/* ===== 任务卡片 ===== */
.task-card{background:#fff;border-radius:14px;margin-bottom:12px;box-shadow:0 1px 4px rgba(15,40,65,0.05),0 1px 1px rgba(15,40,65,0.02);overflow:hidden;position:relative;border:1px solid #eceff3;transition:transform .12s,box-shadow .15s,border-color .2s;animation:tc-in .3s cubic-bezier(.2,.7,.2,1) both;}
@keyframes tc-in{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
.task-card:active{transform:scale(0.99);box-shadow:var(--sh-card-hover);}
.task-card:hover{box-shadow:var(--sh-card-hover);border-color:#bbdefb;}
.task-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand);transition:background .25s,width .25s;}
.task-card.tc-done::before{background:#90a4ae;}
.task-card.tc-going::before{background:var(--warn);}
.task-card.tc-collecting::before{background:#c2185b;}
.task-card.tc-uploaded::before{background:#6a1b9a;}

/* 已接单任务：视觉强化 —— 加粗左侧色条 + 背景微染色 + 边框高亮 */
.task-card.tc-taken{background:linear-gradient(135deg,#f2faf8 0%,#ffffff 40%);border-color:#80cbc4;box-shadow:0 2px 12px rgba(21,101,192,0.12),var(--sh-card);}
.task-card.tc-taken::before{width:5px;background:linear-gradient(180deg,#1565c0,#1976d2);}
.task-card.tc-going{background:linear-gradient(135deg,#fff8f0 0%,#ffffff 40%);border-color:#ffcc80;box-shadow:0 2px 12px rgba(230,81,0,0.10),var(--sh-card);}
.task-card.tc-going::before{width:5px;background:linear-gradient(180deg,#e65100,#ff9800);}
.task-card.tc-collecting{background:linear-gradient(135deg,#fff5f8 0%,#ffffff 40%);border-color:#f48fb1;box-shadow:0 2px 12px rgba(194,24,91,0.10),var(--sh-card);}
.task-card.tc-collecting::before{width:5px;background:linear-gradient(180deg,#c2185b,#ec407a);}

/* 刚接单 —— 更强的脉冲高亮动画 */
.task-card.tc-just-taken{animation:tc-taken-flash 1.6s ease-out, tc-taken-pulse 2s ease-out infinite;}
@keyframes tc-taken-flash{
  0%{box-shadow:0 0 0 0 rgba(21,101,192,0.65),0 4px 20px rgba(21,101,192,0.25);transform:scale(1.02);border-color:#1976d2;}
  30%{box-shadow:0 0 0 12px rgba(21,101,192,0),0 4px 20px rgba(21,101,192,0.15);transform:scale(1.01);}
  100%{box-shadow:0 2px 12px rgba(21,101,192,0.12),var(--sh-card);transform:scale(1);border-color:#80cbc4;}
}
@keyframes tc-taken-pulse{
  0%,100%{box-shadow:0 2px 12px rgba(21,101,192,0.12),var(--sh-card);}
  50%{box-shadow:0 2px 16px rgba(21,101,192,0.22),var(--sh-card);}
}

.tc-body{padding:14px 16px;}
.tc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.tc-id{font-size:12px;color:var(--text3);font-family:monospace;}
.tc-badge{font-size:11px;padding:3px 10px;border-radius:var(--r-pill);font-weight:600;letter-spacing:0.3px;transition:all .2s;}
/* 已接状态徽章：加大加粗更醒目 */
.task-card.tc-taken .tc-badge{font-size:12px;padding:4px 12px;background:linear-gradient(135deg,#1565c0,#1976d2);color:#fff;box-shadow:0 2px 8px rgba(21,101,192,0.3);}
.task-card.tc-going .tc-badge{font-size:12px;padding:4px 12px;background:linear-gradient(135deg,#e65100,#ff9800);color:#fff;box-shadow:0 2px 8px rgba(230,81,0,0.3);}
.task-card.tc-collecting .tc-badge{font-size:12px;padding:4px 12px;background:linear-gradient(135deg,#c2185b,#ec407a);color:#fff;box-shadow:0 2px 8px rgba(194,24,91,0.3);}
.tb-avail{background:#e8f5e9;color:#2e7d32;}
.tb-taken{background:#e3f2fd;color:#1565c0;}
.tb-going{background:#fff3e0;color:#e65100;}
.tb-collecting{background:#fce4ec;color:#c2185b;}
.tb-uploaded{background:#f3e5f5;color:#6a1b9a;}
.tb-done{background:#eceff1;color:#546e7a;}

.tc-route{font-size:15px;color:var(--text);font-weight:600;margin-bottom:10px;line-height:1.4;}
.tc-route .route-arrow{color:var(--brand);margin:0 6px;font-size:13px;font-weight:400;}

/* 已接单卡片路线文字加强 */
.task-card.tc-taken .tc-route{font-size:16px;color:#0d47a1;}

.tc-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 0;}
.tc-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1;overflow:hidden;}
.tc-left > span:last-child{flex-shrink:0;}
.tc-meta > div:last-child{flex-shrink:0;text-align:right;}
.tm-len{font-weight:600;font-size:12px;padding:3px 10px;border-radius:8px;}
.tm-len.len-50{background:#fce4ec;color:#c2185b;}
.tm-len.len-30{background:#fff3e0;color:#e65100;}
.tm-len.len-20{background:#fffde7;color:#f57f17;}
.tm-len.len-10{background:#e8f5e9;color:#2e7d32;}
.tm-len.len-5{background:#e3f2fd;color:#1565c0;}
.tc-meta .tc-reward{font-size:17px;font-weight:800;color:var(--accent);}
.tc-meta .tc-price-lbl{font-size:10px;color:var(--text3);margin-left:2px;font-weight:400;}

/* 已接单卡片金额更大 */
.task-card.tc-taken .tc-reward{font-size:19px;color:#1565c0;}

.tc-progress{padding:0 16px 10px;}
.tc-progress .tp-bar{height:3px;background:#eef1f6;border-radius:2px;overflow:hidden;}
.tc-progress .tp-fill{height:100%;background:linear-gradient(90deg,#80cbc4,var(--brand));border-radius:2px;transition:width .3s;}

/* 已接单卡片进度条加粗 */
.task-card.tc-taken .tc-progress .tp-bar{height:4px;background:#e3f2fd;}
.task-card.tc-taken .tc-progress .tp-fill{background:linear-gradient(90deg,#64b5f6,#1565c0);box-shadow:0 0 6px rgba(21,101,192,0.4);}

.tc-foot{display:flex;gap:10px;padding:0 16px 14px;}
.tc-foot .btn-sm{flex:1;}
/* tc-taken 按钮不再覆盖颜色 —— 直接继承 .btn-brand 的四段亮绿渐变和光波反馈 */
.task-card.tc-taken .tc-foot{padding-top:6px;}
.task-card.tc-taken .tc-foot .btn-sm{letter-spacing:1.5px;}
.task-card.tc-going .tc-foot{padding-top:4px;}
.task-card.tc-going .tc-foot .btn-sm{padding:12px 16px;font-weight:600;}

/* ===== 我的头像卡 ===== */
.card.mine-hero{background:linear-gradient(135deg,#1565c0,#0d47a1);color:#fff;padding:18px;position:relative;overflow:hidden;border:none;box-shadow:var(--sh-glass);}
.card.mine-hero::before{content:'';position:absolute;top:-40px;right:-40px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,0.06);}
.card.mine-hero::after{content:'';position:absolute;bottom:-30px;left:-20px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,0.04);}
.mine-h-title{font-size:12px;opacity:0.8;margin-top:14px;letter-spacing:0.5px;}
.mine-h-miles{font-size:32px;font-weight:800;margin:4px 0;letter-spacing:-0.5px;}
.mine-h-miles .unit{font-size:14px;font-weight:500;opacity:0.9;margin-left:3px;}
.mine-h-row{display:flex;background:rgba(255,255,255,0.14);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:var(--r-sm);padding:10px 0;margin-top:8px;}
.mh-cell{flex:1;text-align:center;border-right:1px solid rgba(255,255,255,0.2);}
.mh-cell:last-child{border-right:none;}
.mh-val{font-size:17px;font-weight:700;}
.mh-lbl{font-size:10px;opacity:0.85;margin-top:2px;letter-spacing:0.3px;}

/* ===== 步骤条 ===== */
.steps-card{background:#fff;border-radius:var(--r-card);padding:16px;margin-bottom:12px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);}
.steps{display:flex;justify-content:space-between;}
.step{flex:1;text-align:center;font-size:11px;color:var(--text4);position:relative;}
.step .s-dot{width:22px;height:22px;border-radius:50%;background:#e5e9f0;color:#fff;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;transition:all .2s;}
.step.done .s-dot{background:var(--success);}
.step.done{color:var(--success);}
.step.active .s-dot{background:var(--brand);animation:pulse 1.2s infinite;color:#fff;}
.step.active{color:var(--brand);font-weight:600;}
.step::after{content:'';position:absolute;top:11px;left:50%;right:-50%;height:2px;background:#e5e9f0;z-index:0;}
.step:last-child::after{display:none;}
.step.done::after{background:var(--success);}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(21,101,192,0.5);}50%{box-shadow:0 0 0 6px rgba(21,101,192,0);}}
.step .s-dot,.step .s-lbl{position:relative;z-index:1;}

/* ===== 导航 ===== */
.page-nav{padding:12px 12px 0;}
.page-nav .nav-hero{margin-bottom:10px;border-radius:var(--r-card);}
.page-nav .nav-steps{margin-bottom:0;padding:12px 14px;}
.page-nav .steps .s-dot{width:20px;height:20px;font-size:10px;}
.page-nav .step::after{top:10px;}
/* ===== 路线信息卡（白底专业风） ===== */
.page-nav .nav-header{margin-top:10px;}
.nav-header{background:#fff;border-radius:var(--r-card);padding:13px 16px 11px;box-shadow:var(--sh-top);border:1px solid var(--border);}
.nh-body{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.nh-places{flex:1;min-width:0;display:flex;flex-direction:column;}
.nh-place{display:flex;align-items:center;gap:10px;}
.nh-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;}
.nh-dot.s{background:#1f9d63;box-shadow:0 0 0 3px rgba(31,157,99,0.14);}
.nh-dot.e{background:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,0.14);}
.nh-place-txt{display:flex;align-items:baseline;gap:8px;min-width:0;}
.nh-tag{font-size:10px;color:var(--text3);font-weight:600;flex-shrink:0;}
.nh-addr{font-size:14px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nh-link{width:2px;height:13px;margin:3px 0 3px 4.5px;background:repeating-linear-gradient(180deg,#c9d2dc 0 3px,transparent 3px 6px);flex-shrink:0;}
.nh-side{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex-shrink:0;}
.nh-mode{font-size:10px;font-weight:700;padding:3px 10px;border-radius:var(--r-pill);background:#e3f2fd;color:#1565c0;white-space:nowrap;}
.nh-mode.tag-low{background:#fff3e0;color:#e65100;}
.nh-status{font-size:11px;color:var(--text3);white-space:nowrap;}
.nh-track{margin-top:11px;height:4px;border-radius:2px;background:#eef1f5;position:relative;}
.nh-track i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#4A90E3,#1A73E8);width:0;transition:width .5s ease;}
.nh-track b{position:absolute;top:50%;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid #1A73E8;transform:translate(-50%,-50%);left:0;transition:left .5s ease;box-shadow:0 1px 4px rgba(0,0,0,0.18);}

/* ===== 实时地图（Leaflet 真实地图 v2） ===== */
.nav-map{height:380px;background:#dbe4ec;position:relative;overflow:hidden;border-radius:var(--r-card) var(--r-card) 0 0;margin-top:10px;box-shadow:var(--sh-top);border:1px solid var(--border);border-bottom:none;}
#leafletMap{position:absolute;inset:0;width:100%;height:100%;z-index:1;border-radius:var(--r-card) var(--r-card) 0 0;background:#e8eef3;font-family:inherit;}
/* 版权/品牌栏：上移到行程卡上方的右下角（用户指定位置），苹果风深色胶囊 */
.leaflet-bottom.leaflet-right{bottom:114px;}
#leafletMap .leaflet-control-attribution{display:inline-flex;align-items:center;gap:5px;font-size:9px !important;font-weight:600;background:rgba(10,19,39,.72) !important;color:#cdd9ea !important;padding:3px 9px !important;border-radius:999px !important;border:1px solid rgba(255,255,255,.12);line-height:1.3 !important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 2px 8px rgba(2,8,26,.35);white-space:nowrap;}
#leafletMap .leaflet-control-attribution a{font-size:9px !important;color:#9fc3e8 !important;text-decoration:none;}
.map-brand{display:inline-flex;align-items:center;gap:3px;color:#fff;font-weight:700;letter-spacing:.2px;}
.map-brand-ico{width:11px;height:11px;display:block;}
.map-brand-sep{opacity:.35;margin:0 1px;}
/* 瓦片渲染：保留硬件加速防抖，去掉过曝滤镜让色彩自然 */
#leafletMap .leaflet-tile{
  filter:none;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
/* 缩放动画期间临时关闭硬件加速（避免动画抖动） */
#leafletMap .leaflet-zoom-anim .leaflet-tile{
  image-rendering:auto;
  -webkit-transform:none;
  transform:none;
}
/* 地图 loading 遮罩 */
#leafletMap .map-loading{
  position:absolute;inset:0;background:linear-gradient(145deg,#e8eef3,#dbe4ec);
  z-index:2000;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;transition:opacity .3s ease;pointer-events:none;
}
#leafletMap .map-loading .ml-spinner{
  width:32px;height:32px;border:3px solid rgba(21,101,192,0.18);
  border-top-color:#1976d2;border-radius:50%;
  animation:ml-spin .8s linear infinite;
}
#leafletMap .map-loading .ml-text{
  font-size:12px;color:#37474f;font-weight:600;letter-spacing:.5px;
}
@keyframes ml-spin{ to{ transform:rotate(360deg); } }
/* Leaflet 比例尺自定义 */
#leafletMap .leaflet-control-scale{margin:0 0 0 10px !important;padding:0 !important;}
#leafletMap .leaflet-control-scale-line{background:rgba(255,255,255,0.92);border:1.5px solid #2c3e50;border-top:none !important;height:7px;border-radius:0 0 3px 3px;font-size:8px !important;font-weight:700 !important;color:#2c3e50 !important;line-height:1 !important;padding:1px 4px 0 !important;box-shadow:0 1px 3px rgba(0,0,0,0.18);text-align:center;letter-spacing:.3px;font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;}
#leafletMap .leaflet-control-scale-line:not(:first-child){display:none !important;}
.pin-marker,.vehicle-marker,.user-marker{background:transparent !important;border:none !important;}
.vehicle-marker .mc-halo,.vehicle-marker .mc-pulse,.vehicle-marker .mc-arrow,.vehicle-marker .mc-beam,.vehicle-marker .mc-label{position:absolute;left:0;top:0;}

/* 起终点 pin（带标签胶囊） */
.pin-wrap{position:relative;display:flex;align-items:flex-end;justify-content:center;}
.pin-dot{width:22px;height:22px;border-radius:50% 50% 50% 0;background:var(--pin);border:3px solid #fff;box-shadow:0 3px 8px rgba(0,0,0,0.35);transform:rotate(-45deg);margin-bottom:2px;}
.pin-dot::after{content:'';position:absolute;inset:3px;border-radius:50% 50% 50% 0;background:#fff;}
.pin-label{position:absolute;top:-6px;left:50%;transform:translateX(-50%);background:var(--pin);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:8px;letter-spacing:.4px;box-shadow:0 2px 5px rgba(0,0,0,0.3);line-height:1.4;border:1.5px solid rgba(255,255,255,0.85);}

/* 用户位置（高德风格蓝色 GPS 指示，放大版） */
.user-marker{z-index:600 !important;}
.um-dot{position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:#1A73E8;border:4px solid #fff;box-shadow:0 0 16px rgba(26,115,232,0.9),0 2px 8px rgba(0,0,0,0.3);}
.um-dot::before{content:'';position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(26,115,232,0.75);animation:umPulse 1.8s infinite;}
@keyframes umPulse{0%{transform:scale(0.7);opacity:0.9;}100%{transform:scale(2.4);opacity:0;}}
.um-acc{position:absolute;left:0;top:0;width:56px;height:56px;border-radius:50%;background:rgba(26,115,232,0.15);border:2px solid rgba(26,115,232,0.5);pointer-events:none;}

/* 车辆 marker（高德风格蓝色导航级：方向光束+大箭头+脉动+速度标） */
.mc-beam{position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:20px;height:20px;background:radial-gradient(ellipse 90px 30px at 50% 50%,rgba(58,108,209,0.5) 0%,rgba(58,108,209,0.2) 50%,transparent 80%);border-radius:50%;z-index:1;transform-origin:center;transition:transform .6s cubic-bezier(.4,0,.2,1);}
.mc-halo{position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:50%;background:radial-gradient(circle,rgba(58,108,209,0.42) 0%,rgba(58,108,209,0.14) 60%,transparent 80%);z-index:2;}
.mc-pulse{position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;border:2.5px solid rgba(58,108,209,0.85);animation:mcPulse 1.6s infinite;z-index:3;}
@keyframes mcPulse{0%{transform:translate(-50%,-50%) scale(0.7);opacity:0.95;}100%{transform:translate(-50%,-50%) scale(1.9);opacity:0;}}
.mc-arrow{position:absolute;left:0;top:0;width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#3A6CD1 0%,#1A4FA0 100%);border:3px solid #fff;box-shadow:0 4px 16px rgba(26,79,160,0.65),0 0 0 1px rgba(58,108,209,0.3);display:flex;align-items:center;justify-content:center;transition:transform .6s cubic-bezier(.4,0,.2,1);z-index:4;}
.mc-arrow svg{width:23px;height:23px;}
.mc-arrow svg path{fill:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,0.3));}
/* 速度胶囊标签（车辆右上方，高德蓝） */
.mc-label{position:absolute;left:16px;top:-16px;transform:translate(0,-50%);background:#1A4FA0;color:#fff;font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:8px;line-height:1.3;font-variant-numeric:tabular-nums;box-shadow:0 2px 8px rgba(26,79,160,0.5);white-space:nowrap;z-index:5;border:1px solid rgba(255,255,255,0.25);}
.mc-label::after{content:'';position:absolute;left:-3px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:3px solid transparent;border-bottom:3px solid transparent;border-right:4px solid #1A4FA0;}

/* 地图浮层 */
.map-road-chip{position:absolute;top:12px;left:12px;z-index:1000;max-width:60%;background:rgba(255,255,255,0.97);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:13px;padding:9px 13px 9px 11px;display:flex;align-items:center;gap:9px;box-shadow:0 3px 14px rgba(30,60,90,0.22);border:1px solid rgba(255,255,255,0.7);}
.mrc-live{width:9px;height:9px;border-radius:50%;background:#22c55e;flex-shrink:0;animation:mrcPulse 1.6s infinite;}
/* GPS 状态点：优=绿 良=橙 差=红 定位中=灰 */
.mrc-live.s-fair{background:#f59e0b;}
.mrc-live.s-poor{background:#ef4444;}
.mrc-live.s-locating{background:#94a3b8;animation:none;}
@keyframes mrcPulse{0%,100%{box-shadow:0 0 0 2px rgba(34,197,94,0.28);}50%{box-shadow:0 0 0 6px rgba(34,197,94,0);}}
.mrc-name{font-size:13px;font-weight:700;color:#1f2d3d;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mrc-coord{font-size:10px;color:#7a8798;font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mrc-acc{margin-left:7px;padding:1px 6px;border-radius:8px;background:rgba(26,115,232,0.1);color:#1A73E8;font-weight:700;font-family:inherit;}
/* 工具组：分组容器 + 分隔线 */
.map-tools{position:absolute;top:12px;right:12px;z-index:1000;display:flex;flex-direction:column;}
.mt-group{background:rgba(255,255,255,0.96);border:1px solid rgba(220,228,235,0.8);border-radius:12px;box-shadow:0 2px 10px rgba(30,60,90,0.18);overflow:hidden;display:flex;flex-direction:column;}
.mt-group .mt-btn{box-shadow:none;border:none;border-radius:0;background:transparent;}
.mt-sep{height:1px;background:#e3e9ef;display:block;margin:0 8px;}
.mt-btn{width:40px;height:40px;background:rgba(255,255,255,0.96);border:1px solid rgba(220,228,235,0.8);box-shadow:0 2px 8px rgba(30,60,90,0.16);color:#3b4a5e;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;padding:0;transition:transform .12s,background .15s,color .15s;border-radius:12px;}
.mt-btn:active{transform:scale(0.88);}
.mt-btn.mt-icon svg{width:19px;height:19px;}
.mt-btn.mt-locate,.mt-btn.mt-layer{border-radius:0;box-shadow:none;}
.mt-btn.active{background:#1A73E8;color:#fff;border-color:#1557B0;box-shadow:0 2px 12px rgba(26,115,232,0.5);}
.mt-btn.active svg{filter:drop-shadow(0 0 2px rgba(255,255,255,0.6));}
.map-trip{position:absolute;left:0;right:0;bottom:0;z-index:1000;background:rgba(255,255,255,0.97);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:13px 13px 0 0;box-shadow:0 -4px 18px rgba(30,60,90,0.2);padding:10px 15px 14px;border-top:1px solid rgba(255,255,255,0.7);border-left:none;border-right:none;border-bottom:none;}
.mt-progress{height:4px;border-radius:2px;background:#eef1f5;overflow:hidden;margin-bottom:8px;}
.mt-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#4A90E3,#1A73E8);border-radius:2px;transition:width .5s ease;box-shadow:0 0 6px rgba(26,115,232,0.5);}
.mt-row1{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;}
.mt-remain{display:flex;align-items:baseline;gap:6px;}
.mt-remain-val{font-size:21px;font-weight:800;color:#1A73E8;line-height:1;font-variant-numeric:tabular-nums;}
.mt-remain-lbl{font-size:11px;color:var(--text3);}
.mt-eta{font-size:10.5px;color:#1565c0;background:#e3f2fd;padding:3px 9px;border-radius:var(--r-pill);font-weight:600;white-space:nowrap;}
.mt-row2{display:flex;align-items:center;}
.mt-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;}
.mts-lbl{font-size:10px;color:var(--text3);}
.mts-val{font-size:13px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}
.mt-line{width:1px;height:20px;background:#edf0f4;flex-shrink:0;}

/* 速度面板 */
.speed-panel{display:flex;align-items:center;padding:13px 14px;background:#fff;gap:14px;margin-top:10px;border-radius:var(--r-card);box-shadow:var(--sh-top);border:1px solid var(--border);}
.sp-gauge{position:relative;width:108px;height:108px;flex-shrink:0;}
.sp-gauge svg{position:absolute;top:0;left:0;}
.sp-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.sp-val{font-size:28px;font-weight:800;color:var(--brand);line-height:1;font-variant-numeric:tabular-nums;}
.sp-unit{font-size:11px;color:var(--text3);margin-top:4px;}
.sp-info{flex:1;min-width:0;}
.sp-mode{margin-bottom:10px;}
.mode-tag{display:inline-block;padding:4px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:600;}
.mode-tag.tag-high{background:#e3f2fd;color:#1565c0;}
.mode-tag.tag-low{background:#fff3e0;color:#e65100;}
.mode-tag.warn{background:#ffebee;color:#c62828;}
.mode-desc{font-size:11px;color:var(--text3);margin-top:5px;display:block;}
.sp-miles{display:flex;gap:10px;}
.sm-cell{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:#f6f8fb;border-radius:10px;padding:8px 6px;}
.sm-lbl{font-size:10px;color:var(--text3);}
.sm-val{font-size:15px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}

/* 数据流 */
.data-stream{background:#fff;margin:10px 0;border-radius:var(--r-card);box-shadow:var(--sh-top);border:1px solid var(--border);overflow:hidden;}
.data-stream .ds-head{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;font-size:13px;font-weight:600;color:var(--text);}
.data-stream .ds-title{color:var(--text);display:flex;align-items:center;gap:6px;}
.data-stream .ds-title .ic-dish{width:16px;height:16px;color:var(--brand);}
.data-stream .ds-cnt{font-size:12px;color:var(--brand);font-weight:600;background:var(--brand-soft);padding:3px 10px;border-radius:var(--r-pill);}
.ds-live{width:7px;height:7px;border-radius:50%;background:#22c55e;display:none;animation:dsLive 1.4s infinite;}
.ds-live.on{display:inline-block;}
@keyframes dsLive{0%,100%{opacity:1;box-shadow:0 0 0 2px rgba(34,197,94,0.2);}50%{opacity:0.4;box-shadow:0 0 0 4px rgba(34,197,94,0.05);}}
.ds-list{max-height:142px;overflow-y:auto;padding:0 16px 8px;}
.ds-list::-webkit-scrollbar{width:3px;}
.ds-list::-webkit-scrollbar-thumb{background:#d5dae2;border-radius:2px;}
.empty-inline{text-align:center;color:var(--text4);font-size:12px;padding:16px 0;}
.ds-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;font-size:12px;border-bottom:1px solid var(--border);}
.ds-row:last-child{border-bottom:none;}
.ds-row .ds-ts{color:var(--text3);font-size:11px;}
.ds-row .ds-coord{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--brand);font-size:11.5px;}
.ds-row .ds-speed{font-size:11px;color:var(--text2);}
.ds-row .ds-status{width:18px;height:18px;line-height:18px;text-align:center;border-radius:50%;background:#e6f6ec;color:#1f9d63;font-size:11px;font-weight:700;}

/* 导航控制 */
.nav-controls{padding:14px 0 16px;}

/* ===== 卫星数据 ===== */
.star-card{background:linear-gradient(135deg,#001a16 0%,#003a32 100%);border-radius:var(--r-card);padding:16px;color:#fff;margin-bottom:14px;position:relative;overflow:hidden;box-shadow:var(--sh-glass);}
.star-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(79,195,247,0.18),transparent 50%),radial-gradient(circle at 80% 80%,rgba(21,101,192,0.18),transparent 50%);}
.sc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;position:relative;z-index:1;}
.sc-title{font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px;}
.sc-title .ic-sat{width:18px;height:18px;color:#80cbc4;}
.sc-signal{color:#80cbc4;font-size:12px;font-weight:500;}
.sc-sats{display:flex;justify-content:space-around;margin-bottom:12px;position:relative;z-index:1;}
.sc-sats .sat{text-align:center;font-size:10px;color:#bbdefb;transition:opacity .3s;}
.sc-sats .s-ico{width:22px;height:22px;display:block;margin:0 auto 5px;position:relative;color:#bbdefb;}
.sc-sats .sat.active .s-ico{color:#4dd0e1;animation:twinkle 2s infinite;}
.sc-sats .s-ico.ic-dish::before{width:14px;height:7px;border-width:1.5px;}
.sc-sats .s-ico.ic-dish::after{width:1.5px;height:8px;}
@keyframes twinkle{0%,100%{opacity:0.4;}50%{opacity:1;}}
.sc-coords{background:rgba(255,255,255,0.1);backdrop-filter:blur(4px);border-radius:var(--r-sm);padding:10px;font-family:monospace;font-size:12px;text-align:center;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:8px;}
.sc-coords .coord{font-size:12px;letter-spacing:0.5px;}
.sc-coords .coord-sep{opacity:0.4;}
.sc-coords .coord-prec{display:none;}

.drive-status-card{background:#fff;border-radius:var(--r-card);padding:16px;margin-bottom:14px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);}
.ds-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.ds-title{font-size:14px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px;}
.ds-title .ic-chart{width:18px;height:18px;color:var(--accent);}
.ds-online{font-size:12px;color:var(--success);font-weight:600;background:#e8f5e9;padding:4px 12px;border-radius:var(--r-pill);}
.ds-online.off{color:var(--text3);background:#f4f6fa;}
.ds-grid{display:flex;background:#fafbfd;border-radius:var(--r-sm);padding:14px 0;border:1px solid var(--border-soft);}
.ds-cell{flex:1;text-align:center;position:relative;}
.ds-cell:not(:last-child)::after{content:'';position:absolute;right:0;top:24%;height:52%;width:1px;background:var(--border);}
.ds-val{font-size:20px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-0.3px;}
.ds-lbl{font-size:11px;color:var(--text3);margin-top:4px;letter-spacing:0.3px;}

/* ===== 卫星数据页（#page-upload）布局优化 ===== */
#page-upload > .section-title:first-child{margin-top:14px;}
/* 卫星状态卡内部节奏精修 */
#page-upload .star-card{margin-bottom:14px;}
#page-upload .sc-coords{border:1px solid rgba(255,255,255,0.12);margin-top:2px;}
/* 引导提示：无内容时自动收起，避免已连接状态下留下空白间隙 */
#satArrowTxt{margin-top:12px;line-height:1.5;}
#satArrowTxt:empty{display:none;margin-top:0;}
/* 动态状态区与下方出车概览形成清晰分组 */
#page-upload .drive-status-card{margin-top:18px;}


/* 通用空状态 */
.sat-empty{text-align:center;padding:28px 20px;background:#fff;border-radius:var(--r-card);border:none;}
.sat-emoji{width:48px;height:48px;margin:0 auto 10px;position:relative;}
.sat-emoji.ic-sat{color:var(--brand);}
.sat-emoji.ic-sat::before{width:28px;height:14px;border-width:2px;}
.sat-emoji.ic-sat::after{width:4px;height:4px;top:8px;}
.sat-emoji.ic-dish::before{width:24px;height:12px;border-width:2px;}
.sat-emoji.ic-dish::after{width:3px;height:14px;}
.sat-txt{font-size:14px;color:var(--text2);}
.upload-card{background:#fff;border-radius:var(--r-card);margin-bottom:10px;box-shadow:var(--sh-card);overflow:hidden;border:1px solid var(--border-soft);}
.uc-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border-soft);}
.uc-id{font-size:12px;font-weight:600;}
.uc-status{font-size:11px;padding:3px 10px;border-radius:var(--r-pill);font-weight:600;}
.uc-status.ok{background:#e8f5e9;color:#2e7d32;}
.uc-status.ing{background:#fff3e0;color:#e65100;}
.uc-body{padding:10px 16px;font-size:12px;color:var(--text2);}
.uc-body .uc-row{display:flex;justify-content:space-between;padding:3px 0;}
.uc-body .uc-row span:first-child{color:var(--text3);}
.upload-btn-row{margin-bottom:14px;}

.sat-status-pill{display:inline-block;padding:4px 12px;border-radius:var(--r-pill);font-size:11px;font-weight:600;}
.sat-pending{background:#fff3e0;color:#e65100;}
.sat-confirmed{background:#e8f5e9;color:#2e7d32;}
.sat-none{background:#f4f6fa;color:#888;}

/* ===== 首页 ===== */
/* 用户头部卡（蓝色渐变） */
.db-hero{
  background:linear-gradient(135deg,#0d47a1 0%,#1565c0 55%,#1976d2 100%);
  border-radius:var(--r-card) var(--r-card) 0 0;
  margin-bottom:0;
  padding:0 0 18px;
  color:#fff;
  position:relative;
  overflow:hidden;
  box-shadow:var(--sh-glass);
}
.db-hero::before{content:'';position:absolute;top:-50px;right:-40px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,0.07);}
.db-hero::after{content:'';position:absolute;bottom:-30px;left:-30px;width:220px;height:120px;border-radius:50%;background:linear-gradient(to bottom, rgba(0,68,60,0.8), rgba(0,68,60,0));pointer-events:none;}

/* ---- 品牌顶行（时间+卫星信号） ---- */
.db-top-bar{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:10px 16px 0;}
.db-brand{font-size:14px;font-weight:700;letter-spacing:1.5px;color:rgba(255,255,255,0.92);}
.db-top-right{display:flex;align-items:center;gap:5px;opacity:0.88;font-size:11px;}
.db-time{font-family:-apple-system,'Helvetica Neue',monospace;letter-spacing:0.5px;}
.db-sat{width:15px;height:15px;opacity:0.95;margin-right:0;}
.db-signal{height:10px;transform:scale(0.9);margin-right:-2px;}
/* db-hero 深墨绿背景下 SVG 卫星三态增强对比度 */
.db-top-right .sat-indicator.gray{color:rgba(255,255,255,0.65);opacity:0.85;}
.db-top-right .sat-indicator.pending{color:#ffcc80;opacity:1;filter:drop-shadow(0 0 2px rgba(255,204,128,0.5));}
.db-top-right .sat-indicator.green{color:#b3e5fc;opacity:1;filter:drop-shadow(0 0 4px #42a5f5);animation:satPulse 2s ease-in-out infinite;}
.db-top-right .signal-icon.s-none span{opacity:0.32;background:rgba(255,255,255,0.7);}
.db-top-right .signal-icon.s-pending span{opacity:0.8;background:#ffcc80;}
.db-top-right .signal-icon.s-pending span:nth-child(1){opacity:1;}
.db-top-right .signal-icon.s-confirmed span{opacity:1;background:#b3e5fc;}

/* ---- 问候语行 ---- */
.db-greet{position:relative;z-index:1;padding:0 16px 6px;font-size:13px;color:rgba(255,255,255,0.72);font-weight:400;letter-spacing:0.3px;}

.dh-row1{position:relative;z-index:1;display:flex;align-items:center;gap:12px;padding:2px 16px 6px;}
.dh-avatar{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,0.2);border:2px solid rgba(255,255,255,0.45);display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700;flex-shrink:0;backdrop-filter:blur(4px);}
.dh-info{flex:1;min-width:0;}
.dh-name-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.dh-name{font-size:18px;font-weight:700;letter-spacing:0.3px;}
.dh-badge{font-size:11px;padding:3px 10px;border-radius:var(--r-pill);font-weight:600;letter-spacing:0.3px;white-space:nowrap;}
.dh-badge.online{background:rgba(76,175,80,0.25);border:1px solid rgba(102,187,106,0.5);color:#a5d6a7;}
.dh-badge.offline{background:rgba(255,152,0,0.2);border:1px solid rgba(255,183,77,0.5);color:#ffcc80;}
.dh-badge.busy{background:rgba(33,150,243,0.25);border:1px solid rgba(100,181,246,0.5);color:#bbdefb;}
.dh-sub{font-size:12px;opacity:0.75;margin-top:5px;letter-spacing:0.2px;}

/* 定位 / GPS 状态胶囊 */
.dh-loc{position:relative;z-index:1;margin:6px 16px 16px;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.14);border-radius:var(--r-pill);padding:6px 14px;font-size:12px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
.dl-status{display:flex;align-items:center;gap:5px;flex-shrink:0;opacity:0.95;}
.dl-status .dsb-dot{width:7px;height:7px;border-radius:50%;background:#9e9e9e;flex-shrink:0;transition:all .2s;}
.dl-status .dsb-dot.on{background:#66bb6a;box-shadow:0 0 6px rgba(102,187,106,0.7);}
.dl-status .dsb-dot.search{background:#ffa726;box-shadow:0 0 6px rgba(255,167,38,0.7);}
.dl-status-txt{white-space:nowrap;}
.dl-city{font-weight:600;opacity:0.92;white-space:nowrap;}
.dl-district{opacity:0.6;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.dl-coords{margin-left:auto;font-family:monospace;font-size:10px;opacity:0.7;white-space:nowrap;flex-shrink:0;}

/* 今日数据白卡（上浮嵌入头部，底部圆角） */
.db-stats-card{position:relative;z-index:2;margin:-18px 0 0;background:#fff;border-radius:0 0 var(--r-card) var(--r-card);box-shadow:none;border:none;overflow:hidden;}
.dsc-grid{display:flex;padding:14px 0 12px;}
.dsc-grid .ds-cell{flex:1;text-align:center;position:relative;}
.dsc-grid .ds-cell:not(:last-child)::after{content:'';position:absolute;right:0;top:24%;height:52%;width:1px;background:var(--border);}
.dsc-grid .ds-val{font-size:19px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2;letter-spacing:-0.3px;}
.dsc-grid .ds-cell.hl .ds-val{color:var(--accent);}
.dsc-grid .ds-lbl{font-size:11px;color:var(--text3);margin-top:4px;letter-spacing:0.3px;}
.dsc-progress{padding:10px 16px 12px;border-top:1px solid var(--border-soft);}
.dsc-pg-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text3);margin-bottom:6px;}
.dsc-pg-val{font-variant-numeric:tabular-nums;}
.dsc-pg-val b{color:var(--brand);font-weight:700;font-size:13px;}
.dsc-pg-bar{height:6px;background:#eef1f6;border-radius:3px;overflow:hidden;}
.dsc-pg-fill{height:100%;background:linear-gradient(90deg,#64b5f6,#1565c0);border-radius:3px;transition:width .6s cubic-bezier(.2,.7,.2,1);}

/* ===== IP / 连接信息卡 ===== */
.ip-info-card{background:#fff;border-radius:var(--r-card);margin-bottom:14px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);overflow:hidden;}
.ipc-head{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:linear-gradient(135deg,#e8f5e9,#e3f2fd);border-bottom:1px solid var(--border-soft);}
.ipc-title{font-size:13px;font-weight:600;color:#1565c0;}
.ipc-login-count{font-size:11px;color:#666;background:#fff;padding:2px 8px;border-radius:10px;border:1px solid #e0e0e0;}
.ipc-row{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-bottom:1px solid #f5f5f5;}
.ipc-row:last-child{border-bottom:none;}
.ipc-label{font-size:12px;color:#888;flex-shrink:0;}
.ipc-val{font-size:12px;color:#333;font-family:'Consolas',monospace;text-align:right;word-break:break-all;max-width:60%;}
.ipc-val.loc{color:#1565c0;font-weight:500;}
.ipc-val.local{color:#999;}
.ipc-val.proxy{color:#c62828;font-weight:600;background:#ffebee;padding:1px 6px;border-radius:8px;display:inline-block;}
.ipc-val.direct{color:#2e7d32;font-weight:500;}

@media (max-width:360px){
  .ipc-head{padding:9px 12px;}
  .ipc-title{font-size:12px;}
  .ipc-login-count{font-size:10px;padding:2px 6px;}
  .ipc-row{flex-direction:column;align-items:flex-start;gap:3px;padding:7px 12px;}
  .ipc-label{font-size:11px;color:#aaa;}
  .ipc-val{width:100%;max-width:100%;font-size:12px;text-align:left;}
  .ipc-val.loc{font-size:12px;}
}

/* ===== 常用服务网格（单张白卡 · 4列2行 共8项） ===== */
.svc-card{background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-card);border:1px solid var(--border-soft);border-top:3px solid var(--brand-soft);margin-bottom:16px;overflow:hidden;}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);}
.svc-item{position:relative;padding:16px 4px 14px;text-align:center;cursor:pointer;transition:background .12s,transform .12s;}
.svc-item:not(:nth-child(3n))::after{content:'';position:absolute;right:0;top:22%;height:56%;width:1px;background:var(--border-soft);}
.svc-item:last-child::after{display:none;}
.svc-item:nth-child(n+4)::before{content:'';position:absolute;left:12%;right:12%;top:0;height:1px;background:var(--border-soft);}
.svc-item:active{background:var(--brand-soft);transform:scale(0.96);}
.svc-item.danger:active{background:#ffebee;}
.svc-ico{width:42px;height:42px;margin:0 auto 7px;border-radius:13px;display:flex;align-items:center;justify-content:center;}
.svc-ico .ag-ico{width:22px;height:22px;margin:0;}
.svc-lbl{font-size:12px;color:var(--text2);font-weight:500;letter-spacing:0.2px;white-space:nowrap;}
.svc-item.danger .svc-lbl{color:#c62828;}

/* ===== content-panel：统一内容面板，消除多卡拼接 ===== */
#page-profile .content-panel{background:transparent;border:none;box-shadow:none;border-radius:0;margin:0;overflow:visible;}
#page-profile .panel-section{padding:0 16px;}
#page-profile .panel-section + .panel-section{border-top:1px solid var(--border-soft);margin-top:12px;padding-top:2px;}
#page-profile .panel-section.last{padding-bottom:6px;}
#page-profile .panel-section .section-title{margin:14px 0 8px;font-size:13px;color:var(--text);font-weight:700;letter-spacing:0.3px;display:flex;align-items:center;gap:7px;}
#page-profile .panel-section .section-title .st-bar{width:3px;height:13px;background:linear-gradient(180deg,var(--brand),#80cbc4);border-radius:2px;}
/* svc-card.flat：嵌套在 content-panel 里时去掉独立卡边框阴影 */
#page-profile .svc-card.flat{background:transparent;box-shadow:none;border:none;border-top:none;border-radius:0;margin:0 -16px 2px;padding:0;overflow:hidden;}
/* content-panel 内 home-empty 扁平化 */
#page-profile .content-panel .home-empty{background:transparent;border:none;border-radius:0;padding:8px 0 4px;box-shadow:none;display:flex;align-items:center;gap:10px;}
#page-profile .content-panel .home-empty::before{display:none;}
#page-profile .content-panel .home-empty .he-ico{width:36px;height:36px;border-radius:10px;background:var(--brand-soft);color:var(--brand);font-size:16px;margin:0;flex-shrink:0;}
#page-profile .content-panel .home-empty .he-txt{font-size:13px;color:var(--text3);font-weight:500;text-align:left;}
#page-profile .content-panel .home-empty .he-cta{margin:0 0 0 auto;padding:6px 14px;}
.home-empty .he-cta{display:inline-flex;align-items:center;justify-content:center;gap:4px;margin-top:12px;padding:7px 18px;border-radius:20px;background:var(--brand-soft);color:var(--brand);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;}
.home-empty .he-cta:active{transform:scale(0.95);filter:brightness(0.96);}
/* content-panel 内收益/历史卡扁平化 */
#page-profile .content-panel .earn-card,
#page-profile .content-panel .task-mini{background:#f8fafc;border-radius:var(--r-sm);padding:10px 14px;margin:0 0 6px;box-shadow:none;border:1px solid var(--border-soft);}
/* ===== 服务图标配色（语义化：暖橙/青绿/紫/蓝/青/灰/红） ===== */
.svc-ico.o{background:#fff3e0;}              /* 收益明细：暖橙 */
.svc-ico.o .ag-ico{color:#ef6c00;}
.svc-ico.b{background:var(--brand-soft);}   /* 电子合同：品牌青绿 */
.svc-ico.b .ag-ico{color:var(--brand);}
.svc-ico.s{background:var(--brand-soft);}    /* 历史任务：品牌青绿 */
.svc-ico.s .ag-ico{color:var(--brand);}
.svc-ico.p{background:#f3e5f5;}              /* 薪资规则：紫 */
.svc-ico.p .ag-ico{color:#6a1b9a;}
.svc-ico.t{background:#e3f2fd;}              /* 编辑资料：品牌青绿 */
.svc-ico.t .ag-ico{color:#1565c0;}
.svc-ico.l{background:#e0f7fa;}              /* 语言：青蓝 */
.svc-ico.l .ag-ico{color:#00838f;}
.svc-ico.g{background:#eceff1;}              /* 关于平台：中性灰 */
.svc-ico.g .ag-ico{color:#455a64;}
.svc-ico.r{background:#ffebee;}              /* 退出登录：红（危险操作） */
.svc-ico.r .ag-ico{color:#c62828;}

.ag-ico{width:32px;height:32px;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;position:relative;color:currentColor;}

/* ===== 通用图标 ===== */
.ag-ico.ic-orders,.ic-orders{color:#1565c0;position:relative;}
.ag-ico.ic-orders::before,.ic-orders::before{content:'';width:20px;height:24px;border:2px solid currentColor;border-radius:3px;}
.ag-ico.ic-orders::after,.ic-orders::after{content:'';position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:10px;height:4px;border:2px solid currentColor;border-bottom:none;border-radius:2px 2px 0 0;background:#fff;}
.ag-ico.ic-nav,.ic-nav{color:#2e7d32;position:relative;}
.ag-ico.ic-nav::before,.ic-nav::before{content:'';width:22px;height:22px;border:2px solid currentColor;border-radius:50%;}
.ag-ico.ic-nav::after,.ic-nav::after{content:'';position:absolute;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:10px solid currentColor;top:4px;left:50%;transform:translateX(-50%);}
.ag-ico.ic-list,.ic-list{color:#546e7a;position:relative;}
.ag-ico.ic-list::before,.ic-list::before{content:'';width:20px;height:24px;border:2px solid currentColor;border-radius:3px;}
.ag-ico.ic-list::after,.ic-list::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:12px;height:2px;background:currentColor;box-shadow:0 -5px 0 0 currentColor, 0 5px 0 0 currentColor;}
.ag-ico.ic-sat,.ic-sat{color:#ef6c00;position:relative;}
.ag-ico.ic-sat::before,.ic-sat::before{content:'';width:20px;height:10px;border:2px solid currentColor;border-radius:50% 50% 0 0;}
.ag-ico.ic-sat::after,.ic-sat::after{content:'';position:absolute;top:5px;left:50%;transform:translateX(-50%);width:3px;height:3px;background:currentColor;border-radius:50%;}
.ag-ico.ic-money,.ic-money{color:#ef6c00;position:relative;}
.ag-ico.ic-money::before,.ic-money::before{content:'';width:20px;height:20px;border:2px solid currentColor;border-radius:50%;}
.ag-ico.ic-money::after,.ic-money::after{content:'$';position:absolute;font-size:13px;font-weight:700;color:currentColor;line-height:1;top:50%;left:50%;transform:translate(-50%,-50%);}
.ag-ico.ic-book,.ic-book{color:#6a1b9a;position:relative;}
.ag-ico.ic-book::before,.ic-book::before{content:'';width:20px;height:22px;border:2px solid currentColor;border-radius:2px;}
.ag-ico.ic-book::after,.ic-book::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:14px;height:2px;background:currentColor;box-shadow:0 -6px 0 0 currentColor, 0 6px 0 0 currentColor;}
.ag-ico.ic-edit,.ic-edit{color:#455a64;position:relative;transform:rotate(-30deg);}
.ag-ico.ic-edit::before,.ic-edit::before{content:'';width:4px;height:18px;background:currentColor;border-radius:1px;}
.ag-ico.ic-edit::after,.ic-edit::after{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:5px solid currentColor;}
.ag-ico.ic-info,.ic-info{color:#546e7a;position:relative;}
.ag-ico.ic-info::before,.ic-info::before{content:'';width:20px;height:20px;border:2px solid currentColor;border-radius:50%;}
.ag-ico.ic-info::after,.ic-info::after{content:'i';position:absolute;font-size:13px;font-weight:700;color:currentColor;line-height:1;top:50%;left:50%;transform:translate(-50%,-50%);font-style:italic;}
.ag-ico.ic-dish,.ic-dish{color:#ef6c00;position:relative;}
.ag-ico.ic-dish::before,.ic-dish::before{content:'';width:18px;height:9px;border:2px solid currentColor;border-radius:50% 50% 0 0;transform:rotate(-20deg);transform-origin:bottom right;}
.ag-ico.ic-dish::after,.ic-dish::after{content:'';position:absolute;bottom:0;right:2px;width:2px;height:10px;background:currentColor;transform:rotate(20deg);transform-origin:bottom;}
.ag-ico.ic-chart,.ic-chart{color:#e65100;position:relative;}
.ag-ico.ic-chart::before,.ic-chart::before{content:'';width:18px;height:20px;border:2px solid currentColor;border-radius:2px;border-top:none;border-right:none;position:absolute;bottom:0;left:2px;}
.ag-ico.ic-chart::after,.ic-chart::after{content:'';position:absolute;bottom:2px;left:4px;width:3px;height:6px;background:currentColor;border-radius:1px;box-shadow:5px -2px 0 -1px currentColor, 10px -5px 0 -1px currentColor;}
.ag-ico.ic-file,.ic-file{color:#1565c0;position:relative;}
.ag-ico.ic-file::before,.ic-file::before{content:'';width:18px;height:14px;border:2px solid currentColor;border-radius:2px;border-top:none;position:absolute;bottom:2px;left:2px;}
.ag-ico.ic-file::after,.ic-file::after{content:'';position:absolute;top:2px;left:2px;width:10px;height:4px;border:2px solid currentColor;border-bottom:none;border-radius:2px 2px 0 0;background:#fff;}
.ag-ico.ic-pin,.ic-pin{color:#d32f2f;position:relative;}
.ag-ico.ic-pin::before,.ic-pin::before{content:'';width:14px;height:18px;border:2px solid currentColor;border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;position:absolute;top:0;left:50%;transform:translateX(-50%);}
.ag-ico.ic-pin::after,.ic-pin::after{content:'';position:absolute;top:6px;left:50%;transform:translateX(-50%);width:5px;height:5px;background:currentColor;border-radius:50%;}
.ag-ico.ic-refresh,.ic-refresh{color:#1976d2;position:relative;display:inline-flex;align-items:center;gap:4px;}
.ag-ico.ic-refresh::before,.ic-refresh::before{content:'';width:14px;height:14px;border:2px solid currentColor;border-radius:50%;border-top-color:transparent;border-right-color:transparent;transform:rotate(-45deg);}
.ag-ico.ic-refresh::after,.ic-refresh::after{content:'';position:absolute;right:-1px;top:1px;width:0;height:0;border-top:4px solid transparent;border-right:4px solid currentColor;border-bottom:4px solid transparent;}
.ag-ico.ic-target,.ic-target{color:#ef6c00;position:relative;}
.ag-ico.ic-target::before,.ic-target::before{content:'';width:20px;height:20px;border:2px solid currentColor;border-radius:50%;}
.ag-ico.ic-target::after,.ic-target::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border:2px solid currentColor;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #fff inset;}
.ag-ico.ic-gift,.ic-gift{color:#e53935;position:relative;}
.ag-ico.ic-gift::before,.ic-gift::before{content:'';width:18px;height:12px;border:2px solid currentColor;border-radius:2px;position:absolute;bottom:2px;left:50%;transform:translateX(-50%);}
.ag-ico.ic-gift::after,.ic-gift::after{content:'';position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:14px;height:4px;background:currentColor;box-shadow:0 -2px 0 0 currentColor;}
.ag-ico.ic-map,.ic-map{color:#1565c0;position:relative;}
.ag-ico.ic-map::before,.ic-map::before{content:'';width:20px;height:14px;border:2px solid currentColor;border-radius:2px;transform:skewY(-10deg);}
.ag-ico.ic-map::after,.ic-map::after{content:'';position:absolute;top:2px;left:4px;bottom:2px;width:0;height:0;border-left:2px dashed currentColor;transform:skewY(10deg);}
.ag-ico.ic-car,.ic-car{color:#1565c0;position:relative;}
.ag-ico.ic-car::before,.ic-car::before{content:'';width:22px;height:10px;border:2px solid currentColor;border-radius:6px 6px 3px 3px;border-bottom:none;position:absolute;top:3px;left:50%;transform:translateX(-50%);}
.ag-ico.ic-car::after,.ic-car::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:18px;height:6px;border:2px solid currentColor;border-radius:3px;background:#fff;box-shadow:-10px 0 0 -2px currentColor, 10px 0 0 -2px currentColor;}
.ag-ico.ic-bulb,.ic-bulb{color:#f9a825;position:relative;}
.ag-ico.ic-bulb::before,.ic-bulb::before{content:'';width:12px;height:14px;border:2px solid currentColor;border-radius:6px 6px 4px 4px;position:absolute;top:0;left:50%;transform:translateX(-50%);}
.ag-ico.ic-bulb::after,.ic-bulb::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:8px;height:2px;background:currentColor;border-radius:1px;box-shadow:0 3px 0 0 currentColor;}
/* 语言：地球仪 */
.ag-ico.ic-globe,.ic-globe{color:#00838f;position:relative;}
.ag-ico.ic-globe::before,.ic-globe::before{content:'';width:20px;height:20px;border:2px solid currentColor;border-radius:50%;}
.ag-ico.ic-globe::after,.ic-globe::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:9px;height:20px;border:2px solid currentColor;border-radius:50%;border-top-color:transparent;border-bottom-color:transparent;}
/* 退出登录：门框 + 右箭头 */
.ag-ico.ic-logout,.ic-logout{color:#c62828;position:relative;}
.ag-ico.ic-logout::before,.ic-logout::before{content:'';position:absolute;left:1px;top:2px;width:11px;height:18px;border:2px solid currentColor;border-right:none;border-radius:3px 0 0 3px;}
.ag-ico.ic-logout::after,.ic-logout::after{content:'';position:absolute;right:0;top:50%;width:8px;height:8px;border:2px solid currentColor;border-left:none;border-bottom:none;transform:translateY(-60%) rotate(45deg);}
.ag-ico.ic-logout .lg-line,.ic-logout .lg-line{position:absolute;right:2px;top:50%;width:9px;height:2px;background:currentColor;transform:translateY(-50%);border-radius:1px;}

/* ===== 电子合同签名板 ===== */
.sign-board{width:100%;height:240px;border:2px dashed #ccc;border-radius:10px;background:#fafbfc;touch-action:none;cursor:crosshair;display:block;margin:0 auto;}
.sign-board.signed{border-color:#2e7d32;border-style:solid;background:#fff;}
.sign-actions{display:flex;gap:10px;margin-top:12px;justify-content:center;}
.sign-btn{padding:8px 18px;border-radius:8px;font-size:14px;border:none;cursor:pointer;font-weight:600;}
.sign-btn.primary{background:linear-gradient(135deg,#0891b2,#2563eb);color:#fff;box-shadow:0 3px 12px rgba(8,145,178,.35);}
.sign-btn.ghost{background:#fff;border:1px solid #ddd;color:#666;}
.sign-tip{text-align:center;color:#999;font-size:12px;margin-top:8px;}
.contract-status{display:flex;align-items:center;gap:6px;font-size:12px;margin-top:4px;}
.contract-status.ok{color:#2e7d32;}
.contract-status.pending{color:#f57c00;}
.contract-preview{text-align:center;margin:0 0 8px;padding:10px;background:#f5f7fa;border-radius:8px;border:1px solid #e0eadf;}
.contract-preview img{max-width:100%;max-height:140px;width:auto;height:auto;border:1px solid #e0e0e0;border-radius:6px;background:#fff;display:block;margin:0 auto;object-fit:contain;}

/* 「查看电子合同」按钮：按压即时反馈，消除点击延迟感 */
.zc-contract-btn{transition:transform .08s ease, filter .08s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.zc-contract-btn:active{transform:scale(0.94);filter:brightness(0.96);}
/* 合同弹窗加载转圈（主题绿，与品牌一致） */
.zc-spinner{width:30px;height:30px;margin:0 auto;border:3px solid rgba(21,101,192,0.16);border-top-color:#1976d2;border-radius:50%;animation:zc-spin .75s linear infinite;}
@keyframes zc-spin{to{transform:rotate(360deg);}}

/* ===== 空状态卡（收益/历史） ===== */
.home-empty{
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:var(--r-card);
  padding:28px 20px;
  text-align:center;
  position:relative;
  box-shadow:var(--sh-card);
  overflow:hidden;
}
/* 顶部品牌蓝渐变条（呼应 hero 卡，建立视觉连贯性） */
.home-empty::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:linear-gradient(90deg,#1565c0,#80cbc4);
}
.home-empty .he-ico{
  width:52px;height:52px;
  margin:0 auto 12px;
  border-radius:14px;
  background:#eef2f7;
  display:flex;align-items:center;justify-content:center;
  color:#86909c;
  font-size:22px;
  font-weight:700;
  position:relative;
  z-index:1;
}
.home-empty .he-txt{
  font-size:13px;
  color:var(--text3);
  font-weight:500;
  position:relative;
  z-index:1;
}

/* ===== 收益卡 ===== */
.earn-card{background:#fff;border-radius:var(--r-card);padding:14px 16px;margin-bottom:10px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);display:flex;justify-content:space-between;align-items:center;}
.ec-left{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--text);}
.ec-date{font-size:11px;color:var(--text3);font-weight:400;margin-top:4px;}
.ec-right{text-align:right;flex-shrink:0;margin-left:12px;}
.ec-amount{font-size:17px;font-weight:800;color:var(--accent);}
.ec-type{font-size:10px;color:var(--text3);margin-top:3px;}

/* ===== 历史卡 ===== */
.history-card{background:#fff;border-radius:var(--r-card);padding:14px 16px;margin-bottom:10px;box-shadow:var(--sh-card);border:1px solid var(--border-soft);}
.hc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.hc-title{font-size:13px;font-weight:600;color:var(--text);}
.hc-date{font-size:11px;color:var(--text3);}
.hc-body{display:flex;background:#fafbfd;border-radius:var(--r-sm);padding:10px;border:1px solid var(--border-soft);}
.hc-cell{flex:1;text-align:center;}
.h-val{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}
.h-lbl{font-size:10px;color:var(--text3);margin-top:3px;}
.hc-reward{font-size:16px;font-weight:800;color:var(--accent);}

/* ===== 空状态 ===== */
.empty-state{text-align:center;padding:32px 20px;}
.es-emoji{width:48px;height:48px;margin:0 auto 10px;color:#b0b8c1;font-size:32px;line-height:48px;}
.es-txt{font-size:14px;color:var(--text3);font-weight:500;}

/* ===== 通用 ===== */
.btn-logout{background:rgba(255,255,255,0.18);color:#fff;border:1px solid rgba(255,255,255,0.28);border-radius:14px;padding:5px 12px;font-size:12px;cursor:pointer;font-family:inherit;}
.btn-logout:active{background:rgba(255,255,255,0.3);}
.logout-area{margin-top:28px;padding:0 16px 40px;display:flex;flex-direction:column;align-items:center;gap:10px;}
.btn-logout-big{width:100%;max-width:340px;height:52px;border-radius:16px;border:none;background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;font-size:16px;font-weight:600;letter-spacing:2px;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;font-family:inherit;box-shadow:0 6px 18px rgba(238,90,36,0.35);transition:transform .15s,box-shadow .15s;}
.btn-logout-big:active{transform:scale(0.97);box-shadow:0 2px 8px rgba(238,90,36,0.3);}
.btn-logout-big .bl-icon{font-size:18px;}
.logout-tip{font-size:11px;color:var(--text3);}

.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px;}
.sg-card{background:#fff;border-radius:var(--r-card);padding:14px;text-align:center;box-shadow:var(--sh-card);border:1px solid var(--border-soft);}
.sg-num{font-size:22px;font-weight:700;color:var(--text);}

/* ===== 响应式小屏适配 ===== */
@media(max-width:360px){
  .svc-item{padding:13px 4px 11px;}
  .svc-ico{width:38px;height:38px;border-radius:11px;}
  .svc-ico .ag-ico{width:20px;height:20px;}
  .svc-lbl{font-size:11px;}
  .dsc-grid .ds-val{font-size:17px;}
  .dl-coords{display:none;}
}

/* ===== 安全区 ===== */
@supports (padding-bottom:env(safe-area-inset-bottom)){
  .content{padding-bottom:calc(64px + env(safe-area-inset-bottom));}
}

/* ===== 响应式增强 ===== */
@media (max-width: 360px){
  .status-bar{padding:0 10px;font-size:12px;height:28px;}
  .top-greet{padding:2px 12px 10px;}
  .greet-name{font-size:18px;}
  .greet-sub{font-size:12px;}
  .db-hero{padding:14px 12px 48px;border-radius:12px;}
  .db-stats-card{margin-top:-36px;border-radius:12px;}
  .dh-avatar{width:44px;height:44px;font-size:18px;}
  .dh-name{font-size:16px;}
  .section-title{font-size:14px;margin:10px 0 8px;}
  .section-title .st-bar{width:3px;height:12px;}
  .svc-item{padding:12px 3px 10px;}
  .svc-ico{width:36px;height:36px;border-radius:10px;}
  .svc-ico .ag-ico{width:19px;height:19px;}
  .svc-lbl{font-size:10px;}
  .tab-bar{height:54px;}
  .card{border-radius:12px;padding:12px;}
  .task-card{padding:10px;border-radius:12px;}
}

/* ===== 客服咨询聊天（用户端） ===== */
.page-chat .chat-header{display:flex;align-items:center;height:48px;background:linear-gradient(135deg,#1976d2,#64b5f6);color:#fff;padding:0 12px;}
.page-chat .chat-hd-left{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:22px;cursor:pointer;border-radius:50%;}
.page-chat .chat-hd-title{flex:1;text-align:center;font-size:16px;font-weight:600;}
.page-chat .chat-hd-right{width:32px;}
.page-chat .chat-messages{flex:1;overflow-y:auto;padding:12px;background:#f5f5f5;display:flex;flex-direction:column;gap:10px;}
.page-chat .chat-empty{align-self:center;color:#999;font-size:13px;padding:40px 0;text-align:center;}

.page-chat .cs-msg{max-width:75%;display:flex;flex-direction:column;}
.page-chat .cs-msg.mine{align-self:flex-end;align-items:flex-end;}
.page-chat .cs-msg.other{align-self:flex-start;align-items:flex-start;}
.page-chat .cs-time{font-size:10px;color:#aaa;margin-bottom:3px;padding:0 4px;}
.page-chat .cs-bubble{padding:8px 12px;border-radius:12px;font-size:14px;line-height:1.5;word-break:break-word;max-width:100%;}
.page-chat .cs-msg.mine .cs-bubble{background:#1976d2;color:#fff;border-bottom-right-radius:4px;}
.page-chat .cs-msg.other .cs-bubble{background:#fff;color:#333;border-bottom-left-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.06);}
.page-chat .cs-media img{max-width:200px;max-height:200px;border-radius:8px;cursor:zoom-in;display:block;}
.page-chat .cs-media video{max-width:260px;max-height:200px;border-radius:8px;background:#000;display:block;}
.page-chat .cs-file a{background:#fff;padding:8px 12px;border-radius:8px;border:1px solid #e0e0e0;color:#1976d2;text-decoration:none;font-size:13px;display:inline-block;}
.page-chat .cs-sys{align-self:center;margin:6px 0;}
.page-chat .cs-sys-msg{background:rgba(0,0,0,.08);color:#888;font-size:11px;padding:4px 12px;border-radius:10px;}

.page-chat .chat-input-bar{background:#fff;border-top:1px solid #eee;padding:8px 10px;}
.page-chat .chat-input-row{display:flex;gap:6px;align-items:flex-end;}
.page-chat .chat-input{flex:1;padding:8px 12px;border:1px solid #ddd;border-radius:20px;resize:none;font-size:14px;min-height:36px;max-height:120px;font-family:inherit;background:#f8f8f8;}
.page-chat .chat-input:focus{outline:none;border-color:#1976d2;background:#fff;}
.page-chat .chat-send{width:64px;height:36px;background:#1976d2;color:#fff;border:none;border-radius:18px;font-size:14px;cursor:pointer;flex-shrink:0;}
.page-chat .chat-send:disabled{background:#ccc;}
.page-chat .chat-send:not(:disabled):active{background:#1565c0;}

/* ==================== 浮动客服咨询 ==================== */
.cs-fab{
  position: fixed;
  right: max(16px, calc(50% - 210px + 16px));
  bottom: calc(80px + env(safe-area-inset-bottom));
  width: 52px; height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg,#1976d2,#64b5f6);
  color: #fff; border: none;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 16px rgba(25,118,210,.4), 0 2px 6px rgba(0,0,0,.15);
  cursor: pointer; z-index: 100;
  transition: transform .15s, box-shadow .15s;
}
.cs-fab:hover{ transform: scale(1.06); box-shadow: 0 6px 20px rgba(25,118,210,.5); }
.cs-fab:active{ transform: scale(.95); }
.cs-fab-badge{
  position: absolute; top: -4px; right: -4px;
  min-width: 20px; height: 20px;
  background: #f44336; color: #fff;
  font-size: 11px; font-weight: 700;
  border-radius: 10px; padding: 0 5px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.3);
}

.cs-panel{
  position: fixed; inset: 0; z-index: 200;
  background: rgba(0,0,0,.4);
  display: flex; flex-direction: column;
  opacity: 0; pointer-events: none;
  transform: translateY(100%);
  transition: opacity .25s ease, transform .3s cubic-bezier(.22,1,.36,1);
}
.cs-panel.open{ opacity: 1; pointer-events: auto; transform: translateY(0); }

.cs-panel-header{
  flex-shrink: 0;
  display: flex; align-items: center;
  height: 52px; padding: 0 12px;
  background: linear-gradient(135deg,#1976d2,#64b5f6);
  color: #fff;
}
.cs-hd-left{
  width: 36px; height: 36px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; border-radius: 50%;
  transition: background .15s;
}
.cs-hd-left:hover{ background: rgba(255,255,255,.15); }
.cs-hd-center{ flex: 1; text-align: center; min-width: 0; }
.cs-hd-title{ font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-hd-status{ font-size: 11px; opacity: .85; display: flex; align-items: center; justify-content: center; gap: 4px; margin-top: 2px; }
.cs-dot{ width: 7px; height: 7px; border-radius: 50%; background: #ffa726; display: inline-block; }
.cs-dot-on{ background: #66ff66; box-shadow: 0 0 4px #66ff66; }
.cs-dot-off{ background: #ff5252; }
.cs-hd-right{ flex-shrink: 0; }
.cs-hd-actions{
  font-size: 12px; padding: 4px 8px; border-radius: 12px;
  background: rgba(255,255,255,.15); cursor: pointer;
  transition: background .15s;
}
.cs-hd-actions:hover{ background: rgba(255,255,255,.3); }

.cs-panel-body{ flex: 1; overflow: hidden; display: flex; flex-direction: column; background: #f5f5f5; }
.cs-messages{ flex: 1; overflow-y: auto; padding: 12px 12px 8px; display: flex; flex-direction: column; gap: 8px; }

.cs-row{ display: flex; gap: 8px; max-width: 82%; align-items: flex-end; animation: csFadeIn .2s ease; }
@keyframes csFadeIn{ from{ opacity: 0; transform: translateY(6px); } to{ opacity: 1; transform: none; } }
.cs-row.mine{ align-self: flex-end; flex-direction: row-reverse; }
.cs-row.other{align-self: flex-start; }

.cs-avatar{
  width: 34px; height: 34px; flex-shrink: 0;
  border-radius: 50%;
  color: #fff; font-weight: 600; font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.12);
}
.cs-content{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cs-row.mine .cs-content{ align-items: flex-end; }
.cs-row.other .cs-content{align-items: flex-start; }

.cs-bubble{
  padding: 9px 13px; font-size: 14px; line-height: 1.5;
  border-radius: 14px; word-break: break-word; white-space: pre-wrap; max-width: 100%;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.cs-row.mine .cs-bubble{
  background: #1976d2; color: #fff;
  border-bottom-right-radius: 4px;
}
.cs-row.other .cs-bubble{
  background: #fff; color: #222;
  border-bottom-left-radius: 4px;
}

.cs-media img{ max-width: 220px; max-height: 220px; border-radius: 10px; cursor: zoom-in; display: block; }
.cs-media video{ max-width: 280px; max-height: 220px; border-radius: 10px; background: #000; display: block; }

.cs-time{ font-size: 10px; color: #999; padding: 0 4px; margin-top: 1px; }

.cs-sys{align-self: center; margin: 6px 0; }
.cs-sys-msg{ background: rgba(0,0,0,.06); color: #888; font-size: 11px; padding: 4px 12px; border-radius: 10px; }

.cs-date-sep{
  align-self: center;
  font-size: 10px; color: #aaa;
  background: rgba(0,0,0,.05);
  padding: 2px 10px; border-radius: 8px;
  margin: 4px 0;
}

.cs-empty{
  text-align: center; color: #999; font-size: 13px;
  padding: 30px 20px; display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.cs-empty-icon{ font-size: 40px; }
.cs-quick-row{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 6px; }
.cs-quick-btn{
  background: #fff; border: 1px solid #e0e0e0; color: #1976d2;
  padding: 6px 12px; border-radius: 14px; font-size: 13px; cursor: pointer;
  transition: background .15s, border-color .15s;
}
.cs-quick-btn:hover{ background: #e3f2fd; border-color: #bbdefb; }
.cs-retry-btn{
  background: #1976d2; color: #fff; border: none;
  padding: 6px 16px; border-radius: 14px; cursor: pointer; font-size: 13px;
}

.cs-panel-input{ flex-shrink: 0; background: #fff; border-top: 1px solid #eee; padding: 8px 10px; }
.cs-typing{ display: flex; align-items: center; gap: 6px; padding: 2px 4px 6px; color: #888; font-size: 12px; }
.cs-typing-dots{ display: flex; gap: 2px; }
.cs-typing-dots span{ width: 5px; height: 5px; background: #888; border-radius: 50%; animation: csDot 1.2s infinite; }
.cs-typing-dots span:nth-child(2){ animation-delay: .2s; }
.cs-typing-dots span:nth-child(3){ animation-delay: .4s; }
@keyframes csDot{ 0%,60%,100%{ opacity:.3; } 30%{ opacity:1; } }

.cs-attach-bar{ display: flex; align-items: center; gap: 8px; padding: 6px 8px; background: #fff3e0; border: 1px solid #ffe0b2; border-radius: 8px; margin-bottom: 6px; }
.cs-attach-item{ flex: 1; font-size: 13px; color: #e65100; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; min-width: 0; }
.cs-attach-item img { flex-shrink: 0; }
.cs-attach-cancel{ background: none; border: none; color: #e53935; cursor: pointer; font-size: 16px; padding: 2px 6px; border-radius: 4px; flex-shrink: 0; }
.cs-attach-cancel:hover{ background: #ffebee; }
.cs-upload-progress{ flex-shrink: 0; width: 80px; height: 4px; background: #e0e0e0; border-radius: 2px; overflow: hidden; }
.cs-upload-progress-fill{ height: 100%; background: #1976d2; border-radius: 2px; transition: width .15s linear, background-color .2s; }
.cs-upload-progress-text{ flex-shrink: 0; font-variant-numeric: tabular-nums; }

.cs-input-row{ display: flex; align-items: flex-end; gap: 8px; }
.cs-attach-btn{
  width: 36px; height: 36px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; border-radius: 50%;
  background: #f5f5f5; border: 1px solid #e0e0e0;
  color: #666; transition: all .15s;
}
.cs-attach-btn:hover{ background: #e3f2fd; border-color: #bbdefb; color: #1976d2; }

.cs-input{
  flex: 1; padding: 9px 14px; border: 1px solid #ddd; border-radius: 20px;
  resize: none; font-size: 14px; min-height: 36px; max-height: 120px;
  font-family: inherit; background: #f8f8f8; outline: none;
  transition: border-color .15s, background .15s;
}
.cs-input:focus{ border-color: #1976d2; background: #fff; }

.cs-send{
  flex-shrink: 0; height: 36px; padding: 0 18px;
  background: #1976d2; color: #fff; border: none; border-radius: 18px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  transition: background .15s;
}
.cs-send:hover:not(:disabled){ background: #1565c0; }
.cs-send:disabled{ background: #ccc; cursor: not-allowed; }

@media (max-width: 360px){
  .tc-id{font-size:11px;}
  .tc-route{font-size:13px;}
  .tc-reward{font-size:16px;}
  .hall-stats .hs-val{font-size:16px;}
  .hall-stats .hs-lbl{font-size:10px;}
  .dh-stats .ds-val{font-size:14px;}
  .dh-stats .ds-lbl{font-size:10px;}
  .milestone-bar{padding:8px 10px;}
  .ms-title{font-size:12px;}
  .ms-cur{font-size:10px;}
  .ms-gift .ic-gift{width:16px;height:16px;font-size:10px;}
  .ms-gift span{font-size:10px;}
  .ms-got{font-size:10px;}
  .top-hero{padding:12px;}
  .hero-title{font-size:13px;}
  .hero-val{font-size:22px;}
  .hero-sub{font-size:10px;}
  .step-bar .step{font-size:9px;}
  .step-bar .step .s-dot{width:18px;height:18px;font-size:9px;}
  .sat-card{padding:12px;}
  .sc-title{font-size:13px;}
  .coord-val{font-size:12px;}
  .coord-prec{font-size:10px;}
  .btn-brand{font-size:13px;padding:10px 14px;}
  .btn-sm{font-size:11px;padding:6px 10px;}
}

@media (max-width: 320px){
  .status-bar{font-size:11px;}
  .greet-name{font-size:16px;}
  .dh-avatar{width:40px;height:40px;font-size:16px;}
  .dh-name{font-size:15px;}
  .dh-loc{font-size:10px;padding:6px 10px;gap:6px;}
  .dsc-grid .ds-val{font-size:15px;}
  .svc-item{padding:11px 2px 9px;}
  .svc-ico{width:34px;height:34px;border-radius:10px;}
  .svc-ico .ag-ico{width:18px;height:18px;}
  .svc-lbl{font-size:10px;}
  .tab-bar{height:50px;}
  .card{padding:10px;border-radius:10px;}
  .task-card{padding:8px;}
  .tc-route{font-size:12px;}
  .tc-reward{font-size:14px;}
  .btn-brand{font-size:12px;padding:8px 12px;}
  .btn-sm{font-size:10px;padding:5px 8px;}
  .hero-val{font-size:20px;}
  .hero-sub{font-size:9px;}
}

/* ===== 语言选择器 ===== */
.lang-list{max-height:280px;overflow-y:auto;padding:4px 0;}
.lang-list .lang-item{
  padding:14px 16px;border-radius:10px;background:#f4f6fa;margin-bottom:8px;
  display:flex;align-items:center;font-size:15px;cursor:pointer;
  transition:all .15s ease;color:#1a1a1a;
}
.lang-list .lang-item:last-child{margin-bottom:0;}
.lang-list .lang-item:hover{background:#e3f2fd;}
.lang-list .lang-item.active{background:var(--brand,#1565c0);color:#fff;font-weight:600;}
.lang-list .lang-item span{margin-left:8px;}
@media (max-width: 360px){
  .lang-list .lang-item{padding:12px 14px;font-size:14px;}
}

/* ===== Tab 未读角标 ===== */
.tab-item{position:relative;}
.tab-badge{position:absolute;top:-2px;right:10px;min-width:16px;height:16px;padding:0 4px;background:#ff3b30;color:#fff;font-size:10px;font-weight:600;border-radius:8px;display:flex;align-items:center;justify-content:center;line-height:1;box-shadow:0 1px 3px rgba(255,59,48,0.4);}

/* ===== 客服Tab图标（对话气泡） ===== */
.tic-chat i{width:20px;height:16px;border:2px solid currentColor;border-radius:10px;position:absolute;top:3px;left:2px;}
.tic-chat i::before{content:'';position:absolute;bottom:-5px;left:6px;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(35deg);}
.tic-chat i::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:4px;background:currentColor;border-radius:50%;box-shadow:-6px 0 0 currentColor,6px 0 0 currentColor;}

/* ===== 客服咨询 · 微信风格独立页面 ===== */
/* ===== 客服聊天 · 微信风格 ===== */
/* 聊天页自身是 position:fixed 全屏 overlay，iOS Safari 无法滚动 fixed 元素 */
/* 配合 viewport meta 的 interactive-widget=resizes-content，iOS 15.4+ 会自动缩小可视区 */
#app:has(.page-chat.active) .tab-bar{display:none;}
/* 删除了 #app 的所有 fixed 处理，让它回归 normal flow */
/* 删除了 html/body 的所有锁定，让浏览器正常工作 */
.page-chat.active{
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  width:100%;
  z-index:100;
  padding:0;
  display:flex;
  flex-direction:column;
  background:#ededed;
  min-height:0;
}
/* 兼容 PC/桌面浏览器（没有 interactive-widget）：page-chat 在 .content 里时也能撑满 */
#app:has(.page-chat.active) .content{padding-bottom:0;overflow:hidden;}

/* 顶栏：扁平深色 */
.page-chat .chat-wx-header{display:flex;align-items:center;height:48px;background:#303030;color:#fff;padding:0 8px;flex-shrink:0;z-index:10;position:relative;}
.page-chat .chat-wx-back{width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;}
.page-chat .chat-wx-back:active{opacity:0.5;}
.page-chat .chat-wx-info{flex:1;text-align:center;min-width:0;padding:0 4px;}
.page-chat .chat-wx-title{font-size:16px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;}
.page-chat .chat-wx-status{display:flex;align-items:center;justify-content:center;gap:4px;font-size:11px;opacity:0.6;}
.page-chat .chat-wx-dot{width:6px;height:6px;border-radius:50%;background:#ff5252;flex-shrink:0;}
.page-chat .chat-wx-dot.on{background:#4caf50;}
.page-chat .chat-wx-dot.off{background:#9e9e9e;}
.page-chat .chat-wx-more{width:40px;height:40px;display:flex;align-items:center;justify-content:center;opacity:0.6;cursor:pointer;flex-shrink:0;}
.page-chat .chat-wx-more:active{opacity:1;}

/* 消息区 */
.page-chat .chat-wx-body{flex:1;min-height:0;overflow-y:auto;background:#ededed;padding:10px 12px 16px;display:flex;flex-direction:column;gap:16px;-webkit-overflow-scrolling:touch;}

/* 空状态 */
.page-chat .chat-wx-empty{align-self:center;max-width:260px;text-align:center;padding:40px 0;}
.page-chat .chat-wx-empty-icon{width:56px;height:56px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#d5d5d5;}
.page-chat .chat-wx-empty > div:nth-child(2){color:#999;font-size:13px;line-height:1.5;}
.page-chat .chat-wx-quick-row{display:flex;flex-direction:column;gap:8px;margin-top:20px;}
.page-chat .chat-wx-quick-btn{background:#fff;color:#333;border:none;padding:12px 16px;border-radius:8px;font-size:14px;cursor:pointer;font-family:inherit;transition:background .12s;text-align:left;}
.page-chat .chat-wx-quick-btn:active{background:#f0f0f0;}

/* 日期分隔 */
.page-chat .chat-wx-date-sep{align-self:center;color:#999;font-size:11px;background:rgba(0,0,0,0.08);padding:3px 10px;border-radius:4px;margin:4px 0;}

/* 系统消息 */
.page-chat .chat-wx-sys{align-self:center;margin:4px 0;}
.page-chat .chat-wx-sys-msg{background:rgba(0,0,0,0.08);color:#999;font-size:11px;padding:4px 12px;border-radius:4px;text-align:center;line-height:1.5;}

/* 消息行 */
.page-chat .chat-wx-row{display:flex;gap:8px;max-width:100%;align-items:flex-start;}
.page-chat .chat-wx-row.mine{flex-direction:row-reverse;justify-content:flex-start;}
.page-chat .chat-wx-row.other{flex-direction:row;}

/* 头像：方角微圆（微信风格） */
.page-chat .chat-wx-avatar{width:38px;height:38px;border-radius:4px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:500;}

/* 气泡内容容器 */
.page-chat .chat-wx-content{display:flex;flex-direction:column;gap:4px;max-width:calc(100% - 52px);}
.page-chat .chat-wx-row.mine .chat-wx-content{align-items:flex-end;}
.page-chat .chat-wx-row.other .chat-wx-content{align-items:flex-start;}

/* 气泡：扁平色 + 小尾巴 */
.page-chat .chat-wx-bubble{padding:9px 12px;border-radius:4px;font-size:15px;line-height:1.5;word-break:break-word;max-width:100%;position:relative;}
.page-chat .chat-wx-row.mine .chat-wx-bubble{background:#95ec69;color:#000;}
.page-chat .chat-wx-row.other .chat-wx-bubble{background:#fff;color:#333;}

/* 气泡小尾巴（三角形） */
.page-chat .chat-wx-row.mine .chat-wx-bubble::before{content:'';position:absolute;right:-5px;top:11px;border:5px solid transparent;border-left-color:#95ec69;border-right:0;}
.page-chat .chat-wx-row.other .chat-wx-bubble::before{content:'';position:absolute;left:-5px;top:11px;border:5px solid transparent;border-right-color:#fff;border-left:0;}

/* 媒体 */
.page-chat .chat-wx-media img{max-width:200px;max-height:200px;border-radius:4px;cursor:zoom-in;display:block;}
.page-chat .chat-wx-media video{max-width:240px;max-height:200px;border-radius:4px;background:#000;display:block;}

/* 时间戳 */
.page-chat .chat-wx-time{font-size:11px;color:#b0b0b0;padding:0 2px;}

/* 打字指示器 */
.page-chat .chat-wx-typing{align-self:flex-start;color:#999;font-size:12px;background:#fff;padding:9px 12px;border-radius:4px;display:flex;align-items:center;gap:6px;position:relative;}
.page-chat .chat-wx-typing::before{content:'';position:absolute;left:-5px;top:11px;border:5px solid transparent;border-right-color:#fff;border-left:0;}
.page-chat .chat-wx-typing-dots{display:flex;gap:3px;}
.page-chat .chat-wx-typing-dots span{width:6px;height:6px;background:#999;border-radius:50%;animation:wx-typing 1.2s infinite;}
.page-chat .chat-wx-typing-dots span:nth-child(2){animation-delay:.2s;}
.page-chat .chat-wx-typing-dots span:nth-child(3){animation-delay:.4s;}
@keyframes wx-typing{0%,60%,100%{opacity:0.3;transform:translateY(0);}30%{opacity:1;transform:translateY(-3px);}}

/* 输入区 */
.page-chat .chat-wx-input-area{flex-shrink:0;background:#f5f5f5;border-top:1px solid #ddd;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));}
.page-chat .chat-wx-attach-bar{display:flex;align-items:center;gap:8px;background:#fff;border-radius:4px;padding:8px 10px;margin-bottom:6px;border:1px solid #ddd;}
.page-chat .chat-wx-attach-item{font-size:13px;color:#333;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:6px;}
.page-chat .chat-wx-upload-progress{flex:1;height:4px;background:#e0e0e0;border-radius:2px;overflow:hidden;}
.page-chat .chat-wx-upload-progress-fill{height:100%;background:#07c160;border-radius:2px;width:0%;transition:width .15s;}
.page-chat .chat-wx-attach-cancel{background:none;border:none;color:#999;font-size:18px;cursor:pointer;padding:0 4px;flex-shrink:0;}

.page-chat .chat-wx-input-row{display:flex;gap:6px;align-items:flex-end;}
.page-chat .chat-wx-attach-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:#555;cursor:pointer;flex-shrink:0;align-self:flex-end;margin-bottom:4px;}
.page-chat .chat-wx-attach-btn:active{color:#07c160;}
.page-chat .chat-wx-input{flex:1;padding:8px 10px;border:1px solid #ddd;border-radius:4px;resize:none;font-size:15px;min-height:36px;max-height:120px;font-family:inherit;background:#fff;line-height:1.4;}
.page-chat .chat-wx-input:focus{outline:none;border-color:#07c160;}
.page-chat .chat-wx-send{min-width:48px;height:36px;padding:0 14px;background:#07c160;color:#fff;border:none;border-radius:4px;font-size:15px;cursor:pointer;flex-shrink:0;font-family:inherit;font-weight:400;transition:opacity .12s;align-self:flex-end;}
.page-chat .chat-wx-send:disabled{background:#ddd;color:#999;cursor:not-allowed;}
.page-chat .chat-wx-send:not(:disabled):active{opacity:0.7;}

/* ===== Auth V3 · 深空科技风登录（2026-09-07） ===== */
/* 背景：深空渐变 + 雷达光晕 */
.auth-wrap{
  background:
    radial-gradient(ellipse 120% 60% at 50% -10%, rgba(41,182,246,.16), transparent 60%),
    radial-gradient(ellipse 100% 50% at 50% 112%, rgba(13,71,161,.38), transparent 62%),
    linear-gradient(165deg,#04080f 0%,#071426 40%,#0a2140 75%,#0d2b52 100%);
}
/* 与 iOS/安卓原生启动图(splash/*.png #0a0e17+顶部青光晕)保持一致，消除启动瞬间色差 */
.splash{background:#0a0e17 radial-gradient(120% 60% at 50% 0%, rgba(0,110,160,.18) 0%, rgba(10,14,23,0) 62%);}

/* 科技网格（径向蒙版，中心清晰边缘消散） */
.auth-bg::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(79,195,247,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79,195,247,.06) 1px, transparent 1px);
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 95% 75% at 50% 38%, #000 25%, transparent 78%);
  mask-image:radial-gradient(ellipse 95% 75% at 50% 38%, #000 25%, transparent 78%);
}
/* 顶部扫描光带 */
.auth-bg::after{
  content:'';position:absolute;left:0;right:0;top:0;height:190px;pointer-events:none;
  background:linear-gradient(180deg, rgba(79,195,247,.14), transparent);
  animation:scanGlow 5s ease-in-out infinite;
}
@keyframes scanGlow{0%,100%{opacity:.35}50%{opacity:1}}

/* 原圆形装饰 → 雷达光晕 */
.bg-circle.c1{background:radial-gradient(circle, rgba(79,195,247,.12), transparent 70%);animation:haloDrift 9s ease-in-out infinite;}
.bg-circle.c2{background:radial-gradient(circle, rgba(21,101,192,.20), transparent 70%);animation:haloDrift 12s ease-in-out infinite reverse;}
.bg-circle.c3{background:radial-gradient(circle, rgba(79,195,247,.09), transparent 70%);}
@keyframes haloDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-14px,10px) scale(1.08)}}

/* 品牌 Logo：深空星舰风 + 呼吸发光 */
.mini-logo{
  width:72px;height:72px;border-radius:18px;
  animation:logoBreath 3s ease-in-out infinite;
  filter:drop-shadow(0 6px 20px rgba(0,212,255,0.5));
}
@keyframes logoBreath{
  0%,100%{box-shadow:0 0 0 1px rgba(79,195,247,.4), 0 0 16px rgba(79,195,247,.35), 0 8px 24px rgba(0,0,0,.4);}
  50%{box-shadow:0 0 0 1px rgba(79,195,247,.6), 0 0 34px rgba(79,195,247,.6), 0 8px 24px rgba(0,0,0,.4);}
}
/* 标题渐变文字 */
.auth-header h1{
  font-size:26px;letter-spacing:6px;
  background:linear-gradient(90deg,#e3f2fd 0%,#4dd0e1 50%,#e3f2fd 100%);
  background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:titleFlow 4s linear infinite;
}
@keyframes titleFlow{0%{background-position:0% 0}100%{background-position:200% 0}}
.auth-header p{color:rgba(148,210,255,.55);letter-spacing:2.5px;}

/* 语言按钮：深色玻璃 */
.auth-lang-btn{background:rgba(3,12,24,.5);border-color:rgba(79,195,247,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.auth-lang-btn:hover{background:rgba(79,195,247,.18);}

/* 卡片：深色玻璃 + 顶部发光线 + HUD 角标 */
.auth-form{
  background:linear-gradient(160deg, rgba(13,40,74,.72), rgba(7,20,38,.80));
  border:1px solid rgba(79,195,247,.18);
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(148,210,255,.12);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  position:relative;
}
.auth-form::before{
  content:'';position:absolute;top:0;left:12%;right:12%;height:2px;border-radius:2px;
  background:linear-gradient(90deg, transparent, #4dd0e1, transparent);
  opacity:.85;pointer-events:none;
}
.auth-form::after{
  content:'';position:absolute;top:-1px;left:-1px;width:26px;height:26px;
  border-top:2px solid #4dd0e1;border-left:2px solid #4dd0e1;
  border-top-left-radius:20px;opacity:.9;pointer-events:none;
}

/* 输入框：深色内嵌 + 青色聚焦发光 */
.av2-label{color:rgba(148,210,255,.6);}
.av2-input-row,.av2-phone{background:rgba(3,12,24,.55);border:1px solid rgba(79,195,247,.14);}
.av2-input-row:focus-within,.av2-phone:focus-within{
  background:rgba(3,12,24,.75);
  border-color:rgba(79,195,247,.65);
  box-shadow:0 0 0 3px rgba(79,195,247,.15), 0 0 18px rgba(79,195,247,.14);
}
.av2-input-row select option,.av2-phone .av2-prefix option{background:#002a6c;color:#fff;}
.av2-phone .av2-prefix{border-right-color:rgba(79,195,247,.14);}
.av2-phone-hint{color:#ffb74d;}
.av2-loc-title{color:rgba(148,210,255,.85);}
.av2-loc-title::before{background:#4dd0e1;}

/* 登录按钮：青蓝渐变 + 流光扫过 */
.av2-btn{
  background:linear-gradient(135deg,#33c1ff,#0288d1);
  color:#fff;letter-spacing:6px;
  box-shadow:0 8px 24px rgba(2,136,209,.45), inset 0 1px 0 rgba(255,255,255,.25);
  position:relative;overflow:hidden;
}
.av2-btn::before{
  content:'';position:absolute;top:0;left:-80%;width:60%;height:100%;pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  animation:btnShine 2.8s ease-in-out infinite;
}
@keyframes btnShine{0%{left:-80%}55%{left:130%}100%{left:130%}}
.av2-btn:active{transform:scale(0.97);box-shadow:0 4px 12px rgba(2,136,209,.4);}

/* 一键定位按钮：紧凑青蓝胶囊 */
.reg-locate-btn{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(79,195,247,.5);background:rgba(2,136,209,.18);color:#b3e5fc;padding:6px 13px;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit;white-space:nowrap;}
.reg-locate-btn .rlb-ic{font-size:12px;}
.reg-locate-btn:active{transform:scale(0.94);background:rgba(2,136,209,.4);}
.reg-locate-btn:disabled{opacity:.55;cursor:wait;}
.reg-locate-btn.loc-ok{border-color:rgba(129,199,132,.8);background:rgba(46,125,50,.18);color:#c8e6c9;}

/* ===== 围栏拦截卡（超出注册地县级） ===== */
.fence-block-card{background:linear-gradient(160deg,rgba(255,110,64,.12),rgba(198,40,40,.10));border:1px solid rgba(255,138,101,.45);border-radius:16px;padding:22px 18px 18px;margin-bottom:14px;text-align:center;box-shadow:0 10px 30px rgba(198,40,40,.15);}
.fbc-icon{font-size:40px;line-height:1;margin-bottom:10px;}
.fbc-title{font-size:17px;font-weight:800;color:#ff8a65;margin-bottom:8px;}
.fbc-msg{font-size:13px;color:rgba(255,205,210,.92);line-height:1.7;margin-bottom:14px;}
.fbc-rows{background:rgba(6,16,32,.35);border-radius:12px;padding:10px 12px;margin-bottom:12px;text-align:left;}
.fbc-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:5px 0;color:#b0bec5;}
.fbc-row b{color:#e1f5fe;font-weight:700;text-align:right;}
.fbc-tip{font-size:12px;color:#ffcc80;line-height:1.6;margin-bottom:14px;}
.fbc-btns{display:flex;gap:10px;}
.fbc-btn{flex:1;border:1px solid rgba(148,210,255,.35);background:rgba(148,210,255,.08);color:#b3e5fc;padding:11px 8px;border-radius:11px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit;}
.fbc-btn:active{transform:scale(.95);}
.fbc-btn-primary{background:linear-gradient(135deg,#29b6f6,#0277bd);border-color:transparent;color:#fff;box-shadow:0 6px 16px rgba(2,119,189,.35);}
.fence-keep-tip{font-size:12px;color:#90caf9;text-align:center;margin:4px 0 10px;font-weight:700;}

/* 我的页：申请更改位置入口 */
.mine-change-loc-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:12px;padding:9px 12px;border-radius:11px;border:1px dashed rgba(148,210,255,.45);background:rgba(148,210,255,.08);color:#b3e5fc;font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit;box-sizing:border-box;}
.mine-change-loc-btn:active{transform:scale(.97);background:rgba(148,210,255,.2);}

/* ===== PWA 一键安装横幅（深空科技2.0深色） ===== */
.pwa-install-banner{display:flex;align-items:center;gap:12px;padding:13px 14px;margin:0 0 14px;border-radius:14px;background:linear-gradient(135deg,rgba(34,211,238,.16),rgba(59,130,246,.10));border:1px solid rgba(34,211,238,.42);box-shadow:0 4px 18px rgba(8,145,178,.20);}
.pwa-install-banner .pib-ico{font-size:26px;line-height:1;flex-shrink:0;filter:drop-shadow(0 0 6px rgba(34,211,238,.55));}
.pwa-install-banner .pib-txt{flex:1;min-width:0;}
.pwa-install-banner .pib-title{font-size:14px;font-weight:700;color:#e6f0ff;}
.pwa-install-banner .pib-sub{font-size:11px;color:#9fb3d1;margin-top:2px;line-height:1.45;}
.pwa-install-banner .pib-btn{flex-shrink:0;padding:8px 16px;border-radius:10px;border:none;background:linear-gradient(135deg,#22d3ee,#0891b2);color:#062035;font-size:13px;font-weight:800;cursor:pointer;transition:all .15s;font-family:inherit;box-shadow:0 4px 12px rgba(8,145,178,.42);}
.pwa-install-banner .pib-btn:active{transform:scale(.95);filter:brightness(1.08);}
.pwa-install-banner .pib-close{flex-shrink:0;width:24px;height:24px;border-radius:50%;border:none;background:rgba(159,179,209,.15);color:#9fb3d1;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.pwa-install-banner .pib-close:active{transform:scale(.9);}

/* ===== PWA iOS「添加到主屏幕」引导浮层（深空科技2.0深色） ===== */
.pwa-ios-guide{position:fixed;inset:0;z-index:9999;background:rgba(5,10,25,.82);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:0 20px 30px;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;}
.pwa-ios-guide.show{opacity:1;visibility:visible;}
.pwa-ios-guide .pig-arrow{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:18px solid #22d3ee;filter:drop-shadow(0 0 10px rgba(34,211,238,.65));animation:pigBounce 1.4s ease-in-out infinite;}
@keyframes pigBounce{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(-8px);}}
.pwa-ios-guide .pig-card{position:relative;width:100%;max-width:340px;padding:20px 18px 16px;border-radius:16px;background:linear-gradient(135deg,rgba(22,35,63,.96),rgba(13,22,44,.96));border:1px solid rgba(34,211,238,.42);box-shadow:0 10px 40px rgba(0,0,0,.55);}
.pwa-ios-guide .pig-title{font-size:15px;font-weight:700;color:#e6f0ff;margin-bottom:14px;text-align:center;}
.pwa-ios-guide .pig-step{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;}
.pwa-ios-guide .pig-num{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#22d3ee,#0891b2);color:#062035;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:1px;}
.pwa-ios-guide .pig-step-txt{flex:1;font-size:13px;color:#e6f0ff;line-height:1.55;}
.pwa-ios-guide .pig-step-txt b{color:#22d3ee;}
.pwa-ios-guide .pig-share-ico{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin:0 2px;color:#22d3ee;}
.pwa-ios-guide .pig-btn{width:100%;margin-top:6px;padding:11px;border-radius:11px;border:none;background:linear-gradient(135deg,#22d3ee,#0891b2);color:#062035;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;}
.pwa-ios-guide .pig-btn:active{transform:scale(.97);}

/* 切换链接 / 记住密码 */
.av2-switch{color:rgba(148,210,255,.5);}
.av2-switch a{color:#4dd0e1;}
.av2-remember{color:rgba(148,210,255,.5);}
.av2-remember input{accent-color:#29b6f6;}

/* ===== Auth V3.1 · 融合度与多语言适配修正 ===== */
/* 1) 卡片与背景融合：降低不透明度、弱化边界与装饰线 */
.auth-form{
  background:linear-gradient(160deg, rgba(10,30,58,.40), rgba(6,16,32,.52));
  border:1px solid rgba(148,210,255,.10);
  box-shadow:0 16px 44px rgba(0,0,0,.38), inset 0 1px 0 rgba(148,210,255,.08);
}
.auth-form::before{left:22%;right:22%;opacity:.55;}
.auth-form::after{opacity:.55;border-color:rgba(148,210,255,.55);}

/* 2) 手机号前缀：任意语言都不溢出，输入区不被挤压 */
.av2-phone .av2-prefix{
  min-width:0;width:auto;max-width:48%;
  font-size:14px;letter-spacing:0;
  padding:0 22px 0 10px;background-position:right 6px center;
  text-overflow:ellipsis;overflow:hidden;
}
.av2-phone .av2-phone-input{min-width:0;}

/* ===== Auth V3.2 · 无卡片一体化 + 区号协调 ===== */
/* 1) 取消卡片容器：表单直接融在背景上，无边界/无角标/无光线 */
.auth-form{
  background:transparent;
  border:none;
  box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.auth-form::before,.auth-form::after{content:none;}

/* 2) 区号显示协调：字号收敛、色调统一、分隔线更轻 */
.av2-phone .av2-prefix{
  font-size:14px;
  color:rgba(210,235,255,.85);
  letter-spacing:0;
  padding:0 20px 0 12px;
  background-position:right 5px center;
  border-right:1px solid rgba(148,210,255,.10);
}
.av2-phone .av2-phone-input{font-size:15px;}
.av2-phone .av2-phone-input::placeholder{font-size:15px;}

/* ===== Auth V3.3 · 自动填充一体化 + 区号紧凑 ===== */
/* 1) 浏览器自动填充(密码/手机号)不再变白色块，保持深色融合 */
.av2-input-row input:-webkit-autofill,
.av2-phone input:-webkit-autofill,
.av2-input-row input:-webkit-autofill:hover,
.av2-input-row input:-webkit-autofill:focus,
.av2-phone input:-webkit-autofill:hover,
.av2-phone input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px rgba(8,22,42,.95) inset;
  box-shadow:0 0 0 1000px rgba(8,22,42,.95) inset;
  -webkit-text-fill-color:#e3f2fd;
  caret-color:#4dd0e1;
  transition:background-color 99999s ease-in-out 0s;
}
/* 2) 区号前缀更紧凑：字号收敛、箭头贴近文字、与输入行同高对齐 */
.av2-phone .av2-prefix{
  height:52px;line-height:52px;
  font-size:14px;
  color:rgba(210,235,255,.88);
  padding:0 18px 0 14px;
  background-position:right 5px center;
  border-right:1px solid rgba(148,210,255,.10);
}

/* ============================================================
   PWA standalone（iOS「添加到主屏幕」/ 安卓安装后全屏启动）安全区适配
   仅在全屏模式(.app-standalone)下生效，普通浏览器访问零影响。
   配合 viewport-fit=cover：让顶部元素自身背景延伸进刘海/状态栏，
   内容不被时间、灵动岛、信号遮挡；底部避开 Home 指示条。
   ============================================================ */
/* 普通页白底顶部状态栏：高度随安全区增高 */
.app-standalone .status-bar{
  height:auto;
  min-height:calc(46px + env(safe-area-inset-top,0px));
  padding-top:env(safe-area-inset-top,0px);
}
/* 我的页深绿头部卡：渐变延伸进状态栏，全屏下去掉顶部圆角避免两侧露白 */
.app-standalone .db-hero{
  padding-top:env(safe-area-inset-top,0px);
  border-top-left-radius:0;
  border-top-right-radius:0;
}
/* 客服页深灰顶栏 */
.app-standalone .page-chat .chat-wx-header{
  height:auto;
  min-height:calc(48px + env(safe-area-inset-top,0px));
  padding-top:env(safe-area-inset-top,0px);
}
/* 登录/注册深色页：内容整体下推，背景由 .auth-bg 自然延伸铺满 */
.app-standalone .auth-body{
  padding-top:calc(40px + env(safe-area-inset-top,0px));
}
.app-standalone .auth-lang-btn{
  top:calc(16px + env(safe-area-inset-top,0px));
}
/* 底部 Tab 栏：避开 Home 指示条（height 改 min-height，防止 border-box 下图标被压缩） */
.app-standalone .tab-bar{
  height:auto;
  min-height:calc(62px + env(safe-area-inset-bottom,0px));
}

/* ################################################################
   深空科技 2.0 · 统一深色主题覆盖层（2026-09-20）
   所有规则以 #app 提升优先级，覆盖上方浅色卡片风旧规则。
   组件库：表面 / 文本 / 按钮 / 输入 / 导航 / 卡片 / 弹窗 / 聊天 / 地图浮层
   ################################################################ */

/* ===== 1. 页面表面与通用文本 ===== */
#app .page{background:transparent;color:var(--text);}
#app .content{background:transparent;}
#app .status-bar{background:transparent;border-bottom:none;color:var(--text2);}
#app .status-bar .time{color:var(--text);}
#app .status-bar .status-title{color:var(--brand-l);}
#app .top-greet{background:transparent;border-bottom:none;color:var(--text);}
#app .tg-info .tg-sub{color:var(--text3);}
#app:has(#page-hall.active) .status-bar{background:transparent !important;border-bottom:none !important;color:var(--text3) !important;}
#app:has(#page-hall.active) .status-bar .time{color:var(--text2) !important;}
#app:has(#page-hall.active) .status-bar .status-title{color:var(--brand-l) !important;}
#app:has(#page-hall.active) .top-greet{background:transparent !important;border-bottom:none !important;}
#app:has(#page-hall.active) .top-greet .tg-sub{color:var(--text3) !important;}
#app .section-title{color:var(--text);}
#app .section-title .st-bar{background:linear-gradient(180deg,#22d3ee,#3b82f6);box-shadow:0 0 8px rgba(34,211,238,.55);}
#app #page-profile .panel-section .section-title{color:var(--text);}
#app #page-profile .panel-section .section-title .st-bar{background:linear-gradient(180deg,#22d3ee,#3b82f6);box-shadow:none;}
#app #page-profile .panel-section{border-color:var(--border-soft) !important;}

/* ===== 2. 底部 Tab：深色玻璃 + 青色辉光 ===== */
#app .tab-bar{
  background:rgba(8,14,30,.92);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-top:1px solid rgba(56,189,248,.14);
  box-shadow:0 -6px 24px rgba(2,8,26,.6),0 -1px 0 rgba(56,189,248,.08);
}
#app .tab-item{color:#5b6f92;}
#app .tab-item.active{color:#22d3ee;text-shadow:0 0 10px rgba(34,211,238,.65);}
#app .tab-item .ticon{color:#5b6f92;}
#app .tab-item.active .ticon{color:#22d3ee;}
#app .tab-item.active::before{
  content:'';position:absolute;top:0;width:30px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,transparent,#22d3ee,transparent);
  box-shadow:0 0 10px #22d3ee;
}
#app .tic-home i::after{background:#0a1128;}
#app .tic-hall i::before{background:#0a1128;}
#app .tab-item.active .tic-home i::after{background:#22d3ee;}
#app .signal-icon span{background:#5b6f92;}
#app .signal-icon.s-none span{background:#5b6f92;}

/* ===== 3. 按钮体系 ===== */
#app .btn-brand{
  background:linear-gradient(135deg,#22d3ee 0%,#0891b2 45%,#2563eb 100%);
  color:#fff;letter-spacing:2px;
  box-shadow:0 4px 16px rgba(8,145,178,.42),0 2px 4px rgba(2,8,26,.5),inset 0 1px 0 rgba(255,255,255,.28);
}
#app .btn-brand:active{
  box-shadow:0 1px 4px rgba(8,145,178,.35),inset 0 3px 10px rgba(2,8,26,.45),inset 0 0 0 1px rgba(255,255,255,.12);
}
#app .btn-outline{
  background:rgba(34,211,238,.06);color:#22d3ee;border:1.5px solid rgba(34,211,238,.45);
  box-shadow:none;
}
#app .btn-outline:active{background:rgba(34,211,238,.16);box-shadow:inset 0 2px 6px rgba(2,8,26,.4);}
#app .btn-ghost{
  background:rgba(148,197,255,.07);color:var(--text2);border:1px solid var(--border);
}
#app .btn-ghost:active{background:rgba(148,197,255,.14);}
#app .btn-logout-big{
  background:linear-gradient(135deg,#ef4444,#b91c1c);
  box-shadow:0 6px 20px rgba(239,68,68,.32);
}
#app .btn-logout-big:active{box-shadow:0 2px 8px rgba(239,68,68,.28);}
#app .toast-success{background:rgba(8,145,178,.95);border-color:rgba(34,211,238,.5);box-shadow:0 6px 24px rgba(8,145,178,.45);}

/* ===== 4. 通用卡片表面 ===== */
#app .card,
#app .task-card,
#app .milestone-bar,
#app .steps-card,
#app .nav-header,
#app .speed-panel,
#app .data-stream,
#app .drive-status-card,
#app .ip-info-card,
#app .upload-card,
#app .sg-card,
#app .earn-card,
#app .history-card,
#app .svc-card,
#app .home-empty{
  background:linear-gradient(160deg,rgba(24,38,69,.82),rgba(13,22,44,.86));
  border:1px solid var(--border);
  box-shadow:var(--sh-card);
  color:var(--text);
}
#app .task-card:hover,
#app .task-card:active{box-shadow:var(--sh-card-hover);border-color:rgba(56,189,248,.35);}
#app .avatar{
  background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(59,130,246,.22));
  border:2px solid rgba(103,232,249,.45);color:#67e8f9;
  box-shadow:0 2px 10px rgba(6,182,212,.25);
}

/* ===== 5. Hero 渐变卡（首页/接单/导航头部） ===== */
#app .card.hero{
  background:linear-gradient(135deg,#082f49 0%,#0e4a6e 48%,#1e3a8a 100%);
  border:1px solid rgba(56,189,248,.25);
  box-shadow:0 10px 30px rgba(2,8,26,.6),inset 0 1px 0 rgba(148,210,255,.14);
}
#app .hero-bg{
  background:
    radial-gradient(circle at 82% -10%,rgba(34,211,238,.28),transparent 55%),
    radial-gradient(circle at 0% 110%,rgba(59,130,246,.30),transparent 52%);
}
#app .hero-side{background:rgba(5,12,28,.38);border-top:1px solid rgba(148,210,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
#app .db-hero{
  background:linear-gradient(135deg,#082f49 0%,#0c4a6e 45%,#1e3a8a 100%);
  border:1px solid rgba(56,189,248,.22);
  box-shadow:0 12px 34px rgba(2,8,26,.6),inset 0 1px 0 rgba(148,210,255,.14);
}
#app .db-hero::before{background:radial-gradient(circle,rgba(34,211,238,.14),transparent 70%);}
#app .db-hero::after{background:linear-gradient(to bottom,rgba(34,211,238,.10),transparent);}
#app .card.mine-hero{
  background:linear-gradient(135deg,#082f49 0%,#0e4a6e 50%,#1e3a8a 100%);
  border:1px solid rgba(56,189,248,.22);
  box-shadow:0 12px 34px rgba(2,8,26,.6),inset 0 1px 0 rgba(148,210,255,.14);
}
#app .mine-h-row,
#app .dh-loc{background:rgba(5,12,28,.38);border:1px solid rgba(148,210,255,.14);}

/* 今日数据浮卡：深色玻璃 */
#app .db-stats-card{background:linear-gradient(180deg,rgba(16,28,53,.96),rgba(11,20,40,.96));border:none;}
#app .dsc-grid .ds-val,
#app .ds-grid .ds-val,
#app .sg-card .sg-num{color:var(--text);}
#app .dsc-grid .ds-cell.hl .ds-val{color:#22d3ee;text-shadow:0 0 14px rgba(34,211,238,.45);}
#app .dsc-progress{border-top:1px solid var(--border-soft);}
#app .dsc-pg-val b{color:#22d3ee;}
#app .dsc-pg-bar,
#app .ms-track,
#app .nh-track,
#app .mt-progress,
#app .tc-progress .tp-bar{background:#101d36;}
#app .dsc-pg-fill{background:linear-gradient(90deg,#22d3ee,#3b82f6);box-shadow:0 0 8px rgba(34,211,238,.5);}

/* ===== 6. 定位栏 ===== */
#app .location-bar{
  background:linear-gradient(160deg,rgba(24,38,69,.85),rgba(13,22,44,.88));
  border:1px solid var(--border);
  box-shadow:var(--sh-card);
}
#app .lb-ico{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322d3ee' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5S5.5 14.8 5.5 9.5a6.5 6.5 0 1 1 13 0c0 5.3-6.5 12-6.5 12z'/%3E%3Ccircle cx='12' cy='9.5' r='2.2'/%3E%3C/svg%3E") !important;
}
#app .lb-text{color:var(--text2);}
#app .lb-text b{color:#22d3ee;}
#app .lb-sub{color:var(--text3);}

/* ===== 7. 任务大厅：任务卡状态体系 ===== */
#app .tc-route{color:var(--text);}
#app .tc-route .route-arrow{color:#22d3ee;}
#app .task-card.tc-taken .tc-route{color:#a5f3fc;}
#app .task-card::before{background:#22d3ee;}
#app .task-card.tc-done::before{background:#5b6f92;}
#app .task-card.tc-going::before{background:#fbbf24;}
#app .task-card.tc-collecting::before{background:#d946ef;}
#app .task-card.tc-uploaded::before{background:#8b5cf6;}
#app .task-card.tc-taken{
  background:linear-gradient(135deg,rgba(34,211,238,.09),rgba(13,22,44,.86) 42%);
  border-color:rgba(34,211,238,.4);
  box-shadow:0 2px 14px rgba(8,145,178,.18),var(--sh-card);
}
#app .task-card.tc-taken::before{background:linear-gradient(180deg,#22d3ee,#0891b2);}
#app .task-card.tc-going{
  background:linear-gradient(135deg,rgba(251,191,36,.08),rgba(13,22,44,.86) 42%);
  border-color:rgba(251,191,36,.35);
  box-shadow:0 2px 14px rgba(180,120,20,.14),var(--sh-card);
}
#app .task-card.tc-going::before{background:linear-gradient(180deg,#fbbf24,#d97706);}
#app .task-card.tc-collecting{
  background:linear-gradient(135deg,rgba(217,70,239,.08),rgba(13,22,44,.86) 42%);
  border-color:rgba(217,70,239,.32);
}
#app .task-card.tc-collecting::before{background:linear-gradient(180deg,#d946ef,#a21caf);}
@keyframes tcTakenFlashDark{
  0%{box-shadow:0 0 0 0 rgba(34,211,238,.55),0 4px 20px rgba(8,145,178,.3);transform:scale(1.02);border-color:#22d3ee;}
  30%{box-shadow:0 0 0 12px rgba(34,211,238,0),0 4px 20px rgba(8,145,178,.2);transform:scale(1.01);}
  100%{box-shadow:0 2px 14px rgba(8,145,178,.18),var(--sh-card);transform:scale(1);border-color:rgba(34,211,238,.4);}
}
#app .task-card.tc-just-taken{animation:tcTakenFlashDark 1.6s ease-out, tc-taken-pulse 2s ease-out infinite;}
@keyframes tc-taken-pulse{
  0%,100%{box-shadow:0 2px 14px rgba(8,145,178,.16),var(--sh-card);}
  50%{box-shadow:0 2px 22px rgba(8,145,178,.3),var(--sh-card);}
}
#app .task-card.tc-taken .tc-badge{background:linear-gradient(135deg,#0891b2,#22d3ee);color:#04141c;box-shadow:0 2px 8px rgba(8,145,178,.35);}
#app .task-card.tc-going .tc-badge{background:linear-gradient(135deg,#d97706,#fbbf24);color:#1a1206;box-shadow:0 2px 8px rgba(217,119,6,.3);}
#app .task-card.tc-collecting .tc-badge{background:linear-gradient(135deg,#a21caf,#d946ef);color:#fff;box-shadow:0 2px 8px rgba(162,28,175,.3);}
#app .tb-avail{background:rgba(52,211,153,.14);color:#34d399;}
#app .tb-taken{background:rgba(34,211,238,.13);color:#22d3ee;}
#app .tb-going{background:rgba(251,191,36,.14);color:#fbbf24;}
#app .tb-collecting{background:rgba(217,70,239,.14);color:#e879f9;}
#app .tb-uploaded{background:rgba(139,92,246,.15);color:#a78bfa;}
#app .tb-done{background:rgba(148,163,184,.14);color:#94a3b8;}
#app .tm-len.len-50{background:rgba(217,70,239,.13);color:#e879f9;}
#app .tm-len.len-30{background:rgba(251,191,36,.13);color:#fbbf24;}
#app .tm-len.len-20{background:rgba(250,204,21,.12);color:#fcd34d;}
#app .tm-len.len-10{background:rgba(52,211,153,.12);color:#34d399;}
#app .tm-len.len-5{background:rgba(34,211,238,.12);color:#22d3ee;}
#app .tc-meta .tc-reward,
#app .ec-amount,
#app .hc-reward{color:#22d3ee;text-shadow:0 0 12px rgba(34,211,238,.25);}
#app .task-card.tc-taken .tc-reward{color:#22d3ee;}
#app .task-card.tc-taken .tc-progress .tp-bar{background:#10233a;}
#app .task-card.tc-taken .tc-progress .tp-fill,
#app .tc-progress .tp-fill,
#app .ms-fill,
#app .nh-track i,
#app .mt-progress i{background:linear-gradient(90deg,#22d3ee,#3b82f6);}
#app .tc-progress .tp-bar,
#app .milestone-bar.completed .ms-fill{background:#101d36;}
#app .milestone-bar.completed .ms-fill{background:linear-gradient(90deg,#f59e0b,#fbbf24);}
#app .ms-title,
#app .hc-title,
#app .ec-left{color:var(--text);}
#app .ms-cur,
#app .ms-gift,
#app .ms-gift .ic-gift{color:#22d3ee;}
#app .ms-got{color:var(--text4);}
#app .ms-got.active{color:#34d399;}
#app .ms-foot,
#app .ec-date,
#app .ec-type,
#app .hc-date,
#app .h-lbl,
#app .es-txt,
#app .empty-inline,
#app .logout-tip{color:var(--text3);}

/* ===== 8. 首页：服务宫格 / IP 卡 / 空状态 ===== */
#app .svc-card{border-top:1px solid rgba(56,189,248,.3);}
#app .svc-item:not(:nth-child(3n))::after{background:var(--border-soft);}
#app .svc-item:nth-child(n+4)::before{background:var(--border-soft);}
#app .svc-item:active{background:rgba(34,211,238,.08);}
#app .svc-item.danger:active{background:rgba(248,113,113,.1);}
#app .svc-lbl{color:var(--text2);}
#app .svc-item.danger .svc-lbl{color:#f87171;}
#app .svc-ico.o{background:rgba(251,146,60,.13);}
#app .svc-ico.o .ag-ico{color:#fb923c;}
#app .svc-ico.b,
#app .svc-ico.s{background:rgba(34,211,238,.12);}
#app .svc-ico.b .ag-ico,
#app .svc-ico.s .ag-ico{color:#22d3ee;}
#app .svc-ico.p{background:rgba(139,92,246,.14);}
#app .svc-ico.p .ag-ico{color:#a78bfa;}
#app .svc-ico.t{background:rgba(96,165,250,.13);}
#app .svc-ico.t .ag-ico{color:#60a5fa;}
#app .svc-ico.l{background:rgba(45,212,191,.12);}
#app .svc-ico.l .ag-ico{color:#2dd4bf;}
#app .svc-ico.g{background:rgba(148,163,184,.12);}
#app .svc-ico.g .ag-ico{color:#94a3b8;}
#app .svc-ico.r{background:rgba(248,113,113,.13);}
#app .svc-ico.r .ag-ico{color:#f87171;}
/* 通用线性图标统一亮色语义 */
#app .ag-ico.ic-orders,#app .ic-orders{color:#22d3ee;}
#app .ag-ico.ic-nav,#app .ic-nav{color:#34d399;}
#app .ag-ico.ic-list,#app .ic-list{color:#7dd3fc;}
#app .ag-ico.ic-sat,#app .ic-sat{color:#67e8f9;}
#app .ag-ico.ic-money,#app .ic-money{color:#fbbf24;}
#app .ag-ico.ic-book,#app .ic-book{color:#a78bfa;}
#app .ag-ico.ic-edit,#app .ic-edit{color:#94a3b8;}
#app .ag-ico.ic-info,#app .ic-info{color:#7dd3fc;}
#app .ag-ico.ic-dish,#app .ic-dish{color:#22d3ee;}
#app .ag-ico.ic-chart,#app .ic-chart{color:#fbbf24;}
#app .ag-ico.ic-file,#app .ic-file{color:#60a5fa;}
#app .ag-ico.ic-pin,#app .ic-pin{color:#f87171;}
#app .ag-ico.ic-refresh,#app .ic-refresh{color:#22d3ee;}
#app .ag-ico.ic-target,#app .ic-target{color:#fbbf24;}
#app .ag-ico.ic-gift,#app .ic-gift{color:#f472b6;}
#app .ag-ico.ic-map,#app .ic-map{color:#22d3ee;}
#app .ag-ico.ic-car,#app .ic-car{color:#60a5fa;}
#app .ag-ico.ic-bulb,#app .ic-bulb{color:#fbbf24;}
#app .ag-ico.ic-globe,#app .ic-globe{color:#2dd4bf;}
#app .ag-ico.ic-logout,#app .ic-logout{color:#f87171;}
#app .ag-ico.ic-file::after{background:transparent;}
#app .ag-ico.ic-car::after{background:transparent;box-shadow:-10px 0 0 -2px currentColor,10px 0 0 -2px currentColor;}
#app .ag-ico.ic-target::after{box-shadow:0 0 0 3px #0d1830 inset;}
#app .home-empty::before{background:linear-gradient(90deg,#22d3ee,#3b82f6);}
#app .home-empty .he-ico{background:rgba(34,211,238,.1);color:#22d3ee;}
#app .home-empty .he-cta{background:rgba(34,211,238,.12);color:#22d3ee;border:1px solid rgba(34,211,238,.3);}
#app #page-profile .content-panel .earn-card,
#app #page-profile .content-panel .task-mini{background:rgba(18,30,56,.7);border:1px solid var(--border-soft);}
#app .hc-body{background:rgba(10,18,36,.6);border:1px solid var(--border-soft);}
#app .h-val,
#app .sm-val,
#app .mts-val{color:var(--text);}
#app .ipc-head{background:linear-gradient(135deg,rgba(34,211,238,.12),rgba(59,130,246,.1));border-bottom:1px solid var(--border-soft);}
#app .ipc-title{color:#22d3ee;}
#app .ipc-login-count{background:rgba(148,197,255,.08);color:var(--text2);border:1px solid var(--border);}
#app .ipc-row{border-bottom:1px solid rgba(148,197,255,.06);}
#app .ipc-label{color:var(--text3);}
#app .ipc-val{color:var(--text2);}
#app .ipc-val.loc{color:#22d3ee;}
#app .ipc-val.local{color:var(--text3);}
#app .ipc-val.proxy{color:#f87171;background:rgba(248,113,113,.12);}
#app .ipc-val.direct{color:#34d399;}

/* ===== 9. 步骤条 / 里程碑 / 通用分隔 ===== */
#app .step{color:var(--text4);}
#app .step .s-dot{background:#16243e;border:2px solid #24344f;color:var(--text3);}
#app .step::after{background:#24344f;}
#app .step.done .s-dot{background:#0e7490;}
#app .step.done{color:#34d399;}
#app .step.done::after{background:#0e7490;}
#app .step.active .s-dot{background:#22d3ee;color:#04141c;animation:pulseDark 1.2s infinite;}
#app .step.active{color:#22d3ee;}
@keyframes pulseDark{0%,100%{box-shadow:0 0 0 0 rgba(34,211,238,.5);}50%{box-shadow:0 0 0 6px rgba(34,211,238,0);}}

/* ===== 10. 导航采集页 ===== */
#app .nav-header{background:linear-gradient(160deg,rgba(24,38,69,.85),rgba(13,22,44,.88));}
#app .nh-addr{color:var(--text);}
#app .nh-tag,
#app .nh-status,
#app .mts-lbl,
#app .mt-remain-lbl,
#app .sp-unit,
#app .sm-lbl,
#app .mode-desc{color:var(--text3);}
#app .nh-link{background:repeating-linear-gradient(180deg,#3a4d73 0 3px,transparent 3px 6px);}
#app .nh-mode{background:rgba(34,211,238,.13);color:#22d3ee;}
#app .nh-mode.tag-low{background:rgba(251,191,36,.13);color:#fbbf24;}
#app .nh-track b{background:#0a1128;border-color:#22d3ee;box-shadow:0 0 8px rgba(34,211,238,.6);}
#app .sp-val{color:#22d3ee;text-shadow:0 0 16px rgba(34,211,238,.4);}
#app .mode-tag.tag-high{background:rgba(34,211,238,.13);color:#22d3ee;}
#app .mode-tag.tag-low{background:rgba(251,191,36,.13);color:#fbbf24;}
#app .mode-tag.warn{background:rgba(248,113,113,.13);color:#f87171;}
#app .sm-cell{background:rgba(10,18,36,.65);border:1px solid var(--border-soft);}
#app .data-stream .ds-head,
#app .data-stream .ds-title,
#app .drive-status-card .ds-title{color:var(--text);}
#app .data-stream .ds-title .ic-dish{color:#22d3ee;}
#app .data-stream .ds-cnt{color:#22d3ee;background:rgba(34,211,238,.12);}
#app .ds-row{border-bottom:1px solid var(--border-soft);}
#app .ds-row .ds-ts{color:var(--text3);}
#app .ds-row .ds-coord{color:#67e8f9;}
#app .ds-row .ds-speed{color:var(--text2);}
#app .ds-row .ds-status{background:rgba(52,211,153,.13);color:#34d399;}
#app .ds-list::-webkit-scrollbar-thumb{background:#24344f;}
#app .ds-online{color:#34d399;background:rgba(52,211,153,.13);}
#app .ds-online.off{color:var(--text3);background:rgba(148,163,184,.1);}
#app .drive-status-card .ds-grid,
#app .ds-grid{background:rgba(8,15,31,.6);border:1px solid var(--border-soft);}
#app .ds-lbl{color:var(--text3);}

/* ===== 11. 卫星数据卡（深蓝黑 HUD） ===== */
#app .star-card{
  background:linear-gradient(135deg,#0b1f3a 0%,#0e2a4d 60%,#102a54 100%);
  border:1px solid rgba(56,189,248,.2);
  box-shadow:0 12px 34px rgba(2,8,26,.55),inset 0 1px 0 rgba(148,210,255,.12);
}
#app .star-card::before{
  background:radial-gradient(circle at 18% 12%,rgba(34,211,238,.2),transparent 52%),radial-gradient(circle at 84% 88%,rgba(59,130,246,.22),transparent 52%);
}
#app .sc-title .ic-sat,
#app .sc-signal{color:#22d3ee;}
#app .sc-sats .sat{color:#7dd3fc;}
#app .sc-sats .s-ico{color:#7dd3fc;}
#app .sc-sats .sat.active .s-ico{color:#22d3ee;}
#app .sc-coords{background:rgba(5,12,28,.45);border:1px solid rgba(148,210,255,.14);color:#a5f3fc;}
#app .sat-txt{color:var(--text2);}
#app .sat-emoji.ic-sat{color:#22d3ee;}
#app .uc-status.ok,
#app .sat-confirmed{background:rgba(52,211,153,.13);color:#34d399;}
#app .uc-status.ing,
#app .sat-pending{background:rgba(251,191,36,.13);color:#fbbf24;}
#app .sat-none{background:rgba(148,163,184,.12);color:#94a3b8;}
#app .uc-id{color:var(--text);}
#app .uc-body{color:var(--text2);}
#app .uc-body .uc-row span:first-child{color:var(--text3);}
#app .uc-head{border-bottom:1px solid var(--border-soft);}

/* ===== 12. 弹窗 / 取景设备面板 / 签名板 / 语言选择 ===== */
#app .modal-mask{background:rgba(3,7,18,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
#app .modal{
  background:linear-gradient(165deg,rgba(17,29,54,.98),rgba(9,16,36,.98));
  border:1px solid rgba(56,189,248,.2);
  box-shadow:0 24px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(148,210,255,.12);
  color:var(--text);
}
#app .modal .m-title{color:var(--text);border-bottom:1px solid var(--border-soft);}
#app .modal .m-body{color:var(--text2);}
#app .modal .m-actions{background:rgba(8,15,31,.7);border-top:1px solid var(--border-soft);}
#app .modal .m-close{color:var(--text3);}
#app .modal .m-close:hover{background:rgba(148,197,255,.1);color:var(--text);}
#app .modal .m-body input,
#app .modal .m-body select,
#app .modal .m-body textarea{
  background:#0d1a30;border:1px solid #24344f;color:var(--text);
}
#app .modal .m-body input::placeholder,
#app .modal .m-body textarea::placeholder{color:var(--text4);}
#app .sat-key-input{background:#0b1729;border-color:#24344f;color:#a5f3fc;}
#app .sat-key-input:focus{border-color:rgba(34,211,238,.6);box-shadow:0 0 0 3px rgba(34,211,238,.13);background:#0d1f38;}
#app .devpanel{
  background:linear-gradient(160deg,rgba(15,27,50,.9),rgba(9,17,37,.92));
  border:1px solid rgba(56,189,248,.18);
  box-shadow:inset 0 1px 0 rgba(148,210,255,.1);
}
#app .devpanel::before{background:linear-gradient(90deg,#0891b2 0%,#22d3ee 50%,#0891b2 100%);}
#app .modal-title .title-icon{color:#22d3ee;}
#app .dev-step-dot{background:#101d36;border:2px solid #24344f;color:var(--text3);}
#app .dev-step-label{color:var(--text3);}
#app .dev-step.active .dev-step-dot{background:#22d3ee;border-color:#22d3ee;color:#04141c;box-shadow:0 3px 12px rgba(34,211,238,.5);}
#app .dev-step.active .dev-step-label{color:#22d3ee;}
#app .dev-step.done .dev-step-dot{background:#0891b2;border-color:#0891b2;color:#fff;}
#app .dev-step.done .dev-step-label{color:#67e8f9;}
#app .dev-step-bar{background:#1c2b47;}
#app .dev-step-bar::before{background:linear-gradient(90deg,#0891b2,#22d3ee);}
#app .dev-icon-wrap{
  background:linear-gradient(135deg,#0891b2 0%,#0e7490 100%);
  box-shadow:0 4px 20px rgba(8,145,178,.45),inset 0 -2px 4px rgba(0,0,0,.2);
}
#app .dev-main.connecting .dev-icon-wrap{animation:devPulseDark 2s ease-in-out infinite;}
@keyframes devPulseDark{
  0%,100%{box-shadow:0 4px 18px rgba(8,145,178,.4),inset 0 -2px 4px rgba(0,0,0,.2);}
  50%{box-shadow:0 4px 32px rgba(34,211,238,.65),inset 0 -2px 4px rgba(0,0,0,.2);}
}
#app .dev-progress-ring .ring-bg{stroke:#1c2b47;}
#app .dev-progress-ring .ring-fg{stroke:#22d3ee;}
#app .devscan-text{color:var(--text2);}
#app .devscan-list::-webkit-scrollbar-thumb{background:#24344f;}
#app .devscan-item{
  background:rgba(13,24,47,.7);border:1px solid rgba(56,189,248,.14);
}
#app .devscan-item:hover{
  background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.45);
  box-shadow:0 2px 12px rgba(8,145,178,.2);
}
#app .devscan-item .di-icon{background:linear-gradient(135deg,rgba(34,211,238,.16),rgba(59,130,246,.16));}
#app .devscan-item .di-name{color:var(--text);}
#app .devscan-item .di-rssi{color:var(--text3);}
#app .devscan-item .di-rssi.ok{color:#22d3ee;}
#app .devscan-item .di-rssi.weak{color:#fb923c;}
#app .devscan-item .di-select{background:#0891b2;}
#app .devscan-item:hover .di-select{background:#22d3ee;color:#04141c;}
#app .dev-info-bar{
  background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.4);color:#34d399;
}
#app .sign-board{background:#fff;border:2px dashed rgba(56,189,248,.55);box-shadow:0 4px 18px rgba(2,8,26,.35),inset 0 0 0 1px rgba(255,255,255,.6);}
#app .sign-board.signed{border-color:rgba(16,185,129,.65);background:#fff;}
#app .sign-btn.ghost{background:rgba(148,197,255,.08);border:1px solid var(--border);color:var(--text2);}
#app .sign-tip{color:var(--text3);}
#app .contract-status.ok{color:#34d399;}
#app .contract-status.pending{color:#fbbf24;}
#app .contract-preview{background:rgba(10,18,36,.7);border:1px solid var(--border-soft);}
#app .contract-preview img{border:1px solid var(--border);background:#fff;border-radius:6px;}
#app .zc-spinner{border-color:rgba(34,211,238,.18);border-top-color:#22d3ee;}
#app .lang-list .lang-item{
  background:rgba(20,33,60,.8);color:var(--text);
  border:1px solid var(--border-soft);
}
#app .lang-list .lang-item:hover{background:rgba(34,211,238,.1);}
#app .lang-list .lang-item.active{background:linear-gradient(135deg,#0891b2,#22d3ee);color:#04141c;}

/* ===== 13. 地图区：底图保持真实瓦片，浮层全部深色玻璃 ===== */
#app .nav-map{background:#0a1426;border:1px solid var(--border);box-shadow:var(--sh-top);}
#leafletMap{background:#0a1426;}
#leafletMap .map-loading{
  background:linear-gradient(145deg,#0d1a30,#0a1426);
}
#leafletMap .map-loading .ml-spinner{border-color:rgba(34,211,238,.2);border-top-color:#22d3ee;}
#leafletMap .map-loading .ml-text{color:#7dd3fc;}
#leafletMap .leaflet-control-scale-line{background:rgba(8,15,31,.85);border-color:#22d3ee;color:#67e8f9 !important;}
#leafletMap .leaflet-popup-content-wrapper,
#leafletMap .leaflet-popup-tip{background:#101f38;color:var(--text);border:1px solid rgba(56,189,248,.25);box-shadow:0 8px 24px rgba(2,8,26,.6);}
#leafletMap .leaflet-popup-content{color:var(--text);}
#app .map-road-chip{
  background:rgba(10,19,39,.88);
  border:1px solid rgba(56,189,248,.22);
  box-shadow:0 3px 14px rgba(2,8,26,.55);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
#app .map-trip{
  background:rgba(10,19,39,.9);
  border-top:1px solid rgba(56,189,248,.18);
  border-left:none;border-right:none;border-bottom:none;
  box-shadow:0 -4px 18px rgba(2,8,26,.55);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
#app .mrc-name{color:#e6f0ff;}
#app .mrc-coord{color:#7d92b5;}
#app .mrc-acc{background:rgba(34,211,238,.12);color:#22d3ee;}
#app .mt-group,
#app .mt-btn{
  background:rgba(10,19,39,.9);border:1px solid rgba(56,189,248,.2);
  box-shadow:0 2px 10px rgba(2,8,26,.5);color:#9fb3d1;
}
#app .mt-sep{background:rgba(56,189,248,.14);}
#app .mt-btn.active{background:linear-gradient(135deg,#0891b2,#22d3ee);color:#04141c;border-color:transparent;}
#app .mt-remain-val{color:#22d3ee;}
#app .mt-eta{color:#22d3ee;background:rgba(34,211,238,.12);}
#app .mt-line{background:rgba(148,197,255,.12);}

/* ===== 14. 客服聊天（微信风 → 深空 HUD 风） ===== */
#app .page-chat.active{background:#0a1128 !important;}
#app .page-chat .chat-wx-header{
  background:linear-gradient(135deg,#0b1a36 0%,#0e2a4a 100%);
  border-bottom:1px solid rgba(56,189,248,.22);
  box-shadow:0 4px 18px rgba(2,8,26,.5);
}
#app .page-chat .chat-wx-body{background:transparent;}
#app .page-chat .chat-wx-empty > div:nth-child(2){color:var(--text3);}
#app .page-chat .chat-wx-empty-icon{background:rgba(34,211,238,.12);color:#22d3ee;}
#app .page-chat .chat-wx-quick-btn{background:rgba(20,33,60,.85);color:var(--text);border:1px solid rgba(56,189,248,.18);}
#app .page-chat .chat-wx-quick-btn:active{background:rgba(34,211,238,.12);}
#app .page-chat .chat-wx-date-sep,
#app .page-chat .chat-wx-sys-msg{background:rgba(148,197,255,.08);color:#7d92b5;}
#app .page-chat .chat-wx-row.mine .chat-wx-bubble{
  background:linear-gradient(135deg,#0891b2,#2563eb);color:#fff;
  box-shadow:0 4px 14px rgba(8,145,178,.28);
}
#app .page-chat .chat-wx-row.other .chat-wx-bubble{
  background:linear-gradient(160deg,#1a2b4c,#16243f);color:#e6f0ff;
  border:1px solid rgba(56,189,248,.12);
}
#app .page-chat .chat-wx-row.mine .chat-wx-bubble::before{border-left-color:#2563eb;}
#app .page-chat .chat-wx-row.other .chat-wx-bubble::before{border-right-color:#1a2b4c;}
#app .page-chat .chat-wx-time{color:#54678c;}
#app .page-chat .chat-wx-typing{
  background:#16243f;color:var(--text3);border:1px solid rgba(56,189,248,.12);
}
#app .page-chat .chat-wx-typing::before{border-right-color:#16243f;}
#app .page-chat .chat-wx-typing-dots span{background:#7d92b5;}
#app .page-chat .chat-wx-input-area{
  background:rgba(9,16,33,.96);border-top:1px solid rgba(56,189,248,.18);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
#app .page-chat .chat-wx-attach-bar{
  background:rgba(20,33,60,.9);border:1px solid rgba(56,189,248,.18);
}
#app .page-chat .chat-wx-attach-item{color:var(--text2);}
#app .page-chat .chat-wx-upload-progress{background:#101d36;}
#app .page-chat .chat-wx-attach-cancel{color:var(--text3);}
#app .page-chat .chat-wx-input{
  background:#0d1a30;border:1px solid #24344f;color:var(--text);
}
#app .page-chat .chat-wx-input:focus{border-color:rgba(34,211,238,.55);background:#0f1f3a;}
#app .page-chat .chat-wx-send{
  background:linear-gradient(135deg,#0891b2,#2563eb);color:#fff;
  box-shadow:0 3px 10px rgba(8,145,178,.35);
}
#app .page-chat .chat-wx-send:disabled{background:#1c2b47;color:#54678c;}

/* ===== 15. 浮动客服面板（Tidio 备用壳）深色化 ===== */
#app .cs-fab{
  background:linear-gradient(135deg,#0891b2,#2563eb);
  box-shadow:0 4px 18px rgba(8,145,178,.45),0 2px 6px rgba(0,0,0,.3);
}
#app .cs-fab:hover{box-shadow:0 6px 24px rgba(34,211,238,.55);}
#app .cs-panel{background:rgba(3,7,18,.62);}
#app .cs-panel-header{background:linear-gradient(135deg,#0b1a36,#0e2a4a);}
#app .cs-panel-body{background:#0a1128;}
#app .cs-row.other .cs-bubble{background:#16243f;color:#e6f0ff;}
#app .cs-row.mine .cs-bubble{background:linear-gradient(135deg,#0891b2,#2563eb);}
#app .cs-sys-msg,
#app .cs-date-sep{background:rgba(148,197,255,.08);color:#7d92b5;}
#app .cs-quick-btn{background:rgba(20,33,60,.85);border:1px solid rgba(56,189,248,.18);color:#22d3ee;}
#app .cs-quick-btn:hover{background:rgba(34,211,238,.12);border-color:rgba(34,211,238,.4);}
#app .cs-retry-btn{background:linear-gradient(135deg,#0891b2,#2563eb);}
#app .cs-panel-input{background:rgba(9,16,33,.96);border-top:1px solid rgba(56,189,248,.18);}
#app .cs-input{background:#0d1a30;border:1px solid #24344f;color:var(--text);}
#app .cs-input:focus{border-color:rgba(34,211,238,.55);background:#0f1f3a;}
#app .cs-attach-btn{background:#101d36;border:1px solid #24344f;color:#9fb3d1;}
#app .cs-attach-btn:hover{background:rgba(34,211,238,.12);border-color:rgba(34,211,238,.4);color:#22d3ee;}
#app .cs-typing{color:var(--text3);}
#app .cs-typing-dots span{background:#7d92b5;}
#app .cs-attach-bar{background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.3);}
#app .cs-attach-item{color:#fcd34d;}
#app .cs-attach-cancel{color:#f87171;}
#app .cs-attach-cancel:hover{background:rgba(248,113,113,.12);}

/* ===== 16. 通用滚动条 ===== */
#app .modal .m-body::-webkit-scrollbar,
#app .ds-list::-webkit-scrollbar,
#app .devscan-list::-webkit-scrollbar{width:3px;}
#app .modal .m-body::-webkit-scrollbar-thumb{background:#2a3c5e;border-radius:2px;}

/* ===== 17. 深色下分割线/占位元素兜底 ===== */
#app .ds-cell:not(:last-child)::after{background:var(--border-soft) !important;}
#app .dsc-grid .ds-cell:not(:last-child)::after{background:var(--border-soft) !important;}
#app .es-emoji{color:var(--text4);}

/* ===== 18. 提现（今日收益入口 + 我的钱包弹窗） ===== */
#app .withdraw-entry{cursor:pointer;-webkit-tap-highlight-color:transparent;}
#app .withdraw-entry .ds-val{transition:transform .12s ease, filter .12s ease;}
#app .withdraw-entry:active .ds-val{transform:scale(.92);filter:brightness(1.25);}
#app .wd-entry-tag{
  position:absolute;top:-7px;right:6px;z-index:2;
  font-size:9px;font-weight:800;color:#04141c;letter-spacing:1px;
  background:linear-gradient(135deg,#67e8f9,#22d3ee 55%,#0891b2);
  border-radius:9px;padding:2px 8px;line-height:1.3;
  box-shadow:0 2px 10px rgba(34,211,238,.45);
  pointer-events:none;
}
#app .modal:has(.wd-wrap){max-width:362px;}
#app .wd-wrap{display:flex;flex-direction:column;gap:11px;padding:2px 0 4px;}
#app .wd-loading,#app .wd-err{text-align:center;color:var(--text3);font-size:13px;padding:34px 0;display:flex;align-items:center;justify-content:center;gap:9px;}
.wd-spinner{width:17px;height:17px;border-radius:50%;border:2px solid rgba(34,211,238,.25);border-top-color:#22d3ee;animation:wdspin .7s linear infinite;display:inline-block;}
@keyframes wdspin{to{transform:rotate(360deg);}}

/* 余额主卡 */
#app .wd-balance{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(8,145,178,.42) 0%,rgba(34,211,238,.13) 60%,rgba(59,130,246,.18) 100%);
  border:1px solid rgba(34,211,238,.35);
  border-radius:15px;padding:14px 16px 12px;
  box-shadow:inset 0 1px 0 rgba(165,243,252,.18),0 6px 20px rgba(8,145,178,.18);
}
#app .wd-balance::after{content:'';position:absolute;right:-34px;top:-34px;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle,rgba(103,232,249,.28),transparent 70%);pointer-events:none;}
#app .wdb-label{font-size:11px;color:#a5dce6;letter-spacing:.5px;}
#app .wdb-money{font-size:30px;font-weight:800;color:#eafcff;line-height:1.25;margin-top:2px;font-variant-numeric:tabular-nums;letter-spacing:-.5px;text-shadow:0 0 18px rgba(34,211,238,.5);}
#app .wdb-row3{display:flex;margin-top:11px;border-top:1px solid rgba(165,243,252,.18);padding-top:9px;}
#app .wdb-row3>div{flex:1;display:flex;flex-direction:column;gap:2px;text-align:center;}
#app .wdb-row3 b{font-size:13px;font-weight:700;color:#d7f4fb;font-variant-numeric:tabular-nums;}
#app .wdb-row3 span{font-size:10px;color:#8fb9c6;}
#app .wdb-row3 b.wd-c-warn{color:#fcd34d;}
#app .wdb-row3 b.wd-c-ok{color:#34d399;}

/* 收款银行卡 */
#app .wd-bank-card{display:flex;align-items:center;gap:11px;background:rgba(22,35,63,.72);border:1px solid rgba(148,197,255,.16);border-radius:13px;padding:11px 13px;}
#app .wdb-ico{width:38px;height:38px;border-radius:11px;flex-shrink:0;background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(59,130,246,.18));border:1px solid rgba(34,211,238,.3);display:flex;align-items:center;justify-content:center;font-size:18px;}
#app .wdb-info{flex:1;min-width:0;}
#app .wdb-bank{font-size:13.5px;font-weight:800;color:var(--text);}
#app .wdb-no{font-size:11px;color:var(--text3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#app .wdb-no b{color:#a5c7e0;font-weight:700;letter-spacing:.5px;font-variant-numeric:tabular-nums;}
#app .wdb-change{flex-shrink:0;border:1px solid rgba(34,211,238,.4);background:rgba(34,211,238,.08);color:#22d3ee;font-size:11px;font-weight:700;border-radius:9px;padding:6px 11px;cursor:pointer;transition:transform .12s,filter .12s;}
#app .wdb-change:active{transform:scale(.94);filter:brightness(1.25);}
#app .wd-no-bank{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.35);border-radius:13px;padding:12px 14px;}
#app .wnb-txt{font-size:12px;color:#fcd34d;line-height:1.55;}
#app .wnb-btn{flex-shrink:0;font-size:12px;padding:8px 16px;height:auto;border-radius:9px;}
#app .wnb-btn:active{transform:scale(.95);filter:brightness(1.15);}

/* 金额输入 */
#app .wd-amount-box{background:rgba(22,35,63,.55);border:1px solid rgba(148,197,255,.14);border-radius:13px;padding:12px 13px 10px;}
#app .wd-amount-box.wd-disabled{opacity:.55;}
#app .wda-label{font-size:11px;color:var(--text3);margin-bottom:7px;}
#app .wda-input-row{display:flex;align-items:center;gap:9px;}
#app .wda-cny{font-size:20px;font-weight:800;color:#22d3ee;}
#app .wda-input{flex:1;min-width:0;height:42px;font-size:24px;font-weight:800;color:#eafcff;background:transparent !important;border:none !important;border-bottom:2px solid rgba(34,211,238,.35) !important;border-radius:0 !important;padding:0 2px !important;outline:none;font-variant-numeric:tabular-nums;letter-spacing:-.5px;}
#app .wda-input:focus{border-bottom-color:#22d3ee !important;}
#app .wda-input:disabled{color:var(--text4);}
#app .wda-all{flex-shrink:0;border:1px solid rgba(34,211,238,.45);background:rgba(34,211,238,.12);color:#67e8f9;font-size:12px;font-weight:800;border-radius:20px;padding:8px 15px;cursor:pointer;transition:transform .12s,filter .12s;}
#app .wda-all:active{transform:scale(.93);filter:brightness(1.25);}
#app .wda-all:disabled{opacity:.5;}
#app .wda-tip{font-size:10px;color:var(--text4);margin-top:8px;line-height:1.5;}

/* 提现记录 */
#app .wd-records{display:flex;flex-direction:column;gap:8px;}
#app .wdr-title{font-size:12px;font-weight:800;color:var(--text2);letter-spacing:.5px;}
#app .wd-record{background:rgba(13,22,44,.6);border:1px solid rgba(148,197,255,.12);border-radius:11px;padding:10px 12px;}
#app .wdr-top{display:flex;align-items:center;justify-content:space-between;}
#app .wdr-amount{font-size:15px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;}
#app .wdr-status{font-size:10px;font-weight:800;border-radius:8px;padding:2px 9px;letter-spacing:.3px;}
#app .wdr-status.pending{background:rgba(251,191,36,.15);color:#fbbf24;border:1px solid rgba(251,191,36,.3);}
#app .wdr-status.paid{background:rgba(52,211,153,.15);color:#34d399;border:1px solid rgba(52,211,153,.3);}
#app .wdr-status.rejected{background:rgba(248,113,113,.15);color:#f87171;border:1px solid rgba(248,113,113,.3);}
#app .wdr-sub{font-size:10px;color:var(--text3);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#app .wdr-note{font-size:10px;color:#fca5a5;margin-top:3px;line-height:1.5;}
#app .wd-empty{text-align:center;font-size:11px;color:var(--text4);padding:14px 0;border:1px dashed rgba(148,197,255,.15);border-radius:10px;}

/* 提交按钮 */
#app .wd-submit{height:44px;font-size:15px;font-weight:800;letter-spacing:1px;transition:transform .12s,filter .12s;}
#app .wd-submit:active{transform:scale(.97);filter:brightness(1.15);}
#app .wd-submit.wd-submit-off{opacity:.45;filter:saturate(.5);}
