/* CEO Workspace V1 — tokens del Design System V1 + estilos del Despacho.
   Fuente de verdad de valores: workspace/design-system/design-system-v1.md */

:root {
  /* Tinta */
  --ink-900:#1A1D21; --ink-700:#4A4F57; --ink-500:#6B7280; --ink-300:#C7CBD1;
  --ink-200:#E2E5EA; --ink-100:#F1F3F5; --paper:#FAFAF8; --surface:#FFFFFF;
  /* Acento */
  --accent-600:#1F3A5F; --accent-500:#2B4E7E; --accent-100:#EAF0F7;
  /* Semánticos */
  --sano:#2E7D5B; --sano-bg:#E7F1EC; --atencion:#B7791F; --atencion-bg:#FBF3E2;
  --critico:#B4232A; --critico-bg:#FBEAEA; --bloqueado:#A14D2A; --bloqueado-bg:#F6EBE3;
  --sindato:#9AA0A8; --sindato-bg:#F1F3F5; --ia:#5B4B9E; --ia-bg:#EEEBF7;
  --interp:#1F6F76; --interp-bg:#E4F0F0;
  /* Espaciado / radios / sombras */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  --r-sm:4px; --r-md:8px; --r-lg:12px; --r-pill:999px;
  --sh-sm:0 1px 2px rgba(16,24,40,.05); --sh-md:0 2px 8px rgba(16,24,40,.08); --sh-lg:0 8px 24px rgba(16,24,40,.10);
  --dur-fast:120ms; --dur-base:180ms; --dur-slow:220ms; --ease:cubic-bezier(0.2,0,0,1);
  --content:880px;
  --sans:"Inter","Söhne",-apple-system,"Segoe UI",sans-serif;
  --serif:"Newsreader","Source Serif 4",Georgia,serif;
}
* { box-sizing:border-box; }
html,body { margin:0; padding:0; }
body {
  background:var(--paper); color:var(--ink-900);
  font-family:var(--sans); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
}
@media (prefers-reduced-motion:reduce){ *{transition:none!important;animation:none!important;} }

/* ---- Estructura ---- */
.app { max-width:1200px; margin:0 auto; }
.lectura { max-width:var(--content); margin:0 auto; padding:var(--s5) var(--s4) var(--s8); }

/* ---- PulseBar ---- */
.pulso {
  position:sticky; top:0; z-index:5; background:var(--paper);
  border-bottom:1px solid var(--ink-200);
  padding:var(--s4); display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
}
.pulso .marca { font-family:var(--serif); font-size:16px; font-weight:600; color:var(--ink-900); letter-spacing:.01em; white-space:nowrap; }
.pulso .cifras { font-size:13px; color:var(--ink-500); }
.pulso .cifras b { color:var(--ink-700); font-weight:600; }

/* ---- Título de pantalla ---- */
.titulo-pantalla { font-family:var(--serif); font-size:28px; font-weight:600; line-height:1.2; margin:var(--s6) 0 var(--s2); }
.subtitulo { color:var(--ink-500); font-size:13px; margin-bottom:var(--s5); }

/* ---- SectionHeader ---- */
.seccion-cab { display:flex; align-items:baseline; gap:var(--s2); margin:var(--s6) 0 var(--s3); }
.seccion-cab h2 { font-size:18px; font-weight:600; margin:0; color:var(--ink-900); }
.seccion-cab .cuenta { font-size:12px; color:var(--ink-500); background:var(--ink-100); border-radius:var(--r-pill); padding:1px var(--s2); }

/* ---- JudgmentCard ---- */
.tarjeta { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-md);
  box-shadow:var(--sh-sm); padding:var(--s5); margin-bottom:var(--s3); transition:box-shadow var(--dur-base) var(--ease); }
.tarjeta.sale { opacity:0; transform:translateY(-4px); transition:all var(--dur-slow) var(--ease); }
.tarjeta .titular { font-size:16px; font-weight:500; color:var(--ink-900); margin:0 0 var(--s2); }
.tarjeta .contexto { color:var(--ink-700); font-size:14px; margin:0 0 var(--s4); }
.tarjeta .contexto .ref { color:var(--ink-500); font-size:12px; }
.tarjeta .actos { display:flex; gap:var(--s2); flex-wrap:wrap; }

/* barra izquierda de severidad */
.tarjeta.sev-critico { border-left:3px solid var(--critico); }
.tarjeta.sev-bloqueado { border-left:3px solid var(--bloqueado); }
.tarjeta.sev-atencion { border-left:3px solid var(--atencion); }

/* ---- ActButton ---- */
.btn { font:inherit; font-size:13px; font-weight:500; border-radius:var(--r-md);
  padding:var(--s2) var(--s4); cursor:pointer; border:1px solid transparent; transition:all var(--dur-fast) var(--ease); }
.btn:focus-visible { outline:2px solid var(--accent-600); outline-offset:2px; }
.btn-primary { background:var(--accent-600); color:#fff; }
.btn-primary:hover { background:var(--accent-500); }
.btn-secondary { background:var(--surface); color:var(--ink-900); border-color:var(--ink-300); }
.btn-secondary:hover { background:var(--ink-100); }
.btn-irreversible { background:var(--surface); color:var(--critico); border-color:var(--critico); }
.btn-irreversible:hover { background:var(--critico-bg); }
.btn-ghost { background:transparent; color:var(--accent-600); border-color:transparent; padding-left:var(--s2); padding-right:var(--s2); }
.btn-ghost:hover { text-decoration:underline; }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-nota { font-size:12px; color:var(--ink-500); align-self:center; }

/* ---- StatusDot ---- */
.dot { display:inline-block; width:9px; height:9px; border-radius:var(--r-pill); margin-right:var(--s2); vertical-align:middle; }
.dot-sano{background:var(--sano);} .dot-atencion{background:var(--atencion);}
.dot-critico{background:var(--critico);} .dot-bloqueado{background:var(--bloqueado);} .dot-sindato{background:var(--sindato);}

/* ---- EmptyState ---- */
.vacio { text-align:center; padding:var(--s8) var(--s4); color:var(--ink-500); }
.vacio .mensaje { font-family:var(--serif); font-size:20px; color:var(--ink-700); margin-bottom:var(--s2); }
.vacio .sub { font-size:13px; }

/* ---- estados de carga / error ---- */
.skeleton { background:linear-gradient(90deg,var(--ink-100) 25%,#e9ecef 37%,var(--ink-100) 63%);
  background-size:400% 100%; animation:sk 1200ms ease infinite; border-radius:var(--r-md); }
@keyframes sk { 0%{background-position:100% 0} 100%{background-position:0 0} }
.sk-linea { height:14px; margin:var(--s2) 0; } .sk-tarjeta { height:110px; margin-bottom:var(--s3); }
.banner-error { background:var(--critico-bg); border:1px solid var(--critico); color:var(--critico);
  border-radius:var(--r-md); padding:var(--s4); margin:var(--s5) 0; display:flex; justify-content:space-between; align-items:center; }

/* ---- ConfirmDialog ---- */
.velo { position:fixed; inset:0; background:rgba(16,24,40,.35); display:flex; align-items:center; justify-content:center; z-index:20; }
.dialogo { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh-lg); padding:var(--s6);
  max-width:440px; width:calc(100% - var(--s6)); }
.dialogo h3 { font-family:var(--serif); font-size:20px; margin:0 0 var(--s3); }
.dialogo .consec { color:var(--ink-700); margin:0 0 var(--s2); }
.dialogo .coste { color:var(--ink-500); font-size:13px; margin:0 0 var(--s5); }
.dialogo .campo { width:100%; font:inherit; padding:var(--s2) var(--s3); border:1px solid var(--ink-300);
  border-radius:var(--r-md); margin-bottom:var(--s5); }
.dialogo .botonera { display:flex; justify-content:flex-end; gap:var(--s2); }
.resultado { margin-top:var(--s4); font-size:13px; }
.resultado.ok { color:var(--sano); } .resultado.err { color:var(--critico); }
.tarjeta .resultado.err { background:var(--critico-bg); border-radius:var(--r-sm); padding:var(--s2) var(--s3); }

@media (max-width:600px){
  .lectura { padding:var(--s4) var(--s3) var(--s7); }
  .pulso { flex-wrap:wrap; gap:var(--s2); }
  .tarjeta .actos .btn { flex:1 1 auto; }
  .velo { align-items:flex-end; } .dialogo { width:100%; border-radius:var(--r-lg) var(--r-lg) 0 0; }
}

/* ---- Pantalla 04 — Proyecto ---- */
.cab-meta { border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface);
  padding:var(--s4) var(--s5); margin-bottom:var(--s5); }
.cab-linea { display:flex; gap:var(--s3); padding:var(--s1) 0; font-size:14px; }
.cab-etq { color:var(--ink-500); min-width:110px; font-size:13px; }
.cab-val.pendiente { color:var(--critico); font-weight:500; }

.veredicto { display:flex; align-items:center; gap:var(--s2); font-size:16px; font-weight:500;
  border-radius:var(--r-md); padding:var(--s4) var(--s5); margin-bottom:var(--s5); border:1px solid var(--ink-200); }
.veredicto-sano { background:var(--sano-bg); border-color:var(--sano); }
.veredicto-critico { background:var(--critico-bg); border-color:var(--critico); }
.veredicto-bloqueado { background:var(--bloqueado-bg); border-color:var(--bloqueado); }

.dot-encurso { background:var(--accent-600); }

