*{box-sizing:border-box}
  body{margin:0;background:#eef1f4;color:#2b3238;
       font:14px/1.5 "Segoe UI",system-ui,sans-serif}
  .wrap{max-width:1180px;margin:0 auto;padding:24px 20px 60px}
  header.top{background:#43B02A;color:#fff;border-radius:14px 14px 0 0;
       padding:24px 28px}
  header.top h1{margin:4px 0 0;font-size:24px}
  header.top p{margin:0;font-size:12px;letter-spacing:1.4px;
       text-transform:uppercase;opacity:.85}
  .panel{background:#fff;border-radius:0 0 14px 14px;padding:24px 28px;
       box-shadow:0 2px 10px rgba(0,0,0,.07);margin-bottom:22px}
  .panel+.panel{border-radius:14px}
  .bloque{margin-bottom:22px}
  .bloque:last-of-type{margin-bottom:8px}
  .bl-cab{margin:0 0 10px}
  .bl-cab h3{margin:0;font-size:14px;color:#2b3238}
  .bl-cab p{margin:3px 0 0;font-size:12px;color:#5b6670;max-width:70ch;
       line-height:1.45}
  .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));
       gap:12px}
  .kpi{border:1px solid;border-radius:11px;padding:14px 16px}
  .kpi-v{font-size:26px;font-weight:700;line-height:1.1}
  .kpi-e{font-size:11px;text-transform:uppercase;letter-spacing:.5px;
       color:#5b6670;margin-top:4px}
  .barra{display:flex;height:14px;border-radius:7px;overflow:hidden;
       background:#f3f5f7}
  .leyenda{margin-top:8px;font-size:12px;color:#5b6670}
  .leyenda .ley{margin-right:16px}
  .leyenda i{display:inline-block;width:9px;height:9px;border-radius:2px;
       margin-right:5px}
  .nota{margin:14px 0 0;padding:11px 14px;background:#eef2fb;
       border-left:3px solid #1B3A8F;border-radius:6px;font-size:13px}
  h2{font-size:13px;text-transform:uppercase;letter-spacing:1px;
       color:#5b6670;margin:0 0 12px}
  table{width:100%;border-collapse:collapse;font-size:13px}
  th{text-align:left;padding:9px 10px;background:#1B3A8F;color:#fff;
       font-size:11px;text-transform:uppercase;letter-spacing:.4px}
  td{padding:9px 10px;border-bottom:1px solid #e4e8ec}
  td.n,th.n{text-align:right}
  .tabla-scroll{overflow-x:auto}
  .filtros{margin-bottom:14px}
  .filtros button{font:inherit;padding:6px 14px;margin:0 7px 7px 0;
       border:1px solid #e4e8ec;background:#fff;border-radius:18px;
       cursor:pointer}
  .filtros button.on{background:#1B3A8F;color:#fff;border-color:#1B3A8F}
  .veh{background:#fff;border:1px solid #e4e8ec;border-radius:12px;
       padding:0 0 16px;margin-bottom:14px;overflow:hidden}
  .veh header{display:flex;justify-content:space-between;align-items:center;
       gap:14px;padding:14px 18px;background:#fbfcfd}
  .veh h3{margin:0;font-size:15px}
  .validacion{margin:12px 18px 0}
  .val{display:inline-block;padding:5px 12px;border-radius:7px;
       font-size:12px;font-weight:600}
  .val b{font-size:13px;margin-right:4px}
  .val-ok{background:#e6f4f3;color:#00857C;border:1px solid #00857C55}
  .val-no{background:#f3f5f7;color:#5b6670;border:1px solid #e4e8ec}
  .hallazgos{margin:10px 18px 0;padding:11px 14px;border-radius:7px;
       background:#eef2fb;border-left:3px solid #1B3A8F;font-size:13px;
       color:#2b3238}
  .hz-tit{display:block;font-size:10.5px;font-weight:700;color:#1B3A8F;
       text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
  .serie{font-family:Consolas,monospace;font-size:12px;letter-spacing:.3px}
  .veh .pl{display:inline-block;margin-left:8px;padding:1px 8px;
       border-radius:5px;background:#f3f5f7;color:#5b6670;
       font-size:11.5px;font-weight:600;letter-spacing:.4px}
  .veh .correo{margin:2px 0 0;font-size:12px;color:#5b6670}
  .chip{font-size:11px;font-weight:600;padding:4px 11px;border-radius:12px;
       white-space:nowrap}
  dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
       gap:10px;margin:14px 18px 0}
  dl div{margin:0}
  dt{font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;
       color:#5b6670}
  dd{margin:2px 0 0;font-size:13.5px}
  .motivos{margin:14px 18px 0;padding:10px 13px;border-radius:6px;
       font-size:13px}
  .motivos ul{margin:5px 0 0;padding-left:18px}
  .fotos{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
       gap:10px;margin:14px 18px 0}
  .fotos figure{margin:0;border:1px solid #e4e8ec;border-radius:8px;
       overflow:hidden;background:#f3f5f7}
  .fotos img{width:100%;height:150px;object-fit:cover;display:block;
       cursor:zoom-in}
  .fotos img:hover{opacity:.9}
  .fotos figcaption{padding:6px 9px;font-size:11px;text-transform:uppercase;
       letter-spacing:.4px;color:#5b6670}
  footer{text-align:center;color:#5b6670;font-size:11.5px;margin-top:26px}
  .tenue{opacity:.75;font-size:12px}
  .acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
       margin:12px 18px 0}
  .acciones .nota{flex:1 1 280px;min-width:200px;font:inherit;padding:7px 10px;
       border:1px solid #e4e8ec;border-radius:7px}
  .acciones button{font:inherit;font-weight:600;padding:7px 15px;border:0;
       border-radius:7px;cursor:pointer}
  .acciones button:disabled{opacity:.55;cursor:default}
  .acciones .aprobar{background:#00857C;color:#fff}
  .acciones .reabrir{background:#fff;color:#8a5b00;
       border:1px solid #F6A800}
  /* Cada estado muestra solo la acción que tiene sentido. */
  .veh[data-estado="revision"] .reabrir{display:none}
  .veh[data-estado="aprobado_manual"] .aprobar{display:none}
  .acciones .eco{font-size:12px;color:#5b6670}
  .aviso{margin:0 0 14px;padding:10px 14px;border-radius:7px;font-size:13px;
       background:#fff6e6;border-left:3px solid #F6A800;
       color:#8a5b00}
  .aviso[hidden]{display:none}
  .aviso button{font:inherit;margin-left:10px;padding:5px 12px;border:0;
       border-radius:6px;background:#8a5b00;color:#fff;cursor:pointer}
  .avances{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
       margin:0 0 14px;padding:10px 14px;border-radius:7px;font-size:13px;
       background:#e6f4f3;border-left:3px solid #00857C;color:#00857C}
  .avances[hidden]{display:none}
  .avances button{font:inherit;padding:6px 14px;border:0;border-radius:6px;
       background:#00857C;color:#fff;cursor:pointer}
  .avances button:disabled{opacity:.45;cursor:default}
  .buscador{width:100%;font:inherit;padding:9px 13px;margin-bottom:14px;
       border:1px solid #e4e8ec;border-radius:8px}
  .grupo{border:1px solid #e4e8ec;border-radius:10px;margin-bottom:10px;
       background:#fff;overflow:hidden}
  .grupo[hidden]{display:none!important}
  .grupo>summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
       padding:13px 16px;cursor:pointer;list-style:none;background:#fbfcfd}
  .grupo>summary::-webkit-details-marker{display:none}
  .grupo>summary::before{content:"▸";color:#5b6670;font-size:12px;
       transition:transform .15s}
  .grupo[open]>summary::before{transform:rotate(90deg)}
  .gnom{font-weight:700;font-size:14px;flex:1 1 230px}
  .gcif{font-size:12px;color:#5b6670;white-space:nowrap}
  .mini{display:inline-flex;width:116px;height:7px;border-radius:4px;
       overflow:hidden;background:#f3f5f7}
  .mini i{display:block;height:100%}
  .gpct{font-size:12px;font-weight:700;color:#5b6670;width:44px;
       text-align:right}
  .gcuerpo{padding:12px 14px 4px;background:#f3f5f7}
  .gcuerpo .veh{background:#fff}
  .vacio{padding:18px;color:#5b6670;font-size:13px}

  /* --- Visor de fotos a pantalla completa --- */
  .visor{position:fixed;inset:0;z-index:999;display:none;
       background:rgba(16,18,22,.93);
       flex-direction:column;align-items:center;justify-content:center;
       -webkit-user-select:none;user-select:none}
  .visor.on{display:flex}
  .visor-lienzo{flex:1;width:100%;display:flex;align-items:center;
       justify-content:center;overflow:hidden;cursor:zoom-in}
  .visor-lienzo.acercado{cursor:grab}
  .visor-lienzo.arrastrando{cursor:grabbing}
  .visor img{max-width:94vw;max-height:84vh;transform-origin:center center;
       transition:transform .12s ease-out;will-change:transform;
       box-shadow:0 10px 40px rgba(0,0,0,.5);background:#fff}
  .visor-barra{width:100%;display:flex;align-items:center;gap:14px;
       padding:12px 20px;background:rgba(0,0,0,.45);color:#fff;
       font-size:13px;flex-wrap:wrap}
  .visor-tit{flex:1 1 240px;font-weight:600}
  .visor-tipo{text-transform:uppercase;letter-spacing:.6px;font-size:11.5px;
       opacity:.75}
  .visor button{font:inherit;font-weight:600;min-width:38px;padding:6px 12px;
       border:1px solid rgba(255,255,255,.3);border-radius:7px;
       background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
  .visor button:hover{background:rgba(255,255,255,.18)}
  .visor button:disabled{opacity:.3;cursor:default}
  .visor-ayuda{width:100%;text-align:center;padding:8px 20px 16px;
       color:rgba(255,255,255,.55);font-size:11.5px}