/* Componentes de las pantallas migradas. El producto se declara en su plantilla. */
body[data-producto]:not([data-producto=""]) {
  --accent: var(--vy-acento-texto); --accent-blue: var(--vy-acento-texto);
  --accent-purple: var(--vy-acento-texto); --accent-cyan: var(--vy-acento-texto);
  --accent-orange: var(--vy-aviso); --accent-green: var(--vy-exito); --accent-red: var(--vy-peligro);
  --accent-blue-glow: transparent; --accent-purple-glow: transparent;
  --accent-orange-glow: transparent; --accent-green-glow: transparent;
  --blue: var(--vy-acento-texto); --blue-light: var(--vy-acento-texto);
  --bg-primary: var(--vy-superficie); --bg-secondary: var(--vy-superficie-alta);
}
html body[data-producto]:not([data-producto=""]) :is(.page-title, h1) { font-family: var(--vy-f-texto); font-weight: 500; letter-spacing: -.035em; -webkit-text-fill-color: currentColor; background-image: none; }
html body[data-producto]:not([data-producto=""]) :is(.stat-value, .stat-num, .metric-value, .metric-num, .kpi-num, .dash-card-num) { font-family: var(--vy-f-mono); font-weight: 300; font-variant-numeric: tabular-nums; color: var(--vy-tinta); letter-spacing: -.04em; }
html body[data-producto]:not([data-producto=""]) :is(.tab.active, .tab-btn.active, .seg-btn.active, .filter-pill.active) { background: var(--vy-acento); color:var(--vy-sobre-acento); border-color: transparent; box-shadow: none; }
html body[data-producto]:not([data-producto=""]) :is(.tab-count, .counter, .count-badge) { background: var(--vy-acento); color:var(--vy-sobre-acento); border-radius: var(--vy-forma-contador); font-family: var(--vy-f-mono); }
html body[data-producto]:not([data-producto=""]) .tab.active .tab-count { background: var(--vy-sobre-acento); color: var(--vy-acento); }
html body[data-producto]:not([data-producto=""]) :is(.btn-danger, .btn-danger:hover) { background: var(--vy-peligro-relleno); color:var(--vy-peligro-sobre); border-color: var(--vy-peligro-relleno); }
/* Acciones de borrar chicas (por fila o tarjeta): tinte suave como antes; el rojo relleno queda
   para la acción grande («Eliminar»). */