.paso-fila { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-md);
  padding:var(--s3) var(--s4); margin-bottom:var(--s2); }
.paso-cab { display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap; }
.paso-id { font-size:12px; color:var(--ink-500); min-width:28px; }
.paso-nombre { font-size:14px; font-weight:500; flex:1; }
.chip-flag { font-size:11px; font-weight:500; color:var(--bloqueado); background:var(--bloqueado-bg);
  border-radius:var(--r-pill); padding:1px var(--s2); }
.badge-nivel { font-size:11px; color:var(--ink-500); background:var(--ink-100);
  border-radius:var(--r-pill); padding:1px var(--s2); margin-left:var(--s2); }
.paso-sub { font-size:12px; color:var(--ink-500); margin:var(--s1) 0 var(--s2) 36px; }
.paso-fila .actos { margin-left:36px; }
.paso-detalle { margin:var(--s3) 0 0 36px; border-top:1px solid var(--ink-100); padding-top:var(--s3);
  font-size:13px; color:var(--ink-700); }
.paso-detalle p { margin:0 0 var(--s2); }
.detalle-titulo { font-weight:600; color:var(--ink-900); }
.criterio { color:var(--ink-700); }
.recordatorio { color:var(--interp); font-size:12px; }

.pie-fijo { position:sticky; bottom:0; background:var(--surface); border-top:1px solid var(--ink-200);
  box-shadow:0 -2px 8px rgba(16,24,40,.06); padding:var(--s3) var(--s5); display:flex; gap:var(--s3);
  align-items:baseline; max-width:1200px; margin:0 auto; }
.pie-etiqueta { font-size:11px; font-weight:600; color:var(--ink-500); text-transform:uppercase; letter-spacing:.04em; }
.pie-texto { font-size:14px; color:var(--ink-900); }

.sin-dato { color:var(--ink-500); font-size:13px; margin:var(--s2) 0 var(--s4); }
.memoria-item { font-size:14px; color:var(--ink-700); margin:var(--s1) 0; }
.vacio.compacto { padding:var(--s4); text-align:left; }
.vacio.compacto .mensaje { font-size:15px; }

/* ---- FigureWithBasis ---- */
.figura.sin { color:var(--sindato); }
.figura-tag { font-size:11px; color:var(--atencion); background:var(--atencion-bg);
  border-radius:var(--r-pill); padding:0 var(--s2); }
.nota-ia { font-size:12px; color:var(--ia); background:var(--ia-bg); border-radius:var(--r-sm);
  padding:var(--s2) var(--s3); margin:var(--s3) 0; }

/* ---- Pantalla 06 — Organización ---- */
.depts { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:var(--s3); margin-bottom:var(--s5); }
.dept { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-md); padding:var(--s3) var(--s4); }
.dept.vacio-dept { background:var(--ink-100); border-style:dashed; }
.dept-nombre { font-weight:600; font-size:14px; margin-bottom:var(--s2); }
.dept-rol { font-size:13px; color:var(--ink-700); padding:1px 0; }

/* ---- Pantalla 07 — Biblioteca ---- */
.salas { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:var(--s3); margin:var(--s4) 0 var(--s6); }
.sala { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-md); padding:var(--s4);
  cursor:pointer; transition:box-shadow var(--dur-fast) var(--ease); }
.sala:hover { box-shadow:var(--sh-md); }
.sala.activa { border-color:var(--accent-600); background:var(--accent-100); }
.sala-nombre { font-weight:600; font-size:15px; }
.sala-cuenta { color:var(--ink-500); font-size:13px; }
.entrada-sintesis { font-family:var(--serif); font-size:17px; line-height:1.5; color:var(--ink-700);
  border-left:3px solid var(--accent-600); padding:var(--s2) var(--s4); margin:var(--s4) 0 var(--s5); }
.biografia { background:var(--ink-100); border-radius:var(--r-md); padding:var(--s4); margin-top:var(--s3); }
.bio-preg { font-weight:600; font-size:13px; color:var(--ink-900); margin-top:var(--s3); }
.bio-resp { font-size:13px; color:var(--ink-700); }

/* ---- Pantalla 08 — Sala de Máquinas ---- */
.veredicto-sistema { display:flex; align-items:center; gap:var(--s3); font-family:var(--serif); font-size:22px;
  font-weight:600; border-radius:var(--r-md); padding:var(--s5); margin-bottom:var(--s6); border:1px solid; }
.provtag { font-size:10.5px; font-weight:600; letter-spacing:.01em; border-radius:var(--r-pill);
  padding:1px 7px; margin-left:var(--s2); vertical-align:middle; }
.provtag.hecho { color:var(--ink-500); background:var(--ink-100); }
.provtag.interpretacion { color:var(--atencion); background:var(--atencion-bg); }
.provtag.ia { color:var(--ia); background:var(--ia-bg); }
.metrica { display:flex; justify-content:space-between; padding:var(--s2) 0; border-bottom:1px solid var(--ink-100); font-size:14px; }
.metrica .val { font-weight:600; }

/* ---- Navegación global ---- */
.nav-app { font-size:13px; display:flex; flex-wrap:wrap; gap:0; align-items:center; }
.nav-link { color:var(--ink-500); text-decoration:none; padding:2px var(--s1); }
.nav-link:hover { color:var(--accent-600); }
.nav-link.activa { color:var(--ink-900); font-weight:600; }
@media (max-width:600px){ .nav-app { font-size:12px; } }

/* ---- Capa de acceso (DEC-008): login, sesión y empresa activa ----
   Solo tokens del Design System V1; ningún valor nuevo. */
.login-lienzo { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:var(--s5); }
.login-caja { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-lg);
  box-shadow:var(--sh-md); padding:var(--s6); width:100%; max-width:360px; display:flex; flex-direction:column; }
.login-marca { font-family:var(--serif); font-size:24px; font-weight:600; margin-bottom:var(--s2); }
.login-sub { color:var(--ink-500); font-size:13px; margin:0 0 var(--s5); }
.login-etq { font-size:12px; font-weight:600; color:var(--ink-700); margin-bottom:var(--s1); }
.login-caja .campo { width:100%; font:inherit; padding:var(--s2) var(--s3); border:1px solid var(--ink-300);
  border-radius:var(--r-md); margin-bottom:var(--s4); }
.login-btn { margin-top:var(--s2); }
.login-caja .resultado { min-height:18px; }

.selector-empresa { font:inherit; font-size:12px; color:var(--ink-700); background:var(--surface);
  border:1px solid var(--ink-300); border-radius:var(--r-md); padding:2px var(--s2); margin-left:var(--s2); max-width:170px; }
.sesion-empresa { font-size:12px; color:var(--ink-700); background:var(--ink-100);
  border-radius:var(--r-pill); padding:1px var(--s2); margin-left:var(--s2); }
.sesion-quien { font-size:12px; color:var(--ink-500); }
.btn-salir { font-size:12px; }
.dialogo select.campo { width:100%; font:inherit; padding:var(--s2) var(--s3); border:1px solid var(--ink-300);
  border-radius:var(--r-md); margin-bottom:var(--s5); background:var(--surface); }

/* ============================================================================
   AUTORIDAD SERENA — capa visual V2 (P0). Aditiva: no altera ningún token ni
   selector previo; el Estudio (resto del sistema) queda idéntico en modo claro.
   ========================================================================== */

/* ---- El Sello (monograma) ---- */
.sello { display:inline-flex; align-items:center; justify-content:center; flex:none;
  width:32px; height:32px; border-radius:50%; border:1.5px solid var(--accent-600);
  color:var(--accent-600); font-family:var(--serif); font-size:9px; font-weight:600; letter-spacing:.03em; }
.sello.sm { width:24px; height:24px; font-size:8px; }

/* ---- El Parte (cabecera del Home) ---- */
.parte { background:linear-gradient(180deg, var(--surface), var(--paper));
  border:1px solid var(--ink-200); border-radius:var(--r-lg); box-shadow:var(--sh-sm);
  padding:var(--s5); margin:var(--s5) 0 var(--s6); }
.parte-sintesis { font-family:var(--serif); font-size:21px; line-height:1.4; color:var(--ink-900); margin:0 0 var(--s4); }
.parte-cifras { display:flex; gap:var(--s7); flex-wrap:wrap; }
.parte-cifra { display:flex; flex-direction:column; min-width:64px; }
.parte-cifra .v { font-size:28px; font-weight:600; line-height:1; font-variant-numeric:tabular-nums; color:var(--ink-900); }
.parte-cifra .l { font-size:11px; color:var(--ink-500); text-transform:uppercase; letter-spacing:.07em; margin-top:var(--s2); }
.parte-cifra.riesgo .v { color:var(--critico); }
.parte-cifra.oportunidad .v { color:var(--sano); }
.parte-cifra.tiempo .v { color:var(--accent-600); }
.parte-consejo { margin-top:var(--s4); padding-top:var(--s3); border-top:1px dashed var(--ink-200);
  font-size:13px; color:var(--ink-700); display:flex; align-items:center; gap:var(--s2); }
.parte-consejo b { color:var(--ia); font-weight:600; }

/* ---- La Propuesta como documento ejecutivo (memorando) ---- */
.memorando { position:relative; }
.memorando-membrete { display:flex; align-items:center; gap:var(--s3); padding-bottom:var(--s3);
  margin-bottom:var(--s3); border-bottom:1px solid var(--ink-200); }
