:root{
  --bg:#f4f6f8; --card:#fff; --ink:#1e293b; --muted:#64748b; --line:#e2e8f0;
  --brand:#0d9488; --brand-dark:#0f766e; --good:#16a34a; --warn:#d97706; --bad:#dc2626;
}
*{box-sizing:border-box;}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--ink);}

.topbar{display:flex;align-items:center;gap:8px;background:var(--card);border-bottom:1px solid var(--line);
  padding:12px 16px;position:sticky;top:0;z-index:10;flex-wrap:wrap;}
.topbar .brand{font-weight:800;font-size:1.05rem;color:var(--brand-dark);margin-right:auto;}
.topbar a{color:var(--muted);text-decoration:none;font-weight:600;font-size:.9rem;padding:8px 12px;border-radius:8px;}
.topbar a.active,.topbar a:hover{background:rgba(13,148,136,.1);color:var(--brand-dark);}

.wrap{max-width:900px;margin:0 auto;padding:20px 16px 60px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:16px;
  box-shadow:0 1px 3px rgba(0,0,0,.04);}
h1{font-size:1.3rem;margin:0 0 4px;}
h2{font-size:1.05rem;margin:0 0 10px;}
.sub{color:var(--muted);font-size:.88rem;margin:0 0 16px;}

.btn{background:var(--brand);color:#fff;border:none;padding:10px 18px;border-radius:9px;font-weight:700;
  cursor:pointer;font-size:.9rem;font-family:inherit;}
.btn:hover{background:var(--brand-dark);}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn.secondary{background:#fff;color:var(--brand-dark);border:1.5px solid var(--brand);}
.btn.small{padding:6px 12px;font-size:.8rem;}

.input,select.input{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:9px;
  font-size:.9rem;font-family:inherit;background:#fff;color:var(--ink);}
.input:focus{outline:none;border-color:var(--brand);}

.dropzone{border:2px dashed var(--line);border-radius:12px;padding:28px;text-align:center;color:var(--muted);
  cursor:pointer;transition:.15s;}
.dropzone:hover,.dropzone.drag{border-color:var(--brand);background:rgba(13,148,136,.04);}
.dropzone input{display:none;}

table{width:100%;border-collapse:collapse;font-size:.88rem;}
th{text-align:left;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;
  padding:8px 10px;border-bottom:2px solid var(--line);}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle;}
tr:last-child td{border-bottom:none;}

.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:.72rem;font-weight:700;}
.b-exact,.b-alias{background:rgba(22,163,74,.12);color:var(--good);}
.b-fuzzy{background:rgba(217,119,6,.12);color:var(--warn);}
.b-none{background:rgba(220,38,38,.12);color:var(--bad);}

.loc-pill{font-family:'Courier New',monospace;font-weight:800;background:#0f172a;color:#fff;
  padding:4px 10px;border-radius:6px;letter-spacing:.03em;}

.suggest-btn{background:#fff;border:1.5px solid var(--line);border-radius:8px;padding:5px 10px;
  font-size:.78rem;cursor:pointer;margin:2px;font-family:inherit;}
.suggest-btn:hover{border-color:var(--brand);color:var(--brand-dark);}

.stat-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;}
.stat{flex:1;min-width:100px;background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:12px 14px;text-align:center;}
.stat .n{font-size:1.4rem;font-weight:800;}
.stat .l{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
.stat.matched .n{color:var(--good);}
.stat.unmatched .n{color:var(--bad);}

.toast{position:fixed;bottom:24px;right:24px;left:auto;background:var(--good);color:#fff;padding:12px 20px;
  border-radius:10px;font-weight:700;z-index:300;display:none;max-width:90vw;}
.toast.show{display:block;}
.toast.err{background:var(--bad);}

.update-banner{background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;padding:10px 16px;
  font-size:.85rem;font-weight:600;display:none;align-items:center;gap:10px;flex-wrap:wrap;}
.update-banner.show{display:flex;}
.update-banner button{background:#fff;color:var(--brand-dark);border:none;padding:6px 14px;border-radius:7px;
  font-weight:800;cursor:pointer;font-size:.8rem;}

@media (max-width:640px){
  .wrap{padding:14px 10px 50px;}
  table,thead,tbody,th,td,tr{display:block;}
  thead{display:none;}
  tr{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:10px;padding:8px 10px;}
  td{border:none;padding:5px 4px;display:flex;justify-content:space-between;gap:10px;}
  td::before{content:attr(data-label);color:var(--muted);font-size:.72rem;font-weight:700;
    text-transform:uppercase;letter-spacing:.03em;}
}
