/* Concepto: banco de trabajo del topógrafo. Barra de proyecto, pestañas por fase del
   trabajo (reducir → ajustar → decidir) y tablas de datos densas en cifras mono. */
:root {
  --papel: #f4f6f5;
  --panel: #ffffff;
  --tinta: #1b2425;
  --tinta-2: #536063;
  --tinta-3: #7d898b;
  --linea: #d6dddb;
  --linea-2: #e8edec;
  --acento: #0a6a70;
  --acento-suave: #dbeeee;
  --ok: #2c7a4b;
  --ok-suave: #e0f0e5;
  --aviso: #9a5c06;
  --aviso-suave: #f7ebd5;
  --error: #b03a2d;
  --error-suave: #f7e1dd;
  --decision: #5547ad;
  --decision-suave: #e8e5f7;
  /* Gráficos (validados con el validador de paleta: azul de serie y gris de fondo) */
  --serie-1: #2a78d6;
  --serie-gris: #7d898b;
  --zona-op: 0.22;
  /* Paleta categórica (orden fijo, validada para daltonismo sobre estos fondos) */
  --cat-1: #2a78d6; --cat-2: #eb6834; --cat-3: #1baf7a; --cat-4: #eda100; --cat-5: #e87ba4; --cat-6: #008300; --cat-7: #6250d6;
  --sombra: 0 1px 2px rgb(20 40 40 / 0.06), 0 2px 8px rgb(20 40 40 / 0.05);
  --f-titulo: "Barlow Semi Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --f-texto: "Barlow", "Helvetica Neue", Arial, sans-serif;
  --f-cifra: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --papel: #111617; --panel: #182021; --tinta: #e3eaea; --tinta-2: #a2b1b3; --tinta-3: #77878a;
    --linea: #2b3537; --linea-2: #222b2c; --acento: #52b7bc; --acento-suave: #163234;
    --ok: #6cc48f; --ok-suave: #17301f; --aviso: #e2a64c; --aviso-suave: #33260f;
    --error: #f08072; --error-suave: #3b1c18; --decision: #ab9ff3; --decision-suave: #262246;
    --serie-1: #3987e5; --serie-gris: #6f7d80; --zona-op: 0.42;
    --cat-1: #3987e5; --cat-2: #d95926; --cat-3: #199e70; --cat-4: #c98500; --cat-5: #d55181; --cat-6: #008300; --cat-7: #9085e9;
    --sombra: 0 1px 2px rgb(0 0 0 / 0.3); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --papel: #111617; --panel: #182021; --tinta: #e3eaea; --tinta-2: #a2b1b3; --tinta-3: #77878a;
  --linea: #2b3537; --linea-2: #222b2c; --acento: #52b7bc; --acento-suave: #163234;
  --ok: #6cc48f; --ok-suave: #17301f; --aviso: #e2a64c; --aviso-suave: #33260f;
  --error: #f08072; --error-suave: #3b1c18; --decision: #ab9ff3; --decision-suave: #262246;
    --serie-1: #3987e5; --serie-gris: #6f7d80; --zona-op: 0.42;
    --cat-1: #3987e5; --cat-2: #d95926; --cat-3: #199e70; --cat-4: #c98500; --cat-5: #d55181; --cat-6: #008300; --cat-7: #9085e9;
  --sombra: 0 1px 2px rgb(0 0 0 / 0.3); color-scheme: dark;
}
* { box-sizing: border-box; }
html { background: var(--papel); }
body {
  background: var(--papel); color: var(--tinta);
  font: 400 15px/1.45 var(--f-texto);
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  padding-block: 0 48px;
}
h1, h2, h3, h4 { font-family: var(--f-titulo); margin: 0; text-wrap: balance; letter-spacing: 0.01em; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }
.cifra { font-family: var(--f-cifra); font-variant-numeric: tabular-nums; }
.etiqueta { font-family: var(--f-titulo); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--tinta-3); }
.etiqueta.griega { text-transform: none; letter-spacing: 0.02em; font-size: 13px; }

/* Barra de proyecto */
.barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-block: 18px 14px; border-bottom: 1px solid var(--linea); }
.barra .marca { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.barra h1 { font-size: 26px; font-weight: 700; }
.barra .ruta { color: var(--tinta-2); font-size: 14px; }
.motor { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--tinta-2); padding: 5px 10px; border: 1px solid var(--linea); border-radius: 999px; background: var(--panel); }
.motor .luz { width: 8px; height: 8px; border-radius: 50%; background: var(--tinta-3); }
.motor.ok .luz { background: var(--ok); }
.motor.mal .luz { background: var(--error); }

