:root {
  --bg: #0b1220; --panel: #ffffff; --ink: #0b1220; --muted: #6b7480;
  --line: #e7ebf1; --brand: #1f6feb; --accent: #16a34a; --warn: #d97706; --danger:#dc2626;
  font-family: "Inter", "Segoe UI", system-ui, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: #f5f7fb; color: var(--ink); }
header.top { background: var(--bg); color: #fff; padding: 14px 22px; display: flex; align-items: center; justify-content: space-between; }
header.top .brand { font-weight: 800; }
header.top .brand small { color:#8ea3c7; font-weight:500; margin-inline-start:8px;}
.wrap { width: min(1150px, 94%); margin: 22px auto; }

.login { max-width: 380px; margin: 80px auto; background:#fff; padding:28px; border-radius:16px; box-shadow:0 10px 30px rgba(11,18,32,.12); }
.login h2 { margin:0 0 14px; }
.login input { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; font:inherit; margin-bottom:12px; }
.btn { border:0; cursor:pointer; padding:11px 18px; border-radius:10px; font-weight:700; background:var(--brand); color:#fff; }
.btn.sm { padding:6px 11px; font-size:13px; }
.btn.ghost { background:#eef2f8; color:#2a3342; }

.tabs { display:flex; gap:8px; margin-bottom:16px; }
.tab { padding:9px 16px; border-radius:999px; background:#fff; border:1px solid var(--line); cursor:pointer; font-weight:600; }
.tab.active { background:var(--brand); color:#fff; border-color:var(--brand); }

.cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(155px, 1fr)); gap:14px; margin-bottom:18px; }
.kpi { background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; }
.kpi .n { font-size:28px; font-weight:800; }
.kpi .l { color:var(--muted); font-size:13px; }

table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
th, td { text-align:start; padding:11px 13px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:middle; }
th { background:#f8fafc; color:#475063; font-size:12px; text-transform:uppercase; letter-spacing:.03em; }
tr:last-child td { border-bottom:0; }
.empty { padding:30px; text-align:center; color:var(--muted); }

.pill { display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.pill.new { background:#e0edff; color:#1450b0; }
.pill.contacted { background:#fff3e0; color:#b45309; }
.pill.visited { background:#ede9fe; color:#6d28d9; }
.pill.closed { background:#e7f8ed; color:#15803d; }
.pill.in { background:#e7f8ed; color:#15803d; }
.pill.out { background:#eef2f8; color:#475063; }

select.status { padding:5px 8px; border:1px solid var(--line); border-radius:8px; font:inherit; font-size:13px; }
a.idphoto { color:var(--brand); font-weight:600; }
.hide { display:none !important; }
.date-row { margin-bottom:14px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.date-row input { padding:8px 10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.searchbar { display:flex; gap:10px; margin-bottom:14px; align-items:center; }
.searchbar input { flex:1; max-width:360px; padding:9px 12px; border:1px solid var(--line); border-radius:10px; font:inherit; }
.muted { color:var(--muted); font-size:13px; }
h3 { font-weight:700; margin:18px 0 10px; }