/* ============================================================================
   ARMADURAS — la hoja (pasos-armadura.js) y sus figuras (figs-armadura.js)
   ----------------------------------------------------------------------------
   docs/armaduras.md §7.3. Prefijo ak-; solo tokens de tokens.css (se ve igual
   en claro y en oscuro). Las clases que no llevan ak- (st-, fg-, fd-, m…)
   son las de hoja.css y base.css, que no se editan. La hoja es una libreta:
   nada de tarjetas; para apartar algo, una raya de margen, un renglón fino,
   sangría y espacio.
   Colores (decisión 20 de docs/dominio.md): tinta lo dado, --real lo real
   resuelto, --virt lo unitario, --defl los desplazamientos y el marcador
   --hl lo de ahora.
   ========================================================================== */

/* ------------------------------------------------------ FIGURAS: ARMADURA */
.ak-fig { max-width: 100%; }
.ak-bar-e { stroke: var(--beam-edge); stroke-linecap: round; }
.ak-bar { stroke: var(--beam); stroke-linecap: round; }
/* el tramo que pasa sobre otra barra (cruce sin nudo) y el hueco de un corte */
.ak-bridge { stroke-linecap: butt; }
.ak-gap { stroke: var(--paper); stroke-linecap: butt; }
/* lienzo: zonas de toque, lo seleccionado (acento) y lo de ahora (marcador) */
.ak-hit { fill: transparent; stroke: none; }
.ak-lit { stroke: var(--hl); stroke-linecap: round; }
.ak-lit-n { fill: var(--hl); }
.ak-sel { stroke: var(--accent-soft); stroke-linecap: round; }
.ak-sel-a { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 1; }
.ak-sel-g .fg-parr { stroke-width: 2.6; }
.ak-mini-p { stroke-width: 1.4; }
/* la redundante de una reacción (X₁) y el 1 de su caso, en el lugar de la reacción */
.ak-fig .fg-x-h, .ak-fig .fg-unit-h { fill: var(--virt); }
.fg .ak-bub-t { font-size: 13px; }
.fg .ak-bub-2 { font-size: 10px; }
.fg .ak-tag { font-family: var(--math); font-style: italic; font-size: 13px; fill: var(--ink2); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }

