:root {
  --brand: #1769e0;
  --brand-dark: #0c4db3;
  --brand-light: #eaf3ff;
  --nav: #10213d;
  --text: #17233c;
  --muted: #78859a;
  --line: #e7ecf3;
  --surface: #ffffff;
  --background: #f4f7fb;
  --success: #18a66a;
  --warning: #e69a22;
  --danger: #e34d59;
  --shadow: 0 8px 28px rgba(25, 55, 100, 0.07);
}

* { box-sizing: border-box; }
html, body, #app { height: 100%; margin: 0; }
body {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  color: var(--text);
  background: var(--background);
}
[v-cloak] { display: none; }
button, input, textarea, select { font-family: inherit; }
.muted { color: var(--muted); }
.eyebrow { margin: 0 0 12px; font-size: 12px; font-weight: 800; letter-spacing: 2px; color: #99bdf8; }
.eyebrow.blue { color: var(--brand); }

.login-page { min-height: 100%; display: grid; grid-template-columns: 1.08fr 0.92fr; background: white; }
.auth-loading-page { display: flex; align-items: center; justify-content: center; background: #f4f7fb; }
.auth-loading-card { display: flex; flex-direction: column; align-items: center; gap: 10px; color: #20324e; }
.auth-loading-card small { color: #8492a6; }
.login-brand {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 72px 11%;
  color: white;
  background:
    radial-gradient(circle at 85% 15%, rgba(74,149,255,.33), transparent 32%),
    radial-gradient(circle at 15% 85%, rgba(40,99,187,.32), transparent 30%),
    linear-gradient(145deg, #0b1e3d 0%, #102d5b 58%, #0b4a94 100%);
}
.login-brand::before, .login-brand::after {
  content: ""; position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%;
}
.login-brand::before { width: 520px; height: 520px; right: -260px; top: -160px; }
.login-brand::after { width: 380px; height: 380px; left: -190px; bottom: -160px; }
.company-logo-crop { overflow: hidden; background: white; }
.company-logo-crop img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 29%; }
.login-company-logo { position: relative; z-index: 1; width: 280px; height: 112px; margin-bottom: 40px; border: 1px solid rgba(255,255,255,.2); border-radius: 16px; box-shadow: 0 14px 32px rgba(0,16,54,.25); }
.mobile-company-logo { width: 138px; height: 48px; border: 1px solid #e1e8f1; border-radius: 10px; flex: 0 0 auto; }
.sidebar-company-logo { width: 48px; height: 34px; border-radius: 7px; box-shadow: 0 6px 15px rgba(0,0,0,.2); flex: 0 0 auto; }
.document-company-logo { width: 150px; height: 56px; border: 1px solid #e1e7ef; border-radius: 7px; flex: 0 0 auto; }
.document-brand { display: flex; align-items: center; gap: 11px; }
.login-brand h1 { position: relative; z-index: 1; max-width: 620px; margin: 0; font-size: clamp(38px, 4.2vw, 64px); line-height: 1.15; letter-spacing: -2px; }
.login-copy { position: relative; z-index: 1; max-width: 540px; margin: 28px 0 42px; font-size: 17px; line-height: 1.8; color: #c9d8ec; }
.login-points { position: relative; z-index: 1; display: flex; gap: 26px; flex-wrap: wrap; font-size: 13px; color: #dce8f8; }
.login-points span::before { content: "✓"; display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 8px; border-radius: 50%; color: #8dc0ff; background: rgba(255,255,255,.1); }
.login-panel { display: grid; place-items: center; padding: 48px; }
.login-card { width: min(420px, 100%); }
.login-card h2 { margin: 0 0 8px; font-size: 30px; }
.login-form { margin-top: 34px; }
.login-form .el-form-item { margin-bottom: 22px; }
.login-button { width: 100%; margin-top: 8px; }
.demo-tip { display: flex; justify-content: space-between; margin-top: 24px; padding: 14px 16px; border-radius: 10px; color: #46617f; background: #f1f6fc; font-size: 13px; }
.demo-tip span { font-family: Consolas, monospace; color: var(--brand); }
.local-note { margin-top: 20px; text-align: center; color: #98a3b3; font-size: 12px; }
.mobile-logo { display: none; align-items: center; gap: 12px; margin-bottom: 40px; font-weight: 800; }

.app-shell { height: 100%; }
.sidebar { position: relative; display: flex; flex-direction: column; overflow: hidden; color: white; background: var(--nav); transition: width .25s; }
.logo-wrap { height: 74px; display: flex; align-items: center; gap: 12px; padding: 0 19px; border-bottom: 1px solid rgba(255,255,255,.08); }
.logo-wrap strong { display: block; font-size: 18px; }
.logo-wrap small { display: block; margin-top: 2px; color: #8295b4; font-size: 11px; white-space: nowrap; }
.side-menu { flex: 1; padding: 16px 10px; border: none !important; background: transparent !important; }
.side-menu .el-menu-item { height: 48px; margin-bottom: 5px; border-radius: 9px; color: #9eb0ca; }
.side-menu .el-menu-item:hover { color: white; background: rgba(255,255,255,.07); }
.side-menu .el-menu-item.is-active { color: white; background: linear-gradient(90deg, #1c6de0, #2b7df0); box-shadow: 0 6px 16px rgba(0,79,204,.25); }
.side-menu.el-menu--collapse .el-menu-item { padding-left: 16px !important; }
.menu-icon { width: 26px; margin-right: 7px; font-size: 17px; text-align: center; filter: grayscale(.2); }
.sidebar-order-button { align-self: stretch; justify-content: flex-start; margin: 0 12px 2px; color: #91a6c5 !important; }
.sidebar-order-button:hover { color: white !important; background: rgba(255,255,255,.07) !important; }
.sidebar-bottom { display: flex; align-items: center; gap: 10px; margin: 12px; padding: 13px 12px; border-radius: 9px; background: rgba(255,255,255,.05); }
.sidebar-bottom strong, .sidebar-bottom small { display: block; white-space: nowrap; }
.sidebar-bottom strong { font-size: 12px; }
.sidebar-bottom small { margin-top: 3px; color: #7386a4; font-size: 10px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #31d392; box-shadow: 0 0 0 4px rgba(49,211,146,.12); }
.status-dot.pending { background: #e6a23c; box-shadow: 0 0 0 4px rgba(230,162,60,.14); }
.status-dot.error { background: #f56c6c; box-shadow: 0 0 0 4px rgba(245,108,108,.14); }

.topbar { height: 74px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; border-bottom: 1px solid var(--line); background: white; }
.topbar-left, .topbar-actions, .user-chip { display: flex; align-items: center; }
.topbar-left { gap: 14px; }
.collapse-btn { font-size: 22px; color: #66758d; }
.topbar h2 { margin: 0; font-size: 18px; }
.topbar p { margin: 4px 0 0; color: #93a0b2; font-size: 11px; }
.topbar-actions { gap: 18px; }
.reminder-bell-badge { display: inline-flex; }
.reminder-bell { width: 36px; height: 36px; color: #52657e; font-size: 17px; background: #f3f7fc !important; }
.reminder-bell:hover { color: var(--brand); background: var(--brand-light) !important; }
.menu-reminder-badge { display: inline-flex; margin-right: 12px; }
.menu-reminder-badge .menu-icon { margin-right: 0; }
.menu-reminder-badge .el-badge__content.is-fixed.is-dot { top: 1px; right: 2px; }
.credit-chip { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid #d9e7fa; border-radius: 9px; color: #6f7f96; background: #f4f8fe; font-size: 11px; }
.credit-chip strong { color: var(--brand); font-size: 14px; }
.user-chip { gap: 10px; cursor: pointer; }
.user-chip strong, .user-chip small { display: block; }
.user-chip strong { font-size: 13px; }
.user-chip small { margin-top: 2px; color: #98a3b4; font-size: 10px; }

.main-content { padding: 28px; overflow: auto; background: var(--background); }
.welcome-banner { display: flex; align-items: center; justify-content: space-between; padding: 25px 28px; border: 1px solid #dae8fb; border-radius: 14px; background: linear-gradient(100deg, #f0f6ff, #fbfdff 65%); }
.welcome-banner h3 { margin: 0 0 7px; font-size: 23px; }
.welcome-banner p:not(.eyebrow) { margin: 0; color: #718096; font-size: 13px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 20px 0; }
.stat-card { display: flex; align-items: center; gap: 16px; min-height: 116px; padding: 20px; border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: var(--shadow); }
.stat-icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 13px; font-size: 22px; background: var(--brand-light); }
.stat-icon.green { background: #e8f8f1; }.stat-icon.orange { background: #fff3e1; }.stat-icon.purple { background: #f1ecff; }
.stat-card span, .stat-card strong, .stat-card small { display: block; }
.stat-card span { color: #7f8b9c; font-size: 12px; }
.stat-card strong { margin: 4px 0 2px; font-size: 26px; }
.stat-card small { color: #9ca6b4; font-size: 10px; }
.dashboard-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 20px; margin-bottom: 20px; }
.panel, .table-card { border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: var(--shadow); }
.panel { padding: 22px; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 18px; }
.panel-head h3 { margin: 0; font-size: 15px; }
.panel-head p { margin: 5px 0 0; color: #98a3b3; font-size: 11px; }
.pipeline-list { display: grid; gap: 16px; }
.pipeline-label { display: flex; justify-content: space-between; margin-bottom: 7px; font-size: 12px; }
.activity-list { display: grid; gap: 3px; }
.activity-item { display: flex; gap: 13px; padding: 11px 0; border-bottom: 1px solid #f0f2f6; }
.activity-item:last-child { border-bottom: none; }
.activity-dot { display: grid; place-items: center; flex: 0 0 auto; width: 35px; height: 35px; border-radius: 50%; background: #eef5ff; }
.activity-item strong { font-size: 12px; }.activity-item p { max-width: 500px; margin: 4px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #66758a; font-size: 12px; }.activity-item small { color: #a0aaba; font-size: 10px; }
.order-panel { padding-bottom: 8px; }
.dashboard-reminder-panel { margin-bottom: 20px; }
.dashboard-reminder-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.dashboard-reminder-list button { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #e1e8f2; border-radius: 9px; color: inherit; background: #fafcff; text-align: left; cursor: pointer; }
.dashboard-reminder-list button:hover { border-color: #bcd5f6; background: #f3f8ff; }
.dashboard-reminder-list button div { min-width: 0; }
.dashboard-reminder-list strong, .dashboard-reminder-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-reminder-list strong { color: #2d3e58; font-size: 11px; }
.dashboard-reminder-list small, .dashboard-reminder-list button > span:last-child { margin-top: 4px; color: #8b98aa; font-size: 9px; }
.reminder-level-dot { width: 8px; height: 8px; border-radius: 50%; background: #e8a23a; }
.reminder-level-dot.danger { background: #e65b5b; box-shadow: 0 0 0 4px rgba(230,91,91,.1); }

.page-actions { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.page-action-buttons { display: flex; align-items: center; gap: 10px; }
.page-actions h3 { margin: 0; font-size: 22px; }
.page-actions p { margin: 7px 0 0; color: var(--muted); font-size: 12px; }
.info-strip { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; padding: 14px 17px; border: 1px solid #cfe2ff; border-radius: 10px; color: #315e94; background: #eef6ff; }
.info-strip.warning { border-color: #f0debd; color: #865d15; background: #fff8e9; }
.info-strip > span { font-size: 20px; }.info-strip strong { display: block; font-size: 12px; }.info-strip p { margin: 3px 0 0; font-size: 11px; opacity: .8; }
.purchase-filter-bar { display: grid; grid-template-columns: minmax(260px, 420px) 180px 1fr; align-items: center; gap: 12px; margin-bottom: 15px; }
.purchase-filter-bar > span { color: var(--muted); font-size: 11px; text-align: right; }
.product-library-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); align-items: start; gap: 16px; }
.product-category-panel { position: sticky; top: 16px; display: flex; min-height: calc(100vh - 190px); overflow: hidden; flex-direction: column; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: var(--shadow); }
.product-category-panel-head { padding: 16px 17px 13px; border-bottom: 1px solid var(--line); }
.product-category-panel-head strong, .product-category-panel-head small { display: block; }
.product-category-panel-head strong { color: #263750; font-size: 14px; }
.product-category-panel-head small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.product-category-tree { max-height: calc(100vh - 256px); overflow-y: auto; flex: 1; padding: 8px 0 12px; }
.product-category-tree button { width: 100%; border: 0; color: #3d4e68; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.product-category-all, .product-category-row { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 14px; border-left: 3px solid transparent !important; }
.product-category-all strong, .product-category-row strong { font-size: 12px; }
.product-category-all:hover, .product-category-row:hover, .product-subcategory-row:hover { background: #f3f7fd; }
.product-category-all.active, .product-category-row.active, .product-subcategory-row.active { color: var(--brand); background: var(--brand-light); }
.product-category-all.active, .product-category-row.active { border-left-color: var(--brand) !important; }
.product-category-toggle { display: inline-grid; place-items: center; flex: 0 0 auto; width: 16px; height: 16px; border: 1px solid #c5d0df; border-radius: 4px; color: #66768c; font-size: 12px; line-height: 1; }
.product-subcategory-list { padding-bottom: 3px; }
.product-subcategory-row { min-height: 36px; padding: 7px 14px 7px 45px; font-size: 11px; }
.product-subcategory-row.active { box-shadow: inset 3px 0 0 var(--brand); }
.product-library-main { min-width: 0; }
.product-filter-bar { display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 15px; }
.product-filter-bar > span { color: var(--muted); font-size: 11px; text-align: right; }
.table-card { overflow: hidden; }
.request-card { margin-top: 18px; }
.request-card-head { display: flex; align-items: flex-start; justify-content: space-between; padding: 20px 22px 13px; border-bottom: 1px solid var(--line); }
.request-card-head h3 { margin: 0; font-size: 15px; }
.request-card-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.table-card .el-table { --el-table-header-bg-color: #f8fafc; --el-table-row-hover-bg-color: #f6f9fe; }
.table-card .el-table th.el-table__cell { height: 48px; color: #65738a; font-size: 11px; font-weight: 700; }
.table-card .el-table td.el-table__cell { padding: 13px 0; }
.primary-cell { display: flex; align-items: center; gap: 11px; }
.primary-cell strong, .primary-cell small, .title-cell strong, .title-cell small { display: block; }
.primary-cell strong, .title-cell strong { color: #253249; font-size: 12px; }
.primary-cell small, .title-cell small { margin-top: 4px; color: #98a3b2; font-size: 10px; }
.company-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 10px; color: #1769e0; font-size: 11px; font-weight: 800; background: #eaf3ff; }
.muted-avatar { color: #75839a; background: #eef1f5; }
.level-badge { display: inline-grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; color: #8a5d08; font-weight: 800; background: #fff2cf; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
.form-grid .full-field { grid-column: 1 / -1; }
.record-form .el-select, .record-form .el-date-editor, .record-form .el-input-number, .accountDialog .el-select { width: 100%; }
.permission-box { margin-top: 8px; padding: 18px; border: 1px solid var(--line); border-radius: 11px; background: #fafbfd; }
.permission-title strong { font-size: 14px; }.permission-title p { margin: 4px 0 14px; color: var(--muted); font-size: 11px; }
.permission-table { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; }
.permission-row { display: grid; grid-template-columns: 1.7fr repeat(5, .65fr); align-items: center; min-height: 42px; padding: 0 14px; border-bottom: 1px solid var(--line); }
.permission-row:last-child { border-bottom: none; }
.permission-row > span:not(:first-child), .permission-row .el-checkbox { justify-self: center; }
.permission-head { color: #7d899b; font-size: 11px; background: #f2f5f9; }
.permission-row strong { font-size: 12px; }
.permission-empty { color: #b5bdc9; }
.el-descriptions__content { white-space: pre-line; }

.product-basic-grid .el-select, .product-basic-grid .el-input-number,
.supplier-grid .el-select, .supplier-grid .el-input-number,
.quote-head-grid .el-select, .quote-head-grid .el-date-editor,
.quote-line-grid .el-select, .quote-line-grid .el-input-number { width: 100%; }
.supply-section { margin: 4px 0 20px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: #fafcfe; }
.section-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.section-title strong { font-size: 14px; }
.section-title p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.supplier-card { margin-top: 13px; padding: 16px 17px 2px; border: 1px solid #dfe6ef; border-radius: 10px; background: white; }
.supplier-card-head, .quote-line-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.supplier-card-head strong, .quote-line-head strong { color: #40516b; font-size: 12px; }
.product-dialog .el-dialog__body { max-height: 76vh; overflow-y: auto; }
.product-detail-dialog-window { display: flex; max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); margin: 16px auto !important; overflow: hidden; flex-direction: column; }
.product-detail-dialog-window .el-dialog__header { flex: 0 0 auto; padding-right: 44px; }
.product-detail-dialog-window .el-dialog__body { min-height: 0; overflow-x: hidden; overflow-y: auto; flex: 1 1 auto; }
.product-detail-sections { display: grid; min-width: 0; gap: 20px; }
.product-detail-sections > section { min-width: 0; max-width: 100%; }
.product-detail-heading { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.product-detail-heading strong { color: #17233d; font-size: 15px; }
.product-detail-heading small { color: #8a96aa; }
.product-supplier-detail { min-width: 0; max-width: 100%; padding-top: 18px; border-top: 1px solid #e8edf5; }
.product-detail-heading-actions { align-items: center; justify-content: space-between; }
.product-detail-heading-actions > div { display: flex; align-items: baseline; gap: 10px; }
.supplier-table-scroll { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; }
.supplier-comparison-table { width: 100%; min-width: 0; max-width: 100%; }
.supplier-comparison-table .el-scrollbar__bar.is-horizontal { height: 9px; }
.supplier-comparison-table .el-table__cell { vertical-align: top; }
.supplier-comparison-table .cell { white-space: normal; word-break: break-word; }
.order-dialog-note { display: grid; gap: 5px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid #d8e5f4; border-radius: 9px; background: #f5f9fe; }
.order-dialog-note strong { color: #30435f; }
.order-dialog-note span { color: #75859b; font-size: 11px; }
.order-list { max-height: 56vh; overflow-y: auto; border: 1px solid #e1e7ef; border-radius: 9px; }
.order-list-item { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 48px; padding: 7px 10px; border-bottom: 1px solid #edf1f6; background: white; }
.order-list-item:last-child { border-bottom: none; }
.order-list-item strong { color: #42536d; font-size: 12px; }
.order-number { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; color: #52709a; background: #edf4fd; font-size: 11px; font-weight: 700; }
.template-field-note { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 12px 14px; border: 1px solid #d8e5f4; border-radius: 10px; color: #6b7a90; background: #f5f9fe; font-size: 11px; }
.template-field-note strong { flex: 0 0 auto; color: #30435f; font-size: 13px; }
.factory-image-upload { margin-top: 18px; padding-top: 18px; border-top: 1px dashed #d6e0ec; }
.system-fields-section { background: #f7f9fc; }
.supplier-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.category-dialog .el-dialog__body { max-height: 76vh; overflow-y: auto; }
.category-manager-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; padding: 13px 15px; border: 1px solid #d8e5f4; border-radius: 10px; background: #f5f9fe; }
.category-manager-head strong { color: #30435f; font-size: 14px; }
.category-manager-head p { margin: 5px 0 0; color: #7c8ba0; font-size: 11px; }
.category-group-card { margin-bottom: 14px; padding: 15px; border: 1px solid #dfe7f1; border-radius: 11px; background: #fbfcfe; }
.category-group-head { display: grid; grid-template-columns: 150px minmax(220px, 1fr) 130px 85px auto; align-items: end; gap: 12px; }
.category-group-head .el-form-item { margin-bottom: 10px; }
.category-usage { align-self: center; padding-bottom: 10px; text-align: center; }
.category-usage small, .category-usage strong { display: block; }
.category-usage small { color: #8a97a9; font-size: 9px; }
.category-usage strong { margin-top: 4px; color: var(--brand-dark); font-size: 17px; }
.subcategory-title { display: flex; align-items: center; justify-content: space-between; margin: 4px 0 10px; color: #53647d; font-size: 11px; font-weight: 700; }
.quote-dialog .el-dialog__body, .product-basic-grid + .supply-section { max-height: 78vh; }
.quote-dialog .el-dialog__body, .el-dialog:has(.product-basic-grid) .el-dialog__body { overflow-y: auto; }
.quote-lines-title { margin: 6px 0 12px; padding-top: 15px; border-top: 1px solid var(--line); }
.quote-line-card { margin-bottom: 16px; padding: 18px; border: 1px solid #dfe7f2; border-radius: 12px; background: #fbfcfe; }
.quote-line-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; }
.rate-control { display: flex; gap: 7px; width: 100%; }
.rate-control .el-input-number { flex: 1; min-width: 0; }
.field-tip { display: block; width: 100%; margin-top: 5px; color: #8d99a9; font-size: 10px; line-height: 1.4; }
.success-text { color: var(--success); }
.quote-calculation { overflow: hidden; border: 1px solid #d8e6f9; border-radius: 10px; background: white; }
.cost-breakdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 12px 15px; border-bottom: 1px solid #e9eef5; color: #7e8a9d; font-size: 10px; background: #f5f9ff; }
.cost-breakdown strong { display: block; margin-top: 3px; color: #425169; font-size: 12px; }
.cost-hidden-note { padding: 11px 15px; border-bottom: 1px solid #e9eef5; color: #718097; font-size: 11px; background: #f7f9fc; }
.suggested-price { display: grid; grid-template-columns: .9fr .9fr 1.15fr .9fr; gap: 18px; align-items: center; padding: 14px 16px; }
.suggested-price small, .final-total small { display: block; margin-bottom: 4px; color: #8a96a8; font-size: 10px; }
.suggested-price strong { color: #32435d; font-size: 16px; }
.suggested-price .el-form-item { margin-bottom: 0; }
.final-total { padding-left: 16px; border-left: 1px solid var(--line); }
.final-total strong { color: var(--brand); font-size: 19px; }
.quote-total-bar { display: flex; align-items: center; justify-content: flex-end; gap: 22px; margin: 8px 0 20px; padding: 17px 20px; border-radius: 10px; color: #53647d; background: #edf5ff; }
.quote-total-bar strong { color: var(--brand); font-size: 24px; }
.quote-bulk-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 2px 0 12px; padding: 12px 14px; border: 1px solid #dce7f5; border-radius: 10px; background: #f7faff; }
.quote-bulk-toolbar > div { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.selection-note { margin-right: 5px; color: #77869b; font-size: 11px; }
.quote-compact-table { --el-table-header-bg-color: #f1f6fd; }
.quote-compact-table th.el-table__cell { height: 42px; color: #5c6e88; font-size: 11px; }
.quote-compact-table td.el-table__cell { padding: 7px 0; }
.quote-compact-table .el-input-number { width: 100%; }
.quote-product-cell strong, .quote-product-cell span, .quote-product-cell small { display: block; }
.quote-product-cell > div { display: flex; align-items: center; gap: 6px; }
.quote-product-cell span { margin-top: 2px; color: #53627a; font-size: 11px; }
.quote-product-cell small { margin-top: 2px; color: #98a3b3; font-size: 9px; }
.quote-total-rich { justify-content: space-between; margin-bottom: 12px; }
.quote-total-rich > span { font-size: 11px; }
.quote-total-rich > div { display: flex; align-items: center; gap: 14px; }
.quote-total-rich small { color: #6d7c91; }
.quote-sum-items > span { display: flex; align-items: center; gap: 7px; padding-left: 14px; border-left: 1px solid #cfdef1; }
.quote-sum-items b { color: #435675; font-size: 13px; }
.quote-notes { margin-bottom: 0; }
.dialog-hint { margin: -2px 0 14px; padding: 10px 12px; border-radius: 8px; color: #64758d; background: #f3f7fc; font-size: 11px; line-height: 1.6; }
.oem-picker-dialog { max-width: calc(100vw - 32px); }
.oem-picker-dialog .el-dialog__body { max-height: 78vh; overflow-y: auto; }
.oem-picker-panel { margin: -2px 0 14px; padding: 14px; border: 1px solid #d8e6f7; border-radius: 10px; background: #f7faff; }
.oem-picker-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 10px; }
.oem-picker-heading strong, .oem-picker-heading small { display: block; }
.oem-picker-heading strong { color: #304563; font-size: 13px; }
.oem-picker-heading small { margin-top: 4px; color: #7d8ca1; font-size: 10px; }
.oem-picker-heading > span { flex: none; padding-top: 2px; color: #66768d; font-size: 11px; }
.oem-picker-heading b { color: var(--brand); font-size: 14px; }
.oem-match-result { margin-top: 10px; padding: 9px 10px; border-radius: 7px; font-size: 10px; }
.oem-match-result > strong { display: block; margin-bottom: 7px; }
.oem-match-result .el-tag { margin: 0 6px 6px 0; }
.oem-match-unmatched { color: #93641b; background: #fff8e8; }
.oem-match-ambiguous { color: #81591b; background: #fff5df; }
.oem-match-ambiguous > div { display: grid; grid-template-columns: minmax(110px, auto) 1fr; gap: 10px; margin-top: 5px; }
.oem-match-ambiguous span { font-weight: 700; }
.oem-match-ambiguous small { color: #7c6a4d; line-height: 1.5; }
.paste-actions { display: flex; align-items: center; gap: 14px; margin: 12px 0; color: #8490a2; font-size: 11px; }
.line-editor-form .el-select, .line-editor-form .el-input-number { width: 100%; }
.temporary-alert { margin-bottom: 16px; padding: 11px 13px; border: 1px solid #f3ddb2; border-radius: 8px; color: #8b621b; background: #fff8e9; font-size: 11px; line-height: 1.6; }
.drawer-calculation { display: grid; gap: 9px; margin-top: 8px; padding: 14px; border-radius: 9px; color: #718097; background: #f3f7fc; font-size: 11px; }
.drawer-calculation span { display: flex; justify-content: space-between; }
.drawer-calculation strong { color: #33445f; }
.table-product-thumb, .quote-line-thumb { width: 46px; height: 46px; border: 1px solid #dce5f1; border-radius: 7px; object-fit: cover; background: white; }
.image-placeholder { display: inline-grid; place-items: center; width: 46px; height: 46px; border: 1px dashed #ccd7e5; border-radius: 7px; color: #98a5b5; background: #f7f9fc; font-size: 9px; }
.product-media-section { margin: 14px 0 18px; padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fafcfe; }
.product-image-upload .section-title { margin-bottom: 12px; }
.native-upload-button { display: inline-flex; align-items: center; justify-content: center; height: 32px; padding: 0 14px; border: 1px solid var(--brand); border-radius: 6px; color: var(--brand); background: white; font-size: 12px; cursor: pointer; }
.native-upload-button:hover { color: white; background: var(--brand); }
.native-upload-button.disabled { border-color: #d7dce4; color: #a8afb9; background: #f5f6f8; cursor: not-allowed; }
.native-upload-button input { display: none; }
.product-image-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.product-image-grid figure { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dbe4ef; border-radius: 9px; background: white; }
.product-image-grid figure > img { display: block; width: 100%; height: 145px; object-fit: contain; background: #f4f6f9; }
.product-image-grid figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; }
.product-image-grid figcaption span { overflow: hidden; color: #67768a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.customer-photo-upload { margin-top: 16px; padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fafcfe; }
.customer-photo-upload .section-title { margin-bottom: 12px; }
.customer-photo-grid, .customer-detail-photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.customer-photo-grid figure, .customer-detail-photo-grid figure { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dbe4ef; border-radius: 9px; background: white; }
.customer-photo-grid figure > img, .customer-detail-photo-grid figure > img { display: block; width: 100%; height: 150px; object-fit: cover; background: #f4f6f9; }
.customer-photo-grid figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; }
.customer-photo-grid figcaption > div { min-width: 0; }
.customer-photo-grid figcaption span, .customer-photo-grid figcaption small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-photo-grid figcaption span { color: #52637a; font-size: 10px; }
.customer-photo-grid figcaption small { margin-top: 2px; color: #9aa5b4; font-size: 9px; }
.customer-detail-sections { display: grid; gap: 18px; }
.customer-detail-photos { padding: 15px; border: 1px solid var(--line); border-radius: 10px; background: #fafcfe; }
.customer-detail-photo-grid figure > img { height: 180px; }
.customer-detail-photo-grid figcaption { overflow: hidden; padding: 7px 9px; color: #718096; font-size: 10px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.quote-product-with-image { display: flex; flex-direction: row; align-items: flex-start; gap: 8px; }
.quote-product-with-image > div { display: flex; min-width: 0; flex-direction: column; }

.purchase-dialog .el-dialog__body { max-height: 78vh; overflow-y: auto; }
.purchase-head-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.purchase-head-grid .el-select, .purchase-head-grid .el-date-editor { width: 100%; }
.purchase-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 2px 0 12px; padding: 12px 14px; border: 1px solid #dce7f5; border-radius: 10px; background: #f7faff; }
.purchase-toolbar span { color: #7b899c; font-size: 11px; }
.purchase-line-table .el-input-number { width: 100%; }
.purchase-progress-cell { display: grid; grid-template-columns: minmax(70px, 1fr) auto; align-items: center; gap: 8px; }
.purchase-progress-cell small { color: #8592a4; font-size: 9px; white-space: nowrap; }
.purchase-payment-section { margin: 16px 0; padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fafcfe; }
.purchase-payment-section .el-input-number, .purchase-payment-section .el-select, .purchase-payment-section .el-date-editor { width: 100%; }
.purchase-notes { margin-bottom: 0; }
.purchase-preview-switch { display: grid; grid-template-columns: auto 260px 1fr; align-items: center; gap: 12px; margin: -4px 0 14px; padding: 10px 12px; border: 1px solid #dbe6f4; border-radius: 9px; background: #f6f9fd; }
.purchase-preview-switch > span { color: #53647d; font-size: 11px; font-weight: 700; }
.purchase-preview-switch > small { color: #929eaf; font-size: 10px; }
.purchase-print-card { padding: 10px 14px 24px; color: #23324a; background: white; }
.purchase-print-card > header { display: flex; align-items: center; justify-content: space-between; padding: 8px 0 22px; border-bottom: 3px solid var(--nav); }
.purchase-print-card > header > div { display: flex; align-items: center; gap: 11px; }
.purchase-print-card > header strong, .purchase-print-card > header small { display: block; }
.purchase-print-card > header strong { font-size: 14px; letter-spacing: .7px; }
.purchase-print-card > header small { margin-top: 4px; color: #8390a2; font-size: 9px; }
.purchase-print-card > header h2 { margin: 0; color: var(--nav); font-size: 27px; letter-spacing: 5px; }
.purchase-print-meta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; padding: 18px 0; }
.purchase-print-meta small, .purchase-print-meta strong, .purchase-supplier-block small, .purchase-supplier-block strong { display: block; }
.purchase-print-meta small, .purchase-supplier-block small { margin-bottom: 5px; color: #8c97a7; font-size: 9px; }
.purchase-print-meta strong, .purchase-supplier-block strong { font-size: 11px; }
.purchase-supplier-block { display: grid; grid-template-columns: 1.4fr 1fr .6fr; gap: 18px; margin-bottom: 16px; padding: 13px 15px; border-radius: 8px; background: #f4f7fb; }
.purchase-print-summary { display: grid; justify-content: end; gap: 7px; padding: 18px 10px; }
.purchase-print-summary > div { display: grid; grid-template-columns: 140px 150px; align-items: center; text-align: right; }
.purchase-print-summary span { color: #7b8799; font-size: 10px; }
.purchase-print-summary strong { color: #334761; font-size: 13px; }
.purchase-print-summary > div:first-child strong { color: var(--brand-dark); font-size: 20px; }
.purchase-print-notes { padding: 13px 15px; border-radius: 8px; background: #f4f7fb; }
.purchase-print-notes strong { font-size: 10px; }
.purchase-print-notes p { margin: 5px 0 0; color: #68778d; font-size: 10px; }
.purchase-print-card footer { display: flex; justify-content: space-between; margin-top: 24px; padding-top: 13px; border-top: 1px solid var(--line); color: #7f8c9f; font-size: 10px; }

.quote-preview-card { padding: 10px 14px 24px; color: #23324a; background: white; }
.preview-language-bar { display: flex; align-items: center; gap: 12px; margin: -4px 0 14px; padding: 10px 12px; border: 1px solid #dbe6f4; border-radius: 9px; background: #f6f9fd; }
.preview-language-bar > span { color: #53647d; font-size: 11px; font-weight: 700; }
.preview-language-bar > small { margin-left: auto; color: #929eaf; font-size: 10px; }
.preview-header { display: flex; align-items: center; justify-content: space-between; padding: 8px 0 22px; border-bottom: 3px solid var(--nav); }
.preview-header > div { display: flex; align-items: center; gap: 11px; }
.preview-header strong, .preview-header small { display: block; }
.preview-header strong { font-size: 14px; letter-spacing: .7px; }
.preview-header small { margin-top: 4px; color: #8390a2; font-size: 9px; }
.preview-header h2 { margin: 0; color: var(--nav); font-size: 27px; letter-spacing: 2px; }
.chinese-quote .preview-header h2 { letter-spacing: 5px; }
.preview-meta { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 14px; padding: 20px 0; }
.preview-meta small, .preview-meta strong { display: block; }
.preview-meta small { margin-bottom: 5px; color: #8c97a7; font-size: 9px; }
.preview-meta strong { font-size: 11px; }
.preview-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.preview-table th { padding: 10px; color: white; text-align: left; background: var(--nav); }
.preview-table td { padding: 11px 10px; border-bottom: 1px solid #e4e9f0; }
.preview-table td small { display: block; margin-top: 3px; color: #929dad; font-size: 9px; }
.preview-product-cell { min-width: 190px; }
.preview-product-images { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 7px; }
.preview-product-images img { width: 54px; height: 54px; border: 1px solid #e0e6ee; border-radius: 5px; object-fit: contain; background: white; }
.preview-table th:nth-last-child(-n+2), .preview-table td:nth-last-child(-n+2) { text-align: right; }
.preview-summary { display: grid; gap: 8px; justify-content: end; padding: 18px 10px; }
.preview-summary > div { display: grid; grid-template-columns: 150px 150px; align-items: center; text-align: right; }
.preview-summary > div:not(.preview-total) span { color: #7b8799; font-size: 10px; text-transform: uppercase; }
.preview-summary > div:not(.preview-total) strong { color: #43536c; font-size: 12px; }
.preview-total { display: grid; grid-template-columns: 150px 150px; align-items: center; gap: 0; padding-top: 9px; border-top: 1px solid var(--line); }
.preview-total span { color: #7b8799; font-size: 12px; text-transform: uppercase; }
.preview-total strong { color: var(--brand-dark); font-size: 23px; }
.preview-notes { padding: 13px 15px; border-radius: 8px; background: #f4f7fb; }
.preview-notes strong { font-size: 10px; }.preview-notes p { margin: 5px 0 0; color: #68778d; font-size: 10px; }
.quote-preview-card footer { margin-top: 24px; padding-top: 13px; border-top: 1px solid var(--line); color: #8c97a7; font-size: 9px; text-align: center; }
.tracking-filter-bar { grid-template-columns: minmax(280px, 520px) 1fr; }
.reminder-drawer .el-drawer__body { padding-top: 8px; background: #f7f9fc; }
.reminder-drawer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; padding: 13px 14px; border: 1px solid #dae5f3; border-radius: 10px; background: white; }
.reminder-drawer-toolbar strong, .reminder-drawer-toolbar small { display: block; }
.reminder-drawer-toolbar strong { color: #2f415d; font-size: 13px; }
.reminder-drawer-toolbar small { margin-top: 4px; color: #8996a8; font-size: 9px; }
.reminder-card-list { display: grid; gap: 10px; margin-top: 13px; }
.reminder-card { padding: 14px; border: 1px solid #e1e7f0; border-left: 4px solid #e6a23c; border-radius: 10px; background: white; box-shadow: 0 5px 16px rgba(26,44,74,.04); }
.reminder-card.danger { border-left-color: #e85d5d; }
.reminder-card header, .reminder-card header > div, .reminder-card footer { display: flex; align-items: center; }
.reminder-card header { justify-content: space-between; gap: 12px; }
.reminder-card header > div { min-width: 0; gap: 8px; }
.reminder-card header strong { overflow: hidden; color: #2c3c56; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.reminder-card header > small { color: #8794a7; font-size: 9px; white-space: nowrap; }
.reminder-card p { margin: 10px 0 12px; color: #65748a; font-size: 11px; }
.reminder-card footer { gap: 8px; padding-top: 10px; border-top: 1px solid #eff2f6; }
.reminder-card footer > span { flex: 1; }
.reminder-setting-note { margin: -4px 0 14px; color: #7d899a; font-size: 11px; }
.reminder-setting-list { display: grid; gap: 9px; }
.reminder-setting-list > div { display: grid; grid-template-columns: minmax(0, 1fr) 140px 36px; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid #e3e9f1; border-radius: 8px; background: #fafcfe; }
.reminder-setting-list label { color: #43536b; font-size: 11px; font-weight: 700; }
.reminder-setting-list > div > span { color: #8491a3; font-size: 10px; }
.reminder-setting-list .el-input-number { width: 100%; }
.tracking-customer-head { display: flex; align-items: center; gap: 13px; padding: 4px 0 18px; border-bottom: 1px solid var(--line); }
.tracking-customer-head > div { min-width: 0; flex: 1; }
.tracking-customer-head h3 { margin: 0; color: #253653; font-size: 18px; }
.tracking-customer-head p { margin: 5px 0 0; color: #8190a4; font-size: 11px; }
.tracking-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 16px 0; }
.tracking-stat-grid > div { padding: 13px; border: 1px solid #e0e8f2; border-radius: 9px; background: #f8fafd; }
.tracking-stat-grid small, .tracking-stat-grid strong { display: block; }
.tracking-stat-grid small { color: #8290a3; font-size: 10px; }
.tracking-stat-grid strong { margin-top: 5px; color: var(--brand-dark); font-size: 20px; }
.tracking-transactions, .tracking-timeline { margin-top: 18px; }
.tracking-transactions > article { display: grid; grid-template-columns: 1.5fr 1fr auto; align-items: center; gap: 12px; margin-top: 8px; padding: 12px 14px; border: 1px solid #dce7f3; border-radius: 9px; background: #f9fbfe; }
.tracking-transactions article strong, .tracking-transactions article small, .tracking-transactions article b { display: block; }
.tracking-transactions article small { margin-top: 4px; color: #8794a6; font-size: 9px; }
.tracking-transactions article b { color: var(--brand-dark); }
.timeline-card { padding: 11px 13px; border: 1px solid #e1e8f1; border-radius: 9px; background: white; }
.timeline-card > div { display: flex; align-items: center; gap: 8px; }
.timeline-card > div strong { flex: 1; color: #30415c; }
.timeline-card p { margin: 7px 0 0; color: #6f7e92; font-size: 11px; line-height: 1.6; }
.el-button--primary { --el-button-bg-color: var(--brand); --el-button-border-color: var(--brand); --el-button-hover-bg-color: #2879e9; --el-button-hover-border-color: #2879e9; }

@media (max-width: 1100px) {
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .quote-line-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote-bulk-toolbar { align-items: flex-start; flex-direction: column; }
  .purchase-head-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-library-layout { grid-template-columns: 210px minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .login-page { grid-template-columns: 1fr; }
  .login-brand { display: none; }
  .login-panel { padding: 28px; }
  .mobile-logo { display: flex; }
  .mobile-logo strong { color: #20324e; white-space: nowrap; }
  .sidebar { display: none; }
  .main-content { padding: 16px; }
  .topbar { padding: 0 15px; }
  .topbar-actions .el-tag, .user-chip div { display: none; }
  .credit-chip span, .credit-chip .el-button { display: none; }
  .stat-grid { grid-template-columns: 1fr; }
  .dashboard-reminder-list { grid-template-columns: 1fr; }
  .reminder-drawer { width: 100% !important; max-width: 100vw; }
  .reminder-settings-dialog, .reminder-snooze-dialog { width: calc(100vw - 24px) !important; }
  .reminder-setting-list > div { grid-template-columns: minmax(0, 1fr) 120px 30px; }
  .welcome-banner { align-items: flex-start; gap: 20px; flex-direction: column; }
  .form-grid { grid-template-columns: 1fr; }
  .purchase-filter-bar { grid-template-columns: 1fr; }
  .purchase-filter-bar > span { text-align: left; }
  .product-filter-bar { grid-template-columns: 1fr; }
  .product-filter-bar > span { text-align: left; }
  .product-library-layout { grid-template-columns: 1fr; }
  .product-category-panel { position: static; min-height: 0; }
  .product-category-tree { max-height: 320px; }
  .category-group-head { grid-template-columns: 1fr; }
  .purchase-toolbar { align-items: flex-start; flex-direction: column; }
  .product-detail-dialog-window { max-width: calc(100vw - 16px); }
  .product-detail-dialog-window .el-dialog__body { padding-right: 12px; padding-left: 12px; }
  .product-detail-heading-actions { align-items: flex-start; flex-direction: column; }
  .customer-photo-grid, .customer-detail-photo-grid { grid-template-columns: 1fr; }
  .oem-picker-dialog { width: calc(100vw - 16px) !important; }
  .oem-picker-dialog .el-dialog__body { padding-right: 12px; padding-left: 12px; }
  .oem-picker-heading { flex-direction: column; gap: 8px; }
  .oem-picker-heading > span { padding-top: 0; }
  .oem-match-ambiguous > div { grid-template-columns: 1fr; gap: 3px; }
}

.conflict-dialog-hint { margin-bottom: 16px; padding: 12px 14px; border: 1px solid #ffe0a3; border-radius: 8px; color: #7a4b00; background: #fff7e6; }

.research-center { display: grid; gap: 14px; min-width: 0; }
.research-stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.research-stat-grid article { padding: 16px 18px; border: 1px solid var(--line); border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.research-stat-grid small, .research-stat-grid strong, .research-stat-grid span { display: block; }
.research-stat-grid small { color: #748299; }
.research-stat-grid strong { margin: 7px 0 4px; color: #193355; font-size: 25px; }
.research-stat-grid span { color: #9aa5b5; font-size: 10px; }
.research-filter-bar { display: grid; grid-template-columns: minmax(280px,1fr) 150px 150px auto auto; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.research-form { margin-top: 16px; }
.research-form-top { padding-bottom: 6px; }
.research-clue-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 4px 0 15px; padding-top: 16px; border-top: 1px solid var(--line); }
.research-clue-head span { color: var(--muted); font-size: 11px; }
.research-report-dialog .el-dialog__body { max-height: 84vh; overflow-y: auto; padding-top: 10px; }
.research-report-print { color: #263852; }
.research-report-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; padding: 10px 2px 18px; border-bottom: 3px solid #17365f; }
.research-report-head > div:first-child span { color: #2f75c7; font-size: 10px; font-weight: 800; letter-spacing: 1.5px; }
.research-report-head h2 { margin: 6px 0 4px; color: #142943; font-size: 25px; }
.research-report-head p { margin: 0; color: #718096; font-size: 11px; }
.research-report-actions { display: flex; align-items: center; gap: 8px; }
.research-report-actions .el-select { width: 190px; }
.research-task-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 14px 0; }
.research-task-meta > span { display: grid; gap: 5px; padding: 10px 12px; border: 1px solid #e4eaf2; border-radius: 8px; background: #f8fafd; }
.research-task-meta small { color: #8694a8; font-size: 9px; }
.research-task-meta strong { overflow-wrap: anywhere; font-size: 11px; }
.research-summary-card { margin: 15px 0; padding: 18px 20px; border-left: 4px solid #1769e0; border-radius: 4px 10px 10px 4px; background: #edf5ff; }
.research-summary-card small { color: #3373bc; font-weight: 700; }
.research-summary-card p { margin: 9px 0 0; font-size: 14px; line-height: 1.8; }
.research-report-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.research-report-section { min-width: 0; padding: 17px 18px; border: 1px solid #dfe6ef; border-radius: 10px; background: #fff; }
.research-report-section.full { grid-column: 1 / -1; }
.research-report-section h3, .research-source-section h3 { margin: 0 0 12px; color: #17365f; font-size: 14px; }
.research-report-section p { color: #5c6e84; line-height: 1.65; }
.research-report-section dl { display: grid; grid-template-columns: 90px minmax(0,1fr); margin: 0; font-size: 11px; }
.research-report-section dt, .research-report-section dd { margin: 0; padding: 6px 0; border-bottom: 1px solid #edf0f4; }
.research-report-section dt { color: #8591a2; }
.research-report-section ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.research-report-section li { display: flex; align-items: flex-start; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid #edf0f4; }
.research-report-section li:last-child { border-bottom: 0; }
.research-report-section li strong, .research-report-section li span { display: block; }
.research-report-section li span { margin-top: 3px; color: #718096; font-size: 11px; line-height: 1.55; }
.research-report-section a, .research-source-section a { color: var(--brand); overflow-wrap: anywhere; }
.research-identity-section { background: #fbfdff; }
.research-identity-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.research-identity-head h3 { margin-bottom: 0; }
.research-identity-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 13px; }
.research-identity-grid > section { min-width: 0; padding: 13px 14px; border: 1px solid #dce7f5; border-radius: 9px; background: #f5f9ff; }
.research-identity-grid header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.research-identity-grid p { margin: 8px 0 3px; }
.research-identity-grid small, .research-identity-grid span, .research-identity-grid em { display: block; margin-top: 4px; color: #6f8097; font-size: 10px; overflow-wrap: anywhere; }
.research-identity-grid ul { margin-top: 10px; padding: 9px 10px 9px 25px; border-radius: 7px; background: #fff; list-style: disc; }
.research-identity-grid li { display: list-item; padding: 2px 0; border: 0; color: #4f627b; font-size: 11px; }
.research-identity-grid em { color: #2d6db6; font-style: normal; }
.research-contact-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.research-contact-grid section { padding: 11px; border-radius: 8px; background: #f6f9fd; }
.research-contact-grid strong, .research-contact-grid span { display: block; }
.research-contact-grid span { margin-top: 3px; color: #74849a; font-size: 10px; }
.research-contact-grid p { margin: 8px 0 0; font-size: 11px; overflow-wrap: anywhere; }
.research-company-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.research-company-grid > section { min-width: 0; padding: 14px; border: 1px solid #dce7f5; border-radius: 9px; background: #f8fbff; }
.research-company-grid header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.research-company-grid header strong,.research-company-grid header small { display: block; }
.research-company-grid header small { margin-top: 4px; color: #74849a; }
.research-company-grid > section > p { margin: 9px 0; }
.research-company-grid dl { grid-template-columns: 82px minmax(0,1fr); }
.research-match-chain { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.research-match-chain li { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; padding: 10px 0; }
.research-match-chain li > span { display: grid; place-items: center; width: 25px; height: 25px; margin: 0; border-radius: 50%; color: #fff; font-weight: 700; background: #2f75c7; }
.research-match-chain li p { margin: 4px 0; }
.research-match-chain li small { color: #7b8ba0; }
.research-conflict-section { border-color: #f0d49b; background: #fffdf8; }
.research-advice { background: #fbfcff; }
.research-advice-grid { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 10px; }
.research-advice-grid section { padding: 10px; border-radius: 7px; background: #eef5ff; }
.research-advice-grid small, .research-advice-grid strong { display: block; }
.research-advice-grid small { margin-bottom: 4px; color: #7587a0; }
.research-advice blockquote, .research-source-section blockquote { margin: 10px 0; padding: 9px 12px; border-left: 3px solid #9cbde7; color: #4f6580; background: #f5f8fc; }
.research-source-section { margin-top: 12px; padding: 18px; border: 1px solid #dfe6ef; border-radius: 10px; }
.research-source-section > p { color: #7b889a; font-size: 10px; }
.research-source-section ol { display: grid; gap: 12px; padding-left: 22px; }
.research-source-section li > span { display: block; margin-top: 3px; color: #7e8b9d; font-size: 10px; }
.research-audit-section,.research-attempt-card { margin-top: 12px; padding: 18px; border: 1px solid #dfe6ef; border-radius: 10px; background: #fff; }
.research-derived-clues { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin: 8px 0 14px; }
.research-derived-clues section { min-width: 0; padding: 11px 12px; border-radius: 8px; background: #f5f8fc; }
.research-derived-clues strong,.research-derived-clues span,.research-derived-clues small { display: block; overflow-wrap: anywhere; }
.research-derived-clues span { margin-top: 5px; color: #61748d; line-height: 1.5; }
.research-derived-clues small { margin-top: 5px; color: #8795a8; }
.research-query-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.research-query-chips span { max-width: 100%; padding: 6px 9px; border: 1px solid #d8e4f2; border-radius: 6px; color: #47617e; background: #f7faff; overflow-wrap: anywhere; }
.research-query-chips em { color: #8a96a6; font-style: normal; }
.research-audit-table { margin-top: 8px; }
.research-disclaimer { margin: 14px 0 0; padding: 11px 13px; color: #7e6a42; font-size: 10px; background: #fff9eb; }
.research-compare-panel { margin: 14px 0; padding: 16px; border: 1px solid #bfd7f5; border-radius: 10px; background: #f5f9ff; }
.research-section-title { display: flex; align-items: flex-start; justify-content: space-between; }
.research-section-title strong { color: #17365f; }
.research-section-title p { margin: 4px 0 10px; color: #75859a; font-size: 10px; }
.research-compare-panel > article { margin-top: 10px; padding-top: 10px; border-top: 1px solid #dce8f7; }
.research-compare-panel h4 { margin: 0 0 7px; }
.research-compare-panel article > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.research-compare-panel article section { padding: 10px; border-radius: 7px; background: #fff; }
.research-compare-panel article small { color: #718096; }
.research-compare-panel article p { margin: 5px 0 0; line-height: 1.55; }
.research-settings-dialog .el-dialog__body { max-height: 78vh; overflow-y: auto; padding-top: 8px; background: #f6f8fb; }
.ai-settings-shell { display: grid; gap: 14px; }
.ai-settings-section { display: grid; gap: 14px; padding: 18px; border: 1px solid #dfe6ef; border-radius: 11px; background: #fff; }
.ai-settings-section .el-form-item { margin-bottom: 0; }
.ai-routing-section { border-color: #bcd8f7; background: #f8fbff; }
.ai-settings-grid { gap: 14px 18px; }
.field-help { display: block; margin-top: 6px; color: #8793a5; font-size: 10px; line-height: 1.5; }
.ai-usage-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.ai-usage-grid article { padding: 13px 14px; border-radius: 9px; background: #f4f7fb; }
.ai-usage-grid small,.ai-usage-grid strong,.ai-usage-grid span { display: block; }
.ai-usage-grid small { color: #7d8ca0; font-size: 10px; }
.ai-usage-grid strong { margin: 6px 0 3px; color: #17365f; font-size: 20px; }
.ai-usage-grid span { color: #9aa5b4; font-size: 9px; }
.ai-test-actions { display: flex; gap: 8px; }
.ai-test-statuses { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ai-test-statuses > span { display: grid; align-items: start; gap: 6px; min-width: 0; }
.ai-test-statuses small { color: #7d8ca0; }
.ai-test-statuses .el-tag { justify-content: flex-start; height: auto; min-height: 25px; padding: 5px 9px; white-space: normal; line-height: 1.4; }
.ai-test-section .el-alert__content a { display: block; color: var(--brand); overflow-wrap: anywhere; }

.outreach-center { display: grid; gap: 14px; min-width: 0; }
.outreach-toolbar { display: flex; min-width: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 0 18px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.outreach-toolbar .el-tabs__header { margin: 0; }
.outreach-toolbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; width: 100%; padding: 10px 0 12px; }
.outreach-toolbar-actions .el-input { min-width: 180px; flex: 1; }
.outreach-center > .table-card { min-width: 0; width: 100%; max-width: 100%; overflow: hidden; }
.outreach-center .el-tag + .el-tag { margin-left: 6px; }
.conversation-center-shell { display: grid; grid-template-columns: minmax(235px,20%) minmax(260px,var(--conversation-list-width,25%)) 8px minmax(0,1fr); min-width: 0; height: clamp(540px,calc(100dvh - 255px),720px); overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(27,55,94,.06); }
.conversation-account-column, .conversation-list-column { min-width: 0; min-height: 0; height: 100%; overflow: hidden; border-right: 1px solid var(--border); }
.conversation-account-layout { display: grid; grid-template-columns: 64px minmax(0,1fr); height: 100%; }
.conversation-channel-rail { display: flex; flex-direction: column; gap: 8px; padding: 12px 7px; background: #f2f7fc; }
.conversation-channel-rail button { display: grid; justify-items: center; gap: 3px; padding: 9px 2px; border: 0; border-radius: 9px; color: #687b91; background: transparent; cursor: pointer; }
.conversation-channel-rail button span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-weight: 800; background: #758aa3; }
.conversation-channel-rail button small { font-size: 10px; white-space: nowrap; }
.conversation-channel-rail button.active { color: var(--primary); background: #fff; box-shadow: 0 2px 10px rgba(25,76,139,.1); }
.conversation-channel-rail button.active span { background: var(--primary); }
.conversation-account-panel { display: flex; min-width: 0; flex-direction: column; padding: 14px 10px; }
.conversation-account-panel > header, .conversation-list-column > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 38px; }
.conversation-account-panel > header > div, .conversation-list-column > header { color: #1f3148; }
.conversation-account-panel header small, .conversation-list-column header small { display: block; margin-top: 2px; color: var(--muted); font-weight: 400; }
.conversation-account-list { display: grid; gap: 6px; margin-top: 10px; }
.conversation-account-list > button { display: grid; grid-template-columns: 9px minmax(0,1fr); align-items: center; gap: 7px; width: 100%; padding: 9px 8px; overflow: hidden; border: 1px solid transparent; border-radius: 8px; color: #27394f; text-align: left; background: transparent; cursor: pointer; }
.conversation-account-list > button.active { border-color: #bad6f7; background: #eaf4ff; }
.conversation-account-list button span:nth-child(2) { min-width: 0; }
.conversation-account-list button strong, .conversation-account-list button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-account-list button small { margin-top: 2px; color: var(--muted); }
.account-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #22b573; }
.conversation-account-actions { display: flex; gap: 4px; padding: 4px 8px 12px; }
.conversation-folders { display: grid; gap: 3px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.conversation-folders > strong { padding: 0 8px 7px; font-size: 12px; color: #667a91; }
.conversation-folders button { display: flex; justify-content: space-between; padding: 8px; border: 0; border-radius: 7px; color: #43576d; background: transparent; cursor: pointer; }
.conversation-folders button.active { color: var(--primary); background: #eaf4ff; }
.conversation-list-column { display: flex; min-width: 0; flex-direction: column; padding: 14px 10px 0; border-right: 0; }
.conversation-list-column > .el-input { margin: 8px 0 10px; }
.conversation-resize-handle { position: relative; min-width: 8px; height: 100%; cursor: col-resize; touch-action: none; user-select: none; background: #f4f7fb; }
.conversation-resize-handle::before { position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; content: ""; background: #dce4ee; transform: translateX(-50%); transition: width .15s ease,background .15s ease; }
.conversation-resize-handle:hover::before, .conversation-center-shell.is-resizing .conversation-resize-handle::before { width: 3px; background: var(--primary); }
body.conversation-resizing, body.conversation-resizing * { cursor: col-resize !important; user-select: none !important; }
.conversation-contact-list { min-height: 0; flex: 1; overflow-y: auto; }
.conversation-contact-list > button { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: start; gap: 9px; width: 100%; padding: 11px 8px; border: 0; border-bottom: 1px solid #edf0f4; color: #25364b; text-align: left; background: #fff; cursor: pointer; }
.conversation-contact-list > button:hover, .conversation-contact-list > button.active { background: #eef6ff; }
.conversation-contact-main { min-width: 0; }
.conversation-contact-main strong, .conversation-contact-main small, .conversation-contact-main em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-contact-main small { margin: 2px 0 5px; color: var(--muted); }
.conversation-contact-main em { color: #7d8da0; font-size: 12px; font-style: normal; }
.conversation-contact-meta { display: grid; justify-items: end; gap: 8px; color: var(--muted); }
.conversation-contact-meta b { min-width: 20px; padding: 2px 6px; border-radius: 10px; color: #fff; text-align: center; background: #ec3f50; }
.unmatched-email-list .company-avatar { color: #b96f00; background: #fff2d8; }
.unmatched-email-detail { display: flex; min-height: 0; height: 100%; flex-direction: column; gap: 12px; overflow-y: auto; padding: 18px; }
.unmatched-email-detail > header { display: flex; align-items: start; justify-content: space-between; gap: 24px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.unmatched-email-detail > header > div { display: grid; gap: 4px; min-width: 0; }
.unmatched-email-detail > header > div:last-child { flex: 0 0 auto; justify-items: end; text-align: right; }
.unmatched-email-detail > header small, .unmatched-email-detail > header span { color: var(--muted); font-size: 12px; }
.unmatched-email-detail > header strong { overflow-wrap: anywhere; color: #1f3148; font-size: 17px; }
.unmatched-email-content { min-height: 180px; padding: 18px; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
.unmatched-email-content pre { margin: 0; color: #26384d; font: inherit; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.unmatched-email-linker { display: grid; grid-template-columns: minmax(190px,1fr) auto minmax(260px,1fr) auto; align-items: end; gap: 12px; padding: 16px; border: 1px solid #cfe1f5; border-radius: 10px; background: #f4f9ff; }
.unmatched-email-linker > div:first-child strong, .unmatched-email-linker > div:first-child p { display: block; margin: 0; }
.unmatched-email-linker > div:first-child p { margin-top: 4px; color: var(--muted); font-size: 12px; }
.unmatched-email-linker > .el-select { width: 100%; }
.unmatched-email-actions { display: flex; gap: 8px; }
.conversation-message-column { display: flex; min-width: 0; min-height: 0; height: 100%; flex-direction: column; overflow: hidden; background: #f6f8fb; }
.conversation-message-column > .el-empty { margin: auto; }
.conversation-customer-head { display: grid; grid-template-columns: minmax(0,1fr) auto; flex: 0 0 auto; align-items: start; gap: 24px; padding: 14px 18px; border-bottom: 1px solid var(--border); background: #fff; }
.conversation-customer-head > div:first-child { min-width: 0; }
.conversation-customer-head > div:first-child strong, .conversation-customer-head > div:first-child small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-customer-head > div:first-child strong, .conversation-customer-head > div:first-child small { display: block; }
.conversation-customer-head > div:first-child small { margin-top: 4px; color: var(--muted); }
.conversation-local-time { display: grid; justify-items: end; color: #32465c; }
.conversation-local-time small, .conversation-local-time em { color: var(--muted); font-size: 11px; font-style: normal; }
.conversation-settings-row { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: end; gap: 8px 12px; padding: 8px 14px; border-bottom: 1px solid var(--border); background: #fff; }
.conversation-settings-row label { display: grid; gap: 3px; color: #687b91; font-size: 11px; }
.conversation-settings-row .el-select { width: 135px; }
.conversation-settings-row > span { min-width: 0; margin-left: auto; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.conversation-message-scroll { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; align-items: flex-start; gap: 10px; overflow-y: auto; padding: 16px 18px; scrollbar-gutter: stable; }
.conversation-bubble { width: fit-content; max-width: min(72%,680px); padding: 10px 12px; border-radius: 12px 12px 12px 3px; background: #fff; box-shadow: 0 2px 8px rgba(31,54,82,.06); }
.conversation-bubble.outbound { align-self: flex-end; max-width: min(68%,620px); border-radius: 12px 12px 3px 12px; background: #dff0ff; }
.conversation-bubble > small, .conversation-bubble > strong { display: block; margin-bottom: 5px; color: #6f8195; }
.conversation-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.conversation-translation { margin-top: 8px; padding-top: 7px; border-top: 1px dashed #d7dee8; color: #2c5481; }
.conversation-translation small { display: block; margin-bottom: 3px; }
.conversation-bubble details { margin-top: 7px; color: #5e7187; font-size: 12px; }
.conversation-media-image { display: block; margin-top: 8px; }
.conversation-media-image img { display: block; max-width: 280px; max-height: 220px; border-radius: 9px; object-fit: contain; background: #f4f7fb; }
.conversation-media-file { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; color: #1769d2; text-decoration: none; }
.conversation-composer { display: grid; flex: 0 0 auto; gap: 5px; padding: 8px 14px 10px; border-top: 1px solid var(--border); background: #fff; box-shadow: 0 -5px 16px rgba(31,54,82,.04); }
.conversation-composer .el-alert { padding-top: 7px; padding-bottom: 7px; }
.composer-block { display: grid; gap: 4px; color: #43566d; font-size: 12px; }
.composer-block.chinese { padding-top: 7px; border-top: 1px dashed #dce3eb; }
.composer-block span { display: flex; justify-content: space-between; }
.composer-block small { color: var(--primary); }
.conversation-composer-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.conversation-composer-actions span { color: var(--muted); font-size: 12px; }
.conversation-media-picker { display: flex; align-items: center; gap: 10px; min-height: 34px; }
.conversation-media-picker > label span { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border: 1px solid #b8c7d9; border-radius: 6px; color: #276ecb; cursor: pointer; background: #fff; }
.conversation-media-picker > div { display: flex; align-items: center; gap: 8px; min-width: 0; color: #53677f; }
.conversation-media-picker img { width: 38px; height: 38px; border-radius: 6px; object-fit: cover; }
.conversation-media-picker strong { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.conversation-media-picker small { color: var(--muted); }
.meta-settings-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }
.meta-lead-table .el-tag + small { margin-top: 6px; }
.email-settings-form { display: grid; gap: 14px; margin-top: 14px; }
.email-settings-section { padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.email-settings-section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.email-settings-section > header strong { color: #142441; font-size: 15px; }
.email-settings-section > header p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.email-settings-hint { display: block; margin-top: 8px; color: #b26a00; }
.email-limit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.email-limit-grid label { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 6px; padding: 12px; border-radius: 10px; background: #f6f9fd; }
.email-limit-grid label > span { grid-column: 1 / -1; color: #53627a; font-size: 12px; }
.email-limit-grid label > small { color: var(--muted); }
.email-test-row { display: grid; grid-template-columns: minmax(240px, 1fr) auto auto; gap: 10px; margin-bottom: 12px; }
.email-provider-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.email-provider-status span { padding: 9px 10px; border-radius: 8px; background: #f3f7fc; color: #52627a; font-size: 12px; }
.whatsapp-secret-actions { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 8px; }
.mock-reply-panel { color: #60748b; font-size: 12px; }
.mock-reply-panel > div { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 8px; padding-top: 8px; }
.development-permission-extra { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin-top: 12px; padding: 12px 14px; border-radius: 8px; background: #f4f8fe; }
.outreach-import-actions { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.outreach-import-actions > span { color: var(--muted); }
.outreach-variable-help { margin-top: 12px; padding: 10px; color: #536982; background: #f4f8fe; border-radius: 8px; }
.campaign-step-head { display: flex; align-items: center; justify-content: space-between; margin: 16px 0 10px; }
.campaign-step-head p { margin: 4px 0 0; color: var(--muted); }
.campaign-step-row { display: grid; grid-template-columns: 72px 125px minmax(175px,1fr) minmax(160px,1fr) 120px 35px 50px; align-items: center; gap: 8px; padding: 10px 0; border-top: 1px solid var(--border); }
.supplier-rfq-dialog .el-alert { margin-bottom: 14px; }
.supplier-rfq-source, .supplier-rfq-detail-head { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 14px 0; }
.supplier-rfq-source { grid-template-columns: repeat(2,minmax(0,1fr)); }
.supplier-rfq-source > div, .supplier-rfq-detail-head > div { display: grid; gap: 5px; padding: 12px 14px; border-radius: 9px; background: #f4f8fe; }
.supplier-rfq-source small, .supplier-rfq-detail-head small { color: var(--muted); }
.supplier-rfq-section { margin-top: 14px; padding: 14px; border: 1px solid var(--border); border-radius: 10px; }
.supplier-rfq-section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.supplier-rfq-section > header div { display: grid; gap: 4px; }
.supplier-rfq-section > header small { color: var(--muted); }
.supplier-rfq-item-list { display: grid; gap: 9px; }
.supplier-rfq-item { display: grid; grid-template-columns: 28px minmax(260px,1fr) minmax(240px,1fr); align-items: center; gap: 8px; padding: 10px; border-radius: 8px; background: #f7f9fc; }
.supplier-rfq-item > span { display: grid; gap: 4px; }
.supplier-rfq-item small, .supplier-rfq-supplier-grid small { color: var(--muted); }
.supplier-rfq-supplier-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.supplier-rfq-supplier-grid .el-checkbox { width: 100%; height: auto; min-height: 48px; margin: 0; padding: 8px 12px; }
.supplier-rfq-supplier-grid .el-checkbox__label span { display: grid; gap: 3px; }
.supplier-rfq-manual-row { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: 8px; margin-top: 8px; }
.supplier-rfq-review-supplier { display:flex; gap:12px; align-items:center; margin:14px 0; padding:12px; border-radius:9px; background:#f4f7fb; }.supplier-rfq-review-supplier span { color:#66788e; }.supplier-rfq-review-batch { display:grid; gap:10px; margin-bottom:12px; padding:12px; border:1px solid #dce6f2; border-radius:9px; background:#f8fbff; }.supplier-rfq-review-batch>div { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }.supplier-rfq-review-batch .el-select { width:190px; }.supplier-rfq-review-list { display:grid; gap:12px; max-height:58vh; overflow:auto; margin-bottom:14px; }.supplier-rfq-review-item { padding:14px; border:1px solid #dfe7f1; border-radius:10px; }.supplier-rfq-review-item>header { display:flex; justify-content:space-between; gap:20px; margin-bottom:12px; }.supplier-rfq-review-item>header div { display:grid; gap:3px; }.supplier-rfq-review-item>header small,.supplier-rfq-review-item>header span { color:#71839a; }.supplier-rfq-review-controls { display:grid; grid-template-columns:220px 260px 1fr; gap:10px; }.supplier-rfq-review-controls label { display:grid; gap:5px; }.supplier-rfq-review-controls label>span { color:#536980; font-size:12px; }.supplier-rfq-review-controls .wide { grid-column:span 1; }.supplier-rfq-review-product { display:grid; grid-template-columns:1fr 1.2fr 1.3fr 1fr 1fr 80px; gap:8px; margin-top:10px; }.supplier-rfq-review-reject { margin:10px 0 0; color:#b15c00; }.paste-mode-group { margin:0 0 12px; }
.supplier-rfq-comparison-offers { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; margin-bottom:12px; padding-bottom:12px; border-bottom:1px dashed #d7e1ed; }.supplier-rfq-comparison-offers button { display:grid; gap:4px; padding:10px 12px; text-align:left; color:#314963; border:1px solid #d5e0ec; border-radius:8px; background:#f8fafc; cursor:pointer; }.supplier-rfq-comparison-offers button:hover { border-color:#91b8e8; background:#f2f7ff; }.supplier-rfq-comparison-offers button.active { color:#174f95; border-color:#409eff; background:#ecf5ff; box-shadow:0 0 0 1px rgba(64,158,255,.14); }.supplier-rfq-comparison-offers button span { font-weight:700; }.supplier-rfq-comparison-offers button small { color:#71839a; }.supplier-rfq-comparison-offers .el-empty { grid-column:1/-1; padding:4px 0; }
.supplier-rfq-detail-head + .el-alert { margin-bottom: 16px; }
.supplier-rfq-quote-progress { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 16px; padding:14px 16px; border:1px solid #f1d39b; border-radius:10px; background:#fff9ec; }
.supplier-rfq-quote-progress.ready { border-color:#a9ddbd; background:#f0fbf4; }
.supplier-rfq-quote-progress > div { display:grid; gap:4px; }
.supplier-rfq-quote-progress small,.supplier-rfq-quote-progress span { color:#6b7d91; }
.supplier-rfq-quote-progress strong { color:#233a56; font-size:16px; }
.supplier-rfq-public-notes { margin-top: 14px; padding: 12px 14px; border-radius: 8px; background: #f7f9fc; }
.supplier-rfq-public-notes p { margin: 6px 0 0; white-space: pre-wrap; }
.supplier-rfq-response-panel { padding: 12px 18px 16px; background: #f7f9fc; }
.supplier-rfq-response-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.supplier-rfq-response-head span { color: var(--muted); font-size: 12px; }
.supplier-rfq-response-panel > p { margin: 10px 0 0; color: #4d6078; white-space: pre-wrap; }
.supplier-rfq-link-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 15px; }
.supplier-rfq-link-form label { display: grid; gap: 7px; }
.supplier-rfq-link-form label > span { color: var(--muted); font-size: 12px; }
.supplier-rfq-link-form label.full { grid-column: 1 / -1; }
.supplier-rfq-link-form small { color: #9a6900; }

@media (max-width: 900px) {
  .research-stat-grid, .research-task-meta, .research-report-grid { grid-template-columns: 1fr 1fr; }
  .research-identity-grid,.research-company-grid,.research-derived-clues { grid-template-columns: 1fr; }
  .research-filter-bar { grid-template-columns: 1fr 1fr; }
  .ai-usage-grid { grid-template-columns: 1fr 1fr; }
  .ai-test-statuses { grid-template-columns: 1fr; }
  .research-report-head { flex-direction: column; }
  .research-report-actions { flex-wrap: wrap; }
  .research-contact-grid { grid-template-columns: 1fr; }
  .outreach-toolbar { align-items: stretch; flex-direction: column; padding-top: 10px; }
  .outreach-toolbar-actions { flex-wrap: wrap; }
  .outreach-toolbar-actions .el-input { width: 100%; }
  .email-limit-grid, .email-provider-status { grid-template-columns: 1fr; }
  .email-test-row { grid-template-columns: 1fr; }
  .campaign-step-row { grid-template-columns: 1fr 1fr; }
  .supplier-rfq-item, .supplier-rfq-manual-row { grid-template-columns: 1fr; }
  .supplier-rfq-supplier-grid, .supplier-rfq-detail-head { grid-template-columns: 1fr; }
  .supplier-rfq-link-form { grid-template-columns: 1fr; }
  .supplier-rfq-link-form label.full { grid-column: auto; }
  .supplier-rfq-quote-progress { align-items:flex-start; flex-direction:column; }
  .conversation-center-shell { grid-template-columns: 210px minmax(250px,var(--conversation-list-width,250px)) 8px minmax(390px,1fr); overflow-x: auto; }
  .unmatched-email-linker { grid-template-columns: 1fr; }
  .unmatched-email-actions { justify-content: flex-end; }
}

@media (min-width: 901px) and (max-width: 1280px) {
  .conversation-center-shell { grid-template-columns: minmax(225px,20%) minmax(260px,var(--conversation-list-width,25%)) 8px minmax(0,1fr); }
  .conversation-settings-row .el-select { width: 125px; }
  .conversation-bubble { max-width: 78%; }
  .conversation-bubble.outbound { max-width: 74%; }
  .unmatched-email-linker { grid-template-columns: 1fr auto; }
  .unmatched-email-linker > div:first-child { grid-column: 1 / -1; }
}

@media print {
  body.printing-quote * { visibility: hidden !important; }
  body.printing-quote .quote-preview-print,
  body.printing-quote .quote-preview-print * { visibility: visible !important; }
  body.printing-quote .quote-preview-print { position: fixed; inset: 0; width: 100%; padding: 18mm; }
  body.printing-purchase * { visibility: hidden !important; }
  body.printing-purchase .purchase-preview-print,
  body.printing-purchase .purchase-preview-print * { visibility: visible !important; }
  body.printing-purchase .purchase-preview-print { position: fixed; inset: 0; width: 100%; padding: 18mm; }
  body.printing-research * { visibility: hidden !important; }
  body.printing-research .research-report-print,
  body.printing-research .research-report-print * { visibility: visible !important; }
  body.printing-research .research-report-print { position: absolute; inset: 0; width: 100%; padding: 12mm; color: #17233c; background: #fff; }
  body.printing-research .research-report-actions, body.printing-research .research-compare-panel { display: none !important; }
  body.printing-research .research-report-section, body.printing-research .research-source-section { break-inside: avoid; box-shadow: none; }
}