/* ============================================================
   IEB Internacional — Identidad visual "Dorado y tinta"
   Banca privada europea · marfil base · dorado escaso · sin sombras
   ============================================================ */
:root{
  /* ---- MOVIMIENTO (2026-09-20) — cinco tokens, una sola voz. Antes: 11 curvas y 27 duraciones escritas a mano.
     Todo lo que entra o sale usa --ease-out; lo que se mueve en pantalla, --ease-in-out; los cajones, --ease-drawer.
     Duraciones: press (apretar) < ui (menús/pestañas/hover) < panel (modales/cajones/plegables). ---- */
  --ease-out:     cubic-bezier(.22,1,.36,1);
  --ease-in-out:  cubic-bezier(.77,0,.175,1);
  --ease-drawer:  cubic-bezier(.32,.72,0,1);
  --dur-press:    140ms;
  --dur-ui:       180ms;
  --dur-panel:    260ms;

  /* ONYX — banca privada oscura: espresso + oro cálido + vidrio. Mismos nombres de token. */
  --gold:        #E0C078;   /* acento brillante (sobre oscuro) */
  --gold-deep:   #C8A86A;   /* oro medio: texto/acentos legibles sobre oscuro */
  --ink:         #ECE3D2;   /* "tinta" = ahora texto CLARO */
  --ivory:       #15110C;   /* "marfil" = ahora fondo OSCURO (espresso) */
  --grey-warm:   #9A8E76;   /* apagado claro */
  --card:        rgba(255,255,255,.045);  /* vidrio oscuro (hover de filas, inputs) */
  --panel:       rgba(255,255,255,.055);  /* vidrio oscuro (tarjetas, barras)        */
  --line:        rgba(200,168,106,.18);   /* filete dorado translúcido */
  --serif: "Libre Caslon Text", Georgia, serif;
  --sans:  "IBM Plex Sans", Helvetica, Arial, sans-serif;
  --pad: clamp(20px, 6vw, 80px);
  /* --- Aurora / ONYX --- */
  --blue:      #C8A86A;     /* (compat: enlaces de error que usaban var(--blue)) */
  --r:         10px;
  --r-lg:      18px;
  --r-pill:    999px;
  --blur:      saturate(1.1) blur(12px);
  --shadow:    0 18px 40px -22px rgba(0,0,0,.62);
  --shadow-lg: 0 30px 60px -26px rgba(0,0,0,.7);
  --stroke:    rgba(200,168,106,.24);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.6;
  color:var(--ink);background:var(--ivory);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);line-height:1.2}

/* The signature gold line preceding section titles */
.gold-line::before,.panel h2::before,.list-title h1::before,.sec-title::before,.modal-h::before{
  content:"";display:block;width:52px;height:2px;background:var(--gold);margin-bottom:14px;
}

.muted{color:var(--grey-warm)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.right{text-align:right}
.acct-mono{font-family:var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.02em;color:var(--ink)}

/* ---------- Header ---------- */
.nx-header{
  position:sticky;top:0;z-index:50;background:var(--panel);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:0 clamp(16px,3vw,40px);height:66px;
}
/* La izquierda (logo + nav) ABSORBE el sobrante y deja que la nav scrollee si no entra;
   la derecha (buscar/mensajes/temas/usuario/ajustes/salir) queda SIEMPRE fija y visible. */
/* overflow:hidden = garantía dura: si algún día se suma otro botón, el cluster izquierdo se recorta en vez
   de desbordar su caja y montarse sobre el de la derecha (que es lo que pasaba). No hay nada posicionado
   fuera de flujo acá adentro (los badges viven en .nx-header-right), así que no recorta nada útil. */
/* clip en X (garantía de que el cluster izquierdo nunca pise al derecho) pero VISIBLE en Y, para que la
   etiqueta de los botones-ícono pueda salir por debajo del header. overflow:hidden recortaba las dos. */
.nx-header-left{display:flex;align-items:center;gap:30px;min-width:0;flex:1 1 auto;overflow-x:clip;overflow-y:visible}
.nx-logo{display:inline-flex;align-items:center;flex:0 0 auto}
/* ============================================================
   MARCA — logo IEB Internacional (app/assets/ieb-logo.png).
   El PNG viene con la tipografía en CREMA sobre transparente: pensado para fondo OSCURO. Sobre los temas claros
   (Marfil / Daylight) y sobre el PAPEL BLANCO de los reportes impresos, ese crema sería ILEGIBLE → en esos
   contextos se oscurece con un filtro (ver .brand-logo más abajo). Si algún día hay un PNG de marca en versión
   oscura, reemplazar el filtro por un <img> alternativo, que siempre da mejor color que un filter.
   ============================================================ */
/* 38px: el logo lleva "Internacional" en una 2ª línea muy chica — por debajo de ~36px esa línea no se lee.
   El header mide 64px, así que 38 deja aire suficiente. */
.brand-logo{height:38px;width:auto;display:block;flex:0 0 auto}
/* Temas CLAROS: el crema del logo desaparecería sobre el fondo claro → se oscurece conservando el matiz cálido.
   brightness<1 + saturate para que el oro no se apague; NO invert (invertir manda el oro al azul). */
html[data-theme="ivory"] .brand-logo,
html[data-theme="daylight"] .brand-logo{filter:brightness(.42) saturate(1.35) contrast(1.08)}
/* Papel impreso (estado de cuenta, tax, avisos): siempre blanco, aun en tema oscuro → mismo tratamiento. */
@media print{.brand-logo{filter:brightness(.35) saturate(1.3) contrast(1.1)}}
.grm-word{font-family:var(--serif);font-size:24px;letter-spacing:.14em;color:var(--ink)}
.grm-dot{color:var(--gold);margin:0 2px}
.nx-nav{display:flex;align-items:center;gap:20px;height:66px;flex-wrap:nowrap;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.nx-nav::-webkit-scrollbar{display:none}
.nx-nav-div{width:1px;height:18px;background:var(--line);flex:none;align-self:center}
.nx-nav-item{font-size:11.5px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--grey-warm);height:66px;display:flex;align-items:center;border-bottom:2px solid transparent;white-space:nowrap}
.nx-nav-item:hover{color:var(--ink)}
.nx-nav-item.active{color:var(--ink);border-bottom-color:var(--gold)}
.nx-nav-item[data-noop]{color:#b6ae9f;cursor:default}
.nx-nav-item[data-noop]:hover{color:#b6ae9f}
.nx-header-right{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.nx-icon-btn{width:34px;height:34px;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--grey-warm);font-size:17px;display:flex;align-items:center;justify-content:center}
.nx-icon-btn:hover{color:var(--ink);border-color:var(--line)}
.nx-avatar{width:32px;height:32px;border-radius:50%;border:1px solid var(--gold-deep);background:transparent;color:var(--gold-deep);display:flex;align-items:center;justify-content:center;font-size:9px}
/* Ícono Inicio (casita) en el header: estado activo (en Inicio) en oro */
.nx-home svg{display:block}
.nx-home.active{color:var(--gold);border-color:var(--line)}
/* Acciones rápidas en el header (después del logo): Aviso de viaje · Pedido de Transferencia. Todos los roles. */
.nx-header-actions{display:flex;align-items:center;gap:10px;margin-left:8px}
.nx-hdr-btn{position:relative;display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-size:11.5px;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;color:var(--grey-warm);border:1px solid var(--line);border-radius:var(--r);
  padding:8px 13px;white-space:nowrap;text-decoration:none;background:transparent}
.nx-hdr-btn:hover{color:var(--ink);border-color:var(--gold-deep)}
/* En pantallas chicas, solo el ícono (sin el texto) para que no desborde el header. */
/* Con el chip fuera del header, con etiquetas necesita 1438px (medido). Abajo de eso los 3 botones quedan
   en modo ícono y muestran su nombre en una etiqueta propia al pasar el mouse o al tabular (ver .nx-hdr-btn
   ::after más abajo): el title nativo tarda ~1s y era fácil no enterarse de qué hacía cada símbolo. */
@media (max-width:1439px){
  .nx-header-actions{gap:6px;margin-left:4px}
  .nx-hdr-btn .hb-txt{display:none}
  .nx-hdr-btn{padding:7px 10px;font-size:15px}
  .nx-hdr-btn::after{
    content:attr(aria-label); position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%) translateY(-4px);
    background:var(--menu-bg,var(--panel)); color:var(--ink); border:1px solid var(--line); border-radius:8px;
    padding:5px 10px; font-size:11.5px; font-weight:400; letter-spacing:.02em; white-space:nowrap;
    text-transform:none;   /* el botón es MAYÚSCULA; la etiqueta se lee mejor tal cual está escrita */
    box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:opacity .14s ease, transform .14s ease; z-index:60;
  }
  .nx-hdr-btn:hover::after, .nx-hdr-btn:focus-visible::after{ opacity:1; transform:translateX(-50%) translateY(0); }
}

/* ---------- Footer ---------- */
.nx-footer{padding:22px var(--pad);color:var(--grey-warm);font-size:11px;letter-spacing:.06em;display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);background:var(--panel);margin-top:48px}

/* ---------- List view ---------- */
.list-wrap{max-width:1300px;margin:0 auto;padding:clamp(28px,5vw,56px) var(--pad)}
.list-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.list-title h1{margin:0;font-size:32px}
.list-title p{margin:8px 0 0;color:var(--grey-warm);font-size:14px}
/* Nota de página de las vistas que abren con .acct-bar (detalle, estado de cuenta, tax, consolidado, ficha):
   qué se ve y qué se puede hacer. Mismo rol que el <p> de .list-title. No se imprime. */
.page-note{margin:-6px 0 18px;color:var(--grey-warm);font-size:14px;line-height:1.55;max-width:760px}
/* En el DETALLE la nota es hija directa de #view (no hay .list-wrap que le dé sangría) → queda pegada al borde.
   Sangrarla con el mismo --pad de la .acct-bar que la precede la alinea con el resto de la vista. */
.acct-bar + .page-note{margin:16px 0 0;padding:0 var(--pad)}
@media print{.page-note{display:none}}
/* Cola de datos de una nota (conteos): un escalón por debajo de la prosa, para que la frase mande. */
.pn-data{opacity:.72;font-size:.92em}
/* wrap: en Alertas son 4 botones (513px) y sin esto la fila desbordaba la página entera en mobile
   (documento a 533px de ancho con scroll horizontal). El .list-head que la contiene ya envolvía. */
.head-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
/* Barra de descarga (solo ícono) justo arriba de una tabla/lista */
.list-exp{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:2px 0 10px}
.brand-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r);padding:6px 14px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-warm)}
.brand-dot{width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}

.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:32px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.kpi .k-label{color:var(--grey-warm);font-size:10.5px;text-transform:uppercase;letter-spacing:.16em}
.kpi .k-value{font-size:30px;font-weight:500;margin-top:12px;font-variant-numeric:tabular-nums;color:var(--ink)}
.kpi .k-sub{color:var(--grey-warm);font-size:12px;margin-top:6px}
/* KPI clickeable (drill-down): cursor + flecha de afordance + foco accesible */
.kpi-link{cursor:pointer}
.kpi-link .k-label::after{content:" ▸";color:var(--gold);font-weight:600;opacity:.85}
.kpi-link:hover{border-color:rgba(156,124,79,.7)}
.kpi-link:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
a.filter-chip{color:var(--gold-deep);text-decoration:none;font-weight:600;border-bottom:1px dotted var(--gold)}
a.filter-chip:hover{color:var(--ink)}

.toolbar{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.search-box{flex:1;min-width:260px;position:relative}
.search-box input{width:100%;padding:12px 14px 12px 40px;border:1px solid var(--line);border-radius:var(--r);font-size:15px;font-family:var(--sans);font-weight:300;background:var(--panel);color:var(--ink)}
.search-box input:focus{outline:none;border-color:var(--gold-deep)}
.search-box .si{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--grey-warm);font-size:16px}
.toolbar select,.period-sel{padding:11px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);font-size:12.5px;font-family:var(--sans);color:var(--ink)}
/* "Ver como asesor" (admin) en el header: select compacto; resaltado cuando hay un asesor activo (preview). */
.viewas-wrap{display:inline-flex;align-items:center;gap:6px}
.viewas-wrap select.period-sel{padding:7px 10px;font-size:12px;max-width:190px}
.viewas-wrap .viewas-eye{color:var(--gold-text);opacity:.75;flex:0 0 auto;display:inline-flex}
.viewas-on .viewas-eye{opacity:1}
.viewas-on select.period-sel{border-color:var(--gold);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 24%, transparent);color:var(--gold-text);font-weight:600}
@media (max-width:1100px){.viewas-wrap select.period-sel{max-width:132px}}
@media (max-width:760px){.viewas-wrap{display:none}}  /* en mobile el header es angosto; se maneja desde Ajustes/Atlas */
/* ===== Generar Orden ===== */
.ord-list{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.ord-line{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.ord-txt{flex:1;min-width:0;font-size:13.5px;color:var(--ink);font-variant-numeric:tabular-nums;overflow-x:auto;white-space:nowrap}
.ord-copy{flex:none;padding:6px 10px}
.ord-seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;background:var(--panel);overflow:hidden}
.ord-seg button{appearance:none;border:0;background:transparent;color:var(--grey-warm);font-family:var(--sans);font-size:13px;font-weight:600;padding:9px 18px;cursor:pointer;transition:background .15s,color .15s}
.ord-seg.sm button{padding:8px 13px;font-size:12.5px}
.ord-seg button.on{background:var(--ink);color:var(--panel)}   /* inverso ink/panel: contrasta en los 5 temas */
.ord-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.ord-grid .fld label{display:block;font-size:11.5px;color:var(--grey-warm);margin-bottom:6px;text-transform:uppercase;letter-spacing:.08em}
.ord-grid input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);color:var(--ink);font-family:var(--sans);font-size:13.5px}
.ord-comm{display:flex;gap:8px}
.ord-comm input{flex:1;min-width:0}
.ord-clients-h{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.ord-clients-h .muted{color:var(--grey-warm);font-size:12px}
.ord-search{margin-left:auto;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);color:var(--ink);font-family:var(--sans);font-size:12.5px;min-width:210px;max-width:100%}
.ord-rows-head,.ord-row{display:grid;grid-template-columns:26px 120px minmax(0,1fr) 130px 104px;gap:10px;align-items:center}
.ord-rows-head{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--grey-warm);padding:0 10px 7px}
.ord-rows{max-height:340px;overflow-y:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.ord-row{margin:0;padding:9px 10px;border-bottom:1px solid var(--line);cursor:pointer;font-size:13px}
.ord-row:last-child{border-bottom:0}
.ord-row.sel{background:color-mix(in srgb,var(--gold) 8%,transparent)}
.ord-row.err{background:color-mix(in srgb,#c0392b 12%,transparent)}
.ord-acct{font-variant-numeric:tabular-nums;color:var(--grey-warm)}
.ord-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ord-val{text-align:right;font-variant-numeric:tabular-nums}
.ord-qty{width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font-family:var(--sans);font-size:12.5px}
.ord-qty:disabled{opacity:.35;cursor:not-allowed}
@media (max-width:680px){
  .ord-grid{grid-template-columns:1fr}
  .ord-rows-head{display:none}
  .ord-row{grid-template-columns:22px 84px minmax(0,1fr) 78px;gap:8px}
  .ord-val{display:none}
}
.result-count{color:var(--grey-warm);font-size:12.5px;margin-left:auto;letter-spacing:.04em}

.table-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
table.nx-table{width:100%;border-collapse:collapse;font-size:14px;font-family:var(--sans);font-weight:300}
.nx-table thead th{background:transparent;text-align:left;padding:15px 18px;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--grey-warm);font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer;user-select:none}
.nx-table thead th.num{text-align:right}
.nx-table thead th .arrow{color:var(--gold-deep);font-size:9px}
.nx-table tbody td{padding:15px 18px;border-bottom:1px solid var(--line);vertical-align:middle}
.nx-table tbody tr{cursor:pointer}
.nx-table tbody tr:hover{background:var(--card)}
.nx-table tbody tr:last-child td{border-bottom:none}
.cell-name{font-weight:500;color:var(--ink)}
.cell-sub{color:var(--grey-warm);font-size:12px;margin-top:2px}
.nx-table td.num.pos,.nx-table td.num.neg{color:var(--ink)}

/* quiet labels */
.badge{display:inline-block;font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--grey-warm)}
/* Badge de custodio: NEUTRO + punto de color por marca. El oro está reservado a marca/acción — usarlo para
   Pershing (y gris para StoneX) hacía leer un custodio como "activo" y el otro como "apagado". */
.cust-badge{display:inline-flex;align-items:center;gap:7px;padding:3px 10px;border-radius:var(--r);font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;border:1px solid var(--line);white-space:nowrap;color:var(--ink)}
.cust-badge::before{content:"";width:6px;height:6px;border-radius:50%;flex:0 0 auto;background:var(--grey-warm)}
.cust-badge.Pershing::before{background:var(--info)}
.cust-badge.StoneX::before{background:var(--warn)}
.link-tag{font-size:11px;margin-left:4px;color:var(--gold-deep)}
.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;background:var(--gold-deep)}
/* Productores ↔ clientes: fila con un cambio de productor SIN GUARDAR (se guarda en batch con el botón) */
tr.pc-row-changed td{background:color-mix(in srgb, var(--gold-deep) 12%, transparent)}
select.pc-sel.pc-changed{outline:1.5px solid var(--gold-deep);outline-offset:-1px}
.status-dot.closed{background:var(--grey-warm)}

/* ---------- Detail view ---------- */
.acct-bar{background:var(--panel);border-bottom:1px solid var(--line);padding:16px var(--pad);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.acct-label{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--grey-warm)}
.acct-chip{display:inline-flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:var(--r);padding:8px 18px;background:transparent}
.acct-chip .nm{font-family:var(--serif);font-size:16px;color:var(--ink)}
.acct-chip .an{color:var(--grey-warm);font-variant-numeric:tabular-nums;font-size:13px}
/* Productor asignado a la vista (admin): chip en la barra de cuenta + línea en el Resumen */
.acct-prod{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;letter-spacing:.04em;color:var(--grey-warm);border:1px solid var(--line);border-radius:var(--r);padding:6px 12px;white-space:nowrap}
.acct-prod strong{color:var(--ink);font-weight:600}
.prod-line{font-size:13px;color:var(--grey-warm);margin:-4px 0 18px}
.prod-line .prod-name{color:var(--ink);font-weight:600}
.prod-line .prod-name.muted{color:var(--grey-warm);font-weight:400}
.acct-actions{display:flex;gap:8px;margin-left:auto}
.acct-actions .circ{width:34px;height:34px;border-radius:50%;background:transparent;color:var(--grey-warm);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px}
.acct-actions .circ:hover{border-color:var(--gold-deep);color:var(--gold-deep)}

.summary-strip{background:var(--ivory);border-bottom:1px solid var(--line);padding:14px var(--pad);display:flex;gap:0;flex-wrap:wrap;align-items:center}
.summary-strip .as-of{color:var(--grey-warm);font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;margin-right:22px}
.metric{padding:4px 22px;border-right:1px solid var(--line);font-size:12.5px}
.metric:last-child{border-right:none}
.metric .ml{color:var(--grey-warm);text-transform:uppercase;letter-spacing:.1em;font-size:10.5px}
.metric .mv{font-weight:500;margin-left:8px;font-variant-numeric:tabular-nums;color:var(--ink)}
.metric .mv.pos,.metric .mv.neg{color:var(--ink)}