.nota { margin-block: 14px 0; padding: 10px 14px; font-size: 13.5px; color: var(--tinta-2); background: var(--panel); border: 1px solid var(--linea-2); border-radius: 6px; max-width: 980px; }

.pestanas { display: flex; gap: 4px; margin-block: 18px 18px; border-bottom: 1px solid var(--linea); overflow-x: auto; }
.pestanas button { background: none; border: 0; padding: 10px 14px 9px; font-family: var(--f-titulo); font-weight: 600; font-size: 16px; color: var(--tinta-2); border-bottom: 3px solid transparent; cursor: pointer; white-space: nowrap; }
.pestanas button[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--acento); }
.pestanas .cuenta { font-family: var(--f-cifra); font-size: 12px; color: var(--decision); margin-left: 6px; }

/* Reducción */
.reduccion { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 24px; align-items: start; }
.lateral { display: grid; gap: 18px; position: sticky; top: max(12px, env(safe-area-inset-top, 0px)); }
.lista { display: grid; gap: 6px; }
.registro { text-align: left; background: var(--panel); border: 1px solid var(--linea); border-radius: 6px; padding: 9px 11px; cursor: pointer; display: grid; gap: 2px; }
.registro[aria-pressed="true"] { border-color: var(--acento); box-shadow: inset 3px 0 0 var(--acento); }
.registro .fichero { font-family: var(--f-cifra); font-size: 13.5px; font-weight: 500; }
.registro .meta { font-size: 12.5px; color: var(--tinta-2); }
.puestas { display: grid; gap: 2px; max-height: 52vh; overflow-y: auto; padding-right: 2px; }
.puesta { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 8px; text-align: left; background: none; border: 0; border-radius: 5px; padding: 6px 8px; cursor: pointer; }
.puesta:hover { background: var(--linea-2); }
.puesta[aria-pressed="true"] { background: var(--acento-suave); }
.puesta .num { font-family: var(--f-cifra); font-size: 12.5px; color: var(--tinta-3); }
.puesta .est { font-weight: 600; }
.puesta .vis { font-size: 12.5px; color: var(--tinta-2); }
.marcas { display: flex; gap: 4px; }
.pastilla { font-family: var(--f-cifra); font-size: 11.5px; line-height: 1; padding: 4px 6px; border-radius: 999px; white-space: nowrap; }
.pastilla.descarte { background: var(--aviso-suave); color: var(--aviso); }
.pastilla.decidida { background: var(--decision-suave); color: var(--decision); }
.pastilla.ok { background: var(--ok-suave); color: var(--ok); }

.detalle { display: grid; gap: 18px; min-width: 0; }
.cabecera-puesta { display: grid; gap: 8px; }
.cabecera-puesta h2 { font-size: 28px; font-weight: 700; }
.cabecera-puesta p { margin: 0; color: var(--tinta-2); font-size: 14px; }
.giros { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; color: var(--tinta-2); }
.giros .cifra { background: var(--panel); border: 1px solid var(--linea-2); border-radius: 4px; padding: 2px 6px; font-size: 12.5px; color: var(--tinta); }

.visado { background: var(--panel); border: 1px solid var(--linea); border-radius: 8px; box-shadow: var(--sombra); overflow: hidden; }
.visado > header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 24px; padding: 14px 16px 10px; border-bottom: 1px solid var(--linea-2); }
.visado h3 { font-size: 21px; font-weight: 700; min-width: 7ch; }
.visado h3 .flecha { color: var(--tinta-3); font-weight: 500; }
.resultado { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; }
.resultado div { display: grid; gap: 0; }
.resultado dt { font-family: var(--f-titulo); font-weight: 600; font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--tinta-3); }
.resultado dd { margin: 0; font-family: var(--f-cifra); font-size: 14.5px; }
.resultado dd.sin { color: var(--error); }

