:root{--bg:#0f172a;--fg:#e2e8f0;--muted:#94a3b8;--accent:#38bdf8;--card:#111827;--border:#1f2937;--header:#0b1220;--link:#cbd5e1;--link-hover:#e2e8f0;--danger:#ef4444}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
.app-header,.app-footer,body,.card,.input,.btn{transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.app-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:var(--header);border-bottom:1px solid var(--border);position:relative}
.app-header h1{margin:8px 0;font-size:16px;font-weight:900;letter-spacing:.5px;color:var(--accent);-webkit-text-stroke:1px #00d5ff;text-shadow:0 3px 0 rgba(0,213,255,.75);flex:0 0 200px;max-width:200px;line-height:1.15;white-space:normal;overflow-wrap:anywhere}
body.light .app-header h1{color:#000000}
.rd-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}
.rd-head h3{margin:0}
.rd-sub{color:var(--muted);font-size:13px}
.rd-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px;padding:10px;border-radius:12px;border:1px solid #e2e8f0;background:#f8fafc}
.rd-toolbar .group{display:flex;flex-direction:column;gap:4px;min-width:160px}
.rd-toolbar label{font-size:12px;color:#64748b}
.rd-toolbar .input{background:#ffffff;border-color:#e2e8f0;color:#0f172a}
.rd-grid2{display:grid;grid-template-columns:1.7fr 1fr;gap:14px;align-items:start}
.rd-card{background:#ffffff;color:#0f172a;border-radius:12px;border:1px solid #e2e8f0;padding:14px;box-shadow:0 4px 6px -1px rgba(0,0,0,0.10)}
.rd-card h4{margin:0 0 10px 0}
.rd-card .btn{background:#ffffff;border-color:#e2e8f0;color:#0f172a}
.rd-card .btn:hover{border-color:#0284c7;color:#0284c7}
.rd-card .btn.primary{background:#0284c7;border-color:#0284c7;color:#ffffff}
.rd-card .btn.primary:hover{filter:brightness(0.96)}
.rd-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:14px}
.rd-stat-card{background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border-radius:12px;padding:12px;border:1px solid #e2e8f0;color:#0f172a}
.rd-stat-label{font-size:13px;color:#475569}
.rd-stat-val{font-size:22px;font-weight:800;color:#0f172a;margin-top:6px}
.rd-kv{display:grid;grid-template-columns:92px 1fr;gap:8px;align-items:center;margin:6px 0;font-size:13px}
.rd-kv .k{color:#64748b}
.rd-kv .v{color:#0f172a;word-break:break-word}
body:not(.light) .rd-toolbar{background:rgba(255,255,255,.06);border-color:rgba(148,163,184,.35)}
body:not(.light) .rd-card{background:rgba(255,255,255,.90)}
@media (max-width: 1024px){.rd-grid2{grid-template-columns:1fr}}
.opt-tabs{display:flex;gap:4px;border-bottom:2px solid rgba(148,163,184,.35);margin-bottom:14px;overflow:auto;padding-bottom:2px}
.opt-tab{flex:0 0 auto;cursor:pointer;padding:8px 14px;border-radius:8px 8px 0 0;color:var(--muted);font-weight:600;border:1px solid transparent;background:transparent;transition:all .2s ease;user-select:none;white-space:nowrap}
.opt-tab:hover{background:rgba(241,245,249,.65);color:#0f172a}
body:not(.light) .opt-tab:hover{background:rgba(148,163,184,.12);color:var(--fg)}
.opt-tab.active{background:rgba(56,189,248,.14);color:var(--accent);border-bottom:2px solid var(--accent);margin-bottom:-2px}
body.light .opt-tab.active{background:#e0f2fe}
.opt-tabs--sub{margin-bottom:10px;border-bottom:1px solid rgba(148,163,184,.25)}
.opt-tabs--sub .opt-tab{padding:7px 12px;border-radius:7px 7px 0 0;font-size:13px}
/* Tab bar style navigation */
.nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 16px;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--muted) transparent;
  align-items: center;
  flex: 1;
  min-width: 0;
  margin-left: 8px;
  height: 72px;
}
.nav-scroll{
  display:flex;
  flex:1;
  overflow-x:auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  align-items:center;
}
.nav-scroll::-webkit-scrollbar{ display:none; }
.nav-arrow{
  display:none;
  width:28px; height:28px;
  align-items:center; justify-content:center;
  border-radius:9999px; border:1px solid var(--border);
  background:rgba(148,163,184,.12); color:var(--fg);
  cursor:pointer; flex-shrink:0;
}
.nav-arrow:hover{ border-color:var(--accent); }
.nav-arrow[disabled]{ opacity:.5; cursor:default; }
.nav-actions{ display:flex; gap:6px; flex-shrink:0; }
.nav a {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  height: auto;
  padding: 6px 8px;
  border: none;
  border-bottom: 3px solid transparent;
  border-left: 3px solid transparent;
  background: transparent;
  color: var(--fg);
  opacity: 0.8;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
  font-weight: 600;
  transition: all .2s ease;
  flex-shrink: 0;
  max-width: 128px;
  font-size: 15px;
  line-height: 1.15;
  border-radius: 6px 6px 0 0;
  will-change: transform;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.nav-scroll a[data-nav="auth"]{display:none}
body.is-auth .nav-scroll a[data-nav="auth"]{display:inline-flex}
.nav-scroll a[data-nav="admin"]{display:none}
.nav-scroll a[data-nav="guest"]{display:inline-flex}
.nav-scroll a[data-nav="guest-only"]{display:inline-flex}
body.is-auth .nav-scroll a[data-nav="guest-only"]{display:none}
body.is-admin .nav-scroll > a{display:none}
body.is-admin .nav-scroll > a[data-admin="keep"]{display:inline-flex}
body.is-admin .nav-scroll > a[data-nav="admin"]{display:inline-flex}
.nav a.nav-two{ flex-direction:column; align-items:flex-start; }
.nav a .nav-part2{ display:block; }
.nav a .nav-part1, .nav a .nav-part2{ white-space:nowrap; }
.nav a .nav-sep{ margin:0 2px; opacity:.8; }
.sub-nav-tabs{
  display:flex; align-items:center; gap:10px; padding:6px 16px; border-top:1px solid rgba(255,255,255,0.06); min-height:44px;
  position:absolute; top:72px; left:0; z-index:1001; background:transparent;
}
.nav-scroll > .sub-nav-tabs{
  position:static;
  top:auto;
  left:auto;
  z-index:auto;
  padding:0 0 0 10px;
  border-top:0;
  min-height:auto;
  flex: 0 0 auto;
  flex-shrink: 0;
  min-width: max-content;
}
.nav-scroll > .sub-nav-tabs a{
  border-radius:9999px;
  border-top:1px solid rgba(148,163,184,.22);
  border-right:1px solid rgba(148,163,184,.22);
  border-bottom:1px solid rgba(148,163,184,.22);
  border-left:3px solid transparent;
  height:30px;
  line-height:30px;
}
.nav-scroll > .sub-nav-tabs a.sub-nav-two{
  flex-direction:column;
  align-items:flex-start;
  height:auto;
  min-height:30px;
  line-height:1.12;
  padding:6px 10px;
}
.nav-scroll > .sub-nav-tabs a.sub-nav-two .sub-part1,
.nav-scroll > .sub-nav-tabs a.sub-nav-two .sub-part2{
  display:block;
  white-space:nowrap;
}
.nav-scroll > .sub-nav-tabs a.sub-nav-two .sub-sep{
  margin-left:2px;
  opacity:.85;
}
.sub-nav-tabs a{
  display:inline-flex; align-items:center; gap:6px; height:32px; line-height:32px; padding:0 8px; border:none; border-bottom:2px solid transparent; border-left:3px solid transparent; background:transparent; color:var(--fg); opacity:0.8;
  text-decoration:none; white-space:nowrap; font-weight:600; font-size:14px; border-radius:4px 4px 0 0;
  transition: all .2s ease;
  will-change: transform;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.sub-nav-tabs a:hover{ color:var(--fg); opacity:1; transform: scale(1.05); position: relative; z-index: 2; }
.sub-nav-tabs a.active{ color:var(--accent); opacity:1; border-bottom-color:var(--accent); border-left-color:var(--accent); font-weight:700; text-shadow: 0 0 8px rgba(56, 189, 248, 0.4); background:transparent !important; }
/* 子导航按一级导航主题设置浅色渐变背景 */
.sub-nav-tabs a[href*="/#/vip"]{ background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25)); }
.sub-nav-tabs a[href*="/#/distribution"]{ background:linear-gradient(135deg, rgba(249,115,22,.25), rgba(251,146,60,.25)); }
.sub-nav-tabs a[href*="/#/live"]{ background:linear-gradient(135deg, rgba(239,68,68,.25), rgba(252,165,165,.25)); }
.sub-nav-tabs a[href*="/#/payments"]{ background:linear-gradient(135deg, rgba(34,211,238,.25), rgba(6,182,212,.25)); }
.sub-nav-tabs a[href*="/#/assignments"]{ background:linear-gradient(135deg, rgba(59,130,246,.25), rgba(96,165,250,.25)); }
.sub-nav-tabs a[href*="/#/uat"]{ background:linear-gradient(135deg, rgba(132,204,22,.25), rgba(34,197,94,.25)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/resources"]{ background:linear-gradient(135deg, rgba(221,214,254,.55), rgba(165,180,252,.40)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/promo"]{ background:linear-gradient(135deg, rgba(251,207,232,.60), rgba(253,164,175,.40)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/customers"]{ background:linear-gradient(135deg, rgba(204,251,241,.60), rgba(94,234,212,.38)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/quotes"]{ background:linear-gradient(135deg, rgba(254,240,138,.58), rgba(253,186,116,.40)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/projects"]{ background:linear-gradient(135deg, rgba(199,210,254,.58), rgba(147,197,253,.36)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/procurement"]{ background:linear-gradient(135deg, rgba(186,230,253,.58), rgba(125,211,252,.36)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/manufacturing"]{ background:linear-gradient(135deg, rgba(226,232,240,.62), rgba(148,163,184,.32)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/inventory"]{ background:linear-gradient(135deg, rgba(236,252,203,.62), rgba(190,242,100,.34)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/orders"]{ background:linear-gradient(135deg, rgba(254,249,195,.62), rgba(253,230,138,.34)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/finance"]{ background:linear-gradient(135deg, rgba(209,250,229,.60), rgba(110,231,183,.32)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/automation"]{ background:linear-gradient(135deg, rgba(245,208,254,.60), rgba(216,180,254,.34)); }
.nav-scroll > .sub-nav-tabs a[href*="/#/legacy"]{ background:linear-gradient(135deg, rgba(233,213,255,.60), rgba(196,181,253,.34)); }
.nav-item{ display:inline-flex; align-items:center; gap:4px; height:100%; }
.nav .sub-toggle{ padding:4px; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; border-radius:9999px; border:1px solid var(--border); background:rgba(148,163,184,.12); color:var(--fg); cursor:pointer; flex-shrink:0 }
.nav .sub-toggle:hover{ border-color:var(--accent) }
.nav .has-sub{ position:relative }
.nav .sub-nav{ position:absolute; top:calc(100% + 6px); left:0; z-index:1001; display:none; min-width:140px; background:var(--card); border:1px solid var(--border); border-radius:8px; box-shadow:0 12px 24px rgba(0,0,0,.28); padding:8px }
.nav .sub-nav a{ display:block; padding:6px 10px; margin:2px 0; border-bottom:0; background:linear-gradient(135deg, rgba(56,189,248,.10), rgba(99,102,241,.10)); border-radius:6px }
.nav .has-sub:hover .sub-nav{ display:block }
.nav .has-sub.open .sub-nav{ display:block }
.nav a[href*="/#/landing"]{background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25))}
.nav a[href*="/#/dashboard"]{background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(96,165,250,.25))}
.nav a[href*="/#/resources"]{background:linear-gradient(135deg, rgba(139,92,246,.25), rgba(99,102,241,.25))}
.nav a[href*="/#/promo"]{background:linear-gradient(135deg, rgba(244,114,182,.25), rgba(251,113,133,.25))}
.nav a[href*="/#/customers"]{background:linear-gradient(135deg, rgba(20,184,166,.25), rgba(45,212,191,.25))}
.nav a[href*="/#/quotes"]{background:linear-gradient(135deg, rgba(245,158,11,.25), rgba(253,230,138,.25))}
.nav a[href*="/#/contracts"]{background:linear-gradient(135deg, rgba(245,158,11,.25), rgba(253,230,138,.25))}
.nav a[href*="/#/procurement"]{background:linear-gradient(135deg, rgba(14,165,233,.25), rgba(2,132,199,.25))}
.nav a[href*="/#/manufacturing"]{background:linear-gradient(135deg, rgba(148,163,184,.25), rgba(71,85,105,.25))}
.nav a[href*="/#/inventory"]{background:linear-gradient(135deg, rgba(132,204,22,.25), rgba(101,163,13,.25))}
.nav a[href*="/#/orders"]{background:linear-gradient(135deg, rgba(245,158,11,.25), rgba(253,230,138,.25))}
.nav a[href*="/#/projects"]{background:linear-gradient(135deg, rgba(99,102,241,.25), rgba(59,130,246,.25))}
.nav a[href*="/#/automation"]{background:linear-gradient(135deg, rgba(168,85,247,.25), rgba(217,70,239,.25))}
.nav a[href*="/#/uat"]{background:linear-gradient(135deg, rgba(132,204,22,.25), rgba(34,197,94,.25))}
.nav a[href*="/#/finance"]{background:linear-gradient(135deg, rgba(16,185,129,.25), rgba(34,197,94,.25))}
.nav a[href*="/#/legacy"]{background:linear-gradient(135deg, rgba(216,180,254,.25), rgba(192,132,252,.25))}
.nav a[href*="/#/distribution"]{background:linear-gradient(135deg, rgba(249,115,22,.25), rgba(251,146,60,.25))}
.nav a[href*="/#/live"]{background:linear-gradient(135deg, rgba(239,68,68,.25), rgba(252,165,165,.25))}
.nav a[href*="/#/assignments"]{background:linear-gradient(135deg, rgba(59,130,246,.25), rgba(96,165,250,.25))}
.nav a[href*="/#/payments"]{background:linear-gradient(135deg, rgba(34,211,238,.25), rgba(6,182,212,.25))}
.nav a[href*="/#/vip"]{background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25))}
.nav a[href*="/#/audit"]{background:linear-gradient(135deg, rgba(244,63,94,.25), rgba(239,68,68,.25))}
.nav a[href*="/#/gdpr"]{background:linear-gradient(135deg, rgba(100,116,139,.25), rgba(148,163,184,.25))}
.nav a[href*="/#/circles"]{background:linear-gradient(135deg, rgba(34,197,94,.18), rgba(22,163,74,.14))}
.nav a[href*="/#/settings"]{background:linear-gradient(135deg, rgba(156,163,175,.25), rgba(107,114,128,.25))}
.nav a[href*="/#/register"]{background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25))}
.nav a[href*="/#/login"]{background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25))}
.nav a#resCustomersGroupTab{background:linear-gradient(135deg, rgba(34,211,238,.25), rgba(59,130,246,.25))}
.nav a#projectsOpsGroupTab{background:linear-gradient(135deg, rgba(34,197,94,.25), rgba(163,230,53,.25))}
.nav a#aiLegacyGroupTab{background:linear-gradient(135deg, rgba(244,114,182,.25), rgba(168,85,247,.25))}
.nav a:hover {
  color: var(--fg);
  opacity: 1;
  transform: scale(1.06);
  position: relative;
  z-index: 2;
}
@keyframes nav-tab-activate {
  0% { transform: scale(1); }
  55% { transform: scale(1.12); }
  100% { transform: scale(1.03); }
}
.nav a.active {
  color: var(--accent);
  opacity: 1;
  border-bottom-color: transparent;
  border-left-color: var(--accent);
  font-weight: 700;
  text-shadow: 0 0 8px rgba(56, 189, 248, 0.4);
  background: transparent;
  transform: scale(1.03);
  animation: nav-tab-activate 180ms ease-out;
}
.nav a#circlesTab.active{background:transparent}
.nav a#resCustomersGroupTab.active{background:linear-gradient(135deg, rgba(34,211,238,.25), rgba(59,130,246,.25))}
.nav a#projectsOpsGroupTab.active{background:linear-gradient(135deg, rgba(34,197,94,.25), rgba(163,230,53,.25))}
.nav a#aiLegacyGroupTab.active{background:linear-gradient(135deg, rgba(244,114,182,.25), rgba(168,85,247,.25))}
.sub-nav-tabs a.active{
  transform: scale(1.03);
  animation: nav-tab-activate 180ms ease-out;
}
.nav .pin-toggle-btn{padding:4px;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;border:1px solid var(--border);background:rgba(148,163,184,.12);color:var(--fg);cursor:pointer;flex-shrink:0}
.nav .pin-toggle-btn:hover{border-color:var(--accent)}

@media (max-width: 1024px) {
  .app-header { padding: 12px 16px; flex-wrap: nowrap; }
  .app-header h1 { margin: 0; font-size: 17px; flex:0 0 180px; max-width:180px; }
  .nav { margin-left: 8px; flex: 1; width: auto; height: 72px; gap: 8px; padding: 0; border-top: none; margin-top: 0; }
  .nav-scroll { width: auto; }
  .nav a { height: auto; padding-bottom: 0; border-bottom-width: 3px; max-width: 112px; }
}
@media (max-width: 640px) {
  .app-header h1 { font-size: 16px; flex:0 0 160px; max-width:160px; }
}
.milestone-menu{position:fixed;right:16px;top:60px;z-index:1000;width:520px;min-width:240px;max-width:calc(100vw - 32px);overflow:auto;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 12px 24px rgba(0,0,0,.28);padding:6px;display:none}
/* 仅“自定义导航”弹窗使用半透明效果 */
#milestoneMenu{opacity:.7;resize:horizontal;right:auto;left:50%;bottom:16px;top:auto;transform:translateX(-50%)}
.milestone-menu .mm-title{font-weight:800;margin:4px 8px 8px;color:var(--muted)}
.milestone-menu .mm-list{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
/* 里程碑弹窗使用自适应宽度的按钮布局 */
#milestoneMenu .mm-list{display:flex;flex-wrap:wrap;gap:4px;align-items:flex-start}
.milestone-menu .mm-item{display:inline-flex;align-items:center;justify-content:flex-start;gap:4px;padding:4px 8px;border:1px solid var(--border);border-radius:999px;background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));color:var(--fg);cursor:pointer;font-size:11px;text-align:left;flex:0 0 auto;font-weight:700}
.milestone-menu .mm-item span:last-child{display:none}
.milestone-menu .mm-item:hover{border-color:var(--accent)}
/* 设置页通用编辑网格与项样式 */
.settings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}
.settings-item{display:grid;grid-template-columns:1fr;gap:6px;border:1px solid var(--border);border-radius:8px;padding:8px;background:rgba(148,163,184,.08)}
.settings-item .row{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center}
.settings-item .input, .settings-item select{width:100%;padding:6px;border-radius:6px;border:1px solid var(--border);background:rgba(148,163,184,.08);color:var(--fg)}
.settings-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
/* 渐变配色：为各导航按钮分配不同浅色渐变背景 */
.milestone-menu .mm-item:nth-of-type(1){background:linear-gradient(135deg, rgba(56,189,248,.14), rgba(99,102,241,.14))}
.milestone-menu .mm-item:nth-of-type(2){background:linear-gradient(135deg, rgba(168,85,247,.14), rgba(236,72,153,.14))}
.milestone-menu .mm-item:nth-of-type(3){background:linear-gradient(135deg, rgba(16,185,129,.14), rgba(20,184,166,.14))}
.milestone-menu .mm-item:nth-of-type(4){background:linear-gradient(135deg, rgba(245,158,11,.14), rgba(249,115,22,.14))}
.milestone-menu .mm-item:nth-of-type(5){background:linear-gradient(135deg, rgba(244,63,94,.14), rgba(239,68,68,.14))}
.milestone-menu .mm-item:nth-of-type(6){background:linear-gradient(135deg, rgba(6,182,212,.14), rgba(14,165,233,.14))}
.milestone-menu .mm-item:nth-of-type(7){background:linear-gradient(135deg, rgba(124,58,237,.14), rgba(99,102,241,.14))}
.milestone-menu .mm-item:nth-of-type(8){background:linear-gradient(135deg, rgba(163,230,53,.18), rgba(16,185,129,.14))}
.milestone-menu .mm-item:nth-of-type(9){background:linear-gradient(135deg, rgba(217,70,239,.14), rgba(236,72,153,.14))}
.milestone-menu .mm-item:nth-of-type(10){background:linear-gradient(135deg, rgba(148,163,184,.14), rgba(99,102,241,.12))}
/* 控制窄宽下的文本溢出为省略号 */
.milestone-menu .mm-item span:first-child{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.milestone-menu .mm-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.milestone-menu .mm-head .mm-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 里程碑菜单：可拖动头部与编辑面板样式 */
.milestone-menu .mm-head{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:3px 6px;border-bottom:1px solid var(--border);cursor:move}
.milestone-menu .mm-head .mm-name{font-weight:700;color:var(--fg);font-size:12px}
.milestone-menu .mm-head .mm-actions{display:flex;gap:4px}
.milestone-menu .mm-btn{padding:3px 6px;border-radius:6px;border:1px solid var(--border);background:rgba(148,163,184,.12);color:var(--fg);cursor:pointer;font-size:12px}
/* 自定义导航弹窗的图标按钮（参考顶部 pin-toggle-btn 风格） */
.milestone-menu .mm-icon-btn{padding:3px;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;border:1px solid var(--border);background:rgba(148,163,184,.12);color:var(--fg);cursor:pointer;flex-shrink:0}
.milestone-menu .mm-icon-btn:hover{border-color:var(--accent)}
.milestone-menu .mm-btn:hover{border-color:var(--accent)}
.milestone-menu .mm-editor{padding:8px 6px;border-top:1px dashed var(--border);margin-top:6px}
.milestone-menu .mm-editor .row{display:grid;grid-template-columns:1.1fr 1fr 1.6fr auto;gap:6px;align-items:center;margin-bottom:6px}
.milestone-menu .mm-editor input,.milestone-menu .mm-editor select{width:100%;padding:6px;border-radius:6px;border:1px solid var(--border);background:rgba(148,163,184,.08);color:var(--fg)}
.milestone-menu .mm-editor .row .del{padding:6px;border-radius:6px;border:1px solid var(--border);background:rgba(148,163,184,.12);color:var(--fg);cursor:pointer}
.milestone-menu .mm-editor .row .del:hover{border-color:var(--accent)}
.milestone-menu .mm-editor .editor-actions{display:flex;gap:6px;margin-top:8px}
/* 语言菜单单列布局与宽度/滚动优化 */
#langMenu{width:auto;min-width:120px;max-width:220px}
@media (max-width: 190px){#langMenu{width:calc(100vw - 20px);max-width:none}}
#langMenu .mm-list{grid-template-columns:1fr;max-height:60vh;overflow-y:auto;gap:1px}
#langMenu .mm-item{padding:1px 2px;font-size:9px;gap:1px;justify-content:space-between;min-height:18px}
#langMenu .mm-item span:first-child{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#langMenu .mm-item span:last-child{display:inline;flex:0 0 24px;text-align:right;opacity:.7;font-size:7px}
.app-header.pinned{position:sticky;top:0;z-index:999;background:var(--bg);box-shadow:0 6px 18px rgba(2,6,23,.12)}
.app-header.pinned .nav{padding:6px 0}
.app-main{padding:16px;padding-bottom:72px}
.card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:16px;margin-bottom:12px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.card{overflow-x:auto}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
/* 落地页结构与动效 */
.landing-hero{background:linear-gradient(135deg, rgba(56,189,248,.20), rgba(99,102,241,.20));}
.landing-page .reveal{opacity:0;transform:translateY(8px);transition:opacity .25s ease, transform .25s ease}
.landing-page .reveal.show{opacity:1;transform:none}
.landing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.landing-grid .lg-item{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:12px;border:1px solid var(--border);border-radius:10px;background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));cursor:pointer;transition:transform .08s ease, box-shadow .15s ease}
.landing-grid .lg-item:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.25)}
.lg-item .lg-title{font-weight:700}
.lg-item[aria-expanded="true"]{background:linear-gradient(135deg, rgba(56,189,248,.18), rgba(99,102,241,.18))}
.flow-line{color:var(--muted);font-weight:600}
.pricing-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.pricing-card{position:relative;border:1px solid var(--border);border-radius:12px;padding:12px;background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));box-shadow:0 6px 16px rgba(0,0,0,.25);transition:transform .08s ease, box-shadow .15s ease}
.pricing-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.28)}
.pricing-card.reco{border-color:var(--accent);box-shadow:0 10px 22px rgba(56,189,248,.25);transform:translateY(-2px)}
.pricing-card .pc-tag{position:absolute;left:10px;top:10px;background:rgba(148,163,184,.25);color:var(--fg);border-radius:999px;padding:2px 8px;font-size:12px;font-weight:700}
.pricing-card .pc-tag.reco{background:linear-gradient(135deg, rgba(56,189,248,.30), rgba(99,102,241,.30));color:#0f172a}
.pricing-card .pc-head{font-weight:800}
.pricing-card .pc-price{font-size:18px;font-weight:700}
.pricing-card .pc-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.testi{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.testi-item{border:1px dashed var(--border);border-radius:10px;padding:10px;background:rgba(148,163,184,.12)}
.final-cta{display:flex;gap:8px;flex-wrap:wrap}
 .hero-seg{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
 .hero-seg .seg-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));color:var(--fg);cursor:pointer;transition:transform .08s ease,border-color .15s ease,box-shadow .15s ease}
 .hero-seg .seg-btn.active{border-color:var(--accent);box-shadow:0 6px 16px rgba(56,189,248,.22);transform:translateY(-1px)}
 .seg-hint{margin-top:8px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));color:var(--fg);box-shadow:0 4px 12px rgba(0,0,0,.18)}
 .hero-micro{color:var(--muted);margin:6px 0 0}
 .poster-cta .btn.emph{border-color:var(--accent);box-shadow:0 8px 18px rgba(56,189,248,.25);transform:translateY(-1px)}
