/* ══════════════════════════════════════════════════════════════════════
   AVANCE FÍSICO (#sec-avance) · vestido con las vistas modelo de la norma
   ──────────────────────────────────────────────────────────────────────
   La rama ui/figma no dibujó esta vista (inventario 1 §4: marcado, CSS y JS
   idénticos a la base). No hay frame propio: cada bloque copia el componente
   de su modelo de la §1 de criterios-ui-esparq, con sus mismas partes (G08),
   tomando los valores ya portados por las vistas migradas:

     Encabezado     ≡ Encabezado de vista (Programación Meta / APU's / MO, G12):
                      tarjeta blanca, título 24/28 y descripción 14/22.
     Pestañas       ≡ Cronograma (D03, 759:1245) = Registro de Inspecciones
                      (788:4074): 16/24, activa en blue-300 con filete de 2.
     Cifras         ≡ Capacitaciones › Indicadores (kpi-card): rótulo, cifra
                      contra su referencia al mismo tamaño (G13), pie con la
                      variación ▲/▼ y el chip de estado.
     Estado frente  ≡ Resumen › Frentes de obra (680:8195).
     Tablas / lista ≡ Registro de Inspecciones (lista en su tarjeta 684:8909,
                      cabecera 684:8910, tabla 788:3835/3845).
     Avisos         ≡ banner del Reporte Gerencial (alert-banner 264:331).
     Botones        ≡ pastilla de RFI/SIG (684:8954 borde, 684:8956 azul), G05.

   CÓMO CONVIVE CON EL CSS DE MAIN. Main inyecta sus estilos por JS
   (avanceViewInjectStyles, avCronoEstilos y avMetodoEstilos) y una prueba
   (pruebas/avance/corte-reservas-auditor) exige que las reglas del corte sigan
   en el inyector. No se toca: aquí todo va con un id más (#sec-avance delante
   del id de la subvista), así que gana por especificidad sin depender del
   orden. Donde la «unificación tipográfica» global lleva !important
   (.kpi-*, .chart-title, .section-header, .vel-metric-*), aquí también.

   Colores: variables de assets/ui/tokens.css (G02). Sombras con color-mix
   sobre --gray-9. Los colores de la leyenda del registro (AV_LEYENDA) y de
   las barras de las gráficas son DATO (copia de la leyenda del Excel y de
   COLORS de main): no se tocan.
   ══════════════════════════════════════════════════════════════════════ */

#sec-avance{ font-family:'Inter',system-ui,sans-serif; --avf-sombra:0 1px 4px color-mix(in srgb,var(--gray-9) 6%,transparent); }
#sec-avance :is(.avf-cab,.avf-card,.avf-lista,.avf-kpi) *{ box-sizing:border-box; }

/* ── Encabezado de vista (G12) + pestañas (D03) ───────────────────────── */
#sec-avance .avf-cab{ display:flex; flex-direction:column; background:var(--gray-1); border-radius:12px;
  box-shadow:var(--avf-sombra); margin:0 0 16px; }
#sec-avance .avf-cab-fila{ display:flex; align-items:center; gap:16px; padding:16px 20px 8px; }
#sec-avance .avf-cab-tit{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:4px; }
#sec-avance .avf-cab-h{ margin:0 !important; font:700 24px/28px 'Inter',sans-serif !important; color:var(--gray-9) !important;
  letter-spacing:0 !important; text-transform:none !important; }
/* El h2 lleva `section-header` solo para el recorrido guiado: fuera la barra azul y el margen globales (G12). */
#sec-avance .avf-cab-h.section-header{ display:block; }
#sec-avance .avf-cab-h.section-header::before{ display:none !important; content:none !important; }
#sec-avance .avf-cab-sub{ margin:0; font:400 14px/22px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-cab-sub b{ font-weight:600; color:var(--gray-7); }

#sec-avance .avf-tabs.presup-subtabs{ display:flex; flex-wrap:nowrap; gap:0; margin:0; padding:8px 20px 0; border:0;
  box-shadow:inset 0 -2px 0 var(--blue-50); overflow-x:auto; scrollbar-width:none; }
#sec-avance .avf-tabs .presup-subtab{ flex:none; margin:0; padding:8px 12px; border:0; border-radius:0; background:none;
  box-shadow:inset 0 -2px 0 var(--gray-2); font:400 16px/24px 'Inter',sans-serif; color:var(--gray-6);
  white-space:nowrap; cursor:pointer; letter-spacing:0; text-transform:none; }
#sec-avance .avf-tabs .presup-subtab:hover{ color:var(--gray-7); }
#sec-avance .avf-tabs .presup-subtab.active{ color:var(--blue-300); font-weight:600; box-shadow:inset 0 -2px 0 var(--blue-300); }
#sec-avance .avf-tabs .presup-subtab:focus-visible{ outline:2px solid var(--blue-300); outline-offset:-2px; }

/* ── Tarjeta de bloque (G09): blanca, radio 12, sombra suave ──────────── */
#sec-avance .avf-card{ background:var(--gray-1) !important; border:0 !important; border-radius:12px !important;
  box-shadow:var(--avf-sombra) !important; padding:20px 24px !important; margin:0 0 16px !important; min-width:0; }
#sec-avance .avf-card-cab{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px 16px; flex-wrap:wrap; margin:0 0 16px; }
#sec-avance .avf-card-tit{ flex:1 1 280px; min-width:0; }
#sec-avance .avf-card-h{ margin:0; font:700 16px/22px 'Inter',sans-serif; color:var(--gray-7); letter-spacing:0; text-transform:none; }
#sec-avance .avf-card-sub{ margin:4px 0 0; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-vacio{ padding:16px; border-radius:8px; background:var(--gray-2); font:400 13px/20px 'Inter',sans-serif; color:var(--gray-6); }

/* Chips de estado (G02: fondo tenue + texto de color, el mismo estado el mismo chip) */
#sec-avance .avf-chip{ display:inline-flex; align-items:center; padding:3px 10px; border-radius:12px; white-space:nowrap;
  font:600 12px/18px 'Inter',sans-serif; letter-spacing:0; text-transform:none; }
