<style>
    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
    body { font-family: 'Inter', sans-serif; background-color: #f8fafc; color: #334155; }
    .font-mono { font-family: 'JetBrains Mono', monospace; }
    
    
    .channel-btn { 
        transition: all 0.2s; 
        border: 1px solid #e2e8f0; /* slate-200 */
        background-color: #ffffff;
    }
    .channel-btn.active { 
        background-color: #eff6ff; /* blue-50 */
        border-color: #6366f1; /* indigo-500 */
        color: #4f46e5; /* indigo-600 */
        opacity: 1;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    }
    .channel-btn:not(.active) { 
        opacity: 0.6; 
        color: #64748b; /* slate-500 */
    }
    .channel-btn:not(.active):hover {
        background-color: #f8fafc; /* slate-50 */
        opacity: 0.9;
    }

    .checkbox-wrapper {
        transition: all 0.2s;
    }
    .checkbox-wrapper input:checked + .custom-checkbox-box { 
        background-color: #4f46e5; 
        border-color: #4f46e5; 
    }
    /* 选中状态下显示对勾 */
    .checkbox-wrapper input:checked + .custom-checkbox-box svg { 
        display: block; 
    }
    
    /* 通用工具 */
    .drop-zone { transition: all 0.2s ease; border: 2px dashed #cbd5e1; }
    .drop-zone:hover { border-color: #6366f1; background-color: #eef2ff; }
    .fade-in { animation: fadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
    @keyframes fadeIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

    /* 表格与面板辅助样式 */
    .badge { padding: 2px 8px; border-radius: 9999px; font-size: 12px; font-weight: 700; border: 1px solid transparent; text-transform: uppercase; }
    .badge-amazon-com { background-color: #fff7ed; color: #c2410c; border-color: #fed7aa; }
    .badge-amazon-ca { background-color: #fef2f2; color: #b91c1c; border-color: #fecaca; }
    .badge-other { background-color: #f1f5f9; color: #475569; border-color: #e2e8f0; }
    
    .count-cell { background-color: #f1f5f9; color: #334155; font-weight: 700; text-align: center; border-bottom: 1px solid #e2e8f0; font-family: 'JetBrains Mono', monospace; font-size: 0.875rem; }
    .refund-count-cell { background-color: #fff7ed; color: #c2410c; font-weight: 700; text-align: center; border-bottom: 1px solid #ffedd5; font-family: 'JetBrains Mono', monospace; font-size: 0.875rem; border-right: 1px dashed #cbd5e1; }
    .info-panel { background-color: rgba(239, 246, 255, 0.6); border: 1px solid #dbeafe; border-radius: 0.75rem; padding: 1rem; font-size: 0.875rem; color: #1e3a8a; }
    .info-list li { margin-bottom: 0.375rem; display: flex; align-items: flex-start; gap: 0.5rem; }
      
    
    /* 1. 细长滚动条 (Webkit) */
    .custom-scrollbar::-webkit-scrollbar { height: 8px; width: 8px; }
    .custom-scrollbar::-webkit-scrollbar-track { background: #f1f5f9; }
    .custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
    .custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

    /* 2. 固定首列的阴影处理 */
    .sticky-col { position: sticky; left: 0; z-index: 20; }
    /* 当表格滚动时，给固定列右侧加阴影 (通过伪元素实现，简单起见这里用边框) */
    .sticky-col::after {
        content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 1px;
        background: #e2e8f0; /* border color */
        box-shadow: 2px 0 4px rgba(0,0,0,0.02);
    }
    
    /* 3. 表头样式微调 */
    th { white-space: nowrap; }
    td { white-space: nowrap; }
      
      .channel-btn, #btn-preset, #btn-upload {
    color: #64748b; /* slate-500 */
}
#btn-preset.active, #btn-upload.active {
    background-color: white;
    color: #4f46e5; /* indigo-600 */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

@keyframes pulse-slow {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}
.animate-pulse-slow {
    animation: pulse-slow 3s infinite ease-in-out;
}

.drop-zone.border-blue-400 {
    background-color: #eff6ff !important; /* blue-50 */
    border-style: solid !important;
}
.drop-zone.border-emerald-400 {
    background-color: #ecfdf5 !important; /* emerald-50 */
    border-style: solid !important;
}
</sty