.memorando-num { font-family:var(--serif); font-size:12px; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-700); white-space:nowrap; }
.memorando-linea { font-size:12px; color:var(--ink-500); }
.memorando-titulo { font-family:var(--serif); font-size:19px; font-weight:600; line-height:1.3;
  color:var(--ink-900); margin:var(--s2) 0 var(--s1); }
.memorando-pie { margin-top:var(--s4); padding-top:var(--s3); border-top:1px dashed var(--ink-200);
  font-size:12px; color:var(--ink-500); display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap; }
.memorando .estampa-resuelta { position:absolute; top:var(--s4); right:var(--s4); transform:rotate(-7deg);
  border:2px solid var(--sano); color:var(--sano); border-radius:var(--r-sm); padding:2px var(--s2);
  font-family:var(--serif); font-weight:700; font-size:11px; letter-spacing:.09em; text-transform:uppercase; opacity:.9; }
.memorando.rechazada .estampa-resuelta, .memorando.retirada .estampa-resuelta { border-color:var(--critico); color:var(--critico); }
.memorando.caducada .estampa-resuelta { border-color:var(--sindato); color:var(--sindato); }

/* ---- Firma ejecutiva (pulsación mantenida + sello) ---- */
.btn-firma { position:relative; overflow:hidden; touch-action:none; }
.btn-firma .firma-fill { position:absolute; left:0; bottom:0; height:3px; width:0; background:rgba(255,255,255,.9); }
.btn-firma.firmando .firma-fill { width:100%; transition:width 700ms linear; }
.firma-hint { font-size:11px; color:var(--ink-500); text-align:center; margin-top:var(--s2); }
.resultado.ok .sello-estampa { display:inline-flex; align-items:center; gap:var(--s2); animation:estampar 280ms var(--ease); }
@keyframes estampar { 0%{transform:scale(1.3) rotate(-6deg); opacity:0;} 55%{opacity:1;} 100%{transform:scale(1) rotate(-6deg); opacity:1;} }

/* ============================================================================
   EL PUENTE — la Sala de Dirección, oscura por identidad (solo :root[data-tema=puente]).
   Recolorea SOLO los tokens: cada componente se vuelve nocturno sin cambiar su contrato.
   ========================================================================== */
html, body { transition:background-color var(--dur-slow) var(--ease); }
:root[data-tema="puente"] {
  --paper:#0B1220; --surface:#111B2E;
  --ink-900:#EAE8E1; --ink-700:#B7C0CE; --ink-500:#8792A4; --ink-300:#4A5876;
  --ink-200:#20304C; --ink-100:#16223A;
  --accent-600:#83A4DC; --accent-500:#6E8FC8; --accent-100:#1A2740;
  --sano:#54C79A; --sano-bg:#12291F; --atencion:#E0B152; --atencion-bg:#2B2413;
  --critico:#F0686E; --critico-bg:#2C1618; --bloqueado:#E08A5A; --bloqueado-bg:#2A1D12;
  --sindato:#8792A4; --sindato-bg:#1A2740; --ia:#9B8BE6; --ia-bg:#241F3E;
  --interp:#49B9C0; --interp-bg:#0F2A2E;
  --sh-sm:0 1px 2px rgba(0,0,0,.5); --sh-md:0 3px 12px rgba(0,0,0,.55); --sh-lg:0 10px 30px rgba(0,0,0,.6);
}
:root[data-tema="puente"] body { background:var(--paper); color:var(--ink-900); }
@keyframes entrada-puente { from { opacity:.35; } to { opacity:1; } }
:root[data-tema="puente"] .app { animation:entrada-puente 380ms var(--ease); }
/* En el Puente, el violeta IA es la única luminiscencia: los provtag IA brillan sutilmente. */
:root[data-tema="puente"] .provtag.ia { box-shadow:0 0 0 1px rgba(155,139,230,.25); }
:root[data-tema="puente"] .titulo-pantalla, :root[data-tema="puente"] .pulso .marca { color:var(--ink-900); }

/* ============================================================================
   AUTORIDAD SERENA — P1: La Mesa, deliberación viva, radar polar, acta, login.
   Aditivo: clases nuevas; funciona en modo papel y en El Puente (usa tokens).
   ========================================================================== */

/* Accesibilidad: foco visible coherente en todo el sistema. */
:focus-visible { outline:2px solid var(--accent-600); outline-offset:2px; border-radius:var(--r-sm); }

/* ---- La Mesa ejecutiva ---- */
.mesa { position:relative; margin:var(--s4) 0 var(--s6); padding:var(--s6) var(--s5) var(--s7);
  border:1px solid var(--ink-200); border-radius:var(--r-lg); overflow:hidden; background:var(--surface); }
.mesa::after { content:''; position:absolute; left:12%; right:12%; bottom:-34%; height:80%;
  border-radius:50%/45%; border:1px solid var(--ink-200);
  background:radial-gradient(ellipse at 50% 0%, var(--accent-100), transparent 72%); opacity:.7; pointer-events:none; }
.mesa-cabecera { position:relative; text-align:center; margin-bottom:var(--s5); }
.mesa-cabecera .rol { font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-500); margin-top:var(--s1); }
.asientos { position:relative; display:flex; flex-wrap:wrap; gap:var(--s5) var(--s6); justify-content:center; }
.asiento { display:flex; flex-direction:column; align-items:center; gap:var(--s1); width:104px; text-align:center; }
.medallon { width:46px; height:46px; border-radius:50%; border:1.5px solid var(--ink-300); background:var(--surface);
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:15px; font-weight:600;
  color:var(--ink-700); transition:box-shadow var(--dur-base) var(--ease), border-color var(--dur-base) var(--ease); }
.asiento .nom { font-size:12px; font-weight:600; color:var(--ink-900); line-height:1.15; margin-top:var(--s1); }
.asiento .est { font-size:10px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-500); }
.asiento.disponible .medallon { opacity:.45; }
.asiento.convocado .medallon { border-color:var(--accent-500); }
.asiento.convocado .est { color:var(--accent-500); }
.asiento.razonando .medallon { border-color:var(--ia); animation:halo 1.4s var(--ease) infinite; }
.asiento.razonando .est { color:var(--ia); }
.asiento.entregada .medallon { border-color:var(--sano); color:var(--ink-900); }
.asiento.entregada .est { color:var(--sano); }
.asiento.sindatos .medallon { border-style:dashed; color:var(--ink-500); }
.asiento.error .medallon { border-color:var(--critico); color:var(--critico); }
.asiento.error .est { color:var(--critico); }
@keyframes halo { 0%{box-shadow:0 0 0 0 rgba(155,139,230,.5);} 70%{box-shadow:0 0 0 11px rgba(155,139,230,0);} 100%{box-shadow:0 0 0 0 rgba(155,139,230,0);} }

/* ---- Intervención (memorando de director) + revelado en cascada ---- */
.intervencion { opacity:0; }
.intervencion.revelada { opacity:1; animation:revelar 320ms var(--ease); }
@keyframes revelar { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
.interv-cab { display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap; }
.med-mini { width:26px; height:26px; border-radius:50%; border:1px solid var(--ink-300); background:var(--surface);
  display:inline-flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:10px; font-weight:600; color:var(--ink-700); flex:none; }
.interv-cab .rol { font-weight:600; color:var(--ink-900); }
.dial-confianza { display:inline-flex; gap:2px; align-items:center; }
.dial-confianza i { width:13px; height:5px; border-radius:2px; background:var(--ink-200); }
.dial-confianza.alta i, .dial-confianza.media i:nth-child(-n+2), .dial-confianza.baja i:nth-child(1) { background:var(--accent-600); }
.fuentes-chips { display:flex; flex-wrap:wrap; gap:var(--s1); margin-top:var(--s2); }
.fuente-chip { display:inline-flex; align-items:center; gap:4px; font-size:11px; padding:1px var(--s2);
  border-radius:var(--r-pill); background:var(--ink-100); color:var(--ink-700); }
.fuente-chip.on { color:var(--sano); background:var(--sano-bg); }
.fuente-chip.off { color:var(--ink-500); }

/* ---- Consenso · confianza · incertidumbre ---- */
.barra-medida { margin:var(--s2) 0 var(--s4); }
.barra-medida .etq { display:flex; justify-content:space-between; font-size:11px; text-transform:uppercase;
  letter-spacing:.05em; color:var(--ink-500); margin-bottom:var(--s1); }
.barra { height:6px; border-radius:var(--r-pill); background:var(--ink-100); overflow:hidden; }
.barra > span { display:block; height:100%; background:var(--sano); transition:width var(--dur-slow) var(--ease); }
.barra.baja > span { background:var(--atencion); }
.bloque-incertidumbre { border-left:3px solid var(--interp); background:var(--interp-bg);
  padding:var(--s3) var(--s4); border-radius:var(--r-sm); color:var(--ink-700); margin:var(--s3) 0; }
.enfrentado { display:grid; grid-template-columns:1fr 1fr; gap:var(--s3); }
@media (max-width:640px){ .enfrentado { grid-template-columns:1fr; } }

/* ---- Acta de la reunión ---- */
.acta { border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface); padding:var(--s5); }
.acta-fila { display:flex; justify-content:space-between; gap:var(--s4); padding:var(--s2) 0; border-bottom:1px dashed var(--ink-200); font-size:13px; }
.acta-fila:last-child { border-bottom:none; }
.acta-fila .k { color:var(--ink-500); }
.acta-fila .v { color:var(--ink-900); font-variant-numeric:tabular-nums; text-align:right; }
@media print {
  body * { visibility:hidden; }
  .acta, .acta * { visibility:visible; }
  .acta { position:absolute; left:0; top:0; width:100%; border:none; padding:0; }
  .no-print { display:none !important; }
}