html body[data-producto]:not([data-producto=""]) .btn-danger.btn-sm { background:var(--vy-peligro-suave); color:var(--vy-peligro); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) .btn-danger.btn-sm:hover { background:var(--vy-peligro-relleno); color:var(--vy-peligro-sobre); border-color:transparent; }
/* Borrar por fila: icono de bote en grafito; el rojo sólo al pasar el cursor. */
html body[data-producto]:not([data-producto=""]) .btn-danger.btn-fila-borrar { background:transparent; color:var(--vy-tinta-tenue); border:1px solid transparent; box-shadow:none; padding:6px; line-height:0; }
html body[data-producto]:not([data-producto=""]) .btn-danger.btn-fila-borrar:hover { background:var(--vy-peligro-suave); color:var(--vy-peligro); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) :is(.chip, .badge):where(:not(.badge-success):not(.badge-warning):not(.badge-danger)) { background: var(--vy-superficie-alta); color: var(--vy-tinta); border: 1px solid var(--vy-linea); }
html body[data-producto]:not([data-producto=""]) :is(.btn-primary, .btn-primary:hover, .btn-mono, .btn-mono:hover) { background: var(--vy-boton-fondo); color: var(--vy-boton-texto); box-shadow: none; }
html body[data-producto]:not([data-producto=""]) :is(.page, .page-wrap, .page-main, .main-content) { min-width: 0; max-width: 100%; }
html body[data-producto]:not([data-producto=""]) :is(.table-wrap, .table-scroll, .table-container, .table-scroll-mobile) { min-width: 0; max-width: 100%; overflow-x: auto; }
html body[data-producto]:not([data-producto=""]) :is(.tabs, .toolbar, .filters) { max-width: 100%; }
@media (max-width: 600px) {
  html body[data-producto]:not([data-producto=""]) :is(.page, .page-wrap, .page-main, .main-content) { padding-inline: 12px; }
  html body[data-producto]:not([data-producto=""]) :is(.modal, .modal-overlay) { padding-inline: 12px; }
  html body[data-producto]:not([data-producto=""]) :is(.page-header, .page-header-actions, .filters, .toolbar) { flex-wrap: wrap; gap: 10px; }
  html body[data-producto]:not([data-producto=""]) :is(.search-input, .search-box) { min-width: 0; max-width: 100%; }
}
/* Sogdia: lista de contactos. */
html body[data-producto="sogdia"] .contactos-table-wrap { overflow-x: auto; max-width: 100%; }
html body[data-producto="sogdia"] .contactos-table { min-width: 0; }
html body[data-producto="sogdia"] .contactos-table tr:hover { background: var(--vy-superficie-alta); }
html body[data-producto="sogdia"] .panel-title { font-weight: 500; }
html body[data-producto="sogdia"] .empty-icon { color: var(--vy-acento-texto); }
/* Statera: cotización y panel personal. */
html body[data-producto="statera"] :is(.cotizador-side-block, .totales-panel, .contacto-seleccionado, .producto-row, .modal-box) { background: var(--vy-superficie); color: var(--vy-tinta); border-color: var(--vy-linea); border-radius: var(--vy-forma-tarjeta); box-shadow: none; }
html body[data-producto="statera"] :is(.tot-total-val, #total-final) { font-family: var(--vy-f-mono); font-weight: 300; color: var(--vy-acento-texto); }
html body[data-producto="statera"] .tot-total-val { font-size: clamp(30px, 4vw, 48px); }
html body[data-producto="statera"] .side-count { background: var(--vy-acento); color:var(--vy-sobre-acento); border-radius: var(--vy-forma-contador); font-family: var(--vy-f-mono); font-weight: 400; }
html body[data-producto="statera"] :is(.precio-status-pending, .sol-resolved) { background: var(--vy-aviso-relleno); color:var(--vy-aviso-sobre); }
html body[data-producto="statera"] :is(.precio-status-ok, .sol-resolved-aprobado) { background: var(--vy-exito-relleno); color:var(--vy-exito-sobre); }
html body[data-producto="statera"] :is(.precio-status-err, .sol-resolved-rechazado) { background: var(--vy-peligro-relleno); color:var(--vy-peligro-sobre); }
html body[data-producto="statera"] #productos-table { overflow-x: auto; max-width: 100%; }
html body[data-producto="statera"] .btn-del { background: transparent; color: var(--vy-tinta-tenue); }
html body[data-producto="statera"] .btn-del:hover { background: var(--vy-peligro-suave); color: var(--vy-peligro); }
@media(max-width: 600px) {
 html body[data-producto="statera"] .cotizador-workspace { grid-template-columns: minmax(0,1fr); }
 html body[data-producto="statera"] .cotizador-sidebar { position: static; max-height: none; }
}
/* Nundina: casos de seguimiento y nutrición. */
html body[data-producto="nundina"] .seguimiento-panel { background: var(--vy-superficie); border: 1px solid var(--vy-linea); border-radius: var(--vy-forma-tarjeta); }
html body[data-producto="nundina"] .seguimiento-panel h2 { font: 500 22px/1.3 var(--vy-f-texto); }
html body[data-producto="nundina"] .seguimiento-caso a { color: var(--vy-acento-texto); }
html body[data-producto="nundina"] .seguimiento-indice { background: var(--vy-tab-fondo); padding: 14px 18px; border: 1px solid var(--vy-tab-borde); border-radius: var(--vy-forma-capsula); }
html body[data-producto="nundina"] .seguimiento-boton { background: var(--vy-boton-fondo); color: var(--vy-boton-texto); border-radius: var(--vy-forma-boton); }
/* Mi día / Equipo hoy (main): el secundario conserva su borde, sin relleno. */
html body[data-producto="nundina"] .seguimiento-boton.sg-secundario { background: transparent; color: var(--vy-tinta); border: 1px solid var(--vy-linea-fuerte); }
html body[data-producto="nundina"] .seguimiento-boton.sg-secundario:hover { border-color: var(--vy-tinta); }
@media(max-width:600px) {
 html body[data-producto="nundina"] .temperatura-main { padding-inline:12px; }
 html body[data-producto="nundina"] .seguimiento-panel { padding:16px; }
}
/* Clepsidra: tareas, proyectos e ideas. Las vistas conservan su visibilidad. */
html body[data-producto="clepsidra"] :is(.workspace, .task-column, .task-card, .project-card, .idea-card, .meq-person, .meqm-card) { background:var(--vy-superficie); border:1px solid var(--vy-linea); border-radius:var(--vy-forma-tarjeta); box-shadow:none; }
html body[data-producto="clepsidra"] .mode-card { background:var(--vy-tab-fondo); color:var(--vy-tinta); border:1px solid var(--vy-tab-borde); box-shadow:none; opacity:1; transform:none; border-radius:var(--vy-forma-capsula); }
html body[data-producto="clepsidra"] .mode-card::before { display:none; }
/* Modo activo en estado sutil: el bloque de color se reserva para el dato vivo. */
html body[data-producto="clepsidra"] .mode-card[aria-selected="true"] { background:var(--vy-acento-suave); color:var(--vy-tinta); border-color:var(--vy-acento); box-shadow:inset 0 0 0 1px var(--vy-acento); }
html body[data-producto="clepsidra"] .mode-card[aria-selected="true"] .mode-title { color:var(--vy-tinta); }
html body[data-producto="clepsidra"] .mode-card[aria-selected="true"] .mode-meta { color:var(--vy-tinta-suave); }
html body[data-producto="clepsidra"] .count-pill { background:var(--vy-acento); color:var(--vy-sobre-acento); font:400 14px/1.2 var(--vy-f-mono); border-radius:var(--vy-forma-contador); }
html body[data-producto="clepsidra"] :is(.hex-title, .idea-title) { color:var(--vy-tinta); }
html body[data-producto="clepsidra"] :is(.ideas-world, .hex-stage) { background:var(--vy-superficie-alta); color:var(--vy-tinta); }
html body[data-producto="clepsidra"] .hex-hint { color:var(--vy-tinta-tenue); }
html body[data-producto="clepsidra"] .meqm-meter { background:var(--vy-linea-fuerte); }
html body[data-producto="clepsidra"] .meqm-dot { background:var(--vy-acento); border-color:var(--vy-superficie);color:var(--vy-sobre-acento);}
html body[data-producto="clepsidra"] :is(.done-pill.ok, .done-pill.late) { background:var(--vy-superficie-alta); color:var(--vy-tinta); }
@media(max-width:600px) {
 html body[data-producto="clepsidra"] .tasks-grid { grid-template-columns:minmax(0,1fr); }
 html body[data-producto="clepsidra"] .view { padding:14px; }
 html body[data-producto="clepsidra"] .task-stack { grid-template-columns:repeat(auto-fit,minmax(min(100%,178px),1fr)); }
}
/* Decuria: expediente, evaluación, vacaciones y flujos personales. */
body[data-producto="decuria"] { --bg:var(--vy-fondo); --card:var(--vy-superficie); --ink:var(--vy-tinta); --muted:var(--vy-tinta-tenue); --line:var(--vy-linea-fuerte); --org-line:var(--vy-linea-fuerte); --seg-off:var(--vy-superficie-alta); --mono:var(--vy-f-mono); }
html body[data-producto="decuria"] :is(.equipo-card, .valor-card, .me-valor, .me-saldo-tile, .me-panel, .me-persona, .card, dialog) { border-radius:var(--vy-forma-tarjeta); border-color:var(--vy-linea); background:var(--vy-superficie); }
html body[data-producto="decuria"] :is(.me-saldo-tile .n, .me-score, .metric-value, .rhc-score-chip) { font:300 clamp(28px,4vw,54px)/1.1 var(--vy-f-mono); color:var(--vy-tinta); }
html body[data-producto="decuria"] .me-saldo-tile:first-child .n { color:var(--vy-acento-texto); }
html body[data-producto="decuria"] .me-saldo-tile:first-child .n { font-size:64px; letter-spacing:-.06em; }
html body[data-producto="decuria"] :is(.me-name, .me-valor-nombre) { font-weight:500; color:var(--vy-tinta); }
html body[data-producto="decuria"] :is(.me-badge.pendiente) { background:var(--vy-aviso-relleno); color:var(--vy-aviso-sobre); }
html body[data-producto="decuria"] .me-badge.aprobada { background:var(--vy-exito-relleno); color:var(--vy-exito-sobre); }
html body[data-producto="decuria"] :is(.me-badge.rechazada, .me-badge.cancelada) { background:var(--vy-peligro-relleno); color:var(--vy-peligro-sobre); }
html body[data-producto="decuria"] :is(.me-badge, .lider-badge, .ext-badge) { border-radius:var(--vy-forma-chip); font-family:var(--vy-f-mono); padding:3px 8px; }
html body[data-producto="decuria"] .day { color:var(--vy-tinta); }
html body[data-producto="decuria"] .day.selected { background:var(--vy-acento); color:var(--vy-sobre-acento); }
html body[data-producto="decuria"] :is(nav, .org-tabs) { flex-wrap:wrap; }
html body[data-producto="decuria"] dialog { max-width:calc(100vw - 24px); }
html body[data-producto="decuria"] progress { accent-color:var(--vy-acento); }
html body[data-producto="decuria"] .calendar .day { border-radius:0; }
@media(max-width:600px) {
 html body[data-producto="decuria"] :is(main.rh-page, main.me-page) { padding-inline:12px; }
 html body[data-producto="decuria"] main.me-page .me-valores { margin-inline:-12px; padding-inline:12px; scroll-padding-inline:12px; }
 html body[data-producto="decuria"] .me-who { min-width:0; }
 html body[data-producto="decuria"] :is(.grid, .me-valores) { grid-template-columns:minmax(0,1fr); }
}
/* Praeco: campañas, mailing y prospección. Se conserva el lienzo de las piezas. */
body[data-producto="praeco"] {
 --mk-bg:var(--vy-fondo); --mk-card:var(--vy-superficie); --mk-line:var(--vy-linea-fuerte); --mk-text:var(--vy-tinta); --mk-muted:var(--vy-tinta-tenue); --mk-soft:var(--vy-superficie-alta); --mk-accent:var(--vy-acento-texto); --mk-blue:var(--vy-acento-texto); --mk-green:var(--vy-exito); --mk-red:var(--vy-peligro);
 --pw-bg:var(--vy-fondo); --pw-card:var(--vy-superficie); --pw-line:var(--vy-linea-fuerte); --pw-text:var(--vy-tinta); --pw-muted:var(--vy-tinta-tenue); --pw-soft:var(--vy-superficie-alta); --pw-accent:var(--vy-acento-texto); --pw-green:var(--vy-exito); --pw-red:var(--vy-peligro); --pw-yellow:var(--vy-aviso);
}
html body[data-producto="praeco"] :is(.mk-btn.primary, .pw-btn.primary, .mg-send-btn) { background:var(--vy-boton-fondo); color:var(--vy-boton-texto); box-shadow:none; }
html body[data-producto="praeco"] :is(.mk-stat, .mk-panel, .pw-card, .pw-panel, .feed-card) { border-radius:var(--vy-forma-tarjeta); border-color:var(--vy-linea); box-shadow:none; }
html body[data-producto="praeco"] :is(.mk-stat strong, .pw-stat strong) { font:300 36px/1.1 var(--vy-f-mono); color:var(--vy-tinta); }
html body[data-producto="praeco"] #segCount { font:300 36px/1.1 var(--vy-f-mono); color:var(--vy-tinta); }
html body[data-producto="praeco"] :is(.mk-stats, .pw-stats) > :first-child strong { color:var(--vy-acento-texto); }
html body[data-producto="praeco"] :is(.mk-tab.active, .pw-tab.active) { background:var(--vy-acento); color:var(--vy-sobre-acento); border-radius:var(--vy-forma-chip); border-color:transparent; }
/* Marketing (6-oct, Leo): la pestaña activa (relleno azul) iba pegada a la línea delgada de abajo;
   aire entre las pestañas y la línea, sin mover la línea ni el contenido. */
html body[data-producto="praeco"] .mk-tabs { padding:2px 2px 10px; align-items:center; }
html body[data-producto="praeco"] :is(.mk-table-wrap, .pw-table-wrap) { max-width:100%; overflow-x:auto; }
html body[data-producto="praeco"] :is(.mk-eyebrow, .pw-eyebrow) { color:var(--vy-acento-texto); font-family:var(--vy-f-mono); }
@media(max-width:600px) {
 html body[data-producto="praeco"] :is(.mk-page, .pw-page) { padding-inline:12px; }
 html body[data-producto="praeco"] :is(.mk-grid, .pw-grid, .mk-row, .pw-row) { grid-template-columns:minmax(0,1fr); }
 html body[data-producto="praeco"] .mk-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
 html body[data-producto="praeco"] :is(.mk-hero, .pw-hero) { flex-wrap:wrap; }
}
/* Administración sin acento de producto: solo roles neutros de Instrumento. */
[data-producto="neutro"] { --vy-acento:var(--vy-boton-fondo); --vy-sobre-acento:var(--vy-boton-texto); --vy-acento-texto:var(--vy-tinta); --vy-acento-suave:var(--vy-superficie-alta); }
/* Estas reglas solo alcanzan accesos y paneles internos que reutilizan el CSS público. */
body.vyron-public[data-producto] {
 --vyron-bg-base:var(--vy-fondo); --vyron-bg-elevated:var(--vy-superficie-alta); --vyron-bg-card:var(--vy-superficie); --vyron-bg-card-hover:var(--vy-superficie-alta);
 --vyron-border:var(--vy-linea); --vyron-border-active:var(--vy-linea-fuerte); --vyron-border-glow:var(--vy-linea-fuerte);
 --vyron-text-primary:var(--vy-tinta); --vyron-text-secondary:var(--vy-tinta-suave); --vyron-text-tertiary:var(--vy-tinta-tenue);
 --vyron-silver:var(--vy-tinta); --vyron-beam:var(--vy-linea); --vyron-shadow-card:0 4px 16px rgb(0 0 0 / .12);
 --vyron-font-display:var(--vy-f-texto); --vyron-font-body:var(--vy-f-texto); --vyron-radius:var(--vy-forma-tarjeta);
}
html body.vyron-public[data-producto]::before,
html body.vyron-public[data-producto] :is(.vyron-admin-hero__glow, .vyron-beam, .vyron-orbit, .vyron-glow) { display:none; }
html body.vyron-public[data-producto] :is(.vyron-btn, .vyron-btn:hover) { background:var(--vy-superficie); color:var(--vy-tinta); border:1px solid var(--vy-linea-fuerte); border-radius:var(--vy-forma-boton); box-shadow:none; }
html body.vyron-public[data-producto] :is(.vyron-btn-primary, .vyron-btn-primary:hover) { background:var(--vy-boton-fondo); color:var(--vy-boton-texto); border-color:var(--vy-boton-fondo); }
html body.vyron-public[data-producto] :is(.vyron-nav, .vyron-login-card, .vyron-admin-stat, .vyron-admin-lead, .vyron-admin-roadmap, .vyron-admin-hero, .vyron-admin-table-wrap, .vyron-admin-transcript__msg, .pd-card, .pp-card) { background:var(--vy-superficie); color:var(--vy-tinta); border-color:var(--vy-linea); box-shadow:none; }
html body.vyron-public[data-producto] :is(.vyron-login-card, .vyron-admin-stat, .vyron-admin-lead, .vyron-admin-hero, .pd-card, .pp-card) { border-radius:var(--vy-forma-tarjeta); }
html body.vyron-public[data-producto] .vyron-admin-stat strong { font:300 clamp(32px,4vw,54px)/1.15 var(--vy-f-mono); color:var(--vy-tinta); }
html body.vyron-public[data-producto] .vyron-admin-stat:first-of-type strong { color:var(--vy-acento-texto); }
html body.vyron-public[data-producto] :is(.vyron-admin-user-pill, .vyron-admin-badge, .vyron-code-pill) { background:var(--vy-superficie-alta); color:var(--vy-tinta); font-family:var(--vy-f-mono); border-color:var(--vy-linea); }
html body.vyron-public[data-producto] :is(.vyron-nav, .vyron-nav-actions) { flex-wrap:wrap; }
html body.vyron-public[data-producto] :is(.vyron-admin-table-wrap, .pd-table-wrap) { overflow-x:auto; max-width:100%; }
html body.vyron-public[data-producto] .vyron-login-main { min-width:0; width:100%; }
html body.vyron-public[data-producto] .vyron-login-card { width:min(100%,480px); }
html body.vyron-public[data-producto] :is(.vyron-login-card::before, .vyron-login-card::after, .vyron-tenant-logo::before) { background:none; box-shadow:none; }
html body.vyron-public[data-producto] .vyron-tenant-logo { background:var(--vy-superficie-alta); }
html body.vyron-public[data-producto] .vyron-rocket { animation:none; filter:none; }
html body.vyron-public[data-producto] :is(.vyron-code-input, #otp_code) { font-family:var(--vy-f-mono); font-weight:300; }
html body.vyron-public[data-producto] :is(.vyron-alert-error, .vyron-error) { background:var(--vy-peligro-suave); color:var(--vy-peligro); border-color:var(--vy-peligro); }
html body[data-producto="neutro"] .hub-card { background:var(--vy-superficie); border:1px solid var(--vy-linea); border-radius:var(--vy-forma-tarjeta); }
@media(max-width:600px) {
 html body.vyron-public[data-producto] :is(.vyron-nav, .vyron-wrap, .vyron-login-main) { padding-inline:12px; }
 html body.vyron-public[data-producto] :is(.vyron-admin-stats, .vyron-admin-stats--bento, .vyron-admin-lead__grid, .pd-kv) { grid-template-columns:minmax(0,1fr); }
 html body.vyron-public[data-producto] .vyron-login-card { padding:24px 18px; }
 html body.vyron-public[data-producto] .vyron-nav-actions { gap:8px; }
 html body.vyron-public[data-producto] .vyron-nav-actions a { white-space:normal; }
}
/* Revisión transversal de estados, accesibilidad y ancho reducido. */
html body[data-producto]:not([data-producto=""]) :is(.chip.green, .chip-green, .chip-cliente, .badge.ok) { background:var(--vy-exito-relleno); color:var(--vy-exito-sobre); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) :is(.chip.red, .chip-red, .badge.error) { background:var(--vy-peligro-relleno); color:var(--vy-peligro-sobre); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) :is(.chip.orange, .chip-yellow, .badge.pending) { background:var(--vy-aviso-relleno); color:var(--vy-aviso-sobre); border-color:transparent; }
/* Contactos: tipo de contacto en tinte suave, como antes (informativo, no sello). */
html body[data-producto]:not([data-producto=""]) .chip.chip-prospecto { background:var(--vy-acento-suave); color:var(--vy-acento-texto); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) .chip.chip-cliente { background:var(--vy-exito-suave); color:var(--vy-exito); border-color:transparent; }
html body[data-producto]:not([data-producto=""]) :is(.modal-overlay, .sintesis-modal, .crop-overlay, .notif-scrim, .nav-scrim) { background:var(--vy-velo); }
html body[data-producto] dialog::backdrop { background:var(--vy-velo); }
html body[data-producto] :is(.puerta-btn.active, .opcion-btn.active) { background:var(--vy-acento); color:var(--vy-sobre-acento); border-color:transparent; }
html body[data-producto="museion"] :is(.panel, .ficha-card, .carpeta-card, .chat-container) { border:1px solid var(--vy-linea); border-radius:var(--vy-forma-tarjeta); box-shadow:none; }
html body[data-producto="museion"] .chat-header { background:var(--vy-superficie-alta); color:var(--vy-tinta); border-bottom:1px solid var(--vy-linea); }
html body[data-producto="museion"] .chat-bubble.user { background:var(--vy-acento-suave); color:var(--vy-acento-texto); }
html body[data-producto="museion"] .chat-input-bar button { background:var(--vy-boton-fondo); color:var(--vy-boton-texto); }
html body[data-producto="museion"] .puerta-btn .emoji { color:inherit; }
html body[data-producto="hiparco"] :is(.asesor-name, .asesor-page h2) { font-weight:500; }
html body[data-producto="hiparco"] :is(.dash-kpi-val, .asesor-stat-value, .meqm-chip) { font-family:var(--vy-f-mono); font-weight:300; }
html body[data-producto="hiparco"] .bar-track { background:var(--vy-superficie-alta); }
html body[data-producto="hiparco"] .meqm-bar { background:var(--vy-linea-fuerte); }
html body[data-producto="hiparco"] .meqm-dot { background:var(--vy-acento); border-color:var(--vy-superficie); }
html body[data-producto="symbolon"] .metric-tile .num { font:300 40px/1.1 var(--vy-f-mono); color:var(--vy-tinta); }
html body[data-producto="symbolon"] .metric-tile:first-child .num { color:var(--vy-acento-texto); }
html body[data-producto] .file-picker { border-color:var(--vy-linea-fuerte); }
html body[data-producto] .file-picker button { border-color:var(--vy-linea-fuerte); color:var(--vy-tinta); }
html body[data-producto] .file-picker small { color:var(--vy-tinta-tenue); opacity:1; }
html body[data-producto] :is(.modal-close, .eq-item-del) .vy-icon { width:20px; height:20px; }
html body[data-producto] .topbar-nav { padding:4px; background:var(--vy-tab-fondo); border:1px solid var(--vy-tab-borde); }
html body[data-producto] :is(.login-card, .vyron-login-card) { border:1px solid var(--vy-linea); border-radius:var(--vy-forma-tarjeta); box-shadow:none; }
@media(max-width:600px) {
 html body[data-producto] :is(.vy-page, .asesor-page, .gafete-page) { padding-inline:12px; }
 html body[data-producto] :is(.asesor-header, .chat-header, .filtros, .puertas) { flex-wrap:wrap; }
 html body[data-producto] :is(.carpeta-grid, .metric-row) { grid-template-columns:minmax(0,1fr); }
 html body[data-producto] :is(.chat-input-bar, .link-share) { min-width:0; }
 html body[data-producto] .chat-input-bar textarea { min-width:0; }
 html body[data-producto] .crop-canvas-wrap { max-width:100%; }
 html body[data-producto] .asesor-page [style*="grid-template-columns:140px 1fr 50px"] { grid-template-columns:minmax(0,1fr) minmax(0,1fr) 40px !important; }
 html body[data-producto] .login-card { max-width:100%; padding:24px 18px; }
 html body[data-producto] .topbar-nav { padding:10px; }
}
html body[data-producto] :is(.pd-kv dt, .pd-nodata, .pd-form label, .pp-form label, .pp-cat h2 small, .pp-thumb span, .nota-label span) { opacity:1; color:var(--vy-tinta-tenue); }
html body[data-producto] .cal-chip.hecha { opacity:1; color:var(--vy-tinta-tenue); }
html body[data-producto] :is(.pd-box, #aDet-cotizaciones, #aDet-top-pet, #aDet-top-pead, #aDet-top-tapas, #dash-top-pet, #dash-top-pead, #dash-top-tapas, #dash-asesores) { min-width:0; max-width:100%; overflow-x:auto; }
@media(max-width:600px) {
 html body[data-producto] .form-row[style*="grid-template-columns"] { grid-template-columns:minmax(0,1fr) !important; }
 html body[data-producto] .datos-grid { grid-template-columns:minmax(0,1fr); }
 html body[data-producto] .toast { max-width:calc(100vw - 32px); overflow-wrap:anywhere; }
}
html body.vyron-public[data-producto] .vyron-tenant-mark { background:var(--vy-superficie-alta); color:var(--vy-tinta); border:1px solid var(--vy-linea); box-shadow:none; }
html body.vyron-public[data-producto] .vyron-alert-success { background:var(--vy-exito-suave); color:var(--vy-exito); border-color:var(--vy-exito); }
html body.vyron-public[data-producto] :is(.vyron-admin-badge--ia, .vyron-admin-transcript__msg--user) { color:var(--vy-tinta); border-color:var(--vy-linea-fuerte); }
html body.vyron-public[data-producto] :is(code, .vyron-hint code) { font-family:var(--vy-f-mono); color:var(--vy-tinta); background:var(--vy-superficie-alta); }
html body[data-producto] .demo-rh p { opacity:1; color:var(--vy-tinta-suave); }
html body[data-producto].vyron-login-page #theme-toggle,
html body[data-producto].login-page #theme-toggle { position:fixed; top:16px; right:16px; z-index:60; }
@media(max-width:600px) {
 html body.vyron-public[data-producto] :is(.vyron-form-row, .vyron-onboard-result dl) { grid-template-columns:minmax(0,1fr); }
 html body.vyron-public[data-producto] .vyron-admin-main { padding-top:24px; }
}
html body[data-producto="praeco"] .tray-send { background:var(--vy-boton-fondo); color:var(--vy-boton-texto); }
html body[data-producto="praeco"] .tray-badge { background:var(--vy-acento); color:var(--vy-sobre-acento); }
html body[data-producto="chasqui"] .chip.mal { background:var(--vy-peligro-suave); color:var(--vy-peligro); border-color:var(--vy-peligro); }
html body.vyron-public[data-producto] .vyron-tenant-mark__letter { color:var(--vy-tinta); }
html body.vyron-public[data-producto] .vyron-hero-logo::before { background:none; }
html body[data-producto] :is(.lm-btn.primary, .lm-btn.primary:hover, .f1a1-btn, .f1a1-btn:hover, .btn-success, .btn-success:hover, .btn-whatsapp, .btn-whatsapp:hover) { background:var(--vy-boton-fondo); color:var(--vy-boton-texto); border-color:var(--vy-boton-fondo); box-shadow:none; }
html body.vyron-public[data-producto] .vyron-admin-stat--muted { opacity:1; }
html body.vyron-public[data-producto] .vyron-hero-glow { display:none; }
html body.vyron-public[data-producto] .vyron-lead-detail__backdrop { background:var(--vy-velo); }
html body[data-producto="praeco"] .tile-badge { width:28px; height:28px; padding:4px; border-radius:var(--vy-forma-chip); background:var(--vy-grafito-950); color:var(--vy-grafito-0); opacity:1; filter:none; }

/* Color por asesor (Leo, 6-oct-2026): cada asesor con su tono en Contactos (lista y ficha).
   El índice (data-asesor-color, 0-9) lo pone el servidor (app.asesor_color) o vfbAsesorColor()
   en el navegador; los tonos son --vy-as-N de vfb-paleta.css (texto AA en claro y oscuro).
   El color nunca va solo: el nombre del asesor siempre está escrito. */
.vfb-asesor { --as: var(--vy-tinta-tenue); --as-texto: var(--vy-tinta-suave); --as-suave: var(--vy-superficie-alta); }
.vfb-asesor[data-asesor-color="0"] { --as: var(--vy-as-0); --as-texto: var(--vy-as-0-texto); --as-suave: var(--vy-as-0-suave); }
.vfb-asesor[data-asesor-color="1"] { --as: var(--vy-as-1); --as-texto: var(--vy-as-1-texto); --as-suave: var(--vy-as-1-suave); }
.vfb-asesor[data-asesor-color="2"] { --as: var(--vy-as-2); --as-texto: var(--vy-as-2-texto); --as-suave: var(--vy-as-2-suave); }
.vfb-asesor[data-asesor-color="3"] { --as: var(--vy-as-3); --as-texto: var(--vy-as-3-texto); --as-suave: var(--vy-as-3-suave); }
.vfb-asesor[data-asesor-color="4"] { --as: var(--vy-as-4); --as-texto: var(--vy-as-4-texto); --as-suave: var(--vy-as-4-suave); }
.vfb-asesor[data-asesor-color="5"] { --as: var(--vy-as-5); --as-texto: var(--vy-as-5-texto); --as-suave: var(--vy-as-5-suave); }
.vfb-asesor[data-asesor-color="6"] { --as: var(--vy-as-6); --as-texto: var(--vy-as-6-texto); --as-suave: var(--vy-as-6-suave); }
.vfb-asesor[data-asesor-color="7"] { --as: var(--vy-as-7); --as-texto: var(--vy-as-7-texto); --as-suave: var(--vy-as-7-suave); }
.vfb-asesor[data-asesor-color="8"] { --as: var(--vy-as-8); --as-texto: var(--vy-as-8-texto); --as-suave: var(--vy-as-8-suave); }
.vfb-asesor[data-asesor-color="9"] { --as: var(--vy-as-9); --as-texto: var(--vy-as-9-texto); --as-suave: var(--vy-as-9-suave); }
html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-chip[data-asesor-color] { display:inline-flex; align-items:center; gap:8px; background:var(--as-suave); color:var(--as-texto); border:1px solid color-mix(in srgb, var(--as) 45%, transparent); border-radius:999px; font-weight:600; }
html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-chip[data-asesor-color]::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--as); flex:none; }
/* Aire en la burbuja del asesor (Leo, 6-oct-2026: «se ve muy apretada»). Antes: 3 px arriba y abajo en la
   lista y 0 px en la ficha (allí no había .chip que le diera relleno). Ahora el mismo relleno, alto de línea y
   alto mínimo en lista, ficha y autores de notas. El nombre nunca se corta: en pantallas angostas puede bajar
   a una segunda línea dentro de la burbuja en vez de salirse de la fila. */
html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-chip[data-asesor-color] { box-sizing:border-box; min-height:28px; padding:5px 13px 5px 11px; line-height:1.35; max-width:100%; vertical-align:middle; }
@media (max-width: 640px) {
  html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-chip[data-asesor-color] { white-space:normal; overflow-wrap:anywhere; text-align:left; }
}
html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-punto { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--as); vertical-align:middle; margin-right:6px; flex:none; }
html body[data-producto]:not([data-producto=""]) .vfb-asesor.vfb-asesor-punto:not([data-asesor-color]) { display:none; }

