/* Estilos de VORTEX. Salieron de index.html el 20 de septiembre de 2026;
el contenido es el mismo. Los colores y tipografías vienen del manual
de marca VORTEX v1.0. */
/* ============================================================
Manual de marca VORTEX v1.0 · 2026 · modo claro (Laue, 19 sep 2026)
Fondo blanco cálido, superficies blancas, texto negro espacial,
azul como luz escasa. Los nombres de variables vienen de la
identidad Vívelo anterior; se conservan para no tocar cada regla.
============================================================ */
:root{
--aire: #FFFFFF; /* superficie */
--papel: #F7F6F2; /* fondo: blanco cálido */
--arena: #EDEEF2; /* gris con tinte azul */
--arena-borde: #D8DAE3;
--linea: #E6E7EC;
--cian: #2F5BFF; /* azul Cobalto: interfaz y botones */
--cian-claro: #DCE6FF; /* azul 100: fondos y estados */
--tinta: #0B0B0F; /* negro espacial */
--tinta-media: #23252E;
--gris: #5C6072;
--gris-suave: #6B7082; /* 4.9:1 sobre blanco */
--cian-texto: #0B4EFF; /* azul Vórtice: enlaces y texto de acento */
--toque: 44px; /* area minima para tocar con el dedo */
--verde: #A9BEFF; /* azul Halo: realce sobre negro */
--exito: #12805A;
--alerta: #B07A00;
--error: #B83A2E;
--radio: 20px;
--sombra: 0 1px 2px rgba(11,11,15,.04), 0 4px 16px rgba(11,11,15,.04);
--display: "Jost", "Century Gothic", system-ui, sans-serif; /* sustituto web de Metropolis */
--texto: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
--cifra: "IBM Plex Mono", ui-monospace, monospace;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
margin:0;
background:var(--aire);
color:var(--tinta);
font-family:var(--texto);
font-size:16px;
line-height:1.69; /* 16/27 del manual */
-webkit-font-smoothing:antialiased;
}
button,input{font:inherit;color:inherit}
/* --- jerarquías del manual --- */
h1{font-family:var(--display);font-weight:300;font-size:2.125rem;line-height:1.1;letter-spacing:-.01em;margin:0 0 10px}
h2{font-family:var(--display);font-weight:300;font-size:1.625rem;line-height:1.15;margin:0}
h3{font-family:var(--display);font-weight:500;font-size:1.125rem;line-height:1.35;margin:0}
p{margin:0}
.nota{font-size:.8125rem;line-height:1.55;color:var(--gris)}
.eyebrow{
font-family:var(--display);font-weight:200;
font-size:.75rem;line-height:1.35;letter-spacing:.44em;
text-transform:uppercase;color:var(--gris-suave);
}
/* La línea base del isotipo, extendida: marca inicio de sección. */
.linea-base{width:44px;height:8px;background:var(--cian);border:0;margin:0 0 14px}
/* ============================ ACCESO ============================ */
.gate{min-height:100%;display:grid;place-items:center;padding:40px 20px;background:var(--papel)}
.card{
width:100%;max-width:428px;background:var(--aire);
border:1px solid var(--linea);
}
/* Cenefa: banda de color a sangre con el logotipo. Alto ≥ 2.5x el logo. */
.cenefa{
background:var(--arena);
padding:26px 32px;
border-bottom:1px solid var(--arena-borde);
display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
.cenefa img{width:172px;height:auto;display:block}
.cenefa .sistema{
font-family:var(--display);font-weight:200;font-size:.6875rem;
letter-spacing:.44em;text-transform:uppercase;color:var(--gris-suave);
padding-left:18px;border-left:1px solid var(--arena-borde);
}
.card-cuerpo{padding:30px 32px 32px}
label{display:block;font-size:.8125rem;color:var(--gris);margin-bottom:6px}
.field{margin-bottom:18px}
input{
width:100%;padding:11px 13px;background:var(--aire);
border:1px solid var(--arena-borde);border-radius:0;
}
input:focus{outline:2px solid var(--cian);outline-offset:0;border-color:var(--cian)}
.hint{font-size:.8125rem;color:var(--gris-suave);margin-top:6px}
/* Verde acción: sólo llamadas a la acción, y nunca con texto blanco. */
.btn{
width:100%;padding:13px 18px;margin-top:4px;
background:var(--verde);color:var(--tinta);
border:none;font-family:var(--display);font-weight:500;font-size:1rem;
letter-spacing:.02em;cursor:pointer;
}
.btn:hover:not(:disabled){background:#CBE63C}
.btn:disabled{opacity:.45;cursor:default}
.msg{
margin:0 0 20px;padding:12px 14px;font-size:.9375rem;line-height:1.5;
background:var(--arena);border-left:4px solid var(--gris-suave);color:var(--gris);
}
.msg.error{background:#FBECEA;border-left-color:#C0392B;color:#7A2A20}
.msg.ok{background:#EEF2FF;border-left-color:var(--cian);color:var(--tinta-media)}
[hidden]{display:none !important}
.linkish{
background:none;border:none;padding:0;cursor:pointer;
color:var(--cian-texto);font-size:.875rem;font-family:var(--texto);
text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;
}
.linkish:hover{color:var(--tinta)}
button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
outline:2px solid var(--cian-texto);outline-offset:2px
}
.centrado{text-align:center;margin-top:16px}
.acceso-sep{display:flex;align-items:center;gap:12px;margin:22px 0 14px;color:var(--gris-suave);font-size:.8125rem}
.acceso-sep::before,.acceso-sep::after{content:"";flex:1;height:1px;background:var(--linea)}
.btn-staff{
width:100%;min-height:48px;padding:12px 18px;background:var(--aire);color:var(--tinta);
border:1px solid var(--tinta);font-family:var(--display);font-weight:500;font-size:1rem;cursor:pointer
}
.btn-staff:hover{background:var(--papel)}
.codigo-input{font-family:var(--display);font-size:1.75rem !important;letter-spacing:.35em;text-align:center;padding:12px 8px !important}
.codigo-a{margin:0 0 16px;padding:12px 14px;background:var(--papel);border:1px solid var(--linea);font-size:.9375rem;line-height:1.5}
.codigo-a b{display:block;color:var(--tinta);overflow-wrap:anywhere;margin:2px 0}
.codigo-acciones{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}
.codigo-acciones .linkish{min-height:var(--toque);font-size:.9375rem}
@media (max-width:420px){
.cenefa .sistema{border-left:0;padding-left:0;flex-basis:100%}
}
/* ============================ PANEL ============================= */
.barra{border-bottom:1px solid var(--linea);background:var(--aire)}
.barra-in{
max-width:1120px;margin:0 auto;padding:18px 24px;
display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
.barra img{width:150px;height:auto;display:block}
.barra .sistema{
font-family:var(--display);font-weight:200;font-size:.6875rem;
letter-spacing:.44em;text-transform:uppercase;color:var(--gris-suave);
padding-left:18px;border-left:1px solid var(--linea);
}
.quien{margin-left:auto;text-align:right;line-height:1.3}
.quien .n{font-family:var(--display);font-weight:500;font-size:.9375rem}
.quien .r{
font-family:var(--display);font-weight:200;font-size:.625rem;
letter-spacing:.34em;text-transform:uppercase;color:var(--cian);
}
.shell{max-width:1120px;margin:0 auto;padding:40px 24px 80px}
section{margin-bottom:46px}
.sec-nota{color:var(--gris);font-size:.9375rem;margin:8px 0 22px;max-width:68ch}
/* Rejilla con filetes por celda: si la última fila no se llena, no queda un bloque gris de relleno. */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));border-top:1px solid var(--linea);border-left:1px solid var(--linea);margin-bottom:12px}
.tile{background:var(--aire);padding:18px 20px 20px;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.tile dt{
font-family:var(--display);font-weight:200;font-size:.625rem;
letter-spacing:.34em;text-transform:uppercase;color:var(--gris-suave);margin-bottom:10px;
}
.tile dd{
margin:0;font-family:var(--display);font-weight:300;font-size:2rem;
line-height:1;font-variant-numeric:tabular-nums;color:var(--tinta);
}
.tile dd small{
display:block;font-family:var(--texto);font-size:.8125rem;font-weight:400;
color:var(--gris);margin-top:8px;line-height:1.45;
}
.tablawrap{overflow-x:auto;border:1px solid var(--linea)}
table{width:100%;border-collapse:collapse;font-size:.9375rem;background:var(--aire)}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--linea);white-space:nowrap}
th{
font-family:var(--display);font-weight:200;font-size:.625rem;
letter-spacing:.34em;text-transform:uppercase;color:var(--gris-suave);
background:var(--papel);
}
tr:last-child td{border-bottom:none}
td.num{text-align:right;font-variant-numeric:tabular-nums}
/* Grupos por estado: la lista larga se abre sólo si se pide. */
.grupos{
display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));
border-top:1px solid var(--linea);border-left:1px solid var(--linea);
}
.grupo{
background:var(--aire);padding:20px 22px;text-align:left;cursor:pointer;
border:none;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);
box-shadow:inset 0 -3px 0 transparent;font-family:var(--texto);
display:flex;flex-direction:column;gap:9px;
}
.grupo:hover{background:var(--papel)}
.grupo[aria-expanded="true"]{background:var(--papel);box-shadow:inset 0 -3px 0 var(--cian)}
.grupo:focus-visible{outline:2px solid var(--cian);outline-offset:-2px}
.grupo .et{
font-family:var(--display);font-weight:200;font-size:.625rem;
letter-spacing:.34em;text-transform:uppercase;color:var(--gris-suave);
}
.grupo .n{
font-family:var(--display);font-weight:300;font-size:2rem;line-height:1;
font-variant-numeric:tabular-nums;color:var(--tinta);
}
.grupo .pie{font-size:.8125rem;line-height:1.4;color:var(--gris)}
.grupo[aria-expanded="true"] .pie{color:var(--cian)}
.grupo.vacio{cursor:default;opacity:.55}
#gen-detalle{margin-top:14px}
/* Niveles: intensidad creciente de color, como en el manual. */
.nivel{display:inline-block;padding:3px 11px;font-family:var(--display);font-weight:500;font-size:.8125rem}
.nivel.vive{background:var(--cian-claro);color:var(--tinta)}
.nivel.vuela{background:var(--cian);color:var(--aire)}
.nivel.trasciende{background:var(--tinta);color:var(--verde)}
.badge{
display:inline-block;padding:2px 10px;font-family:var(--display);
font-weight:400;font-size:.75rem;letter-spacing:.06em;
}
.badge.on{background:#EEF2FF;color:var(--tinta-media);border:1px solid var(--cian-claro)}
.badge.off{background:var(--papel);color:var(--gris-suave);border:1px solid var(--linea)}
footer{
border-top:1px solid var(--linea);padding-top:20px;
color:var(--gris-suave);font-size:.8125rem;max-width:68ch;
}
/* ============================ VISTAS ============================ */
/* Menú lateral por módulos (Laue, 19 sep 2026): tarjeta negra redondeada.
Mandan los módulos (ícono + nombre); sus pantallas se despliegan debajo,
sólo en texto. Reducido, quedan los íconos de los módulos. */
#shell:not([hidden]){display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr;min-height:100vh}
#shell > .barra{display:none}
#shell > .barra .barra-in{max-width:none}
#shell > .shell{grid-column:2;grid-row:2;width:100%}
.vistas{
--m-fondo:#111416; --m-texto:#A9B0B3; --m-suave:#7D868A; --m-activo:#262C2F;
grid-column:1;grid-row:1 / span 2;align-self:start;position:sticky;top:12px;
width:200px;height:calc(100vh - 24px);margin:12px 0 12px 12px;
display:flex;flex-direction:column;gap:4px;padding:14px 12px 16px;
background:var(--m-fondo);border-radius:28px;overflow:hidden;
scrollbar-width:none;transition:width .22s cubic-bezier(.2,.8,.2,1);
}
.menu-lista{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:3px;overflow-y:auto;scrollbar-width:none;margin:0 -4px;padding:0 4px}
.menu-lista::-webkit-scrollbar{display:none}
.vistas button{background:none;border:0;cursor:pointer;font-family:var(--display)}
.vistas button:focus-visible{outline:2px solid var(--cian);outline-offset:-2px}
.vistas .ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.menu-cabeza{position:relative;display:flex;flex-direction:column;align-items:center;margin:4px 0 10px}
.menu-marca{display:flex;flex-direction:column;align-items:center;gap:4px}
.menu-marca img{width:72px;height:auto}
.menu-marca span{font-family:var(--display);font-weight:500;font-size:.8125rem;letter-spacing:.42em;margin-right:-.42em;color:#fff}
.menu-centro{margin:0 0 12px;padding:8px 12px;border-radius:14px;background:#1C2124}
.menu-centro img{display:block;width:84px;height:auto}
.menu-flecha{
position:absolute;top:-4px;right:-4px;display:grid;place-items:center;flex:none;
width:36px;height:36px;border-radius:12px;background:var(--m-activo) !important;color:#fff;
}
.menu-flecha .ico{transition:transform .22s}
.menu-flecha:hover{background:#323A3E !important}
.modulo-b{
position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:44px;
padding:0 12px;border-radius:16px;text-align:left;white-space:nowrap;
font-weight:500;font-size:.8125rem;letter-spacing:.16em;color:var(--m-texto);
}
.modulo-b:hover{color:#fff;background:#1C2124}
.modulo.activo > .modulo-b{color:#fff;background:var(--m-activo)}
.modulo.activo > .modulo-b .ico{color:var(--cian)}
.modulo-b .chev{width:16px;height:16px;margin-left:auto;stroke-width:2;transition:transform .2s;color:var(--m-suave)}
.modulo.abierto > .modulo-b .chev{transform:rotate(90deg)}
.modulo.directo > .modulo-b .chev{display:none}
.sub{display:none;flex-direction:column;gap:1px;margin:2px 0 6px 21px;padding-left:8px;border-left:1px solid #2A3033}
.modulo.abierto:not(.directo) > .sub{display:flex}
.sub button{
display:flex;align-items:center;width:100%;min-height:34px;padding:0 12px;border-radius:12px;
text-align:left;white-space:nowrap;font-weight:400;font-size:.9063rem;color:var(--m-texto);
}
.sub button:hover{color:#fff;background:#1C2124}
.sub button[aria-current="page"]{color:#fff;font-weight:500;background:#1C2124;box-shadow:inset 2px 0 0 var(--cian)}
.vistas .cuenta{margin-left:auto;background:var(--cian);color:#0B1417;letter-spacing:0}
.modulo-b .cuenta + .chev{margin-left:8px}
/* Tu foto al pie del menú: tocarla cambia la foto. */
.menu-yo{flex:none;display:flex;align-items:center;gap:10px;margin-top:8px;padding:12px 0 0;border-top:1px solid #2A3033}
.menu-foto{position:relative;flex:none;display:block;border-radius:50%;cursor:pointer}
.menu-foto .avatar{--t:40px;box-shadow:0 0 0 2px #2A3033}
.menu-foto:hover .avatar, .menu-foto:focus-within .avatar{box-shadow:0 0 0 2px var(--cian)}
.menu-foto input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.menu-yo-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.menu-yo-t b{font-family:var(--display);font-weight:500;font-size:.875rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu-yo-t span{font-size:.75rem;color:var(--m-suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#shell.compacto .menu-yo{justify-content:center;padding-left:0;padding-right:0}
#shell.compacto .menu-yo-t{display:none}
.menu-link{flex:none;align-self:flex-start;white-space:nowrap;margin-top:6px;padding:6px 2px;font-size:.75rem;color:var(--m-texto);text-align:left;text-decoration:underline;text-underline-offset:3px}
.menu-link:hover{color:#fff}
.menu-salir{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;color:var(--m-texto)}
.menu-salir .ico{width:18px;height:18px}
.menu-salir:hover{color:#fff;background:#1C2124}
#shell.compacto .menu-yo{flex-direction:column;gap:8px}
#shell.compacto .menu-link{display:none}
/* Reducido: sólo los íconos de los módulos. */
#shell.compacto .vistas{width:72px}
#shell.compacto .menu-cabeza{gap:10px;margin-bottom:12px}
#shell.compacto .menu-marca img{width:44px}
#shell.compacto .menu-flecha{position:static;width:40px;height:40px}
#shell.compacto .menu-marca span, #shell.compacto .menu-centro{display:none}
#shell.compacto .menu-flecha .ico{transform:rotate(180deg)}
#shell.compacto .modulo-b{justify-content:center;padding:0}
#shell.compacto .modulo-b .etq{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#shell.compacto .modulo-b .chev, #shell.compacto .sub{display:none !important}
#shell.compacto .vistas .cuenta{position:absolute;top:5px;right:5px;min-width:18px;padding:0 4px;line-height:16px;font-size:.6875rem;margin:0}
.btn-menu{
display:none;min-height:var(--toque);padding:0 14px;cursor:pointer;
background:none;border:1px solid var(--linea);color:var(--tinta);
font-family:var(--display);font-weight:500;font-size:.875rem;
}
.btn-menu span{font-weight:400;color:var(--gris);margin-left:.35em}
.btn-menu span:empty{display:none}
@media (max-width:900px){
#shell:not([hidden]){display:block}
#shell > .barra{display:block}
.btn-menu{display:inline-flex;align-items:center;margin-left:auto}
.menu-cabeza{display:none}
.menu-flecha{display:none !important}
#shell > .vistas, #shell.compacto > .vistas{position:static;width:auto;height:auto;margin:12px 16px 0;padding:14px 12px}
#shell > .vistas:not(.abierto){display:none}
#shell.compacto .modulo-b{justify-content:flex-start;padding:0 12px}
#shell.compacto .modulo-b .etq{position:static;width:auto;height:auto;clip:auto}
#shell.compacto .modulo-b .chev{display:block !important}
#shell.compacto .modulo.directo > .modulo-b .chev{display:none !important}
#shell.compacto .modulo.abierto:not(.directo) > .sub{display:flex !important}
#shell.compacto .vistas .cuenta{position:static;margin-left:auto}
#shell.compacto .menu-yo{justify-content:flex-start}
#shell.compacto .menu-yo-t{display:flex}
.menu-centro, #shell.compacto .menu-centro{display:none}
#shell.compacto .menu-yo{flex-direction:row}
#shell.compacto .menu-link{display:inline}
.menu-lista{overflow:visible}
}
@media (prefers-reduced-motion:reduce){.vistas,.menu-flecha .ico,.modulo-b .chev{transition:none}}
.cuenta{
display:inline-block;min-width:22px;padding:0 6px;margin-left:6px;
background:var(--cian-claro);color:var(--tinta);font-size:.75rem;font-weight:500;
text-align:center;line-height:20px;
}
.cuenta[data-n="0"]{display:none}
/* ============================ BANDEJA =========================== */
.bandeja-barra{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px}
.filtros{display:flex;flex-wrap:wrap;gap:6px}
.filtro{
background:var(--aire);border:1px solid var(--linea);padding:6px 12px;cursor:pointer;
font-family:var(--texto);font-size:.875rem;color:var(--gris);
}
.filtro[aria-pressed="true"]{border-color:var(--cian);color:var(--tinta);background:#EEF2FF}
.btn.corto{width:auto;margin-top:0;padding:10px 18px;font-size:.9375rem}
.btn-sec{
background:var(--aire);color:var(--tinta);border:1px solid var(--tinta);padding:10px 18px;
font-family:var(--display);font-weight:500;font-size:.9375rem;cursor:pointer;
}
.btn-sec:hover:not(:disabled){background:var(--papel)}
.btn-sec:disabled{opacity:.45;cursor:default}
.lista{border-top:1px solid var(--linea)}
.reg{border:1px solid var(--linea);border-top:none;background:var(--aire)}
.reg-cab{
width:100%;display:grid;
grid-template-columns:minmax(0,2fr) 104px minmax(0,1.6fr) 176px 58px; /* anchos fijos: cada renglón es su propia rejilla */
gap:14px;align-items:center;padding:14px 18px;text-align:left;
background:none;border:none;cursor:pointer;font-family:var(--texto);color:var(--tinta);
}
.reg-cab:hover{background:var(--papel)}
.reg-cab:focus-visible{outline:2px solid var(--cian);outline-offset:-2px}
.reg-cab[aria-expanded="true"]{background:var(--papel);box-shadow:inset 3px 0 0 var(--cian)}
.reg-nombre{font-weight:700;font-size:.9375rem;line-height:1.35;min-width:0}
.reg-nombre small{display:block;font-weight:400;color:var(--gris);font-size:.8125rem}
.reg-imo{font-size:.8125rem;color:var(--gris);line-height:1.4;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reg-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.reg-fecha{font-size:.8125rem;color:var(--gris-suave);text-align:right;font-variant-numeric:tabular-nums}
.chip{display:inline-block;padding:2px 8px;font-size:.75rem;font-family:var(--display);font-weight:500;white-space:nowrap}
.chip.salud{background:#FFF4DC;color:#6B4A00}
.chip.dup{background:#FBECEA;color:#7A2A20}
.chip.sin-gen{background:var(--arena);color:var(--gris)}
.reg-det{padding:8px 18px 22px;background:var(--papel);border-top:1px dashed var(--linea)}
.datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px 26px;margin:14px 0 18px}
.datos dt{
font-family:var(--display);font-weight:200;font-size:.625rem;letter-spacing:.3em;
text-transform:uppercase;color:var(--gris-suave);margin-bottom:3px;
}
.datos dd{margin:0;font-size:.9375rem;line-height:1.5;overflow-wrap:anywhere}
.aviso{
font-size:.875rem;line-height:1.5;padding:10px 12px;margin:12px 0 0;
border-left:3px solid #D8A13A;background:#FFF9EC;color:#5E4300;
}
.aviso.dup{border-left-color:#C0392B;background:#FBECEA;color:#7A2A20}
.salud-det{margin:12px 0 0;padding:12px 14px;background:var(--aire);border:1px solid var(--linea)}
/* ============================ ENTRENADOR ============================ */
.ent-tabla{width:100%;border-collapse:collapse;font-size:.9375rem;background:var(--aire)}
.ent-tabla th{text-align:left;font-family:var(--display);font-weight:500;font-size:.6875rem;letter-spacing:.14em;
text-transform:uppercase;color:var(--gris);padding:8px 12px;border-bottom:1px solid var(--linea);white-space:nowrap}
.ent-tabla td{padding:9px 12px;border-bottom:1px solid var(--linea);vertical-align:middle}
.ent-tabla td small{display:block;color:var(--gris);font-size:.8125rem}
.ent-tabla tr.fuera td{background:var(--papel);color:var(--gris)}
.ent-dias{display:inline-flex;gap:4px}
.ent-dias span{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;
border:1px solid var(--linea);color:var(--gris-suave)}
.ent-dias span.si{background:#E5F4EA;border-color:#B9DEC6;color:#1F5E33;font-weight:700}
.ent-dias span.no{background:#FBECEC;border-color:#F0C4C1;color:#B3261E;font-weight:700}
.ent-pase{display:inline-flex;gap:4px;flex-wrap:wrap}
.ent-pase span{font-size:.6875rem;padding:2px 7px;border:1px solid var(--linea);color:var(--gris-suave)}
.ent-pase span.on{background:var(--tinta);border-color:var(--tinta);color:var(--aire)}
.ent-scroll{overflow-x:auto;border:1px solid var(--linea);margin-bottom:22px}
.ent-llam{display:inline-flex;gap:3px;margin-top:4px}
.ent-llam span{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:.6875rem;border:1px solid var(--linea);color:var(--gris-suave)}
.ent-llam span.en_tiempo{background:#E5F4EA;border-color:#B9DEC6;color:#1F5E33;font-weight:700}
.ent-llam span.tarde{background:#FDF3D6;border-color:#EBCF7A;color:#7A5600;font-weight:700}
.cap-staff{border-top:1px solid var(--linea);padding:12px 0}
.cap-staff:first-of-type{border-top:0;padding-top:0}
.cap-staff h5{margin:0 0 6px;font-family:var(--display);font-weight:500;font-size:1rem}
.cap-staff h5 small{font-weight:400;color:var(--gris-suave)}
.cap-fila{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:6px 0;border-top:1px dashed var(--linea)}
.cap-fila .quien{flex:1 1 170px;min-width:0}
.cap-fila .quien small{display:block;color:var(--gris-suave)}
.cap-resumen{font-size:.8125rem;color:var(--gris-suave);margin:0 0 4px}
.ent-llam span.no_llamo{background:#FBECEC;border-color:#F0C4C1;color:#B3261E;font-weight:700}
.ent-cifras{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:.9375rem;color:var(--gris)}
.sp-busca{width:100%;max-width:360px;margin-bottom:10px;min-height:var(--toque)}
#msg-sp{position:sticky;top:8px;z-index:5}
.sp-fila .quien a{display:inline-block;padding:6px 0;color:var(--cian-texto);font-weight:700;font-size:.9375rem;text-underline-offset:3px}
.sp-leyenda{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 12px;font-size:.8125rem;color:var(--gris)}
.sp-leyenda .ent-dias span{width:20px;height:20px}
.sp-quitar{min-height:var(--toque);padding:0 4px;color:var(--gris) !important}
.sp-quitar.armado{color:#B3261E !important;font-weight:700}
.com-lista{list-style:none;margin:0;padding:0}
.com-lista li{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--linea)}
.com-lista li:first-child{border-top:0}
.com-lista .quien{margin-left:0;text-align:left;flex:1 1 200px}
.com-lista .quien small{display:block;color:var(--gris);font-size:.8125rem}
.com-dia{font-family:var(--display);font-weight:500;font-size:1.25rem;width:44px;text-align:center;color:var(--tinta)}
.com-wa{min-height:var(--toque);display:inline-flex;align-items:center;padding:0 14px;border:1px solid var(--tinta);color:var(--tinta);text-decoration:none;font-family:var(--display);font-weight:500;font-size:.875rem}
.com-wa:hover{background:var(--papel)}
.com-ficha{background:var(--papel);border:1px solid var(--linea);padding:14px 16px;margin:6px 0 4px;flex-basis:100%}
.com-ficha h5{margin:14px 0 6px;font-family:var(--display);font-weight:500;font-size:.9375rem}
.com-ficha h5:first-child{margin-top:0}
.com-ficha .ent-dl{margin:0}
.com-gustos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px 18px;margin:0}
.com-gustos div{font-size:.9375rem}
.com-gustos dt{color:var(--gris);font-size:.8125rem}
.com-gustos dd{margin:0}
.com-filtro{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.com-filtro input{max-width:360px;min-height:var(--toque)}
.rs-item{border-top:1px solid var(--linea);padding:14px 0}
.bl-item{border-top:1px solid var(--linea);padding:14px 0}
.pl-meta{display:block;font-size:.75rem;margin-top:4px;color:var(--gris-suave)}
.pl-meta.ok{color:#1F5E33;font-weight:700}
.pl-meta.bajo{color:#8A5A00;font-weight:700}
.pl-barra{display:block;height:6px;background:var(--arena);margin-top:6px;max-width:140px}
.pl-barra i{display:block;height:100%;background:var(--cian)}
.pl-barra i.ok{background:#3E9A5B}
.pl-tabla{width:100%;border-collapse:collapse;font-size:.875rem}
.pl-tabla th{font-family:var(--display);font-weight:500;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris-suave);text-align:right;padding:8px 10px;border-bottom:1px solid var(--linea);white-space:nowrap}
.pl-tabla th:first-child,.pl-tabla td:first-child{text-align:left}
.pl-tabla td{padding:10px;border-bottom:1px solid var(--linea);text-align:right;vertical-align:top;white-space:nowrap}
.pl-tabla tr.sel td{background:#EEF2FF}
.pl-tabla td small{display:block;color:var(--gris-suave);font-size:.75rem}
.pl-tabla .grupo{border-left:2px solid var(--linea)}
.pl-sec{margin-top:26px}
.pl-metas{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 14px;align-items:end}
.pl-metas label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem}
.pv-fila{display:inline-flex;flex-wrap:wrap;gap:4px;align-items:center;background:none;border:0;padding:0;cursor:pointer;text-align:left}
.pv-fila span{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:30px;padding:0 6px;border:1px solid var(--linea);background:var(--aire);color:var(--gris-suave);font-family:var(--display);font-size:.75rem}
.pv-fila span.on{background:#E5F4EA;border-color:#B9DEC6;color:#1F5E33;font-weight:700}
.pv-fila b{font-family:var(--display);font-size:.75rem;color:var(--gris-suave);margin-left:4px}
.pv-fila b.completo{color:#1F5E33}
.pasos-mini{display:block;font-size:.75rem;font-weight:400;margin-top:2px;color:var(--gris-suave)}
.pasos-mini.completo{color:#1F5E33;font-weight:700}
.pasos-vuela .paso{border-top:1px solid var(--linea);padding:10px 0}
.pasos-vuela .paso:first-of-type{border-top:0;padding-top:0}
.pasos-vuela .check{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:500;min-height:var(--toque)}
.pasos-vuela .check input{width:20px;height:20px;flex:none}
.pasos-vuela .quien-hizo{font-size:.75rem;color:var(--gris-suave);margin-left:28px}
.pasos-vuela .sub{margin:6px 0 0 28px;display:flex;flex-direction:column;gap:6px}
.pasos-vuela .sub label{font-size:.8125rem}
.pasos-vuela .formas{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px}
.pasos-vuela .wa{display:inline-flex;align-items:center;min-height:36px;margin-left:28px;margin-top:4px}
.pool-mensajes{margin:0 0 14px}
.pool-mensajes textarea{width:100%;min-height:90px}
.bl-item.regreso{opacity:.75}
.bl-fila{display:grid;grid-template-columns:minmax(230px,1.3fr) minmax(210px,1.3fr) minmax(150px,.8fr) minmax(150px,.8fr) auto;gap:10px 18px;align-items:center}
.bl-persona b{display:block;font-family:var(--display);font-weight:500;font-size:1rem;line-height:1.25}
.bl-persona small{display:block;color:var(--gris-suave);font-size:.8125rem}
.bl-persona .com-wa{min-height:0;padding:0;border:0;color:var(--cian-texto);text-decoration:underline;text-underline-offset:3px;font-size:.8125rem;display:inline}
.bl-situacion{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.bl-situacion .chips{display:flex;flex-wrap:wrap;gap:4px}
.bl-fila label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem;min-width:0}
.bl-fila label select{width:100%}
.bl-fila .rs-boton{white-space:nowrap}
.bl-encab{display:grid;grid-template-columns:minmax(230px,1.3fr) minmax(210px,1.3fr) minmax(150px,.8fr) minmax(150px,.8fr) auto;gap:18px;padding:0 0 6px;font-family:var(--display);font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris-suave);border-bottom:1px solid var(--linea)}
@media (max-width:980px){.bl-fila{grid-template-columns:1fr 1fr}.bl-encab{display:none}}
@media (max-width:560px){.bl-fila{grid-template-columns:1fr}}
.bl-vence{font-size:.8125rem;color:var(--gris-suave)}
.acc-fila{display:grid;grid-template-columns:minmax(200px,1.4fr) minmax(150px,.8fr) minmax(140px,.8fr) auto;gap:8px 16px;align-items:center;padding:10px 0;border-top:1px solid var(--linea)}
.acc-fila b{display:block;font-family:var(--display);font-weight:500}
.acc-fila small{display:block;color:var(--gris-suave);font-size:.8125rem;overflow-wrap:anywhere}
.acc-fila.inactivo{opacity:.6}
.acc-entrena{display:flex !important;flex-direction:row !important;align-items:center;gap:6px;font-size:.8125rem;margin-top:4px;cursor:pointer}
.acc-entrena input{width:auto;min-height:0;margin:0}
.acc-fila select{width:100%}
@media (max-width:720px){.acc-fila{grid-template-columns:1fr 1fr}}
.bl-vence.pronto{color:#8A5A00;font-weight:700}
.chip.vencido{background:var(--arena);color:var(--gris)}
.chip.regreso{background:#E5F4EA;color:#1F5E33}
.chip.noshow{background:#FBECEC;color:#B3261E}
.chip.lugar{background:#EEF2FF;color:#0A3BC4}
.chip.paga{background:var(--arena);color:var(--gris)}
.bl-acciones{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:flex-end;margin-top:10px}
.bl-acciones label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem;flex:0 1 200px}
.bl-ficha{margin-top:12px;padding:12px;border:1px solid var(--linea);background:var(--aire)}
.bl-ficha h5{margin:0 0 8px;font-family:var(--display);font-weight:500;font-size:.9375rem}
.bl-notas{list-style:none;margin:0 0 10px;padding:0}
.bl-notas li{padding:6px 0;border-top:1px dashed var(--linea);font-size:.875rem;white-space:pre-wrap}
.bl-notas li small{display:block;color:var(--gris-suave)}
.bl-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-bottom:14px}
.bl-form label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem;flex:1 1 150px;min-width:0}
.bl-form textarea{flex:1 1 260px;min-height:64px}
.rs-item:first-child{border-top:0;padding-top:0}
.rs-item h5{margin:0 0 4px;font-family:var(--display);font-weight:500;font-size:1rem}
.rs-item .ent-dl{margin:8px 0}
.rs-item blockquote{margin:0;padding:0 0 0 10px;border-left:3px solid var(--linea);white-space:pre-wrap}
.rs-acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.rs-acciones .btn.corto{padding:8px 14px;font-size:.875rem}
.rs-acciones input{width:auto;flex:1 1 180px;padding:7px 9px}
.rs-boton{padding:8px 12px;font-size:.875rem;border:1px solid var(--arena-borde);background:var(--aire);cursor:pointer}
.pautas-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:14px}
.pautas-cols h5{margin:0 0 6px;font-family:var(--display);font-weight:500;font-size:1rem}
.pauta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;border-top:1px solid var(--linea);padding:6px 0}
.pauta:first-child{border-top:0}
.pauta-abrir{display:flex;align-items:center;gap:12px;flex:1 1 180px;min-width:0;min-height:var(--toque);color:inherit;text-decoration:none}
.pauta-abrir:hover b,.pauta-abrir:focus-visible b{text-decoration:underline}
.pauta-icono{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid var(--linea);background:var(--aire);font-family:var(--display);font-weight:500;font-size:.75rem;color:var(--cian-texto)}
.pauta-txt{display:flex;flex-direction:column;min-width:0}
.pauta-txt b{font-weight:500;overflow-wrap:anywhere}
.pauta-txt small{color:var(--gris-suave)}
.pauta-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.pauta-form label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem;flex:1 1 170px;min-width:0}
.pauta-form input[type=file]{padding:6px 0;border:0;background:none}
.rs-boton:hover{border-color:var(--tinta)}
.sp-fila{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--linea);flex-wrap:wrap}
.sp-fila .quien{margin-left:0;text-align:left;flex:1 1 180px}
.sp-fila small{display:block;color:var(--gris);font-size:.8125rem}
.sp-llam{display:inline-flex;gap:4px;flex-wrap:wrap}
.sp-llam button{min-height:var(--toque);padding:6px 12px;font-size:.875rem;border:1px solid var(--arena-borde);background:var(--aire);color:var(--tinta);cursor:pointer}
.sp-llam button:disabled{opacity:.45;cursor:default}
.sp-llam button.on.en_tiempo{background:#E5F4EA;border-color:#1F7A3D;color:#1F5E33;font-weight:700}
.sp-llam button.on.tarde{background:#FDF3D6;border-color:#9A6B00;color:#7A5600;font-weight:700}
.sp-llam button.on.no_llamo{background:#FBECEC;border-color:#B3261E;color:#B3261E;font-weight:700}
.sp-nota{flex:1 1 200px;min-width:160px;min-height:var(--toque);padding:6px 10px !important;font-size:1rem}
.sp-dias{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.sp-dias button{min-height:var(--toque);padding:6px 12px;font-size:.875rem;border:1px solid var(--arena-borde);background:var(--aire);color:var(--tinta);cursor:pointer}
.sp-agregar{min-height:var(--toque);padding:8px 16px !important}
@media (max-width:560px){
.sp-fila{align-items:flex-start;gap:10px 12px;padding:12px 0}
.sp-fila .quien{flex-basis:100%}
.sp-llam{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
.sp-nota{flex-basis:100%}
.sp-dias{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.sp-dias button{flex:none}
}
.sp-dias button[aria-pressed=true]{background:var(--tinta);color:var(--aire);border-color:var(--tinta)}
.sp-dias button:disabled{opacity:.45;cursor:default}
.ent-cifras b{color:var(--tinta);font-weight:700;font-variant-numeric:tabular-nums}
.ent-salud-fila td{background:var(--papel)}
.ent-asig{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-top:12px}
.sem{display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:middle;background:var(--arena-borde)}
.sem.rojo{background:#D9534F}.sem.amarillo{background:#E8B321}.sem.verde{background:#2E9D57}
.ent-card{background:var(--aire);border:1px solid var(--arena-borde);margin-bottom:18px}
.ent-card-cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--linea);background:var(--papel)}
.ent-card-cab h4{margin:0;font-family:var(--display);font-weight:500;font-size:1rem;color:var(--tinta)}
.ent-card-cab .der{margin-left:auto}
.ent-card-cuerpo{padding:12px 16px}
.ent-dl{display:grid;grid-template-columns:minmax(120px,180px) 1fr;gap:6px 14px;margin:0;font-size:.9375rem}
.ent-dl dt{color:var(--gris)}
.ent-dl dd{margin:0;color:var(--tinta)}
.ent-formas{margin:0;padding-left:20px}
.ent-chip{display:inline-block;font-size:.75rem;padding:2px 8px;margin:1px 3px 1px 0;background:var(--papel);border:1px solid var(--linea)}
.ent-chip.cap{background:var(--tinta);color:var(--verde);border-color:var(--tinta)}
.ent-pendiente{color:#9A6B00;font-size:.8125rem}
.ent-form .field{margin-bottom:10px}
.ent-form textarea{width:100%;min-height:70px;padding:8px;border:1px solid var(--arena-borde);font-family:var(--texto);font-size:.9375rem}
.ent-form input[type=text],.ent-form input[type=url]{width:100%;padding:7px 9px;border:1px solid var(--arena-borde);font-family:var(--texto);font-size:.9375rem}
.ent-formas-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:6px}
.stf-funs{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.stf-chip{display:inline-flex;align-items:center;gap:2px;padding:3px 4px 3px 10px;font-size:.8125rem;background:var(--papel);border:1px solid var(--arena-borde);white-space:nowrap}
.stf-chip button{border:0;background:transparent;color:var(--gris);font-size:1rem;line-height:1;padding:2px 6px;cursor:pointer}
.stf-chip button:hover{color:#B3261E}
.stf-mas{width:30px;height:30px;border:1px dashed var(--arena-borde);background:var(--aire);color:var(--tinta);font-size:1.125rem;line-height:1;cursor:pointer;padding:0}
.stf-mas:hover{border-style:solid}
.stf-funs select{width:auto;min-width:170px;padding:5px 8px;font-size:.875rem}
.ent-asig .field{flex:0 1 240px}
.salud-det dl{display:grid;grid-template-columns:minmax(150px,250px) 1fr;gap:6px 16px;margin:0;font-size:.875rem}
.salud-det dt{color:var(--gris)}
.salud-det dd{margin:0}
.salud-det dd.neg{color:var(--gris-suave)}
.acciones{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;padding-top:16px;border-top:1px solid var(--linea)}
.acciones label{margin-bottom:4px}
.acciones select{
padding:9px 10px;border:1px solid var(--arena-borde);background:var(--aire);
font-family:var(--texto);font-size:.9375rem;color:var(--tinta);min-width:200px;
}
.acciones select:focus{outline:2px solid var(--cian);outline-offset:0}
.acciones .grow{flex:1}
.vacio-lista{padding:36px 18px;text-align:center;color:var(--gris);border:1px solid var(--linea);border-top:none}
@media (max-width:760px){
.reg-cab{grid-template-columns:1fr auto}
.reg-cab > span:nth-child(2), .reg-imo, .reg-fecha{display:none}
}
/* ============================ POOL ============================== */
.pool-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.gen-sel{display:flex;flex-direction:column;gap:6px}
.gen-sel select, .pool-barra input, .reparto select, .ficha select, .ficha input, .ficha textarea, .pool-tabla select.asig{
padding:9px 10px;border:1px solid var(--arena-borde);background:var(--aire);border-radius:0;
font-family:var(--texto);font-size:.9375rem;color:var(--tinta);
}
.gen-sel select{min-width:260px}
.gen-sel select:focus, .pool-barra input:focus, .reparto select:focus, .ficha select:focus,
.ficha input:focus, .ficha textarea:focus, .pool-tabla select.asig:focus{outline:2px solid var(--cian);outline-offset:0}
.resumen{
display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
border-top:1px solid var(--linea);border-left:1px solid var(--linea);margin:0 0 18px;
}
.resumen div{padding:14px 18px 16px;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);background:var(--aire)}
.resumen dt{
font-family:var(--display);font-weight:200;font-size:.625rem;letter-spacing:.3em;
text-transform:uppercase;color:var(--gris-suave);margin-bottom:8px;
}
.resumen dd{margin:0;font-family:var(--display);font-weight:300;font-size:1.75rem;line-height:1;font-variant-numeric:tabular-nums}
.resumen dd small{display:block;font-family:var(--texto);font-size:.8125rem;color:var(--gris);margin-top:7px;line-height:1.4}
.pool-barra{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin-bottom:12px}
.pool-barra input{width:auto;min-width:260px}
.reparto{
display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;padding:10px 14px;margin-bottom:12px;
background:#EEF2FF;border:1px solid var(--cian-claro);font-size:.9375rem;
}
.reparto label{display:flex;gap:8px;align-items:center;margin:0;color:var(--tinta);font-size:.9375rem}
.reparto .btn.corto{padding:8px 16px}
.pool-tabla td{vertical-align:middle}
.pool-tabla th, .pool-tabla td{padding:11px 10px}
.pool-tabla th{letter-spacing:.2em}
.pool-tabla td.nom{white-space:normal;min-width:170px;max-width:230px}
.pool-tabla td.imo{white-space:normal;min-width:130px}
.pool-tabla .chk{width:40px;padding-right:0;text-align:center}
.pool-tabla input[type=checkbox]{width:18px;height:18px;padding:0;accent-color:var(--cian);cursor:pointer;vertical-align:middle}
.pool-tabla select.asig{padding:6px 8px;font-size:.875rem;min-width:0;width:132px}
.pool-tabla select.sentado-si{background:#E5F4EA;border-color:#1F7A3D;color:#1F5E33;font-weight:700}
.pool-tabla select.sentado-no{background:#FBECEC;border-color:#B3261E;color:#B3261E;font-weight:700}
.pool-tabla select.sentado-nd{background:#FDF3D6;border-color:#C9A227;color:#6B4E00}
/* Abierta, cada opción con su color: no hereda el de la elegida. */
.pool-tabla select[data-campo="sentado"] option{font-weight:700}
.pool-tabla select[data-campo="sentado"] option[value=""]{background:#FDF3D6;color:#6B4E00}
.pool-tabla select[data-campo="sentado"] option[value="si"]{background:#E5F4EA;color:#1F5E33}
.pool-tabla select[data-campo="sentado"] option[value="no"]{background:#FBECEC;color:#B3261E}
.pool-tabla tr.fila-noshow td{background:#FDF7F7}
.pool-tabla td.imo{max-width:200px}
.pool-tabla a{color:var(--tinta);text-decoration:none;font-variant-numeric:tabular-nums}
.pool-tabla a:hover{color:var(--cian)}
.avatar{--t:36px;width:var(--t);height:var(--t);border-radius:50%;flex:none;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:#EEF2FF;color:var(--cian-texto);font-family:var(--display);font-weight:500;font-size:calc(var(--t) * .36);text-transform:uppercase}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.con-foto{display:flex;align-items:center;gap:10px;min-width:0}
.con-foto > span:last-child{min-width:0}
.ficha > .perfil-cab{grid-column:1/-1;background:var(--papel);padding:18px 20px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.perfil-tarjeta{display:flex;align-items:center;gap:18px;padding:12px 28px 12px 12px;border-radius:999px;background:#F1EFEB;border:1px solid var(--linea);min-width:0;max-width:100%}
.perfil-tarjeta .avatar{--t:92px;box-shadow:0 0 0 4px #FFFFFF}
.perfil-tarjeta .avatar img{border-radius:50%}
.perfil-tarjeta .texto{min-width:0}
.perfil-tarjeta b{display:block;font-family:var(--display);font-weight:500;font-size:1.375rem;line-height:1.2;color:var(--tinta);overflow-wrap:anywhere}
.perfil-tarjeta small{display:block;margin-top:4px;color:var(--gris-suave);font-size:.9375rem}
.perfil-cab .acciones{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
@media (max-width:520px){.perfil-tarjeta{border-radius:24px;padding-right:16px}.perfil-tarjeta .avatar{--t:72px}.perfil-tarjeta b{font-size:1.125rem}}
.foto-subir{position:relative;overflow:hidden}
.foto-subir input{position:absolute;inset:0;opacity:0;cursor:pointer}
.nom-btn{
background:none;border:none;padding:0;cursor:pointer;text-align:left;
font-family:var(--texto);font-weight:700;font-size:.9375rem;color:var(--tinta);
}
.nom-btn:hover{color:var(--cian)}
.nom-btn:focus-visible{outline:2px solid var(--cian);outline-offset:2px}
.nom-btn small{display:block;font-weight:400;color:var(--gris);font-size:.8125rem}
.celda-sub{display:block;font-size:.8125rem;color:var(--gris);margin-top:2px}
.est{display:inline-block;padding:2px 8px;font-size:.75rem;font-family:var(--display);font-weight:500;white-space:nowrap}
.est.asiste{background:#E5F4EA;color:#1F5E33}
.est.no-contesta, .est.reprogramar{background:#FFF4DC;color:#6B4A00}
.est.no-asiste, .est.baja{background:#FBECEA;color:#7A2A20}
.est.nada{background:var(--arena);color:var(--gris)}
.pago-sin{color:var(--gris-suave)}
.pool-tabla tr.abierta > td{background:var(--papel)}
.pool-tabla tr.ficha-fila > td{padding:0;background:var(--papel);white-space:normal}
.vacio-tabla td{padding:36px 18px;text-align:center;color:var(--gris);white-space:normal}
.ficha{
display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:1px;background:var(--linea);border-top:2px solid var(--cian);
}
.ficha > section{background:var(--papel);padding:18px 20px 20px;margin:0}
.ficha h3{margin-bottom:12px}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.campos .ancho{grid-column:1/-1}
.campos label{margin-bottom:4px}
.ficha input, .ficha select{width:100%}
.ficha textarea{width:100%;min-height:64px;resize:vertical}
.ficha .btn.corto{margin-top:12px}
.ficha .btn-sec{margin-top:12px}
.hist{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:8px;max-height:280px;overflow:auto}
.hist li{background:var(--aire);border:1px solid var(--linea);padding:9px 11px;font-size:.875rem;line-height:1.45}
.hist .meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--gris);font-size:.8125rem;margin-bottom:3px}
.hist li.anulado{opacity:.62}
.hist li.anulado .monto{text-decoration:line-through}
.hist .monto{font-family:var(--display);font-weight:500;font-variant-numeric:tabular-nums}
.saldos{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:14px;font-size:.8125rem;color:var(--gris)}
.saldos b{display:block;font-family:var(--display);font-weight:300;font-size:1.3rem;color:var(--tinta);font-variant-numeric:tabular-nums;margin-top:2px}
.saldos b.debe{color:#B3261E;font-weight:500}
.pago label.pago-sub{display:block;margin-top:8px}
.pago input[type="number"]{width:100%}
.pago-debe{margin-top:6px;font-size:.8125rem;color:var(--gris)}
.pago-debe b,.pago-debe .mal{color:#B3261E;font-weight:700}
.obj{margin-top:16px;font-size:.875rem;color:var(--gris);line-height:1.55}
/* ========================== ASISTENCIA ========================== */
.asis-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.asis-selectores{display:flex;flex-wrap:wrap;gap:14px}
.asis-selectores select{
padding:9px 10px;border:1px solid var(--arena-borde);background:var(--aire);
font-family:var(--texto);font-size:.9375rem;color:var(--tinta);min-width:220px;
}
.asis-selectores select:focus{outline:2px solid var(--cian);outline-offset:0}
.dias{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.dia{
background:var(--aire);border:1px solid var(--linea);padding:9px 16px;cursor:pointer;
font-family:var(--display);font-weight:500;font-size:.9375rem;color:var(--gris);
}
.dia[aria-pressed="true"]{border-color:var(--cian);background:#EEF2FF;color:var(--tinta)}
.dia small{display:block;font-family:var(--texto);font-weight:400;font-size:.75rem;color:var(--gris-suave)}
.dia[aria-pressed="true"] small{color:var(--cian)}
.asis-marcador{
display:flex;flex-wrap:wrap;gap:10px 32px;align-items:baseline;padding:16px 20px;margin-bottom:16px;
background:var(--papel);border:1px solid var(--arena-borde);
}
.asis-marcador span{
font-family:var(--display);font-weight:500;font-size:.75rem;letter-spacing:.14em;
text-transform:uppercase;color:var(--gris);
}
.asis-marcador b{
font-family:var(--display);font-weight:500;font-size:1.75rem;color:var(--tinta);
font-variant-numeric:tabular-nums;margin-right:9px;letter-spacing:0;text-transform:none;
}
.asis-marcador .btn-sec{margin-left:auto}
/* Antes era una rejilla de tarjetas; ahora dentro va una sola tabla. */
.asis-lista{display:block}
.asis-vacio{padding:36px 18px;text-align:center;color:var(--gris);border:1px solid var(--linea)}
@media (max-width:560px){
.asis-tabla thead th.quien{min-width:130px}
.asis-tabla td.quien{font-size:.875rem}
.asis-tabla td.marca{width:38px;padding:3px 1px}
.celda{width:32px;height:32px}
.asis-selectores select{min-width:0;width:100%}
.asis-selectores{width:100%}
}
/* ========================== ASISTENCIA MATRIZ ========================== */
/* La tabla se desplaza dentro de su caja: con overflow horizontal en el
contenedor, el encabezado sticky se despega y con 40 renglones te
quedas sin saber qué columna tocas. */
.asis-scroll{max-height:72vh;overflow:auto;-webkit-overflow-scrolling:touch;border-bottom:1px solid var(--linea)}
.asis-tabla{width:auto;border-collapse:separate;border-spacing:0;font-size:.9375rem}
.asis-tabla th,.asis-tabla td{border-bottom:1px solid var(--linea)}
.asis-tabla thead th{
position:sticky;top:0;z-index:2;background:var(--papel);
padding:10px 8px;text-align:center;vertical-align:bottom;
font-family:var(--display);font-weight:500;font-size:.9375rem;
letter-spacing:.08em;text-transform:uppercase;color:var(--tinta);
border-bottom:2px solid var(--tinta);
}
.asis-tabla thead th.quien{text-align:left;padding-left:2px;min-width:190px}
.asis-tabla th small{
display:block;font-family:var(--texto);font-weight:400;font-size:.6875rem;
letter-spacing:0;text-transform:none;color:var(--gris-suave);margin-top:3px;
}
.asis-tabla th .cuenta{
display:block;font-family:var(--texto);font-size:.6875rem;letter-spacing:0;
text-transform:none;color:var(--cian);margin-top:3px;font-variant-numeric:tabular-nums;
}
.asis-tabla td.quien{padding:6px 16px 6px 2px;line-height:1.35;text-align:left}
.asis-tabla td.quien b{font-weight:400}
.asis-tabla td.quien small{color:var(--gris);font-size:.8125rem}
.asis-tabla td.quien small::before{content:'·';margin:0 7px;color:var(--arena-borde)}
.asis-tabla td.marca{text-align:center;padding:3px 2px;width:40px}
.celda{
width:32px;height:32px;border:1px solid var(--arena-borde);background:var(--aire);
cursor:pointer;font-size:.9375rem;line-height:1;color:var(--gris-suave);
display:inline-flex;align-items:center;justify-content:center;
}
.celda:hover{border-color:var(--cian)}
.celda.presente{background:#EAF6EE;border-color:#9CCFAF;color:#1F7A3D;font-weight:700}
.celda.ausente {background:#FBECEC;border-color:#E5B5B0;color:#B3261E;font-weight:700}
.asis-tabla tr.fuera td{background:var(--papel)}
.asis-tabla tr.fuera td.quien b{color:var(--gris)}
.chip.drop{background:#FBECEC;color:#B3261E}
.asis-ayuda{font-size:.8125rem;color:var(--gris);margin:0 0 14px;line-height:1.55}
/* ============================= SIN PAGO ============================= */
.band-vistas{display:flex;gap:0;margin-bottom:18px;border-bottom:1px solid var(--linea)}
.band-vistas button{
border:none;background:none;cursor:pointer;padding:10px 18px;
font-family:var(--display);font-weight:500;font-size:.8125rem;
letter-spacing:.1em;text-transform:uppercase;color:var(--gris);
border-bottom:2px solid transparent;margin-bottom:-1px;
}
.band-vistas button[aria-pressed="true"]{color:var(--tinta);border-bottom-color:var(--cian)}
.band-vistas button:hover{color:var(--tinta)}
.band-vistas b{font-weight:700;margin-left:7px;font-variant-numeric:tabular-nums}
.band-nota{
padding:12px 14px;margin-bottom:16px;background:var(--arena);
border-left:3px solid var(--cian);font-size:.875rem;color:var(--gris);line-height:1.55;
}
/* ============================== BAJA ============================== */
.baja-caja{
margin-top:16px;padding:14px 16px;border:1px solid #E8C9C4;background:#FDF3F2;
}
.baja-caja .eyebrow{color:#8A4038}
.baja-caja p{font-size:.875rem;color:#7A4A44;line-height:1.55;margin:6px 0 12px}
.baja-fila{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.baja-fila select,.baja-fila input{
padding:9px 10px;border:1px solid var(--arena-borde);background:var(--aire);
font-family:var(--texto);font-size:.9375rem;color:var(--tinta);
}
.baja-fila select{min-width:210px}
.baja-fila input{flex:1;min-width:180px}
.baja-fila .btn,.baja-fila .btn-sec{margin-top:0;white-space:nowrap}
.baja-aviso{
margin-top:12px;padding:12px 14px;background:var(--arena);border-left:3px solid var(--gris);
font-size:.875rem;color:var(--gris);line-height:1.55;
}
/* ============================= LLEGADA ============================= */
.llegada-cab{
display:flex;flex-wrap:wrap;align-items:center;gap:18px;
padding:14px 16px;margin-bottom:18px;border:1px solid var(--linea);background:var(--papel);
}
.llegada-n{font-size:.875rem;color:var(--gris);font-variant-numeric:tabular-nums}
.llegada-n b{
font-family:var(--display);font-weight:500;font-size:1.25rem;color:var(--tinta);
margin-right:7px;
}
.llegada-n.no b{color:var(--gris)}
.llegada-n.pend b{color:var(--cian)}
.llegada-cab .btn-sec{margin-left:auto}
.llegada-lista{border:1px solid var(--linea);border-top:none;margin:-18px 0 18px;background:var(--aire)}
.llegada-item{
display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--linea);
}
.llegada-item:last-child{border-bottom:none}
.llegada-nom{flex:1;min-width:0;font-size:.9375rem;line-height:1.3}
.llegada-nom small{display:block;color:var(--gris);font-size:.8125rem;margin-top:2px}
.llegada-item .btn,.llegada-item .btn-sec{margin-top:0;white-space:nowrap;padding:8px 14px}
@media (max-width:620px){
.llegada-item{flex-wrap:wrap}
.llegada-nom{flex:1 1 100%}
}
/* ============================== PANEL DE HOY ============================== */
.hoy{
display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 26px;
background:var(--tinta);padding:18px 22px;margin-bottom:6px;
}
.hoy-fecha{
font-family:var(--display);font-weight:500;font-size:.75rem;letter-spacing:.16em;
text-transform:uppercase;color:var(--cian-claro);
}
.hoy-item{font-family:var(--texto);font-size:.9375rem;color:var(--aire)}
.hoy-item b{font-weight:700;color:var(--verde)}
.jornada{display:flex;flex-direction:column;gap:14px}
.jcard.principal{border-color:var(--cian);box-shadow:inset 4px 0 0 var(--cian)}
.jcard-etq{
font-family:var(--display);font-weight:500;font-size:.6875rem;letter-spacing:.14em;
text-transform:uppercase;background:var(--verde);color:var(--tinta);padding:3px 9px;
}
.jcard{background:var(--aire);border:1px solid var(--arena-borde)}
.jcard-cab{
display:flex;align-items:center;gap:10px;flex-wrap:wrap;
padding:13px 18px;border-bottom:1px solid var(--linea);background:var(--papel);
}
.jcard-cab .cuando{font-size:.8125rem;color:var(--gris);margin-left:auto}
.jcard-aldea{font-family:var(--display);font-weight:500;font-size:1.0625rem;color:var(--tinta);letter-spacing:.02em}
.jcard-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(102px,1fr));margin:0}
.jdato{padding:13px 16px 15px;border-right:1px solid var(--linea)}
.jdato dt{
font-family:var(--display);font-weight:500;font-size:.6875rem;letter-spacing:.12em;
text-transform:uppercase;color:var(--gris);margin:0 0 4px;
}
.jdato dd{
margin:0;font-family:var(--display);font-weight:300;font-size:1.625rem;
color:var(--tinta);font-variant-numeric:tabular-nums;line-height:1.1;
}
.jdato dd small{
display:block;font-family:var(--texto);font-size:.75rem;font-weight:400;
color:var(--gris-suave);margin-top:4px;line-height:1.35;
}
.aldeas-juego{display:flex;flex-direction:column;gap:14px}
.ajuego{background:var(--aire);border:1px solid var(--arena-borde)}
.ajuego-cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:13px 18px;border-bottom:1px solid var(--linea);background:var(--papel)}
.ajuego-cab .cuando{font-size:.8125rem;color:var(--gris);margin-left:auto}
.ajuego-cuerpo{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ajuego-bloque{padding:14px 18px 16px;border-right:1px solid var(--linea)}
.ajuego-bloque h4{font-family:var(--display);font-weight:500;font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin:0 0 8px}
.ajuego-hoy{font-size:.9375rem;color:var(--tinta);line-height:1.45}
.ajuego-semana{list-style:none;margin:0;padding:0;font-size:.875rem}
.ajuego-semana li{display:flex;gap:10px;padding:3px 0;color:var(--tinta)}
.ajuego-semana li .d{min-width:62px;color:var(--gris);font-variant-numeric:tabular-nums}
.ajuego-semana li.paso{color:var(--gris-suave)}
.ajuego-semana li.paso .d{color:var(--gris-suave)}
.ajuego-semana li.hoy{font-weight:700}
.ajuego-marca{display:flex;gap:22px;flex-wrap:wrap}
.ajuego-marca div{font-size:.75rem;color:var(--gris)}
.ajuego-marca b{display:block;font-family:var(--display);font-weight:300;font-size:1.375rem;color:var(--tinta);font-variant-numeric:tabular-nums}
.ajuego-vacio{font-size:.875rem;color:var(--gris-suave)}
.avisos{display:flex;flex-direction:column;gap:1px;background:var(--linea);border:1px solid var(--linea)}
.aviso{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--aire);padding:12px 18px}
.aviso .marca{width:4px;align-self:stretch;min-height:24px;background:var(--cian)}
.aviso.urge .marca{background:#D9534F}
.aviso.calma .marca{background:var(--arena-borde)}
.aviso .txt{flex:1 1 240px;font-size:.9375rem;color:var(--tinta)}
.aviso .txt b{font-weight:700}
.avisos-limpio{background:var(--aire);border:1px solid var(--linea);padding:22px;color:var(--gris);font-size:.9375rem}
.prox{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:11px 0;border-bottom:1px solid var(--linea)}
.prox-q{flex:1 1 220px;font-size:.9375rem;color:var(--tinta)}
.prox-c{font-family:var(--display);font-weight:500;font-size:.8125rem;color:var(--gris)}
/* ========================== ENROLAMIENTO ========================== */
.enr-secciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:4px 0 18px}
.enr-sec{
text-align:left;background:var(--aire);border:1px solid var(--arena-borde);padding:12px 14px;cursor:pointer;
display:flex;flex-direction:column;gap:2px;font-family:var(--texto);color:var(--tinta);
}
.enr-sec .t{font-family:var(--display);font-weight:500;font-size:1rem}
.enr-sec .s{font-size:.75rem;color:var(--gris)}
.enr-sec .n{margin-top:6px;font-family:var(--display);font-weight:300;font-size:1.375rem;font-variant-numeric:tabular-nums}
.enr-sec .p{font-size:.75rem;color:var(--gris)}
.enr-sec[aria-pressed="true"]{border-color:var(--tinta);background:var(--papel);box-shadow:inset 0 -3px 0 var(--cian)}
.enr-decl{
width:76px;padding:5px 8px;border:1px solid var(--arena-borde);background:var(--aire);text-align:right;
font-family:var(--texto);font-size:.9375rem;font-variant-numeric:tabular-nums;color:var(--tinta);
}
.enr-decl:disabled{background:transparent;border-color:transparent}
.enr-aviso{padding:10px 16px;font-size:.8125rem;color:var(--gris);border-bottom:1px solid var(--linea)}
.enr-aldea{border:1px solid var(--linea);margin-bottom:22px;background:var(--aire)}
.enr-cab{
display:flex;flex-wrap:wrap;align-items:baseline;gap:16px;
padding:14px 16px;border-bottom:1px solid var(--linea);background:var(--papel);
}
.enr-cab h4{
margin:0;font-family:var(--display);font-weight:500;font-size:1rem;color:var(--tinta);
}
.enr-cab .cifra{font-variant-numeric:tabular-nums;font-size:.875rem;color:var(--gris)}
.enr-cab .cifra b{color:var(--tinta);font-weight:700}
.enr-cab .pct{margin-left:auto;font-family:var(--display);font-weight:500;font-size:1.125rem}
.enr-grupo{
padding:10px 16px 2px;font-family:var(--display);font-weight:500;font-size:.6875rem;
letter-spacing:.16em;text-transform:uppercase;color:var(--gris);
}
.enr-tabla{width:100%;border-collapse:collapse;font-size:.9375rem}
.enr-tabla th{
text-align:left;font-family:var(--display);font-weight:500;font-size:.6875rem;
letter-spacing:.14em;text-transform:uppercase;color:var(--gris);
padding:6px 16px;border-bottom:1px solid var(--linea);
}
.enr-tabla td{padding:9px 16px;border-bottom:1px solid var(--linea)}
.enr-tabla th.num,.enr-tabla td.num{text-align:right;font-variant-numeric:tabular-nums;width:1%;white-space:nowrap}
.enr-tabla tr.cumplio td{background:#EAF6EE}
.enr-tabla tr.parcial td{background:#FDF6E3}
.enr-tabla tr.encero td{background:#FBECEC}
.enr-tabla .marca{font-weight:700}
.enr-tabla .marca.ok {color:#1F7A3D}
.enr-tabla .marca.med {color:#9A6B00}
.enr-tabla .marca.mal {color:#B3261E}
.enr-tabla .quien small{display:block;color:var(--gris);font-size:.8125rem;margin-top:2px}
.enr-vacio{padding:16px;color:var(--gris);font-size:.9375rem}
.sem.grande{width:22px;height:22px}
.ent-detalle{margin-top:12px}
.ent-detalle summary{cursor:pointer;font-family:var(--display);font-weight:500;font-size:.875rem;color:var(--tinta);padding:6px 0}
.ent-detalle .enr-aldea{margin:8px 0 0}
.enr-tabla tr.total td{font-weight:700;background:var(--papel)}
.enr-tabla th.col-sem,.enr-tabla td.col-sem{text-align:center;width:1%;white-space:nowrap}
.enr-cab .pct{display:inline-flex;align-items:center;gap:10px}
@media (max-width:700px){
.enr-tabla th,.enr-tabla td{padding:8px 10px}
.enr-cab{padding:12px 10px}
}
/* ============================ FINANZAS ============================ */
.fin-tabla{width:100%;border-collapse:collapse;font-size:.9375rem}
.fin-tabla th{
text-align:left;font-family:var(--display);font-weight:500;font-size:.6875rem;
letter-spacing:.16em;text-transform:uppercase;color:var(--gris);
padding:8px 10px;border-bottom:1px solid var(--linea);white-space:nowrap;
}
.fin-tabla td{padding:9px 10px;border-bottom:1px solid var(--linea)}
.fin-tabla th.num,.fin-tabla td.num{text-align:right;font-variant-numeric:tabular-nums}
.fin-tabla tfoot td{font-weight:700;border-top:1px solid var(--tinta);border-bottom:none}
.fin-vacio{color:var(--gris)}
.fin-hueco td{color:var(--gris);font-style:italic}
.fin-alta{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:16px}
.fin-alta .field{margin-bottom:0;max-width:300px;flex:1 1 220px}
.fin-scroll{overflow-x:auto}
.fin-off{color:var(--gris)}
/* La composicion del pase, de un vistazo. El verde accion nunca
lleva texto blanco: va con tinta, como manda el manual. */
.pase-barra{display:flex;height:38px;margin:2px 0 10px;border:1px solid var(--linea);overflow:hidden}
.pase-barra span{
display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden;
white-space:nowrap;padding:0 8px;font-family:var(--display);font-weight:500;
font-size:.75rem;letter-spacing:.04em;
}
.pase-barra .v-vuela{background:var(--cian);color:#fff}
.pase-barra .v-tras {background:var(--tinta);color:#fff}
.pase-barra .v-paq {background:var(--verde);color:var(--tinta)}
.pase-barra .v-no {background:var(--gris);color:#fff}
.pase-barra .v-sin {background:var(--arena);color:var(--gris)}
.pase-leyenda{display:flex;flex-wrap:wrap;gap:18px;font-size:.8125rem;color:var(--gris);margin-bottom:20px}
.pase-leyenda i{display:inline-block;width:10px;height:10px;margin-right:7px}
.pase-leyenda .v-vuela{background:var(--cian)}
.pase-leyenda .v-tras {background:var(--tinta)}
.pase-leyenda .v-paq {background:var(--verde)}
.pase-leyenda .v-no {background:var(--gris)}
.pase-leyenda .v-sin {background:var(--arena);border:1px solid var(--arena-borde)}
/* ============================ CIERRE ============================ */
.cierre-fila{
display:block;padding:12px 16px 14px;border:1px solid var(--linea);border-top:none;background:var(--aire);
}
.cf-arriba{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px}
.cf-arriba .cierre-nombre{flex:0 1 240px}
.cf-arriba .pase-proceso{flex:1 1 440px;margin-top:0}
.cf-abajo{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 10px;margin-top:10px}
.cf-campo{flex:0 1 150px;min-width:0}
/* El bloque de pago no hace caja propia: sus campos se acomodan en el mismo renglon. */
.cierre-fila .pago{display:contents}
.cierre-fila .pago-campo{flex:0 1 115px;min-width:0}
.cierre-fila .pago-campo.precio{flex:0 1 205px}
.cierre-fila select,.cierre-fila input[type="number"]{height:34px;box-sizing:border-box}
.cierre-fila .pago-debe{font-size:.75rem;max-width:130px;line-height:1.3}
.cierre-fila .pago label.pago-sub{margin-top:0}
.cierre-fila .pago-debe{flex:0 0 auto;align-self:center;margin:0 2px}
.cf-arriba .btn.corto{margin-left:auto;padding-top:8px;padding-bottom:8px}
.cierre-fila label{font-size:.75rem}
.cierre-fila input[type="number"]{
width:100%;padding:7px 9px;border:1px solid var(--arena-borde);background:var(--aire);
font-family:var(--texto);font-size:.875rem;color:var(--tinta);
}
.cierre-fila:first-child{border-top:1px solid var(--linea)}
.cierre-fila.decidida{background:var(--papel)}
.cierre-nombre{font-weight:700;font-size:.9375rem;line-height:1.35;align-self:center}
.cierre-nombre small{display:block;font-weight:400;color:var(--gris);font-size:.8125rem;margin-top:2px}
.cierre-fila label{margin-bottom:4px}
.cierre-fila select{
width:100%;padding:7px 9px;border:1px solid var(--arena-borde);background:var(--aire);
font-family:var(--texto);font-size:.875rem;color:var(--tinta);
}
.cierre-fila select:focus{outline:2px solid var(--cian);outline-offset:0}
.cierre-fila .btn.corto{margin-top:0;white-space:nowrap}
.ya-inscrito{font-size:.8125rem;color:#1F5E33;background:#E5F4EA;padding:2px 8px;display:inline-block;margin-top:4px}
.pase-proceso{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px;font-weight:400}
.pchip{
border:1px solid var(--arena-borde);background:var(--aire);color:var(--gris);cursor:pointer;
font-family:var(--display);font-weight:500;font-size:.75rem;letter-spacing:.04em;padding:5px 10px;
}
.pchip[aria-pressed="true"]{background:var(--tinta);border-color:var(--tinta);color:var(--aire)}
.pchip:disabled{cursor:default;opacity:.85}
.semaforo{display:inline-flex;gap:4px;margin-left:6px}
.semaforo button{
width:22px;height:22px;border-radius:50%;cursor:pointer;border:2px solid transparent;opacity:.28;padding:0;
}
.semaforo button[data-sem="verde"]{background:#2E9D57}
.semaforo button[data-sem="amarillo"]{background:#E8B321}
.semaforo button[data-sem="rojo"]{background:#D9534F}
.semaforo button[aria-pressed="true"]{opacity:1;border-color:var(--tinta)}
.semaforo button:disabled{cursor:default}
.pase-estado{font-size:.75rem;color:var(--gris)}
.pase-estado b{color:#B3261E}
.pase-nota{flex:1 1 200px;min-width:160px;padding:6px 8px;border:1px solid var(--arena-borde);font-family:var(--texto);font-size:.8125rem;color:var(--tinta)}
@media (max-width:760px){
.cf-campo,.cierre-fila .pago-campo,.cierre-fila .pago-campo.precio{flex:1 1 100%}
.cierre-fila .btn.corto{width:100%;margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* ============================================================
Capa VORTEX (Laue, 19 sep 2026): tarjetas blancas redondeadas sobre
fondo cálido, botones en píldora y tablas limpias, como el tablero
de referencia. Va al final para ganarle a las reglas de arriba.
============================================================ */
body{background:var(--papel);line-height:1.6;font-variant-numeric:tabular-nums}
h1{font-weight:500;letter-spacing:-.01em}
h2{font-weight:500;font-size:1.5rem;letter-spacing:-.01em}
h3{font-weight:500}
.linea-base{display:none}
.eyebrow{font-family:var(--texto);font-weight:500;font-size:.75rem;letter-spacing:.12em;color:var(--gris-suave)}
/* Cada sección de una pantalla es una tarjeta. */
.shell{padding:28px 28px 64px}
.shell > section{
background:var(--aire);border:1px solid var(--linea);border-radius:var(--radio);
box-shadow:var(--sombra);padding:24px 26px;margin-bottom:20px;
}
.shell > section > h2:first-child, .shell > section > .asis-cab:first-child h2{margin-top:0}
.sec-nota{color:var(--gris);font-size:.875rem;margin:6px 0 18px}
/* Controles */
input, select, textarea{border-radius:12px !important}
input, select, textarea{border-color:var(--arena-borde)}
input:focus, select:focus, textarea:focus{outline:2px solid var(--cian) !important;outline-offset:1px !important;border-color:var(--cian) !important}
.btn{
border-radius:999px;background:var(--cian);color:#fff;font-weight:500;
box-shadow:0 1px 2px rgba(11,78,255,.25);
}
.btn:hover:not(:disabled){background:var(--cian-texto)}
.btn-sec{border-radius:999px !important}
.btn-staff{border-radius:999px}
.filtro{border-radius:999px}
.chip{border-radius:999px}
.linkish{color:var(--cian-texto)}
button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:var(--cian)}
/* Avisos: fondo suave, sin barra lateral. */
.msg{border-left:0;border-radius:14px;background:var(--arena);color:var(--tinta-media)}
.msg.error{background:#FCEDEB;color:#8A2A20}
.msg.ok{background:#EAF0FF;color:#0A3BC4}
/* Tablas: encabezado en etiqueta chica, filas con línea fina. */
.tablawrap{border-radius:14px}
table th{font-family:var(--texto);font-weight:500;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gris-suave)}
/* Acceso */
.gate{background:var(--papel)}
.card{border-radius:24px;overflow:hidden;box-shadow:var(--sombra)}
.cenefa{background:var(--aire);border-bottom:1px solid var(--linea)}
/* Menú lateral: el acento sobre negro es el azul Halo. */
.modulo.activo > .modulo-b .ico{color:#6F91FF}
.sub button[aria-current="page"]{box-shadow:inset 2px 0 0 #6F91FF}
.vistas .cuenta{background:var(--cian);color:#fff}
.menu-foto:hover .avatar, .menu-foto:focus-within .avatar{box-shadow:0 0 0 2px #6F91FF}
/* Rejillas de datos: tarjetitas separadas, como los indicadores de la referencia. */
.grid, .resumen, .grupos{gap:12px;border:0}
.tile, .resumen div, .grupo{border:1px solid var(--linea) !important;border-radius:16px;background:var(--aire)}
.grupo[aria-expanded="true"]{background:#EEF2FF;box-shadow:none;border-color:var(--cian) !important}
.tile dt, .resumen dt, .grupo .et, .jdato dt{
font-family:var(--texto);font-weight:500;font-size:.75rem;letter-spacing:.08em;
text-transform:uppercase;color:var(--gris-suave);
}
.tile dd, .resumen dd, .jdato dd{font-family:var(--cifra);font-weight:500;letter-spacing:-.02em}
/* Recuadros internos redondeados. */
.hoy{border-radius:16px}
.jcard, .ajuego, .ent-card{border-radius:16px;overflow:hidden;border-color:var(--linea)}
.jcard.principal{border-color:var(--cian);box-shadow:0 0 0 1px var(--cian)}
.jcard-etq{border-radius:999px;background:var(--cian);color:#fff}
.ficha{border-top:0;border-radius:16px;overflow:hidden}
.com-ficha{border-radius:14px}
.perfil-tarjeta{background:var(--aire)}
.nivel{border-radius:999px}
/* ---------- Tablero del Panel ---------- */
.tab-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:4px 0 22px}
.tab-titulo{min-width:0}
.tab-fecha{font-size:.8125rem;font-weight:500;color:var(--gris-suave);letter-spacing:.02em}
.tab-cab h1{font-size:2rem;margin:2px 0 10px}
.tab-momentos{display:flex;flex-wrap:wrap;gap:8px}
.tab-momentos span{padding:5px 12px;border-radius:999px;background:var(--aire);border:1px solid var(--linea);font-size:.8125rem;color:var(--tinta-media)}
.tab-momentos b{font-weight:600;color:var(--tinta)}
.btn.tab-accion{width:auto;margin:0;padding:12px 22px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:20px}
.kpis:empty{display:none}
.kpi{
display:flex;flex-direction:column;gap:6px;min-width:0;text-align:left;font:inherit;color:inherit;
background:var(--aire);border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra);padding:16px 18px 18px;
}
button.kpi{cursor:pointer;transition:border-color .24s cubic-bezier(.22,.61,.36,1)}
button.kpi:hover{border-color:var(--cian)}
.kpi-t{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.875rem;font-weight:500;color:var(--tinta-media)}
.kpi-ico{width:34px;height:34px;flex:none;border-radius:11px;background:#EEF2FF;color:var(--cian-texto);display:grid;place-items:center}
.kpi-ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.kpi-n{font-family:var(--cifra);font-weight:500;font-size:2rem;line-height:1.15;letter-spacing:-.03em;color:var(--tinta)}
.kpi-s{font-size:.8125rem;color:var(--gris-suave)}
.kpi-barra{height:6px;border-radius:999px;background:var(--arena);overflow:hidden;margin:2px 0}
.kpi-barra i{display:block;height:100%;border-radius:999px;background:var(--cian)}
.tablero{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start;margin-bottom:20px}
.tablero-col{display:flex;flex-direction:column;gap:20px;min-width:0}
.tablero-col > section{
background:var(--aire);border:1px solid var(--linea);border-radius:var(--radio);
box-shadow:var(--sombra);padding:24px 26px;margin:0;
}
/* ORACLE: la tarjeta negra con el ente. Un solo foco de luz, horizontal. */
.tablero-col > section.oraculo{
background:radial-gradient(ellipse 70% 30% at 50% 38%, rgba(11,78,255,.28), transparent 70%), #0B0B0F;
border-color:#0B0B0F;color:#F7F6F2;padding:20px 22px 22px;
}
.or-cab{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.or-cab{margin-bottom:2px}
.oraculo .or-cab h2{font-family:var(--display);font-size:.8125rem;font-weight:500;letter-spacing:.3em;color:#fff;margin:0}
.oraculo .or-cab span{font-size:.75rem;color:#8A8FA1}
#pan-riesgo-sec .or-cab span{font-size:.75rem;color:var(--gris-suave)}
.or-ente{display:grid;place-items:center;margin:6px 0 4px}
.or-ente svg{width:100%;max-width:240px;height:auto;overflow:visible}
.or-orbita{fill:none;stroke:rgba(169,190,255,.28);stroke-width:1}
.or-giro{animation:or-giro 40s linear infinite}
.or-giro circle{fill:#A9BEFF}
.or-giro circle.int{fill:#6F91FF}
.or-nucleo{fill:#0B0B0F;stroke:#0B4EFF;stroke-width:2;filter:drop-shadow(0 0 10px rgba(11,78,255,.9))}
@keyframes or-giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.or-giro{animation:none}}
.or-msg{font-size:.9375rem;line-height:1.55;color:#EDEEF2;margin:6px 0 14px}
.or-msg b{color:#fff}
.or-resto{color:#8A8FA1}
.or-acc .btn{width:auto;margin:0}
.or-acc:empty{display:none}
/* En riesgo: quién se está saliendo de órbita. */
#pan-riesgo{display:flex;flex-direction:column;gap:6px}
.riesgo{
display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;font:inherit;color:inherit;
padding:10px 12px 10px 14px;border:1px solid var(--linea);border-radius:14px;background:var(--aire);
cursor:pointer;position:relative;overflow:hidden;
}
.riesgo::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--arena-borde)}
.riesgo.u1::before{background:#E0483A}
.riesgo.u2::before{background:#E0A11B}
.riesgo:hover{border-color:var(--cian)}
.riesgo-q{display:flex;align-items:baseline;gap:8px;min-width:0}
.riesgo-q b{font-weight:600;font-size:.9375rem;color:var(--tinta);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.riesgo-q small{font-size:.75rem;color:var(--gris-suave);flex:none}
.riesgo-m{font-size:.8125rem;color:var(--gris)}
.riesgo-m i{font-style:normal;color:var(--gris-suave)}
.riesgo-mas{font-size:.8125rem;color:var(--gris-suave);margin-top:8px}
.riesgo-limpio{font-size:.9375rem;color:var(--gris)}
/* Pide tu atención: filas redondeadas, la urgencia en un punto de color. */
.avisos{gap:8px;background:none;border:0}
.aviso{border:1px solid var(--linea);border-radius:14px;padding:10px 12px 10px 16px}
.aviso .marca{width:8px;height:8px;min-height:0;align-self:center;border-radius:50%}
.aviso.urge .marca{background:var(--error)}
.avisos-limpio{border-radius:14px}
@media (max-width:1100px){
.tablero{grid-template-columns:1fr}
.tablero-der{order:-1}
}
/* ---------- Detalles de las pantallas ---------- */
/* Selectores con la flecha de VORTEX, no la del sistema. */
select{
appearance:none;-webkit-appearance:none;
padding:10px 34px 10px 13px !important;background-color:var(--aire) !important;
background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235C6072' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
background-repeat:no-repeat !important;background-position:right 11px center !important;background-size:16px !important;
border:1px solid var(--arena-borde);color:var(--tinta);min-height:var(--toque);
}
select:disabled{color:var(--gris-suave);background-color:var(--papel)}
/* Listas de registros (Bandeja) y sus etiquetas. */
.lista{border:1px solid var(--linea);border-radius:16px;overflow:hidden}
.reg{border-left:0;border-right:0}
.reg:first-child{border-top:0}
.reg:last-child{border-bottom:0}
.datos dt, .ent-dl dt, .salud-det dt, .com-gustos dt{
font-family:var(--texto);font-weight:500;font-size:.75rem;letter-spacing:.06em;
text-transform:uppercase;color:var(--gris-suave);
}
/* Barra de pase y su leyenda. */
.pase-barra{border-radius:999px;overflow:hidden;height:34px}
.pase-leyenda i{border-radius:3px}
/* Grupos de botones (llamadas del staff, días). */
.sp-llam{gap:0;border-radius:12px;overflow:hidden;border:1px solid var(--arena-borde)}
.sp-llam button{border:0;border-right:1px solid var(--arena-borde);border-radius:0}
.sp-llam button:last-child{border-right:0}
.sp-dias button, .dia{border-radius:10px}
/* Colores funcionales del manual: éxito, alerta y error. */
.sp-llam button.on.en_tiempo, .ent-llam span.en_tiempo{background:#E6F6EF;border-color:#12805A;color:#0E6B4B}
.sp-llam button.on.tarde, .ent-llam span.tarde{background:#FBF1DC;border-color:#B07A00;color:#7A5600}
.sp-llam button.on.no_llamo, .ent-llam span.no_llamo{background:#FCEDEB;border-color:#B83A2E;color:#8A2A20}
.sem.verde{background:#1FA971}.sem.amarillo{background:#E0A11B}.sem.rojo{background:#E0483A}
.aviso.urge .marca{background:#E0483A}
/* Fichas y tarjetas de las demás pantallas. */
.ent-card-cab, .jcard-cab, .ajuego-cab{background:var(--papel)}
.rs-item, .bl-item{border-top-color:var(--linea)}
.bl-ficha, .pautas-cols .pauta, .stf-chip{border-radius:14px}
.stf-chip, .ent-chip{border-radius:999px}
.tablawrap{border:1px solid var(--linea);overflow:auto}
table th{background:var(--aire)}
/* ---------- Gráficas de PULSE ---------- */
.pl-graficas{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin:18px 0}
.pl-grafica{border:1px solid var(--linea);border-radius:16px;padding:16px 18px 14px;background:var(--aire);min-width:0}
.pl-grafica h3{font-size:1rem;margin-bottom:10px}
.pl-svg{width:100%;height:auto;display:block;overflow:visible}
.pl-reja{stroke:var(--linea);stroke-width:1}
.pl-eje{font-family:var(--cifra);font-size:11px;fill:var(--gris-suave)}
.pl-linea{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.pl-barra-g,.pl-punto,.pl-linea{transition:opacity .24s cubic-bezier(.22,.61,.36,1)}
.pl-grafica:hover .pl-barra-g{opacity:.85}
.pl-barra-g:hover,.pl-punto:hover{opacity:1}
.pl-leyenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:.75rem;color:var(--gris)}
.pl-leyenda span{display:inline-flex;align-items:center;gap:6px}
.pl-leyenda i{width:10px;height:10px;border-radius:3px;display:inline-block}
@media (max-width:900px){
.shell{padding:18px 16px 56px}
.shell > section{padding:18px 16px;border-radius:16px}
.tablero-col > section{padding:18px 16px;border-radius:16px}
.tab-cab h1{font-size:1.625rem}
.kpis{grid-template-columns:1fr 1fr;gap:10px}
.kpi{padding:12px 14px 14px;border-radius:16px}
.kpi-n{font-size:1.5rem}
.kpi-ico{width:28px;height:28px;border-radius:9px}
}