/* IA3 Instrument — sistema de diseño canónico de ORCHESTRATOR.
   Fuente de verdad: extraído de public/index.html (dashboard principal).
   Copiar este archivo tal cual dentro de cada módulo (static/) y enlazarlo
   con <link>. Si se actualiza aquí, propagar la copia a cada módulo. */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#0a0c0d;--panel:#111417;--panel2:#161a1e;--panel3:#1b2024;
  --rule:#23282b;--rule2:#323a3d;
  --ink:#e9e5da;--ink2:#9a9d94;--ink3:#8a8d86;
  --green:#5fa876;--green-dim:rgba(95,168,118,.16);
  --amber:#c9922f;--amber-dim:rgba(201,146,47,.16);
  --danger:#cf7057;--danger-dim:rgba(207,112,87,.16);
  --accent:#6fa3ac;--accent-dim:rgba(111,163,172,.16);
  --danger-ink:#e08a76;--on-accent:#0a1416;--bg-deep:#050708;
  color-scheme:dark;
}

html,body{height:100%;touch-action:manipulation;background:var(--bg);color:var(--ink);font-family:'Archivo',sans-serif;font-size:13.5px;line-height:1.5;font-feature-settings:'tnum' 1}
input,button,select,textarea{font-family:inherit;font-size:inherit}
.hidden{display:none!important}
.mono{font-family:'JetBrains Mono',monospace}
.cond{font-family:'Archivo Condensed',sans-serif}
::selection{background:var(--accent);color:#08110f}

/* ── faint instrument grid de fondo, opcional (añadir <body class="ia3-grid">) ── */
body.ia3-grid::before{content:'';position:fixed;inset:0;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:64px 64px;opacity:.35;pointer-events:none;z-index:0}

/* ══════════════════════════════════════════════
   TÍTULOS DE PÁGINA
══════════════════════════════════════════════ */
.page-header{margin-bottom:22px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.page-title{font-family:'Archivo Condensed',sans-serif;font-size:20px;font-weight:700;letter-spacing:.2px;text-transform:uppercase}
.page-sub{font-size:12px;color:var(--ink3);margin-top:3px}

/* ══════════════════════════════════════════════
   BOTONES — rectangulares, tracking, color solo funcional
══════════════════════════════════════════════ */
button{cursor:pointer;border:none;font-family:'Archivo Condensed',sans-serif;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.btn{padding:8px 14px;font-size:11.5px;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--rule2);background:transparent;color:var(--ink2);transition:border-color .15s,color .15s,background .15s}
.btn svg{width:12px;height:12px}
.btn:hover:not(:disabled){color:var(--ink);border-color:var(--ink3)}
.btn:disabled{opacity:.3;cursor:not-allowed}
.btn-go{background:var(--accent);color:var(--on-accent);border-color:var(--accent);width:100%;padding:11px;justify-content:center;font-size:12.5px}
.btn-go:hover{filter:brightness(1.08);color:var(--on-accent)}
.btn-primary{background:var(--accent-dim);color:var(--accent);border-color:rgba(111,163,172,.4)}
.btn-primary:hover{background:rgba(111,163,172,.26)}
.btn-start{color:var(--green);border-color:rgba(95,168,118,.35)}
.btn-start:hover:not(:disabled){background:var(--green-dim);border-color:var(--green)}
.btn-stop{color:var(--danger);border-color:rgba(181,87,63,.32)}
.btn-stop:hover:not(:disabled){background:var(--danger-dim);border-color:var(--danger)}
.btn-warn{color:var(--amber);border-color:rgba(201,146,47,.35)}
.btn-warn:hover:not(:disabled){background:var(--amber-dim);border-color:var(--amber)}
.btn-quiet{border-color:transparent;padding:6px 10px;font-size:11px}
.btn-quiet:hover{border-color:var(--rule2)}
.btn.sm{padding:5px 9px;font-size:10.5px}
.icon-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;color:var(--ink3)}
.icon-btn:hover{color:var(--ink);border-color:var(--rule2)}
.icon-btn svg{width:15px;height:15px}

/* ══════════════════════════════════════════════
   PANELES / MANIFEST — filas delimitadas, no tarjetas con sombra
══════════════════════════════════════════════ */
.panel-card{background:var(--panel);border:1px solid var(--rule);padding:18px 20px;margin-bottom:18px}
.panel-title{font-family:'Archivo Condensed',sans-serif;font-size:11px;font-weight:700;color:var(--ink3);text-transform:uppercase;letter-spacing:1.4px;margin-bottom:15px}

.manifest{border:1px solid var(--rule);background:var(--panel)}
.manifest-section + .manifest-section{border-top:1px solid var(--rule)}
.ms-head{display:flex;align-items:center;gap:10px;padding:9px 18px;background:var(--panel2);border-bottom:1px solid var(--rule)}
.ms-title{font-family:'Archivo Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink2)}
.ms-count{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink3)}

/* ══════════════════════════════════════════════
   LAMPS / ESTADO
══════════════════════════════════════════════ */
.lamp{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.lamp-actiu{background:var(--green);box-shadow:0 0 6px rgba(95,168,118,.6)}
.lamp-degradat{background:var(--amber);box-shadow:0 0 6px rgba(201,146,47,.6)}
.lamp-iniciant{background:var(--amber);animation:lamp-pulse 1s ease-in-out infinite}
.lamp-aturat{background:transparent;border:1.5px solid var(--ink3)}
.row-status-txt{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.3px;text-transform:uppercase;color:var(--ink2);white-space:nowrap}
.row-status-txt.is-actiu{color:var(--green)}
.row-status-txt.is-degradat{color:var(--amber)}
@keyframes lamp-pulse{0%,100%{opacity:1}50%{opacity:.35}}

.tag{display:inline-flex;align-items:center;padding:2px 7px;border:1px solid var(--rule2);font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink3);letter-spacing:.2px;white-space:nowrap}
.row-actions{display:flex;gap:5px;justify-content:flex-end}

/* ══════════════════════════════════════════════
   TARJETAS EN GRID
══════════════════════════════════════════════ */
.module-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:1px;background:var(--rule)}
.module-card{background:var(--panel);padding:16px 18px 14px;display:flex;flex-direction:column;gap:12px;transition:background .12s}
.module-card:hover{background:var(--panel2)}
@media(max-width:520px){.module-grid{grid-template-columns:1fr}}

