:root{
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#1d2433;
  background:#f4f6f8;
}
*{box-sizing:border-box}
html,body{width:100%;max-width:100%;overflow-x:hidden}
body{margin:0;min-height:100vh}
header{
  min-height:64px;background:#111827;color:#fff;display:flex;align-items:center;
  justify-content:space-between;padding:0 28px;gap:16px
}
header div{display:flex;align-items:baseline;gap:10px;min-width:0}
header strong{font-size:24px;flex:0 0 auto}
header span,header small{opacity:.7}
header span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Main navigation must never stretch/break the viewport. */
nav{
  display:flex;gap:18px;align-items:center;background:#fff;border-bottom:1px solid #e5e7eb;
  padding:12px 28px;max-width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;
  scrollbar-gutter:stable;-webkit-overflow-scrolling:touch
}
nav a{flex:0 0 auto;text-decoration:none;color:#374151;font-weight:600}
nav form{flex:0 0 auto;margin-left:auto}
nav::-webkit-scrollbar,.panel::-webkit-scrollbar{height:12px}
nav::-webkit-scrollbar-track,.panel::-webkit-scrollbar-track{background:#eef1f4;border-radius:999px}
nav::-webkit-scrollbar-thumb,.panel::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:999px;border:2px solid #eef1f4}

button{border:0;background:#e5e7eb;padding:9px 14px;border-radius:8px;cursor:pointer;white-space:nowrap}
.primary{background:#111827;color:#fff;font-weight:700}
.login-card .primary{width:100%}
main{width:100%;max-width:1600px;margin:0 auto;padding:28px;min-width:0}
h1{margin-top:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));gap:16px;margin-bottom:20px;min-width:0}
.cards article,.panel,.login-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;min-width:0}
.cards small{display:block;color:#6b7280;margin-bottom:10px}
.cards b{font-size:26px;overflow-wrap:anywhere}

/* Every wide report receives its own horizontal scrollbar instead of breaking the page. */
.panel{
  width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;margin-top:18px;
  scrollbar-gutter:stable both-edges;overscroll-behavior-x:contain
}
.panel>table{min-width:max-content}
table{width:100%;border-collapse:collapse;white-space:nowrap}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #edf0f3;vertical-align:top}
th{font-size:12px;text-transform:uppercase;color:#6b7280;position:relative}

.login-card{max-width:420px;margin:8vh auto}
.login-card label{display:block;margin:16px 0}
.login-card input{width:100%;padding:11px;margin-top:6px;border:1px solid #cbd5e1;border-radius:8px}
.error{background:#fee2e2;color:#991b1b;padding:10px;border-radius:8px}
.success{background:#dcfce7;color:#166534;padding:10px;border-radius:8px}
.muted{color:#6b7280}
.panel h2{margin-top:0}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
code{background:#f3f4f6;padding:2px 5px;border-radius:5px}
pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f8fafc;border:1px solid #e5e7eb;padding:14px;border-radius:8px;overflow:auto}
.panel input[type=file]{display:block;width:100%;max-width:620px;margin:10px 0 14px;padding:10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff}

.filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:0 0 16px;max-width:100%}
.filters label,.review-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#6b7280;min-width:0}
.filters select,.review-form select,.review-form input{max-width:100%;min-width:150px;padding:8px;border:1px solid #cbd5e1;border-radius:7px;background:#fff}
.review-form{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;width:min(100%,340px);min-width:0;padding-top:10px;white-space:normal}
.review-form input,.review-form select{width:100%;min-width:0}
.compact{width:auto}
.badge{display:inline-block;padding:4px 7px;border-radius:999px;font-size:11px;font-weight:700;background:#e5e7eb}
.badge.confirmed_duplicate{background:#fee2e2;color:#991b1b}
.badge.not_duplicate{background:#dcfce7;color:#166534}
.badge.unresolved{background:#fef3c7;color:#92400e}
.badge.unreviewed{background:#e5e7eb;color:#374151}
details{max-width:360px}
details summary{cursor:pointer;margin-top:8px;font-weight:600}

@media(max-width:900px){
  header{padding:0 18px}
  nav{padding:10px 18px;gap:14px}
  main{padding:18px}
  .cards b{font-size:22px}
}
@media(max-width:600px){
  header span{display:none}
  main{padding:12px}
  .cards{grid-template-columns:1fr}
  .cards article,.panel,.login-card{padding:15px}
  th,td{padding:9px 10px}
  .filters{align-items:stretch}
  .filters label,.filters select,.filters button{width:100%}
}

/* v0.5.3: native horizontal scrollbar only at the bottom of wide report panels. */
nav{overflow-x:auto}
.panel{overflow-x:auto;overflow-y:visible;scrollbar-width:auto;scrollbar-color:#7c8798 #e8edf2}
.panel::-webkit-scrollbar{height:12px}
.panel::-webkit-scrollbar-track{background:#e8edf2;border-radius:999px}
.panel::-webkit-scrollbar-thumb{background:#7c8798;border-radius:999px;border:2px solid #e8edf2}