/* ---- Radar polar ---- */
.radar-cab { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); flex-wrap:wrap; }
.radar-polar { position:relative; width:100%; max-width:420px; aspect-ratio:1; margin:var(--s5) auto var(--s4);
  border-radius:50%; background:radial-gradient(circle at 50% 50%, var(--accent-100), transparent 72%); }
.radar-anillo { position:absolute; inset:0; border:1px solid var(--ink-300); border-radius:50%; }
.radar-anillo.r2 { inset:17%; } .radar-anillo.r3 { inset:34%; }
.radar-centro { position:absolute; inset:44%; border-radius:50%; background:var(--accent-100); border:1.5px solid var(--accent-500); }
.radar-etq-centro { position:absolute; left:50%; top:calc(46% - 15px); transform:translateX(-50%);
  font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:var(--accent-600); white-space:nowrap; }
.radar-punto { position:absolute; transform:translate(-50%,-50%); border-radius:50%; border:2px solid var(--surface);
  padding:0; cursor:pointer; box-shadow:var(--sh-sm); transition:transform var(--dur-fast) var(--ease); }
.radar-punto:hover { transform:translate(-50%,-50%) scale(1.25); }
.radar-sin-clasificar { text-align:center; font-size:12px; color:var(--ink-500); margin-top:var(--s2); }
.radar-leyenda { display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4); justify-content:center; font-size:11px; color:var(--ink-500); margin-top:var(--s3); }
.radar-leyenda span { display:inline-flex; align-items:center; gap:var(--s1); }
.radar-leyenda i { width:9px; height:9px; border-radius:50%; }

/* ---- Login como umbral ---- */
.login-caja { animation:entrada-login 420ms var(--ease); }
@keyframes entrada-login { from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;} }
.login-sello { display:flex; justify-content:center; margin-bottom:var(--s4); }
.login-sello .sello { width:46px; height:46px; font-size:12px; }
.login-nota { font-size:11px; color:var(--ink-500); text-align:center; margin-top:var(--s5); line-height:1.5; }

/* ---- Estado vacío con Sello ---- */
.vacio .sello { margin:0 auto var(--s3); width:38px; height:38px; }

/* ============================================================================
   AUTORIDAD SERENA — P2: cierre visual. Marca blanca, notarial, presentación,
   centro de control, contador de gobierno. Aditivo; nada semántico cambia.
   ========================================================================== */

/* ---- Archivo notarial: Decisiones, Aprendizajes, Biblioteca, Estrategias ---- */
/* La entrada de síntesis se lee como preámbulo de un documento. */
.entrada-sintesis { border-left:3px solid var(--accent-600); padding-left:var(--s4); }
/* Las salas de la Biblioteca como lomos de tomos. */
.salas .sala { border-left:3px solid var(--ink-200); border-radius:0 var(--r-sm) var(--r-sm) 0; transition:border-color var(--dur-base) var(--ease); }
.salas .sala.activa { border-left-color:var(--accent-600); }
.sala-nombre { font-family:var(--serif); }
/* Referencias de registro (DEC-009, APR-003…) con peso notarial. */
.memoria-item .ref, .biografia .ref { font-family:var(--serif); font-weight:600; letter-spacing:.04em; color:var(--ink-700); }
.bio-preg { font-family:var(--serif); font-weight:600; color:var(--ink-900); }
.biografia { border:1px solid var(--ink-200); border-radius:var(--r-md); padding:var(--s5); background:var(--surface); position:relative; }
.biografia::before { content:''; position:absolute; top:0; right:0; border-width:0 20px 20px 0; border-style:solid; border-color:transparent var(--ink-100) transparent transparent; }
/* Sello discreto en encabezados de sección del archivo (solo pantallas de registro). */
.md h2, .md h3 { font-family:var(--serif); }

/* ---- Contador de gobierno (El Parte) ---- */
.parte-gobierno { margin-top:var(--s4); padding-top:var(--s3); border-top:1px dashed var(--ink-200);
  display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5); font-size:12px; color:var(--ink-500); }
.parte-gobierno b { color:var(--ink-700); font-variant-numeric:tabular-nums; font-weight:600; }

/* ---- Sala de Máquinas como centro de control ---- */
.control-tira { display:flex; flex-wrap:wrap; gap:var(--s4); margin:var(--s3) 0 var(--s5); }
.control-celda { flex:1 1 150px; border:1px solid var(--ink-200); border-radius:var(--r-md); padding:var(--s4); background:var(--surface); }
.control-celda .v { font-size:22px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--ink-900); line-height:1; }
.control-celda .l { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-500); margin-top:var(--s2); }
.control-celda .estado-punto { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:var(--s1); }
.control-celda .on { background:var(--sano); } .control-celda .off { background:var(--sindato); }

/* ---- Acabado ejecutivo V2 (macro-bloque de credibilidad) ---- */
/* Escena de demostración de la IA (sin clave): digna, nunca el eco interno del motor. */
.memoria-item.demo-ia { color:var(--ink-500); font-style:italic; border-left:2px dashed var(--ink-200); padding-left:var(--s3); }
:root[data-tema="puente"] .memoria-item.demo-ia { color:rgba(233,231,225,.6); border-left-color:rgba(233,231,225,.2); }

/* Firma: la pista reacciona si sueltas antes de tiempo (nunca "no pasó nada"). */
.firma-hint.nudge { animation:firma-nudge .5s var(--ease); color:var(--accent-600); }
@keyframes firma-nudge { 0%,100%{transform:none;} 20%{transform:translateX(-3px);} 60%{transform:translateX(3px);} }

/* Radar despejado: intencionado, no vacío — la torre funciona desde el día uno. */
.radar-polar.despejado { opacity:.96; }
.radar-despejado-nucleo { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center; gap:var(--s2); text-align:center; }
.radar-despejado-nucleo .sello { transform:scale(1.1); }
.radar-despejado-txt { font-family:var(--serif); font-size:15px; color:var(--ink-600); }
:root[data-tema="puente"] .radar-despejado-txt { color:rgba(233,231,225,.75); }

/* Catálogo de especialistas disponibles: presentes pero atenuados (aún no en plantilla). */
.dept.disponible { border-style:dashed; background:transparent; opacity:.82; }
.dept.disponible .dept-nombre { color:var(--ink-600); }

/* ======================================================================
   La reunión ejecutiva viva (Consejo / Comité / Delegado como Jefe de Gabinete)
   ====================================================================== */

/* El Delegado: presencia de Jefe de Gabinete, no un formulario. */
.delegado-panel { border:1px solid var(--ink-200); border-radius:var(--r-lg); background:var(--surface);
  padding:var(--s5); box-shadow:var(--sh-sm); }
.delegado-cab { display:flex; align-items:center; gap:var(--s3); }
.delegado-rol { font-family:var(--serif); font-size:16px; font-weight:600; color:var(--ink-900); }
.delegado-cargo { font-size:12px; color:var(--ink-500); }
.delegado-saludo { font-family:var(--serif); font-size:19px; color:var(--ink-800); margin:var(--s4) 0 var(--s3); line-height:1.3; }
.delegado-campo-fila { display:flex; gap:var(--s2); }
.delegado-campo { flex:1; font-size:15px; }
.delegado-chips { display:flex; flex-wrap:wrap; gap:var(--s2); margin-top:var(--s3); }
.chip-sugerencia { font-size:12.5px; color:var(--ink-600); background:var(--ink-100); border:1px solid var(--ink-200);
  border-radius:var(--r-pill); padding:4px 12px; cursor:pointer; transition:all var(--dur-fast) var(--ease); }
.chip-sugerencia:hover { color:var(--accent-600); border-color:var(--accent-500); background:var(--surface); transform:translateY(-1px); }
.delegado-convoca { display:flex; flex-wrap:wrap; gap:var(--s2); margin-top:var(--s4); padding-top:var(--s3); border-top:1px solid var(--ink-100); }
.delegado-pie { font-size:11.5px; color:var(--ink-500); margin-top:var(--s3); }

/* Convocatoria en curso: un pulso honesto mientras el cerebro delibera. */
.consejo-convocando { display:flex; align-items:center; gap:var(--s2); font-size:13px; color:var(--ink-500);
  font-style:italic; margin:var(--s4) 0; }
.punto-vivo { width:8px; height:8px; border-radius:50%; background:var(--ia); animation:pulso-vivo 1.2s var(--ease) infinite; }
@keyframes pulso-vivo { 0%,100%{opacity:.35; transform:scale(.8);} 50%{opacity:1; transform:scale(1.15);} }

/* Estado del Consejo, en vivo: interviene / han hablado / esperan. */
.consejo-estado { display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4); align-items:center; margin:var(--s3) 0 var(--s4);
  padding:var(--s3) var(--s4); background:var(--ink-100); border:1px solid var(--ink-200); border-radius:var(--r-md); font-size:12.5px; }
.consejo-estado .ce b { font-weight:600; }
.ce-activo { color:var(--ia); } .ce-activo b::before { content:'🎙 '; }
.ce-hablado { color:var(--ink-500); } .ce-hablado b::before { content:'✓ '; color:var(--sano); }
.ce-espera { color:var(--ink-400, var(--ink-500)); } .ce-espera b::before { content:'⏳ '; }
.ce-cerrado { color:var(--sano); } .ce-cerrado b::before { content:'● '; }
:root[data-tema="puente"] .consejo-estado { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.08); }

