/* ==========================================================================
   viz.css — visualizaciones del Portal de la entrega Investep (ejecutor B)
   Componentes de ivz.js: processDiagram · deptFlow · companyMap · orgChart
   · severityChart · data-count. Pensado para fondo claro (blanco / papel).
   Todas las variables tienen fallback: el portal puede sobreescribirlas.
   ========================================================================== */

:root {
  --ivz-navy: #000321;
  --ivz-cyan: #4BE4F0;
  --ivz-cyan-d: #0A8FA0;
  --ivz-cyan-t: #066F7C;      /* cian oscuro apto para texto pequeño (AA sobre blanco) */
  --ivz-cyan-bg: #E9FBFD;
  --ivz-ink: #0B1030;
  --ivz-ink-2: #3A4460;       /* texto secundario (AA sobre blanco y papel) */
  --ivz-grey: #8893A8;
  --ivz-grey-t: #5D6880;      /* gris apto para texto pequeño */
  --ivz-line: #D9DEE8;
  --ivz-line-2: #B9C2D2;
  --ivz-amber: #FAAF3B;
  --ivz-amber-bg: #FFF5E3;
  --ivz-amber-d: #9A5B00;
  --ivz-blue: #214966;
  --ivz-paper: #F4F7FB;
  --ivz-white: #FFFFFF;
  --ivz-red: #B42318;
  --ivz-font: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ivz-radius: 14px;
  --ivz-shadow: 0 1px 2px rgba(11,16,48,.06), 0 8px 24px -12px rgba(11,16,48,.18);
  --ivz-ease: cubic-bezier(.22,.8,.24,1);
}

.ivz { font-family: var(--ivz-font); color: var(--ivz-ink); position: relative; min-width: 0; max-width: 100%; box-sizing: border-box; -webkit-font-smoothing: antialiased; }
.ivz *, .ivz *::before, .ivz *::after { box-sizing: border-box; }
.ivz svg { display: block; max-width: none; overflow: visible; }
.ivz text { font-family: var(--ivz-font); text-rendering: geometricPrecision; font-kerning: normal; }
.ivz :focus { outline: none; }
.ivz :focus-visible { outline: 2px solid var(--ivz-cyan-d); outline-offset: 2px; }

/* ---------- estado vacío ---------- */
.ivz-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center;
  min-height: 180px; padding: 28px 20px; border: 1px dashed var(--ivz-line-2); border-radius: var(--ivz-radius);
  background: repeating-linear-gradient(135deg, rgba(136,147,168,.05) 0 10px, transparent 10px 20px), var(--ivz-paper);
  color: var(--ivz-grey-t); font-size: 14px; }
.ivz-empty svg { width: 34px; height: 34px; color: var(--ivz-line-2); }
.ivz-empty b { color: var(--ivz-ink); font-weight: 600; font-size: 15px; }

/* ---------- tooltip compartido ---------- */
.ivz-tip { position: fixed; z-index: 9999; pointer-events: none; max-width: min(320px, calc(100vw - 24px));
  background: var(--ivz-navy); color: #fff; font-family: var(--ivz-font); font-size: 12.5px; line-height: 1.45;
  padding: 9px 12px; border-radius: 10px; box-shadow: 0 10px 30px -8px rgba(0,3,33,.45), 0 0 0 1px rgba(75,228,240,.18);
  opacity: 0; transform: translateY(4px); transition: opacity .14s ease, transform .14s ease; }