#sec-avance .avf-chip.ok{ background:var(--green-50); color:var(--green-500); }
#sec-avance .avf-chip.warn{ background:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)); color:var(--orange-500); }
#sec-avance .avf-chip.bad{ background:var(--red-50); color:var(--red-400); }
#sec-avance .avf-chip.info{ background:var(--blue-50); color:var(--blue-400); }
#sec-avance .avf-chip.muted{ background:var(--gray-2); color:var(--gray-6); }

/* Avisos ≡ alert-banner del Reporte Gerencial (264:331): radio 12, relleno 16, icono 18 */
#sec-avance .avf-aviso{ display:flex !important; align-items:flex-start; gap:12px; padding:14px 16px !important; margin:0 0 16px !important;
  border:1px solid var(--gray-1) !important; border-radius:12px !important; font:400 13px/20px 'Inter',sans-serif !important; color:var(--gray-7) !important; }
#sec-avance .avf-aviso b{ font-weight:700; }
#sec-avance .avf-aviso > .avf-ico{ flex:none; width:18px; height:18px; margin-top:1px; }
#sec-avance .avf-aviso.info{ background:var(--blue-50) !important; }
#sec-avance .avf-aviso.info > .avf-ico{ color:var(--blue-300); }
#sec-avance .avf-aviso.warn{ background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)) !important; color:var(--orange-500) !important; }
#sec-avance .avf-aviso.bad{ background:var(--red-50) !important; color:var(--red-400) !important; }

/* Botones ≡ pastilla (G05): azul llena la principal, de borde la secundaria, roja la destructiva */
#sec-avance .avf-btn, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn, #avNvOv .avf-btn{ display:inline-flex !important; align-items:center; justify-content:center; gap:8px;
  height:40px; padding:0 16px !important; margin:0 !important; border:1px solid var(--blue-300) !important; border-radius:50px !important;
  background:var(--blue-50) !important; color:var(--blue-300) !important; font:500 14px/normal 'Inter',sans-serif !important;
  letter-spacing:0 !important; text-transform:none !important; text-decoration:none !important; white-space:nowrap; cursor:pointer; box-shadow:none !important; filter:none !important; min-width:0 !important; }
#sec-avance .avf-btn:hover, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn:hover, #avNvOv .avf-btn:hover{ background:var(--blue-75) !important; }
#sec-avance .avf-btn.pri, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn.pri, #avNvOv .avf-btn.pri{ border-color:var(--blue-300) !important; background:var(--blue-300) !important; color:var(--gray-1) !important; }
#sec-avance .avf-btn.pri:hover, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn.pri:hover, #avNvOv .avf-btn.pri:hover{ background:var(--blue-400) !important; }
#sec-avance .avf-btn.peligro{ border-color:var(--red-400) !important; background:var(--gray-1) !important; color:var(--red-400) !important; }
#sec-avance .avf-btn.peligro:hover{ background:var(--red-50) !important; }
#sec-avance .avf-btn.chico{ height:32px; padding:0 12px !important; font-size:13px !important; gap:6px; }
#sec-avance .avf-btn:disabled, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn:disabled, #avNvOv .avf-btn:disabled{ opacity:.5; cursor:not-allowed; }
#sec-avance .avf-btn:focus-visible, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn:focus-visible, #avNvOv .avf-btn:focus-visible{ outline:2px solid var(--blue-300); outline-offset:2px; }
#sec-avance .avf-btn .avf-ico, #avMetodoOv .avf-btn, #avDescOv .avf-btn, #avImgOverlay .avf-btn .avf-ico, #avNvOv .avf-btn .avf-ico{ flex:none; width:16px; height:16px; }

/* ══ DASHBOARD ═══════════════════════════════════════════════════════ */
/* Resumen de sectores y SPI: la cabecera de lista (título + filtro a la derecha) */
#sec-avance #avResumen{ margin:0; }
#sec-avance #avResumen .avf-res-cab{ display:flex; align-items:center; justify-content:space-between; gap:12px 20px; flex-wrap:wrap;
  -webkit-backdrop-filter:none; backdrop-filter:none; }
#sec-avance #avResumen .av-res-cab{ flex:1 1 320px; min-width:0; margin:0; }
#sec-avance #avResumen .av-res-t{ font:700 16px/22px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avResumen .av-res-s{ margin-top:4px; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avResumen .av-res-desfase{ margin-top:8px; padding:8px 12px; border:0; border-radius:8px;
  background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)); color:var(--orange-500); font:400 12px/18px 'Inter',sans-serif; }
#sec-avance #avResumen .av-res-filtros{ flex:0 0 auto; margin:0; }
#sec-avance #avResumen .av-f{ min-width:220px; gap:4px; }
#sec-avance :is(#avResumen,#avanceRegView) .av-f-lbl{ font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--gray-6); }
#sec-avance :is(#avResumen,#avanceRegView) .av-f-sel{ height:40px; padding:8px 32px 8px 12px; border:1px solid var(--blue-75); border-radius:6px;
  background:var(--gray-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M15 8L10 13L5 8' stroke='%233195D7' stroke-width='1.67' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 8px center;
  -webkit-appearance:none; appearance:none; font:400 14px/20px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance :is(#avResumen,#avanceRegView) .av-f-sel:focus{ outline:0; border-color:var(--blue-300); box-shadow:none; }
#sec-avance #avResumen .av-res-vacio{ border:0; }

/* KPI ≡ Capacitaciones › Indicadores. !important donde la capa global de .kpi-* ya lo trae
   (tamaños por variable, franja superior de color). */
#sec-avance .avf-kpis{ display:grid !important; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important; gap:12px !important; margin:0 0 16px !important; }
#sec-avance .avf-kpi{ display:flex !important; flex-direction:column; min-width:0; margin:0 !important; padding:20px !important;
  border:0 !important; border-radius:16px !important; background:var(--gray-1) !important; overflow:hidden; box-shadow:var(--avf-sombra) !important; }
#sec-avance .avf-kpi::before, #sec-avance .avf-kpi::after{ display:none !important; }
#sec-avance .avf-kpi .kpi-label{ margin:0 0 10px !important; font:600 12px/16px 'Inter',sans-serif !important; letter-spacing:0 !important;
  text-transform:none !important; color:var(--gray-6) !important; }
#sec-avance .avf-kpi .avf-kpi-v{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; margin:0 !important;
  font:700 26px/30px 'Inter',sans-serif !important; letter-spacing:-.5px !important; color:var(--gray-9) !important; }
