.filtros label { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; }
.filtros input[type="date"] { min-width: 0; flex: none; }
h2 { font-size: 16px; margin: 22px 0 10px; }
h2 small { font-weight: 400; opacity: .7; font-size: 12px; }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.kpi { background: #0f2247; border: 1px solid #1d3566; border-radius: 10px; padding: 12px 14px; }
.kpi .valor { font-size: 26px; font-weight: 700; }
.kpi .etiqueta { font-size: 12px; opacity: .75; margin-top: 2px; }

.semaforo { display: grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap: 10px; }
.luz { border-radius: 10px; padding: 12px 14px; color: #fff; }
.luz .valor { font-size: 28px; font-weight: 700; }
.luz .etiqueta { font-size: 13px; }
.luz.verde   { background: #1c6b3a; }
.luz.naranja { background: #c46a12; }
.luz.rojo    { background: #a3242f; }
.luz.critico { background: #6d1b7b; }
.luz.critico.activa { animation: parpadeo 1.2s ease-in-out infinite; }
@keyframes parpadeo { 50% { box-shadow: 0 0 0 4px #e14bff; } }

.punto { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; }
.punto.verde { background: #2fbf64; } .punto.naranja { background: #f08c1a; }
.punto.rojo { background: #e23b4a; }  .punto.critico { background: #c54bdb; animation: parpadeo 1.2s infinite; }

.titulo-tabla { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.titulo-tabla button { padding: 5px 10px; font-size: 13px; }
.rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 0 20px; }
td.num, th.num { text-align: right; }
.barra { height: 8px; border-radius: 4px; background: #1d5fa8; display: inline-block; vertical-align: middle; }
.barra.rep { background: #2fbf64; }
@media (max-width: 700px) { .semaforo { grid-template-columns: repeat(2, 1fr); } }