/* ==================== 全局变量与重置 ==================== */
:root {
    /* 主色调 - 专业蓝 */
    --primary: #2563eb;
    --primary-light: #3b82f6;
    --primary-dark: #1d4ed8;
    --primary-bg: #eff6ff;
    --primary-border: #bfdbfe;

    /* 辅助色 */
    --success: #16a34a;
    --success-bg: #f0fdf4;
    --warning: #d97706;
    --warning-bg: #fffbeb;
    --danger: #dc2626;
    --danger-bg: #fef2f2;
    --info: #0891b2;
    --info-bg: #ecfeff;

    /* 中性色 */
    --bg: #f5f7fa;
    --bg-secondary: #eef1f6;
    --surface: #ffffff;
    --border: #e5e7eb;
    --border-strong: #cbd2dc;
    --border-light: #f3f4f6;
    --text-primary: #1f2937;
    --text-secondary: #6b7280;
    --text-tertiary: #9ca3af;

    /* 阴影 */
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.08), 0 2px 4px -2px rgba(0,0,0,0.05);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.05);

    /* 圆角（全站倒角统一加大） */
    --radius-sm: 8px;
    --radius: 10px;
    --radius-md: 12px;
    --radius-lg: 16px;

    /* 尺寸 */
    --sidebar-width: 240px;
    --topbar-height: 60px;
    --transition: all 0.2s ease;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    background: var(--bg);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }
input, select, textarea { font-family: inherit; font-size: inherit; outline: none; border-radius: var(--radius); }
ul { list-style: none; }

/* ==================== 布局 ==================== */
.app-layout {
    display: flex;
    min-height: 100vh;
}

/* 侧边栏 */
.sidebar {
    width: var(--sidebar-width);
    background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
    color: #cbd5e1;
    display: flex;
    flex-direction: column;
    position: fixed;
    height: 100vh;
    left: 0;
    top: 0;
    z-index: 100;
    transition: var(--transition);
}

.sidebar-header {
    padding: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
}

.logo-icon {
    font-size: 32px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(59,130,246,0.2);
    border-radius: var(--radius);
}

.logo-text h1 {
    font-size: 18px;
    color: #fff;
    font-weight: 700;
}

.logo-text p {
    font-size: 11px;
    color: #94a3b8;
    margin-top: 2px;
}

.sidebar-nav {
    flex: 1;
    padding: 16px 12px;
    overflow-y: auto;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border-radius: var(--radius);
    color: #cbd5e1;
    font-size: 14px;
    font-weight: 500;
    transition: var(--transition);
    margin-bottom: 4px;
}

.nav-item:hover {
    background: rgba(255,255,255,0.06);
    color: #fff;
}

.nav-item.active {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(37,99,235,0.4);
}

.nav-icon {
    font-size: 18px;
    width: 24px;
    text-align: center;
}

.nav-divider {
    height: 1px;
    background: rgba(255,255,255,0.08);
    margin: 12px 8px;
}

/* 父级菜单 + 子菜单（图片风格：一级分类标题 + 二级平铺） */
.nav-label {
    padding: 16px 14px 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #64748b;
}

.nav-subitems {
    display: block;
    padding: 0;
}

.nav-subitem {
    padding: 8px 14px 8px 16px;
    font-size: 13.5px;
    margin-bottom: 2px;
    font-weight: 500;
    border-radius: var(--radius);
}

.nav-subitem .nav-icon {
    font-size: 15px;
    width: 20px;
    flex-shrink: 0;
}

.nav-subitem:hover {
    background: rgba(255,255,255,0.06);
    color: #fff;
}

.nav-subitem.active {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(37,99,235,0.4);
}

.sidebar-footer {
    padding: 16px;
    border-top: 1px solid rgba(255,255,255,0.08);
}

.user-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 15px;
}

.user-name {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.user-role {
    color: #94a3b8;
    font-size: 12px;
}

/* 主内容区 */
.main-content {
    flex: 1;
    min-width: 0;
    margin-left: var(--sidebar-width);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    transition: var(--transition);
}

/* 顶部栏 */
.topbar {
    height: var(--topbar-height);
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    position: sticky;
    top: 0;
    z-index: 50;
}

.topbar-left {
    display: flex;
    align-items: center;
    gap: 16px;
}

.menu-toggle {
    display: none;
    font-size: 20px;
    color: var(--text-secondary);
}

.page-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.topbar-search {
    position: relative;
    width: 260px;
}

.topbar-search input {
    width: 100%;
    height: 36px;
    padding: 0 12px 0 36px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--bg-secondary);
    transition: var(--transition);
}

.topbar-search input:focus {
    border-color: var(--primary);
    background: var(--surface);
    box-shadow: 0 0 0 3px var(--primary-bg);
}

.search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: var(--text-tertiary);
}

.icon-btn {
    width: 36px;
    height: 36px;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    font-size: 16px;
    transition: var(--transition);
    position: relative;
}

.icon-btn:hover {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.badge-dot {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    background: var(--danger);
    border-radius: 50%;
    display: none;
}

.badge-dot.show { display: block; }

/* 页面容器 */
.page-container {
    flex: 1;
    min-width: 0;
    width: 100%;
    padding: 24px;
    overflow-x: hidden;
}

/* 工作台三处视觉细化 */
.sidebar .nav-item.active::after { right: 28px; border-radius: 7px; }
.sidebar-dashboard .nav-item.active::after { right: 28px; }
.sidebar-dashboard { background: transparent; }
.sidebar .nav-item.active::after,
.sidebar-dashboard .nav-item.active::after { right: 0; }
.calendar-toolbar {
    margin-bottom: 12px;
    padding: 12px 16px;
    background: #f1efe8;
    border: 1px solid #e7e1d6;
    border-radius: 12px;
    align-items: center;
}
.calendar-toolbar .cal-toolbar-left,
.calendar-toolbar .cal-toolbar-center,
.calendar-toolbar .cal-toolbar-right { z-index: 1; }
.calendar-grid {
    gap: 7px;
    padding: 7px;
    background: #f1efe8;
    border: 1px solid #e2ddd2;
    border-radius: 12px;
}
.cal-cell {
    border: 1px solid #d8d3c9;
    border-radius: 10px;
    background: #fff;
}
.cal-cell.cal-weekend-cell { background: #fff0f0; border-color: #f4b5b5; }
.project-status-bar {
    gap: 22px;
    padding: 14px 18px;
    background: #f1efe8;
    border-color: #e2ddd2;
    border-radius: 12px;
}
.calendar-toggles { align-items: center; }
.cal-toggle { border: 0; background: transparent !important; box-shadow: none; padding: 6px 8px; }
.cal-toggle.active { color: #2563eb; }
.cal-toggle-dot { display: none; }
.cal-toggle-icon { font-size: 17px; margin-right: 4px !important; }
.cal-toggle-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--primary); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; }
.cal-toggle:not(.active) .cal-toggle-count { background: #cbd5e1; color: #1f2937; }
.cal-toolbar-right { padding: 4px; border-radius: 9px; background: #e9e6dd; }
.cal-view-btn { border: 0; background: transparent; border-radius: 8px; }
.cal-view-btn.active { background: #fff; color: #1f2937; box-shadow: 0 1px 3px rgba(15,23,42,.14); }
.status-bar-item {
    padding: 7px 4px;
    border: 0;
    background: transparent !important;
    box-shadow: none;
    border-radius: 6px;
}
.status-bar-item:hover { background: rgba(255,255,255,.6) !important; }
.contract-form-grid-four .form-group:nth-child(1) { order: 2; }
.contract-form-grid-four .form-group:nth-child(2) { order: 1; }
.contract-linked-form .contract-form-section:nth-of-type(1) .contract-form-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.contract-linked-form .contract-form-section:nth-of-type(1) .contract-form-grid-four .form-group { min-width: 0; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:first-of-type { display: grid; grid-template-columns: 1fr 1fr; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:first-of-type .form-group:first-child { grid-column: 1 / -1; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:first-of-type .form-group:last-child { grid-column: 1 / 2; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:nth-of-type(2) { grid-template-columns: 1fr 1fr; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:nth-of-type(2) .form-group:first-child { grid-column: 1 / 2; }
.contract-linked-form .contract-form-section:nth-of-type(2) .contract-form-grid-three-one:nth-of-type(2) .form-group:last-child { grid-column: 2 / 3; }

/* ==================== 通用组件 ==================== */
/* 卡片 */
.card {
    min-width: 0;
    background: var(--surface);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.card-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
}

.card-body {
    padding: 20px;
}

/* 工作台分区 */
.dashboard-section {
    margin-bottom: 22px;
}

.dashboard-calendar-section {
    margin-bottom: 24px;
}

.dashboard-section-header {
    display: flex;
    align-items: center;
    min-height: 28px;
    margin-bottom: 10px;
}

.dashboard-section-header h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 15px;
    font-weight: 700;
}
.dashboard-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.dashboard-metric-grid.five-columns {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.dashboard-metric {
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid var(--border-light);
    border-left: 3px solid var(--primary);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.dashboard-metric-label {
    margin-bottom: 8px;
    overflow: hidden;
    color: var(--text-secondary);
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dashboard-metric-value {
    overflow: hidden;
    color: var(--text-primary);
    font-size: 23px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dashboard-metric-value span {
    margin-left: 4px;
    color: var(--text-tertiary);
    font-size: 12px;
    font-weight: 500;
}

.dashboard-metric.green { border-left-color: var(--success); }
.dashboard-metric.teal { border-left-color: var(--info); }
.dashboard-metric.orange { border-left-color: var(--warning); }
.dashboard-metric.red { border-left-color: var(--danger); }
.dashboard-metric.purple { border-left-color: #7c3aed; }

.account-balance-chart {
    position: relative;
    min-height: 300px;
    padding: 20px 28px 18px;
    overflow: hidden;
    border: 1px solid #dfe8ef;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(40, 67, 83, .08);
}
.account-balance-section { width: calc(50% - 7px); }
.report-overview-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
    margin-bottom: 24px;
}
.report-overview-feature-grid .account-balance-section { display: flex; width: 100%; height: 340px; margin-bottom: 0; flex-direction: column; }
.report-overview-feature-grid .account-balance-chart { min-height: 0; flex: 1; }
.customer-sales-ranking { min-width: 0; height: 340px; overflow: hidden; }
.customer-ranking-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 54px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-light);
}
.customer-ranking-header h3 { margin: 0; font-size: 15px; }
.customer-ranking-switch {
    display: inline-grid;
    grid-template-columns: repeat(2, 48px);
    padding: 2px;
    border: 1px solid #b7c9d8;
    border-radius: 5px;
    background: linear-gradient(180deg, #f8fbfd, #e4edf3);
    box-shadow: inset 0 1px 2px rgba(45, 73, 94, .12), 0 2px 5px rgba(42, 75, 101, .14);
}
.customer-ranking-switch button {
    min-height: 28px;
    border: 0;
    border-radius: 3px;
    color: #66788a;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    text-shadow: 0 1px 0 #fff;
    transition: color .18s ease, background .18s ease, box-shadow .18s ease, transform .12s ease;
}
.customer-ranking-switch button:hover:not(.active) { color: #245b82; background: rgba(255,255,255,.62); }
.customer-ranking-switch button:active { transform: translateY(1px); }
.customer-ranking-switch button.active {
    color: #fff;
    background: linear-gradient(180deg, #318fdf, #1269b8);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -2px 3px rgba(3,61,112,.22), 0 3px 7px rgba(25, 120, 207, .32);
    text-shadow: 0 1px 1px rgba(0, 50, 95, .35);
}
.customer-sales-ranking .customer-ranking-table-wrap { height: 286px; overflow-x: hidden !important; overflow-y: auto; }
.customer-sales-ranking table { width: 100%; min-width: 0; table-layout: fixed; }
.customer-sales-ranking .rank-col { width: 13%; }
.customer-sales-ranking .customer-col { width: 41%; }
.customer-sales-ranking .count-col { width: 20%; }
.customer-sales-ranking .amount-col { width: 26%; }
.customer-sales-ranking th,
.customer-sales-ranking td { padding: 8px 10px; text-align: center; }
.customer-sales-ranking th:nth-child(2),
.customer-sales-ranking td:nth-child(2) { text-align: left; }
.customer-rank-position { width: 54px; }
.customer-rank-medal { display: inline-block; font-size: 21px; line-height: 24px; }
.customer-rank-number {
    display: inline-grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    color: #657282;
    background: #eef2f5;
    font-size: 12px;
    font-weight: 700;
}
.customer-rank-name { overflow: hidden; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.website-edit-field { position: relative; }
.website-edit-field .form-control { padding-right: 38px; }
.website-open-link {
    position: absolute;
    top: 50%;
    right: 7px;
    display: inline-grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border: 1px solid #9fc4e0;
    border-radius: 4px;
    color: #0f69ad;
    background: #edf7fd;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transform: translateY(-50%);
}
.website-open-link:hover { color: #fff; border-color: #1675b9; background: #1675b9; }
.embedded-project-form { padding: 4px 2px 18px; }
.embedded-project-form-header {
    position: sticky;
    z-index: 8;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -4px -2px 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border-light);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(6px);
}
.embedded-project-form-header h3 { margin: 0; font-size: 16px; }
.embedded-project-form-header > div { display: flex; gap: 8px; }
.embedded-project-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--border-light);
}
.embedded-project-form .project-form-layout { max-height: none; }
.account-balance-title { text-align: center; }
.account-balance-title strong { display: block; color: #0757d9; font-size: 22px; line-height: 1.25; }
.account-balance-title span { display: block; margin-top: 3px; color: #708093; font-size: 12px; }
.account-cylinder-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: end;
    gap: 4px;
    max-width: 100%;
    height: 218px;
    margin: 2px auto 0;
}
.account-cylinder-item {
    --cylinder-main: #10b7c9;
    --cylinder-light: #91ecdf;
    --cylinder-dark: #049bb5;
    display: grid;
    grid-template-rows: 180px 28px;
    min-width: 0;
    align-items: end;
    justify-items: center;
}
.account-cylinder-value {
    position: absolute;
    z-index: 2;
    left: 50%;
    bottom: calc(9px + var(--cylinder-height));
    min-width: 76px;
    padding: 0 3px;
    color: #0647d8;
    background: transparent;
    font-size: 11px;
    font-weight: 700;
    line-height: 20px;
    text-align: center;
    white-space: nowrap;
    transform: translateX(-50%);
}
.account-cylinder-stage { position: relative; width: 72px; height: 148px; }
.account-cylinder-stage::after {
    content: '';
    position: absolute;
    right: -9px;
    bottom: 3px;
    width: 64px;
    height: 18px;
    border-radius: 50%;
    background: rgba(55, 69, 80, .16);
    filter: blur(5px);
    transform: skewX(-25deg);
}
.account-cylinder {
    position: absolute;
    z-index: 1;
    left: 50%;
    bottom: 5px;
    width: 48px;
    height: max(5px, var(--cylinder-height));
    min-height: 5px;
    border-radius: 0;
    background: linear-gradient(90deg, var(--cylinder-light) 0%, var(--cylinder-main) 44%, var(--cylinder-dark) 100%);
    box-shadow: inset 7px 0 10px rgba(255,255,255,.26), 1px 4px 8px rgba(25, 73, 91, .14);
    transform: translateX(-50%);
}
.account-cylinder::before {
    content: '';
    position: absolute;
    inset: -7px 0 auto;
    height: 14px;
    border-radius: 50%;
    background: linear-gradient(90deg, var(--cylinder-light), color-mix(in srgb, var(--cylinder-light) 72%, white), var(--cylinder-main));
}
.account-cylinder::after {
    content: '';
    position: absolute;
    inset: auto 0 -6px;
    height: 12px;
    border-radius: 50%;
    background: linear-gradient(90deg, var(--cylinder-light), var(--cylinder-main) 50%, var(--cylinder-dark));
    opacity: .9;
}
.account-cylinder-name { color: #073fd0; font-size: 12px; font-weight: 800; line-height: 28px; text-align: center; white-space: nowrap; }
.account-cylinder-peach { --cylinder-main: #ffb77c; --cylinder-light: #ffe1bb; --cylinder-dark: #f19a5d; }
.account-cylinder-rose { --cylinder-main: #fa718e; --cylinder-light: #ffb4c1; --cylinder-dark: #ed526f; }
.account-cylinder-blue { --cylinder-main: #89a9ef; --cylinder-light: #c5d6ff; --cylinder-dark: #668bd7; }
.account-cylinder-violet { --cylinder-main: #a58aeb; --cylinder-light: #d9ccff; --cylinder-dark: #7658c6; }

@media (max-width: 768px) {
    .account-balance-section { width: 100%; }
    .report-overview-feature-grid { grid-template-columns: 1fr; }
    .customer-sales-ranking { margin-top: 0; }
    .account-balance-chart { padding-inline: 12px; }
    .account-cylinder-list { gap: 4px; }
    .account-cylinder-item { grid-template-rows: 168px 28px; }
    .account-cylinder-stage { width: 76px; height: 136px; }
    .account-cylinder { width: 48px; }
    .account-cylinder-value { min-width: 0; padding-inline: 4px; font-size: 11px; }
    .account-cylinder-name { font-size: 12px; }
}

/* 按钮 */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: var(--radius);
    font-size: 13px;
    font-weight: 600;
    transition: var(--transition);
    white-space: nowrap;
    border: 1px solid transparent;
}

.btn-primary {
    background: var(--primary);
    color: #fff;
}

.btn-primary:hover {
    background: var(--primary-dark);
    box-shadow: 0 2px 8px rgba(37,99,235,0.3);
}

.btn-secondary {
    background: var(--surface);
    color: var(--text-secondary);
    border-color: var(--border);
}

.btn-secondary:hover {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.btn-danger {
    background: var(--danger);
    color: #fff;
}

.btn-danger:hover {
    background: #b91c1c;
}

.btn-success {
    background: var(--success);
    color: #fff;
}

.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
}

.btn-block {
    width: 100%;
    justify-content: center;
}

/* 表单 */
.form-group {
    margin-bottom: 18px;
}

.form-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 6px;
}

.form-label .required {
    color: var(--danger);
    margin-left: 2px;
}

.form-control {
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--text-primary);
    transition: var(--transition);
}

.form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-bg);
}

textarea.form-control {
    height: auto;
    padding: 10px 12px;
    resize: vertical;
    min-height: 80px;
    max-height: 45vh;
    overflow-y: auto;
}

select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b7280' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.form-row-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

.form-row-4 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px;
}

/* 表格 */
.table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
}

/* 非项目模块共享的固定表头、统计页尾及底部横向滚动区域。 */
.locked-data-wrap {
    max-height: calc(100vh - 238px);
    overflow: auto !important;
    scrollbar-gutter: stable;
}

.locked-data-wrap table thead th {
    position: sticky;
    top: 0;
    z-index: 6;
    background: var(--bg-secondary);
    box-shadow: 0 1px 0 var(--border);
}

.locked-data-wrap table thead .col-check,
.locked-data-wrap table thead .col-action {
    z-index: 8;
}

.locked-data-wrap table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 5;
    height: 46px;
    padding: 7px 12px;
    overflow: hidden;
    border-top: 2px solid var(--primary);
    background: var(--surface);
    color: var(--text-secondary);
    font-size: 11px;
    line-height: 15px;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-shadow: 0 -2px 5px rgba(15, 23, 42, 0.06);
}

.locked-data-wrap table tfoot .col-check,
.locked-data-wrap table tfoot .col-action {
    z-index: 8;
    background: var(--surface);
}

.locked-data-wrap table tfoot .stat-label,
.locked-data-wrap table tfoot strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.locked-data-wrap table tfoot .stat-label {
    color: var(--text-tertiary);
    font-size: 10px;
    font-weight: 500;
}

.locked-data-wrap table tfoot strong {
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 700;
}

/* 全模块表格统一为单行截断，窄屏通过横向滚动保留稳定列宽。 */
.table-wrap > table {
    table-layout: fixed;
    min-width: 100%;
}

.table-wrap > table tbody td {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 斑马纹：与 .data-table（项目汇总标准）统一 */
.table-wrap > table tbody tr:nth-child(even) td {
    background: #fafbfd;
}
.table-wrap > table tbody tr:hover td {
    background: var(--bg-secondary);
}

.table-wrap > table tbody td .cell-content {
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.table-wrap > table tbody td[title] {
    cursor: default;
}

#projTable {
    min-width: 3280px;
    border-collapse: separate;
    border-spacing: 0;
}
/* 项目总览列表：补齐横竖网格线，表头与数据区均清晰分隔 */
#projTable th, #projTable td {
    border: 1px solid var(--border);
}
#projTable thead th {
    border-bottom: 2px solid var(--border-strong);
}
#projTable tbody tr:first-child td {
    border-top: 2px solid var(--border-strong);
}
#projTableWrap {
    max-height: calc(100vh - 238px);
    min-height: 280px;
    overflow: auto;
    scrollbar-gutter: stable;
}
#finTable { min-width: 1200px; }
#cmTable { min-width: 1580px; }
#costTable { min-width: 1060px; }
#assetTable { min-width: 940px; }

#projTable .col-check,
#finTable .col-check,
#cmTable .col-check,
#costTable .col-check,
#assetTable .col-check {
    width: 76px;
}

/* 成本管理：选框列加宽，容纳到期提醒标识 */
#costTable .col-check {
    width: 128px;
    min-width: 128px;
    max-width: 128px;
}

/* 项目表格冻结列（宽度/内边距继承通用 .data-table .col-check，与客户公海一致） */
#projTable .col-check {
    position: sticky;
    left: 0;
    z-index: 4;
    overflow: visible;
    text-align: center;
    text-overflow: clip;
    background: var(--surface);
    box-shadow: 1px 0 0 var(--border);
}

#projTable .project-status-cell {
    position: sticky;
    left: 64px;
    z-index: 2;
    width: 104px;
    min-width: 104px;
    max-width: 104px;
    overflow: visible;
    text-align: center;
    text-overflow: clip;
    background: var(--surface);
    box-shadow: 1px 0 0 var(--border);
}

#projTable .project-status-cell .status-bar-item {
    white-space: nowrap;
    max-width: 100%;
    transform: none;
    cursor: default;
    font-size: 12px;
    padding: 3px 8px;
}

#projTable .col-action {
    position: sticky;
    right: 0;
    z-index: 3;
    overflow: visible;
    text-overflow: clip;
    background: var(--surface);
    box-shadow: -1px 0 0 var(--border);
}

#projTable thead .col-action {
    z-index: 9;
    background: var(--bg-secondary);
}

#projTable tbody tr:hover > .col-check,
#projTable tbody tr:hover > .project-status-cell,
#projTable tbody tr:hover > .col-action {
    background: var(--bg-secondary);
}

#projTable .col-action,
#finTable .col-action,
#cmTable .col-action,
#costTable .col-action,
#assetTable .col-action {
    width: 104px;
    white-space: nowrap;
}

#projTable .project-name-cell {
    width: 260px;
    min-width: 260px;
    max-width: 260px;
}

#projTable .project-name-text {
    display: block;
    width: 100%;
    overflow: hidden;
    color: var(--primary);
    font-weight: 600;
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
}

#projTable tbody td[rowspan] {
    vertical-align: middle;
}

#projTable tbody .project-row-start:not(:first-child) > td {
    border-top: 2px solid #b7c2d2;
}

#projTable tbody .project-band-light > td {
    background: #ffffff;
}

#projTable tbody .project-band-shaded > td {
    background: #eef3f9;
}

#projTable tbody .project-band-light:hover > td {
    background: #f7faff;
}

#projTable tbody .project-band-shaded:hover > td {
    background: #e6eef8;
}

/* ===== 纵向冻结：分别给每个 th 设 sticky，避免 thead 整体 sticky 导致子 th 被折叠 ===== */
#projTable thead tr { display: table-row; }
#projTable thead th { vertical-align: middle; }
#projTable thead tr.project-group-header { height: 42px; }
#projTable thead tr:nth-child(2) { height: 42px; }

/* 第一行分组表头：冻结在顶部 */
#projTable .project-group-header th {
    position: sticky;
    top: 0;
    z-index: 12;
    padding: 11px 12px;
    border-right: 2px solid #b7c2d2;
    border-bottom: 2px solid #aab7c8;
    background: #e5ebf4;
    color: #334155;
    font-weight: 800;
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

#projTable .project-group-header th:last-child {
    border-right: 0;
}

/* 第二行字段表头：冻结在第一行下方 */
#projTable thead tr:nth-child(2) th {
    position: sticky;
    top: 42px;
    z-index: 11;
    height: 42px;
    border-right: 1px solid #d3dae5;
    border-bottom: 2px solid #aab7c8;
    background: #f1f4f8;
    color: #475569;
    font-weight: 700;
    box-shadow: inset 0 1px 0 #fff;
}

/* 分组边界分隔线（与上方 colspan 分组对齐：第9/13/19/25个字段为各组末列） */
#projTable thead tr:nth-child(2) th:nth-child(9),
#projTable thead tr:nth-child(2) th:nth-child(13),
#projTable thead tr:nth-child(2) th:nth-child(19),
#projTable thead tr:nth-child(2) th:nth-child(25) {
    border-right: 2px solid #aab7c8;
}

/* 冻结的左列角标：全选 + 项目状态，横向滚动时覆盖其他表头。
   第一行全选 rowspan=2，第二行项目状态需要独立 top 值。 */
#projTable thead .col-check {
    position: sticky;
    left: 0;
    top: 0;
    z-index: 20;
    background: var(--bg-secondary);
}

#projTable thead tr:nth-child(2) .project-status-cell {
    position: sticky;
    left: auto !important;
    top: 42px;
    z-index: 9;
    background: var(--bg-secondary);
}

#projTable .project-group-header .col-action {
    top: 0;
    z-index: 9;
    vertical-align: middle;
}

#projTable tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 5;
    height: 46px;
    padding: 7px 12px;
    overflow: hidden;
    border-top: 2px solid var(--primary);
    background: var(--surface);
    color: var(--text-secondary);
    font-size: 11px;
    line-height: 15px;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-shadow: 0 -2px 5px rgba(15, 23, 42, 0.06);
}

#projTable tfoot .col-check,
#projTable tfoot .project-status-cell,
#projTable tfoot .col-action {
    z-index: 8;
    background: var(--surface);
}

#projTable tfoot .stat-label {
    display: block;
    color: var(--text-tertiary);
    font-size: 10px;
    font-weight: 500;
}

#projTable tfoot strong {
    display: block;
    overflow: hidden;
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
}

@media (max-width: 768px) {
    #projTableWrap {
        max-height: calc(100vh - 250px);
        min-height: 240px;
    }
}

table {
    width: 100%;
    border-collapse: collapse;
}

th {
    text-align: left;
    padding: 12px 16px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--border-light);
    color: var(--text-primary);
    font-size: 13px;
}

tbody tr {
    transition: var(--transition);
}

tbody tr:hover {
    background: var(--bg-secondary);
}

tbody tr:last-child td {
    border-bottom: none;
}

