/* ══════════════════════  PARTNERS · LA SECCIÓN  ═══════════════════════════
   Rediseño del 17/09/2026 contra `docs/inspiracion/Partners/`, reescrito el
   mismo día sobre el sistema de Alertas.

   ══ POR QUÉ ESTO ES UN ARCHIVO NUEVO Y NO MÁS REGLAS EN `v2.css`
   De las ~196 reglas que parecían de Partners, las únicas exclusivas eran
   `.v2-pt-*`, `.v2-ptf*`, `.v2-ptr*` y `.v2-pta*`. El andamiaje entero
   —cabecera, riel, chips, KPIs, avatares, inputs— era `.v2-rg-*` y `.v2-pn-*`,
   o sea de Reglas y de su wizard. Rediseñar encima de eso rompe Reglas, que es
   el accidente de ZnappView que cuenta `CLAUDE.md`.

   ══ LA PRIMERA VERSIÓN USÓ EL SISTEMA EQUIVOCADO, Y ESTE ARCHIVO LO CORRIGE
   `#plat-partners` está en la MISMA regla que `#v2-app` y `#plat-reglas`
   (`v2.css:29`), así que esta pantalla hereda los tokens de Alertas. La
   primera versión escribió con los de `plataforma.css` —`--fs-*`, `--p`,
   `--t1/t2/t3`, `--surf`— y quedó alineada con Comercios y desalineada con el
   vecino con el que comparte sidebar y sección. Medido: `v2.css` tiene 714
   `font-size` y el 100 % usa `--f0..--f6`; cero `--fs-*` y cero px a mano.

   Y había una trampa: dentro de esa regla **`--bd` vale `#7f9394`**, no el
   `#e6ecf2` de la plataforma. Todos los bordes salían mucho más oscuros de lo
   escrito. Acá no se usa `--bd` para una línea: las hairlines son `--n100` y
   `--n50`, que es lo que usa Alertas.

   ══ LAS REGLAS DE LA ESCALA, QUE NO SON MÍAS — están en `v2.css:64-80`
     --f0 10 · --f1 11 · --f2 13 · --f3 15 · --f4 18 · --f5 24 · --f6 32
   `--f1` es el PISO y sólo para mayúsculas y metadatos cortos: un párrafo con
   line-height de lectura nunca es `--f1`. `--f6` es el TECHO y hay UNO por
   pantalla —acá es el nombre del partner en su ficha—.
   El cuerpo pesa 450, el énfasis 650, y el 700 se reserva para rótulos y
   titulares. Los titulares llevan tracking negativo proporcional al cuerpo.

   ══ TRES FORMAS Y TRES ELEVACIONES, no siete de cada una
   `--r14` contenedor · `--r10`/`--r8` control · `--r6` chip.
   `--sh-rest` · `--sh-up` · `--sh-over`. */

:root{
  /* Un tinte por tipo de partner. Es lo ÚNICO que este archivo agrega al
     sistema: los ocho tipos no tenían color y el monograma los necesita para
     distinguirse de un vistazo. */
  --pnx-cadena:#2563eb;       --pnx-cadena-b:#eaf1fe;
  --pnx-distribuidor:#0e9c8a; --pnx-distribuidor-b:#d2f4ee;
  --pnx-vendedor:#7c3aed;     --pnx-vendedor-b:#f1ebfe;
  --pnx-agencia:#c026d3;      --pnx-agencia-b:#fbeafc;
  --pnx-comercial:#b8760a;    --pnx-comercial-b:#fdf4e3;
  --pnx-trade:#0ea5e9;        --pnx-trade-b:#e6f5fd;
  --pnx-interno:#0a7d6e;      --pnx-interno-b:#d2f4ee;
  --pnx-otro:#5f7f91;         --pnx-otro-b:#eef2f4;
}
/* El padding lateral es el de Reglas —`42px 52px 66px`, `v2.css:6721`— y acá
   se declara como token para que la banda pueda salirse de él y el contenido
   no. Antes eran 34px inventados: un tercer valor contra los 52 de Reglas y
   los 72 de Comercios. */