@media (prefers-reduced-motion: reduce){
  .landing-page .reveal{opacity:1 !important;transform:none !important;transition:none !important}
  .landing-grid .lg-item,.pricing-card,.hero-seg .seg-btn{transition:none !important}
}
body.light .landing-hero{background:linear-gradient(135deg, rgba(56,189,248,.30), rgba(99,102,241,.30))}
body.light .landing-grid .lg-item{background:linear-gradient(135deg, rgba(148,163,184,.20), rgba(148,163,184,.30))}
body.light .lg-item[aria-expanded="true"]{background:linear-gradient(135deg, rgba(56,189,248,.28), rgba(99,102,241,.28))}
body.light .pricing-card{background:linear-gradient(135deg, rgba(148,163,184,.20), rgba(148,163,184,.30))}
body.light .hero-seg .seg-btn.active{box-shadow:0 6px 16px rgba(37,99,235,.22)}
body.light .seg-hint{background:linear-gradient(135deg, rgba(148,163,184,.20), rgba(148,163,184,.30))}
/* 圈子UGC双栏布局：左窄右宽，提升帖子可视宽度 */
.grid-circles{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:12px}
@media (max-width: 860px){.grid-circles{grid-template-columns:1fr}}
.card--projects .circle-tabs .circle-tab{border-color:transparent;color:#0f172a}
.card--projects .circle-tabs .circle-tab.is-active{box-shadow:0 0 0 2px rgba(15,23,42,.18) inset, 0 10px 18px rgba(2,6,23,.18);transform:translateY(-1px)}
.card--projects .circle-tabs .circle-tab--my{background-image:linear-gradient(135deg, rgba(224,242,254,.92), rgba(224,231,255,.88))}
.card--projects .circle-tabs .circle-tab--whitelist{background-image:linear-gradient(135deg, rgba(220,252,231,.92), rgba(209,250,229,.86))}
.card--projects .circle-tabs .circle-tab--blacklist{background-image:linear-gradient(135deg, rgba(241,245,249,.92), rgba(226,232,240,.86))}
.card--projects .circle-tabs .circle-tab--messages{background-image:linear-gradient(135deg, rgba(255,228,230,.92), rgba(254,205,211,.86))}
.card--projects .circle-searchbar #circleSearchBtn{min-width:110px}
.grid-circles .card--customers #postSubmit,
.grid-circles .card--customers #loadMore{
  min-width:132px;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.card--projects .create-area .btn,
.card--projects .circle-searchbar .btn,
.card--projects .circle-card .circle-card-actions .btn{
  border-color:transparent;
  color:#0f172a;
}
.card--projects .create-area .btn:hover,
.card--projects .circle-searchbar .btn:hover,
.card--projects .circle-card .circle-card-actions .btn:hover{
  border-color:transparent;
  color:#0f172a;
  filter:brightness(0.985);
}
.card--projects #circleCreate{background-image:linear-gradient(135deg, rgba(34,197,94,.30), rgba(16,185,129,.24))}
.card--projects #applyVip{background-image:linear-gradient(135deg, rgba(167,139,250,.30), rgba(244,114,182,.22))}
.card--projects .circle-searchbar #circleSearchBtn{background-image:linear-gradient(135deg, rgba(56,189,248,.30), rgba(99,102,241,.24))}
.card--projects .circle-searchbar #circleSearchClear{background-image:linear-gradient(135deg, rgba(148,163,184,.28), rgba(226,232,240,.22))}
.card--projects .circle-card .circle-card-actions > a.btn{background-image:linear-gradient(135deg, rgba(34,211,238,.28), rgba(59,130,246,.22))}
.card--projects .circle-card .circle-card-actions > button.btn[data-act="join"]{background-image:linear-gradient(135deg, rgba(34,197,94,.28), rgba(132,204,22,.20))}
.card--projects .circle-card .circle-card-actions > button.btn[data-act="leave-circle"]{background-image:linear-gradient(135deg, rgba(241,245,249,.92), rgba(226,232,240,.86))}
.card--projects .circle-card .circle-card-actions > button.btn[data-act="delete-circle"]{background-image:linear-gradient(135deg, rgba(251,113,133,.28), rgba(251,146,60,.20))}
.card--projects #circleList.circle-list--grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width: 520px){.card--projects #circleList.circle-list--grid{grid-template-columns:1fr}}
.card--projects #circleList.circle-list--grid .card{margin-bottom:0}
.card--projects #circleList.circle-list--grid .circle-empty{grid-column:1 / -1}
.card--projects .circle-card{color:#0f172a;border-color:rgba(148,163,184,.35)}
.card--projects .circle-card .btn{color:#0f172a}
.card--projects .circle-card .btn:hover{color:#0f172a}
.card--projects .circle-card .circle-card-meta{color:#334155;margin:6px 0 8px}
.card--projects .circle-card .circle-card-reason{color:#475569}
.card--projects .circle-card .circle-card-actions{display:flex;gap:8px;flex-wrap:wrap}
.card--projects .circle-card--tone-1{background-image:linear-gradient(135deg, rgba(224,242,254,.92), rgba(224,231,255,.88))}
.card--projects .circle-card--tone-2{background-image:linear-gradient(135deg, rgba(220,252,231,.92), rgba(209,250,229,.86))}
.card--projects .circle-card--tone-3{background-image:linear-gradient(135deg, rgba(243,232,255,.92), rgba(233,213,255,.86))}
.card--projects .circle-card--tone-4{background-image:linear-gradient(135deg, rgba(255,237,213,.92), rgba(254,215,170,.86))}
.card--projects .circle-card--tone-5{background-image:linear-gradient(135deg, rgba(255,228,230,.92), rgba(254,205,211,.86))}
.card--projects .circle-card--tone-6{background-image:linear-gradient(135deg, rgba(254,249,195,.92), rgba(254,243,199,.86))}
.card--projects .circle-card--tone-7{background-image:linear-gradient(135deg, rgba(204,251,241,.92), rgba(153,246,228,.84))}
.card--projects .circle-card--tone-8{background-image:linear-gradient(135deg, rgba(241,245,249,.92), rgba(226,232,240,.86))}
/* 综艺通告风格 */
#userStatusMenu {
  width: 90px !important;
  min-width: 0 !important;
  padding: 6px;
}
#userStatusMenu .mm-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#userStatusMenu .mm-item {
  width: 100%;
  padding: 4px 2px;
  justify-content: center !important;
}
#userStatusMenu .mm-item span:first-child {
  flex: none;
  text-align: center;
  width: 100%;
}
#userStatusMenu .mm-item span:last-child {
  display: none;
}
.show-banner{position:relative;background:linear-gradient(135deg,#ff7a00,#ff3d67 50%,#7a00ff);color:#fff;border-radius:14px;padding:18px 16px;box-shadow:0 6px 18px rgba(0,0,0,0.2)}
.show-banner h2{margin:0;font-size:24px;letter-spacing:1px}
.show-banner p{margin:6px 0 0;font-size:14px;opacity:.92}
.show-banner .sticker{position:absolute;right:12px;top:-10px;background:#fff;color:#111;padding:6px 10px;border-radius:8px;transform:rotate(6deg);font-weight:700;box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.notice-board{background:#fff;border:4px solid #111;border-radius:12px;padding:12px;box-shadow:0 10px 0 #111, 0 16px 24px rgba(0,0,0,0.15)}
.card--projects .notice-board{margin-bottom:16px}
.notice-board .board-headline{font-weight:900;font-size:20px;letter-spacing:.5px;color:#111}
.notice-board .board-subline{color:#555;margin-top:4px}
.notice-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.capsule{display:inline-flex;align-items:center;gap:8px;background:#111;color:#fff;border-radius:999px;padding:8px 14px;font-weight:700;box-shadow:0 4px 12px rgba(0,0,0,0.2);cursor:pointer}
.capsule.secondary{background-image:linear-gradient(135deg, rgba(255,209,220,.18), rgba(253,226,228,.18));color:#111}
.capsule.invite{background-image:linear-gradient(135deg, rgba(255,209,220,.18), rgba(253,226,228,.18));color:#111}
body:not(.light) .capsule.secondary{background-image:linear-gradient(135deg, rgba(255,209,220,.26), rgba(253,226,228,.26));color:#111}
body:not(.light) .capsule.invite{background-image:linear-gradient(135deg, rgba(255,209,220,.26), rgba(253,226,228,.26));color:#111}
.capsule .emoji{font-size:18px}
.poster-cta{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.poster-cta .btn{border-radius:999px}
/* 顶部流程 CTA 三个胶囊按钮按模块主题设置浅色渐变（暗色模式） */
.poster-cta .btn{border-radius:999px}
.poster-cta .btn:nth-child(1){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(20,184,166,.22), rgba(6,182,212,.22))}
.poster-cta .btn:nth-child(2){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(251,146,60,.22), rgba(245,158,11,.22))}
.poster-cta .btn:nth-child(3){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(14,165,233,.22), rgba(6,182,212,.22))}
body:not(.light) .poster-cta .btn:nth-child(1){border-color:transparent;color:#0f172a;background-image:linear-gradient(135deg, rgba(20,184,166,.26), rgba(6,182,212,.26))}
body:not(.light) .poster-cta .btn:nth-child(2){border-color:transparent;color:#0f172a;background-image:linear-gradient(135deg, rgba(251,146,60,.26), rgba(245,158,11,.26))}
body:not(.light) .poster-cta .btn:nth-child(3){border-color:transparent;color:#0f172a;background-image:linear-gradient(135deg, rgba(14,165,233,.26), rgba(6,182,212,.26))}
.card--notice{border:3px dashed #111}
.card--projects .create-area{margin-top:24px}
.card--projects #circleList{margin-top:12px}
/* 看板专用网格：随窗口自适应 1-3 列 */
#board .grid{grid-template-columns:repeat(3,1fr)}
.footer,.app-footer{padding:12px 16px;color:var(--muted);border-top:1px solid var(--border)}
.app-footer{position:fixed;left:0;right:0;bottom:0;background:var(--header);z-index:999}
.app-footer{display:flex;align-items:center;justify-content:space-between}
.app-footer .footer-link{display:inline;padding:0;border:none;border-radius:0;background:none;color:var(--fg);text-decoration:none;font-size:.8em;line-height:1.4}
body.light .app-footer .footer-link{background:none}
.app-footer .footer-link:hover{color:var(--accent)}
.app-footer .footer-left{display:flex;align-items:center;flex:1;min-width:0}
.app-footer .mgmt-quote{display:flex;align-items:center;gap:0;min-width:calc(26em + 2em);flex:0 1 auto;max-width:55vw}
.app-footer #mgmtPrefix{flex-shrink:0}
.app-footer #mgmtText{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.app-footer .footer-milestones{display:flex;align-items:center;gap:8px;margin-left:22px;white-space:nowrap;width:1280px;max-width:1280px;flex:0 1 1280px;overflow:hidden}
.app-footer .footer-ms-btn{padding:3px 8px;border-radius:9999px;border:1px solid var(--border);background:rgba(148,163,184,.12);color:var(--fg);cursor:pointer;font-size:12px;line-height:1.4;flex-shrink:0}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+1){background-image:linear-gradient(135deg, rgba(56,189,248,.22), rgba(99,102,241,.18))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+2){background-image:linear-gradient(135deg, rgba(249,115,22,.18), rgba(251,146,60,.16))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+3){background-image:linear-gradient(135deg, rgba(239,68,68,.16), rgba(252,165,165,.18))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+4){background-image:linear-gradient(135deg, rgba(34,211,238,.20), rgba(6,182,212,.16))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+5){background-image:linear-gradient(135deg, rgba(59,130,246,.18), rgba(147,197,253,.18))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+6){background-image:linear-gradient(135deg, rgba(132,204,22,.16), rgba(34,197,94,.16))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+7){background-image:linear-gradient(135deg, rgba(139,92,246,.16), rgba(167,139,250,.18))}
.app-footer .footer-milestones .footer-ms-btn:nth-child(8n+8){background-image:linear-gradient(135deg, rgba(236,72,153,.16), rgba(244,114,182,.18))}
.app-footer .footer-ms-btn:hover{border-color:var(--accent);color:var(--accent)}
/* 工单中心创建区控件宽度优化 */
.ticket-create .input{max-width:none;background:#ffffff;border-color:#e2e8f0;color:#0f172a}
.ticket-create textarea.input{min-width:0;max-width:none}
.ticket-create .input:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.18)}
.ticket-create select.input{-webkit-appearance:none;appearance:none;padding-right:34px;background-repeat:no-repeat;background-position:right 10px center;background-size:12px 12px}
.ticket-create select.input{background-image:linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.92)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
.ticket-create textarea.input{resize:vertical}
.ticket-create .tk-grad{background-image:linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.92))}
.ticket-create .tk-grad--blue{background-image:linear-gradient(135deg, rgba(56,189,248,.34), rgba(99,102,241,.26))}
.ticket-create .tk-grad--rose{background-image:linear-gradient(135deg, rgba(244,114,182,.34), rgba(251,113,133,.26))}
.ticket-create .tk-grad--violet{background-image:linear-gradient(135deg, rgba(167,139,250,.32), rgba(196,181,253,.26))}
.ticket-create .tk-grad--violet2{background-image:linear-gradient(135deg, rgba(129,140,248,.30), rgba(217,70,239,.22))}
.ticket-create .tk-grad--green{background-image:linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.22))}
.ticket-create .tk-grad--amber{background-image:linear-gradient(135deg, rgba(251,191,36,.34), rgba(251,146,60,.26))}
.ticket-create .tk-grad--cyan{background-image:linear-gradient(135deg, rgba(34,211,238,.30), rgba(6,182,212,.22))}
.ticket-create .tk-grad--sky{background-image:linear-gradient(135deg, rgba(59,130,246,.28), rgba(147,197,253,.26))}
.ticket-create .tk-grad--lavender{background-image:linear-gradient(135deg, rgba(196,181,253,.34), rgba(221,214,254,.28))}
.ticket-create .tk-grad--slate{background-image:linear-gradient(135deg, rgba(148,163,184,.30), rgba(226,232,240,.28))}
.ticket-create input[type="file"].input{padding:6px 8px}
.ticket-create input[type="file"].input::file-selector-button{border-radius:6px;border:1px solid rgba(226,232,240,.95);padding:6px 10px;margin-right:10px;background-image:linear-gradient(135deg, rgba(56,189,248,.26), rgba(34,197,94,.20));color:#0f172a;cursor:pointer}
.ticket-create input[type="file"].input::file-selector-button:hover{filter:brightness(0.98)}
.ticket-create .btn.tk-grad-btn{border-color:transparent;color:#0f172a;background-image:linear-gradient(135deg, rgba(56,189,248,.22), rgba(34,197,94,.18))}
.ticket-create .btn.tk-grad-btn:hover{border-color:transparent;color:#0f172a;filter:brightness(0.98)}
.ticket-create .btn.primary.tk-grad-btn{background:#ffffff;background-image:linear-gradient(135deg, rgba(56,189,248,.22), rgba(34,197,94,.18))}
.ticket-create .btn.primary.tk-grad-btn:hover{filter:brightness(0.98)}
.input{width:99%;height:28px;padding:2px 10px;border-radius:6px;border:1px solid var(--border);background:#0b1220;color:var(--fg);outline:none}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(56,189,248,.25)}
.btn{padding:8px 12px;border-radius:6px;border:1px solid var(--border);background:#0b1220;color:var(--fg);cursor:pointer;transition:transform .08s ease;text-decoration:none;position:relative}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn:active{transform:scale(0.98)}
.btn.primary{background:#0e1c2f;border-color:#13426b;color:#93c5fd}

/* 全局按钮禁用与提示规则 */
.btn:disabled{opacity:0.6;cursor:not-allowed}
.btn[title]:hover::after,
.btn[title]:focus::after{
  content: attr(title);
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  background: var(--header);
  color: var(--fg);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 6px 8px;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(2,8,23,.35);
  z-index: 9999;
  pointer-events: none;
}
.btn[title]:hover::before,
.btn[title]:focus::before{
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 0; height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid var(--header);
  z-index: 9998;
}
/* 允许使用 data-tip 自定义更丰富提示文案（与 title 并存） */
.btn[data-tip]:hover::after,
.btn[data-tip]:focus::after{
  content: attr(data-tip);
}
.btn[data-tip]:hover::before,
.btn[data-tip]:focus::before{
  border-top-color: var(--header);
}

#tab-export .export-actions .exp-btn{border-color:transparent;color:#0f172a;background:#ffffff}
#tab-export .export-actions .exp-btn:hover{border-color:transparent;color:#0f172a;filter:brightness(0.985)}
#tab-export .export-actions .exp-btn:nth-child(1){background-image:linear-gradient(135deg, rgba(20,184,166,.26), rgba(6,182,212,.22))}
#tab-export .export-actions .exp-btn:nth-child(2){background-image:linear-gradient(135deg, rgba(251,191,36,.26), rgba(251,146,60,.22))}
#tab-export .export-actions .exp-btn:nth-child(3){background-image:linear-gradient(135deg, rgba(56,189,248,.26), rgba(99,102,241,.22))}
#tab-export .export-actions .exp-btn:nth-child(4){background-image:linear-gradient(135deg, rgba(244,114,182,.26), rgba(251,113,133,.22))}
#tab-export .export-actions .exp-btn:nth-child(5){background-image:linear-gradient(135deg, rgba(34,197,94,.24), rgba(16,185,129,.20))}
#tab-export .export-actions .exp-btn:nth-child(6){background-image:linear-gradient(135deg, rgba(167,139,250,.26), rgba(196,181,253,.22))}
#tab-export .export-actions .exp-btn:nth-child(7){background-image:linear-gradient(135deg, rgba(132,204,22,.24), rgba(34,197,94,.20))}
#tab-export .export-actions .exp-btn:nth-child(8){background-image:linear-gradient(135deg, rgba(148,163,184,.26), rgba(226,232,240,.22))}
#tab-export .export-actions .exp-btn:nth-child(9){background-image:linear-gradient(135deg, rgba(217,70,239,.24), rgba(244,114,182,.20))}
#tab-export .export-actions .exp-btn:nth-child(10){background-image:linear-gradient(135deg, rgba(34,211,238,.24), rgba(59,130,246,.20))}
#tab-export .export-actions .exp-btn:nth-child(11){background-image:linear-gradient(135deg, rgba(253,224,71,.26), rgba(132,204,22,.22))}
#tab-export .export-actions .exp-btn:nth-child(12){background-image:linear-gradient(135deg, rgba(251,146,60,.26), rgba(251,113,133,.22))}
#tab-export .export-actions .exp-btn:nth-child(13){background-image:linear-gradient(135deg, rgba(59,130,246,.26), rgba(20,184,166,.22))}
#tab-export .export-actions .exp-btn:nth-child(14){background-image:linear-gradient(135deg, rgba(139,92,246,.26), rgba(99,102,241,.22))}
#tab-export .export-actions .exp-btn:nth-child(15){background-image:linear-gradient(135deg, rgba(16,185,129,.24), rgba(6,182,212,.20))}

/* 亮色主题变量覆盖 */
body.light{--bg:#f8fafc;--fg:#0f172a;--muted:#334155;--accent:#2563eb;--card:#ffffff;--border:#cbd5e1;--header:#ffffff;--link:#60a5fa;--link-hover:#2563eb}
body.light .app-header{background:var(--header);border-bottom-color:var(--border)}
body.light .input{background:#ffffff;border-color:var(--border);color:var(--fg)}
body.light .btn{background:#ffffff;border-color:var(--border);color:var(--fg)}
body.light .btn.primary{background:#e2e8f0;border-color:#93c5fd;color:#0f172a}

body.light .ticket-create input.tk-grad--blue, body.light .ticket-create textarea.tk-grad--blue{background-image:linear-gradient(135deg, rgba(56,189,248,.34), rgba(99,102,241,.26))}
body.light .ticket-create select.tk-grad--blue{background-image:linear-gradient(135deg, rgba(56,189,248,.34), rgba(99,102,241,.26)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--rose, body.light .ticket-create textarea.tk-grad--rose{background-image:linear-gradient(135deg, rgba(244,114,182,.34), rgba(251,113,133,.26))}
body.light .ticket-create select.tk-grad--rose{background-image:linear-gradient(135deg, rgba(244,114,182,.34), rgba(251,113,133,.26)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--violet, body.light .ticket-create textarea.tk-grad--violet{background-image:linear-gradient(135deg, rgba(167,139,250,.32), rgba(196,181,253,.26))}
body.light .ticket-create select.tk-grad--violet{background-image:linear-gradient(135deg, rgba(167,139,250,.32), rgba(196,181,253,.26)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--violet2, body.light .ticket-create textarea.tk-grad--violet2{background-image:linear-gradient(135deg, rgba(129,140,248,.30), rgba(217,70,239,.22))}
body.light .ticket-create select.tk-grad--violet2{background-image:linear-gradient(135deg, rgba(129,140,248,.30), rgba(217,70,239,.22)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--green, body.light .ticket-create textarea.tk-grad--green{background-image:linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.22))}
body.light .ticket-create select.tk-grad--green{background-image:linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.22)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--amber, body.light .ticket-create textarea.tk-grad--amber{background-image:linear-gradient(135deg, rgba(251,191,36,.34), rgba(251,146,60,.26))}
body.light .ticket-create select.tk-grad--amber{background-image:linear-gradient(135deg, rgba(251,191,36,.34), rgba(251,146,60,.26)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--cyan, body.light .ticket-create textarea.tk-grad--cyan{background-image:linear-gradient(135deg, rgba(34,211,238,.30), rgba(6,182,212,.22))}
body.light .ticket-create select.tk-grad--cyan{background-image:linear-gradient(135deg, rgba(34,211,238,.30), rgba(6,182,212,.22)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--sky, body.light .ticket-create textarea.tk-grad--sky{background-image:linear-gradient(135deg, rgba(59,130,246,.28), rgba(147,197,253,.26))}
body.light .ticket-create select.tk-grad--sky{background-image:linear-gradient(135deg, rgba(59,130,246,.28), rgba(147,197,253,.26)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--lavender, body.light .ticket-create textarea.tk-grad--lavender{background-image:linear-gradient(135deg, rgba(196,181,253,.34), rgba(221,214,254,.28))}
body.light .ticket-create select.tk-grad--lavender{background-image:linear-gradient(135deg, rgba(196,181,253,.34), rgba(221,214,254,.28)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}
body.light .ticket-create input.tk-grad--slate, body.light .ticket-create textarea.tk-grad--slate{background-image:linear-gradient(135deg, rgba(148,163,184,.30), rgba(226,232,240,.28))}
body.light .ticket-create select.tk-grad--slate{background-image:linear-gradient(135deg, rgba(148,163,184,.30), rgba(226,232,240,.28)), radial-gradient(circle at 100% 50%, rgba(15,23,42,.38) 0 2px, transparent 3px)}

/* 亮色模式下：圈子打卡胶囊按钮与顶部流程 CTA 渐变加深一点 */
body.light .capsule.secondary{background-image:linear-gradient(135deg, rgba(255,209,220,.28), rgba(253,226,228,.28));color:#111}
body.light .capsule.invite{background-image:linear-gradient(135deg, rgba(255,209,220,.28), rgba(253,226,228,.28));color:#111}
body.light .poster-cta .btn:nth-child(1){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(20,184,166,.32), rgba(6,182,212,.32))}
body.light .poster-cta .btn:nth-child(2){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(251,146,60,.32), rgba(245,158,11,.32))}
body.light .poster-cta .btn:nth-child(3){border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(14,165,233,.32), rgba(6,182,212,.32))}

/* 主题切换浮动按钮 */
.theme-switch{
  position:fixed;right:3px;bottom:120px;z-index:2147483647;
  background:transparent;border:none;border-radius:0;box-shadow:none;
  padding:0;display:flex;gap:8px;align-items:center;flex-direction:column
}
.theme-switch .label{color:var(--muted);font-size:12px}
.theme-switch .btn{min-width:0;width:36px;height:36px;border-radius:50%;border:none;background:transparent !important;display:inline-flex;align-items:center;justify-content:center;font-weight:500;font-size:18px;padding:0;transition:background-color .15s ease, transform .08s ease;appearance:none;-webkit-appearance:none}
.theme-switch .btn:hover{background-color:rgba(148,163,184,.15)}
.theme-switch .btn:active{transform:scale(0.96)}
.theme-switch .btn:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(56,189,248,.5)}
.theme-switch .btn-wrap{display:flex;align-items:center;overflow:hidden;width:65px;flex-direction:row-reverse;padding-left:0;box-sizing:border-box;transition:width .2s ease}
.theme-switch .btn-wrap:hover{width:100px}
.theme-switch .btn-wrap .label{opacity:0;white-space:nowrap;color:var(--fg);font-size:12px;transition:opacity .15s ease, margin-right .15s ease;margin-right:0}
.theme-switch .btn-wrap:hover .label{opacity:1;margin-right:8px}
 .theme-switch #btnTop{font-size:0;position:relative}
 .theme-switch #btnTop::before{content:"";position:absolute;left:50%;top:7px;transform:translateX(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:12px solid var(--accent);filter:drop-shadow(0 0 3px rgba(39, 40, 41, 0.6))}
 .theme-switch #btnTop::after{content:"";position:absolute;left:50%;top:18px;transform:translateX(-50%);width:5px;height:13px;background:var(--accent);border-radius:2px}
 body.light .theme-switch #btnTop::before{border-bottom-color:#2563eb;filter:none}
 body.light .theme-switch #btnTop::after{background:#2563eb}
 .theme-switch #btnTop:hover{background-color:transparent;transform:scale(1.08)}
/* 顶部进度条 */
#topProgress{position:fixed;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg, transparent, var(--accent), transparent);opacity:0;pointer-events:none;background-size:200px 100%}
#topProgress.show{opacity:1;animation:progressIndeterminate 1.2s linear infinite}
@keyframes progressIndeterminate{0%{background-position:-200px 0}100%{background-position:200px 0}}

/* 导航激活态 - Updated */
/* .nav a.active is handled in previous block */

/* Removed capsule navigation gradients to support tab bar style */


/* Light mode gradients removed */

/* 表格增强 */
.card table{width:100%;border-collapse:collapse}
.card canvas{display:block;width:100%;height:180px;max-width:100%}
.card table thead th{color:var(--muted);text-align:left;border-bottom:1px solid var(--border);padding:8px}
.card table tbody td{padding:8px;border-bottom:1px solid var(--border)}
.card table tbody tr:hover{background-color:rgba(148,163,184,.1)}
.card table tbody tr:nth-child(odd){background-color:rgba(31,41,55,.25)}
body.light .card table tbody tr:nth-child(odd){background-color:#f1f5f9}
.card table tbody td:last-child .btn{
  border-color:transparent;
  color:var(--fg);
  background-image:linear-gradient(135deg, rgba(148,163,184,.15), rgba(148,163,184,.25));
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 8px !important;
  font-size:12px !important;
  line-height:1.2 !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  white-space:nowrap;
}
body.light .card table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(148,163,184,.25), rgba(148,163,184,.35))}
.card table tbody td:last-child .btn:hover{transform:translateY(-1px)}

.card--customers table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(20,184,166,.20), rgba(6,182,212,.20))}
body.light .card--customers table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(20,184,166,.30), rgba(6,182,212,.30))}

.card--leads table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(168,85,247,.20), rgba(217,70,239,.20))}
body.light .card--leads table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(168,85,247,.30), rgba(217,70,239,.30))}
/* 线索模块：新建线索按钮加宽 */
.card--leads #leadCreate{width:80%}

.card--quotes table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(251,146,60,.20), rgba(245,158,11,.20))}
body.light .card--quotes table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(251,146,60,.30), rgba(245,158,11,.30))}

.card--contracts table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.20), rgba(234,179,8,.20))}
body.light .card--contracts table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.30), rgba(234,179,8,.30))}

.card--orders table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(34,197,94,.20), rgba(16,185,129,.20))}
body.light .card--orders table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(34,197,94,.30), rgba(16,185,129,.30))}

.card--invoices table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(99,102,241,.20), rgba(59,130,246,.20))}
body.light .card--invoices table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(99,102,241,.30), rgba(59,130,246,.30))}

.card--projects table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(14,165,233,.20), rgba(6,182,212,.20))}
body.light .card--projects table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(14,165,233,.30), rgba(6,182,212,.30))}
.card--projects .task-card .btn{border-color:transparent;color:var(--fg);background-image:linear-gradient(135deg, rgba(14,165,233,.20), rgba(6,182,212,.20))}
body.light .card--projects .task-card .btn{background-image:linear-gradient(135deg, rgba(14,165,233,.30), rgba(6,182,212,.30))}
/* 看板任务卡片布局与缩放 */
.card--projects .task-card{display:flex;flex-direction:column;gap:6px;resize:vertical;overflow:auto;min-height:90px}
.card--projects .task-card .task-head{display:flex;flex-direction:column;gap:4px}
.card--projects .task-card .task-meta{color:var(--muted);font-size:12px}
.card--projects .drop-col .task-card .task-meta .prio-high{color:#ff0000 !important;font-weight:700}
.card--projects .task-card .task-actions{margin-top:auto;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.card--projects .task-card .task-actions .row{display:flex;gap:6px;flex-wrap:wrap}
.card--projects .task-card .task-actions .btn{padding:2px 6px;font-size:12px;line-height:1;min-width:0;height:auto}
.card--projects .task-card .task-owner{align-self:flex-start;margin-right:4ch}
/* 看板列背景色（待处理=浅红；进行中=浅黄；已完成=浅绿） */
.drop-col{padding:8px;display:flex;flex-direction:column;gap:6px;border:1px solid var(--border);border-radius:8px}
.drop-col{box-shadow:0 2px 8px rgba(0,0,0,.08)}
.drop-col[data-status="todo"]{background-image:none;background-color:#fee2e2}
.drop-col[data-status="doing"]{background-image:none;background-color:#fef3c7}
.drop-col[data-status="done"]{background-image:none;background-color:#dcfce7}
body:not(.light) .drop-col[data-status="todo"],
body:not(.light) .drop-col[data-status="doing"],
body:not(.light) .drop-col[data-status="done"]{color:#0f172a}
body:not(.light) .drop-col .task-card .task-meta,
body:not(.light) .drop-col .task-card .task-owner,
body:not(.light) .drop-col .task-card .task-desc{color:#1f2937}
.drop-col .task-card .task-desc,
.drop-col .task-card .task-owner{color:#000}
body:not(.light) .drop-col .task-card .btn{color:#0f172a;border-color:#0f172a}
#board .board-head{background:#cfeafc;border:1px solid #a3d1f7;border-radius:10px;padding:10px;margin-bottom:10px}
#board .board-head h3{margin:0}
#board .board-head .board-actions{display:flex;gap:8px;margin-top:8px}
/* 高优先级通用标记 */
.prio-high{color:#ff0000;font-weight:700}

/* 超级圈子帖子列表中的按钮缩小为文字大小 */
.card--customers #postList .btn{padding:2px 6px;font-size:12px;line-height:1;min-width:0;height:auto;border-radius:4px}
.ticket-attachments img{width:40px;height:40px;object-fit:cover;border-radius:4px;border:1px solid var(--border)}
.ticket-attachments img{cursor:zoom-in}
.img-preview-mask{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:2147483645;display:flex;align-items:center;justify-content:center}
.img-preview{max-width:90vw;max-height:90vh;border-radius:8px;border:1px solid var(--border);box-shadow:0 10px 30px rgba(0,0,0,.4);background:#000}
/* 待上传图片预览缩略图与删除按钮 */
.thumb{position:relative;display:inline-block;margin:4px}
.thumb img{width:72px;height:72px;object-fit:cover;border-radius:6px;border:1px solid var(--border)}
.thumb .del{position:absolute;top:-6px;right:-6px;background:#ef4444;color:#fff;border:none;border-radius:999px;width:20px;height:20px;line-height:20px;text-align:center;cursor:pointer}
.card--customers #postList .btn,
.card--customers #postSubmit,
.card--customers #loadMore,
.card--customers [data-act="submit-comment"],
.card--customers [data-act="del-comment"]{display:inline-flex;align-items:center;gap:6px}

.card--automation table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(236,72,153,.20), rgba(244,63,94,.20))}
body.light .card--automation table tbody td:last-child .btn{background-image:linear-gradient(135deg, rgba(236,72,153,.30), rgba(244,63,94,.30))}

.card table tbody td:last-child > .btn:nth-child(1){background-image:linear-gradient(135deg, rgba(56,189,248,.22), rgba(99,102,241,.18))}
.card table tbody td:last-child > .btn:nth-child(2){background-image:linear-gradient(135deg, rgba(168,85,247,.20), rgba(236,72,153,.16))}
.card table tbody td:last-child > .btn:nth-child(3){background-image:linear-gradient(135deg, rgba(34,197,94,.18), rgba(16,185,129,.16))}
.card table tbody td:last-child > .btn:nth-child(4){background-image:linear-gradient(135deg, rgba(251,191,36,.20), rgba(251,146,60,.16))}
.card table tbody td:last-child > .btn:nth-child(5){background-image:linear-gradient(135deg, rgba(236,72,153,.18), rgba(244,63,94,.16))}
.card table tbody td:last-child > .btn:nth-child(6){background-image:linear-gradient(135deg, rgba(148,163,184,.20), rgba(100,116,139,.16))}
body.light .card table tbody td:last-child > .btn:nth-child(1){background-image:linear-gradient(135deg, rgba(56,189,248,.32), rgba(99,102,241,.26))}
body.light .card table tbody td:last-child > .btn:nth-child(2){background-image:linear-gradient(135deg, rgba(168,85,247,.30), rgba(236,72,153,.24))}
body.light .card table tbody td:last-child > .btn:nth-child(3){background-image:linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.24))}
body.light .card table tbody td:last-child > .btn:nth-child(4){background-image:linear-gradient(135deg, rgba(251,191,36,.30), rgba(251,146,60,.24))}
body.light .card table tbody td:last-child > .btn:nth-child(5){background-image:linear-gradient(135deg, rgba(236,72,153,.28), rgba(244,63,94,.24))}
body.light .card table tbody td:last-child > .btn:nth-child(6){background-image:linear-gradient(135deg, rgba(148,163,184,.30), rgba(100,116,139,.24))}

/* 模块通用操作按钮底色差异化 */
.card--dashboard .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(56,189,248,.18), rgba(34,197,94,.18))}
body.light .card--dashboard .btn{background:linear-gradient(135deg, rgba(56,189,248,.28), rgba(34,197,94,.28))}
.btn.btn-scene-pain{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(236,72,153,.22), rgba(244,63,94,.22))}
body.light .btn.btn-scene-pain{background:linear-gradient(135deg, rgba(236,72,153,.32), rgba(244,63,94,.32))}
.res-edit-modal{border-radius:14px}
.res-edit-modal .btn,.res-edit-modal .input{border-color:rgba(226,232,240,.95);color:#0f172a}
.res-edit-modal .btn{background-image:linear-gradient(135deg, rgba(226,232,240,.85), rgba(248,250,252,.85))}
.res-edit-modal .btn:hover{border-color:rgba(226,232,240,.95);color:#0f172a;filter:brightness(.98)}
.res-edit-modal .input{background-image:linear-gradient(135deg, rgba(248,250,252,.90), rgba(241,245,249,.90))}
.res-edit-modal #erName{background-image:linear-gradient(135deg, rgba(224,242,254,.92), rgba(191,219,254,.92))}
.res-edit-modal #erCat{background-image:linear-gradient(135deg, rgba(237,233,254,.92), rgba(221,214,254,.92))}
.res-edit-modal #erRole{background-image:linear-gradient(135deg, rgba(219,234,254,.92), rgba(199,210,254,.92))}
.res-edit-modal #erScene{background-image:linear-gradient(135deg, rgba(254,243,199,.92), rgba(253,230,138,.92))}
.res-edit-modal #erTags{background-image:linear-gradient(135deg, rgba(255,228,230,.92), rgba(254,205,211,.92))}
.res-edit-modal #erCtrl{background-image:linear-gradient(135deg, rgba(220,252,231,.92), rgba(187,247,208,.92))}
.res-edit-modal #erResidual{background-image:linear-gradient(135deg, rgba(204,251,241,.92), rgba(153,246,228,.92))}
.res-edit-modal #erCoordType{background-image:linear-gradient(135deg, rgba(207,250,254,.92), rgba(165,243,252,.92))}
.res-edit-modal #erCoordName{background-image:linear-gradient(135deg, rgba(240,253,250,.92), rgba(204,251,241,.92))}
.res-edit-modal #erCoordContact{background-image:linear-gradient(135deg, rgba(255,237,213,.92), rgba(254,215,170,.92))}
.res-edit-modal #erCtrlType{background-image:linear-gradient(135deg, rgba(254,226,226,.92), rgba(254,202,202,.92))}
.res-edit-modal #erCtrlName{background-image:linear-gradient(135deg, rgba(219,234,254,.92), rgba(191,219,254,.92))}
.res-edit-modal #erCtrlContact{background-image:linear-gradient(135deg, rgba(224,231,255,.92), rgba(199,210,254,.92))}
.res-edit-modal #erDesc{background-image:linear-gradient(135deg, rgba(241,245,249,.92), rgba(226,232,240,.92))}
.res-edit-modal #erPrev{background-image:linear-gradient(135deg, rgba(226,232,240,.92), rgba(241,245,249,.92))}
.res-edit-modal #erCoverBox{background-image:linear-gradient(135deg, rgba(224,242,254,.92), rgba(186,230,253,.92));border-color:rgba(226,232,240,.95)}
.res-edit-modal #erUploadBtn{background-image:linear-gradient(135deg, rgba(237,233,254,.92), rgba(253,242,248,.92))}
.res-edit-modal #erCloseX{background-image:linear-gradient(135deg, rgba(254,226,226,.92), rgba(255,228,230,.92))}
.res-edit-modal #erClose{background-image:linear-gradient(135deg, rgba(226,232,240,.92), rgba(241,245,249,.92))}
.res-edit-modal #erSave{background-image:linear-gradient(135deg, rgba(187,247,208,.92), rgba(186,230,253,.92))}
.card--metrics .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(59,130,246,.18), rgba(99,102,241,.18))}
body.light .card--metrics .btn{background:linear-gradient(135deg, rgba(59,130,246,.28), rgba(99,102,241,.28))}
.card--customers .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(20,184,166,.22), rgba(6,182,212,.22))}
body.light .card--customers .btn{background:linear-gradient(135deg, rgba(20,184,166,.32), rgba(6,182,212,.32))}
/* 客户与线索页：新建线索按钮浅紫色（参考图示） */
.card--customers .lead-new{background:#d8b4fe !important;color:#0f172a;border-color:#a78bfa}
body.light .card--customers .lead-new{background:#e9d5ff !important;color:#0f172a;border-color:#a78bfa}
/* 客户页嵌入的线索简表：新建线索按钮也使用浅紫色 */
.card--leads #leadCreate{background:#d8b4fe !important;color:#0f172a;border-color:#a78bfa}
body.light .card--leads #leadCreate{background:#e9d5ff !important;color:#0f172a;border-color:#a78bfa}
.card--leads .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(168,85,247,.22), rgba(217,70,239,.22))}
body.light .card--leads .btn{background:linear-gradient(135deg, rgba(168,85,247,.32), rgba(217,70,239,.32))}
.card--leads #leadCreate2{width:80%}
.card--leads #leadFilter{width:80%}
.card--quotes .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(251,146,60,.22), rgba(245,158,11,.22))}
body.light .card--quotes .btn{background:linear-gradient(135deg, rgba(251,146,60,.32), rgba(245,158,11,.32))}
.card--contracts .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(245,158,11,.22), rgba(234,179,8,.22))}
body.light .card--contracts .btn{background:linear-gradient(135deg, rgba(245,158,11,.32), rgba(234,179,8,.32))}
.card--orders .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(34,197,94,.22), rgba(16,185,129,.22))}
body.light .card--orders .btn{background:linear-gradient(135deg, rgba(34,197,94,.32), rgba(16,185,129,.32))}
.card--invoices .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(99,102,241,.22), rgba(59,130,246,.22))}
body.light .card--invoices .btn{background:linear-gradient(135deg, rgba(99,102,241,.32), rgba(59,130,246,.32))}
.card--projects .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(14,165,233,.22), rgba(6,182,212,.22))}
body.light .card--projects .btn{background:linear-gradient(135deg, rgba(14,165,233,.32), rgba(6,182,212,.32))}
.card--projects #tCreate{width:80%;font-weight:700}
.card--projects #circleCreate{width:220px;font-weight:700}
.card--automation .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(236,72,153,.22), rgba(244,63,94,.22))}
body.light .card--automation .btn{background:linear-gradient(135deg, rgba(236,72,153,.32), rgba(244,63,94,.32))}