.series { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 16px; border-bottom: 1px solid var(--linea-2); }
.serie { display: grid; gap: 2px; padding: 6px 10px; border-radius: 6px; border: 1px solid var(--linea); font-size: 12.5px; min-width: 150px; }
.serie .nombre { font-family: var(--f-titulo); font-weight: 600; font-size: 13px; display: flex; justify-content: space-between; gap: 8px; }
.serie.activa { background: var(--ok-suave); border-color: transparent; }
.serie.inactiva { background: var(--aviso-suave); border-color: transparent; }
.serie.forzada { background: var(--decision-suave); border-color: transparent; }
.serie .res { font-family: var(--f-cifra); font-size: 12px; color: var(--tinta-2); }
.serie .res .fuera { color: var(--error); font-weight: 500; }

.tabla-envoltorio { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
th { font-family: var(--f-titulo); font-weight: 600; font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--tinta-3); text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--linea); white-space: nowrap; }
td { padding: 7px 10px; border-bottom: 1px solid var(--linea-2); vertical-align: top; }
td.n, th.n { text-align: right; }
td.cifra { white-space: nowrap; }
tr.inactiva td { color: var(--tinta-3); }
tr.inactiva td.cifra { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--tinta-3) 60%, transparent); }
tr.decidida { box-shadow: inset 3px 0 0 var(--decision); }
.estado { font-weight: 600; font-size: 12.5px; }
.estado.ok { color: var(--ok); }
.estado.no { color: var(--aviso); }
.estado.dec { color: var(--decision); }
.motivo { font-size: 12.5px; color: var(--tinta-2); max-width: 46ch; }
tr.inactiva .motivo { color: var(--tinta-2); }

.interruptor { position: relative; width: 40px; height: 22px; border-radius: 999px; border: 1px solid var(--linea); background: var(--linea-2); cursor: pointer; padding: 0; flex: none; }
.interruptor::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--tinta-3); transition: transform 0.15s ease, background 0.15s; }
.interruptor[aria-checked="true"] { background: var(--ok-suave); border-color: var(--ok); }
.interruptor[aria-checked="true"]::after { transform: translateX(18px); background: var(--ok); }
.interruptor.decidido { border-color: var(--decision); }
.interruptor.decidido::after { background: var(--decision); }
.interruptor:disabled { opacity: 0.4; cursor: not-allowed; }

