*{margin:0;padding:0;box-sizing:border-box}
:root{
  --purple:#4D148C;
  --orange:#FF6200;
  --white:#FFFFFF;
  --gray-90:#333333;
  --gray-80:#565656;
  --gray-50:#8E8E8E;
  --gray-30:#E3E3E3;
  --gray-20:#F2F2F2;
  --gray-10:#FAFAFA;
  --green:#008A00;
  --red:#DE002E;
  --blue:#007AB7;
  --amber:#F7B118;
  --font:'FedEx Sans','Futura','Century Gothic','Arial',sans-serif;
  --radius:8px;
  --sidebar-w:220px;
  --dv-1:#243DA3;--dv-2:#37A492;--dv-3:#6A2F67;--dv-4:#2997FF;--dv-5:#1C4A4A;
  --dv-6:#C0870C;--dv-7:#8D0738;--dv-8:#CC75B6;--dv-9:#333333;--dv-10:#8E8E8E;
}
html{font-size:16px}
body{font-family:var(--font);background:#eef0f2;color:var(--gray-90);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}
button{cursor:pointer;border:none;border-radius:var(--radius);padding:8px 16px;font-size:14px;font-family:inherit;transition:all .15s}
.btn-primary{background:var(--blue);color:var(--white)}
.btn-primary:hover{background:#006A9E}
.btn-primary:disabled{opacity:.5;cursor:not-allowed}
.btn-danger{background:var(--red);color:var(--white)}
.btn-danger:hover{background:#B8002A}
.btn-ghost{background:transparent;color:var(--gray-80);border:1px solid var(--gray-30)}
.btn-ghost:hover{color:var(--gray-90);border-color:var(--gray-50)}
.btn-sm{padding:4px 10px;font-size:12px}

/* Login */
#login-view{display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-box{background:var(--white);padding:40px;border-radius:16px;width:360px;text-align:center;box-shadow:0 4px 24px rgba(0,0,0,0.08);border-top:4px solid var(--purple)}
.login-box h1{font-size:1.25rem;font-weight:800;color:var(--purple);margin-bottom:8px}
.login-box p{color:var(--gray-80);font-size:0.85rem;margin-bottom:24px}
.login-box input{width:100%;padding:10px 14px;background:var(--gray-10);border:1px solid var(--gray-30);border-radius:var(--radius);color:var(--gray-90);font-size:14px;margin-bottom:12px;font-family:inherit}
.login-box input:focus{outline:none;border-color:var(--blue)}
.login-error{color:var(--red);font-size:13px;margin-bottom:12px;display:none}

/* App layout */
#app-view{display:none;min-height:100vh}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-w);background:var(--white);border-right:1px solid var(--gray-30);padding:0;z-index:10;box-shadow:2px 0 8px rgba(0,0,0,0.04)}
.sidebar-logo{padding:20px;font-size:0.9rem;font-weight:700;color:var(--white);background:linear-gradient(90deg,var(--purple) 0%,#671CAA 40%,#B83F6A 75%,var(--orange) 100%)}
.nav-item{display:block;padding:12px 20px;color:var(--gray-80);cursor:pointer;font-size:0.875rem;transition:all .15s;border-left:3px solid transparent}
.nav-item:hover{color:var(--gray-90);background:var(--gray-10)}
.nav-item.active{color:var(--purple);background:var(--gray-10);border-left-color:var(--orange);font-weight:600}
.main-content{margin-left:var(--sidebar-w);padding:24px 32px}
.page{display:none}
.page.active{display:block}
.page-header{margin-bottom:20px}
.page-header h2{font-size:1.375rem;font-weight:700;color:var(--purple);margin-bottom:4px;display:flex;align-items:center;gap:10px}
.page-header h2::before{content:'';width:4px;height:20px;background:var(--orange);display:inline-block;flex-shrink:0}
.page-header p{color:var(--gray-80);font-size:0.85rem}

/* Cards */
.card{background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);padding:20px;margin-bottom:16px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.card-title{font-size:0.95rem;font-weight:600;margin-bottom:12px;color:var(--gray-90)}

/* Forms */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:0.8rem;color:var(--gray-80);margin-bottom:6px;font-weight:500}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:8px 12px;background:var(--gray-10);border:1px solid var(--gray-30);border-radius:var(--radius);color:var(--gray-90);font-size:14px;font-family:inherit}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--blue)}
.form-group textarea{min-height:80px;resize:vertical;font-family:'Consolas',monospace;font-size:13px}
.form-row{display:flex;gap:12px}
.form-row .form-group{flex:1}
.hint{font-size:0.75rem;color:var(--gray-90);margin-top:4px}

/* Disclaimer */
.disclaimer{background:#fff7f0;border-left:5px solid var(--orange);padding:12px 16px;border-radius:6px;font-size:0.85rem;color:var(--gray-90);margin-bottom:16px}

/* Filter editor */
.filter-group{margin-bottom:12px;border:1px solid var(--gray-30);border-radius:var(--radius);overflow:visible}
.filter-group-title{font-size:0.8rem;font-weight:600;color:var(--purple);padding:10px 14px;cursor:pointer;display:flex;align-items:center;gap:8px;background:var(--gray-10);user-select:none;transition:background .15s;border-radius:var(--radius) var(--radius) 0 0}
.filter-group-title:hover{background:var(--gray-20)}
.filter-group-arrow{font-family:'Consolas',monospace;font-size:0.75rem;color:var(--orange);width:24px;display:inline-block}
.filter-group-label{flex:1}
.filter-group-content{padding:12px 14px}
.filter-row{margin-bottom:12px}
.filter-row label{display:block;font-size:0.8rem;color:var(--gray-80);margin-bottom:4px}
.filter-row .filter-hint{font-size:0.7rem;color:var(--gray-50)}

/* Multi-select */
.ms-container{position:relative}
.ms-display{min-height:36px;padding:4px 28px 4px 8px;background:var(--gray-10);border:1px solid var(--gray-30);border-radius:var(--radius);cursor:pointer;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.ms-display:hover{border-color:var(--gray-50)}
.ms-tag{background:var(--blue);color:var(--white);padding:2px 8px;border-radius:4px;font-size:0.75rem;display:inline-flex;align-items:center;gap:4px}
.ms-tag span{cursor:pointer;opacity:.7}
.ms-tag span:hover{opacity:1}
.ms-placeholder{color:var(--gray-50);font-size:0.8rem;padding:4px}
.ms-arrow{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:var(--gray-50);pointer-events:none}
.ms-dropdown{position:absolute;top:100%;left:0;right:auto;min-width:400px;background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);max-height:300px;overflow-y:auto;z-index:100;display:none;margin-top:4px;box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.ms-dropdown.open{display:block}
.ms-search{width:100%;padding:8px 12px;background:var(--gray-10);border:none;border-bottom:1px solid var(--gray-30);color:var(--gray-90);font-size:0.8rem;font-family:inherit}
.ms-search:focus{outline:none}
.ms-option{padding:6px 12px;cursor:pointer;font-size:0.8rem;display:flex;align-items:center;gap:8px}
.ms-option:hover{background:var(--gray-10)}
.ms-option.selected{color:var(--blue);font-weight:500}
.ms-option .check{width:16px;text-align:center}

/* Boolean toggle */
.bool-toggle{display:flex;gap:0;border:1px solid var(--gray-30);border-radius:var(--radius);overflow:hidden;width:fit-content}
.bool-toggle button{padding:6px 16px;background:var(--gray-10);color:var(--gray-50);border-radius:0;font-size:0.8rem}
.bool-toggle button.active{background:var(--blue);color:var(--white)}

/* Date picker */
.date-input-row{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.date-input-row input{flex:1}
.date-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.date-chip{background:var(--purple);color:var(--white);padding:2px 8px;border-radius:4px;font-size:0.75rem;display:inline-flex;align-items:center;gap:4px}

/* Tracking numbers */
.tn-input-area{display:flex;gap:12px}
.tn-textarea{flex:1}
.tn-file{display:flex;flex-direction:column;justify-content:center;gap:8px}
.tn-file-label{display:inline-block;padding:8px 16px;background:var(--gray-10);border:1px dashed var(--gray-30);border-radius:var(--radius);cursor:pointer;text-align:center;font-size:0.8rem;color:var(--gray-50)}
.tn-file-label:hover{border-color:var(--blue);color:var(--blue)}
.tn-file-hint{font-size:0.7rem;color:var(--gray-50);max-width:220px;line-height:1.4;margin-top:4px}
.tn-count{font-size:0.8rem;color:var(--gray-50);margin-top:6px}
.tn-count strong{color:var(--purple)}

/* Run controls */
.run-top-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.run-top-row>.card{flex:1;min-width:0}
.run-controls{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.run-options{display:flex;gap:16px;align-items:center}
.concurrency-select{padding:6px 12px;background:var(--gray-10);border:1px solid var(--gray-30);border-radius:var(--radius);color:var(--gray-90);font-size:0.8rem;font-family:inherit}

/* Progress panel */
.progress-panel{background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);padding:20px;margin-bottom:16px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.progress-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-bottom:16px}
.stat-item{background:var(--gray-10);padding:12px;border-radius:var(--radius);text-align:center}
.stat-label{font-size:0.7rem;color:var(--gray-50);margin-bottom:4px}
.stat-value{font-size:1.375rem;font-weight:700;color:var(--gray-90)}
.stat-value.green{color:var(--green)}
.stat-value.red{color:var(--red)}
.stat-value.yellow{color:var(--amber)}
.progress-bar{height:8px;background:var(--gray-30);border-radius:4px;overflow:hidden;margin-bottom:12px}
.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--purple),var(--orange));transition:width .3s;border-radius:4px}
.log-panel{background:var(--gray-90);border:1px solid var(--gray-90);border-radius:var(--radius);padding:12px;max-height:300px;overflow-y:auto;font-family:'Consolas',monospace;font-size:0.75rem;line-height:1.6}
.log-panel .log-line{color:var(--gray-30)}
.log-panel .log-line.error{color:var(--red)}
.log-panel .log-line.success{color:var(--green)}

/* Table */
.table-wrap{background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.table-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--gray-30);flex-wrap:wrap;gap:8px}
.table-pagination{display:flex;gap:8px;align-items:center}
table{width:100%;border-collapse:collapse}
thead th{background:var(--gray-90);color:var(--white);padding:10px 12px;text-align:left;font-size:0.75rem;font-weight:600;position:sticky;top:0;letter-spacing:0.5px}
tbody td{padding:8px 12px;border-bottom:1px solid var(--gray-30);font-size:0.8rem;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--gray-90)}
tbody tr:nth-child(even){background:var(--gray-10)}
tbody tr:hover{background:var(--gray-20)}
.table-body{max-height:600px;overflow-y:auto}