.card--finance{background:#f3e8ff !important;color:#0f172a}
.card--settings .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(100,116,139,.22), rgba(107,114,128,.22))}
body.light .card--settings .btn{background:linear-gradient(135deg, rgba(100,116,139,.32), rgba(107,114,128,.32))}
.card--settings #pwdBtn{width:80%}
.card--finance .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(16,185,129,.22), rgba(20,184,166,.22))}
body.light .card--finance .btn{background:linear-gradient(135deg, rgba(16,185,129,.32), rgba(20,184,166,.32))}
.card--uat .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(239,68,68,.22), rgba(234,88,12,.22))}
body.light .card--uat .btn{background:linear-gradient(135deg, rgba(239,68,68,.32), rgba(234,88,12,.32))}
.card--login .btn{border-color:transparent;color:var(--fg);background:linear-gradient(135deg, rgba(99,102,241,.22), rgba(56,189,248,.22))}
body.light .card--login .btn{background:linear-gradient(135deg, rgba(99,102,241,.32), rgba(56,189,248,.32))}
.tab-nav .btn{border-color:transparent;color:var(--fg)}
.tab-nav .btn[data-tab="account"], #tab-account .btn{background-image:linear-gradient(135deg, rgba(59,130,246,.22), rgba(99,102,241,.22))}
body.light .tab-nav .btn[data-tab="account"], body.light #tab-account .btn{background-image:linear-gradient(135deg, rgba(59,130,246,.32), rgba(99,102,241,.32))}
.tab-nav .btn.primary[data-tab="account"]{background:none}

