/* 客湖客户台账 · 共享样式（毛玻璃 + 小狐 + 苹果风） */
:root{
  --paper:#eaedf5;
  --card:rgba(255,255,255,.60);
  --card-solid:rgba(255,255,255,.92);
  --ink:#1c1b29;--ink-soft:#4a4857;--ink-faint:#6b6a7d;
  --line:rgba(255,255,255,.65);--line-soft:rgba(120,110,140,.16);
  --accent:#61007D;--accent-soft:rgba(97,0,125,.12);
  --blue:#3f7dd4;--green:#3f9d63;--amber:#c9891f;--red:#c93f6a;
  --shadow:0 1px 1px rgba(20,12,40,.04),0 14px 44px rgba(35,20,70,.13);
  --serif:'Fraunces',Georgia,'Songti SC',serif;
  --sans:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei','Noto Sans SC','Segoe UI',sans-serif;
  --radius:18px;
}
:root[data-theme="dark"]{
  --paper:#0d0a16;--card:rgba(38,32,55,.55);--card-solid:rgba(40,34,58,.95);
  --ink:#f2eefb;--ink-soft:#bbb2cd;--ink-faint:#9b93ad;
  --line:rgba(255,255,255,.12);--line-soft:rgba(255,255,255,.08);
  --accent:#c98fe6;--accent-soft:rgba(201,143,230,.16);  /* 61007D 暗色下提亮版，保证可读 */
  --shadow:0 1px 1px rgba(0,0,0,.3),0 18px 50px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100vh;color:var(--ink);font-family:var(--sans);background:var(--paper)}
body{
  background:
    radial-gradient(920px 620px at 10% -8%, rgba(97,0,125,.24), transparent 60%),
    radial-gradient(820px 600px at 96% 6%, rgba(64,140,255,.22), transparent 55%),
    radial-gradient(760px 720px at 50% 114%, rgba(255,95,180,.16), transparent 60%),
    var(--paper);
  background-attachment:fixed;
}
:root[data-theme="dark"] body{
  background:
    radial-gradient(920px 620px at 10% -8%, rgba(97,0,125,.42), transparent 60%),
    radial-gradient(820px 600px at 96% 6%, rgba(40,90,200,.36), transparent 55%),
    radial-gradient(760px 720px at 50% 114%, rgba(190,50,130,.32), transparent 60%),
    var(--paper);
}
.fox-watermark{position:fixed;right:-30px;bottom:-26px;width:230px;height:230px;background:url(/assets/kehu-fox.png) center/contain no-repeat;opacity:.06;pointer-events:none;z-index:0;user-select:none}
.fox-watermark.tl{right:auto;left:-46px;top:70px;bottom:auto;width:148px;height:148px;opacity:.05;transform:scaleX(-1)}
@media(max-width:640px){.fox-watermark.tl{display:none}}

.wrap{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:26px 22px 70px}
.glass{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(22px) saturate(165%);backdrop-filter:blur(22px) saturate(165%)}

/* 顶栏 */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:11px;color:var(--accent);font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:.4px;text-decoration:none}
.brand img{width:34px;height:34px;border-radius:10px;box-shadow:0 2px 8px rgba(84,0,122,.28)}
.topbar-r{display:flex;align-items:center;gap:10px}
.chip{font-size:12.5px;color:var(--ink-soft);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 12px;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--ink-soft);
  border-radius:11px;padding:8px 14px;font-size:13.5px;cursor:pointer;transition:.15s;text-decoration:none;font-family:var(--sans)}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--accent);color:#fff;border-color:transparent;font-weight:600;box-shadow:0 6px 18px rgba(97,0,125,.3)}