/* ══════════════════════════════════════════════
   STAT STRIP
══════════════════════════════════════════════ */
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-bottom:22px}
@media(max-width:700px){.stats-row{grid-template-columns:1fr}}
.stat{background:var(--panel);padding:16px 20px}
.stat-val{font-family:'Archivo Condensed',sans-serif;font-size:30px;font-weight:700;letter-spacing:-.5px;color:var(--ink)}
.stat-label{font-size:11px;color:var(--ink3);margin-top:3px;text-transform:uppercase;letter-spacing:.5px}

/* ══════════════════════════════════════════════
   TABLAS
══════════════════════════════════════════════ */
.table-card{background:var(--panel);border:1px solid var(--rule)}
.table-toolbar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--rule)}
.table-toolbar h3{font-family:'Archivo Condensed',sans-serif;font-size:13px;font-weight:700;flex:1;text-transform:uppercase;letter-spacing:.4px}
table{width:100%;border-collapse:collapse}
th{padding:9px 14px;text-align:left;font-family:'Archivo Condensed',sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--ink3);background:var(--panel2);border-bottom:1px solid var(--rule)}
td{padding:9px 14px;font-size:12px;border-bottom:1px solid var(--rule);color:var(--ink2)}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--panel2)}
td .tx{color:var(--ink);font-weight:500}
.td-actions{display:flex;gap:6px}
.filters{display:flex;gap:8px;padding:11px 16px;border-bottom:1px solid var(--rule);flex-wrap:wrap}
.filters input,.filters select{background:var(--bg);border:1px solid var(--rule2);padding:6px 11px;color:var(--ink);font-size:11.5px}
.filters input:focus,.filters select:focus{border-color:var(--accent)}

/* ══════════════════════════════════════════════
   FORMULARIOS
══════════════════════════════════════════════ */
.field{margin-top:20px}
.field label{display:block;font-family:'Archivo Condensed',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);margin-bottom:7px}
.field input{width:100%;background:var(--bg);border:1px solid var(--rule2);padding:10px 12px;color:var(--ink);transition:border-color .15s}
.field input:focus{border-color:var(--accent)}
.form-group{margin-bottom:13px}
.form-group label{display:block;font-family:'Archivo Condensed',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--ink3);margin-bottom:6px}
.form-group input,.form-group select,.form-group textarea{width:100%;background:var(--bg);border:1px solid var(--rule2);padding:9px 11px;color:var(--ink)}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent)}
.checkbox-row{display:flex;align-items:center;gap:8px;margin-top:4px}
.checkbox-row input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent)}

