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

        *, *::before, *::after {
            border-radius: 0 !important;
        }

        :root {
            --region-border-color: #34495e;
            --inner-border-color: var(--region-border-color);
            --table-head-border-color: rgba(255, 255, 255, 0.14);
            --table-outer-border-width: 2px;
            --table-side-inset-shadow: inset var(--table-outer-border-width) 0 0 var(--region-border-color), inset calc(-1 * var(--table-outer-border-width)) 0 0 var(--region-border-color);
            --table-top-edge-shadow: 0 calc(-1 * var(--table-outer-border-width)) 0 0 var(--region-border-color);
        }

        /* 亮色下：表体网格线 / 输入框 / 筛选标签 */
        body:not(.dark-theme) .data-table tbody td,
        body:not(.dark-theme) .data-table.resizable-table tbody td,
        body:not(.dark-theme) .stock-op-picker-table tbody td,
        body:not(.dark-theme) #traceability .trace-table-wrap .data-table tbody td,
        body:not(.dark-theme) .trace-records-table-wrap .data-table tbody td,
        body:not(.dark-theme) .import-preview-wrap tbody td {
            border-color: var(--inner-border-color) !important;
        }

        body:not(.dark-theme) .data-table thead th,
        body:not(.dark-theme) .data-table.resizable-table thead th,
        body:not(.dark-theme) .stock-op-picker-table thead th,
        body:not(.dark-theme) #traceability .trace-table-wrap .data-table thead th,
        body:not(.dark-theme) .trace-records-table-wrap .data-table thead th,
        body:not(.dark-theme) .import-preview-wrap thead th {
            border-color: var(--table-head-border-color) !important;
        }

        /* 亮色下：表头行最左 / 最右竖线与表格外框同色 */
        body:not(.dark-theme) .data-table thead th:first-child,
        body:not(.dark-theme) .data-table.resizable-table thead th:first-child,
        body:not(.dark-theme) .stock-op-picker-table thead th:first-child,
        body:not(.dark-theme) #traceability .trace-table-wrap .data-table thead th:first-child,
        body:not(.dark-theme) .trace-records-table-wrap .data-table thead th:first-child,
        body:not(.dark-theme) .import-preview-wrap thead th:first-child {
            border-left-color: var(--region-border-color) !important;
        }

        body:not(.dark-theme) .data-table thead th:last-child,
        body:not(.dark-theme) .data-table.resizable-table thead th:last-child,
        body:not(.dark-theme) .stock-op-picker-table thead th:last-child,
        body:not(.dark-theme) #traceability .trace-table-wrap .data-table thead th:last-child,
        body:not(.dark-theme) .trace-records-table-wrap .data-table thead th:last-child,
        body:not(.dark-theme) .import-preview-wrap thead th:last-child {
            border-right-color: var(--region-border-color) !important;
        }

        /* 亮色下：表头顶部横线与表格外框同色 */
        body:not(.dark-theme) .data-table thead th,
        body:not(.dark-theme) .data-table.resizable-table thead th,
        body:not(.dark-theme) .stock-op-picker-table thead th,
        body:not(.dark-theme) #traceability .trace-table-wrap .data-table thead th,
        body:not(.dark-theme) .trace-records-table-wrap .data-table thead th,
        body:not(.dark-theme) .import-preview-wrap thead th {
            border-top-color: var(--region-border-color) !important;
        }

        /* 表格外边缘线稍粗（内网格线保持 1px） */
        .data-table thead th:first-child,
        .data-table.resizable-table thead th:first-child,
        .stock-op-picker-table thead th:first-child,
        #traceability .trace-table-wrap .data-table thead th:first-child,
        .trace-records-table-wrap .data-table thead th:first-child,
        .import-preview-wrap thead th:first-child,
        .data-table tbody td:first-child,
        .data-table.resizable-table tbody td:first-child,
        .stock-op-picker-table tbody td:first-child,
        #traceability .trace-table-wrap .data-table tbody td:first-child,
        .trace-records-table-wrap .data-table tbody td:first-child,
        .import-preview-wrap tbody td:first-child {
            border-left-width: var(--table-outer-border-width) !important;
        }

        .data-table thead th:last-child,
        .data-table.resizable-table thead th:last-child,
        .stock-op-picker-table thead th:last-child,
        #traceability .trace-table-wrap .data-table thead th:last-child,
        .trace-records-table-wrap .data-table thead th:last-child,
        .import-preview-wrap thead th:last-child,
        .data-table tbody td:last-child,
        .data-table.resizable-table tbody td:last-child,
        .stock-op-picker-table tbody td:last-child,
        #traceability .trace-table-wrap .data-table tbody td:last-child,
        .trace-records-table-wrap .data-table tbody td:last-child,
        .import-preview-wrap tbody td:last-child {
            border-right-width: var(--table-outer-border-width) !important;
        }

        .data-table thead th,
        .data-table.resizable-table thead th,
        .stock-op-picker-table thead th,
        #traceability .trace-table-wrap .data-table thead th,
        .trace-records-table-wrap .data-table thead th,
        .import-preview-wrap thead th {
            border-top-width: var(--table-outer-border-width) !important;
        }

        .data-table tbody tr:last-child td,
        .data-table.resizable-table tbody tr:last-child td,
        .stock-op-picker-table tbody tr:last-child td,
        #traceability .trace-table-wrap .data-table tbody tr:last-child td,
        .trace-records-table-wrap .data-table tbody tr:last-child td,
        .import-preview-wrap tbody tr:last-child td {
            border-bottom-width: var(--table-outer-border-width) !important;
        }

        body:not(.dark-theme) .search-box,
        body:not(.dark-theme) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
        body:not(.dark-theme) select,
        body:not(.dark-theme) textarea,
        body:not(.dark-theme) .login-form-group input,
        body:not(.dark-theme) #rfidBinding .rfid-binding-input-row input,
        body:not(.dark-theme) .stock-op-barcode-row input,
        body:not(.dark-theme) .import-mapping-row select,
        body:not(.dark-theme) .report-date-field input,
        body:not(.dark-theme) .report-task-select {
            border-color: var(--inner-border-color) !important;
        }

        body:not(.dark-theme) #barcodeLibrary .bc-lib-filter-tag,
        body:not(.dark-theme) #barcodeLibrary .bc-lib-filter-tag.active,
        body:not(.dark-theme) #barcodeLibrary .bc-lib-filter-tag.active:hover {
            border-color: var(--inner-border-color);
        }

        html {
            height: 100%;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            background: #f5f7fa;
            min-height: 100%;
            padding: 0;
            margin: 0;
        }

        body.logged-in {
            height: 100vh;
            height: 100dvh;
            overflow: hidden;
        }

        .container {
            max-width: none;
            width: 100%;
            margin: 0;
            background: white;
            border-radius: 0;
            box-shadow: none;
            overflow: hidden;
            border: none;
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .header {
            background: #2c3e50;
            color: white;
            padding: 16px 12px;
            text-align: left;
            border-bottom: 3px solid #3498db;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            flex-shrink: 0;
            z-index: 10;
        }

        .header h1 {
            font-size: 1.6em;
            margin: 0;
            font-weight: 700;
            letter-spacing: -0.5px;
        }
        .app-badge {
            display: inline-block;
            margin-left: 8px;
            padding: 2px 6px;
            font-size: 0.55em;
            font-weight: 700;
            color: #0b5ed7;
            background: #e7f1ff;
            border: 1px solid #b6d4fe;
            border-radius: 0;
            vertical-align: middle;
        }

        .theme-toggle {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            background: rgba(255,255,255,0.1);
            color: #fff;
            border: 1px solid rgba(255,255,255,0.25);
            border-radius: 20px;
            padding: 6px 12px;
            cursor: pointer;
            user-select: none;
            font-size: 0.9em;
        }
        .theme-toggle input {
            display: none;
        }
        .theme-toggle .knob {
            width: 34px;
            height: 18px;
            border-radius: 10px;
            background: #adb5bd;
            position: relative;
            transition: background 0.2s ease;
        }
        .theme-toggle .knob::after {
            content: '';
            position: absolute;
            top: 2px;
            left: 2px;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: #fff;
            transition: transform 0.2s ease;
        }
        .theme-toggle input:checked + .knob {
            background: #3498db;
        }
        .theme-toggle input:checked + .knob::after {
            transform: translateX(16px);
        }

        /* 暗色主题覆盖 */
        .dark-theme body,
        body.dark-theme {
            background: #111418 !important;
            color: #e9ecef !important;
        }
        body.dark-theme .container {
            background: #161a1e !important;
            border-color: #262c33 !important;
            box-shadow: 0 1px 6px rgba(0,0,0,0.5) !important;
        }
        body.dark-theme .status-bar,
        body.dark-theme .sidebar {
            background: #1b2026 !important;
            border-color: #2a313a !important;
        }
        body.dark-theme .sidebar-item {
            color: #aeb6bf !important;
            background: #252b33 !important;
            border-style: solid !important;
            border-width: 1px 1px 2px 3px !important;
            border-color: #3d4654 #1a1f26 #0f1318 transparent !important;
            box-shadow: none !important;
        }
        body.dark-theme .sidebar-item:hover {
            background: #2a313a !important;
            color: #e9ecef !important;
            border-color: #454f5c #151a20 #0a0d10 transparent !important;
        }
        body.dark-theme .sidebar-item:active {
            background: #1e2d3d !important;
            border-width: 2px 2px 1px 3px !important;
            border-color: #0f1318 #3d4654 #454f5c transparent !important;
        }
        body.dark-theme .sidebar-item.active {
            color: #e9ecef !important;
            background: #1e2d3d !important;
            border-width: 2px 2px 1px 3px !important;
            border-color: #0f1318 #3d4654 #454f5c transparent !important;
            box-shadow: none !important;
        }
        body.dark-theme .sidebar-item.active:hover {
            color: #e9ecef !important;
            background: #1e2d3d !important;
            border-width: 2px 2px 1px 3px !important;
            border-color: #0f1318 #3d4654 #454f5c transparent !important;
        }
        body.dark-theme .sidebar-item .sidebar-icon {
            color: #2874a6 !important;
        }
        body.dark-theme .sidebar-item.active .sidebar-icon {
            color: #2874a6 !important;
            opacity: 1 !important;
        }
        body.dark-theme .sidebar {
            box-shadow: none;
        }
        body.dark-theme .data-table,
        body.dark-theme .items-list table {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
        }
        body.dark-theme .data-table thead {
            background: #0f1419 !important;
        }
        body.dark-theme .data-table tbody td,
        body.dark-theme .data-table td,
        body.dark-theme .items-list td {
            border-color: #2a313a !important;
            color: #dfe6ee !important;
        }
        body.dark-theme .item-card,
        body.dark-theme .stat-card,
        body.dark-theme .stat-group,
        body.dark-theme .stat-group-details {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
            color: #e9ecef !important;
        }
        body.dark-theme .view-btn.active {
            background: var(--btn-line-bg-pressed) !important;
            border-width: var(--btn-line-width-pressed) !important;
            border-color: var(--btn-line-border-pressed) !important;
            color: var(--btn-line-text-hover) !important;
        }
        body.dark-theme .modal-content {
            background: #161a1e !important;
            color: #e9ecef !important;
        }
        body.dark-theme .items-list > table:not(.data-table) th {
            background: #1b2026 !important;
            color: #cfd7df !important;
            border-color: #2a313a !important;
        }
        body.dark-theme .notice-bar {
            background: linear-gradient(180deg, #152535 0%, #1a2f42 100%) !important;
            border-top-color: #2a4a66 !important;
            border-bottom-color: #2a4a66 !important;
        }
        body.dark-theme .notice-badge {
            background: #1e3d58 !important;
            color: #b8daf0 !important;
        }
        body.dark-theme .notice-item.important .notice-badge {
            background: #dc3545 !important;
            color: #fff !important;
        }
        body.dark-theme .notice-item.alert .notice-badge {
            background: #e74c3c !important;
            color: #fff !important;
        }
        body.dark-theme .notice-item.alert .notice-title {
            color: #ffb4a8 !important;
        }
        body.dark-theme .notice-alert-summary {
            color: #8eb8d4 !important;
        }
        body.dark-theme .notice-item.alert .notice-time {
            color: #ff8a7a !important;
        }
        body.dark-theme .notice-title {
            color: #d4ebf9 !important;
        }
        body.dark-theme .notice-time,
        body.dark-theme .notice-counter {
            color: #8eb8d4 !important;
        }
        body.dark-theme .app-badge {
            color: #91c2ff !important;
            background: #0d1b2a !important;
            border-color: #2a313a !important;
        }
        /* 暗色下将各类“灰字”统一提亮为白/近白 */
        body.dark-theme .detail-label,
        body.dark-theme .detail-value,
        body.dark-theme .status-bar,
        body.dark-theme .status-bar span,
        body.dark-theme .barcode-text,
        body.dark-theme .sidebar-item,
        body.dark-theme .sidebar-item.active,
        body.dark-theme .item-title,
        body.dark-theme .detail-item,
        body.dark-theme .detail-section h3,
        body.dark-theme .stat-card p,
        body.dark-theme .stat-card h3,
        body.dark-theme .expand-icon,
        body.dark-theme .view-toggle,
        body.dark-theme .view-toggle .view-btn,
        body.dark-theme .loading,
        body.dark-theme .empty-state,
        body.dark-theme .data-table thead,
        body.dark-theme .data-table thead th,
        body.dark-theme .items-list th {
            color: #e9ecef !important;
        }
        body.dark-theme .error {
            background: #3a1e22 !important;
            color: #ffecec !important;
            border-left-color: #d46a6a !important;
        }
        /* 表单与按钮在暗色下的可读性 */
        body.dark-theme input,
        body.dark-theme select,
        body.dark-theme textarea {
            background: #1b2026 !important;
            color: #e9ecef !important;
            border-color: #495057 !important;
        }

        body.dark-theme .search-box {
            background: #fff !important;
            color: #2c3e50 !important;
            border-color: #495057 !important;
            box-shadow:
                inset 2px 2px 6px rgba(52, 152, 219, 0.25),
                inset -1px -1px 0 #fff !important;
        }

        body.dark-theme input:focus,
        body.dark-theme select:focus,
        body.dark-theme textarea:focus,
        body.dark-theme .search-box:focus {
            border-color: #adb5bd !important;
        }

        body.dark-theme .search-box:focus {
            background: #fff !important;
            box-shadow:
                inset 2px 2px 7px rgba(52, 152, 219, 0.3),
                inset -1px -1px 0 #fff !important;
        }

        body.dark-theme .search-box::placeholder {
            color: #6c757d !important;
        }

        body.dark-theme input::placeholder,
        body.dark-theme textarea::placeholder {
            color: #cfd7df !important;
        }
        body.dark-theme .filter-btn,
        body.dark-theme .refresh-btn {
            background: var(--btn-line-bg) !important;
            border-color: var(--btn-line-border) !important;
            color: var(--btn-line-text) !important;
        }
        /* 表格次要文字颜色提亮 */
        body.dark-theme .stat-grid-row .stat-grid-cell {
            color: #e9ecef !important;
        }

        body.dark-theme .stat-group-count {
            color: #ffffff !important;
        }

        .status-bar {
            background: #f8f9fa;
            padding: 8px 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-top: 1px solid #e9ecef;
            flex-shrink: 0;
            font-size: 0.875em;
            z-index: 5;
        }

        /* 公告栏样式（浅青蓝底纹，与主色 #3498db / 徽章 #e7f1ff 区分） */
        .notice-bar {
            background: linear-gradient(180deg, #edf7fd 0%, #e2f1f9 100%);
            border-bottom: 1px solid #b8d9eb;
            border-top: 1px solid #b8d9eb;
            padding: 8px 12px;
            flex-shrink: 0;
        }
        .notice-viewport {
            overflow: hidden;
            height: 28px;
            position: relative;
        }
        .notice-track {
            will-change: transform;
        }
        .notice-item {
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 0;
            height: 28px;
            box-sizing: border-box;
        }
        .notice-item.important .notice-badge {
            background: #dc3545;
            color: #fff;
        }
        .notice-item.alert .notice-badge {
            background: #e74c3c;
            color: #fff;
        }
        .notice-item.alert .notice-title {
            color: #c0392b;
        }
        .notice-title-alert {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }
        .notice-alert-name {
            flex-shrink: 0;
            font-weight: 700;
            max-width: 50%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .notice-alert-summary {
            flex: 1;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-weight: 500;
            color: #5b8ba8;
        }
        .notice-item.alert .notice-time {
            color: #e74c3c;
            font-weight: 600;
        }
        .notice-badge {
            display: inline-block;
            padding: 2px 8px;
            border-radius: 0;
            font-size: 0.75em;
            font-weight: 600;
            color: #1a5276;
            background: #cce5f2;
            white-space: nowrap;
            flex-shrink: 0;
        }
        .notice-title {
            font-weight: 600;
            color: #1e4d72;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            cursor: pointer;
            background: none;
            border: none;
            font: inherit;
            text-align: left;
            padding: 0;
            min-width: 0;
            flex: 1;
        }
        .notice-title:hover {
            text-decoration: underline;
        }
        .notice-time {
            margin-left: auto;
            font-size: 0.85em;
            color: #5b8ba8;
            white-space: nowrap;
            flex-shrink: 0;
        }
        .notice-counter {
            margin-left: 12px;
            font-size: 0.75em;
            color: #5b8ba8;
            white-space: nowrap;
            flex-shrink: 0;
        }
        .notice-bar-inner {
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .notice-bar-inner .notice-viewport {
            flex: 1;
            min-width: 0;
        }
        .notice-detail-meta {
            font-size: 0.9em;
            color: #5b8ba8;
            margin-bottom: 12px;
        }
        .notice-detail-content {
            white-space: pre-wrap;
            line-height: 1.6;
            color: #333;
        }
        body.dark-theme .notice-detail-content {
            color: #e9ecef !important;
        }
        body.dark-theme .notice-detail-meta {
            color: #adb5bd !important;
        }
        @media (max-width: 768px) {
            .notice-counter {
                display: none;
            }
        }

        /* 通知管理表格 */
        #notificationManagement .announcement-important-badge {
            display: inline-block;
            padding: 2px 8px;
            background: #dc3545;
            color: #fff;
            font-size: 0.85em;
            font-weight: 700;
            line-height: 1.3;
            flex-shrink: 0;
        }

        #notificationManagement .announcement-type-label {
            display: inline-block;
            padding: 2px 8px;
            background: #e7f1ff;
            color: #0b5ed7;
            font-size: 0.82em;
            font-weight: 600;
            line-height: 1.3;
            flex-shrink: 0;
        }

        #notificationManagement .announcement-cards {
            display: grid;
            gap: 10px;
        }

        #notificationManagement .announcement-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 12px 14px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
        }

        #notificationManagement .announcement-card-important {
            background: #fff8f8;
            border-color: #f1c0c0;
        }

        #notificationManagement .announcement-card-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 8px;
        }

        #notificationManagement .announcement-card-title {
            font-size: 1em;
            font-weight: 600;
            color: #2c3e50;
            line-height: 1.35;
            min-width: 0;
            word-break: break-word;
        }

        #notificationManagement .announcement-card-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px 12px;
            font-size: 0.82em;
            color: #6c757d;
            margin-bottom: 8px;
        }

        #notificationManagement .announcement-card-creator::before {
            content: '·';
            margin-right: 6px;
        }

        #notificationManagement .announcement-card-content {
            font-size: 0.9em;
            color: #495057;
            line-height: 1.5;
            white-space: pre-wrap;
            word-break: break-word;
        }

        #notificationManagement .announcement-card-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 10px;
            padding-top: 10px;
            border-top: 1px solid #e9ecef;
        }

        #notificationManagement .announcement-card-actions .announcement-delete-btn {
            padding: 4px 10px;
            font-size: 0.85em;
        }

        #notificationManagement .announcement-card-actions .announcement-edit-btn {
            padding: 4px 10px;
            font-size: 0.85em;
        }

        #notificationManagement .data-table .col-actions {
            text-align: center;
            white-space: nowrap;
            vertical-align: middle;
        }

        #notificationManagement .announcement-card-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            justify-content: center;
        }

        #notificationManagement .data-table .col-actions .announcement-edit-btn + .announcement-delete-btn {
            margin-left: 6px;
        }

        #notificationManagement .data-table.resizable-table .announcement-edit-btn,
        #notificationManagement .data-table.resizable-table .announcement-delete-btn {
            padding: 1px 6px;
            font-size: 0.82em;
            line-height: 1.3;
            vertical-align: middle;
            border-width: 1px;
        }

        #notificationManagement .data-table .announcement-normal-label {
            color: #6c757d;
            line-height: 1.35;
        }

        #notificationManagement .data-table tbody tr.announcement-row-important td {
            background: #fff8f8;
        }

        #notificationManagement .data-table.resizable-table .announcement-delete-btn:hover {
            background: var(--btn-line-bg-hover);
            color: #a93226;
        }

        body.dark-theme #notificationManagement .data-table.resizable-table .announcement-delete-btn {
            background: var(--btn-line-bg);
        }

        body.dark-theme #notificationManagement .data-table.resizable-table .announcement-delete-btn:hover {
            background: var(--btn-line-bg-hover);
            color: #f1948a;
        }

        body.dark-theme #notificationManagement .data-table .announcement-normal-label {
            color: #adb5bd;
        }

        body.dark-theme #notificationManagement .data-table tbody tr.announcement-row-important td {
            background: rgba(220, 53, 69, 0.08);
        }

        body.dark-theme #notificationManagement .announcement-card {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme #notificationManagement .announcement-card-important {
            background: rgba(220, 53, 69, 0.08);
            border-color: rgba(220, 53, 69, 0.35);
        }

        body.dark-theme #notificationManagement .announcement-card-title {
            color: #e9ecef;
        }

        body.dark-theme #notificationManagement .announcement-card-meta {
            color: #adb5bd;
        }

        body.dark-theme #notificationManagement .announcement-card-content {
            color: #ced4da;
        }

        body.dark-theme #notificationManagement .announcement-card-actions {
            border-top-color: var(--region-border-color);
        }

        body.dark-theme #notificationManagement .announcement-type-label {
            background: rgba(52, 152, 219, 0.15);
            color: #5dade2;
        }

        body.dark-theme #notificationManagement .announcement-delete-btn {
            background: var(--btn-line-bg);
        }

        body.dark-theme #notificationManagement .announcement-delete-btn:hover {
            background: var(--btn-line-bg-hover);
            color: #f1948a;
        }

        /* 维修物品管理 */
        #repairItemManagement .repair-segment {
            display: flex;
            gap: 4px;
            margin-bottom: 14px;
            border: none;
            width: fit-content;
            max-width: 100%;
        }

        #repairItemManagement .repair-segment-btn {
            padding: 7px 14px;
            font-size: 0.9em;
        }

        #repairItemManagement .repair-segment-btn + .repair-segment-btn {
            border-left-width: 1px;
        }

        #repairItemManagement .repair-item-list {
            display: grid;
            gap: 12px;
        }

        #repairItemManagement .repair-item-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
        }

        #repairItemManagement .repair-item-title {
            font-size: 1em;
            font-weight: 600;
            margin-bottom: 6px;
        }

        #repairItemManagement .repair-item-meta {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 10px;
        }

        #repairItemManagement .repair-item-status-row {
            display: flex;
            flex-wrap: wrap;
            gap: 12px 20px;
            margin-bottom: 12px;
            font-size: 0.88em;
        }

        #repairItemManagement .repair-status-badge {
            display: inline-block;
            padding: 2px 8px;
            border-radius: 0;
            font-size: 0.85em;
            font-weight: 600;
        }

        #repairItemManagement .repair-status-已维修 { background: #d4edda; color: #155724; }
        #repairItemManagement .repair-status-未维修 { background: #fff3cd; color: #856404; }
        #repairItemManagement .repair-status-维修中 { background: #cce5ff; color: #004085; }

        #repairItemManagement .repair-item-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        #repairItemManagement .repair-action-btn {
            padding: 6px 12px;
            font-size: 0.85em;
        }

        #repairItemManagement .repair-action-btn.primary {
            font-weight: 600;
        }

        #repairItemManagement .repair-history-list,
        #repairHistoryModal .repair-history-list {
            display: grid;
            gap: 10px;
        }

        #repairItemManagement .repair-history-item,
        #repairHistoryModal .repair-history-item {
            padding: 10px 12px;
            border: 1px solid var(--region-border-color);
            background: #f8f9fa;
        }

        body.dark-theme #repairItemManagement .repair-item-card,
        body.dark-theme #repairItemManagement .repair-history-item,
        body.dark-theme #repairHistoryModal .repair-history-item {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
        }

        body.dark-theme #repairItemManagement .repair-segment {
            border: none;
        }

        body.dark-theme #repairItemManagement .repair-segment-btn + .repair-segment-btn {
            border-left-color: #3d4654;
        }

        body.dark-theme #inventoryCheck .inv-check-segment {
            border: none;
        }

        body.dark-theme #inventoryCheck .repair-segment-btn + .repair-segment-btn {
            border-left-color: #3d4654;
        }

        /* 库存预警设置 */
        #inventoryAlertSettings .alert-rule-list {
            display: grid;
            gap: 12px;
        }

        #inventoryAlertSettings .alert-rule-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
            cursor: pointer;
        }

        #inventoryAlertSettings .alert-rule-card.alerting {
            border-color: rgba(220, 53, 69, 0.45);
            background: #fff8f8;
        }

        #inventoryAlertSettings .alert-rule-head {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            margin-bottom: 8px;
        }

        #inventoryAlertSettings .alert-rule-title {
            flex: 1;
            font-size: 1em;
            font-weight: 600;
            min-width: 0;
        }

        #inventoryAlertSettings .alert-rule-meta {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 10px;
        }

        #inventoryAlertSettings .alert-rule-stats {
            display: flex;
            flex-wrap: wrap;
            gap: 12px 20px;
            font-size: 0.88em;
            margin-bottom: 10px;
        }

        #inventoryAlertSettings .alert-rule-badge {
            display: inline-block;
            padding: 2px 8px;
            font-size: 0.78em;
            font-weight: 600;
            color: #fff;
            background: #dc3545;
        }

        #inventoryAlertSettings .alert-rule-disabled {
            display: inline-block;
            padding: 2px 8px;
            font-size: 0.78em;
            color: #6c757d;
            background: #e9ecef;
        }

        #inventoryAlertSettings .alert-rule-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 12px;
            padding-top: 10px;
            border-top: 1px solid #eee;
        }

        /* 各管理页卡片删除按钮 — 统一尺寸 */
        #inventoryAlertSettings .alert-rule-delete-btn,
        #migrationReminderManagement .migration-delete-btn,
        #inventoryDependencyRules .dependency-rule-delete-btn,
        #accessoryItemManagement .accessory-item-delete-btn,
        #channelListManagement .channel-list-delete-btn,
        #roleInfoManagement .role-info-delete-btn {
            padding: 4px 10px !important;
            font-size: 0.82em !important;
            line-height: 1.3;
        }

        #alertItemPickerModal .alert-item-option {
            display: flex;
            justify-content: space-between;
            gap: 10px;
            width: 100%;
            padding: 8px 12px;
            text-align: left;
            margin-bottom: 8px;
            font-size: 0.9em;
        }

        body.dark-theme #inventoryAlertSettings .alert-rule-card {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
        }

        body.dark-theme #inventoryAlertSettings .alert-rule-card.alerting {
            background: #2a1f22 !important;
            border-color: rgba(220, 53, 69, 0.5) !important;
        }

        body.dark-theme #alertItemPickerModal .alert-item-option {
            background: #1b2026 !important;
            border-color: #2a313a !important;
        }

        /* 物品依赖规则 */
        #inventoryDependencyRules .dependency-rule-list {
            display: grid;
            gap: 12px;
        }

        #inventoryDependencyRules .dependency-rule-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
            cursor: pointer;
        }

        #inventoryDependencyRules .dependency-rule-card.inactive {
            opacity: 0.72;
        }

        #inventoryDependencyRules .dependency-rule-head {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            margin-bottom: 8px;
        }

        #inventoryDependencyRules .dependency-rule-badges {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            flex-shrink: 0;
        }

        #inventoryDependencyRules .dependency-rule-title {
            flex: 1;
            font-size: 1em;
            font-weight: 600;
            min-width: 0;
        }

        #inventoryDependencyRules .dependency-rule-meta {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 10px;
        }

        #inventoryDependencyRules .dependency-rule-desc {
            font-size: 0.9em;
            color: #495057;
            margin-bottom: 8px;
        }

        #inventoryDependencyRules .dependency-rule-section {
            margin-top: 10px;
            font-size: 0.88em;
        }

        #inventoryDependencyRules .dependency-rule-section strong {
            display: block;
            margin-bottom: 4px;
            color: #495057;
        }

        #inventoryDependencyRules .dependency-rule-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        #inventoryDependencyRules .dependency-badge {
            display: inline-block;
            padding: 2px 8px;
            font-size: 0.82em;
            background: #e9ecef;
            border-radius: 0;
            color: #495057;
        }

        #inventoryDependencyRules .dependency-badge.required {
            background: #dce8f4;
            color: #1e3a5f;
        }

        #inventoryDependencyRules .dependency-rule-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 12px;
            padding-top: 10px;
            border-top: 1px solid #eee;
        }

        .dependency-selected-items {
            display: grid;
            gap: 6px;
            margin-top: 8px;
            min-height: 28px;
        }

        .dependency-selected-empty {
            font-size: 0.88em;
            color: #6c757d;
            padding: 6px 0;
        }

        .dependency-selected-item {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 8px;
            padding: 8px 10px;
            font-size: 0.88em;
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
        }

        .dependency-selected-main {
            flex: 1;
            min-width: 0;
        }

        .dependency-selected-main .name {
            font-weight: 500;
        }

        .dependency-selected-main .meta {
            font-size: 0.9em;
            color: #6c757d;
            margin-top: 2px;
        }

        .dependency-qty-row {
            display: flex;
            align-items: center;
            gap: 8px;
            margin-top: 6px;
            font-size: 0.9em;
        }

        .dependency-qty-row input[type="number"] {
            width: 64px;
            padding: 4px 6px;
            text-align: center;
        }

        body.dark-theme #inventoryDependencyRules .dependency-rule-card {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
        }

        body.dark-theme #inventoryDependencyRules .dependency-badge {
            background: #2a313a;
            color: #adb5bd;
        }

        body.dark-theme #inventoryDependencyRules .dependency-badge.required {
            background: #1e2d3d;
            color: #8ab4d4;
        }

        body.dark-theme #inventoryDependencyRules .dependency-rule-section strong {
            color: #adb5bd;
        }

        body.dark-theme .dependency-selected-item {
            background: #161a1e !important;
            border-color: #2a313a !important;
            color: #dee2e6;
        }

        body.dark-theme #inventoryDependencyItemPickerModal .migration-item-option {
            background: #1b2026 !important;
            border-color: #2a313a !important;
        }

        body.dark-theme #inventoryDependencyItemPickerModal .migration-item-option.selected {
            background: #1e2d3d !important;
            border-width: 2px 2px 1px 3px !important;
            border-color: #0f1318 #3d4654 #454f5c transparent !important;
            color: #e9ecef !important;
        }

        /* 物品迁移提醒 */
        #migrationReminderManagement .migration-reminder-list {
            display: grid;
            gap: 12px;
        }

        #migrationReminderManagement .migration-reminder-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
        }

        #migrationReminderManagement .migration-reminder-card.expired {
            opacity: 0.72;
        }

        #migrationReminderManagement .migration-reminder-head {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            margin-bottom: 10px;
        }

        #migrationReminderManagement .migration-reminder-main {
            flex: 1;
            min-width: 0;
        }

        #migrationReminderManagement .migration-reminder-status {
            text-align: right;
            flex-shrink: 0;
        }

        #migrationReminderManagement .migration-status-badge {
            display: inline-block;
            padding: 4px 10px;
            font-size: 0.78em;
            font-weight: 600;
            color: #fff;
            margin-bottom: 4px;
        }

        #migrationReminderManagement .migration-status-badge.pending {
            background: #3498db;
        }

        #migrationReminderManagement .migration-status-badge.done {
            background: #6c757d;
        }

        #migrationReminderManagement .migration-countdown {
            font-size: 0.82em;
            color: #6c757d;
        }

        #migrationReminderManagement .migration-item-list {
            margin: 8px 0 10px;
            padding-left: 0;
            list-style: none;
        }

        #migrationReminderManagement .migration-item-list li {
            font-size: 0.88em;
            margin-bottom: 6px;
            color: #495057;
        }

        #migrationReminderManagement .migration-meta-row {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 6px;
        }

        #migrationReminderManagement .migration-reminder-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 10px;
            align-items: center;
        }

        /* 配件软物品管理 */
        #accessoryItemManagement .accessory-category-filter {
            min-width: 120px;
            padding: 7px 12px;
            font-size: 0.95em;
            border: 1px solid var(--inner-border-color);
            background: #fff;
        }

        #accessoryItemManagement .accessory-item-list {
            display: grid;
            gap: 12px;
        }

        #accessoryItemManagement .accessory-item-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
        }

        #accessoryItemManagement .accessory-item-card.always-needed {
            border-left: 4px solid #f39c12;
        }

        #accessoryItemManagement .accessory-item-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
            margin-bottom: 6px;
        }

        #accessoryItemManagement .accessory-item-title {
            font-size: 1em;
            font-weight: 600;
            flex: 1;
            min-width: 0;
        }

        #accessoryItemManagement .accessory-item-badges {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            justify-content: flex-end;
        }

        #accessoryItemManagement .accessory-badge {
            display: inline-block;
            padding: 2px 8px;
            font-size: 0.78em;
            line-height: 1.3;
            border: 1px solid var(--region-border-color);
            color: #495057;
            background: #f8f9fa;
        }

        #accessoryItemManagement .accessory-badge.remind {
            background: #fff3cd;
            border-color: #f39c12;
            color: #856404;
        }

        #accessoryItemManagement .accessory-badge.trigger {
            background: #eef5ff;
            border-color: #3498db;
            color: #1f5f99;
        }

        #accessoryItemManagement .accessory-item-desc,
        #accessoryItemManagement .accessory-item-meta,
        #accessoryItemManagement .accessory-item-notes {
            font-size: 0.88em;
            color: #6c757d;
            line-height: 1.45;
            margin-bottom: 4px;
        }

        #accessoryItemManagement .accessory-item-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 10px;
        }

        #accessoryTriggerSection.accessory-trigger-disabled {
            opacity: 0.55;
            pointer-events: none;
        }

        body.dark-theme #accessoryItemManagement .accessory-category-filter {
            background: #1a1f26;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme #accessoryItemManagement .accessory-item-card {
            background: #1a1f26;
            border-color: #2a313a;
        }

        body.dark-theme #accessoryItemManagement .accessory-item-title {
            color: #e9ecef;
        }

        body.dark-theme #accessoryItemManagement .accessory-badge {
            background: #12161c;
            border-color: #3d4654;
            color: #ced4da;
        }

        body.dark-theme #accessoryItemManagement .accessory-badge.remind {
            background: rgba(243, 156, 18, 0.15);
            border-color: #f39c12;
            color: #ffd166;
        }

        body.dark-theme #accessoryItemManagement .accessory-badge.trigger {
            background: rgba(52, 152, 219, 0.12);
            border-color: #3498db;
            color: #9fd0ff;
        }

        body.dark-theme #accessoryItemManagement .accessory-item-desc,
        body.dark-theme #accessoryItemManagement .accessory-item-meta,
        body.dark-theme #accessoryItemManagement .accessory-item-notes {
            color: #adb5bd;
        }

        /* 通道单 / 角色信息管理 */
        #channelListManagement .channel-list-cards,
        #roleInfoManagement .role-info-cards {
            display: grid;
            gap: 12px;
        }

        #channelListManagement .channel-list-card,
        #roleInfoManagement .role-info-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
        }

        #channelListManagement .channel-list-card-head,
        #roleInfoManagement .role-info-card-head {
            margin-bottom: 10px;
        }

        #channelListManagement .channel-list-card-title,
        #roleInfoManagement .role-info-card-title {
            font-size: 1.02em;
            font-weight: 600;
            color: #2c3e50;
            margin-bottom: 4px;
        }

        #channelListManagement .channel-list-card-meta {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 2px;
        }

        #roleInfoManagement .role-info-card-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        #roleInfoManagement .role-info-card-count {
            font-size: 0.82em;
            color: #6c757d;
            white-space: nowrap;
        }

        #channelListManagement .channel-list-empty-rows,
        #roleInfoManagement .role-info-empty-rows {
            font-size: 0.88em;
            color: #6c757d;
            padding: 8px 0;
        }

        #channelListManagement .channel-list-table-wrap,
        #roleInfoManagement .role-info-table-wrap,
        #channelListModal .mgmt-form-table-wrap,
        #roleInfoModal .mgmt-form-table-wrap {
            overflow-x: auto;
        }

        #channelListManagement .channel-list-card-actions,
        #roleInfoManagement .role-info-card-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 10px;
        }

        #roleInfoManagement .role-info-chorus-badge {
            display: inline-block;
            padding: 2px 8px;
            background: rgba(52, 152, 219, 0.12);
            color: #3498db;
            font-size: 0.92em;
        }

        #channelListModal .data-table input[type="text"],
        #roleInfoModal .data-table input[type="text"] {
            width: 100%;
            min-width: 72px;
            padding: 6px 8px;
            border: 1px solid var(--inner-border-color);
            background: #fff;
            font-size: 0.95em;
        }

        #channelListModal .data-table .mgmt-form-action-col,
        #roleInfoModal .data-table .mgmt-form-action-col {
            width: 72px;
            white-space: nowrap;
        }

        body.dark-theme #channelListManagement .channel-list-card,
        body.dark-theme #roleInfoManagement .role-info-card {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme #channelListManagement .channel-list-card-title,
        body.dark-theme #roleInfoManagement .role-info-card-title {
            color: #e9ecef;
        }

        body.dark-theme #channelListManagement .channel-list-card-meta,
        body.dark-theme #roleInfoManagement .role-info-card-count,
        body.dark-theme #channelListManagement .channel-list-empty-rows,
        body.dark-theme #roleInfoManagement .role-info-empty-rows {
            color: #adb5bd;
        }

        body.dark-theme #channelListModal .data-table input[type="text"],
        body.dark-theme #roleInfoModal .data-table input[type="text"] {
            background: #252b33;
            border-color: #3d4654;
            color: #e9ecef;
        }

        body.dark-theme #roleInfoManagement .role-info-chorus-badge {
            background: rgba(52, 152, 219, 0.12);
            color: #9fd0ff;
        }

        #migrationItemPickerModal .migration-item-option {
            display: flex;
            justify-content: space-between;
            gap: 10px;
            width: 100%;
            padding: 8px 12px;
            text-align: left;
            margin-bottom: 8px;
            font-size: 0.9em;
        }

        #migrationItemPickerModal .migration-item-option.selected {
            background: var(--btn-line-bg-pressed);
            border-width: var(--btn-line-width-pressed);
            border-color: var(--btn-line-border-pressed);
            color: var(--btn-line-text-hover);
            font-weight: 600;
        }

        #migrationReminderModal .migration-selected-items {
            display: grid;
            gap: 6px;
            margin-top: 8px;
        }

        #migrationReminderModal .migration-selected-item {
            display: flex;
            justify-content: space-between;
            gap: 8px;
            padding: 8px 10px;
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
            font-size: 0.88em;
        }

        body.dark-theme #migrationReminderManagement .migration-reminder-card,
        body.dark-theme #migrationReminderModal .migration-selected-item,
        body.dark-theme #migrationItemPickerModal .migration-item-option {
            background: #161a1e !important;
            border-color: var(--region-border-color) !important;
        }

        body.dark-theme #migrationItemPickerModal .migration-item-option.selected {
            background: #1e2d3d !important;
            border-width: 2px 2px 1px 3px !important;
            border-color: #0f1318 #3d4654 #454f5c transparent !important;
            color: #e9ecef !important;
        }

        .status-item {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .status-indicator {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #28a745;
        }

        .app-layout {
            display: flex;
            flex: 1;
            min-height: 0;
            overflow: hidden;
        }

        .sidebar {
            width: 240px;
            flex-shrink: 0;
            background: #f8f9fa;
            border-right: 1px solid #e9ecef;
            display: flex;
            flex-direction: column;
            overflow-y: auto;
            overflow-x: hidden;
            transition: width 0.25s ease, border-color 0.25s ease;
        }

        body.sidebar-collapsed .sidebar {
            width: 0;
            min-width: 0;
            border-right-width: 0;
            overflow: hidden;
        }

        body.sidebar-collapsed .sidebar-nav {
            opacity: 0;
            pointer-events: none;
        }

        .sidebar-nav {
            display: flex;
            flex-direction: column;
            padding: 5px 4px;
            gap: 3px;
            flex: 1;
            transition: opacity 0.2s ease;
        }

        @media (max-width: 768px) {
            body.sidebar-collapsed .sidebar {
                width: 280px;
                border-right-width: 1px;
            }
            body.sidebar-collapsed .sidebar-nav {
                opacity: 1;
                pointer-events: auto;
            }
        }

        .sidebar-item {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            width: 100%;
            padding: 5px 10px 5px 6px;
            text-align: center;
            cursor: pointer;
            border-style: solid;
            border-width: 1px 1px 2px 3px;
            border-color: #ffffff #b0b8c0 #909aa4 transparent;
            border-radius: 0;
            background: #f5f7f9;
            box-shadow: none;
            font-size: 0.93em;
            font-weight: 500;
            color: #6c757d;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
        }

        .sidebar-item:hover {
            color: #495057;
            background: #fafbfc;
            border-color: #ffffff #a3acb6 #828c96 transparent;
        }

        .sidebar-item:active {
            background: #dce8f4;
            border-width: 2px 2px 1px 3px;
            border-color: #909aa4 #ffffff #ffffff transparent;
        }

        .sidebar-item.active {
            color: #495057;
            background: #dce8f4;
            font-weight: 600;
            border-width: 2px 2px 1px 3px;
            border-color: #909aa4 #ffffff #ffffff transparent;
            box-shadow: none;
        }

        .sidebar-item.active:hover {
            color: #495057;
            background: #dce8f4;
            border-width: 2px 2px 1px 3px;
            border-color: #909aa4 #ffffff #ffffff transparent;
        }

        .sidebar-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 22px;
            height: 22px;
            flex-shrink: 0;
        }

        .sidebar-icon svg {
            width: 18px;
            height: 18px;
            display: block;
        }

        .sidebar-item .sidebar-icon {
            color: #1a5276;
        }

        .sidebar-label {
            flex: 0 0 7.2em;
            width: 7.2em;
            text-align: justify;
            text-align-last: justify;
            text-justify: inter-ideograph;
            line-height: 1.25;
        }

        .sidebar-item:not(.active) .sidebar-icon {
            opacity: 0.88;
        }

        .sidebar-item.active .sidebar-icon {
            opacity: 1;
        }

        /* 线条式 3D 按钮（侧边栏与右侧内容区共用） */
        :root {
            --btn-line-bg: #f5f7f9;
            --btn-line-bg-hover: #fafbfc;
            --btn-line-bg-pressed: #dce8f4;
            --btn-line-bg-active: #dce8f4;
            --btn-line-border: #ffffff #b0b8c0 #909aa4 transparent;
            --btn-line-border-hover: #ffffff #a3acb6 #828c96 transparent;
            --btn-line-border-pressed: #909aa4 #ffffff #ffffff transparent;
            --btn-line-border-active: #909aa4 #ffffff #ffffff transparent;
            --btn-line-border-danger: #ffffff #d49aa4 #b03a46 #dc3545;
            --btn-line-text: #6c757d;
            --btn-line-text-hover: #495057;
            --btn-line-text-active: #2c3e50;
            --btn-line-width: 1px 1px 2px 3px;
            --btn-line-width-pressed: 2px 2px 1px 3px;
        }

        body.dark-theme {
            --btn-line-bg: #252b33;
            --btn-line-bg-hover: #2a313a;
            --btn-line-bg-pressed: #1e2d3d;
            --btn-line-bg-active: #1e2d3d;
            --btn-line-border: #3d4654 #1a1f26 #0f1318 transparent;
            --btn-line-border-hover: #454f5c #151a20 #0a0d10 transparent;
            --btn-line-border-pressed: #0f1318 #3d4654 #454f5c transparent;
            --btn-line-border-active: #0f1318 #3d4654 #454f5c transparent;
            --btn-line-border-danger: #3d4654 #1a1f26 #0f1318 #dc3545;
            --btn-line-text: #aeb6bf;
            --btn-line-text-hover: #e9ecef;
            --btn-line-text-active: #e9ecef;
        }

        .btn-line-3d,
        .main-area .filter-btn,
        .main-area .refresh-btn,
        .main-area .view-btn,
        .main-area .repair-segment-btn,
        .main-area .repair-action-btn,
        .main-area .inv-check-action-btn,
        .main-area .stock-op-submit,
        .modal .filter-btn,
        .modal .refresh-btn,
        .modal .view-btn,
        #notificationManagement .announcement-delete-btn,
        #notificationManagement .announcement-edit-btn,
        #inventoryAlertSettings .alert-rule-delete-btn,
        #migrationReminderManagement .migration-delete-btn,
        #inventoryDependencyRules .dependency-rule-delete-btn,
        #accessoryItemManagement .accessory-item-delete-btn,
        #channelListManagement .channel-list-delete-btn,
        #roleInfoManagement .role-info-delete-btn,
        #barcodeLibrary .bc-lib-load-more button,
        #alertItemPickerModal .alert-item-option,
        #migrationItemPickerModal .migration-item-option,
        #inventoryDependencyItemPickerModal .migration-item-option,
        .main-area .stock-op-remove-btn,
        .migration-selected-item-remove {
            border-style: solid;
            border-width: var(--btn-line-width);
            border-color: var(--btn-line-border);
            border-radius: 0;
            background: var(--btn-line-bg);
            box-shadow: none;
            color: var(--btn-line-text);
            font-weight: 500;
            cursor: pointer;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
        }

        .btn-line-3d:hover,
        .main-area .filter-btn:hover,
        .main-area .refresh-btn:hover,
        .main-area .view-btn:hover,
        .main-area .repair-segment-btn:hover,
        .main-area .repair-action-btn:hover,
        .main-area .inv-check-action-btn:hover,
        .main-area .stock-op-submit:not(:disabled):hover,
        .modal .filter-btn:hover,
        .modal .refresh-btn:hover,
        .modal .view-btn:hover,
        #barcodeLibrary .bc-lib-load-more button:hover,
        #alertItemPickerModal .alert-item-option:hover,
        #migrationItemPickerModal .migration-item-option:hover,
        #inventoryDependencyItemPickerModal .migration-item-option:hover {
            color: var(--btn-line-text-hover);
            background: var(--btn-line-bg-hover);
            border-color: var(--btn-line-border-hover);
        }

        .btn-line-3d:active,
        .main-area .filter-btn:active,
        .main-area .refresh-btn:active,
        .main-area .view-btn:active,
        .main-area .repair-segment-btn:active,
        .main-area .repair-action-btn:active,
        .main-area .inv-check-action-btn:active,
        .main-area .stock-op-submit:not(:disabled):active,
        .modal .filter-btn:active,
        .modal .refresh-btn:active,
        .modal .view-btn:active,
        #barcodeLibrary .bc-lib-load-more button:active,
        .btn-line-3d.active,
        .main-area .filter-btn.active,
        .main-area .refresh-btn.active,
        .main-area .view-btn.active,
        .main-area .repair-segment-btn.active,
        .main-area .repair-action-btn.active,
        .main-area .inv-check-action-btn.active,
        .modal .filter-btn.active,
        .modal .refresh-btn.active,
        .modal .view-btn.active,
        #alertItemPickerModal .alert-item-option.selected,
        #migrationItemPickerModal .migration-item-option.selected,
        #inventoryDependencyItemPickerModal .migration-item-option.selected {
            background: var(--btn-line-bg-pressed);
            border-width: var(--btn-line-width-pressed);
            border-color: var(--btn-line-border-pressed);
            color: var(--btn-line-text-hover);
            font-weight: 600;
        }

        .btn-line-3d.active:hover,
        .main-area .filter-btn.active:hover,
        .main-area .refresh-btn.active:hover,
        .main-area .view-btn.active:hover,
        .main-area .repair-segment-btn.active:hover,
        .main-area .repair-action-btn.active:hover,
        .main-area .inv-check-action-btn.active:hover,
        .modal .filter-btn.active:hover,
        .modal .refresh-btn.active:hover,
        .modal .view-btn.active:hover,
        #alertItemPickerModal .alert-item-option.selected:hover,
        #migrationItemPickerModal .migration-item-option.selected:hover,
        #inventoryDependencyItemPickerModal .migration-item-option.selected:hover {
            background: var(--btn-line-bg-pressed);
            border-width: var(--btn-line-width-pressed);
            border-color: var(--btn-line-border-pressed);
            color: var(--btn-line-text-hover);
        }

        .modal .filter-btn.btn-line-danger,
        .btn-line-danger,
        #notificationManagement .announcement-delete-btn,
        #inventoryAlertSettings .alert-rule-delete-btn,
        #migrationReminderManagement .migration-delete-btn,
        #inventoryDependencyRules .dependency-rule-delete-btn,
        #accessoryItemManagement .accessory-item-delete-btn,
        #channelListManagement .channel-list-delete-btn,
        #roleInfoManagement .role-info-delete-btn,
        .main-area .stock-op-remove-btn,
        .migration-selected-item-remove {
            border-color: var(--btn-line-border-danger);
            color: #c0392b;
        }

        body.dark-theme .btn-line-danger,
        body.dark-theme #notificationManagement .announcement-delete-btn,
        body.dark-theme #inventoryAlertSettings .alert-rule-delete-btn,
        body.dark-theme #migrationReminderManagement .migration-delete-btn,
        body.dark-theme #inventoryDependencyRules .dependency-rule-delete-btn,
        body.dark-theme #accessoryItemManagement .accessory-item-delete-btn,
        body.dark-theme #channelListManagement .channel-list-delete-btn,
        body.dark-theme #roleInfoManagement .role-info-delete-btn,
        body.dark-theme .main-area .stock-op-remove-btn,
        body.dark-theme .migration-selected-item-remove {
            color: #f1948a;
        }

        .btn-line-danger:hover,
        #notificationManagement .announcement-delete-btn:hover,
        #inventoryAlertSettings .alert-rule-delete-btn:hover,
        #migrationReminderManagement .migration-delete-btn:hover,
        #inventoryDependencyRules .dependency-rule-delete-btn:hover,
        #accessoryItemManagement .accessory-item-delete-btn:hover,
        #channelListManagement .channel-list-delete-btn:hover,
        #roleInfoManagement .role-info-delete-btn:hover,
        .main-area .stock-op-remove-btn:hover,
        .migration-selected-item-remove:hover {
            color: #a93226;
            background: var(--btn-line-bg-hover);
            border-color: var(--btn-line-border-danger);
        }

        #importConfirmBtn {
            margin-top: 12px;
        }

        .main-area {
            flex: 1;
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }

        .content-panel {
            flex: 1;
            min-height: 0;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
        }

        .sidebar-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            padding: 0;
            background: rgba(255,255,255,0.12);
            border: 1px solid rgba(255,255,255,0.25);
            border-radius: 8px;
            color: white;
            cursor: pointer;
            font-size: 1.1em;
            line-height: 1;
            flex-shrink: 0;
        }

        .sidebar-toggle:hover {
            background: rgba(255,255,255,0.2);
        }

        .sidebar-overlay {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0,0,0,0.4);
            z-index: 999;
        }

        body.sidebar-open .sidebar-overlay {
            display: block;
        }

        .tab-content {
            display: none;
            padding: 10px 12px 14px;
        }

        .tab-content.active {
            display: block;
        }

        .controls {
            display: flex;
            gap: 15px;
            margin-bottom: 25px;
            flex-wrap: wrap;
        }

        .search-box {
            flex: 1;
            min-width: 250px;
            padding: 12px 20px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 1em;
            color: #2c3e50;
            background: #fff;
            box-shadow:
                inset 2px 2px 5px rgba(52, 152, 219, 0.22),
                inset -1px -1px 0 #fff;
            transition: border-color 0.2s, box-shadow 0.2s;
        }

        .search-box:focus {
            outline: none;
            border-color: var(--inner-border-color);
            background: #fff;
            box-shadow:
                inset 2px 2px 6px rgba(52, 152, 219, 0.28),
                inset -1px -1px 0 #fff;
        }

        .search-box::placeholder {
            color: #6c757d;
        }

        /* 所有表单输入框：方角（覆盖内联样式） */
        input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
        select,
        textarea {
            border-radius: 0 !important;
        }

        body:not(.dark-theme) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not(.search-box),
        body:not(.dark-theme) select,
        body:not(.dark-theme) textarea {
            border-color: var(--inner-border-color);
        }

        body:not(.dark-theme) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):focus,
        body:not(.dark-theme) select:focus,
        body:not(.dark-theme) textarea:focus {
            outline: none;
            border-color: var(--inner-border-color);
        }

        .filter-btn,
        .refresh-btn {
            padding: 7px 14px;
            font-size: 0.9em;
        }

        /* 列表页：搜索条上下留白最小化 */
        #inventory.tab-content,
        #barcodeLibrary.tab-content,
        #qrCodeBinding.tab-content,
        #traceability.tab-content,
        #stockRecords.tab-content,
        #preOutbound.tab-content,
        #notificationManagement.tab-content,
        #imageManagement.tab-content,
        #repairItemManagement.tab-content,
        #inventoryAlertSettings.tab-content,
        #inventoryDependencyRules.tab-content,
        #migrationReminderManagement.tab-content,
        #accessoryItemManagement.tab-content,
        #statistics.tab-content,
        #inventoryCheck.tab-content {
            padding: 6px 10px 8px;
        }

        #inventory > .controls,
        #barcodeLibrary > .controls,
        #qrCodeBinding > .controls,
        #traceability > .controls,
        #stockRecords > .controls,
        #preOutbound > .controls,
        #notificationManagement > .controls,
        #imageManagement > .controls,
        #repairItemManagement > .controls,
        #inventoryAlertSettings > .controls,
        #inventoryDependencyRules > .controls,
        #migrationReminderManagement > .controls,
        #accessoryItemManagement > .controls,
        #channelListManagement > .controls,
        #roleInfoManagement > .controls {
            margin: 0 0 6px;
            gap: 8px;
        }

        #inventory > .controls .search-box,
        #barcodeLibrary > .controls .search-box,
        #qrCodeBinding > .controls .search-box,
        #traceability > .controls .search-box,
        #stockRecords > .controls .search-box,
        #preOutbound > .controls .search-box,
        #notificationManagement > .controls .search-box,
        #imageManagement > .controls .search-box,
        #repairItemManagement > .controls .search-box,
        #inventoryAlertSettings > .controls .search-box,
        #inventoryDependencyRules > .controls .search-box,
        #migrationReminderManagement > .controls .search-box,
        #accessoryItemManagement > .controls .search-box,
        #channelListManagement > .controls .search-box,
        #roleInfoManagement > .controls .search-box {
            padding: 7px 12px;
            font-size: 0.95em;
        }

        #inventory > .controls .filter-btn,
        #inventory > .controls .refresh-btn,
        #barcodeLibrary > .controls .filter-btn,
        #barcodeLibrary > .controls .refresh-btn,
        #qrCodeBinding > .controls .filter-btn,
        #qrCodeBinding > .controls .refresh-btn,
        #traceability > .controls .filter-btn,
        #traceability > .controls .refresh-btn,
        #stockRecords > .controls .filter-btn,
        #stockRecords > .controls .refresh-btn,
        #preOutbound > .controls .filter-btn,
        #preOutbound > .controls .refresh-btn,
        #notificationManagement > .controls .filter-btn,
        #notificationManagement > .controls .refresh-btn,
        #imageManagement > .controls .filter-btn,
        #imageManagement > .controls .refresh-btn,
        #repairItemManagement > .controls .filter-btn,
        #repairItemManagement > .controls .refresh-btn,
        #inventoryAlertSettings > .controls .filter-btn,
        #inventoryAlertSettings > .controls .refresh-btn,
        #inventoryDependencyRules > .controls .filter-btn,
        #inventoryDependencyRules > .controls .refresh-btn,
        #migrationReminderManagement > .controls .filter-btn,
        #migrationReminderManagement > .controls .refresh-btn,
        #accessoryItemManagement > .controls .filter-btn,
        #accessoryItemManagement > .controls .refresh-btn,
        #channelListManagement > .controls .filter-btn,
        #channelListManagement > .controls .refresh-btn,
        #roleInfoManagement > .controls .filter-btn,
        #roleInfoManagement > .controls .refresh-btn {
            padding: 7px 12px;
            font-size: 0.9em;
        }

        /* 列表页：搜索栏 + 表头 sticky（库存 / 出入库记录 / 预出库 / 流转追溯 / 通知管理） */
        #inventory,
        #stockRecords,
        #preOutbound,
        #traceability,
        #notificationManagement {
            --sticky-table-top: 0px;
        }

        #inventory > .controls,
        #stockRecords > .controls,
        #preOutbound > .controls,
        #traceability > .controls,
        #notificationManagement > .controls {
            position: sticky;
            top: 0;
            z-index: 6;
            background: #fff;
            margin-bottom: 0 !important;
            padding-bottom: 8px;
            border-bottom: var(--table-outer-border-width) solid var(--region-border-color);
        }

        body.dark-theme #inventory > .controls,
        body.dark-theme #stockRecords > .controls,
        body.dark-theme #preOutbound > .controls,
        body.dark-theme #traceability > .controls,
        body.dark-theme #notificationManagement > .controls {
            background: #161a1e;
        }

        #barcodeLibrary .bc-lib-filters {
            margin-bottom: 6px;
            padding: 5px 8px;
            border: 1px solid var(--region-border-color);
            border-radius: 0;
            background: #fff;
        }

        #barcodeLibrary .bc-lib-filters.bc-lib-filters-hidden {
            display: none;
        }

        .stats {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 20px;
            margin-bottom: 30px;
        }

        .stat-card {
            background: #ffffff;
            color: #2c3e50;
            padding: 20px;
            border-radius: 6px;
            text-align: center;
            border: 1px solid var(--region-border-color);
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
        }

        .stat-card h3 {
            font-size: 2.5em;
            margin-bottom: 10px;
            color: #3498db;
            font-weight: 600;
        }

        .stat-card p {
            opacity: 0.9;
            font-size: 1.1em;
        }

        .stat-card.clickable {
            cursor: pointer;
            transition: all 0.2s ease;
        }

        .stat-card.clickable:hover {
            background: #f8f9fa;
            border-color: #3498db;
            transform: translateY(-2px);
            box-shadow: 0 3px 8px rgba(52, 152, 219, 0.2);
        }

        .stat-card.clickable.active {
            background: #e7f1ff;
            border-color: #3498db;
            border-width: 2px;
        }

        body.dark-theme .stat-card.clickable:hover {
            background: #2a313a;
        }

        body.dark-theme .stat-card.clickable.active {
            background: #1e3a5f;
            border-color: #3498db;
        }

        .data-table {
            width: 100%;
            border-collapse: collapse;
            background: white;
            border-radius: 4px;
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
            border: var(--table-outer-border-width) solid var(--region-border-color);
        }

        .barcode-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 5px;
        }

        /* 通用条码容器（库存表格用） */
        .barcode-wrapper {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
        }
        .barcode-svg {
            max-width: 150px;
            height: auto;
        }

        .barcode-image {
            max-width: 150px;
            height: auto;
            image-rendering: crisp-edges;
        }

        .barcode-text {
            font-size: 0.75em;
            color: #000000;
            font-family: 'Courier New', monospace;
            letter-spacing: 1px;
        }

        .data-table thead {
            background: #34495e;
            color: white;
        }

        .data-table th {
            padding: 15px;
            text-align: left;
            font-weight: 600;
        }

        .data-table td {
            padding: 15px;
            border-bottom: 1px solid var(--inner-border-color);
        }

        .data-table tbody tr:hover {
            background: #f8f9fa;
        }

        /* 库存表格：紧凑行高 */
        #inventory .data-table {
            font-size: 0.875em;
        }

        #inventory .data-table th {
            padding: 8px 10px;
            font-size: 0.92em;
            line-height: 1.3;
        }

        #inventory .data-table td {
            padding: 6px 10px;
            line-height: 1.35;
            vertical-align: middle;
        }

        #inventory .data-table .status-badge {
            padding: 2px 8px;
            border-radius: 0;
            font-size: 0.85em;
            line-height: 1.3;
        }

        #inventory .inventory-table-wrap,
        #stockRecords .stock-table-wrap,
        #preOutbound .preoutbound-table-wrap,
        #traceability .trace-table-wrap,
        #notificationManagement .announcement-table-wrap,
        #qrCodeBinding .qr-binding-table-wrap {
            overflow: visible;
            width: 100%;
            position: relative;
            box-shadow: var(--table-side-inset-shadow);
        }

        #inventory .inventory-table-wrap .data-table.resizable-table,
        #stockRecords .stock-table-wrap .data-table.resizable-table,
        #preOutbound .preoutbound-table-wrap .data-table.resizable-table,
        #traceability .trace-table-wrap .data-table.resizable-table,
        #notificationManagement .announcement-table-wrap .data-table.resizable-table,
        #qrCodeBinding .qr-binding-table-wrap .data-table.resizable-table {
            table-layout: fixed;
            width: 100%;
            border-collapse: collapse;
            border-spacing: 0;
            overflow: visible;
            border-radius: 0;
            box-shadow: none;
            border: none;
        }

        #inventory .data-table.resizable-table thead,
        #stockRecords .data-table.resizable-table thead,
        #preOutbound .data-table.resizable-table thead,
        #traceability .data-table.resizable-table thead,
        #notificationManagement .data-table.resizable-table thead,
        #qrCodeBinding .data-table.resizable-table thead {
            position: relative;
            z-index: 5;
        }

        #inventory .data-table.resizable-table thead tr,
        #stockRecords .data-table.resizable-table thead tr,
        #preOutbound .data-table.resizable-table thead tr,
        #traceability .data-table.resizable-table thead tr,
        #notificationManagement .data-table.resizable-table thead tr,
        #qrCodeBinding .data-table.resizable-table thead tr {
            position: static;
        }

        #inventory .data-table.resizable-table thead th,
        #stockRecords .data-table.resizable-table thead th,
        #preOutbound .data-table.resizable-table thead th,
        #traceability .data-table.resizable-table thead th,
        #notificationManagement .data-table.resizable-table thead th,
        #qrCodeBinding .data-table.resizable-table thead th {
            position: sticky;
            top: calc(var(--sticky-table-top) - 1px);
            z-index: 5;
            isolation: isolate;
            transform: translateZ(0);
            backface-visibility: hidden;
            background: #34495e;
            background-clip: border-box;
            border: none;
            border-top: none;
            border-top-width: 0 !important;
            border-left: none;
            border-right: none;
            border-bottom: 1px solid var(--table-head-border-color);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #inventory .data-table.resizable-table tbody td,
        #stockRecords .data-table.resizable-table tbody td,
        #preOutbound .data-table.resizable-table tbody td,
        #traceability .data-table.resizable-table tbody td,
        #notificationManagement .data-table.resizable-table tbody td,
        #qrCodeBinding .data-table.resizable-table tbody td {
            border: 1px solid var(--inner-border-color);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        body.dark-theme #inventory .data-table.resizable-table thead th,
        body.dark-theme #stockRecords .data-table.resizable-table thead th,
        body.dark-theme #preOutbound .data-table.resizable-table thead th,
        body.dark-theme #traceability .data-table.resizable-table thead th,
        body.dark-theme #notificationManagement .data-table.resizable-table thead th,
        body.dark-theme #qrCodeBinding .data-table.resizable-table thead th {
            background: #0f1419 !important;
            border-bottom-color: var(--table-head-border-color) !important;
            border-left: none;
            border-right: none;
            border-top: none;
        }

        body:not(.dark-theme) #inventory .data-table.resizable-table thead th,
        body:not(.dark-theme) #stockRecords .data-table.resizable-table thead th,
        body:not(.dark-theme) #preOutbound .data-table.resizable-table thead th,
        body:not(.dark-theme) #traceability .data-table.resizable-table thead th,
        body:not(.dark-theme) #notificationManagement .data-table.resizable-table thead th,
        body:not(.dark-theme) #qrCodeBinding .data-table.resizable-table thead th {
            border-top: none !important;
            border-top-width: 0 !important;
            border-left: none !important;
            border-left-width: 0 !important;
            border-right: none !important;
            border-right-width: 0 !important;
            border-bottom: 1px solid var(--table-head-border-color) !important;
            background-color: #34495e;
        }

        #inventory .data-table.resizable-table th {
            padding-right: 12px;
            user-select: none;
        }

        #inventory .data-table.resizable-table .th-label {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        #inventory .inv-sort-btn {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 4px;
            width: calc(100% - 8px);
            max-width: 100%;
            padding: 0;
            margin: 0;
            border: none;
            background: none;
            color: inherit;
            font: inherit;
            font-weight: 600;
            cursor: pointer;
            text-align: left;
        }

        #inventory .inv-sort-btn .th-label {
            flex: 1;
            min-width: 0;
        }

        #inventory .inv-sort-arrows {
            flex-shrink: 0;
            display: inline-flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0;
            line-height: 1;
            margin-left: 4px;
        }

        #inventory .inv-sort-up,
        #inventory .inv-sort-down {
            font-size: 0.55em;
            line-height: 0.85;
            opacity: 0.65;
        }

        #inventory .inv-sort-up.active,
        #inventory .inv-sort-down.active {
            opacity: 1;
        }

        #inventory .inv-sort-btn:hover .inv-sort-up,
        #inventory .inv-sort-btn:hover .inv-sort-down {
            opacity: 0.85;
        }

        #inventory .inv-sort-btn:hover .inv-sort-up.active,
        #inventory .inv-sort-btn:hover .inv-sort-down.active {
            opacity: 1;
        }

        #inventory .data-table.resizable-table .col-resize-handle {
            position: absolute;
            top: 0;
            right: 0;
            width: 7px;
            height: 100%;
            cursor: col-resize;
            z-index: 2;
            touch-action: none;
        }

        #inventory .data-table.resizable-table .col-resize-handle:hover,
        #inventory .data-table.resizable-table th.resizing .col-resize-handle {
            background: rgba(52, 152, 219, 0.35);
        }

        body.dark-theme #inventory .data-table.resizable-table tbody td,
        body.dark-theme #stockRecords .data-table.resizable-table tbody td,
        body.dark-theme #preOutbound .data-table.resizable-table tbody td,
        body.dark-theme #traceability .data-table.resizable-table tbody td,
        body.dark-theme #notificationManagement .data-table.resizable-table tbody td,
        body.dark-theme #qrCodeBinding .data-table.resizable-table tbody td {
            border-color: #2a313a !important;
        }

        body.dark-theme #inventory .inventory-table-wrap,
        body.dark-theme #stockRecords .stock-table-wrap,
        body.dark-theme #preOutbound .preoutbound-table-wrap,
        body.dark-theme #traceability .trace-table-wrap,
        body.dark-theme #notificationManagement .announcement-table-wrap,
        body.dark-theme #qrCodeBinding .qr-binding-table-wrap {
            box-shadow: var(--table-side-inset-shadow);
        }

        body.col-resizing,
        body.col-resizing * {
            cursor: col-resize !important;
            user-select: none !important;
        }

        #inventory .data-table .col-optional {
            white-space: nowrap;
        }

        /* 出入库记录 / 预出库方案 / 流转追溯 / 通知管理 / 二维码绑定表格（与库存表一致风格） */
        #stockRecords .data-table.resizable-table,
        #preOutbound .data-table.resizable-table,
        #traceability .data-table.resizable-table,
        #notificationManagement .data-table.resizable-table,
        #qrCodeBinding .data-table.resizable-table,
        #channelListManagement .data-table,
        #roleInfoManagement .data-table,
        #channelListModal .data-table,
        #roleInfoModal .data-table {
            font-size: 0.875em;
        }

        #stockRecords .data-table.resizable-table thead th,
        #preOutbound .data-table.resizable-table thead th,
        #traceability .data-table.resizable-table thead th,
        #notificationManagement .data-table.resizable-table thead th,
        #qrCodeBinding .data-table.resizable-table thead th,
        #channelListManagement .data-table thead th,
        #roleInfoManagement .data-table thead th,
        #channelListModal .data-table thead th,
        #roleInfoModal .data-table thead th {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #stockRecords .data-table.resizable-table tbody td,
        #preOutbound .data-table.resizable-table tbody td,
        #traceability .data-table.resizable-table tbody td,
        #notificationManagement .data-table.resizable-table tbody td,
        #qrCodeBinding .data-table.resizable-table tbody td,
        #channelListManagement .data-table tbody td,
        #roleInfoManagement .data-table tbody td,
        #channelListModal .data-table tbody td,
        #roleInfoModal .data-table tbody td {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #stockRecords .data-table.resizable-table th,
        #preOutbound .data-table.resizable-table th,
        #traceability .data-table.resizable-table th,
        #notificationManagement .data-table.resizable-table th,
        #qrCodeBinding .data-table.resizable-table th,
        #channelListManagement .data-table th,
        #roleInfoManagement .data-table th,
        #channelListModal .data-table th,
        #roleInfoModal .data-table th {
            padding: 8px 10px;
            font-size: 0.92em;
            line-height: 1.3;
            padding-right: 12px;
            user-select: none;
        }

        #stockRecords .data-table.resizable-table .th-label,
        #preOutbound .data-table.resizable-table .th-label,
        #traceability .data-table.resizable-table .th-label,
        #notificationManagement .data-table.resizable-table .th-label,
        #qrCodeBinding .data-table.resizable-table .th-label {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        #stockRecords .data-table.resizable-table .col-resize-handle,
        #preOutbound .data-table.resizable-table .col-resize-handle,
        #traceability .data-table.resizable-table .col-resize-handle,
        #notificationManagement .data-table.resizable-table .col-resize-handle,
        #qrCodeBinding .data-table.resizable-table .col-resize-handle {
            position: absolute;
            top: 0;
            right: 0;
            width: 7px;
            height: 100%;
            cursor: col-resize;
            z-index: 2;
            touch-action: none;
        }

        #stockRecords .data-table.resizable-table .col-resize-handle:hover,
        #stockRecords .data-table.resizable-table th.resizing .col-resize-handle,
        #preOutbound .data-table.resizable-table .col-resize-handle:hover,
        #preOutbound .data-table.resizable-table th.resizing .col-resize-handle,
        #traceability .data-table.resizable-table .col-resize-handle:hover,
        #traceability .data-table.resizable-table th.resizing .col-resize-handle,
        #notificationManagement .data-table.resizable-table .col-resize-handle:hover,
        #notificationManagement .data-table.resizable-table th.resizing .col-resize-handle,
        #qrCodeBinding .data-table.resizable-table .col-resize-handle:hover,
        #qrCodeBinding .data-table.resizable-table th.resizing .col-resize-handle {
            background: rgba(52, 152, 219, 0.35);
        }

        #stockRecords .data-table.resizable-table td,
        #preOutbound .data-table.resizable-table td,
        #traceability .data-table.resizable-table td,
        #notificationManagement .data-table.resizable-table td,
        #qrCodeBinding .data-table.resizable-table td,
        #channelListManagement .data-table td,
        #roleInfoManagement .data-table td,
        #channelListModal .data-table td,
        #roleInfoModal .data-table td {
            padding: 6px 10px;
            line-height: 1.35;
            vertical-align: middle;
        }

        #stockRecords .data-table.resizable-table .type-badge,
        #traceability .data-table.resizable-table .status-badge {
            padding: 2px 8px;
            border-radius: 0;
            font-size: 0.85em;
            line-height: 1.3;
        }

        #stockRecords .data-table.resizable-table th.col-photos,
        #stockRecords .data-table.resizable-table td.col-photos {
            text-align: center;
            padding-left: 4px;
            padding-right: 4px;
        }

        #stockRecords .stock-photo-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #3498db;
            vertical-align: middle;
        }

        body.dark-theme #stockRecords .stock-photo-icon {
            color: #5dade2;
        }

        @media (max-width: 576px) {
            #stockRecords .data-table .col-hide-mobile,
            #preOutbound .data-table .col-hide-mobile,
            #notificationManagement .data-table .col-hide-mobile,
            #qrCodeBinding .data-table .col-hide-mobile {
                display: none;
            }

            #preOutbound .item-card .detail-label {
                font-size: 0.8em;
            }

            #preOutbound .item-card .detail-value {
                font-size: 0.95em;
            }

            #preOutbound .item-card .barcode-container {
                flex-direction: column;
                align-items: flex-end;
                gap: 4px;
            }

            #preOutbound .item-card .barcode-image {
                max-width: 40vw !important;
            }
        }

        #stockRecords .data-table tbody tr.data-table-row-clickable,
        #preOutbound .data-table tbody tr.data-table-row-clickable {
            cursor: pointer;
            transition: background-color 0.2s;
        }

        #stockRecords .data-table tbody tr.data-table-row-clickable:hover,
        #preOutbound .data-table tbody tr.data-table-row-clickable:hover {
            background: #f0f7ff !important;
        }

        body.dark-theme #stockRecords .data-table tbody tr.data-table-row-clickable:hover,
        body.dark-theme #preOutbound .data-table tbody tr.data-table-row-clickable:hover {
            background: #1e3a5f !important;
        }

        /* 出入库详情 - 照片缩略图与放大预览 */
        #detailModal .modal-content.stock-record-detail-modal,
        #detailModal .modal-content.pre-outbound-detail-modal,
        #detailModal .modal-content.trace-detail-modal,
        #detailModal .modal-content.inventory-detail-modal,
        #inventoryEditModal .modal-content.inventory-detail-modal {
            max-width: min(1200px, 96vw);
            width: 96%;
            margin: 2% auto;
        }

        #detailModal .modal-content.stock-record-detail-modal .modal-body,
        #detailModal .modal-content.pre-outbound-detail-modal .modal-body,
        #detailModal .modal-content.trace-detail-modal .modal-body,
        #detailModal .modal-content.inventory-detail-modal .modal-body,
        #inventoryEditModal .modal-content.inventory-detail-modal .modal-body {
            max-height: 85vh;
            padding: 28px 36px;
        }

        .detail-actions-bar {
            display: flex;
            gap: 8px;
            justify-content: flex-end;
            margin-bottom: 14px;
            flex-wrap: wrap;
        }

        #photos-container .photo-thumb-btn {
            display: block;
            width: 100%;
            border: 1px solid var(--region-border-color);
            border-radius: 6px;
            overflow: hidden;
            background: #fff;
            padding: 0;
            cursor: zoom-in;
            transition: border-color 0.2s, box-shadow 0.2s;
        }

        #photos-container .photo-thumb-btn:hover {
            border-color: #3498db;
            box-shadow: 0 2px 8px rgba(52, 152, 219, 0.25);
        }

        #photos-container .photo-thumb-btn img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            aspect-ratio: 4/3;
        }

        .photo-lightbox {
            display: none;
            position: fixed;
            z-index: 2000;
            inset: 0;
            background: rgba(0, 0, 0, 0.88);
            align-items: center;
            justify-content: center;
            padding: 48px 16px 16px;
        }

        .photo-lightbox.open {
            display: flex;
        }

        .photo-lightbox-img {
            max-width: min(95vw, 1200px);
            max-height: 90vh;
            width: auto;
            height: auto;
            object-fit: contain;
            border-radius: 4px;
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
            cursor: default;
        }

        .photo-lightbox-close {
            position: absolute;
            top: 12px;
            right: 16px;
            width: 40px;
            height: 40px;
            border: none;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.15);
            color: #fff;
            font-size: 28px;
            line-height: 1;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .photo-lightbox-close:hover {
            background: rgba(255, 255, 255, 0.28);
        }

        /* 图片管理 */
        #imageManagement .image-mgmt-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 16px;
            padding: 8px 0;
        }

        #imageManagement .image-mgmt-card {
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            overflow: hidden;
            background: #fff;
            transition: box-shadow 0.2s, border-color 0.2s;
        }

        #imageManagement .image-mgmt-card:hover {
            border-color: #3498db;
            box-shadow: 0 4px 12px rgba(52, 152, 219, 0.15);
        }

        #imageManagement .image-mgmt-thumb {
            display: block;
            width: 100%;
            aspect-ratio: 4/3;
            border: none;
            padding: 0;
            background: #f8f9fa;
            cursor: zoom-in;
            overflow: hidden;
        }

        #imageManagement .image-mgmt-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        #imageManagement .image-mgmt-thumb .image-mgmt-placeholder {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #adb5bd;
            font-size: 2.5em;
        }

        #imageManagement .image-mgmt-info {
            padding: 12px;
        }

        #imageManagement .image-mgmt-name {
            font-weight: 600;
            font-size: 0.92em;
            margin-bottom: 6px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #imageManagement .image-mgmt-meta {
            font-size: 0.82em;
            color: #6c757d;
            line-height: 1.45;
        }

        #imageManagement .image-mgmt-meta div {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #imageManagement .image-mgmt-time {
            margin-top: 8px;
            font-size: 0.78em;
            color: #adb5bd;
        }

        body.dark-theme #imageManagement .image-mgmt-card {
            background: #1a1f26;
            border-color: var(--region-border-color);
        }

        body.dark-theme #imageManagement .image-mgmt-card:hover {
            border-color: #3498db;
        }

        body.dark-theme #imageManagement .image-mgmt-thumb {
            background: #12161c;
        }

        body.dark-theme #imageManagement .image-mgmt-name {
            color: #e9ecef;
        }

        body.dark-theme #imageManagement .image-mgmt-meta {
            color: #adb5bd;
        }

        /* 物品条形码库 */
        #barcodeLibrary .bc-lib-filter-row {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-bottom: 5px;
            overflow-x: auto;
            padding-bottom: 0;
        }

        #barcodeLibrary .bc-lib-filter-row:last-child {
            margin-bottom: 0;
        }

        #barcodeLibrary .bc-lib-filter-tag {
            flex-shrink: 0;
            padding: 4px 12px;
            border-radius: 0;
            border: 1px solid var(--inner-border-color);
            background: #f8f9fa;
            color: #495057;
            font-size: 0.84em;
            line-height: 1.25;
            cursor: pointer;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
        }

        #barcodeLibrary .bc-lib-filter-tag:hover {
            background: #e9ecef;
        }

        #barcodeLibrary .bc-lib-filter-tag.active {
            background: var(--btn-line-bg-pressed);
            border-color: var(--inner-border-color);
            color: #2c3e50;
            box-shadow: inset 1px 1px 2px rgba(52, 152, 219, 0.12);
        }

        #barcodeLibrary .bc-lib-filter-tag.active:hover {
            background: var(--btn-line-bg-pressed);
            border-color: var(--inner-border-color);
            color: #2c3e50;
        }

        #barcodeLibrary .bc-lib-list {
            background: #fff;
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            overflow: hidden;
        }

        #barcodeLibrary .bc-lib-row {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 12px 16px;
            border-bottom: 1px solid #e9ecef;
        }

        #barcodeLibrary .bc-lib-row:last-child {
            border-bottom: none;
        }

        #barcodeLibrary .bc-lib-row:hover {
            background: #f8f9fa;
        }

        #barcodeLibrary .bc-lib-info {
            flex: 1;
            min-width: 0;
        }

        #barcodeLibrary .bc-lib-name {
            font-weight: 600;
            font-size: 0.95em;
            line-height: 1.35;
            margin-bottom: 4px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        #barcodeLibrary .bc-lib-brand-model {
            font-size: 0.875em;
            color: #6c757d;
            margin-bottom: 2px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #barcodeLibrary .bc-lib-code {
            font-size: 0.8em;
            color: #868e96;
            font-family: ui-monospace, monospace;
        }

        #barcodeLibrary .bc-lib-barcode-btn {
            flex-shrink: 0;
            padding: 4px 8px;
            border: none;
            background: transparent;
            cursor: pointer;
            border-radius: 6px;
            transition: background 0.2s;
        }

        #barcodeLibrary .bc-lib-codes {
            display: flex;
            align-items: center;
            gap: 6px;
            flex-shrink: 0;
        }

        #barcodeLibrary .bc-lib-qrcode-btn {
            flex-shrink: 0;
            padding: 4px;
            border: none;
            background: transparent;
            cursor: pointer;
            border-radius: 6px;
            transition: background 0.2s;
            line-height: 0;
        }

        #barcodeLibrary .bc-lib-qrcode-btn:hover {
            background: #eef5fc;
        }

        #barcodeLibrary .bc-lib-qrcode-btn img.bc-lib-qrcode {
            display: block;
            width: 70px;
            height: 70px;
            object-fit: contain;
            background: #fff;
            border-radius: 4px;
        }

        #barcodeLibrary .bc-lib-qrcode-btn img.bc-lib-qrcode.qr-pending {
            background: #f1f3f5;
        }

        #barcodeLibrary .bc-lib-barcode-btn:hover {
            background: #eef5fc;
        }

        #barcodeLibrary .bc-lib-barcode-btn svg.bc-lib-barcode {
            display: block;
            height: 70px;
            width: auto;
            max-width: 180px;
        }

        #barcodeLibrary .bc-lib-load-more {
            text-align: center;
            padding: 16px;
        }

        #barcodeLibrary .bc-lib-load-more button {
            padding: 7px 14px;
            font-size: 0.9em;
        }

        #barcodeLibrary .bc-lib-card-list {
            background: transparent;
            border: none;
            overflow: visible;
        }

        #barcodeLibrary .bc-lib-card-list .item-card.bc-lib-card {
            margin: 0;
        }

        #barcodeLibrary .bc-lib-card-codes {
            margin-top: 12px;
            justify-content: flex-start;
        }

        @media (max-width: 768px) {
            #barcodeLibrary .bc-lib-card .bc-lib-name {
                -webkit-line-clamp: unset;
                display: block;
                white-space: normal;
            }

            #barcodeLibrary .bc-lib-card .bc-lib-barcode-btn svg.bc-lib-barcode {
                max-width: 100%;
                height: auto;
            }

            #barcodeLibrary .bc-lib-card .bc-lib-qrcode-btn img.bc-lib-qrcode {
                width: 64px;
                height: 64px;
            }
        }

        /* 详情弹窗物品列表 / 流转记录 - 紧凑表格（对齐库存样式） */
        .trace-records-table-wrap,
        .detail-items-table-wrap {
            overflow-x: auto;
            margin-top: 6px;
            box-shadow: var(--table-side-inset-shadow);
        }

        .trace-records-table-wrap .data-table th,
        .detail-items-table-wrap .data-table th {
            padding: 8px 10px;
            font-size: 0.92em;
            line-height: 1.3;
        }

        .trace-records-table-wrap .data-table td,
        .detail-items-table-wrap .data-table td {
            padding: 6px 10px;
            line-height: 1.35;
            vertical-align: middle;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .trace-records-table-wrap .data-table .type-badge,
        .detail-items-table-wrap .data-table .status-badge {
            padding: 2px 8px;
            border-radius: 0;
            font-size: 0.85em;
            line-height: 1.3;
        }

        .trace-records-table-wrap .data-table td:nth-child(4),
        .trace-records-table-wrap .data-table td:nth-child(5),
        .trace-records-table-wrap .data-table td:nth-child(6) {
            white-space: normal;
            max-width: 180px;
        }

        #traceability .data-table tbody tr.data-table-row-clickable {
            cursor: pointer;
            transition: background-color 0.2s;
        }

        #traceability .data-table tbody tr.data-table-row-clickable:hover {
            background: #f0f7ff !important;
        }

        .trace-item-info-card {
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            padding: 10px 12px;
            margin-bottom: 10px;
        }

        .trace-item-info-card .trace-info-name {
            font-size: 1em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .trace-item-info-card .trace-info-barcode {
            font-family: ui-monospace, monospace;
            color: #6c757d;
            font-size: 0.875em;
            margin-bottom: 2px;
        }

        .trace-item-info-card .trace-info-status {
            font-size: 0.85em;
            margin-top: 4px;
        }

        .trace-item-info-card .trace-info-status.in-stock {
            color: #28a745;
        }

        .trace-item-info-card .trace-info-status.out-stock {
            color: #fd7e14;
        }

        .trace-sort-bar {
            display: flex;
            justify-content: flex-end;
            margin-bottom: 6px;
        }

        .trace-timeline {
            padding: 4px 0;
        }

        .trace-timeline-item {
            display: flex;
            gap: 14px;
            align-items: stretch;
            margin-bottom: 20px;
        }

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

        .trace-timeline-axis {
            display: flex;
            flex-direction: column;
            align-items: center;
            flex-shrink: 0;
            width: 14px;
        }

        .trace-timeline-dot {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            flex-shrink: 0;
            margin-top: 6px;
        }

        .trace-timeline-dot.stock-in {
            background: #28a745;
        }

        .trace-timeline-dot.stock-out {
            background: #fd7e14;
        }

        .trace-timeline-line {
            flex: 1;
            width: 2px;
            background: rgba(108, 117, 125, 0.35);
            margin-top: 4px;
            min-height: 24px;
        }

        .trace-timeline-item:last-child .trace-timeline-line {
            display: none;
        }

        .trace-timeline-card {
            flex: 1;
            background: #f8f9fa;
            border-radius: 8px;
            padding: 12px 14px;
            min-width: 0;
        }

        .trace-timeline-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 10px;
            margin-bottom: 6px;
        }

        .trace-timeline-type {
            font-weight: 600;
            font-size: 1em;
        }

        .trace-timeline-type.stock-in {
            color: #28a745;
        }

        .trace-timeline-type.stock-out {
            color: #fd7e14;
        }

        .trace-timeline-date {
            font-size: 0.85em;
            color: #6c757d;
            white-space: nowrap;
        }

        .trace-timeline-meta {
            font-size: 0.875em;
            color: #6c757d;
            line-height: 1.45;
            margin-top: 2px;
        }

        body.dark-theme #traceability .trace-table-wrap,
        body.dark-theme .trace-records-table-wrap,
        body.dark-theme .detail-items-table-wrap {
            box-shadow: var(--table-side-inset-shadow);
        }

        body.dark-theme #traceability .trace-table-wrap .data-table thead th,
        body.dark-theme .trace-records-table-wrap .data-table thead th,
        body.dark-theme .detail-items-table-wrap .data-table thead th {
            border-color: #495057 !important;
        }

        body.dark-theme #traceability .trace-table-wrap .data-table tbody td,
        body.dark-theme .trace-records-table-wrap .data-table tbody td,
        body.dark-theme .detail-items-table-wrap .data-table tbody td {
            border-color: #495057 !important;
        }

        body.dark-theme #traceability .data-table tbody tr.data-table-row-clickable:hover {
            background: #1e3a5f !important;
        }

        body.dark-theme .trace-item-info-card {
            background: #1b2026;
            border-color: var(--region-border-color);
        }

        body.dark-theme .trace-item-info-card .trace-info-name {
            color: #e9ecef;
        }

        body.dark-theme .trace-timeline-meta,
        body.dark-theme .trace-timeline-date {
            color: #adb5bd;
        }

        /* RFID 绑定 */
        #rfidBinding .rfid-binding-selected {
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
            border-radius: 10px;
            padding: 14px 16px;
            margin-bottom: 12px;
        }

        #rfidBinding .rfid-binding-selected.empty {
            color: #6c757d;
            text-align: center;
        }

        #rfidBinding .rfid-binding-selected-name {
            font-weight: 600;
            font-size: 1em;
            margin-bottom: 4px;
        }

        #rfidBinding .rfid-current-rfid {
            margin-top: 8px;
            font-size: 0.875em;
            color: #3498db;
            font-family: ui-monospace, monospace;
        }

        #rfidBinding .rfid-binding-input-row {
            display: flex;
            gap: 10px;
            margin-bottom: 12px;
            flex-wrap: wrap;
        }

        #rfidBinding .rfid-binding-input-row input {
            flex: 1;
            min-width: 200px;
            padding: 10px 14px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 1em;
            font-family: ui-monospace, monospace;
        }

        #rfidBinding .rfid-item-list,
        #rfidBinding .rfid-bound-list {
            background: #fff;
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            overflow: hidden;
            max-height: min(420px, calc(100vh - 380px));
            overflow-y: auto;
        }

        #rfidBinding .rfid-item-row {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 14px;
            border-bottom: 1px solid #e9ecef;
            cursor: pointer;
            transition: background 0.2s;
        }

        #rfidBinding .rfid-item-row:last-child {
            border-bottom: none;
        }

        #rfidBinding .rfid-item-row:hover {
            background: #f8f9fa;
        }

        #rfidBinding .rfid-item-row.selected {
            background: #e7f1ff;
        }

        #rfidBinding .rfid-item-info {
            flex: 1;
            min-width: 0;
        }

        #rfidBinding .rfid-item-name {
            font-weight: 600;
            font-size: 0.92em;
        }

        #rfidBinding .rfid-item-meta {
            font-size: 0.82em;
            color: #6c757d;
            margin-top: 2px;
        }

        #rfidBinding .rfid-item-tag {
            font-size: 0.8em;
            color: #3498db;
            font-family: ui-monospace, monospace;
            flex-shrink: 0;
        }

        body.dark-theme #rfidBinding .rfid-binding-selected,
        body.dark-theme #rfidBinding .rfid-item-list,
        body.dark-theme #rfidBinding .rfid-bound-list {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme #rfidBinding .rfid-item-row {
            border-bottom-color: #2a313a;
        }

        body.dark-theme #rfidBinding .rfid-item-row:hover {
            background: #1b2026;
        }

        body.dark-theme #rfidBinding .rfid-item-row.selected {
            background: #1e3a5f;
        }

        body.dark-theme #rfidBinding .rfid-binding-selected-name,
        body.dark-theme #rfidBinding .rfid-item-name {
            color: #e9ecef;
        }

        body.dark-theme #rfidBinding .rfid-binding-input-row input {
            background: #1b2026;
            border-color: #2a313a;
            color: #e9ecef;
        }

        /* 导入 / 导出数据 */
        #importData.data-io-tab,
        #exportData.data-io-tab,
        #printCenter.data-io-tab,
        #reportGeneration.data-io-tab {
            padding: 6px 10px 12px;
        }

        .data-io-panel {
            max-width: 960px;
        }

        #importData .data-io-panel {
            max-width: none;
            width: 100%;
        }

        #importData .import-file-columns-wrap,
        #importData .import-preview-wrap,
        #importData .import-column-map-summary {
            width: 100%;
        }

        @media (min-width: 769px) {
            #importData .import-file-columns-wrap {
                max-height: min(420px, calc(100vh - 300px));
            }

            #importData .import-preview-wrap {
                max-height: min(560px, calc(100vh - 260px));
            }
        }

        .data-io-intro {
            margin-bottom: 16px;
            color: #6c757d;
            font-size: 0.92em;
            line-height: 1.5;
        }

        .data-io-hint {
            margin-top: 6px;
            font-size: 0.88em;
        }

        .data-io-section {
            margin-bottom: 20px;
        }

        .data-io-section h3 {
            font-size: 1em;
            margin: 0 0 10px;
            color: #2c3e50;
            padding-bottom: 8px;
            border-bottom: 1px solid #e1e8ed;
        }

        .data-io-section-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 10px;
        }

        .data-io-section-head h3 {
            margin: 0;
            border: none;
            padding: 0;
        }

        .data-io-actions {
            display: flex;
            align-items: center;
            gap: 12px;
            flex-wrap: wrap;
            margin-bottom: 16px;
        }

        .print-select-row {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .print-select-row .search-box {
            width: 100%;
            max-width: 100%;
        }

        .print-select {
            width: 100%;
            max-width: 100%;
            padding: 10px 12px;
            border: 2px solid #34495e;
            border-radius: 0;
            font-size: 0.95em;
            background: #fff;
            color: #2c3e50;
        }

        .print-type-section h3,
        .print-options-section h3 {
            margin: 0;
            border: none;
            padding: 0;
            flex-shrink: 0;
        }

        .print-type-head,
        .print-options-head {
            display: flex;
            align-items: center;
            gap: 16px;
            flex-wrap: wrap;
            margin-bottom: 0;
        }

        .print-type-options,
        .print-option-checks {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 8px;
            flex: 1;
            min-width: 0;
        }

        .print-type-chip,
        .print-option-item {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 8px 12px;
            border: 1px solid var(--region-border-color, #dce4ec);
            background: #fff;
            cursor: pointer;
            font-size: 0.92em;
            color: #2c3e50;
            white-space: nowrap;
        }

        .print-type-chip:has(input:checked),
        .print-option-item:has(input:checked) {
            border-color: #3498db;
            background: #e7f1ff;
        }

        .print-type-chip input,
        .print-option-item input {
            margin: 0;
            cursor: pointer;
        }

        .print-doc-logo-row {
            margin-bottom: 12px;
        }

        .print-doc-logo-row .print-doc-logo,
        .print-preview-box .print-doc-logo {
            width: 180px;
            max-width: 100%;
            height: auto;
            display: block;
            margin-left: -10px;
        }

        .print-options-head {
            flex-wrap: wrap;
        }

        .print-orientation-options {
            margin-left: auto;
        }

        .print-preview-box.print-preview-portrait {
            max-width: 794px;
            margin: 0 auto;
        }

        .print-preview-box.print-preview-landscape {
            max-width: 1123px;
            margin: 0 auto;
        }

        .print-preview-box {
            border: 1px solid #dce4ec;
            background: #fff;
            padding: 16px;
            max-height: 480px;
            overflow: auto;
        }

        .print-preview-box .report-title {
            font-size: 1.25em;
            margin: 0 0 8px;
        }

        .print-preview-box .report-meta {
            font-size: 0.85em;
            color: #6c757d;
            margin-bottom: 8px;
        }

        .print-preview-box .report-stats {
            margin: 12px 0;
            padding: 10px 12px;
            background: #f8f9fa;
            font-size: 0.9em;
        }

        .print-preview-box table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.85em;
            margin-top: 12px;
        }

        .print-preview-box th,
        .print-preview-box td {
            border: 1px solid #ccc;
            padding: 6px 8px;
            text-align: left;
        }

        .print-preview-box th {
            background: #eee;
        }

        .print-preview-box .print-barcode-block svg {
            max-width: 100%;
            height: auto;
            display: block;
            margin: 0 auto;
        }

        /* 预出库方案打印（对齐 iOS PDFGenerator） */
        .print-preview-box .qr-binding-print-doc {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 320px;
        }

        .print-preview-box .qr-binding-print-center {
            text-align: center;
        }

        .print-preview-box .qr-binding-print-image {
            width: 240px;
            height: 240px;
            image-rendering: pixelated;
        }

        .print-preview-box .pre-outbound-print-doc {
            max-width: none;
        }

        .print-preview-box .pre-outbound-print-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
            margin-bottom: 8px;
        }

        .print-preview-box .pre-outbound-print-logo {
            width: 180px;
            max-width: 42%;
            height: auto;
            margin-left: -20px;
        }

        .print-preview-box .pre-outbound-print-header-barcode {
            text-align: right;
            flex-shrink: 0;
        }

        .print-preview-box .pre-outbound-print-header-barcode svg {
            display: block;
            margin-left: auto;
            max-width: 160px;
            height: auto;
        }

        .print-preview-box .pre-outbound-print-barcode-text {
            margin-top: 2px;
            font-size: 8px;
            font-family: monospace;
            letter-spacing: 0.16em;
            text-align: center;
            max-width: 160px;
            margin-left: auto;
        }

        .print-preview-box .pre-outbound-print-main-title {
            font-size: 16px;
            font-weight: 700;
            margin: 12px 0 0;
        }

        .print-preview-box .pre-outbound-print-title-line {
            border: none;
            border-top: 1px solid #111;
            margin: 8px 0 0;
        }

        .print-preview-box .pre-outbound-print-design-name {
            font-size: 13px;
            font-weight: 700;
            margin: 10px 0 0;
        }

        .print-preview-box .pre-outbound-print-info {
            font-size: 10px;
            margin-top: 12px;
            color: #333;
        }

        .print-preview-box .pre-outbound-print-info div {
            margin-bottom: 6px;
        }

        .print-preview-box .pre-outbound-print-section-title {
            font-size: 13px;
            font-weight: 700;
            margin: 16px 0 6px;
        }

        .print-preview-box .pre-outbound-print-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 10px;
            table-layout: fixed;
        }

        .print-preview-box .pre-outbound-print-table thead th {
            font-size: 10px;
            font-weight: 700;
            text-align: left;
            padding: 5px 0;
            border-top: 1px solid #111;
            border-bottom: 1px solid #111;
        }

        .print-preview-box .pre-outbound-print-table tbody td {
            padding: 5px 0;
            border-bottom: 1px solid #ccc;
            vertical-align: top;
            word-break: break-word;
        }

        .print-preview-box .pre-outbound-print-table .col-qty {
            text-align: right;
            width: 64px;
        }

        .print-preview-box .pre-outbound-print-table thead th:nth-child(1) {
            width: 14%;
            padding-right: 6px;
        }

        .print-preview-box .pre-outbound-print-table thead th:nth-child(2) {
            width: 24%;
            padding-right: 6px;
        }

        .print-preview-box .pre-outbound-print-table thead th:nth-child(3) {
            width: 52%;
            padding-right: 6px;
        }

        .print-preview-box .pre-outbound-print-category-table thead th:nth-child(1) {
            width: auto;
            padding-right: 6px;
        }

        .print-preview-box .pre-outbound-print-category-table thead th:nth-child(2) {
            width: 64px;
        }

        .print-preview-box .channel-list-print-table thead th:nth-child(1) {
            width: 18%;
            padding-right: 6px;
        }

        .print-preview-box .channel-list-print-table thead th:nth-child(2),
        .print-preview-box .channel-list-print-table thead th:nth-child(3) {
            width: 8%;
            padding-right: 6px;
            text-align: center;
        }

        .print-preview-box .channel-list-print-table thead th:nth-child(4) {
            width: 12%;
            padding-right: 6px;
            text-align: center;
        }

        .print-preview-box .channel-list-print-table thead th:nth-child(5) {
            width: 54%;
            padding-right: 0;
        }

        .print-preview-box .channel-list-print-table tbody td:nth-child(2),
        .print-preview-box .channel-list-print-table tbody td:nth-child(3),
        .print-preview-box .channel-list-print-table tbody td:nth-child(4) {
            text-align: center;
        }

        .print-preview-box .pre-outbound-print-total {
            margin-top: 14px;
            font-size: 13px;
            font-weight: 700;
            text-align: right;
        }

        body.dark-theme .print-preview-box .pre-outbound-print-info,
        body.dark-theme .print-preview-box .pre-outbound-print-main-title,
        body.dark-theme .print-preview-box .pre-outbound-print-design-name,
        body.dark-theme .print-preview-box .pre-outbound-print-section-title,
        body.dark-theme .print-preview-box .pre-outbound-print-total {
            color: #e9ecef;
        }

        body.dark-theme .print-preview-box .pre-outbound-print-title-line,
        body.dark-theme .print-preview-box .pre-outbound-print-table thead th {
            border-color: #8eb8d4;
        }

        body.dark-theme .print-preview-box .pre-outbound-print-table tbody td {
            border-color: #3a424d;
        }

        body.dark-theme .print-select {
            background: #1b2026;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme .print-type-chip,
        body.dark-theme .print-option-item {
            background: #1b2026;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme .print-type-chip:has(input:checked),
        body.dark-theme .print-option-item:has(input:checked) {
            border-color: #3498db;
            background: #1a3050;
        }

        body.dark-theme .print-preview-box {
            background: #1b2026;
            border-color: #2a313a;
        }

        body.dark-theme .print-preview-box .report-stats {
            background: #252b33;
        }

        body.dark-theme .print-preview-box th {
            background: #2a313a;
        }

        body.dark-theme .print-preview-box th,
        body.dark-theme .print-preview-box td {
            border-color: #3a424d;
        }

        .data-io-file-name {
            color: #6c757d;
            font-size: 0.9em;
        }

        .export-type-list {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .export-type-option {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 10px 12px;
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            cursor: pointer;
            background: #fff;
        }

        .export-type-option:has(input:checked) {
            border-color: #3498db;
            background: #f0f7ff;
        }

        .import-mapping-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
            gap: 10px;
            margin-bottom: 12px;
        }

        .import-file-columns-wrap {
            overflow: auto;
            max-height: min(360px, calc(100vh - 360px));
            margin-bottom: 12px;
            border: 1px solid var(--region-border-color);
        }

        .import-file-columns-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.88em;
        }

        .import-file-columns-table th,
        .import-file-columns-table td {
            border: 1px solid var(--inner-border-color);
            padding: 8px 10px;
            text-align: left;
            vertical-align: top;
        }

        .import-file-columns-table thead th {
            background: #f8f9fa;
            position: sticky;
            top: 0;
            z-index: 1;
        }

        .import-file-columns-table select {
            width: 100%;
            min-width: 180px;
            padding: 6px 8px;
            border: 1px solid var(--inner-border-color);
            font-size: 0.95em;
        }

        .import-file-col-index {
            width: 56px;
            text-align: center !important;
            color: #6c757d;
        }

        .import-file-col-db-hint {
            margin-top: 4px;
            font-size: 0.82em;
            color: #0b5ed7;
        }

        .import-file-col-mapped {
            background: rgba(52, 152, 219, 0.06);
        }

        .import-file-col-unmapped td {
            color: #6c757d;
        }

        .import-column-map-summary {
            margin-bottom: 10px;
            padding: 10px 12px;
            border: 1px solid var(--region-border-color);
            background: #f8f9fa;
        }

        .import-column-map-summary-head {
            font-size: 0.88em;
            font-weight: 600;
            color: #2c3e50;
            margin-bottom: 8px;
        }

        .import-column-map-chips {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .import-column-map-chip {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 3px 8px;
            font-size: 0.78em;
            border: 1px solid var(--inner-border-color);
            background: #fff;
            max-width: 100%;
        }

        .import-column-map-chip.mapped {
            border-color: #b6d4fe;
            background: #e7f1ff;
        }

        .import-column-map-chip.unmapped {
            color: #6c757d;
            background: #f1f3f5;
        }

        .import-column-map-chip-file {
            font-weight: 600;
        }

        .import-column-map-chip-arrow {
            opacity: 0.55;
        }

        .import-preview-data-table .import-preview-head-file th {
            background: #eef2f6;
        }

        .import-preview-data-table .import-preview-head-db th {
            background: #f8f9fa;
            font-weight: 500;
            font-size: 0.78em;
        }

        .import-preview-wrap .import-col-mapped {
            background: rgba(52, 152, 219, 0.04);
        }

        .import-preview-wrap .import-col-unmapped {
            background: #f8f9fa;
            color: #868e96;
        }

        .import-col-db-tag {
            display: inline-block;
            padding: 1px 5px;
            margin-right: 4px;
            background: #e7f1ff;
            color: #0b5ed7;
            font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
            font-size: 0.95em;
        }

        .import-col-db-label {
            color: #495057;
        }

        .import-col-db-unmapped {
            color: #adb5bd;
            font-style: italic;
        }

        body.dark-theme .import-file-columns-table thead th,
        body.dark-theme .import-column-map-summary {
            background: #1b2026;
        }

        body.dark-theme .import-file-columns-table select,
        body.dark-theme .import-column-map-chip {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme .import-column-map-chip.mapped {
            background: rgba(52, 152, 219, 0.12);
            border-color: rgba(52, 152, 219, 0.35);
        }

        body.dark-theme .import-file-col-db-hint,
        body.dark-theme .import-col-db-tag {
            color: #5dade2;
            background: rgba(52, 152, 219, 0.15);
        }

        body.dark-theme .import-preview-data-table .import-preview-head-file th {
            background: #1f2630;
        }

        body.dark-theme .import-preview-data-table .import-preview-head-db th {
            background: #1b2026;
        }

        body.dark-theme .import-preview-wrap .import-col-unmapped {
            background: rgba(255, 255, 255, 0.03);
            color: #868e96;
        }

        .import-mapping-row {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .import-mapping-row label {
            font-size: 0.85em;
            color: #6c757d;
        }

        .import-mapping-row select {
            padding: 8px 10px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 0.9em;
        }

        .import-preview-wrap {
            overflow: auto;
            max-height: min(420px, calc(100vh - 320px));
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
        }

        .import-preview-toolbar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 10px 14px;
            margin-bottom: 10px;
        }

        .import-select-all-label {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 0.9em;
            cursor: pointer;
            user-select: none;
        }

        .import-toolbar-btn {
            padding: 4px 10px;
            font-size: 0.85em;
        }

        .import-selection-count {
            font-size: 0.88em;
            color: #6c757d;
            margin-left: auto;
        }

        .import-preview-wrap .import-check-col {
            width: 72px;
            min-width: 72px;
            text-align: center;
            white-space: normal;
        }

        .import-preview-wrap tbody tr.import-row-selected td {
            background: rgba(52, 152, 219, 0.08);
        }

        .import-preview-wrap tbody tr.import-row-blocked td {
            background: #f8f9fa;
            color: #6c757d;
        }

        .import-block-tag {
            display: inline-block;
            padding: 1px 6px;
            font-size: 0.78em;
            line-height: 1.35;
            color: #856404;
            background: #fff3cd;
            border: 1px solid #ffeeba;
        }

        body.dark-theme .import-preview-toolbar .import-selection-count {
            color: #adb5bd;
        }

        body.dark-theme .import-preview-wrap tbody tr.import-row-selected td {
            background: rgba(52, 152, 219, 0.12);
        }

        body.dark-theme .import-preview-wrap tbody tr.import-row-blocked td {
            background: rgba(255, 255, 255, 0.03);
            color: #adb5bd;
        }

        body.dark-theme .import-block-tag {
            color: #ffc107;
            background: rgba(255, 193, 7, 0.12);
            border-color: rgba(255, 193, 7, 0.35);
        }

        .import-preview-wrap table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.85em;
        }

        .import-preview-wrap th,
        .import-preview-wrap td {
            border: 1px solid var(--inner-border-color);
            padding: 6px 8px;
            text-align: left;
            white-space: nowrap;
        }

        .import-preview-wrap thead th {
            border-color: var(--table-head-border-color);
        }

        .import-preview-wrap th {
            background: #f8f9fa;
            position: sticky;
            top: 0;
            z-index: 1;
        }

        .import-progress-wrap {
            margin-top: 12px;
        }

        .import-progress-bar {
            height: 8px;
            background: #e9ecef;
            border-radius: 4px;
            overflow: hidden;
        }

        .import-progress-fill {
            height: 100%;
            width: 0%;
            background: #3498db;
            transition: width 0.2s;
        }

        .import-progress-text {
            margin-top: 6px;
            font-size: 0.85em;
            color: #6c757d;
        }

        .data-io-status {
            margin-top: 12px;
            font-size: 0.9em;
            color: #6c757d;
        }

        .data-io-status.success {
            color: #28a745;
        }

        .data-io-status.error {
            color: #dc3545;
        }

        .report-date-row {
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
        }

        .report-date-field {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 160px;
        }

        .report-date-field label {
            font-size: 0.85em;
            color: #6c757d;
        }

        .report-date-field input {
            padding: 8px 10px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 0.9em;
        }

        .report-task-select {
            width: 100%;
            max-width: 480px;
            padding: 10px 12px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 0.9em;
        }

        body.dark-theme .report-date-field input,
        body.dark-theme .report-task-select {
            background: #161a1e;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme .report-date-field label {
            color: #adb5bd;
        }

        body.dark-theme .data-io-intro,
        body.dark-theme .data-io-file-name,
        body.dark-theme .import-progress-text,
        body.dark-theme .data-io-status {
            color: #adb5bd;
        }

        body.dark-theme .data-io-section h3 {
            color: #e9ecef;
            border-bottom-color: #2a313a;
        }

        body.dark-theme .export-type-option {
            background: #161a1e;
            border-color: var(--region-border-color);
            color: #e9ecef;
        }

        body.dark-theme .export-type-option:has(input:checked) {
            background: #1e3a5f;
            border-color: #3498db;
        }

        body.dark-theme .import-mapping-row select,
        body.dark-theme .import-preview-wrap {
            background: #161a1e;
            border-color: var(--region-border-color);
            color: #e9ecef;
        }

        body.dark-theme .import-preview-wrap thead th {
            background: #1b2026;
            border-color: #2a313a !important;
        }

        body.dark-theme .import-preview-wrap tbody td {
            border-color: #2a313a !important;
        }

        body.dark-theme #barcodeLibrary .bc-lib-filters {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme #barcodeLibrary .bc-lib-filter-tag {
            background: #1b2026;
            border-color: #2a313a;
            color: #cfd7df;
        }

        body.dark-theme #barcodeLibrary .bc-lib-filter-tag.active {
            background: var(--btn-line-bg-pressed);
            border-color: #0f1318;
            color: #e9ecef;
            box-shadow: inset 1px 1px 2px rgba(52, 152, 219, 0.18);
        }

        body.dark-theme #barcodeLibrary .bc-lib-filter-tag.active:hover {
            background: var(--btn-line-bg-pressed);
            border-color: #0f1318;
            color: #e9ecef;
        }

        body.dark-theme #barcodeLibrary .bc-lib-list {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme #barcodeLibrary .bc-lib-row {
            border-bottom-color: #2a313a;
        }

        body.dark-theme #barcodeLibrary .bc-lib-row:hover {
            background: #1b2026;
        }

        body.dark-theme #barcodeLibrary .bc-lib-name {
            color: #e9ecef;
        }

        body.dark-theme #barcodeLibrary .bc-lib-brand-model {
            color: #adb5bd;
        }

        body.dark-theme #barcodeLibrary .bc-lib-code {
            color: #868e96;
        }

        body.dark-theme #barcodeLibrary .bc-lib-barcode-btn:hover {
            background: #1e3a5f;
        }

        body.dark-theme #barcodeLibrary .bc-lib-qrcode-btn:hover {
            background: #1e3a5f;
        }

        body.dark-theme #barcodeLibrary .bc-lib-load-more button {
            background: var(--btn-line-bg);
            border-color: var(--btn-line-border);
            color: var(--btn-line-text);
        }

        .barcode-lightbox-inner {
            background: #fff;
            border-radius: 12px;
            padding: 24px 32px;
            text-align: center;
            max-width: 90vw;
        }

        .barcode-lightbox-inner svg {
            max-width: 100%;
            height: auto;
        }

        .barcode-lightbox-text {
            margin-top: 12px;
            font-family: ui-monospace, monospace;
            font-size: 1.05em;
            color: #495057;
            letter-spacing: 0.05em;
        }

        body.dark-theme .barcode-lightbox-inner {
            background: #161a1e;
        }

        body.dark-theme .barcode-lightbox-text {
            color: #cfd7df;
        }

        .code-lightbox-title {
            margin-bottom: 12px;
            font-size: 0.95em;
            color: #6c757d;
            font-weight: 600;
        }

        body.dark-theme .code-lightbox-title {
            color: #adb5bd;
        }

        #qrLightboxImg {
            display: block;
            max-width: min(280px, 80vw);
            height: auto;
            margin: 0 auto;
        }

        /* 入库 / 出库操作页 */
        .stock-op-page {
            max-width: 900px;
            margin: 0 auto;
            padding: 8px 0 24px;
        }

        .stock-op-page-wide {
            max-width: none;
            margin: 0;
        }

        .stock-op-layout {
            display: grid;
            grid-template-columns: minmax(300px, 1fr) minmax(340px, 1.15fr);
            gap: 12px;
            align-items: stretch;
            flex: 1;
            min-height: 0;
            overflow: hidden;
        }

        #stockIn .stock-op-layout,
        #stockOut .stock-op-layout,
        #rfidBinding .stock-op-layout {
            grid-template-columns: minmax(300px, 1.12fr) minmax(280px, 0.92fr);
        }

        .stock-op-left {
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 12px;
            overflow-y: auto;
            overflow-x: hidden;
            -webkit-overflow-scrolling: touch;
        }

        .stock-op-main {
            min-width: 0;
            flex-shrink: 0;
        }

        .stock-op-picker {
            display: flex;
            flex-direction: column;
            min-width: 0;
            min-height: 0;
            overflow: hidden;
            background: #fff;
            border: 1px solid var(--region-border-color);
            align-self: stretch;
        }

        .stock-op-picker-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 8px 10px;
            border-bottom: 1px solid #e9ecef;
            background: #f8f9fa;
        }

        .stock-op-picker-head h3 {
            margin: 0;
            font-size: 0.95em;
            color: #2c3e50;
        }

        .stock-op-picker-head-text {
            min-width: 0;
        }

        .stock-op-picker-tip {
            margin: 2px 0 0;
            font-size: 0.75em;
            color: #6c757d;
            line-height: 1.3;
        }

        .stock-op-picker-count {
            font-size: 0.82em;
            color: #6c757d;
            white-space: nowrap;
        }

        .stock-op-picker-toolbar {
            display: flex;
            gap: 8px;
            padding: 8px 10px;
            border-bottom: 1px solid #e9ecef;
            align-items: center;
        }

        .stock-op-picker-toolbar .search-box {
            flex: 1;
            min-width: 0;
            margin: 0;
            padding: 7px 10px;
            font-size: 0.9em;
        }

        .stock-op-picker-toolbar .refresh-btn {
            flex-shrink: 0;
            white-space: nowrap;
        }

        .stock-op-picker-list {
            flex: 1;
            min-height: 0;
            overflow: auto;
        }

        .stock-op-picker-empty {
            text-align: center;
            color: #6c757d;
            padding: 24px 12px;
            font-size: 0.9em;
        }

        .stock-op-picker-list .loading {
            padding: 24px 12px;
        }

        .stock-op-picker-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.85em;
            box-shadow: none;
            border: none;
            border-radius: 0;
        }

        .stock-op-picker-table thead {
            position: sticky;
            top: 0;
            z-index: 1;
        }

        .stock-op-picker-table thead th {
            padding: 5px 8px;
            line-height: 1.35;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 120px;
            border: 1px solid var(--table-head-border-color);
        }

        .stock-op-picker-table tbody td {
            padding: 5px 8px;
            line-height: 1.35;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 120px;
            border: 1px solid var(--inner-border-color);
        }

        .stock-op-picker-table td:nth-child(3) {
            max-width: 140px;
        }

        .stock-op-picker-check-col {
            width: 28px;
            min-width: 28px;
            max-width: 28px;
            padding-left: 6px !important;
            padding-right: 4px !important;
            text-align: center;
        }

        .stock-op-picker-check {
            display: inline-block;
            width: 14px;
            height: 14px;
            border: 2px solid #adb5bd;
            border-radius: 3px;
            vertical-align: middle;
            background: #fff;
        }

        .stock-op-picker-check.checked {
            border-color: #3498db;
            background: #3498db;
            box-shadow: inset 0 0 0 2px #fff;
        }

        .stock-op-picker-row {
            cursor: pointer;
        }

        .stock-op-picker-row:hover {
            background: #f8f9fa;
        }

        .stock-op-picker-row.selected {
            background: #f0f7ff !important;
        }

        .stock-op-picker-row.selected td.stock-op-picker-check-col {
            box-shadow: inset 3px 0 0 #3498db;
        }

        .stock-op-picker-row.already-added {
            opacity: 0.72;
        }

        .stock-op-picker-row.not-available {
            opacity: 0.55;
        }

        .stock-op-hint {
            font-size: 0.85em;
            color: #6c757d;
            margin: 0 0 10px;
        }

        .stock-op-photo-section {
            margin-bottom: 12px;
        }

        .stock-op-photo-layout {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            align-items: flex-start;
        }

        .stock-op-photo-qr-wrap {
            flex: 0 0 120px;
            text-align: center;
        }

        .stock-op-photo-qr-wrap canvas {
            display: block;
            width: 120px;
            height: 120px;
            border: 1px solid var(--region-border-color);
            background: #fff;
            cursor: zoom-in;
            touch-action: manipulation;
        }

        .stock-op-photo-qr-wrap canvas:hover {
            border-color: #3498db;
        }

        .stock-op-photo-qr-tip {
            margin-top: 6px;
            font-size: 0.78em;
            color: #6c757d;
            line-height: 1.35;
        }

        .stock-op-photo-qr-tip:empty {
            display: none;
            margin: 0;
        }

        .stock-op-photo-grid {
            flex: 1;
            min-width: 180px;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
            gap: 8px;
        }

        .stock-op-photo-empty {
            grid-column: 1 / -1;
            box-sizing: border-box;
            height: 120px;
            min-height: 120px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #6c757d;
            padding: 24px;
            border: 1px dashed var(--inner-border-color);
            text-align: center;
        }

        .stock-op-photo-thumb {
            position: relative;
            display: block;
            width: 100%;
            height: 120px;
            border: 1px solid var(--region-border-color);
            background: #fff;
            overflow: hidden;
        }

        .stock-op-photo-view {
            display: block;
            width: 100%;
            height: 100%;
            padding: 0;
            margin: 0;
            border: none;
            background: transparent;
            cursor: zoom-in;
        }

        .stock-op-photo-view img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .stock-op-photo-delete {
            position: absolute;
            top: 4px;
            right: 4px;
            z-index: 2;
            width: 22px;
            height: 22px;
            padding: 0;
            line-height: 20px;
            font-size: 16px;
            font-weight: bold;
            color: #fff;
            background: rgba(0, 0, 0, 0.55);
            border: none;
            border-radius: 50%;
            cursor: pointer;
        }

        .stock-op-photo-delete:hover {
            background: #c0392b;
        }

        .stock-op-photo-thumb.broken {
            display: none;
        }

        .stock-op-photo-section.stock-op-photo-disabled .stock-op-photo-qr-wrap canvas {
            opacity: 0.35;
        }

        body.dark-theme .stock-op-photo-qr-wrap canvas,
        body.dark-theme .stock-op-photo-thumb {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme .stock-op-photo-empty {
            color: #adb5bd;
            border-color: #3d4654;
        }

        #stockIn.tab-content,
        #stockOut.tab-content,
        #rfidBinding.tab-content {
            padding: 6px 10px 8px;
        }

        #stockIn.tab-content.active,
        #stockOut.tab-content.active,
        #rfidBinding.tab-content.active {
            display: flex;
            flex-direction: column;
            height: 100%;
            min-height: 0;
            overflow: hidden;
        }

        .content-panel:has(#stockIn.active),
        .content-panel:has(#stockOut.active),
        .content-panel:has(#rfidBinding.active) {
            overflow: hidden;
            display: flex;
            flex-direction: column;
        }

        #stockIn .stock-op-page-wide,
        #stockOut .stock-op-page-wide,
        #rfidBinding .stock-op-page-wide {
            flex: 1;
            min-height: 0;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            padding: 0;
        }

        #stockIn .stock-op-items-box,
        #stockOut .stock-op-items-box {
            max-height: none;
        }

        body.dark-theme .stock-op-picker {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme .stock-op-picker-head {
            background: #1b2026;
            border-bottom-color: #2a313a;
        }

        body.dark-theme .stock-op-picker-head h3 {
            color: #e9ecef;
        }

        body.dark-theme .stock-op-picker-toolbar {
            border-bottom-color: #2a313a;
        }

        body.dark-theme .stock-op-picker-row:hover {
            background: #1b2026;
        }

        body.dark-theme .stock-op-picker-row.selected {
            background: #1e3a5f !important;
        }

        body.dark-theme .stock-op-picker-tip {
            color: #95a5a6;
        }

        body.dark-theme .stock-op-picker-check {
            background: #1a1f26;
            border-color: #495057;
        }

        body.dark-theme .stock-op-picker-check.checked {
            border-color: #3498db;
            background: #3498db;
        }

        body.dark-theme .stock-op-picker-table thead th {
            border-color: #2a313a !important;
        }

        body.dark-theme .stock-op-picker-table tbody td {
            border-color: #2a313a !important;
        }

        /* 出入库 / RFID / 预出库模态框右侧库存选择器：sticky 搜索栏 + 表头 */
        #rfidBinding .stock-op-picker-body,
        #stockIn .stock-op-picker-body,
        #stockOut .stock-op-picker-body,
        #createPreOutboundModal .stock-op-picker-body {
            flex: 1;
            min-height: 0;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
            --picker-sticky-top: 0px;
        }

        #rfidBinding .stock-op-picker-toolbar,
        #stockIn .stock-op-picker-toolbar,
        #stockOut .stock-op-picker-toolbar,
        #createPreOutboundModal .stock-op-picker-toolbar {
            position: sticky;
            top: 0;
            z-index: 6;
            flex-shrink: 0;
            padding: 8px 10px;
            padding-bottom: 8px;
            margin-bottom: 0;
            border-bottom: var(--table-outer-border-width) solid var(--region-border-color);
            background: #fff;
        }

        body.dark-theme #rfidBinding .stock-op-picker-toolbar,
        body.dark-theme #stockIn .stock-op-picker-toolbar,
        body.dark-theme #stockOut .stock-op-picker-toolbar,
        body.dark-theme #createPreOutboundModal .stock-op-picker-toolbar {
            background: #161a1e;
            border-bottom-color: var(--region-border-color);
        }

        #rfidBinding .stock-op-picker-list,
        #stockIn .stock-op-picker-list,
        #stockOut .stock-op-picker-list,
        #createPreOutboundModal .stock-op-picker-list {
            overflow: visible;
            flex: none;
            min-height: 0;
        }

        #rfidBinding .stock-op-picker-table-wrap,
        #stockIn .stock-op-picker-table-wrap,
        #stockOut .stock-op-picker-table-wrap,
        #createPreOutboundModal .stock-op-picker-table-wrap {
            overflow: visible;
            width: 100%;
            box-shadow: var(--table-side-inset-shadow);
        }

        #rfidBinding .stock-op-picker-table,
        #stockIn .stock-op-picker-table,
        #stockOut .stock-op-picker-table,
        #createPreOutboundModal .stock-op-picker-table {
            width: 100%;
            border-collapse: collapse;
            border-spacing: 0;
            border: none;
            box-shadow: none;
            border-radius: 0;
            overflow: visible;
        }

        #rfidBinding .stock-op-picker-table thead,
        #stockIn .stock-op-picker-table thead,
        #stockOut .stock-op-picker-table thead,
        #createPreOutboundModal .stock-op-picker-table thead {
            position: relative;
            z-index: 5;
        }

        #rfidBinding .stock-op-picker-table thead tr,
        #stockIn .stock-op-picker-table thead tr,
        #stockOut .stock-op-picker-table thead tr,
        #createPreOutboundModal .stock-op-picker-table thead tr {
            position: static;
        }

        #rfidBinding .stock-op-picker-table thead th,
        #stockIn .stock-op-picker-table thead th,
        #stockOut .stock-op-picker-table thead th,
        #createPreOutboundModal .stock-op-picker-table thead th {
            position: sticky;
            top: calc(var(--picker-sticky-top, 0px) - 1px);
            z-index: 5;
            isolation: isolate;
            background: #34495e;
            background-clip: border-box;
            border: none;
            border-bottom: 1px solid var(--table-head-border-color);
            color: #fff;
            max-width: none;
        }

        #rfidBinding .stock-op-picker-table tbody td,
        #stockIn .stock-op-picker-table tbody td,
        #stockOut .stock-op-picker-table tbody td,
        #createPreOutboundModal .stock-op-picker-table tbody td {
            border: 1px solid var(--inner-border-color);
            max-width: none;
        }

        body.dark-theme #rfidBinding .stock-op-picker-table thead th,
        body.dark-theme #stockIn .stock-op-picker-table thead th,
        body.dark-theme #stockOut .stock-op-picker-table thead th,
        body.dark-theme #createPreOutboundModal .stock-op-picker-table thead th {
            background: #0f1419 !important;
            border-bottom-color: var(--table-head-border-color) !important;
        }

        @media (max-width: 992px) {
            .stock-op-layout,
            #stockIn .stock-op-layout,
            #stockOut .stock-op-layout,
            #rfidBinding .stock-op-layout {
                grid-template-columns: 1fr;
                overflow: visible;
            }

            #stockIn.tab-content.active,
            #stockOut.tab-content.active,
            #rfidBinding.tab-content.active {
                height: auto;
                overflow: visible;
            }

            .content-panel:has(#stockIn.active),
            .content-panel:has(#stockOut.active),
            .content-panel:has(#rfidBinding.active) {
                overflow: auto;
            }

            #stockIn .stock-op-page-wide,
            #stockOut .stock-op-page-wide,
            #rfidBinding .stock-op-page-wide {
                overflow: visible;
            }

            .stock-op-left {
                overflow: visible;
                max-height: none;
            }

            .stock-op-picker {
                min-height: 280px;
                max-height: 360px;
            }

            #stockIn .stock-op-picker,
            #stockOut .stock-op-picker {
                display: none;
            }
        }

        .stock-op-header {
            position: relative;
            text-align: center;
            padding: 14px 12px;
            border-radius: 10px;
            margin-bottom: 0;
            background: #fff;
            border: 1px solid var(--region-border-color);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
        }

        .stock-op-regen-btn {
            position: absolute;
            top: 10px;
            right: 10px;
            padding: 7px;
            line-height: 0;
        }

        .stock-op-icon-btn {
            padding: 7px;
            line-height: 0;
            flex-shrink: 0;
        }

        .stock-op-regen-btn svg,
        .stock-op-icon-btn svg {
            width: 16px;
            height: 16px;
            display: block;
        }

        .stock-op-header h2 {
            margin: 0 0 8px;
            font-size: 1.35em;
        }

        .stock-op-header.stock-in-header h2 {
            color: #28a745;
        }

        .stock-op-header.stock-out-header h2 {
            color: #fd7e14;
        }

        .stock-op-record-num {
            font-family: ui-monospace, monospace;
            font-size: 1.15em;
            letter-spacing: 0.05em;
            margin: 8px 0 4px;
        }

        .stock-op-barcode-wrap {
            display: flex;
            justify-content: center;
            margin: 4px 0 12px;
            padding: 0 8px;
        }

        .stock-op-barcode-wrap svg.stock-op-barcode {
            max-width: 100%;
            width: 100%;
            height: auto;
        }

        .stock-op-barcode-row {
            display: flex;
            gap: 10px;
            margin-bottom: 12px;
        }

        .stock-op-barcode-row input {
            flex: 1;
            padding: 10px 12px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 1em;
        }

        .stock-op-items-box {
            max-height: 280px;
            overflow-y: auto;
            border: 1px solid var(--region-border-color);
            border-radius: 6px;
            background: #f8f9fa;
        }

        .stock-op-item-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px 12px;
            border-bottom: 1px solid #e9ecef;
            background: #fff;
        }

        .stock-op-item-row:last-child {
            border-bottom: none;
        }

        .stock-op-item-info {
            flex: 1;
            min-width: 0;
        }

        .stock-op-item-info .name {
            font-weight: 600;
            font-size: 0.95em;
        }

        .stock-op-item-info .meta {
            font-size: 0.82em;
            color: #6c757d;
            margin-top: 2px;
        }

        .stock-op-remove-btn {
            padding: 4px 10px;
            font-size: 0.85em;
        }

        .stock-op-submit {
            width: 100%;
            padding: 10px 14px;
            font-size: 1em;
            margin-top: 8px;
        }

        .stock-op-submit:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }

        .stock-out-dependency-check-btn {
            width: 100%;
            margin-top: 8px;
        }

        .stock-out-dependency-alert {
            margin-top: 10px;
            padding: 10px 12px;
            border: var(--table-outer-border-width) solid #c0392b;
            background: rgba(192, 57, 43, 0.08);
        }

        .stock-out-dependency-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            margin-bottom: 8px;
        }

        .stock-out-dependency-title {
            font-size: 0.95em;
            font-weight: 600;
            color: #c0392b;
        }

        .stock-out-dependency-dismiss {
            border: 1px solid #c0392b;
            background: transparent;
            color: #c0392b;
            width: 24px;
            height: 24px;
            padding: 0;
            line-height: 1;
            font-size: 1.1em;
            cursor: pointer;
        }

        .stock-out-dependency-dismiss:hover {
            background: rgba(192, 57, 43, 0.12);
        }

        .stock-out-dependency-rule + .stock-out-dependency-rule {
            margin-top: 8px;
            padding-top: 8px;
            border-top: 1px solid rgba(192, 57, 43, 0.25);
        }

        .stock-out-dependency-rule-name {
            font-size: 0.9em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-out-dependency-qty-tag {
            display: inline-block;
            padding: 1px 6px;
            font-size: 0.78em;
            font-weight: 500;
            background: rgba(52, 152, 219, 0.15);
            color: #2980b9;
        }

        .stock-out-dependency-missing-label {
            font-size: 0.82em;
            color: #c0392b;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-out-dependency-missing-list {
            margin: 0 0 0 16px;
            padding: 0;
            font-size: 0.82em;
            line-height: 1.45;
            color: #495057;
        }

        .stock-out-dependency-hint {
            margin: 8px 0 0;
            font-size: 0.8em;
            color: #6c757d;
            line-height: 1.4;
        }

        body.dark-theme .stock-out-dependency-alert {
            background: rgba(192, 57, 43, 0.15);
            border-color: #e74c3c;
        }

        body.dark-theme .stock-out-dependency-title,
        body.dark-theme .stock-out-dependency-missing-label {
            color: #ff6b6b;
        }

        body.dark-theme .stock-out-dependency-missing-list {
            color: #ced4da;
        }

        body.dark-theme .stock-out-dependency-dismiss {
            border-color: #e74c3c;
            color: #ff6b6b;
        }

        body.dark-theme .stock-out-dependency-hint {
            color: #adb5bd;
        }

        .stock-out-accessory-alert {
            margin-top: 10px;
            padding: 10px 12px;
            border: var(--table-outer-border-width) solid #e67e22;
            background: rgba(230, 126, 34, 0.08);
        }

        .stock-out-accessory-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            margin-bottom: 8px;
        }

        .stock-out-accessory-title {
            font-size: 0.95em;
            font-weight: 600;
            color: #d35400;
        }

        .stock-out-accessory-dismiss {
            border: 1px solid #e67e22;
            background: transparent;
            color: #d35400;
            width: 24px;
            height: 24px;
            padding: 0;
            line-height: 1;
            font-size: 1.1em;
            cursor: pointer;
        }

        .stock-out-accessory-dismiss:hover {
            background: rgba(230, 126, 34, 0.12);
        }

        .stock-out-accessory-item + .stock-out-accessory-item {
            margin-top: 8px;
            padding-top: 8px;
            border-top: 1px solid rgba(230, 126, 34, 0.25);
        }

        .stock-out-accessory-item-name {
            font-size: 0.9em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-out-accessory-item-meta {
            font-size: 0.82em;
            color: #6c757d;
            line-height: 1.45;
            margin-bottom: 4px;
        }

        .stock-out-accessory-tag {
            display: inline-block;
            padding: 2px 8px;
            font-size: 0.78em;
            line-height: 1.3;
            color: #fff;
            background: #3498db;
        }

        .stock-out-accessory-tag:empty {
            display: none;
        }

        .stock-out-accessory-hint {
            margin: 8px 0 0;
            font-size: 0.8em;
            color: #6c757d;
            line-height: 1.4;
        }

        body.dark-theme .stock-out-accessory-alert {
            background: rgba(230, 126, 34, 0.15);
            border-color: #f39c12;
        }

        body.dark-theme .stock-out-accessory-title {
            color: #ffb347;
        }

        body.dark-theme .stock-out-accessory-item-meta,
        body.dark-theme .stock-out-accessory-hint {
            color: #adb5bd;
        }

        body.dark-theme .stock-out-accessory-dismiss {
            border-color: #f39c12;
            color: #ffb347;
        }

        .stock-out-design-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            flex-wrap: nowrap;
            margin-bottom: 15px;
            padding-bottom: 10px;
            border-bottom: 2px solid #e1e8ed;
        }

        .stock-out-design-section .stock-out-design-head h3 {
            margin: 0;
            padding: 0;
            border: none;
            flex: 0 0 auto;
            white-space: nowrap;
        }

        .stock-out-design-actions {
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
            gap: 8px;
            flex-shrink: 0;
        }

        .stock-out-design-info,
        .stock-in-out-query-info {
            padding: 10px 12px;
            border: 1px solid #3498db;
            background: rgba(52, 152, 219, 0.08);
        }

        .stock-in-out-query-name {
            font-size: 0.95em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-in-out-query-meta {
            font-size: 0.82em;
            color: #6c757d;
            line-height: 1.45;
        }

        .stock-in-quick-mode {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            margin: 0 0 12px;
            font-size: 0.9em;
            color: #495057;
            cursor: pointer;
        }

        .stock-in-quick-mode input[type="checkbox"] {
            appearance: none;
            -webkit-appearance: none;
            width: 22px;
            height: 22px;
            min-width: 22px;
            margin: 1px 0 0;
            border: 2px solid #34495e;
            border-radius: 4px;
            background: #fff;
            cursor: pointer;
            position: relative;
            flex-shrink: 0;
        }

        .stock-in-quick-mode input[type="checkbox"]:checked {
            background: #fff;
            border-color: #3498db;
        }

        .stock-in-quick-mode input[type="checkbox"]:checked::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 50%;
            width: 14px;
            height: 14px;
            transform: translate(-50%, -50%);
            background:
                linear-gradient(45deg, transparent 44%, #3498db 44%, #3498db 56%, transparent 56%),
                linear-gradient(-45deg, transparent 44%, #3498db 44%, #3498db 56%, transparent 56%);
        }

        .stock-in-quick-mode input[type="checkbox"]:focus-visible {
            outline: 2px solid #3498db;
            outline-offset: 2px;
        }

        .stock-out-design-name {
            font-size: 0.95em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-out-design-meta {
            font-size: 0.82em;
            color: #6c757d;
            line-height: 1.45;
        }

        .stock-out-design-warning {
            margin-top: 6px;
            font-size: 0.82em;
            color: #d35400;
            font-weight: 600;
        }

        .stock-out-design-progress {
            padding: 8px 12px;
            font-size: 0.85em;
            font-weight: 600;
            color: #495057;
            background: #eef2f7;
            border-bottom: 1px solid #dee2e6;
        }

        .stock-out-scanned-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            margin-bottom: 8px;
            flex-wrap: nowrap;
        }

        .stock-out-scanned-head[hidden] {
            display: none;
        }

        .stock-out-scanned-count {
            font-size: 0.85em;
            font-weight: 600;
            color: #495057;
            padding: 4px 10px;
            background: rgba(255, 193, 7, 0.2);
            border-radius: 12px;
        }

        .stock-out-stats-section {
            margin-bottom: 20px;
        }

        .stock-out-stats-section:last-child {
            margin-bottom: 0;
        }

        .stock-out-stats-section h3 {
            margin: 0 0 10px;
            padding: 0 0 8px;
            border: none;
            border-bottom: 2px solid #e1e8ed;
            font-size: 1em;
            color: #2c3e50;
        }

        .stock-out-stats-list {
            list-style: none;
            margin: 0;
            padding: 0;
            border: 1px solid var(--region-border-color);
            border-radius: 6px;
            overflow: hidden;
        }

        .stock-out-stats-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 10px 12px;
            background: #fff;
            border-bottom: 1px solid #e9ecef;
        }

        .stock-out-stats-row:last-child {
            border-bottom: none;
        }

        .stock-out-stats-label {
            flex: 1;
            min-width: 0;
            word-break: break-word;
        }

        .stock-out-stats-count {
            flex-shrink: 0;
            color: #6c757d;
            font-size: 0.9em;
        }

        .stock-out-stats-empty {
            padding: 12px;
            color: #6c757d;
            font-size: 0.9em;
            text-align: center;
            background: #f8f9fa;
            border-radius: 6px;
        }

        .stock-out-item-verified {
            background: rgba(40, 167, 69, 0.05);
        }

        .stock-out-item-pending {
            background: rgba(255, 193, 7, 0.06);
        }

        .stock-out-verify-badge {
            display: inline-block;
            margin-right: 8px;
            padding: 2px 8px;
            font-size: 0.78em;
            line-height: 1.3;
            white-space: nowrap;
            color: #856404;
            background: rgba(255, 193, 7, 0.2);
            border: 1px solid #ffc107;
        }

        .stock-out-verify-badge.verified {
            color: #155724;
            background: rgba(40, 167, 69, 0.15);
            border-color: #28a745;
        }

        .stock-out-design-option {
            display: block;
            width: 100%;
            margin-bottom: 8px;
            padding: 10px 12px;
            text-align: left;
            border: 1px solid var(--region-border-color);
            background: #fff;
            cursor: pointer;
        }

        .stock-out-design-option:hover {
            background: #f0f7ff;
        }

        .stock-out-design-option-name {
            font-size: 0.95em;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .stock-out-design-option-meta {
            font-size: 0.82em;
            color: #6c757d;
            line-height: 1.45;
        }

        .stock-out-replacement-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(220px, 1.2fr);
            gap: 12px;
            padding: 12px 0;
            border-bottom: 1px solid #e9ecef;
        }

        .stock-out-replacement-row:last-child {
            border-bottom: none;
        }

        .stock-out-replacement-label {
            font-size: 0.78em;
            font-weight: 600;
            color: #c0392b;
            margin-bottom: 4px;
        }

        .stock-out-replacement-meta {
            font-size: 0.82em;
            color: #6c757d;
            margin-top: 4px;
        }

        .stock-out-replacement-select {
            width: 100%;
            padding: 8px;
            border: 2px solid #34495e;
            background: #fff;
        }

        body.dark-theme .stock-out-design-info,
        body.dark-theme .stock-in-out-query-info {
            background: rgba(52, 152, 219, 0.12);
            border-color: #3498db;
        }

        body.dark-theme .stock-out-design-meta,
        body.dark-theme .stock-in-out-query-meta,
        body.dark-theme .stock-out-design-option-meta,
        body.dark-theme .stock-out-replacement-meta {
            color: #adb5bd;
        }

        body.dark-theme .stock-in-quick-mode {
            color: #ced4da;
        }

        body.dark-theme .stock-in-quick-mode input[type="checkbox"] {
            background: #1a1f26;
            border-color: #adb5bd;
        }

        body.dark-theme .stock-in-quick-mode input[type="checkbox"]:checked {
            background: #1a1f26;
            border-color: #5dade2;
        }

        body.dark-theme .stock-in-quick-mode input[type="checkbox"]:checked::after {
            background:
                linear-gradient(45deg, transparent 44%, #5dade2 44%, #5dade2 56%, transparent 56%),
                linear-gradient(-45deg, transparent 44%, #5dade2 44%, #5dade2 56%, transparent 56%);
        }

        body.dark-theme .stock-out-scanned-count {
            color: #e9ecef;
            background: rgba(255, 193, 7, 0.15);
        }

        body.dark-theme .stock-out-stats-section h3 {
            color: #e9ecef;
            border-bottom-color: #2a313a;
        }

        body.dark-theme .stock-out-stats-list {
            border-color: var(--region-border-color);
        }

        body.dark-theme .stock-out-stats-row {
            background: #1a1f26;
            border-bottom-color: #2a313a;
        }

        body.dark-theme .stock-out-stats-count {
            color: #adb5bd;
        }

        body.dark-theme .stock-out-stats-empty {
            background: #12161c;
            color: #adb5bd;
        }

        body.dark-theme .stock-out-design-progress {
            background: #12161c;
            color: #ced4da;
            border-bottom-color: #2a313a;
        }

        body.dark-theme .stock-out-design-option {
            background: #1a1f26;
            border-color: #2a313a;
        }

        body.dark-theme .stock-out-design-option:hover {
            background: #243040;
        }

        body.dark-theme .stock-out-replacement-select {
            background: #1a1f26;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme .stock-op-header {
            background: #1a1f26;
            border-color: var(--region-border-color);
        }

        body.dark-theme .stock-op-items-box {
            background: #12161c;
            border-color: var(--region-border-color);
        }

        body.dark-theme .stock-op-item-row {
            background: #1a1f26;
            border-color: #2a313a;
        }

        body.dark-theme .stock-op-barcode-row input {
            background: #1a1f26;
            border-color: #2a313a;
            color: #e9ecef;
        }

        /* 库存盘点 */
        #inventoryCheck .inv-check-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 10px 16px;
            margin-bottom: 10px;
        }

        #inventoryCheck .inv-check-toolbar-actions {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
            margin-left: auto;
        }

        #inventoryCheck .inv-check-segment {
            display: flex;
            gap: 4px;
            margin-bottom: 0;
            border: none;
            width: fit-content;
            max-width: 100%;
        }

        #inventoryCheck .repair-segment-btn {
            padding: 7px 14px;
            font-size: 0.9em;
        }

        #inventoryCheck .repair-segment-btn + .repair-segment-btn {
            border-left-width: 1px;
        }

        .inv-check-action-btn {
            padding: 6px 12px;
            font-size: 0.85em;
        }

        .inv-check-action-btn.primary {
            font-weight: 600;
        }

        .inv-check-modal-actions {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 8px;
            margin-top: 12px;
            padding-top: 12px;
            border-top: 1px solid var(--inner-border-color);
        }

        .inv-check-card {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 14px 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
        }

        .inv-check-card-head {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 8px;
        }

        .inv-check-card-head h3 {
            margin: 0;
            font-size: 1em;
            color: #2c3e50;
        }

        .inv-check-card-name {
            font-weight: 600;
            color: #1a5276;
        }

        .inv-check-meta {
            font-size: 0.88em;
            color: #6c757d;
            margin-bottom: 4px;
        }

        .inv-check-progress-wrap {
            margin: 12px 0 14px;
        }

        .inv-check-progress-bar {
            height: 10px;
            background: #e9ecef;
            overflow: hidden;
        }

        .inv-check-progress-fill {
            height: 100%;
            background: #3498db;
            transition: width 0.25s ease;
        }

        .inv-check-progress-text {
            margin-top: 6px;
            font-size: 0.9em;
            color: #495057;
        }

        .inv-check-actions {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 8px 12px;
            margin-top: 4px;
            padding-top: 14px;
            border-top: 1px solid var(--inner-border-color);
        }

        .inv-check-actions-group {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 8px;
        }

        .inv-check-actions-group + .inv-check-actions-group {
            padding-left: 12px;
            border-left: 1px solid var(--inner-border-color);
        }

        .inv-check-close-btn {
            margin-left: auto;
        }

        @media (max-width: 768px) {
            #inventoryCheck .inv-check-toolbar {
                align-items: stretch;
            }

            #inventoryCheck .inv-check-toolbar-actions {
                width: 100%;
                justify-content: flex-end;
            }

            .inv-check-actions {
                gap: 10px;
            }

            .inv-check-actions-group {
                width: 100%;
            }

            .inv-check-actions-group + .inv-check-actions-group {
                padding-left: 0;
                border-left: none;
                padding-top: 10px;
                border-top: 1px solid var(--inner-border-color);
            }

            .inv-check-close-btn {
                margin-left: 0;
                width: 100%;
            }
        }

        .inv-check-empty-state {
            text-align: center;
            padding: 40px 16px;
            color: #6c757d;
        }

        .inv-check-empty-state p {
            margin: 0 0 12px;
        }

        .inv-check-sub {
            font-size: 0.9em;
        }

        .inv-check-history-list {
            display: grid;
            gap: 8px;
        }

        .inv-check-history-item {
            background: #fff;
            border: 1px solid var(--region-border-color);
            padding: 12px 14px;
            cursor: pointer;
            transition: background 0.15s, border-color 0.15s;
        }

        .inv-check-history-item:hover {
            background: #f8f9fa;
            border-color: #3498db;
        }

        .inv-check-history-title {
            font-weight: 600;
            color: #2c3e50;
            margin-bottom: 4px;
        }

        .inv-check-history-meta {
            font-size: 0.85em;
            color: #6c757d;
        }

        .inv-check-empty {
            text-align: center;
            color: #6c757d;
            padding: 20px 12px;
        }

        .inv-check-scan-modal {
            max-width: 820px;
        }

        .inv-check-detail-modal {
            max-width: 900px;
            width: min(900px, 96vw);
        }

        .inv-check-scan-stats {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 8px;
            margin-bottom: 12px;
        }

        .inv-check-stat {
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
            padding: 8px 10px;
            text-align: center;
        }

        .inv-check-stat .label {
            display: block;
            font-size: 0.78em;
            color: #6c757d;
        }

        .inv-check-stat .value {
            display: block;
            font-size: 1.15em;
            font-weight: 700;
            color: #1a5276;
            margin-top: 2px;
        }

        .inv-check-scan-list {
            max-height: 420px;
            overflow: auto;
            border: 1px solid var(--region-border-color);
        }

        .inv-check-row-done {
            opacity: 0.72;
            background: #f0f7ff;
        }

        .inv-check-discrepancy-summary {
            display: flex;
            flex-wrap: wrap;
            gap: 12px 18px;
            margin-bottom: 12px;
            font-size: 0.92em;
            color: #495057;
        }

        body.dark-theme .inv-check-card,
        body.dark-theme .inv-check-history-item,
        body.dark-theme .inv-check-stat {
            background: #161a1e;
            border-color: var(--region-border-color);
        }

        body.dark-theme .inv-check-card-head h3,
        body.dark-theme .inv-check-history-title {
            color: #e9ecef;
        }

        body.dark-theme .inv-check-history-item:hover {
            background: #1b2026;
        }

        body.dark-theme .inv-check-progress-bar {
            background: #2a313a;
        }

        body.dark-theme .inv-check-row-done {
            background: #1e2d3d;
        }

        body.dark-theme .inv-check-scan-list {
            border-color: var(--region-border-color);
        }

        /* 统计分析 */
        #statistics .statistics-page {
            padding: 8px 0 24px;
        }

        #statistics .stats-section {
            background: #fff;
            border: 1px solid var(--region-border-color);
            border-radius: 8px;
            padding: 20px;
            margin-bottom: 20px;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
        }

        #statistics .stats-section h3 {
            margin: 0 0 16px;
            font-size: 1.1em;
            color: #495057;
            font-weight: 600;
        }

        #statistics .stats-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
            gap: 14px;
        }

        #statistics .stats-grid .stat-card h3 {
            font-size: 1.85em;
        }

        #statistics .stats-grid .stat-card p {
            font-size: 0.95em;
        }

        #statistics .stats-bar-chart {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        #statistics .stats-bar-row {
            display: grid;
            grid-template-columns: minmax(80px, 120px) 1fr 48px;
            align-items: center;
            gap: 10px;
            font-size: 0.88em;
        }

        #statistics .stats-bar-label {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: #495057;
        }

        #statistics .stats-bar-track {
            height: 22px;
            background: #f1f3f5;
            border-radius: 4px;
            overflow: hidden;
            display: flex;
        }

        #statistics .stats-bar-fill {
            height: 100%;
            border-radius: 4px;
            min-width: 2px;
            transition: width 0.3s ease;
        }

        #statistics .stats-bar-fill.in {
            background: #28a745;
        }

        #statistics .stats-bar-fill.out {
            background: #fd7e14;
        }

        #statistics .stats-bar-fill.neutral {
            background: #3498db;
        }

        #statistics .stats-bar-value {
            text-align: right;
            color: #6c757d;
            font-variant-numeric: tabular-nums;
        }

        #statistics .monthly-chart {
            display: flex;
            align-items: flex-end;
            gap: 8px;
            height: 160px;
            padding-top: 8px;
            overflow-x: auto;
        }

        #statistics .monthly-col {
            flex: 1;
            min-width: 48px;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
        }

        #statistics .monthly-bars {
            display: flex;
            align-items: flex-end;
            gap: 3px;
            height: 120px;
            width: 100%;
            justify-content: center;
        }

        #statistics .monthly-bar {
            width: 14px;
            border-radius: 3px 3px 0 0;
            min-height: 2px;
        }

        #statistics .monthly-bar.in {
            background: #28a745;
        }

        #statistics .monthly-bar.out {
            background: #fd7e14;
        }

        #statistics .monthly-label {
            font-size: 0.72em;
            color: #6c757d;
            white-space: nowrap;
        }

        #statistics .monthly-legend {
            display: flex;
            gap: 16px;
            margin-top: 12px;
            font-size: 0.85em;
            color: #6c757d;
        }

        #statistics .monthly-legend span {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        #statistics .legend-dot {
            width: 10px;
            height: 10px;
            border-radius: 2px;
            display: inline-block;
        }

        body.dark-theme #statistics .stats-section {
            background: #1a1f26;
            border-color: var(--region-border-color);
        }

        body.dark-theme #statistics .stats-section h3 {
            color: #adb5bd;
        }

        body.dark-theme #statistics .stats-bar-label {
            color: #ced4da;
        }

        body.dark-theme #statistics .stats-bar-track {
            background: #12161c;
        }

        .status-badge {
            display: inline-block;
            padding: 5px 15px;
            border-radius: 0;
            font-size: 0.9em;
            font-weight: 500;
        }

        .status-inStock {
            background: #d4edda;
            color: #155724;
        }

        .status-outStock {
            background: #fff3cd;
            color: #856404;
        }

        .status-damaged {
            background: #f8d7da;
            color: #721c24;
        }

        .type-badge {
            display: inline-block;
            padding: 5px 15px;
            border-radius: 0;
            font-size: 0.9em;
            font-weight: 500;
        }

        .type-stockIn {
            background: #d1ecf1;
            color: #0c5460;
        }

        .type-stockOut {
            background: #f8d7da;
            color: #721c24;
        }

        .loading {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 12px;
            padding: 40px 20px;
            color: #6c757d;
            text-align: center;
        }

        .loading-compact {
            padding: 24px 12px;
            gap: 10px;
        }

        .loading-spinner {
            width: 28px;
            height: 28px;
            border: 2px solid #dee2e6;
            border-top-color: #3498db;
            border-radius: 50%;
            animation: loading-spin 0.75s linear infinite;
            flex-shrink: 0;
        }

        .loading-compact .loading-spinner {
            width: 22px;
            height: 22px;
        }

        .loading-text {
            font-size: 0.95em;
            line-height: 1.4;
        }

        .loading-text::after {
            content: '...';
            animation: loading-dots 1.5s steps(4, end) infinite;
        }

        @keyframes loading-spin {
            to {
                transform: rotate(360deg);
            }
        }

        @keyframes loading-dots {
            0%, 20% { content: '.'; }
            40% { content: '..'; }
            60%, 100% { content: '...'; }
        }

        body.dark-theme .loading {
            color: #adb5bd;
        }

        body.dark-theme .loading-spinner {
            border-color: #3a4450;
            border-top-color: #3498db;
        }

        /* 进度条样式 */
        .progress-bar-container {
            width: 100%;
            max-width: 500px;
            margin: 50px auto;
            background: #e9ecef;
            border-radius: 20px;
            overflow: hidden;
            position: relative;
            height: 40px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }

        .progress-bar {
            height: 100%;
            background: linear-gradient(90deg, #3498db, #2980b9, #3498db);
            background-size: 200% 100%;
            animation: progress-animation 2s linear infinite;
            border-radius: 20px;
            position: relative;
            width: 100%;
        }

        .progress-bar-text {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            color: #fff;
            font-weight: 600;
            font-size: 0.95em;
            white-space: nowrap;
            z-index: 10;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
        }

        @keyframes progress-animation {
            0% {
                background-position: 0% 0%;
            }
            100% {
                background-position: 200% 0%;
            }
        }

        body.dark-theme .progress-bar-container {
            background: #2a313a;
        }

        body.dark-theme .progress-bar {
            background: linear-gradient(90deg, #3498db, #2980b9, #3498db);
            background-size: 200% 100%;
        }

        .error {
            background: #f8d7da;
            color: #721c24;
            padding: 15px;
            border-radius: 10px;
            margin-bottom: 20px;
            border-left: 4px solid #dc3545;
        }

        .empty-state {
            text-align: center;
            padding: 60px 20px;
            color: #6c757d;
        }

        .empty-state svg {
            width: 100px;
            height: 100px;
            margin-bottom: 20px;
            opacity: 0.5;
        }

        /* 统计信息折叠开关（手机端） */
        .stats-toggle {
            display: none;
            align-items: center;
            justify-content: space-between;
            padding: 8px 12px;
            cursor: pointer;
            background: #f8f9fa;
            border-bottom: 1px solid #e1e8ed;
            font-size: 0.9em;
            color: #495057;
        }
        .stats-toggle-label {
            font-weight: 500;
        }
        .stats-toggle-arrow {
            font-size: 0.8em;
            color: #6c757d;
        }

        body.dark-theme .stats-toggle {
            background: #2a313a;
            border-bottom-color: #3a414a;
            color: #e9ecef;
        }

        body.dark-theme .stats-toggle-label {
            color: #e9ecef;
        }

        body.dark-theme .stats-toggle-arrow {
            color: #adb5bd;
        }

        .item-list {
            display: grid;
            gap: 15px;
        }

        .item-card {
            background: white;
            border: 2px solid var(--region-border-color);
            border-radius: 10px;
            padding: 20px;
            transition: all 0.3s;
            cursor: pointer;
        }

        .item-card:hover {
            border-color: #3498db;
            box-shadow: 0 5px 15px rgba(52, 152, 219, 0.2);
            transform: translateY(-2px);
        }

        .data-table tbody tr {
            cursor: pointer;
            transition: background-color 0.2s;
        }

        .data-table tbody tr:hover {
            background: #f0f7ff !important;
        }

        .item-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
        }

        .item-title {
            font-size: 1.3em;
            font-weight: 600;
            color: #212529;
        }

        .item-details {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 10px;
            margin-top: 15px;
        }

        .detail-item {
            display: flex;
            flex-direction: column;
        }

        .detail-label {
            font-size: 0.9em;
            color: #6c757d;
            margin-bottom: 5px;
        }

        .detail-value {
            font-size: 1.1em;
            color: #212529;
            font-weight: 500;
        }

        /* 模态框样式 */
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            overflow: auto;
        }

        .modal-content {
            background-color: #ffffff;
            margin: 5% auto;
            padding: 0;
            border-radius: 8px;
            width: 90%;
            max-width: 800px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
            animation: modalSlideIn 0.3s;
        }

        @keyframes modalSlideIn {
            from {
                transform: translateY(-50px);
                opacity: 0;
            }
            to {
                transform: translateY(0);
                opacity: 1;
            }
        }

        .modal-header {
            background: #2c3e50;
            color: white;
            padding: 15px 30px;
            border-radius: 8px 8px 0 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            cursor: move;
            user-select: none;
            touch-action: none;
        }

        .modal-header h2 {
            margin: 0;
            font-size: 1.5em;
            font-weight: 600;
        }

        .modal-content.modal-drag-positioned {
            animation: none !important;
        }

        .modal-content.modal-dragging {
            transition: none !important;
            user-select: none;
        }

        body.modal-drag-active {
            user-select: none;
            cursor: move;
        }

        body.modal-drag-active * {
            cursor: move !important;
        }

        .close {
            color: white;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
            line-height: 1;
        }

        .close:hover {
            opacity: 0.7;
        }

        .modal-body {
            padding: 30px;
            max-height: 70vh;
            overflow-y: auto;
        }

        /* 创建预出库方案 — 加宽三栏布局 */
        #createPreOutboundModal .modal-content.create-pre-outbound-modal {
            width: min(1560px, 98vw);
            max-width: min(1560px, 98vw);
            margin: 2vh auto;
        }

        #createPreOutboundModal .modal-body.create-pre-outbound-body {
            max-height: calc(100vh - 100px);
            overflow: hidden;
            padding: 24px 28px;
        }

        .create-pre-outbound-form {
            display: flex;
            flex-direction: column;
            min-height: calc(100vh - 160px);
            max-height: calc(100vh - 160px);
        }

        .create-pre-outbound-layout {
            display: grid;
            grid-template-columns: minmax(240px, 0.85fr) minmax(280px, 1fr) minmax(340px, 1.15fr);
            gap: 0;
            flex: 1;
            min-height: 0;
            align-items: stretch;
        }

        .create-pre-outbound-info {
            min-width: 0;
            min-height: 0;
            overflow-y: auto;
            padding-right: 20px;
        }

        .create-pre-outbound-info .detail-section {
            margin-bottom: 0;
        }

        .create-pre-outbound-selected-col {
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            border-left: 1px solid #e1e8ed;
            border-right: 1px solid #e1e8ed;
            padding: 0 20px;
        }

        .create-pre-outbound-picker {
            flex: 1;
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            padding-left: 20px;
        }

        .create-pre-outbound-stock-picker {
            flex: 1;
            min-height: 0;
            align-self: stretch;
        }

        .create-pre-outbound-subcount {
            font-size: 0.8em;
            font-weight: normal;
            color: #6c757d;
        }

        .create-pre-outbound-input {
            width: 100%;
            padding: 8px 10px;
            border: 2px solid #34495e;
            border-radius: 0;
            font-size: 1em;
            box-sizing: border-box;
        }

        .create-pre-outbound-selected-section {
            display: flex;
            flex-direction: column;
            flex: 1;
            min-height: 0;
            margin-bottom: 0;
        }

        .create-pre-outbound-selected-list {
            flex: 1;
            min-height: 0;
            display: flex;
            flex-direction: column;
        }

        .create-pre-outbound-dependency-alert {
            margin-bottom: 10px;
            flex-shrink: 0;
        }

        .create-pre-outbound-dependency-check-btn {
            margin-top: 0;
        }

        .create-pre-outbound-selected-display {
            flex: 1;
            min-height: 120px;
            max-height: none;
            overflow-y: auto;
            padding: 12px;
            background: #f8f9fa;
            border: 1px solid #dce4ec;
        }

        .create-pre-outbound-selected-stats {
            margin-bottom: 12px;
        }

        .create-pre-outbound-stats-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.92em;
        }

        .create-pre-outbound-stats-table thead th {
            text-align: left;
            padding: 6px 8px;
            border-bottom: 2px solid #34495e;
            font-weight: 600;
            color: #2c3e50;
        }

        .create-pre-outbound-stats-table tbody td {
            padding: 6px 8px;
            border-bottom: 1px solid #e1e8ed;
            vertical-align: top;
            word-break: break-word;
        }

        .create-pre-outbound-stats-table .col-qty {
            text-align: right;
            width: 88px;
            white-space: nowrap;
        }

        .create-pre-outbound-stats-table .col-action {
            width: 72px;
            text-align: center;
            white-space: nowrap;
        }

        .create-pre-outbound-qty-input {
            width: 64px;
            padding: 4px 6px;
            border: 2px solid #34495e;
            border-radius: 0;
            font-size: 0.92em;
            text-align: center;
            box-sizing: border-box;
        }

        .create-pre-outbound-stats-remove-btn {
            padding: 4px 10px;
            border: 1px solid #dc3545;
            background: #fff;
            color: #dc3545;
            font-size: 0.85em;
            cursor: pointer;
            line-height: 1.2;
        }

        .create-pre-outbound-stats-remove-btn:hover {
            background: #dc3545;
            color: #fff;
        }

        .create-pre-outbound-stats-total {
            margin-top: 8px;
            font-size: 0.92em;
            font-weight: 600;
            text-align: right;
            color: #2c3e50;
        }

        .create-pre-outbound-empty {
            text-align: center;
            color: #6c757d;
            padding: 20px;
        }

        .create-pre-outbound-selected-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .create-pre-outbound-selected-tag {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 6px 12px;
            background: #e7f1ff;
            border: 1px solid #b6d4fe;
            font-size: 0.9em;
        }

        .create-pre-outbound-tag-remove {
            cursor: pointer;
            color: #dc3545;
            font-weight: bold;
            line-height: 1;
        }

        .create-pre-outbound-actions {
            display: flex;
            gap: 10px;
            justify-content: flex-end;
            margin-top: 20px;
            padding-top: 16px;
            border-top: 1px solid #e1e8ed;
            flex-shrink: 0;
        }

        .create-pre-outbound-actions .create-pre-outbound-dependency-check-btn {
            width: auto;
            margin-top: 0;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-selected-col {
            border-left-color: #2a313a;
            border-right-color: #2a313a;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-picker {
            border-left-color: #2a313a;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-selected-display {
            background: #1b2026;
            border-color: #2a313a;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-stats-table thead th {
            color: #e9ecef;
            border-bottom-color: #2a313a;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-stats-table tbody td {
            border-bottom-color: #2a313a;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-stats-total {
            color: #e9ecef;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-qty-input {
            background: #1b2026;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-stats-remove-btn {
            background: #1b2026;
            border-color: #dc3545;
            color: #f08080;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-stats-remove-btn:hover {
            background: #dc3545;
            color: #fff;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-input {
            background: #1b2026;
            border-color: #2a313a;
            color: #e9ecef;
        }

        body.dark-theme #createPreOutboundModal .create-pre-outbound-actions {
            border-top-color: #2a313a;
        }

        @media (max-width: 1100px) {
            #createPreOutboundModal .modal-content.create-pre-outbound-modal {
                width: 98vw;
                max-width: 98vw;
                margin: 1vh auto;
            }

            .create-pre-outbound-form {
                min-height: auto;
                max-height: none;
            }

            .create-pre-outbound-layout {
                grid-template-columns: 1fr;
                gap: 0;
            }

            .create-pre-outbound-info {
                overflow: visible;
                padding-right: 0;
                padding-bottom: 16px;
            }

            .create-pre-outbound-info .detail-section {
                margin-bottom: 0;
            }

            .create-pre-outbound-selected-col {
                border-left: none;
                border-right: none;
                border-top: 1px solid #e1e8ed;
                border-bottom: 1px solid #e1e8ed;
                padding: 16px 0;
            }

            .create-pre-outbound-selected-display {
                max-height: 280px;
            }

            .create-pre-outbound-picker {
                padding-left: 0;
                padding-top: 16px;
                border-top: none;
            }

            .create-pre-outbound-stock-picker {
                min-height: 280px;
                max-height: 50vh;
            }
        }

        .detail-section {
            margin-bottom: 25px;
        }

        .detail-section h3 {
            color: #2c3e50;
            font-size: 1.2em;
            margin-bottom: 15px;
            padding-bottom: 10px;
            border-bottom: 2px solid #e1e8ed;
        }

        .detail-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 15px;
        }

        /* 库存详情 — 基本信息表格（与库存 data-table 网格线一致） */
        .inventory-detail-info-wrap {
            overflow-x: auto;
            margin-top: 0;
            box-shadow: var(--table-side-inset-shadow);
        }

        #detailModal .inventory-detail-info-table {
            width: 100%;
            border-collapse: collapse;
            table-layout: fixed;
        }

        #detailModal .inventory-detail-info-table td {
            border: 1px solid var(--inner-border-color) !important;
            padding: 10px 12px;
            vertical-align: top;
            line-height: 1.35;
        }

        #detailModal .inventory-detail-info-table td .detail-label {
            display: block;
            margin-bottom: 6px;
        }

        #detailModal .inventory-detail-info-table tbody tr:first-child td {
            border-top-width: var(--table-outer-border-width) !important;
        }

        #detailModal .inventory-detail-info-table tbody tr:last-child td {
            border-bottom-width: var(--table-outer-border-width) !important;
        }

        #detailModal .inventory-detail-info-table tbody td:first-child {
            border-left-width: var(--table-outer-border-width) !important;
        }

        #detailModal .inventory-detail-info-table tbody td:last-child {
            border-right-width: var(--table-outer-border-width) !important;
        }

        body:not(.dark-theme) #detailModal .inventory-detail-info-table td {
            background: #fff;
            border-color: var(--inner-border-color) !important;
        }

        body:not(.dark-theme) #detailModal .inventory-detail-info-table tbody tr:first-child td {
            border-top-color: var(--region-border-color) !important;
        }

        body:not(.dark-theme) #detailModal .inventory-detail-info-table tbody tr:last-child td {
            border-bottom-color: var(--region-border-color) !important;
        }

        body:not(.dark-theme) #detailModal .inventory-detail-info-table tbody td:first-child {
            border-left-color: var(--region-border-color) !important;
        }

        body:not(.dark-theme) #detailModal .inventory-detail-info-table tbody td:last-child {
            border-right-color: var(--region-border-color) !important;
        }

        body.dark-theme #detailModal .inventory-detail-info-table td {
            background: #161a1e;
        }

        .inventory-edit-date-row {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .inventory-edit-date-row input[type="date"] {
            flex: 1;
            min-width: 0;
        }

        .inventory-detail-barcode-row {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            align-items: flex-start;
        }

        .inventory-detail-barcode-col {
            flex: 1 1 240px;
            min-width: 0;
        }

        .inventory-detail-device-image-col {
            flex: 0 0 168px;
            width: 168px;
        }

        .inventory-detail-device-image-wrap {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 160px;
            height: 160px;
            padding: 8px;
            box-sizing: border-box;
            border: 1px solid var(--inner-border-color);
            background: #fff;
            overflow: hidden;
        }

        body.dark-theme .inventory-detail-device-image-wrap {
            background: #161a1e;
        }

        .inventory-detail-device-image {
            display: block;
            width: 144px;
            height: 144px;
            object-fit: contain;
            border-radius: 4px;
        }

        .inventory-edit-device-image-thumb {
            max-width: 100%;
            max-height: 180px;
            object-fit: contain;
            border-radius: 4px;
        }

        .inventory-detail-no-image {
            color: #6c757d;
            font-size: 14px;
        }

        .inventory-edit-device-image-preview {
            margin-bottom: 10px;
            min-height: 80px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
        }

        .inventory-edit-device-image-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .inventory-device-image-btn {
            border: none;
            padding: 0;
            background: transparent;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 144px;
            height: 144px;
        }

        .inventory-share-image-option {
            display: flex;
            align-items: center;
            gap: 8px;
            margin-top: 10px;
            font-size: 14px;
            cursor: pointer;
        }

        .inventory-share-image-hint {
            margin-top: 6px;
            font-size: 12px;
            color: #6c757d;
        }

        .inventory-share-image-badge {
            display: inline-block;
            margin-top: 6px;
            padding: 2px 8px;
            font-size: 11px;
            color: #0d6efd;
            background: rgba(13, 110, 253, 0.1);
            border-radius: 4px;
        }

        .inventory-edit-device-image-preview {
            position: relative;
        }

        .items-list {
            margin-top: 0;
        }

        /* 旧版 plain table 样式保留给未迁移的 items-list；详情表格见 .detail-items-table-wrap */
        .items-list > table:not(.data-table),
        .stat-group-items table:not(.data-table) {
            width: 100%;
            border-collapse: collapse;
            margin-top: 0;
            font-size: 0.9em;
            line-height: 1.35;
        }

        .items-list > table:not(.data-table) th,
        .stat-group-items table:not(.data-table) th {
            background: #f8f9fa;
            padding: 5px 8px;
            text-align: left;
            font-weight: 600;
            color: #2c3e50;
            border-bottom: 2px solid #e1e8ed;
            line-height: 1.3;
            font-size: inherit;
        }

        .items-list > table:not(.data-table) td,
        .stat-group-items table:not(.data-table) td {
            padding: 4px 8px;
            border-bottom: 1px solid #e1e8ed;
            vertical-align: middle;
            font-size: inherit;
        }

        .items-list > table:not(.data-table) .status-badge,
        .stat-group-items table:not(.data-table) .status-badge {
            padding: 2px 8px;
            font-size: 0.82em;
            line-height: 1.2;
        }

        .items-list > table:not(.data-table) tr:hover,
        .stat-group-items table:not(.data-table) tr:hover {
            background: #f8f9fa;
        }

        /* 视图切换按钮 */
        .view-toggle {
            display: flex;
            gap: 10px;
            margin-bottom: 0;
            padding-bottom: 4px;
            border-bottom: 2px solid #e1e8ed;
        }

        /* 物品列表区：表格紧贴上方切换栏横线 */
        .detail-section .items-list-header {
            margin-bottom: 0;
            padding-bottom: 2px;
            border-bottom: 2px solid #e1e8ed;
        }

        .detail-section .items-list-header h3 {
            margin-bottom: 0;
            padding-bottom: 0;
            border-bottom: none;
        }

        .detail-section .items-list-header .view-toggle {
            margin-bottom: 0;
            padding-bottom: 0;
            border-bottom: none;
        }

        .view-btn {
            padding: 7px 14px;
            font-size: 0.9em;
        }

        /* 统计视图样式 */
        .statistics-view {
            margin-top: 0;
            --stat-grid-cols: 22px minmax(120px, 1.6fr) minmax(96px, 1.4fr) 56px;
        }

        .stat-grid-row {
            display: grid;
            grid-template-columns: var(--stat-grid-cols);
            gap: 6px 10px;
            align-items: center;
            padding: 6px 12px;
        }

        .stat-grid-cell {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            min-width: 0;
            font-size: 0.9em;
        }

        .stat-grid-row .stat-grid-cell {
            font-weight: 600;
            color: #2c3e50;
        }

        .stat-grid-expand {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .stat-grid-expand .expand-icon {
            margin-left: 0;
        }

        .stat-grid-count {
            text-align: center;
        }

        .stat-group {
            background: #f8f9fa;
            border: 1px solid var(--region-border-color);
            border-radius: 6px;
            margin-bottom: 6px;
            overflow: hidden;
        }

        .stat-group-header {
            cursor: pointer;
            transition: background 0.2s;
            line-height: 1.3;
        }

        .stat-group-header:hover {
            background: #e9ecef;
        }

        .stat-group-count {
            background: #3498db;
            color: white;
            padding: 2px 8px;
            border-radius: 12px;
            font-size: 0.82em;
            font-weight: 600;
            line-height: 1.2;
            display: inline-block;
        }

        .stat-group-details {
            display: none;
            padding: 8px 10px;
            background: white;
            border-top: 1px solid #e1e8ed;
        }

        .stat-group-details.expanded {
            display: block;
        }

        .stat-group-items {
            line-height: 1.35;
        }

        .expand-icon {
            color: #6c757d;
            font-weight: bold;
            margin-left: 10px;
            transition: transform 0.2s;
        }

        .expand-icon.expanded {
            transform: rotate(90deg);
        }

        @media (max-width: 768px) {
            body {
                padding: 8px;
            }

            body.logged-in {
                padding: 0;
            }

            .main-content.logged-in > .container {
                flex: 1;
                min-height: 0;
                height: auto;
            }

            .content-panel {
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
                overscroll-behavior: contain;
                padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
            }

            .container {
                border-radius: 0;
                box-shadow: none;
            }

            .header {
                padding: 16px 18px;
            }

            .header h1 {
                font-size: 1.4em;
            }
            /* 缩小主题切换尺寸（平板及以下） */
            .theme-toggle {
                padding: 5px 10px;
                font-size: 0.85em;
            }
            .theme-toggle .knob {
                width: 30px;
                height: 16px;
            }
            .theme-toggle .knob::after {
                width: 12px;
                height: 12px;
            }
            .theme-toggle input:checked + .knob::after {
                transform: translateX(14px);
            }

            .status-bar {
                padding: 10px 15px;
                flex-wrap: wrap;
                gap: 8px;
            }

            /* 侧边栏：平板及以下改为抽屉式（不受 collapsed 影响） */
            .sidebar {
                position: fixed;
                top: 0;
                left: 0;
                bottom: 0;
                z-index: 1000;
                width: 280px;
                transform: translateX(-100%);
                transition: transform 0.25s ease;
                box-shadow: 4px 0 16px rgba(0,0,0,0.12);
            }
            body.sidebar-open .sidebar {
                transform: translateX(0);
            }
            .sidebar-item {
                padding: 6px 10px;
                font-size: 0.93em;
            }

            .tab-content {
                padding: 8px 10px;
            }

            .controls {
                gap: 10px;
                margin-bottom: 15px;
            }

            #inventory.tab-content,
            #barcodeLibrary.tab-content,
            #qrCodeBinding.tab-content,
            #traceability.tab-content,
            #stockRecords.tab-content,
            #preOutbound.tab-content,
            #notificationManagement.tab-content,
            #imageManagement.tab-content,
            #repairItemManagement.tab-content,
            #inventoryAlertSettings.tab-content,
            #inventoryDependencyRules.tab-content,
            #migrationReminderManagement.tab-content,
            #accessoryItemManagement.tab-content,
            #statistics.tab-content {
                padding: 4px 8px 6px;
            }

            #inventory > .controls,
            #barcodeLibrary > .controls,
            #qrCodeBinding > .controls,
            #traceability > .controls,
            #stockRecords > .controls,
            #preOutbound > .controls,
            #notificationManagement > .controls,
            #imageManagement > .controls,
            #repairItemManagement > .controls,
            #inventoryAlertSettings > .controls,
            #inventoryDependencyRules > .controls,
            #migrationReminderManagement > .controls,
            #accessoryItemManagement > .controls {
                margin-bottom: 4px;
                gap: 6px;
            }

            #inventory > .controls,
            #stockRecords > .controls,
            #preOutbound > .controls,
            #traceability > .controls,
            #notificationManagement > .controls {
                margin-bottom: 0;
                padding-bottom: 6px;
                border-bottom: var(--table-outer-border-width) solid var(--region-border-color);
            }

            .search-box {
                min-width: 160px;
                padding: 10px 14px;
                font-size: 0.95em;
            }

            .filter-btn,
            .refresh-btn {
                padding: 8px 12px;
                font-size: 0.9em;
                border-radius: 4px;
            }

            .stats {
                grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
                gap: 12px;
                margin-bottom: 18px;
            }

            .stat-card {
                padding: 12px;
            }

            .stat-card h3 {
                font-size: 1.6em;
                margin-bottom: 6px;
            }

            .stat-card p {
                font-size: 0.95em;
            }

            .data-table {
                font-size: 0.9em;
                table-layout: fixed;
                width: 100%;
            }

            .data-table th,
            .data-table td {
                padding: 6px 8px;
            }

            .item-list {
                gap: 10px;
            }

            .item-card {
                padding: 12px;
                border-radius: 8px;
            }

            .item-header {
                margin-bottom: 10px;
            }

            .item-title {
                font-size: 1.1em;
            }

            .item-details {
                grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
                gap: 8px;
            }

            .modal-content {
                width: 95%;
                margin: 10% auto;
            }

            .modal-body {
                padding: 20px;
            }

            .detail-grid {
                grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
                gap: 10px;
            }

            #detailModal .inventory-detail-info-table td {
                padding: 8px 10px;
            }

            .view-toggle {
                gap: 8px;
                margin-bottom: 0;
                padding-bottom: 2px;
            }

            .view-btn {
                padding: 6px 10px;
                font-size: 0.85em;
            }

            .stat-group-header {
                padding: 5px 10px;
                gap: 4px 8px;
            }

            .statistics-view {
                --stat-grid-cols: 18px minmax(88px, 1.4fr) minmax(72px, 1.2fr) 48px;
            }

            .stat-grid-cell {
                font-size: 0.85em;
            }

            .stat-group-count {
                padding: 2px 8px;
                font-size: 0.78em;
            }

            .stat-group-items table:not(.data-table) th,
            .stat-group-items table:not(.data-table) td,
            .items-list > table:not(.data-table) th,
            .items-list > table:not(.data-table) td,
            .detail-items-table-wrap .data-table th,
            .detail-items-table-wrap .data-table td {
                padding: 3px 6px;
            }

            /* 模态框标题与正文更小 */
            .modal-header {
                padding: 12px 20px;
            }
            .modal-header h2 {
                font-size: 1.2em;
            }
            .modal-body {
                font-size: 0.95em;
            }
            .modal-body .detail-label {
                font-size: 0.85em;
            }
            .modal-body .detail-value {
                font-size: 1.02em;
            }
        }

        /* 超小屏手机更紧凑布局 */
        @media (max-width: 576px) {
            body {
                padding: 0;
            }

            .container,
            .main-content.logged-in {
                width: 100%;
            }

            .tab-content,
            #inventory.tab-content,
            #barcodeLibrary.tab-content,
            #qrCodeBinding.tab-content,
            #traceability.tab-content,
            #stockRecords.tab-content,
            #preOutbound.tab-content,
            #notificationManagement.tab-content,
            #imageManagement.tab-content,
            #repairItemManagement.tab-content,
            #inventoryAlertSettings.tab-content,
            #inventoryDependencyRules.tab-content,
            #migrationReminderManagement.tab-content,
            #accessoryItemManagement.tab-content,
            #channelListManagement.tab-content,
            #roleInfoManagement.tab-content,
            #statistics.tab-content,
            #inventoryCheck.tab-content,
            #stockIn.tab-content,
            #stockOut.tab-content,
            #rfidBinding.tab-content {
                padding: 0;
            }

            /* 通知栏以下主内容区：略留左右边距，避免贴边 */
            .content-panel {
                padding-left: 6px;
                padding-right: 6px;
                padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
            }

            /* 手机端进一步缩小主题切换尺寸 */
            .theme-toggle {
                padding: 4px 8px;
                font-size: 0.7em;
            }
            .theme-toggle .knob {
                width: 28px;
                height: 14px;
            }
            .theme-toggle .knob::after {
                width: 10px;
                height: 10px;
            }
            .theme-toggle input:checked + .knob::after {
                transform: translateX(14px);
            }
            /* 手机端登出按钮缩小，字号与主题切换一致 */
            .logout-btn {
                font-size: 0.7em !important;
                padding: 2px 5px !important;
            }
            /* 手机端登出按钮和主题切换按钮之间的间距减小 */
            .header > div {
                gap: 4px !important;
            }
            /* 公告栏左边距再缩小一个中文字符左右 */
            .notice-bar {
                padding: 10px 14px;
            }
            /* 手机端：让记录信息里的“记录编号”单独占一行 */
            .detail-grid .full-row-mobile {
                grid-column: 1 / -1;
            }
            /* 手机端列表仅显示条码数字，隐藏条码图片 */
            .barcode-svg {
                display: none;
            }
            /* 侧边栏抽屉（手机端） */
            .sidebar {
                position: fixed;
                top: 0;
                left: 0;
                bottom: 0;
                z-index: 1000;
                width: 78vw;
                max-width: 296px;
                transform: translateX(-100%);
                transition: transform 0.25s ease;
                box-shadow: 4px 0 16px rgba(0,0,0,0.15);
            }
            body.sidebar-open .sidebar {
                transform: translateX(0);
            }
            .sidebar-item {
                padding: 6px 10px;
                font-size: 0.88em;
            }
            /* 库存表：铺满宽度，不横向滚动 */
            #inventory .inventory-table-wrap .data-table.resizable-table {
                width: 100%;
            }
            /* 手机端隐藏次要列：名称、类别、类别编码、采购时间、固定资产编号、RFID、位置、备注 */
            #inventory .data-table .col-hide-mobile {
                display: none;
            }
            .status-badge {
                padding: 3px 10px;
                border-radius: 0;
                font-size: 0.8em;
            }

            .header {
                padding: 12px 14px;
            }

            .header h1 {
                font-size: 1.2em;
            }

            .status-bar {
                padding: 8px 12px;
                gap: 6px;
            }

            /* 统计信息：手机端默认折叠，通过开关展开 */
            .stats-toggle {
                display: flex;
            }
            .stats.collapsible {
                display: none;
            }
            .stats.collapsible.expanded {
                display: grid;
            }

            .controls {
                gap: 8px;
                margin-bottom: 12px;
            }

            /* 手机端登出按钮缩小，字号与主题切换一致 */
            #barcodeLibrary > .controls,
            #qrCodeBinding > .controls,
            #traceability > .controls,
            #stockRecords > .controls,
            #preOutbound > .controls,
            #notificationManagement > .controls,
            #imageManagement > .controls,
            #repairItemManagement > .controls,
            #inventoryAlertSettings > .controls,
            #inventoryDependencyRules > .controls,
            #migrationReminderManagement > .controls,
            #accessoryItemManagement > .controls {
                margin-bottom: 4px;
                gap: 6px;
            }

            #inventory > .controls,
            #stockRecords > .controls,
            #preOutbound > .controls,
            #traceability > .controls,
            #notificationManagement > .controls {
                margin-bottom: 0;
                padding-bottom: 6px;
                border-bottom: var(--table-outer-border-width) solid var(--region-border-color);
            }

            .search-box {
                padding: 8px 12px;
                font-size: 0.9em;
            }

            .filter-btn,
            .refresh-btn {
                padding: 6px 10px;
                font-size: 0.85em;
            }

            /* 表格更紧凑 */
            .data-table {
                font-size: 0.85em;
            }

            .data-table th,
            .data-table td {
                padding: 6px 8px;
                max-width: 140px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            /* 统计卡片更紧凑 */
            .stats {
                grid-template-columns: repeat(4, 1fr);
                gap: 6px;
                margin-bottom: 12px;
            }

            .stat-card {
                padding: 8px 4px;
            }

            .stat-card h3 {
                font-size: 1.2em;
                margin-bottom: 2px;
            }

            .stat-card p {
                font-size: 0.75em;
            }

            /* 进度条移动端样式 */
            .progress-bar-container {
                max-width: 100%;
                margin: 30px auto;
                height: 35px;
            }

            .progress-bar-text {
                font-size: 0.85em;
            }

            /* 卡片列表更紧凑 */
            .item-list {
                gap: 8px;
            }

            .item-card {
                padding: 10px;
            }

            .item-title {
                font-size: 1em;
            }

            .item-details {
                grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
                gap: 4px;
                row-gap: 6px;
            }

            .detail-grid {
                grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
                gap: 6px;
            }

            #detailModal .inventory-detail-info-table td {
                padding: 8px 10px;
            }

            .view-btn {
                padding: 5px 7px;
                font-size: 0.78em;
            }

            .modal-content {
                width: 96%;
                margin: 12% auto;
            }

            .modal-body {
                padding: 14px;
            }

            /* 出入库记录卡片内文字更小 */
            #stockRecords .item-card .detail-label,
            #preOutbound .item-card .detail-label {
                font-size: 0.8em;
            }
            #stockRecords .item-card .detail-value,
            #preOutbound .item-card .detail-value {
                font-size: 0.95em;
            }

            /* 模态框内的详情字号更小 */
            .modal-body .detail-label {
                font-size: 0.78em;
            }
            .modal-body .detail-value {
                font-size: 0.92em;
            }
            .modal-body h3 {
                font-size: 0.95em;
                margin-bottom: 8px;
            }

            /* 模态框标题与正文更进一步缩小 */
            .modal-header {
                padding: 10px 15px;
            }
            .modal-header h2 {
                font-size: 1.05em;
            }
            .modal-body {
                font-size: 0.9em;
            }
        }

        /* 登录界面样式 */
        .login-container {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            background: #e9ecef;
            padding: 24px;
        }

        body.logged-in .login-container {
            display: none !important;
        }

        body.logged-in .main-content.logged-in {
            display: flex !important;
            flex-direction: column;
            min-height: 0;
        }

        .login-box {
            display: grid;
            grid-template-areas: "stack";
            width: min(92vw, 780px);
            min-height: 360px;
            border-radius: 0;
            padding: 0;
            overflow: hidden;
            border: 1px solid rgba(52, 73, 94, 0.18);
            box-shadow: 0 12px 36px rgba(0, 0, 0, 0.14);
        }

        .login-box-media {
            grid-area: stack;
            position: relative;
            z-index: 0;
            min-height: 360px;
            overflow: hidden;
            pointer-events: none;
        }

        .login-box-bg {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 38% 6%;
            border: 0;
        }

        .login-box-fade {
            grid-area: stack;
            position: relative;
            z-index: 1;
            min-height: 360px;
            pointer-events: none;
            background: rgba(255, 255, 255, 0.38);
        }

        .login-box-content {
            grid-area: stack;
            position: relative;
            z-index: 2;
            display: flex;
            flex-direction: column;
            min-height: 360px;
            padding: 36px 40px;
            box-sizing: border-box;
        }

        .login-meta {
            position: absolute;
            left: 40px;
            bottom: 28px;
            z-index: 3;
            display: flex;
            flex-direction: column;
            gap: 4px;
            pointer-events: none;
            user-select: none;
        }

        .login-version,
        .login-copyright {
            font-weight: 500;
            color: rgba(255, 255, 255, 0.9);
            letter-spacing: 0.02em;
            text-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
            line-height: 1.35;
        }

        .login-version {
            font-size: 0.78em;
        }

        .login-copyright {
            font-size: 0.72em;
            color: rgba(255, 255, 255, 0.82);
        }

        .login-brand {
            align-self: flex-start;
        }

        .login-brand h2,
        .login-box h2 {
            text-align: left;
            color: #fff;
            margin: 0;
            font-size: 3.5em;
            font-weight: 700;
            white-space: nowrap;
            letter-spacing: 0.03em;
            text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
        }

        .login-box .app-badge {
            display: inline-block;
            margin-left: 8px;
            padding: 2px 6px;
            font-size: 0.55em;
            font-weight: 700;
            color: #0b5ed7;
            background: #e7f1ff;
            border: 1px solid #b6d4fe;
            border-radius: 0;
            vertical-align: middle;
        }

        .login-main {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            width: 100%;
            padding: 20px 0;
        }

        .login-enter-area {
            display: none;
            flex-direction: column;
            align-items: flex-end;
            align-self: flex-end;
            gap: 10px;
            margin-top: auto;
            padding-top: 12px;
        }

        .login-gate-status-s2s {
            display: none;
            text-align: right;
            margin: 0;
            color: #fff;
            text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
        }

        .login-container.s2s-mode .login-gate-status-s2s {
            display: block;
        }

        .login-container.s2s-mode .login-gate-status-s2s:empty {
            display: none;
        }

        .login-container.s2s-mode .login-gate-status-apple {
            display: none;
        }

        .login-enter-btn {
            min-width: 120px;
        }

        .login-container.s2s-mode .login-main {
            flex: 1;
            padding-bottom: 0;
        }

        .login-container.s2s-mode .login-error {
            text-align: right;
            max-width: 320px;
            align-self: flex-end;
        }

        .login-form-group {
            margin-bottom: 20px;
        }

        .login-form-group label {
            display: block;
            margin-bottom: 8px;
            color: #495057;
            font-weight: 500;
        }

        .login-form-group input {
            width: 100%;
            padding: 12px;
            border: 1px solid var(--inner-border-color);
            border-radius: 0;
            font-size: 1em;
            transition: border-color 0.3s;
        }

        .login-form-group input:focus {
            outline: none;
            border-color: var(--inner-border-color);
        }

        .login-btn {
            width: 100%;
            padding: 12px;
            background: #3498db;
            color: white;
            border: none;
            border-radius: 8px;
            font-size: 1.1em;
            font-weight: 600;
            cursor: pointer;
            transition: background 0.3s;
            margin-top: 10px;
        }

        .login-btn:hover {
            background: #2980b9;
        }

        .login-error {
            color: #dc3545;
            text-align: center;
            margin-top: 10px;
            font-size: 0.9em;
            min-height: 20px;
        }

        .logout-btn {
            background: rgba(255,255,255,0.2);
            color: #fff;
            border: 1px solid rgba(255,255,255,0.3);
            border-radius: 6px;
            padding: 6px 12px;
            cursor: pointer;
            font-size: 0.85em;
            margin-left: 12px;
            transition: background 0.3s;
        }

        .logout-btn:hover {
            background: rgba(255,255,255,0.3);
        }

        /* CloudKit SDK 原生 Sign in with Apple 按钮（Apple 官方渲染，须可见可点） */
        .cloudkit-sign-in-area {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 48px;
            margin: 16px auto 8px;
            width: 100%;
            max-width: 280px;
        }

        .cloudkit-sign-in-area #apple-sign-in-button,
        .cloudkit-sign-in-area #apple-sign-out-button {
            min-width: 220px;
            min-height: 44px;
        }

        #currentUserDisplay {
            font-size: 13px;
            font-weight: 500;
            color: #2c3e50;
            white-space: nowrap;
        }

        body.logged-in .header #currentUserDisplay {
            color: rgba(255, 255, 255, 0.95);
        }

        .login-gate-status {
            text-align: center;
            color: #6c757d;
            font-size: 0.9em;
            margin-bottom: 10px;
            min-height: 1.2em;
        }

        .login-origin-hint {
            text-align: center;
            color: #856404;
            background: #fff8e1;
            border: 1px solid #ffe082;
            border-radius: 8px;
            padding: 8px 12px;
            font-size: 0.82em;
            line-height: 1.5;
            margin-bottom: 12px;
            word-break: break-all;
        }

        .login-origin-hint code {
            font-size: 0.95em;
            color: #c0392b;
        }

        body.dark-theme .login-gate-status {
            color: #bdc3c7;
        }

        .write-auth-hint {
            background: #fff3cd;
            border: 1px solid #ffc107;
            color: #856404;
            padding: 10px 14px;
            border-radius: 8px;
            margin-bottom: 16px;
            font-size: 0.9em;
        }

        body.dark-theme .write-auth-hint {
            background: rgba(255, 193, 7, 0.15);
            border-color: rgba(255, 193, 7, 0.4);
            color: #ffc107;
        }

        body.dark-theme .login-container {
            background: #12161c;
        }

        body.dark-theme .login-box {
            border-color: rgba(255, 255, 255, 0.12);
            box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
        }

        body.dark-theme .login-box-fade {
            background: rgba(18, 22, 28, 0.48);
        }

        body.dark-theme .login-box h2 {
            color: #fff;
        }

        body.dark-theme .login-container.s2s-mode .login-gate-status-s2s {
            color: #f1f3f5;
        }

        body.dark-theme .login-version,
        body.dark-theme .login-copyright {
            color: rgba(255, 255, 255, 0.88);
        }

        body.dark-theme .login-box .app-badge {
            color: #0b5ed7;
            background: #e7f1ff;
            border-color: #b6d4fe;
        }

        body.dark-theme .login-form-group label {
            color: #e1e8ed;
        }

        body.dark-theme .login-form-group input {
            background: #34495e;
            border-color: #495057;
            color: #fff;
        }

        body.dark-theme .login-form-group input:focus {
            border-color: #3498db;
        }

        body.dark-theme .login-form-group input::placeholder {
            color: #95a5a6;
        }

        /* 登录界面移动端（须写在基础登录样式之后） */
        @media (max-width: 576px) {
            .login-container {
                padding: 20px 16px;
                align-items: center;
                justify-content: center;
                min-height: 100vh;
                min-height: 100dvh;
                background: #e9ecef;
            }

            .login-box {
                width: 100%;
                max-width: 420px;
                min-height: 176px;
                margin: 0 auto;
                border: 1px solid rgba(52, 73, 94, 0.18);
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
            }

            .login-box-media {
                min-height: 176px;
            }

            .login-box-fade {
                min-height: 176px;
            }

            .login-box-bg {
                object-position: 42% 42%;
            }

            .login-box-content {
                padding: 14px 14px;
                min-height: 176px;
            }

            .login-meta {
                left: 14px;
                bottom: 14px;
                gap: 3px;
            }

            .login-version {
                font-size: 0.66em;
            }

            .login-copyright {
                font-size: 0.56em;
            }

            .login-brand h2,
            .login-box h2 {
                font-size: 1.85em;
                white-space: nowrap;
            }

            .login-box .app-badge {
                font-size: 0.48em;
                padding: 1px 4px;
                margin-left: 6px;
            }

            .login-main {
                padding: 8px 0;
            }

            .login-container.s2s-mode .login-enter-area {
                align-items: flex-end;
                width: auto;
            }

            .login-enter-area {
                align-items: stretch;
            }

            .login-container.s2s-mode .login-enter-btn {
                width: auto;
                min-width: 112px;
            }
        }

        /* 隐藏主要内容（未登录时） */
        .main-content {
            display: none;
        }

        .main-content.logged-in {
            display: flex;
            flex-direction: column;
            height: 100vh;
            height: 100dvh;
            min-height: 0;
            overflow: hidden;
        }

        .main-content.logged-in > .container {
            flex: 1;
            min-height: 0;
            height: auto;
        }

        /* 库存批量编辑 */
        .inventory-check-col {
            width: 28px !important;
            min-width: 28px !important;
            max-width: 28px !important;
            padding: 0 2px 0 6px !important;
            text-align: center;
            vertical-align: middle;
            box-sizing: border-box;
        }

        .inventory-check-col input[type="checkbox"] {
            width: 14px;
            height: 14px;
            margin: 0;
            padding: 0;
            cursor: pointer;
            vertical-align: middle;
        }

        tr.inventory-batch-row-selected {
            background: #f0f7ff !important;
        }

        tr.inventory-batch-row-selected td.inventory-check-col {
            box-shadow: inset 3px 0 0 #3498db;
        }

        .inventory-batch-clear-btn {
            flex-shrink: 0;
        }

        .inventory-batch-edit-hint {
            margin: 0 0 14px;
            padding: 10px 12px;
            background: #f8f9fa;
            border-left: 3px solid #3498db;
            color: #495057;
            font-size: 13px;
            line-height: 1.5;
        }

        .inventory-batch-field-list {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .inventory-batch-field-row {
            display: grid;
            grid-template-columns: 22px 88px 1fr;
            gap: 10px;
            align-items: center;
            cursor: default;
        }

        .inventory-batch-field-row-date {
            align-items: start;
        }

        .inventory-batch-field-label {
            font-size: 13px;
            color: #495057;
            font-weight: 500;
        }

        .inventory-batch-field-row input[type="text"],
        .inventory-batch-field-row select,
        .inventory-batch-field-row textarea {
            width: 100%;
            padding: 8px;
            border: 2px solid #34495e;
            border-radius: 0;
            font: inherit;
        }

        .inventory-batch-field-row textarea {
            resize: vertical;
            min-height: 56px;
        }

        .inventory-batch-field-row input:disabled,
        .inventory-batch-field-row select:disabled,
        .inventory-batch-field-row textarea:disabled {
            background: #f1f3f5;
            color: #868e96;
            border-color: #ced4da;
        }

        .inventory-batch-date-controls {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            align-items: center;
        }

        .inventory-batch-clear-date {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 13px;
            color: #495057;
            cursor: pointer;
            white-space: nowrap;
        }

        .inventory-batch-progress {
            margin-top: 14px;
        }

        .inventory-batch-progress-bar {
            height: 6px;
            background: #e9ecef;
            border-radius: 3px;
            overflow: hidden;
            margin-bottom: 6px;
        }

        .inventory-batch-progress-fill {
            height: 100%;
            width: 0;
            background: #3498db;
            transition: width 0.2s ease;
        }

        .inventory-batch-progress-text {
            font-size: 12px;
            color: #6c757d;
        }

        body.dark-theme .inventory-batch-edit-hint {
            background: #2c3338;
            color: #ced4da;
        }

        body.dark-theme tr.inventory-batch-row-selected {
            background: #1a2836 !important;
        }

        body.dark-theme .inventory-batch-field-row input:disabled,
        body.dark-theme .inventory-batch-field-row select:disabled,
        body.dark-theme .inventory-batch-field-row textarea:disabled {
            background: #343a40;
            color: #868e96;
            border-color: #495057;
        }

        @media (max-width: 576px) {
            .inventory-batch-field-row {
                grid-template-columns: 22px 1fr;
                grid-template-rows: auto auto;
            }

            .inventory-batch-field-label {
                grid-column: 2;
            }

            .inventory-batch-field-row input[type="text"],
            .inventory-batch-field-row select,
            .inventory-batch-field-row textarea,
            .inventory-batch-date-controls {
                grid-column: 1 / -1;
            }
        }