:root{--primary: #007bff;--primary-hover: #0056b3;--success: #28a745;--success-hover: #218838;--warning: #ff9800;--warning-dark: #e65100;--danger: #dc3545;--danger-hover: #c82333;--purple: #6f42c1;--purple-hover: #5a32a3;--bg: #f5f5f5;--bg-white: #ffffff;--bg-light: #e9ecef;--bg-warning-light: #fff3e0;--bg-diff: #fff8e1;--text-dark: #333;--text-medium: #666;--text-light: #999;--border: #ddd;--border-light: #e9ecef;--radius: 6px;--radius-lg: 12px;--shadow: 0 2px 8px rgba(0, 0, 0, .1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--bg);color:var(--text-dark);line-height:1.6}.container{max-width:900px;margin:0 auto;padding:2rem}h1{text-align:center;margin-bottom:.5rem;font-size:1.8rem}.app-header{text-align:center;margin-bottom:2rem}.tab-nav{display:flex;justify-content:center;gap:0;margin-top:.75rem;border-bottom:2px solid var(--border-light)}.tab-btn{padding:.6rem 1.5rem;border:none;background:none;font-size:.95rem;font-weight:600;color:var(--text-light);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;transition:color .2s,border-color .2s}.tab-btn:hover{color:var(--text-dark)}.tab-btn.active{color:var(--primary);border-bottom-color:var(--primary)}.btn{display:inline-block;padding:.75rem 1.5rem;border:none;border-radius:var(--radius);font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s,opacity .2s;color:#fff}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--primary)}.btn-primary:hover:not(:disabled){background-color:var(--primary-hover)}.btn-success{background-color:var(--success)}.btn-success:hover:not(:disabled){background-color:var(--success-hover)}.btn-warning{background-color:var(--warning-dark);color:#fff}.btn-warning:hover:not(:disabled){background-color:#bf360c}.btn-purple{background-color:var(--purple)}.btn-purple:hover:not(:disabled){background-color:var(--purple-hover)}.btn-danger{background-color:var(--danger)}.btn-danger:hover:not(:disabled){background-color:var(--danger-hover)}.btn-sm{padding:.35rem .75rem;font-size:.85rem}.upload-area{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:3rem;text-align:center;cursor:pointer;transition:all .3s;background:var(--bg-white)}.upload-area:hover,.upload-area.dragover{border-color:var(--primary);background-color:#f0f8ff}.upload-area p{margin:.5rem 0;color:var(--text-medium)}.upload-area .upload-icon{font-size:3rem;margin-bottom:.5rem}.upload-area .upload-hint{font-size:.85rem;color:var(--text-light)}.preview-section{margin:1.5rem 0;padding:1.5rem;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow)}.preview-section img{max-width:100%;max-height:400px;border-radius:var(--radius);display:block;margin:0 auto}.pdf-preview{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-light);border-radius:var(--radius)}.pdf-icon{font-size:2.5rem}.button-group{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}.loading-overlay{text-align:center;padding:2rem;margin:1.5rem 0;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow)}.spinner{display:inline-block;width:40px;height:40px;border:4px solid var(--bg-light);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-overlay p{margin-top:1rem;color:var(--text-medium);font-weight:500}.results-section{margin:1.5rem 0;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.results-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border-light);display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.results-header h3{margin:0}.results-body{padding:1.5rem}.badge{display:inline-block;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600}.badge-success{background-color:#d4edda;color:#155724}.badge-warning{background-color:#fff3cd;color:#856404}.badge-info{background-color:#d1ecf1;color:#0c5460}.badge-danger{background-color:#f8d7da;color:#721c24}.badge-purple{background-color:#e8daef;color:#4a235a}.ocr-item{display:flex;justify-content:space-between;align-items:flex-start;padding:.5rem 0;border-bottom:1px solid var(--border-light);gap:1rem}.ocr-item:last-child{border-bottom:none}.ocr-text{flex:1;word-break:break-all}.ocr-confidence{font-size:.85rem;color:var(--text-light);white-space:nowrap}.page-divider{margin:1rem 0;padding:.5rem 1rem;background:var(--bg-light);border-radius:var(--radius);font-weight:600;font-size:.9rem}.diff-section{margin-top:1rem;padding:1rem;background:var(--bg-diff);border:1px solid #ffe082;border-radius:var(--radius)}.diff-section h4{margin-bottom:.75rem}.diff-item{margin-bottom:.75rem;padding:.75rem;background:var(--bg-white);border-radius:var(--radius)}.diff-item .diff-label{font-weight:600;font-size:.85rem;margin-bottom:.25rem;color:var(--text-medium)}.diff-attempt{font-family:monospace;font-size:.9rem;padding:.25rem 0}.diff-attempt .attempt-tag{display:inline-block;padding:.1rem .4rem;border-radius:3px;font-size:.75rem;font-weight:600;background:var(--bg-light);margin-right:.5rem}.invoice-section{margin-bottom:1.5rem}.invoice-section h4{padding-bottom:.5rem;border-bottom:2px solid var(--border-light);margin-bottom:.75rem;color:var(--text-dark)}.invoice-field{display:flex;padding:.4rem 0;border-bottom:1px solid var(--border-light)}.invoice-field:last-child{border-bottom:none}.invoice-field .field-label{font-weight:600;min-width:140px;color:var(--text-medium);font-size:.9rem}.invoice-field .field-value{flex:1}.invoice-items-table{width:100%;border-collapse:collapse;margin-top:.5rem;font-size:.9rem}.invoice-items-table th,.invoice-items-table td{padding:.5rem .75rem;border:1px solid var(--border-light);text-align:left}.invoice-items-table th{background:var(--bg-light);font-weight:600}.invoice-items-table td.number{text-align:right}.conflict-card{border:2px solid var(--warning);border-radius:var(--radius);margin-bottom:1rem;background:var(--bg-white);overflow:hidden}.conflict-header{padding:.75rem 1rem;background:var(--bg-warning-light);font-weight:600;display:flex;align-items:center;gap:.5rem}.conflict-header .conflict-badge{background:var(--warning);color:#fff;font-size:.75rem;padding:.15rem .5rem;border-radius:10px}.conflict-options{padding:.75rem 1rem}.conflict-option{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;margin:.25rem 0;border-radius:var(--radius);cursor:pointer;transition:background .15s}.conflict-option:hover{background:var(--bg-light)}.conflict-option.selected{background:#e3f2fd;border:1px solid #90caf9}.conflict-option input[type=radio]{accent-color:var(--warning-dark)}.conflict-option .attempt-num{display:inline-block;padding:.1rem .4rem;border-radius:3px;font-size:.75rem;font-weight:700;background:var(--bg-light);color:var(--text-medium)}.conflict-option .option-value{flex:1;font-family:monospace;font-size:.9rem}.conflict-summary{padding:1rem 1.5rem;background:var(--bg-warning-light);border-radius:var(--radius);margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center}.conflict-summary .stat{text-align:center}.conflict-summary .stat-value{font-size:1.5rem;font-weight:700}.conflict-summary .stat-label{font-size:.8rem;color:var(--text-medium)}.conflict-actions{text-align:center;margin-top:1.5rem}.invoice-conflict-section{margin:1.5rem 0;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.section-header{padding:.75rem 1rem;background:var(--bg-light);font-weight:600;display:flex;justify-content:space-between;align-items:center}.section-header .conflict-count{background:var(--warning);color:#fff;font-size:.75rem;padding:.15rem .5rem;border-radius:10px}.section-body{padding:1rem}.template-manager{margin:2rem 0;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.template-toggle{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;cursor:pointer;background:var(--bg-white);border:none;width:100%;font-size:1rem;font-weight:600;color:var(--text-dark)}.template-toggle:hover{background:var(--bg-light)}.template-toggle .toggle-icon{font-size:1.2rem;font-weight:700}.template-content{border-top:1px solid var(--border-light);padding:1.5rem}.template-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;margin-bottom:.5rem;background:var(--bg);border-radius:var(--radius);border:1px solid var(--border-light)}.template-item .template-info{flex:1}.template-item .template-name{font-weight:600}.template-item .template-meta{font-size:.8rem;color:var(--text-light);margin-top:.2rem}.template-form{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-light)}.template-form h4,.form-group{margin-bottom:1rem}.form-group label{display:block;font-weight:600;font-size:.875rem;margin-bottom:.25rem;color:var(--text-medium)}.form-group input,.form-group textarea{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem;font-family:inherit}.form-group textarea{min-height:60px;resize:vertical}.form-group .hint{font-size:.75rem;color:var(--text-light);margin-top:.2rem}.error-box{padding:1rem 1.5rem;background:#f8d7da;border:1px solid #f5c6cb;border-radius:var(--radius);color:#721c24;margin:1rem 0}.saved-path{margin-top:1rem;padding:.75rem 1rem;background:#d4edda;border-radius:var(--radius);font-size:.85rem;color:#155724;word-break:break-all}.template-info-bar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;font-size:.85rem}.field-input{flex:1;padding:.3rem .5rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.9rem;font-family:inherit}.invoice-field.low-confidence{background:#fff3e0;padding:.4rem .5rem;border-radius:var(--radius);margin:.1rem 0}.quality-issues{background:#fff3e0;border:1px solid #ffe0b2;border-radius:var(--radius);padding:1rem 1.5rem;margin-bottom:1rem}.quality-issues h4{color:#e65100;margin-bottom:.5rem}.quality-issue-item{color:#bf360c;font-size:.9rem;margin-bottom:.25rem}.missing-field{color:var(--text-light);font-style:italic}.confidence-bar{display:flex;align-items:center;gap:.5rem;padding:.75rem 0;font-size:.9rem}.invoice-items-table input{width:100%;padding:.2rem .4rem;border:1px solid var(--border-light);border-radius:3px;font-size:.85rem;font-family:inherit}.invoice-items-table input[type=number]{text-align:right;width:80px}.xero-controls{display:flex;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap}.xero-file-list{margin:1rem 0;background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.xero-file-header{padding:.75rem 1rem;background:var(--bg-light);border-bottom:1px solid var(--border-light);font-size:.85rem}.xero-select-all{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-weight:500}.xero-file-table{width:100%;border-collapse:collapse;font-size:.875rem}.xero-file-table th{background:var(--bg-light);padding:.5rem .75rem;text-align:left;font-weight:600;font-size:.8rem;color:var(--text-medium);border-bottom:1px solid var(--border-light)}.xero-file-table td{padding:.5rem .75rem;border-bottom:1px solid var(--border-light)}.xero-file-row:hover{background:#f8f9fa}.xero-file-row.selected{background:#e3f2fd}.xero-file-row.processing{background:#fff3e0}.xero-file-name{font-weight:500;word-break:break-all}.xero-file-size{color:var(--text-light);white-space:nowrap}.xero-file-date{color:var(--text-light);font-size:.8rem;white-space:nowrap}.xero-pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin:1rem 0}.xero-page-info{font-size:.85rem;color:var(--text-medium)}.xero-results{margin-top:1.5rem}.xero-vendor-group{margin-bottom:1.5rem}.xero-vendor-name{font-size:1rem;margin-bottom:.5rem;display:flex;align-items:center}.consensus-badge{display:inline-block;padding:.15rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;background:#e8daef;color:#4a235a;margin-left:.5rem}