.detail-body{display:flex;align-items:stretch;min-height:520px}
.side-nav{width:224px;flex:none;background:var(--panel);border-right:1px solid var(--line);padding:18px 0}
.side-nav .sn-head{padding:10px 24px;color:var(--gold-deep);font-weight:600;letter-spacing:.16em;font-size:11px;text-transform:uppercase}
.side-nav .sn-item{display:block;padding:12px 24px;color:var(--grey-warm);font-size:14px;border-left:2px solid transparent}
.side-nav .sn-item:hover{background:var(--card);color:var(--ink)}
.side-nav .sn-item.active{background:var(--card);color:var(--ink);border-left-color:var(--gold);font-weight:500}
.side-nav .sn-item[data-noop]{color:#bcb4a5;cursor:default}
.side-nav .sn-item[data-noop]:hover{background:transparent;color:#bcb4a5}
.side-nav .sn-sep{height:1px;background:var(--line);margin:10px 20px}

.panel{flex:1;padding:clamp(28px,3.5vw,48px) clamp(24px,4vw,56px);min-width:0}
.panel h2{margin:0;font-size:27px}
.panel .panel-sub{color:var(--grey-warm);margin:6px 0 26px;font-size:13px;letter-spacing:.02em}

.info-section{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);margin-bottom:22px;overflow:hidden}
/* Tenencias enriquecidas: 9 columnas que NO entran en el panel del detalle con table-layout auto
   (la descripción y los números se expanden y empujan la última columna, % Cartera, fuera de pantalla).
   Solución: table-layout FIXED con anchos por columna en % → las 9 columnas entran SIEMPRE dentro del
   panel (la descripción envuelve, los números no se cortan). El scroll horizontal queda solo de red de
   seguridad por debajo de min-width (panels muy angostos / mobile). */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* Aviso de desborde: sombra en el borde hacia el que HAY más contenido (clases puestas por updateScrollShadow).
   Va INSET a propósito — un ::after absoluto scrollea con el contenido y quedaría a mitad de la tabla.
   Es agnóstico del tema: una sombra oscura lee como sombra tanto sobre Onyx como sobre Marfil.
   Solo .tbl-scroll: .table-card lleva su propia elevación con !important desde grm-meridian.css → una regla
   acá no le ganaría (y pisarla borraría la elevación de la tarjeta). */
.tbl-scroll{transition:box-shadow .18s ease}
.tbl-scroll.ovf-right{box-shadow:inset -17px 0 15px -15px rgba(0,0,0,.62)}
.tbl-scroll.ovf-left{box-shadow:inset 17px 0 15px -15px rgba(0,0,0,.62)}
.tbl-scroll.ovf-left.ovf-right{box-shadow:inset 17px 0 15px -15px rgba(0,0,0,.62),inset -17px 0 15px -15px rgba(0,0,0,.62)}
@media print{.tbl-scroll{box-shadow:none !important}}
.tbl-scroll .nx-table.holdings{table-layout:fixed;width:100%;min-width:960px}
.nx-table.holdings{font-size:13px}
.nx-table.holdings th,.nx-table.holdings td{padding-left:10px;padding-right:10px}
.nx-table.holdings td:not(.num),.nx-table.holdings th:not(.num){overflow-wrap:anywhere}
.nx-table.holdings td.num{white-space:nowrap}
/* Los encabezados de esta tabla ENVUELVEN dentro de su columna (override del nowrap base) para que no se
   pisen entre sí (ej. "G/P No Real." con "% Cartera"). */
.nx-table.holdings thead th{white-space:normal;vertical-align:bottom;line-height:1.25}
/* G/P: el % va APILADO debajo del monto → la columna queda angosta y entran las 9 columnas en el panel. */
.nx-table.holdings td.num .gl-pct{display:block;white-space:nowrap}
/* 10 columnas (con "Retorno total"): Símbolo·Descripción·ISIN·Cantidad·P.compra·P.actual·Valor·G/P·Retorno·%Cart.
   Suman 100%. La vista consolidada (showAccounts, 8 col) reusa esta clase — las reglas 9/10 no matchean ahí. */
.nx-table.holdings th:nth-child(1),.nx-table.holdings td:nth-child(1){width:8%}
.nx-table.holdings th:nth-child(2),.nx-table.holdings td:nth-child(2){width:15%}
.nx-table.holdings th:nth-child(3),.nx-table.holdings td:nth-child(3){width:10%}
.nx-table.holdings th:nth-child(4),.nx-table.holdings td:nth-child(4){width:9%}
.nx-table.holdings th:nth-child(5),.nx-table.holdings td:nth-child(5){width:9%}
.nx-table.holdings th:nth-child(6),.nx-table.holdings td:nth-child(6){width:8%}
.nx-table.holdings th:nth-child(7),.nx-table.holdings td:nth-child(7){width:12%}
.nx-table.holdings th:nth-child(8),.nx-table.holdings td:nth-child(8){width:11%}
.nx-table.holdings th:nth-child(9),.nx-table.holdings td:nth-child(9){width:10%}
.nx-table.holdings th:nth-child(10),.nx-table.holdings td:nth-child(10){width:8%}
.info-section .sec-title{padding:20px 24px 16px;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:17px;color:var(--ink);display:block}
.info-section .sec-title::before{margin-bottom:12px}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr)}
.info-grid .row{display:flex;padding:13px 24px;border-bottom:1px solid var(--line);gap:14px}
.info-grid .row .lbl{width:170px;flex:none;color:var(--grey-warm);font-size:11px;text-transform:uppercase;letter-spacing:.08em;padding-top:2px}
.info-grid .row .val{color:var(--ink);font-weight:400;word-break:break-word}
.info-grid .row .val.empty{color:var(--grey-warm)}
@media(max-width:860px){.info-grid{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}.side-nav{width:180px}}
/* En mobile las tablas anchas (8-9 cols) scrollean horizontal sin cortarse.
   En desktop sigue con overflow:hidden para clipear el border-radius. */
@media(max-width:760px){.table-card{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.nx-table{min-width:640px}
  /* Detalle del cliente en mobile: la side-nav deja de ser una columna fina y pasa a tira horizontal arriba;
     las tablas del panel (Tenencias/Transacciones, dentro de .info-section) scrollean en vez de cortarse. */
  .detail-body{flex-direction:column;min-height:0}
  .side-nav{width:auto;border-right:none;border-bottom:1px solid var(--line);padding:8px;display:flex;flex-wrap:wrap;gap:4px}
  .info-section{overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* Estado de cuenta / consolidado: sus tablas NO viven en .table-card, así que el min-width:640px de arriba
     empujaba el DOCUMENTO entero (medido: 680px de ancho a 375 de pantalla, con scroll lateral de toda la
     página y contenido cortado). Cada sección del documento scrollea por su cuenta. */
  .stmt-doc .st-sec, .rb-report .st-sec, .report .st-sec{overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* Los botones de cabecera, apilados y a ancho completo: en Alertas son 4 y con el wrap quedaban
     escalonados contra el borde derecho, cada uno de un ancho distinto. Así se leen como una lista. */
  .head-actions{width:100%;justify-content:stretch}
  .head-actions > *{flex:1 1 100%;justify-content:center}}
/* Tablas anchas → TARJETAS en mobile (clase cards-sm). Cada fila = tarjeta; cada celda muestra su etiqueta
   (data-label) a la izquierda y el valor a la derecha. La 1ª celda (nombre) es el encabezado de la tarjeta. */
@media(max-width:760px){
  .cards-wrap{overflow:visible!important}
  .cards-sm{min-width:0!important}
  .cards-sm thead{display:none}
  .cards-sm,.cards-sm tbody{display:block}
  .cards-sm tr{display:block;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);padding:12px 15px;margin:0 0 10px}
  .cards-sm td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:4px 0;border:0!important;text-align:right!important;white-space:normal}
  .cards-sm td::before{content:attr(data-label);color:var(--grey-warm);font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:600;text-align:left;flex:0 0 auto}
  .cards-sm td:first-child{display:block;text-align:left!important;font-size:15px;padding:0 0 8px;margin-bottom:6px;border-bottom:1px solid var(--line)!important}
  .cards-sm td:first-child::before{display:none}
  .cards-sm td .cell-sub{font-size:11px}
  .cards-sm .more-row td,.cards-sm td.pos-empty{display:block;text-align:center!important;padding:8px 0}
  .cards-sm .more-row td::before,.cards-sm td.pos-empty::before{display:none}
  .cards-sm td.num{font-variant-numeric:tabular-nums}
}

.bal-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}
.bal-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.bal-card .bl{color:var(--grey-warm);font-size:10.5px;text-transform:uppercase;letter-spacing:.12em}
.bal-card .bv{font-size:22px;font-weight:500;margin-top:10px;font-variant-numeric:tabular-nums;color:var(--ink)}

.donut-wrap{display:flex;gap:36px;align-items:center;flex-wrap:wrap;padding:22px 24px}
.donut{flex:none}
.legend{display:flex;flex-direction:column;gap:10px;min-width:280px}
.legend .lg{display:flex;align-items:center;gap:11px;font-size:13px}
.legend .sw{width:11px;height:11px;flex:none;transform:rotate(45deg)}
.legend .lg .lv{margin-left:auto;font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink)}
.legend .lg .lp{color:var(--grey-warm);width:56px;text-align:right;font-variant-numeric:tabular-nums}
.pos-empty{padding:44px;text-align:center;color:var(--grey-warm)}
.tag{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border:1px solid var(--line);border-radius:var(--r);color:var(--grey-warm)}

/* ---------- buttons (ghost) ---------- */
.btn-primary,.btn-secondary,.btn-danger,.link-groups-btn,.back-btn,.link-btn{
  font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;
  border-radius:var(--r);padding:10px 16px;background:transparent;transition:background var(--dur-ui) ease,border-color var(--dur-ui) ease,color var(--dur-ui) ease;display:inline-flex;align-items:center;gap:7px;
}
/* K2 · jerarquía de botones: el PRIMARIO es oro PLENO desde la BASE (antes era ghost y el tema lo
   "arreglaba" con !important → frágil en vistas sin meridian, p.ej. print/mails). Doctrina: 1 primario
   oro por vista; el resto ghost (secundario) o link dorado (terciario). */
.btn-primary{background:var(--gold);border:1px solid var(--gold);color:var(--on-gold,#1a1206)}
.btn-primary:hover{background:var(--gold-deep);border-color:var(--gold-deep)}
.btn-secondary{border:1px solid var(--line);color:var(--ink)}
.btn-secondary:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.btn-danger{border:1px solid var(--line);color:var(--grey-warm)}
.btn-danger:hover{border-color:var(--ink);color:var(--ink)}
.link-groups-btn{border:1px solid var(--ink);color:var(--ink)}
.link-groups-btn:hover{background:var(--card)}
.back-btn{border:1px solid var(--line);color:var(--grey-warm);padding:8px 14px}
.back-btn:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.link-btn{border:1px solid var(--line);color:var(--grey-warm);padding:8px 13px}
.link-btn:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.period-lbl{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--grey-warm)}
.tx-sub{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.tx-range{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;margin:0 0 12px}
.tx-range input[type=date].period-sel{padding:8px 10px;min-width:0}

/* ---------- modal ---------- */
.modal-bg{position:fixed;inset:0;background:rgba(43,38,34,.42);display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}
/* Entrada/salida del modal (2026-09-20). El velo funde y la ventana escala desde .96 — nunca desde scale(0), que
   se vería salir de la nada. Las clases .in/.out las maneja mountModal/closeModalNode en app.js. */
.modal-bg{opacity:0;transition:opacity 160ms var(--ease-out)}
.modal-bg.in{opacity:1}
.modal-bg.out{opacity:0}
.modal-bg > .modal{transform:scale(.96);transition:transform var(--dur-ui) var(--ease-out)}
.modal-bg.in > .modal{transform:none}
.modal-bg.out > .modal{transform:scale(.985)}
@media (prefers-reduced-motion:reduce){
  .modal-bg,.modal-bg.in{opacity:1;transition:none}
  .modal-bg > .modal,.modal-bg.in > .modal{transform:none;transition:none}
}
html[data-motion="minimo"] .modal-bg{opacity:1;transition:none}
html[data-motion="minimo"] .modal-bg > .modal{transform:none;transition:none}
.modal{background:var(--ivory);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 24px 60px rgba(43,38,34,.18);width:540px;max-width:100%;padding:30px;max-height:88vh;overflow:auto}
.modal.modal-lg{width:800px}
.modal-h{font-family:var(--serif);font-size:20px;color:var(--ink);margin-bottom:10px}
.modal p{color:var(--grey-warm);font-size:14px}
.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:22px}
.lm-list{display:flex;flex-direction:column;gap:8px;margin:14px 0;max-height:280px;overflow:auto}
.lm-row{display:flex;align-items:center;gap:10px;font-size:14px;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r);cursor:pointer}
.lm-row:hover{background:var(--card)}
.lm-new{display:flex;gap:10px;margin-top:10px}
.lm-new input{flex:1;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r);font-family:var(--sans);background:var(--panel);color:var(--ink)}
.lm-new button{white-space:nowrap;background:transparent;border:1px solid var(--gold-deep);color:var(--gold-deep);border-radius:var(--r);padding:0 14px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase}
.chip-link{display:inline-block;color:var(--gold-deep);border-bottom:1px solid var(--gold);padding:1px 2px;margin:2px 6px 2px 0;font-size:13px}

.ge-name{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);font-family:var(--serif);font-size:18px;color:var(--ink);background:var(--panel);margin:8px 0 18px}
.ge-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ge-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--grey-warm);margin-bottom:8px}
.ge-members,.ge-results{border:1px solid var(--line);border-radius:var(--r);min-height:190px;max-height:300px;overflow:auto;padding:6px;background:var(--panel)}
.ge-search{width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r);margin-bottom:8px;font-family:var(--sans);background:var(--panel);color:var(--ink)}
.ge-mrow,.ge-rrow{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:var(--r);font-size:13px}
.ge-mrow .nm,.ge-rrow .nm{font-weight:500}
.ge-rrow{cursor:pointer}
.ge-rrow:hover{background:var(--card)}
.ge-rm{margin-left:auto;border:1px solid var(--line);background:transparent;color:var(--grey-warm);border-radius:var(--r);width:24px;height:24px;font-size:12px}
.ge-rm:hover{border-color:var(--ink);color:var(--ink)}
@media(max-width:700px){.ge-cols{grid-template-columns:1fr}}

/* ---------- groups view ---------- */
.group-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;margin-bottom:16px}
.group-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.group-name{font-family:var(--serif);font-size:19px;color:var(--ink)}
.group-head .muted{font-size:12.5px;margin-top:4px}
.group-actions{display:flex;gap:10px;flex-wrap:wrap}
.member-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.member-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r);padding:5px 12px;font-size:12.5px}
.empty-state{background:var(--panel);border:1px dashed var(--line);border-radius:var(--r);padding:48px;text-align:center;color:var(--grey-warm)}

