:root{
  /* ===== 主题令牌（默认：晴空蓝 azure）=====
     换色只需覆盖下面这些变量，页面本身不含硬编码色值 */
  --brand:#2E9BFF;
  --ink:#1268D6;
  --ink-2:#2385EE;
  --ink-3:#4FA8FF;
  --ink-rgb:18,104,214;
  --ink2-rgb:35,133,238;
  --ink3-rgb:79,168,255;
  --hero-1:#55B4FF;
  --rail-1:#1268D6;
  --bg-deep:#0B3F86;
  --paper:#F0F8FF;
  --paper-2:#FFFFFF;
  --field:#F6FBFF;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E3F2FF;
  --line:#CFE6FA;
  --line-soft:#E3F1FD;
  --copper:#2385EE;
  --gold:#A8DCFF;
  --gold-rgb:168,220,255;
  --gold-text:#0F5FC4;
  --copper-rgb:35,133,238;
  --copper-text:#0F5FC4;
  --muted-2:#8FA9C2;
  --danger:#F04438;
  --warn:#E08A2A;
  --ok:#00B365;
  --muted:#5F7F9E;
  --text:#12344F;
  --glow-1:rgba(79,168,255,.38);
  --glow-2:rgba(46,155,255,.2);
  --shadow:0 10px 30px -18px rgba(10,70,150,.3);
  --radius:16px;
  /* 字号缩放：--base 为基准像素，--fs 由「系统设置」写入（0.94 / 1 / 1.1 / 1.2） */
  --base:16px;
  --fs:1;
  --font-serif:"Songti SC","Noto Serif SC","Source Han Serif SC","STSong",serif;
  --font-sans:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Helvetica Neue",sans-serif;
}

body[data-theme="skyline"]{
  /* ===== 原型蓝：对齐客户提供的原型预览图 =====
     换色只需覆盖下面这些变量，页面本身不含硬编码色值 */
  --brand:#4489D8;
  --ink:#2C6CBC;
  --ink-2:#3B81D2;
  --ink-3:#5C9FE6;
  --ink-rgb:44,108,188;
  --ink2-rgb:59,129,210;
  --ink3-rgb:92,159,230;
  --hero-1:#5FA3E8;
  --rail-1:#2A66B2;
  --bg-deep:#173F6B;
  --paper:#EFF6FE;
  --paper-2:#FFFFFF;
  --field:#F7FBFF;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E6F1FE;
  --line:#D8E7F7;
  --line-soft:#E8F2FC;
  --copper:#3B81D2;
  --gold:#BFE0FF;
  --gold-rgb:191,224,255;
  --gold-text:#1E5FA8;
  --copper-rgb:59,129,210;
  --copper-text:#1E5FA8;
  --muted-2:#93A9BE;
  --danger:#E5484D;
  --warn:#E0902F;
  --ok:#00A85A;
  --muted:#6C86A0;
  --text:#1F3B57;
  --glow-1:rgba(92,159,230,.35);
  --glow-2:rgba(68,137,216,.18);
  --shadow:0 10px 30px -18px rgba(30,80,140,.28);
  --radius:16px;
  --font-serif:"Songti SC","Noto Serif SC","Source Han Serif SC","STSong",serif;
  --font-sans:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Helvetica Neue",sans-serif;
}

/* 历史方案：墨绿（?theme=ink 可对照） */
body[data-theme="ink"]{
  /* ===== 主题令牌（历史方案：墨绿）=====
     换色只需覆盖下面这些变量，页面本身不含硬编码色值 */
  --ink:#12332C;
  --ink-2:#1B4A3F;
  --ink-3:#2F6555;
  --ink-rgb:18,51,44;
  --ink2-rgb:27,74,63;
  --ink3-rgb:47,101,85;
  --hero-1:#17453A;
  --rail-1:#17453A;
  --bg-deep:#0E2A24;
  --paper:#F7F2E7;
  --paper-2:#FFFDF8;
  --field:#FCF9F1;
  --cream:#EFE6D5;
  --cream-rgb:237,227,208;
  --sand:#EFE6D5;
  --line:#DED2BC;
  --line-soft:#E8DECD;
  --copper:#B4763C;
  --gold:#C9A45B;
  --gold-rgb:201,164,91;
  --gold-text:#8A6425;
  --copper-rgb:180,118,60;
  --copper-text:#95602C;
  --muted-2:#A99F8C;
  --danger:#B0473A;
  --warn:#A97C2C;
  --ok:#4B7057;
  --muted:#7C7364;
  --text:#22302B;
  --glow-1:rgba(47,101,85,.55);
  --glow-2:rgba(180,118,60,.25);
  --shadow:0 10px 30px -18px rgba(18,51,44,.55);
  --radius:16px;
  --font-serif:"Songti SC","Noto Serif SC","Source Han Serif SC","STSong",serif;
  --font-sans:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Helvetica Neue",sans-serif;
}


*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;}
html{
  font-size:calc(var(--base) * var(--fs));
  -webkit-text-size-adjust:100%;
}
/* 手机端基准略大，缓解小字吃力 */
@media (max-width:1023px){:root{--base:17px;}}
body{
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--bg-deep);
  font-size:0.9688rem;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 500px at 15% 0%, rgba(var(--ink3-rgb),.55), transparent 60%),
    radial-gradient(700px 500px at 90% 100%, var(--glow-2), transparent 60%),
    var(--bg-deep);
}
#app{position:relative;z-index:1;}

/* 纸纹 */
.grain::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.055'/%3E%3C/svg%3E");
}

#app,.app{
  position:relative;
  max-width:520px;
  margin:0 auto;
  min-height:100vh;
  background:var(--paper);
  box-shadow:0 0 70px rgba(0,0,0,.45);
  overflow-x:hidden;
  padding-bottom:6rem;
}
/* 桌面端手机框 */
@media (min-width:560px){
  #app{border-left:1px solid rgba(var(--gold-rgb),.16);border-right:1px solid rgba(var(--gold-rgb),.16);}
}

/* ---------------- 启动 ---------------- */
.boot{
  position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:0.875rem;background:var(--ink);color:#EDE3D0;z-index:99;
  transition:opacity .45s ease, visibility .45s;
}
.boot.hide{opacity:0;visibility:hidden;}
.boot-seal{
  height:4rem;padding:0 0.75rem;border-radius:0.875rem;border:1px solid rgba(var(--gold-rgb),.7);
  display:grid;place-items:center;font-family:var(--font-serif);font-size:1.0625rem;letter-spacing:.12em;
  color:#E4F1FF;text-indent:.12em;
}
.boot-line{width:3.25rem;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--gold-rgb),.9),transparent);}
.boot-text{font-size:0.8125rem;letter-spacing:.32em;color:rgba(var(--cream-rgb),.65);}

