:root{
  --primary:#0d5c63; --primary-dark:#083f45; --accent:#12a89b;
  --ink:#15282b; --muted:#5c6f72; --line:#e0ebeb; --bg:#f2f7f7;
  --ok:#0f6e42; --ok-bg:#e7f6ee; --bad:#a12020; --bad-bg:#fdecec;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;font-size:15px}
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
a{color:var(--primary)}
.topbar{background:var(--primary-dark);color:#eafcfb}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.brand{font-weight:700;font-size:1.2rem;letter-spacing:-.02em}
.brand span{background:var(--accent);color:#04282a;font-size:.62rem;font-weight:700;padding:2px 6px;border-radius:5px;vertical-align:middle;letter-spacing:.06em}
.topbar nav{display:flex;gap:18px}
.topbar nav a{color:#b9dedb;font-size:.9rem;font-weight:500;text-decoration:none}
.topbar nav a.active,.topbar nav a:hover{color:#fff}
main.wrap{padding-top:34px;padding-bottom:50px}
h1{font-size:1.6rem;font-weight:600;margin-bottom:6px}
.lead{color:var(--muted);margin-bottom:22px}
h2{font-size:1.15rem;font-weight:600;margin-bottom:14px}
h2 .count{font-size:.8rem;color:var(--muted);font-weight:400;margin-left:8px}

.alert{padding:11px 15px;border-radius:8px;font-size:.92rem;margin-bottom:16px}
.alert.ok{background:var(--ok-bg);color:var(--ok)}
.alert.bad{background:var(--bad-bg);color:var(--bad)}

.uploader{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px;margin-bottom:34px}
.dropzone{display:block;border:2px dashed #bcd6d5;border-radius:12px;background:#fafdfd;cursor:pointer;transition:.15s;text-align:center;padding:34px 18px}
.dropzone.over{border-color:var(--accent);background:#eefaf8}
.dropzone input{display:none}
.dz-icon{font-size:2rem;color:var(--primary)}
.dz-title{font-weight:600;margin-top:6px}
.dz-sub{color:var(--muted);font-size:.85rem;margin-top:4px}
.filelist{list-style:none;margin:14px 0 0}
.filelist li{font-size:.88rem;color:var(--ink);padding:6px 10px;background:var(--bg);border-radius:6px;margin-bottom:6px}
.btn{margin-top:16px;display:inline-block;background:var(--primary);color:#fff;border:0;border-radius:8px;padding:11px 24px;font-size:.95rem;font-weight:600;cursor:pointer;transition:.15s}
.btn:hover{background:var(--primary-dark)}
.btn:disabled{background:#a9c4c3;cursor:not-allowed}

.recent .empty{color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px}
.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
.tbl th{background:#eef5f5;font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.tbl tr:last-child td{border-bottom:0}
.nowrap{white-space:nowrap}
.tag{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.04em}
.tag-image{background:#e6f1fb;color:#185fa5}
.tag-data{background:#eef8f7;color:var(--primary)}

.foot{color:var(--muted);font-size:.82rem;padding:20px 0;border-top:1px solid var(--line);background:#fff}

/* dashboard */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:26px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.kpi-n{font-size:1.7rem;font-weight:700;color:var(--primary);line-height:1.1}
.kpi-l{font-size:.78rem;color:var(--muted);margin-top:4px}
.card-block{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin-bottom:22px}
.card-block h2{margin-bottom:16px}
.chart{display:flex;align-items:flex-end;gap:6px;height:170px;padding-top:18px;border-bottom:1px solid var(--line)}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end}
.bar{width:68%;min-height:2px;background:var(--accent);border-radius:4px 4px 0 0;position:relative}
.bar span{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:.68rem;color:var(--muted)}
.bar-x{font-size:.62rem;color:var(--muted);margin-top:6px;white-space:nowrap}
.reports-placeholder{display:flex;gap:16px;align-items:flex-start;background:var(--bg);border:1px dashed #bcd6d5;border-radius:10px;padding:18px}
.rp-icon{font-size:1.7rem;line-height:1}
.reports-placeholder p{color:var(--muted);font-size:.9rem;margin-top:4px}
.reports-placeholder .muted{margin-top:10px}
.status{font-size:.78rem;text-transform:capitalize;color:var(--muted)}
@media(max-width:760px){.kpis{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:480px){.kpis{grid-template-columns:1fr 1fr}.bar span{display:none}}

.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px;width:320px;display:flex;flex-direction:column;gap:12px}
.login-card .brand{color:var(--primary);margin-bottom:4px}
.login-card label{font-size:.85rem;font-weight:600}
.login-card input{padding:11px 13px;border:1px solid var(--line);border-radius:8px;font:inherit}
.login-card input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(13,92,99,.12)}

@media(max-width:560px){.topbar nav a:not(.active){display:none}}