/* Componentes de la ficha, panel, tablas y líneas de tiempo */
.flex { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.entre { justify-content: space-between; }
.m0 { margin: 0; }
.chico { font-size: .82rem; }
.nav-item__texto { min-width: 0; flex: 1; }

.avance { display: inline-flex; align-items: center; gap: 8px; min-width: 110px; }
.avance__barra { flex: 1; height: 8px; min-width: 50px; background: var(--superficie-2); border-radius: 4px; overflow: hidden; border: 1px solid var(--linea); }
.avance__barra > span { display: block; height: 100%; border-radius: 4px; }
.avance__num { font-family: var(--f-mono); font-size: .8rem; font-weight: 600; min-width: 3.2em; text-align: right; }
.avance--verde .avance__barra > span { background: var(--ok); }
.avance--amarillo .avance__barra > span { background: #E2B714; }
.avance--rojo .avance__barra > span { background: var(--critico); }
.avance--verde .avance__num { color: var(--ok); }
.avance--amarillo .avance__num { color: var(--amarillo); }
.avance--rojo .avance__num { color: var(--critico); }

.barra-marca { height: 10px; background: var(--superficie-2); border-radius: 5px; overflow: hidden; }
.barra-marca > span { display: block; height: 100%; background: var(--lima); border-radius: 5px; }

.pill--fase { background: color-mix(in srgb, var(--c) 14%, transparent); color: var(--c); }
.pill--critica { background: var(--critico-fondo); color: var(--critico); }
.pill--completada { background: var(--ok-fondo); color: var(--ok); }
.pill--en_curso { background: var(--info-fondo); color: var(--info); }
.pill--bloqueada { background: var(--advertencia-fondo); color: var(--advertencia); }
.pill--pendiente, .pill--neutro { background: var(--superficie-2); color: var(--texto-2); }
.etiqueta-area { display: inline-flex; align-items: center; gap: 6px; font-size: .85rem; white-space: nowrap; }
.etiqueta-area::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--c); flex: none; }

/* Ficha */
.ficha-cab { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: end; margin-bottom: 18px; }
.ficha-cab__datos p { margin: 6px 0 0; }
.ficha-cab__lado { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; min-width: 260px; }
.ficha-cab__avance { width: 100%; }
.ficha-cab__avance .barra-marca { margin-top: 4px; }
.selector-estado select, .select-chico { font: inherit; font-size: .85rem; padding: 6px 8px; border-radius: var(--radio-s); border: 1px solid var(--linea); background: var(--superficie); color: var(--texto); }
@media (max-width: 700px) { .ficha-cab { grid-template-columns: 1fr; } .ficha-cab__lado { align-items: stretch; min-width: 0; } }

/* Stepper de fases */
.stepper { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-bottom: 8px; }
.paso { position: relative; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio-s); padding: 10px 12px 12px; text-align: left; font: inherit; color: inherit; cursor: pointer; width: 100%; }
.paso:hover { border-color: var(--texto-2); }
.paso__n { font-family: var(--f-mono); font-size: .7rem; color: var(--texto-2); letter-spacing: .08em; text-transform: uppercase; }
.paso__nombre { font-family: var(--f-titulo); font-weight: 700; font-size: .95rem; display: block; margin: 2px 0 6px; }
.paso__datos { font-family: var(--f-mono); font-size: .75rem; color: var(--texto-2); }
.paso .barra-marca { height: 6px; margin-top: 6px; }
.paso--actual { border: 2px solid var(--lima); background: var(--lima-suave); }
.paso--actual .paso__n { color: var(--lima-texto); font-weight: 700; }
.paso[disabled] { cursor: default; }
.stepper form { margin: 0; }
@media (max-width: 700px) { .stepper { grid-template-columns: repeat(5, minmax(130px, 1fr)); overflow-x: auto; } }