tr.editor td { background: var(--decision-suave); }
.formulario { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.formulario label { display: grid; gap: 4px; font-size: 13px; color: var(--tinta-2); flex: 1 1 280px; }
.formulario input { font: inherit; color: var(--tinta); background: var(--panel); border: 1px solid var(--linea); border-radius: 5px; padding: 7px 9px; }
.formulario .pie { font-size: 12.5px; color: var(--tinta-2); flex-basis: 100%; }
.boton { border-radius: 5px; padding: 7px 12px; border: 1px solid var(--linea); background: var(--panel); cursor: pointer; font-weight: 500; white-space: nowrap; }
.boton.principal { background: var(--acento); border-color: var(--acento); color: var(--panel); }
.boton.decision { background: var(--decision); border-color: var(--decision); color: var(--panel); }
.boton:disabled { opacity: 0.45; cursor: not-allowed; }
.boton.pequeno { padding: 4px 9px; font-size: 13px; }

.avisos { display: grid; gap: 6px; }
.aviso { padding: 8px 12px; border-radius: 6px; background: var(--aviso-suave); color: var(--tinta); font-size: 13.5px; }
.aviso b { color: var(--aviso); }

/* Ajuste */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.kpi { background: var(--panel); border: 1px solid var(--linea); border-radius: 8px; padding: 12px 14px; display: grid; gap: 4px; }
.kpi .valor { font-family: var(--f-cifra); font-size: 26px; font-weight: 500; line-height: 1.15; }
.kpi .sub { font-size: 13px; color: var(--tinta-2); }
.kpi .cambio { font-family: var(--f-cifra); font-size: 13px; }
.chip { display: inline-block; font-size: 12.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; }
.chip.ok { background: var(--ok-suave); color: var(--ok); }
.chip.mal { background: var(--error-suave); color: var(--error); }
.ajuste { display: grid; gap: 18px; }
.bloque { background: var(--panel); border: 1px solid var(--linea); border-radius: 8px; overflow: hidden; }
.bloque > h3 { font-size: 18px; padding: 12px 16px 4px; }
.bloque > p { margin: 0; padding: 0 16px 10px; color: var(--tinta-2); font-size: 13.5px; max-width: 90ch; }
.excluida { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 12px 16px; border-radius: 8px; background: var(--decision-suave); }
.excluida .texto { flex: 1 1 320px; font-size: 14px; }
.barra-w { position: relative; width: 120px; height: 10px; border-radius: 3px; background: var(--linea-2); }
.barra-w span { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 3px; background: var(--tinta-3); }
.barra-w span.fuera { background: var(--error); }
.barra-w i { position: absolute; top: -3px; bottom: -3px; width: 1px; background: var(--tinta-2); }
.id { font-family: var(--f-cifra); font-size: 12px; color: var(--tinta-2); word-break: break-all; }
tr.senalada td:first-child { box-shadow: inset 3px 0 0 var(--error); }

/* Decisiones */
.decisiones { display: grid; gap: 18px; max-width: 1100px; }
.decision-fila { display: grid; grid-template-columns: 120px minmax(0, 1fr) minmax(0, 1.2fr) 170px; gap: 6px 16px; padding: 10px 16px; border-top: 1px solid var(--linea-2); font-size: 14px; }
.decision-fila:first-of-type { border-top: 0; }
.tipo-decision { font-family: var(--f-titulo); font-weight: 600; }
.autor { font-size: 12.5px; color: var(--tinta-2); }
.autor.tu { color: var(--decision); font-weight: 600; }
.vacio { padding: 12px 16px; color: var(--tinta-2); font-size: 14px; }

.flotante { position: fixed; left: 50%; bottom: max(18px, env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--tinta); color: var(--papel); padding: 10px 16px; border-radius: 8px; font-size: 14px; box-shadow: 0 6px 20px rgb(0 0 0 / 0.25); max-width: min(560px, calc(100vw - 32px)); z-index: 20; }

/* Proyectos */
.selector-proyecto { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 14px; }
.proyecto-btn { text-align: left; background: var(--panel); border: 1px solid var(--linea); border-radius: 6px; padding: 7px 12px; cursor: pointer; display: grid; gap: 1px; }
.proyecto-btn[aria-pressed="true"] { border-color: var(--acento); box-shadow: inset 3px 0 0 var(--acento); }
.proyecto-btn .nombre { font-family: var(--f-titulo); font-weight: 600; font-size: 15px; }
.proyecto-btn .meta { font-size: 12.5px; color: var(--tinta-2); }
.vacio-grande { background: var(--panel); border: 1px solid var(--linea); border-radius: 8px; padding: 22px 22px; max-width: 760px; display: grid; gap: 8px; }
.vacio-grande h2 { font-size: 22px; }
.vacio-grande p { margin: 0; color: var(--tinta-2); }

/* Campañas y movimientos */
.temporal { display: grid; gap: 18px; }
.campanas { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 8px; }
.campana { background: var(--panel); border: 1px solid var(--linea); border-radius: 8px; padding: 10px 12px; display: grid; gap: 4px; align-content: start; }
.campana .fila { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.campana .nombre { font-family: var(--f-titulo); font-weight: 700; font-size: 18px; }
.campana .fecha { font-family: var(--f-cifra); font-size: 13px; }
.campana .meta { font-size: 12.5px; color: var(--tinta-2); }
.campana.excluida { background: var(--decision-suave); border-color: transparent; }
.campana.excluida .nombre, .campana.excluida .fecha { color: var(--tinta-2); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--tinta-3) 70%, transparent); }
.campana .motivo { color: var(--decision); }
.editor-campana { background: var(--decision-suave); border-radius: 8px; padding: 12px 14px; }
.filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.segmentos { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--linea); border-radius: 6px; overflow: hidden; background: var(--panel); }
.segmentos button { border: 0; border-left: 1px solid var(--linea); background: none; padding: 6px 11px; cursor: pointer; font-family: var(--f-cifra); font-size: 13px; color: var(--tinta-2); }
.segmentos button:first-child { border-left: 0; }
.segmentos button[aria-pressed="true"] { background: var(--acento-suave); color: var(--tinta); font-weight: 500; }
.leyenda { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--tinta-2); padding: 0 16px 8px; }
.leyenda span { display: inline-flex; align-items: center; gap: 7px; }
.leyenda svg { flex: none; }
.grafico { padding: 0 8px 4px; min-height: 60px; }
.grafico svg { display: block; overflow: visible; }
.multiples { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 4px 12px; padding: 0 8px 8px; }
.multiples h4 { font-size: 14px; font-weight: 600; padding: 6px 8px 0; }
.multiples .grafico { padding: 0; }
.puntos-sel { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px 16px 10px; }
.puntos-sel button { font-family: var(--f-cifra); font-size: 13px; border: 1px solid var(--linea); background: var(--panel); border-radius: 999px; padding: 4px 10px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.puntos-sel button[aria-pressed="true"] { border-color: var(--acento); background: var(--acento-suave); color: var(--tinta); }
.puntos-sel .marca-mov { width: 7px; height: 7px; border-radius: 50%; background: var(--serie-1); }
.resumen-punto { padding: 0 16px 10px; font-size: 14.5px; max-width: 95ch; display: grid; gap: 4px; }
.resumen-punto p { margin: 0; }
.explica { margin: 0 16px 12px; padding: 10px 14px; border-left: 3px solid var(--linea); color: var(--tinta-2); font-size: 13.5px; max-width: 95ch; }
tr.clicable { cursor: pointer; }
tr.clicable:hover td { background: var(--linea-2); }
tr.elegida td { background: var(--acento-suave); }
.pastilla.neutra { background: var(--linea-2); color: var(--tinta-2); }
.tip { position: fixed; z-index: 30; pointer-events: none; background: var(--panel); color: var(--tinta); border: 1px solid var(--linea); border-radius: 6px; box-shadow: 0 4px 16px rgb(0 0 0 / 0.14); padding: 8px 10px; font-size: 13px; min-width: 180px; max-width: 280px; }
.tip .titulo { font-family: var(--f-titulo); font-weight: 600; font-size: 13.5px; margin-bottom: 4px; }
.tip .linea-tip { display: grid; grid-template-columns: 14px 1fr; gap: 2px 8px; align-items: center; margin-top: 3px; }
.tip .valor { font-family: var(--f-cifra); font-weight: 500; font-size: 13px; }
.tip .clave { grid-column: 2; color: var(--tinta-2); font-size: 12px; }
.tip i { display: block; width: 12px; height: 2px; border-radius: 1px; }
.tip i.punto { width: 8px; height: 8px; border-radius: 50%; margin-left: 2px; }
[data-tip] { cursor: crosshair; }
.zona { fill: var(--serie-gris); opacity: var(--zona-op); }
.grafico text { font-family: var(--f-cifra); font-size: 11.5px; fill: var(--tinta-3); }
.col .cruz { opacity: 0; }
.col:hover .cruz, .col:focus .cruz { opacity: 1; }
.casilla { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--tinta-2); cursor: pointer; }
.casilla input { width: 16px; height: 16px; accent-color: var(--acento); margin: 0; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
details summary { cursor: pointer; color: var(--acento); font-size: 13.5px; font-weight: 500; }
details table { margin-top: 8px; }
[data-tip]:focus { outline: none; }
[data-tip]:focus-visible { outline: 2px solid var(--acento); }

@media (max-width: 860px) {
  .reduccion { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: static; }
  .puestas { max-height: 240px; }
  .decision-fila { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) { .interruptor::after { transition: none; } }

/* ---------- Aplicación (pantallas de la app real) */
.logo { text-decoration: none; color: inherit; }
.ruta a { color: var(--acento); text-decoration: none; }
.cabecera-derecha { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
#usuario { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--tinta-2); }
#usuario:empty { display: none; }
.pestanas a { padding: 10px 14px 9px; font-family: var(--f-titulo); font-weight: 600; font-size: 16px; color: var(--tinta-2); border-bottom: 3px solid transparent; text-decoration: none; white-space: nowrap; }
.pestanas a[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--acento); }
.acceso { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; max-width: 860px; margin-top: 28px; }
.formulario.vertical { flex-direction: column; align-items: stretch; padding: 4px 16px 16px; }
.formulario.vertical label { flex: none; }
.proyectos { display: grid; gap: 18px; max-width: 860px; margin-top: 28px; }
.proyecto-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 10px 16px; border-top: 1px solid var(--linea-2); }
.proyecto-enlace { display: grid; gap: 2px; text-decoration: none; color: inherit; min-width: 0; }
.proyecto-enlace .nombre { font-family: var(--f-titulo); font-weight: 600; font-size: 17px; color: var(--acento); }
.proyecto-enlace .meta { font-size: 12.5px; color: var(--tinta-2); }
.confirmar { font-size: 13.5px; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.boton.peligro { background: var(--error); border-color: var(--error); color: var(--panel); }
.zona-subida { margin: 0 16px 14px; padding: 18px; border: 2px dashed var(--linea); border-radius: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--tinta-2); }
.zona-subida.encima { border-color: var(--acento); background: var(--acento-suave); }
.barra-calculo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-bottom: 4px; }
.barra-calculo .meta { font-size: 13px; color: var(--tinta-2); }
.preguntas { margin: 0; padding: 0 16px 14px 34px; display: grid; gap: 10px; font-size: 14px; }
.bloque > p > .boton { margin-top: 2px; }
main > .vacio { padding: 24px 0; }
.indicio { font-size: 13px; color: var(--tinta-2); max-width: 95ch; }