.ivz-tip.is-on { opacity: 1; transform: none; }
.ivz-tip b { display: block; font-weight: 600; font-size: 13px; margin-bottom: 2px; }
.ivz-tip .ivz-tip-k { color: var(--ivz-cyan); font-weight: 600; }
.ivz-tip .ivz-tip-m { color: #C9D2E3; }

/* ---------- viewport con zoom / arrastre ---------- */
.ivz-vp { position: relative; overflow: hidden; border-radius: var(--ivz-radius); touch-action: pan-y;
  background:
    radial-gradient(circle at 1px 1px, rgba(136,147,168,.16) 1px, transparent 1.3px) 0 0 / 28px 28px,
    var(--ivz-white);
  border: 1px solid var(--ivz-line); cursor: grab; user-select: none; -webkit-user-select: none; }
.ivz-vp.is-dragging { cursor: grabbing; }
.ivz-vp > svg { width: 100%; height: 100%; }
.ivz-tools { position: absolute; bottom: 10px; right: 10px; z-index: 3; display: flex; gap: 2px; padding: 3px;
  background: rgba(255,255,255,.92); border: 1px solid var(--ivz-line); border-radius: 10px; box-shadow: var(--ivz-shadow);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.ivz-tools button { all: unset; box-sizing: border-box; height: 30px; min-width: 30px; padding: 0 8px; border-radius: 7px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 500 12px/1 var(--ivz-font); color: var(--ivz-ink); }
.ivz-tools button:hover { background: var(--ivz-paper); }
.ivz-tools button:focus-visible { outline: 2px solid var(--ivz-cyan-d); outline-offset: 0; }
.ivz-tools svg { width: 15px; height: 15px; }
.ivz-hint { position: absolute; left: 50%; bottom: 14px; z-index: 3; transform: translate(-50%, 6px); pointer-events: none;
  background: rgba(0,3,33,.86); color: #fff; font: 500 12px/1 var(--ivz-font); padding: 9px 13px; border-radius: 999px;
  opacity: 0; transition: opacity .2s ease, transform .2s ease; white-space: nowrap; }
.ivz-hint.is-on { opacity: 1; transform: translate(-50%, 0); }
.ivz-fade-r::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 36px; pointer-events: none; z-index: 2;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.95)); }

/* ---------- leyenda ---------- */
.ivz-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; margin-top: 12px; font-size: 12px; color: var(--ivz-ink-2); }
.ivz-legend span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.ivz-legend svg { width: 26px; height: 16px; flex: none; }
.ivz-legend .ivz-sep { width: 1px; height: 14px; background: var(--ivz-line); }

/* ==========================================================================
   Nodos SVG comunes (processDiagram / deptFlow)
   ========================================================================== */
.ivz-node { cursor: pointer; transition: opacity .25s ease; }
.ivz-node .ivz-shape { fill: var(--ivz-white); stroke: var(--ivz-line-2); stroke-width: 1.25; transition: fill .3s ease, stroke .3s ease, stroke-width .3s ease; }
.ivz-node .ivz-label { fill: var(--ivz-ink); font-size: 14px; font-weight: 500; }
.ivz-node .ivz-actor { fill: var(--ivz-cyan-t); font-size: 11.5px; font-weight: 500; }
.ivz-node .ivz-halo { fill: none; stroke: var(--ivz-cyan); stroke-width: 2; opacity: 0; transform-box: fill-box; transform-origin: center; pointer-events: none; }
.ivz-node:hover .ivz-shape, .ivz-node:focus-visible .ivz-shape, .ivz-node.is-hover .ivz-shape { stroke: var(--ivz-cyan-d); stroke-width: 1.75; }
.ivz-node:focus-visible { outline: none; }
.ivz-node:focus-visible .ivz-shape { stroke: var(--ivz-cyan-d); stroke-width: 2.5; }