/* ---------------- 通用 ---------------- */
h1,h2,h3,h4,p{margin:0;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;font-size:inherit;color:inherit;border:none;background:none;cursor:pointer;}
input,select,textarea{font-family:inherit;font-size:0.9688rem;color:var(--text);}
.serif{font-family:var(--font-serif);}
.muted{color:var(--muted);}
.tiny{font-size:0.7813rem;}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.02em;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;
  height:2.75rem;padding:0 1.125rem;border-radius:0.75rem;font-size:0.9688rem;font-weight:500;
  transition:transform .12s ease, opacity .2s ease, background .2s;
  border:1px solid transparent;
}
.btn:active{transform:scale(.975);}
.btn[disabled]{opacity:.45;pointer-events:none;}
.btn-primary{background:var(--ink);color:var(--cream);box-shadow:0 8px 20px -14px rgba(var(--ink-rgb),.9);}
.btn-copper{background:var(--copper);color:#FFF8EC;}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink-2);}
.btn-soft{background:rgba(var(--ink-rgb),.06);color:var(--ink-2);}
.btn-danger{background:rgba(176,71,58,.1);color:var(--danger);border-color:rgba(176,71,58,.25);}
.btn-sm{height:2.125rem;padding:0 0.75rem;font-size:0.8438rem;border-radius:0.5625rem;}
.btn-block{width:100%;}

.chip{
  display:inline-flex;align-items:center;gap:0.3125rem;height:2rem;padding:0 0.8125rem;border-radius:6.1875rem;
  background:var(--paper-2);border:1px solid var(--line);color:#5C5545;font-size:0.8438rem;white-space:nowrap;
  transition:all .18s;
}
.chip.active{background:var(--ink);border-color:var(--ink);color:var(--cream);}
.chip.tone-copper.active{background:var(--copper);border-color:var(--copper);color:#fff;}

.tag{
  display:inline-flex;align-items:center;height:1.3125rem;padding:0 0.5rem;border-radius:0.3125rem;
  font-size:0.75rem;letter-spacing:.02em;background:rgba(var(--ink-rgb),.06);color:var(--ink-2);
}
.tag.gold{background:rgba(var(--gold-rgb),.16);color:var(--gold-text);}
.tag.copper{background:rgba(var(--copper-rgb),.13);color:var(--copper-text);}
.tag.danger{background:rgba(176,71,58,.1);color:var(--danger);}
.tag.ok{background:rgba(75,112,87,.13);color:var(--ok);}

.card{
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.divider{height:1px;background:var(--line-soft);margin:0.875rem 0;}

/* ---------------- 顶部 ---------- */
.topbar{
  position:relative;background:linear-gradient(155deg,var(--hero-1) 0%,var(--ink) 55%,var(--bg-deep) 100%);
  color:var(--cream);padding:calc(env(safe-area-inset-top) + 1.125rem) 1.25rem 3.5rem;
  border-radius:0 0 1.75rem 1.75rem;overflow:hidden;
}
.topbar::before{
  content:"";position:absolute;width:17.5rem;height:17.5rem;right:-110px;top:-140px;border-radius:50%;
  border:1px solid rgba(var(--gold-rgb),.28);
}
.topbar::after{
  content:"";position:absolute;width:11.875rem;height:11.875rem;right:-60px;top:-90px;border-radius:50%;
  border:1px solid rgba(var(--gold-rgb),.16);
}
.brand-row{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2;}
.brand{display:flex;align-items:center;gap:0.6875rem;}
.brand-seal{
  height:2.5rem;padding:0 0.5625rem;border-radius:0.5625rem;border:1px solid rgba(var(--gold-rgb),.65);
  display:grid;place-items:center;font-family:var(--font-serif);font-size:0.7813rem;color:#E4F1FF;
  letter-spacing:.1em;text-indent:.1em;background:rgba(255,255,255,.07);flex:none;
}
.brand-name{font-family:var(--font-serif);font-size:1.0938rem;letter-spacing:.14em;}
.brand-sub{font-size:0.7188rem;letter-spacing:.28em;color:rgba(var(--cream-rgb),.55);margin-top:1px;}
.avatar-btn{
  width:2.375rem;height:2.375rem;border-radius:50%;background:rgba(var(--cream-rgb),.12);
  border:1px solid rgba(var(--cream-rgb),.25);display:grid;place-items:center;
  font-family:var(--font-serif);font-size:0.9688rem;color:var(--cream);
}

.greet{margin-top:1.375rem;position:relative;z-index:2;}
.greet h1{font-family:var(--font-serif);font-size:1.5625rem;font-weight:400;letter-spacing:.04em;}
.greet p{font-size:0.8125rem;color:rgba(var(--cream-rgb),.6);margin-top:0.3125rem;letter-spacing:.05em;}

/* 用量条（现位于「我的」页） */
.usage{
  margin-top:0.875rem;position:relative;z-index:2;
  background:rgba(255,253,248,.08);border:1px solid rgba(var(--cream-rgb),.16);
  border-radius:0.875rem;padding:0.75rem 0.875rem;backdrop-filter:blur(4px);
  display:flex;align-items:center;gap:0.875rem;
}
.usage-ring{position:relative;width:2.875rem;height:2.875rem;flex:none;}
.usage-ring svg{transform:rotate(-90deg);width:100%;height:100%;display:block;}
.usage-ring span{
  position:absolute;inset:0;display:grid;place-items:center;font-size:0.75rem;
  font-family:var(--font-serif);color:var(--cream);
}
.usage-text{flex:1;min-width:0;}
.usage-text b{font-size:0.9063rem;font-weight:500;letter-spacing:.03em;}
.usage-text p{font-size:0.7813rem;color:rgba(var(--cream-rgb),.6);margin-top:2px;}
.usage-bar{height:0.1875rem;border-radius:0.1875rem;background:rgba(var(--cream-rgb),.18);margin-top:0.4375rem;overflow:hidden;}
.usage-bar i{display:block;height:100%;border-radius:0.1875rem;background:linear-gradient(90deg,var(--gold),var(--brand));}
.usage-tip{font-size:0.6875rem;color:rgba(var(--cream-rgb),.45);margin-top:0.3125rem;letter-spacing:.04em;}
.usage-skeleton .usage-ring{background:rgba(var(--cream-rgb),.08);border-radius:50%;}

/* ---------------- 搜索与筛选 ---------- */
.search-wrap{
  margin:-2.375rem 1rem 0;position:relative;z-index:5;
}
.search{
  display:flex;align-items:center;gap:0.5625rem;background:var(--paper-2);
  border:1px solid var(--line);border-radius:0.875rem;padding:0 0.875rem;height:3rem;
  box-shadow:0 14px 26px -22px rgba(var(--ink-rgb),.8);
}
.search input{flex:1;border:none;outline:none;background:transparent;font-size:0.9688rem;}
.search input::placeholder{color:var(--muted-2);}

.view-switch{
  display:flex;gap:0.25rem;margin:0.875rem 1rem 0;background:rgba(var(--ink-rgb),.05);
  padding:0.25rem;border-radius:0.6875rem;width:fit-content;
}
.view-switch button{
  height:1.875rem;padding:0 0.875rem;border-radius:0.5rem;font-size:0.8438rem;color:var(--muted);
  transition:all .2s;
}
.view-switch button.on{background:var(--paper-2);color:var(--ink);box-shadow:0 2px 8px -4px rgba(0,0,0,.25);font-weight:500;}

.filter-row{
  display:flex;gap:0.5rem;overflow-x:auto;padding:0.875rem 1rem 0.25rem;scrollbar-width:none;
}
.filter-row::-webkit-scrollbar{display:none;}

.section-head{
  display:flex;align-items:baseline;justify-content:space-between;
  padding:1.125rem 1.125rem 0.625rem;
}
.section-head h2{font-family:var(--font-serif);font-size:1.0938rem;font-weight:400;letter-spacing:.05em;}
.section-head span{font-size:0.7813rem;color:var(--muted);}

/* ---------------- 客户卡片 ---------------- */
.list{padding:0.25rem 1rem 0;display:flex;flex-direction:column;gap:0.6875rem;}
.ccard{
  position:relative;background:var(--paper-2);border:1px solid var(--line);
  border-radius:0.9375rem;padding:0.875rem 0.9375rem 0.8125rem;overflow:hidden;
  transition:transform .15s ease, box-shadow .2s;
}
.ccard:active{transform:scale(.99);}
.ccard::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;width:0.1875rem;border-radius:0 0.1875rem 0.1875rem 0;
  background:var(--line);
}
.ccard.tone-red::before{background:var(--danger);}
.ccard.tone-yellow::before{background:var(--warn);}
.ccard.tone-green::before{background:var(--ok);}
.ccard.locked{background:linear-gradient(0deg,rgba(var(--gold-rgb),.06),rgba(var(--gold-rgb),.06)),var(--paper-2);}

.cc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:0.625rem;}
.cc-name{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;}
.cc-name h3{font-family:var(--font-serif);font-size:1.2188rem;font-weight:500;letter-spacing:.03em;}
.cc-sub{font-size:0.8125rem;color:var(--muted);margin-top:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cc-tags{display:flex;gap:0.3125rem;flex-wrap:wrap;margin-top:0.5625rem;}

.pill{
  display:inline-flex;align-items:center;gap:0.25rem;height:1.375rem;padding:0 0.5rem;border-radius:6.1875rem;
  font-size:0.75rem;white-space:nowrap;flex:none;
}
.pill-red{background:rgba(176,71,58,.1);color:var(--danger);}
.pill-yellow{background:rgba(169,124,44,.12);color:var(--warn);}
.pill-green{background:rgba(75,112,87,.12);color:var(--ok);}
.pill-none{background:rgba(var(--ink-rgb),.06);color:#7C7364;}
.pill-gold{background:rgba(var(--gold-rgb),.16);color:var(--gold-text);}

.cc-foot{
  display:flex;align-items:center;justify-content:space-between;gap:0.625rem;
  margin-top:0.6875rem;padding-top:0.625rem;border-top:1px dashed var(--line-soft);
}
.cc-phone{font-size:0.875rem;letter-spacing:.04em;color:#3E4A43;display:flex;align-items:center;gap:0.375rem;}
.cc-phone svg{opacity:.55;}

/* 空态 */
.empty{
  padding:4rem 1.5rem;text-align:center;color:var(--muted);
}
.empty-seal{
  width:3.5rem;height:3.5rem;border-radius:50%;border:1px solid var(--line);margin:0 auto 0.875rem;
  display:grid;place-items:center;color:var(--muted-2);font-family:var(--font-serif);
}
.empty p{font-size:0.875rem;}
.empty small{font-size:0.7813rem;color:var(--muted-2);}

/* ---------------- 底部导航 ---------------- */
.tabbar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:520px;
  background:rgba(255,253,248,.94);backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft);
  display:flex;padding:0.5rem 0.375rem calc(env(safe-area-inset-bottom) + 0.5rem);z-index:40;
}
.tabbar button{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:0.1875rem;
  font-size:0.7188rem;color:#918872;letter-spacing:.04em;position:relative;padding:0.25rem 0;
}
.tabbar button.on{color:var(--ink);}
.tabbar button.on svg{stroke-width:1.9;}
.tabbar .dot{
  position:absolute;top:2px;right:calc(50% - 18px);min-width:0.9375rem;height:0.9375rem;border-radius:6.1875rem;
  background:var(--copper);color:#fff;font-size:0.6875rem;display:grid;place-items:center;padding:0 0.25rem;
}

/* 悬浮录入 */
.fab{
  position:fixed;bottom:calc(env(safe-area-inset-bottom) + 78px);
  right:max(18px,calc(50vw - 242px));
  width:3.25rem;height:3.25rem;border-radius:50%;
  background:linear-gradient(150deg,var(--ink-3),var(--ink));color:var(--cream);
  display:grid;place-items:center;box-shadow:0 14px 28px -12px rgba(var(--ink-rgb),.85);
  z-index:41;transition:transform .15s;
  border:1px solid rgba(var(--gold-rgb),.3);
}
.fab:active{transform:scale(.94);}

/* ---------------- 登录 ---------------- */
.login{min-height:100vh;display:flex;flex-direction:column;background:var(--paper);}
.login-hero{
  position:relative;background:linear-gradient(160deg,var(--ink-2),var(--ink) 60%,var(--bg-deep));
  color:var(--cream);padding:calc(env(safe-area-inset-top) + 2.875rem) 1.625rem 5.375rem;
  border-radius:0 0 2.125rem 2.125rem;overflow:hidden;
}
.login-hero .ring1{position:absolute;width:20rem;height:20rem;border-radius:50%;border:1px solid rgba(var(--gold-rgb),.22);right:-130px;top:-120px;}
.login-hero .ring2{position:absolute;width:13.75rem;height:13.75rem;border-radius:50%;border:1px solid rgba(var(--gold-rgb),.14);right:-80px;top:-70px;}
.login-hero .ring3{position:absolute;width:9.375rem;height:9.375rem;border-radius:50%;border:1px solid rgba(var(--gold-rgb),.1);left:-60px;bottom:-40px;}
.login-seal{
  width:fit-content;align-self:flex-start;
  height:3.25rem;padding:0 0.875rem;border-radius:0.8125rem;border:1px solid rgba(var(--gold-rgb),.6);
  display:grid;place-items:center;font-family:var(--font-serif);font-size:1rem;letter-spacing:.12em;color:#E4F1FF;
  text-indent:.12em;margin-bottom:1.25rem;
}
.login-hero h1{font-family:var(--font-serif);font-size:1.625rem;font-weight:400;letter-spacing:.16em;line-height:1.4;}
.login-hero p{font-size:0.8125rem;color:rgba(var(--cream-rgb),.62);margin-top:0.625rem;letter-spacing:.16em;}
.login-hero .hero-note{
  display:inline-flex;align-items:center;gap:0.375rem;margin-top:1.25rem;
  font-size:0.75rem;color:rgba(var(--cream-rgb),.5);border:1px solid rgba(var(--cream-rgb),.16);
  padding:0.25rem 0.625rem;border-radius:6.1875rem;
}

.login-card{
  margin:-3.625rem 1rem 0;background:var(--paper-2);border:1px solid var(--line);
  border-radius:1.25rem;box-shadow:0 24px 50px -30px rgba(var(--ink-rgb),.7);position:relative;z-index:3;
  overflow:hidden;
}
.login-tabs{display:flex;border-bottom:1px solid var(--line-soft);}
.login-tabs button{
  flex:1;height:3rem;font-size:0.8438rem;color:#8B8270;position:relative;letter-spacing:.04em;
}
.login-tabs button.on{color:var(--ink);font-weight:500;}
.login-tabs button.on::after{
  content:"";position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);
  width:1.625rem;height:2px;border-radius:2px;background:var(--copper);
}
.login-form{padding:1.25rem 1.25rem 1.5rem;}

.field{margin-bottom:0.875rem;}
.field label{display:block;font-size:0.7813rem;color:#877E6C;letter-spacing:.08em;margin-bottom:0.375rem;}
.field label .req{color:var(--copper);margin-left:2px;}
.input,.select,.textarea{
  width:100%;height:2.875rem;padding:0 0.8125rem;border:1px solid var(--line);border-radius:0.6875rem;
  background:var(--field);outline:none;transition:border-color .2s, box-shadow .2s;
}
.textarea{height:auto;min-height:5.5rem;padding:0.6875rem 0.8125rem;resize:vertical;line-height:1.6;}
.input:focus,.select:focus,.textarea:focus{border-color:var(--ink-3);box-shadow:0 0 0 3px rgba(var(--ink3-rgb),.1);}
.input::placeholder,.textarea::placeholder{color:#B2A894;}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237C7364' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:2.125rem;}

.captcha-row{display:flex;gap:0.625rem;}
.captcha-row .input{flex:1;}
.captcha-img{
  width:6.75rem;height:2.875rem;border-radius:0.6875rem;overflow:hidden;border:1px solid var(--line);
  flex:none;display:grid;place-items:center;background:#F3EEE2;
}
.captcha-img svg{display:block;}

.demo-accounts{margin-top:1rem;border-top:1px dashed var(--line-soft);padding-top:0.875rem;}
.demo-accounts .hint{font-size:0.75rem;color:var(--muted-2);margin-bottom:0.5625rem;letter-spacing:.05em;}
.demo-row{display:flex;gap:0.5rem;flex-wrap:wrap;}
.demo-chip{
  display:flex;flex-direction:column;gap:1px;padding:0.4375rem 0.6875rem;border:1px solid var(--line);
  border-radius:0.5625rem;background:var(--field);font-size:0.7813rem;text-align:left;
}
.demo-chip b{font-weight:500;color:var(--ink-2);}
.demo-chip span{color:var(--muted-2);font-size:0.6875rem;}

.member-list{display:flex;flex-direction:column;gap:0.5rem;}
.member{
  display:flex;align-items:center;gap:0.6875rem;padding:0.6875rem 0.75rem;border:1px solid var(--line);
  border-radius:0.75rem;background:var(--field);text-align:left;width:100%;transition:all .16s;
}
.member:active{background:#F6F0E2;}
.member-avatar{
  width:2.25rem;height:2.25rem;border-radius:50%;background:rgba(var(--ink-rgb),.07);color:var(--ink-2);
  display:grid;place-items:center;font-family:var(--font-serif);font-size:0.9688rem;flex:none;
}
.member-info{flex:1;min-width:0;}
.member-info b{display:block;font-size:0.9063rem;font-weight:500;}
.member-info span{font-size:0.75rem;color:var(--muted-2);}
.member-arrow{color:#C0B6A2;}

.mock-note{
  display:flex;gap:0.5rem;padding:0.625rem 0.75rem;border-radius:0.625rem;background:rgba(var(--gold-rgb),.1);
  border:1px dashed rgba(var(--gold-rgb),.4);font-size:0.7813rem;color:var(--gold-text);line-height:1.6;margin-bottom:0.875rem;
}
.mock-note svg{flex:none;margin-top:1px;}

.login-foot{
  margin-top:auto;padding:1.375rem 1.25rem calc(env(safe-area-inset-bottom) + 1.25rem);text-align:center;
  font-size:0.7188rem;color:var(--muted-2);letter-spacing:.14em;
}

/* ---------------- 详情 ---------------- */
.detail-hero{
  position:relative;background:linear-gradient(160deg,var(--ink-2),var(--ink));color:var(--cream);
  padding:calc(env(safe-area-inset-top) + 0.875rem) 1.25rem 2.125rem;border-radius:0 0 1.625rem 1.625rem;overflow:hidden;
}
.detail-hero::before{
  content:"";position:absolute;width:14.375rem;height:14.375rem;border-radius:50%;
  border:1px solid rgba(var(--gold-rgb),.18);right:-90px;top:-80px;
}
.back-btn{display:inline-flex;align-items:center;gap:0.375rem;font-size:0.8438rem;color:rgba(var(--cream-rgb),.75);padding:0.375rem 0;}
.detail-hero h1{font-family:var(--font-serif);font-size:1.5rem;font-weight:400;margin-top:0.875rem;letter-spacing:.04em;}
.detail-hero .company{font-size:0.8438rem;color:rgba(var(--cream-rgb),.62);margin-top:0.3125rem;}
.detail-hero .tags{display:flex;gap:0.375rem;flex-wrap:wrap;margin-top:0.75rem;}
.detail-hero .tag{background:rgba(var(--cream-rgb),.12);color:var(--cream);}

.info-card{margin:-1.25rem 1rem 0;position:relative;z-index:4;padding:1rem;}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.875rem 0.75rem;}
.info-item span{display:block;font-size:0.7188rem;color:var(--muted-2);letter-spacing:.08em;}
.info-item b{display:block;font-size:0.9063rem;font-weight:400;margin-top:0.1875rem;color:var(--text);word-break:break-all;}
.info-item.full{grid-column:1/-1;}

.block{margin:1rem;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;}
.block-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.875rem;}
.block-title h2{font-family:var(--font-serif);font-size:1.0313rem;font-weight:500;letter-spacing:.05em;}
.block-title span{font-size:0.75rem;color:var(--muted-2);}

.timeline{position:relative;padding-left:1.25rem;}
.timeline::before{content:"";position:absolute;left:4px;top:5px;bottom:5px;width:1px;background:var(--line);}
.tl-item{position:relative;padding-bottom:1rem;}
.tl-item:last-child{padding-bottom:0;}
.tl-item::before{
  content:"";position:absolute;left:-19px;top:5px;width:0.4375rem;height:0.4375rem;border-radius:50%;
  background:var(--paper-2);border:1.5px solid var(--copper);
}
.tl-item .meta{display:flex;align-items:center;gap:0.4375rem;font-size:0.75rem;color:var(--muted-2);}
.tl-item .meta b{color:var(--ink-2);font-weight:500;}
.tl-item p{font-size:0.875rem;color:#3B4740;margin-top:0.3125rem;line-height:1.65;}
.tl-item .next{font-size:0.75rem;color:var(--warn);margin-top:0.3125rem;}

.bottombar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:520px;
  background:rgba(255,253,248,.96);backdrop-filter:blur(12px);
  border-top:1px solid var(--line-soft);padding:0.625rem 1rem calc(env(safe-area-inset-bottom) + 0.625rem);
  display:flex;gap:0.625rem;z-index:40;
}

/* ---------------- 表单 ---------------- */
.form-page{padding-bottom:6.875rem;}
.form-head{
  background:linear-gradient(160deg,var(--ink-2),var(--ink));color:var(--cream);
  padding:calc(env(safe-area-inset-top) + 0.875rem) 1.25rem 1.625rem;border-radius:0 0 1.5rem 1.5rem;
}
.form-head h1{font-family:var(--font-serif);font-size:1.3125rem;font-weight:400;margin-top:0.625rem;letter-spacing:.05em;}
.form-head p{font-size:0.7813rem;color:rgba(var(--cream-rgb),.6);margin-top:0.25rem;}
.form-group{margin:1rem;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;}
.group-title{
  display:flex;align-items:center;gap:0.5rem;font-family:var(--font-serif);font-size:1.0313rem;
  color:var(--ink);margin-bottom:1rem;letter-spacing:.06em;
}
.group-title::before{content:"";width:0.1875rem;height:0.875rem;background:var(--copper);border-radius:2px;}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:0.625rem;}

.chips-select{display:flex;flex-wrap:wrap;gap:0.4375rem;}
.chips-select button{
  height:2rem;padding:0 0.75rem;border-radius:0.5rem;border:1px solid var(--line);background:var(--field);
  font-size:0.8438rem;color:var(--muted);transition:all .16s;
}
.chips-select button.on{background:var(--ink);border-color:var(--ink);color:var(--cream);}
.chips-select button.on::before{content:"✓ ";font-size:0.75rem;}

.switch-row{display:flex;gap:0.5rem;}
.switch-row button{
  flex:1;height:2.75rem;border-radius:0.6875rem;border:1px solid var(--line);background:var(--field);
  font-size:0.875rem;color:var(--muted);
}
.switch-row button.on{background:rgba(var(--ink-rgb),.06);border-color:var(--ink-3);color:var(--ink);font-weight:500;}

/* ---------------- 录入页：重复校验 ---------------- */
.dup-box{display:block;}
.dup-line{
  display:flex;align-items:center;gap:0.4375rem;font-size:0.8125rem;line-height:1.7;
  padding:0.625rem 0.75rem;border-radius:0.625rem;border:1px dashed var(--line);
  color:var(--muted);background:var(--sand);
}
.dup-line.idle{color:var(--muted-2);}
.dup-line.checking{color:var(--copper-text);border-color:rgba(var(--copper-rgb),.35);background:rgba(var(--copper-rgb),.05);}
.dup-line.ok{color:var(--ok);border-color:rgba(75,112,87,.32);background:rgba(75,112,87,.07);}

.dup-summary{
  display:flex;gap:0.625rem;padding:0.6875rem 0.8125rem;border-radius:0.6875rem;
  border:1px solid rgba(var(--copper-rgb),.3);background:rgba(var(--copper-rgb),.06);color:var(--copper-text);
}
.dup-summary.danger{border-color:rgba(176,71,58,.32);background:rgba(176,71,58,.07);color:var(--danger);}
.dup-summary > svg{flex:none;margin-top:2px;}
.dup-summary b{font-size:0.875rem;font-weight:500;display:block;}
.dup-summary p{font-size:0.75rem;color:var(--muted);margin-top:2px;line-height:1.7;}

.dup-subtitle{font-size:0.7188rem;color:var(--muted-2);letter-spacing:.08em;margin:0.625rem 0 0.375rem;}

.dup-list{display:flex;flex-direction:column;gap:0.5rem;margin-top:0.625rem;}
.dup-item{
  border:1px solid var(--line);border-radius:0.625rem;padding:0.625rem 0.75rem;background:var(--field);
  transition:border-color .18s,box-shadow .18s;
}
.dup-list.weak .dup-item{background:transparent;border-style:dashed;}
.dup-item.strong{cursor:pointer;}
.dup-item.strong:hover{border-color:var(--danger);box-shadow:0 8px 20px -16px rgba(var(--ink-rgb),.8);}
.dup-row-head{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;}
.dup-row-head b{font-size:0.9375rem;font-weight:400;}
.dup-row-sub{font-size:0.7188rem;color:var(--muted);margin-top:0.1875rem;line-height:1.6;}
.dup-item.strong .dup-row-sub:last-child{color:var(--copper-text);}

.submit-bar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:520px;
  background:rgba(255,253,248,.96);backdrop-filter:blur(12px);
  border-top:1px solid var(--line-soft);padding:0.625rem 1rem calc(env(safe-area-inset-bottom) + 0.625rem);
  display:flex;gap:0.625rem;z-index:40;
}

/* ---------------- 统计 ---------------- */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.625rem;padding:0 1rem;}
.stat-card{
  background:var(--paper-2);border:1px solid var(--line);border-radius:0.875rem;padding:0.875rem;
  position:relative;overflow:hidden;
}
.stat-card::after{
  content:"";position:absolute;right:-24px;bottom:-24px;width:3.875rem;height:3.875rem;border-radius:50%;
  border:1px solid rgba(var(--gold-rgb),.25);
}
.stat-card .k{font-size:0.75rem;color:var(--muted-2);letter-spacing:.06em;}
.stat-card .v{font-family:var(--font-serif);font-size:1.6875rem;color:var(--ink);margin-top:0.3125rem;line-height:1.1;}
.stat-card .u{font-size:0.75rem;color:var(--muted-2);margin-left:0.1875rem;font-family:var(--font-sans);}
.stat-card .d{font-size:0.7188rem;color:var(--ok);margin-top:0.3125rem;}