/* Charts */
.charts-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.chart-card{background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);padding:16px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.chart-card.full{grid-column:1/-1}
.chart-card h3{font-size:0.9rem;font-weight:600;margin-bottom:12px;color:var(--gray-90)}
.chart-container{position:relative;height:280px}

/* Summary */
.summary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:20px}
.summary-item{background:var(--white);border:1px solid var(--gray-30);border-radius:var(--radius);padding:16px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.summary-item .label{font-size:0.75rem;color:var(--gray-50);margin-bottom:4px}
.summary-item .value{font-size:1.25rem;font-weight:700;color:var(--gray-90)}
.summary-item .value.green{color:var(--green)}
.summary-item .value.red{color:var(--red)}
.summary-item .value.yellow{color:var(--amber)}
.error-table{width:100%;border-collapse:collapse}
.error-table th{background:var(--gray-90);color:var(--white);padding:8px;text-align:left;font-size:0.75rem;font-weight:600}
.error-table td{padding:8px;border-bottom:1px solid var(--gray-30);font-size:0.75rem;color:var(--gray-90)}
.error-table tr:nth-child(even){background:var(--gray-10)}
.error-table .err-type{font-weight:600}
.error-table .err-type.conn-reset{color:var(--red)}
.download-buttons{display:flex;gap:12px;margin-top:20px}

/* Scrollbar */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--gray-10)}
::-webkit-scrollbar-thumb{background:var(--gray-30);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--gray-50)}

/* Responsive */
@media(max-width:768px){
  .sidebar{width:60px}.sidebar-logo{font-size:0.8rem;padding:0 12px 16px}.nav-item{padding:10px 12px;font-size:0.75rem}.nav-item span.label{display:none}
  .main-content{margin-left:60px;padding:16px}.charts-grid{grid-template-columns:1fr}
}
