/* Revisión del documento funcional de BeRamp · Irrelevant */

@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("/fuentes/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 400; font-style: italic; font-display: swap; src: url("/fuentes/inter-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("/fuentes/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 600; font-style: normal; font-display: swap; src: url("/fuentes/poppins-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 700; font-style: normal; font-display: swap; src: url("/fuentes/poppins-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-weight: 500; font-style: normal; font-display: swap; src: url("/fuentes/jetbrains-mono-latin-500-normal.woff2") format("woff2"); }

:root {
  --tinta: #18181b;
  --tinta-2: #3f3f46;
  --gris: #57575e;
  --gris-suave: #8a8a90;
  --borde: #d9d9df;
  --borde-fuerte: #b9b9c2;
  --fondo: #f6f5fa;
  --papel: #ffffff;
  --lav-50: #f6f3ff;
  --lav-100: #ede9fd;
  --lav-200: #ddd4fb;
  --lav-300: #c9b7f8;
  --lav-500: #8972f0;
  --lav-700: #5b3fd1;
  --lav-800: #4a2fc0;
  --ok-texto: #17603d; --ok-fondo: #e2f3e9; --ok-borde: #9cd3b3;
  --cambio-texto: #874600; --cambio-fondo: #fdf0da; --cambio-borde: #eec27f;
  --dec-texto: #4a2fc0; --dec-fondo: #ede9fd; --dec-borde: #c9b7f8;
  --pend-texto: #57575e; --pend-fondo: #f0f0f3; --pend-borde: #d9d9df;
  --preg-texto: #1b5e9e; --preg-fondo: #e3eef9; --preg-borde: #a9c8ea;
  --peligro: #b42318;
  --f-titulo: "Poppins", "Segoe UI", system-ui, sans-serif;
  --f-texto: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --radio: 14px;
  --sombra: 0 1px 2px rgba(24, 24, 27, 0.06), 0 2px 8px rgba(24, 24, 27, 0.04);
  --cabecera: 60px;
  --lateral: 300px;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--cabecera) + 16px); }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--tinta);
  font: 400 16px/1.6 var(--f-texto);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--f-titulo); font-weight: 600; line-height: 1.25; margin: 0; letter-spacing: -0.01em; }
