/* Printia Ops — consola oscura, distinta de Printia para no confundirse de pantalla */
:root,[data-theme="ops"]{
  --fondo:#0e131c; --panel:#151c28; --panel2:#121925; --linea:rgba(255,255,255,.07); --linea2:rgba(255,255,255,.14);
  --texto:#e8edf4; --suave:#9aa6b8; --suave2:#c7d0dd;
  --acento:#7cc4ff; --acento-t:#9fd3ff; --ok:#5ad2a0; --ok-t:#7ee0b7; --aviso:#f2b84b; --aviso-t:#f6cc7a; --peligro:#ff8a7a; --peligro-t:#ffb3a8;
  --acento-fg:#0e131c; --peligro-fg:#0e131c; --hover:#1b2433;
  --mono:'JetBrains Mono',ui-monospace,monospace; --disp:'Bricolage Grotesque',sans-serif;
  color-scheme:dark;
}
/* Temas de Printia: sus variables (--bg, --card, --text, --accent…) se traducen a las de Ops */
[data-theme]:not([data-theme="ops"]){
  --fondo:var(--bg); --panel:var(--card); --panel2:var(--surface); --linea:var(--border);
  --linea2:color-mix(in srgb,var(--text) 20%,transparent);
  --texto:var(--text); --suave:var(--text2); --suave2:color-mix(in srgb,var(--text) 70%,var(--text2));
  --acento:var(--accent); --acento-t:var(--accent); --acento-fg:var(--accent-fg,#fff);
  --ok:var(--success); --ok-t:var(--success); --aviso:var(--warning); --aviso-t:var(--warning);
  --peligro:var(--danger); --peligro-t:var(--danger); --peligro-fg:#fff;
  --hover:color-mix(in srgb,var(--text) 6%,var(--card));
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fondo);color:var(--texto);font-family:'Manrope',system-ui,sans-serif;font-size:15px}
a{color:var(--acento-t)} a:hover{color:var(--texto)}
button,input,select{font:inherit;color:inherit}
.mono{font-family:var(--mono)}
small{display:block;color:var(--suave);font-size:12.5px;margin-top:2px}
h1{margin:0;font-family:var(--disp);font-size:30px;letter-spacing:-.02em}
h2{margin:0;font-family:var(--disp);font-size:20px}
[hidden]{display:none!important}

.btn{display:inline-flex;align-items:center;gap:8px;border:none;border-radius:12px;padding:12px 18px;font-weight:800;font-size:14px;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn.chico{padding:8px 13px;font-size:13px;border-radius:10px}
.btn.prim{background:var(--acento);color:var(--acento-fg)} .btn.prim:hover{filter:brightness(1.08);color:var(--acento-fg)}
.btn.sec{background:transparent;border:1px solid var(--linea2);color:var(--texto)} .btn.sec:hover{background:color-mix(in srgb,var(--texto) 5%,transparent);color:var(--texto)}
.btn.peligro{background:transparent;border:1px solid color-mix(in srgb,var(--peligro) 45%,transparent);color:var(--peligro-t)}
.btn.rojo{background:var(--peligro);color:var(--peligro-fg)}
.btn:disabled{background:color-mix(in srgb,var(--texto) 8%,transparent);color:var(--suave);cursor:not-allowed;border-color:transparent}
.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--acento);outline-offset:2px}

.pill{font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:999px;white-space:nowrap}
.pill.verde{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok-t)} .pill.azul{background:color-mix(in srgb,var(--acento) 16%,transparent);color:var(--acento-t)}
.pill.ambar{background:color-mix(in srgb,var(--aviso) 16%,transparent);color:var(--aviso-t)} .pill.rojo{background:color-mix(in srgb,var(--peligro) 16%,transparent);color:var(--peligro-t)}
.pill.gris{background:color-mix(in srgb,var(--texto) 8%,transparent);color:var(--suave2)}

/* barra */
.barra{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 32px;border-bottom:1px solid var(--linea);flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:12px} .marca b{font-family:var(--disp);font-size:19px;display:block}
.marca small{font-size:11.5px}
.logo{width:34px;height:34px;border-radius:10px;background:var(--acento);color:var(--acento-fg);display:inline-flex;align-items:center;justify-content:center}
nav{display:flex;gap:4px;background:color-mix(in srgb,var(--texto) 5%,transparent);padding:4px;border-radius:12px}
nav a{border-radius:9px;padding:9px 16px;font-weight:700;font-size:13.5px;color:var(--suave2);text-decoration:none}
nav a[aria-current]{background:var(--texto);color:var(--fondo)}
.yo{display:flex;align-items:center;gap:12px;margin:0} .yo span{font-size:13px;color:var(--suave)}