#sec-avance .avf-kpi .avf-kpi-v b{ font:inherit; color:var(--gray-9); font-variant-numeric:tabular-nums; white-space:nowrap; }
#sec-avance .avf-kpi .avf-kpi-v b.t-ok{ color:var(--green-500); }
#sec-avance .avf-kpi .avf-kpi-v b.t-warn{ color:var(--orange-400); }
#sec-avance .avf-kpi .avf-kpi-v b.t-bad{ color:var(--red-400); }
#sec-avance .avf-kpi-ref-azul .avf-kpi-v b{ color:var(--blue-300); }
#sec-avance .avf-kpi .av-res-u{ font-size:16px; font-weight:600; }
/* G13: la referencia va al lado de la cifra y AL MISMO TAMAÑO; se distingue por peso y tono */
#sec-avance .avf-kpi .avf-kpi-ref{ font:500 26px/30px 'Inter',sans-serif; color:var(--gray-6); letter-spacing:0; white-space:nowrap; }
#sec-avance .avf-kpi .kpi-sublabel{ margin:6px 0 14px !important; font:400 12px/16px 'Inter',sans-serif !important; color:var(--gray-6) !important; }
#sec-avance .avf-kpi .kpi-meta-footer{ display:flex !important; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
  margin:auto 0 0 !important; padding:12px 0 0 !important; border-top:1px solid var(--gray-2) !important; }
#sec-avance .avf-kpi .kpi-meta-target{ font:500 12px/16px 'Inter',sans-serif !important; letter-spacing:0 !important; text-transform:none !important;
  color:var(--gray-6) !important; white-space:normal !important; }
#sec-avance .avf-kpi .kpi-meta-status{ display:inline-flex; align-items:center; padding:3px 8px !important; border:0 !important; border-radius:12px !important;
  font:600 12px/16px 'Inter',sans-serif !important; letter-spacing:0 !important; text-transform:none !important; white-space:nowrap; }
#sec-avance .avf-kpi .kpi-meta-cumple{ background:var(--green-50) !important; color:var(--green-500) !important; }
#sec-avance .avf-kpi .kpi-meta-seguimiento{ background:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)) !important; color:var(--orange-500) !important; }
#sec-avance .avf-kpi .kpi-meta-nocumple{ background:var(--red-50) !important; color:var(--red-400) !important; }
#sec-avance .avf-kpi .kpi-meta-sindato{ background:var(--gray-2) !important; color:var(--gray-6) !important; }
/* La variación ▲/▼ (G13): verde si mejora, roja si empeora */
#sec-avance .avf-var-t{ font:600 12px/16px 'Inter',sans-serif; white-space:nowrap; font-variant-numeric:tabular-nums; }
#sec-avance .avf-var-t.ok{ color:var(--green-500); }
#sec-avance .avf-var-t.bad{ color:var(--red-400); }
#sec-avance .avf-var-t.neutro{ color:var(--gray-6); }

/* Velocidad: la cabecera de tarjeta con el chip a la derecha; las dos cifras lado a lado (G13) */
#sec-avance .velocidad-card .vel-tag{ flex:none; padding:4px 10px; border:0; border-radius:12px; font:600 12px/16px 'Inter',sans-serif;
  letter-spacing:0; text-transform:none; }
#sec-avance .velocidad-card .vel-tag.t-up{ background:var(--green-50); color:var(--green-500); }
#sec-avance .velocidad-card .vel-tag.t-flat{ background:var(--blue-50); color:var(--blue-400); }
#sec-avance .velocidad-card .vel-tag.t-down{ background:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)); color:var(--orange-500); }
#sec-avance .avf-vel-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px; margin:0 0 16px; }
#sec-avance .avf-vel-m{ gap:6px; padding:16px; border-radius:12px; box-shadow:inset 0 0 0 1px var(--gray-3); }
#sec-avance .avf-vel-m .vel-metric-lbl{ font:600 12px/16px 'Inter',sans-serif !important; letter-spacing:0 !important; text-transform:none !important; color:var(--gray-6) !important; }
#sec-avance .avf-vel-m .vel-metric-val{ font:700 26px/30px 'Inter',sans-serif !important; letter-spacing:-.5px !important; color:var(--gray-9) !important; }
#sec-avance .avf-vel-m + .avf-vel-m .vel-metric-val{ color:var(--gray-7) !important; }
#sec-avance .avf-vel-m .vel-metric-sub{ font:400 12px/16px 'Inter',sans-serif !important; color:var(--gray-6) !important; }
#sec-avance .avf-vel-grid > .avf-var{ grid-column:1 / -1; }
#sec-avance .avf-vel-grid > .avf-var[hidden]{ display:none; }
#sec-avance .velocidad-card .vel-chart{ height:140px; }

/* Gráficas: tarjeta de sección, título sin ordinal ni versales (G01, G12) */
#sec-avance .avf-dos.charts-row{ margin:0; gap:16px; }
#sec-avance .avf-dos > .avf-card{ margin:0 0 16px !important; }
#sec-avance .avf-card > .chart-title{ display:block !important; margin:0 !important; padding:0 48px 0 0 !important; border:0 !important;
  font:700 16px/22px 'Inter',sans-serif !important; letter-spacing:0 !important; text-transform:none !important; color:var(--gray-7) !important; }
#sec-avance .avf-card > .chart-subtitle{ margin:4px 0 12px !important; font:400 12px/18px 'Inter',sans-serif !important; font-style:normal !important;
  letter-spacing:0 !important; color:var(--gray-6) !important; }
#sec-avance .avf-card .legend-item{ font:500 12px/16px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-card .av-mas-partidas{ margin:0 0 10px; padding:6px 10px; border:0; border-radius:8px; background:var(--blue-50);
  font:400 12px/16px 'Inter',sans-serif; color:var(--blue-400); }