/* ------------------------------------------- FIGURAS: FUERZAS EN LAS BARRAS */
.ak-f { stroke-linecap: round; opacity: .85; }
.ak-f-real { stroke: var(--real); }
.ak-f-virt { stroke: var(--virt); }
.fg .ak-fl { font-size: 12.5px; paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.fg .ak-fl-real { fill: var(--real); }
.fg .ak-fl-virt { fill: var(--virt); }
.fg .ak-fl-z { fill: var(--ink2); }
.fg .ak-fl-big { font-weight: 600; }

/* ------------------------------------------ FIGURAS: CUERPO LIBRE DE UN NUDO */
.ak-dcl-bar { stroke: var(--beam); stroke-width: 3; stroke-linecap: round; }
.ak-dcl-l { stroke: var(--ink); stroke-width: 1.6; }
.ak-dcl-h { fill: var(--ink); }
.fg .ak-dcl-t { fill: var(--ink); }
.fg .ak-dcl-a { font-family: var(--ui); font-size: 10.5px; fill: var(--ink2); }

/* ------------------------------------ FIGURAS: EL MÉTODO DE LAS SECCIONES
   La línea de corte a–a (raya y punto, como en un plano) con su letra en
   los extremos; en el cuerpo libre de la parte, el centro de momentos que
   no es un nudo de la parte (un círculo abierto con su nombre) y las líneas
   de sus barras prolongadas en punteado. Las fuerzas de las barras
   cortadas usan las flechas del cuerpo libre de un nudo (ak-dcl-).        */
.ak-cutl { fill: none; stroke: var(--ink); stroke-width: 1.6; stroke-dasharray: 11 4 2 4; stroke-linecap: butt; }
.fg .ak-cut-t { font-family: var(--math); font-style: italic; font-size: 17px; fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.ak-ext { stroke: var(--ink2); stroke-width: 1.2; stroke-dasharray: 2 3; }
.ak-mc { fill: var(--paper); stroke: var(--ink); stroke-width: 1.6; }
.fg .ak-mc-t { font-family: var(--math); font-style: italic; font-size: 14px; fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.hj-sheet.is-phone .fg .ak-cut-t { font-size: 15px; }
/* la fuerza pedida de una barra en el dibujo: «N_BC = ?»; resuelta, en --real */
.fg .ak-gb-t { fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.fg .ak-gb-t.is-solved { fill: var(--real); }

/* ------------------------------------------------------ HOJA: CADA NUDO
   Su título, su cuerpo libre a la izquierda y sus ecuaciones a la derecha;
   en una hoja angosta (el teléfono), uno debajo del otro.                  */
.ak-nudo { display: grid; grid-template-columns: max-content minmax(0, 1fr); column-gap: 20px; row-gap: 6px; align-items: start; min-width: 0; padding: 2px 0 2px 14px; border-left: 2px solid var(--sep2); }
.ak-nudo-c { grid-template-columns: minmax(0, 1fr); }
.ak-nudo-h { grid-column: 1 / -1; font-size: 12px; line-height: 18px; font-weight: 600; color: var(--ink2); }
.ak-nudo-h i, .ak-nudo-h sub { font-family: var(--math); font-weight: 400; color: var(--ink); }
.ak-nudo-h i { font-size: 1.15em; }
.ak-nudo-h .st-muted { font-weight: 400; }
.ak-nudo-f { min-width: 0; }
.ak-nudo-e { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
@container hoja (max-width: 560px) {
  .ak-nudo { grid-template-columns: minmax(0, 1fr); }
}
.ak-bt { color: var(--ink2); }
.ak-sys { overflow-x: auto; }
.ak-sys .msys-r > span { white-space: normal; }
.ak-tc { font-family: var(--ui); font-size: 13px; font-weight: 400; color: var(--ink2); }

/* ------------------------------------- HOJA: LA ECUACIÓN QUE SOBRA Y LO DEMÁS */
.ak-closing { display: flex; flex-direction: column; gap: 8px; min-width: 0; font-family: var(--math); font-size: 18px; line-height: 1.55; color: var(--ink); }
.ak-closing .mline { font-size: inherit; }
.ak-cl-t { margin-right: 8px; font-family: var(--ui); font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.ak-cl-t i, .ak-cl-t sub { font-family: var(--math); font-weight: 400; color: var(--ink); }
.ak-cl-n { padding-left: 16px; }
.ak-back { font-family: var(--math); font-size: 16.5px; line-height: 1.6; color: var(--ink); }
.ak-checks .st-check-l { font-size: 17px; line-height: 1.6; }
.ak-ck-t { margin-right: 6px; font-family: var(--ui); font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.ak-ck-t i, .ak-ck-t sub { font-family: var(--math); font-weight: 400; color: var(--ink); }
.ak-solv { margin: 0; font-family: var(--math); font-size: 16.5px; line-height: 1.8; color: var(--ink); }
.ak-sep { color: var(--ink2); }
.ak-geol { font-size: 16px; line-height: 1.6; overflow-x: auto; }
.hj-sheet .ak-aug { font-size: 15px; }
.ak-aug .mm-g { gap: 6px 12px; }

/* ----------------------------------------------------------- HOJA: TABLAS */
.ak-tab { font-family: var(--math); font-size: 15px; color: var(--ink); }
.ak-tab th, .ak-tab td { white-space: nowrap; }
.ak-tab thead th { font-family: var(--ui); font-size: 12px; font-weight: 600; color: var(--ink2); vertical-align: bottom; }
.ak-tab thead th i, .ak-tab thead th sub { font-family: var(--math); font-weight: 400; color: var(--ink); }
.ak-tab thead th i { font-size: 1.12em; }
.ak-tab tbody th { font-weight: 400; }
.ak-ntab td.ak-num, .ak-stab td.ak-num, .ak-ptab td, .ak-vtab td, .ak-ftab td { text-align: right; }
.ak-tcl { font-family: var(--ui); font-size: 13px; font-weight: 600; }
.ak-tab tr.ak-sum > * { border-top: 1px solid var(--ink2); font-weight: 600; }
.ak-stab td.ak-sup { white-space: normal; min-width: 180px; }
.ak-stab td.ak-num .ak-tcl { margin-left: 4px; }
/* el sistema: la matriz aumentada [A | b], ancha; se desplaza en su caja */
.ak-mat { font-size: 13px; }
.ak-mat th, .ak-mat td { padding: 4px 10px 4px 0; text-align: right; }
.ak-mat tbody th { text-align: left; font-family: var(--ui); font-size: 12px; color: var(--ink2); }
.ak-mat tbody th i { font-family: var(--math); font-size: 14px; color: var(--ink); }
.ak-mat td.ak-z { color: var(--ink2); }
.ak-mat .ak-b { padding-left: 10px; border-left: 1px solid var(--ink2); }

/* ------------------------------------------------------------- TELÉFONO */
.hj-sheet.is-phone .ak-nudo { grid-template-columns: minmax(0, 1fr); padding-left: 10px; }
.hj-sheet.is-phone .ak-closing { font-size: 16px; }
.hj-sheet.is-phone .ak-cl-n { padding-left: 8px; }
.hj-sheet.is-phone .ak-back { font-size: 15.5px; }
.hj-sheet.is-phone .ak-checks .st-check-l { font-size: 15.5px; }
.hj-sheet.is-phone .ak-tab { font-size: 14px; }
.hj-sheet.is-phone .ak-mat { font-size: 12px; }
.hj-sheet.is-phone .ak-stab td.ak-sup { min-width: 150px; }
.hj-sheet.is-phone .ak-solv { font-size: 15.5px; }