.tab-nav .btn[data-tab="profile"], #tab-profile .btn{background-image:linear-gradient(135deg, rgba(20,184,166,.22), rgba(6,182,212,.22))}
body.light .tab-nav .btn[data-tab="profile"], body.light #tab-profile .btn{background-image:linear-gradient(135deg, rgba(20,184,166,.32), rgba(6,182,212,.32))}
.tab-nav .btn.primary[data-tab="profile"]{background:none}

.tab-nav .btn[data-tab="update"], #tab-update .btn{background-image:linear-gradient(135deg, rgba(251,146,60,.22), rgba(245,158,11,.22))}
body.light .tab-nav .btn[data-tab="update"], body.light #tab-update .btn{background-image:linear-gradient(135deg, rgba(251,146,60,.32), rgba(245,158,11,.32))}
.tab-nav .btn.primary[data-tab="update"]{background:none}

.tab-nav .btn[data-tab="basic"], #tab-basic .btn{background-image:linear-gradient(135deg, rgba(100,116,139,.22), rgba(107,114,128,.22))}
body.light .tab-nav .btn[data-tab="basic"], body.light #tab-basic .btn{background-image:linear-gradient(135deg, rgba(100,116,139,.32), rgba(107,114,128,.32))}
.tab-nav .btn.primary[data-tab="basic"]{background:none}