/* Estado por frente ≡ Resumen › Frentes de obra (680:8195): una tarjeta por frente, el % en grande */
#sec-avance .avf-frentes{ display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
#sec-avance .avf-fr{ display:flex; flex-direction:column; gap:8px; padding:16px; border-radius:12px; background:var(--blue-50); min-width:0; }
#sec-avance .avf-fr-ok{ background:var(--green-50); }
#sec-avance .avf-fr-warn{ background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)); }
#sec-avance .avf-fr-bad{ background:var(--red-50); }
#sec-avance .avf-fr-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
#sec-avance .avf-fr-n{ font:700 12px/16px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-fr-b.badge{ padding:2px 8px; border:0; border-radius:4px; font:700 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; background:var(--gray-1); }
#sec-avance .avf-fr-ok .avf-fr-b{ color:var(--green-500); }
#sec-avance .avf-fr-meta .avf-fr-b, #sec-avance .avf-fr-info .avf-fr-b{ color:var(--blue-300); }
#sec-avance .avf-fr-warn .avf-fr-b{ color:var(--orange-500); }
#sec-avance .avf-fr-bad .avf-fr-b{ color:var(--red-400); }
#sec-avance .avf-fr-pct{ font:800 28px/34px 'Inter',sans-serif; color:var(--gray-8); font-variant-numeric:tabular-nums; }
#sec-avance .avf-fr-nota{ font:400 12px/16px 'Inter',sans-serif; color:var(--gray-6); }

/* Detalle y pronóstico por partida ≡ lista de Registro de Inspecciones */
#sec-avance #avDetalle{ margin:0; }
#sec-avance #avDetalle .avf-lista{ padding:20px 0 8px !important; border:0 !important; border-radius:12px !important; background:var(--gray-1) !important;
  box-shadow:var(--avf-sombra) !important; margin:0 0 16px !important; }
#sec-avance .avf-lista-cab{ display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap; padding:0 20px; margin:0 0 12px; }
#sec-avance #avDetalle .av-card-t{ display:flex; align-items:center; gap:10px; font:700 18px/28px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avDetalle .av-card-s{ margin:0; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-cuenta{ display:inline-flex; align-items:center; justify-content:center; min-width:24px; height:24px; padding:0 8px; border-radius:999px;
  background:var(--blue-50); font:700 12px/1 'Inter',sans-serif; color:var(--blue-300); }
#sec-avance #avDetalle .avd-wrap{ overflow:auto; max-height:60vh; }
#sec-avance #avDetalle .avd-tbl{ width:100%; border-collapse:collapse; font:400 13px/18px 'Inter',sans-serif; }
#sec-avance #avDetalle .avd-tbl th{ position:sticky; top:0; z-index:1; padding:12px 8px; background:var(--gray-1); border:0; border-bottom:1px solid var(--gray-3);
  font:600 12px/16px 'Inter',sans-serif; color:var(--gray-6); text-align:left; white-space:nowrap; text-transform:none !important; letter-spacing:0; }
#sec-avance #avDetalle .avd-tbl td{ padding:12px 8px; background:var(--gray-1); border:0; border-bottom:1px solid var(--gray-2);
  font:400 13px/18px 'Inter',sans-serif; color:var(--gray-7); text-align:left; font-variant-numeric:tabular-nums; }
#sec-avance #avDetalle .avd-tbl :is(th,td):first-child{ padding-left:20px; }
#sec-avance #avDetalle .avd-tbl :is(th,td):last-child{ padding-right:20px; }
#sec-avance #avDetalle .avd-tbl .avd-part{ font-weight:600; white-space:nowrap; }
#sec-avance #avDetalle .avd-tbl tbody tr:hover td{ background:var(--gray-2); }
#sec-avance #avDetalle .avd-tbl .avd-total td{ background:var(--blue-50); color:var(--gray-8); font-weight:700; border-color:var(--blue-50); }
#sec-avance #avDetalle .avd-tbl .avd-total:hover td{ background:var(--blue-50); }
#sec-avance #avDetalle .avd-tbl td.avf-desf.bad{ color:var(--red-400); font-weight:600; }
#sec-avance #avDetalle .avd-tbl td.avf-desf.ok{ color:var(--green-500); font-weight:600; }
#sec-avance #avDetalle .avd-tbl .avd-aviso{ white-space:normal; min-width:220px; color:var(--gray-6); }
#sec-avance #avDetalle .avf-aviso{ margin:12px 20px 8px !important; }

/* ══ REGISTRO DE AVANCES ≡ Registro de Inspecciones ════════════════════
   Cabecera de lista en su tarjeta, filtros debajo; el plano, la rejilla y la
   leyenda son tres bloques, cada uno en su tarjeta blanca (G09, G11). La
   rejilla es una planilla de captura: su alto de fila (--av-rh), sus colores
   de la leyenda y los rótulos de piso/sector que vienen del dato no cambian. */
#sec-avance #avanceRegView .avf-reg-cab{ padding:20px 24px 16px !important; }
#sec-avance #avanceRegView .avf-reg-cab .avf-card-cab{ align-items:center; margin:0 0 12px; }
#sec-avance #avanceRegView .av-topbar{ margin:0; }
#sec-avance #avanceRegView .av-filtros{ gap:12px 16px; margin:0; }
#sec-avance #avanceRegView .av-f{ gap:4px; }
#sec-avance #avanceRegView .av-f-nota{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:6px; max-width:none;
  font:400 12px/18px 'Inter',sans-serif; color:var(--orange-500); }
#sec-avance #avanceRegView .av-aviso-base{ display:block; margin:0 0 16px; padding:14px 16px; border:1px solid var(--gray-1); border-radius:12px;
  background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)); font:400 13px/20px 'Inter',sans-serif; color:var(--orange-500); }
#sec-avance #avanceRegView .av-reg-grid{ gap:16px; margin:0; }
#sec-avance #avanceRegView :is(.av-sect,.av-card){ padding:20px !important; border:0 !important; border-radius:12px !important;
  background:var(--gray-1) !important; box-shadow:var(--avf-sombra) !important; }
#sec-avance #avanceRegView :is(.av-sect-t,.av-card-t){ font:700 16px/22px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceRegView :is(.av-sect-s,.av-card-s){ margin:4px 0 14px; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceRegView .av-sect-wrap{ border:1px solid var(--gray-3); border-radius:8px; }
#sec-avance #avanceRegView .av-sect-pdf{ border:1px solid var(--gray-3); background:var(--gray-1); }
#sec-avance #avanceRegView .av-sect-zoom{ display:inline-flex; align-items:center; gap:6px; font:600 12px/16px 'Inter',sans-serif; letter-spacing:0;
  color:var(--gray-1); background:color-mix(in srgb,var(--gray-9) 75%,transparent); border-radius:50px; padding:6px 10px; }
