:root{--azul:#5DA2E8;--azul2:#2E6FB5;--amarillo:#F4D33A;--amarillo2:#C9A41C;--negro:#0B0F14;--panel:#131A22;--panel2:#18222D;--linea:#243040;--txt:#E8EEF6;--muted:#93A4B8;--ok:#39B97A;--warn:#E8B44B;--peligro:#E86A6A}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--negro);color:var(--txt);font-family:'Segoe UI',system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.5}
a{color:var(--azul);text-decoration:none}
h1,h2,h3{font-weight:700}
.top{display:flex;align-items:center;gap:18px;padding:12px 18px;background:#0E151C;border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20}
.marca{font-size:18px;font-weight:800;color:#fff;letter-spacing:-.3px}
.marca em{font-style:normal;color:var(--amarillo)}
.top nav{display:flex;gap:14px;flex-wrap:wrap;font-size:13px}
.top nav a{color:var(--muted);font-weight:600}
.top nav a:hover{color:var(--amarillo)}
.quien{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.salir{color:var(--muted);border:1px solid var(--linea);padding:5px 10px;border-radius:8px}
.salir:hover{color:#fff;border-color:var(--azul)}
main{padding:18px;max-width:1500px;margin:0 auto}
.pie{margin-top:26px;padding:18px;text-align:center;color:#5C6B7E;font-size:12px;border-top:1px solid var(--linea)}
.aviso{padding:9px 13px;border-radius:9px;margin-bottom:14px;font-size:13px}
.aviso.ok{background:#12281E;border:1px solid #1E4934;color:#8FE3B5}
.aviso.err{background:#2A1618;border:1px solid #5A2A2E;color:#F0A0A0}
.card{background:var(--panel);border:1px solid var(--linea);border-radius:14px;padding:16px;margin-bottom:14px}
.grid2{display:grid;grid-template-columns:2fr 1fr;gap:14px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
label{display:block;font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
input,select,textarea{width:100%;background:#0E151C;border:1px solid var(--linea);color:var(--txt);border-radius:9px;padding:9px 11px;font:inherit;font-size:13.5px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--azul)}
.campo{margin-bottom:11px}
.btn{display:inline-block;background:var(--azul);color:#05121F;font-weight:700;border:none;border-radius:9px;padding:9px 15px;cursor:pointer;font-size:13.5px}
.btn:hover{background:#7BB4EE}
.btn.ghost{background:transparent;border:1px solid var(--linea);color:var(--txt)}
.btn.ghost:hover{border-color:var(--azul);color:#fff}
.btn.ok{background:var(--ok);color:#04120A}
.btn.mini{padding:5px 9px;font-size:12px}
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:12px;overflow-x:auto;padding-bottom:8px}
.col{background:var(--panel);border:1px solid var(--linea);border-radius:12px;padding:10px;min-height:150px}
.col h3{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:9px;display:flex;justify-content:space-between;gap:6px}
.col h3 b{color:var(--azul)}
.orden{display:block;background:var(--panel2);border:1px solid var(--linea);border-radius:10px;padding:9px;margin-bottom:8px;color:var(--txt)}
.orden:hover{border-color:var(--azul)}
.orden .n{font-weight:800;color:var(--azul);font-size:13px}
.orden .m{color:var(--muted);font-size:11.5px}
.tag{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;margin-top:5px}
.urgente{background:#3A1F22;color:#F0A0A0;border:1px solid #5A2A2E}
.normal{background:#1C2A38;color:var(--azul);border:1px solid #27435C}
.tabla{width:100%;border-collapse:collapse;font-size:13px}
.tabla th{text-align:left;color:var(--muted);font-size:10.5px;text-transform:uppercase;padding:7px 9px;border-bottom:1px solid var(--linea)}
.tabla td{padding:8px 9px;border-bottom:1px solid #1B2530;vertical-align:top}
.tabla tr.fila-atrasada td{background:#221417}
.tabla tr.fila-atrasada td:first-child{box-shadow:inset 3px 0 0 var(--peligro)}
.alerta{display:flex;flex-direction:column;gap:2px;background:#2A1618;border:1px solid #5A2A2E;color:#F5B7B7;border-radius:12px;padding:11px 15px;margin-bottom:14px}
.alerta b{color:#FF9B9B;font-size:14px}
.alerta span{color:#C98A8A;font-size:12px}
.alerta:hover{border-color:var(--peligro)}
.badge{display:inline-block;min-width:18px;text-align:center;background:var(--peligro);color:#1A0A0A;font-weight:800;font-size:10.5px;border-radius:20px;padding:1px 6px;margin-left:3px}
.tag.atrasada{background:#3A1F22;color:#FFB0B0;border:1px solid #6A3238}
.tag.hoy{background:#3A3016;color:#F0D08A;border:1px solid #5E4C1C}
.ok-tag{background:#12281E;color:#8FE3B5;border:1px solid #1E4934}
.kpi{background:var(--panel2);border:1px solid var(--linea);border-top:3px solid var(--amarillo);border-radius:12px;padding:12px 14px}
.kpi .l{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.kpi .v{font-size:18px;font-weight:800;margin-top:3px}
.barra-caja{background:#0E151C;border:1px solid var(--linea);border-radius:20px;height:12px;overflow:hidden}
.barra{height:100%;background:linear-gradient(90deg,var(--azul2),var(--azul));border-radius:20px;min-width:2px}
.amarillo{color:var(--amarillo)}
.top{border-bottom:1px solid var(--linea)}
.orden.atrasada-card{border-color:#6A3238;background:#1E1418}
.orden.atrasada-card:hover{border-color:var(--peligro)}
.pasos{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.paso{font-size:11px;padding:4px 10px;border-radius:20px;border:1px solid var(--linea);color:var(--muted)}
.paso.on{background:var(--azul);border-color:var(--azul);color:#05121F;font-weight:700}
.paso.now{background:#1C2A38;border-color:var(--azul);color:var(--azul);font-weight:700}
.datos{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0}
.dato{background:var(--panel2);border:1px solid var(--linea);border-radius:10px;padding:9px 12px;min-width:150px}
.dato .l{font-size:10px;color:var(--muted);text-transform:uppercase}
.dato .v{font-size:14px;font-weight:600}
.tl{border-left:2px solid var(--linea);padding-left:14px;margin-top:8px}
.tl div{margin-bottom:8px;font-size:12.5px;color:var(--muted)}
.tl div b{color:var(--txt)}
.chip{display:inline-block;background:#1C2A38;border:1px solid #27435C;color:var(--azul);border-radius:20px;padding:2px 9px;font-size:11px;margin:0 4px 4px 0}
.login{max-width:380px;margin:8vh auto;padding:26px}
.login .marca{font-size:24px;display:block;text-align:center;margin-bottom:6px}
.login .sub{text-align:center;color:var(--muted);font-size:13px;margin-bottom:20px}