/* ---------- consolidated report ---------- */
.report-toolbar{max-width:1080px;margin:0 auto;padding:24px var(--pad) 0;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.rt-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.report{max-width:1080px;margin:0 auto;padding:26px var(--pad) 48px}
.report-header{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid var(--gold);padding:24px 18px 18px;margin-bottom:26px;
  background-image:repeating-linear-gradient(45deg,transparent,transparent 11px,rgba(175,145,107,.045) 11px,rgba(175,145,107,.045) 12px),repeating-linear-gradient(-45deg,transparent,transparent 11px,rgba(175,145,107,.045) 11px,rgba(175,145,107,.045) 12px);}
.report-logo .grm-word{font-size:22px}
.report-title{font-size:11px;color:var(--grey-warm);margin-top:6px;letter-spacing:.18em;text-transform:uppercase}
.report-meta{text-align:right}
.rg-name{font-family:var(--serif);font-size:23px;color:var(--ink)}
.report-meta .muted{font-size:12px;margin-top:4px}
.report-2col{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px}
.report-2col .info-section{margin-bottom:0}
.cbreaks{padding:20px 24px;display:flex;flex-direction:column;gap:14px}
.cbreak{display:flex;align-items:center;gap:14px;font-size:14px}
.cbreak-v{margin-left:auto;font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink)}
.report-foot{color:var(--grey-warm);font-size:10.5px;letter-spacing:.06em;text-align:center;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
@media(max-width:780px){.report-2col{grid-template-columns:1fr}}

/* ---------- print / PDF ---------- */
@media print{
  .nx-header,.nx-footer,.report-toolbar,.no-print{display:none !important}
  body{background:#fff}
  .report{max-width:100%;margin:0;padding:0}
  .info-section{border:1px solid var(--line);break-inside:avoid}
  .report-2col{break-inside:avoid}
  table.nx-table{font-size:11px}
  .report-header,.gold-line::before,.panel h2::before,.sec-title::before,.cust-badge,.report-header *{
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  @page{margin:16mm}
}

/* cash tag */
.tag.tag-cash{color:var(--gold-deep);border-color:var(--gold-deep);font-weight:600}

/* accesibilidad: foco visible por teclado */
.nx-table tbody tr:focus{outline:2px solid var(--gold-deep);outline-offset:-2px;background:var(--card)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold-deep);outline-offset:2px;border-radius:var(--r);
}
.sn-item[aria-disabled="true"],.nx-nav-item[aria-disabled="true"]{opacity:.55}

/* ============================================================
   AURORA — capa de diseño (vidrio · gradiente · redondeo · efectos)
   Se aplica sobre la base de marca. Aprobado por el usuario: introduce
   sombras suaves, esquinas redondeadas y un lavado de color frío.
   ============================================================ */
body{
  background:
    radial-gradient(1100px 620px at 12% -8%, rgba(156,124,79,.13), transparent 60%),
    radial-gradient(1000px 640px at 108% 2%, rgba(111,139,138,.13), transparent 55%),
    radial-gradient(900px 720px at 50% 118%, rgba(140,143,168,.10), transparent 60%),
    linear-gradient(180deg,#F5F3ED,#ECEBE3);
  background-attachment:fixed;
}

/* --- barras frosted --- */
.nx-header{background:rgba(251,248,243,.62);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.nx-footer{background:rgba(251,248,243,.55);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.acct-bar{background:rgba(251,248,243,.62);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.summary-strip{background:rgba(255,255,255,.42);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}

/* --- tarjetas de vidrio --- */
.kpi,.table-card,.info-section,.bal-card,.group-card,.empty-state,.side-nav,.acct-chip{
  background:var(--panel);border:1px solid var(--line);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  box-shadow:var(--shadow);
}
.kpi,.table-card,.info-section,.group-card,.empty-state{border-radius:var(--r-lg)}
.bal-card{border-radius:var(--r)}
.acct-chip{border-radius:var(--r-pill);padding:8px 20px}

/* --- inputs / selects redondeados + glass --- */
.search-box input,.toolbar select,.period-sel,.ge-search,.ge-name,.lm-new input,.modal input{
  border-radius:var(--r);background:rgba(255,255,255,.55);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
}
.search-box input{border-radius:var(--r-pill)}

/* --- badges / tags / chips tipo pill --- */
.cust-badge,.tag,.badge,.brand-pill,.member-chip,.lm-row,.status-dot{border-radius:var(--r-pill)}

/* --- botones tipo pill --- */
/* El rebote (overshoot 1.56) a 350ms se sacó: el feedback de apretar tiene que estar en 100-160ms y en un panel de
   banca privada el rebote lee como juguete. El :active es el ÚNICO feedback posible en pantalla táctil. */
.btn-primary,.btn-secondary,.btn-danger,.link-groups-btn,.back-btn,.link-btn,.lm-new button{
  border-radius:var(--r-pill);
  transition:transform var(--dur-press) var(--ease-out),background var(--dur-ui) ease,border-color var(--dur-ui) ease,color var(--dur-ui) ease;
}
/* Los hover que MUEVEN van detrás de (hover:hover): en touch el tap los deja pegados hasta el próximo toque. */
@media (hover:hover) and (pointer:fine){
  .btn-primary:hover,.btn-secondary:hover,.btn-danger:hover,.link-groups-btn:hover,.back-btn:hover,.link-btn:hover{transform:translateY(-2px)}
}
.btn-primary:active,.btn-secondary:active,.btn-danger:active,.link-groups-btn:active,.back-btn:active,.link-btn:active,.lm-new button:active,
.btn-sm:active,.more-btn:active,.btn-ghost:active,.filtros-toggle:active,.chip-link:active{transform:scale(.97)}

/* --- tarjetas --- */
.kpi{transition:transform var(--dur-ui) var(--ease-out),box-shadow var(--dur-ui) ease,border-color var(--dur-ui) ease}
.bal-card,.group-card{transition:transform var(--dur-ui) var(--ease-out),box-shadow var(--dur-ui) ease}
@media (hover:hover) and (pointer:fine){
  .kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:rgba(156,124,79,.55)}
  .bal-card:hover,.group-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
}

/* --- filas de tabla --- */
.nx-table tbody tr{transition:background var(--dur-ui) ease,box-shadow var(--dur-ui) ease}
@media (hover:hover) and (pointer:fine){
  .nx-table tbody tr:hover{background:var(--card);box-shadow:inset 3px 0 0 var(--gold)}
  .nx-table tbody tr:hover .cell-name{color:var(--gold-deep)}
}
/* Feedback al apretar una fila: en una tabla el scale rompe los filetes, así que se marca con fondo + filete. */
.nx-table tbody tr:active{background:var(--card);box-shadow:inset 3px 0 0 var(--gold-deep)}
.row-link:active,.pc-item:active,.msg-item:active,.mg-tab:active,.acct-menu-item:active,.tab:active,.nx-snav-link:active{transform:scale(.995)}

/* --- modal de vidrio --- */
.modal{background:rgba(252,250,246,.88);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--stroke);border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}

/* --- reveal de entrada (aplicado por app.js) --- */
.aurora-reveal{opacity:0}
.aurora-reveal.in{animation:auroraIn .62s var(--ease-out) forwards}
@keyframes auroraIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* --- donut: trazo que se dibuja --- */
.donut .dseg{transition:stroke-dasharray 1.1s var(--ease-out)}

@media (prefers-reduced-motion:reduce){
  .aurora-reveal,.aurora-reveal.in{opacity:1!important;animation:none!important;transform:none!important}
  .login-brand .grm-word{animation:none!important}   /* el brillo de la marca también late: apagarlo (2026-09-20) */
  .donut .dseg{transition:none!important}
  .kpi:hover,.bal-card:hover,.group-card:hover,.btn-primary:hover,.btn-secondary:hover,.back-btn:hover,.link-btn:hover,.link-groups-btn:hover{transform:none!important}
}

/* --- impresión / PDF: sin vidrio ni sombras, fondo blanco --- */
@media print{
  body{background:#fff!important}
  .kpi,.table-card,.info-section,.bal-card,.group-card,.empty-state,.acct-bar,.summary-strip,.side-nav,.modal,.acct-chip{
    background:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    box-shadow:none!important;border:1px solid var(--line)!important;border-radius:var(--r)!important;
  }
  .aurora-reveal{opacity:1!important;animation:none!important}
}

/* ============================================================
   LOGIN / BIENVENIDA + multiusuario (Aurora)
   ============================================================ */
.login-wrap{min-height:calc(100vh - 66px - 120px);display:flex;align-items:center;justify-content:center;padding:48px 20px}
.login-card{
  width:392px;max-width:100%;padding:42px 36px;text-align:center;
  background:var(--panel);border:1px solid var(--stroke);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  animation:auroraIn .6s var(--ease-out) both;
}
.login-brand{margin-bottom:18px}
.login-brand .grm-word{font-size:26px;letter-spacing:.16em}
/* El login centra su marca; el logo va más grande que en el header (es la primera impresión). */
.login-brand{display:flex;justify-content:center}
.brand-logo.login-logo{height:52px}
.login-title{font-family:var(--serif);font-size:28px;margin:0 0 6px}
.login-sub{color:var(--grey-warm);font-size:13px;margin:0 0 26px}
.login-form{text-align:left;display:flex;flex-direction:column}
.login-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--grey-warm);margin:12px 0 6px}
.login-input{padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.62);font-family:var(--sans);font-size:15px;color:var(--ink)}
.login-input:focus{outline:none;border-color:var(--gold-deep)}
.login-error{color:#7a2e2e;background:rgba(122,46,46,.07);border:1px solid rgba(122,46,46,.22);border-radius:var(--r);padding:9px 12px;font-size:12.5px;margin-top:14px}
.login-btn{justify-content:center;margin-top:22px;padding:13px}
.login-foot{color:var(--grey-warm);font-size:10.5px;letter-spacing:.05em;margin-top:24px}
.pk-alt-options{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.pk-alt-btn{font-size:12px;padding:10px 16px}

/* chip de usuario en el header */
.user-chip{display:inline-flex;align-items:center;gap:9px;font-size:13px;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-pill);padding:5px 8px 5px 14px;background:var(--panel)}
.user-role{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);border:1px solid var(--gold-deep);border-radius:var(--r-pill);padding:2px 9px}

/* badge de rol en la tabla de usuarios */
.role-badge{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-radius:var(--r-pill);padding:3px 11px;border:1px solid var(--line)}
.role-badge.admin{color:var(--gold-deep);border-color:var(--gold-deep)}
.role-badge.prod{color:var(--ink)}
.role-badge.cliente{color:var(--grey-warm);border-color:var(--line)}

/* ocultar chrome de app mientras no hay sesión */
body:not(.authed) .nx-snav,body:not(.authed) .nx-side,body:not(.authed) .nx-side-toggle,body:not(.authed) .nx-header-right,body:not(.authed) .nx-header-actions,body:not(.authed) .nx-home{display:none}
/* sin sesión el contenido va a ancho completo (login) — sin la columna de la barra */
body:not(.authed) .nx-shell{display:block}

/* 2FA */
.totp-secret{display:flex;align-items:center;gap:10px;justify-content:center;flex-wrap:wrap;margin:2px 0 6px}
.totp-key{font-family:var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.18em;font-size:15px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:var(--r);padding:9px 13px;word-break:break-all;user-select:all}
.twofa-code{letter-spacing:.32em;text-align:center;font-size:21px;font-variant-numeric:tabular-nums}
.login-note{color:var(--gold-deep);background:rgba(175,145,107,.10);border:1px solid rgba(175,145,107,.30);border-radius:var(--r);padding:9px 12px;font-size:12.5px;margin-bottom:6px}

/* alertas */
.tag-cash{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px;color:var(--gold-deep);border:1px solid var(--gold-deep)}
.tag-conc{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px;color:var(--ink);border:1px solid var(--line)}
.tag-margin,.tag-in,.tag-out,.tag-mat{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px;border:1px solid var(--line);color:var(--grey-warm)}
.tag-mat{color:#5a5246;border-color:#a08a6a}
.tag-margin{color:#9a5a3a;border-color:#9a5a3a}
.tag-in{color:#5a6b5a;border-color:#5a6b5a}
.tag-out{color:var(--gold-deep);border-color:var(--gold-deep)}
.alert-row:hover{background:var(--card)}

/* filas clickeables (Alertas / Análisis / Acciones) — JS agrega tabindex=0 role=button */
.alert-row,.row-link{cursor:pointer;transition:background .2s ease,box-shadow .2s ease}
.alert-row:focus-visible,.row-link:focus-visible{outline:2px solid var(--gold-deep);outline-offset:-2px;background:var(--card)}
.row-link:hover{background:var(--card);box-shadow:inset 3px 0 0 var(--gold)}

/* toast efímero de confirmación ("Guardado ✓") — Aurora glass */
.toast{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(12px);
  z-index:300;display:inline-flex;align-items:center;gap:9px;
  background:var(--panel);border:1px solid var(--stroke);border-radius:var(--r-pill);
  box-shadow:var(--shadow-lg);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  color:var(--ink);font-family:var(--sans);font-size:13.5px;letter-spacing:.02em;
  padding:11px 20px;opacity:0;pointer-events:none;
  animation:toastIn .28s var(--ease-out) forwards;
}
.toast::before{content:"";width:7px;height:7px;flex:none;background:var(--gold);transform:rotate(45deg)}
.toast.out{animation:toastOut .3s cubic-bezier(.4,0,1,1) forwards}
@keyframes toastIn{to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes toastOut{from{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(12px)}}
@media (prefers-reduced-motion:reduce){
  .toast{animation:none!important;opacity:1;transform:translateX(-50%) translateY(0)}
  .toast.out{animation:none!important;opacity:0}
}

/* análisis */
.grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pad-card{padding:22px 24px}
.sec-title{font-family:var(--serif);font-weight:400;font-size:18px;margin:0 0 14px}
.alloc-row{margin:11px 0}
.alloc-top{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:5px}
.alloc-track{height:8px;background:var(--line);border-radius:999px;overflow:hidden}
.alloc-fill{height:100%;background:var(--gold);border-radius:999px}
.perf-big{font-family:var(--serif);font-size:22px;color:var(--ink);margin-bottom:2px;font-variant-numeric:tabular-nums}
.perf-prod-row{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0}
.perf-prod-name{font-size:13px;color:var(--ink);font-weight:500}
.perf-prod-val{font-family:var(--serif);font-size:17px;color:var(--ink);font-variant-numeric:tabular-nums}
.clickable-card{cursor:pointer;border-radius:var(--r);margin:-6px;padding:6px;transition:background .15s}
.clickable-card:hover{background:color-mix(in srgb, var(--gold,#b8902f) 8%, transparent)}
.lnk-hint{color:var(--gold,#b8902f);font-weight:600;cursor:pointer;white-space:nowrap}
@media (max-width:820px){.grid-2col{grid-template-columns:1fr}}

/* CRM / ficha */
.mini-tbl{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:6px}
.mini-tbl th{text-align:left;color:var(--grey-warm);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.1em;padding:4px 6px;border-bottom:1px solid var(--line)}
.mini-tbl td{padding:6px;border-bottom:1px solid var(--line)}
.mini-tbl .num{text-align:right}
.crm-item{padding:9px 0;border-bottom:1px solid var(--line)}
.crm-item:last-child{border-bottom:none}
.crm-meta{font-size:11px;color:var(--grey-warm);margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.crm-task{cursor:pointer}
.crm-task.done{text-decoration:line-through;color:var(--grey-warm)}
.tgt-in{border:1px solid var(--line);border-radius:var(--r);padding:3px 6px;font-family:var(--sans);text-align:right;width:64px}
textarea.ge-search{resize:vertical;font-family:var(--sans);width:100%}

/* foco visible reforzado dentro del modal (la trampa de foco la maneja JS) */
.modal a:focus-visible,.modal button:focus-visible,.modal input:focus-visible,
.modal select:focus-visible,.modal textarea:focus-visible,.modal [tabindex]:focus-visible{
  outline:2px solid var(--gold-deep);outline-offset:2px;border-radius:var(--r);
}

/* ============================================================
   RESPONSIVE — header / nav / detalle en pantallas chicas
   ============================================================ */
/* ============================================================
   NAVEGACIÓN: BARRA LATERAL (Opción B). El header de arriba queda con SOLO
   logo + cluster derecho; la navegación pasa a una columna vertical agrupada.
   Tokens → anda en los 3 temas. En mobile la barra se vuelve un cajón (☰).
   ============================================================ */
.nx-shell{display:flex;align-items:flex-start}
.nx-content{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;min-height:calc(100vh - 66px)}
.nx-content > #view{flex:1 1 auto}
/* B-25: FABs (Reportar + Asistente) float fixed bottom-right on ALL viewports;
   give #view bottom padding so the last card is never covered. */
body.authed #view{padding-bottom:92px}
.nx-side{flex:0 0 220px;width:220px;position:sticky;top:66px;height:calc(100vh - 66px);overflow-y:auto;
  background:var(--chrome-bg,var(--panel));border-right:1px solid var(--line);padding:4px 0 0;
  display:flex;flex-direction:column}
.nx-snav{display:block;flex:1 1 auto;padding-bottom:24px}
.nx-snav-sec{display:block}
/* "Operaciones" duplica los botones del header → se muestra SOLO donde el header los oculta (<620px, ver la
   regla .nx-header-actions{display:none} de grm-meridian.css §UX-23). Si esa regla cambia, cambiar este breakpoint. */
@media (min-width:621px){ .nx-snav-ops{display:none} }
.nx-snav-grp{font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);padding:18px 22px 7px}
/* Ítem del menú: ÍCONO + texto (rediseño 2026-07-17). El ícono da un ancla visual para escanear 13 ítems sin
   leerlos uno por uno; `align-items:flex-start` porque las etiquetas largas wrapean a 2 líneas y el ícono debe
   quedar arriba, no centrado contra el bloque.
   TAMAÑO 9.5px = EL MISMO que el encabezado de grupo (.nx-snav-grp) — pedido del dueño 2026-07-17: los ítems
   estaban en 11.5px y se veían más grandes que su propio encabezado (y wrapeaban a 2 líneas). Si cambiás uno,
   cambiá el otro: la gracia es que sean iguales. La jerarquía la dan el COLOR (oro vs gris) y el PESO
   (600 vs 400), no el tamaño. El área de click no se toca: la da el padding, no la tipografía. */
.nx-snav-item{display:flex;align-items:flex-start;gap:11px;padding:10px 22px;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--grey-warm);line-height:1.35;text-decoration:none;border-left:3px solid transparent;cursor:pointer}
.nx-snav-item .snav-ico{flex:0 0 auto;display:inline-flex;opacity:.72;margin-top:-1px}
.nx-snav-item .snav-txt{min-width:0}
.nx-snav-item:hover{color:var(--ink);background:var(--card)}
.nx-snav-item:hover .snav-ico{opacity:1}
.nx-snav-item.active{color:var(--ink);background:var(--card);border-left-color:var(--gold)}
.nx-snav-item.active .snav-ico{opacity:1;color:var(--gold)}
.nx-snav-home{margin-top:8px}

/* --- Grupos PLEGABLES. El encabezado es un <button> (teclado + aria-expanded); el chevron rota al abrir. --- */
/* OJO con el reset del <button>: este elemento lleva ADEMÁS .nx-snav-grp (oro, 9.5px, peso 600) y ambas reglas
   tienen la MISMA especificidad → gana la de abajo, o sea ESTA. Por eso acá NO va `font:inherit` ni
   `color:inherit`:
     · `font` es un ATAJO → reseteaba también font-size y font-weight → los encabezados quedaban en 13px/300.
     · `color:inherit` los dejaba en crema (heredaban del sidebar) en vez del oro.
   Solo se hereda la FAMILIA (el UA le mete system-ui a los botones y .nx-snav-grp no fija family). El resto
   —tamaño, peso, tracking, color, padding— lo pone .nx-snav-grp y le gana al default del navegador. */
.nx-snav-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  background:none;border:0;cursor:pointer;text-align:left;font-family:inherit}
.nx-snav-toggle .snav-chev{flex:0 0 auto;opacity:.55;transition:transform .18s ease}
.nx-snav-toggle:hover{color:var(--gold)}
.nx-snav-toggle:hover .snav-chev{opacity:1}
.nx-snav-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:var(--r-sm,10px)}
.nx-snav-sec.closed .snav-chev{transform:rotate(-90deg)}
.nx-snav-sec.closed .nx-snav-items{display:none}
/* Sub-ítem indentado (ej. "Perfiles de Inversión" dentro de "Compliance") */
.nx-snav-sub{position:relative;padding-left:42px;font-size:11px}
.nx-snav-sub::before{content:"\203A";position:absolute;left:26px;color:var(--gold-deep)}
.nx-side-toggle{display:none;background:none;border:1px solid transparent;color:var(--grey-warm);font-size:19px;line-height:1;
  cursor:pointer;width:36px;height:36px;border-radius:var(--r);align-items:center;justify-content:center}
.nx-side-toggle:hover{color:var(--ink);border-color:var(--line)}
.nx-side-scrim{display:none}
@media (max-width:980px){
  .nx-side-toggle{display:inline-flex}
  .nx-side{position:fixed;top:66px;left:0;bottom:0;height:auto;width:236px;z-index:80;
    transform:translateX(-100%);transition:transform .24s ease;box-shadow:10px 0 40px rgba(0,0,0,.45)}
  body.side-open .nx-side{transform:translateX(0)}
  body.side-open .nx-side-scrim{display:block;position:fixed;inset:66px 0 0 0;background:rgba(0,0,0,.45);z-index:79}
}
@media print{.nx-side,.nx-side-toggle,.nx-side-scrim{display:none!important}}
/* Header en mobile: una sola fila (ya no tiene nav); chip de usuario compacto. */
@media (max-width:760px){
  .nx-header{padding-left:18px;padding-right:18px}
  .nx-header-left{gap:14px}
  .user-chip{padding:4px 7px 4px 11px;font-size:12px;gap:7px}
  .grm-word{font-size:21px}
}

/* summary-strip del detalle: en mobile usamos gap en vez de bordes laterales
   (los border-right quedaban raros al wrapear) */
@media (max-width:760px){
  .summary-strip{gap:6px 4px;padding-left:var(--pad);padding-right:var(--pad)}
  .summary-strip .as-of{flex-basis:100%;margin-right:0;margin-bottom:2px}
  .metric{border-right:none;padding:4px 14px 4px 0}
}

/* ============================================================
   Aurora · componentes nuevos
   ============================================================ */

/* ---------- Paleta de búsqueda global (Cmd-K) ---------- */
.gsearch{
  position:fixed;inset:0;z-index:400;            /* encima de header (50) y toast (300) */
  background:rgba(43,38,34,.42);
  display:flex;justify-content:center;align-items:flex-start;
  padding:12vh 20px 20px;
  /* Sin animación: se abre con ⌘K / "/" cientos de veces al día y cualquier frame es latencia percibida. */
}
.gsearch-panel{
  width:100%;max-width:520px;
  background:var(--panel);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border:1px solid var(--stroke);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);
  overflow:hidden;

}
.gsearch-head{display:flex;align-items:center;gap:12px;padding:6px 18px 0}
.gsearch-head .gs-icon{color:var(--grey-warm);font-size:18px;flex:none}
.gsearch-input{
  flex:1;width:100%;border:none;outline:none;background:transparent;
  font-family:var(--sans);font-weight:300;font-size:20px;color:var(--ink);
  padding:16px 0;line-height:1.3;
}
.gsearch-input::placeholder{color:var(--grey-warm);opacity:.85}
.gsearch-results{
  list-style:none;margin:0;padding:6px;
  max-height:min(52vh,440px);overflow-y:auto;
  border-top:1px solid var(--line);
}
.gsearch-results:empty{display:none}
.gsearch-result{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:12px 14px;border-radius:var(--r);cursor:pointer;
  border:1px solid transparent;
  transition:background .12s ease,border-color .12s ease;
}
.gsearch-result:hover,
.gsearch-result:focus,
.gsearch-result.active,
.gsearch-result[aria-selected="true"]{
  background:var(--card);border-color:var(--gold);outline:none;
}
.gsearch-result .gs-name{font-size:15px;color:var(--ink);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gsearch-result .gs-meta{font-size:12px;color:var(--grey-warm);
  letter-spacing:.04em;flex:none;text-align:right;white-space:nowrap}
.gsearch-val{font-variant-numeric:tabular-nums;color:var(--gold-text,var(--gold));
  font-weight:600;letter-spacing:.02em;margin-left:6px;white-space:nowrap}
.tn-result .gsearch-val{margin-left:8px}
.gsearch-empty{padding:18px 16px;color:var(--grey-warm);font-size:13.5px}
.gsearch-hint{
  display:flex;justify-content:space-between;gap:10px;
  padding:10px 16px;border-top:1px solid var(--line);
  color:var(--grey-warm);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
}

@keyframes gsearchBg{from{opacity:0}to{opacity:1}}
@keyframes gsearchIn{from{opacity:0;transform:translateY(-10px) scale(.985)}to{opacity:1;transform:none}}

@media (max-width:560px){
  .gsearch{padding:8vh 12px 16px}
  .gsearch-panel{max-width:none}
  .gsearch-input{font-size:18px;padding:14px 0}
}

/* ---------- Botón "Mostrar más" (paginación de tablas) ---------- */
.more-btn{
  display:block;margin:18px auto 4px;
  padding:10px 26px;
  background:transparent;border:1px solid var(--line);border-radius:var(--r-pill);
  color:var(--grey-warm);
  font-family:var(--sans);font-size:11.5px;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;
  transition:color .15s ease,border-color .15s ease,background .15s ease;
}
.more-btn:hover{color:var(--ink);border-color:var(--gold);background:var(--card)}
.more-btn:focus-visible{outline:none;border-color:var(--gold-deep);color:var(--ink)}
.more-btn:disabled{opacity:.5;cursor:default;color:var(--grey-warm);
  border-color:var(--line);background:transparent}

@media (prefers-reduced-motion:reduce){
  .gsearch,.gsearch-panel{animation:none!important}
  .more-btn{transition:none!important}
}

/* ============================================================
   RENDIMIENTO — TWR / MWR / NNA / Benchmark (Aurora)
   tarjetas consistentes con .kpi/.kpis · sin rojo/verde (negativos
   entre paréntesis; el color no codifica signo)
   ============================================================ */
.perf-panel{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:32px;
}
.perf-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;display:flex;flex-direction:column;gap:6px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.perf-card:hover{border-color:var(--stroke);box-shadow:var(--shadow)}
.perf-card .perf-label{
  color:var(--grey-warm);font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.16em;
}
.perf-card .perf-value{
  font-size:30px;font-weight:500;margin-top:6px;
  font-variant-numeric:tabular-nums;color:var(--ink);line-height:1.1;
}
.perf-card .perf-sub{color:var(--grey-warm);font-size:12px}
/* nota dorada opcional (p. ej. período / "vs índice") */
.perf-card .perf-tag{
  align-self:flex-start;font-size:9.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-deep);
  border:1px solid var(--gold-deep);border-radius:var(--r-pill);padding:2px 9px;
}

/* comparación contra benchmark: nombre del índice · retorno · alpha */
.bench-row{
  display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:baseline;
  padding:13px 0;border-bottom:1px solid var(--line);
}
.bench-row:last-child{border-bottom:none}
.bench-row .bench-name{
  color:var(--ink);font-size:13.5px;display:flex;align-items:baseline;gap:8px;min-width:0;
}
.bench-row .bench-name .bench-dot{
  flex:none;width:7px;height:7px;background:var(--gold);transform:rotate(45deg);
}
.bench-row .bench-name .bench-meta{color:var(--grey-warm);font-size:11.5px}
.bench-row .bench-return{
  font-variant-numeric:tabular-nums;font-size:14px;color:var(--ink);text-align:right;
}
.bench-row .bench-alpha{
  font-variant-numeric:tabular-nums;font-size:14px;font-weight:500;
  color:var(--gold-deep);text-align:right;min-width:84px;
}
/* fila de cabecera de la tabla de benchmark (opcional) */
.bench-row.bench-head{padding-top:0;border-bottom:1px solid var(--line)}
.bench-row.bench-head span{
  color:var(--grey-warm);font-size:10px;font-weight:600;
  text-transform:uppercase;letter-spacing:.12em;
}
.bench-row.bench-head .bench-return,
.bench-row.bench-head .bench-alpha{text-align:right}

@media (max-width:860px){.perf-panel{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){
  .perf-panel{grid-template-columns:1fr}
  .bench-row{grid-template-columns:1fr auto;row-gap:4px}
  .bench-row .bench-alpha{grid-column:2;min-width:0}
}
@media (prefers-reduced-motion:reduce){
  .perf-card{transition:none!important}
  .perf-card:hover{box-shadow:none!important}
}
@media print{
  .perf-card{background:#fff!important;backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;box-shadow:none!important;
    border:1px solid var(--line)!important;border-radius:var(--r)!important}
}

/* ============================================================
   Panel "Actualizar datos" (admin) — Aurora
   Tarjeta de actualización, barra de progreso y clave copiable.
   ============================================================ */
.refresh-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:clamp(20px,3vw,28px);
  -webkit-backdrop-filter:var(--blur);
  backdrop-filter:var(--blur);
  box-shadow:var(--shadow);
}

/* Barra de progreso contenedora */
.progress{
  height:10px;
  width:100%;
  margin-top:16px;
  background:var(--line);
  border-radius:var(--r-pill);
  overflow:hidden;
}

/* Relleno de la barra */
.progress-fill{
  height:100%;
  width:0;
  background:var(--gold);
  border-radius:var(--r-pill);
  transition:width .4s ease;
}

/* Texto chico bajo la barra */
.progress-label{
  margin-top:6px;
  color:var(--grey-warm);
  font-size:12px;
  letter-spacing:.02em;
}

/* Clave copiable (token) */
.refresh-key{
  display:inline-block;
  font-family:var(--sans);
  font-variant-numeric:tabular-nums;
  font-size:13px;
  color:var(--ink);
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:4px 8px;
  letter-spacing:.04em;
  user-select:all;
  -webkit-user-select:all;
}

@media (prefers-reduced-motion:reduce){
  .progress-fill{transition:none}
}

/* ============================================================
   LUXE — capa premium "private banking de lujo"
   Fondo vivo (objetos en movimiento) · grano · vidrio realzado ·
   oro con destello · micro-interacciones. Sobria, no recargada.
   ============================================================ */

/* ---- 0. Base sólida en <html> para que nunca se vea el canvas al scrollear ---- */
html{background:#ECEBE3}

/* ---- 1. Fondo vivo: blobs de aurora a la deriva + aros que flotan ---- */
.lux-bg{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
/* will-change salió (2026-09-20): reservaba capa y memoria de GPU toda la jornada, animándose o no. El
   blur baja de 64px a 40px: re-rasterizar un desenfoque de 48vw en cada frame de escala es carísimo. */
.lux-bg i{position:absolute;display:block;border-radius:50%;filter:blur(40px)}
.lux-bg .b1{width:48vw;height:48vw;left:-10vw;top:-12vw;
  background:radial-gradient(circle at 32% 32%, rgba(176,142,92,.42), transparent 68%);
  animation:luxDrift1 36s ease-in-out infinite}
.lux-bg .b2{width:42vw;height:42vw;right:-8vw;top:4vh;
  background:radial-gradient(circle at 60% 40%, rgba(120,150,148,.30), transparent 68%);
  animation:luxDrift2 46s ease-in-out infinite}
.lux-bg .b3{width:52vw;height:52vw;left:24vw;bottom:-22vw;
  background:radial-gradient(circle at 50% 50%, rgba(150,150,178,.26), transparent 68%);
  animation:luxDrift3 54s ease-in-out infinite}
.lux-bg .ring{position:absolute;border:1px solid rgba(156,124,79,.13);border-radius:50%;}
.lux-bg .r1{width:30vw;height:30vw;right:10vw;top:16vh;animation:luxFloat 32s ease-in-out infinite}
.lux-bg .r2{width:16vw;height:16vw;left:11vw;bottom:14vh;animation:luxFloat 27s ease-in-out infinite reverse}
@keyframes luxDrift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,4vh) scale(1.14)}}
@keyframes luxDrift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-5vw,6vh) scale(1.08)}}
@keyframes luxDrift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(5vw,-5vh) scale(1.1)}}
@keyframes luxFloat{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(0,-3vh) rotate(8deg)}}