/* Cada intervención: identidad del director (carácter bajo el nombre). */
.interv-who { display:flex; flex-direction:column; line-height:1.2; }
.interv-rasgo { font-size:11.5px; color:var(--ink-500); font-style:italic; margin-top:1px; }
.interv-conf { margin-left:auto; font-size:12px; }
.fuentes-etq { font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-500); margin-right:var(--s1); }
.intervenciones { display:flex; flex-direction:column; gap:var(--s3); }

/* La síntesis y la PROP como cierre natural de la deliberación. */
.panel-sintesis { border-left:3px solid var(--interp); }
.prop-consecuencia { border-left:3px solid var(--accent-500); }
.dial-confianza.settle i { animation:dial-settle .5s var(--ease) backwards; }
.dial-confianza.settle i:nth-child(2) { animation-delay:.12s; }
.dial-confianza.settle i:nth-child(3) { animation-delay:.24s; }
@keyframes dial-settle { from{transform:scaleX(.2); opacity:.3;} to{transform:none; opacity:1;} }

/* El acta como documento notarial (la caja negra abierta). */
.acta-membrete { display:flex; align-items:center; gap:var(--s3); padding-bottom:var(--s3); margin-bottom:var(--s3);
  border-bottom:2px solid var(--ink-900); }
.acta-titulo { font-family:var(--serif); font-size:18px; font-weight:600; color:var(--ink-900); }
.acta-lema { font-size:11.5px; color:var(--ink-500); font-style:italic; }
.acta-participantes { display:flex; flex-wrap:wrap; gap:var(--s3); margin-bottom:var(--s4); }
.acta-part { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-700); }

@media (max-width:640px) {
  .delegado-campo-fila { flex-direction:column; }
  .consejo-estado { font-size:11.5px; }
  .interv-conf { margin-left:0; }
}

/* ======================================================================
   ACABADO HOMOGÉNEO V2 — todo el producto al nivel de la Sala de Dirección
   (calma · claridad · autoridad · jerarquía · silencio visual · ritmo)
   ====================================================================== */