.tab-nav .btn[data-tab="db"], #tab-db .btn{background-image:linear-gradient(135deg, rgba(99,102,241,.22), rgba(59,130,246,.22))}
body.light .tab-nav .btn[data-tab="db"], body.light #tab-db .btn{background-image:linear-gradient(135deg, rgba(99,102,241,.32), rgba(59,130,246,.32))}
.tab-nav .btn.primary[data-tab="db"]{background:none}

.tab-nav .btn[data-tab="indexes"], #tab-indexes .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.22), rgba(234,179,8,.22))}
body.light .tab-nav .btn[data-tab="indexes"], body.light #tab-indexes .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.32), rgba(234,179,8,.32))}
.tab-nav .btn.primary[data-tab="indexes"]{background:none}

.tab-nav .btn[data-tab="fixtures"], #tab-fixtures .btn{background-image:linear-gradient(135deg, rgba(34,197,94,.22), rgba(16,185,129,.22))}
body.light .tab-nav .btn[data-tab="fixtures"], body.light #tab-fixtures .btn{background-image:linear-gradient(135deg, rgba(34,197,94,.32), rgba(16,185,129,.32))}
.tab-nav .btn.primary[data-tab="fixtures"]{background:none}

.tab-nav .btn[data-tab="export"], #tab-export .btn{background-image:linear-gradient(135deg, rgba(14,165,233,.22), rgba(6,182,212,.22))}
body.light .tab-nav .btn[data-tab="export"], body.light #tab-export .btn{background-image:linear-gradient(135deg, rgba(14,165,233,.32), rgba(6,182,212,.32))}
.tab-nav .btn.primary[data-tab="export"]{background:none}

