/* ============================================================================
 * 盛航租车管理系统 · C11 UI 视觉统一层  ui-polish.css
 * ----------------------------------------------------------------------------
 * 定位：纯“新增覆盖层”，必须在 style.css 之后引入（见 INTEGRATION.md）。
 * 约束：不修改 style.css、不修改、不依赖任何业务 JS；全部通过既有类名落地。
 * 覆盖范围：按钮 / 输入 / 表头表格 / 卡片 / 弹窗 / 分页 / 标签 /
 *           空状态 / 加载态 / 滚动条 / 侧边栏菜单 / 顶栏浮层 / 响应式。
 * 财务语义色（硬性规矩）：收入红 #dc2626，支出绿 #16a34a。
 * 设计尺度：
 *   圆角阶梯 4(矩阵内输入) / 6(紧凑控件) / 8(常规控件) / 12(容器面板) / 999(胶囊)
 *   控件高度 28(表格行内) / 30(紧凑) / 32(图标钮) / 36(常规) / 40(移动端触控)
 *   间距阶梯 4 / 8 / 12 / 16 / 20 / 24
 * ----------------------------------------------------------------------------
 * 响应式断点标准（全站唯一规范，新增样式只允许使用这 4 个分界，B2 断点归并）：
 *   --bp-lg: 1280px  桌面/小桌面分界（max-width:1280 小桌面紧凑）
 *   --bp-md: 1024px  小桌面/平板分界
 *   --bp-sm: 768px   平板/手机分界（表单网格在此降列，统一旧 760/768 二义）
 *   --bp-xs: 480px   大手机/小手机分界（380~640 的真机微调归此档内安全增强）
 *   旧代码中 899/900 已统一为 899（侧栏收起点，等同 md 邻档）；不再新增 600/760/1080/1200 等临时档。
 * ========================================================================== */

/* ===== 0. 设计变量（只新增 ui-* 变量，不删除不改写 V2 原有变量） ===== */
:root {
    /* 圆角阶梯 */
    --ui-radius-xs: 4px;
    --ui-radius-sm: 6px;
    --ui-radius: 8px;
    --ui-radius-lg: 12px;
    --ui-radius-pill: 999px;
    /* 财务语义色：收入红 / 支出绿（含浅底、悬停深档） */
    --ui-income: #dc2626;
    --ui-income-strong: #b91c1c;
    --ui-income-bg: #fdecec;
    --ui-income-border: #fbcaca;
    --ui-expense: #16a34a;
    --ui-expense-strong: #15803d;
    --ui-expense-bg: #eafaf0;
    --ui-expense-border: #bfe8cd;
    /* 统一控件高度 */
    --ui-ctrl-h: 36px;
    --ui-ctrl-h-sm: 30px;
    --ui-ctrl-h-xs: 28px;
    /* 统一动效曲线与时长 */
    --ui-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --ui-dur-fast: 0.14s;
    --ui-dur: 0.2s;
    --ui-dur-slow: 0.25s;
    /* 动效语义别名（UI-P3-4：对外统一引用名；值与上面三档严格对齐，单一来源） */
    --motion-fast: var(--ui-dur-fast);   /* 悬停/按压/勾选等即时反馈 140ms */
    --motion-base: var(--ui-dur);        /* 常规过渡：展开、高亮、位移 200ms */
    --motion-slow: var(--ui-dur-slow);   /* 抽屉/侧栏/页面级 250ms */
    --ease-standard: var(--ui-ease);     /* 通用标准缓动 */
    --ease-emphasized: cubic-bezier(0.2, 0, 0, 1);   /* 元素进场（减速感） */
    --ease-exit: cubic-bezier(0.4, 0, 1, 1);         /* 元素退场（加速感） */
    /* 统一阴影三档（在原 shadow 基础上收敛观感） */
    --ui-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.06);
    --ui-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
    --ui-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.12), 0 2px 6px rgba(15, 23, 42, 0.06);
    --ui-shadow-flyout: 0 12px 40px rgba(11, 42, 107, 0.18), 0 3px 10px rgba(15, 23, 42, 0.08);
    /* 统一表头底色（消除 #f9fafb 与 #f1f5f9 两套灰） */
    --ui-thead-bg: #f9fafb;
    --ui-row-hover: #f8fafc;
}

/* ===== 1. 全局基线：排版渲染、防页面级横向滚动（月历/矩阵在第 15 区豁免） ===== */
html, body {
    max-width: 100%;
    overflow-x: hidden;            /* 页面级绝不出现横向滚动条 */
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
body * { min-width: 0; }          /* flex/grid 子项允许收缩，长内容不再撑破布局 */
.main-content,
.page-content {
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;            /* 内容区横向溢出收敛到表格内部容器 */
}
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-hover); }
::selection { background: rgba(255, 124, 0, 0.18); }
/* 空标签不占位（业务 JS 万一残留空元素，不允许撑出空白块） */
.form-group:empty, p:empty, span:empty { display: none; }
/* 普通数据空单元格统一显示淡色占位横杠（复选列/操作列除外）；不改变任何真实值 */
.data-table tbody td:empty:not(:first-child):not(.actions-cell)::before {
    content: "—";
    color: var(--gray-300);
}
/* 统一键盘焦点环：鼠标点不出、键盘 Tab 可见，颜色/宽度全系统一致 */
:focus-visible {
    outline: 2px solid rgba(255, 124, 0, 0.45);
    outline-offset: 1px;
    border-radius: var(--ui-radius-xs);
}
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) { outline: none; }

/* ===== 2. 统一滚动条（WebKit + Firefox；侧栏深色场景单独配色） ===== */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--gray-300) transparent;
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: var(--gray-300);
    border-radius: var(--ui-radius-pill);
    border: 2px solid transparent;
    background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--gray-400); background-clip: content-box; }
::-webkit-scrollbar-corner { background: transparent; }
/* 侧栏主滚动条统一“隐藏但可滚轮滚动”（WebKit 隐藏见 style.css，此处对齐 Firefox/IE 口径，杜绝跨浏览器一隐一显） */
.sidebar,
.sidebar-nav { scrollbar-width: none; -ms-overflow-style: none; }
/* 侧栏内子菜单自身可滚时：深蓝底配白色半透明细条；折叠白底浮层恢复灰条 */
.sidebar .nav-group-submenu {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}
.nav-group-submenu.fixed-flyout { scrollbar-color: var(--gray-300) transparent; }
.nav-group-submenu.fixed-flyout::-webkit-scrollbar-thumb { background: var(--gray-300); background-clip: content-box; }

/* ===== 3. 按钮体系：高度/圆角/字号/间距/悬停/禁用 全系统收敛 ===== */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.btn {
    height: var(--ui-ctrl-h);
    padding: 0 16px;
    border-radius: var(--ui-radius);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.2px;
    gap: 6px;
    transition: background var(--ui-dur) var(--ui-ease),
                border-color var(--ui-dur) var(--ui-ease),
                color var(--ui-dur) var(--ui-ease),
                box-shadow var(--ui-dur) var(--ui-ease),
                opacity var(--ui-dur) var(--ui-ease);
    user-select: none;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
}
/* 主按钮 */
.btn-primary,
.btn.btn-primary,
button.btn-primary {
    background: var(--primary);
    border: 1px solid var(--primary);
    color: #fff;
    box-shadow: 0 1px 2px rgba(255, 124, 0, 0.22);
}
.btn-primary:hover,
.btn.btn-primary:hover,
button.btn-primary:hover {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
    box-shadow: 0 2px 6px rgba(255, 124, 0, 0.28);
}
.btn-primary:active { transform: translateY(0.5px); }
/* 次按钮（白底描边） */
.btn-secondary,
.btn.btn-secondary,
button.btn-secondary {
    background: #fff;
    border: 1px solid var(--gray-300);
    color: var(--gray-700);
}
.btn-secondary:hover,
.btn.btn-secondary:hover,
button.btn-secondary:hover {
    background: var(--gray-50);
    border-color: var(--gray-400);
    color: var(--gray-800);
}
/* 危险按钮（白底红字红边，用于删除；保持 V2 风格只做圆角/字重统一） */
.btn-danger,
.btn.btn-danger,
button.btn-danger {
    background: #fff;
    border: 1px solid var(--danger);
    color: var(--danger);
}
.btn-danger:hover,
.btn.btn-danger:hover,
button.btn-danger:hover {
    background: var(--danger-light);
    border-color: var(--danger);
}
/* 文字按钮 */
.btn-text,
.btn.btn-text {
    height: auto;
    padding: 6px 10px;
    border-radius: var(--ui-radius-sm);
    color: var(--primary);
}
.btn-text:hover { background: var(--primary-light); }
/* 尺寸档：小按钮统一 30px 高、13px */
.btn-sm,
.btn.btn-sm {
    height: var(--ui-ctrl-h-sm);
    padding: 0 12px;
    font-size: 13px;
    border-radius: var(--ui-radius-sm);
}
/* 禁用态全系统一致 */
button:disabled,
.btn:disabled,
.btn-primary:disabled,
.btn-secondary:disabled,
.pagination-btns button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}
/* 纯图标按钮（关闭钮等）统一 32×32 圆形命中区 */
.modal-close,
.confirm-close,
.assistant-close {
    width: 32px;
    height: 32px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ui-radius-pill);
    transition: background var(--ui-dur) var(--ui-ease), color var(--ui-dur) var(--ui-ease);
}
.modal-close:hover,
.confirm-close:hover {
    background: var(--gray-100);
    color: var(--gray-700);
}
/* 顶栏汉堡钮（router.js 会输出 .hamburger-btn，原样式表缺失，这里补齐并统一） */
.hamburger-btn {
    width: 34px;
    height: 34px;
    min-width: 34px;
    flex: 0 0 auto;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ui-radius);
    background: transparent;
    color: var(--gray-600);
    cursor: pointer;
    transition: background var(--ui-dur) var(--ui-ease), color var(--ui-dur) var(--ui-ease);
}
.hamburger-btn svg { width: 20px; height: 20px; flex: 0 0 auto; }
.hamburger-btn:hover { background: var(--gray-100); color: var(--gray-800); }

/* ===== 4. 输入控件：高度 36 / 圆角 8 / focus ring / 错误态 / 复选框 ===== */
.form-input,
.search-input,
.filter-bar input[type="text"],
.filter-bar input[type="date"],
.filter-bar input[type="month"],
.filter-bar select,
.assistant-input-area textarea,
.modal-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.modal-body select,
.modal-body textarea {
    min-height: var(--ui-ctrl-h);
    border-radius: var(--ui-radius);
    font-size: 14px;
    color: var(--gray-800);
    border: 1px solid var(--gray-300);
    background: #fff;
    transition: border-color var(--ui-dur) var(--ui-ease), box-shadow var(--ui-dur) var(--ui-ease);
}
.form-input,
.modal-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.modal-body select { height: var(--ui-ctrl-h); padding: 8px 12px; }
.form-input::placeholder,
.search-input::placeholder,
textarea::placeholder { color: var(--gray-400); }
/* 统一聚焦描边（主色边 + 同色浅光环，宽度一致） */
.form-input:focus,
.search-input:focus,
.filter-bar input:focus,
.filter-bar select:focus,
.assistant-input-area textarea:focus,
.modal-body input:focus,
.modal-body select:focus,
.modal-body textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(255, 124, 0, 0.12);
}
textarea.form-input { height: auto; line-height: 1.6; padding: 8px 12px; resize: vertical; }
select.form-input {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 32px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    cursor: pointer;
}
/* 必填校验失败态（list-view 以内联 borderColor 标红，这里统一成“红边+浅红光晕”） */
.form-input[style*="danger"],
.form-input.input-error,
.form-input[aria-invalid="true"] {
    border-color: var(--danger) !important;
    box-shadow: 0 0 0 3px rgba(224, 36, 36, 0.1);
}
/* 复选/单选统一品牌色，尺寸对齐，不再出现大小不一的原生框 */
input[type="checkbox"],
input[type="radio"] {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
    cursor: pointer;
    vertical-align: middle;
    margin: 0;
}
input[type="radio"] { border-radius: 50%; }
/* 禁用输入 */
.form-input:disabled,
.form-input[readonly] { background: var(--gray-50); color: var(--gray-500); cursor: not-allowed; }
/* 标签文字统一 */
.form-group label { letter-spacing: 0.2px; }
/* 列表顶部内联筛选（list-view 以行内样式生成，这里统一字号/高度/圆角） */
.list-filters label { font-size: 13px !important; color: var(--gray-600) !important; }
.list-filters .form-input { height: var(--ui-ctrl-h-sm); min-width: 130px; border-radius: var(--ui-radius-sm); font-size: 13px; }