/* Entrada serena de cada pantalla: el producto "abre", no "carga de golpe". */
@media (prefers-reduced-motion: no-preference) {
  .lectura { animation:pantalla-entra .34s var(--ease) both; }
  @keyframes pantalla-entra { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
}

/* Tarjeta ejecutiva: misma respiración y respuesta al gesto en todas las pantallas. */
.tarjeta { transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.tarjeta:hover { box-shadow:var(--sh-md, 0 4px 16px rgba(20,22,28,.06)); border-color:var(--ink-300, var(--ink-200)); }
.tarjeta.sev-critico:hover, .tarjeta.sev-atencion:hover, .tarjeta.sev-bloqueado:hover { transform:translateX(1px); }

/* Cabecera de sección: jerarquía firme y aire por encima (ritmo vertical). */
.seccion-cab h2 { letter-spacing:-.01em; }
.seccion-cab::before { content:none; }

/* Botones: respuesta consistente y sobria (sin rebotes de juguete). */
.btn { transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.btn:active { transform:translateY(1px); }
.nav-link { transition:color var(--dur-fast) var(--ease); position:relative; }
.nav-link.activa::after { content:''; position:absolute; left:var(--s1); right:var(--s1); bottom:-3px; height:2px; background:var(--accent-500); border-radius:2px; }

/* Estados vacíos: serenidad y preparación, jamás abandono. El sello preside. */
.vacio .sello { margin:0 auto var(--s3); opacity:.85; }
.vacio.compacto .sello { margin:0 var(--s2) 0 0; }

/* Pulso/masthead: un solo pulso de marca, no una cadena de estado. */
.pulso .cifras b { color:var(--ink-800, var(--ink-700)); }

/* Menos cromo, más foco: las tarjetas respiran y se aligeran al proyectar. */
/* Pista de salida, discreta y siempre presente (nunca te quedas "atrapado"). */
  background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-pill); padding:5px 12px;
  box-shadow:var(--sh-sm); opacity:.9; }

/* PARTE A — resolución auditada: segunda condición + historial de gestión (aditivo) */
.segunda-condicion { font-size:13px; color:var(--atencion,#c98a1a); margin:8px 0 0; }
.historial-gestion { max-height:50vh; overflow:auto; }
.hist-fila { border:1px solid var(--linea,rgba(0,0,0,.1)); border-radius:8px; padding:10px 12px; margin-bottom:8px; }
.hist-cab { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.hist-estado { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; padding:2px 8px; border-radius:999px; border:1px solid var(--linea,rgba(0,0,0,.15)); }
.hist-resuelto { color:var(--sano,#1f9d63); } .hist-reabierto { color:var(--atencion,#c98a1a); }
.hist-fecha { font-size:12px; color:var(--tinta-3,#6b7580); }
.hist-texto { font-size:14px; color:var(--tinta-1,#14181d); margin:6px 0 3px; }
.hist-meta { font-size:12px; color:var(--tinta-3,#6b7580); }

/* Sala de Dirección v1.0 — roster del Comité Digital, convocatoria y decisión (aditivo) */
.roster-panel { margin-bottom: var(--s4, 16px); }
.roster-nota { font-size: 12px; color: var(--tinta-3, #8a939c); margin-left: auto; }
.roster-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 18px; margin-top: 10px; }
.roster-fila { display: flex; align-items: baseline; gap: 10px; padding: 5px 2px; border-bottom: 1px solid var(--linea, rgba(255,255,255,.07)); }
.roster-who { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.roster-rol { font-size: 13.5px; font-weight: 600; color: var(--tinta-1, #e8e6e1); }
.roster-dep { font-size: 11px; color: var(--tinta-3, #8a939c); text-transform: capitalize; }
.roster-estado { font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; color: var(--tinta-3, #8a939c); }
.roster-estado.est-disponible { color: var(--tinta-3, #8a939c); }
.roster-estado.est-convocado { color: var(--acento, #c9a86a); }
.roster-estado.est-analizando, .roster-estado.est-interviniendo { color: var(--acento, #c9a86a); }
.roster-estado.est-interviniendo::before, .roster-estado.est-analizando::before { content: '● '; animation: pulso-vivo 1.2s ease-in-out infinite; }
.roster-estado.est-finalizado { color: var(--sano, #4fae7d); }
.roster-estado.est-no-requerido { color: var(--tinta-3, #6b7580); opacity: .65; }
.roster-estado.est-error { color: var(--critico, #d06565); }
@keyframes pulso-vivo { 0%,100% { opacity: .35; } 50% { opacity: 1; } }

.convocatoria { border-left: 3px solid var(--acento, #c9a86a); }
.conv-linea { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; margin-top: 9px; font-size: 13px; }
.conv-linea b { font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--tinta-3, #8a939c); margin-right: 4px; }
.conv-chip { border: 1px solid var(--linea, rgba(255,255,255,.14)); border-radius: 999px; padding: 3px 11px; font-size: 12.5px; }
.conv-chip.on { color: var(--tinta-1, #e8e6e1); border-color: var(--acento, #c9a86a); }
.conv-chip.off { color: var(--tinta-3, #6b7580); opacity: .7; }

.decision-ceo { border-left: 3px solid var(--sano, #4fae7d); margin-top: var(--s4, 16px); }
.decision-ceo .campo { margin-top: 9px; }
.decision-actos { flex-wrap: wrap; margin-top: 10px; }
.decision-ok { color: var(--sano, #4fae7d); font-weight: 600; }

/* Navegación congelada v1.0: el Radar se entra desde el Despacho (enlace sobrio). */
.parte-radar-link { text-decoration: none; color: inherit; }
.parte-radar-link:hover b { color: var(--acento, #c9a86a); }

/* ============================================================================
   PULIDO EJECUTIVO — las tres pantallas del CEO (Despacho · Sala · Empresas).
   Solo tokens canónicos (Autoridad Serena); funciona en papel y en El Puente.
   ========================================================================== */

/* Despacho · continuidad hacia Radar/Sala desde El Parte. */
.parte-enlace { color:var(--accent-600); text-decoration:none; font-weight:500; white-space:nowrap; }
.parte-enlace:hover { text-decoration:underline; }

/* Despacho · El ecosistema: tira ejecutiva sobria (puente hacia Empresas). */
.eco-tira { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--s2); }
.eco-empresa { display:flex; align-items:center; gap:var(--s3); padding:var(--s3) var(--s4); text-decoration:none;
  border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface);
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.eco-empresa:hover { border-color:var(--ink-300); box-shadow:var(--sh-sm); }
.eco-empresa.eco-critico { border-left:3px solid var(--critico); }
.eco-empresa.eco-atencion { border-left:3px solid var(--atencion); }
.eco-punto { width:9px; height:9px; border-radius:50%; flex:none; }
.eco-punto.punto-rojo { background:var(--critico); } .eco-punto.punto-amarillo { background:var(--atencion); } .eco-punto.punto-verde { background:var(--sano); }
.eco-tx { display:flex; flex-direction:column; min-width:0; flex:1; }
.eco-nom { font-weight:600; color:var(--ink-900); font-size:14px; }
.eco-señal { font-size:12px; color:var(--ink-500); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eco-empresa.eco-critico .eco-señal, .eco-empresa.eco-atencion .eco-señal { color:var(--ink-700); }
.eco-flecha { color:var(--ink-300); font-size:15px; flex:none; transition:color var(--dur-fast) var(--ease); }
.eco-empresa:hover .eco-flecha { color:var(--accent-600); }

/* Sala · el Director General Digital preside el Comité (posición diferenciada). */
.roster-dg { display:flex; align-items:center; gap:var(--s3); padding:var(--s3) 0 var(--s4);
  margin-bottom:var(--s3); border-bottom:1px solid var(--ink-200); }
.roster-dg .medallon { border-color:var(--accent-500); color:var(--accent-600); }
.roster-dg-id { display:flex; flex-direction:column; flex:1; min-width:0; }
.roster-dg-rol { font-family:var(--serif); font-size:15px; font-weight:600; color:var(--ink-900); }
.roster-dg-fn { font-size:12px; color:var(--ink-500); }
.roster-dg-marca { font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:600;
  color:var(--accent-600); border:1px solid color-mix(in srgb, var(--accent-500) 45%, transparent);
  border-radius:var(--r-pill); padding:2px 9px; flex:none; }

/* Sala · cabecera de sesión ejecutiva (que parezca un comité, no un chat). */
.sesion-cabecera { margin-bottom:var(--s4); }
.sesion-top { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); }
.sesion-id { display:flex; align-items:baseline; gap:var(--s3); flex-wrap:wrap; }
.sesion-tipo { font-family:var(--serif); font-size:17px; font-weight:600; color:var(--ink-900); }
.sesion-empresa-nom { font-size:13px; color:var(--ink-500); }
.sesion-estado { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600;
  letter-spacing:.03em; text-transform:uppercase; padding:3px 11px; border-radius:var(--r-pill);
  border:1px solid var(--ink-200); color:var(--ink-500); white-space:nowrap; flex:none; }
.sesion-estado.se-curso { color:var(--ia); border-color:color-mix(in srgb, var(--ia) 45%, transparent); }
.sesion-estado.se-decision { color:var(--atencion); border-color:color-mix(in srgb, var(--atencion) 50%, transparent); }
.sesion-estado.se-cerrada { color:var(--sano); border-color:color-mix(in srgb, var(--sano) 45%, transparent); }
.sesion-estado.se-error { color:var(--critico); border-color:color-mix(in srgb, var(--critico) 45%, transparent); }
.sesion-asunto { font-size:15px; color:var(--ink-900); margin:var(--s3) 0 var(--s3); line-height:1.4; }
.sesion-meta { display:flex; flex-wrap:wrap; gap:var(--s3) var(--s5); border-top:1px solid var(--ink-200); padding-top:var(--s3); }
.sesion-dato { display:flex; flex-direction:column; gap:1px; }
.sesion-dato .k { font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-500); }
.sesion-dato .v { font-size:13px; color:var(--ink-900); font-variant-numeric:tabular-nums; }

/* Empresas · la empresa principal como núcleo del ecosistema. */
.tarjeta.empresa-principal { border-left:3px solid var(--accent-500); }
.chip-principal { font-size:10px; letter-spacing:.07em; text-transform:uppercase; font-weight:600;
  color:var(--accent-600); border:1px solid color-mix(in srgb, var(--accent-500) 40%, transparent);
  border-radius:var(--r-pill); padding:2px 9px; margin-left:var(--s2); vertical-align:middle; }

@media (max-width:640px) {
  .eco-tira { grid-template-columns:1fr; }
  .sesion-top { flex-direction:column; align-items:flex-start; }
  .sesion-meta { gap:var(--s3); }
}

/* ============================================================================
   PULIDO EJECUTIVO — Especialistas IA · Organización · Biblioteca (Autoridad
   Serena; solo tokens). Conectores vive en el Centro del Cliente (admin.css).
   ========================================================================== */

/* Especialistas · estado real del especialista + continuidad. */
.esp-dg-panel { margin-bottom:var(--s4); }
.esp-ficha { margin-bottom:var(--s3); }
.esp-estado { font-size:11px; font-weight:600; letter-spacing:.03em; padding:2px 10px; border-radius:var(--r-pill);
  border:1px solid var(--ink-200); color:var(--ink-500); white-space:nowrap; margin-left:auto; }
.esp-estado.est-disponible { color:var(--ink-500); }
.esp-estado.est-convocado, .esp-estado.est-esperando { color:var(--accent-600); border-color:color-mix(in srgb, var(--accent-500) 45%, transparent); }
.esp-estado.est-analizando, .esp-estado.est-interviniendo { color:var(--ia); border-color:color-mix(in srgb, var(--ia) 45%, transparent); }
.esp-estado.est-finalizado { color:var(--sano); border-color:color-mix(in srgb, var(--sano) 45%, transparent); }
.esp-estado.est-no-requerido, .esp-estado.est-inactivo { color:var(--ink-300); }
.esp-estado.est-error { color:var(--critico); border-color:color-mix(in srgb, var(--critico) 45%, transparent); }
.esp-continuidad { margin-top:var(--s6); padding-top:var(--s4); border-top:1px solid var(--ink-200); display:flex; flex-direction:column; gap:var(--s2); }
.esp-cont-enlace { color:var(--accent-600); text-decoration:none; font-size:14px; }
.esp-cont-enlace:hover { text-decoration:underline; }
.esp-cont-enlace b { color:var(--ink-900); font-weight:600; }

/* Organización · escala jerárquica humana (CEO ↓ Directores ↓ Operadores). */
.jer-escala { display:flex; flex-direction:column; gap:var(--s2); margin-bottom:var(--s4); }
.jer-nivel { border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface); padding:var(--s3) var(--s4); }
.jer-nivel:first-child { border-left:3px solid var(--accent-500); }
.jer-nivel-cab { display:flex; align-items:baseline; gap:var(--s2); margin-bottom:var(--s2); }
.jer-rango { font-size:11px; letter-spacing:.06em; text-transform:uppercase; font-weight:600; color:var(--ink-500); }
.jer-cuenta { font-size:11px; color:var(--ink-500); background:var(--ink-100); border-radius:var(--r-pill); padding:0 var(--s2); }
.jer-personas { display:flex; flex-wrap:wrap; gap:var(--s3) var(--s5); }
.jer-persona { display:flex; align-items:center; gap:var(--s2); }
.jer-persona.jer-inactivo { opacity:.5; }
.jer-persona-txt { display:flex; flex-direction:column; line-height:1.25; }
.jer-nombre { font-size:14px; font-weight:600; color:var(--ink-900); }
.jer-cargo { font-size:12px; color:var(--ink-500); }

/* Biblioteca · qué sabe / qué le falta (memoria viva, no gestor de archivos). */
.biblio-falta { display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--s2) var(--s3); margin:var(--s3) 0 var(--s5);
  padding:var(--s3) var(--s4); border-left:3px solid var(--atencion); background:var(--atencion-bg); border-radius:var(--r-sm); }
.biblio-falta-etq { font-size:11px; letter-spacing:.05em; text-transform:uppercase; font-weight:600; color:var(--atencion); }
.biblio-falta-txt { font-size:13.5px; color:var(--ink-700); }

/* ============================================================================
   PULIDO EJECUTIVO FINAL — Estrategias · Usuarios (Autoridad Serena; solo
   tokens). Configuración y Sala de Máquinas reutilizan componentes existentes.
   ========================================================================== */

/* Estrategias · encuadre ejecutivo (qué persigue tu empresa y su estado). */
.estr-marco { margin-bottom:var(--s5); }
.estr-sintesis { font-size:15px; color:var(--ink-900); line-height:1.45; margin-bottom:var(--s4); }
.estr-resumen { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:var(--s4); }
.estr-cifra { display:flex; flex-direction:column; gap:2px; }
.estr-cifra .v { font-family:var(--serif); font-size:26px; font-weight:600; color:var(--ink-900); font-variant-numeric:tabular-nums; line-height:1; }
.estr-cifra .l { font-size:11.5px; letter-spacing:.03em; color:var(--ink-500); }
.estr-cifra.atencion .v { color:var(--atencion); }

/* Usuarios · subcabecera de grupo por responsabilidad (CEO ↓ Directores ↓ …). */
.usuarios-grupo-cab { display:flex; align-items:baseline; gap:var(--s2); margin:var(--s5) 0 var(--s2); }
.usuarios-grupo-rango { font-size:12px; letter-spacing:.06em; text-transform:uppercase; font-weight:600; color:var(--ink-500); }
.usuarios-grupo-n { font-size:11px; color:var(--ink-500); background:var(--ink-100); border-radius:var(--r-pill); padding:0 var(--s2); }

/* Biblioteca · puente de continuidad hacia la Sala (donde el conocimiento se usa). */
.biblio-puente { display:inline-block; margin:var(--s2) 0 var(--s5); }

/* ============================================================================
   MESA DE GOBIERNO (Despacho) — la propuesta como decisión con ciclo de vida.
   Solo tokens canónicos; reutiliza tarjeta/velo/diálogo/chips existentes.
   ========================================================================== */
.gob-estado { font-size:10px; letter-spacing:.06em; text-transform:uppercase; font-weight:600;
  padding:2px 9px; border-radius:var(--r-pill); border:1px solid var(--ink-200); color:var(--ink-500);
  margin-left:var(--s2); vertical-align:middle; white-space:nowrap; }
.gob-estado.ge-emitida { color:var(--atencion); border-color:color-mix(in srgb, var(--atencion) 50%, transparent); }
.gob-estado.ge-informe-recibido { color:var(--ia); border-color:color-mix(in srgb, var(--ia) 45%, transparent); }
.gob-estado.ge-aprobada, .gob-estado.ge-ejecutada { color:var(--sano); border-color:color-mix(in srgb, var(--sano) 45%, transparent); }
.gob-estado.ge-en-ejecucion { color:var(--accent-600); border-color:color-mix(in srgb, var(--accent-500) 45%, transparent); }
.gob-estado.ge-rechazada { color:var(--critico); border-color:color-mix(in srgb, var(--critico) 45%, transparent); }
.gob-estado.ge-pospuesta, .gob-estado.ge-delegada, .gob-estado.ge-en-estudio { color:var(--ink-500); }
.gob-informe { border-left:3px solid var(--ia); background:var(--ia-bg); border-radius:var(--r-sm);
  padding:var(--s3) var(--s4); margin:0 0 var(--s4); font-size:13.5px; color:var(--ink-700); line-height:1.55; }
.gob-informe b { color:var(--ink-900); }
.gob-reco { color:var(--ia); font-weight:600; }
.gob-chip-on { border-color:var(--accent-600) !important; color:var(--accent-600) !important; font-weight:600; }

/* ACTO DE GOBIERNO — variante solemne del diálogo de firma (solo tokens). */
.dialogo-acto { border-top:3px solid var(--accent-600); text-align:center; }
.acto-membrete { display:flex; flex-direction:column; align-items:center; gap:var(--s2); margin-bottom:var(--s4); }
.acto-rotulo { font-size:12px; letter-spacing:.28em; text-transform:uppercase; font-weight:600; color:var(--accent-600); }
.acto-protagonista { font-family:var(--serif); font-size:20px; font-weight:600; color:var(--ink-900);
  line-height:1.35; margin-bottom:var(--s3); }
.dialogo-acto .consec { text-align:center; }
.acto-firmante { font-size:12.5px; color:var(--ink-600); border-top:1px solid var(--ink-200);
  margin-top:var(--s4); padding-top:var(--s3); }
.acto-firmante .k { font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--ink-500); margin-right:var(--s2); }
.dialogo-acto .botonera { justify-content:center; }

/* ---- Incorporación de una empresa (asistente del Fundador, Fase 2) ---- */
/* Solo tokens del DS: sobriedad editorial, jerarquía por espacio, cero adorno. */
.paso-tira { display:flex; flex-wrap:wrap; gap:var(--s3); margin:var(--s5) 0; }
.paso-punto { font-size:12.5px; color:var(--ink-500); display:inline-flex; align-items:center; gap:6px; }
.paso-punto b { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px;
  border-radius:var(--r-pill); border:1px solid var(--ink-300); font-size:11px; font-weight:600; color:var(--ink-500); }
.paso-punto.actual { color:var(--ink-900); }
.paso-punto.actual b { border-color:var(--accent-600); color:var(--accent-600); }
.paso-punto.hecho { color:var(--sano); }
.paso-punto.hecho b { border-color:color-mix(in srgb, var(--sano) 55%, transparent); color:var(--sano); }
.paso-caja { padding:var(--s6); }
.paso-titulo { font-family:var(--serif); font-size:20px; margin:0 0 var(--s3); }
.paso-caja .coste { color:var(--ink-500); font-size:13px; margin:0 0 var(--s5); }
.paso-caja .campo-wrap { display:flex; flex-direction:column; gap:4px; }
.paso-caja .campo-wrap.ancho { grid-column:1 / -1; }
.paso-caja .campo-etq { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-500); font-weight:600; margin:var(--s4) 0 var(--s2); }
.paso-caja .campo { width:100%; font:inherit; padding:var(--s2) var(--s3); border:1px solid var(--ink-300);
  border-radius:var(--r-sm); background:var(--surface); color:var(--ink-900); }
.paso-caja .campo:focus-visible { outline:2px solid var(--accent-600); outline-offset:1px; }
.form-grid-2 { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:var(--s3) var(--s4); }
.sel-lista { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:var(--s3); }
.sel-opcion { text-align:left; font:inherit; background:var(--surface); border:1px solid var(--ink-200);
  border-radius:var(--r-md); padding:var(--s4); cursor:pointer; display:flex; flex-direction:column; gap:4px;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.sel-opcion:hover { border-color:var(--ink-300); box-shadow:var(--sh-sm); }
.sel-opcion.on { border-color:var(--accent-600); box-shadow:0 0 0 1px var(--accent-600) inset; }
.sel-opcion b { font-size:14px; color:var(--ink-900); font-weight:500; }
.sel-opcion span { font-size:12.5px; color:var(--ink-500); }
.sel-opcion .sel-desc { font-size:12px; color:var(--ink-400); }

/* ---- Centro de Control de IA (Fundador): pestañas, KPIs, tablas ---- */
.ci-pestanas { display:flex; flex-wrap:wrap; gap:4px; border-bottom:1px solid var(--ink-200); margin-bottom:var(--s4); }
.ci-pestana { font:inherit; font-size:13px; background:none; border:none; border-bottom:2px solid transparent; padding:var(--s2) var(--s3); cursor:pointer; color:var(--ink-500); }
.ci-pestana:hover { color:var(--ink-800); }
.ci-pestana.activa { color:var(--ink-900); border-bottom-color:var(--accent-600); font-weight:500; }
.ci-cuerpo { display:block; }
.ci-kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--s3); margin-bottom:var(--s4); }
.ci-kpi { background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-md); padding:var(--s3) var(--s4); }
.ci-kpi.sev-atencion { border-color:var(--warn-500); }
.ci-kpi.sev-critico { border-color:var(--danger-500); }
.ci-kpi-v { font-family:var(--serif); font-size:19px; color:var(--ink-900); }
.ci-kpi-l { font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-500); margin-top:2px; }
.ci-filtros { display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center; margin-bottom:var(--s3); }
.ci-filtro { font:inherit; font-size:12.5px; background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-sm); padding:4px var(--s3); cursor:pointer; color:var(--ink-600); }
.ci-filtro.activo { border-color:var(--accent-600); color:var(--ink-900); }
.ci-campo { max-width:170px; font-size:12.5px; }
.ci-nota { font-size:12px; color:var(--ink-500); margin:0 0 var(--s3); }
.ci-tabla-wrap { overflow-x:auto; border:1px solid var(--ink-200); border-radius:var(--r-md); margin-bottom:var(--s4); }
.ci-tabla { width:100%; border-collapse:collapse; font-size:12.5px; }
.ci-tabla th, .ci-tabla td { text-align:left; padding:var(--s2) var(--s3); border-bottom:1px solid var(--ink-100); white-space:nowrap; }
.ci-tabla th { background:var(--ink-50); color:var(--ink-600); font-weight:500; position:sticky; top:0; }
.ci-tabla .ci-num { text-align:right; font-variant-numeric:tabular-nums; }
.ci-tabla tbody tr:last-child td { border-bottom:none; }
.ci-tabla tr.ci-clic { cursor:pointer; }
.ci-tabla tr.ci-clic:hover td { background:var(--ink-50); }
.ci-vacio { color:var(--ink-400); text-align:center; padding:var(--s5); }
.ci-chip { display:inline-block; font-size:11px; padding:1px 8px; border-radius:999px; border:1px solid var(--ink-200); }
.ci-chip-on { color:var(--accent-600); border-color:var(--accent-100); background:var(--accent-50); }
.ci-chip-off { color:var(--danger-500); border-color:var(--danger-500); background:var(--surface-2); }
.ci-chip-neu { color:var(--ink-500); }
.ci-barras { display:flex; flex-direction:column; gap:3px; margin-bottom:var(--s4); }
.ci-barra-fila { display:grid; grid-template-columns:52px 1fr 90px; align-items:center; gap:var(--s2); font-size:11.5px; color:var(--ink-600); }
.ci-barra-track { background:var(--ink-100); border-radius:999px; height:8px; overflow:hidden; }
.ci-barra { height:100%; background:var(--accent-600); border-radius:999px; }
.ci-barra-val { text-align:right; font-variant-numeric:tabular-nums; }
/* Paso 2 del asistente: la pregunta que de verdad importa, en primer plano. */
.wiz-pregunta { font-family:var(--serif); font-size:21px; color:var(--ink-900); margin:0 0 var(--s2); }
.wiz-subtitulo { margin:0 0 var(--s4); }
/* Pasos 4 y 5: activar lo que YA existe (nunca crear) e indicar qué usa la empresa. */
.wiz-info { background:var(--surface-2); border:1px solid var(--ink-100); border-radius:var(--r-md);
  padding:var(--s3) var(--s4); margin-bottom:var(--s4); }
.wiz-info-l { font-size:12.5px; color:var(--ink-600); line-height:1.5; }
.wiz-contador { display:inline-flex; align-items:baseline; gap:2px; font-size:12.5px; color:var(--ink-700);
  background:var(--surface); border:1px solid var(--ink-200); border-radius:var(--r-pill);
  padding:4px var(--s3); margin-bottom:var(--s4); }
.wiz-recom { background:var(--surface); border:1px solid var(--accent-100); border-left:3px solid var(--accent-600);
  border-radius:var(--r-md); padding:var(--s3) var(--s4); margin-bottom:var(--s4); }
.wiz-recom-t { font-size:12.5px; color:var(--ink-700); line-height:1.5; }
.wiz-recom-lista { display:flex; flex-wrap:wrap; gap:var(--s2); margin:var(--s2) 0; }
.wiz-recom-item { font-size:12.5px; color:var(--ink-800); }
.wiz-recom-n { font-size:12px; color:var(--ink-500); }
.esp-lista { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:var(--s2); margin-bottom:var(--s4); }
.esp-item { text-align:left; font:inherit; background:var(--surface); border:1px solid var(--ink-200);
  border-radius:var(--r-md); padding:var(--s3); cursor:pointer; display:flex; flex-direction:column; gap:3px;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.esp-item:hover { border-color:var(--ink-300); box-shadow:var(--sh-sm); }
.esp-item.on { border-color:var(--accent-600); box-shadow:0 0 0 1px var(--accent-600) inset; }
.esp-cab { display:flex; align-items:baseline; justify-content:space-between; gap:var(--s2); }
.esp-cab b { font-size:13.5px; color:var(--ink-900); font-weight:500; }
.esp-estado { font-size:11px; color:var(--ink-500); white-space:nowrap; }
.esp-item.on .esp-estado { color:var(--accent-600); }
.esp-desc { font-size:12px; color:var(--ink-500); line-height:1.45; }
/* ---- Marcas: unidades comerciales dentro de la empresa ---- */
.marca-color { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:var(--s2);
  border:1px solid var(--ink-200); vertical-align:middle; }
.marca-cifras { display:flex; flex-wrap:wrap; gap:var(--s5); margin:var(--s3) 0 0; }
.marca-dato-v { font-family:var(--serif); font-size:17px; color:var(--ink-900); }
.marca-dato-l { font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-500); }
.marca-archivada { opacity:.72; border-style:dashed; }
.marca-busca { max-width:220px; font-size:12.5px; }
.marca-ruta { display:flex; align-items:center; gap:var(--s2); font-size:12.5px; color:var(--ink-500); margin-bottom:var(--s2); }
.marca-ruta-sep { color:var(--ink-300); }

/* El núcleo no es un botón: no se pulsa, no se desactiva. Se ve que es distinto. */
.esp-nucleo { cursor:default; background:var(--surface-2); border-style:dashed; }
.esp-nucleo:hover { border-color:var(--ink-200); box-shadow:none; }
.esp-fijo { font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-400); white-space:nowrap; }
.chips-marcado { display:flex; flex-wrap:wrap; gap:var(--s2); margin-bottom:var(--s4); }
.chips-marcado .chip-toggle { font:inherit; font-size:12.5px; padding:5px 12px; border-radius:var(--r-pill);
  border:1px solid var(--ink-300); background:var(--surface); color:var(--ink-700); cursor:pointer; }
.chips-marcado .chip-toggle.on { border-color:var(--accent-600); color:var(--accent-600); background:var(--accent-100); }
.btn-grande-wiz { font-size:15px; padding:var(--s3) var(--s6); }

/* ---- Puesta en marcha (checklist derivado de incorporación) ---- */
.marcha-barra { height:6px; border-radius:var(--r-pill); background:var(--ink-100); overflow:hidden; margin-bottom:var(--s4); }
.marcha-relleno { height:100%; border-radius:var(--r-pill); background:var(--accent-600); transition:width var(--dur-slow) var(--ease); }
.marcha-item { display:flex; gap:var(--s2); align-items:baseline; padding:6px 0; font-size:14px; color:var(--ink-700); }
.marcha-item.hecho { color:var(--ink-500); }
.marcha-item.hecho b { color:var(--ink-700); font-weight:500; }
.marcha-item b { color:var(--ink-900); font-weight:500; }
.marcha-marca { width:18px; text-align:center; color:var(--ink-300); }
.marcha-item.hecho .marcha-marca { color:var(--sano); }

/* ---- BGS conoce tu empresa (salud ejecutiva, metodología trazable) ---- */
.parte-conoce { margin-top:var(--s4); padding-top:var(--s4); border-top:1px solid var(--ink-100); }
.conoce-cab { display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap; margin-bottom:var(--s2); }
.conoce-etq { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-500); font-weight:600; }
.conoce-estado { font-size:11px; font-weight:600; padding:2px 9px; border-radius:var(--r-pill); border:1px solid var(--ink-200); color:var(--ink-700); }
.conoce-estado.est-inicial, .conoce-estado.est-ausente { color:var(--atencion); border-color:color-mix(in srgb, var(--atencion) 40%, transparent); }
.conoce-estado.est-parcial { color:var(--ink-700); }
.conoce-estado.est-suficiente, .conoce-estado.est-solido { color:var(--sano); border-color:color-mix(in srgb, var(--sano) 40%, transparent); }
.conoce-estado.est-muy-completo { color:var(--sano); border-color:var(--sano); }
.conoce-sub { font-size:12.5px; color:var(--ink-500); }
.conoce-barra { height:6px; border-radius:var(--r-pill); background:var(--ink-100); overflow:hidden; margin:var(--s2) 0; }
.conoce-rel { height:100%; border-radius:var(--r-pill); background:var(--accent-600); transition:width var(--dur-slow) var(--ease); }
.conoce-falta { font-size:13px; color:var(--ink-600); }

/* ---- Biblioteca · qué conoce BGS de la empresa (trazable) ---- */
.biblio-conoce { margin:var(--s5) 0; padding:var(--s5); border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface); }
.biblio-conoce .conoce-cab { display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap; margin-bottom:var(--s3); }
.conoce-dims { display:flex; flex-wrap:wrap; gap:var(--s2); margin:var(--s3) 0; }
.conoce-dim { font:inherit; text-align:left; cursor:pointer; border:1px solid var(--ink-200); border-radius:var(--r-md); background:var(--surface);
  padding:6px 10px; display:flex; flex-direction:column; gap:2px; min-width:120px; transition:border-color var(--dur-fast) var(--ease); }
.conoce-dim:hover { border-color:var(--accent-500); }
.conoce-dim b { font-size:13px; color:var(--ink-900); font-weight:500; }
.conoce-dim span { font-size:11px; color:var(--ink-500); }
.conoce-dim.est-ausente, .conoce-dim.est-inicial { border-left:3px solid var(--atencion); }
.conoce-dim.est-suficiente, .conoce-dim.est-solido, .conoce-dim.est-muy-completo { border-left:3px solid var(--sano); }
.conoce-necesita { margin-top:var(--s4); padding-top:var(--s3); border-top:1px solid var(--ink-100); }
.conoce-carencia { font-size:13px; color:var(--ink-700); margin:4px 0; }
.conoce-prio { font-size:10px; text-transform:uppercase; letter-spacing:.05em; padding:1px 6px; border-radius:var(--r-pill); }
.conoce-prio.prio-alta { color:var(--critico); background:var(--critico-bg); }
.conoce-prio.prio-media { color:var(--atencion); background:var(--atencion-bg); }

/* ---- Especialistas · autonomía y ficha completa ---- */
.esp-meta { display:flex; flex-wrap:wrap; gap:var(--s2); margin:var(--s2) 0; align-items:center; }
.esp-meta-x { font-size:12px; color:var(--ink-500); }
.esp-limites { margin:var(--s1) 0 0 var(--s3); padding:0; list-style:disc; }
.esp-limites li { font-size:13px; color:var(--ink-700); margin:3px 0; }

/* ---- Organización · matriz de responsabilidad RACI ---- */
.raci { display:flex; flex-direction:column; gap:2px; margin:var(--s3) 0; overflow-x:auto; }
.raci-fila { display:grid; grid-template-columns:1.6fr 1fr 1.2fr 1fr 1.2fr 1.2fr; gap:var(--s2);
  align-items:center; padding:8px 10px; border-radius:var(--r-sm); background:var(--surface); min-width:720px; }
.raci-cab { position:sticky; top:0; background:var(--surface-2); font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-500); }
.raci-fila:not(.raci-cab):nth-child(even) { background:var(--surface-2); }
.raci-c { font-size:13px; color:var(--ink-700); }
.raci-area { display:flex; flex-direction:column; gap:1px; }
.raci-area b { color:var(--ink-900); font-weight:500; font-size:13px; }
.raci-sub { font-size:11px; color:var(--ink-400); }
.raci-sust { color:var(--ink-500); font-style:italic; }

/* ---- Sala de Máquinas · vista técnica ---- */
.tecnico-panel { margin-top:var(--s3); padding:var(--s3); background:var(--surface-2); border-radius:var(--r-sm); font-family:var(--mono, ui-monospace, monospace); font-size:12px; overflow-x:auto; }
.tecnico-linea { color:var(--ink-700); margin:3px 0; white-space:pre-wrap; word-break:break-word; }
.tecnico-linea b { color:var(--ink-900); }

/* ---- Marca: ámbito de conector (Capa 7) ---- */
.ambito-chip { font-size:11px; padding:2px 8px; border-radius:var(--r-pill); font-weight:500; }
.ambito-chip.amb-empresa { color:var(--ink-600); background:var(--surface-2); border:1px solid var(--ink-200); }
.ambito-chip.amb-marca { color:var(--accent-600, var(--accent-500)); background:var(--accent-50, var(--surface-2)); border:1px solid var(--accent-500); }
.conector-ambito { margin-top:2px; }

/* Ámbito visible: dónde estoy. Las marcas viven dentro de una empresa, y la
   navegación debe decirlo — Plataforma → Empresa → Marcas. */
.ambito-migas {
  font-size: .82rem; letter-spacing: .02em; color: var(--tinta-3);
  padding: var(--s2) 0; margin-bottom: var(--s3);
  border-bottom: 1px solid var(--linea);
}
/* A qué empresa pertenece una marca. Nunca se omite. */
.marca-empresa { font-size: .8rem; color: var(--tinta-3); margin-top: 2px; }