.tab-nav .btn[data-tab="templates"], #tab-templates .btn{background-image:linear-gradient(135deg, rgba(168,85,247,.22), rgba(217,70,239,.22))}
body.light .tab-nav .btn[data-tab="templates"], body.light #tab-templates .btn{background-image:linear-gradient(135deg, rgba(168,85,247,.32), rgba(217,70,239,.32))}
.tab-nav .btn.primary[data-tab="templates"]{background:none}

.tab-nav .btn[data-tab="projtypes"], #tab-projtypes .btn{background-image:linear-gradient(135deg, rgba(236,72,153,.22), rgba(244,63,94,.22))}
body.light .tab-nav .btn[data-tab="projtypes"], body.light #tab-projtypes .btn{background-image:linear-gradient(135deg, rgba(236,72,153,.32), rgba(244,63,94,.32))}
.tab-nav .btn.primary[data-tab="projtypes"]{background:none}

.tab-nav .btn[data-tab="payconf"], #tab-payconf .btn{background-image:linear-gradient(135deg, rgba(244,63,94,.22), rgba(236,72,153,.22))}
body.light .tab-nav .btn[data-tab="payconf"], body.light #tab-payconf .btn{background-image:linear-gradient(135deg, rgba(244,63,94,.32), rgba(236,72,153,.32))}
.tab-nav .btn.primary[data-tab="payconf"]{background:none}