/* ---- 2. Resplandor dorado que sigue el cursor (JS setea transform) ---- */
.lux-cursor{position:fixed;left:0;top:0;width:300px;height:300px;z-index:-1;pointer-events:none;
  background:radial-gradient(circle, rgba(176,142,92,.16), rgba(176,142,92,.05) 40%, transparent 62%)}

/* ---- 3. Grano fino: textura de material (atrás del contenido) ---- */
.lux-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E")}

/* ---- 4. Vidrio realzado: brillo interno + borde más cálido ---- */
.kpi,.table-card,.info-section,.bal-card,.group-card,.empty-state,.perf-card,.refresh-card{
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.65);
  border-color:rgba(156,124,79,.18);
}
.kpi:hover,.perf-card:hover{border-color:rgba(156,124,79,.55)}

/* ---- 5. (L1) El "sheen" dorado animado de las cifras quedó ANULADO por el tema Meridian
   (grm-meridian.css: las cifras hero van en tinta plana, ahora en Plex con tabular-nums). Se retiró
   el gradiente + keyframe muertos para no arrastrar código que la cascada tapa. ---- */

/* ---- 6. Botón primario: oro pleno con barrido de luz ---- */
.btn-primary{
  background:linear-gradient(135deg,var(--gold) 0%,var(--gold-deep) 100%);
  border-color:var(--gold-deep);color:#FBF8F3;
  box-shadow:0 8px 20px -10px rgba(126,98,56,.65);
  position:relative;overflow:hidden;
}
.btn-primary:hover{box-shadow:0 12px 28px -10px rgba(126,98,56,.78)}
.btn-primary:disabled,.btn-primary[disabled]{opacity:.55;box-shadow:none;cursor:default}
.btn-primary::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);pointer-events:none}
.btn-primary:hover::after{animation:luxShine .85s ease}
@keyframes luxShine{to{left:135%}}

/* ---- 7. Nav: subrayado dorado que crece ---- */
.nx-nav-item{position:relative}
.nx-nav-item::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:center;transition:transform .32s var(--ease-out)}
.nx-nav-item:hover::after,.nx-nav-item.active::after{transform:scaleX(1)}

