:root{
  --bg:#0f172a; --card:#1e293b; --card2:#273449; --text:#e2e8f0; --muted:#94a3b8;
  --primary:#3b82f6; --primary-h:#2563eb; --green:#22c55e; --red:#ef4444; --amber:#f59e0b;
  --border:#334155; --radius:12px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.5; -webkit-font-smoothing:antialiased;
}
.container{max-width:960px; margin:0 auto; padding:24px 16px 80px;}

header h1{margin:0 0 2px; font-size:1.6rem; letter-spacing:.2px;}
.subtitle{margin:0; color:var(--muted); font-size:.9rem;}

.card{background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:18px; margin-top:16px;}
label{display:block; font-size:.85rem; color:var(--muted); margin-bottom:8px; font-weight:600;}

textarea{
  width:100%; resize:vertical; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.92rem; background:var(--card2); color:var(--text); border:1px solid var(--border);
  border-radius:10px; padding:12px; outline:none; transition:border-color .15s;
}
textarea:focus{border-color:var(--primary);}

.settings{display:flex; align-items:flex-end; gap:12px; margin-top:14px; flex-wrap:wrap;}
.field{display:flex; flex-direction:column; gap:6px;}
.field label{margin:0; font-size:.75rem;}
.field input{
  width:90px; background:var(--card2); color:var(--text); border:1px solid var(--border);
  border-radius:8px; padding:9px 10px; font-size:.9rem; outline:none;
}
.field input:focus{border-color:var(--primary);}

.btn{border:1px solid transparent; border-radius:10px; padding:11px 22px; font-size:.92rem;
  font-weight:600; cursor:pointer; transition:background .15s, opacity .15s, transform .05s;}
.btn:active{transform:translateY(1px);}
.btn:disabled{opacity:.5; cursor:not-allowed;}
.btn-primary{background:var(--primary); color:#fff; margin-left:auto;}
.btn-primary:hover:not(:disabled){background:var(--primary-h);}
.btn-secondary{background:var(--card2); color:var(--text); border-color:var(--border);}
.btn-secondary:hover:not(:disabled){background:#33415f;}

/* progress */
.progress{margin-top:16px;}
.progress-track{height:10px; background:var(--card); border:1px solid var(--border); border-radius:999px; overflow:hidden;}
.progress-fill{height:100%; width:0%; background:linear-gradient(90deg,var(--primary),#60a5fa); transition:width .25s ease;}
.progress-meta{display:flex; justify-content:space-between; margin-top:8px; font-size:.82rem;}
.muted{color:var(--muted);}

/* results */
.results{margin-top:18px;}
.results-toolbar{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:12px;}
.count-badge{background:var(--card); border:1px solid var(--border); border-radius:999px;
  padding:4px 12px; font-size:.8rem; color:var(--muted);}
.hint{font-size:.8rem; color:var(--muted); flex:1; min-width:200px;}
.export-group{display:flex; gap:8px; margin-left:auto;}
.btn-secondary{padding:8px 14px; font-size:.85rem;}

.table-wrap{background:var(--card); border:1px solid var(--border); border-radius:var(--radius); overflow:auto;}
table{width:100%; border-collapse:collapse; font-size:.9rem;}
thead th{
  position:sticky; top:0; background:var(--card2); text-align:left; padding:11px 14px;
  font-size:.78rem; text-transform:uppercase; letter-spacing:.4px; color:var(--muted);
  border-bottom:1px solid var(--border); white-space:nowrap; z-index:1;
}
th.num,td.num{text-align:right;}
th.sortable{cursor:pointer; user-select:none;}
th.sortable:hover{color:var(--text);}
th.sort-asc::after{content:" ▲"; color:var(--primary);}
th.sort-desc::after{content:" ▼"; color:var(--primary);}
tbody td{padding:11px 14px; border-bottom:1px solid #2c3a52; white-space:nowrap;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:#243149;}
td.domain{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.88rem;}
td.status{text-align:center;}

.status-ok{color:var(--green); font-weight:700;}
.status-partial{color:var(--amber); font-weight:700;}
.status-error{color:var(--red); font-weight:700;}
td.num .miss{color:var(--muted);}

.hidden{display:none;}

/* responsive */
@media (max-width:600px){
  .container{padding:16px 12px 60px;}
  header h1{font-size:1.35rem;}
  .card{padding:14px;}
  .settings{gap:10px;}
  .btn-primary{margin-left:0; width:100%; padding:13px;}
  .field input{width:100%;}
  .field{flex:1;}
  .hint{display:none;}
  .export-group{margin-left:0; width:100%;}
  .export-group .btn{flex:1;}
  thead th,tbody td{padding:9px 10px; font-size:.82rem;}
}