.tab-nav .btn[data-tab="themes"], #tab-themes .btn{background-image:linear-gradient(135deg, rgba(56,189,248,.22), rgba(99,102,241,.22))}
body.light .tab-nav .btn[data-tab="themes"], body.light #tab-themes .btn{background-image:linear-gradient(135deg, rgba(56,189,248,.32), rgba(99,102,241,.32))}
.tab-nav .btn.primary[data-tab="themes"]{background:none}

.tab-nav .btn[data-tab="vip"], #tab-vip .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.22), rgba(250,204,21,.22))}
body.light .tab-nav .btn[data-tab="vip"], body.light #tab-vip .btn{background-image:linear-gradient(135deg, rgba(245,158,11,.32), rgba(250,204,21,.32))}
.tab-nav .btn.primary[data-tab="vip"]{background:none}
/* 长文本与预格式化内容换行与滚动 */
.card pre{white-space:pre-wrap;word-wrap:break-word;word-break:break-word;max-width:100%;overflow:auto}
.card a{word-break:break-all}
:where(a[href]){color:var(--link)}
:where(a[href]):visited{color:var(--link)}
:where(a[href]):hover{color:var(--link-hover)}

/* 骨架屏 */
.skeleton{background:linear-gradient(90deg, rgba(148,163,184,.2) 25%, rgba(148,163,184,.35) 50%, rgba(148,163,184,.2) 75%);background-size:200% 100%;animation:skeletonAnim 1.2s ease-in-out infinite}
.skeleton-line{height:12px;border-radius:6px;margin:6px 0}
@keyframes skeletonAnim{0%{background-position:200% 0}100%{background-position:-200% 0}}
.card--dashboard{background-image:linear-gradient(135deg, rgba(56,189,248,.12), rgba(34,197,94,.12))}
.card--metrics{background-image:linear-gradient(135deg, rgba(59,130,246,.12), rgba(99,102,241,.12))}
.card--customers{background-image:linear-gradient(135deg, rgba(20,184,166,.12), rgba(6,182,212,.12))}
.card--leads{background-image:linear-gradient(135deg, rgba(168,85,247,.12), rgba(217,70,239,.12))}
.card--followups{background-image:linear-gradient(135deg, rgba(139,92,246,.12), rgba(79,70,229,.12))}
.card--quotes{background-image:linear-gradient(135deg, rgba(251,146,60,.12), rgba(245,158,11,.12))}
.card--contracts{background-image:linear-gradient(135deg, rgba(245,158,11,.12), rgba(234,179,8,.12))}
.card--orders{background-image:linear-gradient(135deg, rgba(34,197,94,.12), rgba(16,185,129,.12))}
.card--invoices{background-image:linear-gradient(135deg, rgba(99,102,241,.12), rgba(59,130,246,.12))}
.card--projects{background-image:linear-gradient(135deg, rgba(14,165,233,.12), rgba(6,182,212,.12))}

