/* ============================================================
   CRM Pro · 样式表
   主色 indigo (#6366f1 -> #4f46e5) · 深色侧边栏 · 浅灰背景 · 白色圆角卡片
   ============================================================ */

:root{
  --primary:        #6366f1;
  --primary-600:    #4f46e5;
  --primary-700:    #4338ca;
  --primary-50:     #eef2ff;
  --primary-100:    #e0e7ff;

  --bg:             #f1f5f9;
  --card:           #ffffff;
  --border:         #e5e7eb;
  --text:           #1f2937;
  --text-light:     #6b7280;
  --text-mute:      #9ca3af;

  --sidebar-bg:     #1e1b4b;
  --sidebar-bg-2:   #111827;
  --sidebar-text:   #c7d2fe;
  --sidebar-active: #6366f1;

  --green:  #10b981;
  --amber:  #f59e0b;
  --red:    #ef4444;
  --blue:   #3b82f6;
  --purple: #8b5cf6;
  --pink:   #ec4899;
  --cyan:   #06b6d4;

  --radius:   14px;
  --radius-sm: 9px;
  --shadow:   0 1px 2px rgba(16,24,40,.04), 0 4px 16px rgba(16,24,40,.05);
  --shadow-lg:0 12px 40px rgba(16,24,40,.14);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}
a{ text-decoration:none; color:inherit; }
button{ font-family:inherit; cursor:pointer; }
input,select,textarea{ font-family:inherit; font-size:13.5px; }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:8px; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; }
::-webkit-scrollbar-track{ background:transparent; }
.hidden{ display:none !important; }

/* ============================ 登录页 ============================ */
.login-view{
  position:fixed; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  background:linear-gradient(135deg,#312e81 0%, #4f46e5 45%, #7c3aed 100%);
  overflow:hidden; z-index:60;
}
.login-bg{ position:absolute; inset:0; overflow:hidden; }
.login-bg::after{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);
  background-size:26px 26px; opacity:.5;
}
.blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.55; }
.blob-1{ width:420px;height:420px; background:#818cf8; top:-120px; left:-90px; animation:float1 14s ease-in-out infinite; }
.blob-2{ width:360px;height:360px; background:#22d3ee; bottom:-120px; right:-60px; animation:float2 17s ease-in-out infinite; }
.blob-3{ width:300px;height:300px; background:#f472b6; bottom:10%; left:12%; animation:float3 19s ease-in-out infinite; }
.blob-4{ width:260px;height:260px; background:#a78bfa; top:8%; right:18%; animation:float1 16s ease-in-out infinite reverse; }
@keyframes float1{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(50px,40px) scale(1.12);} }
@keyframes float2{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-60px,-40px) scale(1.1);} }
@keyframes float3{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(30px,-50px) scale(.92);} }

.login-card{
  position:relative; z-index:2; width:404px; max-width:92vw;
  background:rgba(255,255,255,.97); backdrop-filter:blur(6px);
  border-radius:20px; padding:34px 34px 26px;
  box-shadow:0 24px 70px rgba(15,23,42,.4);
  animation:cardIn .5s cubic-bezier(.2,.8,.25,1);
}
@keyframes cardIn{ from{opacity:0; transform:translateY(22px) scale(.97);} to{opacity:1; transform:none;} }