/* Importación asistida */
.importacion > p { max-width: 95ch; }
.meta-imp { color: var(--tinta-3); font-size: 13px; }
.imp-cabecera { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 2px 16px 12px; }
.imp-estado { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: var(--acento-suave); color: var(--acento); font-size: 14px; }
.imp-estado.pregunta { background: var(--decision-suave); color: var(--decision); }
.imp-estado.propuesta { background: var(--ok-suave); color: var(--ok); }
.imp-estado.error { background: var(--error-suave); color: var(--error); }
.girando { width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: girar 0.9s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .girando { animation-duration: 3s; } }
.imp-traza { margin: 0 16px 14px; border: 1px solid var(--linea-2); border-radius: 6px; background: var(--papel); }
.imp-traza > summary { cursor: pointer; padding: 8px 12px; font-weight: 600; font-size: 14px; color: var(--tinta-2); }
.imp-traza ol { margin: 0; padding: 0 12px 10px 34px; display: grid; gap: 5px; font-size: 13.5px; max-height: 420px; overflow-y: auto; }
.imp-traza li { color: var(--tinta-2); overflow-wrap: anywhere; }
.imp-traza li.t-texto { color: var(--tinta); }
.imp-traza li.t-texto p { margin: 0 0 4px; }
.imp-traza li.t-pregunta, .imp-traza li.t-respuesta { color: var(--decision); }
.imp-traza li.t-error { color: var(--error); }
.imp-traza li.t-espera { color: var(--tinta-3); font-style: italic; list-style: none; }
.imp-final { margin: 0 16px 12px; padding: 10px 14px; background: var(--acento-suave); border-radius: 6px; font-size: 14px; max-width: 110ch; }
.imp-final p { margin: 0 0 6px; }
.imp-final p:last-child { margin: 0; }
.preguntas-ia { display: grid; gap: 12px; padding: 0 16px 14px; }
.pregunta-ia { border: 1px solid var(--linea); border-left: 3px solid var(--decision); border-radius: 6px; padding: 10px 14px 12px; margin: 0; display: grid; gap: 6px; min-width: 0; }
.pregunta-ia legend { font-weight: 600; padding: 0 4px; max-width: 100%; }
.pregunta-ia .por-que { margin: 0; color: var(--tinta-2); font-size: 13.5px; }
.pregunta-ia .indicio { margin: 0; }
.opciones { display: flex; flex-wrap: wrap; gap: 6px; }
.opcion { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--linea); border-radius: 999px; font-size: 13.5px; cursor: pointer; background: var(--panel); }
.opcion:has(input:checked) { border-color: var(--decision); background: var(--decision-suave); }
.pregunta-ia .otra { display: grid; gap: 4px; font-size: 13px; color: var(--tinta-2); }
.pregunta-ia textarea { font: inherit; color: var(--tinta); background: var(--panel); border: 1px solid var(--linea); border-radius: 5px; padding: 6px 8px; resize: vertical; width: 100%; }
.acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 4px 16px 14px; }
.preguntas-ia .acciones { padding: 0; }
.sub-imp { padding: 8px 16px 4px; font-size: 15px; }
.propuesta .tabla-envoltorio { margin-bottom: 8px; }
.resultado.texto dd { font-family: var(--f-texto); font-size: 14px; }
.aviso-nuevos { margin: 0 16px 12px; padding: 8px 12px; border-radius: 6px; background: var(--decision-suave); font-size: 13.5px; max-width: 110ch; }
.aviso-nuevos b { color: var(--decision); }
.revision-ia { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 0 16px 14px; }
.revision-ia label { display: grid; gap: 4px; font-size: 13px; color: var(--tinta-2); flex: 1 1 420px; }
.revision-ia textarea { font: inherit; color: var(--tinta); background: var(--panel); border: 1px solid var(--linea); border-radius: 5px; padding: 6px 8px; resize: vertical; width: 100%; }
.preguntas-ia > .otra { display: grid; gap: 4px; font-size: 13px; color: var(--tinta-2); }
.preguntas-ia > .otra textarea { font: inherit; color: var(--tinta); background: var(--panel); border: 1px solid var(--linea); border-radius: 5px; padding: 6px 8px; resize: vertical; width: 100%; }

