*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#f3f5f9;color:#1f2937;font-size:15px}
a{color:#0b5cad;text-decoration:none}a:hover{text-decoration:underline}
.top{background:#0f2a4a;color:#fff;display:flex;align-items:center;flex-wrap:wrap;padding:0 16px}
.brand{font-weight:700;font-size:18px;padding:14px 16px 14px 0}
.top nav{display:flex;flex-wrap:wrap;margin-left:auto}
.top nav a{color:#cfe0f5;padding:14px 12px;display:block}
.top nav a.on,.top nav a:hover{background:#1c4272;color:#fff;text-decoration:none}
.menu-btn{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:24px;padding:10px}
main{max-width:1200px;margin:18px auto;padding:0 14px}
h1{font-size:22px;margin:0 0 14px}h2{font-size:17px;margin:20px 0 8px}
.card{background:#fff;border-radius:8px;padding:16px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:16px;overflow-x:auto}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:16px}
.stat{background:#fff;border-radius:8px;padding:14px;box-shadow:0 1px 3px rgba(0,0,0,.08);border-left:4px solid #0b5cad}
.stat.red{border-color:#c0392b}.stat.green{border-color:#1e8e4e}.stat.amber{border-color:#d68910}
.stat b{display:block;font-size:22px;margin-top:4px}.stat span{color:#6b7280;font-size:13px}
table{width:100%;border-collapse:collapse}
th,td{padding:8px 10px;text-align:left;border-bottom:1px solid #e5e7eb;white-space:nowrap}
th{background:#f3f5f9;font-size:13px;color:#4b5563}
td.r,th.r{text-align:right}
.btn,button{background:#0b5cad;color:#fff;border:0;border-radius:6px;padding:8px 14px;cursor:pointer;font-size:14px;display:inline-block}
.btn:hover,button:hover{background:#094a8c;text-decoration:none}
.btn.gray{background:#6b7280}.btn.red{background:#c0392b}.btn.green{background:#1e8e4e}.btn.sm{padding:4px 9px;font-size:13px}
label{display:block;font-size:13px;color:#4b5563;margin:10px 0 3px}
input,select,textarea{width:100%;padding:8px;border:1px solid #cbd5e1;border-radius:6px;font-size:15px;background:#fff}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 14px}
.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-bottom:12px}
.bar>div{flex:1;min-width:140px}.bar .btn,.bar button{height:38px}
.flash{padding:10px 14px;border-radius:6px;margin-bottom:12px}
.flash.ok{background:#e3f6ea;color:#14663a}.flash.err{background:#fde8e6;color:#9b2b20}
.badge{padding:2px 8px;border-radius:10px;font-size:12px;background:#e5e7eb}
.badge.active,.badge.paid{background:#d6f3e0;color:#14663a}
.badge.closed{background:#e5e7eb;color:#374151}
.badge.partial{background:#fdf0d1;color:#8a5a00}
.badge.overdue{background:#fde8e6;color:#9b2b20}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 16px}
.kv div span{display:block;font-size:12px;color:#6b7280}
.photo{width:90px;height:90px;object-fit:cover;border-radius:8px;border:1px solid #cbd5e1}
.foot{text-align:center;color:#9ca3af;font-size:12px;padding:20px}
.pager{margin-top:10px}.pager a{margin-right:8px}
.login{max-width:360px;margin:12vh auto}
.preview{background:#eef4fb;border-radius:6px;padding:10px;margin-top:12px}
@media(max-width:760px){
 .menu-btn{display:block}.top nav{display:none;width:100%;flex-direction:column}.top nav.open{display:flex}
 th,td{padding:7px 6px;font-size:14px}
}
@media print{.top,.foot,.noprint{display:none!important}body{background:#fff}.card{box-shadow:none}}