/* Pizarrones · estilos */
:root {
  --fondo: #E9ECEF;
  --papel: #FFFFFF;
  --tinta: #1B2430;
  --tinta-suave: #5B6675;
  --linea: #D6DCE3;
  --linea-suave: #EDF0F4;
  --primario: #12306B;
  --primario-claro: #E8EEFA;
  --verde: #1E8C45;
  --rojo: #C62828;
  --ambar: #F2B705;
  --radio: 12px;
  --sombra: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 14px rgba(16, 24, 40, .06);
  --titulos: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --texto: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fondo); color: var(--tinta); font: 16px/1.45 var(--texto); }
h1, h2, h3 { font-family: var(--titulos); letter-spacing: .01em; line-height: 1.1; margin: 0 0 .4em; }
h1 { font-size: 2rem; }
h2 { font-size: 1.35rem; }
a { color: var(--primario); }
small { font-size: .82em; }
.nota { color: var(--tinta-suave); font-size: .9rem; margin: .2em 0; }
[hidden] { display: none !important; }

/* ---------- barra superior ---------- */
.barra { display: flex; align-items: center; gap: 24px; padding: 10px 24px; background: var(--primario); color: #fff; position: sticky; top: 0; z-index: 20; }
.marca { display: flex; align-items: center; flex: none; }
.marca img { display: block; height: 40px; width: auto; }
.barra-nav { display: flex; gap: 18px; flex: 1; }
.barra-nav a { color: rgba(255, 255, 255, .85); text-decoration: none; font-weight: 600; }
.barra-nav a:hover { color: #fff; }
.barra-usuario { display: flex; align-items: center; gap: 12px; }
.barra-usuario form { margin: 0; }
.barra .btn-fantasma { color: #fff; border-color: rgba(255, 255, 255, .35); background: transparent; }
.usuario-chip { display: flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: #FFD54F; color: var(--primario); display: grid; place-items: center; font-weight: 700; }
.usuario-datos { display: flex; flex-direction: column; line-height: 1.1; }
.usuario-datos small { opacity: .75; }

.contenido { max-width: 1200px; margin: 0 auto; padding: 24px 16px 64px; }
.contenido-pizarron { max-width: 1480px; }

/* ---------- componentes ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 16px; border-radius: 9px; border: 1px solid var(--linea); background: var(--papel); color: var(--tinta); font: 600 .95rem var(--texto); cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn:hover { border-color: #AEB8C4; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-primario { background: var(--primario); border-color: var(--primario); color: #fff; }
.btn-primario:hover { background: #0C2350; border-color: #0C2350; }
.btn-acento { background: #FFD54F; border-color: #F2B705; color: #3D2E00; }
.btn-fantasma { background: transparent; }
.btn-peligro { color: var(--rojo); border-color: #F1C4C4; background: #FFF7F7; }
.btn-sm { padding: 5px 10px; font-size: .85rem; border-radius: 7px; }
.btn-bloque { width: 100%; }
.btn-cerrar { border: 0; background: none; font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--tinta-suave); padding: 0 4px; }

.tarjeta { background: var(--papel); border-radius: var(--radio); box-shadow: var(--sombra); padding: 20px; margin-bottom: 20px; overflow-x: auto; }
.tarjeta.angosta { max-width: 460px; }
.vacio { text-align: center; padding: 48px 20px; }

.aviso { padding: 10px 14px; border-radius: 9px; margin-bottom: 14px; font-weight: 500; }
.aviso-ok { background: #E7F6EC; color: #145C2E; border: 1px solid #BFE5CC; }
.aviso-error { background: #FDECEC; color: #8E1C1C; border: 1px solid #F5C2C2; }

.campo { display: flex; flex-direction: column; gap: 5px; margin: 0 0 14px; border: 0; padding: 0; min-width: 0; flex: 1; }
.campo > span, .campo legend { font-weight: 600; font-size: .9rem; }
.campo input:not([type=checkbox]):not([type=radio]):not([type=color]), .campo select, .campo textarea {
  width: 100%; padding: 9px 11px; border: 1px solid var(--linea); border-radius: 8px; font: inherit; background: #fff; color: var(--tinta);
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 2px solid #8FB2F0; outline-offset: 0; border-color: #6D96E6; }
.campo input[type=color] { width: 44px; height: 34px; padding: 2px; border: 1px solid var(--linea); border-radius: 8px; background: #fff; }
.fila-campos { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; }
.check { display: flex; gap: 8px; align-items: center; margin: 4px 0; font-weight: 400; cursor: pointer; }
.lista-checks { max-height: 230px; overflow: auto; border: 1px solid var(--linea); border-radius: 8px; padding: 8px 12px; }
.grupo-checks { font: 700 .78rem var(--texto); text-transform: uppercase; letter-spacing: .05em; color: var(--tinta-suave); margin: 8px 0 2px; }
.grupo-checks:first-child { margin-top: 0; }
.paleta { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.muestra { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--linea); cursor: pointer; }

.tabla { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tabla th, .tabla td { padding: 8px 10px; border-bottom: 1px solid var(--linea-suave); text-align: left; vertical-align: middle; }
.tabla th { font: 600 .85rem var(--texto); color: var(--tinta-suave); text-transform: uppercase; letter-spacing: .03em; }
.tabla tr.inactivo td { opacity: .5; }
.num { text-align: right !important; white-space: nowrap; }
.fuerte { font-weight: 700; }
.tabla-arbol .rama { color: var(--tinta-suave); margin-right: 4px; }
.tabla-arbol form { margin: 0; }
.etiqueta { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: .8rem; font-weight: 600; background: var(--linea-suave); }
.rol-admin { background: #FDE2EC; color: #8A1240; }
.rol-editor { background: #E3ECFB; color: #12306B; }
.rol-captura { background: #E4F5E9; color: #145C2E; }

.modal { border: 0; border-radius: 14px; padding: 0; width: min(560px, calc(100vw - 32px)); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.modal-ancho { width: min(900px, calc(100vw - 32px)); }
.modal::backdrop { background: rgba(15, 23, 42, .45); }
.modal-cuerpo { padding: 20px 22px; max-height: calc(100vh - 40px); overflow: auto; }
.modal-cabecera { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.modal-cabecera h2 { margin: 0; }
.modal-pie { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; flex-wrap: wrap; }

.migas { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: .9rem; color: var(--tinta-suave); margin-bottom: 12px; }
.migas a { color: var(--tinta-suave); }
.migas strong { color: var(--tinta); }

.encabezado-pagina { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.acciones-encabezado { display: flex; gap: 10px; flex-wrap: wrap; }
.zona-peligro { margin-top: 30px; padding: 14px 18px; border: 1px dashed #E3A7A7; border-radius: var(--radio); background: #FFFAFA; }
.zona-peligro summary { cursor: pointer; color: var(--rojo); font-weight: 600; }
.zona-peligro form { margin-top: 12px; }

/* ---------- login ---------- */
.pagina-login { background: radial-gradient(circle at 22% 30%, #0B2E7A 0, #061F58 40%, #010B2A 100%); min-height: 100vh; }
.pagina-login .contenido { min-height: 100vh; display: grid; place-items: center; }
.login { display: grid; grid-template-columns: 1fr 400px; gap: 48px; align-items: center; width: 100%; max-width: 1100px; }
.login-marca { color: #fff; }
.login-marca h1 { font-size: 3.4rem; margin: 16px 0 8px; }
.login-marca img { display: block; width: 100%; max-width: 380px; height: auto; }
.login-marca .login-logo { margin: 0; }
.login-logo img { max-width: 640px; }
.login-form h2 { font-size: 1.6rem; }
.login-form .g-recaptcha { margin: 4px 0 16px; min-height: 78px; }

/* ---------- proyectos ---------- */
.rejilla-proyectos { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.proyecto-tarjeta { background: var(--papel); border-radius: var(--radio); box-shadow: var(--sombra); overflow: hidden; border-top: 6px solid var(--c); }
.proyecto-cabeza { display: flex; gap: 12px; align-items: center; padding: 16px 18px 8px; text-decoration: none; color: var(--tinta); }
.proyecto-cabeza strong { display: block; font: 700 1.4rem var(--titulos); }
.proyecto-cabeza small { color: var(--tinta-suave); }
.proyecto-desc { margin: 0 18px 8px; color: var(--tinta-suave); font-size: .92rem; }
.proyecto-logo { width: 48px; height: 48px; object-fit: contain; }
.proyecto-logo.grande { width: 72px; height: 72px; }
.proyecto-inicial { width: 48px; height: 48px; border-radius: 12px; background: var(--c); color: #fff; display: grid; place-items: center; font: 800 1.6rem var(--titulos); flex: none; }
.proyecto-inicial.grande { width: 72px; height: 72px; font-size: 2.4rem; border-radius: 16px; }
.lista-pizarrones { list-style: none; margin: 0; padding: 0 0 8px; }
.lista-pizarrones a { display: flex; justify-content: space-between; gap: 10px; padding: 9px 18px; text-decoration: none; color: var(--tinta); border-top: 1px solid var(--linea-suave); }
.lista-pizarrones a:hover { background: var(--primario-claro); }
.lista-pizarrones small { color: var(--tinta-suave); white-space: nowrap; }
.proyecto-identidad { display: flex; gap: 16px; align-items: center; }

/* ---------- pizarrón ---------- */
.cargando { padding: 60px; text-align: center; color: var(--tinta-suave); }
.herramientas { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.interruptor { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid var(--linea); border-radius: 9px; background: var(--papel); font-weight: 600; cursor: pointer; }
.interruptor input { accent-color: var(--primario); width: 16px; height: 16px; }

/* El marco imita un pizarrón blanco con su borde de aluminio. */
.pizarron-marco { background: var(--papel); border-radius: 6px; padding: 22px; border: 10px solid #C9CED4; box-shadow: inset 0 0 0 1px #B4BBC3, 0 10px 30px rgba(0, 0, 0, .12); }
.pizarron-cabecera { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; margin-bottom: 18px; }
.pizarron-logo img { max-width: 160px; max-height: 80px; object-fit: contain; display: block; }
.pizarron-titulo { text-align: center; }
.pizarron-titulo h1 { display: inline-block; font-size: clamp(1.7rem, 3.2vw, 2.8rem); font-weight: 800; text-transform: uppercase; color: #fff; background: var(--marca, var(--primario)); padding: 6px 28px; border-radius: 40px; margin: 0; }
.pizarron-subtitulo { font: 700 clamp(1.1rem, 2vw, 1.7rem) var(--titulos); text-transform: uppercase; margin: 8px 0 0; color: var(--tinta); }
.pizarron-meta { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.pizarron-lema { font: 600 1.15rem var(--titulos); color: #2E5E1E; margin: 0; max-width: 240px; transform: rotate(-3deg); }
.periodo-chip { border: 2px solid var(--tinta); border-radius: 8px; padding: 3px 10px; font: 700 .95rem var(--titulos); }
.semana-chip { background: #FFF3C4; color: #6B5200; padding: 2px 10px; border-radius: 99px; font: 600 .85rem var(--texto); }

.rejilla { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.bloque { border: 2px solid var(--c); border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; background: #fff; min-width: 0; }
.bloque-cabecera { background: var(--c); color: var(--ct); padding: 8px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bloque-cabecera h2 { margin: 0; font-size: 1.3rem; font-weight: 700; text-transform: uppercase; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.bloque-cabecera h2 small { font-size: .85rem; font-weight: 600; text-transform: none; opacity: .9; }
.ir-sub { color: var(--ct); font-weight: 700; font-size: .85rem; text-decoration: none; border: 1.5px solid currentColor; border-radius: 99px; padding: 2px 10px; white-space: nowrap; }
.ir-sub:hover { background: rgba(255, 255, 255, .18); }
.bloque-cuerpo { padding: 12px 14px; flex: 1; min-width: 0; }
.bloque-herramientas { display: flex; gap: 4px; padding: 6px 8px; background: #F6F8FA; border-bottom: 1px dashed var(--linea); flex-wrap: wrap; }
.bloque-herramientas button { border: 1px solid var(--linea); background: #fff; border-radius: 6px; padding: 3px 8px; font: 600 .8rem var(--texto); cursor: pointer; }
.bloque-herramientas button:disabled { opacity: .4; cursor: default; }
.bloque-herramientas .peligro { color: var(--rojo); margin-left: auto; }
.en-edicion .bloque { border-style: dashed; }
.bloque-vacio { text-align: center; padding: 14px 6px; color: var(--tinta-suave); }

.pizarron-vacio { text-align: center; padding: 60px 20px; border: 2px dashed var(--linea); border-radius: 10px; }
.pizarron-hijos { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--linea-suave); font-weight: 600; color: var(--tinta-suave); }
.chip { background: var(--primario-claro); color: var(--primario); padding: 4px 12px; border-radius: 99px; text-decoration: none; font-weight: 600; font-size: .9rem; }

/* KPI */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.kpi { position: relative; border: 1.5px solid color-mix(in srgb, var(--k) 45%, white); background: color-mix(in srgb, var(--k) 7%, white); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kpi-etiqueta { font: 600 .95rem var(--titulos); color: var(--tinta-suave); text-transform: uppercase; letter-spacing: .02em; }
.kpi-valor { font: 800 2.4rem/1 var(--titulos); color: var(--k); }
.kpi-sufijo { font-size: .85rem; color: var(--tinta-suave); }
.kpis-resumen .kpi-valor { font-size: 3rem; }
.kpi .barra-progreso { margin-top: 6px; height: 7px; }
.mini-captura { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 50%; border: 0; background: var(--primario); color: #fff; font-weight: 700; font-size: 1rem; cursor: pointer; line-height: 1; opacity: .85; }
.mini-captura:hover { opacity: 1; }
td .mini-captura { position: static; width: 22px; height: 22px; font-size: .9rem; }

/* Progreso */
.barra-progreso { position: relative; height: 16px; background: var(--linea-suave); border-radius: 99px; overflow: visible; }
.barra-progreso span { display: block; height: 100%; border-radius: 99px; background: var(--c, var(--primario)); transition: width .5s ease; }
.barra-progreso.completa span { background: var(--verde); }
.marca-esperado { position: absolute; top: -4px; bottom: -4px; width: 3px; margin-left: -1px; background: var(--tinta); border-radius: 2px; }
.progreso { display: flex; flex-direction: column; gap: 8px; }
.progreso-datos { position: relative; display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; padding-right: 34px; }
.progreso-cifra { display: block; font: 800 2.2rem/1 var(--titulos); }
.progreso-pct { font: 800 2.2rem/1 var(--titulos); color: var(--c); }
.progreso-datos .mini-captura { top: 0; right: 0; }

/* Tablas de indicadores */
.tabla-indicadores td, .tabla-indicadores th { padding: 7px 8px; }
.celda-pct { min-width: 90px; }
.celda-pct .barra-progreso { height: 5px; margin-top: 4px; }
.enlace-ico { color: var(--tinta-suave); font-weight: 700; }

/* Semanal */
.scroll-x { overflow-x: auto; }
.tabla-semanal { border-collapse: collapse; width: 100%; font-size: .92rem; }
.tabla-semanal th, .tabla-semanal td { border: 1px solid var(--linea); padding: 5px 6px; text-align: center; min-width: 38px; }
.tabla-semanal .etiqueta-fila { text-align: left; background: #F6F8FA; font-weight: 600; white-space: nowrap; }
.tabla-semanal tr:first-child th { background: #F6F8FA; }
.tabla-semanal th.actual { background: #FFF3C4 !important; color: #6B5200; }
.estado-cumplida { background: #E4F5E9; color: #145C2E; font-weight: 700; }
.estado-bajo { background: #FDECEC; color: #8E1C1C; font-weight: 700; }
.estado-en_curso { background: #FFFBEA; font-weight: 700; outline: 2px solid #F2B705; outline-offset: -2px; }
.pie-bloque { margin-top: 8px; }

/* Checklist y acciones */
.checklist { list-style: none; margin: 0; padding: 0; }
.checklist li { display: flex; align-items: center; gap: 6px; padding: 5px 0; border-bottom: 1px solid var(--linea-suave); }
.checklist label { display: flex; gap: 10px; align-items: flex-start; flex: 1; cursor: pointer; font-size: 1.02rem; }
.checklist input { width: 19px; height: 19px; margin-top: 2px; accent-color: var(--c); flex: none; }
.checklist li.hecho span { text-decoration: line-through; color: var(--tinta-suave); }
.icono { border: 0; background: none; cursor: pointer; color: var(--tinta-suave); font-size: 1rem; padding: 2px 5px; border-radius: 5px; }
.icono:hover { background: var(--linea-suave); }
.icono.peligro { color: var(--rojo); }
.alta-rapida { display: flex; gap: 6px; margin-top: 10px; }
.alta-rapida input { flex: 1; padding: 6px 9px; border: 1px dashed var(--linea); border-radius: 7px; font: inherit; min-width: 0; }
.tabla-acciones td { font-size: .95rem; }
.enlace-texto { border: 0; background: none; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.enlace-texto:hover { text-decoration: underline; }
.estado-fila-hecho .enlace-texto, .estado-fila-hecho td:first-child { text-decoration: line-through; color: var(--tinta-suave); }
.vencida { color: var(--rojo); font-weight: 700; }
.pastilla { border-radius: 99px; padding: 3px 8px; font: 600 .8rem var(--texto); border: 1px solid transparent; }
select.pastilla { cursor: pointer; }
.pastilla-pendiente { background: #EEF1F4; color: #4A5563; }
.pastilla-en_curso { background: #E3ECFB; color: #12306B; }
.pastilla-hecho { background: #E4F5E9; color: #145C2E; }
.pastilla-bloqueado { background: #FDECEC; color: #8E1C1C; }
.agregar-renglon { margin-top: 10px; }

/* Avisos flotantes */
#toasts { position: fixed; right: 18px; bottom: 18px; display: flex; flex-direction: column; gap: 8px; z-index: 50; }
.toast { padding: 11px 16px; border-radius: 10px; color: #fff; background: #1E3A2A; box-shadow: var(--sombra); font-weight: 600; transition: opacity .4s, transform .4s; max-width: 380px; }
.toast-error { background: #8E1C1C; }
.toast.saliendo { opacity: 0; transform: translateY(8px); }

/* Modo presentación (pantalla completa) */
.presentacion .barra, .presentacion .herramientas, .presentacion .migas, .presentacion .bloque-herramientas, .presentacion .mini-captura, .presentacion .editar-nota { display: none !important; }
.presentacion .contenido { max-width: none; padding: 12px; }
.presentacion { background: #DADFE4; }

/* ---------- Fase 2 ---------- */

/* Menú «Más» */
.menu { position: relative; }
.menu > summary { list-style: none; }
.menu > summary::-webkit-details-marker { display: none; }
.menu-lista { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 250px; background: var(--papel); border: 1px solid var(--linea); border-radius: 10px; box-shadow: var(--sombra); padding: 6px; display: flex; flex-direction: column; }
.menu-lista button, .menu-lista a { border: 0; background: none; text-align: left; padding: 9px 12px; border-radius: 7px; font: 600 .92rem var(--texto); color: var(--tinta); text-decoration: none; cursor: pointer; }
.menu-lista button:hover, .menu-lista a:hover { background: var(--primario-claro); }

/* Editor de arrastre */
.bloque { position: relative; }
.cabecera-enlaces { display: flex; gap: 6px; align-items: center; }
button.ir-sub { background: none; cursor: pointer; font-family: var(--texto); }
.asa { cursor: grab; padding: 1px 6px; font-size: 1.05rem; line-height: 1.3; color: var(--tinta-suave); border-radius: 5px; user-select: none; touch-action: none; }
.asa:hover { background: var(--linea-suave); color: var(--tinta); }
.arrastrando { opacity: .35; }
.soltar-antes { box-shadow: -6px 0 0 -1px #F2B705; }
.soltar-despues { box-shadow: 6px 0 0 -1px #F2B705; }
.tirador { position: absolute; right: 0; bottom: 0; width: 18px; height: 18px; cursor: ew-resize; touch-action: none;
  background: linear-gradient(135deg, transparent 50%, var(--c) 50%); border-top-left-radius: 4px; opacity: .7; }
.tirador:hover { opacity: 1; }
.redimensionando { outline: 3px solid #F2B705; outline-offset: 2px; }
.redimensionando::after { content: attr(data-ancho); position: absolute; right: 24px; bottom: 6px; background: var(--tinta); color: #fff; font: 600 .8rem var(--texto); padding: 2px 8px; border-radius: 99px; }

/* Embudo */
.embudo { display: flex; flex-direction: column; }
.etapa-fila { display: grid; grid-template-columns: minmax(90px, 26%) 1fr auto 24px; gap: 10px; align-items: center; }
.etapa-nombre { font: 600 .95rem var(--titulos); text-transform: uppercase; color: var(--tinta-suave); letter-spacing: .02em; }
.etapa-barra { display: flex; justify-content: center; }
.etapa-barra span { display: block; background: var(--c); color: var(--ct); border-radius: 6px; padding: 6px 8px; text-align: center; font: 800 1.25rem/1 var(--titulos); white-space: nowrap; min-width: 44px; transition: width .5s ease; }
.etapa-meta { font-size: .8rem; color: var(--tinta-suave); white-space: nowrap; min-width: 64px; text-align: right; }
.etapa .mini-captura, .hueco-captura { position: static; width: 22px; height: 22px; font-size: .9rem; }
.conversion { text-align: center; font-size: .8rem; font-weight: 700; color: var(--tinta-suave); padding: 2px 0; margin-left: 26%; }

/* Seguimiento diario */
.tabla-diaria { border-collapse: collapse; width: 100%; font-size: .9rem; }
.tabla-diaria th, .tabla-diaria td { border: 1px solid var(--linea); padding: 0; text-align: center; min-width: 38px; height: 34px; }
.tabla-diaria thead th { background: #F6F8FA; font-size: .78rem; line-height: 1.15; padding: 3px 4px; text-transform: uppercase; }
.tabla-diaria thead th.actual { background: #FFF3C4; color: #6B5200; }
.tabla-diaria .etiqueta-fila { text-align: left; padding: 4px 8px; background: #F6F8FA; font-weight: 600; white-space: nowrap; }
.tabla-diaria .total { font-weight: 800; padding: 0 6px; }
.tabla-diaria tfoot td, .tabla-diaria tfoot th { background: #F6F8FA; font-weight: 700; }
.tabla-diaria .fin-semana { background-image: repeating-linear-gradient(45deg, transparent 0 6px, rgba(0, 0, 0, .025) 6px 12px); }
.tabla-diaria td.hoy { outline: 2px solid #F2B705; outline-offset: -2px; }
.tabla-diaria .parcial { background: #FFFBEA; color: #6B5200; font-weight: 700; }
.tabla-diaria .con-valor { font-weight: 700; }
.sin-persona .etiqueta-fila { font-style: italic; color: var(--tinta-suave); }
.celda-captura { width: 100%; height: 100%; min-height: 32px; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; }
.celda-captura:hover { background: rgba(18, 48, 107, .08); }

/* Nota libre */
.nota-libre { position: relative; font-size: 1rem; }
.nota-libre p { margin: 0 0 .5em; }
.nota-libre ul { margin: 0 0 .6em; padding-left: 1.2em; }
.nota-libre li { margin: .15em 0; }
.editar-nota { position: absolute; top: -6px; right: -6px; }

/* Lista ordenable (etapas del embudo) */
.lista-ordenada .fila-orden { display: flex; align-items: center; gap: 4px; border-bottom: 1px solid var(--linea-suave); }
.lista-ordenada .fila-orden .check { flex: 1; }

/* Importar y archivos */
.ayuda-importar { background: #F6F8FA; border-radius: 8px; padding: 8px 12px; font-size: .9rem; }
.ayuda-importar p { margin: .3em 0; }
.previa { max-height: 52vh; overflow: auto; border: 1px solid var(--linea); border-radius: 8px; }
.previa .tabla th { position: sticky; top: 0; background: #fff; }
.fila-error td { background: #FFF5F5; }
.texto-error { color: var(--rojo); font-weight: 600; }
.subida { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; padding: 12px 14px; background: #F6F8FA; border-radius: 10px; margin-bottom: 14px; }
.subida .subida-pie, .subida > .nota { grid-column: 1 / -1; display: flex; gap: 12px; align-items: center; margin: 0; }
.tabla-archivos td { vertical-align: middle; }
.tabla-archivos .miniatura { width: 64px; }
.miniatura img { width: 56px; height: 42px; object-fit: cover; border-radius: 6px; display: block; border: 1px solid var(--linea); }
.miniatura .ext { display: grid; place-items: center; width: 56px; height: 42px; border-radius: 6px; background: var(--primario-claro); color: var(--primario); font: 700 .8rem var(--texto); }

/* Plantillas, mantenimiento e instalador */
.rejilla-plantillas { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin-bottom: 24px; }
.plantilla h3 { font-size: 1.3rem; }
.plantilla p { margin: .3em 0; }
.angosta-media { max-width: 720px; }
.requisitos td { padding: 5px 8px; }
.requisitos td:first-child { width: 30px; }
.login-instalador { grid-template-columns: 1fr 480px; }
.login-form h3 { font-size: 1.1rem; margin: 18px 0 4px; }
.pasos-instalacion { color: rgba(255, 255, 255, .7); padding-left: 1.2em; font-size: 1.05rem; }
.pasos-instalacion .actual { color: #fff; font-weight: 700; }
.pasos-instalacion .hecho { text-decoration: line-through; }
.campo-corto { flex: 0 0 110px; }
.config-manual { width: 100%; font: .8rem/1.4 ui-monospace, monospace; margin-bottom: 14px; }
.centrado { text-align: center; }

.presentacion .tirador, .presentacion .menu { display: none !important; }

@media (max-width: 760px) {
  .login-instalador { grid-template-columns: 1fr; }
  .subida { grid-template-columns: 1fr; }
  .etapa-fila { grid-template-columns: 1fr auto 24px; }
  .etapa-nombre { grid-column: 1 / -1; }
  .conversion { margin-left: 0; }
  .menu-lista { right: auto; left: 0; }
}

/* ---------- Fase 3 ---------- */
.texto-ok { color: var(--verde); font-weight: 600; }
.aviso-recordatorio { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; background: #FFF8E1; color: #6B5200; border: 1px solid #F2D27A; }
pre.comando { background: #1B2430; color: #E8EEFA; padding: 10px 12px; border-radius: 8px; font: .82rem/1.5 ui-monospace, monospace; white-space: pre-wrap; word-break: break-all; }

/* Gráficas */
.grafica { width: 100%; height: auto; display: block; }
.grafica .g-rejilla { stroke: #EDF0F4; stroke-width: 1; }
.grafica .g-eje { fill: #5B6675; font: 500 11px var(--texto); }
.grafica .g-actual { fill: #6B5200; font-weight: 700; }
.grafica .g-meta { stroke: #1B2430; stroke-width: 1.5; stroke-dasharray: 2 4; }
.grafica .g-meta-txt { fill: #1B2430; font: 700 11px var(--texto); }
.grafica .g-ideal { stroke: #8A94A3; stroke-width: 2; stroke-dasharray: 7 5; }
.grafica .g-real { fill: none; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.grafica .g-area { opacity: .12; }
.grafica .g-proy { stroke: #F2B705; stroke-width: 2.5; stroke-dasharray: 3 5; }
.grafica .g-valor { fill: #1B2430; font: 800 14px var(--titulos); }
.g-leyenda { display: flex; gap: 16px; flex-wrap: wrap; font-size: .82rem; color: var(--tinta-suave); margin-top: 4px; }
.g-leyenda span::before { content: ''; display: inline-block; width: 18px; height: 0; border-top: 3px solid var(--c, #8A94A3); vertical-align: middle; margin-right: 6px; }
.g-leyenda .l-ideal::before { border-top: 2px dashed #8A94A3; }
.g-leyenda .l-proy::before { border-top: 3px dotted #F2B705; }
.g-leyenda .l-caja::before { width: 11px; height: 11px; border: 0; background: var(--c); border-radius: 2px; }

/* Cortes */
.tabla-cortes th, .tabla-cortes td { white-space: nowrap; }
.tabla-cortes th a { color: var(--primario); }
.notas-corte { margin-top: 16px; padding: 12px 14px; background: #F6F8FA; border-radius: 10px; }
.notas-corte h3 { font-size: 1.05rem; }
.notas-corte p { margin: .35em 0; white-space: pre-line; }

/* Reporte imprimible */
.contenido-reporte { max-width: 1000px; }
.reporte { background: var(--papel); border-radius: var(--radio); box-shadow: var(--sombra); padding: 28px; border-top: 8px solid var(--marca); }
.reporte-cabecera { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 18px; flex-wrap: wrap; }
.reporte-proyecto { margin: 0; font: 700 .9rem var(--texto); text-transform: uppercase; letter-spacing: .06em; color: var(--marca); }
.reporte-cabecera h1 { font-size: 2.2rem; margin: 2px 0; }
.reporte-fecha { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.reporte-fecha strong { font: 700 1.25rem var(--titulos); }
.reporte-tabla .barra-progreso { height: 5px; margin-top: 4px; min-width: 70px; }
.reporte-tabla .barra-progreso span { background: var(--marca); }
.reporte-acciones { display: flex; gap: 20px; margin: 16px 0; padding: 10px 14px; background: #F6F8FA; border-radius: 9px; flex-wrap: wrap; }
.reporte-notas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-top: 18px; }
.reporte-notas section { border: 1px solid var(--linea); border-radius: 10px; padding: 12px 14px; }
.reporte-notas h2 { font-size: 1.1rem; color: var(--marca); }
.reporte-notas p { margin: 0; }

/* Ecosistema */
.semaforo-resumen { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }
.semaforo-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 99px; font: 600 .85rem var(--texto); white-space: nowrap; }
.semaforo-chip::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.s-verde.semaforo-chip { background: #E4F5E9; color: #145C2E; }
.s-ambar.semaforo-chip { background: #FFF3C4; color: #6B5200; }
.s-rojo.semaforo-chip { background: #FDECEC; color: #8E1C1C; }
.s-neutral.semaforo-chip { background: #EEF1F4; color: #4A5563; }
.semaforo-resumen .semaforo-chip { font-size: 1rem; padding: 7px 16px; }
.eco-proyecto { margin-bottom: 28px; }
.eco-proyecto h2 { border-left: 6px solid var(--c); padding-left: 10px; }
.eco-proyecto h2 a { color: var(--tinta); text-decoration: none; }
.eco-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.eco-tarjeta { display: flex; flex-direction: column; gap: 6px; background: var(--papel); border-radius: var(--radio); box-shadow: var(--sombra); padding: 16px; text-decoration: none; color: var(--tinta); border-top: 5px solid var(--c); --c: var(--primario); }
.eco-proyecto .eco-tarjeta { --c: inherit; }
.eco-tarjeta.s-verde { border-top-color: var(--verde); }
.eco-tarjeta.s-ambar { border-top-color: var(--ambar); }
.eco-tarjeta.s-rojo { border-top-color: var(--rojo); }
.eco-tarjeta:hover { box-shadow: 0 2px 4px rgba(16, 24, 40, .08), 0 10px 26px rgba(16, 24, 40, .12); }
.eco-cabeza { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.eco-cabeza strong { font: 700 1.2rem var(--titulos); }
.eco-cifra { display: flex; align-items: baseline; gap: 6px; }
.eco-cifra b { font: 800 2.3rem/1 var(--titulos); }
.eco-cifra span { color: var(--tinta-suave); font-weight: 600; }
.eco-cifra em { margin-left: auto; font: 800 1.4rem var(--titulos); font-style: normal; }
.eco-tarjeta .barra-progreso { height: 10px; }
.eco-tarjeta .barra-progreso span { background: var(--primario); }
.eco-tarjeta.s-verde .barra-progreso span { background: var(--verde); }
.eco-tarjeta.s-rojo .barra-progreso span { background: var(--rojo); }
.eco-tarjeta.s-ambar .barra-progreso span { background: #D9A400; }
.eco-datos { list-style: none; margin: 4px 0 0; padding: 0; font-size: .88rem; color: var(--tinta-suave); }
.eco-pie { display: flex; gap: 12px; flex-wrap: wrap; font-size: .8rem; color: var(--tinta-suave); border-top: 1px solid var(--linea-suave); padding-top: 8px; margin-top: auto; }

/* Impresión y PDF (Imprimir › Guardar como PDF) */
@page { size: A4 landscape; margin: 10mm; }
@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body { background: #fff; font-size: 12px; }
  .barra, .herramientas, .migas, .bloque-herramientas, .mini-captura, .tirador, .menu, #toasts, .no-imprimir,
  .aviso, .editar-nota, .alta-rapida, .agregar-renglon, .icono, .celda-captura:empty { display: none !important; }
  .contenido { max-width: none; padding: 0; }
  .pizarron-marco { border-width: 4px; box-shadow: none; padding: 10px; }
  .bloque, .eco-tarjeta, .reporte-notas section, tr { break-inside: avoid; }
  .rejilla { gap: 8px; }
  .reporte, .eco-tarjeta, .tarjeta { box-shadow: none; border: 1px solid var(--linea); }
  a { color: inherit; text-decoration: none; }
  .scroll-x { overflow: visible; }
  select.pastilla { appearance: none; border: 0; }
}

/* ---------- responsivo ---------- */
@media (max-width: 1000px) {
  .rejilla { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .bloque { grid-column: span 6 !important; }
}
@media (max-width: 760px) {
  .barra { flex-wrap: wrap; gap: 10px 16px; padding: 10px 16px; position: static; }
  .barra-nav { order: 3; flex-basis: 100%; overflow-x: auto; gap: 16px; }
  .barra-usuario { margin-left: auto; }
  .usuario-datos { display: none; }
  .login { grid-template-columns: 1fr; gap: 20px; }
  .login-marca h1 { font-size: 2.4rem; }
  .login-logo img { max-width: 440px; margin: 0 auto; }
  .pizarron-marco { padding: 12px; border-width: 6px; }
  .pizarron-cabecera { grid-template-columns: 1fr; text-align: center; }
  .pizarron-logo { display: flex; justify-content: center; }
  .pizarron-meta { align-items: center; text-align: center; }
  .pizarron-lema { transform: none; max-width: none; }
  .kpis-resumen .kpi-valor { font-size: 2.3rem; }
  .tabla-acciones th:nth-child(3), .tabla-acciones td:nth-child(3) { display: none; }
}