/* Filtros de temperatura (Contactos y Marketing): la opción elegida pinta el filtro con su color. */
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura):has(option[value="caliente"]:checked) { --tp:var(--vy-temp-caliente); --tp-texto:var(--vy-temp-caliente-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura) option[value="caliente"] { color:var(--vy-temp-caliente-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura):has(option[value="templado"]:checked) { --tp:var(--vy-temp-templado); --tp-texto:var(--vy-temp-templado-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura) option[value="templado"] { color:var(--vy-temp-templado-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura):has(option[value="frio"]:checked) { --tp:var(--vy-temp-frio); --tp-texto:var(--vy-temp-frio-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura) option[value="frio"] { color:var(--vy-temp-frio-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura):has(option[value="cliente"]:checked) { --tp:var(--vy-temp-cliente); --tp-texto:var(--vy-temp-cliente-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura) option[value="cliente"] { color:var(--vy-temp-cliente-texto); }
html body[data-producto] select:is(#filtro-temperatura,#segTemperatura):is(:has(option[value="caliente"]:checked),:has(option[value="templado"]:checked),:has(option[value="frio"]:checked),:has(option[value="cliente"]:checked)) { color:var(--tp-texto); border-color:var(--tp); box-shadow:inset 4px 0 0 var(--tp); font-weight:600; }

/* Pantallas anchas (Leo, 6-oct-2026, Mac Studio: «mucho espacio perdido a los lados»).
   La mayoría de las pantallas del CRM ya usan todo el ancho (main con max-width:100% de
   instrumento-v2.css y 32 px de margen). Las que se quedaban angostas en monitores grandes
   (Ejecución a 1640 px; Mi día, Equipo hoy, Revisión y Nutrición a 1100-1180 px) se abren
   desde 1600 px al mismo ancho útil que las demás: todo menos 32 px por lado. Debajo de
   1600 px (laptops, tabletas y celular) nada cambia. */
@media (min-width: 1600px) {
  html body[data-producto] main.shell { width: calc(100% - 64px); max-width: none; }
  html body[data-producto] :is(.temperatura-main, .seguimiento-main) { max-width: none; }
}