
*{box-sizing:border-box}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;margin:0;background:#f7f7f8;color:#1f2937}
.container{max-width:1100px;margin:24px auto;padding:0 16px}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:16px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid #e5e7eb;background:#111827;color:#fff;text-decoration:none}
.btn.secondary{background:#fff;color:#111827}
.input,select,textarea{width:100%;padding:10px;border:1px solid #e5e7eb;border-radius:10px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid #eee;text-align:left}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.header{background:#111827;color:#fff;padding:14px 0}
.header a{color:#fff;margin-right:16px;text-decoration:none}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#eef2ff;color:#3730a3;font-size:12px}
.kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.kpi .card h3{margin:6px 0 0 0}
footer{color:#6b7280;text-align:center;padding:24px}
.alert{padding:10px;border-radius:10px;background:#ecfccb;border:1px solid #bef264}


