﻿* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; font-family: 'Microsoft YaHei', Arial, sans-serif; }
body { background: linear-gradient(180deg, #0a1730 0%, #1d2f4a 45%, #20344a 100%); }
#app { width: 100%; height: 100%; }

button:not(:disabled),
.btn:not(:disabled),
.work-btn:not(:disabled),
.customer-btn:not(:disabled),
.contract-select-btn:not(:disabled),
.contract-upload-btn:not(:disabled),
.contract-upload-confirm:not(:disabled),
.contract-file-btn:not(:disabled),
.parameter-save-btn:not(:disabled),
.dispatch-save-btn:not(:disabled),
.dispatch-edit-btn:not(:disabled),
.dispatch-complete-btn:not(:disabled),
.dispatch-print-btn:not(:disabled),
.dispatch-void-btn:not(:disabled),
.paint-add-btn:not(:disabled),
.grid-detail-body button:not(:disabled),
.mobile-save-btn:not(:disabled),
.mobile-action-btn:not(:disabled),
.mobile-login-input button:not(:disabled),
.mobile-login-open:not(:disabled),
.mobile-login-submit:not(:disabled),
.paint-finish-btn:not(:disabled),
.paint-color-edit-btn:not(:disabled),
.paint-color-add-btn:not(:disabled),
.finance-pay-btn:not(:disabled) {
  cursor: pointer;
  filter: saturate(1.18) brightness(1.05);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 2px 6px rgba(0,0,0,.16);
  transition: filter .12s ease, box-shadow .12s ease, transform .12s ease;
}
button:not(:disabled):hover,
.btn:not(:disabled):hover,
.work-btn:not(:disabled):hover,
.customer-btn:not(:disabled):hover,
.contract-select-btn:not(:disabled):hover,
.contract-upload-btn:not(:disabled):hover,
.contract-upload-confirm:not(:disabled):hover,
.contract-file-btn:not(:disabled):hover,
.parameter-save-btn:not(:disabled):hover,
.dispatch-save-btn:not(:disabled):hover,
.dispatch-edit-btn:not(:disabled):hover,
.dispatch-complete-btn:not(:disabled):hover,
.dispatch-print-btn:not(:disabled):hover,
.dispatch-void-btn:not(:disabled):hover,
.paint-add-btn:not(:disabled):hover,
.grid-detail-body button:not(:disabled):hover,
.mobile-save-btn:not(:disabled):hover,
.mobile-action-btn:not(:disabled):hover,
.mobile-login-input button:not(:disabled):hover,
.mobile-login-open:not(:disabled):hover,
.mobile-login-submit:not(:disabled):hover,
.paint-finish-btn:not(:disabled):hover,
.paint-color-edit-btn:not(:disabled):hover,
.paint-color-add-btn:not(:disabled):hover,
.finance-pay-btn:not(:disabled):hover {
  filter: saturate(1.35) brightness(1.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 0 0 2px rgba(24,144,255,.18), 0 4px 10px rgba(0,0,0,.2);
  transform: translateY(-1px);
}
button:not(:disabled):active,
.btn:not(:disabled):active,
.work-btn:not(:disabled):active,
.customer-btn:not(:disabled):active,
.contract-select-btn:not(:disabled):active,
.contract-upload-btn:not(:disabled):active,
.contract-upload-confirm:not(:disabled):active,
.contract-file-btn:not(:disabled):active,
.parameter-save-btn:not(:disabled):active,
.dispatch-save-btn:not(:disabled):active,
.dispatch-edit-btn:not(:disabled):active,
.dispatch-complete-btn:not(:disabled):active,
.dispatch-print-btn:not(:disabled):active,
.dispatch-void-btn:not(:disabled):active,
.paint-add-btn:not(:disabled):active,
.grid-detail-body button:not(:disabled):active,
.mobile-save-btn:not(:disabled):active,
.mobile-action-btn:not(:disabled):active,
.mobile-login-input button:not(:disabled):active,
.mobile-login-open:not(:disabled):active,
.mobile-login-submit:not(:disabled):active,
.paint-finish-btn:not(:disabled):active,
.paint-color-edit-btn:not(:disabled):active,
.paint-color-add-btn:not(:disabled):active,
.finance-pay-btn:not(:disabled):active {
  filter: saturate(1.05) brightness(.96);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.18), 0 1px 3px rgba(0,0,0,.12);
  transform: translateY(0);
}
.link-button,
.customer-modal-close,
.mobile-back-btn,
.contract-table-box button.contract-dispatch-link {
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
.link-button:hover,
.customer-modal-close:hover,
.mobile-back-btn:hover,
.contract-table-box button.contract-dispatch-link:hover {
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.shell { display: flex; width: 100%; height: 100vh; overflow: hidden; background: #fff; }
.sidebar { width: 180px; background: #202a31; color: #cfe2f1; display: flex; flex-direction: column; }
.sidebar-top { height: 32px; line-height: 32px; background: #0f92d6; color: #fff; font-size: 15px; text-align: center; }
.sidebar-group { padding: 10px 16px 6px; font-size: 16px; color: #93aab8; }
.sidebar-item { padding: 8px 16px; font-size: 13px; color: #e2edf5; cursor: pointer; text-align: center; text-decoration: none; display: block; }
.sidebar-item:hover { background: #3a4650; color: #fff; position: relative; }
.sidebar-item.active { background: #2e3940; color: #fff; position: relative; }
.sidebar-item:hover::before,
.sidebar-item.active::before { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 8px solid #fff; }
.sidebar-group:hover { background: #2d363d; color: #fff; }
.sidebar-foot { margin-top: auto; padding: 8px 10px; background: #1a82c6; color: #fff; font-size: 13px; }
.main { flex: 1; min-width: 0; }

.page-head { position: relative; background: #fff; border-bottom: 1px solid #e3e7ea; }
.contract-head { height: 132px; padding: 6px 12px 0; }
.contract-filters { display: grid; grid-template-columns: 330px 1fr; gap: 8px 32px; width: 760px; }
.filter-group { display: flex; flex-direction: column; gap: 8px; }
.filter-cell { display: flex; align-items: center; height: 32px; white-space: nowrap; }
.filter-cell span { width: 88px; text-align: right; font-size: 14px; color: #666; padding-right: 6px; }
.filter-cell input,
.filter-cell select { height: 32px; border: 1px solid #ddd; background: #fff; font-size: 14px; padding: 0 4px; }
.filter-cell i { padding: 0 8px; font-style: normal; font-size: 14px; }

.action-row { position: absolute; left: 12px; bottom: 10px; display: flex; gap: 8px; }
.action-right { position: absolute; right: 12px; bottom: 2px; display: grid; grid-template-columns: 100px 100px 40px; column-gap: 12px; align-items: center; }
.action-right > *,
.pager button,
.pager a { color: #1890ff; }
.quick-search,
.sort-select,
.order-select { height: 22px; border: 1px solid #ddd; background: #fff; font-size: 14px; padding: 0 2px; }
.quick-search { width: 100px; }
.sort-select { width: 100px; }
.order-select { width: 40px; }
.btn { width: 50px; height: 30px; padding: 0; line-height: 30px; border-radius: 2px; font-size: 14px; color: #fff; border: 0; }
.btn.blue { background: #2f8dc8; }
.btn.green { background: #3eab6b; }
.btn.olive { background: #7b8f34; }

.contract-table-box { overflow: hidden; margin-top: 0; }
.contract-table-box table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.contract-table-box th,
.contract-table-box td { height: 31px; line-height: 31px; font-size: 14px; border: 1px solid #dfe5e8; text-align: center; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contract-table-box thead th { border-top: 0; }
.contract-table-box th:nth-child(1),
.contract-table-box td:nth-child(1) { width: 44px; }
.contract-table-box th:nth-child(2),
.contract-table-box td:nth-child(2) { width: 44px; }
.contract-table-box th:nth-child(3),
.contract-table-box td:nth-child(3) { width: 90px; }
.contract-table-box th:nth-child(4),
.contract-table-box td:nth-child(4) { width: 70px; }
.contract-table-box th:nth-child(5),
.contract-table-box td:nth-child(5) { width: 122px; }
.contract-table-box th:nth-child(6),
.contract-table-box td:nth-child(6) { width: 90px; }
.contract-table-box th:nth-child(7),
.contract-table-box td:nth-child(7) { width: 90px; }
.contract-table-box th:nth-child(8),
.contract-table-box td:nth-child(8) { width: 90px; }
.contract-table-box th:nth-child(9),
.contract-table-box td:nth-child(9) { width: 70px; }
.contract-table-box th:nth-child(10),
.contract-table-box td:nth-child(10) { width: 102px; }
.contract-table-box th:nth-child(11),
.contract-table-box td:nth-child(11) { width: auto; min-width: 160px; }
.contract-table-box th:nth-child(12),
.contract-table-box td:nth-child(12) { width: 54px; }
.contract-table-box th:nth-child(13),
.contract-table-box td:nth-child(13) { width: 70px; }
.contract-table-box th:nth-child(14),
.contract-table-box td:nth-child(14) { width: 70px; }
.contract-table-box th:nth-child(15),
.contract-table-box td:nth-child(15) { width: 132px; }
.contract-table-box th:nth-child(16),
.contract-table-box td:nth-child(16) { width: 70px; }
.contract-table-box th:nth-child(17),
.contract-table-box td:nth-child(17) { width: 132px; }
.contract-table-box td:nth-child(2) a { color: #1890ff; }
.contract-table-box td:nth-child(3) { color: #333; }
.contract-table-box td:nth-child(3) .link { color: #1a9b3f; }
.contract-table-box td:nth-child(3) { text-align: left; padding-left: 6px; }
.contract-table-box td:nth-child(3) button.contract-dispatch-link,
.contract-table-box td:nth-child(3) button.contract-dispatch-link.link-button,
.contract-table-box td:nth-child(3) .contract-dispatch-disabled { color: #1aa37a !important; }
.contract-table-box td:nth-child(3) .contract-dispatch-disabled { cursor: default; }
.contract-table-box td:nth-child(3) .record { color: #333; }
.contract-table-box td:nth-child(3) .dispatch-record-active { color: #1890ff !important; }
.contract-table-box td:nth-child(7) { color: #FF00FF; }
.contract-table-box td:nth-child(8) { color: #00a651; }
.contract-table-box tbody tr:hover td { background: #eaf6ff; }
.contract-table-box td.contract-audit-unreviewed { color: #FF0000 !important; }

.pager { padding: 4px 0 0 2px; font-size: 14px; color: #555; line-height: 18px; white-space: nowrap; }
.jump-input { width: 36px; height: 18px; border: 1px solid #bbb; text-align: center; font-size: 14px; margin: 0 1px; padding: 0; }

.module-pending-main { background: #fff; }
.module-pending-head { height: 44px; line-height: 44px; padding: 0 12px; border-bottom: 1px solid #e3e7ea; font-size: 14px; color: #333; }
.module-pending-body { padding: 18px 12px; color: #666; font-size: 12px; }

.work-main { background: #fff; }
.work-head { position: relative; height: 132px; padding: 6px 12px 0; background: #fff; border-bottom: 1px solid #e3e7ea; }
.work-filters { display: grid; grid-template-columns: 330px 1fr; gap: 8px 32px; width: 760px; }
.work-cell { display: flex; align-items: center; height: 32px; white-space: nowrap; }
.work-cell span { width: 88px; padding-right: 6px; text-align: right; font-size: 14px; color: #666; }
.work-cell input,
.work-cell select { height: 31px; padding: 0 4px; border: 1px solid #ddd; background: #fff; font-size: 14px; }
.work-cell input { width: 160px; }
.work-cell select { width: 160px; }
.work-head .work-cell:nth-child(2) select { width: 150px; height: 31px; }
.work-head .work-cell:nth-child(1) input,
.work-head .work-cell:nth-child(3) input { height: 31px; }
.work-date { display: flex; align-items: center; gap: 0; }
.work-date i { padding: 0 8px; font-style: normal; font-size: 14px; }
.work-date-box { position: relative; display: inline-flex; align-items: center; width: 100px; min-width: 100px; max-width: 100px; margin-right: 0; flex: 0 0 100px; overflow: visible; }
.work-date-box:first-of-type { margin-right: 32px; }
.work-date-text { width: 100px; min-width: 100px; max-width: 100px; height: 31px; box-sizing: border-box; padding: 0 24px 0 4px; border: 1px solid #ddd; background: #fff; font-size: 20px; line-height: 31px; color: #333; flex: 0 0 100px; }
.work-date-picker { position: absolute; inset: 0; width: 100px; height: 31px; opacity: 0; pointer-events: none; }
.work-date-box .work-calendar { position: absolute; right: -8px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #888; cursor: pointer; pointer-events: auto; }
.work-date select { width: 100px; min-width: 100px; max-width: 100px; height: 31px; margin-left: 4px; padding: 0; font-size: 14px; flex: 0 0 100px; }
.work-actions { position: absolute; left: 12px; bottom: 10px; display: flex; gap: 8px; }
.work-btn { width: 50px; height: 30px; padding: 0; border: 0; border-radius: 2px; line-height: 30px; color: #fff; font-size: 14px; }
.work-blue { background: #2f8dc8; }
.work-green { background: #3eab6b; }
.work-olive { background: #7b8f34; }
.work-right { position: absolute; right: 12px; bottom: 2px; display: flex; gap: 12px; align-items: center; }
.work-right select { height: 22px; border: 1px solid #ddd; background: #fff; font-size: 14px; color: #1890ff; }
.work-right select:nth-child(1),
.work-right select:nth-child(2) { width: 100px; }
.work-right select:nth-child(3) { width: 40px; }
.work-table-box { overflow: hidden; }
.work-table-box table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.work-table-box th,
.work-table-box td { height: 31px; border: 1px solid #e5e8eb; line-height: 31px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #333; }
.work-table-box thead th { border-top: 0; }
.work-table-box th:nth-child(1), .work-table-box td:nth-child(1) { width: 44px; }
.work-table-box th:nth-child(2), .work-table-box td:nth-child(2) { width: 44px; }
.work-table-box th:nth-child(3), .work-table-box td:nth-child(3) { width: 70px; }
.work-table-box th:nth-child(4), .work-table-box td:nth-child(4) { width: 122px; }
.work-table-box th:nth-child(5), .work-table-box td:nth-child(5) { width: 122px; }
.work-table-box th:nth-child(6), .work-table-box td:nth-child(6) { width: 70px; }
.work-table-box th:nth-child(7), .work-table-box td:nth-child(7) { width: 70px; }
.work-table-box th:nth-child(8), .work-table-box td:nth-child(8) { width: 70px; }
.work-table-box th:nth-child(9), .work-table-box td:nth-child(9) { width: 70px; }
.work-table-box th:nth-child(10), .work-table-box td:nth-child(10) { width: auto; min-width: 160px; }
.work-table-box th:nth-child(17), .work-table-box td:nth-child(17) { width: 70px; }
.work-table-box th:nth-child(18), .work-table-box td:nth-child(18) { width: 70px; }
.work-table-box th:nth-child(19), .work-table-box td:nth-child(19) { width: 122px; }
.work-table-box td:nth-child(2) a { color: #1890ff; }
.work-red { color: #ff0000 !important; }
.work-table-box tbody tr:hover td { background: #eaf6ff; }
.work-pager { padding: 6px 0 0 2px; font-size: 13px; line-height: 18px; color: #555; white-space: nowrap; }
.work-pager input { width: 36px; height: 18px; margin: 0 1px; padding: 0; border: 1px solid #bbb; text-align: center; font-size: 14px; }
.work-pager button { color: #1890ff; }

.customer-main { background: #fff; }
.customer-head { position: relative; height: 132px; padding: 6px 12px 0; background: #fff; border-bottom: 1px solid #e3e7ea; }
.customer-filter { display: flex; align-items: center; height: 32px; margin-top: 22px; white-space: nowrap; }
.customer-filter span { width: 88px; padding-right: 6px; text-align: right; font-size: 14px; color: #666; }
.customer-filter input { width: 150px; height: 32px; padding: 0 4px; border: 1px solid #ddd; background: #fff; font-size: 14px; }
.customer-actions { position: absolute; left: 12px; bottom: 10px; display: flex; gap: 8px; }
.customer-btn { width: 50px; height: 30px; padding: 0; border: 0; border-radius: 2px; line-height: 30px; color: #fff; font-size: 14px; }
.customer-btn:hover { background-image: linear-gradient(rgba(255,255,255,0.18), rgba(255,255,255,0.18)); }
.customer-blue { background: #2f8dc8; }
.customer-green { background: #3eab6b; }
.customer-olive { background: #7b8f34; }
.customer-right { position: absolute; right: 12px; bottom: 2px; display: flex; gap: 12px; align-items: center; }
.customer-right select { height: 22px; border: 1px solid #ddd; background: #fff; font-size: 14px; color: #1890ff; }
.customer-right select:nth-child(1),
.customer-right select:nth-child(2) { width: 100px; }
.customer-right select:nth-child(3) { width: 40px; }
.customer-table-box { overflow-x: auto; overflow-y: hidden; }
.customer-table-box table { min-width: 1220px; width: 100%; border-collapse: collapse; table-layout: fixed; }
.customer-table-box th,
.customer-table-box td { height: 31px; border: 1px solid #dfe5e8; line-height: 31px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #333; }
.customer-table-box thead th { border-top: 0; }
.customer-table-box th:nth-child(1), .customer-table-box td:nth-child(1),
.customer-table-box th:nth-child(2), .customer-table-box td:nth-child(2),
.customer-table-box th:nth-child(9), .customer-table-box td:nth-child(9) { width: 44px; }
.customer-table-box th:nth-child(3), .customer-table-box td:nth-child(3),
.customer-table-box th:nth-child(4), .customer-table-box td:nth-child(4),
.customer-table-box th:nth-child(8), .customer-table-box td:nth-child(8),
.customer-table-box th:nth-child(10), .customer-table-box td:nth-child(10),
.customer-table-box th:nth-child(11), .customer-table-box td:nth-child(11),
.customer-table-box th:nth-child(12), .customer-table-box td:nth-child(12),
.customer-table-box th:nth-child(13), .customer-table-box td:nth-child(13) { width: 70px; }
.customer-table-box th:nth-child(5), .customer-table-box td:nth-child(5) { width: 120px; }
.customer-table-box th:nth-child(6), .customer-table-box td:nth-child(6) { width: 110px; }
.customer-table-box th:nth-child(7), .customer-table-box td:nth-child(7) { width: auto; min-width: 160px; }
.customer-table-box th:nth-child(14), .customer-table-box td:nth-child(14) { width: 132px; }
.customer-table-box td:nth-child(2) a { color: #1890ff; }
.customer-table-box tbody tr:hover td { background: #eaf6ff; }
.customer-pager { padding: 4px 0 0 2px; font-size: 14px; line-height: 18px; color: #555; white-space: nowrap; }
.customer-pager input { width: 36px; height: 18px; margin: 0 1px; padding: 0; border: 1px solid #bbb; text-align: center; font-size: 14px; }
.customer-pager button { color: #1890ff; }
.customer-modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,0.45); display: flex; align-items: flex-start; justify-content: center; padding-top: 20px; z-index: 50; }
.customer-modal { width: 1000px; height: 800px; background: #fff; border: 1px solid #cfcfcf; display: flex; flex-direction: column; }
.customer-modal-head { height: 50px; line-height: 50px; padding: 0 12px; border-bottom: 1px solid #e6e6e6; display: flex; justify-content: space-between; align-items: center; font-size: 16px; color: #333; }
.customer-modal-close { width: 24px; height: 24px; border: 0; background: transparent; font-size: 18px; color: #999; cursor: pointer; }
.contract-modal-body input:not([type="checkbox"]),
.contract-modal-body select,
.contract-modal-body textarea {
  border: 0 !important;
  border-bottom: 1px solid #999 !important;
  border-radius: 0 !important;
  background: transparent !important;
  outline: none !important;
  font-size: 17px !important;
}
.contract-modal-body input:not([type="checkbox"]):focus,
.contract-modal-body select:focus,
.contract-modal-body input:disabled,
.contract-modal-body select:disabled,
.contract-modal-body textarea:disabled { color: #333 !important; opacity: 1 !important; -webkit-text-fill-color: #333 !important; }
.contract-readonly-select { pointer-events: none; color: #333 !important; opacity: 1 !important; -webkit-text-fill-color: #333 !important; }
.contract-modal-body input[type="checkbox"] { vertical-align: middle; margin: 0; position: relative; top: 0; }
.contract-modal-body label { display: inline-flex; align-items: center; gap: 2px; margin-right: 20px; }
.customer-notice { min-height: 22px; margin-bottom: 6px; padding: 0 8px; line-height: 22px; font-size: 12px; color: #d4380d; background: #fff1f0; border: 1px solid #ffccc7; visibility: hidden; }
.customer-notice.show { visibility: visible; }
.customer-form-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 38px; row-gap: 10px; align-items: start; }
.customer-field { display: flex; align-items: center; min-height: 24px; }
.customer-field span { width: 84px; flex: 0 0 84px; font-size: 14px; color: #666; text-align: right; padding-right: 6px; }
.customer-required { color: #f00; }
.customer-field input,
.customer-field select { width: 100%; height: 32px; border: 1px solid #e5e5e5; background: #fff; font-size: 14px; padding: 0 6px; }
.customer-wide { grid-column: 1 / span 2; }
.customer-textarea { grid-column: 1 / span 1; align-items: flex-start; }
.customer-textarea textarea { width: 100%; height: 120px; border: 1px solid #e5e5e5; background: #fff; font-size: 14px; padding: 4px 6px; resize: both; overflow: auto; }
.customer-attach { grid-column: 1 / span 2; display: flex; align-items: center; gap: 8px; padding-left: 84px; }
.customer-modal-foot { height: 50px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.customer-attach span { font-size: 12px; color: #666; }
.customer-upload { width: 50px; height: 30px; border: 0; background: #31b5c8; color: #fff; font-size: 14px; }
.contract-modal-body { padding: 0 10px 10px; flex: 1; overflow: hidden; font-size: 14px; line-height: 17px; }
.contract-modal-body { padding: 0 10px 10px; flex: 1; overflow: hidden; font-size: 14px; line-height: 17px; }
.contract-title { text-align: center; font-size: 26px; font-weight: 700; padding: 10px 0 8px; color: #111; }
.contract-sheet { display: grid; grid-template-columns: 1fr 1fr; gap: 0; height: 737px; margin: 15px -2px -38px; border: 1px solid #8a8a8a; background: linear-gradient(to right, transparent calc(50% - 0.5px), #8a8a8a calc(50% - 0.5px), #8a8a8a calc(50% + 0.5px), transparent calc(50% + 0.5px)); background-clip: content-box; }
.contract-pane { padding: 10px; color: #333; line-height: 32px; font-size: 15px; height: 100%; box-sizing: border-box; }
.contract-pane:first-child { border-right: 0; }
.contract-modal-body input:not([type="checkbox"]),
.contract-modal-body select { height: 22px; border: 0; border-bottom: 1px solid #999; background: transparent; outline: none; font-size: 17px; }
.contract-modal-body input:not([type="checkbox"]) { width: 90px; text-align: center; }
.contract-modal-body select { width: 120px; }
.contract-select-btn { height: 26px; padding: 0 12px; border: 0; border-radius: 2px; background: #31b5c8; color: #fff; font-size: 15px; }
.contract-select-btn,
.contract-upload-btn,
.customer-save,
.contract-upload-confirm,
.contract-file-btn { background-image: linear-gradient(rgba(255,255,255,.35), rgba(255,255,255,0)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.55); }
.contract-upload-row { display: flex; align-items: center; justify-content: center; height: 33px; gap: 8px; position: relative; }
.contract-upload-btn { height: 26px; padding: 0 12px; border: 0; border-radius: 2px; background: #31b5c8; color: #fff; font-size: 15px; }
.contract-upload-mask { display: none; position: fixed; inset: 0; z-index: 30; background: rgba(0,0,0,.08); align-items: center; justify-content: center; }
.contract-upload-mask.show { display: flex; }
.contract-upload-modal { width: 500px; height: 285px; background: #fff; border: 0; box-shadow: none; }
.contract-upload-head { height: 42px; line-height: 42px; padding: 0 12px; border-bottom: 1px solid #eee; font-size: 18px; color: #333; display: flex; justify-content: space-between; }
.contract-upload-close { border: 0; background: transparent; font-size: 24px; color: #999; cursor: pointer; }
.contract-upload-form { padding: 10px 10px; font-size: 14px; color: #333; }
.contract-upload-form > div { height: 33px; margin-bottom: 3px; display: flex; align-items: center; }
.contract-upload-form span { width: 96px; text-align: right; }
.contract-upload-modal input { border: 1px solid #eee !important; background: #fff !important; outline: none; }
.contract-file-box { width: 250px; height: 28px; border: 1px solid #eee; box-sizing: border-box; display: flex; align-items: center; background: #fff; }
.contract-file-name { margin-left: 6px; font-size: 13px; font-weight: 400; }
.contract-upload-form input[type="file"] { display: none; }
.contract-upload-modal input.contract-attach-name,
.contract-upload-modal input.contract-upload-tip { width: 250px !important; height: 28px !important; border: 1px solid #eee !important; border-top: 1px solid #eee !important; border-right: 1px solid #eee !important; border-bottom: 1px solid #eee !important; border-left: 1px solid #eee !important; background: #fff !important; box-sizing: border-box; appearance: auto; }
.contract-upload-confirm { display: block; margin: 18px auto 0; height: 30px; padding: 0 14px; border: 0; border-radius: 2px; background: linear-gradient(#4b86dd, #1f63c6) !important; color: #fff; font-size: 15px; box-shadow: inset 0 1px 0 rgba(255,255,255,.55); }
.contract-image-input { display: inline-block; }
.contract-image-box { height: 480px; margin-top: 6px; border: 1px solid #b7b7b7; background: #fff; display: grid; gap: 4px; padding: 4px; box-sizing: border-box; overflow: hidden; }
.contract-image-box.layout-1 { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
.contract-image-box.layout-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); }
.contract-image-box.layout-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); }
.contract-image-box.layout-3 .cell-1 { grid-row: 1 / 3; grid-column: 1 / 2; }
.contract-image-box.layout-3 .cell-2 { grid-row: 1 / 2; grid-column: 2 / 3; }
.contract-image-box.layout-3 .cell-3 { grid-row: 2 / 3; grid-column: 2 / 3; }
.contract-image-box.layout-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); }
.contract-image-cell { width: 100%; height: 100%; min-width: 0; min-height: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.contract-image-cell img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.contract-remark { margin: 0; padding-top: 0; display: flex; align-items: flex-start; width: 100%; }
.contract-remark span { flex: 0 0 auto; white-space: nowrap; }
.contract-remark textarea { flex: 1 1 auto; width: auto; min-width: 0; min-height: 34px; height: auto; line-height: 22px; border: 0; border-bottom: 1px solid #9a9a9a; resize: none; overflow: visible; overflow-wrap: anywhere; white-space: pre-wrap; background: transparent; outline: none; font-size: 17px; color: #f00; field-sizing: content; }
.contract-pane p { margin: 0; }
.contract-sign { display: flex; justify-content: space-between; margin-top: 12px; font-size: 16px; font-weight: 700; }
.contract-party-name { display: inline-block; width: 64px; text-align: justify; text-align-last: justify; }
.contract-phone-name { display: inline-block; width: 64px; }
.contract-sign-right { width: 260px; text-align: left; }
.contract-date { margin-top: 12px; text-align: right; font-size: 16px; font-weight: 700; position: relative; }
.contract-date-wrap { display: inline-block; position: relative; width: 120px; height: 22px; vertical-align: middle; }
.contract-date-text { position: absolute; inset: 0; width: 120px !important; height: 22px !important; line-height: 22px; font-size: 16px !important; font-weight: 700; cursor: pointer; pointer-events: none; z-index: 1; box-sizing: border-box; }
.contract-date-picker { position: absolute; inset: 0; opacity: .01; width: 120px !important; height: 22px !important; line-height: 22px; cursor: pointer; z-index: 2; box-sizing: border-box; }
.contract-date-picker::-webkit-calendar-picker-indicator { display: none; }
.contract-date-picker::-webkit-inner-spin-button,
.contract-date-picker::-webkit-clear-button { display: none; }
.contract-upload-modal input.contract-attach-name,
.contract-upload-modal input.contract-upload-tip { width: 250px !important; height: 28px !important; border: 1px solid #eee !important; border-top: 1px solid #eee !important; border-right: 1px solid #eee !important; border-bottom: 1px solid #eee !important; border-left: 1px solid #eee !important; background: #fff !important; box-sizing: border-box; appearance: auto; }
.contract-upload-modal .contract-file-box { width: 250px !important; height: 28px !important; border: 1px solid #eee !important; box-sizing: border-box; display: flex; align-items: center; background: #fff !important; }
.contract-upload-modal .contract-file-btn { height: 25px !important; line-height: 23px !important; padding: 0 10px !important; border: 1px solid #5f9ed1 !important; border-top: 1px solid #dff3ff !important; border-left: 1px solid #dff3ff !important; border-right: 1px solid #3f7fb5 !important; border-bottom: 1px solid #3f7fb5 !important; background: linear-gradient(to bottom, #ffffff 0%, #d9f2ff 35%, #82c9ef 100%) !important; color: #000 !important; font-size: 13px !important; box-sizing: border-box; appearance: none !important; box-shadow: inset 0 1px 0 #fff !important; }
.contract-upload-modal .contract-upload-confirm { background: linear-gradient(to bottom, #6fb0ff 0%, #2f7ed8 55%, #1f63c6 100%) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important; }
.contract-customer-picker { display: none; position: fixed; inset: 0; z-index: 40; background: rgba(0,0,0,.08); align-items: center; justify-content: center; }
.contract-customer-picker.show { display: flex; }
.contract-picker-modal { width: 1100px; height: 870px; background: #fff; border: 1px solid #dcdcdc; display: flex; flex-direction: column; box-sizing: border-box; }
.contract-picker-head { flex: 0 0 38px; height: 38px; line-height: 38px; padding: 0 12px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; font-size: 16px; box-sizing: border-box; }
.contract-picker-close { border: 0; background: transparent; font-size: 22px; color: #777; cursor: pointer; }
.contract-picker-toolbar { flex: 0 0 100px; height: 100px; padding: 8px 12px; box-sizing: border-box; display: flex; align-items: center; position: relative; }
.contract-picker-toolbar .customer-filter { display: flex; align-items: center; gap: 0; height: 31px; margin-top: -40px; white-space: nowrap; }
.contract-picker-toolbar .customer-filter span { flex: 0 0 105px; width: 105px !important; height: 31px; line-height: 31px; margin: 0; padding: 0 8px 0 0 !important; border: 0 !important; background: transparent !important; box-sizing: border-box; text-align: right; font-size: 14px; color: #666; }
.contract-picker-toolbar .customer-filter input { flex: 0 0 150px; width: 150px !important; height: 31px; margin: 0; padding: 0 4px; border: 1px solid #999 !important; border-top: 1px solid #999 !important; border-right: 1px solid #999 !important; border-bottom: 1px solid #999 !important; border-left: 1px solid #999 !important; background: #fff !important; box-sizing: border-box; font-size: 14px; outline: none; }
.contract-picker-toolbar .customer-actions { margin-left: 12px; margin-top: -40px; display: flex; gap: 8px; }
.contract-picker-toolbar .customer-right { position: absolute; right: 12px; top: 54px; display: flex; gap: 8px; }
.contract-picker-toolbar .customer-right select { height: 26px !important; border: 1px solid #9a9a9a !important; border-top: 1px solid #9a9a9a !important; border-right: 1px solid #9a9a9a !important; border-bottom: 1px solid #9a9a9a !important; border-left: 1px solid #9a9a9a !important; border-radius: 0 !important; background: #fff !important; box-sizing: border-box; text-align: center; text-align-last: center; }
.contract-picker-toolbar .customer-right select:nth-child(1),
.contract-picker-toolbar .customer-right select:nth-child(2) { width: 120px; }
.contract-picker-toolbar .customer-right select:nth-child(3) { width: 52px; }
.contract-picker-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 0 8px 8px; box-sizing: border-box; }
.contract-picker-body table { width: 100%; border-collapse: collapse; font-size: 14px; table-layout: auto; }
.contract-picker-body th,
.contract-picker-body td { border: 1px solid #e6e6e6; height: 32px; padding: 0 6px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contract-picker-body th { background: #f7f7f7; font-weight: 400; }
.contract-picker-body th:nth-child(1), .contract-picker-body td:nth-child(1),
.contract-picker-body th:nth-child(2), .contract-picker-body td:nth-child(2),
.contract-picker-body th:nth-child(3), .contract-picker-body td:nth-child(3) { width: 44px; }
.contract-picker-body th:nth-child(5), .contract-picker-body td:nth-child(5) { width: 70px; }
.contract-picker-body th:nth-child(6), .contract-picker-body td:nth-child(6) { width: 90px; }
.contract-picker-body th:nth-child(7), .contract-picker-body td:nth-child(7) { width: 110px; }
.contract-picker-body th:nth-child(8), .contract-picker-body td:nth-child(8) { min-width: 180px; width: auto; }
.contract-picker-body tbody tr:hover td { background: #eaf6ff; }
.contract-pick-customer { color: #1890ff; text-decoration: none; }
.contract-picker-pager { flex: 0 0 42px; height: 42px; text-align: center; font-size: 14px; transform: translateY(0); display: flex; align-items: center; justify-content: center; gap: 6px; }
#contractCustomerJumpPage,
.contract-picker-pager input { width: 58px !important; height: 22px !important; border: 1px solid #999 !important; border-top: 1px solid #999 !important; border-right: 1px solid #999 !important; border-bottom: 1px solid #999 !important; border-left: 1px solid #999 !important; border-radius: 0 !important; background: #fff !important; text-align: center; box-sizing: border-box; }
.contract-picker-pager button { height: 24px; margin: 0 2px; }
#contractCustomerJumpPage,
.contract-picker-pager input { width: 58px !important; height: 22px !important; border: 1px solid #999 !important; border-top: 1px solid #999 !important; border-right: 1px solid #999 !important; border-bottom: 1px solid #999 !important; border-left: 1px solid #999 !important; border-radius: 0 !important; background: #fff !important; text-align: center; box-sizing: border-box; appearance: auto !important; }
.contract-picker-toolbar .customer-right select:nth-child(1),
.contract-picker-toolbar .customer-right select:nth-child(2) { width: 120px; }
.contract-picker-toolbar .customer-right select:nth-child(3) { width: 52px; }
.customer-save { min-width: 80px; width: auto; height: 30px; padding: 0 12px; border: 0; border-radius: 2px; background: #24a57a; color: #fff; font-size: 15px; white-space: nowrap; line-height: 30px; text-align: center; }
.customer-void { background: #d84b3d; }

.parameter-main { background: #fff; }
.parameter-head { position: relative; height: 110px; padding: 12px 14px 0; border-bottom: 1px solid #e3e7ea; }
.parameter-filter { display: inline-flex; align-items: center; margin-right: 54px; height: 32px; font-size: 14px; color: #333; }
.parameter-filter span { width: 78px; text-align: right; }
.parameter-filter input { width: 160px; height: 28px; border: 1px solid #333; }
.parameter-filter select { width: 190px; height: 28px; border: 1px solid #e5e5e5; color: #333; text-align: center; text-align-last: center; }
.parameter-actions { position: absolute; left: 14px; bottom: 12px; display: flex; gap: 10px; }
.parameter-right { position: absolute; right: 14px; bottom: 12px; display: flex; gap: 8px; }
.parameter-right select { height: 24px; border: 1px solid #e5e5e5; background: #fff; font-size: 13px; color: #333; }
.parameter-right select:nth-child(1) { width: 110px; }
.parameter-right select:nth-child(2) { width: 90px; }
.parameter-right select:nth-child(3) { width: 38px; }
.parameter-table-box table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.parameter-table-box th,
.parameter-table-box td { height: 28px; line-height: 28px; border: 1px solid #e5e9ec; font-size: 14px; text-align: center; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.parameter-table-box th { background: #fff; font-weight: 600; }
.parameter-table-box td a { color: #168aca; text-decoration: none; }
.parameter-table-box td input { width: 36px; height: 24px; border: 1px solid #aaa; text-align: center; }
.parameter-table-box tbody tr:hover td { background: #eaf6ff; }
.parameter-red { color: #d82020 !important; }
.parameter-green { color: #0c9b3a; }
.parameter-table-box th:nth-child(1), .parameter-table-box td:nth-child(1) { width: 44px; }
.parameter-table-box th:nth-child(2), .parameter-table-box td:nth-child(2),
.parameter-table-box th:nth-child(3), .parameter-table-box td:nth-child(3) { width: 50px; }
.parameter-table-box th:nth-child(4), .parameter-table-box td:nth-child(4) { width: 56px; }
.parameter-table-box th:nth-child(5), .parameter-table-box td:nth-child(5) { width: 76px; }
.parameter-table-box th:nth-child(6), .parameter-table-box td:nth-child(6) { width: 56px; }
.parameter-table-box th:nth-child(7), .parameter-table-box td:nth-child(7) { width: 86px; }
.parameter-table-box th:nth-child(8), .parameter-table-box td:nth-child(8) { width: 74px; }
.parameter-table-box th:nth-child(9), .parameter-table-box td:nth-child(9) { width: 74px; }
.parameter-table-box th:nth-child(10), .parameter-table-box td:nth-child(10) { width: 92px; }
.parameter-table-box th:nth-child(11), .parameter-table-box td:nth-child(11) { width: 60px; }
.parameter-table-box th:nth-child(12), .parameter-table-box td:nth-child(12) { width: auto; text-align: left; padding-left: 10px; }
.parameter-modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: flex; align-items: flex-start; justify-content: center; padding-top: 100px; z-index: 80; }
.parameter-modal { width: 700px; height: 500px; background: #fff; border: 1px solid #cfcfcf; display: flex; flex-direction: column; }
.parameter-modal-head { height: 34px; line-height: 34px; padding: 0 10px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; font-size: 14px; color: #333; }
.parameter-modal-close { border: 0; background: transparent; font-size: 18px; color: #999; cursor: pointer; }
.parameter-modal-body { flex: 1; padding: 12px 0 0 20px; font-size: 12px; color: #333; }
.parameter-form-row { height: 32px; line-height: 32px; display: flex; align-items: center; }
.parameter-form-row span { width: 70px; text-align: right; }
.parameter-form-row b { color: #c00; padding-right: 2px; }
.parameter-form-row input:not([type="checkbox"]),
.parameter-form-row select { width: 150px; height: 32px; border: 1px solid #e6e6e6; background: #fff; }
.parameter-name-input { border-color: #111 !important; }
.parameter-check { width: 150px; height: 32px; border: 1px solid #eee; display: flex; align-items: center; padding-left: 4px; }
.parameter-image-row { display: flex; align-items: center; margin: 12px 0 6px 0; padding-left: 0; }
.parameter-image-row button,
.parameter-file-row button { width: 54px; height: 22px; border: 0; background: #1fa6bd; color: #fff; font-size: 12px; }
.parameter-image-preview { width: 100px; height: 60px; margin-left: 16px; border: 1px solid #eee; background: #f4f4f4; color: #aaa; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 4px; }
.parameter-text-row { display: flex; align-items: flex-start; margin-top: 8px; }
.parameter-text-row span,
.parameter-file-row span { width: 70px; text-align: right; }
.parameter-text-row textarea { width: 230px; height: 38px; border: 1px solid #eee; resize: none; }
.parameter-file-row { height: 30px; display: flex; align-items: center; }
.parameter-modal-foot { height: 32px; background: #f1f1f1; display: flex; justify-content: center; align-items: center; }
.parameter-save-btn { width: 70px; height: 35px; border: 0; background: #13a66f; color: #fff; border-radius: 2px; font-size: 14px; }
.parameter-pager { padding: 4px 0 0 2px; font-size: 14px; line-height: 18px; color: #555; white-space: nowrap; }
.parameter-pager button { color: #1890ff; }
.parameter-pager input { width: 36px; height: 18px; margin: 0 1px; padding: 0; border: 1px solid #bbb; text-align: center; font-size: 14px; }
.contract-modal-body select {
  display: inline-block !important;
  height: 22px !important;
  line-height: 22px !important;
  text-align: center !important;
  text-align-last: center !important;
  padding: 0 !important;
  vertical-align: baseline !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background: transparent !important;
  background-image: none !important;
}
.contract-modal-body select::-ms-expand { display: none; }
.contract-modal-body select option { text-align: center !important; }
.link-button { border: 0; background: transparent; padding: 0; color: #1890ff; font: inherit; cursor: pointer; }
.link-button:hover { text-decoration: underline; }
.customer-modal:not([style]) { width: 760px; height: 690px; }
.customer-modal:not([style]) .customer-modal-head { height: 34px; line-height: 34px; font-size: 14px; }
.customer-modal:not([style]) .customer-modal-body { padding: 10px 8px 0; }
.customer-modal:not([style]) .customer-form-grid { display: grid; grid-template-columns: 270px 270px; column-gap: 26px; row-gap: 8px; align-items: start; }
.customer-modal:not([style]) .customer-field span { width: 76px; flex: 0 0 76px; font-size: 12px; }
.customer-modal:not([style]) .customer-field input,
.customer-modal:not([style]) .customer-field select { width: 150px; height: 26px; font-size: 12px; }
.customer-modal:not([style]) .customer-wide { grid-column: 1 / span 2; }
.customer-modal:not([style]) .customer-wide input { width: 420px; }
.customer-modal:not([style]) .customer-textarea { grid-column: 1 / span 1; }
.customer-modal:not([style]) .customer-textarea textarea { width: 190px; height: 50px; font-size: 12px; }
.customer-modal:not([style]) .customer-modal-foot { height: 34px; background: #f1f1f1; }
.contract-customer-info-mask { z-index: 70; background: rgba(0,0,0,0.18); }
.contract-customer-info-modal { width: 760px !important; height: 690px !important; }
.contract-customer-info-modal .customer-modal-head { height: 34px; line-height: 34px; font-size: 14px; }
.contract-customer-info-modal .customer-modal-body { padding: 10px 8px 0; }
.contract-customer-info-modal .customer-form-grid { grid-template-columns: 270px 270px; column-gap: 26px; row-gap: 8px; }
.contract-customer-info-modal .customer-field span { width: 76px; flex: 0 0 76px; font-size: 12px; }
.contract-customer-info-modal .customer-field input,
.contract-customer-info-modal .customer-field select { width: 150px; height: 26px; font-size: 12px; }
.contract-customer-info-modal .customer-wide input { width: 420px; }
.contract-customer-info-modal .customer-textarea textarea { width: 190px; height: 50px; font-size: 12px; }
.contract-customer-info-modal .customer-modal-foot { height: 34px; background: #f1f1f1; }
.dispatch-modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 90; display: flex; align-items: flex-start; justify-content: center; padding-top: 16px; }
.dispatch-modal { width: 1120px; height: 900px; background: #fff; display: flex; flex-direction: column; overflow: hidden; }
.dispatch-modal-head { height: 34px; line-height: 34px; padding: 0 12px; display: flex; justify-content: space-between; color: #333; font-size: 14px; }
.dispatch-modal-close { border: 0; background: transparent; font-size: 18px; color: #888; cursor: pointer; }
.dispatch-modal-scroll { flex: 1; overflow-y: auto; display: flex; justify-content: center; }
.dispatch-sheet { width: 820px; min-height: 1110px; border: 1px solid #333; margin: 0 auto; padding-top: 8px; box-sizing: border-box; color: #111; font-size: 17px; }
.dispatch-title { height: 48px; line-height: 48px; text-align: center; border-bottom: 1px solid #333; font-size: 26px; font-weight: 700; }
.dispatch-row { display: flex; align-items: center; gap: 0; min-height: 52px; padding: 0 12px 0 10px; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; font-size: 17px; line-height: 26px; }
.dispatch-row span { width: auto; text-align: left; white-space: nowrap; flex: 0 0 auto; font-size: 17px; line-height: 26px; }
.dispatch-row > span:first-child { text-align: left; }
.dispatch-row .dispatch-long-label { width: auto; flex-basis: auto; }
.dispatch-row input { width: 295px; height: 26px; border: 0; border-bottom: 1px solid #333; outline: none; font-size: 17px; flex: 0 0 295px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dispatch-date-box { position: relative; display: inline-flex; align-items: center; width: 295px; height: 26px; flex: 0 0 295px; }
.dispatch-date-box .dispatch-date-text { width: 295px; height: 26px; flex: 0 0 295px; padding: 0; box-sizing: border-box; cursor: pointer; }
.dispatch-row input:disabled,
.dispatch-row select:disabled,
.dispatch-row textarea:disabled,
.dispatch-check-input:disabled,
.dispatch-date-text:disabled,
.dispatch-worker-select:disabled { color: #111 !important; opacity: 1 !important; -webkit-text-fill-color: #111 !important; }
.dispatch-row input:disabled,
.dispatch-date-text:disabled { background: transparent !important; }
.dispatch-worker-select:disabled { background: #fff !important; }
.dispatch-check-input:disabled { filter: none !important; }
.dispatch-date-box .dispatch-date-picker { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0 !important; pointer-events: none; color: transparent !important; -webkit-text-fill-color: transparent !important; background: transparent !important; border: 0 !important; }
.dispatch-date-box .dispatch-date-picker::-webkit-datetime-edit,
.dispatch-date-box .dispatch-date-picker::-webkit-datetime-edit-text,
.dispatch-date-box .dispatch-date-picker::-webkit-datetime-edit-year-field,
.dispatch-date-box .dispatch-date-picker::-webkit-datetime-edit-month-field,
.dispatch-date-box .dispatch-date-picker::-webkit-datetime-edit-day-field,
.dispatch-date-box .dispatch-date-picker::-webkit-calendar-picker-indicator { opacity: 0 !important; color: transparent !important; }
.dispatch-date-box .dispatch-date-picker:disabled { pointer-events: none; }
.dispatch-row b { font-weight: 400 !important; white-space: nowrap; word-break: keep-all; flex: 0 0 auto; display: inline-block; font-size: 17px; line-height: 26px; }
.dispatch-row label { display: inline-flex; align-items: center; gap: 0; white-space: nowrap; flex: 0 0 auto; margin: 0; }
.dispatch-row label input { margin: 0; }
.dispatch-profile-row { gap: 0; justify-content: flex-start; }
.dispatch-profile-row input[type="text"],
.dispatch-profile-row > input { width: 130px; flex-basis: 130px; margin-right: 4px; }
.dispatch-profile-row .dispatch-profile-thickness-input { width: 90px; flex-basis: 90px; }
.dispatch-profile-row label { margin: 0; display: inline-flex; align-items: center; gap: 0; flex: 0 0 auto; white-space: nowrap; }
.dispatch-row label input { width: 13px; height: 13px; margin: 0; }
.dispatch-check-text { display: inline-flex; align-items: center; gap: 0; margin: 0 4px 0 0; padding: 0; white-space: nowrap; flex: 0 0 auto; line-height: 26px; }
.dispatch-check-input { width: 13px !important; height: 13px !important; margin: 0 !important; padding: 0 !important; flex: 0 0 13px !important; appearance: auto !important; -webkit-appearance: checkbox !important; vertical-align: middle; }
.dispatch-size input { width: 58px; flex-basis: 58px; }
.dispatch-size b { white-space: nowrap; word-break: keep-all; flex: 0 0 auto; }
.dispatch-small-size input { width: 60px; flex-basis: 60px; }
.dispatch-small-size .dispatch-small-width-input { width: 60px; flex-basis: 60px; }
.dispatch-small-size .dispatch-small-height-input { width: 60px; flex-basis: 60px; }
.dispatch-small-size .dispatch-install-position-input { width: 80px; flex-basis: 80px; }
.dispatch-small-size .dispatch-small-open-input { width: 80px; flex-basis: 80px; }
.dispatch-small-size .dispatch-small-leg-input { width: 70px; flex-basis: 70px; }
.dispatch-door-leg-input { width: 70px !important; flex-basis: 70px !important; }
.dispatch-extra-row input { width: 120px; flex-basis: 120px; }
.dispatch-extra-row span { width: auto; flex: 0 0 auto; min-width: 0; text-align: left; }
.dispatch-extra-row span:first-child { min-width: 0; }
.dispatch-extra-row .dispatch-long-label { width: auto; flex-basis: auto; min-width: 0; }
.dispatch-extra-text { width: 210px; flex: 0 0 210px; font-style: normal; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid #333; min-height: 26px; height: 26px; line-height: 26px; font-size: 17px; box-sizing: border-box; }
.dispatch-extra-short { width: 100px; flex-basis: 100px; }
.dispatch-install-method-text { width: 120px; flex-basis: 120px; }
.dispatch-door-direction-text,
.dispatch-lock-text { width: 90px; flex-basis: 90px; }
.dispatch-remark { display: flex; align-items: flex-start; padding: 0 10px; min-height: 38px; }
.dispatch-remark span { width: auto; text-align: left; padding-top: 0; flex: 0 0 auto; line-height: 26px; }
.dispatch-remark em { flex: 1; min-height: 26px; border-bottom: 1px solid #333; font-size: 17px; line-height: 24px; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; color: #ff0000; font-style: normal; box-sizing: border-box; }
.dispatch-image-label { text-align: center; height: 64px; line-height: 24px; padding-top: 20px; box-sizing: border-box; }
.dispatch-image-box { width: 560px; height: 350px; margin: 0 auto 52px; border: 0 !important; background: transparent !important; }
.dispatch-bottom { border-top: 1px solid #333; padding-top: 8px; }
.dispatch-bottom .dispatch-row { justify-content: flex-start; }
.dispatch-bottom .dispatch-row span { width: 66px; }
.dispatch-worker-select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background: transparent; background-image: none; border: 0; border-bottom: 1px solid #333; outline: none; width: 300px; flex: 0 0 300px; height: 26px; font-size: 17px; text-align: center; text-align-last: center; }
.dispatch-bottom-date-row span { width: auto !important; flex: 0 0 auto; }
.dispatch-bottom-date-row .dispatch-date-box { width: 300px; flex: 0 0 300px; }
.dispatch-bottom-date-row .dispatch-date-box .dispatch-date-text { width: 300px; flex: 0 0 300px; }
.dispatch-bottom .dispatch-wide { width: 380px; flex: none; }
.dispatch-wide { flex: 1; }
.dispatch-record-mask { position: fixed; inset: 0; z-index: 70; background: rgba(0,0,0,0.35); display: flex; align-items: flex-start; justify-content: center; padding-top: 70px; }
.dispatch-record-modal { width: 1600px; height: 870px; background: #fff; border: 1px solid #bfbfbf; box-shadow: 0 8px 26px rgba(0,0,0,.22); }
.dispatch-record-head { height: 38px; line-height: 38px; padding: 0 12px; background: #f2f2f2; display: flex; justify-content: space-between; align-items: center; font-size: 15px; }
.dispatch-record-close { border: 0; background: transparent; font-size: 18px; color: #888; cursor: pointer; }
.dispatch-record-body { padding: 12px; overflow: auto; height: calc(870px - 38px); }
.dispatch-record-body table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.dispatch-record-body th,
.dispatch-record-body td { height: 31px; border: 1px solid #e5e8eb; line-height: 31px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #333; font-weight: 400; }
.dispatch-record-body thead th { border-top: 0; }
.dispatch-record-body th:nth-child(1), .dispatch-record-body td:nth-child(1) { width: 44px; }
.dispatch-record-body th:nth-child(2), .dispatch-record-body td:nth-child(2) { width: 44px; }
.dispatch-record-body th:nth-child(3), .dispatch-record-body td:nth-child(3) { width: 70px; }
.dispatch-record-body th:nth-child(4), .dispatch-record-body td:nth-child(4) { width: 122px; }
.dispatch-record-body th:nth-child(5), .dispatch-record-body td:nth-child(5) { width: 122px; }
.dispatch-record-body th:nth-child(6), .dispatch-record-body td:nth-child(6) { width: 70px; }
.dispatch-record-body th:nth-child(7), .dispatch-record-body td:nth-child(7) { width: 70px; }
.dispatch-record-body th:nth-child(8), .dispatch-record-body td:nth-child(8) { width: 70px; }
.dispatch-record-body th:nth-child(9), .dispatch-record-body td:nth-child(9) { width: 70px; }
.dispatch-record-body th:nth-child(10), .dispatch-record-body td:nth-child(10) { width: auto; min-width: 160px; }
.dispatch-record-body th:nth-child(17), .dispatch-record-body td:nth-child(17) { width: 70px; }
.dispatch-record-body th:nth-child(18), .dispatch-record-body td:nth-child(18) { width: 70px; }
.dispatch-record-body th:nth-child(19), .dispatch-record-body td:nth-child(19) { width: 122px; }
.dispatch-modal-foot { height: 46px; flex: 0 0 46px; background: #f2f2f2; display: flex; align-items: center; justify-content: center; gap: 8px; }
.dispatch-save-btn,
.dispatch-edit-btn,
.dispatch-complete-btn,
.dispatch-print-btn,
.dispatch-void-btn { min-width: 50px; width: auto; padding: 0 10px; height: 28px; border: 0; color: #fff; white-space: nowrap; }
.dispatch-save-btn,
.dispatch-edit-btn { background: #1aa37a; }
.dispatch-complete-btn { background: #722ed1; }
.dispatch-print-btn { background: #b4b534; }
.dispatch-void-btn { background: #c23b22; }
@media print {
  @page { size: A4 portrait; margin: 8mm; }
  html, body { width: 210mm !important; min-height: 297mm !important; margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body * { visibility: hidden !important; }
  .dispatch-modal-mask, .dispatch-modal-mask * { visibility: visible !important; }
  .dispatch-modal-mask { position: fixed !important; left: 0 !important; top: 0 !important; width: 210mm !important; min-height: 297mm !important; background: #fff !important; padding: 0 !important; margin: 0 !important; display: block !important; overflow: visible !important; }
  .dispatch-modal { width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; display: block !important; overflow: visible !important; background: #fff !important; }
  .dispatch-modal-head, .dispatch-modal-foot { display: none !important; }
  .dispatch-modal-scroll { display: block !important; overflow: visible !important; height: auto !important; width: auto !important; }
  .dispatch-sheet { margin: 0 !important; page-break-inside: avoid !important; transform: scale(0.95); transform-origin: top left; }
}

.paint-main { background:#f5f7fb; padding:24px; box-sizing:border-box; }
.paint-head { display:flex; align-items:center; justify-content:space-between; height:72px; margin-bottom:22px; padding:0 22px; background:#fff; border:1px solid #e5e8eb; box-shadow:0 2px 8px rgba(0,0,0,.04); }
.paint-head strong { display:block; font-size:22px; color:#222; line-height:30px; }
.paint-head p { margin:0; font-size:13px; color:#888; }
.paint-add-btn { width:72px; height:32px; border:0; border-radius:3px; background:#2f8dc8; color:#fff; font-size:14px; }
.paint-grid { display:grid; grid-template-columns:repeat(3, minmax(180px, 1fr)); gap:22px; max-width:980px; }
.paint-card { height:150px; padding:20px 18px; border:1px solid #e1e6eb; background:#fff; text-align:left; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,.05); }
.paint-card:hover { border-color:#2f8dc8; box-shadow:0 8px 20px rgba(47,141,200,.16); }
.paint-card-icon { display:flex; align-items:center; justify-content:center; width:36px; height:36px; margin-bottom:14px; border-radius:8px; background:#eaf6ff; color:#2f8dc8; font-size:18px; font-weight:700; }
.paint-card b { display:block; margin-bottom:8px; font-size:18px; color:#222; font-weight:700; }
.paint-card em { display:block; font-style:normal; font-size:13px; line-height:20px; color:#666; }

@media (max-width: 768px) {
  .shell { display:block; height:auto; min-height:100vh; overflow:auto; }
  .sidebar { width:100%; height:auto; flex-direction:row; flex-wrap:wrap; align-items:stretch; overflow:auto; }
  .sidebar-top { width:100%; height:36px; line-height:36px; font-size:15px; }
  .sidebar-group { width:100%; padding:8px 10px 4px; font-size:13px; text-align:left; }
  .sidebar-item { flex:1 0 25%; min-width:78px; padding:10px 4px; font-size:13px; box-sizing:border-box; }
  .sidebar-item.active::before, .sidebar-item:hover::before { display:none; }
  .sidebar-foot { display:none; }
  .main { width:100%; min-height:calc(100vh - 120px); }
  .paint-main { padding:12px; }
  .paint-head { height:auto; min-height:58px; margin-bottom:12px; padding:10px 12px; }
  .paint-head strong { font-size:18px; line-height:24px; }
  .paint-head p { font-size:12px; }
  .paint-add-btn { width:64px; height:32px; }
  .paint-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; max-width:none; }
  .paint-card { height:118px; padding:12px 10px; border-radius:8px; }
  .paint-card-icon { width:30px; height:30px; margin-bottom:8px; border-radius:7px; font-size:15px; }
  .paint-card b { margin-bottom:5px; font-size:15px; }
  .paint-card em { font-size:12px; line-height:17px; }
}
@media (max-width: 420px) {
  .sidebar-item { flex-basis:33.333%; min-width:70px; font-size:12px; }
  .paint-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
  .paint-card { height:112px; }
}

.mobile-work-main { background:#f5f7fb; padding:16px; box-sizing:border-box; }
.mobile-work-head { padding:12px 10px 14px; margin-bottom:12px; background:#fff; border:1px solid #e5e8eb; border-radius:10px; }
.mobile-work-head strong { display:block; font-size:20px; color:#222; }
.mobile-work-head span { display:block; margin-top:4px; font-size:12px; color:#777; }
.mobile-work-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
.mobile-work-card { min-height:96px; padding:14px 12px; border:0; border-radius:12px; background:linear-gradient(180deg,#fff,#f7fbff); box-shadow:0 4px 14px rgba(0,0,0,.06); text-align:left; }
.mobile-work-card b { display:block; margin-bottom:6px; font-size:16px; color:#1f2d3d; }
.mobile-work-card em { display:block; font-style:normal; font-size:12px; line-height:17px; color:#666; }
@media (max-width: 768px) {
  .mobile-work-grid { grid-template-columns:1fr; }
}

.mobile-hero { padding:18px 16px; margin-bottom:14px; border-radius:14px; background:linear-gradient(135deg,#1e88e5,#16a085); color:#fff; box-shadow:0 8px 22px rgba(30,136,229,.24); }
.mobile-hero strong { display:block; font-size:22px; line-height:30px; }
.mobile-hero span { display:block; margin-top:8px; padding:8px 10px; border-radius:8px; background:rgba(255,255,255,.18); font-size:15px; }
.mobile-hero em { display:block; margin-top:10px; font-style:normal; font-size:13px; line-height:20px; opacity:.95; }
.mobile-work-section, .mobile-checklist { margin-bottom:14px; padding:12px; border-radius:12px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.05); }
.mobile-section-title { margin-bottom:10px; font-size:15px; font-weight:700; color:#222; }
.mobile-checklist p { margin:7px 0; font-size:13px; line-height:20px; color:#555; }
@media (max-width: 768px) {
  .mobile-work-main { padding:10px; }
  .mobile-hero strong { font-size:20px; }
  .mobile-work-card { min-height:82px; }
}

.paint-card { min-height:150px; height:auto; }
@media (max-width: 768px) { .paint-card { min-height:128px; height:auto; } }

.grid-detail-mask { position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(0,0,0,.35); box-sizing:border-box; }
.grid-detail-modal { width:420px; max-width:100%; background:#fff; border-radius:12px; box-shadow:0 12px 32px rgba(0,0,0,.22); overflow:hidden; }
.grid-detail-head { height:44px; line-height:44px; padding:0 14px; background:#2f8dc8; color:#fff; font-size:17px; font-weight:700; display:flex; justify-content:space-between; align-items:center; }
.grid-detail-close { border:0; background:transparent; color:#fff; font-size:22px; line-height:1; }
.grid-detail-body { padding:16px; font-size:14px; line-height:22px; color:#333; }
.grid-detail-body p { margin:0 0 10px; }
.grid-detail-body button { width:100%; height:38px; border:0; border-radius:6px; background:#1aa37a; color:#fff; font-size:15px; }

.mobile-form-main { background:#f5f7fb; padding:12px; box-sizing:border-box; }
.mobile-form-head { height:46px; display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.mobile-form-head strong { font-size:18px; color:#222; }
.mobile-back-btn { width:54px; height:32px; border:0; border-radius:6px; background:#e9eef3; color:#333; }
.mobile-form-card { padding:12px; border-radius:12px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.05); }
.mobile-form-card label { display:block; margin-bottom:10px; }
.mobile-form-card span { display:block; margin-bottom:5px; font-size:13px; color:#555; }
.mobile-form-card input, .mobile-form-card textarea { width:100%; box-sizing:border-box; border:1px solid #dfe5e8; border-radius:7px; padding:9px 10px; font-size:15px; background:#fff; }
.mobile-form-card textarea { min-height:70px; resize:vertical; }
.mobile-save-btn { width:100%; height:42px; margin-top:4px; border:0; border-radius:8px; background:#1aa37a; color:#fff; font-size:16px; }

.readonly-order-card input, .readonly-order-card textarea { background:#f8f9fa; color:#111; opacity:1; -webkit-text-fill-color:#111; pointer-events:none; }
.mobile-form-actions { display:flex; gap:8px; margin-top:8px; }
.mobile-action-btn { flex:1; height:40px; border:0; border-radius:8px; color:#fff; font-size:15px; }
.mobile-action-btn.green { background:#1aa37a; }
.mobile-action-btn.blue { background:#2f8dc8; }
.mobile-action-btn.gray { background:#8b99a6; }

.order-sheet-readonly { background:#fff; border-radius:10px; padding:10px; box-shadow:0 4px 14px rgba(0,0,0,.05); }
.order-sheet-readonly .dispatch-sheet { width:100%; min-height:0; box-shadow:none; border:0; padding:10px; box-sizing:border-box; }
.order-sheet-readonly input { pointer-events:none; color:#111; opacity:1; -webkit-text-fill-color:#111; }
.order-sheet-readonly .dispatch-image-box { max-width:100%; }
@media (max-width: 768px) {
  .order-sheet-readonly .dispatch-row { flex-wrap:wrap; height:auto; min-height:28px; }
  .order-sheet-readonly .dispatch-row span { width:78px; }
  .order-sheet-readonly .dispatch-row input { flex:1 1 160px; min-width:120px; }
  .order-sheet-readonly .dispatch-size b { margin-left:4px; }
}

.order-mobile-sheet { padding:12px; border-radius:14px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.06); }
.order-mobile-title { margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid #edf0f2; font-size:20px; font-weight:700; color:#222; text-align:center; }
.order-section-title { margin:14px 0 8px; padding-left:8px; border-left:4px solid #2f8dc8; font-size:15px; font-weight:700; color:#333; }
.order-info-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
.order-info-grid.compact { grid-template-columns:repeat(2, minmax(0, 1fr)); }
.order-info-item { min-height:54px; padding:8px 9px; border:1px solid #e5e8eb; border-radius:9px; background:#f9fbfc; box-sizing:border-box; }
.order-info-item span { display:block; margin-bottom:5px; font-size:12px; color:#777; }
.order-info-item b { display:block; min-height:20px; font-size:15px; color:#111; font-weight:400; word-break:break-all; }
.order-remark-box { min-height:58px; padding:10px; border:1px solid #e5e8eb; border-radius:9px; background:#f9fbfc; font-size:14px; line-height:21px; color:#111; white-space:pre-wrap; }
.order-image-box { min-height:130px; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px; border:1px dashed #cfd8df; border-radius:10px; background:#fafafa; color:#999; }
.order-image-box img { max-width:100%; max-height:220px; border-radius:8px; object-fit:contain; }
@media (max-width: 420px) { .order-info-grid, .order-info-grid.compact { grid-template-columns:1fr; } }

.order-task-list { display:flex; flex-direction:column; gap:10px; }
.order-task-card { width:100%; padding:12px; border:1px solid #e5e8eb; border-radius:10px; background:#fff; text-align:left; box-shadow:0 3px 10px rgba(0,0,0,.04); }
.order-task-card b { display:block; margin-bottom:6px; font-size:16px; color:#222; }
.order-task-card span { display:block; margin-bottom:6px; font-size:13px; color:#666; }
.order-task-card em { display:inline-block; padding:2px 8px; border-radius:12px; background:#eaf6ff; color:#2f8dc8; font-size:12px; font-style:normal; }
.order-empty { padding:20px; border-radius:10px; background:#fff; color:#999; text-align:center; }

.order-image-box { justify-content:flex-start; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; }
.order-image-box img { flex:0 0 88%; width:88%; max-width:88%; height:auto; max-height:none; scroll-snap-align:center; object-fit:contain; background:#fff; }
.order-image-box span { width:100%; text-align:center; }

.order-mobile-sheet { padding-bottom:86px; }
.order-image-box { min-height:220px; max-height:260px; align-items:center; }
.order-image-box img { max-height:240px; }
.order-mobile-sheet .mobile-form-actions { position:sticky; bottom:0; margin:12px -12px -12px; padding:10px 12px; background:#fff; box-shadow:0 -4px 12px rgba(0,0,0,.06); border-radius:0 0 14px 14px; }

.order-mobile-sheet .mobile-form-actions { position:static; margin:12px 0 0; padding:0; box-shadow:none; border-radius:0; background:transparent; }
.order-mobile-sheet { padding-bottom:16px; }
.order-image-box { overflow-x:auto; overflow-y:visible; -webkit-overflow-scrolling:touch; }

.order-month-summary { margin:10px 12px; padding:12px; border-radius:12px; background:#eef7ff; display:flex; flex-direction:column; gap:4px; color:#1f4f7a; }
.order-month-summary b { font-size:16px; }
.order-month-summary span, .order-month-summary em { font-style:normal; font-size:13px; color:#456; }

.mobile-login-page { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:18px; background:linear-gradient(160deg,#e8f3ff,#f8fbff); box-sizing:border-box; }
.mobile-login-card { width:100%; max-width:420px; background:#fff; border-radius:18px; padding:22px; box-shadow:0 12px 32px rgba(30,80,140,.16); box-sizing:border-box; }
.mobile-login-title { font-size:26px; font-weight:800; color:#1d3557; text-align:center; }
.mobile-login-subtitle { margin:8px 0 18px; text-align:center; color:#667; font-size:14px; }
.mobile-login-input { display:flex; gap:8px; margin-bottom:14px; }
.mobile-login-input input { flex:1; height:42px; border:1px solid #d8e3ef; border-radius:10px; padding:0 12px; font-size:15px; }
.mobile-login-input button,.mobile-login-open { border:0; border-radius:10px; background:#1f7aec; color:#fff; font-weight:700; padding:0 16px; min-height:42px; }
.mobile-login-users { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mobile-login-user { border:1px solid #d8e3ef; background:#f8fbff; border-radius:12px; padding:12px; text-align:left; }
.mobile-login-user b { display:block; font-size:16px; color:#123; }
.mobile-login-user span,.mobile-login-empty { font-size:12px; color:#667; }
.mobile-login-open { margin-top:12px; width:100%; }

.mobile-login-page { align-items:stretch; background:linear-gradient(180deg,#1976f3 0%,#54a3ff 42%,#f4f8ff 42%,#f4f8ff 100%); padding:28px 18px; }
.app-login-card { align-self:flex-start; margin-top:34px; border-radius:26px; padding:28px 22px 18px; box-shadow:0 18px 42px rgba(17,72,150,.22); }
.app-login-logo { width:74px; height:74px; margin:-60px auto 12px; border-radius:22px; background:linear-gradient(145deg,#ffcf61,#ff8b2c); color:#fff; display:flex; align-items:center; justify-content:center; font-size:38px; font-weight:900; box-shadow:0 12px 24px rgba(255,139,44,.32); }
.app-login-card .mobile-login-title { font-size:28px; letter-spacing:1px; }
.app-login-card .mobile-login-subtitle { margin-bottom:24px; }
.app-login-label { display:block; margin:0 0 8px; color:#344; font-size:14px; font-weight:700; }
.app-login-input { background:#f6f9ff; border:1px solid #dbe8f7; border-radius:16px; padding:6px; }
.app-login-input input { border:0; background:transparent; height:44px; }
.app-login-input button { border-radius:13px; min-width:86px; background:linear-gradient(135deg,#1677ff,#0358d8); }
.app-login-divider { display:flex; align-items:center; gap:10px; margin:20px 0 12px; color:#899; font-size:13px; }
.app-login-divider:before,.app-login-divider:after { content:''; flex:1; height:1px; background:#e2eaf3; }
.app-login-users { grid-template-columns:1fr; max-height:280px; overflow:auto; padding-right:2px; }
.app-login-users .mobile-login-user { display:flex; justify-content:space-between; align-items:center; border-radius:16px; background:#fff; box-shadow:0 5px 16px rgba(50,90,140,.08); }
.app-login-users .mobile-login-user span { background:#eef6ff; color:#2674d9; padding:4px 8px; border-radius:999px; }
.app-login-tip { text-align:center; color:#8a96a8; font-size:12px; margin-top:16px; }

.paint-wait-card { position:relative; display:flex; align-items:center; gap:10px; padding:10px; }
.paint-wait-main { flex:1; display:flex; align-items:center; gap:12px; border:0; background:transparent; text-align:left; padding:0; }
.paint-wait-thumb { width:76px; height:76px; flex:0 0 76px; object-fit:cover; border-radius:12px; background:#f3f6fb; }
.empty-thumb { display:flex; align-items:center; justify-content:center; color:#9aa; font-size:12px; }
.paint-wait-info { min-width:0; flex:1; display:flex; flex-direction:column; gap:4px; }
.paint-wait-info b,.paint-wait-info span,.paint-wait-info em,.paint-wait-info small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-wait-info em { color:#2563eb; font-style:normal; }
.paint-wait-info small { color:#999; }
.paint-wait-check { width:38px; height:38px; flex:0 0 38px; position:relative; }
.paint-wait-check input { position:absolute; inset:0; opacity:0; }
.paint-wait-check span { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:2px solid #9bb7dc; border-radius:10px; color:transparent; background:#fff; font-weight:900; }
.paint-wait-check input:checked + span { background:#1677ff; color:#fff; border-color:#1677ff; }
.paint-batch-bar { position:sticky; bottom:0; padding:10px 12px; background:#fff; box-shadow:0 -4px 14px rgba(0,0,0,.08); }
.paint-batch-bar .mobile-action-btn { width:100%; }

.paint-stat-card { background:#fff; border-radius:14px; box-shadow:0 4px 14px rgba(31,80,140,.08); overflow:hidden; }
.paint-stat-main { width:100%; border:0; background:#fff; text-align:left; padding:14px; display:flex; flex-direction:column; gap:5px; }
.paint-stat-main b { font-size:16px; color:#1f2937; }
.paint-stat-main span { color:#2563eb; }
.paint-stat-main em { color:#667; font-style:normal; }
.paint-stat-detail { border-top:1px solid #edf1f7; padding:10px; display:flex; flex-direction:column; gap:10px; }
.paint-stat-item { display:flex; gap:10px; align-items:center; background:#f8fbff; border-radius:12px; padding:8px; }
.paint-stat-item img,.paint-stat-empty { width:56px; height:56px; flex:0 0 56px; object-fit:cover; border-radius:10px; background:#eef2f7; display:flex; align-items:center; justify-content:center; color:#9aa; font-size:12px; }
.paint-stat-item div { min-width:0; }
.paint-stat-item b,.paint-stat-item em,.paint-stat-item small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-stat-item em { color:#667; font-style:normal; }
.paint-stat-item small { color:#2563eb; }

.paint-finish-btn { width:100%; border:0; border-radius:12px; background:#16a34a; color:#fff; font-weight:800; padding:12px; font-size:15px; margin-top:6px; }

.image-preview-mask { position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,.88); display:flex; align-items:center; justify-content:center; padding:14px; box-sizing:border-box; }
.image-preview-mask img { max-width:100%; max-height:100%; object-fit:contain; border-radius:8px; background:#fff; }
.image-preview-close { position:absolute; top:12px; right:12px; width:42px; height:42px; border:0; border-radius:50%; background:rgba(255,255,255,.18); color:#fff; font-size:30px; line-height:42px; }
.paint-stat-item img { cursor:pointer; }

.paint-thumb-wrap { position:relative; width:56px; height:56px; flex:0 0 56px; }
.paint-thumb-wrap img { width:56px; height:56px; object-fit:cover; border-radius:10px; background:#eef2f7; }
.paint-thumb-wrap i { position:absolute; right:2px; bottom:2px; padding:1px 5px; border-radius:999px; background:rgba(0,0,0,.62); color:#fff; font-style:normal; font-size:10px; }
.image-preview-strip { width:100%; height:100%; display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; align-items:center; gap:16px; }
.image-preview-strip img { flex:0 0 100%; max-width:100%; max-height:100%; object-fit:contain; scroll-snap-align:center; }

.gilding-stat-item { align-items:center; }
.gilding-stat-item > div:not(.paint-thumb-wrap) { flex:1; min-width:0; }
.gilding-row-finish { flex:0 0 54px; border:0; border-radius:10px; background:#16a34a; color:#fff; font-weight:800; padding:8px 0; }
.gilding-done-text { flex:0 0 54px; color:#16a34a; font-weight:800; text-align:center; font-size:13px; }

.mobile-login-submit { width:100%; margin-top:18px; height:46px; border:0; border-radius:14px; background:linear-gradient(135deg,#1677ff,#0358d8); color:#fff; font-weight:800; }
.app-login-card .app-login-label + .app-login-input { margin-bottom:12px; }
.app-login-input input[type='password'] { flex:1; }

.paint-color-table-wrap { margin-top:14px; overflow:auto; background:#fff; border-radius:14px; box-shadow:0 6px 18px rgba(15,23,42,.08); }
.paint-color-table { width:100%; border-collapse:collapse; font-size:15px; }
.paint-color-table th, .paint-color-table td { padding:12px 14px; border-bottom:1px solid #e5e7eb; text-align:left; }
.paint-color-table th { background:#f8fafc; color:#334155; font-weight:800; }
.paint-color-table td:nth-child(3), .paint-color-table th:nth-child(3) { text-align:center; width:80px; }

.paint-color-edit-btn { border:0; border-radius:8px; background:#1677ff; color:#fff; padding:6px 12px; font-weight:700; }
.paint-color-edit-mask { position:fixed; inset:0; z-index:9999; background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center; padding:18px; }
.paint-color-edit-modal { width:min(420px,96vw); background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 18px 50px rgba(15,23,42,.25); }
.paint-color-edit-body { padding:18px; display:grid; gap:12px; }
.paint-color-edit-body label { display:grid; gap:6px; color:#334155; font-weight:700; }
.paint-color-edit-body input { height:38px; border:1px solid #d1d5db; border-radius:10px; padding:0 10px; font-size:15px; }
.paint-color-edit-save { height:42px; border:0; border-radius:12px; background:#16a34a; color:#fff; font-weight:800; }

.paint-color-add-btn { margin-left:auto; border:0; border-radius:10px; background:#16a34a; color:#fff; padding:8px 14px; font-weight:800; }

.permission-main { padding:10px 12px; background:#fff; }
.permission-toolbar { display:flex; align-items:center; gap:36px; height:42px; border-bottom:1px solid #eee; }
.permission-toolbar label { display:flex; align-items:center; gap:8px; color:#333; font-size:14px; }
.permission-toolbar select { width:180px; height:28px; border:1px solid #d5dbe3; border-radius:3px; }
.permission-table-box { margin-top:12px; overflow:auto; }
.permission-table { width:100%; border-collapse:collapse; font-size:13px; }
.permission-table th, .permission-table td { border:1px solid #e5e7eb; padding:6px 8px; text-align:center; white-space:nowrap; }
.permission-table th { background:#f8fafc; font-weight:700; }
.permission-table td:nth-child(2), .permission-table th:nth-child(2) { text-align:left; }
.permission-table input[type='checkbox'] { width:16px; height:16px; accent-color:#1689d9; }
.permission-row-all, .permission-row-none { border:0; border-radius:4px; background:#18a4d8; color:#fff; padding:5px 10px; }
.permission-row-none { background:#38a3c8; }

.permission-lock-tip { color:#dc2626; font-weight:700; font-size:13px; }
.permission-table button:disabled, #permissionSaveBtn:disabled { opacity:.45; cursor:not-allowed; }

.finance-main { padding:14px; background:#f6f8fb; }
.finance-cards { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:12px; margin-bottom:12px; }
.finance-cards div { background:#fff; border-radius:12px; padding:14px; box-shadow:0 6px 18px rgba(15,23,42,.06); }
.finance-cards b { display:block; color:#64748b; font-size:13px; margin-bottom:6px; }
.finance-cards span { color:#111827; font-size:22px; font-weight:800; }
.finance-table-box { background:#fff; border-radius:12px; overflow:auto; box-shadow:0 6px 18px rgba(15,23,42,.06); }
.finance-table-box table { width:100%; border-collapse:collapse; font-size:13px; }
.finance-table-box th, .finance-table-box td { border-bottom:1px solid #e5e7eb; padding:9px 10px; text-align:center; white-space:nowrap; }
.finance-table-box th { background:#f8fafc; color:#334155; font-weight:800; }
.finance-table-box tfoot td { background:#fefce8; font-weight:800; }
.debt-money { color:#dc2626 !important; font-weight:800; }

.finance-title { font-size:20px; font-weight:800; margin-bottom:12px; color:#111827; }

.finance-pay-btn { border:0; border-radius:6px; background:#1689d9; color:#fff; padding:5px 8px; margin:0 2px; font-size:12px; font-weight:700; }
.finance-pay-btn.green { background:#16a34a; }

.finance-main { background:#f3f5f8; padding:12px 14px; }
.finance-title { font-size:20px; line-height:30px; font-weight:900; color:#111827; margin:0 0 12px; }
.finance-cards { grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:10px; }
.finance-cards div { min-height:58px; border-radius:8px; box-shadow:0 2px 10px rgba(15,23,42,.06); padding:10px 14px; }
.finance-cards b { font-size:12px; color:#64748b; }
.finance-cards span { font-size:22px; line-height:28px; }
.finance-table-box { border-radius:0; box-shadow:none; }
.finance-table-box table { font-size:12px; background:#fff; }
.finance-table-box th, .finance-table-box td { padding:7px 8px; border:1px solid #eef0f3; }
.finance-table-box th { background:#f8fafc; color:#111827; }
.finance-op { min-width:150px; }
.finance-pay-btn { border:0; border-radius:5px; background:#198fd1; color:#fff; padding:4px 7px; margin:0 2px; font-size:12px; font-weight:800; line-height:16px; }
.finance-pay-btn.green { background:#16a34a; }

.finance-erp-main { background:#fff; padding:8px 10px; }
.finance-erp-head { position:relative; min-height:86px; border-bottom:1px solid #e5e7eb; }
.finance-erp-filters { display:flex; flex-wrap:wrap; gap:8px 18px; padding:8px 420px 4px 0; }
.finance-erp-filters .filter-cell { display:flex; align-items:center; gap:5px; font-size:13px; }
.finance-erp-filters input, .finance-erp-filters select { height:26px; border:1px solid #bfc7d1; border-radius:2px; padding:0 6px; width:130px; }
.finance-actions { display:flex; gap:8px; padding-top:4px; }
.finance-right { position:absolute; right:0; top:8px; display:flex; gap:6px; }
.finance-right select { height:28px; border:1px solid #bfc7d1; border-radius:2px; width:118px; }
.finance-summary-line { min-height:36px; line-height:36px; margin:4px 0 6px; padding:0 10px; border:1px solid #e5e7eb; background:linear-gradient(180deg,#fffef6,#fff8d9); font-size:13px; color:#334155; }
.finance-summary-line b { margin:0 4px; font-size:15px; color:#111827; }
.finance-section-title { height:30px; line-height:30px; margin-top:6px; padding-left:8px; border-left:4px solid #198fd1; background:#f8fafc; font-size:14px; font-weight:900; color:#111827; }
.finance-customer-summary { max-height:214px; margin-bottom:6px; border:1px solid #dce7f2; background:#fff; }
.finance-customer-summary table, .finance-receipt-table table { min-width:1040px; }
.finance-customer-summary thead th, .finance-receipt-table thead th { position:sticky; top:0; z-index:1; background:#eaf4ff; color:#0f3f66; }
.finance-customer-summary tbody tr:hover td, .finance-receipt-table tbody tr:hover td { background:#eaf6ff; }
.finance-customer-summary .finance-pay-btn { padding:5px 10px; border-radius:12px; background:#16a34a; }
.finance-erp-table { border-radius:6px; box-shadow:none; border:1px solid #e2e8f0; }
.finance-erp-table table { width:100%; border-collapse:collapse; font-size:12px; background:#fff; }
.finance-erp-table th, .finance-erp-table td { border:1px solid #e5e7eb; padding:7px 8px; text-align:center; white-space:nowrap; }
.finance-erp-table th { position:sticky; top:0; z-index:1; background:linear-gradient(180deg,#f8fbff,#edf4fb); font-weight:900; color:#111827; }
.finance-erp-table tbody tr:nth-child(even) td { background:#fbfdff; }
.finance-erp-table tbody tr:hover td { background:#eaf6ff; }
.finance-erp-table tfoot td { background:#fff7cc; font-weight:900; color:#111827; }
.finance-erp-table .money { font-family:Consolas, 'Microsoft YaHei', monospace; font-weight:800; text-align:right; }
.finance-erp-table .link-button { font-weight:800; }
.finance-erp-table td:nth-child(11) { font-weight:800; color:#334155; }
.finance-status { display:inline-block; min-width:42px; padding:2px 8px; border-radius:999px; font-size:12px; font-weight:900; }
.finance-status.debt { background:#fee2e2; color:#b91c1c; }
.finance-status.clear { background:#dcfce7; color:#15803d; }
.finance-status.part { background:#fef3c7; color:#b45309; }
.finance-kpi-row { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:6px 0 8px; }
.finance-kpi-row div { border:1px solid #dbeafe; border-radius:8px; background:linear-gradient(180deg,#ffffff,#f8fbff); padding:9px 12px; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.finance-kpi-row span { display:block; margin-bottom:4px; color:#64748b; font-size:12px; font-weight:800; }
.finance-kpi-row b { display:block; color:#0f172a; font-size:20px; line-height:24px; font-family:Consolas, 'Microsoft YaHei', monospace; text-align:right; }
.finance-kpi-row .warn { border-color:#fde68a; background:linear-gradient(180deg,#fff,#fffbeb); }
.finance-kpi-row .warn b { color:#b45309; }
.finance-kpi-row .danger { border-color:#fecaca; background:linear-gradient(180deg,#fff,#fff1f2); }
.finance-kpi-row .danger b { color:#dc2626; }
.finance-progress { display:inline-block; width:76px; height:7px; margin-right:5px; border-radius:999px; background:#e5e7eb; overflow:hidden; vertical-align:middle; }
.finance-progress i { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#38bdf8,#16a34a); }
.finance-receipt-table small { color:#64748b; font-weight:800; }
.finance-allocate-modal { width:860px; max-width:96vw; }
.finance-allocate-input { width:86px; height:26px; border:1px solid #bfc7d1; border-radius:4px; text-align:right; padding:0 6px; font-family:Consolas, 'Microsoft YaHei', monospace; }

.finance-pay-btn.gray { background:#64748b; }
.finance-record-mask { position:fixed; inset:0; z-index:9999; background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center; padding:18px; }
.finance-record-modal { width:min(760px,96vw); max-height:80vh; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 18px 50px rgba(15,23,42,.25); }
.finance-record-body { padding:14px; overflow:auto; max-height:65vh; }
.finance-record-body table { width:100%; border-collapse:collapse; font-size:13px; }
.finance-record-body th, .finance-record-body td { border:1px solid #e5e7eb; padding:8px; text-align:center; }
.finance-record-body th { background:#f8fafc; }

.finance-bill-modal { width:min(860px,96vw); }
.finance-bill-info { display:grid; grid-template-columns:repeat(3,1fr); gap:8px 14px; background:#f8fafc; border:1px solid #e5e7eb; padding:12px; margin-bottom:12px; }
.finance-bill-info p { margin:0; font-size:13px; }
.finance-bill-actions { display:flex; gap:8px; justify-content:flex-end; margin-bottom:10px; }
.finance-bill-actions .finance-pay-btn { padding:7px 12px; }
.inventory-main { background:#f6f8fb; padding:10px 12px; }
.inventory-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:8px; }
.inventory-head strong { font-size:20px; font-weight:900; color:#0f172a; }
.inventory-head span { color:#64748b; font-size:13px; }
.inventory-form { display:grid; grid-template-columns:repeat(6,1fr) 92px 120px; gap:6px; padding:8px; margin-bottom:8px; border:1px solid #dbeafe; border-radius:8px; background:#fff; }
.inventory-form input { height:30px; border:1px solid #bfc7d1; border-radius:4px; padding:0 8px; }
.inventory-file { display:flex; align-items:center; justify-content:center; height:30px; border:1px solid #198fd1; border-radius:4px; color:#198fd1; font-weight:800; cursor:pointer; }
.inventory-file input { display:none; }
.inventory-thumb { width:54px; height:40px; object-fit:cover; border-radius:4px; border:1px solid #e5e7eb; }
.inventory-no-img { color:#94a3b8; }
.inventory-empty { padding:18px; border:1px dashed #bfdbfe; border-radius:8px; background:#f8fbff; color:#64748b; text-align:center; }
.inventory-compare-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:8px; }
.inventory-compare-card { border:1px solid #dbeafe; border-radius:10px; background:#fff; padding:10px; box-shadow:0 4px 12px rgba(15,23,42,.05); }
.inventory-compare-card img, .inventory-compare-card span { display:block; width:100%; height:120px; object-fit:cover; border-radius:8px; background:#f1f5f9; text-align:center; line-height:120px; color:#94a3b8; }
.inventory-compare-card b { display:block; margin:8px 0 4px; font-size:15px; color:#0f172a; }
.inventory-compare-card p { margin:3px 0; color:#475569; font-size:12px; }
.inventory-layout { display:grid; grid-template-columns:minmax(620px,1fr) 390px; gap:10px; align-items:start; }
.inventory-panel, .inventory-side-panel { min-width:0; }
.inventory-stock-panel .finance-table-box { max-height:560px; }
.inventory-side-panel .finance-table-box { max-height:260px; }
.inventory-stock-panel td b { display:block; color:#0f172a; font-size:13px; }
.inventory-stock-panel td small { display:block; margin-top:3px; color:#64748b; font-size:11px; }
.inventory-side-panel .inventory-compare-grid { grid-template-columns:1fr; }
.inventory-side-panel .inventory-compare-card { display:grid; grid-template-columns:110px 1fr; column-gap:10px; align-items:start; }
.inventory-side-panel .inventory-compare-card img, .inventory-side-panel .inventory-compare-card span { grid-row:1 / span 6; height:92px; }
.inventory-side-panel .inventory-compare-card b { margin-top:0; }
.inventory-move-modal { width:520px; max-width:94vw; }
.inventory-move-form { display:grid; gap:10px; margin-top:10px; }
.inventory-move-form label { display:grid; grid-template-columns:90px 1fr; align-items:center; gap:8px; color:#334155; font-weight:800; }
.inventory-move-form input { height:32px; border:1px solid #bfc7d1; border-radius:5px; padding:0 8px; }
.inventory-main .finance-section-title { letter-spacing:.5px; }
.inventory-row-alert td { background:#fff7ed !important; }
.inventory-stock-panel .finance-pay-btn { margin:0 3px 3px 0; }
.inventory-stock-panel th:nth-child(5), .inventory-stock-panel td:nth-child(5) { font-size:14px; font-weight:900; }
.inventory-head { padding:6px 2px; border-bottom:1px solid #e5e7eb; }
.inventory-head strong { letter-spacing:.5px; }
.inventory-form { box-shadow:0 3px 12px rgba(15,23,42,.05); }
.inventory-form input::placeholder { color:#94a3b8; }
.inventory-alert-input { width:70px; height:26px; border:1px solid #bfc7d1; border-radius:5px; text-align:center; font-weight:800; }
.inventory-auto-compare { display:grid; gap:10px; }
.inventory-compare-group { border:1px solid #dbeafe; border-radius:10px; background:#fff; overflow:hidden; }
.inventory-compare-title { display:flex; justify-content:space-between; align-items:center; padding:8px 10px; background:#eff6ff; color:#0f3f66; font-weight:900; }
.inventory-compare-title span { color:#64748b; font-size:12px; }
.inventory-compare-list { display:grid; gap:6px; padding:8px; }
.inventory-compare-row { position:relative; display:grid; grid-template-columns:54px 1fr 70px; gap:8px; align-items:center; padding:7px; border:1px solid #e5e7eb; border-radius:8px; background:#fff; }
.inventory-compare-row.cheap { border-color:#22c55e; background:#f0fdf4; box-shadow:0 0 0 2px rgba(34,197,94,.12) inset; }
.inventory-compare-row img, .inventory-compare-row span { width:54px; height:42px; object-fit:cover; border-radius:5px; background:#f1f5f9; text-align:center; line-height:42px; color:#94a3b8; }
.inventory-compare-row b { display:block; color:#0f172a; }
.inventory-compare-row p { margin:2px 0; color:#64748b; font-size:11px; }
.inventory-compare-row strong { font-family:Consolas, 'Microsoft YaHei', monospace; color:#dc2626; text-align:right; }
.inventory-compare-row em { position:absolute; right:6px; top:4px; padding:1px 5px; border-radius:999px; background:#16a34a; color:#fff; font-size:11px; font-style:normal; font-weight:900; }
.inventory-form select { height:30px; border:1px solid #bfc7d1; border-radius:4px; padding:0 8px; background:#fff; }
.inventory-category-block { margin-bottom:10px; }
.inventory-category-title { display:flex; justify-content:space-between; align-items:center; height:30px; padding:0 10px; border:1px solid #dbeafe; border-bottom:0; border-radius:8px 8px 0 0; background:#eff6ff; color:#0f3f66; font-weight:900; }
.inventory-category-title span { color:#64748b; font-size:12px; }
.inventory-category-block .finance-table-box { border-top-left-radius:0; border-top-right-radius:0; }
.inventory-category-select { height:26px; border:1px solid #bfc7d1; border-radius:5px; background:#fff; font-weight:800; color:#334155; }
.inventory-filter-bar { display:grid; grid-template-columns:1fr 110px 110px 80px 70px 120px; gap:8px; align-items:center; margin:8px 0; padding:8px; border:1px solid #dbeafe; border-radius:10px; background:#f8fafc; }
.inventory-filter-bar input, .inventory-filter-bar select { height:30px; border:1px solid #bfc7d1; border-radius:5px; padding:0 8px; background:#fff; }
.inventory-filter-bar span { color:#64748b; font-weight:800; font-size:12px; text-align:right; }
.inventory-pager { display:flex; justify-content:center; align-items:center; gap:12px; padding:10px; color:#64748b; font-weight:800; }
.inventory-pager button:disabled { opacity:.45; cursor:not-allowed; }
.inventory-category-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:8px 0; }
.inventory-category-tab { display:flex; justify-content:center; align-items:center; gap:10px; height:40px; border:1px solid #cbd5e1; border-radius:10px; background:#fff; color:#334155; font-weight:900; cursor:pointer; }
.inventory-category-tab span { min-width:28px; padding:2px 8px; border-radius:999px; background:#e2e8f0; color:#475569; font-size:12px; }
.inventory-category-tab.active { border-color:#2563eb; background:#eff6ff; color:#1d4ed8; box-shadow:0 0 0 2px rgba(37,99,235,.12) inset; }
.inventory-category-tab.active span { background:#2563eb; color:#fff; }
.inventory-filter-bar.simple { grid-template-columns:1fr 110px 80px 70px 120px; }
.inventory-mode-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:8px 0; }
.inventory-mode-tab { height:38px; border:1px solid #cbd5e1; border-radius:10px; background:#fff; color:#334155; font-weight:900; cursor:pointer; }
.inventory-mode-tab.active { border-color:#2563eb; background:#2563eb; color:#fff; box-shadow:0 8px 18px rgba(37,99,235,.18); }
.contract-table-box table { table-layout:auto; }
.contract-table-box .contract-product-cell { min-width:130px; max-width:220px; white-space:normal; line-height:18px; }
.contract-table-box .contract-address-cell { min-width:190px; max-width:320px; white-space:normal; line-height:18px; text-align:left; }
.contract-table-box .contract-deposit-cell { width:90px; min-width:90px; max-width:90px; }
.contract-table-box { overflow-x:auto; overflow-y:hidden; }
.contract-table-box table.contract-main-table { table-layout:fixed; min-width:1647px; width:1647px; }
.contract-table-box table.contract-main-table th,
.contract-table-box table.contract-main-table td { box-sizing:border-box; }
.contract-table-box table.contract-main-table .contract-product-cell { width:150px; min-width:150px; max-width:150px; white-space:normal; line-height:18px; }
.contract-table-box table.contract-main-table .contract-address-cell { width:260px; min-width:260px; max-width:260px; white-space:normal; line-height:18px; text-align:left; }
.contract-table-box table.contract-main-table .contract-deposit-cell { width:90px; min-width:90px; max-width:90px; }
.contract-table-box table.contract-main-table .contract-address-cell { width:300px; min-width:300px; max-width:300px; white-space:nowrap; line-height:31px; text-align:left; }
.contract-table-box table.contract-main-table { min-width:1687px; width:1687px; }
.contract-table-box table.contract-main-table { min-width:1597px; width:1597px; }
.contract-table-box table.contract-main-table th:nth-child(15),
.contract-table-box table.contract-main-table td:nth-child(15) { width:90px; min-width:90px; max-width:90px; }
.contract-table-box table.contract-main-table { min-width:1625px; width:1625px; }
.contract-table-box table.contract-main-table th:nth-child(14),
.contract-table-box table.contract-main-table td:nth-child(14) { width:160px; min-width:160px; max-width:160px; overflow:visible; text-overflow:clip; white-space:nowrap; }
.contract-table-box table.contract-main-table { table-layout:fixed; }
.contract-table-box table.contract-main-table .contract-product-cell,
.contract-table-box table.contract-main-table .contract-address-cell { width:auto; min-width:0; max-width:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:31px; }
.contract-table-box table.contract-main-table .contract-address-cell { text-align:left; }
.permission-main { background:#f3f6fa; }
.permission-title { height:54px; padding:12px 16px; background:#fff; border-bottom:1px solid #e5e7eb; box-sizing:border-box; }
.permission-title strong { display:block; font-size:18px; color:#111827; }
.permission-title span { color:#64748b; font-size:12px; }
.permission-toolbar { display:flex; gap:10px; align-items:center; padding:12px 16px; background:#fff; border-bottom:1px solid #e5e7eb; }
.permission-toolbar label { color:#334155; font-weight:800; }
.permission-toolbar select { height:30px; min-width:160px; border:1px solid #bfc7d1; border-radius:4px; background:#fff; }
.permission-summary { display:flex; align-items:center; gap:12px; margin:12px 16px; padding:12px; border:1px solid #dbeafe; border-radius:8px; background:#eff6ff; color:#1e3a8a; }
.permission-summary.admin { border-color:#fde68a; background:#fffbeb; color:#92400e; }
.permission-summary b { font-size:16px; }
.permission-summary span { padding:2px 8px; border-radius:999px; background:#fff; font-weight:900; }
.permission-summary em { font-style:normal; color:#475569; }
.permission-table-box { margin:0 16px 16px; background:#fff; border:1px solid #dfe5e8; overflow:auto; }
.permission-table { width:100%; min-width:980px; border-collapse:collapse; table-layout:fixed; }
.permission-table th, .permission-table td { height:34px; border:1px solid #e5e8eb; text-align:center; font-size:14px; color:#334155; }
.permission-table th { background:#f8fafc; font-weight:900; }
.permission-module-name { text-align:left !important; padding-left:12px; font-weight:900; }
.permission-check { display:inline-flex; justify-content:center; align-items:center; cursor:pointer; }
.permission-check input { width:16px; height:16px; }
.permission-row-all, .permission-row-none { margin:0 3px; height:24px; border:1px solid #cbd5e1; border-radius:4px; background:#fff; cursor:pointer; }
.permission-row-all { color:#166534; }
.permission-row-none { color:#991b1b; }
.permission-row-all:disabled, .permission-row-none:disabled { color:#94a3b8; cursor:not-allowed; }

.paint-color-card-head { display:grid; grid-template-columns:70px 1fr 58px 54px; gap:8px; padding:10px 12px 4px; color:#64748b; font-size:12px; font-weight:900; }
.paint-color-card-list { padding:0 10px 14px; }
.paint-color-card { display:grid; grid-template-columns:70px 1fr 58px 54px; gap:8px; align-items:center; min-height:58px; margin:8px 0; padding:10px; background:#fff; border:1px solid #e2e8f0; border-radius:12px; box-shadow:0 2px 8px rgba(15,23,42,.04); box-sizing:border-box; }
.paint-color-brand { color:#334155; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-main b { display:block; color:#0f172a; font-size:15px; line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-main small { display:block; min-height:16px; color:#94a3b8; font-size:12px; line-height:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-count { color:#7c3aed; font-weight:900; text-align:center; }
.paint-color-edit-btn { height:30px; border:0; border-radius:8px; background:#2563eb; color:#fff; font-weight:900; }
@media (max-width: 768px) {
  .paint-color-card-head, .paint-color-card { grid-template-columns:58px 1fr 44px 48px; gap:6px; }
  .paint-color-card { padding:9px 8px; }
}

.paint-color-card-head { display:none; }
.paint-color-card-list { padding:8px 12px 16px; }
.paint-color-card { display:grid; grid-template-columns:1fr 82px; grid-template-areas:"info action" "info count"; gap:6px 10px; align-items:center; min-height:72px; margin:10px 0; padding:12px; background:#fff; border:1px solid #e2e8f0; border-radius:12px; box-shadow:0 2px 8px rgba(15,23,42,.04); box-sizing:border-box; }
.paint-color-brand { grid-area:info; align-self:start; color:#475569; font-size:13px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-top:0; }
.paint-color-main { grid-area:info; padding-top:20px; min-width:0; }
.paint-color-main b { display:block; color:#0f172a; font-size:18px; line-height:24px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-main small { display:block; min-height:18px; color:#64748b; font-size:13px; line-height:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-count { grid-area:count; justify-self:center; align-self:start; color:#7c3aed; font-size:18px; font-weight:900; text-align:center; line-height:22px; word-break:break-all; }
.paint-color-edit-btn { grid-area:action; justify-self:end; width:64px; height:34px; border:0; border-radius:8px; background:#2563eb; color:#fff; font-size:15px; font-weight:900; white-space:nowrap; }

.paint-color-card-head { display:grid; grid-template-columns:72px 1fr 58px 62px; gap:6px; padding:10px 12px 4px; color:#64748b; font-size:12px; font-weight:900; text-align:center; }
.paint-color-card-list { padding:0 10px 14px; }
.paint-color-card { display:grid; grid-template-columns:72px 1fr 58px 62px; gap:6px; align-items:center; min-height:58px; margin:8px 0; padding:10px 8px; background:#fff; border:1px solid #e2e8f0; border-radius:12px; box-shadow:0 2px 8px rgba(15,23,42,.04); box-sizing:border-box; }
.paint-color-brand { color:#334155; font-weight:900; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-main { min-width:0; text-align:center; }
.paint-color-main b { display:block; color:#0f172a; font-size:16px; line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-main b.single { line-height:36px; }
.paint-color-main small { display:block; min-height:16px; color:#64748b; font-size:12px; line-height:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.paint-color-count { color:#7c3aed; font-weight:900; text-align:center; line-height:18px; }
.paint-color-edit-btn { width:58px; height:32px; border:0; border-radius:8px; background:#2563eb; color:#fff; font-size:14px; font-weight:900; white-space:nowrap; justify-self:center; }

.mobile-form-main .paint-color-card-head { display:grid !important; grid-template-columns:78px 1fr 58px 64px !important; gap:6px !important; padding:10px 12px 4px !important; color:#64748b !important; font-size:12px !important; font-weight:900 !important; text-align:center !important; }
.mobile-form-main .paint-color-card-list { padding:0 10px 14px !important; }
.mobile-form-main .paint-color-card { display:grid !important; grid-template-columns:78px 1fr 58px 64px !important; grid-template-areas:none !important; gap:6px !important; align-items:center !important; min-height:72px !important; margin:8px 0 !important; padding:10px 8px !important; background:#fff !important; border:1px solid #e2e8f0 !important; border-radius:12px !important; box-shadow:0 2px 8px rgba(15,23,42,.04) !important; box-sizing:border-box !important; }
.mobile-form-main .paint-color-brand { grid-area:auto !important; align-self:center !important; color:#334155 !important; font-size:15px !important; font-weight:900 !important; text-align:center !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; padding-top:0 !important; }
.mobile-form-main .paint-color-main { grid-area:auto !important; padding-top:0 !important; min-width:0 !important; text-align:center !important; }
.mobile-form-main .paint-color-main b { display:block !important; color:#0f172a !important; font-size:16px !important; line-height:20px !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
.mobile-form-main .paint-color-main b.single { line-height:36px !important; }
.mobile-form-main .paint-color-main small { display:block !important; min-height:16px !important; color:#64748b !important; font-size:12px !important; line-height:16px !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
.mobile-form-main .paint-color-count { grid-area:auto !important; justify-self:center !important; align-self:center !important; color:#7c3aed !important; font-size:16px !important; font-weight:900 !important; text-align:center !important; line-height:18px !important; word-break:normal !important; }
.mobile-form-main .paint-color-edit-btn { grid-area:auto !important; justify-self:center !important; width:58px !important; height:32px !important; border:0 !important; border-radius:8px !important; background:#2563eb !important; color:#fff !important; font-size:14px !important; font-weight:900 !important; white-space:nowrap !important; }

.mobile-form-main .paint-color-card { min-height:54px !important; margin:5px 0 !important; padding:6px 8px !important; }
.mobile-form-main .paint-color-card-head { padding:6px 12px 2px !important; }
.mobile-form-main .paint-color-brand { font-size:14px !important; }
.mobile-form-main .paint-color-main b { font-size:15px !important; line-height:18px !important; }
.mobile-form-main .paint-color-main b.single { line-height:30px !important; }
.mobile-form-main .paint-color-main small { min-height:14px !important; font-size:11px !important; line-height:14px !important; }
.mobile-form-main .paint-color-count { font-size:15px !important; line-height:16px !important; }
.mobile-form-main .paint-color-edit-btn { height:28px !important; }

.mobile-form-main .paint-color-card { min-height:44px !important; height:44px !important; margin:4px 0 !important; padding:4px 8px !important; }
.mobile-form-main .paint-color-card-head { padding:5px 12px 1px !important; }
.mobile-form-main .paint-color-brand { font-size:13px !important; line-height:16px !important; }
.mobile-form-main .paint-color-main b { font-size:14px !important; line-height:16px !important; }
.mobile-form-main .paint-color-main b.single { line-height:32px !important; }
.mobile-form-main .paint-color-main small { min-height:12px !important; font-size:10px !important; line-height:12px !important; }
.mobile-form-main .paint-color-count { font-size:14px !important; line-height:16px !important; }
.mobile-form-main .paint-color-edit-btn { height:26px !important; }

html, body, #app { touch-action: auto !important; -ms-touch-action: auto !important; }
body { overflow-x: auto !important; }
.shell, .main, .mobile-form-main, .order-mobile-sheet, .paint-color-edit-mask, .paint-color-edit-modal, .customer-modal-mask, .customer-modal, .dispatch-modal-mask, .dispatch-modal, .finance-record-mask, .finance-record-modal { touch-action: auto !important; -ms-touch-action: auto !important; }
.customer-modal, .dispatch-modal, .finance-record-modal, .paint-color-edit-modal { max-width: none !important; }
@media (max-width: 768px) {
  .customer-modal-mask, .dispatch-modal-mask, .finance-record-mask, .paint-color-edit-mask { overflow:auto !important; align-items:flex-start !important; justify-content:flex-start !important; }
  .customer-modal, .dispatch-modal, .finance-record-modal { transform-origin: top left !important; }
  .contract-modal-body, .dispatch-modal-scroll, .finance-record-body, .paint-color-edit-body { overflow:auto !important; touch-action:auto !important; }
}

@media (max-width: 768px) {
  .customer-modal[aria-labelledby="contractModalTitle"] { transform:scale(.58) !important; transform-origin:top left !important; margin:0 !important; }
  .customer-modal-mask:has(.customer-modal[aria-labelledby="contractModalTitle"]) { align-items:flex-start !important; justify-content:flex-start !important; overflow:auto !important; }
}
@media (max-width: 420px) {
  .customer-modal[aria-labelledby="contractModalTitle"] { transform:scale(.52) !important; }
}

@media (max-width: 768px) {
  .dispatch-modal-mask { align-items:flex-start !important; justify-content:flex-start !important; overflow:auto !important; padding:0 !important; }
  .dispatch-modal { transform:scale(.62) !important; transform-origin:top left !important; margin:0 !important; max-height:none !important; }
  .dispatch-modal-scroll { max-height:none !important; overflow:visible !important; }
  .dispatch-modal-foot { position:sticky !important; bottom:0 !important; z-index:5 !important; background:#fff !important; }
}
@media (max-width: 420px) {
  .dispatch-modal { transform:scale(.55) !important; }
}

.finance-record-mask { align-items:flex-start !important; justify-content:center !important; overflow:auto !important; padding:18px !important; }
.finance-record-modal { max-height:none !important; height:auto !important; overflow:visible !important; margin:18px auto !important; }
.finance-record-body { max-height:none !important; overflow:visible !important; padding-bottom:24px !important; }
.finance-bill-modal { max-height:none !important; }
.finance-allocate-modal { max-height:none !important; }
@media (max-width: 768px) {
  .finance-record-mask { justify-content:flex-start !important; padding:0 !important; }
  .finance-record-modal { transform:scale(.72) !important; transform-origin:top left !important; width:860px !important; max-width:none !important; margin:0 !important; }
  .finance-record-body { overflow:visible !important; max-height:none !important; }
}
@media (max-width: 420px) {
  .finance-record-modal { transform:scale(.62) !important; }
}

@media (max-width: 768px) {
  html, body, #app { min-height:100% !important; height:auto !important; overflow-y:auto !important; }
  .shell { min-height:100vh !important; height:auto !important; overflow:visible !important; }
  .main.mobile-form-main { min-height:100vh !important; height:auto !important; overflow-y:auto !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; padding-bottom:40px !important; }
  .order-mobile-sheet, .order-task-list, .paint-wait-list, .paint-stat-list, .paint-color-card-list, .mobile-grid, .mobile-checklist { height:auto !important; max-height:none !important; overflow:visible !important; }
  .order-info-grid, .order-image-box, .paint-wait-card, .paint-stat-card, .gilding-stat-item { overflow:visible !important; }
}

/* Global mobile browser unlock: allow pinch zoom and scrolling on all desktop pages opened from phones. */
html, body, #app { height:auto !important; min-height:100% !important; overflow:auto !important; touch-action:pan-x pan-y pinch-zoom !important; -ms-touch-action:pan-x pan-y pinch-zoom !important; }
body { position:static !important; overscroll-behavior:auto !important; -webkit-overflow-scrolling:touch !important; }
@media (pointer: coarse), (max-width: 1024px) {
  html, body, #app { width:auto !important; max-width:none !important; overflow:auto !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .shell { height:auto !important; min-height:100vh !important; overflow:visible !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .main { height:auto !important; min-height:100vh !important; overflow:auto !important; -webkit-overflow-scrolling:touch !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .contract-table-box, .work-table-box, .customer-table-box, .parameter-table-box, .finance-table-box { overflow:auto !important; -webkit-overflow-scrolling:touch !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .customer-modal-mask, .dispatch-modal-mask, .dispatch-record-mask, .parameter-modal-mask, .grid-detail-mask, .finance-record-mask, .paint-color-edit-mask, .contract-upload-mask, .contract-customer-picker, .image-preview-mask { overflow:auto !important; align-items:flex-start !important; justify-content:flex-start !important; touch-action:pan-x pan-y pinch-zoom !important; -webkit-overflow-scrolling:touch !important; }
  .customer-modal, .dispatch-modal, .dispatch-record-modal, .parameter-modal, .grid-detail-modal, .finance-record-modal, .paint-color-edit-modal, .contract-picker-modal, .contract-upload-modal { max-height:none !important; overflow:visible !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .contract-modal-body, .dispatch-modal-scroll, .dispatch-record-body, .parameter-modal-body, .finance-record-body, .paint-color-edit-body, .contract-picker-body, .contract-upload-form { max-height:none !important; overflow:visible !important; touch-action:pan-x pan-y pinch-zoom !important; }
  .customer-modal-mask .customer-modal, .dispatch-modal-mask .dispatch-modal, .finance-record-mask .finance-record-modal, .parameter-modal-mask .parameter-modal, .dispatch-record-mask .dispatch-record-modal { margin:0 !important; transform-origin:top left !important; }
}

/* Mobile bottom reach fix: make the last part of long pages/modals reachable. */
@media (pointer: coarse), (max-width: 1024px) {
  body { padding-bottom:120px !important; }
  .main { padding-bottom:160px !important; box-sizing:border-box !important; }
  .customer-modal-mask, .dispatch-modal-mask, .dispatch-record-mask, .parameter-modal-mask, .grid-detail-mask, .finance-record-mask, .paint-color-edit-mask, .contract-upload-mask, .contract-customer-picker, .image-preview-mask {
    height:100dvh !important;
    max-height:100dvh !important;
    overflow-x:auto !important;
    overflow-y:auto !important;
    padding-bottom:220px !important;
    box-sizing:border-box !important;
  }
  .customer-modal, .dispatch-modal, .dispatch-record-modal, .parameter-modal, .grid-detail-modal, .finance-record-modal, .paint-color-edit-modal, .contract-picker-modal, .contract-upload-modal {
    flex:0 0 auto !important;
    margin-bottom:220px !important;
  }
  .contract-modal-body, .dispatch-modal-scroll, .dispatch-record-body, .parameter-modal-body, .finance-record-body, .paint-color-edit-body, .contract-picker-body, .contract-upload-form {
    padding-bottom:120px !important;
    box-sizing:border-box !important;
  }
  .dispatch-modal-foot, .finance-bill-actions, .customer-modal-foot, .parameter-modal-foot {
    margin-bottom:40px !important;
  }
}

/* Inventory page only: right content scroll area for phone/browser narrow view. */
.inventory-main { height:100vh !important; overflow-y:auto !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; box-sizing:border-box !important; padding-bottom:120px !important; }
.inventory-main .inventory-layout, .inventory-main .inventory-stock-panel, .inventory-main .inventory-side-panel { max-height:none !important; }

/* Finance page only: right content scroll area for phone/browser narrow view. */
.finance-erp-main, .finance-main { height:100vh !important; overflow-y:auto !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; box-sizing:border-box !important; padding-bottom:120px !important; }
.finance-erp-main .finance-table-box, .finance-main .finance-table-box { overflow:auto !important; -webkit-overflow-scrolling:touch !important; }

/* Password change page */
.password-main { background:#f3f6f8; padding:24px; box-sizing:border-box; }
.password-panel { width:520px; max-width:100%; background:#fff; border:1px solid #dfe5ea; box-shadow:0 2px 8px rgba(0,0,0,.06); padding:24px 30px 28px; box-sizing:border-box; }
.password-title { font-size:22px; font-weight:700; color:#111827; margin-bottom:6px; }
.password-subtitle { font-size:13px; color:#6b7280; border-bottom:1px solid #edf0f2; padding-bottom:16px; margin-bottom:18px; }
.password-form-row { display:flex; align-items:center; margin-bottom:14px; }
.password-form-row label { width:100px; text-align:right; padding-right:12px; font-size:14px; color:#111827; box-sizing:border-box; }
.password-form-row label b { color:#e11d48; margin-right:2px; }
.password-form-row input { width:260px; height:34px; border:1px solid #cfd8e3; border-radius:4px; padding:0 10px; font-size:14px; box-sizing:border-box; }
.password-form-row input[readonly] { background:#f5f7f9; color:#374151; }
.password-actions { padding-left:100px; margin-top:22px; }
.password-actions .parameter-save-btn { min-width:110px; height:34px; }
.order-detail-main { height: 100vh; overflow-y: auto; overflow-x: hidden; padding-bottom: 24px; }
.order-detail-main .order-mobile-sheet { margin-bottom: 24px; }
.work-table-box th:nth-child(8), .work-table-box td:nth-child(8),
.dispatch-record-body th:nth-child(8), .dispatch-record-body td:nth-child(8) { width:auto !important; min-width:0 !important; max-width:none !important; white-space:nowrap !important; overflow:visible !important; text-overflow:clip !important; }
.work-table-box th:nth-child(10), .work-table-box td:nth-child(10),
.dispatch-record-body th:nth-child(10), .dispatch-record-body td:nth-child(10) { width:70px !important; min-width:70px !important; max-width:70px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.work-table-box th:nth-child(11), .work-table-box td:nth-child(11),
.work-table-box th:nth-child(12), .work-table-box td:nth-child(12),
.work-table-box th:nth-child(16), .work-table-box td:nth-child(16),
.dispatch-record-body th:nth-child(11), .dispatch-record-body td:nth-child(11),
.dispatch-record-body th:nth-child(12), .dispatch-record-body td:nth-child(12),
.dispatch-record-body th:nth-child(16), .dispatch-record-body td:nth-child(16) { width:90px !important; min-width:90px !important; max-width:90px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.work-table-box th:nth-child(13), .work-table-box td:nth-child(13),
.work-table-box th:nth-child(14), .work-table-box td:nth-child(14),
.dispatch-record-body th:nth-child(13), .dispatch-record-body td:nth-child(13),
.dispatch-record-body th:nth-child(14), .dispatch-record-body td:nth-child(14) { width:70px !important; min-width:70px !important; max-width:70px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.work-table-box th:nth-child(15), .work-table-box td:nth-child(15),
.dispatch-record-body th:nth-child(15), .dispatch-record-body td:nth-child(15) { width:70px !important; min-width:70px !important; max-width:70px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.work-table-box th:nth-child(9), .work-table-box td:nth-child(9),
.dispatch-record-body th:nth-child(9), .dispatch-record-body td:nth-child(9) { width:120px !important; min-width:120px !important; max-width:120px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gilding-pending-status { color:#e60000 !important; font-weight:700 !important; }
.finance-erp-main, .finance-main { font-size:16px !important; }
.finance-erp-main table, .finance-main table,
.finance-erp-main input, .finance-main input,
.finance-erp-main select, .finance-main select,
.finance-erp-main button, .finance-main button { font-size:16px !important; }
.finance-date-filter input[type="date"] { width:128px !important; min-width:128px !important; height:30px !important; }
.contract-table tfoot td { border-color: transparent !important; background:#fff !important; }
.contract-table tfoot td:first-child { text-align:left !important; font-weight:700; color:#333; }