#sec-avance #avanceRegView .av-sect-zoom .avf-ico{ width:14px; height:14px; }
#sec-avance #avanceRegView .av-sect-zoom.pdf{ position:absolute; right:8px; bottom:8px; }
#sec-avance #avanceRegView .av-sect-pie{ margin-top:12px; gap:8px 12px; }
#sec-avance #avanceRegView .av-sect-origen{ font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceRegView .av-sect-origen.propio{ color:var(--green-500); }
#sec-avance #avanceRegView .av-sect-acc{ gap:8px; flex-wrap:wrap; }
#sec-avance .av-sect-empty{ border:1.5px dashed var(--gray-3); background:var(--gray-2); color:var(--gray-6); }
#sec-avance .av-sect-empty svg{ opacity:.7; }
#sec-avance .av-sect-empty-t, #sec-avance .av-sinreg-t{ font:600 14px/20px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance .av-sect-empty-s, #sec-avance .av-sinreg-s{ font:400 13px/20px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .av-sinreg{ color:var(--gray-5); }
/* La línea del método de avance y sus avisos */
#sec-avance #avanceRegView .av-met-linea{ margin:4px 0 8px; gap:8px; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceRegView .av-met-linea b{ color:var(--gray-7); }
#sec-avance #avanceRegView .av-met-alerta{ margin:0 0 8px; padding:8px 12px; border-radius:8px; font:400 12px/18px 'Inter',sans-serif;
  background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)); color:var(--orange-500); }
#sec-avance #avanceRegView .avf-aviso{ margin:16px 0 0 !important; }
/* La rejilla: cabeceras y rótulos en gris de la paleta, celdas blancas, la fila en edición en azul */
#sec-avance #avanceRegView .av-tbl{ font:600 12px/16px 'Inter',sans-serif; }
#sec-avance #avanceRegView .av-tbl .av-th-col{ background:var(--gray-2); border-color:var(--gray-3); font:600 12px/16px 'Inter',sans-serif; color:var(--gray-7); text-transform:none; }
#sec-avance #avanceRegView .av-tbl .av-td-lbl{ background:var(--gray-2); border-color:var(--gray-3); color:var(--gray-7); font-weight:600; }
#sec-avance #avanceRegView .av-tbl .av-td-cell{ border-color:var(--gray-3); }
#sec-avance #avanceRegView .av-td-na{ background:repeating-linear-gradient(45deg,var(--gray-2),var(--gray-2) 4px,var(--gray-1) 4px,var(--gray-1) 8px); color:var(--gray-5); }
#sec-avance #avanceRegView .av-tr-act .av-td-lbl{ background:var(--blue-50); }
#sec-avance #avanceRegView .av-tr-act .av-td-cell{ box-shadow:inset 0 0 0 1px var(--blue-300); }
#sec-avance #avanceRegView .av-rad{ border-color:var(--gray-4); }
#sec-avance #avanceRegView .av-rad:hover{ border-color:var(--blue-300); }
#sec-avance #avanceRegView .av-rad.on{ border-color:var(--blue-300); }
#sec-avance #avanceRegView .av-rad.on::after{ background:var(--blue-300); }
#sec-avance #avanceRegView .av-ok{ color:var(--green-500); }
#sec-avance #avanceRegView .av-tbl-t{ font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; color:var(--gray-6); }
/* El Excel de cada rejilla (componente común tbl-xlsx-btn): pastilla con icono, del alto de la fila (G06) */
#sec-avance #avanceRegView .av-th-lbl .tbl-xlsx-btn{ display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 10px;
  border:1px solid var(--green-400); border-radius:50px; background:var(--green-50); color:var(--green-500); font:600 12px/1 'Inter',sans-serif; }
#sec-avance #avanceRegView .av-th-lbl .tbl-xlsx-btn:hover{ background:var(--green-75); }
/* El pie: acción principal, destructiva y el estado del borrador */
#sec-avance #avanceRegView .av-pie{ gap:8px 12px; margin-top:16px; }
#sec-avance #avanceRegView .av-btn-revertir{ margin-left:0 !important; }
#sec-avance #avanceRegView .av-pie .rfi-draft-badge{ display:inline-flex; align-items:center; height:32px; padding:0 12px; border-radius:50px;
  background:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)); font:600 12px/1 'Inter',sans-serif; color:var(--orange-500); }
#sec-avance #avanceRegView .av-pie-nota{ font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
/* La leyenda: los colores son los de la leyenda del Excel (dato); solo el trazo y la letra */
#sec-avance #avanceRegView .av-ley{ font:500 12px/16px 'Inter',sans-serif; }
#sec-avance #avanceRegView .av-ley td{ border-color:var(--gray-3); font-weight:500; color:var(--gray-7); }
#sec-avance #avanceRegView .av-ley .av-ley-n{ font-weight:700; }
#sec-avance #avanceRegView .av-met-linea{ display:block; }
#sec-avance #avanceRegView .av-met-linea .av-met-cambiar{ margin:0 0 0 8px !important; vertical-align:middle; }
/* La leyenda cede ancho a la rejilla: su texto parte en dos líneas antes que tapar «Grabar fila» */
#sec-avance #avanceRegView .av-card-ley .av-ley .av-ley-t{ white-space:normal; min-width:160px; max-width:220px; line-height:16px; padding:6px 8px; }

/* ══ CORTE SEMANAL ══════════════════════════════════════════════════════
   Arriba, las tres cifras como KPI (G08/G13); debajo, UNA tarjeta de lista
   (≡ Registro de Inspecciones) con el título y la semana, el aviso de lo que
   falta, la barra con el selector y el filtro, la tabla y el cierre (G11).
   Las reglas de main (#avanceCorteView …, en el inyector) siguen ahí: la
   prueba del auditor las exige; estas ganan por el id de la sección. */
#sec-avance .avf-oculto{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
#sec-avance #avanceCorteView .av-corte{ padding:0; color:var(--gray-7); }
#sec-avance #avanceCorteView .av-corte-top{ display:block; margin:0; }
#sec-avance #avanceCorteView .av-corte-nums{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
#sec-avance #avanceCorteView .av-corte-num{ min-width:0; gap:0; }
#sec-avance #avanceCorteView .av-corte-num-t{ order:0; margin:0 0 10px; font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--gray-6); }
#sec-avance #avanceCorteView .av-corte-num-v{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; font:700 26px/30px 'Inter',sans-serif;
  letter-spacing:-.5px; color:var(--gray-9); }