#plat-partners{ --pnx-pad:52px; --pnx-gut:16px; --pnx-blq:18px; --pnx-riel:1160px; }
@media(max-width:1024px){ #plat-partners{ --pnx-pad:24px; --pnx-gut:14px; --pnx-blq:14px; } }
@media(max-width:768px){ #plat-partners{ --pnx-pad:18px; } }

/* LA SECCIÓN NO PONE PADDING: LO PONE CADA BLOQUE.
   Es lo que pidió el dueño para la ficha —«que el fondo del título y las
   pestañas lleguen hasta los bordes»— y obliga a anular el padding que la
   sección comparte con Reglas. Se anula con un selector PROPIO y no
   redeclarando el de `v2.css`: así `chequeo.py` no cuenta un `css_dup` y
   Reglas no se entera. */
#plat-partners.on:has(.pnx-w){padding:0}

/* ANCHO COMPLETO, SIN `max-width` NI `margin:auto`.
   Los tenía, y causaban dos cosas a la vez: en una pantalla más ancha que
   1560+sidebar la banda no llegaba a los bordes, y al cambiar de solapa el
   bloque se recentraba y se corría de costado —medido: 236px en una solapa
   contra 317px en otra—. Ninguna sección del dashboard topea su ancho. */
.pnx-w{width:100%;color:var(--i1);font-size:var(--f2);line-height:1.55}

/* ═══════════════════════════  1 · LA BANDA  ══════════════════════════════
   NINGUNA otra sección del dashboard pinta una banda de fondo de borde a
   borde: todas ponen el título sobre el gris. Ésta lo hace porque el dueño lo
   pidió explícitamente para la ficha y la referencia la muestra así, y se hace
   igual en las dos pantallas para que el listado y el detalle no parezcan
   productos distintos. */

.pnx-hero{position:relative;overflow:hidden;background:linear-gradient(104deg,var(--t50) 0%,#f4fbfa 48%,#e6f7f2 100%);border-bottom:1px solid var(--t100);padding:32px var(--pnx-pad) 34px;display:flex;align-items:center;gap:26px}
.pnx-hero-art{position:absolute;right:0;top:50%;transform:translateY(-50%);width:min(560px,40%);height:212px;opacity:.62;pointer-events:none}
.pnx-hero-l{display:flex;align-items:center;gap:15px;position:relative;z-index:1;min-width:0}
.pnx-hero-ic{width:46px;height:46px;flex-shrink:0;border-radius:50%;background:var(--t100);color:var(--t700);display:grid;place-items:center}
.pnx-eyb{font-size:var(--f1);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--i3);margin-bottom:5px}
.pnx-hero-t{font-size:var(--f5);font-weight:700;letter-spacing:-.6px;line-height:1.18;margin:0 0 6px;color:var(--i1)}
.pnx-hero-t em{font-style:normal;color:var(--t600)}
.pnx-hero-sub{font-size:var(--f2);font-weight:450;color:var(--i2);line-height:1.6;max-width:74ch}
.pnx-hero-r{margin-left:auto;display:flex;align-items:center;gap:22px;position:relative;z-index:1;flex-shrink:0}
.pnx-stats{display:flex;align-items:center}
.pnx-stat{padding:0 22px;border-right:1px solid var(--t200);text-align:left}
.pnx-stat:last-child{border-right:0;padding-right:24px}
.pnx-stat-n{font-size:var(--f5);font-weight:700;letter-spacing:-.9px;line-height:1;color:var(--i1);font-variant-numeric:tabular-nums}
.pnx-stat-l{font-size:var(--f1);font-weight:500;color:var(--i3);margin-top:5px;white-space:nowrap}

/* ════════════════════════════  2 · BOTONES  ══════════════════════════════ */

.pnx-cta,.pnx-btn,.pnx-btn-o{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-family:inherit;font-weight:650;white-space:nowrap;transition:transform var(--mo-2) var(--eo),background var(--mo-2) var(--eo),box-shadow var(--mo-2) var(--eo),border-color var(--mo-2) var(--eo)}
.pnx-cta:active,.pnx-btn:active,.pnx-btn-o:active{transform:scale(.97)}
.pnx-cta{border:0;background:var(--t600);color:var(--n0);font-size:var(--f2);padding:12px 20px;border-radius:var(--r8);box-shadow:var(--sh-rest)}
.pnx-cta svg{transition:transform var(--mo-3) var(--eo)}
.pnx-btn{border:0;background:var(--t600);color:var(--n0);font-size:var(--f2);padding:10px 18px;border-radius:var(--r8)}
.pnx-btn-o{background:var(--n0);color:var(--t700);font-size:var(--f2);padding:9px 16px;border-radius:var(--r8);border:1px solid var(--t200)}
.pnx-btn-o:hover{border-color:var(--t400);background:var(--t50)}
.pnx-btn[disabled],.pnx-cta[disabled]{opacity:.45;cursor:not-allowed}
.pnx-btn[disabled]:active,.pnx-cta[disabled]:active{transform:none}
.pnx-ghost{background:none;border:0;cursor:pointer;font-family:inherit;font-size:var(--f2);font-weight:500;color:var(--i2);padding:9px 14px;border-radius:var(--r8);display:inline-flex;align-items:center;gap:7px;transition:color var(--mo-2),background var(--mo-2),transform var(--mo-2) var(--eo)}
.pnx-ghost:hover{color:var(--i1);background:var(--n50)}
.pnx-ghost:active{transform:scale(.97)}
.pnx-more{width:36px;height:36px;flex-shrink:0;display:grid;place-items:center;border-radius:var(--r8);border:1px solid var(--n200);background:var(--n0);color:var(--i2);cursor:pointer;transition:border-color var(--mo-2),color var(--mo-2),transform var(--mo-2) var(--eo)}
.pnx-more:hover{border-color:var(--n300);color:var(--i1)}
.pnx-more:active{transform:scale(.94)}
.pnx-lnk{background:none;border:0;padding:0;cursor:pointer;font-family:inherit;font-size:var(--f1);font-weight:700;color:var(--t700);display:inline-flex;align-items:center;gap:5px;transition:gap var(--mo-2) var(--eo),color var(--mo-2)}
.pnx-lnk:hover{color:var(--t600);gap:8px}
.pnx-w :focus-visible{outline:0;box-shadow:var(--ring);border-radius:var(--r6)}
@media (hover:hover) and (pointer:fine){
  .pnx-cta:hover{background:var(--t700)}
  .pnx-cta:hover svg{transform:translateX(3px)}
  .pnx-btn:hover{background:var(--t700)}
}

/* ═════════════════  3 · LA TARJETA DE SECCIÓN Y LA TABLA  ════════════════
   EL PATRÓN DEL DASHBOARD ES `.pdv-tbl`, y es plano: `<table>` real, sin caja
   propia, sin borde, sin radio y sin sombra. El recuadro lo pone la TARJETA DE
   SECCIÓN —`.c.com-card`, que contiene también el título del bloque y la
   toolbar—, no la tabla. Es el patrón de Inicio, Comercios, Portafolio,
   Misiones, Configuración y el Informe: 12 de las ~28 tablas del repo.

   La primera versión hacía las cuatro cosas que el patrón NO hace: borde,
   radio 16, sombra y banda de encabezado teñida. Era la única tabla del repo
   que las combinaba, y es lo que el dueño rechazó. */

.pnx-caja{margin:0 var(--pnx-pad);background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);padding:20px 22px}
.pnx-caja+.pnx-caja{margin-top:var(--pnx-blq)}
.pnx-caja-h{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.pnx-caja-h h2{font-size:var(--f3);font-weight:700;letter-spacing:-.3px;margin:0;color:var(--i1)}
.pnx-caja-h span{font-size:var(--f2);font-weight:450;color:var(--i3)}
.pnx-caja-h .pnx-lnk{margin-left:auto}

.pnx-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.pnx-tbl{width:100%;border-collapse:collapse}
.pnx-tbl th{font-size:var(--f1);font-weight:700;color:var(--n400);text-transform:uppercase;letter-spacing:.1em;padding:0 12px 10px;text-align:left;border-bottom:2px solid var(--n100);white-space:nowrap}
.pnx-tbl th.num,.pnx-tbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.pnx-tbl td{padding:13px 12px;font-size:var(--f2);font-weight:450;color:var(--i2);border-bottom:1px solid var(--n50);vertical-align:middle}
.pnx-tbl tr:last-child td{border-bottom:0}
.pnx-tbl tbody tr{transition:background var(--mo-2) var(--eo)}
.pnx-tbl tbody tr.cl{cursor:pointer}
.pnx-tbl tbody tr.cl:hover td{background:var(--n25)}
.pnx-tbl tbody tr:focus-visible{outline:0;box-shadow:inset var(--ring)}
.pnx-tbl .pnx-chev{color:var(--n400);transition:transform var(--mo-2) var(--eo),color var(--mo-2)}
.pnx-tbl tbody tr.cl:hover .pnx-chev{color:var(--t600);transform:translateX(2px)}

.pnx-id{display:flex;align-items:center;gap:11px;min-width:0}
.pnx-av{width:36px;height:36px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:var(--f2);font-weight:700}
.pnx-nm{font-size:var(--f2);font-weight:650;color:var(--i1);display:flex;align-items:center;gap:6px;min-width:0}
.pnx-nm b{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-nm svg{color:var(--t500);flex-shrink:0}
.pnx-ds{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-c1{display:flex;align-items:center;gap:6px;color:var(--i1);font-weight:500}
.pnx-c1 svg{color:var(--n400);flex-shrink:0}
.pnx-c2{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:3px;padding-left:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-c2.np{padding-left:0}
.pnx-nulo{color:var(--i3);font-weight:450}

.pnx-pill{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:var(--r6);font-size:var(--f0);font-weight:700;letter-spacing:.02em;white-space:nowrap}
.pnx-pill .pnx-dot{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.pnx-pill.ok{background:var(--t50);color:var(--c-ok)}
.pnx-pill.warn{background:var(--op-bg);color:var(--op-t)}
.pnx-pill.dang{background:var(--mal-bg);color:var(--mal-d)}
.pnx-pill.mute{background:var(--n50);color:var(--i3)}
.pnx-pill.teal{background:var(--t50);color:var(--t700)}

.pnx-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px;font-size:var(--f1);font-weight:450;color:var(--i3)}
.pnx-foot b{color:var(--i1);font-weight:650}
.pnx-pag{display:flex;align-items:center;gap:5px}
.pnx-pag button{min-width:30px;height:30px;padding:0 8px;border-radius:var(--r6);border:1px solid var(--n200);background:var(--n0);color:var(--i2);font-family:inherit;font-size:var(--f1);font-weight:500;cursor:pointer;display:grid;place-items:center;transition:border-color var(--mo-2),background var(--mo-2),color var(--mo-2),transform var(--mo-1) var(--eo)}
.pnx-pag button:hover:not([disabled]):not(.on){border-color:var(--n300);color:var(--i1)}
.pnx-pag button:active:not([disabled]){transform:scale(.93)}
.pnx-pag button.on{background:var(--t600);border-color:var(--t600);color:var(--n0);font-weight:700}
.pnx-pag button[disabled]{opacity:.4;cursor:not-allowed}

/* La entrada escalonada de las filas: decorativa, 35 ms entre una y otra, y no
   bloquea nada — se puede clickear mientras corre. */
@media (prefers-reduced-motion:no-preference){
  .pnx-tbl tbody tr{animation:pnx-in 280ms var(--eo) both}
  .pnx-tbl tbody tr:nth-child(1){animation-delay:0ms}   .pnx-tbl tbody tr:nth-child(2){animation-delay:35ms}
  .pnx-tbl tbody tr:nth-child(3){animation-delay:70ms}  .pnx-tbl tbody tr:nth-child(4){animation-delay:105ms}
  .pnx-tbl tbody tr:nth-child(5){animation-delay:140ms} .pnx-tbl tbody tr:nth-child(6){animation-delay:175ms}
  .pnx-tbl tbody tr:nth-child(7){animation-delay:210ms} .pnx-tbl tbody tr:nth-child(8){animation-delay:245ms}
}
@keyframes pnx-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ═══════════════════  4 · BARRA DE BÚSQUEDA Y FILTROS  ═══════════════════ */

.pnx-bar{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.pnx-q{position:relative;flex:1;min-width:210px;max-width:440px}
.pnx-q>svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--n400);pointer-events:none}
.pnx-q input{width:100%;height:38px;border:1px solid var(--n200);border-radius:var(--r8);background:var(--n0);padding:0 14px 0 38px;font-family:inherit;font-size:var(--f2);font-weight:450;color:var(--i1)}
.pnx-q input::placeholder{color:var(--i3)}
.pnx-q input:focus{outline:0;border-color:var(--t400);box-shadow:var(--ring)}
.pnx-sel{position:relative}
.pnx-sel select{appearance:none;-webkit-appearance:none;height:38px;border:1px solid var(--n200);border-radius:var(--r8);background:var(--n0);padding:0 34px 0 13px;font-family:inherit;font-size:var(--f2);font-weight:500;color:var(--i2);cursor:pointer;transition:border-color var(--mo-2),color var(--mo-2),background var(--mo-2)}
.pnx-sel select:focus{outline:0;border-color:var(--t400);box-shadow:var(--ring)}
.pnx-sel.act select{border-color:var(--t300);color:var(--t700);background:var(--t50);font-weight:650}
.pnx-sel>svg{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--n400);pointer-events:none}
.pnx-reset{width:38px;height:38px;flex-shrink:0;border-radius:var(--r8);border:1px solid var(--n200);background:var(--n0);color:var(--i2);display:grid;place-items:center;cursor:pointer;transition:border-color var(--mo-2),color var(--mo-2),transform var(--mo-2) var(--eo)}
.pnx-reset:hover{border-color:var(--n300);color:var(--i1)}
.pnx-reset:active{transform:scale(.94)}
.pnx-reset.act{border-color:var(--t300);background:var(--t50);color:var(--t700)}

/* ═════════════════════  5 · EL DETALLE · LA BANDA  ═══════════════════════ */

.pnx-back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;font-family:inherit;font-size:var(--f1);font-weight:700;color:var(--i3);padding:16px var(--pnx-pad) 0;transition:color var(--mo-2),gap var(--mo-2) var(--eo)}
.pnx-back:hover{color:var(--t700);gap:9px}

.pnx-dhero{position:relative;overflow:hidden;background:linear-gradient(104deg,var(--t50) 0%,#f4fbfa 48%,#e6f7f2 100%);border-bottom:1px solid var(--t100);padding:26px var(--pnx-pad) 28px;display:flex;align-items:center;gap:20px}
.pnx-dhero .pnx-hero-art{width:min(480px,32%);height:196px;right:20%;opacity:.5}
.pnx-dav{width:72px;height:72px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:var(--f5);font-weight:700;position:relative;z-index:1}
.pnx-dhead{position:relative;z-index:1;min-width:0}
.pnx-dnm{display:flex;align-items:center;gap:11px;margin-bottom:4px;flex-wrap:wrap}
/* EL ÚNICO `--f6` DE LA PANTALLA, que es la regla de `v2.css:78`: hay un techo
   y hay uno solo. Acá manda el nombre del partner, que es de lo que trata todo
   lo que sigue. */
.pnx-dnm h1{font-size:var(--f6);font-weight:700;letter-spacing:-1.1px;line-height:1.1;margin:0;color:var(--i1)}
.pnx-dsub{font-size:var(--f2);font-weight:450;color:var(--i2);margin-bottom:11px}
.pnx-meta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.pnx-meta-i{display:inline-flex;align-items:center;gap:6px;font-size:var(--f1);font-weight:500;color:var(--i2)}
.pnx-meta-i svg{color:var(--n400);flex-shrink:0}
.pnx-dr{margin-left:auto;display:flex;align-items:center;gap:20px;position:relative;z-index:1;flex-shrink:0}
.pnx-cov{font-size:var(--f1);font-weight:450;color:var(--i3);line-height:1.65;text-align:left}
.pnx-cov b{display:block;color:var(--i1);font-weight:650;font-size:var(--f2)}
.pnx-dacts{display:flex;align-items:center;gap:8px}

/* ══════════════════════════  6 · SOLAPAS  ════════════════════════════════
   TRES, no cuatro. El dueño sacó Resumen el 17/09/2026 y su contenido se
   repartió: el mapa y la dona a Responsabilidades, los KPIs y «necesita
   atención» a Performance, los movimientos a Actividad. Resumen repetía
   pedazos de las otras tres, que es la definición de una solapa de más.

   NO son `sticky`. Lo eran, y no aportaba nada en una página que scrollea con
   la plataforma: sumaba un `z-index` compitiendo con el del mapa. */
.pnx-tabs{display:flex;align-items:center;gap:2px;padding:0 var(--pnx-pad);background:var(--n0);border-bottom:1px solid var(--n100)}
.pnx-tab{position:relative;background:none;border:0;cursor:pointer;font-family:inherit;font-size:var(--f2);font-weight:500;color:var(--i3);padding:15px 14px 14px;transition:color var(--mo-2) var(--eo)}
.pnx-tab:hover{color:var(--i1)}
.pnx-tab.on{color:var(--t700);font-weight:700}
.pnx-tab::after{content:'';position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px 2px 0 0;background:var(--t600);transform:scaleX(0);transform-origin:center;transition:transform var(--mo-3) var(--eo)}
.pnx-tab.on::after{transform:scaleX(1)}

.pnx-pane{padding:26px var(--pnx-pad) 66px}
@media (prefers-reduced-motion:no-preference){
  .pnx-pane{animation:pnx-pane 240ms var(--eo) both}
}
@keyframes pnx-pane{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

/* ══════════════════  7 · TARJETAS, KPIs Y GRILLAS  ══════════════════════
   El módulo de tarjeta de Alertas es 15px 16px con radio 14, hairline `--n100`
   y sin sombra en reposo. Los gaps son 16 entre tarjetas de una grilla y 18
   entre bloques, que es lo que usan `.v2-rg-main` y `.v2-rg-split2`. */

.pnx-card{background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);overflow:hidden}
.pnx-card-h{display:flex;align-items:center;gap:10px;padding:15px 16px 0}
.pnx-card-h h3{font-size:var(--f3);font-weight:650;letter-spacing:-.2px;margin:0;color:var(--i1)}
.pnx-card-h p{font-size:var(--f1);font-weight:450;color:var(--i3);margin:3px 0 0;line-height:1.5}
.pnx-card-h .pnx-lnk,.pnx-card-h .pnx-btn-o{margin-left:auto;flex-shrink:0}
.pnx-card-b{padding:14px 16px 16px}
.pnx-ic{width:32px;height:32px;border-radius:var(--r8);flex-shrink:0;display:grid;place-items:center}

.pnx-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--pnx-gut);margin-bottom:var(--pnx-blq)}
.pnx-kpi{background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);padding:15px 16px 16px;display:flex;gap:12px;align-items:flex-start}
.pnx-kpi-b{min-width:0;flex:1}
.pnx-kpi-l{font-size:var(--f1);font-weight:500;color:var(--i3);margin-bottom:5px}
.pnx-kpi-n{font-size:var(--f5);font-weight:700;letter-spacing:-.9px;line-height:1;color:var(--i1);font-variant-numeric:tabular-nums}
.pnx-kpi-cap{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:6px}
.pnx-prog{height:4px;border-radius:2px;background:var(--n50);margin-top:10px;overflow:hidden}
.pnx-prog i{display:block;height:100%;border-radius:2px;background:var(--t500);transform-origin:left}
@media (prefers-reduced-motion:no-preference){
  .pnx-prog i{animation:pnx-prog 560ms var(--eo) both}
}
@keyframes pnx-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.pnx-prog.warn i{background:var(--c-op)}
.pnx-prog.dang i{background:var(--mal)}

/* DOS RITMOS Y NADA MÁS: 2/1 y 1/1. Había tres grillas distintas —1.25/1/1.35,
   1.4/1 y 1.25/1.1/.9— y con tres columnas desiguales ninguna tarjeta parecía
   mandar sobre otra: todo quedaba nivelado hacia arriba. Con 2/1 la de la
   izquierda es la que manda y se lee de una. */
.pnx-g21{display:grid;grid-template-columns:2fr 1fr;gap:var(--pnx-gut);margin-bottom:var(--pnx-blq);align-items:start}
.pnx-g11{display:grid;grid-template-columns:1fr 1fr;gap:var(--pnx-gut);margin-bottom:var(--pnx-blq);align-items:start}
.pnx-col{display:flex;flex-direction:column;gap:var(--pnx-gut)}

/* ═══════════════════  8 · MAPA, DONA Y LEYENDAS  ════════════════════════ */

.pnx-map{position:relative;height:250px;border-radius:var(--r8);overflow:hidden;background:var(--n50);border:1px solid var(--n100)}
.pnx-map-c{position:absolute;inset:0}
.pnx-map-leg{position:absolute;left:10px;bottom:10px;z-index:400;background:rgba(255,255,255,.95);border:1px solid var(--n100);border-radius:var(--r6);padding:8px 10px;font-size:var(--f1);box-shadow:var(--sh-rest)}
.pnx-map-leg div{display:flex;align-items:center;gap:7px;color:var(--i2)}
.pnx-map-leg div+div{margin-top:4px}
.pnx-map-leg i{width:8px;height:8px;border-radius:50%;background:var(--t600);flex-shrink:0}
.pnx-map-leg b{margin-left:auto;padding-left:14px;color:var(--i1);font-weight:700;font-variant-numeric:tabular-nums}
.pnx-map-vac{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;font-size:var(--f2);font-weight:450;color:var(--i3);line-height:1.6}

.pnx-dnt{display:flex;align-items:center;gap:20px}
.pnx-dnt-s{position:relative;width:132px;height:132px;flex-shrink:0}
.pnx-dnt-s svg{transform:rotate(-90deg)}
.pnx-dnt-c{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.pnx-dnt-c b{display:block;font-size:var(--f5);font-weight:700;letter-spacing:-.9px;line-height:1;color:var(--i1);font-variant-numeric:tabular-nums}
.pnx-dnt-c span{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:3px;display:block}
.pnx-leg{flex:1;min-width:0}
.pnx-leg-i{display:flex;align-items:center;gap:8px;font-size:var(--f2);font-weight:450;color:var(--i2);padding:4px 0}
.pnx-leg-i i{width:8px;height:8px;border-radius:2px;flex-shrink:0}
.pnx-leg-i span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-leg-i b{margin-left:auto;padding-left:12px;color:var(--i1);font-weight:650;font-variant-numeric:tabular-nums}

/* ══════════════  9 · LISTAS: MOVIMIENTOS Y «NECESITA ATENCIÓN»  ═════════ */

.pnx-li{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--n50);padding:11px 16px;font-family:inherit;cursor:pointer;transition:background var(--mo-2) var(--eo)}
.pnx-li:first-of-type{border-top:0}
.pnx-li:hover{background:var(--n25)}
.pnx-li-b{min-width:0;flex:1}
.pnx-li-t{font-size:var(--f2);font-weight:650;color:var(--i1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-li-s{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-li .pnx-chev{color:var(--n400);flex-shrink:0}
.pnx-li:hover .pnx-chev{color:var(--t600)}
.pnx-li-st{flex-shrink:0}

.pnx-tl{padding:4px 16px 8px}
.pnx-tl-i{display:flex;gap:11px;padding:8px 0;position:relative}
.pnx-tl-i::before{content:'';position:absolute;left:12px;top:30px;bottom:-8px;width:1px;background:var(--n100)}
.pnx-tl-i:last-child::before{display:none}
.pnx-tl-d{width:25px;height:25px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;position:relative;z-index:1}
.pnx-tl-b{min-width:0;flex:1}
.pnx-tl-t{font-size:var(--f2);font-weight:500;color:var(--i1)}
.pnx-tl-s{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-tl-w{font-size:var(--f1);font-weight:450;color:var(--i3);flex-shrink:0;padding-left:12px;white-space:nowrap}

.pnx-att{display:flex;align-items:center;gap:11px;padding:11px 16px;border-top:1px solid var(--n50)}
.pnx-att:first-of-type{border-top:0}
.pnx-att-b{min-width:0;flex:1}
.pnx-att-t{font-size:var(--f2);font-weight:650;color:var(--i1)}
.pnx-att-s{font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:2px}
.pnx-att button{flex-shrink:0;height:27px;padding:0 11px;border-radius:var(--r6);border:0;cursor:pointer;font-family:inherit;font-size:var(--f1);font-weight:700;transition:transform var(--mo-2) var(--eo),filter var(--mo-2)}
.pnx-att button:active{transform:scale(.96)}
.pnx-att button:hover{filter:brightness(.96)}
.pnx-att button.warn{background:var(--op-bg);color:var(--op-t)}
.pnx-att button.dang{background:var(--mal-bg);color:var(--mal-d)}
.pnx-att button.teal{background:var(--t50);color:var(--t700)}

/* ══════════════════  10 · SOLAPA RESPONSABILIDADES  ═════════════════════ */

.pnx-rhead{display:flex;align-items:flex-start;gap:13px;margin-bottom:18px}
.pnx-rhead .pnx-ic{width:46px;height:46px;border-radius:50%}
.pnx-rhead h2{font-size:var(--f4);font-weight:700;letter-spacing:-.4px;margin:0 0 3px;color:var(--i1)}
.pnx-rhead p{font-size:var(--f2);font-weight:450;color:var(--i2);margin:0;line-height:1.6;max-width:74ch}
.pnx-rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--pnx-gut);margin-bottom:var(--pnx-blq);align-items:start}
@media(max-width:1250px){.pnx-rgrid{grid-template-columns:repeat(2,1fr)}}

.pnx-rc{background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);overflow:hidden}
.pnx-rc-t{display:flex;align-items:center;gap:11px;padding:15px 16px 0}
.pnx-rc-b{min-width:0;flex:1}
.pnx-rc-b h3{font-size:var(--f3);font-weight:650;letter-spacing:-.2px;margin:0 0 3px;color:var(--i1)}
.pnx-rc-b p{font-size:var(--f1);font-weight:450;color:var(--i3);margin:0}
.pnx-rc-v{padding:13px 16px 15px;margin-top:12px;border-top:1px solid var(--n50);font-size:var(--f1);color:var(--i2);display:flex;flex-wrap:wrap;gap:6px}
.pnx-rc-v i{font-style:normal;background:var(--n50);border-radius:var(--r6);padding:4px 9px;white-space:nowrap;font-weight:500}
.pnx-rc-v.vac{color:var(--i3)}
.pnx-rc-v.vac i{background:none;padding:0;font-weight:450}

.pnx-acc{border:1px solid var(--n100);border-radius:var(--r14);overflow:hidden;background:var(--n0);transition:border-color var(--mo-2) var(--eo)}
.pnx-acc.on{border-color:var(--t200)}
.pnx-acc-t{display:flex;align-items:center;gap:11px;width:100%;padding:13px 16px;background:none;border:0;cursor:pointer;font-family:inherit;text-align:left;transition:background var(--mo-2) var(--eo)}
.pnx-acc-t:hover{background:var(--n25)}
.pnx-acc-b{min-width:0;flex:1}
.pnx-acc-b h4{font-size:var(--f3);font-weight:650;letter-spacing:-.2px;margin:0 0 2px;color:var(--i1)}
.pnx-acc-b p{font-size:var(--f1);font-weight:450;color:var(--i3);margin:0}
.pnx-acc-chips{display:flex;align-items:center;flex-shrink:0;font-size:var(--f1);font-weight:450;color:var(--i3);max-width:320px;overflow:hidden}
.pnx-acc-chips i{font-style:normal;white-space:nowrap}
.pnx-acc-chips i+i::before{content:'·';margin:0 6px;color:var(--n300)}
.pnx-acc-ok{width:20px;height:20px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:var(--n100);color:var(--n0);transition:background var(--mo-2) var(--eo)}
.pnx-acc.on .pnx-acc-ok{background:var(--t500)}
.pnx-acc-cv{color:var(--n400);flex-shrink:0;transition:transform var(--mo-3) var(--eo)}
.pnx-acc.abierto .pnx-acc-cv{transform:rotate(180deg)}
.pnx-acc-p{border-top:1px solid var(--n50);padding:13px 16px;display:flex;flex-wrap:wrap;gap:7px}
.pnx-opt{height:29px;padding:0 11px;border-radius:var(--r6);border:1px solid var(--n200);background:var(--n0);font-family:inherit;font-size:var(--f1);font-weight:500;color:var(--i2);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:border-color var(--mo-2),background var(--mo-2),color var(--mo-2),transform var(--mo-1) var(--eo)}
.pnx-opt:hover{border-color:var(--t300)}
.pnx-opt:active{transform:scale(.96)}
.pnx-opt.on{border-color:var(--t400);background:var(--t50);color:var(--t700);font-weight:700}
.pnx-opt.ajeno{opacity:.6}
.pnx-opt small{color:var(--i3);font-weight:450}

/* ════════════════════  11 · SOLAPA PERFORMANCE  ═════════════════════════ */

.pnx-fbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:var(--pnx-blq)}
.pnx-fbar .pnx-btn-o{margin-left:auto}
.pnx-chipf{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 13px;border-radius:var(--r8);border:1px solid var(--n100);background:var(--n0);font-size:var(--f1);font-weight:500;color:var(--i2)}
.pnx-chipf svg{color:var(--n400)}

.pnx-barra{padding:7px 0}
.pnx-barra-h{display:flex;align-items:baseline;gap:10px;font-size:var(--f2);margin-bottom:5px}
.pnx-barra-h span{color:var(--i1);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-barra-h b{margin-left:auto;color:var(--i1);font-weight:650;font-variant-numeric:tabular-nums}
.pnx-barra-h em{font-style:normal;color:var(--i3);font-size:var(--f1);width:36px;text-align:right}

.pnx-ins{background:var(--t50);border-color:var(--t100)}
.pnx-ins-i{display:flex;gap:9px;padding:7px 0;font-size:var(--f2);font-weight:450;color:var(--i2);line-height:1.6}
.pnx-ins-i svg{color:var(--t600);flex-shrink:0;margin-top:2px}
.pnx-ins-i b{color:var(--t700);font-weight:650}
.pnx-ins-i em{font-style:normal;color:var(--mal-d);font-weight:650}

/* ═══════════════════════  12 · SOLAPA ACTIVIDAD  ════════════════════════ */

.pnx-day{font-size:var(--f1);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--n400);padding:16px 16px 4px}
.pnx-act-l .pnx-tl-i{padding:10px 16px}
.pnx-act-l .pnx-tl-i::before{left:28px;top:32px}

/* ══════════════════════  13 · EL ALTA (3 PASOS)  ════════════════════════ */



.pnx-form{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.pnx-fld{display:flex;flex-direction:column;min-width:0}
.pnx-fld.full{grid-column:1/-1}
.pnx-lb{font-size:var(--f1);font-weight:650;color:var(--i1);margin-bottom:6px;display:flex;align-items:center;gap:4px}
.pnx-lb i{font-style:normal;color:var(--mal)}
.pnx-lb span{color:var(--i3);font-weight:450}
.pnx-in,.pnx-ta{width:100%;border:1px solid var(--n200);border-radius:var(--r8);background:var(--n0);font-family:inherit;font-size:var(--f2);font-weight:450;color:var(--i1);transition:border-color var(--mo-2),box-shadow var(--mo-2)}
.pnx-in{height:38px;padding:0 12px}
.pnx-ta{padding:10px 12px;min-height:84px;resize:vertical;line-height:1.6}
.pnx-in::placeholder,.pnx-ta::placeholder{color:var(--i3)}
.pnx-in:focus,.pnx-ta:focus{outline:0;border-color:var(--t400);box-shadow:var(--ring)}
.pnx-in.bad{border-color:var(--mal)}
.pnx-wi{position:relative}
.pnx-wi .pnx-in{padding-left:36px}
.pnx-wi>svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--n400);pointer-events:none}
.pnx-err{font-size:var(--f1);font-weight:500;color:var(--mal-d);margin-top:6px;display:flex;align-items:center;gap:5px}

.pnx-types{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.pnx-type{background:var(--n0);border:1px solid var(--n200);border-radius:var(--r8);padding:13px 8px 11px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;font-family:inherit;font-size:var(--f1);font-weight:500;color:var(--i2);text-align:center;transition:border-color var(--mo-2) var(--eo),background var(--mo-2) var(--eo),color var(--mo-2),transform var(--mo-2) var(--eo)}
.pnx-type svg{color:var(--n400);transition:color var(--mo-2)}
.pnx-type:hover{border-color:var(--t300);background:var(--n25)}
.pnx-type:active{transform:scale(.97)}
.pnx-type.on{border-color:var(--t400);background:var(--t50);color:var(--t700);font-weight:700}
.pnx-type.on svg{color:var(--t600)}

.pnx-note{display:flex;gap:10px;background:var(--n25);border:1px solid var(--n100);border-radius:var(--r8);padding:11px 13px;font-size:var(--f2);font-weight:450;color:var(--i2);line-height:1.6;margin-top:18px}
.pnx-note svg{color:var(--n400);flex-shrink:0;margin-top:2px}
.pnx-note.teal{background:var(--t50);border-color:var(--t100)}
.pnx-note.teal svg{color:var(--t600)}
.pnx-note b{color:var(--i1);font-weight:650}

.pnx-rev{display:grid;grid-template-columns:1fr 1fr}
.pnx-rev-i{padding:15px 18px;border-top:1px solid var(--n50)}
.pnx-rev-i:nth-child(odd){border-right:1px solid var(--n50)}
.pnx-rev-i:nth-child(-n+2){border-top:0}
.pnx-rev-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.pnx-rev-h h4{font-size:var(--f2);font-weight:650;margin:0;color:var(--i1)}
.pnx-rev-h .pnx-ic{width:28px;height:28px}
.pnx-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:var(--f2)}
.pnx-kv dt{color:var(--i3);font-weight:450}
.pnx-kv dd{margin:0;color:var(--i1);font-weight:500}
.pnx-rev-v{display:flex;align-items:center;gap:9px;background:var(--n25);border-radius:var(--r6);padding:9px 11px;font-size:var(--f1);font-weight:450;color:var(--i2);cursor:pointer;width:100%;border:0;font-family:inherit;text-align:left;transition:background var(--mo-2) var(--eo)}
.pnx-rev-v:hover{background:var(--n50)}
.pnx-rev-v span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-rev-v .pnx-chev{color:var(--n400)}
.pnx-rev-ok{background:var(--t50);border:1px solid var(--t100);border-radius:var(--r8);padding:13px 15px;display:flex;gap:11px;align-items:flex-start;margin:15px 18px}
.pnx-rev-ok svg{color:var(--t600);flex-shrink:0;margin-top:1px}
.pnx-rev-ok h4{font-size:var(--f2);font-weight:650;margin:0 0 3px;color:var(--i1)}
.pnx-rev-ok p{font-size:var(--f2);font-weight:450;color:var(--i2);margin:0;line-height:1.6}


.pnx-bens{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--pnx-gut);padding:30px var(--pnx-pad) 0;margin-top:22px;border-top:1px solid var(--n100)}
.pnx-ben{display:flex;align-items:flex-start;gap:11px}
.pnx-ben .pnx-ic{width:38px;height:38px;border-radius:50%;background:var(--t50);color:var(--t600)}
.pnx-ben h4{font-size:var(--f2);font-weight:650;margin:0 0 3px;color:var(--i1)}
.pnx-ben p{font-size:var(--f1);font-weight:450;color:var(--i3);margin:0;line-height:1.55}