.btn.primary:hover{filter:brightness(1.07);color:#fff}
.btn.sm{padding:5px 10px;font-size:12.5px;border-radius:9px}
.btn.ghost{background:transparent}
.icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon.lg{width:26px;height:26px}

h1{font-family:var(--serif);font-size:27px;font-weight:600;letter-spacing:.5px;margin:0 0 4px}
.sub{color:var(--ink-soft);font-size:13.5px;margin:0}

/* 客户卡片 */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:860px){.grid{grid-template-columns:1fr}}
.mcard{display:flex;flex-direction:column;gap:14px;padding:22px 24px;text-decoration:none;color:inherit;cursor:pointer;transition:.2s;position:relative;overflow:hidden}
.mcard:hover{transform:translateY(-3px);border-color:var(--accent)}
.mcard .top{display:flex;align-items:center;gap:14px}
.mcard .ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--accent-soft);color:var(--accent)}
.mcard h3{margin:0;font-family:var(--serif);font-size:21px;font-weight:600}
.mcard .meta{font-size:12.5px;color:var(--ink-faint);margin-top:2px}
.mcard .kpi{display:flex;gap:16px;margin-top:2px}
.mcard .kpi .k{font-size:12px;color:var(--ink-faint)}
.mcard .kpi .v{font-size:18px;font-weight:700;color:var(--ink)}
.mcard.locked{opacity:.5;cursor:not-allowed}
.mcard.locked:hover{transform:none;border-color:var(--line)}

/* 汇总小卡（auto-fit：卡数不足 5 张时自适应填满整行，避免右侧留空；多卡页按 ≥170px 自动换行） */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:16px 0}
@media(max-width:860px){.tiles{grid-template-columns:repeat(2,1fr)}}
.tile{padding:15px 17px}
.tile .t{font-size:12px;color:var(--ink-faint)}
.tile .v{font-size:23px;font-weight:800;color:var(--accent);margin-top:3px;letter-spacing:-.5px}
.tile .n{font-size:11.5px;color:var(--ink-faint);margin-top:2px}
.tile .paid{font-size:11.5px;color:var(--green);margin-top:3px;font-weight:600}
.tile.total .v{color:var(--ink)}