#sec-avance #avanceCorteView .av-corte-num.ok .av-corte-num-v{ color:var(--green-500); }
#sec-avance #avanceCorteView .av-corte-num.warn .av-corte-num-v{ color:var(--orange-400); }
#sec-avance #avanceCorteView .av-corte-num.bad .av-corte-num-v{ color:var(--red-400); }
#sec-avance #avanceCorteView .av-corte-num.info .av-corte-num-v{ color:var(--blue-300); }
#sec-avance #avanceCorteView .av-corte-num-v .avf-kpi-ref{ font:500 26px/30px 'Inter',sans-serif; letter-spacing:0; color:var(--gray-6); }
#sec-avance .avf-kpi-nota{ margin:6px 0 14px; font:400 12px/16px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance .avf-kpi-pie{ margin-top:auto; padding-top:12px; border-top:1px solid var(--gray-2); }
#sec-avance .avf-kpi-pie .kpi-meta-status{ display:inline-flex; padding:3px 8px !important; border:0 !important; border-radius:12px !important;
  font:600 12px/16px 'Inter',sans-serif !important; letter-spacing:0 !important; text-transform:none !important; }
#sec-avance .avf-kpi-pie .kpi-meta-cumple{ background:var(--green-50) !important; color:var(--green-500) !important; }
#sec-avance .avf-kpi-pie .kpi-meta-seguimiento{ background:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)) !important; color:var(--orange-500) !important; }
#sec-avance .avf-kpi-pie .kpi-meta-nocumple{ background:var(--red-50) !important; color:var(--red-400) !important; }
#sec-avance .avf-kpi-pie .kpi-meta-sindato{ background:var(--blue-50) !important; color:var(--blue-400) !important; }
/* La lista en su tarjeta (684:8909) */
#sec-avance #avanceCorteView .avf-corte-lista{ padding:20px 0 16px !important; }
#sec-avance #avanceCorteView .av-corte-t{ display:flex; align-items:center; gap:10px; font:700 18px/28px 'Inter',sans-serif; letter-spacing:0; color:var(--gray-7); }
#sec-avance #avanceCorteView .av-corte-s{ margin:0; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCorteView .avf-aviso{ margin:0 20px 12px !important; }
#sec-avance #avanceCorteView .av-corte-tools{ gap:12px 20px; margin:0 20px 12px; }
#sec-avance #avanceCorteView .av-corte-sem{ gap:8px; font:600 12px/16px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCorteView .av-corte-sem select{ height:40px; padding:8px 32px 8px 12px; border:1px solid var(--blue-75); border-radius:6px;
  background:var(--gray-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M15 8L10 13L5 8' stroke='%233195D7' stroke-width='1.67' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 8px center;
  -webkit-appearance:none; appearance:none; font:400 14px/20px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceCorteView .av-corte-sem select:focus{ outline:0; border-color:var(--blue-300); }
#sec-avance #avanceCorteView .av-corte-chk{ font:500 13px/18px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceCorteView .av-corte-chk input{ accent-color:var(--blue-300); }
#sec-avance #avanceCorteView .av-corte-wrap{ border:0; border-top:1px solid var(--gray-3); border-radius:0; background:var(--gray-1); }
#sec-avance #avanceCorteView .av-corte-tbl{ font:400 13px/18px 'Inter',sans-serif; }
#sec-avance #avanceCorteView .av-corte-tbl thead th{ padding:12px 8px; background:var(--gray-1); border-bottom:1px solid var(--gray-3);
  font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--gray-6); }
#sec-avance #avanceCorteView .av-corte-tbl td{ padding:10px 8px; border-bottom:1px solid var(--gray-2); color:var(--gray-7); }
#sec-avance #avanceCorteView .av-corte-tbl :is(th,td):first-child{ padding-left:20px; }
#sec-avance #avanceCorteView .av-corte-tbl :is(th,td):last-child{ padding-right:20px; }
#sec-avance #avanceCorteView .av-corte-tbl tbody tr:hover{ background:var(--gray-2); }
#sec-avance #avanceCorteView .av-corte-td-n{ font-weight:600; }
#sec-avance #avanceCorteView .av-corte-tr-falta{ background:color-mix(in srgb,var(--red-50) 45%,var(--gray-1)); }
#sec-avance #avanceCorteView .av-corte-tr-falta td:first-child{ box-shadow:inset 3px 0 0 var(--red-400); }
#sec-avance #avanceCorteView .av-corte-tr-ok td:first-child{ box-shadow:inset 3px 0 0 var(--green-400); }
#sec-avance #avanceCorteView .av-corte-si{ color:var(--green-500); font-weight:700; }
#sec-avance #avanceCorteView .av-corte-no{ color:var(--red-400); font:600 12px/16px 'Inter',sans-serif; }
#sec-avance #avanceCorteView .av-corte-na{ color:var(--gray-5); }
#sec-avance #avanceCorteView .av-corte-tag{ padding:2px 8px; border-radius:12px; font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; }
#sec-avance #avanceCorteView .av-corte-tag.bad{ background:var(--red-50); color:var(--red-400); }
#sec-avance #avanceCorteView .av-corte-vacio{ color:var(--gray-6); font:400 13px/20px 'Inter',sans-serif; }
#sec-avance #avanceCorteView .av-corte-pie{ gap:12px 16px; margin:0; padding:16px 20px 0; border-top:1px solid var(--gray-3); }
#sec-avance #avanceCorteView .av-corte-nota{ font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCorteView .av-corte-cargando{ text-align:center; color:var(--gray-6); font:400 13px/20px 'Inter',sans-serif; }

/* ══ CRONOGRAMA DE EJECUCIÓN ════════════════════════════════════════════
   La tarjeta de título arriba, las cinco cifras como KPI (G08/G13), el aviso
   de corte, el visor (el MISMO de Cronograma Meta, cronograma-nuevo.html
   ?ejecucion=1, que no es de esta hoja) y los cierres semanales como lista.
   Las variables --cr-* de main siguen vivas; aquí se apuntan a los tokens. */