.columnas { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.columnas > .tarjeta { margin-top: 0; }
.columnas-panel { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
.columnas-panel > * { min-width: 0; }
@media (max-width: 1100px) { .columnas-panel { grid-template-columns: 1fr; } }
.tarjeta h2 { font-size: 1rem; margin-bottom: 12px; }
.lista { list-style: none; margin: 0; padding: 0; }
.lista > li { padding: 9px 0; border-bottom: 1px solid var(--linea); }
.lista > li:last-child { border-bottom: 0; }
.lista__sub { font-size: .8rem; color: var(--texto-2); }
.fila-area { display: grid; grid-template-columns: 150px 1fr; gap: 10px; align-items: center; padding: 6px 0; }
.seccion { margin-top: 24px; }

/* Filtros */
.filtros { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 14px; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--linea); background: var(--superficie); color: var(--texto); text-decoration: none; font-size: .85rem; font-weight: 500; cursor: pointer; font-family: inherit; }
.chip:hover { border-color: var(--texto-2); }
.chip[aria-current="true"], .chip.activo { background: var(--marino); border-color: var(--marino); color: #fff; }
.chip__n { font-family: var(--f-mono); font-size: .72rem; opacity: .85; }
.chip__n.critico { color: var(--critico); font-weight: 700; opacity: 1; }
.chip.activo .chip__n.critico, .chip[aria-current="true"] .chip__n.critico { color: #FF9C90; }
.filtros select { font: inherit; font-size: .85rem; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--linea); background: var(--superficie); color: var(--texto); }

/* Tablas de tareas */
.tabla .col-check { width: 36px; text-align: center; }
.tabla input[type=checkbox], .check { width: 18px; height: 18px; accent-color: var(--lima-texto); cursor: pointer; }
.tabla .tarea-titulo { font-weight: 600; }
.tabla .tarea-notas { font-size: .8rem; color: var(--texto-2); max-width: 46ch; }
.tabla tr.es-completada .tarea-titulo { text-decoration: line-through; color: var(--texto-2); }
.tabla tr.es-critica td:first-child { box-shadow: inset 3px 0 0 var(--critico); }
.tabla a.fila-link { color: inherit; text-decoration: none; }
.tabla a.fila-link:hover { text-decoration: underline; }
.tabla .num { font-family: var(--f-mono); font-size: .82rem; white-space: nowrap; }

/* Línea de tiempo vertical (hitos, historial) */
.linea-tiempo { list-style: none; margin: 0; padding: 0 0 0 28px; position: relative; }
.linea-tiempo::before { content: ""; position: absolute; left: 10px; top: 6px; bottom: 6px; width: 2px; background: var(--linea); }
.linea-tiempo > li { position: relative; padding: 0 0 14px; }
.linea-tiempo > li::before { content: ""; position: absolute; left: -24px; top: 18px; width: 12px; height: 12px; border-radius: 50%; background: var(--superficie); border: 2px solid var(--texto-2); }
.linea-tiempo > li.ok::before { background: var(--ok); border-color: var(--ok); }
.linea-tiempo > li.critico::before { background: var(--critico); border-color: var(--critico); }
.linea-tiempo > li.info::before { border-color: var(--info); }
.item-tl { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 12px 14px; display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start; }
.item-tl--simple { grid-template-columns: 1fr auto; }
.item-tl h3 { margin: 0 0 2px; font-size: .98rem; }
.item-tl p { margin: 4px 0 0; color: var(--texto-2); font-size: .88rem; white-space: pre-line; }
.item-tl__meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; font-size: .8rem; margin-bottom: 4px; }
.item-tl input[type=checkbox] { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--ok); cursor: pointer; }
.item-tl form { margin: 0; }
.pill--tipo-avance { background: var(--ok-fondo); color: var(--ok); }
.pill--tipo-nota { background: var(--superficie-2); color: var(--texto-2); }
.pill--tipo-entregable { background: var(--info-fondo); color: var(--info); }
.pill--tipo-alerta { background: var(--critico-fondo); color: var(--critico); }
.pill--tipo-reunion { background: color-mix(in srgb, #6B4FA8 16%, transparent); color: #8A6CD0; }
.pill--tipo-hito { background: var(--lima-suave); color: var(--lima-texto); }
.pill--tipo-tarea { background: var(--advertencia-fondo); color: var(--advertencia); }

/* Panel */
.tarjeta-cliente { display: flex; flex-direction: column; gap: 8px; border-top: 4px solid var(--c, var(--lima)); }
.tarjeta-cliente h3 { margin: 0; }
.tarjeta-cliente h3 a { color: inherit; text-decoration: none; }
.tarjeta-cliente h3 a:hover { text-decoration: underline; }
.dato { display: grid; grid-template-columns: 105px 1fr; gap: 4px 8px; font-size: .84rem; margin: 0; }
.dato dt { color: var(--texto-2); }
.dato dd { margin: 0; min-width: 0; }
.personas { display: flex; flex-wrap: wrap; gap: 6px; }
.resumen-persona { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 10px 0 14px; }
.resumen-persona > div { background: var(--superficie-2); border-radius: var(--radio-s); padding: 8px 10px; }
.resumen-persona b { display: block; font-family: var(--f-mono); font-size: 1.3rem; }
.resumen-persona span { font-size: .78rem; color: var(--texto-2); }
@media (max-width: 600px) { .resumen-persona { grid-template-columns: repeat(2, 1fr); } }
.plazo--atraso { color: var(--critico); font-weight: 600; }
.plazo--proximo { color: var(--amarillo); }
tr.fila-click { cursor: pointer; }
.n-orden { font-family: var(--f-mono); font-weight: 700; color: var(--texto-2); }

@media (prefers-color-scheme: dark) {
  .pill--fase { background: color-mix(in srgb, var(--c) 32%, transparent); color: #fff; }
  .chip[aria-current="true"], .chip.activo { background: var(--lima); border-color: var(--lima); color: var(--marino); }
  .chip.activo .chip__n.critico, .chip[aria-current="true"] .chip__n.critico { color: #A3241A; }
}
[x-cloak] { display: none !important; }

/* ---------- Carta Gantt ---------- */
.gantt { overflow-x: auto; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--superficie); max-width: 100%; }
.gantt__tabla { border-collapse: separate; border-spacing: 0; font-size: .85rem; }
.gantt__tabla th { position: sticky; top: 0; z-index: 2; background: var(--superficie-2); font-family: var(--f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); text-align: left; padding: 0 8px; height: 44px; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.gantt__tabla td { height: var(--alto); padding: 0 6px; border-bottom: 1px solid var(--linea); white-space: nowrap; background: var(--superficie); }
.g-col-tarea { position: sticky; left: 0; z-index: 1; min-width: 260px; max-width: 260px; border-right: 1px solid var(--linea); }
th.g-col-tarea { z-index: 3; }
.g-col-hito { width: 34px; text-align: center; }
.g-col-fase { width: 150px; min-width: 150px; }
.g-col-fecha { width: 132px; }
.g-col-avance { width: 76px; border-right: 1px solid var(--linea); }
.g-col-linea { padding: 0 !important; }
.g-linea { background-image: repeating-linear-gradient(to right, var(--linea) 0 1px, transparent 1px calc(var(--px-dia) * 7)) !important; background-color: var(--superficie) !important; }
.g-linea a { display: block; line-height: 0; }
.g-linea svg { display: block; }
.g-grupo td { background: var(--superficie-2); height: 30px; }
.g-grupo .g-linea { background-color: var(--superficie-2) !important; }
.g-fila:hover td { background-color: var(--superficie-2); }
.g-fila--critica .g-col-tarea { box-shadow: inset 3px 0 0 var(--critico); }
.g-txt { display: block; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.g-in { font: inherit; font-size: .84rem; color: var(--texto); background: transparent; border: 1px solid transparent; border-radius: 4px; padding: 4px 6px; width: 100%; }
.g-in:hover { border-color: var(--linea); }
.g-in:focus { outline: none; border-color: var(--info); background: var(--superficie); box-shadow: var(--foco); }
.g-in--titulo { font-weight: 600; text-overflow: ellipsis; }
.g-in--fase { border-left: 4px solid var(--c); padding-left: 6px; }
.g-in--avance { font-family: var(--f-mono); font-weight: 600; text-align: right; width: 64px; }
.g-in--avance.avance--verde { color: var(--ok); }
.g-in--avance.avance--amarillo { color: var(--amarillo); }
.g-in--avance.avance--rojo { color: var(--critico); }
.g-escala text { font-family: var(--f-mono); font-size: 10px; fill: var(--texto-2); }
.g-escala .g-mes { fill: var(--superficie-2); stroke: var(--linea); }
.g-escala .g-dia { font-size: 9px; }
.g-sep { stroke: var(--linea); }
.g-hoy { stroke: #C0392B; stroke-width: 2; }
.g-rombo { fill: var(--superficie); stroke: #3F8A05; stroke-width: 2; }
.g-rombo--ok { fill: #3F8A05; }
.g-nueva { font-family: var(--f-mono); font-size: 10px; font-weight: 700; fill: var(--lima-texto); }
.leyenda { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 10px; font-size: .8rem; color: var(--texto-2); align-items: center; }
.leyenda__item { display: inline-flex; gap: 6px; align-items: center; }
.htmx-request.gantt, .htmx-request .gantt { opacity: .7; }

/* ---------- Calendario ---------- */
.cal-mes { border: 1px solid var(--linea); border-radius: var(--radio); overflow: hidden; background: var(--superficie); }
.cal-mes__cab, .cal-mes__fila { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-mes__cab div { padding: 8px; font-family: var(--f-mono); font-size: .7rem; text-transform: uppercase; color: var(--texto-2); background: var(--superficie-2); border-bottom: 1px solid var(--linea); }
.cal-dia { display: flex; flex-direction: column; gap: 3px; min-height: 118px; padding: 6px; border-right: 1px solid var(--linea); border-bottom: 1px solid var(--linea); text-decoration: none; color: inherit; min-width: 0; }
.cal-mes__fila .cal-dia:last-child { border-right: 0; }
.cal-dia:hover { background: var(--superficie-2); }
.cal-dia--fuera { background: color-mix(in srgb, var(--superficie-2) 60%, transparent); }
.cal-dia--fuera .cal-dia__n { opacity: .45; }
.cal-dia__n { font-family: var(--f-mono); font-size: .8rem; font-weight: 600; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; }
.cal-dia--hoy { box-shadow: inset 0 0 0 2px var(--lima); }
.cal-dia--hoy .cal-dia__n { background: var(--lima); color: var(--marino); }
.cal-dia__lineas { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cal-ln { font-size: .72rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 3px solid var(--c); padding-left: 4px; }
.cal-ln--hito { color: var(--lima-texto); }
.cal-ln--rojo { color: var(--critico); font-weight: 600; }
.cal-ln--curso { color: var(--texto-2); border-left-color: var(--linea); }
.cal-mas { font-size: .7rem; color: var(--texto-2); font-weight: 600; }
.cal-puntos { display: none; gap: 3px; flex-wrap: wrap; }
.cal-puntos i { width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
@media (max-width: 700px) {
  .cal-dia { min-height: 56px; padding: 4px; }
  .cal-dia__lineas { display: none; }
  .cal-puntos { display: flex; }
}
.cal-semana { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 8px; overflow-x: auto; }
.cal-col { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 8px; display: flex; flex-direction: column; gap: 6px; min-height: 300px; }
.cal-col--hoy { border: 2px solid var(--lima); }
.cal-col__cab { font-family: var(--f-mono); font-size: .75rem; text-transform: uppercase; color: var(--texto-2); text-decoration: none; }
.cal-col__cab b { font-size: 1.2rem; color: var(--texto); }
.cal-bloque { border-left: 3px solid var(--c); background: var(--superficie-2); border-radius: 0 var(--radio-s) var(--radio-s) 0; padding: 6px 8px; display: flex; flex-direction: column; gap: 3px; font-size: .78rem; }
.cal-bloque b { font-size: .8rem; }
.cal-bloque--reunion { background: color-mix(in srgb, var(--c) 12%, var(--superficie)); }
.cal-t { display: block; }
.cal-t i.pill { font-style: normal; font-size: .65rem; padding: 0 5px; background: var(--superficie); }
.cal-t--rojo { color: var(--critico); font-weight: 600; }
.cal-dia-cliente { border-left: 3px solid var(--c); padding: 4px 0 10px 12px; margin-bottom: 10px; }
.cal-dia-cliente h3 { margin-bottom: 4px; }
details summary { cursor: pointer; color: var(--texto-2); padding: 4px 0; }

/* ---------- Línea de tiempo de reuniones ---------- */
.lt { position: relative; }
.lt__barra { display: flex; gap: 6px; justify-content: flex-end; margin-bottom: 6px; }
.lt__pista { overflow-x: auto; padding: 4px 4px 14px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.lt__lista { list-style: none; margin: 0; padding: 0; display: flex; gap: 14px; align-items: stretch; position: relative; min-width: max-content; }
.lt__lista::before { content: ""; position: absolute; left: 0; right: 0; top: 37px; height: 2px; background: var(--linea); }
.lt__item { width: 250px; flex: none; display: flex; flex-direction: column; gap: 6px; position: relative; scroll-snap-align: center; }
.lt__meta { display: flex; gap: 8px; align-items: center; font-size: .75rem; height: 22px; }
.lt__n { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-family: var(--f-mono); font-weight: 700; background: var(--superficie-2); border: 1px solid var(--linea); }
.lt__dist { margin-left: auto; color: var(--texto-2); font-family: var(--f-mono); }
.lt__punto { width: 16px; height: 16px; border-radius: 50%; border: 3px solid var(--texto-2); background: var(--superficie); margin-left: 4px; position: relative; z-index: 1; }
.lt__item--pasada .lt__punto { background: var(--marino); border-color: var(--marino); }
.lt__item--proxima .lt__punto { background: var(--lima); border-color: var(--lima-texto); box-shadow: 0 0 0 4px var(--lima-suave); }
.lt__item--futura .lt__punto { border-style: dashed; }
.lt__tarjeta { display: flex; flex-direction: column; gap: 5px; text-decoration: none; color: inherit; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 12px; flex: 1; transition: transform .15s ease, box-shadow .15s ease; }
.lt__item--futura .lt__tarjeta { border-style: dashed; }
.lt__item--proxima .lt__tarjeta { border: 2px solid var(--lima); background: var(--lima-suave); }
.lt__tarjeta:hover, .lt__tarjeta:focus-visible { transform: translateY(-4px); box-shadow: var(--sombra-alta); }
.lt__tema { font-size: .95rem; }
.lt__sub { font-size: .8rem; color: var(--texto-2); }
.lt__cliente { font-size: .75rem; font-weight: 600; border-left: 3px solid var(--c); padding-left: 6px; }
.lt__ver { font-size: .78rem; font-weight: 600; color: var(--info); opacity: 0; transition: opacity .15s; margin-top: auto; }
.lt__tarjeta:hover .lt__ver, .lt__tarjeta:focus-visible .lt__ver { opacity: 1; }
.lt__hoy { flex: none; width: 34px; position: relative; display: flex; justify-content: center; }
.lt__hoy::before { content: ""; position: absolute; top: 22px; bottom: 0; width: 2px; background: var(--critico); }
.lt__hoy span { position: relative; z-index: 1; font-family: var(--f-mono); font-size: .65rem; font-weight: 700; color: #fff; background: var(--critico); padding: 2px 5px; border-radius: 4px; height: fit-content; }
.pill--proxima { background: var(--lima); color: var(--marino); align-self: flex-start; }

/* Editor de reunión */
.editor-reunion .tarjeta + .tarjeta { margin-top: 16px; }
.chips-sel { display: flex; flex-wrap: wrap; gap: 6px; }
.chip-sel { position: relative; }
.chip-sel input { position: absolute; opacity: 0; }
.chip-sel span { display: inline-flex; gap: 6px; align-items: baseline; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--linea); background: var(--superficie); cursor: pointer; font-size: .85rem; }
.chip-sel small { color: var(--texto-2); font-size: .72rem; }
.chip-sel input:checked + span { background: var(--marino); color: #fff; border-color: var(--marino); }
.chip-sel input:checked + span small { color: #C9D3E3; }
.chip-sel input:focus-visible + span { box-shadow: var(--foco); }
.tabla-editor td { padding: 4px 6px; }
.tabla-editor .g-in { border-color: var(--linea); min-width: 110px; }
.barra-guardar { position: sticky; bottom: 0; z-index: 5; display: flex; gap: 8px; justify-content: flex-end; padding: 12px 0; margin-top: 16px; background: linear-gradient(transparent, var(--fondo) 30%); }
.gantt-previa { overflow-x: auto; }
.gantt-previa .gantt__tabla td, .gantt-previa .gantt__tabla th { font-size: .78rem; }
@media (prefers-color-scheme: dark) {
  .chip-sel input:checked + span { background: var(--lima); color: var(--marino); border-color: var(--lima); }
  .chip-sel input:checked + span small { color: var(--marino); }
  .gantt-previa { --superficie: #FFFFFF; --superficie-2: #F4F6FA; --texto: #0C203E; --texto-2: #56627A; --linea: #D6DCE6; color: #0C203E; }
  .gantt-previa .gantt { background: #fff; }
  .gantt-previa .pill--fase { color: color-mix(in srgb, var(--c) 62%, #000); }
}

/* KPIs */
.spark { display: block; flex: none; }
.pop { position: absolute; right: 0; top: calc(100% + 4px); z-index: 10; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); box-shadow: var(--sombra-alta); padding: 10px; display: flex; flex-direction: column; gap: 6px; min-width: 190px; }
.pop label { display: flex; flex-direction: column; gap: 2px; }
.pop .g-in { border-color: var(--linea); }
.tabla-editor input, .tabla-editor select { font: inherit; font-size: .85rem; padding: 6px 8px; border: 1px solid var(--linea); border-radius: 4px; background: var(--superficie); color: var(--texto); width: 100%; }
.tabla-editor input[type=checkbox] { width: 18px; }
.pill--ok { background: var(--ok-fondo); color: var(--ok); }
@media (prefers-color-scheme: dark) { .spark__meta { stroke: #9DAECA; } }

/* Equipo */
.cargo { display: flex; flex-direction: column; gap: 8px; border-top: 4px solid var(--c); }
.resp { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: .85rem; }
.resp li { display: flex; justify-content: space-between; align-items: center; gap: 6px; background: var(--superficie-2); border-radius: var(--radio-s); padding: 4px 8px; }
.resp__x { background: none; border: 0; color: var(--texto-2); font-size: 1.1rem; cursor: pointer; line-height: 1; padding: 0 4px; }
.resp__x:hover { color: var(--critico); }

/* Organigrama por áreas (árbol con conectores) */
.org { overflow-x: auto; padding: 8px 0 20px; }
.org ul { list-style: none; margin: 0; padding: 26px 0 0; display: flex; justify-content: center; position: relative; }
.org__arbol { padding-top: 0 !important; min-width: max-content; }
.org li { position: relative; padding: 26px 10px 0; display: flex; flex-direction: column; align-items: center; }
.org__arbol > li { padding-top: 0; }
.org li::before, .org li::after { content: ""; position: absolute; top: 0; width: 50%; height: 26px; border-top: 2px solid var(--linea); }
.org li::before { right: 50%; }
.org li::after { left: 50%; border-left: 2px solid var(--linea); }
.org li:only-child::before, .org li:only-child::after { display: none; }
.org li:only-child { padding-top: 26px; }
.org__arbol > li:only-child { padding-top: 0; }
.org li:first-child::before, .org li:last-child::after { border: 0 none; }
.org li:last-child::before { border-right: 2px solid var(--linea); border-radius: 0 6px 0 0; }
.org li:first-child::after { border-radius: 6px 0 0 0; }
.org ul ul::before { content: ""; position: absolute; top: 0; left: 50%; height: 26px; border-left: 2px solid var(--linea); }
.org li:only-child > .org-area::before { content: ""; position: absolute; top: -26px; left: 50%; height: 26px; border-left: 2px solid var(--linea); }
.org__arbol > li:only-child > .org-area::before { display: none; }
.org-area { position: relative; width: 240px; background: var(--superficie); border: 1px solid var(--linea); border-top: 5px solid var(--c); border-radius: var(--radio); padding: 8px; box-shadow: var(--sombra); display: flex; flex-direction: column; gap: 6px; }
.org-area__cab { display: flex; align-items: center; gap: 8px; padding: 2px 4px 6px; border-bottom: 1px solid var(--linea); }
.org-area__cab b { color: var(--c); font-family: var(--f-titulo); }
.org-area__cab .mono { margin-left: auto; color: var(--texto-2); }
.org-persona { display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; background: var(--superficie-2); border-left: 3px solid var(--c); border-radius: var(--radio-s); padding: 6px 8px; font-size: .88rem; text-align: left; }
.org-mas { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; text-decoration: none; font-weight: 700; color: var(--texto-2); border: 1px solid var(--linea); background: var(--superficie); line-height: 1; }
.org-mas:hover { color: var(--lima-texto); border-color: var(--lima-texto); }
@media (prefers-color-scheme: dark) { .org-area__cab b { color: #fff; } }

/* Flujos */
.editor-flujo .tarjeta + .tarjeta { margin-top: 14px; }
.diagrama-cont { overflow-x: auto; padding: 10px; }
.diagrama svg { display: block; background: #fff; border-radius: var(--radio-s); }
.org-area__cab { white-space: nowrap; }
.btn { white-space: nowrap; }

/* Documentos */
.docs { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 800px) { .docs { grid-template-columns: minmax(0, 1fr); } }
.arbol, .arbol ul { list-style: none; margin: 0; padding: 0; }
.arbol ul { padding-left: 12px; }
.arbol a { display: flex; justify-content: space-between; gap: 6px; padding: 6px 8px; border-radius: var(--radio-s); text-decoration: none; color: var(--texto); font-size: .9rem; }
.arbol a:hover { background: var(--superficie-2); }
.arbol a[aria-current="page"] { background: var(--lima-suave); font-weight: 600; }
.subida { border: 2px dashed var(--linea); text-align: center; }
.subida--sobre { border-color: var(--lima-texto); background: var(--lima-suave); }
.subida__zona { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.subida .form-rejilla { text-align: left; }
.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.galeria__item { margin: 0; }
.galeria__item button { padding: 0; border: 0; background: none; cursor: zoom-in; display: block; width: 100%; border-radius: var(--radio-s); overflow: hidden; }
.galeria__item img { width: 100%; height: 120px; object-fit: cover; display: block; }
.galeria__item figcaption { margin-top: 4px; color: var(--texto-2); }
.visor { position: fixed; inset: 0; z-index: 100; background: rgba(8, 22, 44, .94); display: grid; place-items: center; padding: 40px 60px; }
.visor__foto { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; max-height: 100%; }
.visor__foto img { max-width: 100%; max-height: calc(100vh - 120px); object-fit: contain; border-radius: 6px; }
.visor__foto figcaption { color: #C9D3E3; font-size: .9rem; }
.visor__foto a { color: var(--lima); }
.visor__btn { position: absolute; background: rgba(255,255,255,.12); color: #fff; border: 0; width: 46px; height: 46px; border-radius: 50%; font-size: 1.6rem; cursor: pointer; }
.visor__btn:hover { background: rgba(255,255,255,.25); }
.visor__btn--cerrar { top: 16px; right: 16px; }
.visor__btn--ant { left: 12px; top: 50%; }
.visor__btn--sig { right: 12px; top: 50%; }

/* ---------- Fase 7: accesibilidad y celular ---------- */
.tabla-contenedor, .gantt, .pestanas, .lt__pista, .diagrama-cont, .org, .cal-semana { position: relative; }
.docs__carpetas form input { min-width: 0; flex: 1; }
.docs__carpetas { min-width: 0; }
nav.pestanas { min-width: 0; }
.cal-dia--fuera .cal-dia__n { opacity: 1; color: var(--texto-2); }
/* Texto semántico con contraste AA sobre fondos tenues */
.pill--ok, .pill--activo, .pill--completada, .pill--tipo-avance { color: var(--ok-texto); }
.pill--critico, .pill--critica, .pill--bloqueado, .pill--tipo-alerta { color: var(--critico-texto); }
.pill--fase { color: color-mix(in srgb, var(--c) 62%, #000); }
.avance--verde .avance__num, .g-in--avance.avance--verde { color: var(--ok-texto); }
.avance--rojo .avance__num, .g-in--avance.avance--rojo { color: var(--critico-texto); }
.plazo--atraso, .cal-ln--rojo, .cal-t--rojo { color: var(--critico-texto); }
.org-area__cab b { color: color-mix(in srgb, var(--c) 62%, #000); }
@media (prefers-color-scheme: dark) {
  .pill--fase, .org-area__cab b { color: #fff; }
}