/* ═════════════════════════  14 · VACÍOS  ════════════════════════════════ */

.pnx-vac{margin:0 var(--pnx-pad);background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);padding:48px 40px 52px;text-align:center}
.pnx-vac-art{width:168px;height:106px;margin:0 auto 20px;color:var(--t500)}
.pnx-vac h3{font-size:var(--f4);font-weight:700;letter-spacing:-.4px;margin:0 0 9px;color:var(--i1)}
.pnx-vac p{font-size:var(--f2);font-weight:450;color:var(--i2);line-height:1.6;max-width:62ch;margin:0 auto 20px}
.pnx-vac p b{color:var(--i1);font-weight:650}
.pnx-vac-min{padding:36px 20px;color:var(--i3);font-size:var(--f2);font-weight:450;text-align:center;line-height:1.6}
.pnx-vac-min b{color:var(--i1);font-weight:650}

/* ═══════════════════════════  15 · RESPONSIVE  ══════════════════════════ */

@media(max-width:1400px){
  .pnx-kpis{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1180px){
  .pnx-hero,.pnx-dhero{flex-wrap:wrap}
  .pnx-hero-r,.pnx-dr{margin-left:0;width:100%;justify-content:space-between}
  .pnx-hero-art{display:none}
  .pnx-bens{grid-template-columns:repeat(2,1fr)}
  .pnx-g21,.pnx-g11{grid-template-columns:1fr}
}
@media(max-width:860px){
  .pnx-kpis,.pnx-rgrid,.pnx-bens,.pnx-form,.pnx-rev{grid-template-columns:1fr}
  .pnx-types{grid-template-columns:repeat(2,1fr)}
  .pnx-rev-i:nth-child(odd){border-right:0}
  .pnx-rev-i:nth-child(2){border-top:1px solid var(--n50)}
  .pnx-dnm h1{font-size:var(--f5);letter-spacing:-.6px}
  .pnx-hero-t{font-size:var(--f4);letter-spacing:-.4px}
  .pnx-stat{padding:0 13px}
  .pnx-dnt{flex-direction:column;align-items:stretch}
  .pnx-dnt-s{margin:0 auto}
  .pnx-tabs{overflow-x:auto;scrollbar-width:none}
  .pnx-tabs::-webkit-scrollbar{display:none}
  .pnx-acc-chips{display:none}
}

/* Movimiento reducido: se quedan la opacidad y el color, se va el
   desplazamiento. No es «cero animación»: es cero desplazamiento. */
@media (prefers-reduced-motion:reduce){
  .pnx-tbl tbody tr.cl:hover .pnx-chev,.pnx-cta:hover svg{transform:none}
}

/* ═════════════════  16 · EL ALTA, CALCADA DEL SETUP DE REGLAS  ═══════════
   El dueño pidió que se sienta «desarrollado por la misma persona» que
   «Configurar reglas», así que esto no se inventó: se copió la receta del
   wizard vivo —la familia `_v2Wz5*`, `alertas-asistente.js` + `v2.css:5642`—
   y se le cambió el prefijo. Lo que se copia, y por qué:

   · EL STEPPER VA CENTRADO Y EN SU PROPIA FRANJA BLANCA, debajo del título y
     arriba del cuerpo, con `grid-auto-flow:column` y columnas iguales. Con
     `repeat(N,…)` y pocos pasos la barra quedaba corrida a la izquierda; está
     medido en el comentario de `v2.css:5646`.
   · LOS TRES ESTADOS SE DISTINGUEN POR EL ARO, NO POR EL COLOR. Pendiente:
     círculo blanco con borde. Resuelto: teal lleno con tilde. En curso: teal
     oscuro con aro de 4px y SU NÚMERO, nunca el tilde —un tilde sobre lo que
     estás editando dice «esto ya está»—.
   · EL RIEL ENTRE CÍRCULOS se dibuja de centro a centro con
     `left:calc(50% + 22px)`, para que los tramos midan igual sin importar el
     largo de la etiqueta.
   · SE PUEDE SALTAR a cualquier paso ya alcanzado tocándolo: guiado no es
     carcelario. Lo que sí se bloquea es avanzar con «Continuar». Es una
     asimetría a propósito.
   · EL PIE NO REPITE EL AVANCE —eso lo dice el stepper—: dice A DÓNDE VA, con
     el destino nombrado, y cuando no puede, POR QUÉ. Un botón apagado sin
     explicación es un callejón, y en táctil el `title` no existe.

   LO QUE NO SE COPIA, y es la única diferencia real: el wizard de Reglas es un
   overlay `fixed;inset:0` con su propio scroll, así que su pie es un hermano
   flex y no necesita nada más. El alta de Partners vive DENTRO de la sección y
   scrollea con la plataforma, así que el pie es `sticky;bottom:0`. Mismo
   efecto, sin pelearse con la sidebar —que además se colapsa, así que un
   `fixed` con `left` fijo quedaría mintiendo—. */


/* ── el stepper ── */
.pnx-st-w{background:var(--n0);border-bottom:1px solid var(--n100);padding:0 var(--pnx-pad)}
.pnx-st{list-style:none;margin:0 auto;padding:13px 0 11px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:start;gap:0;max-width:640px}
.pnx-st-i{position:relative;min-width:0}
.pnx-st-i:not(:last-child)::before{content:"";position:absolute;z-index:0;top:21px;left:calc(50% + 22px);right:calc(-50% + 22px);height:2px;border-radius:2px;background:var(--n200)}
.pnx-st-i.ok::before{background:var(--t300)}
.pnx-st-i button{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center;gap:7px;padding:7px 6px 5px;background:none;border:0;cursor:pointer;border-radius:var(--r14);min-width:0;font-family:inherit;transition:background var(--mo-2) ease}
.pnx-st-i button[disabled]{cursor:default}
.pnx-st-n{width:28px;height:28px;border-radius:50%;flex:0 0 auto;display:flex;position:relative;z-index:1;align-items:center;justify-content:center;font-size:var(--f2);font-weight:700;background:var(--n0);color:var(--n400);border:1px solid var(--n200);font-variant-numeric:tabular-nums;transition:background var(--mo-2) ease,color var(--mo-2) ease,border-color var(--mo-2) ease,box-shadow var(--mo-2) var(--eo)}
.pnx-st-t{font-size:var(--f2);font-weight:600;color:var(--i3);line-height:1.25;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-st-i.ok .pnx-st-n{background:var(--t600);color:var(--n0);border-color:var(--t600)}
.pnx-st-i.ok .pnx-st-t{color:var(--t800)}
.pnx-st-i.on .pnx-st-n{background:var(--t700);color:var(--n0);border-color:var(--t700);box-shadow:0 0 0 4px var(--t100)}
.pnx-st-i.on .pnx-st-t{color:var(--i1);font-weight:750}
@media (hover:hover){
  .pnx-st-i button:not([disabled]):hover{background:var(--t50)}
  .pnx-st-i button:not([disabled]):hover .pnx-st-n{border-color:var(--t300);transform:translateY(-1px)}
}
@media (max-width:820px){ .pnx-st-t{display:none} }
@media (prefers-reduced-motion:reduce){ .pnx-st-n{transition:none} }

/* ── el cuerpo de un paso: UNA columna, centrada ──
   Sin riel lateral. Eran dos recuadros al costado y el dueño los sacó: en una
   pantalla angosta la columna de la derecha se comía la mitad del formulario,
   y el «resumen que se va armando» repetía lo que el propio paso ya mostraba. */
/* UNA SOLA LINEA VERTICAL PARA TODA LA SECCION.
   El cuerpo del alta usa EL MISMO padding lateral que el resto de Partners y
   que Reglas -`--pnx-pad`, 52px, el de `#plat-reglas` en `v2.css:6721`-, y no
   un riel centrado con `max-width` propio. Tenia uno, y el resultado era que
   el titulo arrancaba en 288 y las tarjetas en 341: dos alineaciones en la
   misma pantalla, que es exactamente lo que se ve como «problema de padding».

   Lo unico que sigue yendo de borde a borde son los FONDOS -la banda del
   titulo, la franja del stepper y la del pie-. Su contenido respeta la linea.

   Se perdio una vez, ademas: un script de limpieza que borraba `.pnx-wz{` se
   llevo la version vieja Y la nueva, y el sintoma fue que los bloques se iban
   de borde a borde mientras el pie se quedaba en su riel. */
.pnx-wz{display:block;padding:26px var(--pnx-pad) 40px}
.pnx-wz-main{display:flex;flex-direction:column;gap:18px}
@media (prefers-reduced-motion:no-preference){
  .pnx-wz-main>*{animation:pnx-paso var(--mo-4) var(--eo) backwards}
  .pnx-wz-main>*:nth-child(2){animation-delay:50ms}
  .pnx-wz-main>*:nth-child(3){animation-delay:100ms}
  .pnx-wz-main>*:nth-child(4){animation-delay:150ms}
}
@keyframes pnx-paso{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.pnx-hd{display:flex;align-items:flex-start;gap:15px;background:var(--n0);border:1px solid var(--n100);border-radius:var(--r14);padding:20px 22px}
.pnx-hd-i{width:48px;height:48px;border-radius:15px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:var(--t50);color:var(--t700);border:1px solid var(--t100)}
.pnx-hd-p{font-size:var(--f1);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--i3)}
.pnx-hd h2{margin:5px 0 0;font-size:var(--f5);font-weight:700;letter-spacing:-1px;line-height:1.14;color:var(--i1)}
.pnx-hd p{margin:7px 0 0;font-size:var(--f2);font-weight:450;color:var(--i3);line-height:1.55;max-width:74ch}

/* El bloque del paso. NO lleva borde: el dueño lo pidió, y adentro de un paso
   con tres bloques apilados el borde sólo dibujaba tres cajas donde hay una
   sola lectura. Lo que separa es el aire y la línea del encabezado. */
.pnx-bl{background:var(--n0);border-radius:var(--r14);padding:0 0 4px;overflow:hidden}
.pnx-bl-h{display:flex;align-items:center;gap:12px;padding:18px 22px 14px;border-bottom:1px solid var(--n50)}
/* `>div` a secas alcanzaba tambien al circulo del icono -que es un div- y lo
   estiraba a todo el ancho. El que crece es el bloque de texto, no el icono. */
.pnx-bl-h>div:not(.pnx-ic){flex:1;min-width:0}
.pnx-bl-h b{display:block;font-size:var(--f3);font-weight:700;letter-spacing:-.3px;color:var(--i1)}
.pnx-bl-h span{display:block;font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:3px}
.pnx-bl-h .pnx-bulk{margin-left:auto;flex-shrink:0}
.pnx-bl-c{padding:18px 22px 18px}

/* ── el pie fijo ── */
.pnx-pie-w{position:sticky;bottom:0;z-index:20;background:var(--n0);border-top:1px solid var(--n100);box-shadow:0 -6px 20px rgba(14,28,30,.06);padding:0 var(--pnx-pad)}
.pnx-pie{display:flex;align-items:center;gap:14px;padding:13px 0;flex-wrap:wrap}
.pnx-pie-r{display:flex;align-items:center;gap:10px;margin-left:auto;flex-wrap:wrap}
.pnx-falta{display:inline-flex;align-items:center;gap:7px;margin-left:auto;font-size:var(--f1);font-weight:600;color:var(--op-t);max-width:46ch;line-height:1.35}
.pnx-falta+.pnx-pie-r{margin-left:14px}
.pnx-falta svg{flex:0 0 auto}
.pnx-ib{background:var(--n0);border:1px solid var(--n200);color:var(--i1);height:34px;min-width:34px;padding:0 13px;border-radius:var(--r8);cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:var(--f2);font-weight:600;white-space:nowrap;transition:transform var(--mo-2) var(--eo),border-color var(--mo-2) ease,background var(--mo-2) ease,color var(--mo-2) ease,box-shadow var(--mo-2) ease}
.pnx-ib:active{transform:scale(.97)}
.pnx-ib.big{height:44px;padding:0 22px}
.pnx-ib.pri{background:var(--t700);border-color:var(--t700);color:var(--n0)}
.pnx-ib.gr{background:transparent;border-color:transparent;color:var(--i2)}
.pnx-ib b{font-weight:800}
.pnx-ib[disabled]{cursor:not-allowed}
.pnx-ib.pri[disabled]{background:var(--n100);border-color:var(--n100);color:var(--i3);box-shadow:none;opacity:1}
.pnx-ib.pri[disabled] svg{opacity:.5}
@media (hover:hover) and (pointer:fine){
  .pnx-ib:hover{background:var(--n25);border-color:var(--i3);box-shadow:var(--sh-rest)}
  .pnx-ib.pri:not([disabled]):hover{background:var(--t800);border-color:var(--t800);color:var(--n0);box-shadow:0 4px 14px rgba(10,125,110,.26)}
  .pnx-ib.gr:hover{background:var(--n50);border-color:transparent;box-shadow:none}
}

/* ── la grilla de opciones: tipos, provincias, cortes ──
   `minmax(160px,1fr)` y no 196: está medido en `v2.css` que con 196 daban 5
   columnas a 1120px y «24 provincias se sentían una pared». Y el nombre
   ENVUELVE, no se trunca: «Ciudad de Bueno…» no es una provincia. */
.pnx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px}
.pnx-op{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 9px;border:1px solid var(--n100);border-radius:var(--r8);background:var(--n0);cursor:pointer;font-family:inherit;text-align:left;transition:border-color var(--mo-2) ease,background var(--mo-2) ease,transform var(--mo-1) var(--eo)}
.pnx-op:active{transform:scale(.98)}
.pnx-op-n{flex:1;min-width:0;font-size:var(--f1);font-weight:600;color:var(--i1);line-height:1.4;overflow-wrap:anywhere}
.pnx-op-n i{font-style:normal;font-weight:600;color:var(--n400)}
.pnx-op-ck{width:18px;height:18px;border-radius:var(--r6);flex:0 0 auto;display:grid;place-items:center;border:1px solid var(--n200);background:var(--n0);color:var(--n0);transition:background var(--mo-2) ease,border-color var(--mo-2) ease}
.pnx-op.on{border-color:var(--t200);background:var(--t50)}
.pnx-op.on .pnx-op-ck{background:var(--t600);border-color:var(--t600)}
@media (prefers-reduced-motion:no-preference){
  .pnx-op.on .pnx-op-ck svg{animation:pnx-tilde var(--mo-3) var(--ez-pop) backwards}
}
@keyframes pnx-tilde{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.pnx-op.ajena{opacity:.62}
.pnx-op.ajena .pnx-op-n{font-weight:450}
@media (hover:hover){ .pnx-op:hover{border-color:var(--t300)} }

.pnx-reg{margin-top:14px}
.pnx-reg:first-child{margin-top:0}
.pnx-reg-h{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.pnx-reg-h>span:first-child{font-size:var(--f1);font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--n400)}
.pnx-reg-h .sp{flex:1;min-width:6px}
.pnx-bulk{display:inline-flex;align-items:center;gap:5px}
.pnx-bulk button{border:1px solid var(--n200);background:var(--n0);border-radius:var(--r6);color:var(--i3);font-family:inherit;font-size:var(--f1);font-weight:600;padding:3px 9px;cursor:pointer;transition:border-color var(--mo-2) ease,color var(--mo-2) ease,transform var(--mo-1) var(--eo)}
.pnx-bulk button:active{transform:scale(.94)}
@media (hover:hover){ .pnx-bulk button:hover{border-color:var(--t400);color:var(--t700)} }

/* ── el buscador de localidades ──
   Son 13.521. La regla que ya estaba escrita en `v2.js:1498`: «una lista
   completa no es información, es una pared». Se escribe y aparecen hasta ocho,
   ordenadas; lo que no está en el padrón se puede declarar igual. */
.pnx-bus{position:relative;margin-bottom:10px}
.pnx-bus>svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--n400);pointer-events:none}
.pnx-bus input{width:100%;height:38px;border:1px solid var(--n200);border-radius:var(--r8);background:var(--n0);padding:0 12px 0 36px;font-family:inherit;font-size:var(--f2);font-weight:450;color:var(--i1)}
.pnx-bus input:focus{outline:0;border-color:var(--t400);box-shadow:var(--ring)}
.pnx-sug{display:flex;flex-direction:column;gap:4px}
.pnx-f{display:flex;align-items:center;gap:10px;width:100%;padding:8px 11px;border:1px solid var(--n100);border-radius:var(--r8);background:var(--n0);cursor:pointer;font-family:inherit;text-align:left;transition:border-color var(--mo-2) ease,background var(--mo-2) ease}
.pnx-f:hover{border-color:var(--t300);background:var(--n25)}
.pnx-f.on{border-color:var(--t200);background:var(--t50)}
.pnx-f-b{flex:1;min-width:0;display:block}
/* Son `<span>` adentro de un flex: sin `display:block` el nombre y la bajada
   salian pegados -«BELGRANOCOPO · SANTIAGO DEL ESTERO»-. */