#sec-avance #avanceCronoView{ --cr-ok:var(--green-500); --cr-ok-bg:var(--green-50); --cr-info:var(--blue-300); --cr-info-bg:var(--blue-50);
  --cr-warn:var(--orange-500); --cr-warn-bg:color-mix(in srgb,var(--orange-400) 12%,var(--gray-1)); --cr-bad:var(--red-400); --cr-bad-bg:var(--red-50);
  --cr-muted:var(--gray-4); --cr-muted-bg:var(--gray-2); --cr-t1:var(--gray-8); --cr-t2:var(--gray-7); --cr-t3:var(--gray-6);
  --cr-linea:var(--gray-3); --cr-card:var(--gray-1); gap:16px; margin-top:0; font:400 13px/20px 'Inter',sans-serif; }
#sec-avance #avanceCronoView .cr-card{ background:var(--gray-1); border:0; border-radius:12px; padding:20px 24px; box-shadow:var(--avf-sombra); }
#sec-avance #avanceCronoView .cr-eyebrow{ font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-titulo{ margin-top:4px; font:700 18px/26px 'Inter',sans-serif; color:var(--gray-8); }
#sec-avance #avanceCronoView .cr-sub{ margin-top:4px; font:400 13px/20px 'Inter',sans-serif; color:var(--gray-6); max-width:none; }
#sec-avance #avanceCronoView .cr-manda{ margin-top:12px; font:400 13px/20px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-nota{ margin-top:8px; font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-stats.avf-kpis{ margin:0 !important; padding:0; border:0; }
#sec-avance #avanceCronoView .cr-stats > .avf-kpi{ min-width:0; }
#sec-avance #avanceCronoView .cr-stats span.avf-var-t{ font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; }
#sec-avance #avanceCronoView .cr-stats .avf-kpi .avf-kpi-v{ font-size:22px !important; line-height:28px !important; }
#sec-avance #avanceCronoView .cr-aviso{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:14px 16px; border:1px solid var(--gray-1); border-radius:12px;
  font:400 13px/20px 'Inter',sans-serif; }
#sec-avance #avanceCronoView .cr-aviso.info{ background:var(--blue-50); color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-aviso.warn{ background:var(--cr-warn-bg); color:var(--orange-500); }
#sec-avance #avanceCronoView .cr-aviso.bad{ background:var(--red-50); color:var(--red-400); }
#sec-avance #avanceCronoView .cr-aviso.muted{ background:var(--gray-2); color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-aviso .avf-btn{ margin-left:4px !important; }
#sec-avance #avanceCronoView .cr-cargando{ color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-visor{ padding:0; overflow:hidden; }
#sec-avance #avanceCronoView .cr-cab{ gap:4px 12px; }
#sec-avance #avanceCronoView .cr-sec{ font:700 18px/28px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-pista-txt{ font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-cierre-accion{ gap:8px 16px; margin:12px 0; font:400 13px/20px 'Inter',sans-serif; color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-tabla th{ padding:12px 8px; border-bottom:1px solid var(--gray-3); background:var(--gray-1);
  font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-tabla td{ padding:10px 8px; border-bottom:1px solid var(--gray-2); color:var(--gray-7); }
#sec-avance #avanceCronoView .cr-tabla td em{ font-size:12px; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-tabla tr.cr-actual td{ background:var(--blue-50); }
#sec-avance #avanceCronoView .cr-nd{ font:400 12px/18px 'Inter',sans-serif; color:var(--gray-6); }
#sec-avance #avanceCronoView .cr-badge{ padding:2px 8px; border-radius:12px; font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; }
#sec-avance #avanceCronoView .cr-cmp{ margin-top:12px; font:400 13px/24px 'Inter',sans-serif; color:var(--gray-7); }
/* G19: nada truncado con «…» — la variación del pie parte en dos líneas si no cabe */
#sec-avance .avf-kpi .kpi-meta-target{ overflow:visible !important; text-overflow:clip !important; min-width:0; flex:1 1 auto; }
#sec-avance .avf-kpi .kpi-meta-target .avf-var-t{ white-space:normal; }

/* ══ VENTANAS DE LA VISTA (cuelgan del body: se acotan por su id) ════════
   G07: el fondo se difumina y «Cerrar» es la pastilla estándar con icono.
   Método de avance (#avMetodoOv), describir la foto (#avDescOv), nueva
   partida / rejilla (#avNvOv) y el visor del plano (#avImgOverlay). La hoja
   de «Nueva partida» es el formato planilla SIG (adic-nv-*): no se toca. */