/* ══════════════════════════════════════════════
   CONSOLE CARD (login / panel destacado único)
══════════════════════════════════════════════ */
.console{width:378px;max-width:100%;background:var(--panel);border:1px solid var(--rule2);position:relative;z-index:1;box-shadow:0 40px 90px rgba(0,0,0,.55)}
.console-bar{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--panel2);border-bottom:1px solid var(--rule)}
.console-bar img{width:20px;height:20px;object-fit:contain;opacity:.9}
.console-bar-txt{font-family:'Archivo Condensed',sans-serif;font-size:11px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink2)}
.console-lamp{width:6px;height:6px;border-radius:50%;background:var(--amber);margin-left:auto}
.console-body{padding:30px 28px 26px}
.console h1{font-family:'Archivo Condensed',sans-serif;font-size:21px;font-weight:700;letter-spacing:-.2px;color:var(--ink)}
.console-sub{color:var(--ink3);font-size:11.5px;margin-top:3px;letter-spacing:.3px}
.console .btn-go{margin-top:22px;width:100%}
.console .err{color:var(--danger-ink);font-size:11.5px;text-align:center;margin-top:12px;min-height:16px;font-family:'JetBrains Mono',monospace}

/* ══════════════════════════════════════════════
   MODALES
══════════════════════════════════════════════ */
.modal-overlay{position:fixed;inset:0;background:rgba(4,6,7,.82);z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}
.modal-box{background:var(--panel);border:1px solid var(--rule2);width:440px;max-width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-bottom:1px solid var(--rule);background:var(--panel2)}
.modal-header h2{font-family:'Archivo Condensed',sans-serif;font-size:13.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.modal-body{padding:20px;overflow-y:auto;flex:1}
.modal-footer{padding:13px 20px;border-top:1px solid var(--rule);display:flex;justify-content:flex-end;gap:8px}
.modal-err{color:var(--danger-ink);font-size:11.5px;margin-top:8px;font-family:'JetBrains Mono',monospace}

/* ══════════════════════════════════════════════
   TOASTS
══════════════════════════════════════════════ */
#toast-container{position:fixed;top:18px;right:18px;z-index:9999;display:flex;flex-direction:column;gap:7px;pointer-events:none}
.toast{min-width:250px;max-width:380px;padding:11px 13px;font-size:12px;font-weight:500;line-height:1.4;display:flex;align-items:flex-start;gap:9px;pointer-events:all;animation:toast-in .2s ease;box-shadow:0 8px 28px rgba(0,0,0,.5);border:1px solid var(--rule2);background:var(--panel)}
.toast.out{animation:toast-out .2s ease forwards}
.toast-icon{flex-shrink:0;margin-top:1px}
.toast-icon svg{width:14px;height:14px}
.toast-msg{flex:1;color:var(--ink)}
.toast-close{cursor:pointer;opacity:.6;font-size:15px;line-height:1;flex-shrink:0;padding:0 2px;color:var(--ink2);background:transparent;border:0;text-transform:none}
.toast-close:hover{opacity:1}
.toast-success .toast-icon{color:var(--green)}
.toast-error .toast-icon{color:var(--danger)}
.toast-info .toast-icon{color:var(--accent)}
.toast-warning .toast-icon{color:var(--amber)}
@keyframes toast-in{from{transform:translateX(110%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes toast-out{from{transform:translateX(0);opacity:1}to{transform:translateX(110%);opacity:0}}

/* ══════════════════════════════════════════════
   SCROLLBAR
══════════════════════════════════════════════ */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--panel)}
::-webkit-scrollbar-thumb{background:var(--rule2)}
::-webkit-scrollbar-thumb:hover{background:var(--ink3)}

/* ══════════════════════════════════════════════
   ACCESIBILIDAD — foco, objetivos táctiles, movimiento reducido
══════════════════════════════════════════════ */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:0;box-shadow:0 0 0 3px var(--accent-dim)}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:10000;background:var(--accent);color:var(--on-accent);padding:8px 14px;font-family:'Archivo Condensed',sans-serif;text-transform:uppercase;letter-spacing:.5px}
.skip-link:focus{left:8px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(pointer:coarse){
  .btn,.btn.sm,.btn-quiet{min-height:40px}
  .icon-btn{width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}