.ivz-t-inicio .ivz-shape { fill: var(--ivz-navy); stroke: var(--ivz-navy); }
.ivz-t-inicio .ivz-label { fill: #fff; }
.ivz-t-inicio .ivz-actor { fill: var(--ivz-cyan); }
.ivz-t-fin .ivz-shape { fill: var(--ivz-paper); stroke: var(--ivz-ink); stroke-width: 2; }
.ivz-t-fin .ivz-ring { fill: none; stroke: var(--ivz-ink); stroke-width: 1; opacity: .35; }
.ivz-t-decision .ivz-shape { fill: var(--ivz-amber-bg); stroke: #E39A2A; }
.ivz-t-decision .ivz-actor { fill: var(--ivz-amber-d); }
.ivz-t-externo .ivz-shape { fill: var(--ivz-paper); stroke: var(--ivz-grey); stroke-dasharray: 5 4; }
.ivz-t-externo .ivz-label { fill: var(--ivz-ink-2); }
.ivz-t-externo .ivz-actor { fill: var(--ivz-grey-t); }
.ivz-t-documento .ivz-shape { fill: #F7F9FC; }

.ivz-badge circle { fill: var(--ivz-white); stroke: var(--ivz-line-2); stroke-width: 1; transition: fill .3s, stroke .3s; }
.ivz-badge text { fill: var(--ivz-ink-2); font-size: 10.5px; font-weight: 600; }
.ivz-check { opacity: 0; transform: scale(.4); transform-box: fill-box; transform-origin: center; transition: opacity .3s ease, transform .35s var(--ivz-ease); }
.ivz-check circle { fill: var(--ivz-cyan-t); }
.ivz-check path { fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* estados de reproducción */
.ivz-node.is-seen .ivz-shape { stroke: var(--ivz-cyan-d); stroke-width: 1.5; }
.ivz-node.is-seen:not(.ivz-t-inicio):not(.ivz-t-decision) .ivz-shape { fill: #F2FCFD; }
.ivz-node.is-seen .ivz-check { opacity: 1; transform: none; }
.ivz-node.is-seen .ivz-badge circle { fill: var(--ivz-cyan-bg); stroke: var(--ivz-cyan-d); }
.ivz-node.is-seen .ivz-badge text { fill: var(--ivz-cyan-t); }
.ivz-node.is-active .ivz-shape { stroke: var(--ivz-cyan-d); stroke-width: 2.5; }
.ivz-node.is-active:not(.ivz-t-inicio) .ivz-shape { fill: #EFFCFE; }
.ivz-node.is-active .ivz-glow { opacity: 1; }
.ivz-node.is-active .ivz-halo { animation: ivz-pulse 1.8s ease-out infinite; }
.ivz-node.is-active .ivz-badge circle { fill: var(--ivz-cyan-t); stroke: var(--ivz-cyan-t); }
.ivz-node.is-active .ivz-badge text { fill: #fff; }
.ivz-node.is-active .ivz-check { opacity: 0; }
.ivz-glow { opacity: 0; transition: opacity .35s ease; pointer-events: none; }
.ivz-node.is-dim { opacity: .28; }
@keyframes ivz-pulse { 0% { opacity: .85; transform: scale(1); } 70% { opacity: 0; transform: scale(1.12, 1.35); } 100% { opacity: 0; transform: scale(1.12, 1.35); } }

/* aristas */
.ivz-edge { fill: none; stroke: var(--ivz-line-2); stroke-width: 1.5; transition: stroke .3s ease, stroke-width .3s ease, opacity .25s ease; }
.ivz-edge.is-seen { stroke: var(--ivz-cyan-d); stroke-width: 2.25; }
.ivz-edge.is-hl { stroke: var(--ivz-cyan-d); stroke-width: 2.25; }
.ivz-edge.is-dim { opacity: .15; }
.ivz-edge.is-draw { animation: ivz-draw .7s var(--ivz-ease) both; }
@keyframes ivz-draw { from { stroke-dashoffset: var(--len, 200); } to { stroke-dashoffset: 0; } }
.ivz-arrow { fill: var(--ivz-line-2); }
.ivz-arrow-on { fill: var(--ivz-cyan-d); }
.ivz-elabel rect { fill: var(--ivz-white); stroke: var(--ivz-line); stroke-width: 1; }
.ivz-elabel text { fill: var(--ivz-ink-2); font-size: 11px; font-weight: 600; }
.ivz-elabel.is-seen rect { stroke: var(--ivz-cyan-d); fill: var(--ivz-cyan-bg); }
.ivz-elabel.is-seen text { fill: var(--ivz-cyan-t); }
.ivz-elabel.is-dim { opacity: .2; }

/* ==========================================================================
   processDiagram
   ========================================================================== */
.ivz-pd-bar { display: flex; gap: 3px; margin-top: 12px; height: 22px; align-items: center; }
.ivz-pd-bar button { all: unset; box-sizing: border-box; position: relative; height: 22px; flex: var(--w, 1) 1 0; min-width: 4px; cursor: pointer; display: flex; align-items: center; }
.ivz-pd-bar button::before { content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 6px; border-radius: 3px; background: var(--ivz-line); transition: height .15s, top .15s; }
.ivz-pd-bar button:hover::before, .ivz-pd-bar button:focus-visible::before { top: 6px; height: 10px; }
.ivz-pd-bar button:focus-visible { outline: 2px solid var(--ivz-cyan-d); outline-offset: 1px; border-radius: 4px; }
.ivz-pd-bar i { position: absolute; left: 0; top: 8px; height: 6px; border-radius: 3px; background: var(--ivz-cyan-d); width: 100%; transform-origin: left; transform: scaleX(0); transition: top .15s, height .15s; }
.ivz-pd-bar button:hover i, .ivz-pd-bar button:focus-visible i { top: 6px; height: 10px; }
.ivz-pd-bar .is-edge::before { background: #E8ECF3; }
.ivz-pd-bar .is-edge i { background: var(--ivz-grey); }
.ivz-pd-bar .is-cur i { background: linear-gradient(90deg, var(--ivz-cyan-d), var(--ivz-cyan)); }

/* caption escrito en data-caption (el contenedor lo coloca A) */
.ivz-cap { display: block; font-family: var(--ivz-font); }
.ivz-cap-step { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ivz-cyan-t); margin-bottom: 4px; }
.ivz-cap-step::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ivz-cyan-d); box-shadow: 0 0 0 3px rgba(10,143,160,.18); }
.ivz-cap-step.is-idle::before { background: var(--ivz-grey); box-shadow: 0 0 0 3px rgba(136,147,168,.18); }
.ivz-cap-text { display: block; font-size: 15px; line-height: 1.55; color: var(--ivz-ink); }
.ivz-cap-actor { display: block; margin-top: 4px; font-size: 12.5px; color: var(--ivz-grey-t); }
.ivz-cap-in { animation: ivz-capin .35s var(--ivz-ease) both; }
@keyframes ivz-capin { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   deptFlow
   ========================================================================== */
.ivz-df .ivz-node .ivz-label { font-size: 13px; }
.ivz-df .ivz-pid { fill: var(--ivz-cyan-t); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.ivz-df .ivz-est { fill: var(--ivz-amber-d); font-size: 10.5px; font-weight: 600; }
.ivz-df .ivz-t-proc .ivz-shape { fill: var(--ivz-white); }
.ivz-df .ivz-t-proc .ivz-accent { fill: var(--ivz-cyan-d); }
.ivz-df .ivz-t-proc.is-hover .ivz-shape, .ivz-df .ivz-t-proc:hover .ivz-shape { fill: #F6FDFE; }
.ivz-df .ivz-edge-x { stroke-dasharray: 3 4; stroke: #C4CCD9; stroke-width: 1.1; opacity: .55; }
.ivz-df .ivz-edge-x.is-hl { opacity: 1; stroke-width: 2; }
.ivz-df .ivz-edge-x.is-hl { stroke: var(--ivz-cyan-d); stroke-dasharray: 5 3; }
.ivz-df .ivz-hit { fill: none; stroke: transparent; stroke-width: 14; cursor: help; pointer-events: stroke; }
.ivz-df .ivz-strip-l { fill: var(--ivz-grey-t); font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.ivz-df .ivz-strip-bg { fill: rgba(136,147,168,.07); stroke: none; }
.ivz-pill rect { fill: var(--ivz-navy); }
.ivz-pill text { fill: #fff; font-size: 11px; font-weight: 500; }
.ivz-pills { pointer-events: none; }
.ivz-pills .ivz-pill { animation: ivz-pop .22s var(--ivz-ease) both; }
@keyframes ivz-pop { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

/* panel de detalle del deptFlow (móvil) */
.ivz-df-panel { margin-top: 12px; border: 1px solid var(--ivz-line); border-radius: var(--ivz-radius); background: var(--ivz-white); padding: 14px 16px; box-shadow: var(--ivz-shadow); }
.ivz-df-panel h4 { margin: 0 0 8px; font-size: 16px; font-weight: 600; line-height: 1.35; color: var(--ivz-ink); }
.ivz-df-panel .ivz-k { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ivz-cyan-t); margin: 10px 0 6px; }
.ivz-df-panel ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ivz-df-panel li { font-size: 13px; line-height: 1.4; color: var(--ivz-ink); padding-left: 10px; border-left: 2px solid var(--ivz-line); }
.ivz-df-panel li b { color: var(--ivz-cyan-t); font-weight: 700; }
.ivz-df-panel li i { font-style: normal; color: var(--ivz-ink-2); }
.ivz-df-panel li small { display: block; font-size: 12px; color: var(--ivz-grey-t); }
.ivz-df-hint { margin: 0; font-size: 13px; color: var(--ivz-grey-t); line-height: 1.45; }

/* ==========================================================================
   companyMap
   ========================================================================== */
.ivz-cm { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: start; padding: 8px clamp(12px, 2vw, 24px) 20px; }
.ivz-cm.is-wide { grid-template-columns: minmax(0, 1fr) 300px; }
.ivz-cm-stage { position: relative; min-width: 0; display: flex; justify-content: center; }
.ivz-cm-stage.is-narrow { flex-direction: column; align-items: center; }
.ivz-cm-key { list-style: none; margin: 14px 0 0; padding: 0; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
@media (min-width: 470px) { .ivz-cm-key { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 8px; } }
.ivz-cm-key button { all: unset; box-sizing: border-box; width: 100%; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 5px 8px; border-radius: 9px; cursor: pointer; font: 500 12.5px/1.25 var(--ivz-font); color: var(--ivz-ink); }
.ivz-cm-key button:focus-visible { outline: 2px solid var(--ivz-cyan-d); }
.ivz-cm-key b { font-size: 11px; font-weight: 600; color: var(--ivz-cyan); background: var(--ivz-navy); border-radius: 50%; width: 24px; height: 24px; display: grid; place-items: center; }
.ivz-cm-key span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ivz-cm-key em { font-style: normal; font-size: 11.5px; color: var(--ivz-grey-t); font-variant-numeric: tabular-nums; }
.ivz-cm-key .is-on { background: var(--ivz-cyan-bg); box-shadow: inset 0 0 0 1px var(--ivz-cyan-d); }
.ivz-cm-key .is-on b { background: var(--ivz-cyan-t); color: #fff; }
.ivz-cm-key .is-nb b { box-shadow: 0 0 0 2px var(--ivz-cyan); }
.ivz-cm-stage svg { max-width: 100%; height: auto; }
.ivz-cm .ivz-ring { fill: none; stroke: var(--ivz-line); stroke-dasharray: 2 5; }
.ivz-chord { fill: none; stroke: var(--ivz-blue); stroke-opacity: .2; stroke-linecap: round; transition: stroke .25s ease, stroke-opacity .25s ease; }
.ivz-chord.is-hl { stroke: var(--ivz-cyan-d); stroke-opacity: .85; }
.ivz-chord.is-dim { stroke-opacity: .05; }
.ivz-cm-node { cursor: pointer; transition: opacity .25s ease; transform-box: fill-box; transform-origin: center; }
.ivz-cm-node .ivz-dot { fill: var(--ivz-navy); stroke: #fff; stroke-width: 2.5; transition: fill .25s ease; }
.ivz-cm-node .ivz-dot-ring { fill: none; stroke: var(--ivz-cyan); stroke-width: 1.5; opacity: .55; transition: opacity .25s, stroke-width .25s; }
.ivz-cm-node .ivz-num { fill: var(--ivz-cyan); font-weight: 600; }
.ivz-cm-node .ivz-nm { fill: var(--ivz-ink); font-weight: 600; }
.ivz-cm-node .ivz-np { fill: var(--ivz-grey-t); font-weight: 500; }
.ivz-cm-node:hover .ivz-dot-ring, .ivz-cm-node.is-on .ivz-dot-ring, .ivz-cm-node:focus-visible .ivz-dot-ring { opacity: 1; stroke-width: 3; }
.ivz-cm-node.is-on .ivz-dot { fill: var(--ivz-cyan-t); }
.ivz-cm-node.is-on .ivz-num { fill: #fff; }
.ivz-cm-node.is-nb .ivz-dot-ring { opacity: 1; }
.ivz-cm-node.is-dim { opacity: .3; }
.ivz-cm-node:focus-visible { outline: none; }
.ivz-cm-w rect { fill: #fff; stroke: var(--ivz-cyan-d); stroke-width: 1; }
.ivz-cm-w text { fill: var(--ivz-cyan-t); font-size: 11px; font-weight: 700; }
.ivz-cm-in .ivz-cm-node { animation: ivz-cm-pop .6s var(--ivz-ease) both; animation-delay: var(--d, 0ms); }
.ivz-cm-in .ivz-cm-node .ivz-cm-lbl { animation: ivz-fadein .5s ease both; animation-delay: calc(var(--d, 0ms) + 250ms); }
.ivz-cm-in .ivz-chord { animation: ivz-draw 1.1s var(--ivz-ease) both; animation-delay: var(--d, 0ms); stroke-dasharray: var(--len) var(--len); }
@keyframes ivz-cm-pop { from { opacity: 0; transform: translate(var(--fx, 0), var(--fy, 0)) scale(.2); } to { opacity: 1; transform: none; } }
@keyframes ivz-fadein { from { opacity: 0; } to { opacity: 1; } }

.ivz-cm-panel { border: 1px solid var(--ivz-line); border-radius: var(--ivz-radius); background: var(--ivz-white); padding: 18px 18px 16px; box-shadow: var(--ivz-shadow); min-width: 0; }
.ivz-cm-panel h4 { margin: 0 0 2px; font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--ivz-ink); }
.ivz-cm-panel .ivz-k { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ivz-cyan-t); margin: 0 0 6px; }
.ivz-cm-panel .ivz-sub { font-size: 13px; color: var(--ivz-ink-2); margin: 0 0 12px; line-height: 1.45; }
.ivz-cm-panel .ivz-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 4px 0 14px; }
.ivz-cm-panel .ivz-stats span { display: block; line-height: 1.3; }
.ivz-cm-panel .ivz-stats b { display: block; font-size: 24px; line-height: 1.1; font-weight: 600; color: var(--ivz-ink); font-variant-numeric: tabular-nums; }
.ivz-cm-panel .ivz-stats span { font-size: 12px; color: var(--ivz-grey-t); }
.ivz-cm-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.ivz-cm-list li { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 10px; font-size: 12.5px; color: var(--ivz-ink); align-items: center; }
.ivz-cm-list li .ivz-bar { grid-column: 1 / -1; height: 4px; border-radius: 2px; background: var(--ivz-paper); overflow: hidden; }
.ivz-cm-list li .ivz-bar i { display: block; height: 100%; background: var(--ivz-cyan-d); border-radius: 2px; width: var(--p, 0%); transition: width .5s var(--ivz-ease); }
.ivz-cm-list li em { font-style: normal; font-weight: 600; color: var(--ivz-cyan-t); font-variant-numeric: tabular-nums; }
.ivz-cm-list .ivz-nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ivz-cm-open { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; font: 600 13px/1 var(--ivz-font); color: var(--ivz-white); background: var(--ivz-navy);
  padding: 10px 14px; border-radius: 9px; text-decoration: none; }
.ivz-cm-open:hover { background: #0B1846; }
.ivz-cm-panel .ivz-hintline { font-size: 12px; color: var(--ivz-grey-t); margin-top: 12px; }
.ivz-cm-panel-in { animation: ivz-capin .3s var(--ivz-ease) both; }

/* ==========================================================================
   orgChart
   ========================================================================== */
.ivz-org { --gap: 12px; padding: 4px clamp(14px, 2.2vw, 28px) 24px; }
.ivz-org-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.ivz-seg { display: inline-flex; padding: 4px; border-radius: 12px; background: var(--ivz-paper); border: 1px solid var(--ivz-line); position: relative; max-width: 100%; }
.ivz-seg button { all: unset; box-sizing: border-box; position: relative; z-index: 1; cursor: pointer; padding: 9px 14px; border-radius: 9px; font: 500 13.5px/1.2 var(--ivz-font); color: var(--ivz-ink-2); transition: color .25s ease; text-align: center; }
.ivz-seg button b { font-weight: 600; }
.ivz-seg button[aria-pressed="true"] { color: #fff; }
.ivz-seg button:focus-visible { outline: 2px solid var(--ivz-cyan-d); outline-offset: 1px; }
.ivz-seg .ivz-seg-thumb { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 9px; background: var(--ivz-navy);
  box-shadow: 0 4px 14px -6px rgba(0,3,33,.6), inset 0 0 0 1px rgba(75,228,240,.25); transition: transform .45s var(--ivz-ease), width .45s var(--ivz-ease); }
.ivz-org-stat { font-size: 13px; color: var(--ivz-ink-2); display: inline-flex; align-items: baseline; gap: 8px; }
.ivz-org-stat b { font-size: 26px; font-weight: 600; color: var(--ivz-ink); font-variant-numeric: tabular-nums; line-height: 1; }
.ivz-org-stage { position: relative; }
.ivz-org-lines { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; overflow: visible; }
.ivz-org-lines path { fill: none; stroke: var(--ivz-line-2); stroke-width: 1.5; stroke-linejoin: round; }
.ivz-org-lines.is-in path { animation: ivz-fadein .5s ease both; }
.ivz-org-top { position: relative; z-index: 1; display: flex; justify-content: center; margin-bottom: 44px; }
.ivz-org-dg { display: inline-flex; gap: 0; border-radius: 14px; overflow: hidden; background: var(--ivz-navy); color: #fff; box-shadow: 0 14px 34px -16px rgba(0,3,33,.7), inset 0 0 0 1px rgba(75,228,240,.2);
  background-image: radial-gradient(120% 140% at 50% -40%, rgba(75,228,240,.28), transparent 60%); max-width: 100%; }
.ivz-org-dg > div { padding: 12px 20px; min-width: 0; }
.ivz-org-dg > div + div { border-left: 1px solid rgba(255,255,255,.14); }
.ivz-org-dg small { display: block; font-size: 11px; font-weight: 600; letter-spacing: .1em; color: var(--ivz-cyan); }
.ivz-org-dg span { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.ivz-org-flat { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(var(--ivz-cols, 7), minmax(0, 1fr)); gap: 40px var(--gap); }
.ivz-org-dirs { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(var(--ivz-dcols, 4), minmax(0, 1fr)); gap: 40px 16px; }
.ivz-org-dir { position: relative; border-radius: 16px; background: var(--ivz-paper); border: 1px solid var(--ivz-line); padding: 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ivz-org-dir header { padding: 2px 2px 4px; }
.ivz-org-dir h5 { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--ivz-ink); }
.ivz-org-dir .ivz-why { margin: 4px 0 0; font-size: 12px; line-height: 1.4; color: var(--ivz-ink-2); }
.ivz-org-dir .ivz-sum { display: inline-flex; margin-top: 8px; font-size: 11.5px; font-weight: 600; color: var(--ivz-cyan-t); background: var(--ivz-white); border: 1px solid var(--ivz-line); border-radius: 999px; padding: 3px 9px; }
.ivz-org-dir .ivz-dir-areas { display: flex; flex-direction: column; gap: 6px; }
.ivz-org-dir::before { content: ""; position: absolute; left: 12px; right: 12px; top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--ivz-cyan-d), var(--ivz-cyan)); }
.ivz-org.is-anim .ivz-org-dir { animation: ivz-dirin .55s var(--ivz-ease) both; animation-delay: var(--d, 0ms); }
.ivz-org.is-anim .ivz-org-dir header { animation: ivz-fadein .4s ease both; animation-delay: calc(var(--d, 0ms) + 260ms); }
@keyframes ivz-dirin { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }

.ivz-area { position: relative; display: block; min-width: 0; text-decoration: none; color: inherit; background: var(--ivz-white); border: 1px solid var(--ivz-line); border-radius: 12px;
  padding: 10px 11px 10px 13px; box-shadow: 0 1px 2px rgba(11,16,48,.05); transform-origin: 0 0; will-change: transform; transition: border-color .2s, box-shadow .2s; }
.ivz-area::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0; background: var(--ivz-cyan-d); opacity: .7; }
a.ivz-area:hover { border-color: var(--ivz-cyan-d); box-shadow: 0 6px 18px -10px rgba(10,143,160,.6); }
.ivz-area .ivz-an { display: block; font-size: 13px; font-weight: 600; line-height: 1.25; color: var(--ivz-ink); overflow-wrap: anywhere; }
.ivz-area .ivz-ar { display: block; margin-top: 3px; font-size: 11.5px; line-height: 1.3; color: var(--ivz-grey-t); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ivz-area .ivz-ap { display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 600; color: var(--ivz-cyan-t); font-variant-numeric: tabular-nums; }
.ivz-org[data-state="prop"] .ivz-area { padding: 8px 10px 8px 12px; }
.ivz-org[data-state="prop"] .ivz-area .ivz-ap { position: absolute; right: 10px; top: 8px; margin: 0; }
.ivz-org[data-state="prop"] .ivz-area .ivz-an { padding-right: 26px; }
.ivz-org-hide { display: none !important; }
.ivz-org[data-state="prop"] .ivz-apw { display: none; }

.ivz-org.is-narrow .ivz-org-flat, .ivz-org.is-narrow .ivz-org-dirs { grid-template-columns: minmax(0, 1fr); gap: 8px; padding-left: 22px; }
.ivz-org.is-narrow .ivz-org-dirs { gap: 12px; }
.ivz-org.is-narrow .ivz-org-top { justify-content: flex-start; margin-bottom: 18px; }
.ivz-org.is-narrow .ivz-org-dg { flex-direction: column; width: 100%; }
.ivz-org.is-narrow .ivz-org-dg > div + div { border-left: 0; border-top: 1px solid rgba(255,255,255,.14); }
.ivz-org.is-narrow .ivz-org-flat .ivz-area { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 10px; }
.ivz-org.is-narrow .ivz-org-flat .ivz-area .ivz-ap { grid-row: 1 / span 2; grid-column: 2; align-self: center; margin: 0; }
.ivz-org.is-narrow .ivz-seg { width: 100%; }
.ivz-org.is-narrow .ivz-seg button { flex: 1 1 0; padding: 8px 6px; font-size: 12.5px; }
.ivz-org.is-narrow .ivz-seg button b { display: block; font-size: 14px; }
.ivz-org.is-narrow .ivz-seg button span { display: block; }

/* ==========================================================================
   severityChart
   ========================================================================== */
.ivz-sev-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; margin-bottom: 16px; }
.ivz-sev-legend { display: flex; flex-wrap: wrap; gap: 8px; }
.ivz-sev-legend span { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ivz-ink); background: var(--ivz-white); border: 1px solid var(--ivz-line); border-radius: 999px; padding: 5px 11px 5px 8px; }
.ivz-sev-legend i { width: 12px; height: 12px; border-radius: 4px; flex: none; }
.ivz-sev-legend b { font-weight: 600; font-variant-numeric: tabular-nums; }
.ivz-sev-total { font-size: 13px; color: var(--ivz-ink-2); }
.ivz-sev-total b { font-size: 22px; font-weight: 600; color: var(--ivz-ink); margin-right: 4px; font-variant-numeric: tabular-nums; }
.ivz-sev-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ivz-sev-row { all: unset; box-sizing: border-box; width: 100%; display: grid; grid-template-columns: minmax(120px, 224px) minmax(0, 1fr) 44px; align-items: center; gap: 14px;
  padding: 7px 10px; border-radius: 10px; cursor: pointer; transition: background .2s ease, opacity .25s ease; }
.ivz-sev-row:hover { background: var(--ivz-paper); }
.ivz-sev-row:focus-visible { outline: 2px solid var(--ivz-cyan-d); outline-offset: -2px; }
.ivz-sev-row[aria-pressed="true"] { background: var(--ivz-cyan-bg); box-shadow: inset 3px 0 0 var(--ivz-cyan-d); }
.ivz-sev.has-sel .ivz-sev-row[aria-pressed="false"] { opacity: .5; }
.ivz-sev-name { font-size: 13.5px; font-weight: 500; color: var(--ivz-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ivz-sev-track { display: flex; height: 24px; min-width: 0; }
.ivz-sev-seg { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; overflow: hidden; white-space: nowrap;
  transition: width .9s var(--ivz-ease), filter .15s ease; width: 0; box-shadow: inset -1.5px 0 0 #fff; }
.ivz-sev-seg:first-child { border-radius: 6px 0 0 6px; }
.ivz-sev-seg:last-child { border-radius: 0 6px 6px 0; box-shadow: none; }
.ivz-sev-seg:only-child { border-radius: 6px; }
.ivz-sev-seg:hover { filter: brightness(1.08) saturate(1.1); }
.ivz-sev-tot { font-size: 14px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; color: var(--ivz-ink); }
.ivz-sev.is-narrow .ivz-sev-row { grid-template-columns: minmax(0, 1fr) 40px; gap: 6px 10px; padding: 8px 8px; }
.ivz-sev.is-narrow .ivz-sev-name { grid-column: 1; grid-row: 1; }
.ivz-sev.is-narrow .ivz-sev-tot { grid-column: 2; grid-row: 1; }
.ivz-sev.is-narrow .ivz-sev-track { grid-column: 1 / -1; grid-row: 2; height: 20px; }
.ivz-sev-axis { display: grid; grid-template-columns: minmax(120px, 224px) minmax(0, 1fr) 44px; gap: 14px; padding: 0 10px; margin-top: 6px; }
.ivz-sev-axis div { position: relative; height: 16px; font-size: 11px; color: var(--ivz-grey-t); font-variant-numeric: tabular-nums; }
.ivz-sev-axis span { position: absolute; transform: translateX(-50%); }
.ivz-sev.is-narrow .ivz-sev-axis { display: none; }

/* ==========================================================================
   Movimiento reducido: todo quieto, estados finales directos
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .ivz *, .ivz *::before, .ivz *::after, .ivz-tip, .ivz-cap-in { animation: none !important; transition: none !important; }
}
.ivz.is-still *, .ivz.is-still *::before, .ivz.is-still *::after { animation: none !important; transition: none !important; }
.ivz-df .ivz-edge-x.is-dim { opacity: .08; }
@media (max-width: 520px) { .ivz-tools span { display: none; } .ivz-tools button { min-width: 34px; } }
.ivz-df > * { margin-left: 20px; margin-right: 20px; }
.ivz-df.is-narrow > * { margin-left: 12px; margin-right: 12px; }
.ivz-df > .ivz-legend { margin-bottom: 16px; }