/* ===== 5. 数据表格：表头统一、长内容省略、数字列对齐、操作列永远居中可见 ===== */
.data-table {
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-xs);
}
.data-table thead th {
    background: var(--ui-thead-bg);
    color: var(--gray-500);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.4px;
    padding: 10px 14px;
    height: 42px;
    vertical-align: middle;
    white-space: nowrap;
}
.data-table tbody td {
    padding: 10px 14px;
    font-size: 14px;
    vertical-align: middle;
    color: var(--gray-700);
}
/* 行悬停底色全表一致（含 sticky 操作列，消除 #f8fbff 异色） */
.data-table tbody tr { transition: background var(--ui-dur-fast) var(--ui-ease); }
.data-table tbody tr:hover td { background: var(--ui-row-hover); }
.data-table tbody tr:hover td:last-child { background: var(--ui-row-hover); }
/* 长内容省略：普通列单行省略 + 省略号；允许换行的 .cell-wrap 不受影响 */
.data-table td {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.data-table td.cell-wrap,
.data-table th.cell-wrap {
    max-width: 320px;
    white-space: normal;
    word-break: break-word;
    line-height: 1.55;
}
/* 数字/金额列：右对齐 + 等宽数字，便于纵向比数（列配置 align:right 时同样生效） */
.data-table td[style*="text-align:right"],
.data-table td[style*="text-align: right"],
.data-table th[style*="text-align:right"],
.data-table th[style*="text-align: right"],
.data-table td.num,
.data-table td.col-number {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}
.data-table td[style*="text-align:center"],
.data-table td[style*="text-align: center"],
.data-table td.col-center { text-align: center; }
/* 复选框列：居中定宽，不省略（仅当首列确实含复选框时才限宽；
   否则会把没有复选框的表（校车/客运/驾驶员等）第一个真实数据列压成40px导致文字溢出叠列）。
   !important 用于压过下方 .tk-elastic 等同特异性、晚出现的 overflow:hidden+ellipsis 规则，
   否则 16px 复选框会在窄列里溢出并渲染出“..”省略号黑点。 */
.data-table th:first-child:has(input[type="checkbox"]),
.data-table td:first-child:has(input[type="checkbox"]) {
    width: 40px;
    min-width: 40px;
    max-width: 46px;
    text-align: center;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
}
/* 操作列：sticky 右侧、白底、居中、阴影分隔，表头/表体底色统一 */
.data-table th:last-child,
.data-table td:last-child,
.data-table td.actions-cell {
    max-width: none;
    overflow: visible;
    text-align: center !important;
    white-space: nowrap;
    position: sticky;
    right: 0;
    z-index: var(--z-sticky-col);
    background: #fff;
    /* 冻结操作列与左侧内容用 1px 清晰分隔线 + 极淡窄阴影，避免旧值 -6px 0 10px -8px 形成约10px发虚“模糊阴影带” */
    box-shadow: -1px 0 0 var(--gray-200, #E5E7EB), -2px 0 4px -4px rgba(15, 23, 42, 0.10);
}
.data-table thead th:last-child { background: var(--ui-thead-bg); z-index: var(--z-sticky-corner); }
.data-table .actions {
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 6px;
}
/* 行内操作按钮：28px 高、6px 圆角、等宽、文字居中 */
.data-table .actions button,
.data-table td:last-child > button {
    height: var(--ui-ctrl-h-xs);
    min-width: 52px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
    border-radius: var(--ui-radius-sm);
    border: 1px solid var(--gray-300);
    background: #fff;
    color: var(--gray-600);
    transition: background var(--ui-dur-fast) var(--ui-ease),
                border-color var(--ui-dur-fast) var(--ui-ease),
                color var(--ui-dur-fast) var(--ui-ease);
}
.data-table .actions button:hover,
.data-table td:last-child > button:hover {
    background: var(--gray-50);
    border-color: var(--gray-400);
    color: var(--gray-800);
}
.data-table .actions button.delete-btn {
    color: var(--danger);
    border-color: var(--danger-light);
}
.data-table .actions button.delete-btn:hover {
    background: var(--danger-light);
    border-color: var(--danger);
}
/* 表格内空数据行（list-view 以 td.colspan 输出，不可使用 flex 导致 table-cell 坍缩） */
.data-table td.empty-state,
.data-table tbody tr td[colspan].empty-state {
    display: block;
    max-width: none;
    padding: 48px 16px;
    text-align: center;
    color: var(--gray-400);
    font-size: 14px;
    background: #fff;
    position: static;
    box-shadow: none;
}
/* 表格是页面内唯一允许的横向滚动通道 */
.data-table,
.data-table-wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ===== 6. 卡片/容器/工具条：圆角 12、轻阴影、标题间距统一 ===== */
.card,
.stat-card,
.placeholder-card {
    border-radius: var(--ui-radius-lg);
    border: 1px solid var(--gray-200);
    box-shadow: var(--ui-shadow-xs);
}
.card { padding: 20px; }
.stat-card {
    padding: 18px 20px;
    transition: box-shadow var(--ui-dur) var(--ui-ease), transform var(--ui-dur) var(--ui-ease);
}
.stat-card:hover { box-shadow: var(--ui-shadow-sm); transform: translateY(-2px); }
.stat-card .label { font-size: 13px; color: var(--gray-500); margin-bottom: 6px; }
.stat-card .value { font-size: 26px; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat-card .sub-text { margin-top: 6px; font-size: 12px; }
.card-header { margin-bottom: 14px; }
.card-header h3 { font-size: 15px; font-weight: 600; }
/* 工具条/筛选条：对齐与间距统一 */
.list-toolbar,
.toolbar { gap: 12px; margin-bottom: 16px; }
.search-box { gap: 8px; align-items: center; }
.search-box .form-input { width: 260px; }
.search-input { min-width: 220px; }
.filter-bar {
    gap: 12px 16px;
    padding: 14px 16px;
    border-radius: var(--ui-radius-lg);
    border: 1px solid var(--gray-200);
    box-shadow: none;
}
.filter-bar .form-group { min-width: 130px; }
/* 页签：下划线粗细/字号/激活色统一，悬停有轻微过渡 */
.tabs { gap: 2px; margin-bottom: 16px; }
.tab-btn {
    padding: 10px 16px !important;
    font-size: 14px !important;
    border-radius: var(--ui-radius-sm) var(--ui-radius-sm) 0 0 !important;
    transition: color var(--ui-dur-fast) var(--ui-ease) !important;
}
.tab-btn.active { letter-spacing: 0.2px; }

/* ===== 7. 弹窗 / 确认框：圆角、间距、sticky 底栏、关闭、遮罩动画统一 ===== */
.modal,
.confirm-dialog {
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-flyout);
}
.modal-overlay,
.confirm-overlay,
.rc-overlay { backdrop-filter: blur(1px); }
.modal-header {
    padding: 18px 24px 0;
    align-items: center;
    min-height: 56px;
}
.modal-header h3 { font-size: 17px; font-weight: 600; color: var(--gray-900); }
.confirm-header { padding: 16px 20px 0; min-height: 48px; }
.confirm-header h4 { font-size: 16px; font-weight: 600; }
/* 20260911 防输入跳动：不在 .modal-body 上写死 max-height（避免与 .modal 形成双层滚动容器，
   在 62vh 边界反复出现/消失内层滚动条而抖动）；唯一纵向滚动容器统一为 .modal，footer 仍 sticky 吸底 */
.modal-body { padding: 18px 24px; }
.confirm-body { padding: 14px 20px 18px; color: var(--gray-600); line-height: 1.6; }
/* 底部操作栏：白底 sticky + 顶部分隔线，左右内边距与正文对齐 */
.modal-footer {
    position: sticky;
    bottom: 0;
    background: #fff;
    padding: 14px 24px;
    margin-top: 4px;
    border-top: 1px solid var(--gray-200);
    border-radius: 0 0 var(--ui-radius-lg) var(--ui-radius-lg);
    gap: 10px;
    z-index: var(--z-inline-pop);
}
.confirm-footer { padding: 0 20px 18px; gap: 10px; }
/* 弹窗内表单网格间距统一（与 6 轨栅格对齐） */
.modal-body .form-grid { gap: 14px 16px; }
/* 弹窗出现动画更顺滑（缩放+轻微上移，时长与遮罩一致） */
.modal { transition: transform var(--ui-dur) var(--ui-ease), opacity var(--ui-dur) var(--ui-ease); }
.confirm-dialog { transition: transform var(--ui-dur-fast) var(--ui-ease); }

/* ===== 8. 分页：按钮等宽等高、当前页主色、信息文字统一 ===== */
.pagination {
    margin-top: 14px;
    padding: 2px 0;
    font-size: 13px;
    color: var(--gray-500);
}
.page-info { font-variant-numeric: tabular-nums; }
.pagination-btns { gap: 6px; }
.pagination-btns button {
    min-width: 32px;
    height: var(--ui-ctrl-h-sm);
    padding: 0 10px;
    border: 1px solid var(--gray-300);
    border-radius: var(--ui-radius-sm);
    background: #fff;
    color: var(--gray-600);
    font-size: 13px;
    transition: background var(--ui-dur-fast) var(--ui-ease),
                border-color var(--ui-dur-fast) var(--ui-ease),
                color var(--ui-dur-fast) var(--ui-ease);
}
.pagination-btns button:hover:not(:disabled):not(.active) {
    background: var(--gray-50);
    border-color: var(--gray-400);
}
.pagination-btns button.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    font-weight: 600;
}

/* ===== 9. 标签 Badge：胶囊形、字号/内边距统一，补齐收入/支出语义色 ===== */
.badge,
.rc-modal .tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border-radius: var(--ui-radius-pill);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.7;
    white-space: nowrap;
    vertical-align: middle;
}
.badge-success { background: var(--success-light); color: var(--success); }
.badge-warning { background: var(--warning-light); color: var(--warning); }
.badge-danger  { background: var(--danger-light); color: var(--danger); }
.badge-info     { background: var(--primary-light); color: var(--primary); }
/* 中性灰 / 真信息蓝 / 品牌橙：补齐语义色板，色值与历史内联逐字节一致（蓝沿用 #e1effe/#1a56db，零色差） */
.badge-gray     { background: var(--gray-100); color: var(--gray-500); }
.badge-blue     { background: var(--info-light); color: var(--info); }
.badge-primary  { background: var(--primary-light); color: var(--primary); }
/* 收入红 / 支出绿 语义标签（财务页面统一使用） */
.badge-income,
.badge.income { background: var(--ui-income-bg); color: var(--ui-income); border: 1px solid var(--ui-income-border); }
.badge-expense,
.badge.expense { background: var(--ui-expense-bg); color: var(--ui-expense); border: 1px solid var(--ui-expense-border); }
/* 顶栏/面板内的小计数胶囊统一视觉 */
.user-role-badge,
.bell-item-count,
.dropdown-badge,
.source-item {
    border-radius: var(--ui-radius-pill);
    font-weight: 500;
    line-height: 1.6;
}
/* 财务金额文字色：纠正 V2 中 income 绿/expense 红 的反转，统一为 收入红 #dc2626 / 支出绿 #16a34a */
.stat-card .value.income,
.text-income,
.amount-income,
.money-income,
.income-text,
td.income,
span.income { color: var(--ui-income) !important; }
.stat-card .value.expense,
.text-expense,
.amount-expense,
.money-expense,
.expense-text,
td.expense,
span.expense { color: var(--ui-expense) !important; }
/* 金额加深档（强调场景） */
.text-income.strong, .income.strong { color: var(--ui-income-strong); }
.text-expense.strong, .expense.strong { color: var(--ui-expense-strong); }
/* 检查矩阵单元格沿用 收入红/支出绿 同色系，统一圆角与字重 */
.cm-cell {
    text-align: center;
    font-weight: 600;
    border-radius: var(--ui-radius-xs);
    font-variant-numeric: tabular-nums;
}
/* 正常=支出绿同色值、异常=收入红同色值（沿用 V2 原色值，仅补圆角/等宽数字） */
.cm-ok   { background: #eafaf0; color: #16a34a; }
.cm-bad  { background: #fdecec; color: #dc2626; }
.cm-empty { color: #c4c9d2; font-weight: 400; }

/* ===== 10. 空状态：块级页面空态 / 表格内空态 / 占位卡片 三种形态统一 ===== */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 56px 20px;
    color: var(--gray-400);
    text-align: center;
}
.empty-state svg,
.empty-state .empty-icon { width: 60px; height: 60px; margin-bottom: 10px; opacity: 0.45; }
.empty-state .empty-title { font-size: 15px; font-weight: 600; color: var(--gray-600); margin: 0; }
.empty-state p { font-size: 13px; margin: 0; line-height: 1.6; }
.empty-state .btn,
.empty-state button { margin-top: 10px; }
/* 占位卡片（未开发/不存在页面）与空态同一视觉语言 */
.placeholder-card {
    min-height: 320px;
    padding: 48px 24px;
    box-shadow: none;
}
.placeholder-card-icon {
    width: 68px;
    height: 68px;
    margin-bottom: 18px;
    background: var(--gray-100);
    border-radius: 50%;
}
.placeholder-card h3 { font-size: 16px; font-weight: 600; margin-bottom: 8px; }
.placeholder-card p { font-size: 13px; line-height: 1.7; }
.placeholder-page i { font-size: 60px; opacity: 0.5; }

/* ===== 11. 加载态：通用旋转圈 / 行内加载 / 骨架屏 / 按钮加载 / 补 toast-info ===== */
@keyframes ui-spin { to { transform: rotate(360deg); } }
@keyframes ui-shimmer { 0% { background-position: -200px 0; } 100% { background-position: calc(200px + 100%) 0; } }
/* 块级加载容器（页面/表格/弹窗均可直接套用） */
.ui-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 44px 16px;
    color: var(--gray-400);
    font-size: 13px;
}
.ui-spinner {
    width: 30px;
    height: 30px;
    border: 3px solid var(--gray-200);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: ui-spin 0.7s linear infinite;
}
.ui-spinner.ui-spinner-sm { width: 16px; height: 16px; border-width: 2px; }
/* 行内加载（按钮、搜索提示等） */
.ui-loading-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gray-400);
    font-size: 13px;
}
.ui-loading-inline .ui-spinner { width: 14px; height: 14px; border-width: 2px; }
/* 按钮加载：data-loading="true" 时左侧出现旋转圈（无需改 JS，页面按需挂类） */
.btn[data-loading="true"] {
    position: relative;
    color: transparent !important;
    pointer-events: none;
}
.btn[data-loading="true"]::after {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: ui-spin 0.7s linear infinite;
}
.btn-secondary[data-loading="true"]::after { border-color: var(--gray-300); border-top-color: var(--gray-600); }
/* 骨架屏 */
.ui-skeleton {
    display: block;
    height: 14px;
    border-radius: var(--ui-radius-sm);
    background: linear-gradient(90deg, var(--gray-100) 25%, var(--gray-200) 37%, var(--gray-100) 63%);
    background-size: 200px 100%;
    animation: ui-shimmer 1.3s ease-in-out infinite;
}
/* 既有文本加载提示统一间距/字号 */
.search-loading,
.search-no-result,
.bell-loading,
.bell-empty {
    padding: 18px 16px;
    text-align: center;
    color: var(--gray-400);
    font-size: 13px;
}
/* Toast：补全缺失的 info 类型（toast.js 会调用 toast.info），统一圆角与间距 */
.toast {
    border-radius: var(--ui-radius);
    padding: 11px 18px;
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 8px;
}
.toast-info {
    background: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}