p { margin: 0 0 0.75em; }
a { color: var(--lav-700); text-underline-offset: 2px; }
a:hover { color: var(--lav-800); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--lav-500); outline-offset: 2px; border-radius: 6px; }
[tabindex="-1"]:focus { outline: none; }
.oculto-visual { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saltar { position: absolute; left: 12px; top: -60px; background: var(--tinta); color: #fff; padding: 10px 14px; border-radius: 8px; z-index: 100; }
.saltar:focus { top: 10px; }
.cargando-inicial { padding: 40px; color: var(--gris); }

/* ---------- botones ---------- */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 8px 16px; border-radius: 10px;
  border: 1.5px solid var(--borde-fuerte); background: var(--papel); color: var(--tinta);
  font-weight: 600; font-size: 15px; line-height: 1.2; text-decoration: none; text-align: center;
}
@media (hover: hover) { .boton:hover { background: var(--lav-50); border-color: var(--lav-500); color: var(--tinta); } }
.boton[disabled], .boton[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }
.boton.primario { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.boton.primario:hover { background: var(--tinta-2); border-color: var(--tinta-2); color: #fff; }
.boton.acento { background: var(--lav-700); border-color: var(--lav-700); color: #fff; }
.boton.acento:hover { background: var(--lav-800); color: #fff; }
.boton.ok { border-color: var(--ok-borde); color: var(--ok-texto); }
.boton.ok:hover, .boton.ok[aria-pressed="true"] { background: var(--ok-fondo); border-color: var(--ok-texto); color: var(--ok-texto); }
.boton.cambio { border-color: var(--cambio-borde); color: var(--cambio-texto); }
.boton.cambio:hover, .boton.cambio[aria-pressed="true"] { background: var(--cambio-fondo); border-color: var(--cambio-texto); color: var(--cambio-texto); }
.boton.texto { border-color: transparent; background: transparent; padding: 8px 10px; color: var(--lav-700); }
.boton.texto:hover { background: var(--lav-50); }
.boton.peque { min-height: 36px; padding: 6px 12px; font-size: 14px; }
.boton.peligro { color: var(--peligro); }
.icono { width: 18px; height: 18px; flex: none; }

/* ---------- acceso ---------- */
.acceso { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.acceso-tarjeta {
  width: 100%; max-width: 440px; background: var(--papel); border: 1px solid var(--borde);
  border-radius: 20px; padding: 32px 28px; box-shadow: var(--sombra);
}
.acceso-tarjeta img { height: 34px; width: auto; display: block; margin-bottom: 28px; }
.acceso-tarjeta h1 { font-size: 26px; margin-bottom: 10px; }
.acceso-tarjeta p { color: var(--gris); }
.campo { display: grid; gap: 6px; margin: 18px 0; }
.campo label { font-weight: 600; font-size: 15px; }
.campo input, .campo select {
  min-height: 48px; padding: 10px 14px; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; background: #fff;
}
.campo input:focus { border-color: var(--lav-700); outline: none; box-shadow: 0 0 0 3px var(--lav-200); }
.error-texto { color: var(--peligro); font-weight: 600; font-size: 15px; margin: 6px 0 0; }
.acceso-pie { font-size: 13px; color: var(--gris); margin-top: 22px; }

/* ---------- estructura ---------- */
.cabecera {
  position: sticky; top: 0; z-index: 30; height: var(--cabecera);
  display: flex; align-items: center; gap: 12px; padding: 0 16px;
  background: rgba(255, 255, 255, 0.94); backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--borde);
}
.cabecera .marca { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--tinta); min-width: 0; }
.cabecera .marca img { height: 24px; width: auto; flex: none; }
.cabecera .marca span { font-size: 14px; color: var(--gris); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cabecera .espacio { flex: 1; }
.cabecera .avance-mini { font: 500 13px/1 var(--f-mono); color: var(--gris); white-space: nowrap; }
.boton-menu { display: none; }
.usuario { display: flex; align-items: center; gap: 8px; }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; display: inline-grid; place-items: center; flex: none;
  font: 600 12px/1 var(--f-texto); background: var(--lav-100); color: var(--lav-800);
}
.avatar.rampco { background: #fdecc8; color: #7a4300; }
.avatar.otro { background: #e3eef9; color: #1b5e9e; }
.menu-exportar { position: relative; }
.desplegable {
  position: absolute; right: 0; top: calc(100% + 6px); min-width: 280px; z-index: 40;
  background: #fff; border: 1px solid var(--borde); border-radius: 12px; box-shadow: 0 10px 30px rgba(24, 24, 27, 0.14);
  padding: 6px;
}
.desplegable a, .desplegable button {
  display: block; width: 100%; text-align: left; padding: 10px 12px; border-radius: 8px; border: 0; background: none;
  color: var(--tinta); text-decoration: none; font-size: 15px;
}
.desplegable a:hover, .desplegable button:hover { background: var(--lav-50); }
.desplegable small { display: block; color: var(--gris); font-size: 13px; }

.marco { display: grid; grid-template-columns: var(--lateral) minmax(0, 1fr); min-height: calc(100vh - var(--cabecera)); }
.lateral {
  position: sticky; top: var(--cabecera); height: calc(100vh - var(--cabecera)); overflow-y: auto;
  border-right: 1px solid var(--borde); background: #fbfbfd; padding: 16px 12px 40px;
}
.lateral h2 { font: 500 11.5px/1.2 var(--f-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); margin: 18px 10px 6px; }
.lateral a {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 9px; color: var(--tinta);
  text-decoration: none; font-size: 14.5px; line-height: 1.35; min-height: 40px;
}
.lateral a:hover { background: var(--lav-50); }
.lateral a[aria-current="page"] { background: var(--lav-100); font-weight: 600; }
.lateral a .nombre { flex: 1; min-width: 0; }
.lateral a .cuenta { font: 500 12px/1 var(--f-mono); color: var(--gris); white-space: nowrap; }
.punto { width: 8px; height: 8px; border-radius: 50%; background: var(--cambio-texto); flex: none; }
.punto.nuevo { background: var(--lav-700); }
.velo { display: none; }

.principal { padding: 28px 32px 120px; min-width: 0; }
.contenido-ancho { max-width: 860px; margin: 0 auto; }

/* ---------- barra de filtros ---------- */
.filtros {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 auto 22px; max-width: 860px;
}
.filtros .buscar { flex: 1 1 240px; position: relative; }
.filtros .buscar input {
  width: 100%; min-height: 44px; padding: 10px 14px 10px 40px; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; background: #fff;
}
.filtros .buscar svg { position: absolute; left: 12px; top: 13px; width: 18px; height: 18px; color: var(--gris); }
.filtros select { min-height: 44px; padding: 8px 12px; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; background: #fff; }
.chip-filtro {
  min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1.5px solid var(--borde-fuerte); background: #fff; font-size: 14.5px;
}
.chip-filtro[aria-pressed="true"] { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.boton-filtros { display: none; }

/* ---------- encabezados de vista ---------- */
.ojo { font: 500 12px/1.2 var(--f-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--lav-700); margin-bottom: 8px; }
.vista-titulo { font-size: 32px; margin-bottom: 14px; }
.intro { color: var(--tinta-2); font-size: 16.5px; margin-bottom: 26px; }
.intro p { margin-bottom: 0.8em; }
.subtitulo { font-size: 22px; margin: 40px 0 8px; padding-top: 8px; }
.sub-intro { color: var(--tinta-2); margin-bottom: 14px; }

/* ---------- tarjetas ---------- */
.tarjeta {
  background: var(--papel); border: 1px solid var(--borde); border-radius: var(--radio);
  padding: 20px 22px 16px; margin: 14px 0; box-shadow: var(--sombra); scroll-margin-top: calc(var(--cabecera) + 16px);
}
.tarjeta.destacada { animation: destello 1.6s ease-out; }
@keyframes destello { 0% { box-shadow: 0 0 0 4px var(--lav-300); } 100% { box-shadow: var(--sombra); } }
.tarjeta-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.codigo { font: 500 13px/1 var(--f-mono); color: var(--lav-700); letter-spacing: 0.02em; text-decoration: none; }
.etiqueta {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; line-height: 1.4; border: 1px solid var(--borde); color: var(--gris); background: #fff;
}
.etiqueta.propuesta { background: #fff7e8; color: #7a4300; border-color: #f1d49d; }
.etiqueta.alta { background: #fde8e6; color: #9c1c12; border-color: #f3b4ad; }
.etiqueta.recomendada { background: var(--lav-100); color: var(--lav-800); border-color: var(--lav-300); }
.etiqueta.elegida { background: var(--lav-700); color: #fff; border-color: var(--lav-700); }
.estado { margin-left: auto; }
.pildora {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font-size: 13px; font-weight: 600;
  border: 1px solid var(--pend-borde); background: var(--pend-fondo); color: var(--pend-texto); white-space: nowrap;
}
.pildora::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.pildora.aprobado { background: var(--ok-fondo); color: var(--ok-texto); border-color: var(--ok-borde); }
.pildora.cambios { background: var(--cambio-fondo); color: var(--cambio-texto); border-color: var(--cambio-borde); }
.pildora.decidido { background: var(--dec-fondo); color: var(--dec-texto); border-color: var(--dec-borde); }
.tarjeta-titulo { font-size: 19px; margin: 2px 0 10px; }
.tarjeta-titulo a { color: inherit; text-decoration: none; }
.tarjeta-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13.5px; color: var(--gris); margin-bottom: 12px; }
.tarjeta-meta b { color: var(--tinta-2); font-weight: 600; }
.cuerpo { font-size: 15.5px; }
.cuerpo ul, .cuerpo ol { padding-left: 1.3em; margin: 0.3em 0 0.9em; }
.cuerpo li { margin: 0.2em 0; }
.cuerpo li > ul, .cuerpo li > ol { margin: 0.2em 0; }
.cuerpo code { font: 500 0.88em var(--f-mono); background: var(--pend-fondo); padding: 1px 5px; border-radius: 5px; }
.ref { font: 500 0.86em var(--f-mono); color: var(--lav-700); background: var(--lav-50); border: 1px solid var(--lav-200); padding: 0 5px; border-radius: 5px; text-decoration: none; white-space: nowrap; }
.ref:hover { background: var(--lav-100); }
.tabla-envoltura { overflow-x: auto; margin: 0.4em 0 1em; border: 1px solid var(--borde); border-radius: 10px; }
table { border-collapse: collapse; width: 100%; font-size: 14.5px; }
th, td { text-align: left; vertical-align: top; padding: 9px 12px; border-bottom: 1px solid var(--borde); }
th { background: #f7f7fa; font-weight: 600; font-size: 13.5px; }
tr:last-child td { border-bottom: 0; }

.opciones { display: grid; gap: 10px; margin: 14px 0 6px; }
.opcion {
  display: grid; grid-template-columns: 34px 1fr; gap: 12px; text-align: left; width: 100%;
  padding: 14px 16px; border-radius: 12px; border: 1.5px solid var(--borde-fuerte); background: #fff;
}
@media (hover: hover) { .opcion:hover:not([aria-disabled="true"]) { border-color: var(--lav-500); background: var(--lav-50); } }
.opcion[aria-disabled="true"] { cursor: default; }
.opcion .letra {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font: 600 15px/1 var(--f-titulo);
  border: 1.5px solid var(--borde-fuerte); background: #fff;
}
.opcion .op-titulo { font-weight: 600; display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }
.opcion .op-desc { color: var(--tinta-2); font-size: 15px; margin-top: 2px; }
.opcion.elegida { border: 2px solid var(--lav-700); background: var(--lav-100); }
.opcion.elegida .letra { background: var(--lav-700); border-color: var(--lav-700); color: #fff; }
.decision-info { font-size: 14px; color: var(--dec-texto); font-weight: 600; margin: 6px 0 2px; }

.relaciones { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; font-size: 13.5px; color: var(--gris); margin: 12px 0 2px; }
.relaciones .ref { font-size: 12.5px; }
.tarjeta-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border-top: 1px solid var(--borde); margin-top: 14px; padding-top: 12px; }
.tarjeta-pie .empuje { flex: 1; }
.solo-lectura { font-size: 13.5px; color: var(--gris); }

/* ---------- comentarios ---------- */
.hilo { margin-top: 12px; border-top: 1px dashed var(--borde); padding-top: 12px; }
.comentario { display: grid; grid-template-columns: 32px 1fr; gap: 10px; padding: 10px 0; }
.comentario + .comentario { border-top: 1px solid #ededf1; }
.comentario.resuelto .texto-comentario { color: var(--gris); }
.respuestas { margin-top: 6px; padding-left: 12px; border-left: 2px solid var(--lav-200); }
.respuestas .comentario { grid-template-columns: 26px 1fr; }
.respuestas .avatar { width: 26px; height: 26px; font-size: 11px; }
.comentario-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 13.5px; }
.comentario-cabeza strong { font-size: 14.5px; }
.comentario-cabeza .cuando { color: var(--gris); }
.tipo-c { font-size: 12px; font-weight: 600; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--pend-borde); background: var(--pend-fondo); color: var(--pend-texto); }
.tipo-c.pregunta { background: var(--preg-fondo); color: var(--preg-texto); border-color: var(--preg-borde); }
.tipo-c.cambio { background: var(--cambio-fondo); color: var(--cambio-texto); border-color: var(--cambio-borde); }
.tipo-c.resuelto { background: var(--ok-fondo); color: var(--ok-texto); border-color: var(--ok-borde); }
.nuevo-c { font-size: 11.5px; font-weight: 700; color: #fff; background: var(--lav-700); padding: 1px 7px; border-radius: 999px; }
.texto-comentario { white-space: pre-wrap; overflow-wrap: anywhere; margin: 4px 0 2px; font-size: 15px; }
.acciones-comentario { display: flex; flex-wrap: wrap; gap: 2px; margin-left: -10px; }
.acciones-comentario .boton { min-height: 36px; font-size: 13.5px; font-weight: 600; padding: 4px 10px; }
.redactor { display: grid; gap: 8px; margin-top: 10px; }
.redactor textarea {
  width: 100%; min-height: 84px; resize: vertical; padding: 10px 12px; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; background: #fff; line-height: 1.5;
}
.redactor textarea:focus { border-color: var(--lav-700); outline: none; box-shadow: 0 0 0 3px var(--lav-200); }
.redactor-pie { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.segmentos { display: inline-flex; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; overflow: hidden; background: #fff; }
.segmentos button { border: 0; background: none; padding: 8px 12px; min-height: 40px; font-size: 14px; font-weight: 600; color: var(--gris); }
.segmentos button + button { border-left: 1.5px solid var(--borde-fuerte); }
.segmentos button[aria-pressed="true"] { background: var(--tinta); color: #fff; }
.sin-comentarios { color: var(--gris); font-size: 14.5px; margin: 4px 0; }

/* ---------- resumen ---------- */
.rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin: 18px 0 30px; }
.cifra { background: #fff; border: 1px solid var(--borde); border-radius: var(--radio); padding: 18px 20px; box-shadow: var(--sombra); }
.cifra .numero { font: 700 34px/1.1 var(--f-titulo); }
.cifra .numero small { font-size: 18px; color: var(--gris); font-weight: 600; }
.cifra .rotulo { color: var(--gris); font-size: 14.5px; margin-top: 4px; }
.barra { height: 10px; border-radius: 999px; background: var(--pend-fondo); overflow: hidden; display: flex; margin-top: 12px; }
.barra span { display: block; height: 100%; }
.barra .b-ok { background: #2f9e64; }
.barra .b-dec { background: var(--lav-700); }
.barra .b-cambio { background: #e39a2d; }
.leyenda { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--gris); margin-top: 8px; }
.leyenda i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: 0; }
.leyenda i.b-ok { background: #2f9e64; } .leyenda i.b-dec { background: var(--lav-700); } .leyenda i.b-cambio { background: #e39a2d; }
.empuje { flex: 1; }
.tabla-secciones td:nth-child(n+2), .tabla-secciones th:nth-child(n+2) { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tabla-secciones .barra { margin: 4px 0 0; height: 6px; }
.lista-simple { list-style: none; padding: 0; margin: 0; }
.lista-simple li { padding: 10px 0; border-bottom: 1px solid var(--borde); display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.lista-simple li:last-child { border-bottom: 0; }
.caja { background: #fff; border: 1px solid var(--borde); border-radius: var(--radio); padding: 6px 20px; margin: 12px 0 28px; box-shadow: var(--sombra); }
.actividad .quien { font-weight: 600; }
.actividad .cuando { color: var(--gris); font-size: 13.5px; margin-left: auto; }
.actividad .extracto { flex-basis: 100%; color: var(--tinta-2); font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.navegacion-secciones { display: flex; justify-content: space-between; gap: 12px; margin-top: 40px; flex-wrap: wrap; }
.aviso-banda {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between;
  background: var(--lav-100); border: 1px solid var(--lav-300); color: var(--lav-800); padding: 10px 14px; border-radius: 12px; margin: 0 auto 18px; max-width: 860px; font-weight: 600;
}

/* ---------- avisos ---------- */
body.en-reunion .avisos { bottom: 92px; }
.avisos { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 80; display: grid; gap: 8px; width: min(560px, calc(100vw - 32px)); }
.aviso {
  display: flex; align-items: center; gap: 12px; background: var(--tinta); color: #fff; padding: 12px 14px 12px 18px; border-radius: 12px;
  box-shadow: 0 10px 30px rgba(24, 24, 27, 0.25); font-size: 15px;
}
.aviso span { flex: 1; }
.aviso .boton { min-height: 36px; background: transparent; color: var(--lav-300); border-color: transparent; }
.aviso.error { background: #7a1810; }

/* ---------- modo reunión ---------- */
.reunion { position: fixed; inset: 0; z-index: 60; background: var(--fondo); display: grid; grid-template-rows: auto 1fr auto; }
.reunion-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 20px; background: #fff; border-bottom: 1px solid var(--borde); }
.reunion-cabeza select { min-height: 44px; padding: 8px 12px; border: 1.5px solid var(--borde-fuerte); border-radius: 10px; background: #fff; max-width: 100%; }
.reunion-cabeza .posicion { font: 500 14px/1 var(--f-mono); color: var(--gris); }
.reunion-cabeza .espacio { flex: 1; }
.reunion-cuerpo { overflow-y: auto; padding: 24px 20px 40px; }
.reunion-rejilla { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr); gap: 24px; align-items: start; }
.reunion .tarjeta { margin: 0; }
.reunion .tarjeta .tarjeta-titulo { font-size: 28px; }
.reunion .tarjeta .cuerpo { font-size: 18px; }
.reunion .tarjeta .opcion .op-desc { font-size: 17px; }
.reunion-hilo { position: sticky; top: 0; background: #fff; border: 1px solid var(--borde); border-radius: var(--radio); padding: 18px 20px; box-shadow: var(--sombra); }
.reunion-hilo h3 { font-size: 18px; margin-bottom: 6px; }
.reunion-hilo .hilo { border-top: 0; margin-top: 0; padding-top: 0; }
.reunion-pie { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px; background: #fff; border-top: 1px solid var(--borde); }
.reunion-pie .boton { min-height: 52px; min-width: 150px; font-size: 16px; }
.reunion-barra { height: 4px; background: var(--pend-fondo); }
.reunion-barra span { display: block; height: 100%; background: var(--lav-700); transition: width 0.25s; }
.vacio { text-align: center; color: var(--gris); padding: 60px 20px; }

/* ---------- documento para imprimir ---------- */
.documento .tarjeta { box-shadow: none; }
.documento-barra { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 20px; }
.documento-barra label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.documento-portada { margin-bottom: 30px; }
.documento-portada img { height: 40px; width: auto; margin-bottom: 26px; }
.documento-portada h1 { font-size: 34px; margin-bottom: 8px; }
.documento-portada p { color: var(--gris); }
.documento.sin-estados .estado, .documento.sin-estados .decision-info { display: none; }
.documento h2.seccion-doc { font-size: 26px; margin: 46px 0 6px; padding-top: 18px; border-top: 3px solid var(--tinta); }

/* ---------- móvil ---------- */
@media (max-width: 980px) {
  :root { --lateral: 0px; }
  .marco { grid-template-columns: minmax(0, 1fr); }
  .boton-menu { display: inline-flex; }
  .lateral {
    position: fixed; top: var(--cabecera); left: 0; bottom: 0; width: min(320px, 86vw); height: auto; z-index: 50;
    transform: translateX(-102%); transition: transform 0.2s ease; box-shadow: 10px 0 30px rgba(24, 24, 27, 0.12);
  }
  body.menu-abierto .lateral { transform: none; }
  body.menu-abierto .velo { display: block; position: fixed; inset: var(--cabecera) 0 0 0; background: rgba(24, 24, 27, 0.32); z-index: 45; }
  .principal { padding: 20px 16px 110px; }
  .cabecera .marca span, .cabecera .avance-mini, .usuario .nombre-usuario { display: none; }
  .reunion-rejilla { grid-template-columns: minmax(0, 1fr); }
  .reunion-hilo { position: static; }
  .reunion .tarjeta .tarjeta-titulo { font-size: 23px; }
  .reunion .tarjeta .cuerpo { font-size: 16.5px; }
  .reunion-pie .boton { min-width: 0; flex: 1; }
}
@media (max-width: 760px) {
  .boton-filtros { display: inline-flex; }
  .filtros .buscar { flex: 1 1 0; min-width: 0; }
  .filtros > select, .filtros > .chip-filtro { display: none; }
  .filtros.abiertos > select, .filtros.abiertos > .chip-filtro { display: inline-flex; flex: 1 1 100%; }
  .filtros.abiertos > select { display: block; width: 100%; }
}
@media (max-width: 560px) {
  .vista-titulo { font-size: 26px; }
  .tarjeta { padding: 16px 16px 12px; border-radius: 12px; }
  .tarjeta-titulo { font-size: 18px; }
  .opcion { grid-template-columns: 30px 1fr; padding: 12px; gap: 10px; }
  .opcion .letra { width: 30px; height: 30px; }
  .cabecera { gap: 8px; padding: 0 10px; }
  .cabecera .boton { padding: 8px 10px; }
  .oculto-movil { display: none !important; }
  .estado { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- impresión ---------- */
@media print {
  @page { margin: 16mm 14mm; }
  body { background: #fff; font-size: 11pt; }
  .cabecera, .lateral, .filtros, .documento-barra, .avisos, .tarjeta-pie, .redactor, .acciones-comentario, .velo, .saltar, .aviso-banda { display: none !important; }
  .marco { display: block; }
  .principal { padding: 0; }
  .contenido-ancho { max-width: none; }
  .tarjeta { border: 0; border-top: 1.5pt solid #18181b; border-radius: 0; box-shadow: none; break-inside: avoid-page; page-break-inside: avoid; padding: 8pt 0 4pt; margin: 6pt 0 10pt; }
  .tarjeta-titulo { font-size: 13pt; }
  .cuerpo { font-size: 10.5pt; }
  h1, h2, h3, h4, .subtitulo { break-after: avoid; page-break-after: avoid; }
  .indice { break-after: page; page-break-after: always; }
  .opcion { padding: 6pt 8pt; }
  .estado .pildora { border: 1px solid #999; }
  .documento h2.seccion-doc { break-before: page; page-break-before: always; border-top: 0; margin-top: 0; }
  .documento h2.seccion-doc.primera { break-before: auto; page-break-before: auto; }
  .ref { border: 0; background: none; padding: 0; color: #4a2fc0; }
  a { color: inherit; text-decoration: none; }
  .tabla-envoltura { overflow: visible; }
}