*{box-sizing:border-box}body{margin:0;font:15px/1.45 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#f3f5f9;color:#141a2b}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}
header{background:#101828;color:#fff}header .wrap{display:flex;align-items:center;gap:20px;min-height:56px;flex-wrap:wrap}
header b{font-size:16px;letter-spacing:.02em}nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
nav a{color:#c8d0e0;text-decoration:none;padding:8px 12px;border-radius:8px}nav a.on,nav a:hover{background:#1f2a44;color:#fff}nav a.out{margin-left:auto}
main{padding:22px 18px 60px}h1{font-size:22px;margin:6px 0 14px}h2{font-size:16px;margin:0 0 12px}
.card{background:#fff;border:1px solid #e3e8f0;border-radius:12px;padding:16px 18px;margin:0 0 16px;overflow-x:auto}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:16px}.kpi .k{color:#5b6478;font-size:13px}.kpi .v{font-size:28px;font-weight:700}
.good{color:#15803d}.bad{color:#b91c1c}.sub{color:#6b7385;font-size:12.5px}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:9px 8px;border-bottom:1px solid #eef1f6;vertical-align:top}th{font-size:12px;color:#6b7385;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
tr.gone td{opacity:.5}.act{white-space:nowrap}
.btn,button{display:inline-block;font:inherit;font-size:13px;padding:6px 11px;border-radius:8px;border:1px solid #cfd6e3;background:#fff;color:#141a2b;cursor:pointer;text-decoration:none;margin:2px 2px 2px 0}
.btn:hover,button:hover{border-color:#8d97ab}.primary{background:#1d4ed8;border-color:#1d4ed8;color:#fff}.primary:hover{background:#1e40af}
button.danger{border-color:#f1b5b5;color:#b91c1c}form.inl{display:inline}form.inl select{font:inherit;font-size:13px;padding:5px;border-radius:8px;border:1px solid #cfd6e3;max-width:230px}
.st{display:inline-block;font-size:12px;padding:2px 8px;border-radius:999px;background:#eef1f6}.st.paid{background:#dcfce7;color:#166534}.st.overdue{background:#fee2e2;color:#991b1b}.st.due{background:#fef3c7;color:#92400e}.st.off{background:#e5e7eb;color:#4b5563}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.form label{display:block;margin:0 0 14px;font-weight:600;font-size:13.5px}.form input,.form select,.form textarea{display:block;width:100%;margin-top:5px;font:inherit;font-weight:400;padding:9px 10px;border:1px solid #cfd6e3;border-radius:8px;background:#fff}
.form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}.hint{display:block;font-weight:400;color:#6b7385;font-size:12px;margin-top:4px}
.form .chk{display:flex;align-items:center;gap:8px}.form .chk input{width:auto;margin:0}
.tg{background:#e7f0fb;border-radius:12px;padding:12px 14px;max-width:460px;white-space:normal}
.flash{padding:10px 14px;border-radius:10px;margin-bottom:16px;background:#dcfce7;color:#166534}.flash.err{background:#fee2e2;color:#991b1b}
.login{max-width:360px;margin:60px auto}.login label{display:block;margin:0 0 12px;font-weight:600;font-size:13.5px}.login input{display:block;width:100%;margin-top:5px;padding:10px;border:1px solid #cfd6e3;border-radius:8px;font:inherit}.login button{width:100%;padding:10px;background:#1d4ed8;color:#fff;border-color:#1d4ed8}
@media(max-width:640px){th,td{padding:7px 5px}.act form,.act a{display:inline-block}}