.login-logo{ display:flex; align-items:center; gap:13px; margin-bottom:26px; }
.login-logo-icon{
  width:46px;height:46px;border-radius:13px; flex:none;
  background:linear-gradient(135deg,var(--primary),var(--primary-700));
  color:#fff; display:flex;align-items:center;justify-content:center; font-size:20px;
  box-shadow:0 8px 18px rgba(79,70,229,.36);
}
.login-logo h1{ margin:0; font-size:22px; font-weight:800; letter-spacing:.4px; color:#111827; }
.login-logo p{ margin:3px 0 0; font-size:12px; color:var(--text-mute); }

.login-label{ display:block; font-size:12.5px; font-weight:600; color:#4b5563; margin:0 0 7px; }
.login-input-wrap{
  position:relative; display:flex; align-items:center;
  border:1.5px solid var(--border); border-radius:11px; background:#f9fafb;
  padding:0 12px; margin-bottom:16px; transition:.18s;
}
.login-input-wrap:focus-within{ border-color:var(--primary); background:#fff; box-shadow:0 0 0 4px rgba(99,102,241,.13); }
.login-input-wrap > i{ color:#9ca3af; font-size:14px; }
.login-input-wrap input{
  flex:1; border:0; outline:0; background:transparent; padding:12px 10px; font-size:14px; color:var(--text);
}
.pwd-toggle{ border:0; background:transparent; color:#9ca3af; padding:4px; }
.pwd-toggle:hover{ color:var(--primary-600); }

.login-error{
  display:flex; align-items:center; gap:8px; margin:-4px 0 14px;
  background:#fef2f2; border:1px solid #fecaca; color:#dc2626;
  font-size:12.5px; padding:9px 12px; border-radius:9px;
  animation:shake .35s;
}
@keyframes shake{ 0%,100%{transform:translateX(0);} 25%{transform:translateX(-5px);} 75%{transform:translateX(5px);} }

.login-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; font-size:12.5px; }
.login-remember{ display:flex; align-items:center; gap:6px; color:#4b5563; cursor:pointer; }
.login-remember input{ accent-color:var(--primary-600); }
.login-link{ color:var(--primary-600); font-weight:600; }
.login-link:hover{ text-decoration:underline; }

.login-btn{
  width:100%; border:0; border-radius:11px; padding:13px;
  background:linear-gradient(135deg,var(--primary),var(--primary-700));
  color:#fff; font-size:15px; font-weight:700; letter-spacing:3px;
  box-shadow:0 10px 22px rgba(79,70,229,.34); transition:.18s;
}
.login-btn:hover{ transform:translateY(-1px); box-shadow:0 14px 26px rgba(79,70,229,.42); }
.login-btn:active{ transform:translateY(0); }
.login-btn:disabled{ opacity:.7; cursor:not-allowed; transform:none; }

.login-hint{
  margin-top:20px; padding-top:16px; border-top:1px dashed var(--border);
  font-size:12.5px; color:var(--text-light); text-align:center;
}
.login-hint b{ color:var(--primary-600); }
.login-hint i{ color:var(--primary); margin-right:4px; }
.login-footer{ position:absolute; bottom:22px; z-index:2; color:rgba(255,255,255,.72); font-size:12px; margin:0; }

/* ============================ 应用外壳 ============================ */
.app-view{ display:flex; min-height:100vh; }

.sidebar{
  width:236px; flex:none; position:fixed; top:0; left:0; bottom:0; z-index:40;
  background:linear-gradient(180deg,var(--sidebar-bg) 0%, var(--sidebar-bg-2) 100%);
  display:flex; flex-direction:column; color:var(--sidebar-text);
  transition:transform .25s ease;
}
.sidebar-brand{ display:flex; align-items:center; gap:11px; padding:20px 18px 18px; }
.sidebar-brand-icon{
  width:38px;height:38px;border-radius:11px; flex:none;
  background:linear-gradient(135deg,var(--primary),var(--primary-700));
  color:#fff; display:flex;align-items:center;justify-content:center; font-size:16px;
  box-shadow:0 6px 16px rgba(99,102,241,.45);
}
.sidebar-brand-text h1{ margin:0; font-size:16.5px; font-weight:800; color:#fff; letter-spacing:.3px; }
.sidebar-brand-text p{ margin:2px 0 0; font-size:10.5px; color:#818cf8; letter-spacing:.2px; }

.sidebar-nav{ flex:1; overflow-y:auto; padding:6px 12px 12px; }
.sidebar-nav::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.16); }
.nav-group-title{
  font-size:10.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
  color:#6366f1; padding:15px 12px 7px;
}
.nav-item{
  display:flex; align-items:center; gap:11px;
  padding:9.5px 12px; margin-bottom:2px; border-radius:9px;
  font-size:13.5px; color:var(--sidebar-text); cursor:pointer;
  transition:background .16s, color .16s; position:relative; white-space:nowrap;
}
.nav-item i{ width:17px; text-align:center; font-size:14px; opacity:.9; }
.nav-item:hover{ background:rgba(255,255,255,.09); color:#fff; }
.nav-item.active{
  background:linear-gradient(135deg,var(--primary),var(--primary-700));
  color:#fff; font-weight:600; box-shadow:0 6px 16px rgba(79,70,229,.42);
}
.nav-item.active i{ opacity:1; }
.nav-item .nav-badge{
  margin-left:auto; background:rgba(255,255,255,.18); color:#fff;
  font-size:10.5px; padding:1px 7px; border-radius:20px; font-weight:600;
}
.nav-item.active .nav-badge{ background:rgba(255,255,255,.28); }

.sidebar-foot{ border-top:1px solid rgba(255,255,255,.09); padding:13px; }
.sidebar-foot-user{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.sidebar-foot-info{ overflow:hidden; }
.sidebar-foot-info p{ margin:0; font-size:13px; color:#fff; font-weight:600; }
.sidebar-foot-info span{ font-size:10.5px; color:#818cf8; }
.sidebar-logout{
  width:100%; border:1px solid rgba(255,255,255,.14); background:transparent;
  color:var(--sidebar-text); border-radius:9px; padding:8px; font-size:12.5px; transition:.16s;
}
.sidebar-logout:hover{ background:rgba(239,68,68,.16); border-color:rgba(239,68,68,.4); color:#fca5a5; }

.avatar{
  width:34px;height:34px;border-radius:50%; flex:none;
  background:linear-gradient(135deg,var(--primary),var(--primary-700));
  color:#fff; display:flex;align-items:center;justify-content:center;
  font-size:13px; font-weight:700;
}
.avatar-sm{ width:32px;height:32px;font-size:12.5px; }

.main-wrap{ flex:1; margin-left:236px; min-width:0; display:flex; flex-direction:column; }

/* ---------------------------- 顶栏 ---------------------------- */
.topbar{
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; gap:12px;
  background:#fff; border-bottom:1px solid var(--border);
  padding:11px 22px; min-height:64px; flex-wrap:wrap;
}
.sidebar-toggle{ display:none; }
.topbar-title{ min-width:96px; }
.topbar-title h1{ margin:0; font-size:16.5px; font-weight:800; color:#111827; }
.topbar-title p{ margin:1px 0 0; font-size:11.5px; color:var(--text-mute); }

.topbar-search{
  position:relative; display:flex; align-items:center;
  background:#f8fafc; border:1px solid var(--border); border-radius:10px;
  padding:0 11px; width:236px; transition:.16s;
}
.topbar-search:focus-within{ border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px rgba(99,102,241,.12); }
.topbar-search > i{ color:#9ca3af; font-size:12.5px; }
.topbar-search input{ flex:1; border:0; outline:0; background:transparent; padding:9px 8px; font-size:13px; }
.search-clear{ border:0; background:transparent; color:#9ca3af; padding:2px; }
.search-clear:hover{ color:var(--red); }

.topbar-date{
  display:flex; align-items:center; gap:5px;
  background:#f8fafc; border:1px solid var(--border); border-radius:10px; padding:4px 8px;
}
.topbar-date input[type=date]{ border:0; background:transparent; outline:0; font-size:12.5px; color:#374151; width:118px; }
.topbar-date .dash{ color:#9ca3af; }
.date-clear{ border:0; background:transparent; color:#9ca3af; padding:2px 3px; }
.date-clear:hover{ color:var(--red); }

.topbar-user{
  margin-left:auto; position:relative; display:flex; align-items:center; gap:9px;
  padding:5px 9px 5px 5px; border-radius:10px; cursor:pointer; transition:.16s;
}
.topbar-user:hover{ background:#f1f5f9; }
.topbar-user-info p{ margin:0; font-size:12.8px; font-weight:700; color:#111827; line-height:1.25; }
.topbar-user-info span{ font-size:10.5px; color:var(--text-mute); }
.topbar-user-caret{ font-size:10px; color:#9ca3af; }
.user-dropdown{
  position:absolute; top:calc(100% + 8px); right:0; width:186px;
  background:#fff; border:1px solid var(--border); border-radius:12px;
  box-shadow:var(--shadow-lg); padding:6px; opacity:0; visibility:hidden;
  transform:translateY(-6px); transition:.16s; z-index:50;
}
.topbar-user.open .user-dropdown{ opacity:1; visibility:visible; transform:none; }
.user-dropdown a{
  display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:8px;
  font-size:13px; color:#374151;
}
.user-dropdown a:hover{ background:var(--primary-50); color:var(--primary-700); }
.user-dropdown a.danger:hover{ background:#fef2f2; color:#dc2626; }
.user-dropdown-divider{ height:1px; background:var(--border); margin:5px 4px; }

/* ---------------------------- 内容区 ---------------------------- */
.page-content{ padding:20px 22px 40px; flex:1; min-width:0; }
.page-content > .page-enter{ animation:pageIn .28s ease; }
@keyframes pageIn{ from{opacity:0; transform:translateY(9px);} to{opacity:1; transform:none;} }

.card{
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); box-shadow:var(--shadow);
}
.card-head{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:14px 18px; border-bottom:1px solid var(--border);
}
.card-head h3{ margin:0; font-size:14.5px; font-weight:700; color:#111827; display:flex; align-items:center; gap:8px; }
.card-head h3 i{ color:var(--primary-600); }
.card-head .card-head-actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.card-body{ padding:16px 18px; }

.page-head{ display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.page-head h2{ margin:0; font-size:19px; font-weight:800; color:#111827; display:flex; align-items:center; gap:9px; }
.page-head h2 i{ color:var(--primary-600); font-size:17px; }
.page-head p{ margin:4px 0 0; font-size:12.5px; color:var(--text-light); }
.page-head-actions{ margin-left:auto; display:flex; gap:9px; flex-wrap:wrap; align-items:center; }

/* ---------------------------- 按钮 ---------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  border:1px solid transparent; border-radius:9px; padding:8.5px 14px;
  font-size:13px; font-weight:600; transition:.16s; white-space:nowrap; line-height:1;
}
.btn i{ font-size:12.5px; }
.btn-primary{ background:linear-gradient(135deg,var(--primary),var(--primary-700)); color:#fff; box-shadow:0 6px 16px rgba(79,70,229,.3); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 9px 20px rgba(79,70,229,.38); }
.btn-light{ background:#fff; border-color:var(--border); color:#475569; }
.btn-light:hover{ border-color:var(--primary); color:var(--primary-700); background:var(--primary-50); }
.btn-soft{ background:var(--primary-50); color:var(--primary-700); border-color:#c7d2fe; }
.btn-soft:hover{ background:var(--primary-100); }
.btn-danger{ background:#fef2f2; color:#dc2626; border-color:#fecaca; }
.btn-danger:hover{ background:#fee2e2; }
.btn-success{ background:#ecfdf5; color:#059669; border-color:#a7f3d0; }
.btn-success:hover{ background:#d1fae5; }
.btn-warn{ background:#fffbeb; color:#d97706; border-color:#fde68a; }
.btn-warn:hover{ background:#fef3c7; }
.btn-sm{ padding:6px 11px; font-size:12.2px; border-radius:8px; }
.btn-block{ width:100%; }
.btn:disabled{ opacity:.55; cursor:not-allowed; transform:none !important; }

.icon-btn{
  width:34px;height:34px;border-radius:9px; border:1px solid var(--border);
  background:#fff; color:#64748b; display:inline-flex;align-items:center;justify-content:center;
  transition:.16s; flex:none;
}
.icon-btn:hover{ color:var(--primary-700); border-color:var(--primary); background:var(--primary-50); }

/* ---------------------------- 表单控件 ---------------------------- */
.input, .select, .textarea{
  width:100%; border:1px solid var(--border); border-radius:9px;
  padding:8.5px 11px; font-size:13px; color:var(--text); background:#fff; outline:0; transition:.16s;
}
.input:focus, .select:focus, .textarea:focus{
  border-color:var(--primary); box-shadow:0 0 0 3px rgba(99,102,241,.12);
}
.select{ appearance:none; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239ca3af'%3E%3Cpath d='M4.5 6.5 8 10l3.5-3.5z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 8px center; background-size:15px; padding-right:28px; }
.textarea{ resize:vertical; min-height:76px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-field{ display:flex; flex-direction:column; gap:6px; }
.form-field.full{ grid-column:1 / -1; }
.form-field label{ font-size:12.5px; font-weight:600; color:#4b5563; }
.form-field label .req{ color:var(--red); margin-left:2px; }
.form-hint{ font-size:11.5px; color:var(--text-mute); }
.filter-bar{ display:flex; gap:9px; flex-wrap:wrap; align-items:center; }
.filter-bar .select, .filter-bar .input{ width:auto; min-width:132px; }

/* ---------------------------- 徽章 ---------------------------- */
.badge{
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 10px; border-radius:20px; font-size:11.6px; font-weight:600; line-height:1.6; white-space:nowrap;
}
.badge i{ font-size:9.5px; }
.badge::before{ content:""; width:5.5px;height:5.5px;border-radius:50%; background:currentColor; opacity:.85; }
.badge.no-dot::before{ display:none; }
.badge-green{ background:#ecfdf5; color:#059669; }
.badge-blue{ background:#eff6ff; color:#2563eb; }
.badge-indigo{ background:var(--primary-50); color:var(--primary-700); }
.badge-amber{ background:#fffbeb; color:#d97706; }
.badge-red{ background:#fef2f2; color:#dc2626; }
.badge-purple{ background:#f5f3ff; color:#7c3aed; }
.badge-pink{ background:#fdf2f8; color:#db2777; }
.badge-cyan{ background:#ecfeff; color:#0891b2; }
.badge-gray{ background:#f3f4f6; color:#6b7280; }

/* ---------------------------- 表格 ---------------------------- */
.table-wrap{ overflow-x:auto; }
table.data-table{ width:100%; border-collapse:separate; border-spacing:0; font-size:13px; min-width:720px; }
table.data-table thead th{
  background:#f8fafc; color:#475569; font-weight:700; font-size:12.3px;
  text-align:left; padding:11px 14px; white-space:nowrap;
  border-bottom:1px solid var(--border); position:sticky; top:0; z-index:1;
}
table.data-table tbody td{
  padding:11px 14px; border-bottom:1px solid #f1f5f9; color:#374151; vertical-align:middle;
}
table.data-table tbody tr{ transition:background .14s; }
table.data-table tbody tr:hover{ background:#fafbff; }
table.data-table tbody tr:last-child td{ border-bottom:0; }
table.data-table .col-actions{ white-space:nowrap; }
.row-actions{ display:flex; gap:6px; align-items:center; }
.act-btn{
  width:29px;height:29px;border-radius:8px; border:1px solid var(--border); background:#fff;
  color:#64748b; display:inline-flex; align-items:center; justify-content:center; font-size:12px; transition:.15s;
}
.act-btn:hover{ background:var(--primary-50); color:var(--primary-700); border-color:#c7d2fe; }
.act-btn.danger:hover{ background:#fef2f2; color:#dc2626; border-color:#fecaca; }
.act-btn.ok:hover{ background:#ecfdf5; color:#059669; border-color:#a7f3d0; }
.cell-strong{ font-weight:700; color:#111827; }
.cell-sub{ font-size:11.5px; color:var(--text-mute); margin-top:2px; }
.cell-muted{ color:var(--text-light); }
.money{ font-variant-numeric:tabular-nums; font-weight:700; color:#111827; }
.money.plus{ color:#059669; }
.money.minus{ color:#dc2626; }
.table-empty{ padding:54px 20px; text-align:center; color:var(--text-mute); }
.table-empty i{ font-size:34px; color:#e2e8f0; display:block; margin-bottom:12px; }
.table-foot{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding:12px 18px; border-top:1px solid var(--border); font-size:12.5px; color:var(--text-light);
}
.pager{ display:flex; gap:5px; }
.pager button{
  min-width:30px;height:30px;border-radius:8px; border:1px solid var(--border); background:#fff;
  color:#475569; font-size:12.5px;
}
.pager button:hover:not(:disabled){ border-color:var(--primary); color:var(--primary-700); }
.pager button.active{ background:var(--primary-600); border-color:var(--primary-600); color:#fff; font-weight:700; }
.pager button:disabled{ opacity:.45; cursor:not-allowed; }

/* ---------------------------- 指标卡 ---------------------------- */
.stat-grid{ display:grid; gap:14px; margin-bottom:18px; }
.stat-card{
  background:#fff; border:1px solid var(--border); border-radius:var(--radius);
  padding:16px 17px; box-shadow:var(--shadow); position:relative; overflow:hidden;
  transition:transform .18s, box-shadow .18s;
}
.stat-card:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(16,24,40,.1); }
.stat-card::after{ content:""; position:absolute; right:-24px; top:-24px; width:78px;height:78px; border-radius:50%; background:currentColor; opacity:.07; }
.stat-top{ display:flex; align-items:center; gap:11px; }
.stat-icon{
  width:40px;height:40px;border-radius:11px; flex:none;
  display:flex;align-items:center;justify-content:center; font-size:16px; color:#fff;
}
.stat-label{ font-size:12.3px; color:var(--text-light); font-weight:600; }
.stat-value{ font-size:22.5px; font-weight:800; color:#111827; margin-top:8px; line-height:1.15; letter-spacing:-.3px; }
.stat-value small{ font-size:12.5px; font-weight:700; color:var(--text-mute); margin-left:2px; }
.stat-foot{ margin-top:7px; font-size:11.5px; color:var(--text-mute); display:flex; align-items:center; gap:5px; }
.stat-foot .up{ color:#059669; font-weight:700; }
.stat-foot .down{ color:#dc2626; font-weight:700; }

.tint-indigo{ color:var(--primary-600); } .bg-indigo{ background:linear-gradient(135deg,#6366f1,#4338ca); }
.tint-blue{ color:#2563eb; }   .bg-blue{ background:linear-gradient(135deg,#3b82f6,#1d4ed8); }
.tint-green{ color:#059669; }  .bg-green{ background:linear-gradient(135deg,#10b981,#047857); }
.tint-amber{ color:#d97706; }  .bg-amber{ background:linear-gradient(135deg,#f59e0b,#b45309); }
.tint-red{ color:#dc2626; }    .bg-red{ background:linear-gradient(135deg,#ef4444,#b91c1c); }
.tint-purple{ color:#7c3aed; } .bg-purple{ background:linear-gradient(135deg,#8b5cf6,#6d28d9); }
.tint-cyan{ color:#0891b2; }   .bg-cyan{ background:linear-gradient(135deg,#06b6d4,#0e7490); }
.tint-pink{ color:#db2777; }   .bg-pink{ background:linear-gradient(135deg,#ec4899,#be185d); }
.tint-slate{ color:#475569; }  .bg-slate{ background:linear-gradient(135deg,#64748b,#334155); }

.mini-stat{ display:flex; flex-direction:column; gap:3px; padding:13px 15px; border-radius:12px; background:#fff; border:1px solid var(--border); }
.mini-stat .ml{ font-size:11.8px; color:var(--text-light); font-weight:600; }
.mini-stat .mv{ font-size:17px; font-weight:800; color:#111827; }
.mini-stat .mv.green{ color:#059669; } .mini-stat .mv.amber{ color:#d97706; }
.mini-stat .mv.red{ color:#dc2626; }   .mini-stat .mv.indigo{ color:var(--primary-600); }
.mini-stat .mv.blue{ color:#2563eb; }  .mini-stat .mv.purple{ color:#7c3aed; }

/* ---------------------------- 进度条 ---------------------------- */
.progress{ height:8px; border-radius:20px; background:#eef2f7; overflow:hidden; min-width:88px; }
.progress > span{ display:block; height:100%; border-radius:20px; transition:width .4s ease; }
.pg-indigo{ background:linear-gradient(90deg,#6366f1,#4338ca); }
.pg-blue{ background:linear-gradient(90deg,#3b82f6,#1d4ed8); }
.pg-green{ background:linear-gradient(90deg,#10b981,#047857); }
.pg-amber{ background:linear-gradient(90deg,#f59e0b,#d97706); }
.pg-red{ background:linear-gradient(90deg,#ef4444,#b91c1c); }
.pg-purple{ background:linear-gradient(90deg,#8b5cf6,#6d28d9); }
.progress-row{ display:flex; align-items:center; gap:9px; min-width:132px; }
.progress-row b{ font-size:11.8px; color:#475569; width:34px; text-align:right; }

/* ---------------------------- 今日待办日历 ---------------------------- */
.calendar-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:11px; }
.cal-cell{
  border:1px solid var(--border); border-radius:12px; padding:11px 12px; min-height:122px;
  background:#fff; position:relative; transition:.16s; cursor:pointer;
}
.cal-cell:hover{ border-color:#c7d2fe; box-shadow:0 6px 18px rgba(99,102,241,.12); transform:translateY(-2px); }
.cal-cell.today{ border-color:var(--primary); box-shadow:0 0 0 3px rgba(99,102,241,.14); }
.cal-cell.has-todo{ background:linear-gradient(160deg,#fff 60%,#eef2ff); }
.cal-cell.pink{ background:linear-gradient(160deg,#fff,#fdf2f8); }
.cal-cell.blue{ background:linear-gradient(160deg,#fff,#eff6ff); }
.cal-cell.amber{ background:linear-gradient(160deg,#fff,#fffbeb); }
.cal-cell.green{ background:linear-gradient(160deg,#fff,#ecfdf5); }
.cal-head{ display:flex; align-items:flex-start; justify-content:space-between; }
.cal-day{ font-size:19px; font-weight:800; color:#111827; line-height:1; }
.cal-week{ font-size:10.5px; color:var(--text-mute); margin-top:3px; }
.cal-lunar{ font-size:10px; color:#a5b4fc; margin-top:2px; }
.cal-add{ color:#cbd5e1; font-size:12px; }
.cal-add:hover{ color:var(--primary-600); }
.cal-todos{ margin-top:9px; display:flex; flex-direction:column; gap:5px; }
.cal-todo{
  font-size:11.3px; background:var(--primary-50); color:var(--primary-700);
  border-radius:7px; padding:4px 7px; line-height:1.4;
  display:flex; align-items:center; gap:5px; overflow:hidden;
}
.cal-todo.done{ text-decoration:line-through; opacity:.6; }
.cal-todo.pri-high{ background:#fef2f2; color:#dc2626; }
.cal-todo.pri-mid{ background:#fffbeb; color:#d97706; }
.cal-empty{ font-size:11.5px; color:#cbd5e1; margin-top:10px; text-align:center; }

/* ---------------------------- 图表 ---------------------------- */
.chart-grid{ display:grid; gap:16px; margin-bottom:18px; }
.chart-box{ height:268px; position:relative; }
.legend-list{ display:flex; flex-direction:column; gap:9px; margin-top:6px; }
.legend-item{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:#475569; }
.legend-dot{ width:9px;height:9px;border-radius:3px; flex:none; }
.legend-item span:last-child{ margin-left:auto; font-weight:700; color:#111827; }
.rank-list{ display:flex; flex-direction:column; gap:11px; }
.rank-item{ display:flex; align-items:center; gap:10px; }
.rank-no{
  width:21px;height:21px;border-radius:6px; flex:none; font-size:11px; font-weight:800;
  display:flex;align-items:center;justify-content:center; background:#f1f5f9; color:#64748b;
}
.rank-item:nth-child(1) .rank-no{ background:#fef3c7; color:#b45309; }
.rank-item:nth-child(2) .rank-no{ background:#e2e8f0; color:#475569; }
.rank-item:nth-child(3) .rank-no{ background:#ffedd5; color:#c2410c; }
.rank-name{ flex:1; font-size:12.5px; color:#374151; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rank-val{ font-size:12.3px; font-weight:700; color:#111827; }

/* ---------------------------- 弹窗 ---------------------------- */
.modal-mask{
  position:fixed; inset:0; background:rgba(15,23,42,.55); backdrop-filter:blur(2px);
  z-index:70; display:flex; align-items:flex-start; justify-content:center;
  padding:52px 18px; overflow-y:auto; animation:maskIn .18s;
}
@keyframes maskIn{ from{opacity:0;} to{opacity:1;} }
.modal{
  background:#fff; border-radius:16px; width:640px; max-width:100%;
  box-shadow:var(--shadow-lg); animation:modalIn .24s cubic-bezier(.2,.8,.25,1); margin:auto 0;
}
.modal.wide{ width:820px; }
.modal.narrow{ width:460px; }
@keyframes modalIn{ from{opacity:0; transform:translateY(16px) scale(.98);} to{opacity:1; transform:none;} }
.modal-head{
  display:flex; align-items:center; gap:10px; padding:16px 20px; border-bottom:1px solid var(--border);
}
.modal-head h3{ margin:0; font-size:15.5px; font-weight:800; color:#111827; display:flex; align-items:center; gap:9px; }
.modal-head h3 i{ color:var(--primary-600); }
.modal-close{ margin-left:auto; width:31px;height:31px;border-radius:8px; border:0; background:#f1f5f9; color:#64748b; }
.modal-close:hover{ background:#fee2e2; color:#dc2626; }
.modal-body{ padding:20px; max-height:calc(100vh - 220px); overflow-y:auto; }
.modal-foot{
  display:flex; justify-content:flex-end; gap:10px; padding:14px 20px; border-top:1px solid var(--border); flex-wrap:wrap;
}
.detail-section{ margin-bottom:20px; }
.detail-section:last-child{ margin-bottom:0; }
.detail-title{
  font-size:12.5px; font-weight:800; color:var(--primary-700); margin-bottom:11px;
  display:flex; align-items:center; gap:7px; padding-bottom:8px; border-bottom:1px dashed var(--border);
}
.detail-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.detail-item{ background:#f8fafc; border-radius:10px; padding:10px 13px; }
.detail-item .dk{ font-size:11.5px; color:var(--text-mute); margin-bottom:4px; }
.detail-item .dv{ font-size:13.5px; font-weight:700; color:#111827; }
.detail-item.full{ grid-column:1 / -1; }

/* ---------------------------- Toast ---------------------------- */
.toast-root{ position:fixed; top:20px; right:20px; z-index:90; display:flex; flex-direction:column; gap:10px; }
.toast{
  display:flex; align-items:center; gap:10px; min-width:230px; max-width:360px;
  background:#fff; border:1px solid var(--border); border-left:4px solid var(--primary);
  border-radius:11px; padding:12px 15px; box-shadow:var(--shadow-lg);
  font-size:13px; color:#374151; animation:toastIn .26s cubic-bezier(.2,.8,.25,1);
}
@keyframes toastIn{ from{opacity:0; transform:translateX(28px);} to{opacity:1; transform:none;} }
.toast.out{ animation:toastOut .22s forwards; }
@keyframes toastOut{ to{opacity:0; transform:translateX(28px);} }
.toast i{ font-size:15px; }
.toast.success{ border-left-color:#10b981; } .toast.success i{ color:#10b981; }
.toast.error{ border-left-color:#ef4444; }   .toast.error i{ color:#ef4444; }
.toast.warn{ border-left-color:#f59e0b; }    .toast.warn i{ color:#f59e0b; }
.toast.info i{ color:var(--primary-600); }

/* ---------------------------- 电子表格 ---------------------------- */
.sheet-toolbar{
  display:flex; align-items:center; gap:5px; flex-wrap:wrap;
  padding:9px 13px; border-bottom:1px solid var(--border); background:#f8fafc;
  border-radius:var(--radius) var(--radius) 0 0;
}
.sheet-btn{
  width:30px;height:30px;border-radius:7px; border:1px solid transparent; background:transparent;
  color:#475569; display:inline-flex;align-items:center;justify-content:center; font-size:12.5px; transition:.14s;
}
.sheet-btn:hover{ background:#fff; border-color:var(--border); color:var(--primary-700); }
.sheet-btn.on{ background:var(--primary-50); border-color:#c7d2fe; color:var(--primary-700); }
.sheet-sep{ width:1px; height:20px; background:var(--border); margin:0 4px; }
.sheet-tb{ display:flex; align-items:center; gap:5px; }
.sheet-color{
  width:30px;height:30px;border-radius:7px; border:1px solid var(--border); background:#fff;
  display:flex; align-items:center; justify-content:center; font-size:11px; color:#475569;
}
.sheet-tb input[type=color]{ width:26px; height:24px; border:0; background:transparent; padding:0; cursor:pointer; }
.sheet-tb select{ height:30px; border:1px solid var(--border); border-radius:7px; background:#fff; font-size:12px; color:#475569; padding:0 6px; }
.formula-bar{
  display:flex; align-items:center; gap:9px; padding:7px 13px; border-bottom:1px solid var(--border); background:#fff;
}
.formula-bar .fcell{
  min-width:64px; text-align:center; font-size:12px; font-weight:700; color:#475569;
  background:#f1f5f9; border-radius:6px; padding:5px 9px;
}
.formula-bar .fx{ font-style:italic; font-weight:700; color:#94a3b8; }
.formula-bar input{ flex:1; border:1px solid var(--border); border-radius:7px; padding:5px 10px; font-size:12.5px; outline:0; }
.formula-bar input:focus{ border-color:var(--primary); }
.sheet-scroll{ overflow:auto; max-height:540px; background:#fff; }
table.sheet-grid{ border-collapse:collapse; font-size:12.5px; table-layout:fixed; }
table.sheet-grid th, table.sheet-grid td{ border:1px solid #e2e8f0; padding:0; }
table.sheet-grid th{
  background:#eef2f7; color:#475569; font-weight:700; font-size:11.5px; text-align:center;
  width:112px; min-width:112px; height:26px; position:sticky; top:0; z-index:2;
}
table.sheet-grid th.rowhead{
  width:42px; min-width:42px; left:0; z-index:3; background:#eef2f7; position:sticky;
}
table.sheet-grid td{ height:28px; }
table.sheet-grid td.rowhead{
  background:#eef2f7; color:#475569; font-weight:700; font-size:11.5px; text-align:center;
  position:sticky; left:0; z-index:1;
}
table.sheet-grid td.cell{ width:112px; min-width:112px; padding:0 7px; color:#1f2937; cursor:cell; overflow:hidden; white-space:nowrap; }
table.sheet-grid td.cell:focus{ outline:2px solid var(--primary); outline-offset:-2px; background:#fff; }
table.sheet-grid .corner{ background:#e0e7ff; }
.sheet-tabs{ display:flex; align-items:center; gap:2px; padding:7px 12px; border-top:1px solid var(--border); background:#f8fafc; border-radius:0 0 var(--radius) var(--radius); }
.sheet-tab{
  padding:6px 15px; border-radius:8px 8px 0 0; font-size:12.5px; color:#475569; border:1px solid transparent; background:transparent;
}
.sheet-tab:hover{ background:#fff; }
.sheet-tab.active{ background:#fff; border-color:var(--border); border-bottom-color:#fff; color:var(--primary-700); font-weight:700; }
.sheet-add{ color:#64748b; padding:6px 10px; border-radius:8px; }
.sheet-add:hover{ background:#fff; color:var(--primary-700); }

/* ---------------------------- AI 分析 ---------------------------- */
.ai-layout{ display:grid; grid-template-columns:308px 1fr; gap:16px; align-items:start; }
.ai-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px; }
.ai-tab{
  padding:6px 13px; border-radius:20px; font-size:12.3px; border:1px solid var(--border);
  background:#fff; color:#64748b; font-weight:600;
}
.ai-tab:hover{ border-color:#c7d2fe; color:var(--primary-700); }
.ai-tab.active{ background:var(--primary-600); border-color:var(--primary-600); color:#fff; }
.ai-result-head{
  display:flex; align-items:center; gap:10px; padding:13px 17px; border-bottom:1px solid var(--border);
}
.ai-result-head h3{ margin:0; font-size:14.5px; font-weight:800; color:#111827; display:flex; align-items:center; gap:8px; }
.ai-result-head h3 i{ color:#7c3aed; }
.ai-block{ border:1px solid var(--border); border-radius:12px; padding:14px 16px; margin-bottom:13px; background:#fff; }
.ai-block:last-child{ margin-bottom:0; }
.ai-block-title{
  font-size:12.8px; font-weight:800; color:var(--primary-700); margin-bottom:9px;
  display:flex; align-items:center; gap:7px;
}
.ai-block p{ margin:0 0 8px; font-size:13px; line-height:1.75; color:#374151; }
.ai-block p:last-child{ margin-bottom:0; }
.ai-block ul{ margin:0; padding-left:19px; font-size:13px; line-height:1.85; color:#374151; }
.ai-quote{
  background:#f8fafc; border-left:3px solid var(--primary); border-radius:0 9px 9px 0;
  padding:11px 14px; font-size:13px; line-height:1.75; color:#334155; margin-bottom:9px;
}
.ai-quote .ql{ font-size:11px; font-weight:800; color:var(--primary-700); display:block; margin-bottom:4px; }
.ai-empty{ padding:64px 20px; text-align:center; color:var(--text-mute); }
.ai-empty i{ font-size:40px; color:#e2e8f0; display:block; margin-bottom:14px; }
.ai-loading{ display:flex; align-items:center; justify-content:center; gap:10px; padding:64px; color:var(--primary-600); font-size:13.5px; }
.spinner{
  width:20px;height:20px;border-radius:50%; border:2.5px solid #e0e7ff; border-top-color:var(--primary-600);
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{transform:rotate(360deg);} }

/* ---------------------------- 其他 ---------------------------- */
.tag-list{ display:flex; gap:7px; flex-wrap:wrap; }
.chip{
  display:inline-flex; align-items:center; gap:6px; padding:4px 11px; border-radius:20px;
  background:#f1f5f9; color:#475569; font-size:12px; font-weight:600;
}
.notice{
  display:flex; align-items:flex-start; gap:10px; padding:11px 14px; border-radius:10px;
  background:#fffbeb; border:1px solid #fde68a; color:#92400e; font-size:12.5px; margin-bottom:16px;
}
.notice i{ margin-top:2px; }
.timeline{ position:relative; padding-left:22px; }
.timeline::before{ content:""; position:absolute; left:5px; top:4px; bottom:4px; width:2px; background:#e2e8f0; }
.timeline-item{ position:relative; margin-bottom:16px; }
.timeline-item::before{
  content:""; position:absolute; left:-21px; top:4px; width:10px;height:10px;border-radius:50%;
  background:var(--primary); box-shadow:0 0 0 3px var(--primary-50);
}
.timeline-item .tt{ font-size:12.5px; font-weight:700; color:#111827; }
.timeline-item .td{ font-size:11.5px; color:var(--text-mute); margin:2px 0 4px; }
.timeline-item .tc{ font-size:12.8px; color:#4b5563; line-height:1.7; }
.sidebar-mask{
  display:none; position:fixed; inset:0; background:rgba(15,23,42,.5); z-index:35;
}

/* ---------------------------- 响应式 ---------------------------- */
@media (max-width:1280px){
  .topbar-search{ width:180px; }
  .stat-grid{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important; }
  .chart-grid{ grid-template-columns:1fr !important; }
}
@media (max-width:1080px){
  .ai-layout{ grid-template-columns:1fr; }
  .calendar-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:900px){
  .sidebar{ transform:translateX(-100%); }
  .sidebar.open{ transform:none; }
  .main-wrap{ margin-left:0; }
  .sidebar-toggle{ display:inline-flex; }
  .sidebar-mask.show{ display:block; }
  .topbar-user-info{ display:none; }
  .topbar-date{ display:none; }
}
@media (max-width:680px){
  .calendar-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .form-grid{ grid-template-columns:1fr; }
  .detail-grid{ grid-template-columns:1fr; }
  .topbar{ padding:10px 14px; }
  .page-content{ padding:14px; }
  .topbar-search{ width:100%; order:9; }
  .stat-grid{ grid-template-columns:1fr !important; }
}

/* ============================================================
   模块补充样式（工作台 / 图表卡 / 电子表格 / AI 分析 / 详情块）
   ============================================================ */

/* -------- 指标卡栅格默认列 -------- */
.stat-grid{ grid-template-columns:repeat(auto-fit,minmax(196px,1fr)); }
.stat-grid.seven{ grid-template-columns:repeat(auto-fit,minmax(152px,1fr)); }

/* -------- 工作台 -------- */
.wb-card{ overflow:hidden; }
.wb-toolbar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:13px 18px; border-bottom:1px solid var(--border); background:#fff;
}
.wb-toolbar .search-box{
  position:relative; display:flex; align-items:center; background:#f8fafc;
  border:1px solid var(--border); border-radius:10px; padding:0 11px; width:236px;
}
.wb-toolbar .search-box > i{ color:#9ca3af; font-size:12.5px; }
.wb-toolbar .search-box input{ flex:1; border:0; outline:0; background:transparent; padding:9px 8px; font-size:13px; }
.wb-toolbar .search-box:focus-within{ border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px rgba(99,102,241,.12); }
.date-range{
  display:flex; align-items:center; gap:6px; background:#f8fafc;
  border:1px solid var(--border); border-radius:10px; padding:4px 9px;
}
.date-range input[type=date]{ border:0; background:transparent; outline:0; font-size:12.5px; color:#374151; width:116px; }
.range-sep{ color:#9ca3af; }
.wb-toolbar .spacer{ margin-left:auto; }

.wb-body{ padding:18px; }
.wb-calendar{ }
.wb-calendar .cal-head{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.wb-calendar .cal-head .cal-title{ font-size:15px; font-weight:800; color:#111827; }
.wb-calendar .cal-head .spacer{ margin-left:auto; }
.wb-calendar .cal-week{
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:11px; margin-bottom:6px;
}
.wb-calendar .cal-week span{
  text-align:center; font-size:12px; font-weight:700; color:var(--text-light); padding:4px 0;
}
.wb-calendar .cal-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:11px; }
.wb-calendar .cal-cell{ display:flex; flex-direction:column; }
.wb-calendar .cal-cell .d-num{ font-size:17px; font-weight:800; color:#111827; line-height:1.1; }
.wb-calendar .cal-cell .d-week{ font-size:10.5px; color:var(--text-mute); margin-top:2px; }
.wb-calendar .cal-cell .cal-body{ margin-top:9px; flex:1; display:flex; flex-direction:column; gap:5px; }
.wb-calendar .cal-cell .cal-tag{
  font-size:11.2px; border-radius:7px; padding:4px 7px; line-height:1.4; overflow:hidden;
  background:var(--primary-50); color:var(--primary-700);
}
.wb-calendar .cal-cell .cal-tag.done{ text-decoration:line-through; opacity:.6; }
.wb-calendar .cal-cell .cal-tag.prio-high{ background:#fef2f2; color:#dc2626; }
.wb-calendar .cal-cell .cal-tag.prio-mid{ background:#fffbeb; color:#d97706; }
.wb-calendar .cal-cell .cal-none{ font-size:11.5px; color:#cbd5e1; margin-top:2px; }

.wb-panel{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
.wb-panel-head{
  display:flex; align-items:center; gap:9px; padding:14px 16px; border-bottom:1px solid var(--border);
  font-size:14px; font-weight:700; color:#111827;
}
.wb-panel-head i{ color:var(--primary-600); }
.wb-panel-head .spacer{ margin-left:auto; }
.wb-panel-body{ padding:14px; max-height:560px; overflow-y:auto; }
.todo-item{
  display:flex; align-items:flex-start; gap:10px; padding:11px 12px; border:1px solid var(--border);
  border-radius:11px; margin-bottom:10px; background:#fff; transition:.16s;
}
.todo-item:hover{ border-color:#c7d2fe; box-shadow:0 6px 16px rgba(99,102,241,.1); }
.todo-item.done{ background:#f8fafc; }
.todo-check{
  width:19px;height:19px;border-radius:6px; border:1.5px solid #cbd5e1; background:#fff; flex:none;
  display:flex;align-items:center;justify-content:center; font-size:10px; color:#fff; margin-top:1px;
}
.todo-check.on{ background:var(--primary-600); border-color:var(--primary-600); }
.todo-main{ flex:1; min-width:0; }
.todo-text{ font-size:13px; color:#1f2937; line-height:1.5; word-break:break-word; }
.todo-item.done .todo-text{ text-decoration:line-through; color:#94a3b8; }
.todo-meta{ display:flex; align-items:center; gap:7px; margin-top:6px; flex-wrap:wrap; font-size:11.3px; color:var(--text-mute); }
.prio{ padding:1px 8px; border-radius:20px; font-size:10.8px; font-weight:700; }
.prio-high{ background:#fef2f2; color:#dc2626; }
.prio-mid{ background:#fffbeb; color:#d97706; }
.prio-low{ background:#f1f5f9; color:#64748b; }
.todo-del{ border:0; background:transparent; color:#cbd5e1; padding:3px 5px; border-radius:6px; font-size:12px; }
.todo-del:hover{ background:#fef2f2; color:#dc2626; }
.empty-state{ padding:44px 20px; text-align:center; color:var(--text-mute); }
.empty-state i{ font-size:36px; color:#e2e8f0; display:block; margin-bottom:12px; }
.empty-state p{ margin:0 0 14px; font-size:13px; }

/* -------- 图表卡片 -------- */
.chart-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.chart-head{
  display:flex; align-items:center; gap:9px; padding:13px 16px; border-bottom:1px solid var(--border);
  font-size:13.8px; font-weight:700; color:#111827;
}
.chart-head i{ color:var(--primary-600); }
.chart-head .spacer{ margin-left:auto; }
.chart-body{ padding:14px 16px; }
.chart-flex{ display:grid; grid-template-columns:1fr 244px; gap:16px; align-items:center; }
.chart-canvas{ position:relative; height:250px; }
.chart-canvas.tall{ height:296px; }
.section-title{
  display:flex; align-items:center; gap:9px; margin:4px 0 12px;
  font-size:14.5px; font-weight:800; color:#111827;
}
.section-title i{ color:var(--primary-600); }
.head-actions{ display:flex; gap:9px; flex-wrap:wrap; margin-left:auto; }
.amount-box{
  background:linear-gradient(135deg,#eef2ff,#e0e7ff); border:1px solid #c7d2fe;
  border-radius:12px; padding:13px 17px; text-align:right;
}
.amount-box .al{ font-size:11.8px; color:var(--primary-700); font-weight:700; }
.amount-box .av{ font-size:21px; font-weight:800; color:var(--primary-700); margin-top:4px; letter-spacing:-.3px; }

/* -------- 详情弹窗块 -------- */
.detail-block{ margin-bottom:20px; }
.detail-block:last-child{ margin-bottom:0; }
.detail-block-title{
  font-size:12.5px; font-weight:800; color:var(--primary-700); margin-bottom:12px;
  display:flex; align-items:center; gap:7px; padding-bottom:8px; border-bottom:1px dashed var(--border);
}
.detail-grid > div{ background:#f8fafc; border-radius:10px; padding:10px 13px; min-width:0; }
.detail-grid > div.full{ grid-column:1 / -1; }
.detail-grid > div label{ display:block; font-size:11.5px; color:var(--text-mute); margin-bottom:4px; }
.detail-grid > div span{ font-size:13.5px; font-weight:700; color:#111827; word-break:break-word; }
.detail-grid.three{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.detail-grid.four{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.detail-grid.one{ grid-template-columns:1fr; }
table.data-table.mini{ min-width:0; font-size:12.5px; }
table.data-table.mini thead th{ padding:9px 11px; font-size:11.8px; }
table.data-table.mini tbody td{ padding:9px 11px; }
table.data-table tfoot td{ padding:11px 14px; border-top:1px solid var(--border); font-weight:700; color:#111827; }
.icon-btn.danger:hover{ color:#dc2626; border-color:#fecaca; background:#fef2f2; }
.cell-main{ font-weight:700; color:#111827; }
.money.big{ font-size:14.5px; }
.muted{ color:var(--text-mute); }
.mono{ font-variant-numeric:tabular-nums; }
.ellipsis{ max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.num{ text-align:right; font-variant-numeric:tabular-nums; }

/* -------- 电子表格 -------- */
.ss-card{
  background:#fff; border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow); overflow:hidden;
}
.ss-toolbar{
  display:flex; align-items:center; gap:5px; flex-wrap:wrap;
  padding:9px 13px; border-bottom:1px solid var(--border); background:#f8fafc;
}
.tool-btn{
  width:30px;height:30px;border-radius:7px; border:1px solid transparent; background:transparent;
  color:#475569; display:inline-flex;align-items:center;justify-content:center; font-size:12.5px; transition:.14s;
}
.tool-btn:hover{ background:#fff; border-color:var(--border); color:var(--primary-700); }
.tool-btn.on{ background:var(--primary-50); border-color:#c7d2fe; color:var(--primary-700); }
.tool-sep{ width:1px; height:20px; background:var(--border); margin:0 4px; }
.tool-select{
  height:30px; border:1px solid var(--border); border-radius:7px; background:#fff;
  font-size:12px; color:#475569; padding:0 6px; outline:0;
}
.tool-select:focus{ border-color:var(--primary); }
.tool-color{
  display:flex; align-items:center; gap:4px; height:30px; padding:0 8px; border:1px solid var(--border);
  border-radius:7px; background:#fff; font-size:12px; color:#475569;
}
.tool-color input[type=color]{ width:26px; height:22px; border:0; background:transparent; padding:0; cursor:pointer; }
.tool-hint{
  font-size:12px; font-weight:700; color:#475569; background:#f1f5f9;
  border-radius:6px; padding:5px 9px; min-width:56px; text-align:center;
}
.tool-hint.dirty{ background:#eef2ff; color:var(--primary-700); }
.ss-grid-wrap{ overflow:auto; max-height:552px; background:#fff; }
table.ss-grid{ border-collapse:collapse; font-size:12.5px; table-layout:fixed; }
table.ss-grid th, table.ss-grid td{ border:1px solid #e2e8f0; padding:0; }
.ss-corner{
  width:44px; min-width:44px; height:26px; background:#fde68a;
  position:sticky; left:0; top:0; z-index:4;
}
.ss-colhead{
  width:124px; min-width:124px; height:26px; background:#fde68a; color:#78350f;
  font-weight:700; font-size:11.5px; text-align:center; position:sticky; top:0; z-index:2;
}
.ss-rowhead{
  width:44px; min-width:44px; height:30px; background:#fde68a; color:#78350f;
  font-weight:700; font-size:11.5px; text-align:center; position:sticky; left:0; z-index:2;
}
.ss-cell{
  width:124px; min-width:124px; height:30px; padding:0 7px; color:#1f2937;
  cursor:cell; overflow:hidden; white-space:nowrap; background:#fff; outline:0;
}
.ss-cell:focus{ outline:2px solid var(--primary); outline-offset:-2px; }
.ss-cell.head{ background:#dbeafe; color:#1e3a8a; font-weight:700; }
.ss-bottom{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 12px; border-top:1px solid var(--border); background:#f8fafc; }
.ss-tabs{ display:flex; gap:5px; flex-wrap:wrap; }
.ss-tab{
  padding:6px 14px; border-radius:8px; font-size:12.5px; color:#475569;
  border:1px solid var(--border); background:#fff; transition:.14s;
}
.ss-tab:hover{ border-color:#c7d2fe; color:var(--primary-700); }
.ss-tab.active{ background:var(--primary-600); border-color:var(--primary-600); color:#fff; font-weight:700; }

/* -------- AI 分析 -------- */
.ai-side{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.ai-side-head{
  display:flex; align-items:center; gap:9px; padding:13px 16px; border-bottom:1px solid var(--border);
  font-size:14px; font-weight:700; color:#111827;
}
.ai-side-head i{ color:#7c3aed; }
.ai-side-body{ padding:15px 16px; }
.ai-main{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.ai-list{ margin:0; padding-left:19px; font-size:13px; line-height:1.85; color:#374151; }
.ai-run{ width:100%; margin-top:16px; }
.ai-tip{ margin-top:14px; font-size:11.8px; color:var(--text-mute); line-height:1.65; }
.ai-version{
  display:flex; align-items:center; gap:7px; margin-top:12px; padding-top:12px;
  border-top:1px dashed var(--border); font-size:11.5px; color:var(--text-mute);
}
.ai-version-tag{
  background:var(--primary-50); color:var(--primary-700); border-radius:20px;
  padding:2px 9px; font-weight:700; font-size:11px;
}
.field{ margin-bottom:14px; }
.field > label{ display:block; font-size:12.5px; font-weight:600; color:#4b5563; margin-bottom:7px; }

@media (max-width:1080px){
  .wb-body{ grid-template-columns:1fr !important; }
  .chart-flex{ grid-template-columns:1fr; }
  .detail-grid.three, .detail-grid.four{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ============================================================
   应用外壳 / 固定列指标卡 / 待办面板 / 表格补充样式
   ============================================================ */

/* -------- 指标卡固定列 -------- */
.stat-grid.four{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.stat-grid.five{ grid-template-columns:repeat(5,minmax(0,1fr)); }
.stat-grid.seven{ grid-template-columns:repeat(7,minmax(0,1fr)); }

/* -------- 页面切换动画 -------- */
.page-enter{ animation: pageIn .26s ease both; }
@keyframes pageIn{
  from{ opacity:0; transform:translateY(8px); }
  to{ opacity:1; transform:none; }
}

/* -------- 待办面板 -------- */
.wb-todos{ display:flex; flex-direction:column; gap:9px; padding:14px 16px; max-height:520px; overflow-y:auto; }

/* -------- 日历选中态 / 占位格 -------- */
.cal-cell.selected{
  border-color:var(--primary); background:linear-gradient(160deg,#fff 45%,#eef2ff);
  box-shadow:0 0 0 3px rgba(99,102,241,.16);
}
.cal-cell.selected .d-num{ color:var(--primary-700); }
.cal-cell.empty{ background:#f8fafc; border-style:dashed; cursor:default; min-height:122px; }
.cal-cell.empty:hover{ transform:none; box-shadow:none; border-color:var(--border); }

/* -------- 表格内负责人单元格 -------- */
.owner-cell{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.owner-cell .avatar-sm{
  width:22px; height:22px; border-radius:50%; flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--primary-50); color:var(--primary-700);
  font-size:10.5px; font-weight:700;
}

/* -------- 电子表格新增页签 -------- */
.ss-tab.add{ color:var(--primary-700); border-style:dashed; background:var(--primary-50); }
.ss-tab.add:hover{ background:#e0e7ff; }

/* -------- 应用外壳小屏 -------- */
@media (max-width:1280px){
  .stat-grid.four, .stat-grid.five{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
  .stat-grid.seven{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
}
@media (max-width:680px){
  .stat-grid.four, .stat-grid.five, .stat-grid.seven{ grid-template-columns:1fr; }
}

/* -------- 导航分组 -------- */
.nav-group{ margin-bottom:6px; }
.nav-group + .nav-group{ margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,.08); }

/* -------- 双列栅格（表单 / 详情） -------- */
.form-grid.two, .detail-grid.two{ grid-template-columns:repeat(2,minmax(0,1fr)); }

/* -------- AI 分析结果区 -------- */
.ai-result{ background:#fff; border:1px solid var(--border); border-radius:14px; padding:18px 20px; }
.ai-result .ai-block{ margin-bottom:18px; }
.ai-result .ai-block:last-child{ margin-bottom:0; }
.ai-result .ai-block h4{
  font-size:13.5px; font-weight:700; color:var(--ink);
  margin:0 0 8px; display:flex; align-items:center; gap:7px;
}
.ai-result .ai-block h4 i{ color:var(--primary); }
.ai-result .ai-text{
  font-size:13px; line-height:1.85; color:#374151;
  background:#f9fafb; border:1px solid #eef0f4; border-radius:10px;
  padding:12px 14px; white-space:pre-wrap;
}
.ai-result .ai-text + .ai-text{ margin-top:8px; }
.ai-result .ai-tag{
  display:inline-block; font-size:11.5px; color:var(--primary-700);
  background:var(--primary-50); border-radius:999px; padding:2px 10px; margin-bottom:8px;
}

/* -------- 顶栏按钮文字（窄屏隐藏） -------- */
@media (max-width:1180px){
  .btn-label{ display:none; }
  .form-grid.two, .detail-grid.two{ grid-template-columns:1fr; }
}

/* -------- 登录卡片错误抖动 -------- */
.login-card.shake{ animation:cardShake .45s ease; }
@keyframes cardShake{
  0%,100%{ transform:translateX(0); }
  20%{ transform:translateX(-9px); }
  40%{ transform:translateX(8px); }
  60%{ transform:translateX(-5px); }
  80%{ transform:translateX(3px); }
}