* { box-sizing: border-box; margin: 0; padding: 0; }
    html, body { height: 100%; background: #f2ede4; font-family: 'Inter', sans-serif; color: #1a1209; margin: 0; }
    #root { height: 100%; display: flex; align-items: center; justify-content: center; padding: 1.25rem; }
    ::-webkit-scrollbar { width: 5px; height: 5px; }
    ::-webkit-scrollbar-track { background: #f0ece4; }
    ::-webkit-scrollbar-thumb { background: #c8b898; border-radius: 3px; }
    @keyframes spin { to { transform: rotate(360deg); } }
    input::placeholder { color: #b8a888; }
    select option { background: #fff; color: #1a1209; }
    select { appearance: none; -webkit-appearance: none; }

    .app { display: flex; flex-direction: column; width: 100%; max-width: 1680px; height: calc(100vh - 2.5rem); overflow: hidden; border-radius: 12px; border: 1px solid #222222; }

    /* Top bar — dark warm */
    .topbar { background: #000000; border-bottom: 1px solid #222222; padding: 0 1.25rem; display: flex; align-items: stretch; height: 52px; flex-shrink: 0; }
    .topbar-brand { display: flex; align-items: center; gap: 0.625rem; padding-right: 1.5rem; border-right: 1px solid #222222; min-width: 0; }
    .brand-dot { width: 8px; height: 8px; border-radius: 50%; background: #e8850a; flex-shrink: 0; }
    .brand-text { min-width: 0; }
    .brand-name { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #f5f0e8; white-space: nowrap; }
    .brand-sub { font-size: 0.62rem; color: #6b5a40; letter-spacing: 0.04em; }
    .topbar-tabs { display: flex; align-items: stretch; padding-left: 0.5rem; flex: 1; overflow-x: auto; }
    .tab { display: flex; align-items: center; padding: 0 1rem; font-size: 0.8rem; font-weight: 500; color: #a89070; cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; transition: color 0.15s; gap: 0.4rem; }
    .tab:hover { color: #e8c090; }
    .tab.active { color: #e8850a; border-bottom-color: #e8850a; }
    .tab-badge { font-size: 0.58rem; background: #3a3020; color: #a89070; padding: 1px 5px; border-radius: 3px; border: 1px solid #4a4030; }
    .topbar-meta { display: flex; align-items: center; padding-left: 1rem; border-left: 1px solid #222222; gap: 0.75rem; flex-shrink: 0; }
    .topbar-meta-text { font-size: 0.72rem; color: #d4b880; font-family: 'Inter', sans-serif; font-weight: 500; white-space: nowrap; letter-spacing: 0.02em; }

    /* Main split */
    .main { display: flex; flex: 1; overflow: hidden; background: #f7f5f0; }

    /* Left panel — white card feel */
    .left-panel { width: 272px; flex-shrink: 0; border-right: 1px solid #e0dbd0; display: flex; flex-direction: column; background: #fff; overflow-y: auto; }
    .left-inner { padding: 1.125rem; display: flex; flex-direction: column; gap: 1.125rem; }

    .field-label { font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #8b7050; display: block; margin-bottom: 0.35rem; }

    .field-select-wrap { position: relative; }
    .field-select { width: 100%; background: #f7f5f0; border: 1.5px solid #d8d2c4; border-radius: 6px; padding: 0.6rem 2rem 0.6rem 0.75rem; font-family: 'Inter', sans-serif; font-size: 0.88rem; color: #1a1209; cursor: pointer; transition: border-color 0.15s; font-weight: 500; }
    .field-select.empty { color: #b8a888; font-weight: 400; }
    .field-select:focus { outline: none; border-color: #e8850a; }
    .select-chevron { position: absolute; right: 0.65rem; top: 50%; transform: translateY(-50%); color: #8b7050; pointer-events: none; font-size: 0.7rem; }

    .dropzone { border: 1.5px dashed #d8d2c4; border-radius: 8px; padding: 1.25rem 1rem; text-align: center; cursor: pointer; transition: all 0.2s; position: relative; background: #f7f5f0; }
    .dropzone:hover, .dropzone.drag { border-color: #e8850a; background: rgba(232,133,10,0.04); }
    .dropzone.has-file { border-color: #4a9a5a; border-style: solid; background: rgba(74,154,90,0.04); }
    .dropzone-icon { font-size: 1.5rem; margin-bottom: 0.375rem; }
    .dropzone-primary { font-size: 0.82rem; font-weight: 600; color: #1a1209; }
    .dropzone-secondary { font-size: 0.7rem; color: #8b7050; margin-top: 0.2rem; }
    .dropzone-filename { font-size: 0.75rem; font-weight: 600; color: #2a7a3a; margin-top: 0.2rem; word-break: break-all; }
    .dropzone input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

    .process-btn { width: 100%; padding: 0.75rem; background: #e8850a; color: #fff; border: none; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.88rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; cursor: pointer; transition: all 0.15s; display: flex; align-items: center; justify-content: center; gap: 0.5rem; box-shadow: 0 2px 8px rgba(232,133,10,0.3); }
    .process-btn:disabled { background: #e8ddd0; color: #b8a888; cursor: not-allowed; box-shadow: none; }
    .process-btn:not(:disabled):hover { background: #d4780a; }

    .err-box { background: rgba(180,60,60,0.08); border: 1px solid rgba(180,60,60,0.25); border-radius: 6px; padding: 0.6rem 0.75rem; font-size: 0.78rem; color: #a03030; line-height: 1.4; }

    .section-divider { border: none; border-top: 1px solid #e8e2d8; margin: 0; }

    .shipping-row { display: flex; align-items: center; gap: 0.5rem; background: #f7f5f0; border: 1.5px solid #d8d2c4; border-radius: 6px; padding: 0.5rem 0.75rem; }
    .shipping-label { font-size: 0.72rem; color: #8b7050; flex: 1; font-weight: 500; }
    .shipping-prefix { font-size: 0.8rem; color: #8b7050; }
    .shipping-input { width: 72px; background: transparent; border: none; padding: 0; outline: none; font-family: 'DM Mono', monospace; font-size: 0.88rem; color: #1a1209; text-align: right; font-weight: 600; }

    .meta-block { background: #f7f5f0; border-radius: 6px; overflow: hidden; border: 1px solid #e8e2d8; }
    .meta-row { display: flex; justify-content: space-between; align-items: center; padding: 0.45rem 0.75rem; border-bottom: 1px solid #eee8e0; }
    .meta-row:last-child { border-bottom: none; }
    .meta-key { font-size: 0.72rem; color: #8b7050; font-weight: 500; }
    .meta-val { font-size: 0.75rem; color: #1a1209; font-family: 'Inter', sans-serif; font-weight: 600; }

    /* Keyboard shortcuts */
    .shortcuts-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 400; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
    .shortcuts-card { background: #fff; border-radius: 12px; border: 1px solid #e0dbd0; width: 100%; max-width: 400px; overflow: hidden; }
    .shortcuts-header { padding: 1rem 1.25rem; border-bottom: 1px solid #e8e2d8; display: flex; justify-content: space-between; align-items: center; }
    .shortcuts-title { font-size: 0.88rem; font-weight: 700; color: #1a1209; }
    .shortcuts-body { padding: 0.75rem 1.25rem; display: flex; flex-direction: column; gap: 0.125rem; }
    .shortcut-row { display: flex; align-items: center; justify-content: space-between; padding: 0.4rem 0; border-bottom: 1px solid #f7f5f0; }
    .shortcut-row:last-child { border-bottom: none; }
    .shortcut-desc { font-size: 0.78rem; color: #5a4030; }
    .shortcut-keys { display: flex; align-items: center; gap: 4px; }
    kbd { background: #f2ede4; border: 1px solid #d8d2c4; border-radius: 4px; padding: 2px 6px; font-family: 'DM Mono', monospace; font-size: 0.68rem; color: #5a4030; white-space: nowrap; box-shadow: 0 1px 0 #c8b898; }
    .shortcut-hint { font-size: 0.65rem; color: #b8a888; padding: 0.5rem 1.25rem; border-top: 1px solid #e8e2d8; text-align: center; }

    /* Filter bar */
    .filter-bar { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1.25rem; background: #faf8f4; border-bottom: 1px solid #e8e2d8; flex-shrink: 0; flex-wrap: wrap; }
    .filter-input-wrap { position: relative; flex: 1; min-width: 160px; }
    .filter-input { width: 100%; background: #fff; border: 1.5px solid #d8d2c4; border-radius: 6px; padding: 0.375rem 0.625rem 0.375rem 1.75rem; font-family: 'Inter', sans-serif; font-size: 0.78rem; color: #1a1209; outline: none; transition: border-color 0.15s; }
    .filter-input:focus { border-color: #e8850a; }
    .filter-input::placeholder { color: #c8b898; }
    .filter-icon { position: absolute; left: 0.5rem; top: 50%; transform: translateY(-50%); color: #b8a888; font-size: 0.75rem; pointer-events: none; }
    .filter-chip { padding: 0.3rem 0.6rem; border-radius: 5px; font-size: 0.72rem; font-weight: 600; cursor: pointer; border: 1.5px solid transparent; transition: all 0.15s; white-space: nowrap; font-family: 'Inter', sans-serif; background: #f0ece4; color: #8b7050; }
    .filter-chip.active { background: #1a1209; color: #f5f0e8; border-color: #1a1209; }
    .filter-chip:hover:not(.active) { border-color: #c8b898; }
    .filter-count { font-size: 0.68rem; color: #b8a888; white-space: nowrap; }

    /* Sortable column headers */
    .sort-th { cursor: pointer; user-select: none; }
    .sort-th:hover { color: #5a4030; }
    .sort-indicator { margin-left: 4px; font-size: 0.6rem; opacity: 0.5; }
    .sort-indicator.active { opacity: 1; color: #e8850a; }

    /* Column header tooltips */
    .th-tip { position: relative; cursor: help; }
    .th-tip:hover::after { content: attr(data-tip); position: absolute; top: calc(100% + 6px); left: 0; background: #1a1209; color: #f5f0e8; font-size: 0.7rem; font-weight: 400; padding: 0.4rem 0.625rem; border-radius: 5px; white-space: normal; width: 200px; line-height: 1.4; z-index: 50; pointer-events: none; text-transform: none; letter-spacing: 0; }

    /* Export history */
    .history-entry { display: flex; align-items: center; justify-content: space-between; padding: 0.4rem 0; border-bottom: 1px solid #f0ece4; gap: 0.5rem; }
    .history-entry:last-child { border-bottom: none; }
    .history-meta { font-size: 0.7rem; color: #5a4030; line-height: 1.4; }
    .history-badge { font-size: 0.62rem; font-family: 'DM Mono', monospace; color: #8b7050; white-space: nowrap; }

    /* Print styles */
    @media print {
      body { background: white !important; }
      .topbar, .left-panel, .filter-bar, .stat-bar, .results-bar,
      .add-item-btn, .remove-btn, .merge-btn, .restore-link,
      .dupe-banner, .modal-overlay, .shortcuts-overlay { display: none !important; }
      .app { border: none !important; border-radius: 0 !important; height: auto !important; }
      .main { overflow: visible !important; }
      .right-panel { overflow: visible !important; }
      .table-wrap { overflow: visible !important; }
      .print-header { display: block !important; }
      thead th { background: #f2ede4 !important; -webkit-print-color-adjust: exact; }
    }
    .print-header { display: none; padding: 1rem 1.25rem 0.75rem; border-bottom: 1px solid #e8e2d8; }
    .print-btn { background: none; border: 1px solid #d8d2c4; border-radius: 5px; padding: 0.3rem 0.7rem; font-family: 'Inter', sans-serif; font-size: 0.72rem; color: #8b7050; cursor: pointer; transition: all 0.15s; }
    .print-btn:hover { background: #f7f5f0; color: #5a4030; }

    /* Invoice preview modal */
    .modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); z-index: 300; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
    .modal-card { background: #fff; border-radius: 12px; border: 1px solid #e0dbd0; width: 100%; max-width: 480px; overflow: hidden; }
    .modal-header { padding: 1.125rem 1.25rem; border-bottom: 1px solid #e8e2d8; display: flex; align-items: center; justify-content: space-between; }
    .modal-title { font-size: 0.88rem; font-weight: 700; color: #1a1209; }
    .modal-sub { font-size: 0.72rem; color: #8b7050; margin-top: 2px; }
    .modal-body { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.875rem; }
    .modal-row { display: flex; justify-content: space-between; align-items: center; padding: 0.35rem 0; border-bottom: 1px solid #f0ece4; }
    .modal-row:last-of-type { border-bottom: none; }
    .modal-key { font-size: 0.75rem; color: #8b7050; font-weight: 500; }
    .modal-val { font-size: 0.78rem; color: #1a1209; font-weight: 600; font-family: 'Inter', sans-serif; }
    .modal-val.amber { color: #b86000; }
    .modal-val.green { color: #2a7a3a; }
    .modal-val.red { color: #cc2222; }
    .modal-total-block { background: #f7f5f0; border-radius: 8px; padding: 0.875rem; border: 1px solid #e8e2d8; }
    .modal-total-match { display: flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; margin-top: 0.375rem; font-weight: 600; }
    .modal-footer { padding: 1rem 1.25rem; border-top: 1px solid #e8e2d8; display: flex; gap: 0.75rem; }
    .modal-btn-primary { flex: 1; padding: 0.7rem; background: #e8850a; color: #fff; border: none; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.85rem; font-weight: 700; cursor: pointer; }
    .modal-btn-primary:hover { background: #d4780a; }
    .modal-btn-secondary { padding: 0.7rem 1rem; background: transparent; color: #8b7050; border: 1px solid #d8d2c4; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.82rem; cursor: pointer; }
    .modal-btn-secondary:hover { background: #f7f5f0; }

    /* Stat summary bar */
    .stat-bar { display: flex; align-items: center; gap: 1.25rem; padding: 0.5rem 1.25rem; background: #f7f5f0; border-bottom: 1px solid #e0dbd0; flex-shrink: 0; flex-wrap: wrap; }
    .stat-item { display: flex; align-items: center; gap: 0.35rem; font-size: 0.72rem; }
    .stat-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
    .stat-label { color: #8b7050; }
    .stat-val { font-weight: 700; color: #1a1209; font-family: 'DM Mono', monospace; }
    .stat-val.amber { color: #b86000; }
    .stat-val.green { color: #2a7a3a; }
    .stat-val.red { color: #cc2222; }
    .stat-divider { width: 1px; height: 14px; background: #e0dbd0; }

    /* Undo / restore original */
    .restore-link { font-size: 0.65rem; color: #e8850a; cursor: pointer; text-decoration: underline; white-space: nowrap; background: none; border: none; padding: 0; font-family: 'Inter', sans-serif; }
    .restore-link:hover { color: #c87010; }
    .modified-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #e8850a; margin-left: 4px; flex-shrink: 0; vertical-align: middle; title: "Modified"; }
    .qty-modified { font-size: 0.65rem; color: #e8850a; white-space: nowrap; font-style: italic; }

    /* Shipping detected indicator */
    .shipping-detected { font-size: 0.65rem; font-weight: 600; padding: 1px 5px; border-radius: 3px; }
    .shipping-detected.auto { background: #d8f0de; color: #2a7a3a; }
    .shipping-detected.manual { background: #f0ece4; color: #8b7050; }

    /* Step-by-step guide */
    .guide-toggle { width: 100%; background: transparent; border: 1px solid #e8e2d8; border-radius: 6px; padding: 0.5rem 0.75rem; font-family: 'Inter', sans-serif; font-size: 0.75rem; font-weight: 600; color: #8b7050; cursor: pointer; text-align: left; display: flex; justify-content: space-between; align-items: center; transition: all 0.15s; }
    .guide-toggle:hover { background: #f7f5f0; color: #5a4030; }
    .guide-body { background: #f7f5f0; border: 1px solid #e8e2d8; border-radius: 6px; padding: 0.875rem; display: flex; flex-direction: column; gap: 0.625rem; }
    .guide-step { display: flex; gap: 0.625rem; align-items: flex-start; }
    .guide-num { width: 18px; height: 18px; border-radius: 50%; background: #e8850a; color: #fff; font-size: 0.62rem; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .guide-text { font-size: 0.72rem; color: #5a4030; line-height: 1.45; }
    .guide-text strong { font-weight: 700; color: #3a2818; }
    .guide-divider { border: none; border-top: 1px solid #e8e2d8; margin: 0.125rem 0; }
    .guide-note { font-size: 0.68rem; color: #8b7050; line-height: 1.4; background: #fff; border-radius: 4px; padding: 0.4rem 0.6rem; border: 1px solid #e8e2d8; }
    /* Review confirm button */
    .confirm-btn { width: 100%; padding: 0.65rem; background: transparent; border: 1.5px solid #e8850a; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.82rem; font-weight: 700; color: #e8850a; cursor: pointer; transition: all 0.15s; text-align: center; }
    .confirm-btn:hover { background: rgba(232,133,10,0.08); }
    .confirm-btn.confirmed { background: rgba(232,133,10,0.12); border-color: #4a9a5a; color: #2a7a3a; }
    .clear-btn { width: 100%; padding: 0.5rem; background: transparent; color: #cc3333; border: 1px solid #e8d8d8; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
    .clear-btn:hover { background: rgba(204,51,51,0.06); border-color: #cc3333; }
    .export-btn { width: 100%; padding: 0.7rem; background: transparent; color: #e8850a; border: 1.5px solid #e8850a; border-radius: 6px; font-family: 'Inter', sans-serif; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; cursor: pointer; transition: all 0.15s; }
    .export-btn:not(:disabled):hover { background: rgba(232,133,10,0.08); }
    .export-btn:disabled { border-color: #d8d2c4; color: #b8a888; cursor: not-allowed; }

    /* Right panel */
    .right-panel { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: #f7f5f0; }

    .empty-state { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; }
    .empty-icon { font-size: 2.25rem; opacity: 0.2; }
    .empty-text { font-size: 0.82rem; color: #b8a888; text-align: center; max-width: 260px; line-height: 1.5; }

    .results-bar { padding: 0.6rem 1.25rem; border-bottom: 1px solid #e0dbd0; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; background: #fff; }
    .results-bar-left { display: flex; align-items: center; gap: 1rem; }
    .results-title { font-size: 0.82rem; font-weight: 700; color: #1a1209; }
    .results-count { font-size: 0.68rem; font-family: 'DM Mono', monospace; color: #8b7050; }
    .results-total { font-size: 0.72rem; color: #8b7050; }
    .results-total span { color: #b86a00; font-family: 'DM Mono', monospace; font-weight: 700; }

    .table-wrap { flex: 1; overflow: auto; background: #fff; }
    table { width: 100%; border-collapse: collapse; }
    thead th { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #8b7050; padding: 0.55rem 0.75rem; text-align: left; border-bottom: 1.5px solid #e0dbd0; white-space: nowrap; position: sticky; top: 0; background: #f2ede4; z-index: 1; }
    thead th.r { text-align: right; }
    tbody tr { border-bottom: 1px solid #f0ece4; transition: background 0.1s; }
    tbody tr:nth-child(even) { background: #faf8f4; }
    tbody tr:hover { background: rgba(232,133,10,0.05); }
    tbody tr.unchecked { opacity: 0.35; }
    td { padding: 0.5rem 0.75rem; vertical-align: middle; }
    td.upc-cell { font-family: 'DM Mono', monospace; font-size: 0.68rem; color: #b8a888; }
    td.landed-cell { font-family: 'DM Mono', monospace; font-size: 0.8rem; color: #b86a00; text-align: right; font-weight: 600; }

    .remove-btn { background: none; border: none; cursor: pointer; color: #d8d2c4; font-size: 1.1rem; line-height: 1; padding: 0 2px; transition: color 0.15s; }
    .add-item-row td { padding: 0.4rem 0.75rem; border-top: 1px dashed #e8e2d8; }
    .add-item-btn { background: none; border: none; cursor: pointer; font-family: 'Inter', sans-serif; font-size: 0.75rem; font-weight: 600; color: #e8850a; padding: 0.3rem 0; display: flex; align-items: center; gap: 0.35rem; transition: color 0.15s; }
    .add-item-btn:hover { color: #c87010; }
    .manual-badge { background: #e8f0ff; color: #2a4a8a; border: 1px solid #b8cef0; font-size: 0.6rem; font-weight: 700; padding: 1px 5px; border-radius: 3px; white-space: nowrap; letter-spacing: 0.03em; }
    .remove-btn:hover { color: #cc3333; }

    /* Promo items */
    .promo-row td { opacity: 0.75; }
    .promo-badge { background: #e8f4e8; color: #2a6b2a; border: 1px solid #5a9a5a; font-size: 0.62rem; font-weight: 700; padding: 1px 6px; border-radius: 3px; white-space: nowrap; letter-spacing: 0.04em; }
    .promo-cost { font-family: 'DM Mono', monospace; font-size: 0.75rem; color: #5a9a5a; font-weight: 600; }

    /* Truncated vendor ID warning icon */
    .trunc-icon { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border-radius: 50%; background: #e8850a; color: #fff; font-size: 0.62rem; font-weight: 800; cursor: help; flex-shrink: 0; line-height: 1; position: relative; }
    .trunc-icon:hover::after { content: attr(data-tip); position: absolute; left: 20px; top: 50%; transform: translateY(-50%); background: #000000; color: #f5f0e8; font-size: 0.72rem; font-weight: 400; padding: 0.5rem 0.75rem; border-radius: 6px; white-space: normal; width: 220px; line-height: 1.4; z-index: 200; border: 1px solid #3a3020; pointer-events: none; }

    /* Duplicate warning */
    .dupe-banner { background: #fff3cd; border: 1.5px solid #e8a800; border-radius: 8px; padding: 0.75rem 1rem; margin: 0.75rem 1.25rem 0; display: flex; align-items: flex-start; gap: 0.75rem; flex-shrink: 0; }
    .dupe-banner-icon { font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
    .dupe-banner-text { flex: 1; }
    .dupe-banner-title { font-size: 0.78rem; font-weight: 700; color: #7a5a00; margin-bottom: 0.2rem; }
    .dupe-banner-desc { font-size: 0.72rem; color: #9a7800; line-height: 1.4; }
    .dupe-row { background: rgba(232,168,0,0.06); }
    .dupe-row:nth-child(even) { background: rgba(232,168,0,0.1); }
    .dupe-badge { background: #fff3cd; color: #7a5a00; border: 1px solid #e8a800; font-size: 0.62rem; font-weight: 700; padding: 1px 5px; border-radius: 3px; white-space: nowrap; }
    .merge-btn { background: #e8a800; color: #fff; border: none; border-radius: 4px; font-size: 0.68rem; font-weight: 700; padding: 3px 8px; cursor: pointer; font-family: 'Inter', sans-serif; white-space: nowrap; }
    .merge-btn:hover { background: #c89000; }

    .ship-note-row td { padding: 0.4rem 0.75rem; font-size: 0.72rem; font-style: italic; color: #b8a888; border-top: 1px dashed #e8e2d8; }

    /* Category picker */
    .cat-cell { position: relative; min-width: 160px; }
    .cat-trigger { font-size: 0.78rem; cursor: pointer; padding: 2px 4px; border-radius: 4px; transition: background 0.15s; display: flex; align-items: center; gap: 0.35rem; min-height: 1.5rem; }
    .cat-trigger:hover { background: rgba(232,133,10,0.08); }
    .cat-trigger.empty { color: #c8b898; font-style: italic; }
    .cat-trigger.auto { color: #c87010; }
    .cat-trigger.manual { color: #1a1209; font-weight: 500; }
    .cat-auto-dot { width: 5px; height: 5px; border-radius: 50%; background: #e8850a; flex-shrink: 0; }
    .cat-picker { position: fixed; z-index: 100; background: #fff; border: 1.5px solid #d8d2c4; border-radius: 8px; width: 320px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); overflow: hidden; }
    .cat-search { width: 100%; background: #f7f5f0; border: none; border-bottom: 1.5px solid #e0dbd0; padding: 0.625rem 0.875rem; font-family: 'Inter', sans-serif; font-size: 0.82rem; color: #1a1209; outline: none; }
    .cat-search::placeholder { color: #b8a888; }
    .cat-list { max-height: 260px; overflow-y: auto; }
    .cat-option { padding: 0.45rem 0.875rem; font-size: 0.78rem; color: #3a3028; cursor: pointer; transition: background 0.1s; line-height: 1.4; }
    .cat-option:hover { background: rgba(232,133,10,0.08); }
    .cat-option .cat-path-top { color: #8b7050; font-size: 0.68rem; }
    .cat-option .cat-path-leaf { color: #1a1209; font-weight: 500; }
    .cat-option-selected { background: rgba(232,133,10,0.1); }
    .cat-none { padding: 1rem; text-align: center; color: #b8a888; font-size: 0.8rem; }
    .cat-clear { padding: 0.4rem 0.875rem; font-size: 0.72rem; color: #cc3333; cursor: pointer; border-top: 1px solid #e8e2d8; }
    .cat-clear:hover { background: rgba(204,51,51,0.05); }

    /* Price cell */
    .price-cell { display: flex; align-items: center; gap: 4px; justify-content: flex-end; }
    .price-input { background: transparent; border: none; border-bottom: 1px solid transparent; outline: none; font-family: 'DM Mono', monospace; font-size: 0.82rem; color: #1a1209; text-align: right; width: 70px; padding: 1px 0; transition: border-color 0.15s; font-weight: 600; }
    .price-input:focus { border-bottom-color: #e8850a; }
    .price-input.suggested { color: #c87010; }
    .price-input.accepted { color: #1a1209; }
    .margin-pill { font-size: 0.65rem; padding: 2px 6px; border-radius: 3px; white-space: nowrap; font-family: 'DM Mono', monospace; font-weight: 700; }
    .margin-pill.good  { background: #d8f0de; color: #1a6b33; }
    .margin-pill.ok    { background: #f5ecc8; color: #7a5a00; }
    .margin-pill.warn  { background: #fde8e8; color: #aa2222; }

    /* Item type selector */
    .type-select { background: #f7f5f0; border: 1.5px solid #d8d2c4; border-radius: 4px; padding: 3px 8px; font-family: 'Inter', sans-serif; font-size: 0.75rem; font-weight: 600; color: #1a1209; cursor: pointer; outline: none; appearance: none; -webkit-appearance: none; min-width: 80px; }
    .type-select:focus { border-color: #e8850a; }
    .type-select:hover { border-color: #c8a888; }

    /* Mobile */
    @media (max-width: 680px) {
      .main { flex-direction: column; }
      .left-panel { width: 100%; border-right: none; border-bottom: 1px solid #e0dbd0; max-height: 320px; }
      .brand-sub { display: none; }
      .tab-badge { display: none; }
      .topbar-meta { display: none; }
    }

    /* ── Pre-Order specific styles ── */
    .po-badge { display:inline-flex; align-items:center; padding:2px 7px; border-radius:4px; font-size:0.65rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; white-space:nowrap; }
    .po-badge-requested    { background:#e8e2d8; color:#5a4030; }
    .po-badge-subject      { background:#fff0d4; color:#8a5a00; border:1px solid #e8c060; }
    .po-badge-subject-wave { background:#fff0d4; color:#8a5a00; border:1px solid #e8c060; }
    .po-badge-allocated    { background:#d4f0e0; color:#1a6a3a; border:1px solid #60c890; }
    .po-badge-allocated-wave { background:#d4f0e0; color:#1a6a3a; border:1px solid #60c890; }
    .po-badge-received     { background:#d8e8ff; color:#1a3a8a; border:1px solid #6090e0; }
    .po-flag-zero  { background:rgba(220,160,0,0.12); border:1px solid rgba(220,160,0,0.35); color:#7a5500; }
    .po-flag-dup   { background:rgba(180,40,40,0.1); border:1px solid rgba(180,40,40,0.3); color:#8a2020; }
    .po-flag-french { background:rgba(220,100,0,0.1); border:1px solid rgba(220,100,0,0.3); color:#7a3a00; }
    .po-flag-bm    { background:rgba(220,100,0,0.1); border:1px solid rgba(220,100,0,0.3); color:#7a3a00; }
    .po-flag-nm    { background:rgba(220,100,0,0.1); border:1px solid rgba(220,100,0,0.3); color:#7a3a00; }
    .po-flag-restock { background:#f0ece4; color:#6b5a40; border:1px solid #d8d2c4; }

    .po-dropzone-pair { display:flex; flex-direction:column; gap:0.625rem; }
    .po-dropzone-label { font-size:0.62rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:#8b7050; margin-bottom:0.2rem; }

    .po-review-table { width:100%; border-collapse:collapse; font-size:0.76rem; }
    .po-review-table th { background:#f2ede4; color:#8b7050; font-size:0.62rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:0.4rem 0.5rem; border-bottom:2px solid #e0dbd0; white-space:nowrap; position:sticky; top:0; z-index:2; text-align:left; }
    .po-review-table td { padding:0.35rem 0.5rem; border-bottom:1px solid #f0ece4; vertical-align:middle; }
    .po-review-table tr:hover td { background:#faf8f4; }
    .po-review-table tr.dup-row td { background:rgba(180,40,40,0.04); }
    .po-review-table tr.zero-cost td { background:rgba(220,160,0,0.05); }

    .po-cost-input { width:72px; background:#fff8e8; border:1.5px solid #e8c060; border-radius:4px; padding:3px 6px; font-family:'DM Mono',monospace; font-size:0.78rem; color:#1a1209; text-align:right; outline:none; }
    .po-cost-input:focus { border-color:#e8850a; }
    .po-cost-ok { background:transparent; border:none; font-family:'DM Mono',monospace; font-size:0.78rem; color:#1a1209; text-align:right; width:72px; }

    /* History modal */
    .po-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:500; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
    .po-modal { background:#fff; border-radius:12px; border:1px solid #e0dbd0; width:100%; max-width:1100px; max-height:85vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 8px 32px rgba(0,0,0,0.18); }
    .po-modal-header { padding:1rem 1.25rem; border-bottom:1px solid #e8e2d8; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; }
    .po-modal-title { font-size:0.92rem; font-weight:700; color:#1a1209; }
    .po-modal-close { background:none; border:none; font-size:1.2rem; color:#8b7050; cursor:pointer; padding:0 0.25rem; line-height:1; }
    .po-modal-close:hover { color:#1a1209; }
    .po-modal-filters { padding:0.75rem 1.25rem; border-bottom:1px solid #e8e2d8; display:flex; gap:0.5rem; flex-wrap:wrap; flex-shrink:0; background:#faf8f4; }
    .po-modal-body { flex:1; overflow:auto; }
    .po-modal-count { font-size:0.7rem; color:#8b7050; padding:0.4rem 1.25rem; border-bottom:1px solid #f0ece4; background:#faf8f4; flex-shrink:0; }

    .po-dup-banner { background:#fff0f0; border:1px solid #f0b8b8; border-radius:6px; padding:0.6rem 0.75rem; margin:0.5rem 0; font-size:0.75rem; color:#8a2020; display:flex; align-items:flex-start; gap:0.5rem; }

    .po-tracker-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; gap:0.75rem; color:#8b7050; }
    .po-tracker-empty-icon { font-size:2.5rem; opacity:0.4; }
    .po-tracker-empty-text { font-size:0.85rem; font-weight:600; }
    .po-tracker-empty-sub { font-size:0.75rem; color:#b8a888; }

    .po-action-row { display:flex; gap:0.5rem; align-items:center; }
    .po-btn-sm { padding:0.3rem 0.7rem; border-radius:5px; font-size:0.72rem; font-weight:600; border:none; cursor:pointer; font-family:'Inter',sans-serif; transition:all 0.15s; }
    .po-btn-primary { background:#e8850a; color:#fff; }
    .po-btn-primary:hover { background:#d4780a; }
    .po-btn-secondary { background:#f2ede4; color:#5a4030; border:1px solid #d8d2c4; }
    .po-btn-secondary:hover { background:#e8e2d8; }
    .po-btn-danger { background:#fdf0f0; color:#8a2020; border:1px solid #f0b8b8; }
    .po-btn-danger:hover { background:#f8e0e0; }

    .po-export-btn { width:100%; padding:0.6rem; background:#2a6a3a; color:#fff; border:none; border-radius:6px; font-family:'Inter',sans-serif; font-size:0.82rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; cursor:pointer; transition:all 0.15s; margin-top:0.25rem; }
    .po-export-btn:hover { background:#1a5a2a; }
    .po-export-btn:disabled { background:#c0c0c0; cursor:not-allowed; }
    .po-history-btn { width:100%; padding:0.55rem; background:#f2ede4; color:#5a4030; border:1.5px solid #d8d2c4; border-radius:6px; font-family:'Inter',sans-serif; font-size:0.78rem; font-weight:600; cursor:pointer; transition:all 0.15s; margin-top:0.25rem; }
    .po-history-btn:hover { background:#e8e2d8; border-color:#c0b8a8; }
    .po-ocr-status { font-size:0.68rem; color:#8b7050; background:#f7f5f0; border:1px solid #e8e2d8; border-radius:4px; padding:0.3rem 0.5rem; display:flex; align-items:center; gap:0.4rem; }