/* 徽章/标签 */
.badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.badge-primary { background: var(--primary-bg); color: var(--primary-dark); }
.badge-success { background: var(--success-bg); color: var(--success); }
.badge-warning { background: var(--warning-bg); color: var(--warning); }
.badge-danger { background: var(--danger-bg); color: var(--danger); }
.badge-info { background: var(--info-bg); color: var(--info); }
.badge-gray { background: var(--bg-secondary); color: var(--text-secondary); }
.badge-venue { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.badge-finance { background: #fef3c7; color: #d97706; border: 1px solid #fde68a; }
.badge-operation { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.badge-staff { background: #faf5ff; color: #9333ea; border: 1px solid #e9d5ff; }
.badge-other { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }

/* 项目总览「回款情况」按正负着色：<0 深红(欠款) =0 绿(无欠款) >0 黄(多收款) */
.data-table td.amount.coll-debt { color: #c0142b !important; font-weight: 600; }
.data-table td.amount.coll-even { color: #16a34a !important; font-weight: 600; }
.data-table td.amount.coll-over { color: #d99a00 !important; font-weight: 600; }

/* 财务一级科目（收入/支出/费用） */
.badge-income { background: var(--success-bg); color: var(--success); }
.badge-expense { background: var(--danger-bg); color: var(--danger); }
.badge-fee { background: var(--warning-bg); color: var(--warning); }
.badge-carry { background: #f5f3ff; color: #7c3aed; }

/* 成本大类汇总一行 */
.cost-summary-row {
    display: flex;
    gap: 12px;
    flex-wrap: nowrap;
}
.cost-summary-item {
    flex: 1;
    min-width: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px 12px;
    text-align: center;
    transition: box-shadow 0.2s;
}
.cost-summary-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.cost-summary-item .cs-label {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 6px;
    white-space: nowrap;
}
.cost-summary-item .cs-amount {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    white-space: nowrap;
}
.cost-summary-item .cs-pct {
    font-size: 11px;
    color: var(--text-tertiary);
    margin-top: 4px;
}
.cost-summary-item.venue-cat { border-left: 3px solid #2563eb; }
.cost-summary-item.venue-cat .cs-label { color: #2563eb; }
.cost-summary-item.finance-cat { border-left: 3px solid #d97706; }
.cost-summary-item.finance-cat .cs-label { color: #d97706; }
.cost-summary-item.operation-cat { border-left: 3px solid #16a34a; }
.cost-summary-item.operation-cat .cs-label { color: #16a34a; }
.cost-summary-item.staff-cat { border-left: 3px solid #9333ea; }
.cost-summary-item.staff-cat .cs-label { color: #9333ea; }
.cost-summary-item.other-cat { border-left: 3px solid #dc2626; }
.cost-summary-item.other-cat .cs-label { color: #dc2626; }

@media (max-width: 768px) {
    .cost-summary-row { flex-wrap: wrap; }
    .cost-summary-item { flex: 1 1 calc(50% - 6px); min-width: 120px; }
}

/* 状态点 */
.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
}

/* 空状态 */
.empty-state {
    text-align: center;
    padding: 48px 20px;
    color: var(--text-tertiary);
}

.empty-state .empty-icon {
    font-size: 48px;
    margin-bottom: 12px;
    opacity: 0.5;
}

.empty-state p {
    font-size: 14px;
}

/* 工具栏 */
.toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.toolbar-left {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.toolbar-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.filter-select {
    height: 36px;
    padding: 0 32px 0 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    font-size: 13px;
    color: var(--text-primary);
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b7280' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
}

.search-input {
    height: 36px;
    width: 240px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-size: 13px;
}

.search-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-bg);
}

/* ==================== 仪表盘 ==================== */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.stat-card {
    background: var(--surface);
    border-radius: var(--radius-md);
    padding: 20px;
    box-shadow: var(--shadow);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: var(--transition);
    border: 1px solid var(--border-light);
}

.stat-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.stat-icon.blue { background: var(--primary-bg); }
.stat-icon.green { background: var(--success-bg); }
.stat-icon.orange { background: var(--warning-bg); }
.stat-icon.purple { background: #f5f3ff; }

.stat-info {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.stat-label {
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stat-value {
    font-size: 26px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stat-trend {
    font-size: 12px;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.stat-trend.up { color: var(--success); }
.stat-trend.down { color: var(--danger); }

.dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.dashboard-row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
}

/* 进度条 */
.progress-bar {
    height: 8px;
    background: var(--bg-secondary);
    border-radius: 4px;
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s ease;
}

/* 项目状态标签颜色 */
.status-opportunity { background: var(--info-bg); color: var(--info); }
.status-bidding { background: #fef2f2; color: #dc2626; }
.status-won { background: var(--success-bg); color: var(--success); }
.status-lost { background: var(--danger-bg); color: var(--danger); }
.status-contract { background: var(--primary-bg); color: var(--primary-dark); }
.status-executing { background: #f5f3ff; color: #7c3aed; }
.status-completed { background: #e8f1ff; color: #1769e0; }
.status-docking { background: #f0fdf4; color: #16a34a; }
.status-cancelled { background: #eef1f6; color: #6b7280; opacity: 0.85; }

/* ==================== 模态框 ==================== */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,0.5);
    backdrop-filter: blur(2px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
}

.modal-overlay.show {
    display: flex;
    animation: fadeIn 0.2s ease;
}

.modal {
    background: var(--surface);
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 640px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-lg);
    animation: slideUp 0.25s ease;
}

.modal.modal-lg { max-width: 860px; }
.modal.modal-sm { max-width: 460px; }

/* 退出登录确认弹窗：收窄到与登录框(400px)大致一致，标题/内容/按钮均居中 */
.modal.modal-logout { max-width: 400px; position: relative; }
.modal.modal-logout .modal-header { position: relative; justify-content: center; padding: 18px 24px; }
.modal.modal-logout .modal-title { flex: none; width: 100%; text-align: center; }
.modal.modal-logout .modal-close { position: absolute; top: 14px; right: 14px; }

/* 表单弹窗右侧抽屉化：靠右贴合窗体、全高 */
.modal-overlay.drawer-mode {
    justify-content: flex-end;
    align-items: stretch;
    padding: 0;
}
.modal-drawer {
    height: 100vh;
    max-height: 100vh;
    margin: 0;
    border-radius: 0;
}
.modal-drawer:not(.modal-lg):not(.modal-xl):not(.modal-sm) {
    width: min(600px, 100vw);
}

.modal-header {
    padding: 18px 24px;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 17px;
    font-weight: 700;
}

/* 表单弹窗的取消/保存按钮上移到右上角（与公海客户详情页一致） */
.modal-header-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
}
.modal-header-actions .btn { margin: 0; }

.modal-close {
    font-size: 18px;
    color: var(--text-tertiary);
    width: 32px;
    height: 32px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.modal-close:hover {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.modal-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==================== Toast ==================== */
.toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* 云端同步提示条：顶部通栏，同步中显示 */
.cloud-sync-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3000;
    padding: 6px 12px;
    background: #1769e0;
    color: #fff;
    font-size: 12px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(23, 105, 224, .25);
}

.toast {
    background: var(--surface);
    border-radius: var(--radius);
    padding: 12px 18px;
    box-shadow: var(--shadow-lg);
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 500;
    border-left: 4px solid var(--primary);
    animation: slideInRight 0.25s ease;
    min-width: 280px;
}

.toast.success { border-left-color: var(--success); }
.toast.error { border-left-color: var(--danger); }
.toast.warning { border-left-color: var(--warning); }

.toast-icon {
    font-size: 18px;
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(40px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ==================== 详情页 ==================== */
.detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px;
}

.detail-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.detail-item {
    padding: 14px;
    background: var(--bg-secondary);
    border-radius: var(--radius);
}

.detail-item .label {
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 4px;
}

.detail-item .value {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
}

/* 时间线 */
.timeline {
    position: relative;
    padding-left: 28px;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 4px;
    bottom: 4px;
    width: 2px;
    background: var(--border);
}

.timeline-item {
    position: relative;
    padding-bottom: 20px;
}

.timeline-item:last-child {
    padding-bottom: 0;
}

.timeline-dot {
    position: absolute;
    left: -28px;
    top: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--primary);
    border: 3px solid var(--surface);
    box-shadow: 0 0 0 2px var(--primary);
}

.timeline-dot.done {
    background: var(--success);
    box-shadow: 0 0 0 2px var(--success);
}

.timeline-content {
    background: var(--bg-secondary);
    padding: 12px 16px;
    border-radius: var(--radius);
}

.timeline-title {
    font-weight: 600;
    font-size: 13px;
    margin-bottom: 4px;
}

.timeline-time {
    font-size: 12px;
    color: var(--text-tertiary);
}

/* 分页 */
.pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
    padding-top: 16px;
}

.pagination-info {
    font-size: 13px;
    color: var(--text-secondary);
}

.pagination-btns {
    display: flex;
    gap: 6px;
}

.page-btn {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--text-secondary);
    font-size: 13px;
    transition: var(--transition);
}

.page-btn:hover:not(:disabled) {
    border-color: var(--primary);
    color: var(--primary);
}

.page-btn.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

.page-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* 标签页 */
.tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--border);
    margin-bottom: 20px;
}

.tab {
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-secondary);
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: var(--transition);
    cursor: pointer;
}

.tab:hover {
    color: var(--text-primary);
}

.tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}

/* 顶部导航栏（滑动引导线） */
.page-topnav {
    display: flex;
    position: relative;
    height: 64px;
    min-height: 64px;
    padding-top: 2px;
    background: #f8fafc;
    margin-bottom: 18px;
    box-shadow: 0 3px 8px rgba(15,23,42,.08);
    align-items: stretch;
    gap: 8px;
    border-bottom: 1px solid var(--border-light);
    isolation: isolate;
}
.topnav-tab {
    position: relative;
    padding: 11px 20px 13px;
    background: transparent;
    border: 0;
    font-size: 15px;
    font-weight: 650;
    color: var(--text-secondary);
    cursor: pointer;
    transition: color .22s ease, background-color .22s ease, transform .22s ease;
    white-space: nowrap;
    border-radius: 6px 6px 0 0;
}
.topnav-tab:hover { color: var(--text-primary); background: rgba(59,108,255,.05); transform: translateY(-1px); }
.topnav-tab.active { color: var(--primary); }
.topnav-underline {
    position: absolute;
    left: 0;
    bottom: -1px;
    height: 2px;
    background: var(--primary);
    border-radius: 2px;
    transition: transform .38s cubic-bezier(.22, .9, .3, 1.12), width .34s cubic-bezier(.22, .9, .3, 1);
    pointer-events: none;
    will-change: transform, width;
    box-shadow: 0 1px 4px rgba(23,105,224,.22);
}
.topnav-underline::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--primary);
    border: 2px solid var(--surface);
    box-shadow: 0 0 0 2px rgba(23,105,224,.18), 0 2px 6px rgba(23,105,224,.3);
    transform: translate(-50%, -50%);
}
.page-topnav.is-moving .topnav-underline::after { animation: topnav-dot-arrive .44s cubic-bezier(.2,.85,.3,1); }
@keyframes topnav-dot-arrive {
    0% { transform: translate(-50%, -50%) scale(.72); }
    65% { transform: translate(-50%, -50%) scale(1.28); }
    100% { transform: translate(-50%, -50%) scale(1); }
}
/* 提成统计页内 Tab（提成管理 / 人员管理） */
.commission-subtabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 16px;
}
.commission-subtab {
    padding: 9px 20px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color .2s ease, border-color .2s ease;
}
.commission-subtab:hover { color: var(--primary); }
.commission-subtab.active { color: var(--primary); border-bottom-color: var(--primary); }
.dashboard-tab-panel:not([hidden]),
.report-tab-panel:not([hidden]) {
    animation: topnav-panel-in .3s cubic-bezier(.22,.75,.25,1) both;
}
@keyframes topnav-panel-in {
    from { opacity: 0; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
}
.dashboard-tab-panel[hidden],
.report-tab-panel[hidden] { display: none; }
/* 顶部导航栏吸顶常驻 + 内容独立滚动（工作台 / 统计报表） */
#pageContainer[data-page="dashboard"],
#pageContainer[data-page="reports"] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--topbar-height));
    max-height: calc(100vh - var(--topbar-height));
    min-height: 0;
    overflow: hidden;
    padding: 0;
}
#pageContainer[data-page="dashboard"] .page-topnav,
#pageContainer[data-page="reports"] .page-topnav {
    flex: 0 0 auto;
    margin-bottom: 0;
    z-index: 5;
}
#pageContainer[data-page="dashboard"] .dashboard-panels,
#pageContainer[data-page="reports"] .report-panels {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 16px 18px 28px;
}
@media (prefers-reduced-motion: reduce) {
    .topnav-tab, .topnav-underline { transition-duration: .01ms; }
    .page-topnav.is-moving .topnav-underline::after,
    .dashboard-tab-panel:not([hidden]),
    .report-tab-panel:not([hidden]) { animation: none; }
}

/* 金额样式 */
.amount {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.amount-positive { color: var(--success); }
.amount-negative { color: var(--danger); }
.data-table td.amount-positive { color: var(--success); }
.data-table td.amount-negative { color: var(--danger); }
.data-table td.amount-income { color: var(--primary); }
.data-table td.amount-fee { color: #b66a00; }
.data-table td.amount-carry { color: #7c3aed; }

/* 固资标签二维码 */
.data-table td.asset-tag-cell { text-align: center; padding: 4px 6px; }
.asset-qr { width: 60px; height: 60px; cursor: pointer; border-radius: 4px; background: #fff; border: 1px solid var(--border, #e5e7eb); transition: transform .12s ease, box-shadow .12s ease; }
.asset-qr:hover { transform: scale(1.08); box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.asset-qr-empty { color: var(--text-tertiary, #9ca3af); }

/* 操作链接 */
.action-link {
    color: var(--primary);
    font-size: 13px;
    font-weight: 500;
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
}

.action-link:hover {
    background: var(--primary-bg);
}

.action-link.danger {
    color: var(--danger);
}

.action-link.danger:hover {
    background: var(--danger-bg);
}

/* 简单柱状图 */
.bar-chart {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    height: 200px;
    padding: 16px 0;
}

.bar-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    height: 100%;
    justify-content: flex-end;
}

.bar {
    width: 100%;
    max-width: 48px;
    background: linear-gradient(180deg, var(--primary-light), var(--primary));
    border-radius: 6px 6px 0 0;
    transition: height 0.6s ease;
    min-height: 4px;
    position: relative;
}

.bar:hover {
    opacity: 0.85;
}

.bar-label {
    font-size: 12px;
    color: var(--text-secondary);
}

.bar-value {
    font-size: 11px;
    color: var(--text-primary);
    font-weight: 600;
}

/* 账户余额行 */
.balance-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}

.balance-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 20px 18px;
    text-align: center;
    transition: var(--transition);
}

.balance-card:hover {
    box-shadow: var(--shadow-md);
    border-color: var(--primary-border);
}

.balance-label {
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 8px;
}

.balance-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--primary);
    font-family: "SF Mono", "Menlo", "Consolas", monospace;
}

.balance-value::before {
    content: '¥';
    font-size: 16px;
    font-weight: 500;
    margin-right: 2px;
    opacity: 0.6;
}

/* 日历日程 */
.calendar-wrap { padding: 4px 0; }

.calendar-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.calendar-header.center {
    justify-content: center;
}

.calendar-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
    min-width: 140px;
    text-align: center;
}

.calendar-count {
    margin-left: auto;
    font-size: 13px;
    color: var(--text-secondary);
    background: var(--bg-secondary);
    padding: 4px 12px;
    border-radius: 20px;
}

.cal-card-header {
    align-items: center;
}

/* 项目状态条 */
.project-status-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    margin-top: 16px;
    margin-bottom: 0;
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

.status-bar-item {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    padding: 5px 10px;
    background: var(--surface);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    cursor: pointer;
    font-family: inherit;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.status-bar-item:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.status-bar-item:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.status-bar-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.status-bar-item.making { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
.status-bar-item.making .status-bar-dot { background: #ef4444; }
.status-bar-item.delivered { color: #2563eb; border-color: #bfdbfe; background: #eff6ff; }
.status-bar-item.delivered .status-bar-dot { background: #3b82f6; }
.status-bar-item.won { color: #059669; border-color: #86efac; background: #ecfdf5; }
.status-bar-item.won .status-bar-dot { background: #10b981; }
.status-bar-item.lost { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.status-bar-item.lost .status-bar-dot { background: #ef4444; }
.status-bar-item.invalid { color: #6b7280; border-color: #d1d5db; background: #f9fafb; }
.status-bar-item.invalid .status-bar-dot { background: #9ca3af; }
.status-bar-item.pending { color: #92400e; border-color: #fcd34d; background: #fffbeb; }
.status-bar-item.pending .status-bar-dot { background: #f59e0b; }
.status-bar-item.docking { color: #16a34a; border-color: #bbf7d0; background: #f0fdf4; }
.status-bar-item.docking .status-bar-dot { background: #22c55e; }
.status-bar-item.cancelled { color: #6b7280; border-color: #e5e7eb; background: #f9fafb; }
.status-bar-item.cancelled .status-bar-dot { background: #9ca3af; }

.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 4px;
}

.calendar-controls {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
}

.calendar-nav-center {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: center;
}

.nav-switch-group {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--surface);
}

.nav-value {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    padding: 0 14px;
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 700;
}

.nav-year-btn {
    appearance: none;
    cursor: pointer;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-family: inherit;
    transition: var(--transition);
}

.nav-year-btn:hover {
    background: var(--bg-secondary);
    border-color: transparent;
}

.nav-arrows {
    display: inline-flex;
}

.nav-arrow {
    width: 30px;
    height: 38px;
    border: 0;
    background: transparent;
    color: var(--text-secondary);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nav-arrow.left {
    border-right: 1px solid var(--border);
}

.nav-arrow.right {
    border-left: 1px solid var(--border);
}

.nav-arrow:hover {
    color: #fff;
    background: var(--primary);
}

.calendar-today-btn {
    min-width: 56px;
    height: 38px;
    padding: 0 16px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.calendar-today-btn:hover {
    color: #fff;
    background: var(--primary);
    border-color: var(--primary);
}

.calendar-year-grid,
.calendar-past-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

/* 年视图与月视图统一外框高度，12 张卡片等比铺满 */
.calendar-year-grid {
    height: 520px;
    grid-template-rows: repeat(3, 1fr);
    gap: 1px;
    background: #cdd5e0;
    border: 1px solid #cdd5e0;
}

/* 年视图顶部透明占位，对齐月视图星期表头基线 */
.calendar-year-spacer {
    height: 33px;
    margin-bottom: 4px;
    visibility: hidden;
}

.calendar-past-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.calendar-month-card,
.calendar-year-card {
    min-height: 92px;
    padding: 14px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: #eaf6ed;
    color: var(--text-secondary);
    text-align: left;
    cursor: pointer;
    transition: var(--transition);
}

.calendar-month-card:hover,
.calendar-year-card:hover,
.calendar-month-card.current {
    border-color: var(--primary);
    background: var(--primary-bg);
    box-shadow: var(--shadow-sm);
}

.calendar-month-card span,
.calendar-year-card span,
.calendar-month-card strong,
.calendar-year-card strong,
.calendar-month-card small,
.calendar-year-card small {
    display: block;
}

.calendar-month-card strong,
.calendar-year-card strong {
    margin: 6px 0 2px;
    color: var(--text-primary);
    font-size: 24px;
}

.calendar-month-card small,
.calendar-year-card small {
    color: var(--text-tertiary);
    font-size: 11px;
}

/* 年视图月卡片：内容居中，统计已交付/已取消并套用状态色 */
.calendar-month-card {
    position: relative;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 96px;
    border: 1px solid transparent;
    border-radius: 0;
}

.calendar-month-card .mc-month {
    position: absolute;
    top: 10px;
    left: 12px;
    font-weight: 600;
    color: var(--text-primary);
    font-size: 13px;
}

.calendar-month-card .my-stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
}

.calendar-month-card .my-stat .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.calendar-month-card .my-stat.delivered {
    color: #2563eb;
}

.calendar-month-card .my-stat.delivered .dot {
    background: #2563eb;
}

.calendar-month-card .my-stat.cancelled {
    color: #6b7280;
}

.calendar-month-card .my-stat.cancelled .dot {
    background: #6b7280;
}

.calendar-week-view {
    display: grid;
    grid-template-columns: repeat(7, minmax(120px, 1fr));
    gap: 6px;
    overflow-x: auto;
}

.calendar-week-day {
    position: relative;
    min-height: 210px;
    overflow: hidden;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--surface);
}

.week-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-secondary);
    color: var(--text-secondary);
    cursor: pointer;
}

.week-day-head strong { color: var(--text-primary); }

.week-day-events {
    display: grid;
    gap: 6px;
    padding: 8px;
}

.no-events {
    color: var(--text-tertiary);
    font-size: 11px;
}

.calendar-day-view {
    display: grid;
    gap: 10px;
    min-height: 180px;
}

.calendar-day-event {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--border-light);
    border-left: 4px solid var(--warning);
    border-radius: var(--radius-sm);
    background: var(--surface);
    cursor: pointer;
}

.calendar-day-event.ev-won { border-left-color: var(--success); }
.calendar-day-event.ev-lost { border-left-color: var(--danger); }
.calendar-day-event.ev-delivered { border-left-color: var(--info); }
.calendar-day-event.ev-making { border-left-color: var(--warning); }
.calendar-day-event.ev-invalid { border-left-color: var(--text-tertiary); }
.calendar-day-event time { color: var(--primary); font-weight: 700; }
.calendar-day-event strong,
.calendar-day-event span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.calendar-day-event strong { margin-bottom: 4px; color: var(--text-primary); }
.calendar-day-event span { color: var(--text-secondary); font-size: 12px; }

.calendar-empty-view {
    display: grid;
    place-items: center;
    min-height: 180px;
    color: var(--text-tertiary);
    border: 1px dashed var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
}

.cal-event-name {
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1 1 auto;
    min-width: 0;
}

.cal-weekday {
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-tertiary);
    padding: 8px 0;
}

/* 周末表头区分色：周六/日红色，区别于周一至周五 */
.calendar-weekdays .cal-weekday:nth-child(6),
.calendar-weekdays .cal-weekday:nth-child(7) {
    color: #dc2626;
    font-weight: 700;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background: #cdd5e0;
    border: 1px solid #cdd5e0;
    border-radius: var(--radius-sm);
    overflow: hidden;
    height: 520px;
}

.cal-cell {
    position: relative;
    min-height: 78px;
    padding: 4px 6px;
    background: #eaf6ed;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    gap: 3px;
    overflow: hidden;
}

.cal-cell:hover {
    box-shadow: 0 0 0 2px var(--primary-border);
    z-index: 2;
}

.cal-empty {
    background: transparent;
    border: none;
    min-height: 0;
}

/* 相邻月份补位日期：背景与本月一致（工作日白底 / 周末淡红随周末规则），仅日期数字变浅 */
.cal-cell.cal-other-month .cal-day {
    color: #9ca3af;
}

.cal-today {
    background: #cdeeda;
    border: 2px solid var(--primary);
    box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.12), 0 2px 8px rgba(37, 99, 235, 0.18);
}

.cal-today .cal-day {
    color: var(--primary);
    font-weight: 700;
}

/* 周末（周六/周日）日期数字：与周末表头一致为红色。 */
.cal-day.cal-weekend {
    color: #dc2626;
    font-weight: 700;
}

.cal-cell:not(.cal-today) .cal-day.cal-sat,
.cal-cell:not(.cal-today) .cal-day.cal-sun {
    color: #dc2626;
    font-weight: 700;
}

/* 跨月补位日期优先淡化，包括落在周末的日期。 */
.cal-cell.cal-other-month .cal-day,
.cal-cell.cal-other-month:not(.cal-today) .cal-day.cal-sat,
.cal-cell.cal-other-month:not(.cal-today) .cal-day.cal-sun {
    color: #b8c0cc;
    font-weight: 500;
}

/* 周末整格背景：周六/周日统一淡红（均浅于分隔线 #cdd5e0，含补位日期） */
.cal-cell.cal-cell-sat:not(.cal-today),
.cal-cell.cal-cell-sun:not(.cal-today) {
    background: #fdeef0;
}

.cal-today::after {
    content: "今";
    position: absolute;
    top: 5px;
    right: 5px;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}

.cal-day {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2;
}

.cal-lunar {
    position: absolute;
    top: 4px;
    right: 5px;
    font-size: 10px;
    line-height: 1.2;
    color: var(--text-tertiary, #cbd5e1);
    pointer-events: none;
}
.cal-cell.cal-other-month .cal-lunar { color: #d8dee9; }
.cal-today .cal-lunar { display: none; }

/* ===== 项目统计 - 产品明细子表 / 区块 ===== */
.form-section { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border, #e5e7eb); }
.form-section-title, .detail-section-title { font-size: 13px; font-weight: 600; color: var(--text-secondary, #6b7280); margin-bottom: 8px; }
.pd-wrap { margin-bottom: 8px; }
.pd-table { width: 100%; border-collapse: collapse; font-size: 13px; background: var(--surface, #fff); }
.pd-table th, .pd-table td { border: 1px solid var(--border, #e5e7eb); padding: 6px 8px; text-align: left; vertical-align: middle; }
.pd-table th { background: var(--bg-secondary, #eef1f6); font-weight: 600; color: var(--text-secondary, #6b7280); white-space: nowrap; }
.pd-table .pd-input { width: 100%; padding: 6px 8px; }
.detail-section { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border, #e5e7eb); }

/* 项目新增/编辑：与列表分组一致的四段式表单。 */
.project-form-layout {
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.project-form-section {
    position: relative;
    padding: 0 0 22px 44px;
    border-left: 3px solid #cbd5e1;
}
.project-form-section:last-child {
    padding-bottom: 0;
}
.project-form-section:nth-of-type(1) { border-left-color: #3b82f6; }
.project-form-section:nth-of-type(2) { border-left-color: #10b981; }
.project-form-section:nth-of-type(3) { border-left-color: #8b5cf6; }
.project-form-section:nth-of-type(4) { border-left-color: #f59e0b; }
.project-form-section-title {
    display: inline-flex;
    align-items: center;
    margin-bottom: 14px;
    padding: 4px 16px;
    border-radius: 999px;
    --neon-rgb: 59,130,246;
    border: 1.5px solid #3b82f6;
    color: #1d4ed8;
    background: rgba(59,130,246,.07);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .5px;
    box-shadow: 0 0 4px rgba(59,130,246,.75), 0 0 10px rgba(59,130,246,.45), 0 0 18px rgba(59,130,246,.28);
    text-shadow: 0 0 6px rgba(59,130,246,.6);
    animation: proj-neon 2.6s ease-in-out infinite;
}
@keyframes proj-neon {
    0%, 100% { box-shadow: 0 0 4px rgba(var(--neon-rgb), .75), 0 0 10px rgba(var(--neon-rgb), .45), 0 0 18px rgba(var(--neon-rgb), .28); text-shadow: 0 0 6px rgba(var(--neon-rgb), .6); }
    50% { box-shadow: 0 0 7px rgba(var(--neon-rgb), .92), 0 0 15px rgba(var(--neon-rgb), .6), 0 0 27px rgba(var(--neon-rgb), .42); text-shadow: 0 0 10px rgba(var(--neon-rgb), .8); }
}
@media (prefers-reduced-motion: reduce) {
    .project-form-section-title,
    .project-form-section-title span { animation: none; }
}
.project-form-section-title span {
    position: absolute;
    left: -13px;
    top: -1px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #94a3b8;
    color: #475569;
    display: inline-grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    animation: proj-neon 2.6s ease-in-out infinite;
}
.project-form-section:nth-of-type(1) .project-form-section-title span { border-color: #3b82f6; color: #3b82f6; }
.project-form-section:nth-of-type(1) .project-form-section-title { border-color: #3b82f6; color: #1d4ed8; background: rgba(59,130,246,.07); box-shadow: 0 0 4px rgba(59,130,246,.75), 0 0 10px rgba(59,130,246,.45), 0 0 18px rgba(59,130,246,.28); text-shadow: 0 0 6px rgba(59,130,246,.6); }
.project-form-section:nth-of-type(2) .project-form-section-title span { border-color: #10b981; color: #10b981; }
.project-form-section:nth-of-type(2) .project-form-section-title { --neon-rgb: 16,185,129; border-color: #10b981; color: #047857; background: rgba(16,185,129,.07); box-shadow: 0 0 4px rgba(16,185,129,.75), 0 0 10px rgba(16,185,129,.45), 0 0 18px rgba(16,185,129,.28); text-shadow: 0 0 6px rgba(16,185,129,.6); }
.project-form-section:nth-of-type(3) .project-form-section-title span { border-color: #8b5cf6; color: #8b5cf6; }
.project-form-section:nth-of-type(3) .project-form-section-title { --neon-rgb: 139,92,246; border-color: #8b5cf6; color: #6d28d9; background: rgba(139,92,246,.07); box-shadow: 0 0 4px rgba(139,92,246,.75), 0 0 10px rgba(139,92,246,.45), 0 0 18px rgba(139,92,246,.28); text-shadow: 0 0 6px rgba(139,92,246,.6); }
.project-form-section:nth-of-type(4) .project-form-section-title span { border-color: #f59e0b; color: #f59e0b; }
.project-form-section:nth-of-type(4) .project-form-section-title { --neon-rgb: 245,158,11; border-color: #f59e0b; color: #b45309; background: rgba(245,158,11,.07); box-shadow: 0 0 4px rgba(245,158,11,.75), 0 0 10px rgba(245,158,11,.45), 0 0 18px rgba(245,158,11,.28); text-shadow: 0 0 6px rgba(245,158,11,.6); }
.project-form-section .form-group:last-child {
    margin-bottom: 0;
}
.project-form-section .pd-wrap {
    width: 100%;
    overflow: hidden;
}
.project-form-section .pd-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    margin-bottom: 10px;
}
.project-form-section .pd-table .pd-seq-col,
.project-form-section .pd-table .pd-seq { width: 5%; text-align: center; font-weight: 700; }
.project-form-section .pd-table th { text-align: center; }
.project-form-section .pd-table th:nth-child(1) { width: 5%; }
.project-form-section .pd-table th:nth-child(2) { width: 19%; }
.project-form-section .pd-table th:nth-child(3) { width: 13%; }
.project-form-section .pd-table th:nth-child(4) { width: 11%; }
.project-form-section .pd-table th:nth-child(5) { width: 10%; }
.project-form-section .pd-table th:nth-child(6) { width: 14%; }
.project-form-section .pd-table th:nth-child(7) { width: 10%; }
.project-form-section .pd-table th:nth-child(8) { width: 14%; }
.project-form-section .pd-table th:nth-child(9) { width: 4%; }
.project-form-section .pd-table th,
.project-form-section .pd-table td { padding: 5px 4px; overflow: visible; text-align: center; }
.project-form-section .pd-table .pd-input { min-width: 0; padding: 6px 5px; font-size: 12px; text-align: center; }
.project-form-section .pd-table .pd-input.pd-auto { background: #f2f3f5; border-color: #e3e6ea; color: var(--text-secondary, #6b7280); cursor: default; font-weight: 400; text-align: center; }
.product-ref-field { position: relative; display: flex; align-items: center; }
.product-ref-field .pd-input { flex: 1 1 auto; min-width: 0; padding-right: 26px; }
.product-ref-toggle { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 20px; height: 22px; border: none; background: transparent; color: var(--text-secondary, #6b7280); cursor: pointer; font-size: 12px; line-height: 1; padding: 0; }
.product-ref-toggle:hover { color: var(--primary, #3b6cff); }
.product-ref-field .product-ref-dropdown { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 50; margin: 0; padding: 4px 0; list-style: none; background: #fff; border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 10px); box-shadow: 0 6px 18px rgba(31, 35, 41, .12); max-height: 220px; overflow-y: auto; }
.product-ref-field .product-ref-dropdown .product-ref-option { padding: 7px 12px; font-size: 13px; cursor: pointer; color: var(--text-primary, #1f2329); display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.product-ref-field .product-ref-dropdown .product-ref-option:hover { background: var(--primary-bg, #eef2ff); color: var(--primary, #3b6cff); }
.product-ref-sub { font-size: 11px; color: var(--text-tertiary, #9aa1ac); }
.product-ref-field .product-ref-dropdown .product-ref-option:hover .product-ref-sub { color: var(--primary, #3b6cff); }
.product-ref-portal { position: fixed; z-index: 2147483646; margin: 0; padding: 4px 0; list-style: none; background: #fff; border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 10px); box-shadow: 0 8px 24px rgba(31, 35, 41, .18); min-width: 180px; max-width: min(420px, 96vw); width: auto; box-sizing: border-box; max-height: 240px; overflow-y: auto; }
.product-ref-portal[hidden] { display: none; }
.product-ref-portal .product-ref-option { padding: 7px 12px; font-size: 13px; cursor: pointer; color: var(--text-primary, #1f2329); display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.product-ref-portal .product-ref-option:hover { background: var(--primary-bg, #eef2ff); color: var(--primary, #3b6cff); }
.product-ref-portal .product-ref-sub { font-size: 11px; color: var(--text-tertiary, #9aa1ac); }
.product-ref-portal .product-ref-option:hover .product-ref-sub { color: var(--primary, #3b6cff); }
.product-ref-portal .product-ref-empty { padding: 10px 12px; font-size: 13px; color: var(--text-tertiary, #9aa1ac); }
.project-form-section .pd-table td:nth-child(4) .pd-input,
.project-form-section .pd-table td:nth-child(5) .pd-input { text-align: center; }
.project-form-section .pd-table .pd-delete-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; min-width: 28px; height: 30px; min-height: 30px; padding: 0; overflow: hidden; color: var(--danger); background: #fff; border-color: #f2c0c5; font-size: 19px; line-height: 1; }
.project-form-section .pd-table .pd-delete-btn:hover { color: #fff; background: var(--danger); border-color: var(--danger); }
.pd-discount-input { position: relative; }
.pd-discount-input .pd-input { padding-right: 25px; text-align: center; }
.pd-discount-input span { position: absolute; top: 50%; right: 9px; color: var(--text-tertiary); transform: translateY(-50%); pointer-events: none; }
.project-form-section .pd-table .pd-input.pd-price,
.project-detail-modal .pd-table .pd-input.pd-price {
    color: #f59e0b;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.project-balance-field {
    max-width: calc(50% - 8px);
}
.project-balance-field .form-control[readonly] {
    background: #f8fafc;
    color: var(--primary);
    font-weight: 700;
}

.cal-more {
    font-size: 11px;
    color: var(--text-tertiary, #94a3b8);
    text-align: center;
    line-height: 1.4;
    cursor: pointer;
    flex-shrink: 0;
    user-select: none;
    padding: 1px 6px;
    border-radius: 4px;
}
.cal-more:hover { color: var(--primary); background: rgba(59, 130, 246, .08); }

.cal-event {
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 4px;
}

.cal-event:hover {
    transform: translateX(2px);
    box-shadow: var(--shadow-sm);
}

/* 月视图单元格事件超出：最后一行省略号，点击单元格查看当日全部 */
.cal-event-time {
    font-weight: 600;
    flex-shrink: 0;
}

.cal-event.ev-won {
    background: var(--success-bg);
    color: var(--success);
    border-left: 3px solid var(--success);
}

.cal-event.ev-lost {
    background: var(--danger-bg);
    color: var(--danger);
    border-left: 3px solid var(--danger);
}

.cal-event.ev-pending {
    background: var(--warning-bg);
    color: var(--warning);
    border-left: 3px solid var(--warning);
}

.cal-event.ev-making {
    background: #fef2f2;
    color: #dc2626;
    border-left: 3px solid #ef4444;
}

.cal-event.ev-invalid {
    background: var(--bg-secondary);
    color: var(--text-secondary);
    border-left: 3px solid var(--text-tertiary);
}

.cal-event.ev-delivered {
    background: #eff6ff;
    color: #2563eb;
    border-left: 3px solid #3b82f6;
}

.cal-event.ev-docking {
    background: #f0fdf4;
    color: #16a34a;
    border-left: 3px solid #22c55e;
}

.cal-event.ev-cancelled {
    background: #f9fafb;
    color: #6b7280;
    border-left: 3px solid #9ca3af;
}

/* 客户管理 */
.page-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.tabs {
    display: flex;
    border-bottom: 1px solid var(--border);
    background: var(--bg-secondary);
}

.tab-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}

.tab-item:hover {
    color: var(--primary);
    background: rgba(67, 97, 238, 0.04);
}

.tab-item.active {
    color: var(--primary);
    background: var(--surface);
    border-bottom-color: var(--primary);
}

.tab-icon {
    font-size: 15px;
}

.tab-content {
    padding: 20px;
}

.page-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.toolbar-left {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.toolbar-right {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.search-box {
    position: relative;
    min-width: 220px;
}

.search-box .search-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-tertiary);
    font-size: 13px;
    pointer-events: none;
}

.search-box .form-control {
    padding-left: 32px;
}

.data-table-wrap {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow-x: auto;
    background: var(--surface);
}

.data-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 13px;
}

.data-table thead th {
    background: var(--bg-secondary);
    color: var(--text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
    user-select: none;
    position: relative;
}

/* Shared column resize affordance for all secondary-menu tables. */
.column-resizer {
    position: absolute;
    top: 0;
    right: -3px;
    width: 7px;
    height: 100%;
    cursor: col-resize;
    z-index: 5;
    touch-action: none;
}
.column-resizer:hover,
.column-resizer:active { background: color-mix(in srgb, var(--primary, #2563eb) 45%, transparent); }

.schema-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
    padding: 10px 12px;
    margin-bottom: 10px;
    background: #f7f9fc;
    border: 1px solid #dfe5ec;
    border-radius: 6px;
}
.schema-filter-item {
    display: flex;
    min-width: 150px;
    flex: 0 1 190px;
    flex-direction: column;
    gap: 4px;
    color: var(--text-secondary);
    font-size: 12px;
}
.schema-filter-control { width: 100%; min-height: 34px; }
.schema-filter-reset { min-height: 34px; }

/* Sorting is intentionally disabled across submenu tables. */
.data-table thead th[data-sort] { cursor: default; }
.data-table thead th[data-sort]:hover {
    color: inherit;
    background: inherit;
}

.data-table thead th[data-sort] {
    cursor: pointer;
    transition: color 0.15s;
}

.data-table thead th[data-sort]:hover {
    color: var(--primary);
}

.data-table thead th .sort-arrow {
    display: inline-block;
    margin-left: 4px;
    font-size: 10px;
    opacity: 0.3;
    vertical-align: middle;
    transition: opacity 0.15s;
}

.data-table thead th.active-sort .sort-arrow {
    opacity: 1;
    color: var(--primary);
}

.data-table thead th .sort-main {
    font-size: 11px;
    margin-left: 2px;
    color: var(--primary);
    font-weight: 700;
}

.data-table tbody td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border-light);
    color: var(--text-primary);
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 1px;
}

.data-table tbody td .cell-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

/* 确保 td 内所有子元素都被强制截断 */
.data-table tbody td > * {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

/* 排除表单控件和操作按钮 */
.data-table tbody td input[type="checkbox"] {
    max-width: none;
    overflow: visible;
    white-space: normal;
}
.data-table tbody td .btn-icon {
    max-width: none;
    overflow: visible;
    white-space: normal;
}
.data-table tbody td .detail-icon-btn {
    max-width: none;
    overflow: visible;
    white-space: normal;
}

.data-table tbody tr:hover {
    background: var(--bg-secondary);
    cursor: pointer;
    box-shadow: inset 3px 0 0 var(--primary);
}

.data-table tbody tr:last-child td {
    border-bottom: none;
}

.data-table .col-check {
    width: 76px;
    text-align: center;
    min-width: 76px;
    white-space: nowrap;
    position: sticky;
    left: 0;
    z-index: 2;
    overflow: visible;
}

/* 表头勾选列「全选」字段名（与复选框同行横排） */
.data-table thead .col-check {
    white-space: nowrap;
    z-index: 4;
    background: var(--bg-secondary);
    border-right: 1px solid #dbe2ea;
}

/* 冻结勾选列背景：跟随斑马纹与 hover，避免横向滚动时内容透出 */
.data-table tbody td.col-check {
    background: var(--surface);
}
.data-table tbody tr:nth-child(even) td.col-check {
    background: #fafbfd;
}
.data-table tbody tr:hover td.col-check {
    background: var(--bg-secondary);
}

.data-table thead .col-check input[type="checkbox"] {
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}

.col-check-label {
    display: inline-block;
    margin-left: 4px;
    vertical-align: middle;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    color: inherit;
    user-select: none;
}

/* 第一列「全选」右侧的详情图标（点击打开弹窗详情页） */
.detail-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-left: 6px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: #fff;
    color: var(--primary);
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    vertical-align: middle;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.detail-icon-btn:hover {
    background: var(--primary-bg);
    border-color: var(--primary);
    box-shadow: 0 1px 3px rgba(59,108,255,.18);
}
td.col-check { cursor: default; }

.data-table .col-action {
    width: 90px;
    min-width: 90px;
    white-space: nowrap;
    overflow: visible;
}

.data-table .col-center {
    text-align: center;
}

.data-table .col-left {
    text-align: left;
}

/* 固资表：详情列表头/内容强制左对齐（防浏览器 th 默认居中及潜在覆盖） */
#assetTable th.col-left,
#assetTable td.col-left {
    text-align: left !important;
}

/* 成本到期提示标识（首列选框右侧，绝对定位垂直居中，选框保持水平居中） */
.data-table .expiry-badge {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    padding: 0 6px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}
.data-table .expiry-soon {
    color: #1a7f37;
    background: #e8f6ec;
    border: 1px solid #b6e0c2;
}
.data-table .expiry-expired {
    color: #c0392b;
    background: #fdecea;
    border: 1px solid #f3c0c0;
}

/* 批量删除工具栏 */
.bulk-delete-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: #fff3f3;
    border: 1px solid #ffcccc;
    border-radius: var(--radius-md);
    margin-bottom: 16px;
    font-size: 13px;
}

.bulk-delete-bar .count {
    color: var(--danger);
    font-weight: 700;
}

.bulk-delete-bar .btn-danger-sm {
    padding: 6px 16px;
    font-size: 13px;
    background: var(--danger);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.bulk-delete-bar .btn-danger-sm:hover {
    background: #d32f2f;
}

.bulk-delete-bar .btn-cancel-sm {
    padding: 6px 14px;
    font-size: 13px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
    border: 1px solid var(--border);
    border-radius: 6px;
    cursor: pointer;
}

.bulk-delete-bar .btn-secondary-sm {
    padding: 6px 14px;
    font-size: 13px;
    background: #fff;
    color: var(--primary);
    border: 1px solid var(--primary);
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.bulk-delete-bar .btn-secondary-sm:hover {
    background: var(--primary);
    color: #fff;
}

.data-table .empty-cell {
    text-align: center;
    color: var(--text-tertiary);
    padding: 40px 20px;
}

/* ===== 共享：斑马纹 + 竖向/横向分割线 + 吸顶表头（公海/合作客户 与 全部列表模块统一） ===== */
.data-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    border-right: 1px solid #dbe2ea;
}
.data-table tbody td {
    border-right: 1px solid #dbe2ea;
}
/* 横向分割线（行下边框）已存在，这里加粗末行与表头区分 */
.data-table tbody tr:nth-child(even) td {
    background: #fafbfd;
}
.data-table tbody tr:hover td {
    background: var(--bg-secondary);
}
/* 滚动容器：固定表头、中间滚动。配合 max-height 实现固定字段行 */
.data-table-wrap.table-scroll {
    max-height: calc(100vh - 300px);
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
}

/* List pages use the table viewport for vertical scrolling; the page itself
   stays fixed so toolbars and pagination do not move away. */
#pageContainer:has(table) {
    min-height: 0;
    overflow: hidden;
}
#pageContainer:has(table) .data-table-wrap,
#pageContainer:has(table) .table-wrap {
    max-height: calc(100vh - 250px);
    overflow: auto;
}

/* Freeze table headers while the table's own vertical scrollbar moves. */
.data-table-wrap.table-scroll > table > thead > tr:first-child > th,
.table-wrap > table > thead > tr:first-child > th {
    position: sticky;
    top: 0;
    z-index: 7;
    background: var(--bg-secondary, #f3f5f7);
}
.data-table-wrap.table-scroll > table > thead > tr:not(:first-child) > th,
.table-wrap > table > thead > tr:not(:first-child) > th {
    position: sticky;
    top: 42px;
    z-index: 6;
    background: var(--bg-secondary, #f3f5f7);
}
/* 列表页统一顶部工具条（仅右侧按钮） */
.list-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
/* 列表页底部固定分页栏（与滚动表格拼接成一个卡片） */
.list-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--border);
    border-top: none;
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    background: var(--surface);
    margin-top: 0;
}
.list-footer .footer-left { color: var(--text-secondary); font-size: 13px; }
.list-footer .footer-right { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.page-size-label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-secondary); }
.page-size-label .form-control { width: auto; min-width: 70px; }
.pager { display: inline-flex; align-items: center; gap: 8px; }
.page-indicator { font-size: 13px; color: var(--text-secondary); white-space: nowrap; }
.customer-table th,
.customer-table td {
    white-space: nowrap;
}

.customer-name {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 2px;
}

.customer-level-badge {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}

.customer-level-badge.level-A { background: #f59e0b; }
.customer-level-badge.level-B { background: #3b82f6; }
.customer-level-badge.level-C { background: #10b981; }
.customer-level-badge.level-D { background: #6b7280; }

.name-text {
    font-weight: 600;
    color: var(--text-primary);
}

.customer-type {
    font-size: 12px;
    color: var(--text-tertiary);
}

.seal-tag {
    display: inline-block;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--success-bg);
    color: var(--success);
    border: 1px solid var(--success);
}

.seal-tag.empty {
    background: var(--bg-secondary);
    color: var(--text-tertiary);
    border-color: var(--border);
}

.type-tag {
    display: inline-block;
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 4px;
    background: var(--primary-bg);
    color: var(--primary);
    font-weight: 600;
    border: 1px solid var(--primary-border);
}

.contact-count-badge {
    display: inline-block;
    font-size: 13px;
    padding: 3px 10px;
    border-radius: 12px;
    color: var(--text-tertiary);
    cursor: default;
    transition: all 0.15s;
}

.contact-count-badge.has-contacts {
    background: var(--primary-bg);
    color: var(--primary);
    font-weight: 600;
    cursor: pointer;
    border: 1px solid var(--primary-border);
}

.contact-count-badge.has-contacts:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* 联系人客户池标识（公海客户 / 合作客户） */
.lib-badge {
    display: inline-block;
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 4px;
    font-weight: 600;
    border: 1px solid transparent;
    white-space: nowrap;
}

.lib-badge.lib-public {
    background: #eff6ff;
    color: #2563eb;
    border-color: #bfdbfe;
}

.lib-badge.lib-cooperate {
    background: #f0fdf4;
    color: #16a34a;
    border-color: #bbf7d0;
}

.lib-badge.lib-none {
    background: var(--bg-secondary);
    color: var(--text-tertiary);
    border-color: var(--border);
}

.level-label {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
}

.contact-name {
    color: var(--primary);
    font-weight: 600;
}

.link-text {
    color: var(--primary);
    text-decoration: none;
}

.link-text:hover {
    text-decoration: underline;
}

.table-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 12px 0 0;
    color: var(--text-secondary);
    font-size: 13px;
}

.btn-icon {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px 6px;
    font-size: 14px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
}

.btn-icon:hover {
    background: var(--bg-secondary);
}

.form-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-primary);
    cursor: pointer;
}

.form-check input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.required {
    color: var(--danger);
}

/* 客户详情弹窗 */
.modal.modal-xl { max-width: 1180px; }

.customer-detail-modal {
    width: min(1400px, calc(100vw - 40px));
    height: 100vh;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
}
/* 项目详情弹窗：右侧抽屉化（贴合页面右侧、固定外框，参考公海客户详情页） */
.project-detail-modal {
    width: min(1180px, 94vw);
    height: 100vh;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
}
.project-detail-modal .modal-header { display: none; }
.project-detail-modal .modal-body {
    background: #f6f8fb; padding: 0; flex: 1; min-height: 0;
    display: flex; flex-direction: column; overflow: hidden;
}
/* 左侧导航行高加大（行号/行高） */
.project-detail-modal .cd-nav-list { padding: 16px 10px; }
.project-detail-modal .cd-nav-item {
    padding: 13px 10px 13px 24px; min-height: 46px; font-size: 14px; line-height: 1.35;
}
.standard-detail-modal { width: min(1400px, calc(100vw - 40px)); }

/* 详情弹窗隐藏原生标题栏，由 body 内名片区接管 */
.customer-detail-modal .modal-header { display: none; }
.customer-detail-modal .modal-body {
    background: #f6f8fb;
    padding: 0;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--radius-lg);
}

/* ===== 客户详情弹窗：四区布局 ===== */
.cd-layout { display: flex; flex: 1; flex-direction: column; min-height: 0; height: 100%; }

.cd-header {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; padding: 16px 20px;
    background: var(--surface); border-bottom: 1px solid var(--border);
}
.cd-header-left { display: flex; flex: 1 1 auto; align-items: center; gap: 12px; min-width: 0; overflow: hidden; }
.cd-company { display: flex; flex: 1 1 auto; align-items: center; gap: 10px; min-width: 0; overflow: hidden; }
.cd-company .type-tag { flex: 0 0 auto; }
.cd-company h2 { min-width: 0; max-width: 100%; font-size: 18px; font-weight: 700; color: var(--text); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-nav-btn {
    width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--bg-secondary); color: var(--text); font-size: 18px; line-height: 1;
    cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.cd-nav-btn:hover:not(:disabled) { background: var(--border-light); }
.cd-nav-btn:disabled { opacity: .4; cursor: not-allowed; }
.cd-nav-group { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.customer-detail-modal .cd-header-left > .cd-nav-group { margin-right: clamp(36px, calc(3vw + 12px), 56px); }
.cd-header-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

/* 详情弹窗主体：竖向整体 + 横向三栏（左导航 + 中内容 + 右摘要） */
.cd-body { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.customer-detail-modal .cd-body { flex-direction: row; align-items: stretch; }
/* 公海客户详情：上下堆叠（客户详情占满整宽在上，联系人在下） */
.customer-detail-modal .cd-body.cd-public-stack { flex-direction: column; align-items: stretch; gap: 0; padding: 16px 20px; overflow: auto; }
.customer-detail-modal .cd-public-stack .cd-stack-block { width: 100%; min-width: 0; }
.customer-detail-modal .cd-public-stack .cd-stack-customer { padding-bottom: 16px; border-bottom: 1px solid var(--border); margin-bottom: 16px; }
.customer-detail-modal .cd-public-stack .cd-stack-contacts { padding-top: 0; }
.cd-form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }
.cd-left-nav {
    position: relative;
    width: 150px; flex-shrink: 0; background: var(--surface);
    border-right: 1px solid var(--border);
    display: flex; flex-direction: column; overflow: hidden;
}
.cd-nav-list {
    flex: 1; min-height: 0; overflow-y: auto; padding: 12px 10px;
    position: relative;
}
.cd-nav-list::before {
    content: ''; position: absolute; left: 39px; z-index: 1;
    top: var(--rail-top, 22px); height: calc(var(--rail-bottom, 200px) - var(--rail-top, 22px));
    width: 2px; background: #c8ccd6;
}
.cd-nav-item {
    position: relative; display: flex; align-items: center; gap: 8px;
    padding: 7px 8px 7px 24px; border: none; background: none; cursor: pointer;
    font-size: 13px; line-height: 1.2; color: var(--text-secondary); border-radius: 8px;
    font-weight: 500; text-align: left; width: 100%; white-space: nowrap;
}
.cd-nav-item:hover { background: var(--bg-secondary); color: var(--text); }
.cd-nav-item.active {
    background: var(--primary-soft, #ecf1ff); color: #1f3a8a; font-weight: 700;
    box-shadow: inset 3px 0 0 #1f3a8a;
}
.cd-nav-item .nav-label { color: inherit; font-weight: inherit; font-size: inherit; padding: 0; }
.nav-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-count {
    margin-left: auto; flex-shrink: 0; min-width: 20px; height: 20px; padding: 0 6px;
    border-radius: 10px; background: var(--bg-secondary); color: var(--text-secondary);
    font-size: 12px; line-height: 20px; text-align: center; font-weight: 600;
}
.cd-nav-item.active .nav-count { background: rgba(59,108,255,.12); color: var(--primary); }
.nav-dot {
    width: 10px; height: 10px; border-radius: 50%;
    background: #c8ccd6; border: 2px solid var(--surface); flex-shrink: 0; z-index: 2;
}
.cd-nav-item.active .nav-dot { background: #1f3a8a; }
.cd-nav-config { flex-shrink: 0; padding: 10px; border-top: 1px solid var(--border); background: var(--surface); position: relative; }
.cd-config-btn {
    width: 100%; padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px;
    background: var(--bg-secondary); color: var(--text-secondary); cursor: pointer;
    font-size: 13px; display: flex; align-items: center; justify-content: center; gap: 6px;
}
.cd-config-btn:hover { background: var(--border-light); color: var(--text); }
.cd-nav-settings-menu {
    position: absolute; bottom: calc(100% + 6px); left: 10px; right: 10px;
    background: var(--surface); border: 1px solid var(--border); border-radius: 8px;
    box-shadow: var(--shadow-md); padding: 8px; display: none; flex-direction: column; gap: 4px; z-index: 20;
    max-height: 320px; overflow-y: auto;
}
.cd-nav-settings-menu button:not(.nav-cfg-move) {
    border: 1px solid var(--border); background: var(--surface); padding: 8px 10px; border-radius: 6px;
    font-size: 13px; color: var(--text); cursor: pointer; text-align: left;
}
.cd-nav-settings-menu button:not(.nav-cfg-move):hover { background: var(--bg-secondary); color: var(--primary); }
.nav-cfg-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 12px; font-weight: 700; color: var(--text-secondary); padding: 2px 4px 6px; }
.nav-cfg-head span { color: var(--text-tertiary); font-size: 10px; font-weight: 500; }
.nav-cfg-row { display: flex; align-items: center; gap: 7px; min-height: 32px; padding: 3px 4px; border: 1px solid transparent; border-radius: 6px; transition: background .15s ease, border-color .15s ease; }
.nav-cfg-row.is-dragging { opacity: .45; }
.nav-cfg-row.is-drag-over { background: #eff6ff; border-color: #93c5fd; }
.nav-cfg-drag { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 24px; flex-shrink: 0; color: #94a3b8; font-size: 16px; line-height: 1; cursor: grab; user-select: none; }
.nav-cfg-drag:hover { color: var(--primary); background: #eff6ff; border-radius: 4px; }
.nav-cfg-drag:active { cursor: grabbing; }
.nav-cfg-move {
    width: 22px; height: 22px; flex-shrink: 0; border: 1px solid var(--border); border-radius: 5px;
    background: var(--surface); cursor: pointer; font-size: 12px; line-height: 1;
    color: var(--text-secondary); display: flex; align-items: center; justify-content: center;
}
.nav-cfg-move:hover { background: var(--bg-secondary); color: var(--primary); }
.nav-cfg-move-disabled { opacity: .35; border-color: transparent; cursor: default; }
.nav-cfg-move-disabled:hover { background: none; color: var(--text-secondary); }
.nav-cfg-label {
    flex: 1; display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.nav-cfg-divider { height: 1px; background: var(--border); margin: 4px 0; }

/* 右主区：中间内容区（横向三栏布局的右侧主体） */
.cd-main { display: flex; gap: 16px; padding: 16px 20px; align-items: stretch; flex: 1; min-width: 0; min-height: 0; }
.cd-content {
    position: relative; flex: 1; min-width: 0; min-height: 0; overflow: auto;
    background: var(--surface); border: 1px solid var(--border-light);
    border-radius: var(--radius-md); padding: 16px;
}
.contact-detail-table-wrap { position: relative; overflow: auto; }
.contact-detail-table { min-width: 720px; }
.contact-detail-table th,
.contact-detail-table td { text-align: center !important; vertical-align: middle; }
.contact-detail-table .contact-index { width: 64px; min-width: 64px; position: sticky !important; left: 0; z-index: 3; background: var(--surface); box-shadow: 1px 0 0 var(--border), 8px 0 12px rgba(15,23,42,.04); }
.contact-detail-table thead .contact-index { z-index: 6; background: var(--bg-secondary); }
.contact-detail-table .col-action { width: var(--action-col-w, 116px); min-width: var(--action-col-w, 116px); white-space: nowrap; }
.contact-detail-table .contact-action-sticky { position: sticky !important; right: 0; z-index: 3; background: var(--surface); box-shadow: -1px 0 0 var(--border), -8px 0 12px rgba(15,23,42,.04); }
.contact-detail-table thead .contact-action-sticky { z-index: 6; background: var(--bg-secondary); }
.contact-detail-table .contact-name-link { display: block; width: 100%; text-align: center; }
.customer-detail-data-table-wrap { position: relative; overflow: auto; }
.customer-detail-data-table { min-width: 720px; }
.customer-detail-data-table th,
.customer-detail-data-table td { text-align: center !important; vertical-align: middle; }
.customer-detail-data-table .detail-table-index { width: 64px; min-width: 64px; position: sticky !important; left: 0; z-index: 3; background: var(--surface); box-shadow: 1px 0 0 var(--border), 8px 0 12px rgba(15,23,42,.04); }
.customer-detail-data-table thead .detail-table-index { z-index: 6; background: var(--bg-secondary); }
.customer-detail-data-table .col-action { width: var(--action-col-w, 116px); min-width: var(--action-col-w, 116px); white-space: nowrap; }
.customer-detail-data-table .detail-action-sticky { position: sticky !important; right: 0; z-index: 3; background: var(--surface); box-shadow: -1px 0 0 var(--border), -8px 0 12px rgba(15,23,42,.04); }
.customer-detail-data-table thead .detail-action-sticky { z-index: 6; background: var(--bg-secondary); }

/* 操作列可拖拽调节列宽手柄（合作/公海详情页通用） */
.data-table th.col-action { position: relative; }
.data-table th.col-action::after {
  content: ''; position: absolute; top: 0; right: 0; width: 9px; height: 100%;
  cursor: col-resize; z-index: 4;
}
.data-table th.col-action:hover::after { background: rgba(47,148,237,.18); }

.customer-detail-data-table .cell-content { display: block; width: 100%; text-align: center; }
.contact-field-config-panel {
    display: none; position: absolute; top: 58px; right: 16px; z-index: 30;
    width: 230px; max-height: 360px; overflow-y: auto; padding: 9px;
    border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
    box-shadow: var(--shadow-md);
}
.contact-field-config-panel.is-open { display: block; }
.customer-detail-summary .summary-alert-label { color: #991b1b; }
/* 右侧客户摘要独立第三栏（参考图布局） */
.cd-sidebar { width: 280px; flex-shrink: 0; min-height: 0; overflow: auto; padding: 16px 16px 16px 16px; border-left: 1px solid var(--border); }

.cd-section-title { font-size: 15px; font-weight: 600; margin: 0 0 12px; color: var(--text); }
.cd-sub-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.cd-sub-toolbar .cd-section-title { margin: 0; }
.cd-sub-toolbar .btn-config-field { margin-left: auto; }

.cd-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.cd-info-item { display: flex; flex-direction: column; gap: 4px; }
.cd-info-full { grid-column: 1 / -1; }
.contact-detail-info-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 20px; }
.contact-detail-info-grid .contact-email { grid-column: span 2; }
.contact-modal-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 16px;
}
.contact-modal-grid .form-group { min-width: 0; margin-bottom: 0; }
.contact-modal-grid .contact-span-2 { grid-column: span 2; }
.contact-modal-grid .contact-span-4 { grid-column: 1 / -1; }
/* 老家：省份→城市 联动下拉 */
.region-field { display: flex; gap: 8px; }
.region-field select { flex: 1; min-width: 0; }
/* 联系人创建/编辑弹窗：套 customer-detail-modal 使 modal-body padding=0，给独立 cd-section 补内边距，避免内容贴边 */
.contact-modal-section { padding: 18px 22px; }
.birthday-combined {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 6px;
}
.birthday-combined .form-control { min-width: 0; padding-left: 7px; padding-right: 7px; }
.birthday-editor {
    position: relative;
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    align-items: center;
    min-width: 0;
    height: 40px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--surface);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.birthday-editor:focus-within { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(59,108,255,.12); }
.birthday-calendar-toggle {
    position: relative;
    width: 62px;
    height: 28px;
    margin-left: 4px;
    padding: 0 21px 0 6px;
    border: 0;
    border-radius: 16px;
    background: #2f94ed;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .18s ease;
}
.birthday-calendar-toggle i {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15,23,42,.2);
    transition: transform .18s ease;
}
.birthday-editor.is-lunar .birthday-calendar-toggle { padding: 0 6px 0 21px; background: #12c987; }
.birthday-editor.is-lunar .birthday-calendar-toggle i { transform: translateX(-34px); }
.birthday-date-value {
    min-width: 0;
    height: 38px;
    padding: 0 29px 0 6px;
    border: 0;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.birthday-date-value span { display: block; overflow: hidden; text-overflow: ellipsis; }
.birthday-date-value b {
    position: absolute;
    right: 9px;
    top: 12px;
    width: 15px;
    height: 14px;
    border: 1.5px solid #475569;
    border-radius: 2px;
}
.birthday-date-value b::before {
    content: '';
    position: absolute;
    left: -1.5px;
    right: -1.5px;
    top: 3px;
    border-top: 1.5px solid #475569;
}
.birthday-date-value b::after {
    content: '';
    position: absolute;
    left: 3px;
    top: -3px;
    width: 6px;
    height: 3px;
    border-left: 1.5px solid #475569;
    border-right: 1.5px solid #475569;
}
.birthday-solar-picker { position: absolute; width: 1px; height: 1px; right: 12px; bottom: 3px; opacity: 0; pointer-events: none; }
.birthday-lunar-picker {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 40;
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 6px;
    width: min(330px, 90vw);
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--surface);
    box-shadow: var(--shadow-md);
}
.birthday-lunar-picker[hidden] { display: none; }
.birthday-lunar-picker select { min-width: 0; height: 34px; border: 1px solid var(--border); border-radius: 5px; background: #fff; padding: 0 6px; color: var(--text-primary); }
.cd-info-label { font-size: 12px; color: #475569; font-weight: 700; }
.customer-detail-modal .cd-info-label::after { content: "："; }
.cd-info-value { font-size: 14px; color: var(--text); word-break: break-word; }

.cd-form .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.cd-form .form-group { margin-bottom: 0; }
.cd-form .form-group-full { grid-column: 1 / -1; }
.cd-form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

.customer-detail-summary .summary-placeholder .summary-value { color: #cbd5e1; }

/* 客户类型标签配色 */
.type-tag.type-purchaser { background: #e8f1ff; color: #1769e0; border: 1px solid #b9d5ff; }
.type-tag.type-agent { background: #e8f8ee; color: #14843d; border: 1px solid #b9e8c9; }
.type-tag.type-supplier { background: #fff3df; color: #b86100; border: 1px solid #f3d3a0; }

/* 客户类型自定义色块下拉（详情弹窗 + 菜单表单共用，配色复用 .type-tag） */
.customer-type-select { position: relative; }
.customer-type-trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: pointer; text-align: left; padding-right: 30px; background: #fff; }
.customer-type-trigger .type-tag { margin: 0; }
.customer-type-caret { margin-left: 8px; font-size: 10px; opacity: .65; transition: transform .15s ease; flex-shrink: 0; }
.customer-type-select.open .customer-type-caret { transform: rotate(180deg); }
.customer-type-menu { position: absolute; top: calc(100% + 5px); left: 0; right: 0; z-index: 60; margin: 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(15, 23, 42, .18); max-height: 248px; overflow: auto; }
.customer-type-item { display: flex; align-items: center; padding: 8px 10px; border-radius: 7px; cursor: pointer; }
.customer-type-item:hover { filter: brightness(.97); }
.customer-type-item .type-tag { margin: 0; }

.customer-detail-body {
    display: flex;
    gap: 24px;
}

.customer-detail-main {
    flex: 1;
    min-width: 0;
    background: var(--surface);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    padding: 20px;
}

.customer-detail-sidebar {
    width: 280px;
    flex-shrink: 0;
}

.customer-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.customer-detail-title {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.customer-detail-title h2 {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-detail-company-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--primary-bg);
    font-size: 22px;
    flex-shrink: 0;
}

.customer-detail-eyebrow {
    margin-bottom: 2px;
    color: var(--text-tertiary);
    font-size: 12px;
}

.customer-detail-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 14px 16px;
    margin-bottom: 18px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius);
    background: var(--bg-secondary);
}

.customer-detail-highlights div {
    min-width: 0;
}

.customer-detail-highlights span,
.customer-detail-highlights strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-detail-highlights span {
    margin-bottom: 4px;
    color: var(--text-secondary);
    font-size: 12px;
}

.customer-detail-highlights strong {
    color: var(--text-primary);
    font-size: 14px;
}

.customer-detail-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.customer-detail-meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.customer-detail-card {
    background: var(--bg-secondary);
    border-radius: var(--radius);
    padding: 12px;
    min-width: 0;
}

.customer-detail-card .label {
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-detail-card .value {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-detail-contacts {
    margin-top: 20px;
}

.customer-detail-contacts-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.customer-detail-contacts-header h3 {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}

.customer-detail-summary {
    background: var(--surface);
    border: 1px solid var(--border-light);
    border-radius: var(--radius);
    padding: 16px;
    height: 100%;
    box-sizing: border-box;
}

.customer-detail-summary h3 {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.customer-detail-summary .summary-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}
.customer-detail-summary .summary-header h3 { margin: 0; }



/* Public/cooperative customer tables: frozen select-all and centered fields. */
#custTable thead th { text-align: center; }
#custTable thead .col-check {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 12;
    text-align: center;
    background: var(--bg-secondary, #f3f5f7);
}
#custTable tbody .col-check {
    position: sticky;
    left: 0;
    z-index: 3;
    background: var(--surface, #fff);
}
#custTable tbody td:nth-child(3),
#custTable tbody td:nth-child(5),
#custTable tbody td:nth-child(6) { text-align: center; }

/* Contacts table select-all stays fixed at the scroll viewport's top-left. */
#contactTable thead .col-check {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 12;
    text-align: center;
    background: var(--bg-secondary, #f3f5f7);
}
#contactTable tbody .col-check {
    position: sticky;
    left: 0;
    z-index: 3;
    text-align: center;
    background: var(--surface, #fff);
}

/* Center headers and requested data columns in business submenus. */
#productTable thead th, #cmTable thead th, #finTable thead th,
#assetTable thead th, #costTable thead th, #projTable thead th { text-align: center; }
#productTable tbody td:nth-child(2), #productTable tbody td:nth-child(3),
#productTable tbody td:nth-child(4), #productTable tbody td:nth-child(5),
#finTable tbody td:nth-child(2), #finTable tbody td:nth-child(4),
#finTable tbody td:nth-child(5), #finTable tbody td:nth-child(6), #finTable tbody td:nth-child(7),
#assetTable tbody td:nth-child(2), #assetTable tbody td:nth-child(3),
#assetTable tbody td:nth-child(5), #assetTable tbody td:nth-child(6),
#costTable tbody td:nth-child(2), #costTable tbody td:nth-child(4),
#costTable tbody td:nth-child(5), #costTable tbody td:nth-child(6), #costTable tbody td:nth-child(7),
#projTable tbody td:nth-child(2), #projTable tbody td:nth-child(3),
#projTable tbody td:nth-child(5), #projTable tbody td:nth-child(6),
#projTable tbody td:nth-child(10), #projTable tbody td:nth-child(11),
#projTable tbody td:nth-child(12), #projTable tbody td:nth-child(13),
#projTable tbody td:nth-child(15), #projTable tbody td:nth-child(16),
#projTable tbody td:nth-child(17), #projTable tbody td:nth-child(18),
#projTable tbody td:nth-child(19), #projTable tbody td:nth-child(20),
#projTable tbody td:nth-child(21), #projTable tbody td:nth-child(22),
#projTable tbody td:nth-child(23), #projTable tbody td:nth-child(24),
#projTable tbody td:nth-child(25) { text-align: center; }
#costTable thead th:nth-child(2),
#costTable tbody td:nth-child(2),
#costTable tbody td:nth-child(2) .cell-content { text-align: left; }
#projTable tbody td:nth-child(5).project-name-cell,
#projTable tbody .project-name-cell,
#projTable tbody .project-name-cell .project-name-text {
    text-align: left !important;
}
#projTable tbody .project-row-start > td:nth-child(15),
#projTable tbody .project-detail-subrow > td:first-child,
#projTable tbody .project-row-start > td:nth-child(15) .cell-content,
#projTable tbody .project-detail-subrow > td:first-child .cell-content {
    text-align: left !important;
}
#projTable tbody .project-row-start > td:nth-child(18),
#projTable tbody .project-detail-subrow > td:nth-child(4),
#projTable tbody .project-row-start > td:nth-child(18) .cell-content,
#projTable tbody .project-detail-subrow > td:nth-child(4) .cell-content {
    text-align: center !important;
}

.customer-detail-summary .summary-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-light);
    font-size: 13px;
    color: #1d4ed8;
}

.customer-detail-summary .summary-item:last-child {
    border-bottom: none;
}

.customer-detail-summary .summary-item:has(.summary-alert-label) {
    color: #991b1b;
}

.customer-detail-summary .summary-item:has(.summary-ok-label) {
    color: #0a8f60;
}

.customer-detail-summary .summary-label.summary-ok-label {
    color: #0a8f60;
    background: #e4f8f0;
    border-left-color: #12c987;
}

.customer-detail-summary .summary-label {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 8px;
    color: #1d4ed8;
    background: #eff6ff;
    border-left: 3px solid #3b82f6;
    border-radius: 4px;
    font-weight: 400;
}

.customer-detail-summary .summary-label.summary-alert-label {
    color: #991b1b;
    background: #fff1f2;
    border-left-color: #b91c1c;
}

.customer-detail-summary .summary-value {
    font-weight: 400;
    color: inherit;
}

.customer-name-link {
    appearance: none;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    font: inherit;
    color: var(--primary);
    font-weight: 600;
    cursor: pointer;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-name-link:hover {
    text-decoration: underline;
}
.record-detail-link {
    appearance: none;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--primary);
    font: inherit;
    font-weight: 600;
    text-align: inherit;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.record-detail-link:hover { text-decoration: underline; }
.tag-auto {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    font-size: 11px;
    line-height: 1.5;
    font-weight: 600;
    color: #1a7f5a;
    background: rgba(26, 127, 90, 0.12);
    border: 1px solid rgba(26, 127, 90, 0.35);
    border-radius: 4px;
    vertical-align: middle;
}
.data-table th.col-check,
.data-table td.col-check { cursor: pointer; }

/* 响应式 */
@media (max-width: 1200px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-metric-grid.five-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dashboard-row { grid-template-columns: 1fr; }
    .balance-row { grid-template-columns: repeat(2, 1fr); }
    .detail-info-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .sidebar { transform: translateX(-100%); }
    .sidebar.show { transform: translateX(0); }
    .main-content { margin-left: 0; }
    .menu-toggle { display: block; }
    .customer-detail-highlights { grid-template-columns: 1fr; }
    .topbar-search { display: none; }
    .stats-grid { grid-template-columns: 1fr; }
    .dashboard-metric-grid,
    .dashboard-metric-grid.five-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-grid { grid-template-columns: 1fr; }
    .balance-row { grid-template-columns: repeat(2, 1fr); }
    .form-row, .form-row-3 { grid-template-columns: 1fr; }
    .detail-info-grid { grid-template-columns: 1fr; }
    .page-container { padding: 16px; }
    .cal-cell { min-height: 56px; padding: 2px 3px; }
    .cal-event { font-size: 10px; padding: 1px 3px; }
    .cal-event-time { display: none; }
    .calendar-title { font-size: 16px; min-width: 100px; }
    .calendar-year-grid,
    .calendar-past-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .calendar-period-label { min-width: 120px; font-size: 16px; }
    .page-toolbar { flex-direction: column; align-items: stretch; }
    .toolbar-left, .toolbar-right { width: 100%; }
    .toolbar-left .form-control, .search-box { width: 100%; min-width: auto; }
    .tab-content { padding: 14px; }
    .tab-item { padding: 12px 16px; font-size: 13px; }
    .project-status-bar { gap: 8px; }
    .status-bar-item { font-size: 12px; padding: 4px 8px; }
    .customer-detail-body { flex-direction: column; }
    .customer-detail-sidebar { width: 100%; }
    .customer-detail-meta { grid-template-columns: 1fr; }
    .contact-detail-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contact-detail-info-grid .contact-email { grid-column: 1 / -1; }
    .contact-modal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contact-modal-grid .contact-span-4 { grid-column: 1 / -1; }
}

@media (max-width: 480px) {
    .contact-detail-info-grid { grid-template-columns: 1fr; }
    .contact-detail-info-grid .contact-email { grid-column: auto; }
    .contact-modal-grid { grid-template-columns: 1fr; }
    .contact-modal-grid .contact-span-2,
    .contact-modal-grid .contact-span-4 { grid-column: auto; }
    .dashboard-metric-grid,
    .dashboard-metric-grid.five-columns { grid-template-columns: 1fr; }
    .calendar-year-grid,
    .calendar-past-grid { grid-template-columns: 1fr; }
}

/* 滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ============ 电子签章 ============ */
.seal-uploader { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.seal-preview { display: flex; align-items: center; gap: 8px; min-height: 38px; }
.seal-preview img { max-height: 36px; max-width: 120px; border: 1px solid var(--border, #e2e8f0); border-radius: 6px; background: #fff; padding: 2px; object-fit: contain; }
.seal-empty { color: var(--text-secondary, #64748b); font-size: 13px; }
.seal-remove { border: none; background: var(--danger-bg, #fef2f2); color: var(--danger, #dc2626); width: 22px; height: 22px; border-radius: 50%; cursor: pointer; font-size: 12px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.seal-remove:hover { background: var(--danger, #dc2626); color: #fff; }

/* 列表缩略图 */
.col-seal { text-align: center; }
.seal-thumb { max-height: 34px; max-width: 90px; border-radius: 4px; border: 1px solid var(--border, #e2e8f0); background: #fff; padding: 1px; object-fit: contain; cursor: zoom-in; vertical-align: middle; }

/* 详情卡图片 */
.seal-detail-img { max-width: 140px; max-height: 100px; border-radius: 6px; border: 1px solid var(--border, #e2e8f0); background: #fff; padding: 3px; object-fit: contain; cursor: zoom-in; }

/* 放大预览 */
.seal-modal-img { max-width: 100%; max-height: 70vh; border-radius: 8px; border: 1px solid var(--border, #e2e8f0); background: #fff; padding: 6px; }

/* ============ 客户页：上下固定、中间滚动 ============ */
.page-container.is-customer-view { display: flex; flex-direction: column; }
.page-container.is-customer-view .page-card { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.customer-layout .page-toolbar { flex: 0 0 auto; }
.customer-layout .data-table-wrap { flex: 1 1 auto; min-height: 0; overflow: auto; }
.customer-layout .data-table thead th { position: sticky; top: 0; z-index: 2; }
.customer-layout .table-footer {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--border);
    background: var(--surface);
}
.customer-layout .table-footer .total-info { margin: 0; }
.footer-right { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer-left { color: var(--text-secondary); font-size: 13px; }
.page-size-label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-secondary); }
.page-size-label .form-control { width: auto; min-width: 70px; }
.pager { display: inline-flex; align-items: center; gap: 8px; }
.page-indicator { font-size: 13px; color: var(--text-secondary); min-width: 92px; text-align: center; }

/* 多图电子签章 */
.seal-gallery { display: flex; flex-wrap: wrap; gap: 8px; }
.seal-gallery-modal { justify-content: center; }
.seal-preview-item { position: relative; display: inline-flex; }
.seal-preview-item img { max-height: 36px; max-width: 120px; border: 1px solid var(--border, #e2e8f0); border-radius: 6px; background: #fff; padding: 2px; object-fit: contain; }
.seal-preview-item .seal-remove { position: absolute; top: -8px; right: -8px; }
.seal-add-item {
    display: inline-flex; align-items: center; justify-content: center;
    width: 50px; height: 36px; border: 1px dashed #d0d5dd; border-radius: 6px;
    background: #fff; color: #94a3b8; cursor: pointer; transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.seal-add-item:hover { border-color: #3b6cff; background: rgba(59,108,255,0.04); color: #3b6cff; }
.seal-add-icon { font-size: 18px; font-weight: 300; line-height: 1; }
.seal-more { display: inline-block; margin-left: 4px; padding: 1px 6px; font-size: 11px; color: var(--text-secondary); background: var(--bg-secondary); border-radius: 10px; vertical-align: middle; }

/* ===== 联系人列表：表头全部居中 ===== */
#contactTable thead th { text-align: center; }

/* ===== 联系人详情 / 身份证图片 / 生日 ===== */
.contact-name-link { color: var(--primary); cursor: pointer; font-weight: 700; }
.contact-name-link:hover { text-decoration: underline; }
.idcard-thumbs { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.idcard-thumb { width: 56px; height: 36px; object-fit: cover; border: 1px solid var(--border, #e2e8f0); border-radius: 6px; background: #fff; cursor: pointer; }
.idcard-thumb:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
.idcard-preview-item { position: relative; display: inline-flex; }
.idcard-preview-item img { max-height: 60px; max-width: 180px; border: 1px solid var(--border, #e2e8f0); border-radius: 6px; background: #fff; padding: 2px; object-fit: contain; }
.idcard-preview-item .seal-remove { position: absolute; top: -8px; right: -8px; }
/* 生日历法徽标：公历=蓝、农历=绿，与 .birthday-calendar-toggle 开关同色系 */
.birthday-type { display: inline-block; font-size: 11px; font-weight: 600; line-height: 17px; padding: 0 5px; border-radius: 4px; background: #fff7ed; color: #c2410c; margin-right: 2px; }
.birthday-type.is-solar { background: #e8f3fd; color: #1668b8; border: 1px solid #bcdcf8; }
.birthday-type.is-lunar { background: #e4f8f0; color: #0a8f60; border: 1px solid #b3ecd6; }
.seal-upload-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.type-tag.type-contact { background: #eef2ff; color: #4f46e5; }

/* 联系人弹窗：客户池只读显示 + 生日紧凑 + 身份证缩略图缩放 */
.cust-edit-scope .contact-modal-grid .pool-display {
    display: flex; align-items: center;
    min-height: 38px; padding: 0 12px;
    border: 1px solid var(--border, #e2e8f0); border-radius: 8px;
    background: #f7f8fa; color: var(--text-secondary, #64748b); font-size: 14px;
}
.cust-edit-scope .contact-modal-grid .birthday-editor.compact {
    grid-template-columns: 70px minmax(0, 1fr); align-items: center; min-width: 0;
}
.cust-edit-scope .contact-modal-grid .birthday-editor.compact .birthday-calendar-toggle {
    width: 62px; margin: 0 0 0 4px;
}
.cust-edit-scope .contact-modal-grid .birthday-editor.compact .birthday-date-value {
    width: auto;
}
.cust-edit-scope .contact-modal-grid .idcard-preview-item img {
    max-height: 36px; max-width: 120px;
}
.cust-edit-scope .contact-modal-grid .clickable-upload.idcard-upload .seal-preview:empty::after {
    content: '点击上传身份证';
}

/* ===== 日程表：生日事件 + 显示切换 ===== */
.cal-event.cal-birthday { background: #fff7ed; border-left-color: #fb923c; color: #9a3412; cursor: pointer; }
.cal-event.cal-birthday:hover { background: #ffedd5; }
.cal-event-birthday { margin-right: 2px; }
.cal-event-age { flex: 0 0 auto; margin-left: 2px; font-size: 0.92em; font-weight: 600; color: #c2410c; white-space: nowrap; }
.calendar-day-event.cal-birthday { background: #fff7ed; border-left: 3px solid #fb923c; color: #9a3412; cursor: pointer; }
.calendar-toggles { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.cal-toggle-group { display: inline-flex; align-items: center; gap: 6px; }
.cal-toggle {
    padding: 5px 16px; border: 1px solid var(--border, #e2e8f0);
    border-radius: 16px; background: var(--surface, #fff);
    color: var(--text-secondary); font-size: 13px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s;
}
.cal-toggle > span { margin-right: 5px; line-height: 1; }
.cal-toggle:hover { border-color: var(--primary); color: var(--primary); }
.cal-toggle.active { background: #eaf5ff; border-color: #0284c7; color: #075985; }
.cal-toggle-dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; display: inline-block; box-sizing: border-box; background: transparent; box-shadow: none; }
.cal-toggle.has-today .cal-toggle-dot {
    background: radial-gradient(circle at 35% 30%, #fff 0 18%, #ff6b6b 30%, #ef233c 68%, #b5122b 100%);
    border-color: #ff334f;
    box-shadow: 0 0 0 2px rgba(239,35,60,.3), 0 0 6px #ff5a65, 0 0 14px #ef233c, 0 0 26px rgba(255,92,64,.95);
    animation: cal-neon-pulse 1.05s ease-in-out infinite;
}
@keyframes cal-neon-pulse {
    0%, 100% { filter: brightness(.92); box-shadow: 0 0 0 2px rgba(239,35,60,.25), 0 0 6px #ff5a65, 0 0 14px #ef233c, 0 0 22px rgba(255,92,64,.75); }
    50% { filter: brightness(1.3); box-shadow: 0 0 0 4px rgba(239,35,60,.42), 0 0 9px #ff8b94, 0 0 20px #ef233c, 0 0 34px rgba(255,92,64,1); }
}
.account-top-btn { width: 36px; height: 36px; padding: 0; color: #2563eb; border: 1px solid #93c5fd; border-radius: 7px; background: #eff6ff; font-size: 18px; }
.sidebar-nav { padding-bottom: 24px; }

/* 三板块布局：顶部栏、侧边导航、内容区明确分界 */
:root { --topbar-height: 56px; }
.topbar {
    height: var(--topbar-height);
    min-height: var(--topbar-height);
    background: #ffffff;
    border-bottom: 2px solid #cbd5e1;
    box-shadow: 0 1px 3px rgba(15,23,42,.08);
}
.sidebar-header {
    top: var(--topbar-height);
    border-right: 2px solid #334e68;
    border-bottom: 1px solid #334e68;
}
.sidebar {
    top: var(--topbar-height);
    height: calc(100vh - var(--topbar-height));
    border-right: 2px solid #334e68;
}
.main-content { padding-top: var(--topbar-height); }
.page-container {
    border-left: 1px solid #dbe3eb;
    background: #f8fafc;
}

/* ===== 我的日历：顶部工具条（标题 / 日期 / 视图切换） ===== */
.calendar-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    flex-wrap: wrap;
}
.cal-toolbar-left { flex: 0 0 auto; display: flex; align-items: center; }
.cal-module-title { font-size: 17px; font-weight: 700; color: var(--text-primary); white-space: nowrap; }
.cal-toolbar-center { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; }
.cal-toolbar-right { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; }
.cal-toolbar-center .nav-arrow {
    width: 30px; height: 30px; border-radius: 8px;
    border: 1px solid var(--border, #e2e8f0); background: #fff;
    cursor: pointer; font-size: 18px; line-height: 1; color: var(--text-secondary);
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s;
}
.cal-toolbar-center .nav-arrow:hover { border-color: var(--primary); color: var(--primary); }
.calendar-period-label { font-size: 15px; font-weight: 600; min-width: 130px; text-align: center; color: var(--text-primary); }
.cal-view-btn {
    padding: 6px 14px; border: 1px solid var(--border, #e2e8f0);
    background: #fff; border-radius: 8px; font-size: 13px;
    color: var(--text-secondary); cursor: pointer; transition: all .15s;
    display: inline-flex; align-items: center; justify-content: center;
}
.cal-view-btn:hover { border-color: var(--primary); color: var(--primary); }
.cal-view-btn.active { background: var(--primary); border-color: var(--primary); color: #fff; }

/* ===== 我的日历：状态条 + 显示开关同一行 ===== */
.cal-status-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 12px 16px;
    flex-wrap: wrap;
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}
.cal-status-row .project-status-bar {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}
.cal-status-row .calendar-toggles {
    flex: 0 0 auto;
    align-self: center;
    margin: 0;
}
.cal-status-row .status-bar-item,
.cal-status-row .cal-toggle {
    min-height: 32px;
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 20px;
}

/* ===== 我的日历：日/周 时间轴 ===== */
.cal-dayview, .cal-weekview {
    margin-top: 12px;
    max-height: 460px;
    overflow-y: auto;
    border: 1px solid var(--border, #eef2f7);
    border-radius: 10px;
    background: #fff;
}
/* 日视图：按选中日是工作日/周末整体着色（与月视图一致） */
.cal-dayview.cal-day-weekday .cal-time-col,
.cal-dayview.cal-day-weekday .cal-allday-row { background: #eaf6ed; }
.cal-dayview.cal-day-weekend .cal-time-col,
.cal-dayview.cal-day-weekend .cal-allday-row { background: #fdeef0; }
.cal-allday-row {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 8px 10px; border-bottom: 1px dashed var(--border, #eef2f7);
    background: #fafbff;
}
.cal-allday-label { flex: 0 0 auto; font-size: 12px; color: var(--text-tertiary); padding-top: 2px; }
.cal-allday-items { flex: 1 1 auto; display: flex; flex-wrap: wrap; gap: 6px; }
.cal-time-columns { display: flex; }
.cal-time-col { flex: 1 1 0; min-width: 0; }
.cal-time-col + .cal-time-col { border-left: 1px solid var(--border, #eef2f7); }
.cal-time-col.single { width: 100%; }
.cal-hour-row { display: flex; min-height: 44px; border-bottom: 1px solid #f1f5f9; }
.cal-hour-label {
    flex: 0 0 54px; padding: 6px 8px; font-size: 12px;
    color: var(--text-tertiary); text-align: right;
    border-right: 1px solid #f1f5f9;
}
.cal-hour-events { flex: 1 1 auto; padding: 4px 8px; display: flex; flex-direction: column; gap: 4px; }
.cal-hour-events .cal-event { width: 100%; }

/* 周视图顶部星期选择条 */
.cal-weekday-strip {
    position: sticky; top: 0; z-index: 3;
    display: flex; gap: 4px; padding: 8px 10px;
    border-bottom: 1px solid var(--border, #eef2f7);
    background: var(--surface, #fff);
}
.cal-weekday-btn {
    flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 6px 0; border: 1px solid transparent; border-radius: 8px;
    background: #fff; cursor: pointer; color: var(--text-secondary); transition: all .15s;
}
/* 周视图星期条：工作日浅绿 / 周末浅粉（与月视图一致） */
.cal-weekday-btn.cal-wk-wd { background: #eaf6ed; }
.cal-weekday-btn.cal-wk-sat,
.cal-weekday-btn.cal-wk-sun { background: #fdeef0; }
.cal-weekday-btn:hover { background: #f1f5f9; }
.cal-weekday-btn.active { background: var(--primary); color: #fff; }
.cal-weekday-btn.is-today .cw-date { color: var(--primary); }
.cal-weekday-btn.active .cw-date { color: #fff; }
.cal-weekday-btn .cw-week { font-size: 12px; }
.cal-weekday-btn .cw-date { font-size: 15px; font-weight: 700; }
.cal-weekday-btn .cw-lunar { font-size: 10px; color: var(--text-tertiary); }
.cal-weekday-btn.active .cw-lunar { color: rgba(255,255,255,.85); }
.cal-weekday-btn.is-today .cw-lunar { color: var(--primary); }

/* 周视图：选中日头部卡片（星期 + 公历 + 农历 + 今天标记） */
.cal-weekday-header {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 8px 12px 6px;
    border-bottom: 1px solid var(--border-light, #eef2f7);
}
.cal-weekday-header .cal-today-badge {
    display: inline-grid;
    place-items: center;
    padding: 1px 8px;
    border-radius: 10px;
    background: var(--primary);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}
.cal-weekday-header .cwh-week { font-size: 13px; color: var(--text-secondary); }
.cal-weekday-header .cwh-date { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.cal-weekday-header .cwh-lunar { font-size: 12px; color: var(--text-tertiary, #94a3b8); }

/* 表单组整行 */
.form-group.col-span-2 { grid-column: 1 / -1; }

/* ==================== 2026 UI system refinement ==================== */
:root {
    --primary: #1769e0;
    --primary-light: #2f7bea;
    --primary-dark: #1255b8;
    --primary-bg: #eef5ff;
    --primary-border: #b9d4fb;
    --bg: #f4f6f8;
    --bg-secondary: #f7f8fa;
    --surface: #ffffff;
    --border: #dce1e7;
    --border-light: #e9edf1;
    --text-primary: #202832;
    --text-secondary: #5f6b78;
    --text-tertiary: #8a96a3;
    --shadow-sm: 0 1px 2px rgba(24, 32, 44, .05);
    --shadow: 0 1px 3px rgba(24, 32, 44, .07), 0 6px 18px rgba(24, 32, 44, .035);
    --shadow-md: 0 10px 28px rgba(24, 32, 44, .12);
    --radius-sm: 4px;
    --radius: 6px;
    --radius-md: 8px;
    --radius-lg: 8px;
    --topbar-height: 64px;
}

body {
    color: var(--text-primary);
    background: var(--bg);
    line-height: 1.5;
}

/* Navigation */
.sidebar {
    background: #172231;
    border-right: 1px solid #111a26;
    box-shadow: 4px 0 18px rgba(15, 23, 42, .08);
}

.sidebar-header {
    min-height: 72px;
    padding: 14px 18px;
    border-bottom-color: rgba(255, 255, 255, .08);
}

.logo-icon {
    width: 40px;
    height: 40px;
    font-size: 25px;
    background: #243a57;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 6px;
}

.logo-text h1 { font-size: 17px; font-weight: 650; }
.logo-text p { color: #93a3b7; }
.sidebar-nav { padding: 12px 10px 18px; }

.sidebar-dashboard {
    flex: 0 0 auto;
    padding: 12px 10px 8px;
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    position: relative;
    z-index: 5;
}
.sidebar-dashboard .nav-item { margin-bottom: 0; }

.nav-label {
    padding: 16px 12px 6px;
    color: #77879a;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0;
}

.nav-item,
.nav-subitem {
    min-height: 38px;
    margin-bottom: 2px;
    border-radius: 6px;
    color: #c2ccd8;
    transition: background-color .15s ease, color .15s ease;
}

.nav-item:hover,
.nav-subitem:hover { background: #223249; color: #fff; }

.nav-item.active,
.nav-subitem.active {
    background: #1769e0;
    color: #fff;
    box-shadow: inset 3px 0 0 #76aaff, 0 3px 10px rgba(0, 0, 0, .14);
}

.nav-item:focus { outline: none; }
.nav-item:focus-visible {
    outline: 2px solid #83b4ff;
    outline-offset: -2px;
}

.sidebar-footer {
    background: #131e2c;
    border-top-color: rgba(255, 255, 255, .08);
}

.user-avatar { border-radius: 6px; background: #1769e0; }

/* Workspace chrome */
.topbar {
    padding: 0 22px;
    background: rgba(255, 255, 255, .97);
    border-bottom-color: var(--border);
    box-shadow: 0 1px 0 rgba(24, 32, 44, .02);
}

.page-title { font-size: 19px; font-weight: 650; }
.page-container { padding: 20px 22px 26px; }

.topbar-search { width: min(300px, 34vw); }
.topbar-search input {
    height: 38px;
    background: #f6f8fa;
    border-color: #dfe4ea;
    border-radius: 6px;
}

.topbar-search input:hover { border-color: #c8d0d9; }
.icon-btn { width: 38px; height: 38px; border-radius: 6px; }

/* Surfaces and content sections */
.card,
.page-card,
.tab-content,
.settings-section {
    background: var(--surface);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    box-shadow: var(--shadow-sm);
}

.card-header {
    min-height: 52px;
    padding: 14px 18px;
    border-bottom-color: var(--border-light);
}

.card-title { font-size: 15px; font-weight: 650; }
.card-body { padding: 18px; }

/* System settings workspace */
.settings-page { display: grid; grid-template-columns: 220px minmax(0, 1fr) 6px var(--settings-props-w, 260px); gap: 14px; align-items: start; margin: 0 auto; }
.settings-page.hide-props { grid-template-columns: 220px minmax(0, 1fr) 0 0; }
.settings-page.hide-props .settings-props,
.settings-page.hide-props .settings-props-resizer { display: none; }
.settings-nav { position: sticky; top: 8px; display: flex; flex-direction: column; gap: 14px; padding: 10px; background: #fff; border: 1px solid var(--border-light); border-radius: 8px; box-shadow: var(--shadow-sm); max-height: calc(100vh - 110px); overflow: auto; }
.settings-nav-group { display: flex; flex-direction: column; gap: 2px; }
.settings-nav-label { padding: 2px 10px 6px; color: var(--text-tertiary); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.settings-nav-item { display: block; width: 100%; padding: 8px 10px; color: var(--text-secondary); background: transparent; border: 0; border-radius: 5px; font-weight: 600; font-size: 13px; text-align: left; cursor: pointer; }
.settings-nav-item:hover { color: var(--primary); background: var(--primary-bg); }
.settings-nav-item.active { color: #fff; background: var(--primary); }
.settings-workspace { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
.settings-content { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.settings-content-head { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 0 4px 4px; border-bottom: 1px solid var(--border-light); }
.settings-content-head h3 { margin: 0; color: var(--text-primary); font-size: 16px; font-weight: 700; }
.settings-content-head-fields { gap: 18px; }
.settings-module-picker { display: flex; align-items: center; gap: 9px; min-width: 0; }
.settings-module-picker label { flex: 0 0 auto; margin: 0; color: var(--text-secondary); font-size: 12px; font-weight: 650; }
.settings-module-picker .form-control { width: 220px; min-height: 34px; padding-top: 5px; padding-bottom: 5px; }
.settings-dict-stack { display: flex; flex-direction: column; gap: 14px; }
.settings-empty { padding: 48px 16px; text-align: center; color: var(--text-tertiary); font-size: 14px; }
.settings-props { position: sticky; top: 8px; align-self: start; background: #fff; border: 1px solid var(--border-light); border-radius: 8px; box-shadow: var(--shadow-sm); overflow: hidden; }
.settings-props-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; background: #f7f9fb; border-bottom: 1px solid var(--border-light); }
.settings-props-head h4 { margin: 0; color: var(--text-primary); font-size: 14px; font-weight: 700; }
.settings-props-body { padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.settings-props-empty { color: var(--text-tertiary); font-size: 13px; line-height: 1.7; }
.settings-props-info { padding: 14px; font-size: 13px; color: var(--text-secondary); line-height: 1.75; }
.settings-props-info p { margin: 0 0 8px; }
.settings-props-info strong { color: var(--text-primary); }
.settings-props-actions { display: flex; gap: 8px; margin-top: 2px; }
.settings-page .dict-row.cm-sel { outline: 2px solid var(--primary); outline-offset: -2px; background: var(--primary-bg); }
.settings-panel.settings-danger-section { border-color: #f3c2c2; }
.settings-panel.settings-danger-section .settings-panel-head h4 { color: #c0392b; }
.settings-page .settings-section { scroll-margin-top: 12px; overflow: hidden; border-color: #dce2e8; box-shadow: none; }
.settings-section-head { display: flex; align-items: center; justify-content: space-between; min-height: 50px; padding: 11px 16px; background: #f7f9fb; border-bottom: 1px solid var(--border-light); }
.settings-section-head > div { display: flex; align-items: center; gap: 9px; }
.settings-section-head span { display: grid; width: 28px; height: 23px; place-items: center; color: var(--primary); background: #eaf3ff; border-radius: 4px; font-size: 10px; font-weight: 750; }
.settings-section-head h3 { margin: 0; color: var(--text-primary); font-size: 15px; font-weight: 700; }
.settings-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-bottom: 1px solid var(--border-light); }
.settings-metrics > div { display: flex; min-width: 0; flex-direction: column; gap: 5px; padding: 14px 16px; border-right: 1px solid var(--border-light); }
.settings-metrics > div:last-child { border-right: 0; }
.settings-metrics span { color: var(--text-tertiary); font-size: 11px; }
.settings-metrics strong { overflow: hidden; color: var(--text-primary); font-size: 18px; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.settings-panel { min-width: 0; padding: 16px; background: #fff; border: 1px solid var(--border-light); border-radius: 7px; }
.settings-section > .settings-panel { margin: 16px; }
.settings-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; margin-bottom: 12px; }
.settings-panel-head h4 { margin: 0; color: var(--text-primary); font-size: 14px; font-weight: 700; }
.settings-panel-head > div { display: flex; align-items: center; gap: 7px; }
.settings-name-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.settings-name-form .form-group { margin: 0; }
.settings-two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 16px; }
.settings-span-two { grid-column: 1 / -1; }
.settings-list { display: flex; flex-direction: column; gap: 7px; margin-bottom: 10px; }
.settings-list-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 12px !important; }
.settings-page .dict-row { min-width: 0; margin-bottom: 0 !important; padding: 6px 8px; background: #f8fafc; border: 1px solid #edf0f3; border-radius: 5px; }
.settings-page .dict-row .form-control { min-height: 34px; padding-top: 6px; padding-bottom: 6px; }
.settings-add-row { display: grid; grid-template-columns: minmax(110px, .8fr) minmax(140px, 1fr) auto; gap: 7px; }
.settings-page #customTypesList > div { padding: 6px 8px !important; background: #f8fafc !important; border: 1px solid #edf0f3; border-radius: 5px !important; }
.settings-page .cat-group { margin-bottom: 8px !important; padding: 10px !important; background: #f8fafc !important; border: 1px solid #edf0f3; border-radius: 6px !important; }
.settings-data-actions { display: flex; gap: 8px; padding: 16px 16px 0; flex-wrap: wrap; }
.settings-warning { margin: 12px 16px 16px; padding: 11px 12px; color: #9a6700; background: #fff8e6; border: 1px solid #f2d7a4; border-radius: 6px; font-size: 12px; }
.settings-danger-section { border-color: #ead7d9 !important; }
.settings-about-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 8px 16px 16px; }
.settings-about-grid > div { display: flex; flex-direction: column; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--border-light); }
.settings-about-grid > div:nth-child(odd) { padding-right: 18px; }
.settings-about-grid > div:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--border-light); }
.settings-about-grid span { color: var(--text-tertiary); font-size: 11px; }
.settings-about-grid strong { color: var(--text-primary); font-size: 13px; font-weight: 600; }
.settings-about-stack { display: flex; flex-direction: column; gap: 14px; }
.customer-project-table { min-width: 860px; }
.customer-project-link { display: block; width: 100%; overflow: hidden; padding: 0; color: var(--primary); background: transparent; border: 0; font-weight: 600; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.customer-project-link:hover { color: var(--primary-dark); text-decoration: underline; }

/* ===== 字段设计器 ===== */
.field-designer { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px; align-items: start; min-height: 520px; }
.field-designer-lib { position: sticky; top: 8px; align-self: start; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--border-light); border-radius: 8px; box-shadow: var(--shadow-sm); overflow: hidden; }
.fd-lib-head { display: flex; flex-direction: column; gap: 1px; padding: 9px 10px 8px; background: #f7f9fb; border-bottom: 1px solid var(--border-light); }
.fd-lib-head h4 { margin: 0; font-size: 13px; font-weight: 700; color: var(--text-primary); }
.fd-lib-head .settings-hint { font-size: 10px; color: var(--text-tertiary); }
.fd-lib-body { padding: 7px; max-height: calc(100vh - 220px); overflow: auto; display: flex; flex-direction: column; gap: 9px; }
.fd-lib-title { font-size: 10px; font-weight: 700; color: var(--text-tertiary); margin-bottom: 4px; }
.fd-lib-grid { display: grid; grid-template-columns: 1fr; gap: 3px; }
.fd-lib-item { display: flex; align-items: center; justify-content: flex-start; gap: 7px; min-height: 30px; padding: 5px 8px; color: var(--text-secondary); background: #f8fafc; border: 1px solid #edf0f3; border-radius: 5px; cursor: grab; user-select: none; transition: all .15s; }
.fd-lib-item:hover { color: var(--primary); background: var(--primary-bg); border-color: var(--primary-light); }
.fd-lib-item:active { cursor: grabbing; opacity: .7; }
.fd-lib-icon { flex: 0 0 20px; font-size: 14px; line-height: 1; text-align: center; }
.fd-lib-label { font-size: 11px; font-weight: 600; }
.field-designer-canvas-wrap { display: flex; flex-direction: column; gap: 0; background: #fff; border: 1px solid var(--border-light); border-radius: 8px; box-shadow: var(--shadow-sm); overflow: hidden; }
.field-designer-canvas-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; background: #f7f9fb; border-bottom: 1px solid var(--border-light); }
.field-designer-canvas-head h4 { margin: 0; font-size: 14px; font-weight: 700; color: var(--text-primary); }
.fd-canvas-actions { margin-left: auto; }
.field-designer-canvas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 18px; min-height: 420px; background: #fafbfc; align-content: start; }
.fd-empty { grid-column: 1 / -1; padding: 60px 20px; color: var(--text-tertiary); text-align: center; font-size: 13px; background: #f4f6f8; border: 1px dashed #d0d7de; border-radius: 6px; }
.fd-form-row { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 6px; box-shadow: 0 1px 2px rgba(0,0,0,.03); cursor: pointer; transition: all .12s; }
.fd-form-row:hover { border-color: var(--primary-light); box-shadow: 0 2px 6px rgba(59,130,246,.08); }
.fd-form-row.is-selected { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: -2px; box-shadow: 0 2px 8px rgba(59,130,246,.12); }
.fd-form-row.is-drag { background: var(--primary-bg); border-color: var(--primary-light); }
.fd-form-row.w25 { grid-column: span 1; }
.fd-form-row.w50 { grid-column: span 2; }
.fd-form-row.w75 { grid-column: span 3; }
.fd-form-row.w100 { grid-column: span 4; }
.fd-form-row .fd-form-head { display: flex; align-items: center; gap: 8px; }
.fd-form-row .fd-form-label { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.fd-form-row .fd-form-hint { font-size: 11px; color: var(--text-tertiary); margin-left: auto; }
.fd-form-row .fd-form-input { min-height: 36px; padding: 7px 10px; color: var(--text-secondary); background: #fff; border: 1px solid #d7dde4; border-radius: 6px; font-size: 13px; }
.fd-form-row .fd-form-input::placeholder { color: var(--text-tertiary); }
.fd-form-row .fd-form-static { min-height: 36px; padding: 7px 10px; color: var(--text-tertiary); background: #f8fafc; border: 1px dashed #d7dde4; border-radius: 6px; font-size: 13px; display: flex; align-items: center; }
.fd-form-row .fd-form-actions { position: absolute; top: 6px; right: 6px; display: flex; gap: 2px; opacity: 0; transition: opacity .15s; }
.fd-form-row:hover .fd-form-actions { opacity: 1; }
.fd-form-row .fd-form-actions .btn-icon { width: 24px; height: 24px; padding: 0; color: var(--text-tertiary); background: #fff; border: 1px solid var(--border-light); border-radius: 4px; cursor: pointer; }
.fd-form-row .fd-form-actions .btn-icon:hover:not(:disabled) { color: var(--primary); background: #f1f5f9; }
.fd-form-row .fd-form-actions .btn-icon:disabled { opacity: .35; cursor: not-allowed; }
.fd-required { color: #dc2626; margin-left: 3px; }
.fd-unique { display: inline-grid; place-items: center; width: 14px; height: 14px; margin-left: 4px; color: #fff; background: #8b5cf6; border-radius: 3px; font-size: 9px; font-weight: 700; }
.fd-system { font-size: 10px; color: var(--text-tertiary); padding: 2px 5px; background: #f1f3f5; border-radius: 3px; }
.fd-width-toggles { display: flex; gap: 6px; }
.fd-width-btn { flex: 1; min-height: 32px; color: var(--text-secondary); background: #fff; border: 1px solid var(--border-light); border-radius: 5px; font-size: 12px; font-weight: 600; cursor: pointer; }
.fd-width-btn:hover { border-color: var(--primary-light); color: var(--primary); }
.fd-width-btn.active { color: #fff; background: var(--primary); border-color: var(--primary); }
.fd-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 0; }
.fd-switch-row .switch { flex-shrink: 0; }
.fd-drag-placeholder { grid-column: 1 / -1; height: 60px; border: 2px dashed var(--primary-border); border-radius: 6px; background: var(--primary-bg); }

@media (max-width: 980px) {
    .settings-page { grid-template-columns: 1fr; }
    .settings-nav { position: static; flex-direction: row; flex-wrap: wrap; overflow-x: auto; max-height: none; }
    .settings-nav-group { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px; }
    .settings-nav-label { width: 100%; }
    .settings-nav-item { flex: 0 0 auto; }
    .settings-metrics { grid-template-columns: repeat(3, 1fr); }
    .settings-metrics > div:nth-child(3) { border-right: 0; }
    .settings-metrics > div:nth-child(-n+3) { border-bottom: 1px solid var(--border-light); }
}
@media (max-width: 680px) {
    .settings-two-col, .settings-name-form, .settings-about-grid { grid-template-columns: 1fr; }
    .settings-span-two { grid-column: auto; }
    .settings-list-grid { grid-template-columns: 1fr !important; }
    .settings-add-row { grid-template-columns: 1fr; }
    .settings-about-grid > div:nth-child(odd), .settings-about-grid > div:nth-child(even) { padding-left: 0; padding-right: 0; border-left: 0; }
    .field-designer { grid-template-columns: 1fr; }
    .field-designer-lib { position: static; }
    .fd-lib-grid { grid-template-columns: repeat(4, 1fr); }
    .fd-lib-item { flex-direction: column; justify-content: center; gap: 4px; padding: 8px 4px; }
    .field-designer-canvas { grid-template-columns: 1fr; }
    .fd-form-row.w25, .fd-form-row.w50, .fd-form-row.w75, .fd-form-row.w100 { grid-column: span 1; }
}

/* ===== 业务闭环 V3：系统设置驱动页面 ===== */
.settings-field-visibility { overflow: hidden; border: 1px solid #e1e7ed; border-radius: 6px; background: #f8fafc; }
.settings-field-visibility .form-group { min-height: 34px; margin: 0; padding: 6px 9px; border-bottom: 1px solid #e8edf2; }
.settings-field-visibility .form-group:last-child { border-bottom: 0; }
.form-row > .form-group[data-schema-width="100"],
.settings-form-grid > .form-group[data-schema-width="100"] { grid-column: 1 / -1; }
.form-row-3 > .form-group[data-schema-width="100"] { grid-column: 1 / -1; }
.form-row-3 > .form-group[data-schema-width="50"],
.form-row-3 > .form-group[data-schema-width="75"] { grid-column: span 2; }
.schema-money-input { font-variant-numeric: tabular-nums; }
.page-toolbar {
    min-height: 56px;
    padding: 10px 12px;
    margin-bottom: 10px;
    background: #fff;
    border: 1px solid var(--border-light);
    border-radius: 8px;
    box-shadow: var(--shadow-sm);
}

.toolbar-left,
.toolbar-right { gap: 8px; }

/* Controls */
.btn {
    min-height: 36px;
    padding: 7px 13px;
    border-radius: 6px;
    font-weight: 600;
    line-height: 20px;
    box-shadow: none;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); box-shadow: 0 3px 9px rgba(23, 105, 224, .18); transform: translateY(-1px); }
.btn-secondary { color: #435160; background: #fff; border-color: #d8dee5; }
.btn-secondary:hover { color: var(--primary); background: #f7faff; border-color: #a9c9f7; }
.btn-danger { background: #dc3545; border-color: #dc3545; }
.btn-sm { min-height: 30px; padding: 4px 10px; }

.form-label { margin-bottom: 6px; color: #45515e; font-weight: 600; }
.form-control,
input.form-control,
select.form-control,
textarea.form-control {
    min-height: 38px;
    padding: 8px 10px;
    color: var(--text-primary);
    background: #fff;
    border-color: #d7dde4;
    border-radius: 6px;
}

.form-control:hover { border-color: #bdc6d0; }
.form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(23, 105, 224, .12);
}

input[type="checkbox"] { accent-color: var(--primary); }

/* Tables */
.data-table-wrap {
    background: #fff;
    border: 1px solid #dce2e8;
    border-radius: 8px;
    box-shadow: var(--shadow-sm);
}

.data-table {
    color: #35414d;
    font-size: 13px;
}

.data-table thead th {
    height: 42px;
    padding: 9px 12px;
    color: #3f4c59;
    font-weight: 650;
    background: #f3f5f7;
    border-right: 1px solid #d9dfe5;
    border-bottom: 1px solid #cfd6de;
}

.data-table thead th:last-child { border-right: 0; }
.data-table tbody td {
    height: 46px;
    padding: 9px 12px;
    border-right: 1px solid #edf0f3;
    border-bottom: 1px solid #e4e8ec;
    vertical-align: middle;
}

.data-table tbody td:last-child { border-right: 0; }
.data-table tbody tr:hover > td { background: #edf5ff; }

.data-table thead th[data-sort]:hover {
    color: var(--primary);
    background: #eaf2fd;
}

.data-table thead th .sort-arrow { color: #94a0ac; }
.cell-content { line-height: 20px; }

.badge,
.status-bar-item {
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-weight: 600;
}

.badge-success { border-color: #bfe7cc; }
.badge-warning { border-color: #f2d7a4; }
.badge-danger { border-color: #f2c0c5; }
.badge-primary { border-color: #bed6f8; }
.badge-gray { border-color: #dce1e7; }

.list-footer,
.table-footer {
    min-height: 60px;
    padding: 11px 16px;
    color: var(--text-secondary);
    background: #fff;
    border: 1px solid var(--border-light);
    border-top: 0;
    border-radius: 0 0 8px 8px;
}

/* Project table grouping and project-level bands */
#projTable .project-group-header th {
    height: 40px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    border-right: 2px solid #b9c3ce;
    border-bottom: 1px solid #aeb9c5;
}

/* 项目总览分组行表头：更鲜艳亮色 + 白字（全选灰/项目信息亮蓝/项目进度亮青/产品明细亮绿/项目利润亮橙） */
#projTable .project-group-header th:nth-child(1) { background: #64748b; } /* 全选 */
#projTable .project-group-header th:nth-child(2) { background: #2f7bff; } /* 项目信息 */
#projTable .project-group-header th:nth-child(3) { background: #00b2a9; } /* 项目进度 */
#projTable .project-group-header th:nth-child(4) { background: #00c06e; } /* 产品明细 */
#projTable .project-group-header th:nth-child(5) { background: #ff8a00; } /* 项目利润 */

#projTable thead tr:nth-child(2) th:nth-child(9),
#projTable thead tr:nth-child(2) th:nth-child(13),
#projTable thead tr:nth-child(2) th:nth-child(19),
#projTable thead tr:nth-child(2) th:nth-child(25) {
    border-right: 2px solid #aeb9c5;
}

#projTable .project-product-total {
    font-weight: 700;
    background-image: linear-gradient(rgba(23, 105, 224, .035), rgba(23, 105, 224, .035));
}

.project-name-status-row {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(150px, 1fr);
    gap: 16px;
}

.project-fee-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0 16px;
}

.project-core-grid,
.project-progress-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0 16px;
}

.project-core-grid .form-group,
.project-progress-grid .form-group { min-width: 0; }

.project-fee-grid .project-fee-half { grid-column: span 2; }
.project-fee-grid .form-group { min-width: 0; }
.project-fee-grid > div:nth-child(n+3) { margin-top: 20px; }

.project-derived-money {
    color: #f59e0b;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: center;
}
.project-form-center,
.project-tone-select { text-align: center; text-align-last: center; }
.project-form-text { text-align: left; }
.project-form-money { color: #f59e0b !important; background: #fffaf0 !important; border-color: #f2d7a4 !important; }
.project-money-input {
    color: #f59e0b !important;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    text-align: center;
}
.project-tone-select { font-weight: 650 !important; }
.project-tone-select.tone-status-docking { color: #16a34a !important; background: #f0fdf4 !important; border-color: #bbf7d0 !important; }
.project-tone-select.tone-status-making { color: #dc2626 !important; background: #fef2f2 !important; border-color: #fecaca !important; }
.project-tone-select.tone-status-delivered { color: #1769e0 !important; background: #e8f1ff !important; border-color: #b9d5ff !important; }
.project-tone-select.tone-status-cancelled { color: #6b7280 !important; background: #eef1f6 !important; border-color: #dce1e7 !important; }
.project-tone-select.tone-result-won,
.project-tone-select.tone-contract-yes { color: var(--success) !important; background: var(--success-bg) !important; border-color: #bfe7cc !important; }
.project-tone-select.tone-result-lost { color: var(--danger) !important; background: var(--danger-bg) !important; border-color: #f2c0c5 !important; }
.project-tone-select.tone-result-invalid,
.project-tone-select.tone-invoice-pending { color: var(--warning) !important; background: var(--warning-bg) !important; border-color: #f2d7a4 !important; }
.project-tone-select.tone-result-pending,
.project-tone-select.tone-contract-no,
.project-tone-select.tone-invoice-none { color: var(--text-secondary) !important; background: var(--bg-secondary) !important; border-color: #dce1e7 !important; }
.project-tone-select.tone-invoice-issued { color: var(--primary-dark) !important; background: var(--primary-bg) !important; border-color: #bed6f8 !important; }

/* 展开的下拉选项也带色块，与收起态表单一致 */
/* 自定义色块下拉浮层（替代原生 select，Chrome/Edge 也能渲染色块） */
.tone-select { position: relative; }
.tone-select-trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: pointer; text-align: left; padding-right: 30px; }
.tone-select-trigger.open .tone-select-caret { transform: rotate(180deg); }
.tone-select-caret { margin-left: 8px; font-size: 10px; opacity: .65; transition: transform .15s ease; flex-shrink: 0; }
.tone-select-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tone-select-menu { position: absolute; top: calc(100% + 5px); left: 0; right: 0; z-index: 60; margin: 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(15, 23, 42, .18); max-height: 248px; overflow: auto; }
.tone-select-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px; cursor: pointer; font-weight: 600; font-size: 13px; transition: filter .12s ease; }
.tone-select-item:hover { filter: brightness(.95); }
.tone-select-item .tone-swatch { width: 10px; height: 10px; border-radius: 50%; background: currentColor; opacity: .45; flex-shrink: 0; }
.tone-select-item.tone-status-docking { color: #16a34a !important; background: #f0fdf4 !important; }
.tone-select-item.tone-status-making { color: #dc2626 !important; background: #fef2f2 !important; }
.tone-select-item.tone-status-delivered { color: #1769e0 !important; background: #e8f1ff !important; }
.tone-select-item.tone-status-cancelled { color: #6b7280 !important; background: #eef1f6 !important; }
.tone-select-item.tone-result-won,
.tone-select-item.tone-contract-yes { color: var(--success) !important; background: var(--success-bg) !important; }
.tone-select-item.tone-result-lost { color: var(--danger) !important; background: var(--danger-bg) !important; }
.tone-select-item.tone-result-invalid,
.tone-select-item.tone-invoice-pending { color: var(--warning) !important; background: var(--warning-bg) !important; }
.tone-select-item.tone-result-pending,
.tone-select-item.tone-contract-no,
.tone-select-item.tone-invoice-none { color: var(--text-secondary) !important; background: var(--bg-secondary) !important; }
.tone-select-item.tone-invoice-issued { color: var(--primary-dark) !important; background: var(--primary-bg) !important; }
.tone-select-item[aria-selected="true"] { outline: 2px solid rgba(59, 130, 246, .5); }

/* 统一金额展示：收支明细表 #finTable 保留原有收入/支出配色 */
#pageContainer:not([data-page="finance"]) .amount,
#pageContainer:not([data-page="finance"]) .amount-positive,
#pageContainer:not([data-page="finance"]) .amount-negative,
#pageContainer:not([data-page="finance"]) .amount-income {
    color: #f59e0b;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: center;
    white-space: nowrap;
}

#finTable td.amount { text-align: right; }

/* 项目状态列与全选列一致：上下随表头冻结、左右随首列横向冻结 */
#projTable tbody .project-status-cell {
    position: static;
    left: auto !important;
    z-index: auto;
    background: var(--surface);
    box-shadow: none;
}

.project-customer-select { cursor: text; }
.ref-field { position: relative; }
.ref-field .ref-dropdown { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 50; margin: 0; padding: 4px 0; list-style: none; background: #fff; border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 10px); box-shadow: 0 6px 18px rgba(31, 35, 41, .12); max-height: 220px; overflow-y: auto; }
.ref-field .ref-dropdown .ref-option { padding: 7px 12px; font-size: 13px; cursor: pointer; color: var(--text-primary, #1f2329); }
.ref-field .ref-dropdown .ref-option:hover, .ref-field .ref-dropdown .ref-option.active { background: var(--primary-bg, #eef2ff); color: var(--primary, #3b6cff); }
.ref-field .ref-dropdown .ref-empty { padding: 8px 12px; font-size: 13px; color: var(--text-tertiary, #9aa1ac); }

/* 提成、产品、收支、运营、资产列表：页脚贴合当前内容区底部 */
#pageContainer[data-page="commission"],
#pageContainer[data-page="product"],
#pageContainer[data-page="finance"],
#pageContainer[data-page="ops"],
#pageContainer[data-page="asset"],
#pageContainer[data-page="cust-public"],
#pageContainer[data-page="cust-cooperate"],
#pageContainer[data-page="contacts"],
#pageContainer[data-page="proj-stat"],
#pageContainer[data-page="proj-contract"],
#pageContainer[data-page="proj-invoice"] {
    display: flex;
    flex-direction: column;
    flex: 0 0 calc(100vh - var(--topbar-height));
    height: calc(100vh - var(--topbar-height));
    max-height: calc(100vh - var(--topbar-height));
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
}

#pageContainer[data-page="commission"] .page-toolbar,
#pageContainer[data-page="product"] .page-toolbar,
#pageContainer[data-page="finance"] .page-toolbar,
#pageContainer[data-page="ops"] .page-toolbar,
#pageContainer[data-page="asset"] .page-toolbar,
#pageContainer[data-page="cust-public"] .page-toolbar,
#pageContainer[data-page="cust-cooperate"] .page-toolbar,
#pageContainer[data-page="contacts"] .page-toolbar,
#pageContainer[data-page="proj-stat"] .page-toolbar,
#pageContainer[data-page="proj-contract"] .page-toolbar,
#pageContainer[data-page="proj-invoice"] .page-toolbar,
#pageContainer[data-page="commission"] .bulk-delete-bar,
#pageContainer[data-page="product"] .bulk-delete-bar,
#pageContainer[data-page="finance"] .bulk-delete-bar,
#pageContainer[data-page="ops"] .bulk-delete-bar,
#pageContainer[data-page="asset"] .bulk-delete-bar,
#pageContainer[data-page="cust-public"] .bulk-delete-bar,
#pageContainer[data-page="cust-cooperate"] .bulk-delete-bar,
#pageContainer[data-page="contacts"] .bulk-delete-bar,
#pageContainer[data-page="proj-stat"] .bulk-delete-bar,
#pageContainer[data-page="proj-contract"] .bulk-delete-bar,
#pageContainer[data-page="proj-invoice"] .bulk-delete-bar {
    flex: 0 0 auto;
}

#pageContainer[data-page="commission"] .data-table-wrap,
#pageContainer[data-page="product"] .data-table-wrap,
#pageContainer[data-page="finance"] .data-table-wrap,
#pageContainer[data-page="ops"] .data-table-wrap,
#pageContainer[data-page="asset"] .data-table-wrap,
#pageContainer[data-page="cust-public"] .data-table-wrap,
#pageContainer[data-page="cust-cooperate"] .data-table-wrap,
#pageContainer[data-page="contacts"] .data-table-wrap,
#pageContainer[data-page="proj-stat"] .data-table-wrap,
#pageContainer[data-page="proj-contract"] .data-table-wrap,
#pageContainer[data-page="proj-invoice"] .data-table-wrap {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
}

/* 项目提成：内容行增加上下滚动条（表头保持固定），覆盖上面 max-height:none */
#pageContainer[data-page="commission"] #cmTableWrap {
    max-height: calc(100vh - 300px);
    overflow-y: auto;
}

#pageContainer[data-page="commission"] .list-footer,
#pageContainer[data-page="product"] .list-footer,
#pageContainer[data-page="finance"] .list-footer,
#pageContainer[data-page="ops"] .list-footer,
#pageContainer[data-page="asset"] .list-footer,
#pageContainer[data-page="cust-public"] .list-footer,
#pageContainer[data-page="cust-cooperate"] .list-footer,
#pageContainer[data-page="contacts"] .list-footer,
#pageContainer[data-page="proj-stat"] .list-footer,
#pageContainer[data-page="proj-contract"] .list-footer,
#pageContainer[data-page="proj-invoice"] .list-footer,
#pageContainer[data-page="cust-public"] .table-footer,
#pageContainer[data-page="cust-cooperate"] .table-footer,
#pageContainer[data-page="contacts"] .table-footer {
    flex: 0 0 auto;
    margin-bottom: 0;
}

#gSubTable-contract thead th {
    text-align: center;
}

#gSubTable-invoice thead th,
#gSubTable-invoice tbody td:not(:nth-child(5)):not(:nth-child(7)) {
    text-align: center;
}

.invoice-linked-form .form-row {
    align-items: start;
}

.invoice-form-grid { display: grid; align-items: start; gap: 16px; margin-bottom: 18px; }
.invoice-form-grid .form-group { min-width: 0; margin-bottom: 0; }
.invoice-form-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.invoice-form-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.invoice-form-grid-three-one { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.invoice-form-grid-one { grid-template-columns: minmax(0, 1fr); }
.invoice-attachment-upload { display: flex; flex-direction: column; align-items: flex-start; }
.invoice-attachment-actions { display: flex; align-items: center; gap: 10px; min-height: 38px; }
.invoice-upload-btn { min-width: 112px; }

.contract-linked-form { display: flex; flex-direction: column; gap: 22px; }
.contract-form-section { width: 100%; }
.contract-form-section-title { margin: 0 0 14px; padding-bottom: 9px; border-bottom: 1px solid var(--border); color: var(--text-primary); font-size: 15px; line-height: 1.4; }
.contract-form-grid { display: grid; align-items: start; gap: 16px; margin-bottom: 18px; }
.contract-form-grid:last-child { margin-bottom: 0; }
.contract-form-grid .form-group { min-width: 0; margin-bottom: 0; }
.contract-form-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.contract-form-grid-three-one { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.contract-form-grid-one { grid-template-columns: minmax(0, 1fr); }
.contract-form-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.combo { position: relative; }
.combo-input { width: 100%; }
.combo-list { position: absolute; top: 100%; left: 0; right: 0; z-index: 60; background: #fff; border: 1px solid #d9dee5; border-radius: 6px; max-height: 220px; overflow-y: auto; box-shadow: 0 6px 20px rgba(20,30,50,.14); margin-top: 3px; padding: 4px 0; }
.combo-list:not([hidden]) { display: block; }
.combo-option { padding: 8px 12px; cursor: pointer; font-size: 13px; color: #1f2329; line-height: 1.4; }
.combo-option:hover, .combo-option.active { background: #eef4ff; }
.combo-option .combo-sub { color: #98a0ad; font-size: 12px; }
.combo-empty { padding: 8px 12px; color: #98a0ad; font-size: 13px; }

@media (max-width: 768px) {
    .invoice-form-grid-four,
    .invoice-form-grid-two,
    .invoice-form-grid-three-one,
    .contract-form-grid-four,
    .contract-form-grid-three-one,
    .contract-form-grid-two { grid-template-columns: 1fr; }
}

.invoice-table-empty {
    min-height: 220px;
}

.invoice-attachment-link {
    color: var(--primary);
    text-decoration: none;
}

.invoice-file-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 38px;
    border-radius: 5px;
    transition: background .15s ease, transform .15s ease;
}
.invoice-file-link:hover { background: #f1f5f9; transform: translateY(-1px); }
.invoice-file-icon {
    position: relative;
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    width: 25px;
    height: 31px;
    padding-bottom: 4px;
    color: #fff;
    border-radius: 3px;
    font-size: 8px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .18);
}
.invoice-file-icon::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, .72);
    border-bottom-left-radius: 2px;
}
.invoice-file-pdf { background: #dc2626; }
.invoice-file-word { background: #2563eb; font-size: 13px; }
.invoice-file-file { background: #64748b; font-size: 7px; }

.finance-entry-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0 16px;
}

.finance-entry-grid .form-group { min-width: 0; }
.finance-subject-select { font-weight: 650; }
.finance-subject-select.subject-income { color: var(--primary); border-color: #b9d4fb; background-color: #f1f7ff; }
.finance-subject-select.subject-expense { color: var(--danger); border-color: #f1c1c7; background-color: #fff5f5; }
.finance-subject-select.subject-fee { color: var(--warning); border-color: #f2d7a4; background-color: #fffaf0; }
.finance-subject-select .subject-group-income { color: var(--primary); background: #eaf3ff; }
.finance-subject-select .subject-group-expense { color: var(--danger); background: #fff0f1; }
.finance-subject-select .subject-group-fee { color: #b66a00; background: #fff6e5; }
.finance-subject-select .subject-option-income { color: #1769e0; background: #f4f8ff; }
.finance-subject-select .subject-option-expense { color: #c93645; background: #fff7f7; }
.finance-subject-select .subject-option-fee { color: #b66a00; background: #fffbf2; }
.subject-badge.subject-income { color: #1769e0; background: #edf5ff; border-color: #c5dcfb; }
.subject-badge.subject-expense { color: #c93645; background: #fff1f2; border-color: #f2c4ca; }
.subject-badge.subject-fee { color: #b66a00; background: #fff6e5; border-color: #f0d29d; }
.subject-badge.subject-carry { color: #7c3aed; background: #f5f3ff; border-color: #ddd6fe; }
.finance-amount-input.amount-income { color: var(--primary); border-color: #b9d4fb; background: #f1f7ff; font-weight: 700; }
.finance-amount-input.amount-expense { color: var(--danger); border-color: #f1c1c7; background: #fff5f5; font-weight: 700; }
.finance-amount-input.amount-fee { color: #b66a00; border-color: #f2d7a4; background: #fffaf0; font-weight: 700; }
.finance-amount-input.amount-carry { color: #7c3aed; border-color: #ddd6fe; background: #f5f3ff; font-weight: 700; }
.finance-project-link {
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
    color: var(--primary);
    background: transparent;
    border: 0;
    font: inherit;
    font-weight: 600;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}
.finance-project-link:hover { color: var(--primary-dark); text-decoration: underline; }
.finance-project-unlinked { color: var(--text-tertiary); }
.finance-project-match { min-height: 18px; margin-top: 5px; font-size: 12px; }
.finance-project-match.matched { color: var(--success); }
.finance-project-match.unmatched { color: var(--danger); }
.account-badge { min-width: 72px; justify-content: center; }
.account-badge.account-public { color: #1769e0; background: #eaf3ff; border-color: #bfd8fb; }
.account-badge.account-bank { color: #7357b8; background: #f2edff; border-color: #d7caf7; }
.account-badge.account-wechat { color: #14843d; background: #e9f8ee; border-color: #bce7ca; }
.account-badge.account-credit { color: #b86100; background: #fff3df; border-color: #f1d09a; }
.account-badge.account-other { color: #566273; background: #f1f3f5; border-color: #d8dde3; }

/* Dashboard annual finance chart */
.dashboard-finance-chart-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    gap: 16px;
    align-items: stretch;
}
.dashboard-finance-chart-card { overflow: hidden; }
.dashboard-insight-section { display: flex; flex-direction: column; gap: 16px; }
.dashboard-followup-card { min-width: 0; overflow: hidden; }
.dashboard-followup-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; min-height: 52px; padding: 12px 18px; border-bottom: 1px solid var(--border-light); }
.dashboard-followup-header h3 { margin: 0; color: var(--text-primary); font-size: 16px; }
.dashboard-followup-tabs { display: inline-flex; gap: 6px; padding: 3px; background: #f1f5f9; border-radius: 8px; }
.followup-tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--text-secondary); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s ease; white-space: nowrap; }
.followup-tab em { font-style: normal; font-size: 12px; color: var(--text-tertiary); font-variant-numeric: tabular-nums; }
.followup-tab:hover { color: var(--text-primary); }
.followup-tab.active { background: #fff; border-color: var(--border-light); color: var(--text-primary); box-shadow: 0 1px 3px rgba(15,23,42,.08); }
.followup-tab.active em { color: var(--primary); font-weight: 700; }
.followup-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.dashboard-followup-list { max-height: 320px; overflow-y: auto; }
.dashboard-followup-table { margin: 0; border: none; }
.dashboard-followup-table th { position: sticky; top: 0; z-index: 1; background: #f8fafc; }
.followup-name-link { background: none; border: none; padding: 0; margin: 0; color: var(--primary); font-size: inherit; cursor: pointer; text-align: left; }
.followup-name-link:hover { text-decoration: underline; }
.dashboard-insight-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.dashboard-insight-metric { min-width: 0; padding: 16px 18px; background: #fff; border: 1px solid var(--border-light); border-top: 3px solid var(--insight-color); border-radius: 6px; }
.dashboard-insight-metric span { display: block; overflow: hidden; color: var(--text-secondary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-insight-metric strong { display: inline-block; margin-top: 8px; color: var(--text-primary); font-size: 26px; line-height: 1; font-variant-numeric: tabular-nums; }
.dashboard-insight-metric small { margin-left: 5px; color: var(--text-tertiary); font-size: 12px; }
.dashboard-distribution-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.dashboard-distribution-card { min-width: 0; overflow: hidden; }
.dashboard-distribution-header { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 12px 18px; border-bottom: 1px solid var(--border-light); }
.dashboard-distribution-header h3 { margin: 0; color: var(--text-primary); font-size: 16px; }
.dashboard-distribution-header span { color: var(--text-tertiary); font-size: 12px; }
.dashboard-distribution-list { display: flex; flex-direction: column; gap: 18px; padding: 20px 18px 24px; }
.dashboard-distribution-item { min-width: 0; }
.dashboard-distribution-label { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto 48px; align-items: center; gap: 8px; margin-bottom: 7px; }
.dashboard-distribution-label i { width: 9px; height: 9px; border-radius: 2px; }
.dashboard-distribution-label span { overflow: hidden; color: var(--text-secondary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-distribution-label strong { color: var(--text-primary); font-size: 14px; font-variant-numeric: tabular-nums; }
.dashboard-distribution-label small { color: var(--text-tertiary); font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; }
.dashboard-distribution-track { height: 9px; overflow: hidden; background: #edf1f5; border-radius: 4px; }
.dashboard-distribution-track span { display: block; min-width: 0; height: 100%; border-radius: inherit; transition: width .28s ease; }
@media (max-width: 980px) {
    .dashboard-insight-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-distribution-grid { grid-template-columns: 1fr; }
}
.dashboard-pie-card { min-width: 0; overflow: hidden; }
.dashboard-pie-grid { align-items: stretch; }
.dashboard-pie-card .pie-chart-body { display: flex; align-items: center; gap: 14px; padding: 14px 18px 20px; }
.pie-chart-svg { width: 150px; height: 140px; flex: none; filter: drop-shadow(0 4px 6px rgba(15,23,42,0.12)); transform-origin: 50% 55%; animation: pie-pop 0.6s cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes pie-pop { from { opacity: 0; transform: scale(0.6); } to { opacity: 1; transform: scale(1); } }
.pie-slice { transform-box: view-box; transform-origin: 90px 84px; transition: transform 0.2s ease, filter 0.2s ease; cursor: pointer; }
.pie-slice:hover { transform: scale(1.09); filter: brightness(1.08); }
.pie-chart-legend { flex: 1; min-width: 0; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 9px; }
.pie-chart-legend li { display: flex; align-items: center; gap: 8px; font-size: 13px; opacity: 0; animation: pie-legend-in 0.5s ease both; }
.pie-chart-legend li:nth-child(1) { animation-delay: 0.20s; }
.pie-chart-legend li:nth-child(2) { animation-delay: 0.28s; }
.pie-chart-legend li:nth-child(3) { animation-delay: 0.36s; }
.pie-chart-legend li:nth-child(4) { animation-delay: 0.44s; }
.pie-chart-legend li:nth-child(5) { animation-delay: 0.52s; }
.pie-chart-legend li:nth-child(6) { animation-delay: 0.60s; }
.pie-chart-legend li:nth-child(7) { animation-delay: 0.68s; }
.pie-chart-legend li:nth-child(8) { animation-delay: 0.76s; }
@keyframes pie-legend-in { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: translateX(0); } }
.pie-chart-legend i { width: 11px; height: 11px; border-radius: 3px; flex: none; }
.pie-chart-legend .pie-legend-label { flex: 1; min-width: 0; overflow: hidden; color: var(--text-secondary); text-overflow: ellipsis; white-space: nowrap; }
.pie-chart-legend strong { color: var(--text-primary); font-variant-numeric: tabular-nums; }
.pie-chart-legend small { width: 52px; color: var(--text-tertiary); font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; }
.finance-chart-header {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 16px 18px 12px;
    border-bottom: 1px solid var(--border-light);
}
.finance-chart-header h3 { margin: 0; color: var(--text-primary); font-size: 16px; font-weight: 700; }
.finance-chart-heading { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.finance-chart-year-control { display: inline-flex; align-items: center; gap: 6px; }
.finance-chart-year-control button {
    width: 32px; height: 32px; padding: 0; color: var(--text-secondary); background: #fff;
    border: 1px solid var(--border); border-radius: 6px; font-size: 20px; cursor: pointer;
}
.finance-chart-year-control select {
    height: 32px; padding: 0 28px 0 10px; color: var(--text-primary); background: #fff;
    border: 1px solid var(--border); border-radius: 6px; font-weight: 650;
}
.finance-chart-year-value {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    height: 32px;
    padding: 0 12px;
    color: var(--text-primary);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-weight: 700;
}
.finance-chart-canvas-wrap { width: 100%; overflow-x: auto; padding: 0 14px; }
.finance-chart-svg { display: block; width: 100%; min-width: 760px; height: 410px; }
.finance-chart-grid { stroke: #e7ebf0; stroke-width: 1; }
.finance-chart-month-divider { stroke: #d6dde6; stroke-width: 1; stroke-dasharray: 4 5; }
.finance-chart-axis { stroke: #9aa6b4; stroke-width: 1.5; }
.finance-chart-zero { stroke: #718096; stroke-width: 1.5; }
.finance-chart-axis-label, .finance-chart-month { fill: #667386; font-size: 12px; }
.finance-chart-mark { transition: opacity .15s ease; }
.finance-chart-mark:hover { opacity: .72; }
.finance-chart-legend {
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px;
    padding: 10px 16px 14px;
    border-top: 1px solid #eef1f4;
}
.finance-chart-legend-item { display: inline-flex; align-items: stretch; min-height: 30px; overflow: hidden; background: #fff; border: 1px solid #cbd3dc; border-radius: 5px; transition: opacity .15s ease, filter .15s ease; }
.finance-chart-legend-item.series-hidden { opacity: .42; filter: grayscale(.35); }
.finance-chart-legend button { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; margin: 0; background: transparent; border: 0; cursor: pointer; }
.finance-chart-label-toggle { width: 28px; padding: 0 4px 0 8px; }
.finance-chart-label-toggle:disabled { cursor: default; }
.finance-chart-series-toggle { padding: 4px 9px 4px 4px; color: var(--text-primary); font-size: 12px; }
.finance-chart-legend i { position: relative; width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.finance-chart-label-toggle.labels-visible i::after { content: ''; position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(15, 23, 42, .14); transform: translate(-50%, -50%); }
.finance-chart-data-wrap { max-height: 340px; overflow: auto; border-top: 1px solid var(--border-light); }
.finance-chart-data-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; font-variant-numeric: tabular-nums; }
.finance-chart-data-table th,
.finance-chart-data-table td { height: 36px; padding: 7px 12px; text-align: right; white-space: nowrap; border-right: 1px solid #eef1f4; border-bottom: 1px solid #eef1f4; }
.finance-chart-data-table th { position: sticky; top: 0; z-index: 2; color: var(--text-secondary); background: #f7f9fb; font-weight: 700; }
.finance-chart-data-table th:first-child,
.finance-chart-data-table td:first-child { width: 80px; text-align: center; }
.finance-chart-data-table th:last-child,
.finance-chart-data-table td:last-child { border-right: 0; }
.finance-chart-data-table th i { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 2px; }
.finance-chart-data-table .finance-data-income { color: #2563eb; }
.finance-chart-data-table .finance-data-expense { color: #ef4758; }
.finance-chart-data-table .finance-data-fee { color: #b66a00; }
.finance-chart-data-table .finance-data-gross { color: #168251; }
.finance-chart-data-table .finance-data-net { color: #0f766e; }
.finance-chart-data-total td { position: sticky; bottom: 0; z-index: 1; background: #f3f6f9; font-weight: 700; border-bottom: 0; }
.finance-chart-data-table-transposed { width: calc(100% - 4px); min-width: 0; table-layout: fixed; }
.finance-chart-data-table-transposed th,
.finance-chart-data-table-transposed td { min-width: 0; height: 34px; padding: 6px 3px; text-align: center; }
.finance-chart-data-table-transposed th:first-child,
.finance-chart-data-table-transposed td:first-child { position: sticky; left: 0; z-index: 3; width: 78px; min-width: 78px; background: #f7f9fb; font-weight: 700; }
.finance-chart-data-table-transposed td:first-child { z-index: 1; background: #fff; }
.finance-chart-data-table-transposed td:first-child i { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 2px; }
.finance-chart-data-total-cell { background: #f3f6f9; font-weight: 700; }
.finance-chart-trend { vector-effect: non-scaling-stroke; }
.finance-chart-trend-net { filter: url(#financeNetGlow); }
.finance-chart-value-label { pointer-events: none; font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; paint-order: stroke; stroke: rgba(255, 255, 255, .92); stroke-width: 3px; stroke-linejoin: round; }
.dashboard-finance-donut-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.finance-donut-header { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 10px 18px; border-bottom: 1px solid var(--border-light); text-align: center; }
.finance-donut-header h3 { width: 100%; margin: 0; color: var(--text-primary); font-size: 16px; font-weight: 700; text-align: center; }
.finance-donut-header span { color: var(--text-tertiary); font-size: 12px; }
.finance-donut-list { display: flex; flex: 1; flex-direction: column; justify-content: center; gap: 8px; padding: 14px 18px; }
.finance-donut-item { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 126px; padding: 8px 0; border-bottom: 1px solid #eef1f4; }
.finance-donut-item:last-child { border-bottom: 0; }
.finance-donut-visual { position: relative; width: 108px; height: 108px; }
.finance-donut-visual svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.finance-donut-track, .finance-donut-value { fill: none; stroke-width: 11; }
.finance-donut-track { stroke: #edf0f3; }
.finance-donut-value { stroke-linecap: round; transition: stroke-dashoffset .25s ease; }
.finance-donut-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.finance-donut-center strong { color: var(--text-primary); font-size: 17px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.finance-donut-center span { margin-top: 3px; color: var(--text-tertiary); font-size: 11px; }
.finance-donut-copy { min-width: 0; }
.finance-donut-copy > div { display: flex; align-items: center; gap: 6px; color: var(--text-secondary); font-size: 12px; }
.finance-donut-copy i { width: 8px; height: 8px; border-radius: 2px; }
.finance-donut-copy > div strong { color: var(--text-primary); font-size: 14px; }
.finance-donut-copy > div span { margin-left: auto; white-space: nowrap; }
.finance-donut-copy > b { display: block; margin-top: 8px; color: #f59e0b; font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.finance-donut-total { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; background: #f7f9fb; border-top: 1px solid var(--border-light); }
.finance-donut-total span { color: var(--text-secondary); font-size: 12px; }
.finance-donut-total strong { color: var(--text-primary); font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.finance-donut-header > div { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; text-align: center; }
.finance-donut-header > div span { display: block; margin-top: 4px; }
.finance-donut-period-row { padding: 12px 18px 4px; }
.finance-donut-period-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; padding: 3px; background: #f1f3f5; border-radius: 6px; }
.finance-donut-period-tabs button { min-height: 30px; color: var(--text-secondary); background: transparent; border: 0; border-radius: 4px; font-size: 12px; font-weight: 650; cursor: pointer; }
.finance-donut-period-tabs button.active { color: var(--primary); background: #fff; box-shadow: 0 1px 3px rgba(32, 40, 50, .12); }
.finance-donut-period-nav { display: grid; grid-template-columns: 28px minmax(0, 1fr) 28px; align-items: center; gap: 5px; margin-top: 7px; }
.finance-donut-period-nav button { display: grid; width: 28px; height: 28px; padding: 0; place-items: center; color: var(--text-secondary); background: #fff; border: 1px solid var(--border); border-radius: 5px; font-size: 17px; cursor: pointer; }
.finance-donut-period-nav span { overflow: hidden; color: var(--text-primary); font-size: 12px; font-weight: 650; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.finance-donut-header .finance-donut-period-nav { flex: 0 0 132px; width: 132px; margin-top: 0; }
.finance-donut-header .finance-donut-period-nav span { margin-top: 0; }
.finance-donut-category-nav { display: flex; justify-content: center; padding: 10px 18px 0; }
.finance-donut-category-nav .finance-donut-period-nav { width: 132px; margin: 0; }
.finance-donut-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 14px 18px 4px; padding: 4px; background: #f1f3f5; border-radius: 6px; }
.finance-donut-tabs button { min-height: 34px; border: 0; border-radius: 4px; font-weight: 650; cursor: pointer; transition: color .18s ease, background-color .18s ease, box-shadow .18s ease; }
.finance-donut-tabs .finance-donut-tab-income { color: #1d4ed8; background: #dbeafe; }
.finance-donut-tabs .finance-donut-tab-expense { color: #be123c; background: #ffe4e6; }
.finance-donut-tabs .finance-donut-tab-fee { color: #a16207; background: #fef3c7; }
.finance-donut-tabs .finance-donut-tab-income.active { color: #fff; background: #2563eb; box-shadow: 0 1px 3px rgba(37, 99, 235, .28); }
.finance-donut-tabs .finance-donut-tab-expense.active { color: #fff; background: #ef4758; box-shadow: 0 1px 3px rgba(239, 71, 88, .28); }
.finance-donut-tabs .finance-donut-tab-fee.active { color: #fff; background: #e59b23; box-shadow: 0 1px 3px rgba(229, 155, 35, .28); }
.finance-donut-main { display: flex; align-items: center; justify-content: center; padding: 10px 18px 6px; }
.finance-donut-visual-large { width: 184px; height: 184px; }
.finance-donut-segment { fill: none; stroke-width: 17; transform: rotate(-90deg); transform-origin: 60px 60px; }
.finance-donut-visual-large .finance-donut-center span { order: 0; margin: 0 0 5px; color: var(--text-secondary); font-size: 12px; }
.finance-donut-visual-large .finance-donut-center strong { order: 1; max-width: 132px; overflow: hidden; color: var(--text-primary); font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.finance-donut-categories { margin-top: 4px; padding: 0 14px 14px; overflow: visible; }
.finance-donut-category { display: grid; grid-template-columns: 9px minmax(0, 1fr) 72px; align-items: center; gap: 9px; min-height: 48px; border-bottom: 1px solid #eef1f4; }
.finance-donut-category > i { width: 9px; height: 9px; border-radius: 2px; }
.finance-donut-category > div { min-width: 0; }
.finance-donut-category > div strong { display: block; color: var(--text-primary); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.finance-donut-category > div span { color: var(--text-tertiary); font-size: 11px; }
.finance-donut-category > b { color: #f59e0b; font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.finance-donut-category .finance-donut-data-empty { visibility: hidden; }
.finance-donut-empty { display: grid; min-height: 120px; place-items: center; color: var(--text-tertiary); font-size: 12px; }

@media (max-width: 1100px) {
    .dashboard-finance-chart-grid { grid-template-columns: 1fr; }
    .finance-donut-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .finance-donut-item { grid-template-columns: 1fr; justify-items: center; text-align: center; border-right: 1px solid #eef1f4; border-bottom: 0; }
    .finance-donut-item:last-child { border-right: 0; }
    .finance-donut-copy { width: 100%; }
}
@media (max-width: 768px) {
    .finance-chart-svg { height: 370px; }
    .finance-chart-year-control { width: 100%; }
    .finance-chart-year-value { flex: 1; }
    .finance-donut-list { grid-template-columns: 1fr; }
    .finance-donut-item { grid-template-columns: 108px minmax(0, 1fr); justify-items: stretch; text-align: left; border-right: 0; border-bottom: 1px solid #eef1f4; }
}
input.finance-amount-input { color: #f59e0b; border-color: #f2d7a4; background-color: #fffaf0; font-weight: 650; text-align: center; font-variant-numeric: tabular-nums; }

#projTable tbody .project-band-light > td { background: #fff; }
#projTable tbody .project-band-shaded > td { background: #eaf0f6; }
#projTable tbody .project-band-light:hover > td { background: #edf5ff; }
#projTable tbody .project-band-shaded:hover > td { background: #dde9f6; }

#projTable tbody .project-row-start:not(:first-child) > td {
    border-top: 2px solid #c7d0d9;
}

#projTable .project-name-text { color: #145fc7; font-weight: 600; }
#projTable .project-name-text:hover { color: #0e4c9f; text-decoration: underline; }

/* Dialogs and feedback */
.modal-overlay { background: rgba(20, 29, 40, .48); backdrop-filter: blur(2px); }
.modal {
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: 8px;
    box-shadow: 0 22px 58px rgba(20, 29, 40, .24);
}

.modal-header { min-height: 56px; padding: 14px 18px; border-bottom-color: var(--border); }
.modal-title { font-size: 17px; font-weight: 650; }
.modal-body { padding: 20px; }
.modal-footer { padding: 12px 18px; background: #f7f8fa; border-top-color: var(--border); }
.modal-close { width: 32px; height: 32px; border-radius: 6px; }

.empty-state { padding: 56px 24px; color: var(--text-tertiary); }
.empty-state .empty-icon { opacity: .65; filter: grayscale(.15); }
.empty-state p { margin-top: 10px; color: var(--text-secondary); }

.customer-layout .data-table-wrap > .empty-state,
.page-container.is-customer-view .data-table-wrap > .empty-state {
    min-height: 100%;
    display: grid;
    place-content: center;
    text-align: center;
}

@media (max-width: 768px) {
    .page-container { padding: 14px; }
    .page-toolbar { padding: 10px; }
    .topbar { padding: 0 14px; }
    .card-body { padding: 14px; }
    .modal-body { padding: 16px; }
    .table-footer,
    .customer-layout .table-footer {
        min-height: auto;
        padding: 10px 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .footer-left { white-space: nowrap; }
    .footer-right {
        width: 100%;
        justify-content: space-between;
        gap: 8px;
        flex-wrap: nowrap;
    }
    .page-size-label { white-space: nowrap; }
    .pager { margin-left: auto; white-space: nowrap; }
    .project-name-status-row { grid-template-columns: 1fr; gap: 0; }
    .project-fee-grid { grid-template-columns: 1fr; gap: 0; }
    .project-fee-grid .project-fee-half { grid-column: auto; }
    .project-core-grid,
    .project-progress-grid { grid-template-columns: 1fr; gap: 0; }
    .finance-entry-grid { grid-template-columns: 1fr; gap: 0; }
    #pageContainer[data-page="commission"],
    #pageContainer[data-page="product"],
    #pageContainer[data-page="finance"],
    #pageContainer[data-page="ops"],
    #pageContainer[data-page="asset"],
    #pageContainer[data-page="cust-public"],
    #pageContainer[data-page="cust-cooperate"],
    #pageContainer[data-page="contacts"],
    #pageContainer[data-page="proj-stat"] { min-height: 0 !important; }
}

/* ===================== 合同模板 ===================== */
.modal-xl { max-width: 1120px; }
.muted { color: var(--text-secondary); }

.tpl-manager { padding: 4px; }
.tpl-toolbar { display: flex; gap: 10px; margin-bottom: 16px; }
.tpl-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.tpl-card { border: 1px solid var(--border); border-radius: 10px; padding: 14px; background: var(--surface); box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.tpl-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.tpl-name { font-weight: 700; font-size: 15px; color: var(--text-primary); }
.badge-default { font-size: 12px; background: #eff6ff; color: var(--primary); border: 1px solid #bfdbfe; border-radius: 999px; padding: 1px 9px; white-space: nowrap; }
.tpl-card-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

.tpl-editor { display: flex; flex-direction: column; height: 70vh; min-height: 420px; }
.tpl-editor-bar { margin-bottom: 10px; }
.tpl-editor-body { flex: 1; display: flex; gap: 12px; min-height: 0; }
.tpl-field-panel { width: 250px; flex: 0 0 250px; border: 1px solid var(--border); border-radius: 10px; padding: 10px; overflow-y: auto; background: var(--bg-secondary); }
.tpl-field-panel-title { font-size: 12px; color: var(--text-secondary); margin-bottom: 8px; }
.tpl-field-group { margin-bottom: 12px; }
.tpl-field-group-title { font-weight: 700; font-size: 13px; color: var(--text-primary); margin-bottom: 6px; padding-bottom: 4px; border-bottom: 1px dashed var(--border); }
.tpl-field-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.tpl-field-btn { font-size: 12px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--text-primary); cursor: pointer; transition: all .15s; }
.tpl-field-btn:hover { border-color: var(--primary); color: var(--primary); background: #eff6ff; }
.tpl-editor-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.tpl-edit-toolbar { display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.tpl-content { flex: 1; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; padding: 18px 22px; background: #fff; line-height: 1.8; min-height: 280px; outline: none; }
.tpl-content:focus { border-color: var(--primary); }
.tpl-content h1 { text-align: center; font-size: 22px; margin: 8px 0; }
.template-var { display: inline; background: #eef2ff; color: #4338ca; border: 1px solid #c7d2fe; border-radius: 4px; padding: 0 5px; font-size: 13px; white-space: nowrap; user-select: none; }

.gen-contract-dialog { display: flex; flex-direction: column; height: 72vh; min-height: 440px; }
.gen-preview { flex: 1; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; padding: 22px 26px; background: #fff; }
.contract-doc { max-width: 820px; margin: 0 auto; line-height: 1.85; color: #1e293b; font-family: "Microsoft YaHei", "微软雅黑", sans-serif; }
.contract-doc h1 { text-align: center; font-size: 22px; font-weight: 700; }
.contract-tbl { width: 100%; border-collapse: collapse; margin: 8px 0; }
.contract-tbl td { border: 1px solid #94a3b8; padding: 7px 10px; vertical-align: top; }
.contract-sign td { height: 160px; }

/* 客户表单：我方企业信息 / 法定代表人 跨列 */
.settings-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.settings-form-grid .col-span-2 { grid-column: 1 / -1; }
.settings-hint { font-size: 12px; color: var(--text-secondary); font-weight: 400; }
.form-row .col-span-2 { grid-column: 1 / -1; }

/* ===== 合同模板（docx 保真方案） ===== */
.tpl-manager { padding: 4px; }
.tpl-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.tpl-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.tpl-card { border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; background: var(--surface); }
.tpl-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: nowrap; white-space: nowrap; }
.tpl-name { flex: 0 1 auto; min-width: 0; font-weight: 600; color: var(--text-primary); white-space: nowrap; }
.badge-builtin, .badge-default { flex: 0 0 auto; font-size: 11px; padding: 1px 7px; border-radius: 999px; line-height: 1.6; white-space: nowrap; }
.badge-builtin { background: #e0f2fe; color: #0369a1; }
.badge-default { background: #dcfce7; color: #15803d; }
.tpl-card-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.gen-contract-dialog { padding: 4px; }
.gen-preview { margin-top: 8px; max-height: 56vh; overflow: auto; border: 1px solid var(--border); border-radius: 8px; background: #e7ebf0; padding: 18px; }
.contract-text-preview { white-space: pre-wrap; word-break: break-word; font-family: "Microsoft YaHei", sans-serif; font-size: 13px; line-height: 1.7; color: #1e293b; margin: 0; }
.gen-preview .docx-wrapper { padding: 0 !important; background: transparent !important; }
.gen-preview .docx-wrapper > section { margin: 0 auto 18px !important; box-shadow: 0 2px 10px rgba(15,23,42,.14) !important; }
.contract-native-preview { min-width: max-content; }
.contract-preview-page { position: relative; margin: 0 auto 18px; background: #fff; box-shadow: 0 2px 10px rgba(15,23,42,.2); overflow: hidden; }
.contract-preview-page canvas { display: block; width: 100%; height: 100%; }
.docx-preview-seal { position: absolute; z-index: 4; object-fit: contain; pointer-events: none; }
.docx-preview-seal.official { right: 145px; bottom: 75px; width: 125px; height: 105px; }
.docx-preview-seal.legal { right: 60px; bottom: 82px; width: 88px; height: 74px; }
.docx-preview-seal.paging { right: -12px; top: 40%; width: 62px; height: 145px; }
.docx-preview-seal.placed { right: auto !important; bottom: auto !important; height: auto !important; }
.seal-placement-mode { cursor: crosshair; }
.seal-placement-mode section.contract-preview-docx, .seal-placement-mode .contract-preview-page { cursor: crosshair; outline: 2px solid rgba(220,38,38,.22); outline-offset: -2px; }
.seal-placement-status { display: flex; align-items: center; justify-content: space-between; min-height: 34px; margin-bottom: 8px; padding: 6px 10px; border: 1px solid #fecaca; border-radius: 6px; background: #fff7f7; color: #b91c1c; font-size: 12px; font-weight: 600; }
.seal-placement-status button { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 0; background: transparent; color: #991b1b; font-size: 18px; cursor: pointer; }
.contract-seal-head-actions { display: flex; align-items: center; gap: 8px; }
.contract-seal-template { display: flex; min-width: 0; height: 82px; flex-direction: column; align-items: center; justify-content: space-between; gap: 4px; padding: 6px; border: 1px solid var(--border); border-radius: 6px; background: #f8fafc; color: #334155; cursor: pointer; }
.contract-seal-template:hover, .contract-seal-template.active { border-color: #dc2626; background: #fff7f7; color: #b91c1c; }
.contract-seal-template span { font-size: 13px; font-weight: 600; }
.contract-seal-template img { min-height: 0; max-width: 100%; max-height: 49px; object-fit: contain; }
.contract-seal-template.is-empty { justify-content: center; border-style: dashed; }
.contract-seal-template.is-empty em { color: #94a3b8; font-size: 11px; font-style: normal; font-weight: 400; }
.paging-seal-settings-panel { position: absolute; right: 18px; bottom: 12px; z-index: 7; width: min(680px, calc(100% - 36px)); border: 1px solid #fecaca; border-radius: 8px; background: #fff; box-shadow: 0 16px 40px rgba(15,23,42,.22); overflow: hidden; }
.paging-seal-settings-head { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 10px 14px; border-bottom: 1px solid #fee2e2; background: #fff7f7; }
.paging-seal-settings-head > div { display: flex; align-items: center; gap: 9px; }
.paging-seal-settings-head strong { color: #991b1b; font-size: 15px; }
.paging-seal-settings-head span { padding: 2px 7px; border-radius: 999px; background: #fee2e2; color: #b91c1c; font-size: 11px; }
.paging-seal-settings-head > button { width: 28px; height: 28px; border: 0; background: transparent; color: #64748b; font-size: 21px; cursor: pointer; }
.paging-seal-settings-body { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 16px; padding: 14px; }
.paging-seal-preview { display: flex; min-height: 230px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border: 1px dashed #cbd5e1; border-radius: 7px; background: #f8fafc; }
.paging-seal-preview img { max-width: 138px; max-height: 150px; object-fit: contain; }
.paging-seal-preview span { color: #64748b; font-size: 11px; }
.paging-seal-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
.paging-seal-fields .form-group { margin: 0; }
.paging-seal-range { display: grid; grid-template-columns: minmax(0, 1fr) 42px; align-items: center; gap: 8px; min-height: 38px; }
.paging-seal-range input { width: 100%; accent-color: #dc2626; }
.paging-seal-range span { color: #475569; font-size: 12px; text-align: right; }
.paging-seal-page-row { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.paging-seal-duplex { display: flex; grid-column: 1 / -1; align-items: center; gap: 7px; min-height: 32px; color: #475569; font-size: 12px; }
.paging-seal-duplex input { accent-color: #dc2626; }
.paging-seal-settings-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 14px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
@media (max-width: 720px) { .paging-seal-settings-body { grid-template-columns: 1fr; } .paging-seal-preview { min-height: 130px; } .paging-seal-fields { grid-template-columns: 1fr; } .paging-seal-page-row { grid-column: auto; } .paging-seal-duplex { grid-column: auto; } }
.company-seal-uploader { padding: 14px; border: 1px solid #e2e8f0; border-radius: 8px; background: #f8fafc; }
.company-seal-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 14px; }
.company-seal-tab { min-width: 92px; text-align: center; justify-content: center; }
.company-seal-tab.is-active { background: #3b6cff; border-color: #3b6cff; color: #fff; }
.company-seal-single { max-width: 440px; margin: 0 auto; padding: 14px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; text-align: center; }
.company-seal-single-preview { display: flex; align-items: center; justify-content: center; min-height: 130px; max-height: 210px; border: 1px dashed #cbd5e1; border-radius: 6px; background: #fff; color: #94a3b8; font-size: 13px; overflow: hidden; margin-bottom: 12px; }
.company-seal-single-preview img { max-width: 100%; max-height: 200px; object-fit: contain; }
.company-seal-single-actions { display: flex; justify-content: center; gap: 8px; }
@media (max-width: 720px) { .company-seal-single { max-width: none; } }
.gen-contract-dialog { position: relative; }
.contract-seal-btn { border-color: #dc2626; color: #b91c1c; background: #fff; }
.contract-seal-btn:hover { background: #fef2f2; border-color: #b91c1c; }
.contract-preview-sheet { position: relative; min-height: 100%; padding: 10px 34px 18px 10px; box-sizing: border-box; }
.contract-seal-signatures { display: flex; justify-content: flex-end; align-items: flex-end; gap: 18px; min-height: 92px; margin-top: 20px; }
.contract-seal-image { display: block; max-width: 112px; max-height: 96px; object-fit: contain; }
.contract-seal-image.legal { max-width: 82px; max-height: 72px; }
.contract-seal-gutter { position: absolute; right: -7px; top: 42%; width: 58px; max-height: 138px; object-fit: contain; }
.contract-seal-panel { position: absolute; right: 10px; bottom: 10px; z-index: 5; width: min(580px, calc(100% - 20px)); padding: 10px; border: 1px solid #fecaca; border-radius: 8px; background: #fff; box-shadow: 0 12px 32px rgba(15,23,42,.18); }
.contract-seal-panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; color: #991b1b; }
.contract-seal-close { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; color: #64748b; font-size: 22px; cursor: pointer; }
.contract-seal-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.contract-seal-group { min-width: 0; padding: 7px; border: 1px solid #e2e8f0; border-radius: 7px; background: #fff; }
.contract-seal-group-title { margin-bottom: 6px; color: #475569; font-size: 12px; font-weight: 700; text-align: center; }
.contract-seal-group-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.contract-seal-option { min-width: 0; padding: 10px; border: 1px solid var(--border); border-radius: 7px; background: #f8fafc; }
.contract-seal-option-title { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 8px; font-size: 13px; font-weight: 600; color: #334155; }
.contract-seal-option.is-applied { border-color: #f87171; background: #fff7f7; }
.contract-seal-applied { flex: 0 0 auto; padding: 1px 7px; border-radius: 999px; background: #fee2e2; color: #b91c1c; font-size: 11px; font-weight: 600; }
.contract-seal-option-preview { display: flex; align-items: center; justify-content: center; height: 76px; margin-bottom: 8px; border: 1px dashed #cbd5e1; border-radius: 6px; background: #fff; color: #94a3b8; font-size: 12px; overflow: hidden; }
.contract-seal-option-preview img { max-width: 100%; max-height: 72px; object-fit: contain; }
.contract-seal-option-actions { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; }
@media (max-width: 720px) { .contract-seal-options { grid-template-columns: 1fr; } .contract-seal-panel { max-height: 70%; overflow-y: auto; } }
.contract-pdf-render-host { position: fixed; left: -10000px; top: 0; z-index: -1; width: 794px; background: #fff; }
.contract-pdf-render-host .docx-wrapper { padding: 0 !important; background: #fff !important; }
.contract-pdf-render-host section.contract-source-docx { margin: 0 !important; box-shadow: none !important; }
.pdf-stamp-entry { border-color: #fecaca; color: #b91c1c; }
.pdf-stamp-workspace { display: grid; gap: 16px; }
.pdf-stamp-workspace:has(.pdf-stamp-preview-wrap) { position: relative; height: 68vh; min-height: 480px; grid-template-rows: auto minmax(0, 1fr); }
.pdf-stamp-section { padding: 14px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.pdf-stamp-section-title { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #1e293b; }
.pdf-stamp-section-title > span { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 5px; background: #fee2e2; color: #b91c1c; font-size: 11px; font-weight: 700; }
.pdf-stamp-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; min-height: 108px; border: 1px dashed #94a3b8; border-radius: 7px; background: #f8fafc; color: #334155; cursor: pointer; }
.pdf-stamp-drop:hover { border-color: #dc2626; background: #fff7f7; }
.pdf-stamp-drop span { margin-top: 5px; color: #64748b; font-size: 12px; }
.pdf-stamp-file-ready { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid #bbf7d0; border-radius: 7px; background: #f0fdf4; }
.pdf-stamp-file-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 6px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; }
.pdf-stamp-file-ready > div { display: flex; flex: 1; min-width: 0; flex-direction: column; }
.pdf-stamp-file-ready strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pdf-stamp-file-ready span { color: #64748b; font-size: 12px; }
.pdf-stamp-preview-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pdf-stamp-preview-toolbar .pdf-stamp-file-ready { flex: 1; min-width: 0; padding: 8px 10px; }
.pdf-stamp-preview-toolbar > div:last-child { display: flex; flex: 0 0 auto; gap: 7px; }
.pdf-enable-seal-btn { border-color: #fecaca; color: #b91c1c; }
.pdf-stamp-preview-wrap { min-height: 0; overflow: auto; padding: 20px; border: 1px solid #cbd5e1; border-radius: 8px; background: #737b86; }
.pdf-stamp-loading { padding: 60px 20px; color: #fff; text-align: center; }
.pdf-stamp-page { position: relative; margin: 0 auto 18px; background: #fff; box-shadow: 0 3px 14px rgba(15,23,42,.3); overflow: hidden; }
.pdf-stamp-page canvas { display: block; width: 100%; height: 100%; }
.pdf-placement-seal { position: absolute; z-index: 3; height: auto; object-fit: contain; pointer-events: none; }
.pdf-stamp-preview-wrap.seal-placement-mode .pdf-stamp-page { cursor: crosshair; outline: 2px solid rgba(220,38,38,.35); outline-offset: -2px; }
.pdf-seal-template-panel, .pdf-paging-settings { right: 16px; bottom: 12px; }
.pdf-stamp-page-info { margin-top: 7px; color: #64748b; font-size: 12px; text-align: right; }
.pdf-stamp-seal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pdf-stamp-seal-card { padding: 10px; border: 1px solid var(--border); border-radius: 7px; background: #f8fafc; }
.pdf-stamp-seal-card.is-enabled { border-color: #f87171; background: #fff7f7; }
.pdf-stamp-seal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 13px; }
.pdf-stamp-seal-preview { display: flex; align-items: center; justify-content: center; height: 86px; border: 1px dashed #cbd5e1; border-radius: 6px; background: #fff; color: #94a3b8; font-size: 12px; overflow: hidden; }
.pdf-stamp-seal-preview img { max-width: 100%; max-height: 82px; object-fit: contain; }
.pdf-stamp-seal-actions { display: flex; justify-content: center; gap: 6px; margin-top: 8px; }
.pdf-stamp-template-source { margin-top: 8px; color: #64748b; font-size: 11px; text-align: center; }
.pdf-stamp-switch { position: relative; width: 34px; height: 19px; }
.pdf-stamp-switch input { position: absolute; opacity: 0; pointer-events: none; }
.pdf-stamp-switch span { position: absolute; inset: 0; border-radius: 999px; background: #cbd5e1; cursor: pointer; transition: .18s; }
.pdf-stamp-switch span::after { content: ''; position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; border-radius: 50%; background: #fff; transition: .18s; }
.pdf-stamp-switch input:checked + span { background: #dc2626; }

/* ===== 客户管理弹窗编辑框增强（cust-edit-scope） ===== */
/* 灰度只读态 + 悬停铅笔解锁（所有表单弹窗通用：客户弹窗 cust-edit-locked 下拉禁用，普通表单下拉保持可取值仅灰显） */
.modal-drawer .edit-locked,
.modal-drawer .edit-locked:focus {
    background: #f2f3f5;
    border-color: #e3e6ea;
    color: var(--text-primary, #1f2329);
    cursor: default;
    box-shadow: none;
}
.modal-drawer .edit-unlocked,
.modal-drawer .edit-unlocked:focus {
    background: #fff;
    border-color: var(--primary, #3b6cff);
    color: var(--text-primary, #1f2329);
    cursor: text;
}
/* 字段容器相对定位，承载编辑图标（全局：详情弹窗无论是否 drawer 都需覆盖层） */
.form-group { position: relative; }
.modal-drawer .form-group > input,
.modal-drawer .form-group > select,
.modal-drawer .form-group > textarea { padding-right: 12px; }
.field-double-click-trigger {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 38px;
    z-index: 2;
    cursor: text;
    border-radius: 6px;
}
textarea + .field-double-click-trigger { height: calc(100% - 27px); pointer-events: none; }
select + .field-double-click-trigger { cursor: default; }
.field-double-click-trigger[hidden] { display: none; }
/* 最右侧编辑图标（hover 显示） */
.modal-drawer .field-edit-btn {
    position: absolute;
    right: 6px;
    top: 32px;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 5px;
    background: rgba(59, 108, 255, 0.08);
    color: #3b6cff;
    font-size: 13px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity .15s ease;
    z-index: 2;
}
.modal-drawer .form-group:hover > .field-edit-btn,
.modal-drawer .field-edit-btn:hover,
.modal-drawer .field-edit-btn:focus { opacity: 1; }
.modal-drawer .field-edit-btn:hover { background: rgba(59, 108, 255, 0.18); }
.modal-drawer .field-edit-actions {
    position: absolute; right: 6px; top: 30px; z-index: 3;
    display: flex; height: 34px; align-items: center;
}
.modal-drawer .field-confirm-btn,
.modal-drawer .field-cancel-btn {
    width: 20px; height: 20px; border-radius: 4px;
    border: 1px solid var(--border); background: #fff; cursor: pointer;
    font-size: 12px; line-height: 1; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
}
.modal-drawer .field-confirm-btn { color: #16a34a; border-color: #bbf7d0; }
.modal-drawer .field-confirm-btn:hover { background: #f0fdf4; }

/* All detail forms remain visually grey while fields stay directly editable. */
.customer-detail-modal .form-control,
.project-detail-modal .form-control,
.standard-detail-modal .form-control,
.customer-detail-modal input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.project-detail-modal input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.standard-detail-modal input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.customer-detail-modal select,
.project-detail-modal select,
.standard-detail-modal select,
.customer-detail-modal textarea,
.project-detail-modal textarea,
.standard-detail-modal textarea,
.customer-detail-modal .birthday-editor,
.project-detail-modal .birthday-editor,
.standard-detail-modal .birthday-editor {
    background-color: #f2f3f5;
    border-color: #e1e5ea;
}
.customer-detail-modal .form-control:focus,
.project-detail-modal .form-control:focus,
.standard-detail-modal .form-control:focus,
.customer-detail-modal input:focus,
.project-detail-modal input:focus,
.standard-detail-modal input:focus,
.customer-detail-modal select:focus,
.project-detail-modal select:focus,
.standard-detail-modal select:focus,
.customer-detail-modal textarea:focus,
.project-detail-modal textarea:focus,
.standard-detail-modal textarea:focus {
    background-color: #f2f3f5;
    border-color: var(--primary);
}
.customer-detail-modal .edit-unlocked,
.customer-detail-modal .edit-unlocked:focus,
.project-detail-modal .edit-unlocked,
.project-detail-modal .edit-unlocked:focus,
.standard-detail-modal .edit-unlocked,
.standard-detail-modal .edit-unlocked:focus {
    background-color: #fff !important;
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 2px rgba(59, 108, 255, .18) !important;
    color: var(--text-primary);
}

/* 板块标题左侧折叠箭头 */
.cust-edit-scope .cd-section-title { display: inline-flex; align-items: center; cursor: pointer; user-select: none; }
.cust-edit-scope .section-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px; height: 18px;
    margin-right: 6px;
    border-radius: 4px;
    color: var(--text-secondary, #64748b);
    transition: transform .2s ease;
}
.cust-edit-scope .section-toggle:hover { background: rgba(0,0,0,0.05); }
.cust-edit-scope .section-toggle.collapsed { transform: rotate(-90deg); }
.cust-edit-scope .cd-section.collapsed > *:not(.cd-section-title) { display: none; }
.cust-edit-scope .cd-sub-toolbar.collapsed + .data-table-wrap { display: none; }

/* 图片点击上传（去按钮化） */
.cust-edit-scope .seal-uploader.clickable-upload,
.cust-edit-scope .seal-upload-row.clickable-upload { cursor: pointer; }
.cust-edit-scope .clickable-upload .seal-preview {
    min-height: 50px;
    border: 1px dashed #d0d5dd;
    border-radius: 6px;
    padding: 6px;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.cust-edit-scope .clickable-upload .seal-preview:hover { border-color: #3b6cff; background: rgba(59,108,255,0.04); }
.cust-edit-scope .clickable-upload .seal-preview:empty::after {
    content: '点击上传图片';
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    color: var(--text-tertiary, #94a3b8);
    font-size: 12px;
}
.pdf-stamp-switch input:checked + span::after { transform: translateX(15px); }
.pdf-stamp-switch input:disabled + span { opacity: .45; cursor: not-allowed; }
@media (max-width: 720px) { .pdf-stamp-seal-grid { grid-template-columns: 1fr; } }

/* 人员管理：本年提成 12 个月字段网格 */
.personnel-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.personnel-summary-grid .form-group { min-width: 0; margin-bottom: 0; }
.field-section-title { margin: 14px 0 8px; font-weight: 600; font-size: 13px; color: var(--text-secondary); }
.month-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 4px; }
.month-grid .form-group { margin-bottom: 0; }
.personnel-money-input { text-align: right; font-variant-numeric: tabular-nums; }
.total-bar { margin-top: 12px; padding: 12px; background: var(--primary-bg); border-radius: 8px; font-size: 13px; color: var(--primary-dark); }
.total-bar .amount { font-size: 15px; }
@media (max-width: 900px) {
    .personnel-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .month-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 应用外壳：统一顶栏、浅色侧栏及桌面折叠状态。 */
:root { --topbar-height: 72px; --sidebar-collapsed-width: 72px; }
.page-title { display: none; }
.sidebar {
    color: #405466;
    background: #edf5f6;
    border-right: 1px solid #d7e3e6;
    box-shadow: 3px 0 14px rgba(49, 75, 88, .07);
}
.sidebar-header,
.topbar {
    height: var(--topbar-height);
    min-height: var(--topbar-height);
    box-sizing: border-box;
    background: #f8fbfc;
    border-bottom: 1px solid #dbe5e8;
    box-shadow: none;
}
.sidebar-header { position: relative; padding: 14px 42px 14px 16px; }
.topbar { padding: 0 22px; }
.logo-icon { color: #22577a; background: #dfeff2; border-color: #c8dde2; }
.logo-text h1 { color: #183642; }
.logo-text p { color: #6f8791; }
.sidebar-dashboard { padding: 12px 10px 8px; background: transparent; border-bottom-color: #d7e3e6; }
.sidebar-nav { padding: 12px 10px 18px; scrollbar-color: #bfd0d5 transparent; }
.nav-label { color: #76909a; }
.nav-item,
.nav-subitem { color: #405466; }
.nav-item:hover,
.nav-subitem:hover { color: #183642; background: #dfecee; }
.nav-item.active,
.nav-subitem.active,
.sidebar-dashboard .nav-item.active {
    color: #fff;
    background: #1677d2;
    box-shadow: inset 3px 0 0 #8bc4f7, 0 3px 9px rgba(22, 119, 210, .18);
}
.sidebar-footer { background: #e7f0f2; border-top-color: #cfdee2; }
.user-name { color: #233f4b; }
.user-role { color: #738b95; }
.user-avatar { background: #1677d2; }
.sidebar-collapse {
    position: absolute;
    top: 23px;
    right: -13px;
    z-index: 3;
    display: grid;
    width: 26px;
    height: 26px;
    padding: 0;
    place-items: center;
    color: #41616f;
    background: #fff;
    border: 1px solid #cbdadd;
    border-radius: 50%;
    box-shadow: 0 2px 7px rgba(35, 63, 75, .14);
    font-size: 18px;
    line-height: 1;
}
.sidebar-collapse:hover { color: #0f67b1; border-color: #79afd1; background: #f5fbff; }

@media (min-width: 769px) {
    body.sidebar-collapsed .sidebar { width: var(--sidebar-collapsed-width); }
    body.sidebar-collapsed .sidebar::after,
    body.sidebar-collapsed .nav-item[data-page]::before,
    body.sidebar-collapsed .nav-rail-ball { display: none; }
    body.sidebar-collapsed .main-content { margin-left: var(--sidebar-collapsed-width); }
    body.sidebar-collapsed .sidebar-header { padding: 14px 12px; }
    body.sidebar-collapsed .logo { justify-content: center; }
    body.sidebar-collapsed .logo-text,
    body.sidebar-collapsed .nav-label,
    body.sidebar-collapsed .nav-item > span:not(.nav-icon),
    body.sidebar-collapsed .user-detail { display: none; }
    body.sidebar-collapsed .sidebar-dashboard,
    body.sidebar-collapsed .sidebar-nav { padding-left: 8px; padding-right: 8px; }
    body.sidebar-collapsed .nav-subitems { display: flex; flex-direction: column; gap: 3px; }
    body.sidebar-collapsed .nav-item,
    body.sidebar-collapsed .nav-subitem { justify-content: center; min-height: 44px; padding: 8px; gap: 0; }
    body.sidebar-collapsed .nav-icon { width: 30px; font-size: 21px; }
    body.sidebar-collapsed .nav-subitem .nav-icon { width: 30px; font-size: 19px; }
    body.sidebar-collapsed .sidebar-footer { padding: 14px 10px; }
    body.sidebar-collapsed .user-info { justify-content: center; }
    body.sidebar-collapsed .user-avatar { width: 42px; height: 42px; font-size: 17px; }
}

@media (max-width: 768px) {
    .sidebar-collapse { display: none; }
    .sidebar { background: #edf5f6; }
    .menu-toggle { display: block; }
}

/* 顶部框独立于侧栏宽度，侧栏仅在顶部框下方展开或收紧。 */
.topbar {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 90;
    width: 100%;
    padding-left: var(--sidebar-width);
}
.sidebar-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 105;
    width: var(--sidebar-width);
    padding: 14px 16px;
}
.sidebar { top: var(--topbar-height); height: calc(100vh - var(--topbar-height)); }
.sidebar::after {
    content: '';
    position: absolute;
    z-index: 2;
    top: 20px;
    right: 60px;
    bottom: 82px;
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(180deg, #ff875f 0%, #ffc06c 18%, #e5cb91 38%, #75d8df 64%, #24b9e7 82%, #397ee4 100%);
    box-shadow: 0 0 3px rgba(255,182,104,.7), 0 0 8px rgba(59,190,223,.72), 0 0 14px rgba(53,126,228,.36);
    pointer-events: none;
}
.main-content { padding-top: var(--topbar-height); }
.sidebar-dashboard { position: relative; padding-right: 10px; }
.sidebar-dashboard .nav-item { padding-right: 42px; }
.sidebar-collapse { top: 20px; right: -13px; }

/* 当前菜单：轻微抬升、内高光和柔和阴影，切换时平滑过渡。 */
.nav-item,
.nav-subitem {
    z-index: auto;
    position: relative;
    overflow: hidden;
    transition: none;
}
.nav-item.active,
.nav-subitem.active,
.sidebar-dashboard .nav-item.active {
    color: #fff;
    background: transparent;
    box-shadow: none;
    transform: none;
}
.nav-item.active::after,
.nav-subitem.active::after {
    content: '';
    position: absolute;
    z-index: 0;
    inset: 0 73px 0 0;
    pointer-events: none;
    border-radius: 6px;
    background: #176fae;
    box-shadow: inset 4px 0 0 #0b5f9d, inset 0 0 0 1px rgba(90,151,194,.2), 0 2px 7px rgba(38,91,126,.12);
}
.sidebar-dashboard .nav-item.active::after { right: 88px; }
.nav-item[data-page] > span { position: relative; z-index: 1; }
.nav-item[data-page]::before {
    content: '';
    position: absolute;
    z-index: 3;
    top: 50%;
    right: 29px;
    width: 12px;
    height: 12px;
    box-sizing: border-box;
    border: 2px solid #6d9dbc;
    border-radius: 50%;
    background: #eef7fa;
    box-shadow: inset 1px 1px 2px rgba(255,255,255,.95), inset -1px -1px 2px rgba(45,99,132,.22), 0 1px 3px rgba(42,88,116,.2);
    transform: translateY(-50%);
}
.sidebar-dashboard .nav-item[data-page]::before { right: 44px; }

/* 深色侧边栏与无轨道菜单模式 */
.sidebar,
.sidebar-header,
.sidebar-nav { background: #182b3b; }
.sidebar-dashboard { background: transparent; border-bottom-color: #2d4b61; }
.sidebar-footer { background: #132433; border-top-color: #2d4b61; }
.sidebar .nav-item { color: #d4e0e8; }
.sidebar .nav-item:hover { background: #27465d; color: #fff; }
.sidebar .nav-label { color: #91adbd; }
.sidebar .logo-text h1,
.sidebar .user-name { color: #f2f7fa; }
.sidebar .logo-text p,
.sidebar .user-role { color: #9db6c6; }
.sidebar .nav-item.active { color: #fff; }
.sidebar::after,
.sidebar .nav-item[data-page]::before,
.nav-rail-ball { display: none !important; }
.nav-item[data-page].active::before {
    border-color: #084e84;
    background: radial-gradient(circle at 35% 30%, #83c8f3 0 18%, #0e6daf 34%, #074675 100%);
    box-shadow: inset 1px 1px 2px rgba(255,255,255,.45), inset -2px -2px 3px rgba(2,44,75,.42), 0 2px 5px rgba(7,67,108,.36);
}
.nav-item[data-page].active.nav-ball-pending::before {
    border-color: #6d9dbc;
    background: #eef7fa;
}
.nav-item[data-page].active.nav-ball-waiting { color: #185f91; }
.nav-item[data-page].active.nav-ball-waiting::after { background: #d8eaf6; box-shadow: inset 4px 0 0 #6aa6ce, inset 0 0 0 1px rgba(90,151,194,.18); }
.nav-item[data-page].active.nav-ball-pending::after { animation: navMenuBlockArrival var(--nav-elevator-duration) cubic-bezier(.45,.05,.2,1) forwards; }
@keyframes navMenuBlockArrival {
    from { background: #d8eaf6; box-shadow: inset 4px 0 0 #6aa6ce, inset 0 0 0 1px rgba(90,151,194,.18), 0 2px 7px rgba(38,91,126,.06); }
    to { background: #176fae; box-shadow: inset 4px 0 0 #0b5f9d, inset 0 0 0 1px rgba(90,151,194,.2), 0 2px 7px rgba(38,91,126,.12); }
}
.nav-rail-ball {
    position: fixed;
    z-index: 130;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    border: 2px solid #064879;
    border-radius: 50%;
    background: radial-gradient(circle at 32% 28%, #9bdbff 0 15%, #147ab9 34%, #063f6a 100%);
    box-shadow: inset 1px 1px 2px rgba(255,255,255,.48), inset -2px -2px 3px rgba(1,38,65,.48), 0 0 0 4px rgba(34,137,197,.14), 0 5px 10px rgba(4,54,89,.42);
    pointer-events: none;
    will-change: transform;
}
@media (prefers-reduced-motion: reduce) { .nav-rail-ball { display: none; } }

@media (min-width: 769px) {
    body.sidebar-collapsed .sidebar-header { width: var(--sidebar-width); padding: 14px 16px; }
    body.sidebar-collapsed .sidebar-header .logo { justify-content: flex-start; }
    body.sidebar-collapsed .sidebar-header .logo-text { display: block; }
    body.sidebar-collapsed .sidebar-dashboard { padding-right: 8px; }
    body.sidebar-collapsed .sidebar-dashboard .nav-item { padding-right: 8px; }
}

/* 客户转公海引用拦截提示面板 */
.convert-block { padding: 4px 2px; }
.convert-block-reason { font-size: 14px; color: var(--text-primary); line-height: 1.7; margin: 0 0 10px; }
.convert-block-reason b { color: #b91c1c; }
.convert-block-list { margin: 0 0 12px; padding-left: 20px; max-height: 240px; overflow-y: auto; }
.convert-block-list li { font-size: 13px; color: var(--text-secondary); line-height: 1.9; }
.convert-block-more { color: #94a3b8; font-style: italic; }
.convert-block-hint { font-size: 13px; color: var(--text-secondary); line-height: 1.7; margin: 0; background: #fff7ed; border-left: 3px solid #f59e0b; padding: 8px 10px; border-radius: 4px; }

@media (max-width: 768px) {
    .topbar { padding-left: 14px; }
    .sidebar-header { position: static; width: auto; }
    .sidebar { top: 0; height: 100vh; }
    .main-content { padding-top: var(--topbar-height); }
}

/* ===== 工作台图标右上角数字角标（今日事项数） ===== */
#dashboardAlarm { position: relative; }
.nav-badge {
    position: absolute;
    top: -7px;
    right: -9px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 9px;
    background: #ef4444;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(239, 68, 68, .5);
}
.nav-badge[hidden] { display: none; }


/* ===== 一级菜单分类标题折叠（accordion） ===== */
.sidebar-nav .nav-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ===== 字段类型标识（引用/文本/日期/下拉/自动） ===== */
.field-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    padding: 0 6px;
    height: 16px;
    font-size: 10px;
    line-height: 1;
    border-radius: 999px;
    font-weight: 600;
    vertical-align: middle;
    cursor: default;
    user-select: none;
    transform: translateY(-1px);
}
.ft-ref    { background: #eef2ff; color: #3b6cff; }
.ft-text   { background: #f3f4f6; color: #6b7280; }
.ft-date   { background: #fff7ed; color: #d97706; }
.ft-select { background: #f5f3ff; color: #7c3aed; }
.ft-auto   { background: #ecfdf5; color: #16a34a; }

/* ===== 分栏标题统一霓虹彩色框 + 脉动（客户详情弹窗 / 合同·发票·回款编辑 / 人员提成；项目汇总已自带） ===== */
.cd-section-title,
.contract-form-section-title,
.field-section-title {
    display: inline-flex;
    align-items: center;
    margin-bottom: 14px;
    padding: 4px 16px;
    border-radius: 999px;
    --neon-rgb: 59,130,246;
    border: 1.5px solid rgb(var(--neon-rgb));
    color: #1d4ed8;
    background: rgba(var(--neon-rgb), .07);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .5px;
    box-shadow: 0 0 4px rgba(var(--neon-rgb), .75), 0 0 10px rgba(var(--neon-rgb), .45), 0 0 18px rgba(var(--neon-rgb), .28);
    text-shadow: 0 0 6px rgba(var(--neon-rgb), .6);
    animation: proj-neon 2.6s ease-in-out infinite;
}

/* 数字圆点（CSS 计数器自动生成 01/02…，无需改模板） */
.cd-section-title,
.contract-form-section-title {
    counter-increment: neon-sec;
    position: relative;
    padding-left: 38px;
}
.cd-section-title::before,
.contract-form-section-title::before {
    content: counter(neon-sec, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid rgb(var(--neon-rgb));
    color: rgb(var(--neon-rgb));
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    animation: proj-neon 2.6s ease-in-out infinite;
}

/* 各栏配色：按容器内出现顺序轮转调色板（蓝→绿→紫→橙→青→粉） */
.cd-section:nth-of-type(1) .cd-section-title { --neon-rgb: 59,130,246; border-color: #3b82f6; color: #1d4ed8; }
.cd-section:nth-of-type(2) .cd-section-title { --neon-rgb: 16,185,129; border-color: #10b981; color: #047857; }
.cd-section:nth-of-type(3) .cd-section-title { --neon-rgb: 139,92,246; border-color: #8b5cf6; color: #6d28d9; }
.cd-section:nth-of-type(4) .cd-section-title { --neon-rgb: 245,158,11; border-color: #f59e0b; color: #b45309; }
.cd-section:nth-of-type(5) .cd-section-title { --neon-rgb: 6,182,212; border-color: #06b6d4; color: #0e7490; }
.cd-section:nth-of-type(6) .cd-section-title { --neon-rgb: 236,72,153; border-color: #ec4899; color: #be185d; }
.contract-form-section:nth-of-type(1) .contract-form-section-title { --neon-rgb: 59,130,246; border-color: #3b82f6; color: #1d4ed8; }
.contract-form-section:nth-of-type(2) .contract-form-section-title { --neon-rgb: 16,185,129; border-color: #10b981; color: #047857; }
.field-section-title { --neon-rgb: 6,182,212; border-color: #06b6d4; color: #0e7490; }

/* 计数器初始化：每个弹窗内容区独立计数（注意：弹窗内容注入 #modalBody，故重置点挂在 .modal-body 而非不存在的 .modal-content） */
.modal-body { counter-reset: neon-sec; }

/* 工具栏标题（如「项目 (N)」带按钮）不套霓虹框、不加数字圆点 */
.cust-edit-scope .cd-sub-toolbar .cd-section-title {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    text-shadow: none;
    animation: none;
    counter-increment: none;
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
}
.cust-edit-scope .cd-sub-toolbar .cd-section-title::before { content: none; }

/* 公海详情「联系人」分栏标题：恢复霓虹框（绿、带02数字圆点、脉动），与01分栏「公海客户详情」一致；保留按钮行布局 */
.cust-edit-scope .cd-sub-toolbar .cd-section-title.neon-on {
    display: inline-flex;
    align-items: center;
    margin-bottom: 14px;
    padding: 4px 16px;
    padding-left: 38px;
    border-radius: 999px;
    --neon-rgb: 16,185,129;
    border: 1.5px solid rgb(var(--neon-rgb));
    color: #047857;
    background: rgba(var(--neon-rgb), .07);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .5px;
    box-shadow: 0 0 4px rgba(var(--neon-rgb), .75), 0 0 10px rgba(var(--neon-rgb), .45), 0 0 18px rgba(var(--neon-rgb), .28);
    text-shadow: 0 0 6px rgba(var(--neon-rgb), .6);
    animation: proj-neon 2.6s ease-in-out infinite;
    counter-increment: neon-sec;
    position: relative;
}
.cust-edit-scope .cd-sub-toolbar .cd-section-title.neon-on::before {
    content: counter(neon-sec, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid rgb(var(--neon-rgb));
    color: rgb(var(--neon-rgb));
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    animation: proj-neon 2.6s ease-in-out infinite;
}

/* 尊重系统「减少动态效果」偏好：关闭脉动 */
@media (prefers-reduced-motion: reduce) {
    .cd-section-title,
    .contract-form-section-title,
    .field-section-title,
    .cd-section-title::before,
    .contract-form-section-title::before { animation: none; }
}

/* 设置页开关（启用本机 WPS 排版服务等） */
.settings-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; }
.settings-switch-row .form-label { margin: 0; font-weight: 600; }
.switch { position: relative; display: inline-block; width: 46px; height: 26px; flex: 0 0 auto; cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.switch .slider { position: absolute; inset: 0; background: #cbd5e1; border-radius: 999px; transition: background .2s ease; }
.switch .slider::before { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; background: #fff; border-radius: 50%; transition: transform .2s ease; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.switch input:checked + .slider { background: #2563eb; }
.switch input:checked + .slider::before { transform: translateX(20px); }
.switch input:focus-visible + .slider { box-shadow: 0 0 0 3px rgba(37,99,235,.35); }

/* ============ HTML 合同预览 / 打印 ============ */
.gen-preview { background:#525659; padding:16px; overflow:auto; max-height:72vh; }
.contract-html-doc { background:#fff; width:210mm; max-width:100%; margin:0 auto; padding:25mm 19mm; box-shadow:0 2px 12px rgba(0,0,0,.35); color:#1a1a1a; font-family:"仿宋","FangSong","STFangsong","宋体","SimSun",serif; font-size:12pt; line-height:1.5; }
.contract-page { position:relative; }
.contract-title { text-align:center; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","宋体","SimSun",serif; font-size:36pt; font-weight:900; margin:0 0 4mm; }
.contract-meta { text-align:center; font-size:16pt; margin-bottom:5mm; color:#1a1a1a; }
.contract-meta span { display:block; }
.contract-lead { text-align:center; font-weight:bold; font-size:36pt; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","宋体","SimSun",serif; margin:3mm 0 4mm; }
.contract-para { text-indent:2em; margin:3mm 0; font-size:12pt; }
.contract-h2 { font-size:12pt; font-weight:bold; margin:6mm 0 3mm; }
.contract-parties, .contract-info { width:100%; border-collapse:collapse; margin:3mm 0; font-size:12pt; }
.contract-parties th, .contract-parties td, .contract-info td { border:1px solid #444; padding:4px 8px; }
.contract-parties th { text-align:center; }
.ci-label { width:110px; font-weight:bold; }
.contract-sign { display:flex; justify-content:space-between; margin-top:14mm; font-size:12pt; }
.sign-block { width:45%; }
.sign-row { margin:6mm 0 0; white-space:nowrap; }
.contract-html-seal { position:absolute; z-index:4; object-fit:contain; pointer-events:none; }
.contract-html-seal.official { right:6%; bottom:70mm; width:120px; height:120px; }
.contract-html-seal.legal { right:2%; bottom:74mm; width:88px; height:88px; }
.contract-html-seal.paging { right:-4px; top:42%; width:42px; height:130px; }
.contract-html-seal.placed { right:auto !important; bottom:auto !important; height:auto !important; }

/* 合同模板类型徽标 */
.badge-html { display:inline-block; padding:1px 7px; border-radius:10px; font-size:11px; background:#e7f5ff; color:#1971c2; border:1px solid #a5d8ff; margin-right:4px; }
.badge-docx { display:inline-block; padding:1px 7px; border-radius:10px; font-size:11px; background:#fff4e6; color:#e8590c; border:1px solid #ffd8a8; margin-right:4px; }
.badge-builtin { display:inline-block; padding:1px 7px; border-radius:10px; font-size:11px; background:#f1f3f5; color:#495057; border:1px solid #dee2e6; margin-right:4px; }
.badge-default { display:inline-block; padding:1px 7px; border-radius:10px; font-size:11px; background:#e6fcf5; color:#0ca678; border:1px solid #96f2d7; margin-right:4px; }

/* ===== 创建态表单（编辑模式：白底可写） + 必填校验高亮 ===== */
/* 创建记录时整表进入编辑模式，不套用详情预览的灰色锁定态（锁定逻辑见 app.js enhanceModalForm）。
   注意：上方 .customer-detail-modal input:not(hidden):not(file):not(checkbox):not(radio) 的灰底规则
   特异性高达 (0,5,1)，此处必须用同构 :not 链把特异性抬到 (0,6,1) 才能压过，否则 input 仍是灰色。
   末尾 :not([disabled]) 既抬特异性，又让 disabled 字段（如“所属客户”）天然沿用灰底不可改。 */
.form-create-mode .form-control:not([disabled]),
.form-create-mode input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([disabled]),
.form-create-mode select:not([disabled]),
.form-create-mode textarea:not([disabled]),
.form-create-mode .birthday-editor {
    background-color: #fff;
    border-color: #d7dbe0;
    cursor: auto;
}
/* 创建态不出现“双击编辑”遮罩 */
.form-create-mode .field-double-click-trigger { display: none; }

/* 客户类型未选择时的占位文案 */
.customer-type-placeholder { color: #9aa1ab; font-size: 13px; }

/* 必填项未填写：红框高亮定位 */
.modal-drawer .field-invalid,
.modal-drawer .edit-locked.field-invalid,
.field-invalid {
    border-color: #e54545 !important;
    box-shadow: 0 0 0 2px rgba(229, 69, 69, .12) !important;
}
.customer-type-select.field-invalid .customer-type-trigger {
    border-color: #e54545;
    box-shadow: 0 0 0 2px rgba(229, 69, 69, .12);
}

/* ==================== 选项配色板（9 色，数据驱动） ==================== */
/* 字典里存的是「色键」（gray/blue/…），运行时拼成 .tone-c-*，
   badge / type-tag / opt-select 触发器 / 菜单项 共用同一套规则。 */
.tone-c-gray   { --tc-fg: #6b7280; --tc-bg: #eef1f6; --tc-bd: #dce1e7; }
.tone-c-blue   { --tc-fg: #1769e0; --tc-bg: #e8f1ff; --tc-bd: #b9d5ff; }
.tone-c-cyan   { --tc-fg: #0891b2; --tc-bg: #ecfeff; --tc-bd: #b8dce8; }
.tone-c-green  { --tc-fg: #14843d; --tc-bg: #e8f8ee; --tc-bd: #b9e8c9; }
.tone-c-amber  { --tc-fg: #b86100; --tc-bg: #fff3df; --tc-bd: #f3d3a0; }
.tone-c-red    { --tc-fg: #dc2626; --tc-bg: #fef2f2; --tc-bd: #f2c0c5; }
.tone-c-purple { --tc-fg: #7c3aed; --tc-bg: #f5f3ff; --tc-bd: #ddd6fe; }
.tone-c-pink   { --tc-fg: #db2777; --tc-bg: #fdf2f8; --tc-bd: #fbcfe8; }
.tone-c-brown  { --tc-fg: #92400e; --tc-bg: #fdf5ec; --tc-bd: #ecd6b6; }

.badge[class*="tone-c-"],
.type-tag[class*="tone-c-"] {
    background: var(--tc-bg) !important;
    color: var(--tc-fg) !important;
    border: 1px solid var(--tc-bd) !important;
}

/* ==================== 通用色块下拉 OptSelect ==================== */
.opt-select { position: relative; }
.opt-select-trigger {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; cursor: pointer; text-align: left; padding-right: 30px;
    font-weight: 650;
    background: var(--tc-bg) !important;
    color: var(--tc-fg) !important;
    border-color: var(--tc-bd) !important;
}
.opt-select-trigger .tone-swatch { width: 10px; height: 10px; border-radius: 50%; background: var(--tc-fg); opacity: 1; flex-shrink: 0; margin-right: 8px; }
.opt-select.is-placeholder .tone-swatch { display: inline-block; background: currentColor; }
/* 创建态：触发器白底可写，文字与圆点同取分类色（var(--tc-fg)），保证圆点=文字颜色一致 */
.form-create-mode .opt-select-trigger {
    background: #fff !important;
    color: var(--tc-fg) !important;
    border-color: var(--tc-bd, #d7dbe0) !important;
    font-weight: 600;
}
.opt-select.is-placeholder .opt-select-trigger {
    background: #fff !important; color: var(--text-tertiary) !important; border-color: var(--border) !important; font-weight: 500;
}
.opt-select-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opt-select-placeholder { color: var(--text-tertiary); font-weight: 500; }
.opt-select-caret { margin-left: 8px; font-size: 10px; opacity: .65; transition: transform .15s ease; flex-shrink: 0; }
.opt-select.open .opt-select-caret { transform: rotate(180deg); }
.opt-select-panel {
    position: absolute; top: calc(100% + 5px); left: 0; right: 0; z-index: 80;
    background: #fff; border: 1px solid var(--border); border-radius: 10px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .18); padding: 4px; min-width: 168px;
}
.opt-select-menu { margin: 0; padding: 0; list-style: none; max-height: 236px; overflow: auto; }
.opt-select-item {
    display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px;
    cursor: pointer; font-weight: 600; font-size: 13px; transition: filter .12s ease; margin-bottom: 2px;
    background: var(--tc-bg); color: var(--tc-fg);
}
.opt-select-item:hover { filter: brightness(.95); }
.opt-select-item.is-active { outline: 2px solid rgba(37, 99, 235, .45); outline-offset: -2px; }
.opt-select-item .tone-swatch { width: 10px; height: 10px; border-radius: 50%; background: var(--tc-fg); opacity: 1; flex-shrink: 0; }

/* 科目级联下拉（收支明细创建页） */
.subject-cascader { position: relative; }
.subject-cascader .sc-trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; text-align: left; cursor: pointer; background: var(--surface); }
.subject-cascader .sc-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.subject-cascader .sc-placeholder { color: var(--text-tertiary); }
.subject-cascader .sc-caret { margin-left: 8px; color: var(--text-tertiary); flex-shrink: 0; }
.subject-cascader .sc-panel { position: absolute; z-index: 50; top: calc(100% + 4px); left: 0; right: 0; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.12); max-height: 280px; overflow-y: auto; padding: 4px; }
.subject-cascader .sc-list { list-style: none; margin: 0; padding: 0; }
.subject-cascader .sc-group-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 10px; cursor: pointer; border-radius: 6px; font-weight: 600; user-select: none; }
.subject-cascader .sc-group-head:hover { background: var(--bg-secondary); }
.subject-cascader .sc-group-caret { color: var(--text-tertiary); font-size: 12px; transition: transform .15s; }
.subject-cascader .sc-group.expanded > .sc-group-head .sc-group-caret { transform: rotate(90deg); }
.subject-cascader .sc-children { list-style: none; margin: 0; padding: 0 0 4px 0; }
.subject-cascader .sc-child { display: flex; align-items: center; gap: 8px; padding: 7px 10px 7px 24px; cursor: pointer; border-radius: 6px; }
.subject-cascader .sc-child:hover { background: var(--bg-secondary); }
.subject-cascader .sc-child.is-active { background: var(--primary-soft); color: var(--primary); }
/* 二级科目文字全部统一为绿色字体（圆点仍按分组区分色，便于识别一级归属） */
.subject-cascader .sc-child .sc-child-label { color: var(--tc-fg-green, #14843d); font-weight: 500; }
.subject-cascader .sc-child.is-active .sc-child-label { color: var(--tc-fg-green, #14843d); }
.subject-cascader .sc-trigger.tone-c-green .sc-label { color: var(--tc-fg-green, #14843d); }
.subject-cascader .sc-child .tone-swatch { width: 10px; height: 10px; border-radius: 50%; background: var(--tc-fg); flex-shrink: 0; }
.opt-select-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opt-select-foot { border-top: 1px dashed var(--border); margin-top: 4px; padding-top: 4px; }
.opt-select-add {
    width: 100%; border: none; background: transparent; cursor: pointer;
    padding: 7px 10px; border-radius: 7px; font-size: 13px; font-weight: 600;
    color: var(--primary); text-align: left;
}
.opt-select-add:hover { background: var(--primary-bg); }
.opt-select-creator { border-top: 1px dashed var(--border); margin-top: 4px; padding: 8px 6px 6px; }
.opt-create-input {
    width: 100%; height: 32px; padding: 0 10px; font-size: 13px;
    border: 1px solid var(--border); border-radius: 8px; outline: none; background: #fff; color: var(--text-primary);
}
.opt-create-input:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(37, 99, 235, .12); }
.opt-color-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.opt-color-dot {
    width: 20px; height: 20px; border-radius: 50%; cursor: pointer; padding: 0;
    background: var(--tc-bg); border: 2px solid var(--tc-bd); position: relative;
}
.opt-color-dot::after {
    content: ''; position: absolute; inset: 3px; border-radius: 50%; background: var(--tc-fg); opacity: .75;
}
.opt-color-dot.is-picked { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--tc-fg); }
.opt-create-actions { display: flex; justify-content: flex-end; gap: 6px; }
.opt-select.field-invalid .opt-select-trigger { border-color: #e54545 !important; box-shadow: 0 0 0 2px rgba(229, 69, 69, .12); }
/* 详情/预览态：只读展示，双击遮罩后解锁（与文本字段 edit-locked 视觉一致） */
.opt-select.opt-locked .opt-select-trigger { background: #f2f3f5; border-color: #e3e6ea; cursor: default; opacity: 1; }
.opt-select.opt-locked .opt-select-caret { opacity: .25; }
/* 文本/原生字段锁定灰态：不依赖 .modal-drawer 作用域，三类型详情弹窗均生效 */
.customer-detail-modal .edit-locked,
.project-detail-modal .edit-locked,
.standard-detail-modal .edit-locked {
    background: #f2f3f5;
    border-color: #e3e6ea;
    color: #6b7280;
    cursor: default;
}
.customer-detail-modal .edit-locked:focus,
.project-detail-modal .edit-locked:focus,
.standard-detail-modal .edit-locked:focus { outline: none; }

/* ===== 联系人创建/编辑：搜索框组件（所属客户 / 老家） ===== */
.combo-box { position: relative; }
.combo-box .combo-input { width: 100%; cursor: text; }
.combo-panel { position: absolute; z-index: 40; top: calc(100% + 4px); left: 0; right: 0; max-height: 260px; overflow: auto; background: #fff; border: 1px solid var(--border, #e2e8f0); border-radius: 8px; box-shadow: 0 10px 28px rgba(15, 23, 42, .14); padding: 4px; }
.combo-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; cursor: pointer; }
.combo-item:hover { background: var(--bg-secondary, #f4f6f9); }
.combo-item-name { font-size: 13px; color: var(--text-primary, #1f2329); }
.combo-item-tag { margin-left: auto; font-size: 11px; color: var(--text-secondary, #6b7280); background: var(--bg-secondary, #f4f6f9); padding: 1px 8px; border-radius: 10px; white-space: nowrap; }
.combo-caret { color: var(--text-tertiary, #9aa3af); flex-shrink: 0; }
.combo-prov .combo-caret { margin-left: auto; }
.combo-back .combo-caret { margin-right: 4px; }
.combo-empty { padding: 12px; color: var(--text-tertiary, #9aa3af); font-size: 13px; text-align: center; }
.lib-public { color: #0a8f60; }
.lib-cooperate { color: #1668b8; }

/* ===== 项目详情弹窗（公海客户式 cd-layout，无右侧摘要） ===== */
.project-detail-modal .cd-body { flex-direction: row; align-items: stretch; }
.project-detail-modal .cd-main { flex-direction: column; }
.project-detail-modal .cd-company h2 { font-size: 17px; }
/* 详情页多 Tab 面板：仅激活面板显示，避免切换 Tab 时替换整段表单导致未保存字段丢失 */
.cd-tab-panel:not(.active) { display: none; }
.cd-tab-panel.active { display: block; }

/* 详情内联编辑：表单网格 + 产品表输入控件 */
.project-detail-modal .cd-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 22px; }
.project-detail-modal .form-group { position: relative; }
.project-detail-modal .form-control-static { display: flex; align-items: center; min-height: 38px; padding: 8px 10px; background: #f2f3f5; border: 1px solid #e3e6ea; border-radius: 6px; color: var(--text-primary); }
.project-detail-modal .pd-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border-light); border-radius: 8px; overflow: hidden; }
.project-detail-modal .pd-table th, .project-detail-modal .pd-table td { padding: 8px 10px; border-bottom: 1px solid #eef1f4; text-align: center; font-size: 13px; vertical-align: middle; }
.project-detail-modal .pd-table th { background: #f7f9fb; color: var(--text-secondary); font-weight: 600; }
.project-detail-modal .pd-table td.amount { text-align: center; font-variant-numeric: tabular-nums; }
.project-detail-modal .pd-table .pd-input { width: 100%; min-width: 70px; text-align: center; }
.project-detail-modal .pd-table .pd-num { text-align: center; }
.project-detail-modal .pd-table .pd-delete-btn { width: 28px; height: 28px; border: 1px solid #f2c0c5; background: #fff; color: var(--danger); border-radius: 6px; cursor: pointer; font-size: 16px; line-height: 1; }
.project-detail-modal .pd-table .pd-delete-btn:hover { background: var(--danger); color: #fff; }
.project-detail-modal .pd-table .empty-hint { color: var(--text-tertiary); padding: 18px; text-align: center; }

/* 项目详情页「产品明细」表格：与创建项目页保持完全一致的样式（列宽/对齐/只读框/删除按钮） */
.project-detail-modal .pd-table--formstyle { border-collapse: collapse; font-size: 13px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); border-radius: 0; overflow: visible; }
.project-detail-modal .pd-table--formstyle th,
.project-detail-modal .pd-table--formstyle td { border: 1px solid var(--border, #e5e7eb); padding: 5px 4px; text-align: center; vertical-align: middle; overflow: visible; }
.project-detail-modal .pd-table--formstyle th { background: var(--bg-secondary, #eef1f6); font-weight: 600; color: var(--text-secondary, #6b7280); white-space: nowrap; }
.project-detail-modal .pd-table--formstyle .pd-seq { width: 5%; text-align: center; font-weight: 700; }
.project-detail-modal .pd-table--formstyle th:nth-child(1) { width: 5%; }
.project-detail-modal .pd-table--formstyle th:nth-child(2) { width: 19%; }
.project-detail-modal .pd-table--formstyle th:nth-child(3) { width: 13%; }
.project-detail-modal .pd-table--formstyle th:nth-child(4) { width: 11%; }
.project-detail-modal .pd-table--formstyle th:nth-child(5) { width: 10%; }
.project-detail-modal .pd-table--formstyle th:nth-child(6) { width: 14%; }
.project-detail-modal .pd-table--formstyle th:nth-child(7) { width: 10%; }
.project-detail-modal .pd-table--formstyle th:nth-child(8) { width: 14%; }
.project-detail-modal .pd-table--formstyle th:nth-child(9) { width: 4%; }
.project-detail-modal .pd-table--formstyle .pd-input { width: 100%; min-width: 0; padding: 6px 5px; font-size: 12px; text-align: center; }
.project-detail-modal .pd-table--formstyle .pd-input.pd-auto { background: #f2f3f5; border-color: #e3e6ea; color: var(--text-secondary, #6b7280); cursor: default; font-weight: 400; text-align: center; }
.project-detail-modal .pd-table--formstyle td:nth-child(4) .pd-input,
.project-detail-modal .pd-table--formstyle td:nth-child(5) .pd-input { text-align: center; }
.project-detail-modal .pd-table--formstyle .pd-delete-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; min-width: 28px; height: 30px; min-height: 30px; padding: 0; overflow: hidden; color: var(--danger); background: #fff; border: 1px solid #f2c0c5; font-size: 19px; line-height: 1; }
.project-detail-modal .pd-table--formstyle .pd-delete-btn:hover { color: #fff; background: var(--danger); border-color: var(--danger); }
.project-detail-modal .pd-table--formstyle .pd-discount-input { position: relative; }
.project-detail-modal .pd-table--formstyle .pd-discount-input .pd-input { padding-right: 25px; text-align: center; }
.project-detail-modal .pd-table--formstyle .pd-discount-input span { position: absolute; top: 50%; right: 9px; color: var(--text-tertiary); transform: translateY(-50%); pointer-events: none; }

/* 产品明细数量输入框：去掉上下调节按钮（仍保留数字键盘） */
.pd-no-spinner::-webkit-outer-spin-button,
.pd-no-spinner::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pd-no-spinner { -moz-appearance: textfield; appearance: textfield; }

/* 进度条 */
.project-progress { background: var(--bg-primary, #fff); border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px 14px; margin-bottom: 18px; }
.pp-main { display: flex; align-items: flex-start; }
.pp-node { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 0 0 auto; width: 76px; }
.pp-dot { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 13px; background: #fff; border: 2px solid var(--border); color: var(--text-tertiary); transition: .25s; }
.pp-label { font-size: 12px; color: var(--text-secondary); white-space: nowrap; }
.pp-node.is-done .pp-dot { background: var(--primary); border-color: var(--primary); color: #fff; }
.pp-node.is-done .pp-label { color: var(--text); font-weight: 600; }
.pp-node.is-current .pp-dot { border-color: var(--primary); color: var(--primary); animation: ppPulse 1.4s ease-in-out infinite; }
.pp-seg { flex: 1 1 auto; height: 4px; background: var(--border); border-radius: 2px; position: relative; overflow: hidden; margin-top: 13px; }
.pp-seg.is-done { background: var(--primary); }
.pp-flow { position: absolute; inset: 0; background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.92) 0 6px, transparent 6px 16px); background-size: 16px 100%; animation: ppFlow .9s linear infinite; }
.pp-seg.is-done .pp-flow { opacity: .9; }
@keyframes ppFlow { from { background-position: 0 0; } to { background-position: 16px 0; } }
@keyframes ppPulse { 0%,100% { box-shadow: 0 0 0 3px var(--primary-bg); } 50% { box-shadow: 0 0 0 7px var(--primary-bg); } }
.pp-branch { display: flex; align-items: center; gap: 14px; margin-top: 8px; padding-top: 12px; border-top: 1px dashed var(--border); }
.pp-branch-cap { font-size: 12px; color: var(--text-tertiary); font-weight: 600; flex: 0 0 auto; }
.pp-branch-nodes { display: flex; gap: 10px; flex-wrap: wrap; }
.pp-bnode { display: flex; align-items: center; gap: 5px; padding: 5px 13px; border-radius: 999px; border: 1px solid var(--border); background: #fff; font-size: 12px; color: var(--text-secondary); transition: .2s; }
.pp-bdot { font-size: 11px; line-height: 1; }
.pp-bnode.is-active { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 700; }
.empty-hint { color: var(--text-tertiary); font-size: 13px; margin: 0; padding: 8px 0; }

/* 进度图全宽横幅：置于标题栏下、左右分栏之上，左缘覆盖原左侧导航列，导航栏整体下移 */
.project-detail-modal .cd-progress-banner { padding: 16px 20px 0; }
.project-detail-modal .cd-progress-banner .project-progress { margin-bottom: 0; }
/* 项目利润计算流程 */
.profit-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 8px; padding: 14px 16px; background: var(--bg-primary, #fff); border: 1px solid var(--border); border-radius: 12px; }
.pf-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 14px; background: var(--bg-secondary, #f5f7fa); border: 1px solid var(--border); border-radius: 8px; }
.pf-label { font-size: 12px; color: var(--text-secondary); }
.pf-value { font-size: 15px; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.pf-op { font-size: 18px; font-weight: 700; color: var(--text-tertiary); }
.pf-eq { color: var(--text-secondary); }
.pf-result { background: var(--primary-soft, #ecf1ff); border-color: var(--primary); }
.pf-result .pf-label { color: var(--primary); font-weight: 700; }
.pf-result .pf-value { color: var(--primary); }
/* 项目利润结构化可视化 */
.profit-viz { display: flex; flex-direction: column; gap: 16px; }
.pfv-list { display: flex; flex-direction: column; gap: 10px; }
.pfv-row { display: grid; grid-template-columns: 92px 1fr auto; align-items: center; gap: 12px; }
.pfv-label { font-size: 13px; color: var(--text-secondary, #4b5563); white-space: nowrap; }
.pfv-bar { height: 10px; background: var(--bg-secondary, #f5f7fa); border-radius: 6px; overflow: hidden; }
.pfv-bar-fill { display: block; height: 100%; border-radius: 6px; transition: width .3s ease; }
.pfv-in .pfv-bar-fill { background: linear-gradient(90deg, #2f94ed, #5bb0ff); }
.pfv-out .pfv-bar-fill { background: linear-gradient(90deg, #ff8b3d, #ffb173); }
.pfv-amount { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; min-width: 96px; text-align: right; color: var(--text-primary, #1f2329); }
.pfv-equation { display: flex; justify-content: flex-end; align-items: baseline; gap: 8px; margin-top: 2px; padding-top: 10px; border-top: 1px dashed var(--border, #e5e7eb); }
.pfv-eq-label { font-size: 12px; color: var(--text-tertiary, #9aa1ac); }
.pfv-eq-result { font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pfv-summary { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 18px 20px; border-radius: 14px; border: 1px solid var(--border, #e5e7eb); }
.pfv-summary-label { font-size: 13px; color: var(--text-secondary, #4b5563); }
.pfv-summary-value { font-size: 30px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.1; }
.pfv-summary-sub { font-size: 12px; }
.pfv-summary.profit-up { background: #fff1f0; border-color: #ffccc7; }
.pfv-summary.profit-up .pfv-summary-value, .pfv-summary.profit-up .pfv-summary-sub { color: #cf1322; }
.pfv-summary.profit-down { background: #f0fbf4; border-color: #b7ebc9; }
.pfv-summary.profit-down .pfv-summary-value, .pfv-summary.profit-down .pfv-summary-sub { color: #389e0d; }
.pfv-summary.profit-zero { background: #f5f7fa; border-color: var(--border, #e5e7eb); }
.pfv-summary.profit-zero .pfv-summary-value { color: var(--text-primary, #1f2329); }

/* flatpickr 开标时间选择器：浮层置于弹窗之上，输入外观与表单控件一致 */
.flatpickr-calendar { z-index: 2147483647 !important; }
.flatpickr-input { background-color: #fff; }
.form-control.fp-field { cursor: pointer; }

/* flatpickr 尺寸再压缩 + 字体优化 + 周一开头（周序由 JS locale 控制） */
.flatpickr-calendar {
  width: 232px !important;
  font-size: 10px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-variant-numeric: tabular-nums;
}
.flatpickr-calendar.hasTime { width: 232px !important; }
.flatpickr-calendar .flatpickr-rContainer { padding: 0; }
.flatpickr-calendar .flatpickr-days { width: 232px !important; }
.flatpickr-calendar .dayContainer { width: 232px !important; min-width: 232px !important; max-width: 232px !important; }
.flatpickr-day { max-width: 30px; height: 30px; line-height: 30px; font-size: 10px; font-weight: 500; }
.flatpickr-months { height: 26px; }
.flatpickr-months .flatpickr-month { height: 26px; display: flex; align-items: center; justify-content: space-between; padding: 0 4px; }
.flatpickr-current-month {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  gap: 2px;
  padding-top: 0;
  font-size: 10px;
  font-weight: 600;
  min-width: 0;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-size: 10px !important;
  font-weight: 600;
  padding: 0 2px;
  margin: 0;
  height: 20px;
  line-height: 20px;
  flex: 0 0 auto;
  min-width: 0;
  max-width: 54px;
  cursor: pointer;
}
.flatpickr-current-month .flatpickr-monthDropdown-months option {
  font-size: 11px !important;
  padding: 1px 2px;
}
.flatpickr-current-month input.cur-year {
  font-weight: 600;
  width: 44px !important;
  font-size: 10px !important;
  height: 20px;
  line-height: 20px;
  flex: 0 0 auto;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month { height: 26px; line-height: 26px; padding: 0 4px; flex: 0 0 auto; }
.flatpickr-weekdays { height: 20px; }
.flatpickr-weekday { font-size: 10px; font-weight: 500; opacity: 0.7; }
.flatpickr-time { height: 26px; max-height: 26px; }
.flatpickr-time input,
.flatpickr-time .numInputWrapper { height: 26px; font-size: 11px !important; font-weight: 500; }
.flatpickr-time .flatpickr-time-separator { line-height: 26px; font-size: 11px !important; }

/* ===== 表单字段右侧拖拽调宽把手 ===== */
.form-group { position: relative; }
.field-resize-handle {
  position: absolute;
  top: 0;
  right: -2px;
  width: 6px;
  height: 100%;
  cursor: col-resize;
  opacity: 0;
  z-index: 2;
  transition: opacity .12s ease;
}
.form-group:hover > .field-resize-handle { opacity: .35; }
.form-group.resizing > .field-resize-handle { opacity: .75; }
.field-resize-handle::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 2px;
  width: 2px;
  height: 42%;
  transform: translateY(-50%);
  background: var(--primary, #3b6cff);
  border-radius: 1px;
}
.form-group.has-custom-width > .field-resize-handle::after { background: var(--success, #18a058); }

/* ===== 企业年度销售表 ===== */
.annual-sales-card { margin-bottom: 20px; }
.annual-sales-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.annual-sales-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-right: 8px;
    background: var(--primary-bg);
    border-radius: var(--radius);
    font-size: 16px;
}
.annual-year-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-secondary);
    border-radius: var(--radius);
    padding: 4px 8px;
}
.annual-year-btn {
    width: 26px;
    height: 26px;
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--primary);
    font-size: 12px;
    line-height: 1;
    border: 1px solid var(--border);
    transition: var(--transition);
}
.annual-year-btn:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}
.annual-year-label {
    min-width: 52px;
    text-align: center;
    font-weight: 600;
    font-size: 15px;
    color: var(--text-primary);
}
.annual-sales-table .annual-year-switch {
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 2px 4px;
    background: transparent;
    border-radius: var(--radius-sm);
}
.annual-sales-table .annual-year-label {
    min-width: auto;
    font-size: 14px;
    font-weight: 700;
    color: #111827;
}
.annual-sales-table .annual-year-btns {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.annual-sales-table .annual-year-btn {
    width: 20px;
    height: 18px;
    font-size: 10px;
    padding: 0;
    border-radius: var(--radius-sm);
}
.annual-sales-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.annual-sales-wrap .table-wrap {
    min-width: 1400px;
}
.annual-sales-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}
.annual-sales-table th,
.annual-sales-table td {
    padding: 10px 8px;
    text-align: center;
    border-bottom: 1px solid var(--border-light);
    white-space: nowrap;
}
.annual-sales-table thead th {
    font-weight: 600;
    color: #fff;
    border-bottom: none;
}
.annual-sales-table .annual-sales-group-row th {
    background: #f1f5f9;
    border-right: 1px solid var(--border);
    color: #111827;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.5px;
    border-top: 3px solid var(--primary);
    border-bottom: 1px solid var(--border);
}
.annual-sales-table .annual-sales-group-row th:first-child {
    background: #eef2ff;
    border-top-color: #1e3a8a;
    border-top-left-radius: var(--radius-sm);
}
.annual-sales-table .annual-sales-group-row th:nth-child(2) { background: #ecfdf5; border-top-color: #15803d; }
.annual-sales-table .annual-sales-group-row th:nth-child(3) { background: #fffbeb; border-top-color: #b45309; }
.annual-sales-table .annual-sales-group-row th:nth-child(4) { background: #fef2f2; border-top-color: #b91c1c; }
.annual-sales-table .annual-sales-group-row th:nth-child(5) { background: #ecfeff; border-top-color: #0e7490; }
.annual-sales-table .annual-sales-group-row th:nth-child(6) { background: #f5f3ff; border-top-color: #6d28d9; border-top-right-radius: var(--radius-sm); }
.annual-sales-sub-row th {
    background: var(--bg-secondary);
    color: var(--text-primary) !important;
    border-right: 1px solid var(--border);
    font-size: 12px;
}
.annual-sales-table tbody tr:hover { background: var(--bg-secondary); }
.annual-sales-table tbody td {
    border-right: 1px solid var(--border-light);
}
.annual-sales-table tbody td:last-child { border-right: none; }
.annual-month {
    font-weight: 600;
    color: var(--text-primary);
    background: #f8fafc;
    position: sticky;
    left: 0;
    z-index: 1;
}
.annual-count { text-align: center; color: var(--text-secondary); }
.annual-sales-total td {
    background: #dcfce7 !important;
    font-weight: 700;
    color: #14532d;
    border-top: 2px solid var(--success);
}
.annual-sales-total .annual-month {
    background: #bbf7d0 !important;
}

/* 提成明细表（派生自项目总览，按项目分组 rowspan） */
/* 强制覆盖全局 .data-table thead th 的 height/padding/background */
.cm-detail-table thead tr {
    height: 32px !important;
    min-height: 0 !important;
    max-height: 32px !important;
    overflow: hidden !important;
}
.cm-detail-table thead th,
.cm-detail-table thead tr.cm-group-row th,
.cm-detail-table thead tr.cm-sub-row th {
    height: 32px !important; max-height: 32px !important; min-height: 0 !important;
    padding-top: 0 !important; padding-bottom: 0 !important;
    box-sizing: border-box;
    vertical-align: middle !important;
}
.cm-detail-table thead tr.cm-group-row th {
    color: #111827; font-weight: 700; text-align: center; line-height: 32px;
    padding: 0 6px !important; border-bottom: none; white-space: nowrap;
}
.cm-detail-table thead tr.cm-group-row .cm-grp-check { background: #94a3b8 !important; }
.cm-detail-table thead tr.cm-group-row .cm-grp-info { background: #2563eb !important; }
.cm-detail-table thead tr.cm-group-row .cm-grp-product { background: #0d9488 !important; }
.cm-detail-table thead tr.cm-group-row .cm-grp-sales { background: #16a34a !important; }
.cm-detail-table thead tr.cm-group-row .cm-grp-tech { background: #d97706 !important; }
.cm-detail-table thead tr.cm-group-row .cm-grp-stats { background: #7c3aed !important; }
.cm-detail-table thead tr.cm-sub-row th {
    background: var(--surface) !important; color: var(--text-secondary); font-weight: 600;
    text-align: center; font-size: 12px; line-height: 32px;
    padding: 0 4px !important; white-space: nowrap;
}
/* 关键修复：双行表头第二行绝不能套用全局「top:42px」的吸顶偏移（按单行表头 42px 假定）。
   更隐蔽的元凶：本表 bindColumnResize 给子列表头 th 设了内联 position:relative（列宽手柄定位用），
   会覆盖全局的 sticky，但 top:42px 仍生效 → th 实际变成 relative+top:42px，整体下推 42px，
   形成永远消不掉的"中间空一行"。前几次只改 height/padding/top 而没覆盖内联 relative，所以全失败。
   正解：用 !important 把 position 显式声明回 sticky、top 设为第一行实际高度 32px，
   两行严丝合缝；sticky 仍是列宽手柄(abs)的定位容器，拖动功能不受影响。 */
.data-table-wrap.table-scroll > table.cm-detail-table > thead > tr.cm-sub-row > th,
.table-wrap > table.cm-detail-table > thead > tr.cm-sub-row > th {
    position: sticky !important;
    top: 32px !important;
    height: 32px !important;
    box-sizing: border-box;
}
/* 项目信息 与其它分组表头同高，避免整行被撑高产生中间空白 */
.cm-detail-table .cm-grp-cell { background: var(--bg-secondary); vertical-align: middle; text-align: center; }
/* 项目编号、项目名称 内容左对齐（其余项目信息字段保持居中） */
.cm-detail-table .cm-grp-cell.cm-left { text-align: left; }
.cm-detail-table td.amount-commission { color: #ea580c; font-weight: 600; }
.cm-detail-table .amount-center { text-align: center; }
.cm-detail-table .cm-rate-cell { white-space: nowrap; text-align: center; }
.cm-person-select, .cm-rate-input {
    width: 100%; min-width: 72px; box-sizing: border-box; padding: 4px 6px; font-size: 12px;
    border: 1px solid var(--border); border-radius: 4px; background: var(--surface); color: var(--text);
}
.cm-rate-input { width: 38px; min-width: 0; text-align: center; }
/* 比例输入框：隐藏数字类型的上下微调按钮，仅显示数字 + 右侧 % */
.cm-rate-input::-webkit-outer-spin-button,
.cm-rate-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cm-rate-input { -moz-appearance: textfield; appearance: none; }
.cm-pct { color: var(--text-secondary); margin-left: 2px; font-size: 12px; }

/* ===== 系统设置页重构（2026-08-15）：菜单设置 + 系统设置 ===== */
.settings-nav-section { margin-bottom: 6px; }
.settings-nav-section-head { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 8px 10px; color: var(--text-tertiary); font-size: 12px; font-weight: 700; letter-spacing: .04em; background: transparent; border: 0; border-radius: 6px; cursor: pointer; }
.settings-nav-section-head:hover { color: var(--primary); background: var(--primary-bg); }
.settings-nav-section-head .sn-chevron { font-size: 10px; }
.settings-nav-section-body { padding: 2px 0 6px; }
.settings-nav-list { display: flex; flex-direction: column; gap: 2px; }
.settings-nav-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; color: var(--text-secondary); background: transparent; border: 0; border-radius: 5px; font-weight: 600; font-size: 13px; text-align: left; cursor: pointer; }
.settings-nav-item .sn-icon { font-size: 14px; line-height: 1; }
.settings-nav-item:hover { color: var(--primary); background: var(--primary-bg); }
.settings-nav-item.active { color: #fff; background: var(--primary); }
.sys-settings { margin-top: 10px; }
.btn-xs { padding: 2px 8px; font-size: 12px; border-radius: 5px; }

/* 菜单设置管理 */
.menu-manager { display: flex; flex-direction: column; gap: 10px; }
.mm-group { border: 1px solid var(--border-light); border-radius: 7px; padding: 8px; background: #fbfdff; }
.mm-group-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.mm-group-title { font-size: 12px; font-weight: 700; color: var(--text-primary); }
.mm-items { display: flex; flex-direction: column; gap: 4px; }
.mm-row { display: flex; align-items: center; gap: 6px; padding: 5px 6px; background: #fff; border: 1px solid var(--border-light); border-radius: 5px; }
.mm-row[draggable="true"] { cursor: grab; }
.mm-row.dragging { opacity: .5; }
.mm-handle { cursor: grab; color: var(--text-tertiary); font-size: 14px; user-select: none; }
.mm-icon { width: 18px; text-align: center; font-size: 14px; }
.mm-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--text-primary); }
.mm-actions { display: flex; gap: 2px; }
.mm-actions .btn-icon { border: 0; background: transparent; cursor: pointer; font-size: 13px; padding: 2px 4px; border-radius: 4px; }
.mm-actions .btn-icon:hover { background: var(--primary-bg); }
.mm-row-edit { flex-wrap: wrap; gap: 4px; }
.mm-edit-icon { width: 44px; flex: 0 0 44px; }
.mm-edit-label { flex: 1; min-width: 80px; }
.mm-edit-module { flex: 0 0 110px; min-width: 90px; font-size: 12px; }
.mm-mod { flex: 0 0 auto; font-size: 11px; color: var(--text-tertiary); background: var(--bg-muted, #f1f3f5); border: 1px solid var(--border-light); border-radius: 10px; padding: 1px 7px; white-space: nowrap; }
.mm-row-hidden { background: #f4f6f8; opacity: .75; }
.mm-row-hidden .mm-label { color: var(--text-tertiary); text-decoration: line-through; }
.mm-hidden { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--border-light); }
.mm-hidden-title { font-size: 11px; color: var(--text-tertiary); margin-bottom: 4px; }
.mm-empty { font-size: 12px; color: var(--text-tertiary); padding: 4px; }
.menu-preview { margin-top: 10px; border: 1px dashed var(--border-light); border-radius: 7px; padding: 8px; background: #fff; }
.menu-preview-title { font-size: 11px; color: var(--text-tertiary); margin-bottom: 6px; font-weight: 700; }
.menu-preview-nav .mp-label { font-size: 11px; color: var(--text-tertiary); margin: 6px 0 2px; font-weight: 700; }
.menu-preview-nav .mp-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-secondary); padding: 2px 4px; border-radius: 4px; background: #f7f9fb; margin-bottom: 2px; }

/* 模块字段 */
.module-fields { display: flex; flex-direction: column; gap: 12px; }
.mf-head { display: flex; align-items: center; min-height: 20px; }

@media (max-width: 1080px) {
    .settings-content-head-fields { align-items: flex-start; flex-direction: column; padding-top: 4px; }
    .settings-module-picker { width: 100%; }
    .settings-module-picker .form-control { width: min(100%, 260px); }
}

/* LOGO */
.logo-preview { display: flex; align-items: center; justify-content: center; min-height: 120px; border: 1px dashed var(--border-light); border-radius: 8px; background: #fafbfc; margin-bottom: 12px; padding: 12px; }
.logo-preview img { max-width: 160px; max-height: 120px; object-fit: contain; }
.logo-empty { color: var(--text-tertiary); font-size: 13px; }
.logo-actions { margin-bottom: 8px; }

/* 右栏缩放把手 */
.settings-props-resizer { width: 6px; cursor: col-resize; align-self: stretch; background: transparent; border-radius: 3px; }
.settings-props-resizer:hover { background: color-mix(in srgb, var(--primary, #2563eb) 40%, transparent); }

/* ===== 系统设置专项优化：仅作用于 settings-page ===== */
.settings-page { grid-template-columns: 190px minmax(0, 1fr) 6px var(--settings-props-w, 270px); gap: 12px; }
.settings-page.hide-props { grid-template-columns: 190px minmax(0, 1fr) 0 0; }
.settings-page .settings-nav { gap: 0; padding: 8px; border-color: #dfe5ec; background: #fff; box-shadow: 0 4px 14px rgba(35, 50, 67, .06); }
.settings-page .settings-nav-section { margin: 0; }
.settings-page .settings-nav-section-head { min-height: 34px; padding: 6px 8px 9px; color: #6b7785; font-size: 11px; letter-spacing: 0; cursor: default; }
.settings-page .settings-nav-section-head:hover { color: #6b7785; background: transparent; }
.settings-nav-online { display: inline-flex; align-items: center; gap: 4px; color: #23855b; font-size: 10px; font-weight: 650; }
.settings-nav-online i { width: 6px; height: 6px; background: #28a66f; border-radius: 50%; box-shadow: 0 0 0 3px rgba(40, 166, 111, .12); }
.settings-page .settings-nav-list { gap: 5px; }
.settings-page .settings-nav-item { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr) 12px; gap: 8px; min-height: 50px; padding: 7px 8px; color: #4e5b68; background: transparent; border: 1px solid transparent; border-radius: 6px; transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease; }
.settings-page .settings-nav-item:hover { color: #145dab; background: #f5f9fe; border-color: #deebfa; }
.settings-page .settings-nav-item.active { color: #145dab; background: #edf5ff; border-color: #b9d5fb; box-shadow: inset 3px 0 #1769e0, 0 3px 9px rgba(35, 105, 190, .08); }
.settings-page .settings-nav-item .sn-icon { display: grid; width: 30px; height: 30px; place-items: center; color: #2f6fae; background: #eef4fa; border: 1px solid #e0e9f2; border-radius: 6px; font-size: 14px; }
.settings-page .settings-nav-item.active .sn-icon { color: #fff; background: #1769e0; border-color: #1769e0; }
.settings-page .sn-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; text-align: left; }
.settings-page .sn-copy strong { overflow: hidden; font-size: 12px; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; }
.settings-page .sn-copy small { color: #8a96a3; font-size: 10px; font-weight: 500; line-height: 12px; }
.settings-page .sn-arrow { color: #9da8b3; font-size: 16px; }

.settings-page .settings-content-head { min-height: 60px; gap: 18px; padding: 0 4px 9px; border-bottom-color: #dfe5ec; }
.settings-content-title { display: flex; min-width: 0; align-items: center; gap: 10px; }
.settings-content-icon { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; color: #1769e0; background: #edf5ff; border: 1px solid #cfe1f7; border-radius: 7px; font-size: 15px; }
.settings-content-title > div { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.settings-content-title h3 { line-height: 20px; }
.settings-content-title > div > span { overflow: hidden; color: #7c8895; font-size: 11px; line-height: 15px; text-overflow: ellipsis; white-space: nowrap; }
.settings-page .settings-module-picker { gap: 7px; }
.settings-page .settings-module-picker label { color: #6c7885; font-size: 11px; }
.settings-page .settings-module-picker .form-control { width: 230px; min-height: 36px; border-color: #d3dce6; background-color: #fff; }

.settings-relation-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 14px; min-height: 70px; padding: 10px 12px; background: #f7f9fc; border: 1px solid #dfe5ec; border-radius: 7px; }
.settings-relation-main { min-width: 0; }
.settings-relation-caption { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: #6f7b88; font-size: 10px; font-weight: 700; }
.settings-relation-status { display: inline-flex; align-items: center; gap: 4px; padding: 2px 6px; color: #7a8591; background: #fff; border: 1px solid #dfe5ec; border-radius: 10px; font-size: 9px; }
.settings-relation-status i { width: 5px; height: 5px; background: #a6afb8; border-radius: 50%; }
.settings-relation-status.is-linked { color: #207853; border-color: #bde4d2; background: #f1fbf6; }
.settings-relation-status.is-linked i { background: #28a66f; }
.settings-linked-menus { display: flex; min-width: 0; gap: 6px; overflow-x: auto; scrollbar-width: thin; }
.settings-linked-menu { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 5px; min-height: 28px; padding: 4px 7px; color: #42576c; background: #fff; border: 1px solid #d8e2ec; border-radius: 5px; font-size: 11px; text-decoration: none; }
.settings-linked-menu:hover { color: #1769e0; border-color: #9ec2ef; background: #f6faff; }
.settings-linked-menu strong { font-size: 11px; font-weight: 650; }
.settings-linked-open { color: #8a96a3; }
.settings-module-select-wrap { display: flex; align-items: center; gap: 8px; min-width: 0; }
.settings-module-select-label { flex: 0 0 auto; color: #6f7b88; font-size: 11px; font-weight: 650; }
.settings-module-select { width: 240px; min-height: 30px; padding: 3px 8px; font-size: 12px; }
.settings-relation-empty { color: #929da8; font-size: 11px; }
.settings-relation-metrics { display: flex; align-items: stretch; border-left: 1px solid #dfe5ec; border-right: 1px solid #dfe5ec; }
.settings-relation-metrics > div { display: flex; min-width: 48px; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 1px 9px; }
.settings-relation-metrics strong { color: #27384a; font-size: 15px; font-variant-numeric: tabular-nums; }
.settings-relation-metrics span { color: #7d8995; font-size: 9px; }
.settings-save-state { display: inline-flex; align-items: center; justify-content: center; min-width: 78px; min-height: 26px; padding: 4px 8px; color: #247453; background: #eef9f3; border: 1px solid #bfe1cf; border-radius: 5px; font-size: 10px; font-weight: 650; }
.settings-save-state.is-dirty { color: #9a6508; background: #fff8e8; border-color: #efd293; }
.settings-page .field-designer-canvas-wrap, .settings-page .field-designer-lib, .settings-page .settings-props { box-shadow: 0 4px 14px rgba(35, 50, 67, .05); }
.settings-page .field-designer-canvas { background: #f7f9fb; }
.settings-page .settings-props-head { min-height: 46px; background: #f7f9fb; }

.settings-data-layout { display: flex; flex-direction: column; gap: 14px; }
.settings-data-summary { display: grid; grid-template-columns: 1.4fr repeat(5, minmax(88px, 1fr)); overflow: hidden; background: #fff; border: 1px solid #dfe5ec; border-radius: 7px; }
.settings-data-summary > div { display: flex; min-height: 78px; flex-direction: column; justify-content: center; gap: 4px; padding: 12px 14px; border-right: 1px solid #e5eaf0; }
.settings-data-summary > div:last-child { border-right: 0; }
.settings-data-summary span, .settings-data-summary small { color: #7b8794; font-size: 10px; }
.settings-data-summary strong { color: #25374a; font-size: 20px; font-variant-numeric: tabular-nums; }
.settings-data-total { background: #f1f7ff; }
.settings-data-total strong { color: #1769e0; font-size: 24px; }
.settings-data-panel { padding: 0; overflow: hidden; }
.settings-data-panel .settings-panel-head { min-height: 56px; margin: 0; padding: 11px 14px; background: #f7f9fb; border-bottom: 1px solid #dfe5ec; }
.settings-data-tag { padding: 3px 7px; color: #51606f; background: #fff; border: 1px solid #d9e0e7; border-radius: 5px; font-size: 10px; font-weight: 650; }
.settings-data-action-list { display: flex; flex-direction: column; }
.settings-data-action-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 66px; padding: 10px 14px; border-bottom: 1px solid #edf0f3; }
.settings-data-action-row:last-child { border-bottom: 0; }
.settings-data-action-row > div { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.settings-data-action-row strong { color: #304154; font-size: 12px; }
.settings-data-action-row small { color: #82909d; font-size: 10px; }
.settings-data-action-icon { display: grid; width: 30px; height: 30px; place-items: center; color: #1769e0; background: #eef5ff; border: 1px solid #d4e5f8; border-radius: 6px; font-size: 16px; font-weight: 700; }
.settings-data-action-row.is-danger .settings-data-action-icon { color: #c93c45; background: #fff1f2; border-color: #f1c7ca; }
.settings-data-panel .settings-warning { margin: 0; border-width: 1px 0 0; border-radius: 0; }

.settings-about-hero { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 76px; padding: 12px 14px; background: #f7f9fc; border: 1px solid #dfe5ec; border-radius: 7px; }
.settings-about-brandmark { display: grid; width: 46px; height: 46px; place-items: center; overflow: hidden; background: #fff; border: 1px solid #d7e0e9; border-radius: 7px; font-size: 22px; }
.settings-about-brandmark img { width: 100%; height: 100%; object-fit: contain; }
.settings-about-hero h4 { margin: 0 0 3px; color: #26384a; font-size: 15px; }
.settings-about-hero p { margin: 0; color: #788592; font-size: 11px; }
.settings-about-hero > span { padding: 4px 8px; color: #296297; background: #edf5ff; border: 1px solid #cfe1f7; border-radius: 5px; font-size: 10px; font-weight: 700; }
.settings-about-version { cursor: pointer; transition: all .15s; }
.settings-about-version:hover { border-color: #9dc0ec; background: #e3efff; }
.settings-about-primary-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 1.05fr); gap: 14px; align-items: stretch; }
.settings-about-primary-grid > .settings-panel { height: 100%; }
.settings-name-stack { grid-template-columns: 1fr; }
.settings-about-name .form-group { display: flex; align-items: center; gap: 12px; margin-bottom: 0; }
.settings-about-name .form-label { flex: none; width: 72px; margin: 0; font-size: 12px; }
.settings-about-name .form-control { flex: 1; min-width: 0; height: 28px; padding: 0 8px; font-size: 12px; }
.settings-about-name .settings-logo-row { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed #e2e8f0; }
.settings-about-name .settings-logo-label { flex: none; width: 72px; }
.settings-about-name .settings-logo-content { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.settings-about-name .settings-logo-content .logo-actions { display: flex; align-items: center; gap: 8px; margin: 0; }
.settings-page .settings-about-logo .logo-preview { min-height: 82px; margin-bottom: 9px; }
.settings-page .settings-about-logo .logo-preview img { max-width: 100px; max-height: 76px; }
.settings-page .settings-about-logo .settings-hint { line-height: 1.45; }
.settings-about-name .logo-preview { width: 72px; height: 72px; min-height: 0; padding: 6px; margin-bottom: 0; aspect-ratio: 1 / 1; }
.settings-about-name .logo-preview img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
.settings-about-name .logo-empty { font-size: 11px; }
.settings-about-name .login-bg-preview { width: 160px; height: 90px; aspect-ratio: 16 / 9; }
.settings-about-name .login-bg-preview img { object-fit: cover; }
.settings-about-name .settings-brand-row { align-items: stretch; gap: 18px; }
.settings-about-name .settings-brand-item { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 9px; }
.settings-about-name .settings-brand-item + .settings-brand-item { border-left: 1px dashed #e2e8f0; padding-left: 18px; }
.settings-about-name .settings-panel-head { justify-content: space-between; }
.settings-about-name .settings-brand-head { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; }
.settings-about-name .settings-brand-hint { flex: 0 0 auto; color: var(--text-tertiary); font-size: 10px; }
.settings-about-name .settings-brand-item .logo-preview { width: 100%; height: 96px; aspect-ratio: auto; margin: 0; }
.settings-about-name .settings-brand-item .logo-preview img { object-fit: contain; }
.settings-about-name .settings-brand-item .login-bg-preview img { object-fit: cover; }
.settings-about-name .settings-brand-item .logo-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 0; }

@media (max-width: 1180px) {
    .settings-relation-bar { grid-template-columns: minmax(0, 1fr) auto; }
    .settings-save-state { grid-column: 1 / -1; justify-self: end; }
    .settings-data-summary { grid-template-columns: repeat(3, 1fr); }
    .settings-data-summary > div:nth-child(3n) { border-right: 0; }
    .settings-data-summary > div:nth-child(-n+3) { border-bottom: 1px solid #e5eaf0; }
}
@media (max-width: 980px) {
    .settings-page, .settings-page.hide-props { grid-template-columns: 1fr; }
    .settings-page .settings-nav { position: static; max-height: none; }
    .settings-page .settings-nav-list { display: grid; grid-template-columns: repeat(3, 1fr); }
    .settings-page .settings-props-resizer { display: none; }
    .settings-about-primary-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
    .settings-page .settings-nav-list { grid-template-columns: 1fr; }
    .settings-relation-bar { grid-template-columns: 1fr; }
    .settings-relation-metrics { justify-content: space-around; border: 1px solid #dfe5ec; border-radius: 5px; padding: 5px 0; }
    .settings-save-state { grid-column: auto; justify-self: stretch; }
    .settings-data-summary { grid-template-columns: repeat(2, 1fr); }
    .settings-data-summary > div { border-right: 1px solid #e5eaf0; border-bottom: 1px solid #e5eaf0; }
    .settings-data-summary > div:nth-child(2n) { border-right: 0; }
    .settings-data-action-row { grid-template-columns: 34px minmax(0, 1fr); }
    .settings-data-action-row .btn { grid-column: 1 / -1; width: 100%; }
}

/* ==================== 登录门禁（纯前端单用户） ==================== */
.login-screen {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.10) 0%, transparent 22%),
        radial-gradient(circle at 90% 80%, rgba(14, 165, 233, 0.10) 0%, transparent 24%),
        linear-gradient(135deg, #eef2ff 0%, #f8fafc 55%, #eff6ff 100%);
    padding: 24px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
}
.login-screen.show { display: flex; }
.login-card {
    width: 100%;
    max-width: 400px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(30, 58, 138, 0.12), 0 8px 24px rgba(37, 99, 235, 0.08);
    padding: 40px 36px 34px;
    text-align: center;
    border: 1px solid rgba(226, 232, 240, 0.8);
    position: relative;
    overflow: hidden;
}
.login-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #0ea5e9);
}
.login-brand { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 28px; }
.login-logo {
    width: 52px; height: 52px; border-radius: 14px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 26px; background: linear-gradient(135deg, #eff6ff, #dbeafe); border: 1px solid #bfdbfe;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.10);
}
.login-brand-text { text-align: left; line-height: 1.25; }
.login-brand-text h1 { font-size: 22px; margin: 0; color: #0f172a; font-weight: 700; letter-spacing: -0.3px; }
.login-brand-text p { font-size: 13px; margin: 4px 0 0; color: #64748b; font-weight: 500; }
.login-version { display: inline-block; padding: 1px 6px; color: #296297; background: #edf5ff; border: 1px solid #cfe1f7; border-radius: 4px; font-size: 11px; font-weight: 700; vertical-align: middle; margin-left: 4px; }
.login-card .form-group { text-align: left; margin-bottom: 18px; }
.login-card .form-group label { display: block; font-size: 13px; color: #334155; margin-bottom: 7px; font-weight: 600; }
.login-card .form-control {
    width: 100%; height: 46px; padding: 0 14px; font-size: 14px;
    border: 1px solid #d1d5db; border-radius: 10px; box-sizing: border-box;
    transition: border-color .15s, box-shadow .15s, transform .15s; outline: none;
    background: #fafafa;
}
.login-card .form-control:hover { border-color: #9ca3af; }
.login-card .form-control:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 4px rgba(37,99,235,.10); }
.login-submit {
    width: 100%; height: 46px; margin-top: 8px; font-size: 15px; letter-spacing: 2px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    border: none; border-radius: 10px; color: #fff; cursor: pointer;
    transition: transform .12s, box-shadow .12s, filter .12s;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.28);
    display: flex; align-items: center; justify-content: center; text-align: center;
}
.login-submit:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(37, 99, 235, 0.34); filter: brightness(1.05); }
.login-submit:active { transform: translateY(0); }
.login-icp { margin: 18px 0 0; text-align: center; font-size: 12px; color: #94a3b8; }
.login-icp a { color: inherit; text-decoration: none; }
.login-icp a:hover { text-decoration: underline; color: #64748b; }
.login-link {
    display: inline-block; margin-top: 16px; font-size: 13px; color: var(--primary);
    cursor: pointer; text-decoration: none;
}
.login-link:hover { text-decoration: underline; }

/* 顶栏账户面板 */
.modal.modal-account { max-width: 400px; }
.account-panel { text-align: center; }
.account-row {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 16px 14px; background: #f8fafc; border: 1px solid #eef2f7;
    border-radius: 10px; margin-bottom: 12px; font-size: 14px;
}
.account-row span { color: #64748b; font-size: 13px; }
.account-row b { color: #1e293b; font-size: 16px; font-weight: 600; }
.account-actions { display: flex; justify-content: center; margin-top: 16px; }
.account-actions .btn { min-width: 140px; justify-content: center; }
.account-note { font-size: 12px; color: #94a3b8; line-height: 1.6; margin: 14px 0 0; text-align: center; letter-spacing: 0.5px; }

/* 退出登录确认弹窗（优化版） */
.logout-confirm { text-align: center; padding: 4px 4px 2px; }
.logout-confirm__icon {
    width: 56px; height: 56px; margin: 0 auto 16px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #fff1f0; color: #dc3545;
    border: 1px solid #ffd9d6;
}
.logout-confirm__icon svg { width: 26px; height: 26px; }
.logout-confirm__desc { margin: 0; font-size: 13.5px; line-height: 1.75; color: #64748b; }
.logout-confirm__desc b { color: #1e293b; font-weight: 600; }
/* 退出确认弹窗底部按钮居中、等宽 */
.modal-footer.is-centered { justify-content: center; }
.modal-footer.is-centered .btn { min-width: 116px; }

/* ===== 2026-09-08 UI 优化：客户摘要可折叠 + 字段配置锁定 ===== */
.customer-detail-summary .summary-header { display: flex; align-items: center; justify-content: space-between; }
.customer-detail-summary .summary-toggle {
    border: none; background: transparent; cursor: pointer; font-size: 14px; line-height: 1;
    color: var(--text-secondary); padding: 2px 6px; border-radius: 4px;
}
.customer-detail-summary .summary-toggle:hover { background: var(--bg-secondary); color: var(--primary); }
.customer-detail-summary.is-collapsed .summary-item { display: none; }
.nav-cfg-label { cursor: default; }
.nav-cfg-label input[type="checkbox"][disabled] { opacity: .5; cursor: not-allowed; }