.pnx-f-n{display:block;font-size:var(--f2);font-weight:600;color:var(--i1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-f-s{display:block;font-size:var(--f1);font-weight:450;color:var(--i3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnx-f.nueva .pnx-f-s{color:var(--op-t)}
.pnx-mas{background:none;border:0;cursor:pointer;font-family:inherit;font-size:var(--f1);font-weight:700;color:var(--t700);padding:9px 2px 0;display:inline-flex;align-items:center;gap:5px}
.pnx-mas:hover{color:var(--t600)}
.pnx-sel-l{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--n50)}
.pnx-tag{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 6px 0 10px;border-radius:var(--r6);background:var(--t50);color:var(--t700);font-size:var(--f1);font-weight:600;border:1px solid var(--t100)}
.pnx-tag button{width:17px;height:17px;border:0;border-radius:var(--r6);background:none;color:var(--t700);cursor:pointer;display:grid;place-items:center;transition:background var(--mo-2) ease}
.pnx-tag button:hover{background:var(--t100)}
.pnx-tag.fuera{background:var(--n50);color:var(--i2);border-color:var(--n100)}
.pnx-tag.fuera button{color:var(--i2)}

@media(max-width:860px){
  .pnx-pie{padding:11px 0}
  .pnx-ib.big{height:40px;padding:0 16px}
  .pnx-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
}