/* ===== 12. 侧边栏：展开/折叠/手风琴/悬停浮层细节顺滑 ===== */
.sidebar,
.main-content {
    transition: width var(--ui-dur-slow) var(--ui-ease),
                margin-left var(--ui-dur-slow) var(--ui-ease),
                transform var(--ui-dur-slow) var(--ui-ease);
}
/* 修复：手风琴展开高度上限 500px 会裁掉“安全台账”等超过 15 项的分组，放宽到 2000px */
.nav-group.expanded .submenu-items {
    max-height: 2000px;
    transition: max-height 0.32s var(--ui-ease);
}
.submenu-items { transition: max-height 0.28s var(--ui-ease); }
.submenu-arrow { transition: transform var(--ui-dur) var(--ui-ease); }
/* 展开态分组标题与菜单项间距/字号收敛 */
.sidebar:not(.sidebar-collapsed) .nav-group-submenu { margin: 2px 10px 8px; }
.sidebar:not(.sidebar-collapsed) .submenu-header {
    padding: 6px 10px;
    font-size: 11px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}
.sidebar:not(.sidebar-collapsed) .submenu-item {
    margin: 1px 0;
    padding: 8px 12px;
    border-radius: var(--ui-radius-sm);
    font-size: 13px;
    transition: background var(--ui-dur-fast) var(--ui-ease), color var(--ui-dur-fast) var(--ui-ease);
}
/* 展开态当前菜单项：浅橙底 + 左侧 3px 主色指示条，定位更明确 */
.sidebar:not(.sidebar-collapsed) .submenu-item.active {
    background: rgba(255, 124, 0, 0.16);
    color: #fff;
    font-weight: 600;
    position: relative;
}
.sidebar:not(.sidebar-collapsed) .submenu-item.active::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 6px;
    bottom: 6px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--primary);
}
/* 折叠态分组图标：40×40 圆角命中区，激活/悬停反馈统一 */
.sidebar.sidebar-collapsed .nav-group-icon {
    width: 40px;
    height: 40px;
    margin: 6px auto;
    border-radius: var(--ui-radius);
    transition: background var(--ui-dur-fast) var(--ui-ease);
}
.sidebar.sidebar-collapsed .nav-group-icon:hover,
.sidebar.sidebar-collapsed .nav-group-icon.hover { background: rgba(255, 255, 255, 0.12); }
.sidebar.sidebar-collapsed .nav-group-icon.has-active {
    background: rgba(255, 124, 0, 0.22);
}
/* 折叠态悬停浮层：白底卡片，圆角/阴影/间距统一，只做淡入（不做横向位移，避免归位顿挫，与 V2 既有决策一致） */
.nav-group-submenu.fixed-flyout {
    min-width: 188px;
    max-height: calc(100vh - 24px);
    padding: 8px;
    border-radius: var(--ui-radius-lg);
    background: #fff;
    box-shadow: var(--ui-shadow-flyout);
    opacity: 0;
    transition: opacity 0.16s ease;
}
.nav-group-submenu.fixed-flyout.show { opacity: 1; }
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-header {
    display: flex;
    padding: 6px 10px 8px;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    color: #0B2A6B;
    border-bottom: 1px solid var(--gray-100);
}
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-items {
    max-height: none !important;
    overflow: visible !important;
}
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 10px;
    margin: 1px 0;
    border-radius: var(--ui-radius-sm);
    font-size: 13px;
    color: var(--gray-700);
    transition: background var(--ui-dur-fast) var(--ui-ease), color var(--ui-dur-fast) var(--ui-ease);
}
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-item:hover {
    background: var(--primary-light);
    color: var(--primary);
}
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-item.active {
    background: var(--primary-light);
    color: var(--primary);
    font-weight: 600;
}
/* 侧栏 LOGO 区与导航滚动不出现横向条；不设 scroll-behavior:smooth，保证切页恢复滚动位置时瞬时定位、不从顶部滑下 */
.sidebar-header { min-height: 56px; }
.sidebar-nav { overflow-x: hidden; }

/* ===== 13. 顶栏：三类浮层（铃铛/头像）圆角阴影统一 ===== */
.header-bell,
.header-user { border-radius: var(--ui-radius); transition: background var(--ui-dur-fast) var(--ui-ease); }
.search-results-panel,
.bell-dropdown,
.avatar-dropdown {
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-md);
    border: 1px solid var(--gray-200);
    overflow: hidden;
}
.search-results-panel { margin-top: 6px; }
.bell-dropdown { margin-top: 6px; }
.avatar-dropdown {
    transform: translateY(-4px);
    transition: opacity var(--ui-dur-fast) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease);
}
.avatar-dropdown.show { transform: translateY(0); }
.search-group-title { font-size: 11px; letter-spacing: 0.5px; }
.search-result-item,
.bell-item,
.dropdown-item { transition: background var(--ui-dur-fast) var(--ui-ease); }
.breadcrumb-bar { font-size: 13px; min-height: 42px; }

/* ===== 14. AI 助手面板：圆角/输入/按钮纳入同一尺度（不改结构） ===== */
.ai-assistant-panel { border-radius: var(--ui-radius-lg); box-shadow: var(--ui-shadow-flyout); }
.assistant-header { border-radius: var(--ui-radius-lg) var(--ui-radius-lg) 0 0; }
.assistant-input-area textarea { min-height: 40px; }
.send-btn { width: 38px; height: 38px; border-radius: var(--ui-radius); }
.quick-btn {
    border-radius: var(--ui-radius-pill);
    padding: 6px 14px;
    font-size: 12px;
    transition: all var(--ui-dur-fast) var(--ui-ease);
}
.ai-action-btn { border-radius: var(--ui-radius-sm); }
.message-content { line-height: 1.55; }

/* ===== 15. 横向滚动豁免：月历矩阵 / 检查矩阵允许区域内横向滚动 ===== */
/* 派车月历、月度检查矩阵等宽矩阵：只允许在其自身容器内横向滚动，不外溢到页面 */
[class*="calendar" i],
[class*="matrix" i],
.m-table,
.cm-table,
.check-matrix { max-width: 100%; }
[class*="calendar-scroll" i],
[class*="matrix-scroll" i],
.matrix-scroll,
.calendar-scroll,
[class*="calendar" i] > .table-wrap,
[class*="calendar" i] > .data-table-wrapper,
[class*="matrix" i] > .table-wrap,
[class*="matrix" i] > .data-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* 矩阵单元格不做单行省略，避免“√/×/日期”被截断 */
[class*="matrix" i] td,
[class*="calendar" i] td,
.m-table td,
.cm-table td {
    max-width: none;
    white-space: normal;
    text-overflow: clip;
}
.m-table input,
.rc-modal .data-table input,
[class*="matrix" i] input {
    border: 1px solid var(--gray-200);
    border-radius: var(--ui-radius-xs);
    padding: 3px 6px;
    font-size: 12px;
}
.rc-modal { border-radius: var(--ui-radius-lg); }
.rc-modal table .r { text-align: right; font-variant-numeric: tabular-nums; }