.seg{display:flex;gap:0.25rem;background:rgba(var(--ink-rgb),.05);padding:0.25rem;border-radius:0.625rem;margin:0 1rem;}
.seg button{flex:1;height:1.875rem;border-radius:0.4375rem;font-size:0.7813rem;color:var(--muted);}
.seg button.on{background:var(--paper-2);color:var(--ink);font-weight:500;box-shadow:0 2px 6px -4px rgba(0,0,0,.3);}

.donut-wrap{display:flex;align-items:center;gap:1.25rem;}
.donut{position:relative;width:7.375rem;height:7.375rem;flex:none;}
.donut .center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.donut .center b{font-family:var(--font-serif);font-size:1.375rem;color:var(--ink);}
.donut .center span{font-size:0.6875rem;color:var(--muted-2);}
.legend{flex:1;display:flex;flex-direction:column;gap:0.5625rem;}
.legend-row{display:flex;align-items:center;gap:0.5rem;font-size:0.8125rem;}
.legend-dot{width:0.5rem;height:0.5rem;border-radius:2px;flex:none;}
.legend-row .n{flex:1;color:#5C5545;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.legend-row .v{font-variant-numeric:tabular-nums;color:var(--ink-2);}

.barlist{display:flex;flex-direction:column;gap:0.75rem;}
.bar-row .top{display:flex;justify-content:space-between;font-size:0.8125rem;margin-bottom:0.3125rem;}
.bar-row .top b{font-weight:400;color:#3B4740;}
.bar-row .top span{color:var(--muted-2);font-variant-numeric:tabular-nums;}
.bar-track{height:0.375rem;border-radius:0.375rem;background:rgba(var(--ink-rgb),.07);overflow:hidden;}
.bar-fill{height:100%;border-radius:0.375rem;background:linear-gradient(90deg,var(--ink-3),#4E8773);transition:width .7s cubic-bezier(.22,1,.36,1);}

/* ---------------- 我的 ---------------- */
.me-hero{
  position:relative;background:linear-gradient(160deg,var(--ink-2),var(--ink));color:var(--cream);
  padding:calc(env(safe-area-inset-top) + 1.625rem) 1.25rem 2.5rem;border-radius:0 0 1.75rem 1.75rem;overflow:hidden;
}
.me-hero::before{content:"";position:absolute;width:16.25rem;height:16.25rem;border-radius:50%;border:1px solid rgba(var(--gold-rgb),.18);right:-100px;top:-120px;}
.me-row{display:flex;align-items:center;gap:0.875rem;position:relative;z-index:2;}
.me-avatar{
  width:3.75rem;height:3.75rem;border-radius:50%;background:rgba(var(--cream-rgb),.1);
  border:1px solid rgba(var(--gold-rgb),.5);display:grid;place-items:center;
  font-family:var(--font-serif);font-size:1.375rem;color:#E4F1FF;
}
.me-row h1{font-family:var(--font-serif);font-size:1.25rem;font-weight:400;letter-spacing:.06em;}
.me-row p{font-size:0.7813rem;color:rgba(var(--cream-rgb),.58);margin-top:0.1875rem;}
.me-stats{
  display:flex;margin-top:1.375rem;background:rgba(255,253,248,.07);border:1px solid rgba(var(--cream-rgb),.14);
  border-radius:0.875rem;padding:0.75rem 0;position:relative;z-index:2;
}
.me-stats div{flex:1;text-align:center;position:relative;}
.me-stats div+div::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;background:rgba(var(--cream-rgb),.14);}
.me-stats b{display:block;font-family:var(--font-serif);font-size:1.2188rem;font-weight:400;}
.me-stats span{font-size:0.7188rem;color:rgba(var(--cream-rgb),.55);}

.menu{margin:-1.375rem 1rem 0;position:relative;z-index:3;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.menu-item{
  display:flex;align-items:center;gap:0.75rem;width:100%;padding:0.9375rem 1rem;text-align:left;
  border-bottom:1px solid var(--line-soft);font-size:0.9063rem;
}
.menu-item:last-child{border-bottom:none;}
.menu-item .mi-icon{
  width:2rem;height:2rem;border-radius:0.5625rem;background:rgba(var(--ink-rgb),.05);
  display:grid;place-items:center;color:var(--ink-2);flex:none;
}
.menu-item .mi-text{flex:1;}
.menu-item .mi-text small{display:block;font-size:0.7188rem;color:var(--muted-2);margin-top:1px;}
.menu-item .mi-arrow{color:#C6BCA8;}
.menu-item .badge{
  min-width:1.125rem;height:1.125rem;border-radius:6.1875rem;background:var(--copper);color:#fff;
  font-size:0.6875rem;display:grid;place-items:center;padding:0 0.3125rem;
}

/* ---------------- 弹层 ---------------- */
.sheet-mask{
  position:fixed;inset:0;background:rgba(12,30,26,.55);z-index:80;
  display:flex;align-items:flex-end;justify-content:center;
  opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;
  backdrop-filter:blur(2px);
}
.sheet-mask.on{opacity:1;visibility:visible;}
.sheet-body{
  width:100%;max-width:520px;background:var(--paper);border-radius:1.375rem 1.375rem 0 0;
  padding:0.5rem 1.125rem calc(env(safe-area-inset-bottom) + 1.125rem);
  transform:translateY(20px);transition:transform .28s cubic-bezier(.22,1,.36,1);
  max-height:86vh;overflow-y:auto;
}
.sheet-mask.on .sheet-body{transform:translateY(0);}
.sheet-grip{width:2.375rem;height:0.1875rem;border-radius:0.1875rem;background:var(--line);margin:0.375rem auto 0.875rem;}
.sheet-title{font-family:var(--font-serif);font-size:1.1563rem;margin-bottom:0.375rem;letter-spacing:.05em;}
.sheet-desc{font-size:0.8125rem;color:var(--muted);margin-bottom:1rem;line-height:1.6;}
.sheet-actions{display:flex;gap:0.625rem;margin-top:1.125rem;}
.sheet-actions .btn{flex:1;}

.toast{
  position:fixed;left:50%;top:34px;transform:translate(-50%,-16px);
  background:rgba(var(--ink-rgb),.94);color:var(--cream);padding:0.625rem 1.125rem;border-radius:0.6875rem;
  font-size:0.875rem;z-index:120;opacity:0;visibility:hidden;transition:all .25s;
  max-width:88vw;text-align:center;box-shadow:0 12px 30px -16px rgba(0,0,0,.6);
}
.toast.on{opacity:1;visibility:visible;transform:translate(-50%,0);}
.toast.err{background:rgba(140,52,42,.96);}

/* 骨架 */
.skeleton{background:linear-gradient(90deg,var(--sand) 25%,var(--paper-2) 50%,var(--sand) 75%);background-size:200% 100%;animation:sk 1.2s infinite;}
@keyframes sk{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* 进场动画 */
.reveal{animation:reveal .42s cubic-bezier(.22,1,.36,1) both;}
.reveal:nth-child(2){animation-delay:.03s;}
.reveal:nth-child(3){animation-delay:.06s;}
.reveal:nth-child(4){animation-delay:.09s;}
.reveal:nth-child(5){animation-delay:.12s;}
.reveal:nth-child(6){animation-delay:.15s;}
@keyframes reveal{from{opacity:0;transform:translateY(9px);}to{opacity:1;transform:none;}}

@media (min-width:560px){
  body{background:var(--bg-deep);}
  .app{border-left:1px solid rgba(var(--gold-rgb),.12);border-right:1px solid rgba(var(--gold-rgb),.12);}
}

/* ============================================================
   桌面端适配（>=1024px）
   移动端保持单列，宽屏改为「左侧墨绿书脊 + 右侧纸页」
   ============================================================ */

/* 侧栏默认不存在，仅桌面显示 */
#rail{display:none;}

/* 加载态 */
.page-loading{padding:7.5rem 1.25rem;text-align:center;color:var(--muted-2);}
.loading-seal{
  width:3.25rem;height:3.25rem;border-radius:50%;border:1px solid var(--line);margin:0 auto 0.875rem;
  display:grid;place-items:center;font-size:1.0313rem;color:var(--muted-2);
  animation:breathe 1.8s ease-in-out infinite;
}
.page-loading p{font-size:0.8438rem;letter-spacing:.08em;}
@keyframes breathe{0%,100%{opacity:.5;}50%{opacity:1;}}

/* 详情 / 统计 双栏容器：移动端为普通块 */
.detail-wrap{display:flex;flex-direction:column;}
.stats-cols{display:block;}
.me-wrap{display:block;}

@media (min-width:1024px){
  body{background:var(--paper);}
  body::before{display:none;}

  /* ---------- 左侧书脊 ---------- */
  #rail{
    display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;width:15rem;
    background:linear-gradient(180deg,var(--rail-1) 0%,var(--ink) 48%,var(--bg-deep) 100%);
    color:#D9D0BC;z-index:30;padding:1.375rem 0 0.875rem;
    border-right:1px solid rgba(var(--gold-rgb),.16);
  }
  .rail-brand{display:flex;align-items:center;gap:0.6875rem;padding:0 1.375rem 1.25rem;border-bottom:1px solid rgba(var(--cream-rgb),.08);}
  .rail-seal{
    height:2.5rem;padding:0 0.5rem;border-radius:0.5rem;border:1px solid rgba(var(--gold-rgb),.55);
    display:grid;place-items:center;font-size:0.7188rem;color:#E4F1FF;letter-spacing:.08em;text-indent:.08em;flex:none;
  }
  .rail-brand b{display:block;font-family:var(--font-serif);font-size:1rem;font-weight:400;letter-spacing:.12em;color:var(--cream);}
  .rail-brand span{display:block;font-size:0.6875rem;letter-spacing:.24em;color:rgba(var(--cream-rgb),.42);margin-top:0.1875rem;}
  .rail-nav{flex:1;padding:1rem 0;overflow-y:auto;}
  .rail-item{
    display:flex;align-items:center;gap:0.6875rem;width:100%;height:2.625rem;padding:0 1.375rem;
    color:rgba(var(--cream-rgb),.68);font-size:0.9063rem;position:relative;transition:all .16s;text-align:left;
  }
  .rail-item:hover{background:rgba(var(--cream-rgb),.05);color:var(--cream);}
  .rail-item.on{background:rgba(var(--gold-rgb),.1);color:#F2E7D2;}
  .rail-item.on::before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:2px;background:var(--gold);border-radius:0 2px 2px 0;}
  .rail-item.on svg{color:var(--gold);}
  .rail-badge{
    margin-left:auto;min-width:1.125rem;height:1.0625rem;border-radius:6.1875rem;background:rgba(var(--gold-rgb),.9);
    color:var(--ink);font-size:0.6875rem;font-style:normal;display:grid;place-items:center;padding:0 0.3125rem;font-weight:600;
  }
  .rail-note{padding:0.75rem 1.375rem 1rem;font-size:0.7188rem;line-height:1.9;color:rgba(var(--cream-rgb),.26);letter-spacing:.08em;}
  .rail-user{
    display:flex;align-items:center;gap:0.625rem;margin:0 0.75rem;padding:0.6875rem 0.625rem;border-radius:0.625rem;
    border-top:1px solid rgba(var(--cream-rgb),.08);color:inherit;text-align:left;
  }
  .rail-user:hover{background:rgba(var(--cream-rgb),.05);}
  .rail-avatar{
    width:2rem;height:2rem;border-radius:50%;background:rgba(var(--cream-rgb),.1);
    border:1px solid rgba(var(--gold-rgb),.4);display:grid;place-items:center;font-size:0.875rem;color:#E4F1FF;flex:none;
  }
  .rail-user-info{flex:1;min-width:0;}
  .rail-user-info b{display:block;font-size:0.8438rem;font-weight:400;color:var(--cream);}
  .rail-user-info i{
    display:block;font-style:normal;font-size:0.6875rem;color:rgba(var(--cream-rgb),.45);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }

  /* ---------- 内容容器 ---------- */
  #app{max-width:none;margin:0;padding-left:15rem;padding-bottom:0;box-shadow:none;min-height:100vh;}
  #app.page-login{padding-left:0;}
  .stage{max-width:1160px;margin:0 auto;min-height:100vh;}
  .page-detail .stage,.page-form .stage{max-width:1000px;}
  .page-login .stage{max-width:none;}

  /* ---------- 隐藏移动件 ---------- */
  .tabbar{display:none;}
  .fab{
    right:max(28px,calc((100vw - 240px - 1160px)/2 + 28px));
    bottom:34px;width:3.5rem;height:3.5rem;
  }
  .bottombar,.submit-bar{
    left:240px;right:0;width:auto;max-width:none;transform:none;
    justify-content:center;padding:0.75rem 1.5rem;
  }
  .bottombar .btn,.submit-bar .btn{flex:0 0 220px;}

  /* ---------- 列表页 ---------- */
  .topbar{
    display:block;
    padding:1.625rem 2.5rem 3.625rem;border-radius:0 0 1.625rem 1.625rem;
  }
  .topbar .greet{margin-top:0;}
  .topbar .greet h1{font-size:1.75rem;}

  .search-wrap{margin:-2.125rem 2.5rem 0;max-width:620px;}
  .view-switch{margin:1.125rem 2.5rem 0;}
  .filter-row{padding:0.875rem 2.5rem 0.25rem;}
  .section-head{padding:1.375rem 2.5rem 0.75rem;}
  .section-head h2{font-size:1.1563rem;}
  .list{display:grid;grid-template-columns:repeat(2,1fr);gap:0.875rem;padding:0.25rem 2.5rem 0;}
  .list > .empty{grid-column:1/-1;}

  /* ---------- 详情 ---------- */
  .detail-hero{padding:1.625rem 2.5rem 2.5rem;border-radius:0 0 1.625rem 1.625rem;}
  .detail-hero h1{font-size:1.75rem;}
  .detail-wrap{
    display:grid;grid-template-columns:1fr 1.1fr;gap:0 1.125rem;
    align-items:start;padding:0 2.5rem;
  }
  .detail-col-main .info-card{margin:-1.375rem 0 0;}
  .detail-col-main .block,.detail-col-side .block{margin:1rem 0;}
  .detail-col-side .block:first-child{margin-top:-1.375rem;}
  .detail-col-side .timeline{max-height:640px;overflow-y:auto;padding-right:0.25rem;}

  /* ---------- 表单 ---------- */
  .form-head{padding:1.5rem 2.5rem 1.875rem;border-radius:0 0 1.5rem 1.5rem;}
  .form-head h1{font-size:1.5rem;}
  .form-group{
    display:grid;grid-template-columns:1fr 1fr;column-gap:1.125rem;
    margin:1rem 2.5rem;padding:1.25rem;
  }
  .form-group .group-title{grid-column:1/-1;}
  .form-group .field{min-width:0;}
  .form-group .row-2{display:contents;}
  .form-group .chips-select{grid-column:1/-1;}
  .form-group > .tiny{grid-column:1/-1;}

  /* ---------- 统计 ---------- */
  .stat-grid{grid-template-columns:repeat(4,1fr);gap:0.875rem;padding:0 2.5rem;}
  .seg{margin:1.25rem 2.5rem 0;}
  .stats-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 1.125rem;align-items:start;padding:0 2.5rem;}
  .stats-cols .block{margin:1rem 0;}
  .stats-cols .stats-col-side .block:first-child{margin-top:1rem;}

  /* ---------- 公共池 / 审核 / 我的 ---------- */
  .page-pool .list{grid-template-columns:repeat(2,1fr);}
  .page-me .me-wrap{max-width:860px;margin:0 auto;}
  .page-me .me-hero{border-radius:1.375rem;padding:2.125rem 2.5rem 2.875rem;}
  .page-me .menu{margin:1rem 2.5rem 0;}
  .page-me .block{margin:0 2.5rem;}

  /* ---------- 登录页左右分栏 ---------- */
  .login{flex-direction:row;align-items:stretch;min-height:100vh;}
  .login-hero{
    flex:0 0 46%;max-width:660px;height:100vh;border-radius:0;
    padding:0 3.75rem;display:flex;flex-direction:column;justify-content:center;
  }
  .login-seal{margin-bottom:1.75rem;}
  .login-hero h1{font-size:2.5rem;line-height:1.45;}
  .login-hero p{font-size:0.875rem;letter-spacing:.12em;margin-top:1rem;}
  .login-hero .hero-note{margin-top:1.625rem;}
  .login-card{
    flex:0 1 440px;margin:auto 3rem;max-height:calc(100vh - 64px);overflow-y:auto;
  }
  .login-card .login-form{padding:1.5rem 1.5rem 1.625rem;}
  .login-foot{
    position:absolute;left:60px;bottom:30px;margin:0;padding:0;text-align:left;
  }
}

/* 审核列表容器（桌面端加宽内边距） */
.audit-list{padding:0.875rem 1rem 1.875rem;}
@media (min-width:1024px){
  .audit-list{padding:1rem 2.5rem 2.25rem;}
  .stage{padding-bottom:2rem;}
  .login-foot{color:rgba(var(--cream-rgb),.62);letter-spacing:.16em;}
  .topbar{grid-template-columns:minmax(0,1fr) 360px;}
}
@media (min-width:1024px) and (max-width:1200px){
  .topbar{grid-template-columns:minmax(0,1fr) 310px;gap:0.875rem 1.25rem;padding:1.375rem 1.75rem 3.5rem;}
  .search-wrap{margin:-1.875rem 1.75rem 0;}
  .view-switch{margin:1rem 1.75rem 0;}
  .filter-row{padding:0.75rem 1.75rem 0.25rem;}
  .section-head{padding:1.25rem 1.75rem 0.625rem;}
  .list{padding:0.25rem 1.75rem 0;}
  .stat-grid{padding:0 1.75rem;}
  .seg{margin:1.125rem 1.75rem 0;}
  .stats-cols{padding:0 1.75rem;}
  .detail-wrap{padding:0 1.75rem;}
  .detail-hero{padding:1.5rem 1.75rem 2.375rem;}
  .form-group{margin:0.875rem 1.75rem;}
  .form-head{padding:1.375rem 1.75rem 1.75rem;}
}

/* ============================================================
   桌面端细节修正
   ============================================================ */
@media (min-width:1024px){
  /* 页头统一成圆角卡片，避免顶部左侧出现直角缺口 */
  .topbar,.detail-hero,.form-head,.me-hero{border-radius:1.375rem;margin-top:1rem;}

  /* 底部操作条：按钮定宽居中（覆盖模板里的内联 flex） */
  .bottombar .btn,.submit-bar .btn{flex:0 0 220px !important;max-width:220px;}

  /* 登录页：提示条不要被拉伸，登录卡在右侧区域内居中 */
  .login-hero{align-items:flex-start;}
  .login-card{margin:auto;}
  .login-foot{color:rgba(var(--cream-rgb),.62);}

  /* 统计左栏内容不要过于空旷 */
  .stats-col-main .donut-wrap{justify-content:flex-start;}
}

@media (min-width:1024px){
  /* 详情页头是定位元素，双栏容器需要抬高层级，否则负边距的跟进卡会被页头盖住 */
  .detail-wrap{position:relative;z-index:4;}
}

@media (min-width:1024px){
  /* 复领审核：控制阅读宽度，操作按钮靠右定宽 */
  .page-audit .audit-list{max-width:900px;}
  .page-audit .seg{max-width:420px;}
  .audit-list .card > div:last-child{justify-content:flex-end;}
  .audit-list .card .btn{flex:0 0 150px !important;max-width:150px;}
}



/* ============================================================
   主题配色方案（蓝色系）
   色系取自客户提供的原型预览图（蓝白配色）：
   顶栏蓝 #448AD6、页面底 #EFF6FE、卡片 #FFFFFF、微信绿 #00B95A
   用法：<body data-theme="skyline"> 或地址栏 ?theme=skyline
   ============================================================ */

/* 原型蓝：完全对齐原型图的蓝白关系 */
body[data-theme="skyline"]{
  --brand:#4489D8;
  --rail-1:#2A66B2;
  --ink:#2C6CBC;
  --ink-2:#3B81D2;
  --ink-3:#5C9FE6;
  --ink-rgb:44,108,188;
  --ink2-rgb:59,129,210;
  --ink3-rgb:92,159,230;
  --hero-1:#5FA3E8;
  --bg-deep:#173F6B;
  --paper:#EFF6FE;
  --paper-2:#FFFFFF;
  --field:#F7FBFF;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E6F1FE;
  --line:#D8E7F7;
  --line-soft:#E8F2FC;
  --copper:#3B81D2;
  --copper-rgb:59,129,210;
  --copper-text:#1E5FA8;
  --gold:#BFE0FF;
  --gold-rgb:191,224,255;
  --gold-text:#1E5FA8;
  --danger:#E5484D;
  --warn:#E0902F;
  --ok:#00A85A;
  --muted:#6C86A0;
  --muted-2:#93A9BE;
  --text:#1F3B57;
  --glow-1:rgba(92,159,230,.35);
  --glow-2:rgba(68,137,216,.18);
  --shadow:0 10px 30px -18px rgba(30,80,140,.28);
}

/* 晴空蓝：比原型更亮更艳，年轻、有冲劲 */
body[data-theme="azure"]{
  --brand:#2E9BFF;
  --rail-1:#1268D6;
  --ink:#1268D6;
  --ink-2:#2385EE;
  --ink-3:#4FA8FF;
  --ink-rgb:18,104,214;
  --ink2-rgb:35,133,238;
  --ink3-rgb:79,168,255;
  --hero-1:#55B4FF;
  --bg-deep:#0B3F86;
  --paper:#F0F8FF;
  --paper-2:#FFFFFF;
  --field:#F6FBFF;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E3F2FF;
  --line:#CFE6FA;
  --line-soft:#E3F1FD;
  --copper:#2385EE;
  --copper-rgb:35,133,238;
  --copper-text:#0F5FC4;
  --gold:#A8DCFF;
  --gold-rgb:168,220,255;
  --gold-text:#0F5FC4;
  --danger:#F04438;
  --warn:#E08A2A;
  --ok:#00B365;
  --muted:#5F7F9E;
  --muted-2:#8FA9C2;
  --text:#12344F;
  --glow-1:rgba(79,168,255,.38);
  --glow-2:rgba(46,155,255,.2);
  --shadow:0 10px 30px -18px rgba(10,70,150,.3);
}

/* 深海蓝：压深两档，长时间看更稳 */
body[data-theme="deepsea"]{
  --brand:#3E77B8;
  --rail-1:#173E66;
  --ink:#1E4E80;
  --ink-2:#2A5F97;
  --ink-3:#3E77B8;
  --ink-rgb:30,78,128;
  --ink2-rgb:42,95,151;
  --ink3-rgb:62,119,184;
  --hero-1:#3E77B8;
  --bg-deep:#0E2A45;
  --paper:#F1F6FB;
  --paper-2:#FFFFFF;
  --field:#F7FAFD;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E4EDF6;
  --line:#D2E0EE;
  --line-soft:#E2ECF6;
  --copper:#2A5F97;
  --copper-rgb:42,95,151;
  --copper-text:#17456F;
  --gold:#A9C6E2;
  --gold-rgb:169,198,226;
  --gold-text:#17456F;
  --danger:#D9463F;
  --warn:#C8871A;
  --ok:#1E8E5A;
  --muted:#62798F;
  --muted-2:#8DA2B5;
  --text:#1A3149;
  --glow-1:rgba(62,119,184,.35);
  --glow-2:rgba(30,78,128,.18);
  --shadow:0 10px 30px -18px rgba(16,55,95,.3);
}

/* 青碧蓝：往青里偏一点，清爽 */
body[data-theme="lagoon"]{
  --brand:#2FA8C7;
  --rail-1:#12657F;
  --ink:#146F8C;
  --ink-2:#1C87A6;
  --ink-3:#2FA8C7;
  --ink-rgb:20,111,140;
  --ink2-rgb:28,135,166;
  --ink3-rgb:47,168,199;
  --hero-1:#3FBBD8;
  --bg-deep:#0A4256;
  --paper:#F0F9FB;
  --paper-2:#FFFFFF;
  --field:#F6FCFD;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E0F4F8;
  --line:#CCE7EE;
  --line-soft:#DFF1F6;
  --copper:#1C87A6;
  --copper-rgb:28,135,166;
  --copper-text:#0E5E76;
  --gold:#A5E3EF;
  --gold-rgb:165,227,239;
  --gold-text:#0E5E76;
  --danger:#E04B4B;
  --warn:#D08A22;
  --ok:#0FA97A;
  --muted:#5E8492;
  --muted-2:#8BA9B4;
  --text:#143B47;
  --glow-1:rgba(63,187,216,.35);
  --glow-2:rgba(47,168,199,.18);
  --shadow:0 10px 30px -18px rgba(10,75,95,.28);
}

/* 雾蓝：低饱和灰蓝，最安静的一版 */
body[data-theme="mist"]{
  --brand:#5B87B5;
  --rail-1:#315F84;
  --ink:#3A6591;
  --ink-2:#4A769F;
  --ink-3:#6A94BE;
  --ink-rgb:58,101,145;
  --ink2-rgb:74,118,159;
  --ink3-rgb:106,148,190;
  --hero-1:#7FA3C7;
  --bg-deep:#1E3F5C;
  --paper:#F3F7FA;
  --paper-2:#FFFFFF;
  --field:#F8FBFD;
  --cream:#FFFFFF;
  --cream-rgb:255,255,255;
  --sand:#E7EFF5;
  --line:#D6E2EC;
  --line-soft:#E6EEF5;
  --copper:#4A769F;
  --copper-rgb:74,118,159;
  --copper-text:#2A5378;
  --gold:#BFD4E6;
  --gold-rgb:191,212,230;
  --gold-text:#2A5378;
  --danger:#D9524B;
  --warn:#C98C36;
  --ok:#2C8B62;
  --muted:#6E8093;
  --muted-2:#93A5B6;
  --text:#233545;
  --glow-1:rgba(127,163,199,.32);
  --glow-2:rgba(58,101,145,.16);
  --shadow:0 10px 30px -18px rgba(30,60,90,.26);
}

/* 用量环：颜色跟随主题（原先写死在 JS 里） */
.usage-ring .ring-fg{stroke:var(--gold);}

/* ============================================================
   系统设置
   ============================================================ */
.page-settings .topbar{padding-bottom:2.5rem;}
.font-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;}
.fs-btn{
  border:1px solid var(--line);border-radius:.75rem;background:var(--paper-2);
  padding:.625rem .25rem .5rem;display:flex;flex-direction:column;align-items:center;gap:.375rem;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .1s ease;
}
.fs-btn b{font-family:var(--font-serif);font-weight:400;color:var(--ink);line-height:1;}
.fs-btn span{font-size:.75rem;color:var(--muted-2);letter-spacing:.06em;}
.fs-btn[data-fs="s"] b{font-size:1rem;}
.fs-btn[data-fs="m"] b{font-size:1.25rem;}
.fs-btn[data-fs="l"] b{font-size:1.5rem;}
.fs-btn[data-fs="xl"] b{font-size:1.75rem;}
.fs-btn.on{border-color:var(--ink);background:rgba(var(--ink-rgb),.06);box-shadow:0 0 0 2px rgba(var(--ink-rgb),.07);}
.fs-btn.on span{color:var(--ink);}
.fs-btn:active{transform:scale(.97);}

.fs-preview{margin-top:.25rem;padding:.875rem;border:1px solid var(--line-soft);border-radius:.75rem;background:var(--field);}
.fsp-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;}
.fsp-head .tag{flex:none;white-space:nowrap;}
.fsp-head b{font-family:var(--font-serif);font-size:1rem;font-weight:400;letter-spacing:.02em;color:var(--text);line-height:1.5;}
.fs-preview p{font-size:.8438rem;color:var(--muted);margin-top:.375rem;}
.fsp-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.625rem;flex-wrap:wrap;}
.set-note{display:grid;gap:.75rem;}
.set-note div{display:flex;gap:.5rem;align-items:flex-start;font-size:.8125rem;color:var(--muted);line-height:1.8;}
.set-note svg{flex:none;margin-top:.1875rem;color:var(--ink-2);}

@media (min-width:1024px){
  .page-settings .stage{max-width:860px;}
  .page-settings .font-steps{gap:.75rem;}
  .page-settings .fs-btn{padding:1rem .5rem .75rem;}
}

/* ============================================================
   时间区间筛选 / 分页
   ============================================================ */

/* 筛选行左侧的小标签 */
.filter-label{
  display:inline-flex;align-items:center;height:1.75rem;padding:0 0.4375rem;margin-right:0.25rem;
  border-radius:0.4375rem;background:rgba(var(--ink-rgb),.06);color:var(--ink-2);
  font-size:0.6875rem;letter-spacing:.14em;flex:none;
}

/* ---------- 分页 ---------- */
.pager{
  display:flex;align-items:center;justify-content:center;gap:0.5rem;
  margin:0.875rem 1rem 0;padding:0.5rem;flex-wrap:wrap;
}
.pager.single{justify-content:center;color:var(--muted-2);font-size:0.75rem;}
.pager-total{text-align:center;font-size:0.6875rem;color:var(--muted-2);margin:0.25rem 0 0;letter-spacing:.08em;}
.pg-btn,.pg-num{
  height:1.9375rem;min-width:1.9375rem;padding:0 0.625rem;border-radius:0.5rem;
  border:1px solid var(--line);background:var(--paper-2);color:var(--muted);
  font-size:0.75rem;letter-spacing:.04em;transition:all .16s ease;
}
.pg-btn:hover:not([disabled]),.pg-num:hover{border-color:var(--ink-3);color:var(--ink);}
.pg-btn[disabled]{opacity:.42;cursor:not-allowed;}
.pg-num{font-variant-numeric:tabular-nums;padding:0 0.5rem;}
.pg-num.on{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:500;}
.pg-nums{display:flex;align-items:center;gap:0.25rem;flex-wrap:wrap;justify-content:center;}
.pg-gap{color:var(--muted-2);font-size:0.6875rem;padding:0 0.125rem;}

/* ---------- 详情页：下次跟进卡（替代原「跟进节奏」区块） ---------- */
.next-card{
  display:flex;align-items:center;gap:0.625rem;margin:-0.75rem 1rem 0;position:relative;z-index:4;
  padding:0.8125rem 0.9375rem;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);
}
.nc-main{display:flex;align-items:center;gap:0.5rem;min-width:0;flex-wrap:wrap;}
.nc-k{font-size:0.6875rem;color:var(--muted-2);letter-spacing:.14em;white-space:nowrap;}
.nc-v{
  font-size:1.0625rem;color:var(--ink);letter-spacing:.04em;white-space:nowrap;
  padding:0.125rem 0.4375rem;border-radius:0.375rem;background:rgba(var(--ink-rgb),.07);
}
.nc-side{
  margin-left:auto;display:flex;flex-direction:column;gap:0.0625rem;text-align:right;flex:none;
  font-size:0.6875rem;color:var(--muted-2);white-space:nowrap;
}