/* Plano de la red */
.red-plano > p { max-width: 110ch; }
.txt-error { color: var(--error); }
.red-controles { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 0 16px 8px; }
.red-controles .zoom { display: inline-flex; gap: 4px; margin-left: auto; }
.red-leyenda { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 10px; }
.ley-red { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--linea); background: var(--panel); border-radius: 999px; padding: 3px 10px; font-size: 13px; color: var(--tinta); cursor: pointer; }
.ley-red i { width: 16px; height: 3px; border-radius: 2px; }
.ley-red .n { font-family: var(--f-cifra); font-size: 12px; color: var(--tinta-3); }
.ley-red.apagada { opacity: 0.45; }
.ley-red[aria-pressed="true"], .ley-red.activo { border-color: var(--acento); background: var(--acento-suave); }
.red-lienzo { position: relative; margin: 0 16px 16px; border: 1px solid var(--linea-2); border-radius: 6px; background: var(--papel); overflow: hidden; touch-action: none; cursor: grab; }
.red-lienzo.arrastrando { cursor: grabbing; }
@media (max-width: 640px) { .red-lienzo { height: 420px !important; margin-inline: 8px; } }
.red-svg { width: 100%; height: 100%; display: block; user-select: none; }
.red-svg .rejilla { stroke: var(--linea); stroke-width: 1; }
.red-svg .eje { font: 10.5px var(--f-cifra); fill: var(--tinta-3); }
.red-svg .trazo { stroke-width: 1.8; stroke-linecap: round; }
.red-svg .trazo.excluida { stroke-dasharray: 4 4; stroke: var(--tinta-3) !important; }
.red-svg .tocar { stroke: transparent; stroke-width: 11; fill: transparent; }
.red-svg .visual { cursor: help; }
.red-svg .visual:hover .trazo { stroke-width: 3.2; }
.red-svg .visual.apagada { opacity: 0.1; }
.red-svg .marca-w circle { fill: var(--error); stroke: var(--panel); stroke-width: 2; }
.red-svg .marca-w text { font: 700 10px var(--f-texto); fill: var(--panel); text-anchor: middle; pointer-events: none; }
.red-svg .elipse { fill: none; stroke: var(--tinta-2); stroke-width: 1.2; pointer-events: none; }
.red-svg .punto-red { cursor: pointer; }
.red-svg .control { fill: var(--tinta); stroke: var(--panel); stroke-width: 2; }
.red-svg .nuevo { fill: var(--panel); stroke: var(--tinta); stroke-width: 1.6; }
.red-svg .nuevo.elegido { stroke: var(--acento); stroke-width: 2.6; }
.red-svg .nombre { font: 500 11px var(--f-texto); fill: var(--tinta-2); paint-order: stroke; stroke: var(--papel); stroke-width: 3px; stroke-linejoin: round; pointer-events: none; }
.red-svg .nombre.control { fill: var(--tinta); font-weight: 600; }
.red-svg .escala rect { fill: var(--panel); opacity: 0.9; stroke: var(--linea); }
.red-svg .escala line { stroke: var(--tinta); stroke-width: 1.5; }
.red-svg .escala text { font: 11px var(--f-cifra); fill: var(--tinta-2); text-anchor: middle; }
.red-svg .escala text.izq { text-anchor: start; }
.red-svg .norte path { fill: var(--tinta-2); }
.red-svg .norte text { font: 600 11px var(--f-titulo); fill: var(--tinta-2); text-anchor: middle; }
.nota-instrumento { margin: 0 16px 12px; padding: 8px 12px; border-radius: 6px; background: var(--acento-suave); font-size: 13.5px; max-width: 120ch; }
.enlace-invitacion { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 16px 12px; padding: 8px 12px; border-radius: 6px; background: var(--ok-suave); font-size: 13.5px; }
.enlace-invitacion input { flex: 1 1 380px; font: 12.5px var(--f-cifra); padding: 5px 8px; border: 1px solid var(--linea); border-radius: 5px; background: var(--panel); color: var(--tinta); min-width: 0; }
