/* ==========================================================================
   Sistema de Cómputo ERM 2026
   ========================================================================== */
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fuentes/Inter.woff2") format("woff2");
}
:root {
  --navy-950: #0a1526;
  --navy-900: #0e2140;
  --navy-800: #16305a;
  --navy-700: #22416f;
  --primario: #1d4f91;
  --primario-600: #163f76;
  --primario-50: #edf3fb;
  --acento: #c8102e;
  --exito: #157a3c;
  --exito-50: #eaf6ee;
  --aviso: #a8540b;
  --aviso-50: #fdf5e7;
  --peligro: #b42318;
  --peligro-50: #fdeeed;
  --info: #0b6aa2;
  --info-50: #e8f3fa;
  --fondo: #f4f5f7;
  --superficie: #ffffff;
  --borde: #e4e7ec;
  --borde-fuerte: #d0d5dd;
  --texto: #101828;
  --titulo: #0e2140;
  --tenue: #5d6778;
  --radio: 10px;
  --radio-sm: 6px;
  --sombra: 0 1px 2px rgba(16, 24, 40, .04);
  --sombra-lg: 0 12px 32px rgba(16, 24, 40, .14);
  --lateral: 248px;
  --alto-top: 56px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fondo); color: var(--texto);
  font: 14.5px/1.5 "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  font-variant-numeric: tabular-nums; font-feature-settings: "cv11", "ss03";
  -webkit-font-smoothing: antialiased;
}
a { color: var(--primario); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { line-height: 1.25; margin: 0; color: var(--titulo); }
h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; }
h2 { font-size: 1.02rem; font-weight: 650; letter-spacing: -.01em; }
h3 { font-size: .93rem; font-weight: 650; }
p { margin: .4rem 0; }
code { background: #eef1f6; padding: 1px 6px; border-radius: 5px; font-size: .88em; overflow-wrap: anywhere; }
.sub { color: var(--tenue); margin: .25rem 0 0; }
.tenue { color: var(--tenue); }
.ayuda { color: var(--tenue); font-size: .84rem; }
.num { text-align: right; }
.centro { text-align: center; }
.nowrap { white-space: nowrap; }
.solo-movil { display: none; }
.ico { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ico.lg { width: 22px; height: 22px; }
.oculto { display: none !important; }

/* ---------- estructura general ---------- */
.lateral {
  position: fixed; inset: 0 auto 0 0; width: var(--lateral); z-index: 40;
  background: var(--navy-900); border-top: 3px solid var(--acento);
  color: #c3cfe0; display: flex; flex-direction: column;
  transition: transform .25s ease;
}
.lateral-marca { display: flex; align-items: center; gap: .75rem; padding: 1rem 1.15rem; border-bottom: 1px solid rgba(255,255,255,.08); }
.logo {
  width: 38px; height: 38px; border-radius: 8px; display: grid; place-items: center; flex: none;
  background: var(--acento); color: #fff; font-weight: 800; font-size: .82rem; letter-spacing: .03em;
}
.lateral-marca b { display: block; color: #fff; font-size: .95rem; font-weight: 650; letter-spacing: -.01em; }
.lateral-marca span { font-size: .75rem; color: #8b9cb8; }
.lateral-nav { flex: 1; overflow-y: auto; padding: .6rem .65rem; }
.nav-titulo { font-size: .66rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: #6d80a0; padding: .95rem .7rem .35rem; }
.nav-enlace {
  position: relative; display: flex; align-items: center; gap: .7rem; padding: .5rem .7rem; margin: 1px 0; border-radius: var(--radio-sm);
  color: #c3cfe0; font-weight: 500; font-size: .88rem;
}
.nav-enlace .ico { width: 17px; height: 17px; opacity: .85; }
.nav-enlace:hover { background: rgba(255,255,255,.06); color: #fff; text-decoration: none; }
.nav-enlace.activo { background: rgba(255,255,255,.1); color: #fff; font-weight: 600; }
.nav-enlace.activo::before { content: ""; position: absolute; left: -.65rem; top: .45rem; bottom: .45rem; width: 3px; border-radius: 0 3px 3px 0; background: #fff; }
.nav-enlace.activo .ico { opacity: 1; }
.nav-enlace .contador { margin-left: auto; background: var(--acento); color: #fff; font-size: .7rem; font-weight: 700; padding: 0 .45rem; border-radius: 999px; line-height: 1.5; }
.lateral-usuario { display: flex; align-items: center; gap: .65rem; padding: .85rem 1.05rem; border-top: 1px solid rgba(255,255,255,.08); background: rgba(0,0,0,.12); }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: var(--navy-700); color: #fff; font-weight: 650; font-size: .85rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.lateral-usuario .datos { min-width: 0; flex: 1; }
.lateral-usuario b { display: block; color: #fff; font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lateral-usuario span { font-size: .75rem; color: #8fa3c2; }
.lateral-usuario a, .form-salir button { color: #8fa3c2; display: grid; place-items: center; padding: .3rem; border-radius: 6px; }
.lateral-usuario a:hover, .form-salir button:hover { color: #fff; background: rgba(255,255,255,.08); }
.form-salir { margin: 0; display: contents; }
.form-salir button { background: none; border: 0; cursor: pointer; font: inherit; }

.topbar {
  display: none; position: sticky; top: 0; z-index: 30; height: var(--alto-top);
  background: var(--navy-900); color: #fff; align-items: center; gap: .8rem; padding: 0 1rem;
  border-top: 3px solid var(--acento); box-shadow: 0 1px 0 rgba(0,0,0,.2);
}
.topbar b { font-size: .98rem; font-weight: 650; flex: 1; }
.boton-menu { background: none; border: 0; color: #fff; padding: .4rem; margin-left: -.4rem; border-radius: 8px; cursor: pointer; display: grid; }
.boton-menu:hover { background: rgba(255,255,255,.1); }
.velo { display: none; }

.principal { min-height: 100vh; }
body.con-menu .principal { margin-left: var(--lateral); }
.contenedor { max-width: 1320px; margin: 0 auto; padding: 1.7rem 2rem 3rem; }
.contenedor.amplio { max-width: none; }

@media (max-width: 1024px) {
  .lateral { transform: translateX(-100%); box-shadow: var(--sombra-lg); }
  body.menu-abierto .lateral { transform: none; }
  body.menu-abierto .velo { display: block; position: fixed; inset: 0; background: rgba(8, 22, 41, .5); z-index: 35; }
  .topbar { display: flex; }
  body.con-menu .principal { margin-left: 0; }
  .contenedor { padding: 1.1rem 1rem 3rem; }
}

/* ---------- cabecera de página ---------- */
.cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.4rem; }
.cabecera .sub { font-size: .9rem; }
.cabecera-acciones { display: flex; gap: .5rem; flex-wrap: wrap; }
.miga { font-size: .82rem; color: var(--tenue); margin-bottom: .3rem; display: flex; gap: .4rem; align-items: center; }
.miga a { color: var(--tenue); }

/* ---------- tarjetas ---------- */
.tarjeta { background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); padding: 1.25rem 1.35rem; margin-bottom: 1.2rem; }
.tarjeta-cab { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: 1rem; flex-wrap: wrap; }
.tarjeta-cab p { margin: .15rem 0 0; font-size: .86rem; }
.tarjeta.sin-relleno { padding: 0; overflow: hidden; }
.tarjeta.sin-relleno .tarjeta-cab { padding: 1rem 1.35rem .9rem; margin-bottom: 0; border-bottom: 1px solid var(--borde); }
.tarjeta.angosta { max-width: 520px; margin-left: auto; margin-right: auto; }
.rejilla { display: grid; gap: 1.2rem; }
.rejilla-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 1.2rem; }
.rejilla-3 { display: grid; grid-template-columns: 2fr 1fr; gap: 1.2rem; }
@media (max-width: 1100px) { .rejilla-3 { grid-template-columns: 1fr; } }
:is(.rejilla, .rejilla-2, .rejilla-3) > .tarjeta { margin-bottom: 0; }
:is(.rejilla, .rejilla-2, .rejilla-3):has(> .tarjeta) { margin-bottom: 1.2rem; }
@media (max-width: 600px) {
  :is(.rejilla, .rejilla-2, .rejilla-3):has(> .tarjeta) { gap: .9rem; margin-bottom: .9rem; }
  .tarjeta { margin-bottom: .9rem; }
}

/* indicadores */
.kpis { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.2rem; container: kpis / inline-size; }
.kpi { flex: 1 1 150px; min-width: 0; container-type: inline-size; background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); padding: 1rem 1.1rem; display: flex; gap: .85rem; align-items: flex-start; }
.kpi > div:last-child { min-width: 0; }
.kpi-ico { width: 40px; height: 40px; border-radius: 8px; display: grid; place-items: center; flex: none; background: var(--primario-50); color: var(--primario); }
.kpi-ico.verde { background: var(--exito-50); color: var(--exito); }
.kpi-ico.ambar { background: var(--aviso-50); color: var(--aviso); }
.kpi-ico.rojo { background: var(--peligro-50); color: var(--peligro); }
.kpi-ico.cian { background: var(--info-50); color: var(--info); }
.kpi-etq { font-size: .78rem; color: var(--tenue); font-weight: 550; }
.kpi-valor { font-size: 1.55rem; font-weight: 700; line-height: 1.2; letter-spacing: -.025em; color: var(--titulo); }
.kpi-pie { font-size: .78rem; color: var(--tenue); }
.kpi a { color: inherit; }
@container kpis (min-width: 880px) and (max-width: 1180px) {
  .kpis:has(> .kpi:nth-child(5)) > .kpi { flex-direction: column; gap: .55rem; }
}
@container kpis (max-width: 879px) {
  .kpi { flex-basis: 30%; }
  .kpis:has(> .kpi:nth-child(4):last-child) > .kpi { flex-basis: 40%; }
}
@container (max-width: 190px) {
  .kpi-ico { width: 32px; height: 32px; border-radius: 8px; }
  .kpi-ico .ico { width: 18px; height: 18px; }
  .kpi-valor { font-size: 1.25rem; }
  .kpi-etq { font-size: .74rem; }
}
@media (max-width: 600px) {
  .kpis { gap: .6rem; margin-bottom: 1rem; }
  .kpi { flex-basis: calc(50% - .3rem); gap: .55rem; padding: .7rem .75rem; align-items: center; }
  .kpi-ico { width: 30px; height: 30px; border-radius: 8px; }
  .kpi-ico .ico { width: 17px; height: 17px; }
  .kpi-etq { font-size: .74rem; line-height: 1.25; }
  .kpi-valor { font-size: 1.2rem; }
  .kpi-pie { font-size: .72rem; line-height: 1.3; }
  h1 { font-size: 1.3rem; }
  .tarjeta { padding: 1rem; }
}
@media (max-width: 400px) {
  .kpi { padding: .65rem; gap: .5rem; }
  .kpi-ico { width: 26px; height: 26px; border-radius: 7px; }
  .kpi-ico .ico { width: 15px; height: 15px; }
  .kpi-valor { font-size: 1.12rem; }
}
@media (max-width: 340px) {
  .kpi-ico { display: none; }
  .tarjeta.sin-relleno .tarjeta-cab { padding: 1rem 1rem 0; }
}

/* progreso */
.progreso { height: 8px; background: #eaedf1; border-radius: 999px; overflow: hidden; }
.progreso > div { height: 100%; background: var(--exito); border-radius: 999px; transition: width .4s; }
.progreso.grueso { height: 12px; }
.progreso.azul > div { background: var(--primario); }
.pct-grande { font-size: 2.1rem; font-weight: 750; letter-spacing: -.035em; line-height: 1; color: var(--titulo); }
.segmentos { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: #eaedf1; margin: .8rem 0 .6rem; }
.segmentos div { height: 100%; }
.leyenda { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .82rem; color: var(--tenue); }
.leyenda span { display: inline-flex; align-items: center; gap: .35rem; }
.punto { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.bg-validada { background: var(--exito); }
.bg-digitada { background: #e0a100; }
.bg-observada { background: var(--peligro); }
.bg-recibida { background: var(--primario); }
.bg-sin { background: #cfd6e1; }

/* ---------- botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  font: inherit; font-weight: 600; font-size: .87rem; line-height: 1.2;
  padding: .56rem .95rem; border-radius: var(--radio-sm); border: 1px solid var(--borde-fuerte);
  background: #fff; color: #253247; cursor: pointer; text-decoration: none; white-space: nowrap;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.btn .ico { width: 16px; height: 16px; }
.btn:hover { background: #f7f8fa; border-color: #bfc6d1; text-decoration: none; }
.btn:focus-visible { outline: 3px solid rgba(29, 79, 145, .3); outline-offset: 1px; }
.btn.primario { background: var(--primario); border-color: var(--primario); color: #fff; }
.btn.primario:hover { background: var(--primario-600); border-color: var(--primario-600); }
.btn.exito { background: var(--exito); border-color: var(--exito); color: #fff; }
.btn.exito:hover { background: #106230; border-color: #106230; }
.btn.peligro { background: var(--peligro); border-color: var(--peligro); color: #fff; }
.btn.peligro:hover { background: #912018; border-color: #912018; }
.btn.suave-peligro { color: var(--peligro); border-color: #f0c3bf; }
.btn.suave-peligro:hover { background: var(--peligro-50); }
.btn.fantasma { border-color: transparent; background: transparent; box-shadow: none; }
.btn.fantasma:hover { background: #eef0f3; }
.btn.chico { padding: .32rem .65rem; font-size: .82rem; }
.btn.grande { padding: .8rem 1.3rem; font-size: 1rem; }
.btn.ancho { width: 100%; }
.btn:disabled { opacity: .6; cursor: wait; }

/* ---------- formularios ---------- */
label { display: block; font-weight: 550; font-size: .84rem; color: #344054; }
.campo { margin-bottom: 1rem; }
.campo > span { display: block; margin-bottom: .35rem; }
input, select, textarea {
  font: inherit; font-size: .9rem; color: var(--texto); width: auto;
  padding: .55rem .7rem; border: 1px solid var(--borde-fuerte); border-radius: var(--radio-sm); background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  transition: border-color .15s, box-shadow .15s;
}
input::placeholder, textarea::placeholder { color: #98a2b3; }
.campo input, .campo select, .campo textarea { width: 100%; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primario); box-shadow: 0 0 0 3px rgba(29, 79, 145, .14); }
input[readonly] { background: #f6f8fb; }
input[type=checkbox], input[type=radio] { width: 17px; height: 17px; accent-color: var(--primario); vertical-align: middle; }
input[type=file] { width: 100%; padding: .45rem; background: #f8fafc; }
.check { display: flex; align-items: center; gap: .55rem; font-weight: 600; cursor: pointer; }
.filtros { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: .6rem; align-items: end; }
.filtros .btn, .filtros input:not([type=checkbox]), .filtros select { height: 40px; }
@media (max-width: 600px) {
  .filtros { grid-template-columns: repeat(auto-fit, minmax(min(100%, 135px), 1fr)); gap: .5rem .6rem; }
  .filtros label > span { margin-bottom: .15rem; font-size: .8rem; }
}
.filtros label > span, .campos-acta label > span, .form-rejilla label > span { display: block; margin-bottom: .3rem; }
.form-linea { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: 0; }
.form-rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: .7rem; align-items: end; }
.corto { width: 5.5rem; }
.medio { width: 12rem; }

.segmentado { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .5rem; margin-bottom: 1rem; }
.segmentado label { position: relative; cursor: pointer; }
.segmentado input { position: absolute; opacity: 0; }
.segmentado span {
  display: flex; align-items: center; justify-content: center; gap: .4rem; padding: .7rem; border-radius: var(--radio-sm);
  border: 1.5px solid var(--borde-fuerte); font-weight: 600; background: #fff; color: #344054;
}
.segmentado input:checked + span { border-color: var(--primario); background: var(--primario-50); color: var(--primario); }
.segmentado input:focus-visible + span { box-shadow: 0 0 0 3px rgba(29, 79, 145, .25); }

/* ---------- alertas ---------- */
.alerta { display: flex; gap: .7rem; align-items: flex-start; padding: .75rem 1rem; border-radius: var(--radio-sm); margin-bottom: 1rem; border: 1px solid; border-left-width: 4px; font-size: .88rem; background: #fff; }
.alerta .ico { margin-top: 1px; flex: none; }
.alerta > div { min-width: 0; overflow-wrap: anywhere; }
.alerta ul { margin: .3rem 0 0; padding-left: 1.1rem; }
.alerta.ok { background: var(--exito-50); border-color: #c3e4cd; border-left-color: var(--exito); color: #0f5a2b; }
.alerta.error { background: var(--peligro-50); border-color: #f4cbc7; border-left-color: var(--peligro); color: #8a1c13; }
.alerta.aviso { background: var(--aviso-50); border-color: #f2dcb2; border-left-color: #d48a1c; color: #74400a; }
.alerta.info { background: var(--info-50); border-color: #c3dfef; border-left-color: var(--info); color: #0c4a6e; }

/* ---------- estados ---------- */
.estado { display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 600; white-space: nowrap; box-shadow: inset 0 0 0 1px rgba(16, 24, 40, .06); }
.estado::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.e-SIN_ACTA { background: #eef1f5; color: #5f6b80; }
.e-RECIBIDA { background: var(--primario-50); color: var(--primario); }
.e-DIGITADA { background: var(--aviso-50); color: var(--aviso); }
.e-OBSERVADA { background: var(--peligro-50); color: var(--peligro); }
.e-VALIDADA { background: var(--exito-50); color: var(--exito); }
.etiqueta { display: inline-block; padding: .08rem .45rem; border-radius: 5px; font-size: .72rem; font-weight: 600; background: #eef0f3; color: #475467; }
.etiqueta.azul { background: var(--primario-50); color: var(--primario); }
.etiqueta.verde { background: var(--exito-50); color: var(--exito); }
.etiqueta.ambar { background: var(--aviso-50); color: var(--aviso); }
.pie-tarjeta { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .9rem 1.2rem; border-top: 1px solid var(--borde); }
.desplegable .pie-tarjeta { padding: .9rem 0 0; }
.desplegable > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; cursor: pointer; }
.desplegable > summary::-webkit-details-marker { display: none; }
.desplegable > summary h2 { margin: 0; }
.desplegable > summary svg { transition: transform .15s; flex: none; }
.desplegable[open] > summary svg { transform: rotate(180deg); }
.desplegable { scroll-margin-top: 1rem; }

/* ---------- cédula: colores de las columnas como en la cédula física ---------- */
.tabla-cedula { --c-gob: #c99a00; --c-con: #3f9a2c; --c-prov: #8a5cc2; --c-dist: #1e8fc4; }
.tabla.tabla-cedula th { white-space: normal; vertical-align: bottom; }
.tabla-cedula th.col-gob { background: #fdf3c4; color: #6b5300; }
.tabla-cedula th.col-con { background: #e1f3d8; color: #2f6b1f; }
.tabla-cedula th.col-prov { background: #eee5f7; color: #5b3a84; }
.tabla-cedula th.col-dist { background: #dcf0fa; color: #155e80; }
.tabla-cedula th[class*="col-"] { width: 7.2rem; min-width: 6.4rem; vertical-align: top; padding-left: .5rem; padding-right: .5rem; }
.col-tit { line-height: 1.25; }
.col-corto { display: none; }
.col-alc { font-size: .72rem; font-weight: 500; text-transform: none; letter-spacing: 0; opacity: .85; margin: .15rem 0 .35rem; }
.col-n { display: inline-block; min-width: 1.7rem; padding: .05rem .45rem; border-radius: 6px; background: rgba(255,255,255,.75); font-size: .8rem; }
.tabla-cedula th > div:last-child { margin-top: .35rem; font-weight: 500; }
.enlace-mini { background: none; border: 0; padding: 0; font: inherit; font-size: .72rem; font-weight: 600; color: inherit; text-decoration: underline; cursor: pointer; text-transform: none; letter-spacing: 0; }
.n-orden { font-weight: 700; color: var(--tenue); text-align: center; width: 3rem; }
.tabla-cedula td.celda-hab { padding: .3rem; }
.casilla-hab { position: relative; display: flex; justify-content: center; align-items: center; min-height: 40px; cursor: pointer; }
.casilla-hab input { position: absolute; opacity: 0; pointer-events: none; }
.casilla-hab .marca { width: 28px; height: 28px; border-radius: 7px; border: 2px dashed #cdd5e0; background: #fff; display: grid; place-items: center; transition: background .12s, border-color .12s; }
.casilla-hab:hover .marca { border-color: #9aa6b8; }
.casilla-hab input:checked + .marca { border-style: solid; }
.casilla-hab input:checked + .marca::after { content: ''; width: 12px; height: 7px; border-left: 3px solid #fff; border-bottom: 3px solid #fff; transform: translateY(-2px) rotate(-45deg); }
.casilla-hab input:focus-visible + .marca { outline: 3px solid var(--primario-50); outline-offset: 2px; }
.col-gob .casilla-hab input:checked + .marca { background: var(--c-gob); border-color: var(--c-gob); }
.col-con .casilla-hab input:checked + .marca { background: var(--c-con); border-color: var(--c-con); }
.col-prov .casilla-hab input:checked + .marca { background: var(--c-prov); border-color: var(--c-prov); }
.col-dist .casilla-hab input:checked + .marca { background: var(--c-dist); border-color: var(--c-dist); }
@media (max-width: 720px) {
  .tabla-cedula th, .tabla-cedula td { padding: .45rem .25rem; }
  .tabla-cedula th[class*="col-"] { min-width: 0; width: 2.9rem; padding-left: .15rem; padding-right: .15rem; }
  .tabla-cedula .n-orden { width: 1.6rem; }
  .casilla-hab .marca { width: 26px; height: 26px; }
  .tabla-cedula .col-tit, .tabla-cedula .col-alc, .tabla-cedula th > div:last-child { display: none; }
  .tabla-cedula .col-corto { display: block; font-size: .66rem; letter-spacing: 0; }
  .tabla-cedula td.principal-celda { font-size: .8rem; }
  .tabla-cedula td.principal-celda b { font-weight: 600; }
}
.avance-cedula { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 1rem; margin-top: 1rem; }
.avance-prov { border: 1px solid var(--borde); border-radius: 10px; padding: .8rem .9rem; }
.avance-prov-cab { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-bottom: .6rem; }
.avance-prov-cab > b, .avance-prov-cab > a { margin-right: auto; }
/* ---------- matriz de la cédula por provincia ---------- */
.tabla.tabla-matriz th { white-space: normal; vertical-align: bottom; }
.tabla-matriz th, .tabla-matriz td { padding: .5rem .55rem; }
.tabla-matriz .fija-1, .tabla-matriz .fija-2 { position: sticky; background: var(--superficie); z-index: 1; }
.tabla-matriz thead .fija-1, .tabla-matriz thead .fija-2, .tabla-matriz tfoot td { background: #f8fafc; }
.tabla-matriz .fija-1 { left: 0; width: 2.4rem; min-width: 2.4rem; box-sizing: border-box; }
.tabla-matriz .fija-2 { left: 2.4rem; min-width: 11rem; box-shadow: 1px 0 0 var(--borde); }
.tabla-matriz .centro { padding-left: .3rem; padding-right: .3rem; }
.tabla-matriz td.fija-2 b { font-weight: 600; font-size: .82rem; line-height: 1.3; }
.tabla-matriz th[class*="grupo-"] { font-size: .68rem; }
.tabla-matriz th .etiqueta { font-size: .6rem; padding: .05rem .3rem; margin-top: .2rem; letter-spacing: .02em; }
.tabla-matriz tbody tr:hover .fija-1, .tabla-matriz tbody tr:hover .fija-2 { background: #fafbfd; }
.tabla-matriz th[class*="grupo-"] { border-top: 3px solid; letter-spacing: .08em; }
.tabla-matriz th.grupo-gob { background: #fffbeb; color: #7a5d00; border-top-color: #c99a00; }
.tabla-matriz th.grupo-con { background: #f3faf0; color: #2f6b1f; border-top-color: #3f9a2c; }
.tabla-matriz th.grupo-prov { background: #f7f3fb; color: #5b3a84; border-top-color: #8a5cc2; }
.tabla-matriz th[class*="sub-"] { background: #fff; color: #344054; font-weight: 600; font-size: .74rem; min-width: 4.2rem; text-transform: none; letter-spacing: 0; }
.tabla-matriz th[class*="grupo-"] + th[class*="grupo-"], .tabla-matriz th.sub-gob + th:not(.sub-gob), .tabla-matriz td.ini-grupo { box-shadow: inset 1px 0 0 var(--borde); }
.m-si { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; }
.m-si svg { width: 13px; height: 13px; stroke-width: 3.2; }
.m-gob { background: #c99a00; }
.m-con { background: #3f9a2c; }
.m-prov { background: #8a5cc2; }
.m-no { color: #d0d5dd; font-weight: 600; }
.tabla-matriz td.pend { background: repeating-linear-gradient(-45deg, #fcfcfd, #fcfcfd 6px, #f5f6f8 6px, #f5f6f8 12px); }
.m-pend { color: #b9a47a; font-weight: 600; font-size: .8rem; }
@media (max-width: 720px) {
  .tabla-matriz .fija-2 { min-width: 9.5rem; font-size: .8rem; left: 2.2rem; }
  .tabla-matriz .fija-1 { width: 2.2rem; min-width: 2.2rem; }
}
@media print {
  .lateral, .topbar, .velo, .no-imprimir { display: none !important; }
  body, .principal, .contenedor { background: #fff !important; margin: 0 !important; padding: 0 !important; max-width: none !important; }
  .tarjeta { box-shadow: none !important; border: 0 !important; }
  .tabla-caja { overflow: visible !important; }
  .tabla-matriz { font-size: 9pt; }
  .tabla-matriz th, .tabla-matriz td { padding: 3px 4px; }
  .tabla-matriz .fija-1, .tabla-matriz .fija-2 { position: static; box-shadow: none; }
  .tabla-matriz th, .m-si { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* ---------- presentación de resultados ---------- */
.res-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .8rem; margin-bottom: .9rem; }
.res-cab h1 { margin: 0; color: var(--navy-900); }
.res-pestanas { display: flex; gap: .2rem; overflow-x: auto; background: var(--navy-900); border-radius: var(--radio-sm) var(--radio-sm) 0 0; padding: .3rem .3rem 0; }
.res-pestanas a { padding: .6rem 1.1rem; color: #cfe0ff; text-decoration: none; font-weight: 650; font-size: .9rem; white-space: nowrap; border-radius: 6px 6px 0 0; }
.res-pestanas a.activa { background: #fff; color: var(--navy-900); }
.res-filtros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem 1rem; padding: .7rem 1rem;
  background: var(--primario); border-radius: var(--radio-sm); margin-bottom: 0; }
.res-pestanas + .res-filtros { border-radius: 0; }
.res-filtros label { display: flex; align-items: center; gap: .5rem; color: #fff; font-weight: 650; font-size: .85rem; }
.res-filtros select { flex: 1; min-width: 0; width: 100%; }
.res-filtros select:disabled { opacity: 1; background: #fff; color: var(--texto); }
.res-franja { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #e9edf3; border: 1px solid var(--borde); border-top: 0; }
.res-franja > div { text-align: center; padding: .7rem .5rem; border-left: 1px solid #cfd6e1; }
.res-franja > div:first-child { border-left: 0; }
.res-franja b { display: block; font-size: 1.05rem; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.res-franja span { font-size: .78rem; color: var(--tenue); }
.res-fecha { text-align: center; font-size: .8rem; color: var(--tenue); background: #f6f8fb; border: 1px solid var(--borde); border-top: 0;
  border-radius: 0 0 var(--radio-sm) var(--radio-sm); padding: .35rem; margin: 0 0 1.1rem; }
.res-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 1.2rem; align-items: start; }
.res-menu { background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); padding: .6rem; position: sticky; top: 1rem; }
.res-menu-grupo + .res-menu-grupo { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--borde); }
.res-menu-titulo { font-weight: 750; font-size: .88rem; color: var(--navy-900); padding: .3rem .5rem; }
.res-menu a { display: block; padding: .42rem .5rem .42rem .9rem; border-radius: 6px; text-decoration: none; color: var(--texto); font-size: .88rem; border-left: 3px solid transparent; }
.res-menu a:hover { background: #f1f5fb; }
.res-menu a.activo { background: var(--primario-50); color: var(--primario); font-weight: 700; border-left-color: var(--primario); }
.res-titulo { font-size: 1.1rem; margin: 0 0 .9rem; color: var(--navy-900); }
.res-titulo span { color: var(--primario); }
.res-top { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 1rem; margin-bottom: 1rem; }
.res-top .tarjeta { margin-bottom: 0; }

.sigla { display: inline-grid; place-items: center; min-width: 2.3rem; height: 1.9rem; padding: 0 .35rem; border-radius: 6px;
  background: var(--c, #64748b); color: #fff; font-size: .7rem; font-weight: 800; letter-spacing: .02em; line-height: 1; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.sigla.chica { min-width: 1.9rem; height: 1.45rem; font-size: .62rem; }
.logo-org { display: inline-block; width: 2.6rem; height: 2.6rem; object-fit: contain; background: #fff; border: 1px solid var(--borde);
  border-radius: 6px; padding: 2px; vertical-align: middle; }
.logo-org.chica { width: 1.9rem; height: 1.9rem; padding: 1px; }
.org-con-logo { display: inline-flex; align-items: center; gap: .55rem; }
.org-con-logo > .sigla, .org-con-logo > .logo-org { flex-shrink: 0; }
.tabla-acta td.org .sigla.chica { min-width: 1.7rem; height: 1.3rem; font-size: .56rem; }
.tabla-acta td.org .logo-org.chica { width: 1.7rem; height: 1.7rem; }
.gb-etq .logo-org { width: 2.8rem; height: 2.8rem; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.archivo-logo { width: 100%; min-width: 0; font-size: .78rem; }
.chico-check { font-size: .78rem; margin-top: .25rem; }
.carga-logos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .8rem 1.2rem; align-items: center;
  margin-top: 1.2rem; padding: 1rem; border: 1px dashed var(--borde-fuerte); border-radius: var(--radio-sm); background: #fafbfd; }
.carga-logos b { display: inline-flex; align-items: center; gap: .4rem; }
@media (max-width: 800px) { .carga-logos { grid-template-columns: minmax(0, 1fr); } }

.grafico-barras { display: flex; align-items: stretch; gap: .5rem; height: 330px; padding-top: .5rem;
  background: repeating-linear-gradient(to top, transparent 0, transparent calc(25% - 1px), #edf0f5 calc(25% - 1px), #edf0f5 25%); background-size: 100% calc(100% - 2.75rem); background-repeat: no-repeat; }
.gb-col { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.gb-area { flex: 1; display: flex; align-items: flex-end; justify-content: center; padding-top: 3.4rem; border-bottom: 2px solid #cbd3df; }
.gb-barra { position: relative; width: min(100%, 64px); min-height: 3px; border-radius: 6px 6px 0 0;
  background: color-mix(in srgb, var(--c) 30%, #fff); border: 1px solid color-mix(in srgb, var(--c) 55%, #fff); border-bottom: 0; transition: height .5s; }
.gb-barra.gana { background: color-mix(in srgb, var(--c) 55%, #fff); }
.gb-etq { position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: .2rem; }
.gb-valor { font-size: .74rem; font-weight: 750; color: var(--navy-900); white-space: nowrap; }
.gb-nombre { height: 2.75rem; padding-top: .35rem; font-size: .66rem; line-height: 1.15; text-align: center; color: var(--tenue); overflow: hidden;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.res-avance .tarjeta-cab { margin-bottom: .6rem; }
.res-avance-lista { display: flex; flex-direction: column; gap: .15rem; max-height: 300px; overflow-y: auto; margin: 0 -.4rem; padding: 0 .4rem; }
.res-avance-fila { display: block; padding: .45rem .5rem; border-radius: 8px; text-decoration: none; color: inherit; }
.res-avance-fila:hover { background: #f4f7fb; }
.res-avance-cab { display: flex; align-items: center; gap: .5rem; margin-bottom: .3rem; font-size: .88rem; }
.res-avance-cab b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.res-avance-pct { font-weight: 700; font-size: .82rem; font-variant-numeric: tabular-nums; }
.res-avance .progreso { height: 7px; }

.tabla-resultados .c-logo { width: 3.4rem; text-align: center; }
.tabla-resultados .fila-gana td { background: #f3f8ff; font-weight: 700; }
.tabla-resultados tbody.totales td { background: #f6f8fb; font-weight: 650; font-size: .88rem; }
.tabla-resultados tr.gran-total td { background: #e9edf3; font-weight: 800; }
.tabla-ref { width: 100%; }
.tabla-ref thead th { background: #dbe6f5; color: var(--navy-900); }
.barra-estados { display: flex; height: 22px; border-radius: 999px; overflow: hidden; background: #e7ebf2; }
.barra-estados > div { height: 100%; }
.leyenda-estados { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin-top: .7rem; font-size: .82rem; color: var(--tenue); }
.leyenda-estados i { display: inline-block; width: .8rem; height: .8rem; border-radius: 3px; margin-right: .35rem; vertical-align: -1px; }
.avance-celda { display: flex; align-items: center; gap: .5rem; }
.avance-celda .progreso { flex: 1; height: 7px; }
.avance-celda small { font-weight: 700; min-width: 3rem; text-align: right; }
.lugar { display: flex; gap: .5rem; align-items: flex-start; }
.lugar b { display: block; font-size: .8rem; line-height: 1.2; }
.lugar small { color: var(--tenue); font-size: .76rem; }

@media (max-width: 1100px) {
  .res-top { grid-template-columns: minmax(0, 1fr); }
  .res-avance-lista { max-height: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .2rem .8rem; }
}
@media (max-width: 900px) {
  .res-layout { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .res-menu { position: static; display: flex; gap: .4rem; overflow-x: auto; padding: .4rem; }
  .res-menu-grupo, .res-menu-grupo + .res-menu-grupo { display: flex; align-items: center; gap: .2rem; margin: 0; padding: 0 .4rem 0 0; border-top: 0; border-right: 1px solid var(--borde); flex-shrink: 0; }
  .res-menu-grupo:last-child { border-right: 0; }
  .res-menu-titulo { white-space: nowrap; font-size: .78rem; color: var(--tenue); }
  .res-menu a { white-space: nowrap; border-left: 0; padding: .4rem .65rem; font-size: .84rem; }
  .res-filtros { grid-template-columns: minmax(0, 1fr); }
  .res-filtros label span { min-width: 4.6rem; }
  .res-franja { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .res-franja > div:nth-child(3) { border-left: 0; }
  .res-franja > div:nth-child(n+3) { border-top: 1px solid #cfd6e1; }
}
.caja-grafico { container-type: inline-size; }
@container (max-width: 620px) {
  .grafico-barras { height: 260px; gap: .25rem; background-size: 100% 100%; }
  .gb-nombre { display: none; }
  .gb-area { padding-top: 3rem; }
  .gb-valor { font-size: .62rem; }
  .gb-etq { width: calc(100% + .2rem); }
  .gb-etq .sigla { min-width: min(1.6rem, 100%); max-width: 100%; height: 1.6rem; overflow: hidden; font-size: .52rem; padding: 0 .05rem; letter-spacing: -.02em; }
  .gb-etq .logo-org { width: min(2rem, 100%); height: auto; aspect-ratio: 1; padding: 1px; }
}
@media (max-width: 640px) {
  .sigla { min-width: 1.9rem; height: 1.6rem; font-size: .58rem; padding: 0 .2rem; }
  .res-franja b { font-size: .92rem; }
  .res-cab .cabecera-acciones { width: 100%; }
}
@media print {
  .res-layout { grid-template-columns: minmax(0, 1fr); }
  .res-top { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
  .res-avance-lista { max-height: none; overflow: visible; }
  .sigla, .gb-barra, .res-franja, .tabla-resultados td, .progreso > div, .barra-estados > div, .leyenda-estados i { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- simulacro ---------- */
.franja-simulacro { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .7rem; margin-bottom: 1rem; padding: .6rem 1rem;
  border-radius: var(--radio-sm); font-size: .9rem; color: #7a4205; border: 1px dashed #e0a94a;
  background: repeating-linear-gradient(-45deg, var(--aviso-50), var(--aviso-50) 12px, #fbe9c8 12px, #fbe9c8 24px); }
.franja-simulacro span { flex: 1; min-width: 12rem; }
.franja-simulacro a { font-weight: 700; color: inherit; }
.etiqueta.rojo { background: var(--peligro-50); color: var(--peligro); }
.zona-peligro { border-color: #f3c0c0; }
.zona-peligro h2 { color: var(--peligro); }
.form-borrar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.form-borrar input { flex: 1; min-width: 8rem; max-width: 14rem; text-transform: uppercase; }

.eliminar-acta { margin-top: 1rem; border: 1px solid #f3c0c0; border-radius: var(--radio-sm); padding: .6rem .9rem; background: #fffafa; }
.eliminar-acta summary { cursor: pointer; color: var(--peligro); font-weight: 650; display: flex; align-items: center; gap: .4rem; list-style: none; }
.eliminar-acta summary::-webkit-details-marker { display: none; }
.eliminar-acta[open] summary { margin-bottom: .5rem; }
.eliminar-acta .form-borrar input { text-transform: none; max-width: none; }

/* ---------- usuarios y respaldos ---------- */
.form-carga { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.form-carga input[type=file] { flex: 1; min-width: 0; max-width: 100%; }
.clave-generada { font-size: 1rem; font-weight: 700; letter-spacing: .06em; background: var(--primario-50); color: var(--primario); padding: .15rem .5rem; border-radius: 6px; }
.credenciales { border-color: var(--primario); }
.kpi-valor.kpi-chico { font-size: 1.05rem; }
@media print {
  .credenciales { border: 0 !important; }
  .clave-generada { background: none; color: #000; }
}
.avance-prov.actual { border-color: var(--primario); box-shadow: 0 0 0 1px var(--primario); }
.chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.chip { font-size: .78rem; padding: .2rem .6rem; border-radius: 999px; background: #eef1f5; color: #475467; border: 1px solid transparent; text-decoration: none; }
.chip:hover { text-decoration: none; border-color: #cdd5e0; }
.chip.ok { background: var(--exito-50); color: var(--exito); }
.chip.actual { border-color: var(--primario); font-weight: 650; }

/* ---------- tablas ---------- */
.tabla-caja { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabla { width: 100%; border-collapse: collapse; font-size: .87rem; }
.tabla th, .tabla td { padding: .68rem .95rem; border-bottom: 1px solid #edf0f3; text-align: left; vertical-align: middle; }
.tabla th { background: #f9fafb; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #667085; white-space: nowrap; border-bottom-color: var(--borde); }
.tabla tbody tr:hover td { background: #f9fafb; }
.tabla tbody tr:last-child td { border-bottom: 0; }
.tabla .num, .tabla th.num { text-align: right; }
.tabla .centro, .tabla th.centro { text-align: center; }
.tabla tfoot td { background: #f9fafb; font-weight: 600; border-top: 1px solid var(--borde); border-bottom: 0; }
.fila-bloq td { background: #f6f7f9 !important; color: #8a94a6; }
.vacio { text-align: center; color: var(--tenue); padding: 2.2rem 1rem !important; }
.mini-barra { height: 8px; background: #e7ebf2; border-radius: 999px; overflow: hidden; min-width: 80px; }
.mini-barra > div { height: 100%; background: var(--exito); border-radius: 999px; }
.avance-celda { display: flex; align-items: center; gap: .6rem; justify-content: flex-end; }
.avance-celda .mini-barra { flex: 1; max-width: 140px; }
.avance-celda span { min-width: 3.2rem; text-align: right; }
@media (max-width: 720px) {
  .tabla-compacta th, .tabla-compacta td { padding: .55rem .5rem; font-size: .82rem; }
  .tabla-compacta th { font-size: .68rem; }
  .tabla-compacta th:first-child, .tabla-compacta td:first-child { padding-left: 1rem; }
  .tabla-compacta th:last-child, .tabla-compacta td:last-child { padding-right: 1rem; }
  .avance-celda { gap: .4rem; }
  .avance-celda .mini-barra { min-width: 36px; }
  .avance-celda span { min-width: 2.8rem; }
}

/* tablas que se vuelven tarjetas en celular */
@media (max-width: 720px) {
  .tabla-resp thead { display: none; }
  .tabla-resp, .tabla-resp tbody, .tabla-resp tr, .tabla-resp td { display: block; width: 100%; }
  .tabla-resp tr { border-bottom: 1px solid var(--borde); padding: .7rem 1rem; }
  .tabla-resp tbody tr:hover td { background: none; }
  .tabla-resp td { border: 0; padding: .25rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; text-align: right; overflow-wrap: anywhere; }
  .tabla-resp td::before { flex: none; }
  .tabla-resp td::before { content: attr(data-etq); font-size: .76rem; font-weight: 650; color: var(--tenue); text-align: left; text-transform: uppercase; letter-spacing: .03em; }
  .tabla-resp td[data-etq=""]::before, .tabla-resp td:not([data-etq])::before { content: none; }
  .tabla-resp td.principal-celda { font-size: 1rem; justify-content: flex-start; text-align: left; }
  .tabla-resp td[data-etq=""]:not(.principal-celda) { justify-content: flex-end; gap: .4rem; padding-top: .5rem; }
  .tabla-resp td .form-linea { justify-content: flex-end; }
  .ocultar-movil, .solo-escritorio { display: none !important; }
  .solo-movil { display: inline !important; }

  /* listas largas: cada fila en 2-3 líneas compactas */
  .tabla-resp.tabla-lista tr { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .45rem; padding: .6rem 1rem; }
  .tabla-resp.tabla-lista td[data-etq] { display: block; width: auto; padding: 0; text-align: left; }
  .tabla-resp.tabla-lista td[data-etq]:not([data-etq=""])::before { content: attr(data-etq) ": "; font-size: inherit; font-weight: 600; text-transform: none; letter-spacing: 0; }
  .tabla-lista td.c-1 { order: 1; flex: 1 1 auto; font-size: .95rem; }
  .tabla-lista td.c-2 { order: 2; flex: none; }
  .tabla-lista td.c-ancho { order: 3; flex: 0 0 calc(100% - 4.6rem); min-width: 0; font-size: .84rem; }
  .tabla-lista td.c-fin { order: 3; margin-left: auto; }
  .tabla-lista td.c-3 { order: 4; flex: none; font-size: .78rem; color: var(--tenue); }
  .tabla-lista td.c-ultimo { order: 6; flex-basis: 100%; }
  .tabla-lista td.c-ultimo ~ .c-fin { order: 5; }
}

/* ---------- acceso ---------- */
.acceso { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; }
.acceso-marca {
  background: radial-gradient(ellipse at 0% 0%, rgba(255,255,255,.06), transparent 55%), var(--navy-900);
  border-top: 4px solid var(--acento);
  color: #d7e1f0; padding: 3.5rem; display: flex; flex-direction: column; justify-content: space-between;
}
.acceso-marca .logo { width: 50px; height: 50px; font-size: 1.02rem; border-radius: 10px; }
.acceso-marca h1 { color: #fff; font-size: 2.2rem; margin: 2.2rem 0 .8rem; letter-spacing: -.03em; }
.acceso-marca p { color: #a9bbd6; font-size: 1.02rem; max-width: 30rem; }
.acceso-marca ul { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: .9rem; }
.acceso-marca li { display: flex; gap: .7rem; align-items: center; color: #d7e1f0; }
.acceso-marca li .ico { color: #7fb0ff; }
.acceso-pie { font-size: .8rem; color: #7f93b3; }
.acceso-form { display: grid; place-items: center; padding: 2rem; background: var(--superficie); }
.acceso-form form { width: 100%; max-width: 360px; }
.acceso-form h2 { font-size: 1.5rem; margin-bottom: .3rem; }
@media (max-width: 860px) {
  .acceso { grid-template-columns: 1fr; }
  .acceso-marca { padding: 1.6rem 1.4rem; }
  .acceso-marca h1 { font-size: 1.45rem; margin: 1rem 0 .3rem; }
  .acceso-marca ul, .acceso-pie { display: none; }
  .acceso-form { align-items: start; padding: 2rem 1.4rem; }
}

/* ---------- acta ---------- */
.acta-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.acta-meta { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; font-size: .86rem; color: var(--tenue); margin-top: .4rem; }
.acta-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.acta-meta .ico { width: 15px; height: 15px; }
.acta-estado { text-align: right; }
.acta-estado .acta-meta { justify-content: flex-end; }
@media (max-width: 720px) {
  .acta-cab { gap: .5rem; }
  .acta-estado { text-align: left; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem; }
  .acta-estado .acta-meta { justify-content: flex-start; margin-top: 0; }
}
.acta-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 1.2rem; align-items: start; }
.acta-grid.sin-imagen { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
@media (max-width: 1200px) {
  .acta-grid, .acta-grid.sin-imagen { grid-template-columns: minmax(0, 1fr); }
  .panel-foto { position: static !important; }
  .acta-grid.sin-imagen .panel-foto { order: 2; }
  .acta-grid.sin-imagen .sin-foto { padding: .9rem; display: flex; align-items: center; gap: .8rem; text-align: left; }
  .acta-grid.sin-imagen .sin-foto .ico { margin: 0; width: 28px; height: 28px; }
}
.panel-foto, .panel-datos { background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); padding: 1rem; }
.panel-foto { position: sticky; top: 1rem; }
.panel-datos { overflow-x: auto; }
.visor { height: 70vh; overflow: auto; background: #1f2937; border-radius: var(--radio-sm); cursor: grab; }
@media (max-width: 1200px) { .visor { height: 55vh; } }
.visor img { display: block; width: 100%; transform-origin: center center; user-select: none; -webkit-user-drag: none; }
.visor-pdf { width: 100%; height: 70vh; border: 0; border-radius: var(--radio-sm); }
.visor-ctrl { display: flex; gap: .35rem; margin: .6rem 0; flex-wrap: wrap; }
.sin-foto { border: 2px dashed var(--borde-fuerte); border-radius: var(--radio-sm); padding: 1.6rem 1rem; text-align: center; color: var(--tenue); margin-bottom: 1rem; background: #fafbfd; }
.sin-foto .ico { width: 34px; height: 34px; color: #9aa6b8; margin-bottom: .4rem; }
.sin-foto b { display: block; color: var(--texto); }

.tabla-acta { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .88rem; }
.tabla-acta th { background: var(--navy-900); color: #fff; font-size: .74rem; font-weight: 650; padding: .6rem .5rem; text-align: center; }
.tabla-acta th:first-child { border-top-left-radius: var(--radio-sm); }
.tabla-acta th:last-child { border-top-right-radius: var(--radio-sm); }
.tabla-acta th.org-th { text-align: left; }
.tabla-acta th.col { width: 9rem; }
.tabla-acta td { border-bottom: 1px solid var(--borde); padding: .3rem .45rem; }
.tabla-acta td.n { width: 2.4rem; text-align: center; color: var(--tenue); font-weight: 650; }
.tabla-acta td.org { font-weight: 600; font-size: .84rem; }
.tabla-acta tbody tr:nth-child(even):not(.especial):not(.total):not(.calculo) td { background: #fafbfd; }
.tabla-acta input.voto { width: 100%; text-align: right; font-size: 1.12rem; font-weight: 700; padding: .35rem .5rem; }
.tabla-acta input.dudoso { background: #fff5c2; border-color: #e0a800; }
.tabla-acta td.bloq {
  background: repeating-linear-gradient(135deg, #e4e7ec, #e4e7ec 6px, #f1f3f6 6px, #f1f3f6 12px) !important;
  color: #7a8599; text-align: center; font-size: .7rem; font-weight: 750; letter-spacing: .06em;
}
.tabla-acta tr.especial td { background: #f4f6fa; }
.tabla-acta tr.especial td.org { color: #344054; }
.tabla-acta tr.total td { background: #fff8db; font-weight: 750; border-bottom: 2px solid #f1d27a; }
.tabla-acta td.suma { text-align: right; font-weight: 750; padding: .45rem .6rem; border-radius: 6px; }
.tabla-acta td.suma.ok { background: var(--exito-50); color: var(--exito); }
.tabla-acta td.suma.mal { background: var(--peligro-50); color: var(--peligro); }
.campos-acta { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1rem; margin-top: 1rem; }
.campos-acta .completo { grid-column: 1 / -1; }
.barra-acciones { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--borde); }
.barra-acciones .espacio { flex: 1; }
.observar { display: flex; gap: .4rem; flex: 1 1 320px; }
.observar input { flex: 1; min-width: 0; }
@media (max-width: 720px) {
  .tabla-acta { font-size: .8rem; table-layout: fixed; }
  .tabla-acta th:first-child { width: 1.9rem; }
  .tabla-acta th.col { width: 4.9rem; font-size: .66rem; padding: .5rem .2rem; }
  .tabla-acta td { padding: .3rem .25rem; }
  .tabla-acta td.org { word-break: break-word; }
  .tabla-acta td.org { font-size: .76rem; }
  .tabla-acta input.voto { font-size: 1rem; padding: .35rem .3rem; }
  .tabla-acta td.bloq { font-size: 0; }
  .tabla-acta td.bloq::after { content: "—"; font-size: .9rem; }
  .campos-acta { gap: .6rem; }
  .barra-acciones { position: sticky; bottom: 0; background: var(--superficie); margin: 1rem -1rem -1rem; padding: .6rem 1rem; gap: .45rem; box-shadow: 0 -4px 14px rgba(16,24,40,.08); z-index: 5; }
  .barra-acciones .espacio { display: none; }
  .barra-acciones > .btn { flex: 1 1 40%; min-width: 0; padding-left: .5rem; padding-right: .5rem; }
  .barra-acciones > .btn.fantasma { flex: 0 0 auto; }
  .observar { flex: 1 1 60%; min-width: 0; }
  .observar .btn { flex: none; padding-left: .6rem; padding-right: .6rem; }
}

/* ---------- resultados ---------- */
.res-fila { display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .3rem .8rem; align-items: center; padding: .75rem 0; border-bottom: 1px solid var(--borde); }
.res-fila:last-child { border-bottom: 0; }
.res-pos { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: #eef1f5; font-weight: 700; font-size: .85rem; color: #475467; }
.res-fila.primero .res-pos { background: var(--primario); color: #fff; }
.res-nombre { font-weight: 600; }
.res-votos { text-align: right; font-weight: 750; font-size: 1.05rem; }
.res-votos small { display: block; font-weight: 500; color: var(--tenue); font-size: .78rem; }
.res-barra { grid-column: 2 / -1; height: 9px; background: #e7ebf2; border-radius: 999px; overflow: hidden; }
.res-barra > div { height: 100%; background: var(--primario); border-radius: 999px; }
.res-fila.primero .res-barra > div { background: var(--exito); }
.resumen-votos { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .8rem; }
.resumen-votos div { background: #f8fafc; border: 1px solid var(--borde); border-radius: var(--radio-sm); padding: .7rem .8rem; }
.resumen-votos span { display: block; font-size: .76rem; color: var(--tenue); font-weight: 600; }
.resumen-votos b { font-size: 1.15rem; }
body.modo-pantalla .lateral, body.modo-pantalla .topbar { display: none; }
body.modo-pantalla .principal { margin-left: 0; }
body.modo-pantalla .contenedor { max-width: 1500px; }

/* ---------- envío de foto ---------- */
.zona-foto {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; text-align: center;
  border: 2px dashed #9bb8e6; border-radius: var(--radio); padding: 2rem 1rem; background: var(--primario-50); color: var(--primario);
  cursor: pointer; margin-bottom: 1rem; font-weight: 650;
}
.zona-foto .ico { width: 40px; height: 40px; }
.zona-foto small { color: var(--tenue); font-weight: 500; }
.zona-foto input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.vista-previa { width: 100%; border-radius: var(--radio-sm); margin-bottom: 1rem; border: 1px solid var(--borde); }
.lados-foto { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-bottom: .4rem; }
.lados-foto .zona-foto { position: relative; margin-bottom: 0; padding: 1.2rem .6rem; min-height: 9.5rem; overflow: hidden; }
.lados-foto .zona-foto b { font-size: 1.02rem; }
.lados-foto .zona-foto .opcional { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--tenue); }
.lados-foto .zona-foto:has(img.miniatura) > .ico { display: none; }
.lados-foto .zona-foto.lista { border-style: solid; border-color: var(--exito); background: var(--exito-50); color: var(--exito); }
.lados-foto .zona-foto img.miniatura { width: 100%; max-height: 9rem; object-fit: contain; border-radius: 6px; background: #fff; }
.lados-foto .zona-foto .quitar { position: absolute; top: .35rem; right: .35rem; border: 0; border-radius: 50%; width: 1.7rem; height: 1.7rem;
  background: rgba(15, 23, 42, .65); color: #fff; font-size: 1rem; line-height: 1; cursor: pointer; }
@media (max-width: 360px) { .lados-foto { grid-template-columns: 1fr; } }
.pestanas-lado { display: flex; gap: .3rem; margin-bottom: .6rem; }
.pestanas-lado button { flex: 1; padding: .45rem .6rem; border: 1px solid var(--borde); background: var(--superficie); border-radius: var(--radio-sm);
  font: inherit; font-weight: 650; color: var(--tenue); cursor: pointer; }
.pestanas-lado button.activa { background: var(--primario); border-color: var(--primario); color: #fff; }
.subir-lados { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.subir-lados input[type=file] { width: 100%; min-width: 0; font-size: .82rem; }
@media (max-width: 520px) { .subir-lados { grid-template-columns: 1fr; } }

/* ---------- varios ---------- */
.lista-simple { list-style: none; margin: 0; padding: 0; }
.lista-simple li { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .6rem 0; border-bottom: 1px solid var(--borde); font-size: .9rem; }
.lista-simple li:last-child { border-bottom: 0; }
.lista-simple li > :first-child { min-width: 0; }
.lista-simple li > .estado:last-child { flex: none; }
.pasos { counter-reset: paso; list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
.pasos li { counter-increment: paso; display: flex; gap: .7rem; align-items: flex-start; font-size: .9rem; }
.pasos li::before { content: counter(paso); width: 24px; height: 24px; flex: none; border-radius: 50%; background: var(--primario-50); color: var(--primario); font-weight: 700; font-size: .78rem; display: grid; place-items: center; }
.pasos li.hecho::before { content: "✓"; background: var(--exito-50); color: var(--exito); }
.separador { height: 1px; background: var(--borde); margin: 1rem 0; border: 0; }