/* 期间切换 */
.seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:3px;gap:2px;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.seg button{border:0;background:transparent;color:var(--ink-soft);font-size:13px;padding:6px 14px;border-radius:8px;cursor:pointer;font-family:var(--sans)}
.seg button.on{background:var(--accent);color:#fff;font-weight:600}
select.period{border:1px solid var(--line);background:var(--card-solid);border-radius:9px;padding:6px 10px;font-size:13px;color:var(--ink);font-family:var(--sans)}

/* Tab */
.tabs{display:flex;gap:6px;margin:18px 0 14px;flex-wrap:wrap}
.tab{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);border-radius:11px;padding:8px 18px;font-size:14px;cursor:pointer;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-family:var(--sans)}
.tab.on{background:var(--accent);color:#fff;font-weight:600;border-color:transparent}

/* 表格 */
.tablewrap{overflow-x:auto;border-radius:var(--radius)}
table.data{width:100%;border-collapse:collapse;font-size:13px;min-width:720px}
table.data th,table.data td{padding:9px 11px;text-align:left;white-space:nowrap}
/* 表头不透明，滚动时数据不透视 */
table.data thead th{background:linear-gradient(var(--accent-soft),var(--accent-soft)),var(--card-solid);color:var(--ink-soft);font-weight:700;font-size:12px;position:sticky;top:0;z-index:2}

/* 模块页：红圈(顶栏+汇总+Tab+筛选)冻结，仅蓝圈表格滚动（桌面/宽屏）*/
/* 桌面加宽容器，让明细尽量完整显示（不铺满整屏，两侧留边更耐看）*/
/* 不再冻结顶部：整页正常滚动（笔记本屏也有足够列表空间）；宽表仍可横向滚动 */
.mod-page .wrap{max-width:min(1760px,95vw)}
.mod-page .tiles{margin:12px 0}
.mod-page .tabs{margin:12px 0 10px}
.mod-page .tablewrap{overflow-x:auto}
.mod-page .footer{margin-top:10px}

/* 手机端：不整块冻结(否则表格没空间)，改为正常滚动+表头吸顶；汇总卡横向滑动省纵向空间 */
@media(max-width:760px){
  .mod-page .wrap{height:auto;display:block;overflow:visible;padding-bottom:56px;max-width:100%}
  .mod-page .tablewrap{flex:none;min-height:0;overflow-x:auto}
  .mod-page .tiles{display:flex;overflow-x:auto;gap:10px;margin:12px 0;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .mod-page .tiles>*{flex:0 0 46%;scroll-snap-align:start}
}
table.data tbody tr{border-top:1px solid var(--line-soft)}
table.data tbody tr:hover{background:var(--accent-soft)}
table.data td.num{text-align:right;font-variant-numeric:tabular-nums}
.badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px}
.badge.yes{background:rgba(63,157,99,.16);color:var(--green)}
.badge.no{background:rgba(201,63,106,.16);color:var(--red)}
.badge.warn{background:rgba(201,137,31,.18);color:var(--amber)}
.rowbtn{border:1px solid var(--line-soft);background:transparent;color:var(--ink-faint);border-radius:7px;padding:3px 7px;font-size:11.5px;cursor:pointer}
.rowbtn:hover{border-color:var(--accent);color:var(--accent)}
.reminder-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);margin-right:5px;vertical-align:middle}
.cell-clip{display:inline-block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
@media(max-width:680px){.cell-clip{max-width:150px}}
.filterbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.filterbar input,.filterbar select{border:1px solid var(--line);background:var(--card-solid);border-radius:9px;padding:6px 10px;font-size:12.5px;color:var(--ink);outline:none;font-family:var(--sans)}
.filterbar input:focus,.filterbar select:focus{border-color:var(--accent)}
.filterbar input.search{min-width:200px}
.filterbar .fl{font-size:11.5px;color:var(--ink-faint);margin-left:4px}

/* 登录 */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.login-card{width:100%;max-width:390px;padding:34px 32px}
.login-card .logo{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:22px}
.login-card .logo img{width:60px;height:60px;border-radius:16px;box-shadow:0 4px 14px rgba(84,0,122,.28)}
.login-card h2{font-family:var(--serif);font-size:22px;margin:0;text-align:center}
.login-card .tip{font-size:12.5px;color:var(--ink-faint);text-align:center;margin-top:4px}
.field{margin-top:15px}
.field label{display:block;font-size:12.5px;color:var(--ink-soft);margin-bottom:6px}
.field input{width:100%;border:1px solid var(--line);background:var(--card-solid);border-radius:11px;padding:11px 14px;font-size:15px;color:var(--ink);outline:none;font-family:var(--sans)}
.field input:focus{border-color:var(--accent)}
.otp-row{display:flex;gap:9px}
.otp-row input{flex:1}
.msg{font-size:12.5px;margin-top:12px;padding:9px 12px;border-radius:9px;display:none}
.msg.show{display:block}
.msg.err{background:rgba(201,63,106,.12);color:var(--red)}
.msg.ok{background:rgba(63,157,99,.12);color:var(--green)}
.msg.info{background:var(--accent-soft);color:var(--accent)}

/* toast */
#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:var(--card-solid);border:1px solid var(--line);border-radius:12px;padding:10px 18px;font-size:13.5px;box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:tin .2s}
.toast.err{color:var(--red)}.toast.ok{color:var(--green)}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1}}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(20,12,40,.4);z-index:90;display:none;align-items:center;justify-content:center;padding:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.modal-bg.show{display:flex}
.modal{width:100%;max-width:560px;max-height:86vh;overflow:auto;padding:24px 26px}
.modal h3{margin:0 0 14px;font-family:var(--serif);font-size:19px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.form-grid{grid-template-columns:1fr}}
.form-grid .full{grid-column:1/-1}
.form-grid label{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:4px}
.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid var(--line);background:var(--card-solid);border-radius:9px;padding:8px 11px;font-size:13.5px;color:var(--ink);font-family:var(--sans)}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{outline:none;border-color:var(--accent)}
.modal-foot{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:18px}
.calc-note{font-size:11.5px;color:var(--accent);margin-top:3px}
.footer{margin-top:34px;font-size:12px;color:var(--ink-faint);text-align:center}
.footer a{color:inherit;text-decoration:none}
.empty{padding:40px;text-align:center;color:var(--ink-faint);font-size:13.5px}
.loading{padding:40px;text-align:center;color:var(--ink-faint);font-size:13.5px}
.loading::before{content:"";display:inline-block;width:15px;height:15px;margin-right:8px;vertical-align:-2px;border:2px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* 可访问性：键盘焦点可见 + 最小点击区域 */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.btn,.tab,.seg button,.rowbtn{min-height:34px}
@media(hover:none){.btn,.tab{min-height:42px}.rowbtn{min-height:38px;padding:6px 11px;font-size:12.5px}}
/* 尊重「减少动态效果」系统设置 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
/* 表头多选筛选下拉：脱离表格 overflow 上下文，避免被裁切（JS 计算 top/left） */
.hfpanel.floating{position:fixed;z-index:1000}