/* salud */
.salud{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;padding:22px 32px 6px}
.tarjeta{background:var(--panel);border:1px solid var(--linea);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.eti{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--suave)}
.eti.azul{color:var(--acento-t)} .eti.ambar{color:var(--aviso-t)} .eti.rojo{color:var(--peligro-t)}
.num{font-family:var(--disp);font-size:clamp(19px,1.6vw,24px);font-weight:700;white-space:nowrap}
.nota{font-size:12.5px;color:var(--suave)}
.barrita{height:6px;border-radius:99px;background:color-mix(in srgb,var(--texto) 8%,transparent);overflow:hidden} .barrita div{height:6px;border-radius:99px}

main{padding:18px 32px 40px;display:flex;flex-direction:column;gap:20px;max-width:1500px}
.titulo{display:flex;align-items:flex-end;justify-content:space-between;gap:20px} .titulo p{margin:4px 0 0;color:var(--suave);font-size:14px}
.sub-titulo{display:flex;align-items:baseline;gap:12px;margin-top:8px;flex-wrap:wrap} .sub-titulo span{color:var(--suave);font-size:13px}
.vacio{color:var(--suave)}
.err{color:var(--peligro-t);font-size:13.5px;margin:0}

/* tenants */
.tenant{background:var(--panel);border:1px solid var(--linea);border-radius:20px;overflow:hidden}
.tenant.abierto{border-color:color-mix(in srgb,var(--acento) 45%,transparent)}
.tenant .fila{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr)) auto;gap:18px;align-items:center;padding:18px 22px}
.tenant .err{padding:0 22px 14px}
.nom .lin{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .nombre{font-family:var(--disp);font-weight:700;font-size:21px}
.nom a{font-size:12.5px}
.dato{display:flex;flex-direction:column;gap:3px;min-width:0} .dato b{font-size:18px} .dato .mono{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5}
.botones{display:flex;gap:8px}
.acciones{border-top:1px solid var(--linea);background:var(--panel2);padding:16px 22px 18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.grupo{display:flex;flex-direction:column;gap:8px}
.grupo button{cursor:pointer;text-align:left;border:1px solid var(--linea);background:var(--panel);border-radius:12px;padding:11px 13px;font-weight:800;font-size:13.5px}
.grupo button:hover:not(:disabled){background:var(--hover)}
.grupo button.cuidado{border-color:color-mix(in srgb,var(--aviso) 35%,transparent)} .grupo button.riesgo{border-color:color-mix(in srgb,var(--peligro) 40%,transparent)}
.grupo button:disabled{opacity:.5;cursor:not-allowed}
.legacy{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.legacy .lin{display:flex;justify-content:space-between;align-items:center}
.kv{display:flex;justify-content:space-between;font-size:13px} .kv span:first-child{color:var(--suave)}

/* respaldos */
.tabla{background:var(--panel);border:1px solid var(--linea);border-radius:18px;overflow:hidden}
.tabla .th,.tabla .tr{display:grid;grid-template-columns:1.7fr 1fr 1.3fr .6fr 1.2fr;gap:12px;align-items:center;padding:12px 20px}
.tabla .th{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--suave);border-bottom:1px solid var(--linea)}
.tabla .tr{border-bottom:1px solid color-mix(in srgb,var(--texto) 5%,transparent);font-size:13.5px} .tabla .tr .mono{font-size:12.5px;word-break:break-all}
.tabla .der{display:flex;justify-content:flex-end;gap:8px;text-align:right} .motivo{color:var(--suave2)}
.tabla .vacio{padding:16px 20px;margin:0}

/* bitácora */
.bitacora{display:flex;flex-direction:column;gap:10px}
.reg{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:16px;align-items:center;flex-direction:row}
.reg .hora{font-size:12.5px;color:var(--suave)}

/* entrada */
.entrada{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;max-width:none}
.caja{width:380px;max-width:100%;background:var(--panel);border:1px solid color-mix(in srgb,var(--texto) 8%,transparent);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:16px}
.caja.ancha{width:440px} .caja .marca span{font-family:var(--disp);font-weight:700;font-size:20px}
.caja h1{font-size:24px} .caja .sub{margin:0;color:var(--suave);font-size:13.5px}
label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700}
input,select{background:var(--fondo);border:1.5px solid var(--linea2);border-radius:12px;padding:12px 13px;font-size:15px;font-weight:500;outline:none}
input:focus{border-color:var(--acento)}
input.codigo{font-size:20px;letter-spacing:.2em;text-align:center}
input[readonly].mono{font-size:13px;letter-spacing:.02em;text-align:center}
.qr{background:#fff;border-radius:14px;padding:14px;align-self:center;line-height:0} .qr svg{width:220px;height:220px}
.pie{margin:0;text-align:center;font-size:12px;color:var(--suave)}

/* modal */
dialog{background:var(--fondo);color:var(--texto);border:1px solid var(--linea2);border-radius:22px;padding:0;width:600px;max-width:calc(100vw - 32px)}
dialog::backdrop{background:rgba(5,8,14,.7)}
#modalCuerpo{padding:26px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 80px);overflow:auto}
.m-cab small{font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--aviso-t);margin:0}
.m-cab h2{font-size:26px;margin-top:4px} .m-cab p{margin:6px 0 0;color:var(--suave);font-size:14px}
.m-caja{background:var(--panel);border:1px solid var(--linea);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.m-fila{display:flex;justify-content:space-between;gap:12px;font-size:14px} .m-fila .mono{font-weight:600}
.m-aviso{background:color-mix(in srgb,var(--acento) 9%,transparent);border:1px solid color-mix(in srgb,var(--acento) 32%,transparent);border-radius:14px;padding:12px 15px;font-size:13.5px;color:var(--texto)}
.m-bloqueo{background:color-mix(in srgb,var(--peligro) 10%,transparent);border:1px solid color-mix(in srgb,var(--peligro) 40%,transparent);border-radius:14px;padding:12px 15px;font-size:14px;color:var(--peligro-t)}
.m-pie{display:flex;justify-content:flex-end;gap:10px}
.m-ok{border-color:color-mix(in srgb,var(--ok) 35%,transparent)} .m-ok .paso{display:flex;gap:10px;align-items:center;font-size:14px} .m-ok .paso::before{content:"✓";color:var(--ok-t);font-weight:800}
.opciones{display:flex;flex-direction:column;gap:8px}
.opcion{cursor:pointer;text-align:left;border:1.5px solid color-mix(in srgb,var(--texto) 10%,transparent);background:var(--panel);border-radius:14px;padding:12px 14px}
.opcion[aria-pressed="true"]{border-color:var(--acento);background:color-mix(in srgb,var(--acento) 9%,transparent)}
.opcion b{display:block;font-size:14px}
.slug{background:var(--panel);border:1.5px solid var(--linea2);border-radius:12px;padding:12px 13px;font-family:var(--mono);font-size:14px;display:flex;align-items:center}
.slug input{background:transparent;border:none;padding:0;font-family:var(--mono);font-size:14px;color:var(--acento-t);width:20.5ch;min-width:0;border-radius:0}
.slug span{color:var(--suave)}
.secreto{font-family:var(--mono);font-size:20px;letter-spacing:.06em;background:var(--panel);border:1px dashed var(--aviso);border-radius:12px;padding:12px;text-align:center;user-select:all}
.cargando{opacity:.6;pointer-events:none}

@media (max-width:1100px){
  .salud{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tenant .fila{grid-template-columns:1fr 1fr} .botones{grid-column:1/-1}
  .acciones,.legacy{grid-template-columns:1fr}
  .tabla .th{display:none} .tabla .tr{grid-template-columns:1fr} .tabla .der{justify-content:flex-start}
}
@media (max-width:640px){
  .barra,main,.salud{padding-left:16px;padding-right:16px}
  .salud{grid-template-columns:1fr} .tenant .fila{grid-template-columns:1fr} .titulo{flex-direction:column;align-items:flex-start}
  .reg{grid-template-columns:1fr}
}

/* selector de tema */
.tema{display:flex;flex-direction:row;align-items:center;gap:8px;font-weight:700;font-size:12px;color:var(--suave)}
.tema select{padding:6px 8px;font-size:12.5px;border-radius:9px;background:var(--panel)}

/* panel de arte ASCII (izquierda, pantallas anchas) */
.arte{display:none}
@media (min-width:1200px){
  :root{--arte-w:clamp(260px,24vw,380px)}
  body.con-arte{padding-left:var(--arte-w)}
  .arte{display:block;position:fixed;left:0;top:0;bottom:0;width:var(--arte-w);background:var(--panel2);border-right:1px solid var(--linea);overflow:hidden;z-index:1}
  .arte canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.9}
  .arte-pie{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:linear-gradient(transparent,var(--panel2) 45%);font-size:11.5px;color:var(--suave)}
  .arte-pie button{background:transparent;border:1px solid var(--linea2);color:var(--suave);border-radius:8px;padding:4px 10px;font-size:11.5px;font-weight:700;cursor:pointer}
  .arte-pie button:hover{color:var(--texto)}
}