:is(#avMetodoOv,#avDescOv).av-met-ov{ background:color-mix(in srgb,var(--gray-9) 45%,transparent); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
:is(#avMetodoOv,#avDescOv) .av-met-caja{ padding:24px; border-radius:16px; background:var(--gray-1); color:var(--gray-8);
  box-shadow:0 20px 50px color-mix(in srgb,var(--gray-9) 25%,transparent); font:400 13px/20px 'Inter',sans-serif; }
:is(#avMetodoOv,#avDescOv) .av-met-x{ position:absolute; top:16px; right:16px; }
:is(#avMetodoOv,#avDescOv) .av-met-t{ padding-right:112px; font:700 18px/26px 'Inter',sans-serif; color:var(--gray-8); }
:is(#avMetodoOv,#avDescOv) .av-met-s{ margin:4px 0 16px; color:var(--gray-6); }
:is(#avMetodoOv,#avDescOv) .av-met-op{ gap:12px; padding:12px; border:1px solid var(--gray-3); border-radius:12px; }
:is(#avMetodoOv,#avDescOv) .av-met-op:has(input:checked){ border-color:var(--blue-300); background:var(--blue-50); }
:is(#avMetodoOv,#avDescOv) .av-met-op input{ accent-color:var(--blue-300); }
:is(#avMetodoOv,#avDescOv) .av-met-op b{ color:var(--gray-8); }
:is(#avMetodoOv,#avDescOv) .av-met-op em{ font-size:12px; color:var(--gray-6); }
:is(#avMetodoOv,#avDescOv) .av-met-items label{ font-size:12px; color:var(--gray-6); }
:is(#avMetodoOv,#avDescOv) .av-met-items textarea{ border:1px solid var(--blue-75); border-radius:8px; font:400 14px/20px 'Inter',sans-serif; color:var(--gray-7); }
:is(#avMetodoOv,#avDescOv) .av-met-items textarea:focus{ outline:0; border-color:var(--blue-300); }
:is(#avMetodoOv,#avDescOv) .av-met-aviso.warn{ background:color-mix(in srgb,var(--orange-400) 10%,var(--gray-1)); color:var(--orange-500); border-radius:12px; padding:12px 14px; }
:is(#avMetodoOv,#avDescOv) .av-met-aviso.bad{ background:var(--red-50); color:var(--red-400); border-radius:12px; padding:12px 14px; }
:is(#avMetodoOv,#avDescOv) .av-met-err{ color:var(--red-400); }
:is(#avMetodoOv,#avDescOv) .av-met-pie{ gap:8px; margin-top:16px; }
#avDescOv .avf-desc-img{ background:var(--gray-2); }
#avNvOv{ -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
#avNvOv .av-nv-tb{ border:0; border-radius:12px; box-shadow:0 1px 4px color-mix(in srgb,var(--gray-9) 6%,transparent); }
#avNvOv .av-nv-tt{ font:700 16px/22px 'Inter',sans-serif; color:var(--gray-8); }
#avNvOv .av-nv-bdg{ padding:3px 10px; border:0; border-radius:12px; background:var(--blue-50); font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; text-transform:none; color:var(--blue-400); }
#avNvOv .adic-nv-pie{ gap:8px; }
#avImgOverlay{ -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
#avImgOverlay .av-img-x{ position:fixed !important; top:18px; right:18px; z-index:2; width:auto; background:var(--gray-1) !important; }
#avImgOverlay .av-img-kicker{ font:600 12px/16px 'Inter',sans-serif; letter-spacing:0; color:var(--gray-6); }
#avImgOverlay .av-img-desc{ font:700 14px/20px 'Inter',sans-serif; color:var(--gray-8); }
@media (pointer:coarse){
  :is(#avMetodoOv,#avDescOv,#avNvOv,#avImgOverlay) .avf-btn{ min-height:44px; }
}

/* ══ PANTALLA MEDIANA Y TELÉFONO ════════════════════════════════════════
   La capa móvil (html.mv) la reclama movil/crono.js (compartido, no se toca):
   fija la primera columna de las tablas anchas y deja las tablas en sitio,
   que es lo correcto aquí porque la rejilla se edita (skill §1). Esta hoja
   solo reacomoda: encabezado primero y centrado (G12, M07), pestañas visibles
   con el lenguaje de pestañas de la capa, KPI en carril deslizable (M04), rejilla y leyenda una
   debajo de la otra, y toques de 44 (skill §7). */
@media (max-width:1100px){
  #sec-avance .avf-kpis{ grid-template-columns:repeat(auto-fit,minmax(170px,1fr)) !important; }
  #sec-avance #avanceCorteView .av-corte-nums{ grid-template-columns:repeat(auto-fit,minmax(170px,1fr)) !important; }
}
@media (max-width:900px){
  #sec-avance .avf-cab-fila{ padding:16px 16px 8px; }
  #sec-avance .avf-cab-h{ font-size:20px !important; line-height:26px !important; }
  /* Las pestañas siguen el lenguaje único de la capa (movil/estilos.css, «html.mv .presup-subtab»:
     subrayado, 44 de alto, se deslizan si no caben). No se pisa aquí: es compartido. */
  #sec-avance .avf-tabs .presup-subtab{ font-size:15px; }
  #sec-avance .avf-card{ padding:16px !important; }
  #sec-avance #avResumen .av-f{ min-width:0; width:100%; }
  #sec-avance #avResumen .av-res-filtros{ flex:1 1 100%; }
  /* M04 · las tarjetas KPI repetidas en carril horizontal que se desliza */
  #sec-avance .avf-kpis, #sec-avance #avanceCorteView .av-corte-nums{ display:flex !important; overflow-x:auto; scroll-snap-type:x mandatory;
    gap:12px !important; padding:2px 2px 8px; scrollbar-width:none; }
  #sec-avance .avf-kpis > .avf-kpi{ flex:0 0 78% !important; max-width:300px; scroll-snap-align:start; }
  #sec-avance .avf-kpi .kpi-label, #sec-avance .avf-kpi .kpi-sublabel, #sec-avance .avf-kpi-nota,
  #sec-avance .avf-kpi .kpi-meta-target, #sec-avance .avf-var-t{ font-size:13px !important; }
  #sec-avance .avf-vel-grid{ grid-template-columns:minmax(0,1fr); }
  #sec-avance .velocidad-card .avf-card-cab{ flex-direction:column; }
  #sec-avance .avf-card > :is(.chart-title,.chart-subtitle){ padding-right:48px !important; }
  #sec-avance :is(#avResumen,#avanceRegView) .av-f-sel, #sec-avance #avanceCorteView .av-corte-sem select{ height:44px; font-size:16px; }
  #sec-avance .avf-btn{ height:44px; }
  #sec-avance .avf-btn.chico{ height:40px; }
  /* Rejilla y leyenda, una debajo de la otra; la rejilla usa el ancho y se desliza dentro */
  #sec-avance #avanceRegView .av-tablas{ flex-direction:column; align-items:stretch; }
  #sec-avance #avanceRegView .av-card-tbl{ width:100%; }
  #sec-avance #avanceRegView .av-card-ley .av-ley .av-ley-t{ max-width:none; }
  #sec-avance #avanceRegView .av-pie{ flex-direction:column; align-items:stretch; }
  #sec-avance #avanceRegView .av-pie .avf-btn{ width:100%; }
  #sec-avance #avanceCorteView .av-corte-tools{ flex-direction:column; align-items:stretch; }
  #sec-avance #avanceCorteView .av-corte-sem{ flex-direction:column; align-items:stretch; }
  #sec-avance #avanceCorteView .av-corte-pie{ flex-direction:column; align-items:stretch; }
  #sec-avance #avanceCorteView .av-corte-pie .avf-btn{ width:100%; }
  #sec-avance #avanceCronoView .cr-card{ padding:16px; }
  #sec-avance #avDetalle .avf-lista-cab, #sec-avance .avf-lista-cab{ padding:0 16px; }
}
@media (pointer:coarse){
  #sec-avance .avf-btn, #sec-avance .avf-tabs .presup-subtab{ min-height:44px; }
}