
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f3f6fa;color:#0f172a}
header{background:#0f172a;color:white;padding:18px 24px;display:flex;justify-content:space-between;align-items:center}
h1{margin:0;font-size:34px} p{margin:6px 0;color:#cbd5e1}
nav button{background:white;color:#0f172a;border:0;border-radius:10px;padding:10px 18px;font-weight:800;cursor:pointer;margin-left:8px}
main{padding:26px}
.tab{display:none}.tab.active{display:block}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}
.card{border:0;text-align:left;background:white;border-radius:22px;padding:26px;box-shadow:0 12px 28px #0001;cursor:pointer;color:#0f172a}
.card:hover{outline:3px solid #2563eb;transform:translateY(-2px)}
.card span{color:#64748b;font-size:18px;display:block}
.card b{font-size:42px;margin-top:6px;display:block}
.yellow{border-left:10px solid #facc15}.red{border-left:10px solid #ef4444}
.panel{background:white;border-radius:22px;padding:24px;margin-bottom:22px;box-shadow:0 12px 28px #0001}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
input,select{width:100%;padding:14px;border:1px solid #d1d5db;border-radius:10px;font-size:14px}
.search{margin:8px 0 16px}
.primary, .mini{background:#2563eb;color:white;border:0;border-radius:10px;padding:11px 15px;font-weight:800;cursor:pointer;margin-top:12px}
.mini{padding:8px 10px;margin:4px;font-size:12px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:12px;vertical-align:top}
.badge{padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800;display:inline-block}
.verde{background:#16a34a;color:white}.amarillo{background:#facc15;color:#111}.rojo{background:#dc2626;color:white}.gris{background:#94a3b8;color:white}
.blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.block{border:1px solid #e5e7eb;background:#fafafa;border-radius:16px;padding:14px}
.docgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.doc{background:white;border:1px solid #e5e7eb;border-radius:12px;padding:10px}
.doc b{font-size:13px}
.doc small{color:#64748b}
.hint{color:#64748b}
@media(max-width:1000px){.cards,.grid3,.blocks,.docgrid{grid-template-columns:1fr}}