/* ============================================================
   统计：业务员筛选 / 折线图 / 堆叠柱状图
   ============================================================ */
.member-filter{
  display:flex;align-items:center;gap:0.5rem;margin:0.875rem 1rem 0;
}
.mf-label{font-size:0.6875rem;color:var(--muted-2);letter-spacing:.14em;flex:none;}
.mf-select{
  flex:1;height:2.125rem;padding:0 0.625rem;border-radius:0.625rem;
  border:1px solid var(--line);background:var(--paper-2);color:var(--text);
  font-size:0.8125rem;appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
.mf-select:focus{border-color:var(--ink-3);outline:none;}

.trend-wrap{margin-top:0.875rem;}
.trend-block .block-title span{display:flex;align-items:center;gap:0.25rem;}
.trend-tab{
  height:1.5rem;padding:0 0.5rem;border-radius:0.375rem;font-size:0.6875rem;color:var(--muted);
  border:1px solid transparent;transition:all .16s ease;
}
.trend-tab.on{background:rgba(var(--ink-rgb),.08);color:var(--ink);border-color:rgba(var(--ink-rgb),.16);}

.chart{margin-top:0.25rem;}
.line-svg{display:block;width:100%;height:9rem;}
.chart-legend{display:flex;gap:1rem;margin-top:0.625rem;font-size:0.6875rem;color:var(--muted);}
.chart-legend span{display:inline-flex;align-items:center;gap:0.375rem;}
.chart-legend i{width:0.625rem;height:0.125rem;border-radius:2px;display:inline-block;}

.bars{display:flex;flex-direction:column;gap:0.75rem;}
.bar-track.stack{display:flex;height:0.5rem;padding:0;border-radius:0.25rem;overflow:hidden;}
.bar-track.stack .seg-coop,.bar-track.stack .seg-un{height:100%;display:block;}
.bar-track.stack .seg-coop{border-radius:0.25rem 0 0 0.25rem;}
.bar-track.stack .seg-un{border-radius:0 0.25rem 0.25rem 0;}
.bars .bar-row .top b{font-weight:400;color:var(--text);}

/* 图表文字色跟随主题（原先是墨绿时代的固定暖色） */
.legend-row .n{color:var(--text);}
.bar-row .top b{color:var(--text);}

/* 环图：SVG 随容器缩放，避免桌面端错位 */
.donut svg{display:block;width:100%;height:100%;}

@media (min-width:1024px){
  .filter-label{height:2rem;}
  .pager{margin:1.25rem 2.5rem 0;}
  .tl-item{padding-bottom:1rem;}
  .next-card{margin:-1.375rem 2.5rem 0;padding:0.875rem 1.25rem;}
  .member-filter{margin:0.875rem 2.5rem 0;max-width:22rem;}
  .trend-wrap{margin:1rem 2.5rem 0;}
  .line-svg{height:11.5rem;}
  .stat-grid{margin-top:0;}
}

/* 统计维度标签在窄屏允许换行，避免「业务员对比」被截断 */
.seg{flex-wrap:wrap;row-gap:.25rem;}
.seg button{flex:0 0 auto;padding:0 0.625rem;}
@media (min-width:1024px){
  .seg{flex-wrap:nowrap;}
  .seg button{flex:1;}
}

/* 业务员筛选：上移压住页头下沿，与列表页搜索框的层次一致 */
.member-filter{margin-top:-1.125rem;position:relative;z-index:6;}
@media (min-width:1024px){
  .member-filter{margin-top:-1.375rem;}
}

/* ============================================================
   版本号页脚（每个页面都显示）
   ============================================================ */
.ver-foot{
  text-align:center;
  font-size:0.6875rem;
  color:var(--muted-2);
  letter-spacing:.1em;
  padding:0.75rem 1rem 1.5rem;
  opacity:.72;
  -webkit-user-select:none;
  user-select:none;
}
.ver-foot .ver-build{
  display:inline-block;
  margin-left:5px;
  padding:1px 6px;
  border-radius:4px;
  background:rgba(var(--ink-rgb),.07);
  color:var(--ink-3);
  font-size:0.625rem;
  letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
  vertical-align:1px;
}
@media (min-width:1024px){
  .ver-foot{padding:1rem 2.5rem 1.75rem;}
}

/* ============================================================
   新版本提示条
   ============================================================ */
.update-tip{
  position:fixed;left:50%;bottom:84px;transform:translateX(-50%);
  display:flex;align-items:center;gap:9px;z-index:130;
  padding:10px 12px 10px 14px;border-radius:12px;
  background:rgba(18,104,214,.96);color:#EAF4FF;
  box-shadow:0 16px 38px -18px rgba(0,0,0,.6);
  font-size:0.8125rem;letter-spacing:.03em;
  animation:tip-in .32s cubic-bezier(.2,.9,.3,1.2);
  max-width:calc(100vw - 32px);
}
.update-tip svg{flex:none;color:#9FD4FF;}
.update-tip span{white-space:nowrap;}
.ut-btn{
  flex:none;height:1.75rem;padding:0 0.75rem;border-radius:0.5rem;
  background:#fff;color:var(--ink);font-size:0.75rem;font-weight:500;
  transition:transform .14s ease;
}
.ut-btn:active{transform:scale(.95);}
.ut-x{
  flex:none;width:1.5rem;height:1.5rem;display:grid;place-items:center;
  color:rgba(234,244,255,.7);border-radius:0.375rem;
}
.ut-x:hover{color:#fff;background:rgba(255,255,255,.12);}
@keyframes tip-in{
  from{opacity:0;transform:translate(-50%,16px);}
  to{opacity:1;transform:translate(-50%,0);}
}
@media (min-width:1024px){
  .update-tip{bottom:28px;}
}

/* ============================================================
   附件（客户资料图片 / 跟进记录附件）
   ============================================================ */
.att-picker{
  border:1px dashed var(--line);border-radius:0.75rem;
  padding:0.625rem;background:var(--field);
}
.att-list{display:flex;flex-direction:column;gap:0.4375rem;}
.att-list:empty{display:none;}

.att-item{
  display:flex;align-items:center;gap:0.625rem;
  padding:0.5rem 0.5625rem;border-radius:0.5625rem;
  background:var(--paper-2);border:1px solid var(--line-soft);
}
.att-item img{
  width:2.5rem;height:2.5rem;object-fit:cover;border-radius:0.375rem;flex:none;
  background:var(--sand);
}
.att-thumb{flex:none;display:block;}
.att-ico{
  width:2.5rem;height:2.5rem;border-radius:0.375rem;flex:none;
  display:grid;place-items:center;background:rgba(var(--ink-rgb),.07);color:var(--ink-3);
}
.att-meta{flex:1;min-width:0;}
.att-meta b{
  display:block;font-size:0.8125rem;font-weight:400;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5;
}
.att-meta i{
  display:block;font-style:normal;font-size:0.6875rem;color:var(--muted-2);margin-top:1px;
}
.att-dl{
  flex:none;font-size:0.6875rem;color:var(--ink-3);
  padding:0.1875rem 0.4375rem;border-radius:0.3125rem;
  background:rgba(var(--ink-rgb),.06);text-decoration:none;
}
.att-del{
  flex:none;width:1.375rem;height:1.375rem;border-radius:0.3125rem;
  display:grid;place-items:center;color:var(--muted-2);
  transition:all .16s ease;
}
.att-del:hover{color:var(--danger);background:rgba(176,71,58,.1);}

.att-add{
  display:flex;align-items:center;justify-content:center;gap:0.375rem;
  height:2.25rem;margin-top:0.5rem;border-radius:0.5625rem;cursor:pointer;
  border:1px solid var(--line);background:var(--paper-2);
  font-size:0.8125rem;color:var(--ink-2);
  transition:all .16s ease;
}
.att-add:hover{border-color:var(--ink-3);background:rgba(var(--ink-rgb),.04);}
.att-hint{
  font-size:0.6875rem;color:var(--muted-2);margin-top:0.375rem;text-align:center;
  letter-spacing:.04em;
}

/* 只读附件列表（详情页） */
.att-view{display:flex;flex-direction:column;gap:0.4375rem;}
.att-view .att-item{background:var(--paper-2);}

@media (min-width:1024px){
  .att-picker{padding:0.75rem;}
  .att-list{flex-direction:row;flex-wrap:wrap;}
  .att-list .att-item{width:calc(50% - 0.25rem);}
  .att-add{margin-top:0.625rem;}
}

/* ============================================================
   记住登录状态
   ============================================================ */
.remember-row{
  display:flex;align-items:center;gap:0.4375rem;cursor:pointer;
  margin-top:0.75rem;user-select:none;-webkit-user-select:none;
}
.remember-row input{
  width:15px;height:15px;flex:none;margin:0;
  accent-color:var(--ink);cursor:pointer;
}
.remember-row span{
  font-size:0.75rem;color:var(--muted-2);line-height:1.5;
}
.remember-row:hover span{color:var(--muted);}