:root{--color-black: #0a0a0a;--color-gray-900: #171717;--color-gray-800: #262626;--color-gray-700: #404040;--color-gray-600: #525252;--color-gray-500: #737373;--color-gray-400: #a3a3a3;--color-gray-300: #d4d4d4;--color-gray-200: #e5e5e5;--color-gray-100: #f5f5f5;--color-gray-50: #fafafa;--color-white: #ffffff;--color-primary: var(--color-black);--color-primary-hover: var(--color-gray-800);--color-secondary: var(--color-gray-600);--color-secondary-hover: var(--color-gray-700);--color-success: #059669;--color-success-bg: #ecfdf5;--color-success-border: #a7f3d0;--color-warning: #d97706;--color-warning-bg: #fffbeb;--color-warning-border: #fde68a;--color-error: #dc2626;--color-error-bg: #fef2f2;--color-error-border: #fecaca;--color-info: #2563eb;--color-info-bg: #eff6ff;--color-info-border: #bfdbfe;--bg-primary: var(--color-white);--bg-secondary: var(--color-gray-50);--bg-tertiary: var(--color-gray-100);--bg-dark: var(--color-black);--text-primary: var(--color-gray-900);--text-secondary: var(--color-gray-600);--text-tertiary: var(--color-gray-500);--text-muted: var(--color-gray-400);--text-inverse: var(--color-white);--border-primary: var(--color-gray-200);--border-secondary: var(--color-gray-300);--border-dark: var(--color-gray-800);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-2xl: 16px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--font-sans: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;--font-mono: "SF Mono", "Roboto Mono", Consolas, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--header-height: 64px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;color:var(--text-primary);background-color:var(--bg-secondary);min-height:100vh}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit;font-size:inherit}.font-mono{font-family:var(--font-mono)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:var(--color-gray-300);border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:var(--color-gray-400)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}.order-page{padding:0}.order-page .table-wrapper{background:var(--bg-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);overflow:hidden}.order-page .table-container{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--color-gray-300) transparent}.order-page table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--text-sm);white-space:nowrap}.order-page th,.order-page td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-primary);text-align:left;color:var(--text-primary)}.order-page th{background-color:var(--bg-secondary);font-weight:var(--font-semibold);color:var(--text-secondary);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.05em;position:sticky;top:0;z-index:10;border-bottom:2px solid var(--border-primary)}.sticky-col{position:sticky;background-color:var(--bg-primary);z-index:20;box-shadow:2px 0 4px -2px #0000000d}th.sticky-col{z-index:30;background-color:var(--bg-secondary)}.first-col{left:0}.second-col{left:100px}tbody tr{transition:background-color var(--transition-fast)}tbody tr:hover,tbody tr:hover .sticky-col{background-color:var(--bg-tertiary)}.order-page .font-mono{font-family:var(--font-mono);color:var(--text-secondary);font-size:var(--text-xs)}.font-bold{font-weight:var(--font-semibold)}.text-right{text-align:right}.text-center{text-align:center}.product-name{max-width:180px;overflow:hidden;text-overflow:ellipsis;font-weight:var(--font-medium)}.option-text,.address-text,.message-text{max-width:140px;overflow:hidden;text-overflow:ellipsis;color:var(--text-secondary)}.sub-text{display:block;font-size:var(--text-xs);color:var(--text-tertiary);margin-top:2px}.tracking-info{font-size:var(--text-xs);line-height:1.4}.status-badge{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-medium);display:inline-block}.status-green{background-color:var(--color-success-bg);color:var(--color-success)}.status-blue{background-color:var(--color-info-bg);color:var(--color-info)}.status-red{background-color:var(--color-error-bg);color:var(--color-error)}.status-yellow{background-color:var(--color-warning-bg);color:var(--color-warning)}.status-gray{background-color:var(--bg-tertiary);color:var(--text-secondary)}.cursor-pointer{cursor:pointer}.bg-slate-50{background-color:var(--bg-secondary)}.text-slate-400{color:var(--text-muted)}.text-slate-500{color:var(--text-tertiary)}.expanded-row td{background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-4) var(--space-4) var(--space-4)!important}.variant-table-wrapper{background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border-primary);overflow:hidden;margin-top:var(--space-2);box-shadow:var(--shadow-xs)}.variant-table{width:100%;border-collapse:collapse}.variant-table th{background-color:var(--bg-tertiary);font-size:var(--text-xs);text-transform:uppercase;color:var(--text-secondary);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-primary);top:auto}.variant-table td{padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--text-primary);border-bottom:1px solid var(--border-primary)}.variant-table tr:last-child td{border-bottom:none}.w-10{width:40px}.p-0{padding:0!important}.p-4{padding:var(--space-4)}.text-sm{font-size:var(--text-sm)}.order-page .loading-state,.order-page .error-state{display:flex;justify-content:center;align-items:center;height:400px;font-size:var(--text-base);color:var(--text-secondary)}.settings-page{max-width:900px;margin:0 auto}.settings-section{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);margin-bottom:var(--space-6)}.settings-section h2{font-size:var(--text-lg);font-weight:var(--font-semibold);margin:0 0 var(--space-2) 0;color:var(--text-primary)}.section-desc{color:var(--text-secondary);font-size:var(--text-sm);margin:0 0 var(--space-6) 0}.usage-guide{background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-6)}.usage-guide-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-primary);margin-bottom:var(--space-4)}.usage-guide-title svg{color:var(--color-primary)}.usage-steps{display:flex;flex-direction:column;gap:var(--space-3);margin:0;padding:0;list-style:none}.usage-step{display:flex;align-items:flex-start;gap:var(--space-3)}.step-number{display:flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;background:var(--color-primary);color:var(--text-inverse);border-radius:50%;font-size:var(--text-xs);font-weight:var(--font-bold)}.step-content{flex:1;padding-top:2px}.step-title{font-weight:var(--font-medium);color:var(--text-primary);font-size:var(--text-sm);margin-bottom:var(--space-1)}.step-desc{color:var(--text-secondary);font-size:var(--text-xs);line-height:1.5}.warning-box{display:flex;align-items:flex-start;gap:var(--space-3);background:var(--color-warning-bg);border:1px solid var(--color-warning-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-top:var(--space-4)}.warning-box svg{color:var(--color-warning);flex-shrink:0;margin-top:2px}.warning-box p{color:var(--color-warning);font-size:var(--text-sm);font-weight:var(--font-medium);margin:0}.sync-cards{display:flex;flex-direction:column;gap:var(--space-4)}.sync-card{display:flex;align-items:center;padding:var(--space-5);background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border-primary);transition:all var(--transition-fast)}.sync-card:hover{border-color:var(--border-secondary);box-shadow:var(--shadow-sm)}.card-step{display:flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;background:var(--bg-tertiary);border-radius:var(--radius-lg);margin-right:var(--space-4);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-secondary)}.sync-card.step-1 .card-step{background:var(--color-primary);color:var(--text-inverse)}.sync-card.step-2 .card-step{background:var(--color-gray-700);color:var(--text-inverse)}.sync-card.step-3 .card-step{background:var(--color-gray-500);color:var(--text-inverse)}.card-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;border-radius:var(--radius-lg);margin-right:var(--space-4)}.order-icon,.product-icon,.supplier-icon{background:var(--bg-tertiary);color:var(--text-primary)}.card-content{flex:1;min-width:0}.card-content h3{margin:0 0 var(--space-1) 0;font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--text-primary)}.card-content p{margin:0;font-size:var(--text-sm);color:var(--text-secondary)}.card-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--color-warning-bg);color:var(--color-warning);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-medium);margin-top:var(--space-2)}.sync-action-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-primary);color:var(--text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-medium);white-space:nowrap;transition:all var(--transition-fast)}.sync-action-btn:hover:not(:disabled){background:var(--color-primary-hover)}.sync-action-btn:disabled{background:var(--color-gray-400);cursor:not-allowed}.sync-divider{display:flex;align-items:center;justify-content:center;padding:var(--space-2) 0;color:var(--text-muted)}.shipping-review-container{max-width:1600px;margin:0 auto}.filter-section{background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);padding:var(--space-4);margin-bottom:var(--space-4)}.filter-row{display:flex;gap:var(--space-4);align-items:flex-end;flex-wrap:wrap}.filter-group{display:flex;flex-direction:column;gap:var(--space-1)}.filter-group label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-secondary)}.filter-group input,.filter-group select{padding:var(--space-2) var(--space-3);border:1px solid var(--border-primary);border-radius:var(--radius-md);font-size:var(--text-sm);min-width:150px;background:var(--bg-primary);color:var(--text-primary)}.filter-group input:focus,.filter-group select:focus{outline:none;border-color:var(--border-secondary)}.filter-actions{display:flex;gap:var(--space-2)}.filter-btn{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);border:none}.filter-btn.apply{background:var(--color-primary);color:var(--text-inverse)}.filter-btn.apply:hover{background:var(--color-primary-hover)}.filter-btn.reset{background:var(--bg-tertiary);color:var(--text-primary)}.filter-btn.reset:hover{background:var(--color-gray-200)}.mismatch-list{background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);overflow:hidden}.mismatch-header{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr 1fr 50px;padding:var(--space-4);background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.mismatch-header-extended{grid-template-columns:180px 100px 2fr 2fr 100px 100px 100px 50px}.mismatch-row{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr 1fr 50px;padding:var(--space-4);border-bottom:1px solid var(--border-primary);cursor:pointer;transition:background-color var(--transition-fast);align-items:center;font-size:var(--text-sm)}.mismatch-row-extended{grid-template-columns:180px 100px 2fr 2fr 100px 100px 100px 50px}.mismatch-row:hover{background-color:var(--bg-tertiary)}.mismatch-row-container.expanded .mismatch-row{background-color:var(--bg-secondary)}.order-id-cell{display:flex;align-items:center}.order-id-link{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--text-primary);cursor:pointer;font-weight:var(--font-medium);font-family:var(--font-mono);font-size:var(--text-xs);transition:color var(--transition-fast)}.order-id-link:hover{color:var(--color-gray-600);text-decoration:underline}.external-link-icon{opacity:.5;transition:opacity var(--transition-fast)}.order-id-link:hover .external-link-icon{opacity:1}.address-cell,.products-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm);color:var(--text-secondary)}.difference{color:var(--color-error);font-weight:var(--font-semibold)}.mismatch-details{padding:var(--space-6);background:var(--bg-secondary);border-bottom:1px solid var(--border-primary)}.details-header{margin-bottom:var(--space-4);font-weight:var(--font-medium);font-size:var(--text-sm);color:var(--text-secondary)}.details-loading{padding:var(--space-4);text-align:center;color:var(--text-secondary);font-size:var(--text-sm)}.details-table{width:100%;border-collapse:collapse;margin-bottom:var(--space-6);background:var(--bg-primary);border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border-primary)}.details-table th,.details-table td{padding:var(--space-3);text-align:left;border-bottom:1px solid var(--border-primary)}.details-table th{background:var(--bg-tertiary);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--text-secondary)}.details-table td{font-size:var(--text-sm);color:var(--text-primary)}.details-summary{display:flex;flex-direction:column;gap:var(--space-2);align-items:flex-end}.summary-row{display:flex;gap:var(--space-4);font-size:var(--text-sm)}.api-fee{color:var(--text-primary);font-weight:var(--font-semibold)}.adjustment-section{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4);padding:var(--space-4);background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border-primary)}.actual-fee-input{display:flex;align-items:center;gap:var(--space-3)}.actual-fee-input label{font-weight:var(--font-medium);font-size:var(--text-sm);min-width:80px;color:var(--text-primary)}.actual-fee-input input{padding:var(--space-2) var(--space-3);border:1px solid var(--border-primary);border-radius:var(--radius-md);width:120px;font-size:var(--text-base);background:var(--bg-primary);color:var(--text-primary)}.actual-fee-input input:focus{outline:none;border-color:var(--border-secondary)}.adjustment-preview{color:var(--text-tertiary);font-size:var(--text-sm)}.adjustment-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.match-api-btn,.match-api-save-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);border:none}.match-api-btn{background:var(--color-gray-200);color:var(--text-primary)}.match-api-btn:hover{background:var(--color-gray-300)}.match-api-save-btn{background:var(--color-primary);color:var(--text-inverse)}.match-api-save-btn:hover{background:var(--color-primary-hover)}.save-btn,.verify-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);border:none}.save-btn{background:var(--color-primary);color:var(--text-inverse)}.save-btn:hover:not(:disabled){background:var(--color-primary-hover)}.save-btn:disabled,.match-api-save-btn:disabled{background:var(--color-gray-400);cursor:not-allowed}.verify-btn{background:var(--color-success);color:var(--text-inverse);margin-top:var(--space-2)}.verify-btn:hover{background:#047857}.actions{margin-top:var(--space-4)}.empty-state{padding:var(--space-12);text-align:center;color:var(--text-secondary)}.three-pane-layout{display:flex;height:calc(100vh - 60px);gap:1px;background-color:#e0e0e0}.pane{display:flex;flex-direction:column;background-color:#fff;overflow:hidden}.pane-left{flex:0 0 200px;min-width:150px}.pane-center{flex:0 0 250px;min-width:180px}.pane-right{flex:1;min-width:400px}.pane-header{padding:12px 16px;font-weight:600;border-bottom:1px solid #e0e0e0;background-color:#f5f5f5}.pane-content{flex:1;overflow-y:auto}.selectable-list{display:flex;flex-direction:column;height:100%}.selectable-list-search{padding:8px;border-bottom:1px solid #e0e0e0}.selectable-list-search input{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;font-size:14px;box-sizing:border-box}.selectable-list-search input:focus{outline:none;border-color:#1976d2}.selectable-list-items{flex:1;overflow-y:auto}.selectable-list-item{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;cursor:pointer;border-bottom:1px solid #f0f0f0}.selectable-list-item:hover{background-color:#f5f5f5}.selectable-list-item.selected{background-color:#e3f2fd;font-weight:500}.item-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-count{flex-shrink:0;margin-left:8px;padding:2px 8px;background-color:#e0e0e0;border-radius:12px;font-size:12px;color:#666}.selectable-list-item.selected .item-count{background-color:#1976d2;color:#fff}.selectable-list-empty{padding:20px;text-align:center;color:#999}.selectable-list-loading{padding:20px;text-align:center;color:#666}.fee-rule-page{display:flex;flex-direction:column;height:calc(100vh - 60px);padding:var(--space-4);box-sizing:border-box}.fee-rule-page .page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);flex-shrink:0}.fee-rule-page .page-title{font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--text-primary);margin:0}.fee-rule-page .three-pane-layout{flex:1;min-height:0}.empty-pane,.loading-pane{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-tertiary);font-size:var(--text-sm)}.rule-list-pane{display:flex;flex-direction:column;height:100%}.rule-list-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-primary);background:var(--bg-secondary)}.breadcrumb{font-size:var(--text-sm);color:var(--text-secondary)}.rule-table-header{display:grid;grid-template-columns:80px 140px 90px 100px 70px 180px 70px;padding:var(--space-3) var(--space-4);background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-xs);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.header-actions{display:flex;gap:var(--space-3)}.filter-select{padding:var(--space-2) var(--space-4);border:1px solid var(--border-primary);border-radius:var(--radius-md);background:var(--bg-primary);font-size:var(--text-sm);color:var(--text-primary)}.filter-select:focus{outline:none;border-color:var(--border-secondary)}.btn-add,.btn-apply{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;border:none;transition:all var(--transition-fast)}.btn-add{background:var(--color-primary);color:var(--text-inverse)}.btn-apply{background:var(--color-success);color:var(--text-inverse)}.btn-apply:hover{background:#047857}.rule-list{flex:1;background:var(--bg-primary);overflow-y:auto}.rule-header,.rule-row{display:grid;grid-template-columns:80px 140px 90px 100px 70px 180px 70px;padding:var(--space-3) var(--space-4);align-items:center}.rule-header{background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.rule-row{border-bottom:1px solid var(--border-primary);font-size:var(--text-sm);transition:background-color var(--transition-fast)}.rule-row:hover{background:var(--bg-tertiary)}.rule-row:last-child{border-bottom:none}.badge-variant{background:var(--color-info-bg);color:var(--color-info)}.badge-product{background:var(--color-warning-bg);color:var(--color-warning)}.badge-supplier{background:var(--color-success-bg);color:var(--color-success)}.mono{font-family:var(--font-mono);font-size:var(--text-xs)}.fee-value{font-weight:var(--font-semibold);color:var(--text-primary)}.date-range{font-size:var(--text-xs);color:var(--text-tertiary)}.actions{display:flex;gap:var(--space-2)}.btn-danger:hover{background:var(--color-error-bg);color:var(--color-error)}.modal.modal-lg{min-width:600px;max-width:700px;max-height:90vh;overflow-y:auto}.modal h2{margin:0 0 var(--space-4);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary)}.modal-desc{color:var(--text-secondary);font-size:var(--text-sm);margin-bottom:var(--space-4)}.form-section{margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-primary)}.form-section:last-of-type{border-bottom:none}.product-select-list{max-height:160px}.checkbox-item.selected-product{background:var(--bg-tertiary);border-color:var(--color-primary)}.radio{width:18px;height:18px;border:2px solid var(--border-secondary);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.radio.checked{background:var(--color-primary);border-color:var(--color-primary);color:var(--text-inverse)}.loading-variants{padding:var(--space-4);text-align:center;color:var(--text-tertiary);font-size:var(--text-sm)}.empty-variants{padding:var(--space-4);text-align:center;color:var(--text-muted);font-size:var(--text-sm)}.shipping-rule-page{display:flex;flex-direction:column;height:calc(100vh - 60px);padding:var(--space-4);box-sizing:border-box}.shipping-rule-page .page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);flex-shrink:0}.shipping-rule-page .page-title{font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--text-primary);margin:0}.shipping-rule-page .three-pane-layout{flex:1;min-height:0}.shipping-rule-page .empty-pane,.shipping-rule-page .loading-pane{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-tertiary);font-size:var(--text-sm)}.shipping-rule-page .rule-list-pane{display:flex;flex-direction:column;height:100%}.shipping-rule-page .rule-list-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-primary);background:var(--bg-secondary)}.shipping-rule-page .breadcrumb{font-size:var(--text-sm);color:var(--text-secondary)}.shipping-rule-page .rule-table-header{display:grid;grid-template-columns:70px 120px 60px 90px 90px 80px 90px 120px 70px;padding:var(--space-3) var(--space-4);background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-xs);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.shipping-rule-page .rule-header,.shipping-rule-page .rule-row{display:grid;grid-template-columns:70px 120px 60px 90px 90px 80px 90px 120px 70px;padding:var(--space-3) var(--space-4);align-items:center}.shipping-rule-page .rule-header{background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.shipping-rule-page .rule-row{border-bottom:1px solid var(--border-primary);font-size:var(--text-sm);transition:background-color var(--transition-fast)}.shipping-rule-page .rule-row:hover{background:var(--bg-tertiary)}.shipping-rule-page .rule-row:last-child{border-bottom:none}.shipping-rule-page .rule-list{flex:1;background:var(--bg-primary);overflow-y:auto}.help-text{display:block;margin-top:var(--space-1);font-size:var(--text-xs);color:var(--text-muted)}.shipping-rule-page .header-actions{display:flex;gap:var(--space-3)}.shipping-rule-page .filter-select{padding:var(--space-2) var(--space-4);border:1px solid var(--border-primary);border-radius:var(--radius-md);background:var(--bg-primary);font-size:var(--text-sm);color:var(--text-primary)}.shipping-rule-page .filter-select:focus{outline:none;border-color:var(--border-secondary)}.shipping-rule-page .btn-add{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;border:none;transition:all var(--transition-fast);background:var(--color-primary);color:var(--text-inverse)}.shipping-rule-page .btn-add:hover{background:var(--color-primary-hover)}.shipping-rule-page .badge{display:inline-block;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-medium)}.shipping-rule-page .badge-variant{background:var(--color-info-bg);color:var(--color-info)}.shipping-rule-page .badge-product{background:var(--color-warning-bg);color:var(--color-warning)}.shipping-rule-page .mono{font-family:var(--font-mono);font-size:var(--text-xs)}.shipping-rule-page .fee-value{font-weight:var(--font-semibold);color:var(--text-primary)}.shipping-rule-page .date-range{font-size:var(--text-xs);color:var(--text-tertiary)}.shipping-rule-page .actions{display:flex;gap:var(--space-2)}.shipping-rule-page .btn-icon{padding:var(--space-2);border-radius:var(--radius-md);border:none;background:transparent;cursor:pointer;color:var(--text-tertiary);transition:all var(--transition-fast)}.shipping-rule-page .btn-icon:hover{background:var(--bg-tertiary);color:var(--text-primary)}.shipping-rule-page .btn-danger:hover{background:var(--color-error-bg);color:var(--color-error)}.shipping-rule-page .empty-state,.shipping-rule-page .loading{padding:var(--space-12);text-align:center;color:var(--text-secondary)}.shipping-rule-page .modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.shipping-rule-page .modal{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--space-6);min-width:400px;max-width:500px}.shipping-rule-page .modal.modal-lg{min-width:600px;max-width:700px;max-height:90vh;overflow-y:auto}.shipping-rule-page .modal h2{margin:0 0 var(--space-4);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary)}.shipping-rule-page .form-row{margin-bottom:var(--space-4)}.shipping-rule-page .form-row label{display:block;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-primary);margin-bottom:var(--space-1)}.shipping-rule-page .form-row input,.shipping-rule-page .form-row select{width:100%;padding:var(--space-2) var(--space-3);border:1px solid var(--border-primary);border-radius:var(--radius-md);font-size:var(--text-sm);box-sizing:border-box;background:var(--bg-primary);color:var(--text-primary)}.shipping-rule-page .form-row input:focus,.shipping-rule-page .form-row select:focus{outline:none;border-color:var(--border-secondary)}.shipping-rule-page .form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.shipping-rule-page .form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-6)}.shipping-rule-page .btn-cancel,.shipping-rule-page .btn-submit{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast)}.shipping-rule-page .btn-cancel{background:var(--bg-tertiary);border:1px solid var(--border-primary);color:var(--text-primary)}.shipping-rule-page .btn-cancel:hover{background:var(--color-gray-200)}.shipping-rule-page .btn-submit{background:var(--color-primary);border:none;color:var(--text-inverse)}.shipping-rule-page .btn-submit:hover{background:var(--color-primary-hover)}.shipping-rule-page .btn-submit:disabled,.shipping-rule-page .btn-cancel:disabled{opacity:.6;cursor:not-allowed}.shipping-rule-page .form-section{margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-primary)}.shipping-rule-page .form-section:last-of-type{border-bottom:none}.shipping-rule-page .search-input{margin-bottom:var(--space-2)}.shipping-rule-page .checkbox-list{max-height:240px;overflow-y:auto;border:1px solid var(--border-primary);border-radius:var(--radius-md);background:var(--bg-secondary)}.shipping-rule-page .checkbox-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);cursor:pointer;border-bottom:1px solid var(--border-primary);transition:background var(--transition-fast)}.shipping-rule-page .checkbox-item:last-child{border-bottom:none}.shipping-rule-page .checkbox-item:hover{background:var(--bg-tertiary)}.shipping-rule-page .checkbox-item.checkbox-all{background:var(--bg-tertiary);font-weight:var(--font-medium);position:sticky;top:0}.shipping-rule-page .checkbox{width:18px;height:18px;border:2px solid var(--border-secondary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.shipping-rule-page .checkbox.checked{background:var(--color-primary);border-color:var(--color-primary);color:var(--text-inverse)}.shipping-rule-page .item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm)}.shipping-rule-page .item-code{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}.shipping-rule-page .select-all-label{color:var(--text-primary);font-size:var(--text-sm)}.shipping-rule-page .selected-count{margin-left:var(--space-2);font-size:var(--text-xs);color:var(--color-primary);font-weight:var(--font-medium)}.shipping-rule-page .product-select-list{max-height:160px}.shipping-rule-page .checkbox-item.selected-product{background:var(--bg-tertiary);border-color:var(--color-primary)}.shipping-rule-page .radio{width:18px;height:18px;border:2px solid var(--border-secondary);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.shipping-rule-page .radio.checked{background:var(--color-primary);border-color:var(--color-primary);color:var(--text-inverse)}.shipping-rule-page .loading-variants{padding:var(--space-4);text-align:center;color:var(--text-tertiary);font-size:var(--text-sm)}.shipping-rule-page .empty-variants{padding:var(--space-4);text-align:center;color:var(--text-muted);font-size:var(--text-sm)}.settlement-container{max-width:1600px;margin:0 auto}.settlement-container .page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6)}.settlement-container .page-title{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);margin:0}.btn-add{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-primary);color:var(--text-inverse);border:none;border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast)}.btn-add:hover{background:var(--color-primary-hover)}.settlement-list{background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);overflow:hidden;margin-bottom:var(--space-6)}.list-header,.list-row{display:grid;grid-template-columns:100px 200px 80px 140px 140px 160px 40px;padding:var(--space-4);align-items:center}.list-header{background:var(--bg-secondary);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--text-secondary);border-bottom:1px solid var(--border-primary)}.list-row{border-bottom:1px solid var(--border-primary);cursor:pointer;transition:background var(--transition-fast);font-size:var(--text-sm)}.list-row:hover{background:var(--bg-tertiary)}.list-row.selected{background:var(--bg-secondary);border-left:3px solid var(--color-primary)}.badge{display:inline-block;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-medium)}.badge-coffee{background:var(--color-warning-bg);color:var(--color-warning)}.badge-machine{background:var(--color-info-bg);color:var(--color-info)}.status-badge{display:inline-block;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-medium)}.status-draft{background:var(--bg-tertiary);color:var(--text-secondary)}.status-confirmed{background:var(--color-success-bg);color:var(--color-success)}.status-exported{background:var(--color-info-bg);color:var(--color-info)}.date-range{font-size:var(--text-sm);color:var(--text-tertiary)}.total-amount{font-weight:var(--font-semibold);color:var(--color-success)}.chevron{color:var(--text-muted)}.empty-state,.loading{padding:var(--space-12);text-align:center;color:var(--text-secondary)}.detail-panel{background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);padding:var(--space-6)}.detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6)}.detail-header h2{margin:0;font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary)}.detail-actions{display:flex;gap:var(--space-2)}.btn-calc,.btn-confirm,.btn-export{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;border:none;transition:all var(--transition-fast)}.btn-calc{background:var(--bg-tertiary);color:var(--text-primary)}.btn-calc:hover{background:var(--color-gray-200)}.btn-confirm{background:var(--color-success);color:var(--text-inverse)}.btn-confirm:hover{background:#047857}.btn-export{background:var(--color-primary);color:var(--text-inverse)}.btn-export:hover{background:var(--color-primary-hover)}.btn-calc:disabled,.btn-confirm:disabled,.btn-export:disabled{opacity:.6;cursor:not-allowed}.detail-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}.summary-card{padding:var(--space-4);background:var(--bg-secondary);border-radius:var(--radius-lg);display:flex;flex-direction:column;gap:var(--space-1)}.summary-card .label{font-size:var(--text-xs);color:var(--text-tertiary)}.summary-card .value{font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary)}.summary-card.highlight{background:var(--color-success-bg)}.summary-card.highlight .value{color:var(--color-success)}.items-table-wrapper{overflow-x:auto}.items-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.items-table th,.items-table td{padding:var(--space-3);text-align:left;border-bottom:1px solid var(--border-primary)}.items-table th{background:var(--bg-secondary);font-weight:var(--font-semibold);color:var(--text-secondary)}.items-table .product-name{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.items-table .has-adj{color:var(--color-warning);font-weight:var(--font-medium)}.items-table .final-amount{font-weight:var(--font-semibold);color:var(--color-success)}.btn-icon{padding:var(--space-2);border-radius:var(--radius-md);border:none;background:transparent;cursor:pointer;color:var(--text-tertiary);transition:all var(--transition-fast)}.btn-icon:hover{background:var(--bg-tertiary);color:var(--text-primary)}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--space-6);min-width:400px;max-width:500px}.modal.modal-lg{min-width:550px;max-width:650px;max-height:90vh;overflow-y:auto}.modal.modal-wide{min-width:500px;max-width:600px}.modal h2{margin:0 0 var(--space-2);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary)}.modal-subtitle{color:var(--text-secondary);font-size:var(--text-sm);margin:0 0 var(--space-4)}.form-row{margin-bottom:var(--space-4)}.form-row label{display:block;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-primary);margin-bottom:var(--space-1)}.form-row input,.form-row select{width:100%;padding:var(--space-2) var(--space-3);border:1px solid var(--border-primary);border-radius:var(--radius-md);font-size:var(--text-sm);box-sizing:border-box;background:var(--bg-primary);color:var(--text-primary)}.form-row input:focus,.form-row select:focus{outline:none;border-color:var(--border-secondary)}.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-6)}.btn-cancel,.btn-submit{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:var(--font-medium);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast)}.btn-cancel{background:var(--bg-tertiary);border:1px solid var(--border-primary);color:var(--text-primary)}.btn-cancel:hover{background:var(--color-gray-200)}.btn-submit{background:var(--color-primary);border:none;color:var(--text-inverse)}.btn-submit:hover{background:var(--color-primary-hover)}.btn-submit:disabled,.btn-cancel:disabled{opacity:.6;cursor:not-allowed}.search-input{margin-bottom:var(--space-2)}.checkbox-list{max-height:240px;overflow-y:auto;border:1px solid var(--border-primary);border-radius:var(--radius-md);background:var(--bg-secondary)}.checkbox-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);cursor:pointer;border-bottom:1px solid var(--border-primary);transition:background var(--transition-fast)}.checkbox-item:last-child{border-bottom:none}.checkbox-item:hover{background:var(--bg-tertiary)}.checkbox-item.checkbox-all{background:var(--bg-tertiary);font-weight:var(--font-medium);position:sticky;top:0}.checkbox{width:18px;height:18px;border:2px solid var(--border-secondary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.checkbox.checked{background:var(--color-primary);border-color:var(--color-primary);color:var(--text-inverse)}.item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm)}.item-code{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}.select-all-label{color:var(--text-primary);font-size:var(--text-sm)}.selected-count{margin-left:var(--space-2);font-size:var(--text-xs);color:var(--color-primary);font-weight:var(--font-medium)}.empty-list{padding:var(--space-6);text-align:center;color:var(--text-muted)}.filter-row{display:flex;gap:var(--space-3);align-items:center;margin-bottom:var(--space-2)}.filter-row .search-input{flex:1;margin-bottom:0}.filter-toggle{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;white-space:nowrap}.filter-toggle input{width:auto}.item-category{font-size:var(--text-xs);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-weight:var(--font-medium)}.cat-coffee{background:var(--color-warning-bg);color:var(--color-warning)}.cat-machine{background:var(--color-info-bg);color:var(--color-info)}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100%;background-color:var(--color-black)}.login-box{background-color:var(--color-gray-900);padding:var(--space-10);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:100%;max-width:400px;margin:var(--space-4);border:1px solid var(--color-gray-800)}.login-box h1{text-align:center;margin:0 0 var(--space-2) 0;font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--color-white)}.login-subtitle{text-align:center;color:var(--color-gray-500);margin:0 0 var(--space-8) 0;font-size:var(--text-sm)}.login-form{display:flex;flex-direction:column;gap:var(--space-5)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{font-size:var(--text-sm);color:var(--color-gray-400);font-weight:var(--font-medium)}.form-group input{padding:var(--space-3) var(--space-4);border:1px solid var(--color-gray-700);border-radius:var(--radius-md);background-color:var(--color-gray-800);color:var(--color-white);font-size:var(--text-base);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.form-group input:focus{outline:none;border-color:var(--color-gray-500);box-shadow:0 0 0 3px #ffffff1a}.form-group input::placeholder{color:var(--color-gray-600)}.error-message{background-color:var(--color-error-bg);border:1px solid var(--color-error-border);color:var(--color-error);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);text-align:center}.login-button{padding:var(--space-3) var(--space-6);background-color:var(--color-white);color:var(--color-black);border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast);margin-top:var(--space-2)}.login-button:hover:not(:disabled){background-color:var(--color-gray-200)}.login-button:active:not(:disabled){transform:scale(.98)}.login-button:disabled{background-color:var(--color-gray-600);color:var(--color-gray-400);cursor:not-allowed}.header-container{display:flex;justify-content:space-between;align-items:center;height:var(--header-height);padding:0 var(--space-8);background:var(--bg-primary);border-bottom:1px solid var(--border-primary);position:sticky;top:0;z-index:100}.header-nav{display:flex;align-items:center;gap:var(--space-1);flex-shrink:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.header-nav::-webkit-scrollbar{display:none}.nav-link{display:inline-flex;align-items:center;padding:var(--space-2) var(--space-3);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);white-space:nowrap;border-radius:var(--radius-md);transition:all var(--transition-fast)}.nav-link:hover,.nav-link.active{color:var(--text-primary);background-color:var(--bg-tertiary)}.header-actions{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0;margin-left:var(--space-4)}.sync-status{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--text-tertiary);white-space:nowrap}.sync-status svg{color:var(--color-success)}.sync-button{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background-color:var(--color-primary);color:var(--text-inverse);font-size:var(--text-sm);font-weight:var(--font-medium);border:none;border-radius:var(--radius-md);white-space:nowrap;transition:all var(--transition-fast)}.sync-button:hover{background-color:var(--color-primary-hover)}.sync-button:disabled{background-color:var(--color-gray-400);cursor:not-allowed}.logout-button{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background-color:transparent;color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);border:1px solid var(--border-primary);border-radius:var(--radius-md);white-space:nowrap;transition:all var(--transition-fast)}.logout-button:hover{background-color:var(--bg-tertiary);border-color:var(--border-secondary);color:var(--text-primary)}@media(max-width:1200px){.sync-status{display:none}}@media(max-width:1024px){.header-container{padding:0 var(--space-4)}.nav-link{padding:var(--space-2)}.header-actions{gap:var(--space-2)}}#root{width:100%;min-height:100vh}.app-container{min-height:100vh;background-color:var(--bg-secondary)}.main-content{padding:var(--space-8);max-width:1400px;margin:0 auto}.welcome-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - var(--header-height) - var(--space-8) * 2);text-align:center}.welcome-card{background:var(--bg-primary);padding:var(--space-12) var(--space-10);border-radius:var(--radius-2xl);box-shadow:var(--shadow-md);border:1px solid var(--border-primary);max-width:500px;width:100%}.welcome-card h1{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);margin-bottom:var(--space-3)}.welcome-card p{font-size:var(--text-base);color:var(--text-secondary);line-height:1.6}.page-header{margin-bottom:var(--space-6)}.page-header h1{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);margin:0 0 var(--space-2) 0;line-height:1.2}.page-header .subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin:0}.page-header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-6)}.page-header-row .page-header{margin-bottom:0}.page-header-actions{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0}.loading-state,.error-state,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-12);color:var(--text-secondary);font-size:var(--text-base)}.loading-state{min-height:300px}.table-wrapper{background:var(--bg-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid var(--border-primary);overflow:hidden}.table-container{overflow-x:auto}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--space-4);margin-top:var(--space-6)}.pagination-btn{padding:var(--space-2) var(--space-4);background-color:var(--bg-primary);border:1px solid var(--border-primary);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);transition:all var(--transition-fast)}.pagination-btn:hover:not(:disabled){background-color:var(--bg-tertiary);border-color:var(--border-secondary)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed;background-color:var(--bg-tertiary)}.page-info{font-size:var(--text-sm);color:var(--text-secondary)}.page-info strong{color:var(--text-primary);font-weight:var(--font-semibold)}.btn-primary{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background-color:var(--color-primary);color:var(--text-inverse);font-size:var(--text-sm);font-weight:var(--font-medium);border:none;border-radius:var(--radius-md);transition:all var(--transition-fast)}.btn-primary:hover{background-color:var(--color-primary-hover)}.btn-primary:disabled{background-color:var(--color-gray-400);cursor:not-allowed}.btn-secondary{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background-color:var(--bg-primary);color:var(--text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);border:1px solid var(--border-primary);border-radius:var(--radius-md);transition:all var(--transition-fast)}.btn-secondary:hover{background-color:var(--bg-tertiary);border-color:var(--border-secondary)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}