/* VIP 身份标识与升级按钮 */
.vip-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:linear-gradient(135deg,#f59e0b,#facc15);color:#111;font-weight:800;border:1px solid #fbbf24;box-shadow:0 4px 10px rgba(0,0,0,.15)}
.vip-upgrade{display:inline-flex;align-items:center;gap:6px;border-radius:999px;border:1px solid var(--border);background:linear-gradient(135deg, rgba(251,146,60,.22), rgba(245,158,11,.22));color:var(--fg)}
body.light .vip-upgrade{background:linear-gradient(135deg, rgba(251,146,60,.32), rgba(245,158,11,.32))}

/* 落地页样式 */
.landing-hero{background:linear-gradient(135deg, rgba(251,191,36,.22), rgba(56,189,248,.18));padding:24px;border-radius:12px}
.landing-hero .hero-content{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.landing-hero h2{margin:0;font-size:28px;letter-spacing:1px}
.landing-hero p{margin:0;color:var(--muted)}
.landing-hero .hero-cta{display:flex;gap:8px;margin-top:8px}
.landing-page{background-image:linear-gradient(135deg, rgba(255,243,176,.28), rgba(255,208,133,.20));border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:12px}
body.light .landing-page{background-image:linear-gradient(135deg, rgba(255,243,176,.34), rgba(255,208,133,.26))}
.card--landing{background-image:linear-gradient(135deg, rgba(255,236,179,.26), rgba(255,214,165,.18))}
body.light .card--landing{background-image:linear-gradient(135deg, rgba(255,236,179,.32), rgba(255,214,165,.24))}
.landing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.landing-grid .lg-item{background:rgba(148,163,184,.08);border:1px solid var(--border);border-radius:8px;padding:12px}
.landing-grid .lg-title{font-weight:700;margin-bottom:4px}
.landing-grid .lg-desc{color:var(--muted)}
.flow-line{padding:8px 12px;border-radius:8px;background:rgba(148,163,184,.08);border:1px solid var(--border);font-weight:600}
.pricing-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.pricing-card{border:1px solid var(--border);border-radius:12px;padding:12px;background:rgba(148,163,184,.08)}
.pricing-card .pc-head{font-weight:800;font-size:18px}
.pricing-card .pc-price{font-size:22px;margin:6px 0}
.pricing-card .pc-bonus{color:var(--muted)}
.pricing-card .pc-actions{margin-top:8px}
.pricing-card .tag{display:inline-block;background:#f59e0b;color:#111;border-radius:999px;padding:4px 10px;font-weight:800;font-size:12px;margin-bottom:6px}
.pricing-card .tag.reco{background:#22c55e;color:#fff}
.pricing-card .price-area{display:flex;align-items:baseline;gap:8px}
.pricing-card .price-main{font-size:22px;font-weight:900;color:#f59e0b}
.pricing-card .price-old{font-size:14px;color:var(--muted);text-decoration:line-through}
.pricing-card .list{margin-top:6px;color:var(--fg);font-size:14px}
.pricing-card.selected{border-color:var(--accent);box-shadow:0 0 0 3px rgba(56,189,248,.25)}
.pricing-card:hover{transform:translateY(-2px);transition:transform .15s ease}
.vip-page{background-image:linear-gradient(135deg, rgba(251,191,36,.12), rgba(56,189,248,.12));border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:12px}
body.light .vip-page{background-image:linear-gradient(135deg, rgba(251,191,36,.18), rgba(56,189,248,.18))}
.card--vip{background-image:linear-gradient(135deg, rgba(251,191,36,.12), rgba(250,204,21,.12))}
body.light .card--vip{background-image:linear-gradient(135deg, rgba(251,191,36,.18), rgba(250,204,21,.18))}
.testi{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.testi-item{background:rgba(148,163,184,.08);border:1px solid var(--border);border-radius:8px;padding:10px}
.final-cta{display:flex;gap:8px;justify-content:flex-end}
.card--automation{background-image:linear-gradient(135deg, rgba(236,72,153,.12), rgba(244,63,94,.12))}
.card--settings{background-image:linear-gradient(135deg, rgba(100,116,139,.12), rgba(107,114,128,.12))}
.card--finance{background-image:linear-gradient(135deg, rgba(16,185,129,.12), rgba(20,184,166,.12))}
.card--uat{background-image:linear-gradient(135deg, rgba(239,68,68,.12), rgba(234,88,12,.12))}
.card--login{background-image:linear-gradient(135deg, rgba(99,102,241,.12), rgba(56,189,248,.12));max-width:480px;width:90%;margin:40px auto}
body.light .card--dashboard{background-image:linear-gradient(135deg, rgba(56,189,248,.18), rgba(34,197,94,.18))}
body.light .card--metrics{background-image:linear-gradient(135deg, rgba(59,130,246,.18), rgba(99,102,241,.18))}
body.light .card--customers{background-image:linear-gradient(135deg, rgba(20,184,166,.18), rgba(6,182,212,.18))}
body.light .card--leads{background-image:linear-gradient(135deg, rgba(168,85,247,.18), rgba(217,70,239,.18))}
body.light .card--followups{background-image:linear-gradient(135deg, rgba(139,92,246,.18), rgba(79,70,229,.18))}
body.light .card--quotes{background-image:linear-gradient(135deg, rgba(251,146,60,.18), rgba(245,158,11,.18))}
body.light .card--contracts{background-image:linear-gradient(135deg, rgba(245,158,11,.18), rgba(234,179,8,.18))}
body.light .card--orders{background-image:linear-gradient(135deg, rgba(34,197,94,.18), rgba(16,185,129,.18))}
body.light .card--invoices{background-image:linear-gradient(135deg, rgba(99,102,241,.18), rgba(59,130,246,.18))}
body.light .card--projects{background-image:linear-gradient(135deg, rgba(14,165,233,.18), rgba(6,182,212,.18))}
body.light .card--automation{background-image:linear-gradient(135deg, rgba(236,72,153,.18), rgba(244,63,94,.18))}
body.light .card--settings{background-image:linear-gradient(135deg, rgba(100,116,139,.18), rgba(107,114,128,.18))}
body.light .card--finance{background-image:linear-gradient(135deg, rgba(16,185,129,.18), rgba(20,184,166,.18))}
body.light .card--uat{background-image:linear-gradient(135deg, rgba(239,68,68,.18), rgba(234,88,12,.18))}
body.light .card--login{background-image:linear-gradient(135deg, rgba(99,102,241,.18), rgba(56,189,248,.18))}
.lead-board .lead-col[data-status="new"]{background-image:none}
.lead-board .lead-col[data-status="following"]{background-image:none}
.lead-board .lead-col[data-status="converted"]{background-image:none}
.lead-board .lead-col[data-status="closed"]{background-image:none}
/* 跟进弹窗按钮浅色系 */
.btn.pastel-cancel{background:#fee2e2 !important;color:#0f172a;border-color:#fecaca}
.btn.pastel-save{background:#d1fae5 !important;color:#0f172a;border-color:#a7f3d0}
.btn.pastel-close{background:#e0f2fe !important;color:#0f172a;border-color:#bae6fd}
.btn.pastel-edit{background:#fef3c7 !important;color:#0f172a;border-color:#fde68a}
.btn.pastel-del{background:#fde2e4 !important;color:#0f172a;border-color:#facbd3}
.btn.followups-btn{min-width:140px}
 .pricing-matrix{margin-top:8px}
.pricing-table{width:100%;border-collapse:collapse}
.pricing-table thead th{color:var(--fg);text-align:left;border-bottom:2px solid var(--border);padding:8px}
.pricing-table tbody td{padding:8px;border-bottom:1px solid var(--border)}
.pricing-table tbody tr:hover{background-color:rgba(148,163,184,.10)}
.pricing-table tbody td:nth-child(2),
.pricing-table tbody td:nth-child(3),
.pricing-table tbody td:nth-child(4){text-align:center}
body.light .pricing-table tbody tr:hover{background-color:#f1f5f9}
 .pricing-table .col-reco{background:linear-gradient(135deg, rgba(56,189,248,.18), rgba(99,102,241,.18));font-weight:700}
 body.light .pricing-table .col-reco{background:linear-gradient(135deg, rgba(56,189,248,.28), rgba(99,102,241,.28))}
 .pricing-table thead th.col-reco{color:var(--accent)}
 /* 英雄的历程（客户视角） */
 .journey{position:relative}
 .journey-progress{position:absolute;left:16px;right:16px;top:0;height:6px;background:rgba(148,163,184,.15);border-radius:999px;overflow:hidden}
 .journey-progress .bar{height:100%;width:0;background:linear-gradient(90deg, rgba(56,189,248,.45), rgba(99,102,241,.45));transition:width .25s ease}
 .journey-line{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
 .journey-step{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:12px;padding:12px;background:linear-gradient(135deg, rgba(148,163,184,.12), rgba(148,163,184,.20));cursor:pointer;transition:transform .08s ease, box-shadow .15s ease}
 .journey-step:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.25)}
 .journey-step .num{flex:0 0 auto;width:28px;height:28px;border-radius:999px;background:linear-gradient(135deg, rgba(56,189,248,.25), rgba(99,102,241,.25));display:flex;align-items:center;justify-content:center;font-weight:800;color:#0f172a}
 .journey-step .title{font-weight:800}
 .journey-step .desc{color:var(--muted);margin-top:4px}
.journey-step .actions{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.journey-step.active{border-color:var(--accent);box-shadow:0 8px 18px rgba(56,189,248,.25)}
 .journey-step .pains{display:flex;flex-direction:column;gap:6px;margin-top:8px}
 .journey-step .pain{border:1px dashed var(--border);border-radius:10px;padding:8px;background:rgba(148,163,184,.10)}
 .journey-step .pain .q{font-weight:700}
 .journey-step .pain .solutions{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
 .journey-step .pain .chip{padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:linear-gradient(135deg, rgba(148,163,184,.15), rgba(148,163,184,.25));color:var(--fg);cursor:pointer}
 .journey-step .pain .chip:hover{transform:translateY(-1px)}
 @media (prefers-reduced-motion: reduce){
   .journey-progress .bar{transition:none}
   .journey-step{transition:none}
 }
 body.light .journey-progress .bar{background:linear-gradient(90deg, rgba(37,99,235,.45), rgba(99,102,241,.45))}
/* 亮色模式下：看板列去除卡片渐变覆盖，确保浅色面板纯色显示 */
body.light .drop-col{background-image:none !important}
body.light .drop-col[data-status="todo"]{background-color:#fee2e2 !important}
body.light .drop-col[data-status="doing"]{background-color:#fef3c7 !important}
body.light .drop-col[data-status="done"]{background-color:#dcfce7 !important}
#userStatusMenu .mm-list{display:flex;flex-direction:column;gap:6px}
#userStatusMenu .mm-item{justify-content:space-between;text-align:left}
#userStatusMenu{width:max-content;min-width:120px}
#userStatusMenu .mm-list{display:flex;flex-direction:column;gap:6px}
#userStatusMenu .mm-item{justify-content:space-between;text-align:left;white-space:nowrap;overflow:visible;text-overflow:unset}
#userStatusMenu .mm-item span:first-child{flex:0 1 auto;min-width:auto;white-space:nowrap;overflow:visible;text-overflow:unset}
.settings-item .row.two{grid-template-columns:1fr 1fr}

/* Modal Styles */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  backdrop-filter: blur(4px);
}

.modal {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  width: 90%;
  max-width: 500px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  animation: modalIn 0.2s ease-out;
  display: flex;
  flex-direction: column;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  background: rgba(0,0,0,0.2);
}

.modal-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

.modal-body {
  padding: 20px;
  overflow-y: auto;
}

.modal-footer {
  padding: 16px 20px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  background: rgba(0,0,0,0.2);
}

.close-btn {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 24px;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}

.close-btn:hover {
  color: var(--fg);
  background: rgba(255,255,255,0.1);
}

.form-group {
  margin-bottom: 16px;
}

.form-group label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: var(--fg);
  font-size: 14px;
}

@keyframes modalIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* 统一按钮主题色（PC） */
.btn-primary{
  background: var(--accent);
  color: #fff;
}
.btn-danger{
  background: var(--danger);
  color: #fff;
}