/* ---- 8. Monograma tipográfico en oro (legacy: el header y el login usan el LOGO .brand-logo; estas reglas quedan por si algún doc usa .grm-word) ---- */
.grm-word{
  background:linear-gradient(120deg,var(--gold-deep),#C9A86A 50%,var(--gold-deep));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}

/* ---- 9. Login: primera impresión premium ---- */
.login-card{
  background:rgba(252,250,246,.78);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border:1px solid var(--stroke);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.7);
}
.login-brand .grm-word{
  filter:drop-shadow(0 0 14px rgba(176,142,92,.32));
  animation:luxGlow 4.5s ease-in-out infinite;
}
@keyframes luxGlow{0%,100%{filter:drop-shadow(0 0 9px rgba(176,142,92,.22))}50%{filter:drop-shadow(0 0 22px rgba(176,142,92,.5))}}
.login-btn{letter-spacing:.06em}

/* ---- 10. Línea dorada de secciones: degradé ---- */
.gold-line::before,.panel h2::before,.list-title h1::before,.sec-title::before,.modal-h::before{
  background:linear-gradient(90deg,var(--gold-deep),var(--gold) 60%,transparent)!important;
}

/* ---- 11. Respeto a reduced-motion: todo queda quieto y legible ---- */
@media (prefers-reduced-motion:reduce){
  .lux-bg i,.lux-bg .ring{animation:none!important}
  .kpi .k-value,.bal-card .bv{animation:none!important}
  .login-brand .grm-word{animation:none!important}
  .btn-primary:hover::after{animation:none!important}
}

/* ---- Dashboard / Inicio (cockpit estilo Advyzon) ---- */
.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:6px}
.dash-grid .dash-w{min-height:120px}
.dash-grid .dash-w .sec-title{margin-top:0}
.dash-grid .mini-tbl{width:100%}
@media (max-width:880px){ .dash-grid{grid-template-columns:1fr} }
.dash-grid .dash-wide{grid-column:1 / -1}
.dash-whead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dash-chart{width:100%;height:170px;display:block}
.dash-legend{display:flex;gap:16px;margin-top:10px;font-size:11px;color:var(--grey-warm)}
.dash-legend .lg{display:inline-flex;align-items:center;gap:6px}
.dash-legend .lg::before{content:"";width:14px;display:inline-block}
.dash-legend .lg-aum::before{height:3px;border-radius:var(--r);background:var(--gold-deep)}
.dash-legend .lg-net::before{height:0;border-top:2px dashed var(--grey-warm)}
/* widgets: tablas que SIEMPRE entran en la tarjeta (no rompen el ancho en mobile) */
.dash-grid .mini-tbl{table-layout:fixed}
.dash-grid .mini-tbl td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:600px){ .kpis{grid-template-columns:1fr} }
.kpis-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){ .kpis-3{grid-template-columns:1fr} }
/* Asignación: filas clicleables → drill a clientes con esa clase */
.alloc-click{cursor:pointer;border-radius:var(--r);transition:background .15s ease;padding:2px 6px;margin:0 -6px}
.alloc-click:hover{background:rgba(156,124,79,.10)}
.alloc-click.nolink{cursor:default}
.alloc-click.nolink:hover{background:transparent}
/* Composición → "Clientes con <clase>": fila expandible con el detalle por título (nominales + precio prom.) */
.ac-tgl-h,.ac-tgl-c{width:34px;text-align:center;padding-left:8px!important;padding-right:0!important}
.ac-toggle{background:none;border:0;color:var(--grey-warm);cursor:pointer;font-size:12px;line-height:1;padding:4px 6px;transition:transform .15s ease}
.ac-toggle:hover{color:var(--ink)}
.ac-toggle.open{transform:rotate(90deg)}
.ac-detail>td{padding:0 0 0 34px!important;background:rgba(127,127,127,.05)}
.ac-detail>td:first-child{padding:0!important}
.ac-sub{margin:4px 0 10px}
.ac-sub th,.ac-sub td{font-size:12.5px;padding-top:6px;padding-bottom:6px}
.ac-sub thead th{color:var(--grey-warm);font-weight:500}
/* TOTP: clave de configuración del autenticador (enrolamiento) */
.totp-key{font-family:var(--sans);font-size:19px;letter-spacing:.16em;font-weight:500;color:var(--gold-deep);background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:8px 0 4px;text-align:center;user-select:all;-webkit-user-select:all;word-break:break-all}
.ge-2fa-reset{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--grey-warm);margin-top:8px;cursor:pointer}
.totp-qr{display:flex;justify-content:center;margin:6px 0 10px;min-height:40px}
.totp-qr svg{width:184px;height:184px;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:6px}
.totp-ol{text-align:left;margin:4px auto 10px;padding-left:20px;max-width:340px;font-family:var(--sans);font-size:13.5px;line-height:1.5;color:#5a5246}
.totp-ol li{margin:5px 0}
.u-totp-box{margin-top:10px}
.u-totp-guide{border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.5);padding:12px 14px;font-family:var(--sans);font-size:13px;color:#5a5246}
.u-totp-guide .totp-ol{max-width:none;margin:8px 0 10px}
.u-totp-guide .totp-qr{margin:8px 0}
.u-totp-guide .totp-qr svg{width:152px;height:152px}
.u-totp-guide .totp-key{font-size:14px;margin:4px 0}
/* Refresh: progreso POR CUSTODIO (Pershing/StoneX bajan en paralelo) */
.refresh-detail{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 4px}
@media(max-width:680px){.refresh-detail{grid-template-columns:1fr}}
.rc-cust{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;background:var(--card)}
.rc-cust.rc-err{border-color:#c89a5a;background:rgba(200,150,90,.07)}
.rc-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}
.rc-name{font-family:var(--serif,var(--sans));font-weight:600;font-size:15px;color:#2b2620}
.rc-pct{font-variant-numeric:tabular-nums;font-size:13px;color:var(--gold-deep)}
.rc-bar{height:7px;border-radius:var(--r);background:rgba(0,0,0,.07);overflow:hidden}
.rc-fill{height:100%;background:linear-gradient(90deg,var(--gold,#9c7c4f),var(--gold-deep,#7a5f37));border-radius:var(--r);transition:width .4s ease}
.rc-phase{font-size:12.5px;color:#5a5246;margin-top:6px}
.rc-detail{font-size:11.5px;color:var(--grey-warm,#8a8073);margin-top:2px}
/* Opciones de refresh / borrado (custodios + ventana) */
.refresh-opts{margin:14px 0 16px;display:flex;flex-direction:column;gap:10px}
.ro-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px}
.ro-lbl{font-size:12px;font-weight:600;color:var(--grey-warm);min-width:120px;letter-spacing:.02em}
.ro-chk{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;color:#3a352d;cursor:pointer}
.ro-chk input{cursor:pointer;accent-color:var(--gold-deep,#7a5f37)}
/* Tax Report */
.tax-notes{margin:6px 0 0;padding-left:18px;color:var(--grey-warm);font-size:12.5px}
.tax-notes li{margin:5px 0}

/* ---- Filtro de tipos de transacción (chips) ---- */
/* Filtro de tipos de transacción: desplegable multi-select (mejor que muchos chips) */
.txdd{position:relative;display:inline-block;margin:0 0 16px}
.txdd-btn{font-family:var(--sans);font-size:12.5px;display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:var(--r);border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;transition:border-color .2s ease}
.txdd-btn:hover{border-color:var(--gold-deep)}
.txdd-btn strong{color:var(--gold-deep);font-variant-numeric:tabular-nums}
.txdd-caret{color:var(--grey-warm);font-size:10px}
.txdd-menu{position:absolute;z-index:30;top:calc(100% + 4px);left:0;min-width:280px;max-width:380px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 10px 30px rgba(0,0,0,.14);overflow:hidden}
.txdd-menu[hidden]{display:none}
.txdd-actions{display:flex;gap:8px;padding:9px 11px;border-bottom:1px solid var(--line);background:rgba(0,0,0,.02)}
.txdd-all{font-family:var(--sans);font-size:11.5px;padding:5px 12px;border-radius:var(--r-pill);border:1px dashed var(--line);background:transparent;color:var(--grey-warm);cursor:pointer}
.txdd-all:hover{border-color:var(--gold-deep);color:var(--ink)}
.txdd-list{max-height:300px;overflow-y:auto;padding:5px}
.txdd-item{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:var(--r);cursor:pointer;font-size:13px;color:var(--ink)}
.txdd-item:hover{background:rgba(156,124,79,.08)}
.txdd-item input{cursor:pointer;accent-color:var(--gold-deep,#7a5f37);flex:0 0 auto}
.txdd-item .txdd-t{flex:1;line-height:1.25}
.txdd-item .txdd-n{font-variant-numeric:tabular-nums;color:var(--grey-warm);font-size:11.5px}
/* KPIs: soportar 4/5/6 columnas (cuentas totales + activas + AUM + custodios) */
.kpis-4{grid-template-columns:repeat(4,1fr)}
.kpis-5{grid-template-columns:repeat(5,1fr)}
.kpis-6{grid-template-columns:repeat(6,1fr)}
@media(max-width:1100px){.kpis-5,.kpis-6{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.kpis-4,.kpis-5,.kpis-6{grid-template-columns:repeat(2,1fr)}}
/* Filtro de valor por monto libre */
.val-range{display:inline-flex;align-items:center;gap:6px}
/* Buscador por ACTIVO: en los Filtros ▾ de Clientes va acotado (no se come toda la fila); en la barra del Análisis
   (.an-toolbar) usa el ancho normal de .search-box. */
.adv-filters .asset-box{flex:0 1 260px}
.an-toolbar{margin-top:2px}
.val-in{width:128px;padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);font-size:12.5px;font-family:var(--sans);color:var(--ink)}
.val-in:focus{outline:none;border-color:var(--gold-deep)}
.vr-sep{color:var(--grey-warm)}
/* Perfiles de riesgo (tonos sobrios, sin rojo/verde de semáforo) */
.rp-badge{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.04em;padding:3px 10px;border-radius:var(--r-pill);border:1px solid var(--line);white-space:nowrap}
.rp-badge.upd{color:var(--gold-deep);border-color:var(--gold-deep);background:rgba(156,124,79,.12)}
.rp-badge.ok{color:var(--grey-warm)}
.rp-badge.na{color:var(--grey-warm);opacity:.55}
.rp-badge.none{color:var(--grey-warm);border-style:dashed}
.tag-new{display:inline-block;font-size:9.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:2px 8px;margin-left:6px;color:#15110C;background:linear-gradient(180deg,var(--gold),var(--gold-deep));vertical-align:middle}

/* ===== Estado de cuenta: documento SOBRIO en papel blanco (réplica tipo banco), aun en tema oscuro ===== */
.stmt-doc{background:#fff;color:#23201C;max-width:880px;margin:0 auto;padding:34px 40px 30px;border-radius:var(--r);font-family:var(--sans);box-shadow:0 24px 60px -30px rgba(0,0,0,.6)}
.stmt-doc *{color:inherit}
.st-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid #23201C;padding-bottom:12px;margin-bottom:14px}
.st-firm{font-family:var(--serif);font-size:24px;letter-spacing:.12em;color:#7E6238}
.st-firm-sub{font-size:11px;color:#6E6657;letter-spacing:.04em;margin-top:2px}
/* Logo de MARCA en documentos impresos (papel blanco). Asset dedicado en versión oscura (iEB carbón + Internacional
   dorado) → NO lleva filtro (a diferencia de .brand-logo). Reemplaza al wordmark de texto en las cabeceras. */
.doc-logo{height:46px;width:auto;display:block;margin:0 0 4px}
.wire-head .doc-logo{height:40px}
.report-logo .doc-logo{height:42px}
@media print{.doc-logo{height:44px}}
.st-title{text-align:right}
.st-t1{font-family:var(--serif);font-size:19px}
.st-t2{font-size:12px;color:#6E6657;margin-top:3px;text-transform:uppercase;letter-spacing:.1em}
.st-acctbox{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px 22px;background:#F6F3EC;border:1px solid #E2DBCC;border-radius:var(--r);padding:12px 16px;margin-bottom:20px}
.st-warn{background:#FBF3DC;border:1px solid #E5C97A;color:#6B4E12;border-radius:var(--r);padding:10px 14px;margin:-8px 0 18px;font-size:12px;font-weight:600}
/* Donut de asignación dentro de los REPORTES (estado de cuenta / consolidado / report builder) — papel blanco */
.rb-alloc-charts{margin:2px 0 14px}
.rb-donut{margin:2px 0 8px}
.rb-donut-t{font-size:12px;font-weight:600;color:#5a5246;margin-bottom:6px}
.rb-donut-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.rb-donut-svg{flex:0 0 auto}
.rb-donut-leg{flex:1 1 260px;min-width:220px;display:flex;flex-direction:column;gap:5px}
.rb-lg{display:grid;grid-template-columns:14px 1fr auto auto;align-items:center;gap:8px;font-size:12px}
.rb-sw{width:10px;height:10px;transform:rotate(45deg);display:inline-block;border-radius:2px}
.rb-lk{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb-lv{font-variant-numeric:tabular-nums;font-weight:600}
.rb-lp{color:#6E6657;font-variant-numeric:tabular-nums;min-width:46px;text-align:right}
.rb-donut-grid-h{font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:#6E6657;margin:10px 0 8px;border-top:1px solid #E2DBCC;padding-top:8px}
.rb-donut-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}
.rb-donut.compact .rb-donut-row{gap:12px}
.rb-donut.compact .rb-lg{font-size:11px}
@media print{.rb-donut-grid{grid-template-columns:1fr 1fr}.rb-donut-svg,.rb-sw{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
.st-kv{display:flex;flex-direction:column;font-size:12px}
.st-kv .k{color:#6E6657;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em}
.st-kv .v{margin-top:1px}
.st-sec{margin:18px 0}
.st-sec-h{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:#7E6238;border-bottom:1px solid #C9Bfa9;padding-bottom:5px;margin-bottom:8px}
.stmt-doc .st-tbl{width:100%;border-collapse:collapse;font-size:12px;background:transparent}
.stmt-doc .st-tbl thead th{background:#F2EEE5;color:#5a5246;text-transform:none;letter-spacing:0;font-size:11px;font-weight:600;padding:6px 10px;border-bottom:1px solid #C9BFA9;text-align:left}
.stmt-doc .st-tbl thead th.num,.stmt-doc .st-tbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.stmt-doc .st-tbl td{padding:5px 10px;border-bottom:1px solid #EDE7DA;vertical-align:top}
.stmt-doc .st-tbl tbody tr:hover{background:transparent}
.st-sub{font-size:10.5px;color:#6E6657;margin-top:1px}
.st-note{font-size:11px;color:#6E6657;margin:6px 0 0}
.st-disc{font-size:10.5px;color:#6E6657;line-height:1.5;border-top:1px solid #E2DBCC;margin-top:18px;padding-top:10px}
.st-disc div{margin:2px 0}
/* Pie regulatorio de la firma, repetido al PIE DE CADA PÁGINA IMPRESA (M2). En pantalla oculto. */
.st-print-foot{display:none}
@media print{
  .stmt-doc{box-shadow:none;max-width:100%;padding:0;border-radius:0}
  .acct-bar,.nx-header,.nx-footer{display:none!important}
  /* Márgenes con espacio para el pie + numeración de página (M2). */
  @page{margin:16mm 16mm 20mm;
    @bottom-right{content:"Página " counter(page) " de " counter(pages);font-family:"IBM Plex Sans",sans-serif;font-size:9px;color:#6E6657}}
  /* Pie de firma FIJO → se repite en cada página impresa (lo que busca un ojo de compliance). */
  .st-print-foot{display:block;position:fixed;bottom:0;left:0;right:0;text-align:center;
    font-family:"IBM Plex Sans",sans-serif;font-size:9px;color:#6E6657;padding-top:4px;border-top:1px solid #E2DBCC}
}
@media (max-width:680px){.st-acctbox{grid-template-columns:1fr 1fr}.stmt-doc{padding:20px}}
/* Énfasis en las cuentas en peligro (perfil declarado MENOR que el real) */
tr.rp-danger td:first-child{box-shadow:inset 3px 0 0 var(--gold-deep)}
tr.rp-danger{background:rgba(156,124,79,.06)}
.rp-lvl{font-family:var(--sans);font-size:12.5px;font-weight:500}
.rp-conservador{color:var(--ok,#5a6b5a)}
.rp-moderado{color:var(--gold-text,var(--gold-deep))}
.rp-agresivo{color:var(--warn,#9a5a3a)}
.rp-mix{font-size:11px;color:var(--grey-warm);font-variant-numeric:tabular-nums}
.rp-src{font-size:10px;color:var(--grey-warm);margin-top:3px;letter-spacing:.04em}
.rp-set{font-family:var(--sans);font-size:12.5px;padding:4px 8px;border:1px dashed var(--line);border-radius:var(--r);background:transparent;color:inherit;cursor:pointer;max-width:150px}
.rp-set:hover{border-color:var(--gold-deep)}
.rp-why{max-width:460px;font-size:12px;line-height:1.45}
.rp-na{color:var(--grey-warm)}
/* Perfil de inversión (fondos abiertos): barra acciones / renta fija / efectivo. Sin rojo/verde (convención). */
.lt-bar{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--line);margin:6px 0}
.lt-seg{display:block;height:100%}
.lt-eq{background:var(--gold-deep)}
.lt-bd{background:var(--grey-warm);opacity:.75}
.lt-ca{background:var(--stroke)}
.lt-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:6px}
.lt-lbl{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-warm)}
.lt-lvl{font-size:22px;margin:2px 0 4px}
.lt-lvl .rp-lvl{font-size:22px;font-family:var(--serif,inherit)}
.lt-nums{display:flex;gap:22px;font-variant-numeric:tabular-nums}
.lt-nums div{display:flex;flex-direction:column;align-items:flex-end}
.lt-nums b{font-size:18px;font-weight:500}
.lt-nums span{font-size:11px;color:var(--grey-warm)}
.lt-rule{font-size:12px;margin-top:6px}
.gap-sum{font-size:12.5px;margin:10px 0 8px}
.gap-more{font-size:12px;margin-top:6px}
.fm-conf{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase}
.fm-conf.baja{color:var(--warn,#9a5a3a)}

/* ============================================================
   REPORT BUILDER — armador de reportes configurable (#/reports)
   Formulario Aurora (alcance / secciones / período) + reporte
   imprimible reusando .report / .info-section / .kpis.
   ============================================================ */
.rb-form{margin-bottom:22px}
.rb-grid{display:grid;grid-template-columns:1.1fr 1fr .9fr;gap:24px;align-items:start}
.rb-field .ge-label{margin-bottom:10px}
.rb-radios,.rb-checks{display:flex;flex-direction:column;gap:10px}
.rb-radio,.rb-check{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink);cursor:pointer}
.rb-radio input,.rb-check input{width:16px;height:16px;accent-color:var(--gold-deep);cursor:pointer;flex:none}
.rb-scope-detail{margin-top:14px}
.rb-scope-detail .ge-search{width:100%}
.rb-scope-detail .muted{font-size:13px}
.rb-actions{margin-top:18px}
.rb-actions .btn-primary{width:100%;justify-content:center}
.rb-toolbar{margin-top:8px}
@media (max-width:980px){.rb-grid{grid-template-columns:1fr;gap:20px}}

/* En impresión, el armador y su barra desaparecen (ya marcados .no-print);
   reforzamos para que SOLO el reporte generado salga en el PDF. */
@media print{
  .rb-form,.rb-toolbar{display:none!important}
  .rb-report{max-width:100%;margin:0;padding:0}
  .list-wrap{padding:0!important}
}

/* ---- 12. Impresión / PDF: sin capas vivas ---- */
@media print{
  .lux-bg,.lux-grain,.lux-cursor{display:none!important}
  .grm-word,.kpi .k-value,.bal-card .bv{
    -webkit-text-fill-color:var(--ink)!important;color:var(--ink)!important;
    background:none!important;animation:none!important;
  }
  .btn-primary{background:#fff!important;color:var(--gold-deep)!important;box-shadow:none!important}
}

/* ============================================================
   ONYX — ajustes de tema OSCURO (arregla lo hardcodeado en claro).
   Va último: anula valores claros sin reescribir el resto.
   ============================================================ */
html{background:#15110C}
/* body TRANSPARENTE: el html oscuro es la base y las capas vivas (aurora + glow del cursor, z-index
   -2/-1) se ven a través del body, detrás del contenido. Si el body fuera opaco las taparía. */
body{background:transparent}
/* chrome (header/footer/barra de cuenta/modal) estaba en blanco translúcido → vidrio oscuro */
.nx-header,.acct-bar{background:rgba(20,16,11,.74)!important}
.nx-footer{background:rgba(20,16,11,.66)!important}
.modal{background:rgba(26,21,14,.95)!important;border-color:var(--stroke)!important}
.nx-nav-item[data-noop]{color:#6a6354!important}
/* fondo aurora más presente sobre oscuro; grano en modo overlay; glow del cursor más visible */
.lux-bg i{opacity:1}
.lux-grain{mix-blend-mode:overlay;opacity:.06}
.lux-cursor{background:radial-gradient(circle, rgba(232,201,138,.2), rgba(232,201,138,.07) 40%, transparent 62%)}
/* vidrio oscuro: el realce interno blanco fuerte se vuelve un hilo de luz sutil */
.kpi,.table-card,.info-section,.bal-card,.group-card,.empty-state,.perf-card,.refresh-card{
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.07)!important;
  border-color:rgba(200,168,106,.18);
}
.kpi:hover,.perf-card:hover{border-color:rgba(232,201,138,.5)}
/* superficies que estaban en blanco translúcido → vidrio oscuro */
.summary-strip,.totp-key,.u-totp-guide,.login-input,
input[type=text],input[type=number],input[type=password],input[type=date],input[type=email],input[type=search],select,textarea{
  background:rgba(255,255,255,.05)!important;color:var(--ink)!important;border-color:var(--line)!important}
input::placeholder,textarea::placeholder{color:var(--grey-warm);opacity:.8}
/* los <option> desplegados heredaban colores del SO (claro sobre claro) → forzamos oscuro legible */
select option,select optgroup{background:var(--option-bg,#1a150e);color:var(--ink)}
/* modal de confirmación + toast de error */
.modal-body{padding:4px 2px 10px}
.cm-msg{margin:0;font-size:14px;line-height:1.55;color:var(--ink)}
.toast.toast-err{border-color:#a86a48;box-shadow:var(--shadow-lg),inset 0 0 0 1px rgba(224,160,122,.25)}
.toast.toast-err::before{content:"⚠ ";color:#E0A07A}
/* Error de login/2FA legible en tema oscuro (el rojo del tema claro quedaba ~1.9:1, ilegible). */
.login-error{color:#E6B89C!important;background:rgba(168,106,72,.16)!important;border-color:rgba(224,160,122,.38)!important}
.login-card{background:rgba(28,23,16,.72)!important;border-color:var(--stroke)!important;
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.07)!important}
/* textos oscuros hardcodeados → claros */
.rc-name{color:var(--ink)}
.rc-phase,.totp-ol,.u-totp-guide,.ro-chk,.rb-radio,.rb-check{color:var(--grey-warm)}
/* Desplegable de Tipos (transacciones): el menú flota SOBRE la tabla → necesita fondo OPACO (--panel es vidrio
   translúcido y se veía transparente/ilegible). Texto de los items en claro. */
.txdd-menu{background:var(--menu-bg,#1d1710)!important;border-color:var(--stroke)!important;box-shadow:0 14px 36px rgba(0,0,0,.55)!important}
.txdd-actions{background:rgba(255,255,255,.04)!important}
.txdd-item{color:var(--ink)}
.txdd-item:hover{background:rgba(156,124,79,.16)}
.txdd-item .txdd-n{color:var(--grey-warm)}
.txdd-btn{background:var(--menu-bg,#1d1710)}
.rc-cust.rc-err{border-color:#C8A86A;background:rgba(200,168,106,.1)}
/* tags/badges con tierras apagadas → tonos legibles sobre oscuro */
.tag-mat{color:var(--warn,#E2C58C);border-color:#9a824f}
.tag-margin{color:var(--warn,#E0A07A);border-color:#a86a48}
.tag-in{color:var(--ok,#9FC79F);border-color:#5f7d5f}
.rp-conservador{color:var(--ok,#9FC79F)}
.rp-agresivo{color:var(--warn,#E0A07A)}
.cust-badge.StoneX{color:var(--ink);border-color:var(--line)}
/* gráficos del dashboard: la línea del AUM se DIBUJA sola + glow */
.lux-chart-line{filter:drop-shadow(0 0 5px rgba(232,201,138,.55));stroke-dasharray:1800;stroke-dashoffset:1800;animation:luxDraw 1.7s cubic-bezier(.4,0,.2,1) forwards}
@keyframes luxDraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.lux-chart-line{animation:none;stroke-dashoffset:0}}
/* scrollbar discreto en oscuro */
*::-webkit-scrollbar{width:11px;height:11px}
*::-webkit-scrollbar-thumb{background:rgba(200,168,106,.22);border-radius:var(--r)}
*::-webkit-scrollbar-track{background:transparent}
/* TOTP QR debe quedar CLARO para que se escanee */
.totp-qr svg{background:#fff!important}
/* PRINT: el reporte va en papel BLANCO con tinta OSCURA (revertir el tema oscuro) */
@media print{
  html,body{background:#fff!important}
  body,.rb-report,.rb-report *{color:#23201C!important}
  .table-card,.info-section,.kpi,.summary-strip{background:#fff!important;box-shadow:none!important}
  .tasks-panel,.tasks-tab,.asst-bubble,.asst-win,.report-bubble,.beta-ov{display:none!important}
}

/* ===================== Dock lateral: TAREAS + ASISTENTE (staff) ===================== */
.tasks-panel{position:fixed;top:66px;right:0;bottom:0;width:330px;max-width:88vw;z-index:60;
  background:var(--panel);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border-left:1px solid var(--line);box-shadow:var(--shadow);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .26s cubic-bezier(.4,0,.2,1)}
.tasks-panel.show{transform:translateX(0)}
@media (prefers-reduced-motion:reduce){.tasks-panel{transition:none}.asst-bubble:hover,.asst-bubble.active{transform:none}}
.tp-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.tp-title{font-family:var(--serif);font-size:18px;color:var(--ink)}
.tp-head-actions{display:flex;align-items:center;gap:8px}
.tp-filter{font-family:var(--sans);font-size:12px;padding:4px 8px;border:1px solid var(--line);border-radius:var(--r);background:transparent;color:var(--ink)}
.tp-iconbtn{border:1px solid var(--line);background:transparent;color:var(--ink);width:28px;height:28px;border-radius:var(--r);cursor:pointer;font-size:16px;line-height:1}
.tp-iconbtn:hover{border-color:var(--gold-deep);color:var(--gold)}
.tp-form{display:flex;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line)}
.tp-input{flex:1 1 auto;min-width:0;font-family:var(--sans);font-size:13px;padding:7px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink)}
.tp-due{width:120px;font-family:var(--sans);font-size:11px;padding:6px 6px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink)}
.tp-add{width:34px;flex:0 0 auto;border:none;border-radius:var(--r);background:var(--gold);color:#1a140b;font-size:18px;font-weight:600;cursor:pointer}
.tp-add:hover{background:var(--gold-deep)}
.tp-list{flex:1 1 auto;overflow:auto;padding:8px 10px}
.tp-empty{color:var(--grey-warm);font-size:13px;padding:18px 8px;text-align:center;line-height:1.5}
.tp-item{display:flex;align-items:flex-start;gap:9px;padding:9px 8px;border-bottom:1px solid rgba(200,168,106,.10)}
.tp-item.done .tp-txt{text-decoration:line-through;color:var(--grey-warm)}
.tp-check{position:relative;flex:0 0 auto;cursor:pointer;margin-top:1px;width:16px;height:16px}
.tp-check input{position:absolute;opacity:0;width:16px;height:16px;cursor:pointer;margin:0}
.tp-check span{display:block;width:16px;height:16px;border:1.5px solid var(--gold-deep);border-radius:5px}
.tp-check input:checked+span{background:var(--gold);border-color:var(--gold)}
.tp-check input:checked+span::after{content:"✓";position:absolute;left:2px;top:-3px;color:#1a140b;font-size:13px;font-weight:700}
.tp-main{flex:1 1 auto;min-width:0}
.tp-txt{font-size:13px;color:var(--ink);line-height:1.35;word-break:break-word}
.tp-meta{font-size:11px;color:var(--grey-warm);margin-top:2px}
.tp-meta.over{color:var(--warn,#d98a6a)}
.tp-meta.soon{color:var(--gold-text,var(--gold))}
.tp-del{flex:0 0 auto;border:none;background:transparent;color:var(--grey-warm);cursor:pointer;font-size:13px;opacity:.6}
.tp-del:hover{opacity:1;color:var(--gold)}
.tasks-tab{position:fixed;right:0;top:140px;z-index:59;border:1px solid var(--line);border-right:none;
  background:var(--panel);color:var(--ink);cursor:pointer;padding:13px 9px;border-radius:12px 0 0 12px;box-shadow:var(--shadow);
  font-family:var(--sans);font-size:12px;letter-spacing:.06em;display:flex;flex-direction:column;align-items:center;gap:8px;transition:color .2s,border-color .2s}
.tasks-tab:hover{color:var(--gold);border-color:var(--gold-deep)}
.tasks-tab.hidden{display:none}
.tasks-tab-txt{writing-mode:vertical-rl}
.tasks-tab-badge:empty{display:none}
.tasks-tab-badge{background:var(--gold);color:#1a140b;font-weight:700;font-size:11px;min-width:17px;height:17px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px}
/* Asistente */
.asst-bubble{position:fixed;right:22px;bottom:22px;z-index:62;width:52px;height:52px;border-radius:50%;
  border:1px solid var(--stroke);background:linear-gradient(160deg,var(--gold),var(--gold-deep));color:#1a140b;
  font-size:24px;font-weight:700;cursor:pointer;box-shadow:var(--shadow-lg);transition:right .26s,transform .15s;
  display:flex;align-items:center;justify-content:center}
@media (hover:hover) and (pointer:fine){ .asst-bubble:hover{transform:translateY(-2px)} }
.asst-bubble:active{transform:scale(.96)}
.asst-bubble.active{transform:scale(.96)}
.asst-win{position:fixed;right:22px;bottom:86px;z-index:62;width:360px;max-width:90vw;height:480px;max-height:72vh;
  display:flex;flex-direction:column;background:var(--panel);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;transition:right .26s}
.asst-win[hidden]{display:none}
.asst-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--line)}
.asst-h-title{font-family:var(--serif);font-size:15px;color:var(--ink)}
.asst-body{flex:1 1 auto;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.asst-msg{font-size:13px;line-height:1.5;padding:9px 12px;border-radius:12px;max-width:90%}
.asst-bot{align-self:flex-start;background:var(--card);border:1px solid var(--line);color:var(--ink);border-bottom-left-radius:4px}
.asst-user{align-self:flex-end;background:rgba(200,168,106,.16);border:1px solid var(--line);color:var(--ink);border-bottom-right-radius:4px}
.asst-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.asst-chip{font-family:var(--sans);font-size:11.5px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--gold-deep);cursor:pointer;text-align:left}
.asst-chip:hover{border-color:var(--gold);color:var(--gold)}
.asst-link{display:inline-block;margin-top:6px;color:var(--gold);font-size:12.5px;cursor:pointer;text-decoration:none}
.asst-link:hover{text-decoration:underline}
.asst-form{display:flex;gap:7px;padding:11px;border-top:1px solid var(--line)}
.asst-input{flex:1 1 auto;min-width:0;font-family:var(--sans);font-size:13px;padding:8px 11px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink)}
.asst-send{border:none;border-radius:var(--r);background:var(--gold);color:#1a140b;font-weight:600;font-size:13px;padding:0 14px;cursor:pointer}
.asst-send:hover{background:var(--gold-deep)}
body.tasks-open .asst-bubble,body.tasks-open .asst-win{right:352px}
/* Botón "Reportar" — al lado (izquierda) del asistente */
.report-bubble{position:fixed;right:86px;bottom:24px;z-index:62;display:inline-flex;align-items:center;gap:7px;
  height:48px;padding:0 16px;border-radius:999px;border:1px solid var(--stroke);
  background:var(--float-bg);color:var(--ink);
  font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.01em;cursor:pointer;
  box-shadow:var(--shadow-lg);transition:right .26s,transform .15s,border-color .15s,color .15s}
.report-bubble svg{color:var(--gold-deep)}
@media (hover:hover) and (pointer:fine){ .report-bubble:hover{transform:translateY(-2px);border-color:var(--gold-deep);color:var(--gold-deep)} }
.report-bubble:active{transform:scale(.96)}
body.tasks-open .report-bubble{right:416px}
/* Modal "Reportar" */
.rep-lead{font-size:13px;color:var(--grey-warm);line-height:1.55;margin:0 0 12px}
.rep-text{width:100%;box-sizing:border-box;font-family:var(--sans);font-size:14px;line-height:1.5;padding:11px 13px;
  border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);resize:vertical;min-height:120px}
.rep-text:focus{outline:none;border-color:var(--gold-deep)}
.rep-attach{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:11px}
.rep-attach-btn{cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.rep-attach-hint{font-size:11.5px;color:var(--grey-warm)}
.rep-file-list{display:flex;flex-direction:column;gap:6px;margin-top:9px}
.rep-file-list:empty{margin-top:0}
.rep-file{display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.rep-file-n{flex:1 1 auto;min-width:0;font-size:12.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-file-sz{flex:0 0 auto;font-size:11px;color:var(--grey-warm)}
.rep-file-x{flex:0 0 auto;border:none;background:transparent;color:var(--grey-warm);cursor:pointer;font-size:14px;line-height:1;padding:2px 4px}
.rep-file-x:hover{color:var(--neg)}
/* Cartel "versión de prueba" (post-bienvenida) */
.beta-ov{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(20,16,12,.55);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.beta-card{width:min(440px,94vw);background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);padding:24px 24px 20px;text-align:center}
.beta-badge{display:inline-block;font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:#1a140b;background:linear-gradient(160deg,var(--gold),var(--gold-deep));
  padding:5px 12px;border-radius:999px;margin-bottom:14px}
.beta-title{font-family:var(--serif);font-size:21px;color:var(--ink);margin:0 0 10px}
.beta-text{font-size:14px;color:var(--grey-warm);line-height:1.6;margin:0 0 20px}
.beta-actions{display:flex;justify-content:center}
@media (max-width:760px){ .report-bubble span{display:none} .report-bubble{padding:0;width:48px;justify-content:center} }
@media (max-width:760px){ body.tasks-open .report-bubble{right:86px} }
/* Ajustes */
.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.set-row{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.set-row label{font-family:var(--sans);font-size:12px;color:var(--grey-warm);letter-spacing:.03em}
.set-static{font-size:14px;color:var(--ink)}
.set-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.set-note{font-size:11.5px;color:var(--grey-warm);margin-top:10px;line-height:1.5}
.set-ok{font-size:14px;color:var(--gold);margin-bottom:10px}
.totp-steps{font-size:13px;color:var(--ink);line-height:1.6;margin:0 0 14px;padding-left:20px}
@media (max-width:760px){
  .tasks-panel{width:90vw}
  .asst-win{width:92vw}
  body.tasks-open .asst-bubble,body.tasks-open .asst-win{right:22px}
}

/* ===================== Verificación 12 meses ===================== */
.refresh-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.verify-heal{display:block;margin-top:10px;font-size:13px;color:var(--ink)}
.verify-report{margin-top:16px}
.verify-report:empty{display:none}
.vr-title{font-family:var(--sans);font-size:11px;color:var(--grey-warm);letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
.vr-filled{color:var(--gold);font-weight:600}
.vr-verdict{margin-top:10px;padding:11px 13px;border-radius:var(--r);font-size:13px;line-height:1.5;border:1px solid var(--line);background:var(--card)}
.vr-verdict.vr-ok{color:var(--gold);border-color:var(--gold-deep)}
.vr-verdict.vr-warn{color:var(--ink)}

/* ===================== Instrucciones para transferir ===================== */
.wire-toggle{display:flex;gap:8px;margin-bottom:14px}
.wire-tab{font-family:var(--sans);font-size:13px;font-weight:500;padding:7px 16px;border:1px solid var(--line);border-radius:var(--r);background:transparent;color:var(--grey-warm);cursor:pointer}
.wire-tab.active{color:var(--gold);border-color:var(--gold-deep);background:rgba(200,168,106,.10)}
.wire-doc{border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;background:var(--card)}
.wire-head{display:flex;align-items:baseline;gap:10px}
.wire-firm{font-family:var(--serif);font-size:20px;color:var(--ink);letter-spacing:.08em}
.wire-firm-sub{font-size:11px;color:var(--grey-warm)}
.wire-title{font-family:var(--serif);font-size:16px;color:var(--ink);margin:8px 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.wire-meta{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:12.5px;color:var(--grey-warm);margin-bottom:14px}
.wire-meta b{color:var(--ink)}
.wire-body{white-space:pre-wrap;font-size:13.5px;line-height:1.6;color:var(--ink);font-variant-numeric:tabular-nums}
.wire-empty{font-size:13px;color:var(--grey-warm);padding:10px 0;line-height:1.5}
.wire-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.wire-hint{font-size:12.5px;color:var(--grey-warm);line-height:1.55;margin:0 0 14px}
.wire-hint code{font-family:monospace;background:var(--card);border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--gold)}
.wire-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.wire-edit-cell{display:flex;flex-direction:column;gap:5px}
.wire-edit-cell label{font-family:var(--sans);font-size:12px;color:var(--grey-warm);letter-spacing:.03em}
.wire-ta{font-family:var(--sans);font-size:12.5px;line-height:1.5;resize:vertical}
@media (max-width:760px){ .wire-edit-grid{grid-template-columns:1fr} }
/* Imprimir SOLO las instrucciones, en papel blanco (aislamiento por visibility) */
@media print{
  body.wire-printing{visibility:hidden}
  body.wire-printing .wire-doc,body.wire-printing .wire-doc *{visibility:visible}
  body.wire-printing .wire-doc{position:fixed;left:0;top:0;width:100%;border:none;background:#fff;padding:24px}
  body.wire-printing .wire-firm,body.wire-printing .wire-firm-sub,body.wire-printing .wire-title,body.wire-printing .wire-meta,body.wire-printing .wire-meta b,body.wire-printing .wire-body{color:#23201C}
}
/* Imprimir el contenido de un MODAL aislado (audit M3): sin esto el PDF salía con la pantalla de fondo
   superpuesta y el contenido del modal RECORTADO a lo visible (scroll) — grave para los códigos de respaldo,
   que el usuario podía creer impresos completos y faltarle parte. .print-target = el nodo a imprimir. */
@media print{
  body.modal-printing{visibility:hidden}
  body.modal-printing .print-target,body.modal-printing .print-target *{visibility:visible}
  body.modal-printing .print-target{position:absolute;left:0;top:0;width:100%;max-height:none;overflow:visible;background:#fff;color:#000;border:none;box-shadow:none;padding:24px}
  body.modal-printing .print-target *{max-height:none !important;overflow:visible !important}
  body.modal-printing .modal-bg{position:static;background:none;padding:0;display:block}
  body.modal-printing .no-print,body.modal-printing .modal-actions{display:none !important}
}

.prod-link{color:var(--ink);text-decoration:none;border-bottom:1px dashed var(--line)}
.prod-link:hover{color:var(--gold);border-bottom-color:var(--gold-deep)}
.prod-row{cursor:pointer}
.prod-row:hover .prod-link{color:var(--gold);border-bottom-color:var(--gold-deep)}
/* Aviso de viaje — formulario */
.tn-form{display:flex;flex-direction:column;gap:4px}
.tn-lbl{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--grey-warm);margin-top:12px}
.tn-dates{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.tn-dates{grid-template-columns:1fr}}
.tn-picker{position:relative}
.tn-results{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;max-height:260px;overflow:auto;background:var(--menu-bg,#1B1A14);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg)}
.tn-result{padding:9px 12px;cursor:pointer;font-size:13.5px;border-bottom:1px solid var(--line)}
.tn-result:last-child{border-bottom:none}
.tn-result:hover,.tn-result.hi{background:rgba(200,168,106,.10)}
.tn-sel{font-size:12.5px;margin-top:6px}
/* Lugares de destino: input de "chips" (etiquetas) + autocompletado de países/ciudades */
.tn-tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:46px;padding:7px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--field-bg,rgba(255,255,255,.02));cursor:text}
.tn-tags:focus-within{border-color:var(--gold-deep)}
.tn-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:4px 6px 4px 11px;border:1px solid var(--line);border-radius:var(--r);color:var(--ink);background:var(--card);white-space:nowrap}
.tn-chip button{border:none;background:none;color:var(--grey-warm);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.tn-chip button:hover{color:var(--ink)}
.tn-tags-input{flex:1 1 140px;min-width:120px;border:none;background:transparent;color:var(--ink);font-family:var(--sans);font-weight:300;font-size:14px;padding:5px 2px;outline:none}
.tn-tags-input::placeholder{color:var(--grey-warm)}
/* Configurar alertas (modal admin): fila por tipo = check de activación + umbrales. */
.acfg-row{padding:12px 0;border-bottom:1px solid var(--line)}
.acfg-row:last-child{border-bottom:none}
.acfg-top{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink);cursor:pointer}
.acfg-top input{width:16px;height:16px;accent-color:var(--gold-deep);cursor:pointer}
.acfg-fields{display:flex;gap:14px;flex-wrap:wrap;margin:9px 0 0 25px}
.acfg-f{display:flex;flex-direction:column;gap:4px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--grey-warm)}
.acfg-f input{width:160px}
@media(max-width:560px){.acfg-f input{width:120px}}
/* Pantalla Datos: sub-pestañas por grupo (Operación / Configuración / Supervisión / Eliminar). */
.mg-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 20px;border-bottom:1px solid var(--line)}
.mg-tab{appearance:none;background:transparent!important;border:1px solid transparent!important;border-bottom:none!important;
  color:var(--grey-warm);font:inherit;font-size:14.5px;font-weight:600;padding:10px 18px;cursor:pointer;
  border-radius:var(--r) var(--r) 0 0 !important;box-shadow:none!important;position:relative;top:1px;transition:color .15s,background .15s,border-color .15s}
.mg-tab:hover{color:var(--ink)}
.mg-tab.active{color:var(--gold);background:var(--card)!important;border-color:var(--line)!important;border-bottom:2px solid var(--gold)!important}
.mg-group{display:block}
/* Accordion sections (Gerencia tabs) */
.acc-section{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;overflow:hidden}
.acc-toggle{display:flex;align-items:center;gap:14px;width:100%;padding:16px 24px;background:none;border:none;cursor:pointer;text-align:left;color:inherit;font:inherit;transition:background .12s}
.acc-toggle:hover{background:rgba(255,255,255,.018)}
.acc-ic{color:var(--gold);flex-shrink:0;display:flex}
.acc-hd{flex:1;min-width:0}
.acc-title{display:block;font-family:var(--serif);font-size:var(--fs-md,15px);font-weight:400;color:var(--ink)}
.acc-sub{display:block;font-size:var(--fs-xs,11px);color:var(--grey-warm);margin-top:2px}
.acc-chev{color:var(--grey-warm);transition:transform .25s ease;flex-shrink:0}
.acc-section.acc-open .acc-chev{transform:rotate(180deg)}
.acc-panel{display:none;padding:0 24px 22px 58px}
.acc-section.acc-open .acc-panel{display:block}
.acc-panel .muted:first-child{margin-top:0}
.acc-panel .table-card{background:transparent;border:none;padding:0}
.acc-panel .toolbar{padding:0}
@media(max-width:760px){.acc-panel{padding-left:20px}.acc-toggle{padding:14px 16px;gap:10px}}
/* Modal "Ordenar pestañas": filas reordenables con flechas. */
.mgo-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;margin:9px 0;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
.mgo-name{font-weight:600;color:var(--ink)}
.mgo-btns{display:flex;gap:6px}
.mgo-btns .btn-secondary{padding:5px 13px;min-width:42px}
.mgo-btns .btn-secondary:disabled{opacity:.32;cursor:default}
/* Pedido de transferencia: grupos de opciones (radios) + grilla de campos de la cuenta. */
.tr-opts{display:flex;flex-direction:column;gap:9px;margin:6px 0 2px}
.tr-opts-inline{flex-direction:row;gap:22px;flex-wrap:wrap}
.tr-opt{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:14px;color:var(--ink)}
.tr-opt input{width:16px;height:16px;accent-color:var(--gold-deep);cursor:pointer}
.tr-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin:6px 0 2px}
.tr-fld{display:flex;flex-direction:column;gap:4px}
.tn-lbl.sm{margin-top:0;font-size:10.5px}
@media(max-width:560px){.tr-grid{grid-template-columns:1fr}}
/* Documentación respaldatoria: botón de archivo + lista de adjuntos. */
.tr-file-btn{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin:6px 0 2px;padding:9px 16px;border:1px dashed var(--line);border-radius:var(--r);background:rgba(200,168,106,.06);color:var(--ink);font-size:13.5px;cursor:pointer}
.tr-file-btn:hover{border-color:var(--gold-deep);background:rgba(200,168,106,.12)}
.tr-docs-list{display:flex;flex-direction:column;gap:6px;margin:8px 0 2px}
.tr-doc-item{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);font-size:13px}
.tr-doc-ic{font-size:15px}
.tr-doc-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr-doc-sz{font-size:11.5px;flex:none}
.tr-doc-x{flex:none;border:none;background:transparent;color:var(--grey-warm);font-size:14px;cursor:pointer;padding:2px 6px;border-radius:var(--r)}
.tr-doc-x:hover{background:rgba(200,168,106,.14);color:var(--ink)}
.pos-toolbar{display:flex;align-items:center;gap:14px;margin:8px 0 12px;flex-wrap:wrap}
.pos-search{flex:0 1 380px;max-width:100%}

/* ===================== Mercados del mundo (mini-grid compacta · verde/rojo) ===================== */
.mkt-card{margin-bottom:18px}
.mkt-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;align-items:start}
.mkt-col .mkt-group:last-child{margin-bottom:0}
@media (max-width:760px){ .mkt-2col{grid-template-columns:1fr;gap:0} }
.mkt-group{margin-bottom:11px}
.mkt-group:last-child{margin-bottom:0}
.mkt-ghead{font-family:var(--sans);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--grey-warm);margin-bottom:6px}
.mkt-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:7px}
.mkt-item{border:1px solid var(--line);border-radius:var(--r);padding:7px 9px;background:var(--card)}
.mkt-name{font-size:10.5px;color:var(--grey-warm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mkt-val{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;margin:1px 0}
.mkt-chg{font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.mkt-up .mkt-chg{color:var(--pos)}
.mkt-down .mkt-chg{color:var(--neg)}
.mkt-flat .mkt-chg{color:var(--grey-warm)}
.mkt-up{border-color:color-mix(in srgb,var(--pos) 30%,var(--line))}
.mkt-down{border-color:color-mix(in srgb,var(--neg) 30%,var(--line))}
@media (max-width:520px){ .mkt-row{grid-template-columns:repeat(auto-fill,minmax(94px,1fr))} }
/* Top 5 por ponderación: misma grilla; el peso va en oro (no es suba/baja). */
.tw-item .mkt-val.tw-pct{color:var(--gold)}
.tw-item .mkt-chg.tw-sub{color:var(--grey-warm)}

/* ───────── Mensajería interna (staff) ───────── */
.msg-bell{position:relative}
.msg-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#b0472f;color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;font-family:var(--sans)}
.msg-list{display:flex;flex-direction:column;gap:2px}
.msg-item{padding:13px 16px;border:1px solid var(--line);border-bottom:none;background:var(--panel);cursor:pointer;transition:background .15s ease}
.msg-item:last-child{border-bottom:1px solid var(--line)}
.msg-item:hover{background:var(--card)}
.msg-item.msg-unread{border-left:3px solid var(--gold-deep)}
.msg-item-top{display:flex;align-items:center;gap:8px}
.msg-subj{font-family:var(--serif);font-size:15px;color:var(--ink)}
.msg-item.msg-unread .msg-subj{font-weight:600}
.msg-dot{margin-left:auto;background:var(--gold-deep);color:#1a140c;font-size:11px;font-weight:700;border-radius:9px;min-width:18px;height:18px;line-height:18px;text-align:center;padding:0 5px}
.msg-item-sub{font-size:11.5px;margin-top:3px}
.msg-item-prev{font-size:12.5px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-status{margin:0 0 12px;padding:10px 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);font-size:13px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.msg-claim{margin:0 0 10px;padding:8px 12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tag-claim{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px;border:1px solid var(--info,#6ea8d9);color:var(--info,#6ea8d9)}
.tag-unclaimed{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px;border:1px dashed var(--warn,#E2C58C);color:var(--warn,#b8923f)}
.msg-ref{font-family:var(--mono,ui-monospace,Menlo,monospace);font-size:11.5px;font-weight:600;letter-spacing:.04em;color:var(--gold-deep);border:1px solid var(--line);border-radius:6px;padding:2px 7px;white-space:nowrap}
.msg-item-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.msg-claim-free{border:1px dashed var(--line);border-radius:var(--r)}
.msg-claim-free .btn-primary{margin-left:auto}
.msg-sys{font-size:12px;color:var(--grey-warm);text-align:center;padding:2px 8px}
.btn-ghost{background:none;border:none;color:var(--grey-warm);font-size:11px;cursor:pointer;text-decoration:underline;padding:0}
.btn-ghost:hover{color:var(--ink)}
.msg-thread{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.msg-bubble{padding:11px 14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r)}
.msg-b-head{font-size:12px;margin-bottom:5px}
.msg-b-body{font-size:14px;line-height:1.5;color:var(--ink);white-space:normal}
.msg-atts{margin-top:8px;display:flex;flex-wrap:wrap;gap:8px}
.msg-att{display:inline-block;font-size:12px;padding:4px 9px;border:1px solid var(--line);border-radius:var(--r-pill);color:var(--gold-deep);text-decoration:none}
.msg-att:hover{border-color:var(--gold-deep)}
.msg-reply{display:flex;flex-direction:column;gap:8px}
.msg-reply textarea,.cmp-f textarea,.cmp-f input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);color:var(--ink);font-family:var(--sans);font-size:14px}
.msg-reply .btn-primary{align-self:flex-end}
.cmp-f{display:block;margin:10px 0;font-size:12px;color:var(--grey-warm)}
.cmp-f input,.cmp-f textarea{margin-top:5px}
.cmp-rcpts{display:flex;flex-wrap:wrap;gap:6px 16px}
.cmp-rcpt,.nr-u{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink);cursor:pointer}
.nr-block{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.nr-block:last-of-type{border-bottom:none}
.nr-users{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:6px}
/* Selector de destinatarios (admins) desde una lista: chips + dropdown para agregar */
.nr-pick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.nr-chips{display:flex;flex-wrap:wrap;gap:8px}
.nr-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;border:1px solid var(--line);border-radius:var(--r-pill);padding:4px 6px 4px 13px;color:var(--ink);background:var(--card);white-space:nowrap}
.nr-chip button{border:none;background:none;color:var(--grey-warm);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.nr-chip button:hover{color:var(--ink)}
.nr-add{font-family:var(--sans);font-size:12.5px;padding:9px 13px;border:1px solid var(--line);border-radius:var(--r);background:var(--field-bg);color:var(--ink);cursor:pointer}
.nr-add:disabled{opacity:.5;cursor:default}
.nr-email{margin-top:12px}
.nr-email .nr-mail{max-width:420px}

/* ============================================================
   DENSIDAD "MUY COMPACTO" (rama feat/densidad-muy-compacta)
   Reduce tipografías y, sobre todo, el padding de listas/KPIs en
   TODA la app. Va al final → gana la cascada sin !important.
   Revertir: borrar este bloque. Hacerlo conmutable: prefijar cada
   selector con (p.ej.) html.compact y togglear la clase.
   Ahora CONMUTABLE por usuario: gateado con html[data-density="compact"]
   (default; lo fija theme-init.js + la pref grm_density). data-density="normal"
   = look holgado (sin estas reglas).
   ============================================================ */
html[data-density="compact"] body{ font-size:13px; line-height:1.45; }
/* títulos de página y de sección */
html[data-density="compact"] .list-title h1{ font-size:22px; }
html[data-density="compact"] .list-title p{ font-size:12px; }
html[data-density="compact"] .sec-title{ font-size:15px; }
html[data-density="compact"] .panel h2{ font-size:19px; }
html[data-density="compact"] .info-section .sec-title{ padding:11px 14px 10px; font-size:14px; }
/* KPIs */
html[data-density="compact"] .kpi{ padding:13px 15px; }
html[data-density="compact"] .kpi .k-label{ font-size:9.5px; }
html[data-density="compact"] .kpi .k-value{ font-size:21px; margin-top:8px; }
html[data-density="compact"] .kpi .k-sub{ font-size:11px; margin-top:5px; }
/* tablas / listas (lo que más se siente) */
html[data-density="compact"] table.nx-table{ font-size:12px; }
html[data-density="compact"] .nx-table thead th{ padding:7px 11px; font-size:9.5px; }
html[data-density="compact"] .nx-table tbody td{ padding:7px 11px; }
html[data-density="compact"] .nx-table.holdings{ font-size:11px; }
/* toolbar / búsqueda / filtros */
html[data-density="compact"] .search-box input{ padding:8px 12px 8px 36px; font-size:13px; }
html[data-density="compact"] .search-box .si{ font-size:14px; }
html[data-density="compact"] .toolbar select, html[data-density="compact"] .period-sel{ padding:7px 12px; font-size:11.5px; }
html[data-density="compact"] .result-count{ font-size:11.5px; }
/* Toggle de densidad (Ajustes → Apariencia) */
.dens-switch{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.densw,.motw{ padding:6px 14px; border:1px solid var(--line, #4443); background:var(--field-bg, transparent); color:inherit; border-radius:var(--r-pill, 999px); cursor:pointer; font-size:13px; }
.densw.on,.motw.on{ background:var(--gold, #b8902f); color:var(--on-gold, #1a1407); border-color:transparent; font-weight:600; }
/* Botón chico (gears del Inicio) + modal de orden de secciones */
.btn-sm{ padding:6px 12px; font-size:12px; }
.ord-list{ display:flex; flex-direction:column; gap:8px; }
.ord-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 12px; border:1px solid var(--line, #4443); border-radius:var(--r, 12px); background:var(--field-bg, transparent); }
.ord-btns{ display:inline-flex; gap:6px; flex:0 0 auto; }
.ord-btns .btn-sm{ padding:4px 10px; }
/* Códigos de respaldo de TOTP (grid de monoespaciados) + badge de cuenta bloqueada */
.backup-codes{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:6px 0; }
.backup-codes code{ font-family:var(--mono,monospace); font-size:15px; letter-spacing:.06em; text-align:center; padding:9px 6px; border:1px solid var(--line,#4443); border-radius:var(--r,12px); background:var(--field-bg,transparent); }
.lock-badge{ font-size:11px; font-weight:600; color:#b0883a; white-space:nowrap; }
@media print{ .backup-codes code{ border:1px solid #999; color:#000; } }
/* Banner de coherencia de datos "⚠ Verificar" (vistas en tema oscuro: análisis por productor, etc.) */
.coh-warn{ background:color-mix(in srgb, var(--gold, #b8902f) 16%, transparent); border:1px solid color-mix(in srgb, var(--gold, #b8902f) 50%, transparent); color:var(--ink, inherit); border-radius:var(--r, 12px); padding:11px 15px; margin:0 0 16px; font-size:12.5px; font-weight:600; }

/* ============================================================
   REDISEÑO LIVIANO — lote 1 (Detalle): menú "Acciones ▾"
   Agrupa las acciones secundarias de la barra de cuenta; "Estado
   de cuenta" queda como botón directo fijo. Quita ruido sin
   esconder funciones (todo a 1 click).
   ============================================================ */
.acct-actions{ display:inline-flex; align-items:center; gap:8px; margin-left:auto; }
.acct-menu{ position:relative; display:inline-block; }
.acct-menu-list{ position:absolute; right:0; top:calc(100% + 6px); min-width:240px; display:none; z-index:40;
  background:var(--menu-bg); border:1px solid var(--line); border-radius:var(--r); padding:6px; box-shadow:var(--shadow); }
.acct-menu-list.open{ display:block; }
.acct-menu-item{ display:block; width:100%; text-align:left; background:none; border:none; cursor:pointer;
  color:var(--ink); font-family:var(--sans); font-size:13px; padding:9px 12px; border-radius:10px; white-space:nowrap; }
.acct-menu-item:hover{ background:var(--card); color:var(--gold); }
@media(max-width:760px){ .acct-actions{ margin-left:0; } .acct-menu-list{ right:auto; left:0; } }

/* ============================================================
   REDISEÑO LIVIANO — lote 2 (Clientes): "Filtros ▾"
   La fila avanzada (tipo / persona / valor) se pliega; quedan
   afuera buscador + custodio (+ productor para admin). El botón
   lleva un badge con la cantidad de filtros activos.
   ============================================================ */
.adv-filters{ display:none; gap:10px; align-items:center; flex-wrap:wrap; margin:-2px 0 16px; }
.chk-inline{ display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--grey-warm); cursor:pointer; white-space:nowrap; }
.chk-inline input{ accent-color:var(--gold); cursor:pointer; }
.filtros-toggle .filtros-badge{ display:none; }
.filtros-toggle .filtros-badge.on{ display:inline-block; background:var(--gold-deep); color:var(--on-gold);
  border-radius:var(--r-pill); padding:0 7px; font-size:10px; font-weight:600; margin:0 1px; }

/* ============================================================
   REDISEÑO LIVIANO — lote 3 (Inicio): Mercados como cinta colapsable
   "Mercados del mundo" deja de ser una tarjeta full-size: se ve una
   cinta de ≤5 índices clave + "Mercados ▾"; la grilla completa cuelga
   colapsable (cerrada por defecto, con memoria por usuario).
   ============================================================ */
.mkt-collapsible{ padding:0 !important; }
.mkt-bar{ display:flex; align-items:center; gap:16px; padding:10px 16px; cursor:pointer; user-select:none; flex-wrap:wrap; }
.mkt-bar:hover{ background:var(--card); }
.mkt-ticker{ display:flex; gap:16px; flex-wrap:wrap; align-items:baseline; font-size:12px; min-width:0; }
.mkt-ti{ display:inline-flex; gap:6px; align-items:baseline; white-space:nowrap; font-variant-numeric:tabular-nums; }
.mkt-ti .tn{ color:var(--grey-warm); }
.mkt-ti .tv{ font-weight:600; }
.mkt-ti.mkt-up .tv{ color:var(--pos); } .mkt-ti.mkt-down .tv{ color:var(--neg); } .mkt-ti.mkt-flat .tv{ color:var(--grey-warm); }
.mkt-toggle{ margin-left:auto; display:flex; gap:14px; align-items:center; white-space:nowrap; }
.mkt-chev{ color:var(--gold); font-weight:500; font-size:12px; }
.mkt-grid-wrap{ padding:6px 16px 14px; border-top:1px solid var(--line); }

/* ============================================================
   REDISEÑO LIVIANO — lote 4 (Detalle): pestañas agrupadas
   La side-nav del detalle agrupa las 10 pestañas (Resumen suelto ·
   Posición · Movimientos · Gestión). Mismas rutas; solo agrupamiento
   visual (encabezado por grupo).
   ============================================================ */
.side-nav .sn-grp-head{ padding:13px 24px 4px; color:var(--grey-warm); opacity:.6;
  font-size:9px; letter-spacing:.16em; text-transform:uppercase; width:100%; }
@media(max-width:860px){ .side-nav .sn-grp-head{ flex-basis:100%; padding:8px 8px 2px; } }

/* ============================================================
   REDISEÑO LIVIANO — lote 5 (Inicio): héroe + módulos + pendientes
   8 tarjetas iso-jerárquicas → cinta Mercados + línea Pendientes +
   HÉROE (KPIs+gráfico) + módulo Clientes (sub-pestañas) + módulo
   Composición (colapsable: asignación · concentración · ponderación).
   ============================================================ */
/* Línea de pendientes: renglón de TEXTO liviano (NO tarjetas) — números en oro
   inline + separadores, para que no compita con los KPIs. */
.dash-pending{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:2px 0 18px; }
.dash-pending:empty{ display:none; }
/* Cápsulas de "Para hoy" (mismo estilo que la cinta de KPIs de Clientes) */
.dp-cap{ display:inline-flex; align-items:baseline; gap:7px; white-space:nowrap; text-decoration:none;
  border:1px solid var(--line); background:var(--field-bg, var(--card)); border-radius:var(--r-pill);
  padding:7px 15px; color:var(--grey-warm); }
.dp-cap .dp-lab{ font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--grey-warm); }
.dp-cap b{ font-size:14px; font-weight:600; color:var(--gold); font-variant-numeric:tabular-nums; }
.dp-cap .dp-val{ font-size:12px; color:var(--ink); font-variant-numeric:tabular-nums; }
.dp-cap:hover{ border-color:var(--gold); }
.dp-cap:hover b{ color:var(--gold-deep); }
.dpend-lbl{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--grey-warm); margin-right:2px; }
/* ===== Próximas acciones / Acciones sugeridas (motor next-actions) ===== */
.na-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.na-head .sec-title{ margin:0; }
.na-count{ font-size:12px; }
.na-all{ margin-left:auto; font-size:12px; color:var(--gold); text-decoration:none; white-space:nowrap; }
.na-all:hover{ color:var(--gold-deep); }
.na-row{ display:flex; align-items:center; gap:12px; padding:11px 13px; border:1px solid var(--line); border-radius:var(--r); margin:7px 0; cursor:pointer; transition:border-color .2s, background .2s; }
.na-row:hover{ border-color:var(--gold); background:var(--field-bg, transparent); }
.na-prio{ flex:0 0 auto; width:9px; height:9px; border-radius:50%; }
.na-prio-high{ background:var(--neg, #c0392b); }
.na-prio-med{ background:var(--gold); }
.na-prio-low{ background:var(--grey-warm); }
.na-prio-ok{ background:var(--pos, #3e7a4e); }
.na-main{ flex:1 1 auto; min-width:0; }
.na-title{ font-size:13.5px; font-weight:600; }
.na-client{ color:var(--grey-warm); font-weight:400; }
.na-reason{ font-size:11.5px; color:var(--grey-warm); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.na-imp{ flex:0 0 auto; font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--ink); }
.na-cta{ flex:0 0 auto; font-size:11.5px; color:var(--gold); white-space:nowrap; }
.na-row:hover .na-cta{ color:var(--gold-deep); }
.ov-actions{ margin:2px 0 18px; }
.na-inline{ background:var(--field-bg, transparent); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; }
.na-inline .na-head{ margin-bottom:6px; }
/* Lectura del asesor (Fase 2.1) */
.lect-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.lect-title{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--grey-warm); }
.lect-head .na-all{ margin-left:auto; }
.estado{ font-size:11px; font-weight:600; padding:3px 11px; border-radius:var(--r-pill); border:1px solid var(--line); }
.estado-urg{ color:var(--neg,#c0392b); border-color:color-mix(in srgb,var(--neg,#c0392b) 40%,var(--line)); }
.estado-rev{ color:var(--gold-deep); border-color:color-mix(in srgb,var(--gold) 45%,var(--line)); }
.estado-ok{ color:var(--pos,#3e7a4e); border-color:color-mix(in srgb,var(--pos,#3e7a4e) 40%,var(--line)); }
.lect-line{ font-size:12px; color:var(--ink); margin:3px 0; }
.lect-k{ font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-warm); margin-right:6px; }
/* Reporte narrativo (Fase 4) */
.rb-field-wide{ grid-column:1 / -1; }
#rbComment{ width:100%; resize:vertical; min-height:80px; font-family:inherit; }
.rb-cmt-tools{ display:flex; gap:8px; align-items:center; margin-top:8px; flex-wrap:wrap; }
.rb-cmt-text{ white-space:pre-wrap; line-height:1.6; font-size:13.5px; }
.na-ok{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--grey-warm); padding:10px 13px; border:1px dashed var(--line); border-radius:var(--r); }
@media(max-width:680px){
  .na-reason{ display:none; }
  /* Mobile: la fila de acción (dot · monto · CTA) era flex nowrap → el CTA "Preparar propuesta…" se DESBORDABA
     y se cortaba en el borde. Ahora la fila envuelve: título+cliente en la 1ª línea, monto y CTA en la 2ª. */
  .na-row{ flex-wrap:wrap; row-gap:3px; }
  .na-imp{ margin-left:21px; }
  .na-cta{ font-size:11px; white-space:normal; margin-left:auto; text-align:right; }
}
/* ===== Banda de calidad de datos (Fase 9) ===== */
.ov-quality:empty{ display:none; }
.dq-band{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:9px 13px; border-radius:var(--r); margin:2px 0 16px; font-size:12px; border:1px solid var(--line); }
.dq-warn{ border-color:color-mix(in srgb, var(--neg,#c0392b) 45%, var(--line)); background:color-mix(in srgb, var(--neg,#c0392b) 7%, transparent); }
.dq-info{ border-color:var(--line); background:var(--field-bg, transparent); }
.dq-ic{ font-size:13px; }
.dq-lbl{ font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-warm); margin-right:2px; }
.dq-chip{ font-size:11.5px; padding:3px 9px; border-radius:var(--r-pill); border:1px solid var(--line); white-space:nowrap; cursor:help; }
.dq-chip.dq-w{ color:var(--neg,#c0392b); border-color:color-mix(in srgb, var(--neg,#c0392b) 35%, var(--line)); }
.dq-chip.dq-i{ color:var(--grey-warm); }
@media print{ .dq-band, .ov-quality{ display:none !important; } } /* la banda es interna: no se imprime en el reporte del cliente */
/* ===== Cartel del breaker de login bloqueado (Datos → Actualizar datos) ===== */
#loginBreaker:empty{ display:none; }
.lb-alert{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:11px 15px; margin:0 0 16px;
  border-radius:var(--r); border:1px solid color-mix(in srgb, var(--neg,#c0392b) 55%, var(--line));
  background:color-mix(in srgb, var(--neg,#c0392b) 9%, transparent); font-size:12.5px; }
.lb-txt{ flex:1 1 260px; line-height:1.5; }
.lb-txt b{ color:var(--neg,#c0392b); }
.lb-reason{ font-family:var(--mono, ui-monospace, monospace); font-size:11.5px; color:var(--grey-warm); word-break:break-word; }
.lb-unblock{ flex:0 0 auto; }
/* ===== Grupos de Operación (#/pgroups) ===== */
.pg-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:18px; margin:0 0 16px; box-shadow:var(--shadow); }
.pg-head{ display:flex; align-items:flex-start; gap:12px; margin-bottom:10px; }
.pg-head h2{ margin:0; }
.pg-sub{ font-size:12px; }
.pg-card-actions{ margin-left:auto; display:flex; gap:6px; flex-wrap:wrap; }
.pg-empty{ font-size:12.5px; padding:6px 2px; }
.pg-op{ border:1px solid var(--line); border-radius:var(--r); padding:11px 13px; margin:8px 0; }
.pg-op-head{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13.5px; }
.pg-kind{ font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-deep); border:1px solid var(--line); border-radius:var(--r-pill); padding:2px 8px; }
.pg-prog{ font-size:11.5px; color:var(--grey-warm); }
.pg-note{ font-size:12px; margin:6px 0; white-space:pre-wrap; }
.pg-items{ display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.pg-item{ display:inline-flex; align-items:center; gap:6px; font-size:12px; padding:5px 11px; border:1px solid var(--line); border-radius:var(--r-pill); background:var(--field-bg, transparent); color:var(--ink); cursor:pointer; }
.pg-item:hover{ border-color:var(--gold); }
.pg-pick-list{ max-height:300px; overflow:auto; border:1px solid var(--line); border-radius:var(--r); padding:6px; }
.pg-pick{ display:flex; align-items:center; gap:8px; padding:6px 8px; font-size:13px; cursor:pointer; border-radius:var(--r); }
.pg-pick:hover{ background:var(--field-bg, transparent); }
.pg-stickybar{ position:sticky; top:66px; z-index:6; padding:8px 0 10px; margin-bottom:6px; background:var(--app-bg); border-bottom:1px solid var(--line); }
.pg-meta{ font-size:12px; color:var(--grey-warm); margin:5px 0 2px; }
.pg-result{ font-size:12.5px; margin:6px 0 2px; min-height:1em; }
.ytd-est{ font-size:.82em; opacity:.7; font-style:italic; }
.ytd-ok{ color:var(--pos); font-weight:600; }
.ytd-warn{ color:var(--gold-deep,var(--gold)); font-weight:600; }
/* Carga manual de costo en Tenencias (títulos sin costo del custodio) */
.cost-add{ font-size:11px; padding:2px 8px; border:1px dashed var(--gold-deep,var(--gold)); background:transparent; color:var(--gold-deep,var(--gold)); border-radius:var(--r-pill); cursor:pointer; white-space:nowrap; }
.cost-add:hover{ background:var(--field-bg,transparent); }
.cost-manual{ cursor:pointer; opacity:.75; margin-left:4px; font-size:11px; }
.cost-manual:hover{ opacity:1; }
.cost-none{ font-size:11px; color:var(--grey-warm); font-style:italic; }
.pg-chk{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; cursor:pointer; }
.pg-chk input{ width:auto; margin:0; }
/* Cuadro "Datos efectivamente bajados" */
.cov-wrap{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px; }
.cov-cust{ border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.cov-cust-h{ font-weight:600; letter-spacing:.04em; padding:9px 14px; background:var(--field-bg,transparent); border-bottom:1px solid var(--line); }
.cov-tbl{ width:100%; border-collapse:collapse; }
.cov-tbl td{ padding:8px 12px; border-bottom:1px solid var(--line); vertical-align:top; font-size:12.5px; }
.cov-tbl tr:last-child td{ border-bottom:0; }
.cov-ic{ width:26px; text-align:center; font-weight:700; }
.cov-lbl{ color:var(--ink); }
.cov-val{ text-align:right; color:var(--grey-warm); white-space:nowrap; font-variant-numeric:tabular-nums; }
.cov-ok{ color:var(--pos); }
.cov-warn{ color:var(--gold-deep,var(--gold)); }
.cov-none{ color:var(--neg); }
.cov-na{ color:var(--grey-warm); }
.cov-row.cov-none .cov-lbl{ font-weight:600; }
.cov-hint{ margin-left:5px; cursor:help; opacity:.7; font-size:11px; }
.tp-pg{ cursor:pointer; }
.tp-pg:hover{ background:var(--field-bg, transparent); }
.tp-pg-ic{ flex:0 0 auto; color:var(--gold); font-size:13px; width:18px; text-align:center; }
.dash-hero{ border:1px solid var(--line); border-radius:var(--r-lg); background:var(--panel); padding:18px; margin-bottom:18px; }
.dash-hero .kpis{ margin-bottom:0; }
.dash-hero-chart{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.dash-mod{ margin-bottom:18px; }
.dash-subtabs{ display:flex; gap:6px; border-bottom:1px solid var(--line); margin:-2px 0 12px; flex-wrap:wrap; }
.dsub{ appearance:none; background:transparent; border:1px solid transparent; border-bottom:none; color:var(--grey-warm);
  font:inherit; font-size:13px; font-weight:600; padding:8px 14px; cursor:pointer; border-radius:var(--r) var(--r) 0 0; position:relative; top:1px; }
.dsub:hover{ color:var(--ink); }
.dsub.active{ color:var(--gold); background:var(--card); border-color:var(--line); border-bottom:2px solid var(--gold); }
.dsub-bdg{ display:none; }
.dsub-bdg.on{ display:inline-block; background:var(--gold-deep); color:var(--on-gold); border-radius:var(--r-pill);
  font-size:10px; font-weight:600; padding:0 6px; margin-left:4px; }
.dash-coll{ margin-bottom:18px; padding:0 !important; }
.dash-coll-h{ display:flex; align-items:center; gap:12px; padding:13px 16px; cursor:pointer; user-select:none; }
.dash-coll-h:hover{ background:var(--card); }
.dash-coll-h .sec-title{ margin:0; } .dash-coll-h .comp-sub{ font-size:11.5px; }
.dash-coll-h .mkt-chev{ margin-left:auto; }
.dash-coll-body{ padding:6px 16px 16px; border-top:1px solid var(--line); }
.dash-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media(max-width:820px){ .dash-grid2{ grid-template-columns:1fr; } }
.sec-sub{ font-family:var(--serif); font-size:14px; font-weight:400; margin:6px 0 10px; color:var(--ink); }
.dash-pond{ margin-top:16px; padding-top:12px; border-top:1px solid var(--line); }
.dash-pond-h{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.pond-toggle{ display:flex; gap:4px; }
.pt{ appearance:none; background:transparent; border:1px solid var(--line); color:var(--grey-warm); font:inherit;
  font-size:11px; padding:4px 10px; border-radius:var(--r-pill); cursor:pointer; }
.pt.active{ color:var(--gold); border-color:var(--gold); background:var(--card); }

/* ============================================================
   REDISEÑO LIVIANO — lote 6 (Clientes): KPIs a cinta de 1 línea
   Los KPIs grandes bajan a una cinta de texto (la tabla es el foco);
   cada número sigue clickeable (mismo onKpi/drill-down).
   ============================================================ */
/* Cada métrica es su PROPIA cápsula (label en gris + valor resaltado) → se lee/separa mejor que una tira corrida.
   GRID auto-fit, no flex-wrap: con wrap, las 5 cápsulas quebraban dejando STONEX huérfana en la 2ª fila y con
   anchos desparejos. Con auto-fit se reparten parejas en 1 o 2 filas según el ancho. */
.cli-statline{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px;
  align-items:stretch; margin-bottom:14px; }
.cli-statline .si{ color:var(--grey-warm); display:inline-flex; align-items:baseline; gap:7px;
  justify-content:center; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  border:1px solid var(--line); background:var(--field-bg, var(--card)); border-radius:var(--r-pill);
  padding:7px 15px; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.cli-statline .si-lbl{ overflow:hidden; text-overflow:ellipsis; min-width:0; flex-shrink:1; }
.cli-statline .si b{ color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; cursor:pointer; font-size:14px; text-transform:none; letter-spacing:0; flex-shrink:0; }
.cli-statline .si b:hover{ color:var(--gold); }
.cli-statline .si .muted{ font-size:12px; text-transform:none; flex-shrink:0; }

/* ============================================================
   REDISEÑO LIVIANO — lote 7 (Detalle/Resumen): previews + lápiz
   Los previews "Top tenencias" y "Actividad reciente" bajan a 3 filas
   con "› ver todo" (la tabla completa vive en su pestaña). La línea de
   productor (único lugar de lectura) lleva un lápiz para editar (admin).
   ============================================================ */
.ov-seeall{ display:inline-block; margin:8px 2px 2px; color:var(--gold); font-size:12px; }
.ov-seeall:hover{ color:var(--gold-deep); }
/* Código del título (símbolo/CUSIP) bajo el nombre en "Top tenencias": el nombre manda, el código acompaña. */
.top-hold-code{ font-size:11px; letter-spacing:.04em; margin-top:2px; }
.prod-edit{ color:var(--gold); font-size:12px; margin-left:4px; text-decoration:none; }
.prod-edit:hover{ color:var(--gold-deep); }

/* Modal "Columnas de la lista" — checkboxes para mostrar/ocultar columnas (configurable por el usuario). */
.cols-cfg{ display:flex; flex-direction:column; gap:0; }
.cols-cfg-row{ display:flex; align-items:center; gap:10px; padding:9px 4px; font-size:13.5px; color:var(--ink); cursor:pointer; border-bottom:1px solid var(--line); }
.cols-cfg-row:last-child{ border-bottom:none; }
.cols-cfg-row input{ width:16px; height:16px; accent-color:var(--gold-deep); cursor:pointer; }

/* Engranaje ⚙ por tarjeta (elige qué campos muestra) — ícono sutil en la ESQUINA, sin caja, color del tema. */
.card-cfg{ appearance:none !important; background:transparent !important; border:none !important; box-shadow:none !important;
  position:absolute; top:11px; right:13px; z-index:3; color:var(--grey-warm); cursor:pointer;
  font-size:15px; line-height:1; padding:3px; opacity:.55; transition:opacity .15s, color .15s; }
.card-cfg:hover{ color:var(--gold); opacity:1; }
/* las tarjetas que llevan engranaje deben ser contenedor de posicionamiento */
.dash-mod, .table-card.has-cfg{ position:relative; }
/* tablas planas con gear: una franja arriba para que el ⚙ no tape el encabezado */
.table-card.has-cfg{ padding-top:34px; }

/* ===================== Auditoría UX 2026-07-01 ===================== */
/* UX-19: KPI en cero atenuado — no compite en jerarquía con los que importan. */
.kpi.kpi-muted{ opacity:.5; }
.kpi.kpi-muted .k-value{ color:var(--grey-warm); }
/* Tipos de alerta SIN señal: una línea al pie de la grilla en vez de una tarjeta "US$ 0" por tipo.
   Ocupa el ancho completo de la grilla (.kpis es grid) sin robar una celda. */
.kpi-zeroline{ grid-column:1/-1; color:var(--grey-warm); font-size:11.5px; letter-spacing:.04em;
  padding:2px 4px; }

/* UX-19: motivo de Compliance como chip corto (tooltip lleva el detalle). */
.rp-chip{ display:inline-block; font-family:var(--sans); font-size:12px; padding:3px 9px; border:1px solid var(--line);
  border-radius:var(--r-pill); color:var(--ink); background:transparent; cursor:default; }
.rp-mix2{ margin-top:4px; }

/* UX-07: link a la comparación YTD dentro del modal. */
.ytd-cmp-link{ color:var(--gold); text-decoration:none; white-space:nowrap; }
.ytd-cmp-link:hover{ text-decoration:underline; }

/* UX-10/UX-11: ciclo de vida de alertas/oportunidades. */
.al-actions{ white-space:nowrap; }
/* Acción por fila: ícono ghost. Área de click cómoda (30px) sin fondo que compita con los datos. */
.al-ico{ display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px;
  border:1px solid transparent; border-radius:var(--r-sm,10px); background:transparent; color:var(--grey-warm);
  cursor:pointer; padding:0; transition:color .14s ease, border-color .14s ease, background .14s ease; }
.al-ico:hover{ color:var(--ink); border-color:var(--line); background:var(--card); }
.al-ico.al-ok:hover{ color:var(--ok); border-color:color-mix(in srgb, var(--ok) 40%, transparent); }
.al-ico:focus-visible{ outline:2px solid var(--gold); outline-offset:1px; }
.al-badge{ display:inline-block; font-family:var(--sans); font-size:11.5px; padding:2px 8px; border-radius:var(--r-pill); }
.al-badge.al-atendida{ background:rgba(120,150,110,.18); color:var(--gold-deep); border:1px solid var(--line); }
.al-badge.al-descartada{ background:transparent; color:var(--grey-warm); border:1px solid var(--line); }
tr.al-state-atendida > td, tr.al-state-descartada > td{ opacity:.6; }
.al-managed{ margin-top:12px; }
.al-managed > summary{ cursor:pointer; font-family:var(--sans); font-size:12.5px; color:var(--grey-warm); padding:8px 4px; letter-spacing:.03em; }
.al-managed > summary:hover{ color:var(--gold); }
.al-managed table{ margin-top:8px; }

/* UX-24: en mobile el tab de Tareas se achica y baja, para no pisar el contenido del borde. */
@media (max-width:760px){
  .tasks-tab{ top:auto; bottom:86px; padding:8px 3px; font-size:11px; opacity:.9; }
  .tasks-tab-txt{ writing-mode:vertical-rl; }
  /* UX-25: la cinta de KPIs de Clientes en mobile va en una LÍNEA scrolleable horizontal (no apilada ~700px). */
  .cli-statline{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
  .cli-statline .si{ flex:0 0 auto; }
}

/* ===== Auditoría productor 2026-07-02: frescura de datos, tareas, novedades, captación, umbrales, contacto ===== */
/* #12 frescura de datos en el header */
/* Chip de frescura: COMPACTO (punto + una palabra). La fecha entera vive en el title y en el footer.
   Oculto bajo 1366px porque colisionaba con "Suscribir fondo" entre ~900 y ~1360px (73px de overlap a 1280px). */
.data-fresh{ font-size:11px; color:var(--grey-warm); border:1px solid var(--line); border-radius:var(--r-pill);
  padding:3px 10px; white-space:nowrap; background:var(--panel); flex:0 0 auto;
  display:inline-flex; align-items:center; gap:6px; }
.data-fresh i{ width:6px; height:6px; border-radius:50%; background:var(--pos); flex:0 0 auto; }
.data-fresh.stale{ color:var(--warn); border-color:var(--warn); background:rgba(201,154,74,.10); font-weight:600; }
.data-fresh.stale i{ background:var(--warn); }
/* El chip de frescura se mudó al PIE DE LA BARRA LATERAL (.side-fresh): en el header competía por lugar con
   los 3 botones y se escondía solo en pantallas medianas, así que la fecha de los datos —que es información
   de confianza— desaparecía justo en los anchos más comunes. Abajo, en el sidebar, se ve siempre. */
.side-fresh{ margin-top:auto; padding:12px 16px 14px; border-top:1px solid var(--line); display:flex;
  flex-direction:column; gap:6px; align-items:flex-start; }
.side-fresh .sf-lbl{ font-size:9px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-deep); }
.side-fresh .data-fresh{ font-size:11px; }
/* #5 badge de tareas + cápsula de tareas en Para hoy */
.task-bell{ position:relative; }
.dp-cap.dp-task{ border-color:var(--warn); }
.dp-cap.dp-task b{ color:var(--warn); }
/* #3 Novedades */
.nov-card .nov-sub{ font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-warm); margin:10px 0 4px; }
.nov-list{ display:flex; flex-direction:column; }
.nov-row{ display:grid; grid-template-columns:auto 1.4fr 2fr auto auto; gap:10px; align-items:center; padding:7px 6px; border-bottom:1px solid var(--line); cursor:pointer; font-size:13px; }
.nov-row:last-child{ border-bottom:0; }
.nov-row:hover{ background:var(--hover,rgba(0,0,0,.03)); }
.nov-dir{ font-variant-numeric:tabular-nums; font-weight:600; white-space:nowrap; }
.nov-row.nov-in .nov-dir{ color:var(--pos,#2f7d4f); }
.nov-row.nov-out .nov-dir{ color:var(--neg,#b0472f); }
.nov-cli{ font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nov-desc{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nov-amt{ font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.nov-date{ text-align:right; white-space:nowrap; font-size:11.5px; }
@media (max-width:760px){ .nov-row{ grid-template-columns:auto 1fr auto; } .nov-desc,.nov-date{ display:none; } }
/* Novedades — movimientos agrupados por cliente: fila-resumen (nov-grp) + detalle expandible (nov-detail) */
.nov-caret{ text-align:right; color:var(--grey-warm); transition:transform .18s ease; }
.nov-grp[aria-expanded="true"] .nov-caret{ transform:rotate(180deg); }
.nov-detail{ padding:2px 8px 10px 26px; }
.nov-drow{ display:grid; grid-template-columns:auto 2fr auto auto; gap:10px; align-items:center; padding:5px 0; font-size:12.5px; }
.nov-drow.nov-in .nov-dir{ color:var(--pos,#2f7d4f); }
.nov-drow.nov-out .nov-dir{ color:var(--neg,#b0472f); }
.novd-desc{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--grey-warm); }
.novd-amt{ font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.novd-date{ text-align:right; white-space:nowrap; font-size:11px; color:var(--grey-warm); }
.nov-more{ display:inline-block; margin-top:7px; font-size:12px; color:var(--gold); text-decoration:none; }
.nov-more:hover{ color:var(--gold-deep); }
@media (max-width:760px){ .nov-grp{ grid-template-columns:auto 1fr auto auto; } .nov-drow{ grid-template-columns:auto 1fr auto; } .novd-date{ display:none; } }
/* #6 gráfico AUM vs capital: selector de período + wrap */
.cap-card .cap-periods{ margin-left:auto; display:inline-flex; gap:4px; }
.dash-chart-wrap{ margin-top:8px; }
.dash-chart-wrap .dash-chart{ width:100%; height:auto; }
/* #11 mis umbrales de alertas */
.mth-grid{ display:flex; flex-direction:column; gap:2px; }
.mth-row{ display:flex; align-items:center; gap:12px; padding:8px 4px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.mth-row:last-child{ border-bottom:0; }
.mth-lbl{ flex:1 1 160px; font-weight:500; font-size:13px; }
.mth-flds{ display:flex; gap:10px; flex-wrap:wrap; }
.mth-fld{ display:inline-flex; flex-direction:column; font-size:11px; color:var(--grey-warm); gap:3px; }
.mth-in{ width:96px; padding:5px 8px; border:1px solid var(--line); border-radius:var(--r); background:var(--field-bg,var(--panel)); color:var(--ink); font-variant-numeric:tabular-nums; }
/* #10 acciones de contacto */
.contact-actions{ display:flex; gap:8px; flex-wrap:wrap; }
/* #4 notas internas del paquete de reunión */
.pkg-notes{ display:flex; flex-direction:column; gap:8px; }
.pkg-note{ padding:6px 0; border-bottom:1px solid var(--line); font-size:12.5px; }
.pkg-note:last-child{ border-bottom:0; }

/* Passkeys (ingreso biométrico) — lista de dispositivos en Ajustes → Seguridad */
.pk-list{ list-style:none; margin:8px 0 4px; padding:0; display:flex; flex-direction:column; gap:6px; }
.pk-item{ display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--r,12px); background:var(--field-bg,transparent); }
.pk-item .pk-name{ font-weight:600; }
.pk-item .pk-meta{ color:var(--muted); font-size:12px; margin-left:auto; }
.pk-item .pk-del{ margin-left:8px; }

/* Checkbox "activar ingreso biométrico" en el login */
.login-check{ display:flex; align-items:flex-start; gap:8px; font-size:13px; color:var(--muted,#8a8a8a); margin:2px 0 4px; cursor:pointer; line-height:1.35; }
.login-check input{ margin-top:2px; flex:0 0 auto; }

/* ---- Contraseña con "ojo" para verla (2026-09-20) ---- */
.pw-wrap{position:relative;display:block}
.pw-wrap input{width:100%;box-sizing:border-box;padding-right:44px}
.pw-eye{position:absolute;top:50%;right:4px;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;padding:0;border:0;border-radius:var(--r-pill,999px);background:none;color:var(--grey-warm);cursor:pointer}
.pw-eye:hover{color:var(--ink)}
.pw-eye[aria-pressed="true"]{color:var(--gold-deep)}
.pw-eye:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.pw-eye .icn{display:block}

/* ---- Perfil: edición del admin (teléfono / tarjeta de débito) + listado de tarjetas (2026-09-16) ---- */
.prof-edit-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 18px 14px;font-size:13px}
.dc-pill{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600;border:1px solid currentColor;white-space:nowrap}
.dc-pedida{color:var(--info,#8FB0D8)}
.dc-entregada{color:var(--gold-text,var(--gold))}
.dc-activa{color:var(--ok,#6FC28C)}
.dc-cancelada{color:var(--grey-warm)}
/* Tarjetas Sí/No y estado del W8 (2026-09-19). Sin rojo/verde: el vencido se marca relleno, no con color. */
.yn-si{color:var(--gold-text,var(--gold))}
.yn-no{color:var(--grey-warm);border-style:dashed}
.w8-ok{color:var(--gold-text,var(--gold))}
.w8-soon{color:var(--warn,#b8923f)}
.w8-expired{color:#1a140c;background:var(--warn,#E2C58C);border-color:var(--warn,#E2C58C)}
.w8-no,.w8-none,.w8-nodate{color:var(--grey-warm);border-style:dashed}
.msg-filters{flex-wrap:wrap;gap:8px;margin:0 0 12px}
.dc-chips{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 14px;font-size:13px}
.dc-chips .dc-n{font-variant-numeric:tabular-nums;margin-right:4px}
.dc-sep{width:1px;height:16px;background:var(--line);margin:0 6px}
.pc-list{display:grid;gap:6px;margin-top:6px}
.pc-item{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r,10px);background:var(--panel);color:var(--ink);font:inherit;cursor:pointer}
.pc-item:hover,.pc-item:focus-visible{border-color:var(--gold)}
.cp-wrap input[type=search]{width:100%;margin-top:5px}
.an-cli-search{margin:0 0 12px}
.an-cli-search .si svg{display:block}