/* ===== 16. 响应式：中屏收敛、移动端大字大按钮（触控命中区 ≥40px） ===== */
@media (max-width: 1280px) {
    .search-box .form-input { width: 200px; }
}
@media (max-width: 899px) {
    /* 移动端抽屉侧栏圆角阴影 */
    .sidebar { box-shadow: var(--ui-shadow-flyout); }
    .header { padding: 0 14px; gap: 10px; }
    .page-content { padding: 0 14px 16px; }
    .user-name { max-width: 96px; overflow: hidden; text-overflow: ellipsis; }
    .user-role-badge { display: none; }
}
@media (max-width: 768px) {
    /* 大字大按钮：常规控件 ≥40px，输入 16px 防止 iOS 聚焦自动放大 */
    button,
    .btn,
    input[type="button"],
    input[type="submit"],
    input[type="reset"] { height: 40px; padding: 0 16px; font-size: 15px; }
    .btn-sm, .btn.btn-sm { height: 34px; font-size: 14px; }
    .form-input,
    .search-input,
    .filter-bar input,
    .filter-bar select,
    .modal-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    .modal-body select { height: 40px; font-size: 16px; }
    /* 工具条纵向堆叠、搜索框占满整行 */
    .list-toolbar,
    .toolbar { flex-direction: column; align-items: stretch; }
    .list-toolbar .search-box,
    .toolbar .search-box { width: 100%; }
    .list-toolbar .search-box .form-input,
    .list-toolbar .search-input,
    .toolbar .search-input { flex: 1; width: 100%; min-width: 0; }
    .list-toolbar .toolbar-actions { justify-content: flex-end; }
    .filter-bar .form-group { min-width: calc(50% - 8px); flex: 1; }
    /* 统计卡窄屏一律两列（!important 覆盖页面写死的多列内联栅格），≤480 再降单列 */
    .stat-cards,
    .stat-cards.two-col,
    .stat-cards.three-col { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    /* 表格行内操作按钮加大触控区 */
    .data-table .actions button,
    .data-table td:last-child > button { height: 34px; min-width: 56px; font-size: 13px; }
    .pagination { flex-direction: column; gap: 10px; align-items: stretch; }
    .pagination-btns { justify-content: center; flex-wrap: wrap; }
    /* 卡片与弹窗移动端占满 */
    .stat-card .value { font-size: 24px; }
    .modal { width: 94vw !important; max-height: 90vh; }
    .confirm-dialog { width: calc(100vw - 32px); max-width: 400px; }
    .modal-header { padding: 16px 18px 0; }
    .modal-body { padding: 16px 18px; }
    .modal-footer { padding: 12px 18px; }
    .card { padding: 16px; }
    .welcome-card { padding: 22px; }
    .welcome-card h2 { font-size: 20px; }
    /* 顶栏头像区只保留头像，避免拥挤 */
    .header-center { display: none; }
}
@media (max-width: 480px) {
    .filter-bar .form-group { min-width: 100%; }
    .stat-cards,
    .stat-cards.two-col,
    .stat-cards.three-col { grid-template-columns: 1fr !important; }
    .data-table td, .data-table th { padding: 9px 10px; }
    .toast { max-width: calc(100vw - 32px); font-size: 13px; }
}

/* ===== 17. 减少动态偏好：系统开启“减少动态效果”时关闭非必要动画 ===== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ===== 内测收口：操作列必须完整显示“查看/编辑/删除”，不得裁切、不产生横向滚动 ===== */
.data-table th:last-child,
.data-table td:last-child,
.data-table td.actions-cell { width: 1%; min-width: max-content; }
.data-table .actions { flex-wrap: nowrap; }
.data-table .actions button,
.data-table td:last-child > button { min-width: 46px; padding: 0 8px; gap: 4px; }
/* 普通数据列允许收缩省略，把空间让给首列与操作列 */
.data-table td { max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
.data-table table { min-width: 0; }

/* 收紧单元格左右内边距，给常规列表腾出空间，避免操作列最后一个按钮差几像素被裁 */
.data-table th, .data-table td { padding-left: 12px; padding-right: 12px; }
.data-table .actions button, .data-table td:last-child > button { min-width: 42px; padding-left: 6px; padding-right: 6px; }

/* ===== 20260903-2 侧栏字体与图标整体放大（置于最终层，保证覆盖前面规则）===== */
/* 展开态：分组大标题更醒目 */
.sidebar:not(.sidebar-collapsed) .submenu-header {
    /* 分组名贴左、略灰、与上一组拉开距离，层级靠字重/颜色 */
    font-size: 13.5px; font-weight: 600; padding: 14px 12px 8px 16px;
    letter-spacing: 1px; text-transform: none; color: rgba(255,255,255,0.55);
}
.sidebar:not(.sidebar-collapsed) .submenu-header:hover { color: rgba(255,255,255,0.85); }
/* 展开态：子菜单内缩近似居中、行距舒展，悬停/选中为内缩圆角块 */
.sidebar:not(.sidebar-collapsed) .submenu-item {
    font-size: 15px; line-height: 1.3; padding: 11px 12px 11px 44px; margin: 1px 10px;
}
.sidebar:not(.sidebar-collapsed) .submenu-item.active::before { left: -10px; top: 10px; bottom: 10px; }
.sidebar:not(.sidebar-collapsed) .nav-group { margin-bottom: 8px; }
/* 分组右侧小箭头同步放大 */
.sidebar:not(.sidebar-collapsed) .submenu-arrow { font-size: 14px; }
/* 品牌全称字号（可容纳“广州盛航汽车租赁有限公司”） */
.sidebar-brand-full { font-size: 12px; }
/* 折叠态：分组图标整体更大、更好点 */
.sidebar.sidebar-collapsed .nav-group-icon { width: 48px; height: 48px; margin: 8px auto; }
.sidebar.sidebar-collapsed .nav-group-icon svg,
.sidebar.sidebar-collapsed .nav-group-icon img { width: 24px; height: 24px; }
/* 折叠态悬停浮层文字同步放大 */
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-header { font-size: 13.5px; }
.sidebar.sidebar-collapsed .nav-group-submenu.fixed-flyout .submenu-item { font-size: 14.5px; }


/* ============================================================================
   20260904-3 顶级 UI 收口（对齐已确认小样）：表头/行高/文字链接操作/更多折叠
   只改视觉与操作列承载，不改任何业务逻辑与数据。置于最终层。
   ============================================================================ */
/* 表头：更浅的固定底、12.5px 大写感弱化、行高 42 */
.data-table thead th { background: #F7F9FC; height: 44px; font-size: 12.5px; color: #8a93a5;
  border-bottom: 1px solid #eef1f6; }
/* 表体：46px 舒适行高，发丝分隔线，hover 更克制 */
.data-table tbody td { padding: 0 14px; height: 46px; border-bottom: 1px solid #f1f3f7; }
.data-table tbody tr:last-child td { border-bottom: none; }
.data-table tbody tr:hover td,
.data-table tbody tr:hover td:last-child { background: #FAFBFE; }
/* 行内操作：去描边，改文字链接风格（对齐小样） */
.data-table .actions { gap: 2px; }
.data-table .actions button,
.data-table td:last-child > button,
.data-table .actions a.btn-text,
.data-table td.op-cell > button {
  height: 30px; min-width: auto; padding: 0 8px; border: 1px solid transparent !important;
  background: transparent; color: var(--gray-600); border-radius: 6px; font-size: 13px; font-weight: 500;
  box-shadow: none !important; white-space: nowrap;
}
.data-table .actions button:hover,
.data-table td:last-child > button:hover { background: #f1f4fa; border-color: transparent !important; color: var(--gray-900); }
.data-table .actions button.primary-btn,
.data-table .actions button.text-primary { color: var(--primary, #FF7C00); }
.data-table .actions button.primary-btn:hover,
.data-table .actions button.text-primary:hover { background: rgba(255,124,0,.12); }
.data-table .actions button.delete-btn,
.data-table .actions button.text-danger { color: #dc2626 !important; border-color: transparent !important; }
.data-table .actions button.delete-btn:hover,
.data-table .actions button.text-danger:hover { background: #fdecec !important; }
/* 操作列分隔竖线：外露操作与“更多”之间 */
.data-table .op-more-btn {
  height: 30px; padding: 0 8px; border: 1px solid transparent; background: transparent;
  color: var(--gray-600); border-radius: 6px; font-size: 13px; display: inline-flex; align-items: center; gap: 2px;
}
.data-table .op-more-btn:hover { background: #f1f4fa; color: var(--gray-900); }
.data-table .op-more-btn .op-more-caret { font-size: 10px; transition: transform .15s; }
.data-table .op-more-btn.open .op-more-caret { transform: rotate(180deg); }
/* 浮到 body 的“更多”菜单（fixed，避免被表格 overflow 裁切） */
.op-more-menu {
  position: fixed; z-index: var(--z-popover); min-width: 148px; padding: 6px;
  background: #fff; border: 1px solid #eceff4; border-radius: 10px;
  box-shadow: 0 12px 40px rgba(11,42,107,.16), 0 3px 10px rgba(15,23,42,.08);
  display: none;
}
.op-more-menu.show { display: block; }
.op-more-menu .opm-item {
  display: flex; align-items: center; gap: 8px; width: 100%; box-sizing: border-box;
  padding: 9px 10px; border: none; background: transparent; border-radius: 7px;
  font-size: 13.5px; color: var(--gray-700); text-align: left; cursor: pointer; white-space: nowrap;
}
.op-more-menu .opm-item:hover { background: #f5f7fb; color: var(--gray-900); }
.op-more-menu .opm-item.is-danger { color: #dc2626; }
.op-more-menu .opm-item.is-danger:hover { background: #fdecec; }
.op-more-menu .opm-sep { height: 1px; background: #eef0f4; margin: 5px 4px; }

/* ============================================================
   W12（2026-09-07）支出/收入列表母版对齐：弹性列宽 / 工具栏更多 / 密度 / 复合双行
   纯展示增强，不改业务取数与金额逻辑。
   ============================================================ */
/* P1-C 弹性列宽：窄列按内联宽度定宽，无宽度长文本列吃剩余空间，无横向滚动 */
.data-table.tk-elastic > table.tk-table { table-layout: fixed; width: 100%; min-width: 0; }
.data-table.tk-elastic > table.tk-table th,
.data-table.tk-elastic > table.tk-table td { overflow: hidden; text-overflow: ellipsis; }
/* 长文本列（无内联宽度）允许换行省略、不撑破列宽 */
.data-table.tk-elastic .u-tal { max-width: 0; }
/* 窄屏（≤768）：列多总宽超视口，允许横向滑动查看金额/操作，桌面端仍零横溢 */
@media (max-width: 768px) {
  .data-table.tk-elastic { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .data-table.tk-elastic > table.tk-table { min-width: 920px; }
  /* overflow-x:auto 会让 overflow-y 计算值一并变 auto，使 .data-table 自身成为 sticky 表头的
     最近滚动祖先；此时吸顶表头应贴“表格容器自身顶部”(0)，若仍用 --header-height(52px) 会把
     表头下推一整行、正好压住首行数据（窄屏登录后首屏“数据行被表头盖住”根因）。桌面宽屏
     tk-fit 的 overflow:visible 不命中本媒体块，仍相对页面滚动区贴固定顶栏，行为不变。 */
  .data-table.tk-sticky thead th { top: 0; }
}

/* FE-5 长表虚拟滚动：仅用 content-visibility 让屏外行跳过渲染（不删 DOM、不与 Vue 冲突）。
   行高由 JS 按实际写入 contain-intrinsic-size，避免滚动条跳动；不支持的浏览器忽略本条即普通全渲染。 */
.tk-virtual.tk-vrow, .tk-virtual .tk-vrow { content-visibility: auto; }
.tk-vrow { content-visibility: auto; }

/* P2-E 工具栏「更多▾」下拉（与行内 op-more 视觉一致） */
.tk-more-wrap { position: relative; display: inline-flex; }
.tk-more-btn { gap: 4px; }
.tk-more-btn .tk-more-caret { font-size: 10px; transition: transform .15s; }
.tk-more-btn.open .tk-more-caret { transform: rotate(180deg); }
.tk-more-menu {
  position: fixed; z-index: var(--z-popover);
  min-width: 140px; padding: 6px; background: #fff; border: 1px solid #eceff4; border-radius: 10px;
  box-shadow: 0 12px 40px rgba(11,42,107,.16), 0 3px 10px rgba(15,23,42,.08);
  display: flex; flex-direction: column; gap: 2px;
}
.tk-more-menu[hidden] { display: none; }
.tk-more-menu > .btn { width: 100%; justify-content: flex-start; }
.tk-more-menu > a, .tk-more-menu > button { white-space: nowrap; }

/* P1-B 业务成本复合双行：主行客户名，副行弱文本（单号·行程摘要） */
.exp-cell-main { font-weight: 500; color: var(--gray-900); }
.exp-cell-sub {
  margin-top: 2px; font-size: 12px; line-height: 1.4; color: var(--gray-400);
  display: flex; align-items: center; gap: 6px; overflow: hidden; white-space: nowrap;
}
.exp-cell-sub .exp-sub-no { color: var(--primary, #FF7C00); text-decoration: none; cursor: pointer; flex: 0 0 auto; }
.exp-cell-sub .exp-sub-no:hover { text-decoration: underline; }
.exp-cell-sub .exp-sub-route { overflow: hidden; text-overflow: ellipsis; }
/* P1-A 业务成本行支付方式中性态（弱化横杠，不伪造支付方式） */
.paytype-neutral { color: var(--gray-300); }

/* P3-F 紧凑密度：收紧行高/内边距/字号，信息不丢、触控目标仍 >=32px */
body.tk-compact .data-table thead th { height: 36px !important; font-size: 12px; }
body.tk-compact .data-table tbody td { height: auto !important; padding: 6px 12px !important; font-size: 12.5px; }
body.tk-compact .exp-cell-sub { margin-top: 1px; font-size: 11.5px; }
/* 统计卡：选中主卡橙描边（与小样一致），数字字阶 27 */
.stat-card { border: 1px solid #eceff4; border-radius: 10px; }
.stat-card.is-primary, .stat-card.primary { border-color: var(--primary, #FF7C00); box-shadow: 0 0 0 1px var(--primary, #FF7C00) inset; }
.stat-card .value { font-size: 27px; }


/* ===== 20260904-4 工具条聚簇（不再 space-between 撑满整行） ===== */
/* 顶级后台工具条：左侧搜索一簇，右侧操作一簇，间距统一，不再均摊整行 */
.list-toolbar, .toolbar {
  display: flex; align-items: center; flex-wrap: wrap;
  justify-content: flex-start; gap: 10px;
}
.list-toolbar > *, .toolbar > * { flex: 0 0 auto; }
/* 搜索区靠左，并把其后所有操作按钮推成右侧一簇 */
.list-toolbar > .search-box, .toolbar > .search-box {
  margin-right: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.list-toolbar > .toolbar-left, .toolbar > .toolbar-left { margin-right: auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.list-toolbar > .toolbar-actions, .toolbar > .toolbar-actions {
  margin-left: auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
/* 行内操作列：收紧、居中、不拉伸，避免“查看/编辑/删除”散开 */
.data-table .actions { gap: 4px !important; justify-content: center !important; }
.data-table td:last-child, .data-table th:last-child { text-align: center; }

/* 表格横向滚动容器：仅在视口真不够时才出细滚动条，杜绝“粗黑横条” */
.tk-hscroll { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: var(--gray-300) transparent; }
.tk-hscroll::-webkit-scrollbar { height: 8px; }
.tk-hscroll::-webkit-scrollbar-thumb { background: var(--gray-300); border-radius: 8px; background-clip: content-box; }
/* 请假表：宽屏自适应不横滚，原因列弹性省略，时间/操作列不换行不截断 */
.leave-table { width: 100%; min-width: 0; table-layout: auto; }
.leave-table th, .leave-table td { white-space: nowrap; }
.leave-table .col-reason {
  white-space: nowrap; min-width: 120px; max-width: 260px; overflow: hidden; text-overflow: ellipsis;
}
/* 统一各模块主内容区距侧栏间距：SPageShell 已提供唯一 .page-content 内边距，
   页面内误套的第二层 .page-content 不再叠加 padding/margin（否则内容偏远偏窄，各页不一致） */
.page-content .page-content { padding: 0 !important; margin: 0 !important; }


/* ===== 20260904-5 列表一体卡（工具条=表格卡顶栏，全站统一）===== */
.unified-list-card{background:#fff;border:1px solid #DCE1EA;border-radius:10px;margin:0 0 16px;box-shadow:0 1px 2px rgba(16,24,40,.04);overflow:hidden;}
.page-content > .card:has(> .data-table),.card:has(> .list-toolbar),.card:has(> .toolbar){padding:0 !important;border-radius:10px;overflow:hidden;}
.unified-list-card > .list-toolbar,.unified-list-card > .toolbar,.unified-list-card > .filter-bar,
.card:has(> .data-table) > .list-toolbar,.card:has(> .data-table) > .toolbar,.card:has(> .data-table) > .filter-bar{
  margin:0 !important;padding:14px 16px;border-bottom:1px solid #EEF1F6;background:#fff;border-radius:0;
}
.unified-list-card > .tk-tools,.card:has(> .data-table) > .tk-tools{margin:0 !important;padding:10px 16px 0;}
.unified-list-card > .data-table,.card:has(> .data-table) > .data-table{border:0 !important;border-radius:0 !important;box-shadow:none;}
.unified-list-card .data-table.tk-sticky thead th,.card:has(> .data-table) .data-table.tk-sticky thead th{border-radius:0 !important;}
.unified-list-card > .pagination,.unified-list-card > .pagination.tk-pager,.card:has(> .data-table) > .pagination{
  margin:0 !important;padding:12px 16px;border-top:1px solid #EEF1F6;background:#fff;
}
/* 搜索按钮全站统一为橙色实心（与新增主按钮一致），消除一页描边一页实心 */
.list-toolbar .search-box > button,.toolbar .search-box > button,.filter-bar .search-box > button{
  background:var(--primary);border:1px solid var(--primary);color:#fff;
}
.list-toolbar .search-box > button:hover,.toolbar .search-box > button:hover{filter:brightness(.95);}


/* ===== 20260904-5b 特殊列表结构补齐 ===== */
/* 工具条移进既有卡（安全台账类）*/
.card.lc-inline{padding:0 !important;border-radius:10px;overflow:hidden;}
.card.lc-inline > .list-toolbar,.card.lc-inline > .filter-bar,.card.lc-inline > .toolbar{margin:0 !important;padding:14px 16px;border-bottom:1px solid #EEF1F6;}
.card.lc-inline > .pagination-bar,.card.lc-inline > .pagination{margin:0 !important;padding:12px 16px;border-top:1px solid #EEF1F6;}
.card.lc-inline .card-body{padding:0;}
/* 一体卡内的重复客户辅助面板 */
.unified-list-card > .dup-panel{padding:12px 16px;border-bottom:1px solid #EEF1F6;}
/* 无法并入（双表/纯筛选页）时，残留工具条做独立白字条，避免裸在灰底 */
.page-content > .list-toolbar,.page-content > .filter-bar,.main-content > .list-toolbar,.main-content > .filter-bar{
  background:#fff;border:1px solid #DCE1EA;border-radius:10px;padding:12px 16px;margin:0 0 12px;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}


/* ===== 20260904-5c 搜索按钮邻接统一：搜索输入框紧邻的按钮即搜索主按钮，全站统一橙实心 ===== */
.list-toolbar input + button,.toolbar input + button,.filter-bar input + button,.unified-list-card input + button,.card.lc-inline input + button{
  background:var(--primary) !important;border:1px solid var(--primary) !important;color:#fff !important;
}
.list-toolbar input + button:hover,.toolbar input + button:hover,.filter-bar input + button:hover{filter:brightness(.95);}

/* ===== 20260904-6 统计卡自适应/工具条分区/日期区间/危险按钮 ===== */
/* 1) 统计卡按实际张数等分行列，杜绝末行空格；≥1280 精确等分，中小屏自适应 */
.stat-cards{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));}
@media (min-width:1280px){
  .stat-cards:has(>*:nth-child(2):last-child){grid-template-columns:repeat(2,1fr);}
  .stat-cards:has(>*:nth-child(3):last-child){grid-template-columns:repeat(3,1fr);}
  .stat-cards:has(>*:nth-child(4):last-child){grid-template-columns:repeat(4,1fr);}
  .stat-cards:has(>*:nth-child(5):last-child){grid-template-columns:repeat(5,1fr);}
  .stat-cards:has(>*:nth-child(6):last-child){grid-template-columns:repeat(6,1fr);}
  .stat-cards:has(>*:nth-child(7):last-child){grid-template-columns:repeat(7,1fr);}
  .stat-cards:has(>*:nth-child(8):last-child){grid-template-columns:repeat(8,1fr);}
}
/* 3) 含“列表/月历”视图切换的工具条：两行各占满，视图在左、操作在右，左缘对齐不空半截 */
.unified-list-card>.toolbar:has(.seg-group),.card:has(.seg-group)>.toolbar{flex-direction:column;align-items:stretch;gap:10px;}
.toolbar:has(.seg-group)>div:last-child{margin-left:0 !important;width:100 %;}
.toolbar .seg-group{margin-right:auto !important;}
/* 4) 日期区间：起+至+止合成一个外框整体 */
.date-range{display:inline-flex;align-items:center;gap:6px;border:1px solid #DCE1EA;border-radius:8px;background:#fff;padding:0 8px;height:34px;}
.date-range input[type="date"]{border:0 !important;background:transparent !important;box-shadow:none !important;outline:none;width:130px;min-width:0;height:30px;padding:0 2px !important;}
.date-range span{color:#9aa4b2;font-size:13px;}
/* 5) 工具条/卡内危险按钮一律红字描边，不使用整块实心红（弹窗内确认保持实心不受影响） */
.unified-list-card .btn-danger,.card .btn-danger,.list-toolbar .btn-danger,.toolbar .btn-danger,.filter-bar .btn-danger{
  background:#fff !important;color:#dc2626 !important;border:1px solid #f0bcbc !important;
}
.unified-list-card .btn-danger:hover,.card .btn-danger:hover,.list-toolbar .btn-danger:hover,.toolbar .btn-danger:hover{background:#fdecec !important;}

/* 20260904-6b 紧凑筛选行：设了内联宽度的筛选输入/下拉不被全局 min-width 撑换行 */
.toolbar .search-input[style*="width"],.list-toolbar .search-input[style*="width"],.filter-bar .search-input[style*="width"]{min-width:0 !important;}

/* 20260905-1 统计卡与下方内容统一间距：全站统计卡与下方表格卡/工具条保持一致呼吸距，不再贴死 */
.page-content>.stat-cards,.main-content>.stat-cards{margin-bottom:18px !important;}
.page-content>.stat-cards+.card,.page-content>.stat-cards+.unified-list-card,
.main-content>.stat-cards+.card,.main-content>.stat-cards+.unified-list-card{margin-top:0;}

/* 20260905-2 重置类按钮保持次级样式：重置/清空类按钮永远白底灰边，不被搜索邻接规则染成主色 */
.toolbar button[class*="reset" i],.list-toolbar button[class*="reset" i],.filter-bar button[class*="reset" i],.unified-list-card button[class*="reset" i],
.toolbar button[id*="reset" i],.list-toolbar button[id*="reset" i],.filter-bar button[id*="reset" i],.unified-list-card button[id*="reset" i]{
  background:#fff !important;color:var(--gray-500) !important;border:1px solid #DCE1EA !important;
}
.toolbar button[class*="reset" i]:hover,.list-toolbar button[class*="reset" i]:hover,.filter-bar button[class*="reset" i]:hover{background:#f6f7f9 !important;}

/* ===== 20260905-3 顶级弹窗双列表单（不使用6列，顶级B端：880宽、两列、长字段整行） ===== */
.modal{width:min(880px,94vw) !important;}
.modal-body .form-grid,
.modal-body[style*="grid-template-columns"],
.modal-body [style*="1fr 1fr"],
.modal-body [style*="repeat(3"],.modal-body [style*="repeat(4"],.modal-body [style*="repeat(6"],
.modal-body:has(> .form-group ~ .form-group):not(:has(.form-grid)){
  display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px 18px !important;align-items:start;
}
/* 默认每个表单项占一列（半宽） */
.modal-body .form-grid>.form-group,
.modal-body[style*="grid-template-columns"]>.form-group,
.modal-body [style*="1fr 1fr"]>.form-group,.modal-body [style*="repeat(3"]>.form-group,.modal-body [style*="repeat(4"]>.form-group,.modal-body [style*="repeat(6"]>.form-group,
.modal-body:has(> .form-group ~ .form-group):not(:has(.form-grid))>.form-group{grid-column:span 1;min-width:0;margin-bottom:0;}
/* 整行：多跨度类、多行文本、文件上传、以及非表单项（提示/datalist包裹等） */
.modal-body .span-3,.modal-body .span-6,.modal-body .field-span-full,.modal-body .form-group.span-2:has(textarea),
.modal-body .form-group:has(textarea),.modal-body .form-group:has(input[type="file"]){grid-column:1 / -1 !important;}
.modal-body .form-group:has(.form-input[type="date"]) { }
.modal-body label{font-size:13px;color:var(--gray-600);margin-bottom:6px;}
.modal-body .form-group .required,.modal-body label.required::after{content:"*";color:#dc2626;margin-left:2px;}
@media (max-width:640px){
  .modal-body .form-grid,.modal-body[style*="grid-template-columns"],.modal-body [style*="1fr 1fr"],.modal-body [style*="repeat(3"],.modal-body [style*="repeat(4"],.modal-body [style*="repeat(6"],.modal-body:has(> .form-group ~ .form-group):not(:has(.form-grid)){grid-template-columns:1fr !important;}
}

/* ===== 20260905-3b 弹窗分区双列3b：兼容 H4小标题+分区DIV 结构，分区容器两列、标题整行 ===== */
.modal-body>div:has(.form-group),
.modal-body>section:has(.form-group){
  display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px 18px !important;align-items:start;
}
.modal-body>div:has(.form-group)>.form-group,
.modal-body>section:has(.form-group)>.form-group{grid-column:span 1;min-width:0;margin-bottom:0;}
.modal-body>div:has(.form-group)>.form-group:has(textarea),
.modal-body>div:has(.form-group)>.form-group:has(input[type="file"]),
.modal-body>section:has(.form-group)>.form-group:has(textarea),
.modal-body>section:has(.form-group)>.form-group:has(input[type="file"]),
.modal-body>div:has(.form-group)>.span-3,.modal-body>div:has(.form-group)>.span-6,.modal-body>div:has(.form-group)>.field-span-full,
.modal-body>div:has(.form-group)>h4,.modal-body>div:has(.form-group)>h3,.modal-body>section:has(.form-group)>h4{grid-column:1 / -1 !important;}
.modal-body h4.section-title,.modal-body>div:has(.form-group)>h4{font-size:13px;font-weight:600;color:var(--gray-800);margin:2px 0 0;padding-top:10px;border-top:1px solid #EEF1F6;}
@media (max-width:640px){
  .modal-body>div:has(.form-group),.modal-body>section:has(.form-group){grid-template-columns:1fr !important;}
}

/* ===== 20260905-3c 通用表单项容器双列3c：任何“直接装着表单项”的容器统一治理，兼容直挂/分区/form-grid/内联 ===== */
/* 1) 直接含 >=2 个表单项的容器：两列 */
.modal-body .form-grid,
.modal-body :is(div,section,form):has(> .form-group):has(> .form-group ~ .form-group),
.modal-body [style*="1fr 1fr"],.modal-body [style*="repeat(2"],.modal-body [style*="repeat(3"],.modal-body [style*="repeat(4"],.modal-body [style*="repeat(6"]{
  display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px 18px !important;align-items:start;
}
/* 2) 这种容器里，表单项默认半宽；长字段整行 */
.modal-body .form-grid>.form-group,
.modal-body :is(div,section,form):has(> .form-group):has(> .form-group ~ .form-group)>.form-group,
.modal-body [style*="1fr 1fr"]>.form-group,.modal-body [style*="repeat(2"]>.form-group,.modal-body [style*="repeat(3"]>.form-group,.modal-body [style*="repeat(4"]>.form-group,.modal-body [style*="repeat(6"]>.form-group{grid-column:span 1;min-width:0;margin-bottom:0;}
.modal-body .form-group:has(textarea),.modal-body .form-group:has(input[type="file"]),
.modal-body .span-3,.modal-body .span-6,.modal-body .field-span-full{grid-column:1 / -1 !important;}
/* 3) 只含 1 个表单项的容器：不做栅格，整块在父级里整行，避免半宽留白/四分之一列 */
.modal-body :is(div,section,form):has(> .form-group):not(:has(> .form-group ~ .form-group)){display:block;grid-column:1 / -1;}
/* 4) 嵌套分区容器在其父栅格中整行铺满（不再只占半格后内部再分） */
.modal-body *>:is(div,section):has(> .form-group):has(> .form-group ~ .form-group){grid-column:1 / -1 !important;}
/* 5) 分区小标题整行 */
.modal-body :is(h3,h4,h5){grid-column:1 / -1;}
@media (max-width:640px){
  .modal-body .form-grid,.modal-body :is(div,section,form):has(> .form-group):has(> .form-group ~ .form-group),
  .modal-body [style*="1fr 1fr"],.modal-body [style*="repeat(2"],.modal-body [style*="repeat(3"],.modal-body [style*="repeat(4"],.modal-body [style*="repeat(6"]{grid-template-columns:1fr !important;}
}

/* 20260905-3d 顶级弹窗双列：跨列字段(span-2/3/4/6等)在双列栅格内一律整行铺满，避免 span3 挤出第三条隐式轨道 */
.modal-body .form-group[class*="span"],
.modal-body .form-group[class*="col-span"],
.modal-body .form-grid .span-2,
.modal-body .form-grid .span-3,
.modal-body .form-grid .span-4,
.modal-body .form-grid .span-5,
.modal-body .form-grid .span-6,
.modal-body .form-grid .full,
.modal-body .form-grid .col-full { grid-column: 1 / -1 !important; }

/* 20260905-3e 顶级弹窗双列：无论父级是 form-grid 还是普通分区 DIV，长文本/上传/整行字段都铺满一行 */
.modal-body .form-group:has(textarea),
.modal-body .form-group:has(input[type="file"]),
.modal-body .form-group:has(.full-width),
.modal-body .form-group:has(.editor-wrap),
.modal-body .form-group.full,
.modal-body .form-group[style*="grid-column: 1 / -1"],
.modal-body .form-group[style*="grid-column:1/-1"] { grid-column: 1 / -1 !important; }

/* ============================================================================
 * UI-P1-1 统一 Tooltip / Chip（2026-09-06）——纯新增，不改既有规则
 * Tooltip：声明式 [data-tooltip="提示文字"]，hover 与键盘 focus 都显示；
 *          data-tooltip-pos="top|bottom|left|right" 控制方向（默认 top）。
 * Chip：.ui-chip 筛选/标签片，.is-active 选中，语义色 .ui-chip--{success,warning,danger,info}，
 *       .ui-chip--closable 内放 .ui-chip-x 关闭；容器用 .ui-chip-group。
 * ========================================================================== */
/* ---- Tooltip（纯 CSS，零 JS；深色气泡 + 小箭头，层级走统一令牌） ---- */
[data-tooltip] { position: relative; }
[data-tooltip]::before, [data-tooltip]::after {
  position: absolute; left: 50%; bottom: 100%; opacity: 0; visibility: hidden;
  pointer-events: none; z-index: var(--z-tooltip);
  transition: opacity var(--ui-dur-fast) ease;
}
[data-tooltip]::after {
  content: attr(data-tooltip);
  background: rgba(17, 24, 39, .94); color: #fff; font-size: 12px; line-height: 1.5;
  padding: 5px 9px; border-radius: var(--ui-radius-sm); width: max-content; max-width: 240px;
  text-align: left; box-shadow: var(--ui-shadow-flyout); margin-bottom: 6px;
  transform: translate(-50%, -6px);
}
[data-tooltip]::before {
  content: ""; border: 5px solid transparent; border-top-color: rgba(17, 24, 39, .94);
  transform: translate(-50%, 0); margin-bottom: -4px;
}
[data-tooltip]:hover::before, [data-tooltip]:hover::after,
[data-tooltip]:focus-visible::before, [data-tooltip]:focus-visible::after,
[data-tooltip][aria-expanded="true"]::before, [data-tooltip][aria-expanded="true"]::after {
  opacity: 1; visibility: visible;
}
[data-tooltip]:hover::after, [data-tooltip]:focus-visible::after,
[data-tooltip][aria-expanded="true"]::after { transform: translate(-50%, 0); }
[data-tooltip-pos="bottom"]::before, [data-tooltip-pos="bottom"]::after { top: 100%; bottom: auto; }
[data-tooltip-pos="bottom"]::after { margin: 6px 0 0; transform: translate(-50%, 6px); }
[data-tooltip-pos="bottom"]:hover::after { transform: translate(-50%, 0); }
[data-tooltip-pos="bottom"]::before { border-top-color: transparent; border-bottom-color: rgba(17, 24, 39, .94); margin: 4px 0 0; }
[data-tooltip-pos="left"]::after, [data-tooltip-pos="right"]::after { top: 50%; bottom: auto; }
[data-tooltip-pos="left"]::after { left: auto; right: 100%; margin: 0 6px 0 0; transform: translate(-6px, -50%); }
[data-tooltip-pos="right"]::after { left: 100%; right: auto; margin: 0 0 0 6px; transform: translate(6px, -50%); }
[data-tooltip-pos="left"]:hover::after, [data-tooltip-pos="right"]:hover::after { transform: translateY(-50%); }
[data-tooltip-pos="left"]::before, [data-tooltip-pos="right"]::before { display: none; }
@media (hover: none) { [data-tooltip]::after { max-width: 200px; } }

/* ---- Chip：统一筛选/标签片 ---- */
.ui-chip-group { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ui-chip {
  display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 12px;
  border: 1px solid var(--gray-300); border-radius: var(--ui-radius-pill); background: #fff;
  color: var(--gray-700); font-size: 13px; line-height: 1; cursor: pointer; user-select: none;
  transition: all var(--ui-dur-fast) var(--ui-ease); white-space: nowrap;
}
.ui-chip:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.ui-chip.is-active { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; }
.ui-chip.is-active:hover { background: var(--primary-hover); color: #fff; }
.ui-chip:disabled, .ui-chip.is-disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }
.ui-chip--success.is-active { background: var(--success, #057a55); border-color: var(--success, #057a55); }
.ui-chip--warning.is-active { background: var(--warning, #d97706); border-color: var(--warning, #d97706); }
.ui-chip--danger.is-active { background: var(--danger, #e02424); border-color: var(--danger, #e02424); }
.ui-chip--info.is-active { background: var(--info, #2563eb); border-color: var(--info, #2563eb); }
.ui-chip-x {
  display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px;
  margin-right: -4px; border: 0; background: transparent; border-radius: 50%;
  color: inherit; font-size: 13px; line-height: 1; cursor: pointer;
}
.ui-chip-x:hover { background: rgba(0, 0, 0, .12); }

/* ---- 五态（UI-P1-4）：错误/无权限态复用 .ui-empty 骨架，仅区分图标色与按钮排布 ---- */
.ui-state .ui-empty-footer { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ui-state-error .ui-empty-icon { color: var(--danger, #e02424); }
.ui-state-forbidden .ui-empty-icon { color: var(--gray-400); }
.ui-state-row .ui-empty { padding: 18px 0; }

/* ==========================================================================
   W8-2 / UI-P1-6 原子工具类层（全站唯一规范：语义色/字重/对齐/数字/间距/换行/状态条）
   只收敛“整串静态、语义无歧义”的内联样式；列宽 width、display:none 显隐、
   模板动态 ${} 值、精确坐标仍就近内联（属合理内联，不强制类化）。
   色值与历史内联逐字节一致，保证替换零色差。
   ========================================================================== */
/* 语义文字色（财务收入红/支出绿，与 --fin-income/--fin-expense 同值；灰=#6b7280=--gray-500） */
.u-text-income { color: #dc2626; }
.u-text-expense { color: #16a34a; }
.u-text-muted { color: #6b7280; }
.u-text-warning { color: #d97706; }
.u-text-warn-amber { color: #f59e0b; }
.u-text-info { color: #2563eb; }
.u-text-danger { color: #e02424; }
/* 金额强调：收入红 + 600 字重（对应旧 color:#dc2626;font-weight:600） */
.u-amt-income { color: #dc2626; font-weight: 600; }
/* 字重 */
.u-fw-500 { font-weight: 500; }
.u-fw-600 { font-weight: 600; }
.u-fw-700 { font-weight: 700; }
/* 文本对齐 + 财务数字等宽 Tabular */
.u-tal { text-align: left; }
.u-tac { text-align: center; }
.u-tar { text-align: right; }
.u-num { text-align: right; font-variant-numeric: tabular-nums; }
/* 不换行 */
.u-nowrap { white-space: nowrap; }
/* 高频字号两档 */
.u-fs-12 { font-size: 12px; }
.u-fs-13 { font-size: 13px; }
/* 高频间距档 */
.u-mt-4 { margin-top: 4px; }
.u-mt-8 { margin-top: 8px; }
.u-mt-12 { margin-top: 12px; }
.u-mt-16 { margin-top: 16px; }
.u-mb-8 { margin-bottom: 8px; }
.u-mb-12 { margin-bottom: 12px; }
.u-mb-16 { margin-bottom: 16px; }
/* 左侧状态色条（#f59e0b 为亮琥珀，区别于 --warning #d97706 深琥珀，均与旧内联同值） */
.u-bar-income { border-left: 4px solid #dc2626; }
.u-bar-expense { border-left: 4px solid #16a34a; }
.u-bar-warn { border-left: 4px solid #f59e0b; }
.u-bar-warning { border-left: 4px solid #d97706; }
.u-bar-info { border-left: 4px solid #2563eb; }

/* ===== UI-P1-3 全局命令面板（Ctrl+K），样式全部走设计令牌 ===== */
.cmdp-overlay {
  position: fixed; inset: 0; z-index: var(--z-command);
  background: rgba(15, 23, 42, 0.34);
  display: flex; justify-content: center; align-items: flex-start;
  padding: 12vh 16px 24px;
  animation: cmdp-fade var(--ui-dur-fast) var(--ui-ease);
}
@keyframes cmdp-fade { from { opacity: 0; } to { opacity: 1; } }
.cmdp {
  width: min(620px, 100%); background: #fff; border-radius: var(--ui-radius-lg);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22), 0 2px 8px rgba(15, 23, 42, 0.12);
  overflow: hidden; display: flex; flex-direction: column;
  animation: cmdp-pop var(--ui-dur) var(--ui-ease);
}
@keyframes cmdp-pop { from { transform: translateY(-8px); opacity: 0.6; } to { transform: translateY(0); opacity: 1; } }
.cmdp-search { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--gray-200); color: var(--gray-400); }
.cmdp-input { flex: 1; border: none; outline: none; background: transparent; font-size: 15px; color: var(--gray-900); height: 26px; }
.cmdp-input::placeholder { color: var(--gray-400); }
.cmdp-results { max-height: 52vh; overflow-y: auto; padding: 6px; overscroll-behavior: contain; }
.cmdp-group { padding: 8px 10px 4px; font-size: 11px; font-weight: 600; letter-spacing: 0.5px; color: var(--gray-500); }
.cmdp-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: var(--ui-radius-sm); cursor: default; font-size: 14px; color: var(--gray-700); }
.cmdp-item.active { background: var(--primary); color: #fff; }
.cmdp-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdp-item-right { font-size: 12px; color: var(--gray-400); flex-shrink: 0; max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdp-item.active .cmdp-item-right { color: rgba(255, 255, 255, 0.85); }
.cmdp-empty { padding: 28px 12px; text-align: center; color: var(--gray-400); font-size: 14px; }
.cmdp-footer { display: flex; align-items: center; gap: 16px; padding: 9px 16px; border-top: 1px solid var(--gray-200); font-size: 12px; color: var(--gray-500); }
.cmdp-footer span { display: inline-flex; align-items: center; gap: 4px; }
.cmdp-footer-hint { margin-left: auto; color: var(--gray-400); }
.cmdp kbd { display: inline-block; min-width: 18px; padding: 1px 5px; border: 1px solid var(--gray-300); border-bottom-width: 2px; border-radius: 4px; background: var(--gray-50); font-size: 11px; font-family: inherit; color: var(--gray-600); text-align: center; }

/* UI-P2-2 快捷键说明弹层（复用统一 modal，仅表格内部样式） */
.sk-wrap { max-height: 60vh; overflow-y: auto; }
.sk-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sk-table tr { border-bottom: 1px solid var(--gray-100); }
.sk-group-row td { padding: 10px 4px 4px; font-weight: 600; font-size: 12px; color: var(--primary); }
.sk-keys { width: 38%; padding: 7px 4px; white-space: nowrap; vertical-align: top; }
.sk-desc { padding: 7px 4px; color: var(--gray-700); line-height: 1.5; }
.sk-keys kbd { display: inline-block; min-width: 20px; padding: 1px 6px; border: 1px solid var(--gray-300); border-bottom-width: 2px; border-radius: 4px; background: var(--gray-50); font-size: 11px; font-family: inherit; color: var(--gray-700); text-align: center; }
.sk-plus { margin: 0 3px; color: var(--gray-400); }
.sk-foot { margin: 10px 4px 0; font-size: 12px; color: var(--gray-500); }

/* UI-P2-6 产品化更新日志弹层 */
.cl-wrap { max-height: 62vh; overflow-y: auto; padding-right: 4px; }
.cl-release { padding: 4px 0 14px; border-bottom: 1px solid var(--gray-100); }
.cl-release:last-child { border-bottom: none; }
.cl-rel-head { display: flex; align-items: baseline; gap: 10px; }
.cl-version { font-weight: 700; font-size: 14px; color: var(--gray-900); }
.cl-date { font-size: 12px; color: var(--gray-400); }
.cl-title { margin: 4px 0 8px; font-size: 13px; font-weight: 600; color: var(--primary); }
.cl-list { list-style: none; margin: 0; padding: 0; }
.cl-list li { display: flex; gap: 8px; align-items: flex-start; padding: 5px 0; font-size: 13px; line-height: 1.55; color: var(--gray-700); }
.cl-tag { flex: 0 0 auto; margin-top: 1px; padding: 0 7px; height: 19px; line-height: 19px; border-radius: 4px; font-size: 11px; color: #fff; }
.cl-tag-feature { background: var(--primary); }
.cl-tag-ux { background: var(--info); }
.cl-tag-security { background: var(--danger); }
.cl-tag-perf { background: var(--success); }
.cl-tag-doc, .cl-tag-opt { background: var(--gray-500); }
.cl-text { flex: 1 1 0; min-width: 0; word-break: break-word; overflow-wrap: anywhere; }
.cl-more { margin: 10px 0 0; font-size: 12px; color: var(--gray-500); }
.cl-empty { font-size: 13px; color: var(--gray-500); padding: 8px 0; }

/* UI-P2-4 新手 onboarding 任务清单 */
.onb-wrap { font-size: 13px; }
.onb-progress { height: 6px; border-radius: 3px; background: var(--gray-100); overflow: hidden; }
.onb-bar { height: 100%; background: var(--primary); transition: width .3s ease; }
.onb-pct { margin: 6px 0 2px; font-size: 12px; color: var(--gray-500); }
.onb-list { list-style: none; margin: 6px 0 0; padding: 0; }
.onb-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 6px; border-bottom: 1px solid var(--gray-100); }
.onb-item:last-child { border-bottom: none; }
.onb-check { position: relative; flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; cursor: pointer; }
.onb-check input { position: absolute; opacity: 0; width: 18px; height: 18px; margin: 0; cursor: pointer; }
.onb-box { display: block; width: 18px; height: 18px; border: 1.5px solid var(--gray-300); border-radius: 4px; background: #fff; transition: all .15s; }
.onb-check input:checked + .onb-box { background: var(--primary); border-color: var(--primary); }
.onb-check input:checked + .onb-box::after { content: ''; position: absolute; left: 6px; top: 2px; width: 4px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.onb-main { flex: 1; }
.onb-name { font-weight: 600; color: var(--gray-800); }
.onb-desc { margin-top: 2px; font-size: 12px; line-height: 1.5; color: var(--gray-500); }
.onb-item.is-done .onb-name { color: var(--gray-400); text-decoration: line-through; }
.onb-go { flex: 0 0 auto; align-self: center; padding: 3px 12px; font-size: 12px; color: var(--primary); background: var(--primary-light); border: none; border-radius: 4px; cursor: pointer; }
.onb-go:hover { background: var(--primary); color: #fff; }
.onb-tip { margin: 10px 0 0; font-size: 12px; color: var(--gray-400); }
@media (max-width: 899px) {
  .cmdp-overlay { padding: 8vh 12px 20px; }
  .cmdp-input { font-size: 16px; }
  .cmdp-results { max-height: 56vh; }
}

/* ===== UI-P1-5 页内“?”帮助（与命令面板同层级、同令牌） ===== */
.page-help-btn {
  flex-shrink: 0; align-self: center; margin-right: 10px;
  width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--gray-300);
  background: #fff; color: var(--gray-600); font-size: 14px; font-weight: 600; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  transition: background var(--ui-dur-fast) var(--ui-ease), color var(--ui-dur-fast) var(--ui-ease),
              border-color var(--ui-dur-fast) var(--ui-ease);
}
.page-help-btn:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
.ph-overlay {
  position: fixed; inset: 0; z-index: var(--z-command); background: rgba(15, 23, 42, 0.30);
  display: flex; justify-content: center; align-items: flex-start; padding: 14vh 16px 24px;
  animation: cmdp-fade var(--ui-dur-fast) var(--ui-ease);
}
.ph-card {
  width: min(560px, 100%); background: #fff; border-radius: var(--ui-radius-lg);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.20), 0 2px 8px rgba(15, 23, 42, 0.10);
  overflow: hidden; opacity: 0; transform: translateY(-8px);
  transition: opacity var(--ui-dur) var(--ui-ease), transform var(--ui-dur) var(--ui-ease);
}
.ph-card.ph-show { opacity: 1; transform: translateY(0); }
.ph-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--gray-200); }
.ph-title { display: flex; align-items: center; gap: 9px; font-size: 16px; font-weight: 600; color: var(--gray-900); }
.ph-q { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 14px; font-weight: 700; }
.ph-close { border: none; background: transparent; font-size: 22px; line-height: 1; color: var(--gray-400); cursor: pointer; width: 30px; height: 30px; border-radius: 6px; }
.ph-close:hover { background: var(--gray-100); color: var(--gray-700); }
.ph-body { padding: 14px 18px; max-height: 56vh; overflow-y: auto; }
.ph-about { margin: 0 0 10px; font-size: 14px; line-height: 1.7; color: var(--gray-700); }
.ph-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.ph-steps li { display: flex; gap: 9px; align-items: flex-start; font-size: 13.5px; line-height: 1.65; color: var(--gray-700); }
.ph-step-no { flex-shrink: 0; width: 19px; height: 19px; margin-top: 1px; border-radius: 50%; background: var(--light); color: var(--primary); font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.ph-foot { padding: 9px 18px; border-top: 1px solid var(--gray-200); font-size: 12px; color: var(--gray-400); }
@media (max-width: 899px) {
  .ph-overlay { padding: 9vh 12px 20px; }
  .ph-body { max-height: 60vh; }
}

/* ============================================================================
 * UI-P3-5 微交互（叠加层）：即时按压反馈、可点击元素反馈、Toast 动作按钮
 * 只增强反馈质感，不改变布局与业务；动效全部走令牌，并被 reduced-motion 统一降级
 * ========================================================================== */
/* 按钮按压：轻微下沉+变暗，给出“按到了”的确定感（禁用态不反馈） */
.btn:not(:disabled):not(.ui-btn-loading):active,
button:not(:disabled):not(.ui-btn-loading):active,
[role="button"]:not([aria-disabled="true"]):active {
    transform: translateY(1px) scale(.985);
    transition: transform var(--motion-fast) var(--ease-standard);
}
/* 可点击卡片/行：悬停轻微上浮 + 阴影加深，指针手型 */
.stat-card[role="button"], .dash-kpi[role="button"], .clickable-card {
    cursor: pointer;
    transition: transform var(--motion-base) var(--ease-standard),
                box-shadow var(--motion-base) var(--ease-standard);
}
.stat-card[role="button"]:hover, .dash-kpi[role="button"]:hover, .clickable-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--ui-shadow-md);
}
/* 列表行操作的淡入/淡出由 .row-leaving 控制（乐观隐藏时调用），避免生硬消失 */
.data-table tbody tr { transition: background var(--motion-fast) var(--ease-standard), opacity var(--motion-base) var(--ease-standard); }
.row-leaving { opacity: 0 !important; pointer-events: none; }
/* Toast 动作按钮（撤销/重试）：紧贴文案右侧，品牌描边小按钮 */
.ui-toast { flex-wrap: wrap; }
.ui-toast-action {
    flex: 0 0 auto; margin-left: auto; min-height: 26px; padding: 2px 12px;
    border: 1px solid currentColor; border-radius: var(--ui-radius-pill);
    background: transparent; color: inherit; font-size: 12.5px; font-weight: 600;
    cursor: pointer; transition: background var(--motion-fast) var(--ease-standard);
}
.ui-toast-action:hover { background: rgba(0, 0, 0, .06); }
.ui-toast-action:active { transform: scale(.96); }

/* ===== W11 AI 助手精修（17号工单 U1-U7） ===== */
/* U4: 顶栏图标按钮统一白色达AA对比 */
.assistant-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: var(--primary, #FF7C00); color: #fff;
}
.assistant-title { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; }
.assistant-logo-badge {
  width: 28px; height: 28px; background: rgba(255, 255, 255, 0.25);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: bold;
}
.assistant-header-actions { display: flex; align-items: center; gap: 4px; }
.assistant-icon-btn {
  width: 32px; height: 32px; padding: 0; border: none; border-radius: 50%;
  background: transparent; color: rgba(255, 255, 255, 0.95); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 0.15s ease;
}
.assistant-icon-btn:hover { background: rgba(255, 255, 255, 0.2); }
.assistant-icon-btn svg { width: 18px; height: 18px; }

/* U4: ⋯更多下拉菜单 */
.assistant-more-menu {
  position: fixed; z-index: 10001; background: #fff; border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15); padding: 6px 0; min-width: 140px;
}
.more-menu-item {
  display: block; width: 100%; padding: 8px 16px; border: none; background: none;
  text-align: left; font-size: 13px; cursor: pointer; color: #333;
}
.more-menu-item:hover { background: #f5f5f5; }

/* U1: 欢迎态大示例卡片：单列纵向等宽排列，三张卡片大小一致、文字不贴边不错落 */
.welcome-examples {
  display: grid; grid-template-columns: 1fr; gap: 10px;
  padding: 12px 4px 8px;
}
.welcome-example-card {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border: 1px solid #e5e7eb; border-radius: 10px; background: #f9fafb;
  cursor: pointer; text-align: left; transition: all 0.15s ease; width: 100%;
}
.welcome-example-card:hover {
  border-color: var(--primary, #FF7C00); background: #fff;
  box-shadow: 0 2px 8px rgba(255, 124, 0, 0.1);
}
.example-icon { font-size: 22px; flex-shrink: 0; line-height: 1; width: 24px; text-align: center; }
.example-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.example-title { font-weight: 600; font-size: 13px; color: #1f2937; }
.example-desc { font-size: 11.5px; color: #6b7280; }

/* U1: 对话态底部小胶囊快捷按钮 */
.assistant-footer {
  display: flex; gap: 8px; padding: 8px 12px; flex-wrap: wrap;
  border-top: 1px solid #f0f0f0; background: #fafafa;
}
.assistant-footer .quick-btn {
  border: 1px solid #e5e7eb; background: #fff; border-radius: 16px;
  padding: 4px 12px; font-size: 12px; color: #4b5563; cursor: pointer;
  transition: all 0.15s ease;
}
.assistant-footer .quick-btn:hover {
  border-color: var(--primary, #FF7C00); color: var(--primary, #FF7C00);
}

/* U2: 上传回形针内嵌输入框左侧 */
.assistant-input-area {
  display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px;
  border-top: 1px solid #f0f0f0; background: #fff;
  transition: background 0.15s ease;
}
/* U2：拖拽文件悬停高亮（dragover 加类 / dragleave、drop 移除） */
.assistant-input-area.drag-over {
  background: rgba(255, 124, 0, 0.08);
  box-shadow: inset 0 0 0 2px var(--primary, #FF7C00);
}
.assistant-upload-btn {
  width: 36px; height: 36px; padding: 0; border: none; background: transparent;
  border-radius: 8px; color: #9ca3af; cursor: pointer; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 0.15s ease;
}
.assistant-upload-btn:hover { color: var(--primary, #FF7C00); background: rgba(255, 124, 0, 0.08); }
.assistant-upload-btn svg { width: 18px; height: 18px; }

/* U3: 输入框 + 发送键正圆 */
.assistant-input-area textarea {
  flex: 1; min-height: 36px; max-height: 100px; padding: 8px 12px;
  border: 1px solid #e5e7eb; border-radius: 18px; font-size: 14px;
  resize: none; outline: none; line-height: 1.5;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
/* U6: focus描边减重 - 1.5px细边 */
.assistant-input-area textarea:focus {
  border-color: var(--primary, #FF7C00);
  box-shadow: 0 0 0 1.5px rgba(255, 124, 0, 0.15);
}
.send-btn {
  width: 36px; height: 36px; min-width: 36px; border: none; border-radius: 50%;
  background: var(--primary, #FF7C00); color: #fff; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 0.15s ease; margin-right: 4px;
}
.send-btn:disabled { opacity: 1; background: #e5e7eb; color: #9ca3af; cursor: not-allowed; box-shadow: none; transform: none; }
.send-btn:not(:disabled):hover { transform: scale(1.05); box-shadow: 0 2px 8px rgba(255, 124, 0, 0.3); }
.send-btn svg { width: 20px; height: 20px; flex: none; /* flex:none 防止作为 flex 子项被横向压扁（曾被压到 2.5px 看着像小点）；实心纸飞机 fill=currentColor 随按钮态变色，margin-left 做横向光学居中 */ }
.send-btn.loading { background: #6b7280; }

/* ============================================================================
 * 工作.docx⑤ 弹窗输入防跳动（全站统一，对所有 SModal/.modal 生效）
 * 根因：弹窗是可滚动容器，浏览器默认 overflow-anchor:auto 会在每次输入导致
 *       内容高度微变时自动调整滚动位置以“锚定”焦点，表现为每敲一项弹窗抖一下。
 * 处理：对遮罩/弹窗/弹窗体关闭滚动锚定；输入框预留 focus 滚动边距，避免贴边跳动。
 * 纯增量、零视觉改变，不影响既有居中与 max-height 滚动。
 * ========================================================================== */
.modal-overlay, .confirm-overlay, .ui-confirm-overlay { overflow-anchor: none; }
.modal, .modal-body, .modal-content { overflow-anchor: none; }
.modal-body input, .modal-body select, .modal-body textarea { scroll-margin-bottom: 56px; scroll-margin-top: 16px; }

/* ============================================================================
 * 工作.docx① 聚合模块页内分段页签（运维中心/记录中心等）：取代“几个裸按钮浮在最上面”
 * 专业 segmented control：浅灰胶囊槽 + 激活项白底主色字 + 轻投影，整组与内容左缘对齐。
 * ========================================================================== */
.sub-tabs {
  display: flex; align-items: center;
  padding: 12px 20px 0;
  background: var(--bg, #f6f7f9);
}
.sub-tabs-inner {
  display: inline-flex; align-items: center; gap: 2px;
  background: #eceef1; border: 1px solid #e3e6ea; border-radius: 10px;
  padding: 3px;
}
.sub-tabs-inner button {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  font-size: 13px; font-weight: 500; line-height: 1;
  color: #6b7280; padding: 8px 18px; border-radius: 8px;
  white-space: nowrap; transition: background var(--motion-fast, .14s) ease, color var(--motion-fast, .14s) ease, box-shadow var(--motion-fast, .14s) ease;
}
.sub-tabs-inner button:hover { color: #374151; background: rgba(255,255,255,.6); }
.sub-tabs-inner button.active {
  background: #fff; color: var(--primary, #FF7C00); font-weight: 600;
  box-shadow: 0 1px 3px rgba(17,24,39,.12);
}
@media (max-width: 768px) {
  .sub-tabs { padding: 10px 12px 0; overflow-x: auto; }
  .sub-tabs-inner button { padding: 7px 14px; }
}

/* ============================================================================
 * 工作.docx① 聚合中心（运维中心 / 记录中心）：唯一 SPageShell 外壳内的页内 Tab 条。
 * 子页以 embedded 模式只渲染内容，不再嵌套第二套 .layout/.main-content，
 * 从根上消除“顶部按钮错位 + 右侧多重滚动条”。
 * ========================================================================== */
.center-tabs { display: flex; align-items: center; margin: 2px 0 14px; }
.center-embedded {
  display: flex; flex-direction: column; gap: 14px;
  min-width: 0; max-width: 100%;
  height: auto !important; overflow: visible !important;
}
@media (max-width: 768px) {
  .center-tabs { margin: 0 0 10px; overflow-x: auto; }
}

/* ============================================================================
 * 单一滚动容器：Vue 标准外壳内只保留 .page-content 一条纵向滚动条，
 * 消除 .main-content(100vh,overflow-y:auto) 与 .page-content(overflow-x:hidden→y:auto)
 * 的嵌套双滚动条。仅作用于 SPageShell 根 .layout.vue-shell，旧 JS 页面布局不变。
 * ========================================================================== */
.layout.vue-shell { height: 100vh; overflow: hidden; }
.layout.vue-shell .main-content { height: 100vh; overflow: hidden; }
.layout.vue-shell .page-content {
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overflow-x: hidden;
  overscroll-behavior: contain;
}
.layout.vue-shell .center-embedded { overflow: visible !important; height: auto !important; }